:root{--bg: #0d0e10;--bg-lift: #131418;--surface: #17181d;--surface-hover: #1e2026;--surface-solid: #1b1c21;--surface-raised: #22242a;--line: #2a2c33;--line-strong: #3b3e47;--text: #f2f2f4;--muted: #9a9da7;--dim: #676a75;--green: #1fc45e;--green-bright: #35d873;--green-soft: rgba(31, 196, 94, .12);--button-light: #e9eaee;--button-light-hover: #f6f7f9;--button-light-text: #14151a;--amber: #e3b341;--red: #ef6b7f;--red-soft: rgba(239, 107, 127, .1);--green-soft-text: #c7f5d8;--red-soft-text: #ffb9c5;--bar-done: #4a4e59;--on-green: #ffffff;--radius-sm: 8px;--radius: 12px;--radius-lg: 16px;--ease: cubic-bezier(.22, 1, .36, 1);--ease-spring: cubic-bezier(.34, 1.4, .64, 1);--font: "Inter", "Segoe UI Variable Display", "Segoe UI", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;--space-1: clamp(4px, .5vh, 6px);--space-2: clamp(6px, .9vh, 10px);--space-3: clamp(10px, 1.4vh, 16px);--space-4: clamp(13px, 2vh, 22px);--space-5: clamp(16px, 2.8vh, 30px);--control-h: clamp(46px, 6vh, 56px);--control-h-sm: clamp(40px, 5vh, 44px);--row-h: clamp(38px, 5.6vh, 54px);--play-size: clamp(62px, 9.5vh, 92px);--ladder-bar: clamp(6px, 1vh, 9px);--code-size: clamp(30px, 5vh + 2vw, 58px);--text-display: clamp(30px, 3.4vw + 3.4vh, 76px);--text-title: clamp(21px, 1.6vw + 1.6vh, 34px);--text-body: clamp(13.5px, .35vw + 1.05vh, 15.5px);--text-small: clamp(11.5px, .3vw + .85vh, 13px);--text-label: clamp(10px, .9vh, 11px);--gutter: clamp(14px, 2vw, 20px);--shell-max: 760px}*,*:before,*:after{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow:hidden;overscroll-behavior-y:none}button,input,select{font:inherit;color:inherit}button{cursor:pointer;border:none;background:none}[hidden]{display:none!important}:focus-visible{outline:2px solid var(--text);outline-offset:2px;border-radius:8px}::selection{background:var(--green);color:#05130a}#app{position:relative;z-index:1;height:100dvh;display:flex;flex-direction:column;overflow:hidden}.shell{width:100%;max-width:var(--shell-max);margin-inline:auto;padding-inline:var(--gutter)}.topbar{flex:none;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-3) 0}.brand{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);white-space:nowrap}.brand svg{flex:none;color:var(--green)}.topbar-actions{display:flex;align-items:center;gap:10px}.chip{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--muted);font-size:12px;font-weight:600;transition:border-color .18s,color .18s,background .18s}.chip:hover:not(:disabled){border-color:var(--line-strong);color:var(--text);background:var(--surface-hover)}.chip:disabled{cursor:default;opacity:.6}.chip svg{flex:none;opacity:.75}.chip.is-busy svg{animation:spin .9s linear infinite}.chip.is-updated{border-color:#35d87380;color:var(--green-bright)}.chip-text{font-variant-numeric:tabular-nums}@keyframes spin{to{transform:rotate(360deg)}}.mono{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--control-h);padding:0 var(--space-4);border-radius:var(--radius);border:1px solid transparent;font-size:var(--text-body);font-weight:650;letter-spacing:.01em;transition:transform .15s var(--ease),background .18s,border-color .18s,color .18s}.btn:active{transform:scale(.985)}.btn-primary{background:var(--green);color:#05130a}.btn-primary:hover{background:var(--green-bright)}.btn:disabled{cursor:default;opacity:.55}.btn-ghost{border-color:var(--line);background:var(--surface);color:var(--text)}.btn-ghost:hover{border-color:var(--line-strong);background:var(--surface-hover)}.screen{flex:1;min-height:0;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;padding-bottom:env(safe-area-inset-bottom);animation:screen-in .24s var(--ease) both}.screen>.shell{margin-block:auto}.round>.shell,.mp-game>.shell{margin-block:0;flex:1;min-height:0;display:flex;flex-direction:column}@keyframes screen-in{0%{opacity:0;transform:translateY(6px)}}.text-input,.select{width:100%;min-height:var(--control-h-sm);padding:0 var(--space-3);border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);color:var(--text);font-size:var(--text-body);transition:border-color .18s,background .18s}.select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 18px) calc(50% + 1px),calc(100% - 13px) calc(50% + 1px);background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:36px}.text-input::placeholder{color:var(--dim)}.text-input:hover:not(:disabled),.select:hover:not(:disabled){border-color:var(--line-strong)}.text-input:focus,.select:focus{outline:none;border-color:var(--green);background:var(--surface-hover)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}.home{padding-bottom:max(3vh,env(safe-area-inset-bottom))}.home-main{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);width:100%}.home-title{margin:0;font-size:var(--text-display);font-weight:800;letter-spacing:-.045em;line-height:.98;text-align:center;color:var(--text)}.home-tagline{margin:0;max-width:44ch;text-align:center;font-size:var(--text-body);color:var(--muted)}.home-tagline b{color:var(--text);font-weight:650}.mode-picker{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2);width:100%;max-width:460px}.mode-card{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:calc(var(--control-h) * 1.3);padding:var(--space-3) var(--space-4);border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);text-align:left;transition:border-color .18s,background .18s,transform .15s var(--ease)}.mode-card:hover{border-color:var(--line-strong);background:var(--surface-hover)}.mode-card:active{transform:scale(.99)}.mode-card.is-active{border-color:var(--green)}.mode-card-label{font-size:var(--text-body);font-weight:700;letter-spacing:-.01em}.mode-card-hint{font-size:var(--text-small);color:var(--dim)}.home-play{gap:var(--space-3)}.home-play .segmented{position:relative;display:grid;grid-template-columns:repeat(var(--seg-count, 2),1fr);width:100%;max-width:320px;padding:4px;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface)}.segmented-thumb{position:absolute;top:4px;bottom:4px;left:4px;width:calc((100% - 8px) / var(--seg-count, 2));border-radius:9px;background:var(--surface-raised);transform:translate(calc(var(--seg-index, 0) * 100%));transition:transform .24s var(--ease)}.segmented button{position:relative;min-height:var(--control-h-sm);border-radius:9px;color:var(--muted);font-size:var(--text-body);font-weight:650;transition:color .18s}.segmented button[aria-selected=true]{color:var(--text)}.round-counts{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-2)}.round-counts button{min-width:52px;min-height:var(--control-h-sm);padding:0 var(--space-3);border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);color:var(--muted);font-size:var(--text-body);font-weight:650;font-variant-numeric:tabular-nums;transition:border-color .18s,color .18s,background .18s}.round-counts button:hover:not(:disabled){border-color:var(--line-strong);color:var(--text)}.round-counts button[aria-pressed=true]{border-color:var(--green);background:var(--green-soft);color:var(--text)}.round-counts button:disabled{opacity:.5;cursor:default}.home-start{width:100%;max-width:460px;font-size:var(--text-body)}.home-foot{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-1) var(--space-4);font-size:var(--text-small);color:var(--dim)}.home-foot b{color:var(--muted);font-weight:700;font-variant-numeric:tabular-nums}.notice{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);width:100%;max-width:460px;margin:var(--space-4) auto 0;padding:var(--space-4);border-radius:var(--radius-lg);border:1px solid var(--line);background:var(--surface);text-align:center}.notice h2{margin:0;font-size:var(--text-title);font-weight:700}.notice p{margin:0;font-size:var(--text-body);color:var(--muted)}.notice code{font-size:var(--text-small);color:var(--dim);overflow-wrap:anywhere}.notice-error{border-color:#ef6b7f59}@media(max-width:420px){.mode-picker{grid-template-columns:1fr}.mode-card{flex-direction:row;align-items:baseline;justify-content:space-between;min-height:var(--control-h)}}.round{padding-bottom:env(safe-area-inset-bottom)}.hud{flex:none;display:flex;align-items:center;justify-content:center;gap:var(--space-5);padding-bottom:var(--space-3);margin-bottom:var(--space-3);border-bottom:1px solid var(--line)}.hud-item{display:flex;flex-direction:column;align-items:center;gap:0}.hud-label{font-size:var(--text-label);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}.hud-value{font-size:var(--text-body);font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums;transition:color .3s}.hud-value i{font-style:normal;font-size:var(--text-small);font-weight:600;color:var(--dim)}.hud-value.is-hot{color:var(--amber)}.hud-sep{width:1px;height:calc(var(--text-body) * 1.4);background:var(--line)}.hud-value.is-flashing{animation:score-pop .5s var(--ease-spring)}@keyframes score-pop{0%{transform:scale(1);color:var(--green-bright)}35%{transform:scale(1.16);color:var(--green-bright)}to{transform:scale(1)}}.cat-tabs{flex:none;display:flex;justify-content:center;flex-wrap:wrap;gap:4px;padding:4px;margin:0 auto var(--space-3);width:fit-content;max-width:100%;border-radius:999px;background:var(--surface);border:1px solid var(--line)}.cat-tab{min-height:var(--control-h-sm);padding:0 var(--space-4);border-radius:999px;color:var(--muted);font-size:var(--text-small);font-weight:600;transition:background .16s,color .16s}.cat-tab:hover{color:var(--text)}.cat-tab.is-active{background:var(--surface-raised);color:var(--text)}.stage{display:flex;flex-direction:column;align-items:center;flex:1;min-height:0}.rows{display:flex;flex-direction:column;gap:var(--space-2);justify-content:center;width:100%;margin:0 0 var(--space-3);padding:0;list-style:none;flex:1 1 auto;min-height:76px;overflow-y:auto;scrollbar-width:thin}.row{display:flex;align-items:center;gap:var(--space-3);flex:none;min-height:var(--row-h);padding:0 var(--space-4);border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);animation:row-in .24s var(--ease) both}@keyframes row-in{0%{opacity:0;transform:translateY(-4px)}}.row-icon{display:inline-flex;align-items:center;justify-content:center;flex:none;width:calc(var(--row-h) * .42);height:calc(var(--row-h) * .42);border-radius:999px;background:var(--surface-raised);color:var(--muted)}.row-icon svg{width:62%;height:62%}.row-text{flex:1;min-width:0;font-size:var(--text-body);font-weight:600;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row.is-wrong .row-icon{background:var(--red-soft);color:var(--red)}.row.is-correct .row-icon{background:var(--green-soft);color:var(--green-bright)}.row.is-skipped .row-icon{color:var(--dim)}.row.is-idle{border-style:dashed;background:transparent}.row.is-idle .row-text{color:var(--muted);font-weight:500}.row.is-empty{min-height:calc(var(--row-h) * .68);background:#ffffff04;border-color:#ffffff0f}.row.is-you{border-color:var(--line-strong)}.timeline{flex:none;width:100%;margin-bottom:var(--space-3)}.duration-hero{display:flex;align-items:baseline;gap:var(--space-2);margin-bottom:var(--space-2)}.duration-value{font-size:clamp(20px,2vh + 1vw,28px);font-weight:750;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}.duration-unit{font-size:var(--text-label);font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}.duration-hero.is-swapping .duration-value{animation:duration-swap .3s var(--ease)}@keyframes duration-swap{0%{opacity:0;transform:translateY(6px);color:var(--green-bright)}to{opacity:1;transform:none}}.ladder-track{position:relative;padding-top:var(--space-2)}.ladder{display:grid;grid-template-columns:repeat(var(--steps, 6),1fr);gap:var(--space-1);width:100%;margin:0;padding:0;list-style:none}.ladder-step{display:flex;flex-direction:column;align-items:center;gap:var(--space-1)}.ladder-bar{width:100%;height:var(--ladder-bar);border-radius:3px;background:var(--surface-raised);transition:background .3s var(--ease),transform .3s var(--ease)}.ladder-step.is-done .ladder-bar{background:var(--bar-done)}.ladder-step.is-current .ladder-bar{background:var(--green);transform:scaleY(1.15)}.ladder-label{font-size:clamp(9.5px,1.1vh,11.5px);font-weight:600;color:var(--dim);font-variant-numeric:tabular-nums;transition:color .25s}.ladder-step.is-current .ladder-label{color:var(--text);font-weight:700}.ladder-step.is-done .ladder-label{color:var(--muted)}.ladder-pointer{position:absolute;top:0;width:0;height:0;margin-left:-6px;border-left:6px solid transparent;border-right:6px solid transparent;border-top:9px solid var(--green);transition:left .32s var(--ease);pointer-events:none}.play-wrap{position:relative;flex:none;margin-bottom:var(--space-4)}.play{position:relative;display:grid;place-items:center;width:var(--play-size);height:var(--play-size);border-radius:50%;color:var(--on-green);background:var(--green);transition:transform .18s var(--ease),background .2s,filter .2s}.play:hover:not(:disabled){background:var(--green-bright);transform:translateY(-1px)}.play:active:not(:disabled){transform:scale(.96)}.play:disabled{cursor:default;filter:saturate(.4) brightness(.7)}.play-icon{grid-area:1 / 1;width:calc(var(--play-size) * .35);height:calc(var(--play-size) * .35);margin-left:calc(var(--play-size) * .05);transition:opacity .15s}.play.is-playing .play-icon{opacity:.6}.play-spinner{grid-area:1 / 1;display:none;width:calc(var(--play-size) * .3);height:calc(var(--play-size) * .3);border-radius:50%;border:3px solid rgba(255,255,255,.3);border-top-color:#fff;animation:spin .7s linear infinite}.play.is-loading{cursor:progress;filter:saturate(.4) brightness(.75)}.play.is-loading .play-icon{display:none}.play.is-loading .play-spinner{display:block}.play-ring{position:absolute;inset:-7px;width:calc(100% + 14px);height:calc(100% + 14px);transform:rotate(-90deg);pointer-events:none;overflow:visible}.play-ring circle{fill:none;stroke-width:3;stroke-linecap:round}.play-ring .ring-track{stroke:#ffffff14}.play-ring .ring-progress{stroke:var(--text);transition:stroke-dashoffset .06s linear}.play-hint{position:absolute;left:50%;bottom:-20px;transform:translate(-50%);font-size:var(--text-label);letter-spacing:.16em;text-transform:uppercase;color:var(--dim);white-space:nowrap;opacity:0;transition:opacity .25s}.play-wrap:hover .play-hint{opacity:1}.play-status{position:absolute;left:50%;bottom:-22px;transform:translate(-50%);font-size:var(--text-label);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);white-space:nowrap}.play-status.is-error{color:var(--red-soft-text)}.answer{flex:none;display:flex;gap:var(--space-2);width:100%;align-items:stretch}.field{position:relative;flex:1;min-width:0}.field-input{width:100%;height:var(--control-h);padding:0 var(--space-3) 0 calc(var(--space-3) + 30px);border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);font-size:var(--text-body);transition:border-color .18s,background .18s}.field-input::placeholder{color:var(--dim)}.field-input:hover:not(:disabled){border-color:var(--line-strong)}.field-input:focus{outline:none;border-color:var(--green);background:var(--surface-hover)}.field-input:focus-visible{outline:none}.field-input:disabled{opacity:.55;cursor:not-allowed}.field-icon{position:absolute;left:var(--space-3);top:50%;transform:translateY(-50%);color:var(--dim);pointer-events:none;transition:color .2s}.field.is-correct .field-input,.field.is-correct .field-input:focus{border-color:#35d873b3;background:var(--green-soft);color:var(--green-soft-text)}.field.is-correct .field-icon{color:var(--green-bright)}.field.is-wrong{animation:shake .36s var(--ease)}.field.is-wrong .field-input,.field.is-wrong .field-input:focus{border-color:#ef6b7fa6;background:var(--red-soft)}.field.is-wrong .field-icon{color:var(--red)}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}50%{transform:translate(5px)}75%{transform:translate(-3px)}}.suggestions{position:absolute;bottom:calc(100% + var(--space-1));left:0;right:0;z-index:30;padding:6px;border-radius:var(--radius);border:1px solid var(--line-strong);background:var(--surface-solid);box-shadow:0 20px 44px -20px #000000e6;max-height:min(38vh,264px);overflow-y:auto}.suggestions:empty{display:none}.suggestion{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3);width:100%;min-height:var(--control-h-sm);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);text-align:left;transition:background .12s}.suggestion:hover,.suggestion.is-active{background:var(--surface-raised)}.suggestion-title{font-size:var(--text-body);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.suggestion-artist{flex:none;font-size:var(--text-small);color:var(--muted)}.skip{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);flex:none;min-width:96px;min-height:var(--control-h);padding:0 var(--space-4);border-radius:var(--radius);border:1px solid transparent;background:var(--button-light);color:var(--button-light-text);font-size:var(--text-small);font-weight:700;letter-spacing:.04em;transition:background .18s,border-color .18s,transform .15s var(--ease),color .18s}.skip:hover{background:var(--button-light-hover)}.skip:active{transform:scale(.98)}.skip-next{padding:3px 8px;border-radius:999px;background:#14151a1f;font-size:var(--text-label);font-weight:700;font-variant-numeric:tabular-nums;color:inherit;opacity:.75}.skip.is-final{background:transparent;border-color:#ef6b7f66;color:var(--red-soft-text)}.skip.is-final:hover{background:var(--red-soft);border-color:#ef6b7fa6}@media(max-width:560px){.hud{gap:var(--space-4)}.answer{flex-wrap:wrap}.field{flex:1 1 100%}.skip{flex:1}.play-hint{display:none}.play-status{max-width:90vw;overflow:hidden;text-overflow:ellipsis}}.mp-shell{display:flex;flex-direction:column;gap:var(--space-3);padding-block:var(--space-2)}.mp-title{margin:0;font-size:var(--text-title);font-weight:800;letter-spacing:-.04em;line-height:1;text-align:center}.mp-sub{margin:0 auto;max-width:46ch;text-align:center;font-size:var(--text-small);color:var(--muted)}.mp-card{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-4);border-radius:var(--radius-lg);border:1px solid var(--line);background:var(--surface)}.mp-card-name{max-width:460px;width:100%;margin-inline:auto;gap:var(--space-2)}.mp-card-title{margin:0;font-size:var(--text-body);font-weight:700;letter-spacing:.02em}.mp-cards{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}.mp-field{display:flex;flex-direction:column;gap:var(--space-1)}.mp-fields{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2) var(--space-3)}.mp-label{font-size:var(--text-label);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}.mp-card .btn{width:100%;margin-top:auto}.mp-code-input{letter-spacing:.32em;font-weight:700;text-transform:uppercase}.mp-notice{min-height:18px;margin:0;text-align:center;font-size:var(--text-small);color:var(--red)}.mp-notice[data-kind=info]{color:var(--muted)}.mp-back{align-self:center;min-width:140px}.mp-lobby-head{display:flex;flex-direction:column;align-items:center;gap:var(--space-1)}.mp-code-row{display:flex;align-items:center;gap:var(--space-4)}.mp-code-value{font-size:var(--code-size);font-weight:800;letter-spacing:.14em;line-height:1;font-variant-numeric:tabular-nums}.mp-copy{display:inline-flex;align-items:center;gap:var(--space-1);min-height:var(--control-h-sm);padding:0 var(--space-3);border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--muted);font-size:var(--text-small);font-weight:650;white-space:nowrap;transition:border-color .18s,color .18s}.mp-copy:hover{border-color:var(--line-strong);color:var(--text)}.mp-copy.is-copied{border-color:#35d87380;color:var(--green-bright)}.mp-players{display:flex;flex-direction:column;gap:var(--space-1);margin:0;padding:0;list-style:none}.mp-player{display:flex;align-items:center;gap:var(--space-2);min-height:var(--row-h);padding:0 var(--space-3);border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);animation:row-in .24s var(--ease) both}.mp-player.is-away{opacity:.55}.mp-player-name{flex:1;min-width:0;font-size:var(--text-body);font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mp-player-you,.mp-player-tag{flex:none;font-size:var(--text-label);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}.mp-player-tag.is-host{display:inline-flex;align-items:center;gap:5px;color:var(--amber)}.mp-settings{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);border:1px solid var(--line);background:var(--surface)}.mp-setting{display:flex;flex-direction:column;gap:var(--space-2)}.mp-setting-row{flex-direction:row;align-items:center;justify-content:space-between;gap:var(--space-3)}.mp-setting-row .select{width:auto;min-width:140px}.mp-chips{display:flex;flex-wrap:wrap;gap:var(--space-1)}.mp-chip{min-width:52px;min-height:var(--control-h-sm);padding:0 var(--space-3);border-radius:var(--radius);border:1px solid var(--line);background:var(--surface-hover);color:var(--muted);font-size:var(--text-body);font-weight:650;font-variant-numeric:tabular-nums;transition:border-color .18s,color .18s,background .18s}.mp-chip:hover:not(:disabled){border-color:var(--line-strong);color:var(--text)}.mp-chip[aria-pressed=true]{border-color:var(--green);background:var(--green-soft);color:var(--text)}.mp-chip:disabled{opacity:.55;cursor:default}.mp-chip-custom{min-width:88px}.mp-custom-time{width:110px;min-height:var(--control-h-sm)}.mp-modes{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-2)}.mp-mode{display:flex;flex-direction:column;gap:2px;min-height:calc(var(--control-h) * 1.35);padding:var(--space-3);border-radius:var(--radius);border:1px solid var(--line);background:var(--surface-hover);text-align:left;transition:border-color .18s,background .18s}.mp-mode:hover:not(:disabled){border-color:var(--line-strong)}.mp-mode[aria-pressed=true]{border-color:var(--green);background:var(--green-soft)}.mp-mode:disabled{opacity:.6;cursor:default}.mp-mode-label{font-size:var(--text-body);font-weight:700}.mp-mode-hint{font-size:var(--text-label);line-height:1.35;color:var(--dim)}.mp-summary{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--space-1) var(--space-2);margin:0;font-size:var(--text-small);color:var(--muted);font-variant-numeric:tabular-nums}.mp-summary .dot{width:3px;height:3px;border-radius:50%;background:var(--dim)}.mp-lobby-actions{display:flex;gap:var(--space-2);justify-content:center}.mp-lobby-actions .btn{min-width:150px}.mp-hint{margin:0;text-align:center;font-size:var(--text-small);color:var(--dim)}.mp-body{display:flex;flex-direction:column;flex:1;min-height:0}.mp-board{order:-1;position:relative;flex:none;margin-bottom:var(--space-2);border-radius:var(--radius);border:1px solid var(--line);background:var(--surface)}.mp-board-head{display:flex;align-items:center;gap:var(--space-2);width:100%;min-height:var(--control-h-sm);padding:0 var(--space-3);border-radius:inherit;color:var(--muted)}.mp-board-title{flex:none;font-size:var(--text-label);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}.mp-board-you{flex:1;min-width:0;text-align:right;font-size:var(--text-small);font-weight:700;font-variant-numeric:tabular-nums;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mp-board-chevron{flex:none;color:var(--dim);transition:transform .2s var(--ease)}.mp-board-head:disabled{cursor:default}.mp-board-head:disabled .mp-board-chevron{display:none}.mp-board[data-open=true] .mp-board-chevron{transform:rotate(180deg)}.mp-board-list{display:flex;flex-direction:column;gap:2px;margin:0;padding:0;list-style:none}.mp-board-row{display:flex;align-items:center;gap:var(--space-2);min-height:calc(var(--control-h-sm) * .72);padding:0 var(--space-2);border-radius:var(--radius-sm);font-variant-numeric:tabular-nums}.mp-board-row.is-away{opacity:.55}.mp-board-rank{flex:none;width:1.5em;text-align:right;font-size:var(--text-label);font-weight:700;color:var(--dim)}.mp-board-name{flex:1;min-width:0;font-size:var(--text-small);font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mp-board-score{flex:none;font-size:var(--text-small);font-weight:700;color:var(--muted)}.mp-board-row.is-you .mp-board-name,.mp-board-row.is-you .mp-board-score{color:var(--green-bright)}.mp-board-row.is-scored .mp-board-score{animation:score-pop .5s var(--ease-spring)}.mp-board-empty{margin:0;padding:0 var(--space-3) var(--space-3);font-size:var(--text-small);color:var(--dim)}.mp-board-list[hidden],.mp-board-empty[hidden]{display:none}.mp-board-list:not([hidden]){position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:40;max-height:min(42vh,300px);overflow-y:auto;padding:6px;border-radius:var(--radius);border:1px solid var(--line-strong);background:var(--surface-solid);box-shadow:0 20px 44px -20px #000000e6}.mp-code-chip{font-size:var(--text-small);font-weight:700;letter-spacing:.14em;font-variant-numeric:tabular-nums}.mp-timer.is-hurry{color:var(--red)}.mp-status{flex:none;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--space-1) var(--space-4);margin-bottom:var(--space-2);font-size:var(--text-small);color:var(--dim)}.mp-status-item{display:inline-flex;align-items:center;gap:var(--space-1);max-width:100%}.mp-status-name{font-weight:650;color:var(--text);max-width:18ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mp-status-item.is-finished .mp-status-label{color:var(--green-bright)}.mp-status-item.is-gaveup .mp-status-label,.mp-status-item.is-exhausted .mp-status-label{color:var(--red)}.row-dot{flex:none;width:8px;height:8px;border-radius:999px;background:var(--dim)}.row.is-guessing .row-dot{background:var(--amber);animation:pulse 1.6s var(--ease) infinite}.row.is-finished .row-dot{background:var(--green)}.row.is-gaveup .row-dot,.row.is-timedout .row-dot{background:var(--red)}.row.is-away .row-dot{background:var(--line-strong)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}.mp-note{flex:none;min-height:16px;margin:var(--space-2) 0 0;text-align:center;font-size:var(--text-small);color:var(--muted);opacity:0;transition:opacity .2s}.mp-note.is-visible{opacity:1}.mp-reveal{display:inline-flex;align-items:center;justify-content:center;flex:none;min-height:var(--control-h);padding:0 var(--space-4);border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);color:var(--muted);font-size:var(--text-label);font-weight:700;letter-spacing:.06em;white-space:nowrap;transition:border-color .18s,color .18s}.mp-reveal:hover{border-color:var(--line-strong);color:var(--text)}.mp-giveup{flex:none;min-height:var(--control-h);padding:0 var(--space-4);border-radius:var(--radius);border:1px solid rgba(239,107,127,.35);background:transparent;color:var(--red-soft-text);font-size:var(--text-small);font-weight:700;transition:background .18s,border-color .18s}.mp-giveup:hover{background:var(--red-soft);border-color:#ef6b7f99}.mp-results-card{max-width:460px}.mp-results{display:flex;flex-direction:column;gap:var(--space-1);margin:var(--space-3) 0 0;padding:0;list-style:none}.mp-result{display:flex;align-items:center;gap:var(--space-2);min-height:calc(var(--control-h) * .8);padding:0 var(--space-3);border-radius:var(--radius-sm);background:#ffffff08;text-align:left}.mp-result.is-you{background:#35d8731a}.mp-result-rank{flex:none;width:16px;font-size:var(--text-small);font-weight:700;color:var(--dim);font-variant-numeric:tabular-nums}.mp-result-name{flex:1;min-width:0;font-size:var(--text-body);font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mp-result-step,.mp-result-correct{flex:none;font-size:var(--text-small);color:var(--muted);font-variant-numeric:tabular-nums}.mp-result-time{flex:none;width:42px;text-align:right;font-size:var(--text-small);color:var(--dim);font-variant-numeric:tabular-nums}.mp-result-points{flex:none;width:62px;text-align:right;font-size:var(--text-body);font-weight:700;color:var(--green-bright);font-variant-numeric:tabular-nums}.mp-result.is-gaveup .mp-result-points,.mp-result.is-timedout .mp-result-points,.mp-result.is-exhausted .mp-result-points{color:var(--dim)}.mp-ready{width:100%;margin-top:var(--space-3)}.mp-countdown{margin:var(--space-2) 0 0;font-size:var(--text-label);letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}.mp-winner{margin:var(--space-1) 0 0;font-size:var(--text-title);font-weight:700;color:var(--green-bright)}.mp-final-rules{margin-top:var(--space-1)}.mp-standings{display:flex;flex-direction:column;gap:var(--space-2);width:100%;margin:var(--space-4) 0 0;padding:0;list-style:none}.mp-standing{display:flex;align-items:center;gap:var(--space-3);min-height:var(--row-h);padding:0 var(--space-4);border-radius:var(--radius);border:1px solid var(--line);background:var(--surface)}.mp-standing.is-first{border-color:#35d87373}.mp-standing.is-you .mp-result-name{color:var(--green-bright)}@media(min-width:1000px){.mp-game>.shell{position:relative;max-width:1000px;padding-right:calc(188px + var(--gutter))}.mp-board{position:absolute;top:0;right:var(--gutter);bottom:0;display:flex;flex-direction:column;width:172px;margin-bottom:0;border-color:transparent;background:none}.mp-board-head{padding:0;cursor:default}.mp-board-head:disabled{opacity:1}.mp-board-you,.mp-board-chevron{display:none}.mp-board-list:not([hidden]){position:static;min-height:0;overflow-y:auto;padding:0;border:none;background:none;box-shadow:none;gap:var(--space-1)}.mp-board-row{padding:0 var(--space-2) 0 0;border-radius:var(--radius-sm);min-height:calc(var(--row-h) * .72)}.mp-board-row.is-you{padding-left:var(--space-2);background:var(--green-soft)}.mp-board-empty{padding:var(--space-2) 0 0;line-height:1.4}}@media(max-width:640px){.mp-cards{grid-template-columns:1fr;gap:var(--space-2)}.mp-card{padding:var(--space-3)}.mp-fields{gap:var(--space-2)}.mp-modes{grid-template-columns:1fr;gap:var(--space-1)}.mp-mode{flex-direction:row;align-items:baseline;gap:var(--space-2);min-height:var(--control-h-sm);padding:var(--space-2) var(--space-3)}.mp-mode-label{flex:none;font-size:var(--text-small)}.mp-mode-hint{flex:1;min-width:0}.mp-settings{padding:var(--space-3);gap:var(--space-2)}.mp-code-value{letter-spacing:.1em}.mp-code-row{gap:var(--space-3)}.mp-setting{gap:var(--space-1)}.mp-lobby-actions .btn{min-width:0}.mp-shell{gap:var(--space-2);padding-block:0}.mp-players{gap:4px}.mp-lobby-actions{margin-top:0}.mp-setting-row{flex-direction:column;align-items:flex-start;gap:var(--space-2)}.mp-setting-row .select{width:100%}.mp-answer{flex-wrap:wrap}.mp-game .field{flex:1 1 100%}.mp-reveal,.mp-giveup{flex:1}.mp-status{gap:var(--space-1) var(--space-3)}}.reveal{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:var(--space-3);background:#08090bc7;overflow-y:auto;overscroll-behavior:contain;animation:fade-in .22s var(--ease) both}@keyframes fade-in{0%{opacity:0}}.reveal.is-success{animation-delay:.24s}.reveal.is-success .reveal-card{animation-delay:.3s}.reveal-card{position:relative;width:100%;max-width:420px;max-height:calc(100dvh - var(--space-3) * 2);overflow-y:auto;padding:var(--space-4) var(--space-4) var(--space-3);border-radius:var(--radius-lg);border:1px solid var(--line-strong);background:var(--surface-solid);box-shadow:0 32px 70px -28px #000000f2;text-align:center;animation:card-in .34s var(--ease-spring) both}.reveal.is-results .reveal-card{max-width:470px}@keyframes card-in{0%{opacity:0;transform:translateY(16px) scale(.98)}}.reveal-art{position:relative;width:clamp(84px,14vh,118px);height:clamp(84px,14vh,118px);margin:0 auto var(--space-3);border-radius:var(--radius);overflow:hidden;background:var(--surface-raised);border:1px solid var(--line)}.reveal-art img{width:100%;height:100%;object-fit:cover;display:block}.reveal-art-fallback{display:grid;place-items:center;width:100%;height:100%;color:var(--dim)}.reveal-kicker{position:relative;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--green-bright);margin-bottom:8px}.reveal[data-state=miss] .reveal-kicker{color:var(--muted)}.reveal-title{position:relative;margin:0;font-size:clamp(20px,2vw + 1.4vh,27px);font-weight:800;letter-spacing:-.03em;line-height:1.15;overflow-wrap:anywhere}.reveal-artist{position:relative;margin:4px 0 0;font-size:var(--text-small);color:var(--muted)}.reveal-points{position:relative;margin-top:var(--space-3);font-size:clamp(28px,2.6vw + 2vh,40px);font-weight:800;letter-spacing:-.04em;color:var(--green-bright);font-variant-numeric:tabular-nums;line-height:1;animation:points-in .4s var(--ease-spring) both .12s}.reveal-points.is-zero{color:var(--dim)}@keyframes points-in{0%{opacity:0;transform:translateY(8px) scale(.94)}}.reveal-points small{font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-left:4px;color:var(--muted);vertical-align:6px}.reveal-meta{position:relative;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:var(--space-1) var(--space-2);margin-top:var(--space-2);font-size:var(--text-small);color:var(--muted);font-variant-numeric:tabular-nums}.reveal-meta .dot{width:3px;height:3px;border-radius:50%;background:var(--dim)}.reveal-streak{display:inline-flex;align-items:center;gap:5px;color:var(--amber);font-weight:600}.reveal-audio{position:relative;display:flex;align-items:center;gap:var(--space-2);margin-top:var(--space-3);padding:9px 13px 11px 9px;border-radius:var(--radius);border:1px solid var(--line);background:#ffffff06;text-align:left}.transport-toggle{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--line-strong);background:var(--surface);color:var(--text);transition:background .18s,border-color .18s,transform .15s var(--ease),color .18s}.transport-toggle:hover:not(:disabled){background:var(--surface-hover);border-color:#ffffff47;color:var(--green-bright)}.transport-toggle:active:not(:disabled){transform:scale(.93)}.transport-toggle:disabled{cursor:progress;opacity:.55}.reveal-audio[data-state=loading] .transport-toggle{cursor:default;opacity:.45}.transport-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:7px}.transport-label{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.transport-track{position:relative;height:3px;border-radius:2px;background:#ffffff1a;overflow:hidden}.transport-fill{position:absolute;top:0;bottom:0;left:0;width:0;border-radius:2px;background:var(--green);transition:opacity .2s}.reveal-audio[data-state=paused] .transport-fill,.reveal-audio[data-state=ended] .transport-fill{opacity:.4}.reveal-audio[data-state=loading] .transport-fill{opacity:.25}.reveal-next{position:relative;width:100%;margin-top:var(--space-3);background:var(--green);color:#05130a}.reveal-hint{position:relative;margin-top:12px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}@media(hover:none){.reveal-hint{display:none}}@media(max-width:480px){.reveal-card{padding:var(--space-3)}}.results{padding-bottom:max(3vh,env(safe-area-inset-bottom))}.results-inner{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%}.results-title{margin:0;font-size:var(--text-small);font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}.results-score{margin:var(--space-1) 0 0;font-size:clamp(38px,6vw + 3vh,76px);font-weight:800;letter-spacing:-.045em;line-height:1;font-variant-numeric:tabular-nums}.results-sub{margin:0;font-size:var(--text-body);color:var(--muted)}.results-stats{display:flex;gap:var(--space-5);margin:var(--space-4) 0 0;text-align:center}.results-stats dt{font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}.results-stats dd{margin:4px 0 0;font-size:var(--text-title);font-weight:700;font-variant-numeric:tabular-nums}.results-list{display:flex;flex-direction:column;gap:var(--space-1);width:100%;max-width:560px;max-height:38vh;overflow-y:auto;margin:var(--space-4) 0 0;padding:0;list-style:none}.results-row{display:flex;align-items:center;gap:var(--space-3);min-height:var(--row-h);padding:0 var(--space-3);border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);animation:row-in .3s var(--ease) both}.results-art{flex:none;width:calc(var(--row-h) * .65);height:calc(var(--row-h) * .65);border-radius:7px;object-fit:cover;background:var(--surface-raised)}.results-row-text{flex:1;min-width:0}.results-row-title{font-size:var(--text-body);font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.results-row-artist{font-size:var(--text-small);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.results-row-step{flex:none;font-size:var(--text-small);color:var(--dim);font-variant-numeric:tabular-nums}.results-row-points{flex:none;width:74px;text-align:right;font-size:var(--text-body);font-weight:700;color:var(--green-bright);font-variant-numeric:tabular-nums}.results-row.is-miss .results-row-points{color:var(--dim)}.results-actions{display:flex;gap:var(--space-2);margin-top:var(--space-4)}.results-actions .btn{min-width:150px}@media(max-width:560px){.results-stats{gap:var(--space-4)}.results-list{max-height:none}.results-actions{flex-direction:column;width:100%;max-width:320px}}