.eh .hw-wrap{padding-top:72px;padding-bottom:120px}.eh .hw{--acc:#1f3fbf;--acc-soft:#1f3fbf1a;--bad:#b3261e;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-areas:"modes modes""stage copy""nav nav""foot foot";align-items:start;gap:24px 40px;margin-top:40px;display:grid}.dark .eh .hw{--acc:#7d97ff;--acc-soft:#7d97ff24;--bad:#ff8a80}.eh .hw-modes{flex-wrap:wrap;grid-area:modes;gap:8px;display:flex}.eh .hw-mode{font:inherit;border:1px solid var(--line);color:var(--fg);cursor:pointer;background:0 0;border-radius:999px;padding:8px 16px;font-size:14px}.eh .hw-mode.is-on{background:var(--strong);color:var(--strong-fg);border-color:var(--strong)}.eh .hw-stage{border:1px solid var(--line);background:var(--card);border-radius:16px;grid-area:stage;min-width:0;padding:12px}.eh .hw-svg{width:100%;max-width:100%;height:auto;display:block}.eh .hw-copy{grid-area:copy;min-width:0;min-height:260px}.eh .hw-count{letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0;font-size:12px}.eh .hw-title{font-family:"Inter Tight Variable", var(--font-sans);letter-spacing:-.035em;text-wrap:balance;margin:10px 0 0;font-size:clamp(26px,3.2vw,40px);font-weight:600;line-height:1.05}.eh .hw-text{color:var(--fg);max-width:56ch;margin:16px 0 0;font-size:18px}.eh .hw-text.mono{font-family:var(--font-mono);overflow-wrap:anywhere;font-size:14px;line-height:1.7}.eh .hw-nav{flex-wrap:wrap;grid-area:nav;align-items:center;gap:12px;display:flex}.eh .hw-btn{font:inherit;border:1px solid var(--line);min-width:44px;height:44px;color:var(--fg);cursor:pointer;background:0 0;border-radius:999px;padding:0 14px}.eh .hw-btn:disabled{opacity:.35;cursor:default}.eh .hw-play{margin-left:auto}.eh .hw-dots{gap:6px;display:flex}.eh .hw-dot{cursor:pointer;background:var(--line);border:0;border-radius:3px;width:28px;height:6px;padding:0;transition:background .3s}.eh .hw-dot.is-done{background:var(--muted)}.eh .hw-dot.is-on{background:var(--acc)}.eh .hw-foot{border-top:1px solid var(--line);flex-wrap:wrap;grid-area:foot;gap:12px;padding-top:24px;display:flex}.eh .hw-svg g,.eh .hw-svg line,.eh .hw-svg rect,.eh .hw-svg text{transition:opacity .5s,transform .9s cubic-bezier(.22,.8,.2,1),stroke .4s,fill .4s}.eh .hw-pop{transform-box:fill-box;transform-origin:50%}.eh .hw-ink{fill:var(--fg)}.eh .hw-label-inv{fill:var(--bg);font:600 18px "Inter Tight Variable", var(--font-sans);text-anchor:middle}.eh .hw-cap{fill:var(--muted);font:12px var(--font-mono);text-anchor:middle}.eh .hw-chip{fill:var(--bg);stroke:var(--fg);stroke-width:1px}.eh .hw-chip-v{stroke:var(--acc)}.eh .hw-chip-t{fill:var(--fg);font:10px var(--font-mono);text-anchor:middle}.eh .hw-tag{fill:var(--acc)}.eh .hw-tag-t{fill:#fff;font:600 11px var(--font-mono);text-anchor:middle}.eh .hw-fill-acc{fill:var(--acc)}.eh .hw-box{fill:var(--bg);stroke:var(--fg);stroke-width:1.4px}.eh .hw-box.is-open{stroke:var(--acc);fill:var(--acc-soft);stroke-width:2px}.eh .hw-box-t{fill:var(--fg);font:14px var(--font-mono);text-anchor:middle}.eh .hw-coin{fill:var(--acc)}.eh .hw-coin-t{fill:#fff;font:700 12px var(--font-sans);text-anchor:middle}.eh .hw-board{fill:none;stroke:var(--line);stroke-width:1.4px;stroke-dasharray:4 4}.eh .hw-note{fill:var(--bg);stroke:var(--line);stroke-width:1.2px}.eh .hw-note.is-hit{stroke:var(--acc);stroke-width:2px}.eh .hw-note-t{fill:var(--fg);font:12px var(--font-mono);text-anchor:middle}.eh .hw-edge{stroke:var(--fg);stroke-width:1.4px;stroke-dasharray:3 4}.eh .hw-link{stroke:var(--acc);stroke-width:2px}.eh .hw-bad{stroke:var(--bad);stroke-width:1.6px;stroke-dasharray:5 5}.eh .hw-x{fill:var(--bad);font:700 16px var(--font-sans);text-anchor:middle}.eh .hw-beam{stroke:var(--acc);stroke-width:2px;stroke-dasharray:6 6;animation:1.2s linear infinite hw-dash}.eh .hw-observer{fill:var(--fg);font:500 13px var(--font-mono);text-anchor:middle}@keyframes hw-dash{to{stroke-dashoffset:-24px}}@media (max-width:860px){.eh .hw{grid-template-columns:minmax(0,1fr);grid-template-areas:"modes""stage""copy""nav""foot";gap:20px}.eh .hw-copy{min-height:0}.eh .hw-text{font-size:17px}.eh .hw-dot{width:18px}.eh .hw-play{margin-left:0}.eh .hw-foot .btn{text-align:center;width:100%}}@media (prefers-reduced-motion:reduce){.eh .hw-svg g,.eh .hw-svg line,.eh .hw-svg rect,.eh .hw-svg text{transition:none}.eh .hw-beam{animation:none}}
