:root{--bg: #EDEAE4;--surface: #FFFFFF;--surfaceAlt: #F5F3EE;--text: #1A1A1F;--soft: #5C5C68;--muted: #93939E;--border: #D6D4CF;--borderLight: #E8E6E1;--accent: #5046E5;--accentHover: #3F38CC;--accentDim: #EEEDFC;--success: #16A34A;--successDim: #ECFCE5;--danger: #DC2626;--dangerDim: #FEF2F2;--gold: #D97706;--goldDim: #FEF7E6;--pad: 28px;--gap-sm: 8px;--gap: 14px;--gap-lg: 24px;--radius-sm: 10px;--radius: 12px;--radius-lg: 16px;--radius-xl: 20px}[data-accent=teal]{--accent: #0891B2;--accentHover: #0E7490;--accentDim: #E0F7FB}[data-accent=emerald]{--accent: #059669;--accentHover: #047857;--accentDim: #DCFCE7}[data-accent=amber]{--accent: #D97706;--accentHover: #B45309;--accentDim: #FEF3C7}[data-accent=rose]{--accent: #E11D48;--accentHover: #BE123C;--accentDim: #FEE2E2}[data-density=compact]{--pad: 20px;--gap-lg: 18px;--gap: 10px}[data-theme=dark]{--bg: #14141A;--surface: #1E1E26;--surfaceAlt: #24242E;--text: #F5F5F7;--soft: #A8A8B4;--muted: #6D6D7A;--border: #2E2E3A;--borderLight: #26262F;--accentDim: #2A2170;--successDim: #0F3A22;--dangerDim: #3A0F0F;--goldDim: #3A280F}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Urbanist,ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased}body{min-height:100vh;overflow-x:hidden}button{font-family:inherit}.app-stage{position:relative;width:100%;max-width:640px;margin:0 auto;min-height:100vh;padding:24px var(--pad);z-index:1}.bg-deco{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:0;overflow:hidden}.bg-deco .c{position:absolute;border-radius:50%}.bg-deco .c1{top:-60px;right:-40px;width:260px;height:260px;background:color-mix(in oklab,var(--accent) 6%,transparent)}.bg-deco .c2{bottom:-80px;left:-80px;width:320px;height:320px;background:color-mix(in oklab,var(--success) 5%,transparent)}.bg-deco .c3{top:45%;right:-60px;width:200px;height:200px;background:color-mix(in oklab,var(--gold) 4%,transparent)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px}.confetti{position:fixed;top:0;left:0;right:0;bottom:0;pointer-events:none;z-index:1000;overflow:hidden}.confetti span{position:absolute;top:-10px;width:8px;height:14px;border-radius:2px;animation:conf-fall linear forwards}@keyframes conf-fall{0%{transform:translateY(-20px) rotate(0);opacity:1}to{transform:translateY(110vh) rotate(720deg);opacity:.8}}.haptic-tap{transition:transform .12s cubic-bezier(.2,.9,.4,1.2)}.haptic-tap:active{transform:scale(.96)}.screen-enter{animation:screenIn .28s cubic-bezier(.2,.7,.3,1) forwards}@keyframes screenIn{0%{transform:translateY(8px)}to{transform:none}}.tweaks-panel{position:fixed;right:16px;bottom:16px;z-index:2000;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:14px;width:260px;box-shadow:0 20px 40px -20px #00000026;font-size:13px}.tweaks-panel h4{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 10px;font-weight:700}.tweaks-panel .row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.tweaks-panel .row:last-child{margin-bottom:0}.tweaks-panel label{color:var(--soft);font-weight:600;font-size:12px}.tweaks-panel select,.tweaks-panel button.chip{font-family:inherit;font-size:12px;font-weight:700;background:var(--surfaceAlt);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:6px 10px}.tweaks-panel .swatches{display:flex;gap:6px}.tweaks-panel .sw{width:22px;height:22px;border-radius:6px;border:2px solid transparent;cursor:pointer}.tweaks-panel .sw.active{border-color:var(--text)}.tweaks-panel .toggle{width:36px;height:20px;background:var(--borderLight);border-radius:99px;position:relative;cursor:pointer;border:none;padding:0}.tweaks-panel .toggle:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;background:var(--surface);border-radius:50%;transition:transform .18s ease;box-shadow:0 1px 3px #0003}.tweaks-panel .toggle[data-on=true]{background:var(--accent)}.tweaks-panel .toggle[data-on=true]:after{transform:translate(16px)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
