:root{--bg:#c6cbc4;--panel:#edefea;--closed:#94a28f;--closed-hi:#a6b3a1;--open:#f8f9f6;--ink:#141613;--soft:#5f675c;--rule:#7c8878;--human:#c24a2c;--agent:#3f35b8;--disp:"Anton",system-ui,sans-serif;--ui:"Chivo",system-ui,sans-serif;--mono:"DM Mono",ui-monospace,monospace;--n1:#2a3fb8;--n2:#1f6b40;--n3:#b33a1e;--n4:#5b2e8a;--n5:#8a4a16;--n6:#166069;--n7:#141613;--n8:#5f675c;--cell:38px;--slot:52px;--dw:15px;--d0:18px;--board:580px}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);font-family:var(--ui);-webkit-font-smoothing:antialiased;flex-direction:column;height:100dvh;min-height:100vh;margin:0;font-size:15px;display:flex;overflow:hidden}.picker{z-index:50;background:#141613d1;justify-content:center;align-items:center;padding:20px;display:none;position:fixed;inset:0}.picker-card{background:var(--panel);border:3px solid var(--ink);text-align:center;max-width:420px;padding:24px 26px}.picker-card h2{font-family:var(--disp);letter-spacing:.03em;text-transform:uppercase;margin:0 0 10px;font-size:22px}.picker-card p{color:var(--soft);margin:0 0 18px;font-size:13.5px;line-height:1.55}.picker-card .tag.h{color:var(--human)}.picker-card .tag.a{color:var(--agent)}.ready-status{font-family:var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--soft);border:2px dashed var(--rule);margin:0 0 16px;padding:8px 10px;font-size:11px}.ready-status.on{color:var(--agent);border-color:var(--agent);border-style:solid}.ready-esc{color:var(--soft);margin:14px 0 0!important;font-size:11px!important}.bar{border-bottom:3px solid var(--ink);background:var(--panel);flex-wrap:wrap;align-items:center;gap:13px;padding:9px 18px;display:flex}.bar h1{font-family:var(--disp);letter-spacing:.03em;text-transform:uppercase;margin:0;font-size:23px}.pill{font-family:var(--mono);letter-spacing:.09em;text-transform:uppercase;border:1.5px solid;padding:3px 8px;font-size:10px}.pill.on{color:var(--agent)}.pill.off{color:var(--soft)}.pill.on.idle{color:var(--human)}.bar .spacer{flex:1}.mode{font-family:var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--soft);align-items:center;gap:6px;font-size:9.5px;display:flex}.mode[hidden]{display:none}.mode select{font-family:var(--mono);letter-spacing:.05em;border:1.5px solid var(--rule);background:var(--panel);color:var(--ink);cursor:pointer;padding:3px 5px;font-size:10px}.mode select:focus-visible{outline:2px solid var(--agent);outline-offset:1px}.score{font-family:var(--mono);letter-spacing:.06em;align-items:center;gap:9px;font-size:10.5px;display:flex}.score b{font-family:var(--disp);letter-spacing:.02em;font-size:26px;line-height:1}.score .h b{color:var(--human)}.score .a b{color:var(--agent)}.score .sep{color:var(--rule)}.wrap{flex:1;grid-template-columns:minmax(0,1fr) minmax(210px,330px);min-height:0;display:grid}.arena{border-right:3px solid var(--ink);flex-direction:column;align-items:center;gap:14px;min-width:0;min-height:0;padding:20px 18px 40px;display:flex;overflow-y:auto}.tabs{border:3px solid var(--ink);width:min(100%,var(--board));display:flex}.tabs button{font-family:var(--disp);letter-spacing:.05em;text-transform:uppercase;border:0;border-right:3px solid var(--ink);background:var(--panel);color:var(--ink);cursor:pointer;flex:1;padding:9px 6px;font-size:15px}.tabs button:last-child{border-right:0}.tabs button.on{background:var(--ink);color:var(--panel)}.tabs button:focus-visible{outline:3px solid var(--agent);outline-offset:-3px}.turn{width:min(100%,var(--board));border:3px solid var(--ink);background:var(--panel);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:9px 15px;display:flex}.turn .who{font-family:var(--disp);letter-spacing:.02em;text-transform:uppercase;font-size:20px}.turn.h{background:var(--human);color:#fff}.turn.a{background:var(--agent);color:#fff}.turn.over{background:var(--ink);color:var(--panel)}.turn .hint{font-family:var(--mono);opacity:.92;text-align:right;font-size:11px}.roundline{width:min(100%,var(--board));font-family:var(--mono);letter-spacing:.04em;color:var(--ink);flex-wrap:wrap;justify-content:space-between;gap:10px;margin-top:-6px;font-size:12px;display:flex}.roundline b{color:var(--ink)}.roundline .tag{font-weight:700}.roundline .tag.h{color:var(--human)}.roundline .tag.a{color:var(--agent)}.acts{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.acts button{font-family:var(--ui);border:2.5px solid var(--ink);color:var(--ink);cursor:pointer;background:0 0;padding:8px 13px;font-size:13px;font-weight:700}.acts button:hover:not(:disabled){background:var(--ink);color:var(--panel)}.acts button.on{background:var(--human);border-color:var(--human);color:#fff}.acts button:disabled{opacity:.32;cursor:not-allowed}.acts button:focus-visible{outline:3px solid var(--agent);outline-offset:2px}#msGrid{background:var(--ink);border:3px solid var(--ink);gap:3px;padding:3px;display:grid}.ms{width:var(--cell);height:var(--cell);cursor:pointer;background:var(--closed);font-family:var(--mono);font-size:calc(var(--cell) * .45);color:var(--ink);border:0;justify-content:center;align-items:center;padding:0;font-weight:500;display:flex;position:relative;box-shadow:inset 2px 2px #ffffff57,inset -2px -2px #0003}.ms:hover:not(.open):not(.taken){background:var(--closed-hi)}.ms:focus-visible{outline-offset:-3px;z-index:2;outline:3px solid #fff}.ms.open{background:var(--open);box-shadow:none;cursor:default}.ms.taken{cursor:default;color:#fff;font-size:calc(var(--cell) * .42);box-shadow:inset 0 0 0 2px #00000038}.ms.taken.byh{background:var(--human)}.ms.taken.bya{background:var(--agent)}.ms.flag{color:var(--human);font-size:calc(var(--cell) * .47)}.ms.boom{background:var(--ink);color:#fff}.ms.shown{background:var(--closed);color:var(--ink);opacity:.72}.board-claim .ms:not(.open):not(.taken){cursor:crosshair;box-shadow:inset 0 0 0 2px var(--human), inset 2px 2px 0 #fff3}.n1{color:var(--n1)}.n2{color:var(--n2)}.n3{color:var(--n3)}.n4{color:var(--n4)}.n5{color:var(--n5)}.n6{color:var(--n6)}.n7{color:var(--n7)}.n8{color:var(--n8)}#c4Grid{background:var(--agent);border:3px solid var(--ink);gap:6px;padding:7px;display:grid}.c4{width:var(--slot);height:var(--slot);background:var(--panel);cursor:pointer;border:0;border-radius:50%;padding:0;box-shadow:inset 0 3px 6px #00000047}.c4.dead{cursor:default}.c4:hover:not(.dead){background:#fff}.c4:focus-visible{outline-offset:-3px;outline:3px solid #fff}.c4.h{background:var(--human);box-shadow:inset 0 -3px #00000038}.c4.a{background:var(--ink);box-shadow:inset 0 -3px #0000004d}.c4.win{outline-offset:-4px;outline:4px solid #f2d64b}#hanoiBoards{flex-direction:column;align-items:center;gap:12px;display:flex}.hanoi-row{flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:34px;max-width:100%;display:flex}.hanoi-side h3{font-family:var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--soft);margin:0 0 8px;font-size:10.5px;font-weight:700}.hanoi-board{background:var(--open);border:3px solid var(--ink);gap:10px;padding:12px 12px 0;display:flex}.peg{width:calc(var(--d0) + var(--dw) * 5 + 25px);height:calc(var(--dw) * 8 + 30px);cursor:pointer;background:0 0;border:0;flex-direction:column;justify-content:flex-end;align-items:center;padding:0;display:flex;position:relative}div.peg{cursor:default}.peg:before{content:"";background:var(--rule);width:8px;height:calc(100% - 38px);position:absolute;bottom:22px;left:50%;transform:translate(-50%)}.peg .discs{flex-direction:column-reverse;align-items:center;gap:2px;padding-bottom:2px;display:flex;position:relative}.peg .base{background:var(--ink);width:100%;height:7px}.peg .pegno{font-family:var(--mono);color:var(--soft);padding:3px 0 6px;font-size:10px}.disc{height:calc(var(--dw) + 4px);border:2px solid var(--ink);background:var(--human);border-radius:3px;justify-content:center;align-items:center;display:flex;position:relative}.disc b{font-family:var(--mono);color:#fff;font-size:10px;font-weight:700}.d1{background:#c24a2c}.d2{background:#d98324}.d3{background:#7c8878}.d4{background:#3f35b8}.d5{background:#141613}button.peg:hover:not(:disabled) .base{background:var(--human)}.peg:focus-visible{outline:3px solid var(--agent);outline-offset:2px}.peg.picked .base{background:var(--human);height:11px}.peg.picked .discs .disc:last-child{transform:translateY(-9px);box-shadow:0 3px #00000040}.peg.target:after{content:"";border:3px dashed var(--human);pointer-events:none;position:absolute;inset:0}.peg.done:after{content:"";pointer-events:none;border:3px solid #2e7d32;position:absolute;inset:0}.hanoi-clock{text-align:center;font-family:var(--mono);color:var(--ink);border-top:2px solid var(--ink);align-self:stretch;padding-top:8px;font-size:13px}#pongCanvas{width:min(100%,var(--board));aspect-ratio:480/300;border:3px solid var(--ink);background:var(--panel);touch-action:none;height:auto;display:block}#pongCanvas:focus-visible{outline:3px solid var(--agent);outline-offset:3px}.rail{background:var(--panel);flex-direction:column;min-width:0;min-height:0;display:flex;overflow:hidden}.sec>h2{border-bottom:2px solid var(--ink);font-family:var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--ink);justify-content:space-between;margin:0;padding:10px 15px 8px;font-size:10.5px;font-weight:700;display:flex}#rulesSec{background:var(--panel);flex:0 auto;overflow-y:auto}.rail.solo{background:0 0}#rules{border-bottom:2px solid var(--ink);padding:12px 15px 14px;font-size:14px;line-height:1.6}#rules ul{margin:6px 0 0;padding-left:17px}#rules li{margin-bottom:4px}#rules li::marker{color:var(--human);font-weight:700}#logSec{flex-direction:column;flex:1 1 0;min-height:118px;display:flex}.say{border-bottom:2px solid var(--ink);background:#e4e7e0;padding:9px 15px 11px}.say-h{align-items:center;gap:8px;display:flex}.say-toggle{cursor:pointer;text-align:left;font-family:var(--mono);letter-spacing:.11em;text-transform:uppercase;color:var(--soft);background:0 0;border:0;flex:1;align-items:center;gap:6px;padding:0;font-size:9.5px;font-weight:700;display:flex}.say-toggle:before{content:"-";color:var(--rule);font-size:12px;line-height:1}.say.shut .say-toggle:before{content:"+"}.say-toggle:hover{color:var(--ink)}.say-toggle:focus-visible{outline:2px solid var(--agent);outline-offset:2px}#sayCopy{font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;border:1.5px solid var(--rule);color:var(--soft);cursor:pointer;background:0 0;padding:2px 7px;font-size:9.5px}#sayCopy:hover{border-color:var(--agent);color:var(--agent)}#sayCopy.done{border-color:var(--agent);color:#fff;background:var(--agent)}#sayCopy:focus-visible{outline:2px solid var(--agent);outline-offset:1px}.say p{font-family:var(--mono);color:var(--ink);cursor:text;margin:6px 0 0;font-size:11px;line-height:1.55}.say.shut{padding-bottom:8px}.say.shut p{display:none}.tabs button{position:relative}.tabs button:after{pointer-events:none}@media (hover:hover) and (width>=661px){.tabs button[data-tip]:hover:after,.tabs button[data-tip]:focus-visible:after{content:attr(data-tip);z-index:30;background:var(--ink);width:max-content;max-width:min(260px,42vw);color:var(--panel);border:2px solid var(--ink);font-family:var(--mono);letter-spacing:.02em;text-transform:none;text-align:left;pointer-events:none;white-space:normal;padding:6px 9px;font-size:10.5px;line-height:1.45;position:absolute;top:calc(100% + 7px);left:50%;transform:translate(-50%)}}.metrics{font-family:var(--mono);color:var(--soft);border-bottom:2px solid var(--ink);padding:7px 15px 8px;font-size:10.5px}#log{flex:1;min-height:0;overflow-y:auto}.ev{border-bottom:1px solid var(--rule);font-family:var(--mono);padding:7px 15px;font-size:11px;line-height:1.5}.ev .n{color:var(--agent);font-weight:500}.ev.sys{border-left:3px solid var(--rule);background:#e4e7e0}.ev.sys .n{color:var(--soft);text-transform:uppercase;letter-spacing:.06em;font-size:10px}.ev.sys .r{color:var(--soft)}.ev .t{float:right;color:var(--soft);font-size:9.5px}.ev .r{color:var(--soft);word-break:break-word;margin-top:2px;display:block}.ev.rej .n{color:var(--human)}.turn .hint.warn{color:#fff;background:var(--human);padding:2px 7px;font-weight:700}.blank{font-family:var(--mono);color:var(--soft);padding:15px;font-size:11px;line-height:1.7}.blank code{background:#dde1da;padding:1px 4px}@media (width<=1060px){:root{--cell:33px;--slot:42px;--dw:11px;--d0:14px}.hanoi-row{gap:18px}.arena{gap:12px;padding:16px 14px 24px}}@media (width<=860px){:root{--cell:29px;--slot:37px;--dw:9px;--d0:12px}.bar{gap:9px;padding:7px 12px}.bar h1{font-size:20px}.score b{font-size:21px}.tabs button{letter-spacing:.02em;padding:8px 3px;font-size:12.5px}.turn{padding:7px 11px}.turn .who{font-size:17px}.turn .hint{font-size:10px}.arena{gap:10px;padding:13px 10px 20px}.hanoi-row{gap:13px}#rules{padding:10px 13px 12px;font-size:13px}.say{padding:8px 13px 9px}.say p{font-size:10.5px}}@media (width<=660px){body{height:auto;overflow:visible}.arena,.rail{overflow:visible}.wrap{grid-template-columns:1fr}.arena{border-right:0;border-bottom:3px solid var(--ink)}#logSec{order:-1}#rulesSec{max-height:none}#log{max-height:240px}}@media (height<=700px){:root{--cell:32px;--slot:40px;--dw:10px;--d0:13px;--board:520px}.arena{gap:10px;padding:14px 14px 16px}}@media (height<=580px){:root{--cell:27px;--slot:34px;--dw:8px;--d0:11px;--board:460px}.arena{gap:8px}.tabs button{padding:6px 4px}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}