:root{--bg: #151412;--panel: #1f1d1a;--panel-2: #2a2723;--ink: #efe9df;--dim: #a39a8c;--line: #3b3630;--accent: #5cc8d6;--mark: #f3d49b;--red: #d8483f;--tall: #c9a36b;--wide: #b98b52;--small: #e0c28f;--good: #7ddf9a;--bad: #ef6b7b}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink)}body{font:15px/1.6 ui-sans-serif,system-ui,-apple-system,Segoe UI,Hiragino Sans,sans-serif}main{max-width:1180px;margin:0 auto;padding:32px 24px 48px}h1{font-size:34px;margin:0 0 8px;letter-spacing:-.01em}h1 span{color:var(--red);font-weight:600;margin-left:6px}.sub{color:var(--dim);max-width:72ch;margin:0 0 24px}.sub strong{color:var(--ink);font-weight:600}.sub strong.red{color:var(--red)}#wrap{display:flex;gap:28px;align-items:flex-start;flex-wrap:wrap}.stage{flex:1 1 460px;min-width:0}.side{flex:0 1 400px;min-width:280px}h3{font-size:12px;text-transform:uppercase;letter-spacing:.14em;color:var(--dim);font-weight:600;margin:0 0 10px}.controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}.sel{color:var(--dim);font-size:13px;display:inline-flex;gap:6px;align-items:center}select,button{font:inherit;font-size:13px;color:var(--ink);background:var(--panel-2);border:1px solid var(--line);border-radius:8px;padding:5px 10px;cursor:pointer}button:hover,select:hover{border-color:var(--dim)}button:disabled{opacity:.4;cursor:default}button.primary{background:var(--red);color:#fff5f0;border-color:var(--red);font-weight:600}#boardwrap{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px;max-width:470px}#board{width:100%;height:auto;display:block;-webkit-user-select:none;user-select:none}#board .dot{fill:var(--ink)}#board .ln{stroke-width:7;stroke-linecap:round}#board .ln.pre{stroke:var(--dim)}#board .ln.A{stroke:var(--red)}#board .ln.B{stroke:var(--accent)}#board .ln.last{filter:drop-shadow(0 0 5px rgba(243,212,155,.9))}#board .box.A{fill:#d8483f47}#board .box.B{fill:#5cc8d63d}#board .boxl{font:700 30px ui-sans-serif,system-ui,sans-serif;text-anchor:middle;fill:var(--ink);opacity:.85;pointer-events:none}#board .open .hit{stroke:transparent;stroke-width:26}#board .open .ghost{stroke:var(--line);stroke-width:3;stroke-dasharray:3 7;stroke-linecap:round;pointer-events:none}#board .open.live{cursor:pointer}#board .open.live:hover .ghost{stroke:var(--mark);stroke-width:6;stroke-dasharray:none}#board .open.hint .ghost{stroke:var(--mark);stroke-width:6;stroke-dasharray:6 5}#board .pill{fill:var(--panel-2);stroke:var(--line);stroke-width:1.5;pointer-events:none}#board .open.good .pill{stroke:var(--good)}#board .val{font:600 13px ui-monospace,SFMono-Regular,Menlo,monospace;text-anchor:middle;fill:var(--bad);pointer-events:none}#board .open.good .val{fill:var(--good)}#status{min-height:26px;margin-top:10px;color:var(--dim)}#status.good{color:var(--good)}#status.bad{color:var(--bad)}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin-bottom:18px}.panel dl{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:0}.panel dt{color:var(--dim)}.panel dd{margin:0;font-variant-numeric:tabular-nums}.panel .note{color:var(--dim);font-size:13px;margin:10px 0 0}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.metric{text-align:center}.metric .n{font-size:34px;font-weight:700;line-height:1.1;font-variant-numeric:tabular-nums}.metric .l{color:var(--dim);font-size:12px;text-transform:uppercase;letter-spacing:.1em}.metric .d{font-size:12px;min-height:18px;font-variant-numeric:tabular-nums}.metric .n.dim{color:var(--dim)}.metric.pa .n{color:var(--red)}.metric.pb .n{color:var(--accent)}.metric.active{outline:2px solid var(--line);border-radius:10px}.panel p{margin:0}.chk input{accent-color:var(--accent)}.d.good{color:var(--good)}.d.bad{color:var(--bad)}.d.flat{color:var(--dim)}#trace{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;color:var(--dim);min-height:48px;max-height:190px;overflow:auto}#trace .mv{display:inline-block;white-space:nowrap;margin-right:12px}#trace .mv.empty{white-space:normal}#trace .mv b{color:var(--ink);font-weight:500}.mini{display:block;margin:8px 0 0}.notes{margin-top:40px;max-width:920px}.notes h2{font-size:20px;margin:32px 0 10px}.notes p{color:#d6cec2}.notes code{color:var(--mark)}.notes table{border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums;margin:12px 0}.notes th,.notes td{padding:3px 10px;border-bottom:1px solid var(--line);text-align:right}.notes th{color:var(--dim);font-weight:600}.notes td.l,.notes th.l{text-align:left}.notes td.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;text-align:left}.ok{color:var(--good)}.no{color:var(--bad)}footer{margin-top:48px;color:var(--dim);font-size:13px}a{color:var(--accent)}
