@import "https://fonts.googleapis.com/css2?family=Outfit:wght@500;600;700;800&family=Inter:wght@400;500;600;700&display=swap";html,body,#root{width:100%;height:100%;margin:0;padding:0}*{-webkit-tap-highlight-color:transparent}:root{--bg-deep:#0b0b1f;--bg-mid:#191341;--bg-glow:#2c1b5e;--surface:#ffffff0d;--surface-border:#ffffff17;--surface-strong:#ffffff14;--text-primary:#f5f5fa;--text-muted:#9c99b8;--accent-gold:#f5b942;--accent-gold-dim:#f5b94233;--success:#2ed573;--danger:#ff4d6d;--c-ruby:#ff4d6d;--c-sapphire:#4d7fff;--c-emerald:#2ed573;--c-amber:#ffc947;--c-amethyst:#b455f0;--c-tangerine:#ff8a3d;--font-display:"Outfit", "Segoe UI", sans-serif;--font-body:"Inter", "Segoe UI", sans-serif}*{box-sizing:border-box}body{font-family:var(--font-body);color:var(--text-primary);background:radial-gradient(circle at 20% 15%, var(--bg-glow) 0%, transparent 45%), radial-gradient(circle at 85% 80%, #3a1f66 0%, transparent 50%), linear-gradient(160deg, var(--bg-deep), var(--bg-mid));min-height:100vh;margin:0}.app{justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.card,.game-container{background:var(--surface);border:1px solid var(--surface-border);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);text-align:center;border-radius:28px;width:100%;max-width:480px;padding:48px 40px;animation:.5s cubic-bezier(.22,1,.36,1) rise;box-shadow:0 30px 60px #00000073,inset 0 1px #ffffff0f}@keyframes rise{0%{opacity:0;transform:translateY(18px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.brand-eyebrow{font-family:var(--font-body);letter-spacing:3px;text-transform:uppercase;color:var(--accent-gold);margin-bottom:14px;font-size:12px;font-weight:600;display:inline-block}.card h1,.game-container h1{font-family:var(--font-display);letter-spacing:-.5px;margin:0 0 12px;font-size:30px;font-weight:700}.card p{color:var(--text-muted);margin:0 0 30px;font-size:15px;line-height:1.6}.rules-list{text-align:left;flex-direction:column;gap:12px;margin:0 0 32px;padding:0;list-style:none;display:flex}.rules-list li{color:var(--text-muted);background:var(--surface-strong);border:1px solid var(--surface-border);border-radius:14px;align-items:center;gap:12px;padding:12px 16px;font-size:14px;display:flex}.rules-list .step-num{background:var(--accent-gold-dim);width:26px;height:26px;color:var(--accent-gold);font-family:var(--font-display);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:12px;font-weight:700;display:flex}button{font-family:var(--font-body);cursor:pointer;border:none}.btn-primary{background:linear-gradient(135deg, var(--accent-gold), #e0952a);color:#241505;border-radius:999px;padding:16px 38px;font-size:16px;font-weight:700;transition:transform .2s,box-shadow .2s;box-shadow:0 12px 30px #f5b94259}.btn-primary:hover{transform:translateY(-2px)scale(1.03);box-shadow:0 16px 36px #f5b94273}.btn-primary:active{transform:translateY(0)scale(.98)}.game-container{max-width:460px}.game-container h1{margin-bottom:24px;font-size:22px}.status-badge{font-family:var(--font-display);letter-spacing:.5px;border-radius:999px;align-items:center;gap:8px;margin-bottom:22px;padding:8px 18px;font-size:13px;font-weight:600;transition:all .25s;display:inline-flex}.status-badge.showing{color:#7ea2ff;background:#4d7fff26;border:1px solid #4d7fff4d}.status-badge.input{color:#6be89a;background:#2ed57326;border:1px solid #2ed5734d}.status-dot{background:currentColor;border-radius:50%;width:8px;height:8px;animation:1.1s ease-in-out infinite pulse-dot}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.75)}}.score-box{justify-content:space-between;gap:10px;margin:0 0 26px;display:flex}.score-item{background:var(--surface-strong);border:1px solid var(--surface-border);border-radius:16px;flex:1;padding:14px 8px}.score-item .score-label{letter-spacing:1px;text-transform:uppercase;color:var(--text-muted);margin-bottom:6px;font-size:11px;display:block}.score-item .score-value{font-family:var(--font-display);margin:0;font-size:24px;font-weight:700}.score-item.best .score-value{color:var(--accent-gold)}.progress-track{flex-wrap:wrap;justify-content:center;gap:6px;margin-bottom:26px;display:flex}.progress-dot{background:var(--surface-border);border-radius:50%;width:9px;height:9px;transition:all .2s}.progress-dot.filled{background:var(--accent-gold);box-shadow:0 0 8px var(--accent-gold)}.progress-dot.current{animation:.9s ease-in-out infinite pulse-dot}.board{grid-template-columns:repeat(3,96px);justify-content:center;gap:18px;margin:0 auto 26px;display:grid}.color{filter:brightness(.62)saturate(.85);border-radius:20px;height:96px;transition:transform .15s,filter .15s,box-shadow .15s;position:relative;box-shadow:inset 0 0 0 1px #ffffff14}.color:not(:disabled):hover{filter:brightness(.8)saturate();transform:translateY(-3px)}.color:not(:disabled):active{transform:translateY(0)scale(.96)}.color:disabled{cursor:not-allowed}.color.active{filter:brightness(1.15)saturate(1.3);box-shadow:0 0 0 4px #ffffff2e, 0 0 34px 6px var(--glow-color,#ffffff80);transform:scale(1.06)}.color.correct{filter:brightness(1.1)saturate(1.2);box-shadow:0 0 0 4px #2ed5738c,0 0 28px #2ed57380}.color.wrong{animation:.4s shake;box-shadow:0 0 0 4px #ff4d6d99,0 0 28px #ff4d6d8c}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.instruction{color:var(--text-muted);margin:0;font-size:13.5px}.result-icon{margin-bottom:6px;font-size:40px}.new-record{font-family:var(--font-display);letter-spacing:1px;color:#241505;background:var(--accent-gold);border-radius:999px;margin:4px 0 20px;padding:6px 14px;font-size:12px;font-weight:700;display:inline-block}.result-stats{gap:12px;margin-bottom:30px;display:flex}@media (width<=480px){.card,.game-container{border-radius:22px;padding:32px 22px}.board{grid-template-columns:repeat(3,78px);gap:14px}.color{border-radius:16px;height:78px}.card h1,.game-container h1{font-size:24px}.score-item .score-value{font-size:19px}}