.ear-stage{gap:18px;padding-top:var(--space-3);--key-idle: var(--color-surface-3);--key-white: #DAD8D1;--key-black: #1A1917;--key-black-idle: #151513;--key-stroke: var(--color-surface);--key-flash: #FFFFFF}:root[data-theme=light] .ear-stage{--key-idle: #E9E6DE;--key-white: #FFFFFF;--key-black: #2A2925;--key-black-idle: #8C897F;--key-stroke: #B9B5AA;--key-flash: #9AF0DA}.ear-top{display:flex;align-items:center;justify-content:center;gap:10px var(--space-2);width:100%;flex-wrap:wrap}.ear-ex,.ear-mode{flex-wrap:nowrap}.ear-ex button{min-width:96px}.ear-mode button{min-width:88px}.ear-score{display:flex;justify-content:center;gap:8px;text-align:center;flex-basis:100%}.ear-score>div{display:grid;grid-template-columns:auto auto;align-items:center;column-gap:6px;row-gap:2px;min-width:92px;padding:6px 12px;border-radius:var(--radius-media);background:var(--color-surface-2);border:1px solid var(--color-hairline);box-shadow:var(--shadow-sm)}.ear-score__ico{width:15px;height:15px;color:var(--color-gray);grid-row:span 2}.ear-score__val{font-family:var(--font-heading);font-weight:700;font-size:1.3rem;line-height:1;font-variant-numeric:tabular-nums;text-align:left}.ear-score__lbl{font-size:var(--fs-xs);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--color-gray);text-align:left}.ear-score__streak{transition:border-color .2s ease,background .2s ease}.ear-score__streak.is-hot{border-color:var(--color-warn);background:#f2b5441f}.ear-score__streak.is-hot .ear-score__val,.ear-score__streak.is-hot .ear-score__ico{color:var(--color-warn)}.ear-score__streak.is-party{animation:ear-party .7s var(--ease)}@keyframes ear-party{0%{transform:scale(1)}30%{transform:scale(1.22) rotate(-4deg)}60%{transform:scale(.96) rotate(2deg)}to{transform:none}}.ear-keys{width:100%;max-width:440px;aspect-ratio:308 / 62}.ear-keys svg{width:100%;height:100%;display:block}.ear-keys .kw{fill:var(--key-idle);stroke:var(--key-stroke);stroke-width:1;transition:fill .2s ease}.ear-keys .kb{fill:var(--key-black-idle);stroke:var(--key-stroke);stroke-width:.8;transition:fill .2s ease}.ear-keys.is-revealed .kw{fill:var(--key-white)}.ear-keys.is-revealed .kb{fill:var(--key-black)}.ear-keys .kw.is-a,.ear-keys .kb.is-a{fill:var(--color-accent)}.ear-keys .kw.is-b,.ear-keys .kb.is-b{fill:var(--color-warn)}.ear-keys .k.is-flash{fill:var(--key-flash);transition:none}.ear-prompt{text-align:center;min-height:96px;display:flex;flex-direction:column;justify-content:center;gap:4px;max-width:560px}.ear-prompt p{margin:0}.ear-prompt__title{font-family:var(--font-heading);font-weight:700;font-size:clamp(1.7rem,4.4vw,2.4rem);line-height:1.1}.ear-prompt__title.is-right{color:var(--color-accent-ink)}.ear-prompt__title.is-wrong{color:var(--color-danger)}.ear-prompt__notes{font-weight:700;color:var(--color-ink-soft);font-size:var(--fs-md)}.ear-prompt__song{color:var(--color-gray);font-size:var(--fs-base);min-height:1.4em}.ear-actions{display:flex;align-items:center;justify-content:center;gap:var(--space-3)}.ear-stage .play.is-waiting{box-shadow:0 0 0 10px var(--color-accent-dim),var(--shadow-md)}.ear-stage .play .icon-stop{display:none!important}.ear-stage .play .icon-play{display:block!important}.ear-answers{display:grid;grid-template-columns:repeat(auto-fill,minmax(108px,1fr));gap:8px;width:100%}.ear-answer{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:72px;padding:10px 6px;border-radius:var(--radius-media);border:1px solid var(--color-hairline);background:var(--color-surface-2);color:var(--color-ink);box-shadow:var(--shadow-sm);touch-action:manipulation;transition:border-color .15s ease,background .15s ease,opacity .2s ease,transform .1s ease}.ear-answer:hover{border-color:var(--color-accent)}.ear-answer:active{transform:scale(.97)}.ear-answer__abbr{font-family:var(--font-heading);font-weight:700;font-size:1.45rem;line-height:1}.ear-answer__name{font-size:var(--fs-xs);font-weight:700;color:var(--color-gray);text-align:center;line-height:1.2}.ear-answer__key{position:absolute;top:6px;left:8px;font-size:var(--fs-xs);font-weight:700;color:var(--color-gray);opacity:.8}@media (hover: none){.ear-answer__key{display:none}}.ear-answers--text .ear-answer__abbr{font-size:1.12rem}.ear-answers--text .ear-answer__name{display:none}.ear-answer.is-right{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-on-accent);animation:ear-pop .35s var(--ease);box-shadow:var(--shadow-glow)}.ear-answer.is-right .ear-answer__name,.ear-answer.is-right .ear-answer__key{color:var(--color-on-accent);opacity:.85}.ear-answer.is-wrong{animation:ear-shake .35s ease;border-color:var(--color-danger);background:#ff6b5e24}.ear-answer.is-wrong .ear-answer__abbr{color:var(--color-danger)}.ear-answer.is-dim{opacity:.45}.ear-answer.is-selected{border-color:var(--color-accent);background:var(--color-accent-dim)}.ear-answer.is-selected .ear-answer__abbr{color:var(--color-accent-ink)}@keyframes ear-pop{0%{transform:scale(1)}45%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes ear-shake{0%,to{transform:none}20%{transform:translate(-5px)}40%{transform:translate(5px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}.ear-prompt__title.is-right,.ear-prompt__title.is-wrong{animation:ear-in .3s var(--ease)}@keyframes ear-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.ear-stats{display:grid;gap:8px}.ear-stat{display:grid;grid-template-columns:64px minmax(0,1fr) 42px 46px;align-items:center;gap:10px;font-size:var(--fs-base)}.ear-stat__id{font-family:var(--font-heading);font-weight:700;font-size:1.05rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ear-stat__bar{height:8px;border-radius:999px;background:var(--color-surface-3);overflow:hidden}.ear-stat__bar span{display:block;height:100%;border-radius:inherit;background:var(--color-accent)}.ear-stat.is-mid .ear-stat__bar span{background:var(--color-warn)}.ear-stat.is-low .ear-stat__bar span{background:var(--color-danger)}.ear-stat__pct{font-weight:700;text-align:right;font-variant-numeric:tabular-nums}.ear-stat__n{color:var(--color-gray);text-align:right;font-variant-numeric:tabular-nums}#pick .chip{min-width:52px}#dir button{padding:0 10px}.ear-pick-actions{gap:8px}.ear-midi .btn{justify-self:start}.ear-stage:fullscreen,.ear-stage.is-stage-mode{gap:3vh;padding-top:max(68px,env(safe-area-inset-top))}.ear-stage:fullscreen .ear-prompt__title,.ear-stage.is-stage-mode .ear-prompt__title{font-size:clamp(2.4rem,6vw,4.5rem)}.ear-stage:fullscreen .ear-keys,.ear-stage.is-stage-mode .ear-keys{max-width:min(760px,90vw)}.ear-stage:fullscreen .ear-answers,.ear-stage.is-stage-mode .ear-answers{max-width:1000px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.ear-stage:fullscreen .ear-answer,.ear-stage.is-stage-mode .ear-answer{min-height:96px}.ear-stage:fullscreen .ear-answer__abbr,.ear-stage.is-stage-mode .ear-answer__abbr{font-size:2rem}@media (max-width: 600px){.ear-stage{gap:12px;padding-top:12px}.ear-top{gap:8px}.ear-ex{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.ear-ex button,.ear-mode button{min-width:0;padding:0 10px}.ear-top{flex-wrap:wrap}.ear-mode{flex:0 0 auto}.ear-top{display:grid;grid-template-columns:auto minmax(0,1fr)}.ear-ex{grid-column:1 / -1}.ear-stage.is-explore .ear-mode{grid-column:1 / -1;justify-self:center}.ear-score{gap:6px;width:100%;flex-basis:auto}.ear-score>div{flex:1 1 0;min-width:0;padding:0 6px;height:var(--tap-sm);display:flex;align-items:center;justify-content:center;gap:4px}.ear-score__ico{width:13px;height:13px}.ear-score__val{font-size:1.02rem}.ear-score__lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.ear-prompt{min-height:72px}.ear-prompt__title{font-size:1.4rem}.ear-prompt__notes{font-size:var(--fs-base)}.ear-prompt__song{font-size:var(--fs-sm)}.ear-keys{max-width:300px}.ear-actions{gap:var(--space-2)}.ear-actions .icon-btn--lg{width:48px;height:48px}.ear-stage .play{width:64px;height:64px}.ear-stage .play svg{width:26px;height:26px}.ear-answers{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.ear-answer{min-height:56px;padding:6px 4px}.ear-answer__abbr{font-size:1.2rem}.ear-answers--text .ear-answer__abbr{font-size:1rem}#dir{grid-template-columns:repeat(2,minmax(0,1fr))}}.acc{font-family:Segoe UI Symbol,Apple Symbols,Noto Music,"Noto Sans Symbols 2",DejaVu Sans,sans-serif;font-weight:400;font-size:.72em;vertical-align:.3em;line-height:0;margin-left:.04em;letter-spacing:0}svg .acc{font-size:.9em}.ear-stage{--key-stroke: #6E6C66}:root[data-theme=light] .ear-stage{--key-stroke: #77756E;--key-white: #FFFFFF}.ear-keys .kw.is-a,.ear-keys .kb.is-a{fill:var(--plum-fill)}.ear-keys .kw.is-b,.ear-keys .kb.is-b{fill:var(--blue)}.ear-keys .k.is-flash{fill:var(--orange)}.ptl-ico{display:inline-block;width:16px;height:16px;margin:0 6px 0 0;vertical-align:-3px;color:var(--g-ink, var(--color-accent-ink));flex:0 0 auto}[role=tab] .ptl-ico{margin-right:6px}[role=tab][aria-selected=true] .ptl-ico{color:inherit}@media (max-width: 600px){[role=tab] .ptl-ico{display:none}}
