:root{color-scheme:dark;--ink: #f4ece0;--muted: #b8ab96;--dim: #9c8f7c;--bronze: #e8c884;--deep: #0a0e13;--panel: rgba(12, 16, 22, .93);--line: rgba(232, 200, 132, .22);--good: #7fd6a8;--bad: #ef6a4c;--caution: #f0c05a;font-family:Space Grotesk,system-ui,-apple-system,sans-serif;font-synthesis:none}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--deep)}body{color:var(--ink)}button,input{font:inherit}button{color:inherit;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.4}button:focus-visible,input:focus-visible{outline:2px solid var(--bronze);outline-offset:3px}#app,#stage{position:fixed;inset:0;width:100%;height:100%}#stage{display:block;touch-action:none}#vignette{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 50% 42%,#0000 34%,#04060a9e 88%,#030407db)}#status{position:fixed;z-index:8;left:50%;top:62px;transform:translate(-50%);margin:0;width:max-content;max-width:calc(100vw - 32px);text-align:center;color:var(--ink);font:10px DM Mono,ui-monospace,monospace;letter-spacing:.13em;text-shadow:0 2px 16px rgba(0,0,0,.95);pointer-events:none}#status[data-kind=bad]{color:var(--bad)}#play{position:fixed;z-index:7;left:50%;bottom:104px;transform:translate(-50%);width:min(660px,calc(100vw - 28px));pointer-events:none;text-align:center}.mark{display:flex;align-items:center;gap:10px;letter-spacing:.18em;font-size:11px;font-weight:700}.mark i{display:block;width:18px;height:18px;border-radius:50%;background:conic-gradient(from 200deg,#2a2118 0 50%,var(--bronze) 50% 100%);box-shadow:0 0 12px #e8c88459}.mark span{display:grid;gap:3px}.mark small{color:var(--muted);font:10px DM Mono,ui-monospace,monospace;letter-spacing:.1em}.hud-actions{display:flex;gap:6px}.hud-actions button{min-height:34px;border:1px solid var(--line);background:#0a0d12c2;padding:8px 11px;font:10px DM Mono,ui-monospace,monospace;letter-spacing:.08em;transition:background .16s,border-color .16s}.hud-actions button:hover{background:#e8c88433;border-color:var(--bronze)}#stroke-strip{display:flex;gap:3px;justify-content:center;margin:0 0 8px;padding:0;list-style:none}#stroke-strip li{flex:0 1 34px;min-width:20px;padding:5px 0 4px;border:1px solid var(--line);background:#0a0d12cc;color:var(--muted);font:11px DM Mono,ui-monospace,monospace;text-align:center;position:relative}#stroke-strip li b{display:block;font-weight:400}#stroke-strip li small{display:block;font-size:7px;letter-spacing:.08em;color:var(--dim)}#stroke-strip li.rest{border-style:dashed;border-color:#f0c05a99;color:var(--caution)}#stroke-strip li.double:after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:2px;background:var(--bronze)}#stroke-strip li.next{border-color:var(--bronze);color:var(--ink);box-shadow:0 0 14px #e8c88447}#stroke-strip li.hit{border-color:#7fd6a899;color:var(--good);background:#14261ed1}#stroke-strip li.miss{border-color:var(--bad);color:var(--bad);background:#2e100cdb}#beat{position:relative;height:20px;border:1px solid var(--line);background:#080b10c7;overflow:hidden}#beat-track{position:absolute;inset:0}#beat-track i{position:absolute;top:0;bottom:0;width:2px;background:#e8c88480}#beat-track i.hit{background:var(--good);width:3px}#beat-track i.miss{background:var(--bad);width:3px}#beat-track i.double{width:3px;box-shadow:0 0 0 2px #e8c88447}#beat-head{position:absolute;top:0;bottom:0;width:2px;background:#fff4dc;box-shadow:0 0 10px #fff0d2cc}#hand-line{margin:7px 0 0;color:var(--muted);font:9px DM Mono,ui-monospace,monospace;letter-spacing:.12em;text-shadow:0 2px 12px rgba(0,0,0,.9)}#hand-line.urge{color:var(--caution)}#hand-line.bad{color:var(--bad)}#planner{position:fixed;z-index:9;left:0;right:0;bottom:0;display:flex;flex-direction:column;border-top:1px solid var(--line);background:linear-gradient(180deg,#090c11e6,#07090efa);backdrop-filter:blur(7px)}.planner-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:11px 20px 8px;border-bottom:1px solid rgba(232,200,132,.12)}.eyebrow{margin:0;color:var(--bronze);font:9px DM Mono,ui-monospace,monospace;letter-spacing:.2em}#plan-state{margin:0;color:var(--muted);font:10px DM Mono,ui-monospace,monospace;letter-spacing:.1em}#change-list{display:flex;gap:4px;margin:0;padding:9px 20px;list-style:none;overflow-x:auto;scrollbar-width:thin}#change-list li{flex:0 0 auto}#change-list button{display:grid;gap:3px;min-width:54px;padding:5px 8px;border:1px solid var(--line);background:#0c0f15cc;color:var(--muted);font:9px DM Mono,ui-monospace,monospace;letter-spacing:.06em}#change-list button b{font-weight:400;color:var(--ink);font-size:10px}#change-list button.done{border-color:#7fd6a880;color:var(--good)}#change-list button.given{border-color:#f0c05a80;color:var(--caution)}#change-list button[aria-current=true]{border-color:var(--bronze);background:#e8c88429;color:var(--ink)}.planner-body{display:grid;gap:9px;padding:0 20px 16px}.planner-rows{display:grid;grid-template-columns:1fr 1fr;gap:10px}.planner-rows p{margin:0;display:grid;gap:4px;padding:8px 10px;border:1px solid var(--line);background:#0c0f15a8}.planner-rows b{color:var(--ink);font:12px DM Mono,ui-monospace,monospace;font-weight:400;letter-spacing:.1em}.planner-rows b.aim{color:var(--bronze)}#pull-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}#pull-buttons button{display:grid;gap:4px;padding:9px 6px;border:1px solid var(--line);background:#0e1219db;text-align:left}#pull-buttons button:hover:not(:disabled){border-color:var(--bronze);background:#e8c8841f}#pull-buttons button b{color:var(--ink);font:10px DM Mono,ui-monospace,monospace;letter-spacing:.1em;font-weight:400}#pull-buttons button span{color:var(--muted);font:9px DM Mono,ui-monospace,monospace;letter-spacing:.04em}#pull-buttons button svg{display:block;width:100%;height:16px}#pull-buttons button svg path{stroke:#e8c884bf;stroke-width:1.5;fill:none}#plan-line{margin:0;min-height:14px;color:var(--muted);font:10px DM Mono,ui-monospace,monospace;letter-spacing:.08em}#plan-line.ok{color:var(--good)}#plan-line.over{color:var(--bad)}#plan-strip{display:flex;gap:4px;min-height:26px;align-items:center}#plan-strip span{padding:5px 8px;border:1px solid rgba(232,200,132,.34);color:var(--bronze);font:9px DM Mono,ui-monospace,monospace;letter-spacing:.08em}.planner-actions{display:flex;flex-wrap:wrap;gap:7px}.primary,.secondary,.ghost{padding:11px 16px;font:10px DM Mono,ui-monospace,monospace;letter-spacing:.1em}.primary{border:1px solid var(--bronze);background:var(--bronze);color:#150d03;font-weight:700}.primary:hover:not(:disabled){background:#f6dda6}.secondary{border:1px solid var(--line);background:#0c0f15cc;color:var(--muted)}.secondary:hover{color:var(--ink);border-color:var(--bronze)}.ghost{border:1px solid var(--line);background:transparent;color:var(--muted)}.ghost:hover{color:var(--ink);border-color:var(--bronze)}#ring-button{margin-left:auto}#pads{position:fixed;z-index:8;left:0;right:0;bottom:0;display:grid;grid-template-columns:1fr 1.4fr;gap:8px;padding:10px 12px max(10px,env(safe-area-inset-bottom));pointer-events:none}.pad{pointer-events:auto;display:grid;gap:3px;place-content:center;padding:16px 8px;border:1px solid var(--line);background:#0b0e14d1;color:var(--ink);font:13px DM Mono,ui-monospace,monospace;letter-spacing:.18em;touch-action:none;user-select:none;-webkit-user-select:none}.pad small{color:var(--dim);font-size:8px;letter-spacing:.1em}.pad.pull{border-color:#e8c88480}.pad.on{background:#e8c88442;border-color:var(--bronze)}.pad.check.on{background:#7fa8d642;border-color:#7fa8d6}.screen{position:fixed;z-index:12;inset:0;display:flex;align-items:center;justify-content:center;padding:26px;background:#05070bc7;backdrop-filter:blur(6px)}.title-screen{justify-content:space-between;align-items:flex-end;background:linear-gradient(96deg,#05070bf2,#05070b9e 46%,#05070b33)}.title-copy{width:min(600px,100%);padding:20px 0}.title-copy h1{margin:12px 0 14px;font-size:clamp(44px,8.4vw,104px);line-height:.84;letter-spacing:-.045em;font-weight:700}.title-copy h1 span{color:var(--bronze)}.title-copy>p{max-width:500px;color:#cfc2ac;font-size:clamp(12px,1.3vw,15px);line-height:1.55}.title-controls{display:flex;flex-wrap:wrap;gap:7px 16px;margin:20px 0;color:var(--muted);font:10px DM Mono,ui-monospace,monospace}kbd{display:inline-block;border:1px solid rgba(232,200,132,.36);padding:2px 5px;color:var(--ink);font:9px DM Mono,ui-monospace,monospace}.title-buttons{display:flex;flex-wrap:wrap;gap:9px}.title-copy>small{display:block;margin-top:14px;color:var(--dim);font:10px DM Mono,ui-monospace,monospace}.card{width:min(300px,100%);padding:15px;border:1px solid var(--line);background:#0a0d13db}.card>span{color:var(--muted);font:9px DM Mono,ui-monospace,monospace;letter-spacing:.18em}#stage-list{margin:12px 0 0;padding:0;list-style:none;counter-reset:stage}#stage-list li{display:flex;align-items:baseline;gap:9px;padding:7px 0;border-top:1px solid rgba(232,200,132,.1);color:var(--dim);font:10px DM Mono,ui-monospace,monospace}#stage-list li b{flex:1;min-width:0;overflow:hidden;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-weight:400}#stage-list li.open{color:var(--bronze)}#stage-list li.open b{color:var(--ink)}#stage-list li.rung b:after{content:" · rung";color:var(--good)}#stage-list li em{font-style:normal}.modal{background:#04060ad1}.modal-card{width:min(470px,100%);max-height:calc(100vh - 40px);overflow-y:auto;padding:26px;border:1px solid var(--line);background:var(--panel);box-shadow:0 24px 90px #0009}.modal-card h2{margin:11px 0 9px;font-size:30px;line-height:1.02;letter-spacing:-.035em}.modal-card>p{color:var(--muted);font-size:13px;line-height:1.55}.toggle{display:flex;align-items:center;gap:9px;margin:18px 0;color:var(--muted);font:11px DM Mono,ui-monospace,monospace}.toggle input{accent-color:var(--bronze);width:16px;height:16px}.modal-card .primary,.modal-card .secondary,.modal-card .ghost{display:block;width:100%;margin-top:8px}.help-card{width:min(580px,100%)}.help-card dl{display:grid;grid-template-columns:118px 1fr;gap:9px 14px;margin:20px 0}.help-card dt{color:var(--bronze);font:10px DM Mono,ui-monospace,monospace}.help-card dd{margin:0;color:var(--muted);font-size:12px;line-height:1.45}.result-card{width:min(560px,100%)}.result-card.fault{border-color:#ef6a4c80}.result-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:18px 0}.result-stats span{display:grid;gap:5px;padding:9px;border:1px solid var(--line)}.result-stats small{color:var(--muted);font:8px DM Mono,ui-monospace,monospace;letter-spacing:.1em}.result-stats b{color:var(--ink);font:12px DM Mono,ui-monospace,monospace;font-weight:400}.trace-label{margin:0 0 7px;color:var(--dim);font:8px DM Mono,ui-monospace,monospace;letter-spacing:.2em}.trace{display:grid;gap:3px;margin:0 0 20px;padding:0;list-style:none;max-height:168px;overflow-y:auto}.trace li{display:flex;align-items:center;gap:3px;font:8px DM Mono,ui-monospace,monospace}.trace li>b{flex:0 0 42px;color:var(--dim);font-weight:400;letter-spacing:.08em}.trace li i{width:15px;padding:3px 0;text-align:center;font-style:normal;border:1px solid rgba(232,200,132,.14);color:var(--dim)}.trace li i.hit{border-color:#7fd6a873;color:var(--good);background:#12221bcc}.trace li i.miss{border-color:#ef6a4c99;color:var(--bad);background:#2a0f0bd9}.trace li i.given{border-color:#f0c05a66;color:var(--caution)}.result-buttons{display:flex;gap:8px}.result-buttons .primary,.result-buttons .secondary{flex:1;margin-top:0}@media(max-width:860px){#hud{padding:11px 12px}.mark{font-size:9px;gap:8px}.mark i{width:14px;height:14px}.mark small{font-size:8px}.hud-actions button{padding:6px 8px;font-size:9px}#status{top:50px;font-size:9px}#play{bottom:92px;width:calc(100vw - 20px)}.pad{padding:14px 6px;font-size:12px}#stroke-strip li{flex:1 1 0;min-width:0;font-size:10px}#hand-line{font-size:8px}#planner{max-height:62vh}.planner-head{padding:9px 12px 6px}#change-list{padding:7px 12px}.planner-body{padding:0 12px 12px;gap:7px}.planner-rows p{padding:6px 8px}.planner-rows b{font-size:10px;letter-spacing:.04em}#pull-buttons button{padding:7px 5px}#pull-buttons button span{display:none}.planner-actions{gap:5px}.primary,.secondary,.ghost{padding:10px 11px;font-size:9px}#ring-button{margin-left:0;flex:1}.title-screen{align-items:flex-start;background:linear-gradient(180deg,#05070be6,#05070bb8 55%,#05070b80);overflow-y:auto}.title-copy{padding:6px 0 12px}.title-copy h1{font-size:clamp(38px,12vw,66px)}.title-controls{margin:14px 0;gap:6px 12px}.tower-card{display:none}.modal-card{padding:20px}.modal-card h2{font-size:25px}.result-stats{grid-template-columns:repeat(2,1fr)}.help-card dl{grid-template-columns:92px 1fr}}@media(prefers-reduced-motion:reduce){*{transition-duration:.01ms!important}}