.melody-game.svelte-1m758a3{display:flex;flex-direction:column;flex:1;overflow:hidden}.game-screen.svelte-1m758a3{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;flex:1;padding:20px;width:100%;animation:screenFadeIn .3s ease-out}.melody-screen.svelte-1m758a3{background:radial-gradient(ellipse 70% 50% at 50% 45%,rgba(168,85,247,.08) 0%,transparent 75%),radial-gradient(ellipse 40% 30% at 50% 50%,rgba(124,58,237,.05) 0%,transparent 80%);position:relative}.apex-hint.svelte-1m758a3{font-family:Syne,var(--font-primary);font-size:12px;font-weight:800;letter-spacing:2.5px;text-transform:uppercase;text-align:center;padding:5px 14px;border-radius:999px;background:linear-gradient(135deg,#facc1524,#f59e0b1a);border:1px solid rgba(250,204,21,.4);color:#fbbf24;text-shadow:0 0 10px rgba(250,204,21,.4);animation:screenFadeIn .3s ease-out;margin:0 auto 8px;width:fit-content;align-self:center;position:relative;z-index:2}.melody-screen.svelte-1m758a3:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 50%,rgba(168,85,247,.04) 0%,transparent 60%);animation:svelte-1m758a3-melodyBreathe 6s ease-in-out infinite;will-change:opacity}@keyframes svelte-1m758a3-melodyBreathe{0%,to{opacity:.4}50%{opacity:.9}}.game-header.svelte-1m758a3{display:flex;flex-direction:column;align-items:center;gap:4px}.round-indicator.svelte-1m758a3{font-size:var(--text-caption);font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:1.5px}.phase-label.svelte-1m758a3{font-family:"Syne",var(--font-primary);font-size:18px;font-weight:700;letter-spacing:1px;text-transform:uppercase}.countin.svelte-1m758a3{color:#fbbf24;font-size:38px;line-height:1;text-shadow:0 0 18px rgba(251,191,36,.55);animation:svelte-1m758a3-countInPop .4s var(--ease-spring)}.listening.svelte-1m758a3{color:#c4b5fd;text-shadow:0 0 14px rgba(168,85,247,.55);animation:svelte-1m758a3-listenPulse 1.6s ease-in-out infinite}.placing.svelte-1m758a3{color:var(--text-secondary)}.revealing.svelte-1m758a3{color:#a855f7;animation:pulse 1.5s ease-in-out infinite}@keyframes svelte-1m758a3-countInPop{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.18);opacity:1}to{transform:scale(1);opacity:1}}@keyframes svelte-1m758a3-listenPulse{0%,to{opacity:.85;letter-spacing:1px}50%{opacity:1;letter-spacing:2.4px}}.grid-wrap.svelte-1m758a3{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto 1fr auto;gap:4px 10px;width:100%;max-width:min(560px,100%);padding:4px}.row-labels.svelte-1m758a3{grid-row:2;grid-column:1;display:grid;grid-template-rows:repeat(var(--rows),1fr);gap:5px;padding:6px 0;min-width:30px}.row-label.svelte-1m758a3{display:flex;align-items:center;justify-content:flex-end;gap:6px;font-family:var(--font-mono, var(--font-primary));font-size:11px;font-weight:700;color:var(--text-muted);letter-spacing:.5px;opacity:.7;transition:opacity .2s ease}.row-dot.svelte-1m758a3{width:var(--dot-size);height:var(--dot-size);border-radius:50%;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--label-color) 100%,white 35%) 0%,var(--label-color) 65%,color-mix(in srgb,var(--label-color) 70%,#1a1430) 100%);box-shadow:0 0 6px color-mix(in srgb,var(--label-color) 60%,transparent);flex-shrink:0}.row-num.svelte-1m758a3{min-width:8px;text-align:right;font-variant-numeric:tabular-nums}.grid.svelte-1m758a3{grid-row:2;grid-column:2}.beat-row.svelte-1m758a3{grid-column:2}.beat-row-top.svelte-1m758a3{grid-row:1}.beat-row.svelte-1m758a3:not(.beat-row-top){grid-row:3}.grid.svelte-1m758a3{position:relative;display:grid;grid-template-columns:repeat(var(--cols),1fr);grid-template-rows:repeat(var(--rows),1fr);gap:5px;width:100%;aspect-ratio:var(--cols) / var(--rows);max-height:280px;padding:6px;border-radius:14px;background:linear-gradient(180deg,#a855f70a,#7c3aed05);box-shadow:inset 0 1px #ffffff0a,inset 0 0 0 1px #a855f71a,0 8px 32px #00000040}.cell.svelte-1m758a3{position:relative;border-radius:8px;border:1px solid rgba(168,85,247,.1);background:linear-gradient(180deg,#ffffff06,#fff0 50%),#a855f709;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .18s ease,border-color .18s ease,transform .12s var(--ease-spring),box-shadow .2s ease;overflow:visible;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px)}.cell.svelte-1m758a3:not(:disabled):hover{background:linear-gradient(180deg,#ffffff0f,#fff0 50%),#a855f71a;border-color:#a855f752;transform:translateY(-1px)}.cell.svelte-1m758a3:not(:disabled):active{transform:scale(.9)}.cell.svelte-1m758a3:disabled{cursor:default}.cell.active-col.svelte-1m758a3{border-color:#a855f766;background:linear-gradient(180deg,#a855f71a,#a855f70a),#a855f70a}.cell.burst-col.svelte-1m758a3{animation:svelte-1m758a3-burstRipple .45s ease-out}@keyframes svelte-1m758a3-burstRipple{0%{box-shadow:inset 0 0 0 1px #a855f799,0 0 #a855f780}60%{box-shadow:inset 0 0 0 1px #a855f799,0 0 18px 4px #a855f759}to{box-shadow:inset 0 0 0 1px #a855f773,0 0 #a855f700}}.cell.svelte-1m758a3 .dot:where(.svelte-1m758a3){position:absolute;inset:16%;border-radius:50%;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--row-color) 100%,white 40%) 0%,var(--row-color) 60%,color-mix(in srgb,var(--row-color) 60%,#1a1430) 100%);box-shadow:0 0 12px color-mix(in srgb,var(--row-color) 60%,transparent),0 0 4px var(--row-color),inset 0 1px #fff3;transition:background .18s ease,box-shadow .25s ease,transform .2s var(--ease-spring);animation:svelte-1m758a3-dotIn .32s var(--ease-spring)}@keyframes svelte-1m758a3-dotIn{0%{transform:scale(0) rotate(-12deg);opacity:0}55%{transform:scale(1.25) rotate(2deg);opacity:1}to{transform:scale(1) rotate(0);opacity:1}}.cell.svelte-1m758a3 .halo:where(.svelte-1m758a3){position:absolute;inset:-10%;border-radius:50%;background:radial-gradient(circle,rgba(34,197,94,.4) 0%,transparent 60%);pointer-events:none;animation:svelte-1m758a3-haloFlare .7s ease-out}@keyframes svelte-1m758a3-haloFlare{0%{opacity:0;transform:scale(.6)}40%{opacity:1;transform:scale(1.2)}to{opacity:.5;transform:scale(1)}}.cell.state-user.svelte-1m758a3{background:#a855f72e;border-color:#a855f773}.cell.state-exact.svelte-1m758a3{background:#22c55e2e;border-color:#22c55eb3;box-shadow:0 0 14px #22c55e59}.cell.state-exact.svelte-1m758a3 .dot:where(.svelte-1m758a3){background:#22c55e;box-shadow:0 0 14px #22c55eb3}.cell.state-close.svelte-1m758a3{background:#fbbf242e;border-color:#fbbf24b3;box-shadow:0 0 12px #fbbf244d}.cell.state-close.svelte-1m758a3 .dot:where(.svelte-1m758a3){background:#fbbf24;box-shadow:0 0 10px #fbbf2499}.cell.state-wrong.svelte-1m758a3{background:#f43f5e26;border-color:#f43f5e99}.cell.state-wrong.svelte-1m758a3 .dot:where(.svelte-1m758a3){background:#f43f5e;box-shadow:0 0 8px #f43f5e80}.cell.state-missed.svelte-1m758a3{background:#a855f70f;border:1.5px dashed rgba(168,85,247,.55)}.cell.state-missed.svelte-1m758a3 .dot:where(.svelte-1m758a3){background:transparent;border:2px solid rgba(168,85,247,.7);box-shadow:none}.beat-row.svelte-1m758a3{display:grid;grid-template-columns:repeat(var(--cols),1fr);gap:5px;padding:0 6px;min-height:8px}.beat-tick.svelte-1m758a3{height:4px;border-radius:3px;background:linear-gradient(90deg,#a855f71f,#a855f72e,#a855f71f);transition:background .14s ease,transform .18s var(--ease-spring),box-shadow .2s ease;transform-origin:center}.beat-tick.active.svelte-1m758a3{background:linear-gradient(90deg,#c4b5fd,#a855f7,#c4b5fd);transform:scaleY(2.2);box-shadow:0 0 14px #a855f7e6,0 0 4px #fff}.top-tick.svelte-1m758a3{transform-origin:center bottom}.top-tick.active.svelte-1m758a3{transform:scaleY(2.2);box-shadow:0 4px 14px #a855f7e6,0 2px 4px #fff}.beat-row.svelte-1m758a3:not(.beat-row-top) .beat-tick:where(.svelte-1m758a3){transform-origin:center top}.action-bar.svelte-1m758a3{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;width:100%;max-width:480px}.action.svelte-1m758a3{display:inline-flex;align-items:center;gap:6px;padding:10px 16px;border-radius:999px;font-family:inherit;font-size:14px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;-webkit-tap-highlight-color:transparent;border:1px solid rgba(168,85,247,.3);background:#a855f714;color:var(--text-primary);transition:background .15s ease,border-color .15s ease,transform .12s var(--ease-spring),opacity .15s ease}.action.svelte-1m758a3:not(:disabled):hover{background:#a855f72e;border-color:#a855f78c;transform:translateY(-1px)}.action.svelte-1m758a3:not(:disabled):active{transform:translateY(0) scale(.97)}.action.svelte-1m758a3:disabled{opacity:.45;cursor:default}.action.svelte-1m758a3 svg:where(.svelte-1m758a3){flex-shrink:0}.action.submit.svelte-1m758a3{background:linear-gradient(135deg,#a855f759,#a855f72e);border-color:#a855f7b3;color:#fff}.action.submit.svelte-1m758a3:not(:disabled):hover{background:linear-gradient(135deg,#a855f780,#a855f747);box-shadow:0 4px 18px #a855f759}.action.replay.svelte-1m758a3 .penalty:where(.svelte-1m758a3){font-size:12px;opacity:.85;margin-left:2px;color:#fbbf24}.action.replay.used.svelte-1m758a3,.action.replay.svelte-1m758a3:disabled{text-decoration:line-through;text-decoration-color:#f43f5e80}.hint.svelte-1m758a3{font-size:var(--text-caption);color:var(--text-muted);letter-spacing:.4px;text-align:center}.reveal-legend.svelte-1m758a3{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.6px;font-weight:600}.legend-item.svelte-1m758a3{display:inline-flex;align-items:center;gap:5px}.swatch.svelte-1m758a3{width:10px;height:10px;border-radius:50%;display:inline-block}.swatch-exact.svelte-1m758a3{background:#22c55e;box-shadow:0 0 6px #22c55eb3}.swatch-close.svelte-1m758a3{background:#fbbf24;box-shadow:0 0 6px #fbbf2499}.swatch-wrong.svelte-1m758a3{background:#f43f5e}.swatch-missed.svelte-1m758a3{background:transparent;border:2px solid rgba(168,85,247,.7)}.round-result.svelte-1m758a3{justify-content:center;gap:16px}.round-detail.svelte-1m758a3{font-size:var(--text-body);color:var(--text-secondary);text-align:center;animation:descFadeIn .3s ease-out}.replay-note.svelte-1m758a3{display:inline-block;margin-top:4px;font-size:12px;color:#fbbf24;letter-spacing:.5px;text-transform:uppercase;font-weight:700}.round-score-display.svelte-1m758a3{display:flex;align-items:baseline;gap:6px}.round-score-value.svelte-1m758a3{font-family:var(--font-mono, var(--font-primary));font-size:56px;font-weight:700;letter-spacing:-2px;animation:numSlideIn .35s var(--ease-smooth)}.round-score-max.svelte-1m758a3{font-size:var(--text-body-lg);color:var(--text-tertiary)}.round-rating.svelte-1m758a3{font-family:Syne,var(--font-primary);font-size:22px;font-weight:800;letter-spacing:2px;text-transform:uppercase;text-align:center;animation:screenFadeIn .3s ease-out}.near-miss.svelte-1m758a3{display:block;font-size:13px;font-weight:600;letter-spacing:1px;opacity:.6;margin-top:4px}.challenge-section.svelte-1m758a3{display:flex;flex-direction:column;align-items:center;gap:12px;padding:24px;width:100%}.challenge-prompt.svelte-1m758a3{font-size:var(--text-caption);color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;font-weight:600}@media(max-width:480px){.grid-wrap.svelte-1m758a3{max-width:100%;padding:2px;gap:4px 6px}.grid.svelte-1m758a3{gap:3px;max-height:240px}.cell.svelte-1m758a3{border-radius:6px}.action.svelte-1m758a3{padding:9px 12px;font-size:13px}.row-labels.svelte-1m758a3{min-width:22px;gap:3px;padding:4px 0}.row-label.svelte-1m758a3{font-size:10px;gap:3px}}