:root{color-scheme:dark;--bg: #0b0b12;--bg-elevated: #14141e;--card-bg: #1a1a26;--card-border: #2a2a3a;--text: #f5f5fa;--text-muted: #a3a3b8;--radius-lg: 24px;--radius-md: 16px;--radius-sm: 10px;--rainbow: linear-gradient( 90deg, #e40303, #ff8c00, #ffed00, #008026, #004dff, #750787 );font-family:Segoe UI,Helvetica Neue,system-ui,-apple-system,sans-serif;line-height:1.5;font-weight:400}*{box-sizing:border-box}html,body{margin:0;padding:0}body{min-height:100vh;background:radial-gradient(circle at 15% 0%,rgba(117,7,135,.35),transparent 45%),radial-gradient(circle at 85% 10%,rgba(0,77,255,.3),transparent 45%),var(--bg);color:var(--text)}#root{min-height:100vh}h1,h2,h3,p{margin:0}button{font-family:inherit}input[type=range]{accent-color:#ff8c00}.app-shell{max-width:560px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;padding:0 20px}.app-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 0 8px;flex-wrap:wrap}.brand{display:flex;align-items:center;gap:8px;background:none;border:none;color:var(--text);cursor:pointer;padding:4px 0}.brand-emoji{font-size:1.6rem}.brand-name{font-size:1.3rem;font-weight:700;letter-spacing:-.02em}.step-indicator{display:flex;gap:8px;list-style:none;margin:0;padding:0;font-size:.82rem}.step-indicator li{padding:6px 12px;border-radius:999px;background:var(--card-bg);color:var(--text-muted);border:1px solid var(--card-border)}.step-indicator li.active{color:var(--text);border-color:transparent;background:var(--rainbow);font-weight:600}.step-indicator li.done{color:var(--text)}.app-main{flex:1;padding:12px 0 40px}.error-banner{background:#d6290026;border:1px solid #d62900;color:#ff9b8a;padding:12px 16px;border-radius:var(--radius-sm);margin-bottom:20px;font-size:.9rem}.app-footer{text-align:center;padding:16px 0 28px;color:var(--text-muted);font-size:.8rem}.btn{border:none;border-radius:999px;cursor:pointer;font-weight:600;transition:transform .15s ease,box-shadow .15s ease,opacity .15s ease}.btn:active{transform:scale(.97)}.btn-primary{background:var(--rainbow);color:#0b0b12;padding:14px 28px;font-size:1.05rem;box-shadow:0 8px 24px #75078759}.btn-large{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:10px}.btn-ghost{background:var(--card-bg);color:var(--text);border:1px solid var(--card-border);padding:12px 20px}.btn-round{width:40px;height:40px;min-width:40px;background:var(--card-bg);color:var(--text);border:1px solid var(--card-border);font-size:1.3rem;display:flex;align-items:center;justify-content:center}.btn-support{background:linear-gradient(90deg,#ffb703,#fb8500);color:#1a1200;padding:12px 26px;font-size:1rem;display:inline-flex;align-items:center;gap:8px}.home-screen{display:flex;flex-direction:column;gap:36px}.hero{text-align:center;display:flex;flex-direction:column;align-items:center;gap:18px;padding-top:8px}.hero h1{font-size:clamp(2rem,7vw,2.6rem);font-weight:800;letter-spacing:-.03em;background:var(--rainbow);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-subtitle{font-size:1.1rem;color:var(--text-muted);margin-top:-10px}.privacy-note{display:flex;align-items:flex-start;gap:12px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-md);padding:14px 18px;text-align:left;max-width:420px}.privacy-note span[aria-hidden]{font-size:1.4rem}.privacy-note div{display:flex;flex-direction:column;gap:2px;font-size:.9rem}.privacy-note strong{color:var(--text)}.privacy-note div span:last-child{color:var(--text-muted)}.dropzone{width:100%;max-width:420px;border:2px dashed var(--card-border);border-radius:var(--radius-lg);padding:28px 20px;display:flex;flex-direction:column;align-items:center;gap:10px;transition:border-color .15s ease,background-color .15s ease}.dropzone-active{border-color:#ff8c00;background:#ff8c0014}.dropzone-hint{color:var(--text-muted);font-size:.85rem}.style-preview h2,.style-picker h2,.support-panel h2{font-size:1.15rem;font-weight:700}.section-hint{color:var(--text-muted);font-size:.85rem;margin-top:4px}.swatch-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:12px;margin-top:16px}.swatch-card{display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-md);padding:12px 8px;cursor:pointer;color:var(--text);position:relative}.swatch-card-active{border-color:#ff8c00;box-shadow:0 0 0 1px #ff8c00}.swatch-emoji{font-size:1.1rem;margin-top:2px}.swatch-name{font-size:.72rem;color:var(--text-muted);text-align:center}.pride-ring-swatch{display:inline-block;border-radius:50%;flex-shrink:0}.edit-screen{display:flex;flex-direction:column;gap:28px}.editor-preview{display:flex;flex-direction:column;align-items:center;gap:12px}.avatar-canvas{width:min(70vw,300px);height:min(70vw,300px);border-radius:50%}.avatar-canvas-result{width:min(70vw,260px);height:min(70vw,260px)}.drag-hint{color:var(--text-muted);font-size:.8rem}.zoom-controls{display:flex;align-items:center;gap:12px;width:100%;max-width:320px}.zoom-controls input[type=range]{flex:1}.crop-hint{color:var(--text-muted);font-size:.8rem;text-align:center;max-width:340px}.style-list{display:flex;flex-direction:column;gap:8px;margin-top:12px}.style-row{display:flex;align-items:center;gap:12px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-md);padding:10px 14px;cursor:pointer;color:var(--text);text-align:left}.style-row-active{border-color:#ff8c00;box-shadow:0 0 0 1px #ff8c00;background:var(--bg-elevated)}.style-row-label{font-size:.95rem;font-weight:500}.edit-actions{display:flex;gap:12px}.edit-actions .btn-primary{flex:1}.result-screen{display:flex;flex-direction:column;align-items:center;gap:24px;text-align:center}.result-preview{display:flex;flex-direction:column;align-items:center;gap:14px;width:100%}.result-caption{font-size:1.1rem;font-weight:600}.result-preview .btn-primary{max-width:280px}.thank-you{color:#ffd166;font-size:.9rem;max-width:340px}.divider{width:100%;border:none;border-top:1px solid var(--card-border)}.support-panel{display:flex;flex-direction:column;align-items:center;gap:14px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-lg);padding:24px 20px;width:100%}.support-panel p{color:var(--text-muted)}.amount-picker{display:flex;gap:10px}.amount-btn{background:var(--bg-elevated);border:1px solid var(--card-border);color:var(--text);padding:10px 20px;border-radius:999px;cursor:pointer;font-weight:600}.amount-btn-active{border-color:#ffb703;background:#ffb70326;color:#ffd166}.result-actions{display:flex;gap:12px}@media (min-width: 640px){.app-shell{padding:0 32px}}