:root{--paper:#050505;--panel:#050505;--ink:#f4f4ef;--muted:#a6aca8;--line:rgba(244,244,239,.22);--teal:#31ee8a;--board:#0b0e0c;--grid:#454f48;--sans:"Helvetica Neue",Helvetica,Arial,"PingFang SC","Microsoft YaHei",sans-serif;--display:"Arial Narrow","Helvetica Neue",Helvetica,Arial,sans-serif;--ease:cubic-bezier(.16,1,.3,1);color-scheme:dark;--pad:clamp(20px,3.2vw,48px);--aside:320px;--gap:44px;--board-size:clamp(320px,calc(100vh - 286px),640px);--main:calc(var(--board-size) + var(--aside) + var(--gap) + 2 * var(--pad))}
@supports(height:100svh){:root{--board-size:clamp(320px,calc(100svh - 286px),640px)}}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.6 var(--sans)}
[hidden]{display:none!important}
button,input,select{font:inherit}
button{cursor:pointer;color:inherit}
button:disabled{opacity:.38;cursor:not-allowed}
button:focus-visible,a:focus-visible,input:focus-visible,[role=button]:focus-visible{outline:2px solid var(--teal);outline-offset:4px}
::selection{background:var(--teal);color:var(--paper)}

/* Masthead */
header{height:72px;padding:0 max(var(--pad),calc((100% - var(--main)) / 2 + var(--pad)));display:flex;align-items:center;border-bottom:1px solid var(--line);gap:16px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;min-height:44px}
.brand strong{font:900 18px/1 var(--display);letter-spacing:-.03em;text-transform:uppercase;white-space:nowrap}
.brand strong span{font-weight:400;color:#a6aca8;margin:0 5px}
.brand-mark,.ai-symbol{width:22px;height:22px;display:grid;grid-template-columns:1fr 1fr;gap:4px;flex-shrink:0}
.brand-mark i,.ai-symbol i{background:var(--teal);border-radius:0}
.brand-mark i:last-child,.ai-symbol i:last-child{opacity:.35}
.connection{margin-left:auto;font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px}
.connection>i{width:5px;height:5px;border-radius:50%;background:var(--teal)}
.language-button{background:transparent;border:1px solid var(--line);border-radius:0;padding:0 10px;min-height:44px;min-width:48px;white-space:nowrap;flex-shrink:0;color:var(--teal);font-size:12px}
.language-button:hover{border-color:var(--teal);background:var(--teal);color:var(--paper)}
.primary{border:0;background:transparent;color:var(--ink);padding:0;min-height:44px;border-radius:0;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:12px;white-space:nowrap}
.primary:hover{background:transparent}.primary svg{width:44px;height:44px;padding:12px;border:1px solid var(--teal);color:var(--teal);transition:background-color 220ms var(--ease),color 220ms var(--ease),transform 220ms var(--ease)}.primary:hover svg{background:var(--teal);color:var(--paper);transform:translateX(3px)}.primary:not(:has(svg)){border:1px solid var(--teal);padding:0 14px;color:var(--teal)}.primary:not(:has(svg)):hover{background:var(--teal);color:var(--paper)}
button svg{height:18px;width:18px;fill:none;stroke:currentColor;stroke-width:1.5}
.text-button{position:relative;background:none;border:0;padding:0 2px;min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;color:var(--ink);font-size:13px}
.text-button:after{content:"";position:absolute;bottom:8px;left:2px;right:2px;height:1px;background:var(--teal);transform:scaleX(0);transform-origin:right;transition:transform 220ms var(--ease)}.text-button:hover:not(:disabled):after,.text-button:focus-visible:after{transform:scaleX(1);transform-origin:left}

/* Heading + difficulty */
main{max-width:var(--main);padding:0 var(--pad);margin:auto}
.page-heading{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;padding:18px 0 14px}
h1{font:500 clamp(1.45rem,2.15vw,2.2rem)/1.08 var(--sans);margin:0;letter-spacing:-.03em}
h1 span{color:var(--muted)}
.page-heading p{margin:2px 0 0;color:var(--muted);font-size:13px}
.difficulty-picker{display:grid;grid-template-columns:auto 172px minmax(0,236px);grid-template-rows:auto auto;column-gap:12px;align-items:center}
.difficulty-picker label{grid-row:1/3;font-size:12px;color:var(--muted)}
.difficulty-picker select{grid-row:1/3;grid-column:2;appearance:none;-webkit-appearance:none;height:44px;width:100%;padding:0 34px 0 12px;background:#050505 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2331ee8a' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 12px center/12px 8px;border:1px solid #58625b;color:var(--ink);border-radius:0;font:14px var(--sans);cursor:pointer}
.difficulty-picker select:hover:not(:disabled){border-color:var(--teal)}
.difficulty-picker select:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
.difficulty-picker select:disabled{color:#a6aca8;cursor:not-allowed;border-style:dashed;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23a6aca8' stroke-width='1.5'/%3E%3C/svg%3E")}
.difficulty-picker>span{grid-column:3;grid-row:1;align-self:end;font-size:11px;color:var(--muted);line-height:1.5}
#difficulty-note{grid-column:3;grid-row:2;align-self:start;margin:1px 0 0;font-size:12px;line-height:1.5;color:#a6aca8}

/* Workspace */
.workspace{display:grid;grid-template-columns:minmax(0,var(--board-size)) minmax(0,var(--aside));grid-template-rows:auto 1fr;grid-template-areas:"play aside" "history aside";column-gap:var(--gap)}
.play-area{grid-area:play;min-width:0}
aside{grid-area:aside;min-width:0;border-left:1px solid var(--line);padding-left:28px}
.history{grid-area:history;min-width:0;align-self:start}

/* Players toolbar */
.board-toolbar{display:flex;align-items:center;justify-content:space-between;padding:0 0 8px;gap:10px;min-height:52px}
.players{display:flex;align-items:center;gap:10px;min-width:0}
.players>span{display:flex;align-items:center;gap:7px;height:32px;padding:0 10px;border:0;border-bottom:1px solid var(--line);white-space:nowrap}
.players small{color:var(--muted);font-size:12px}
.players b{font-size:11px;color:#a6aca8;font-weight:400;letter-spacing:.1em}
.players .ai-player{color:var(--teal);background:transparent;border-color:var(--teal)}
.ai-symbol{width:14px;height:14px;gap:3px}
.ai-player small{color:#a6aca8}
.thinking .players .ai-player{border-color:var(--teal);background:#0f1b13}
.thinking .ai-symbol i{animation:scan 1.2s steps(1) infinite}
.thinking .ai-symbol i:nth-child(2){animation-delay:.3s}
.thinking .ai-symbol i:nth-child(4){animation-delay:.6s}
.thinking .ai-symbol i:nth-child(3){animation-delay:.9s}
.ai-player #opponent-name{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stone-dot{width:14px;height:14px;border-radius:50%;display:inline-block;flex-shrink:0}
.black{background:var(--paper);border:1px solid var(--muted)}
.toggle{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:12px;color:var(--muted);min-height:44px;position:relative;white-space:nowrap}
.toggle input{position:absolute;opacity:0;width:1px;height:1px}
.switch{width:28px;height:16px;background:#3f4942;border-radius:0;padding:3px;flex-shrink:0}
.switch:after{content:'';display:block;width:10px;height:10px;background:#050505;border-radius:0;transition:transform 220ms var(--ease)}
.toggle input:checked+.switch{background:var(--teal)}
.toggle input:checked+.switch:after{transform:translateX(12px)}
.toggle input:focus-visible+.switch{outline:2px solid var(--teal);outline-offset:3px}

/* Board */
.board-shell{position:relative;background:var(--board);padding:28px;width:100%;box-shadow:none}
body:has(#live:enabled) .board-shell{box-shadow:inset 0 0 0 1px var(--teal)}
.corner{position:absolute;width:13px;height:13px;border-color:#31ee8a;border-style:solid;pointer-events:none}
.corner.a{top:0;left:0;border-width:1px 0 0 1px}
.corner.b{top:0;right:0;border-width:1px 1px 0 0}
.corner.c{bottom:0;left:0;border-width:0 0 1px 1px}
.corner.d{bottom:0;right:0;border-width:0 1px 1px 0}
#board{aspect-ratio:1;position:relative;width:100%;touch-action:manipulation;background-image:linear-gradient(to right,var(--grid) 1px,transparent 1px),linear-gradient(to bottom,var(--grid) 1px,transparent 1px);background-size:calc(100% / 14) calc(100% / 14);border-right:1px solid var(--grid);border-bottom:1px solid var(--grid);margin:5px 0}
.cell{position:absolute;width:6.4%;height:6.4%;transform:translate(-50%,-50%);border:0;background:transparent;border-radius:50%;padding:0;display:flex;align-items:center;justify-content:center;z-index:2}
.cell[aria-disabled=true]:not([data-stone]){cursor:default}
.cell:focus-visible{outline-offset:2px;z-index:3}
@media(hover:hover){
.cell[aria-disabled=false]:not([data-stone]):not(.heat):hover{background:#f4f4ef16;border:1px solid #f4f4ef66}
.cell[aria-disabled=false].heat:hover{border-color:var(--teal)}
}
.cell[data-stone]{box-shadow:none;cursor:default}
.cell[data-stone="1"]{background:var(--paper);border:1px solid #a6aca8;color:var(--ink)}
.cell[data-stone="2"]{background:var(--ink);color:var(--paper)}
.cell.last:after{content:'';width:5px;height:5px;background:currentColor;border-radius:50%}
.cell[data-stone="2"].last:after{width:3px;height:3px;border-radius:0;box-shadow:4px 0 currentColor,0 4px currentColor,4px 4px #05050566;transform:translate(-2px,-2px)}
.cell.won{outline:3px solid var(--teal);outline-offset:2px}
.cell.heat{background:rgba(49,238,138,var(--p));border:1px solid #31ee8a55;color:#f4f4ef;font-size:12px;font-weight:600;border-radius:0;font-variant-numeric:tabular-nums}
.cell.selected{outline:2px solid var(--teal);outline-offset:3px;z-index:3}
.cell.heat.selected{border-color:#f4f4ef}
.axis{position:absolute;font:11px/1 var(--sans);color:#a6aca8;transform:translate(-50%,-50%);pointer-events:none}
.axis.col{top:-18px}
.axis.row{left:-18px}
.star{position:absolute;width:4px;height:4px;background:#a6aca8;transform:translate(-50%,-50%);border-radius:50%}

/* Status, result, failure */
.board-bottom{display:flex;align-items:center;justify-content:space-between;padding:4px 0;gap:10px;min-height:52px}
.status-line{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:12px;min-width:0}
#status{font-size:13px}
#status:before{content:'';display:inline-block;width:6px;height:6px;background:var(--teal);border-radius:50%;margin-right:8px;vertical-align:2px}
.thinking #status:before{animation:pulse 1s infinite}
#thinking-clock{color:var(--teal);font-size:12px;font-variant-numeric:tabular-nums}
#undo{flex-shrink:0}
.outcome{display:flex;align-items:center;gap:14px;padding:12px 14px 12px 16px;margin:2px 0 14px;border:1px solid var(--teal);background:transparent;scroll-margin:20px;animation:rise .24s var(--ease)}
.outcome-text{min-width:0;flex:1 1 200px}
.outcome h2{font-size:22px;line-height:1.3;color:var(--teal)}
.outcome p{font-size:12px;color:#a6aca8;margin:2px 0 0}
.outcome .primary{margin-left:auto;white-space:nowrap}
.outcome[data-winner="2"]{border-color:var(--muted);background:transparent}
.outcome[data-winner="2"] h2{color:#f4f4ef}
.outcome[data-winner="2"] .result-symbol svg{stroke:#f4f4ef}
.outcome[data-winner="0"]{border-color:var(--muted);background:transparent}
.outcome[data-winner="0"] h2{color:var(--ink)}
.result-symbol{height:32px;width:32px;flex-shrink:0}
.result-symbol svg{stroke:var(--teal);stroke-width:2;fill:none}
.failure{background:transparent;border:1px solid var(--muted);padding:10px 14px;color:var(--ink);margin:2px 0 10px;font-size:13px}
.failure p{margin:0}
.retry{margin:0 0 14px}

/* Decision panel */
.panel-title{display:flex;justify-content:space-between;align-items:baseline;gap:8px;min-height:30px}
h2{font-size:18px;font-weight:500;margin:0}
.panel-title>span{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.panel-description{font-size:12px;color:var(--muted);margin:0 0 10px}
.ai-display{position:relative;background:transparent;border:1px solid var(--line);padding:6px 10px 8px}
.ai-display:before,.ai-display:after{content:'';position:absolute;width:9px;height:9px;border:solid #31ee8a;pointer-events:none}
.ai-display:before{top:-1px;left:-1px;border-width:1px 0 0 1px}
.ai-display:after{bottom:-1px;right:-1px;border-width:0 1px 1px 0}
#decision-map{display:block;width:100%;height:auto;max-height:168px;overflow:visible}
#decision-map:not(:has([data-map])){max-height:116px}
.core-ring{stroke:#31ee8a;stroke-width:1;stroke-dasharray:4 5;fill:#0b0e0c;transform-origin:140px 89px}
.core{fill:var(--teal)}
.thinking .core-ring{animation:orbit 8s linear infinite}
.thinking .core{animation:pulse 1.2s ease-in-out infinite}
.link{stroke:#607368}
.chosen-link{stroke:var(--teal)}
.map-node circle{fill:#0b0e0c;stroke:#a6aca8;stroke-width:1}
.map-chosen circle{fill:var(--teal);stroke:var(--teal)}
.map-node text{fill:#f4f4ef;font:500 12px var(--sans);paint-order:stroke;stroke:var(--panel);stroke-width:4px;stroke-linejoin:round}
.map-chosen text{fill:var(--teal)}
.map-node[role=button]{cursor:pointer}
.map-node[role=button]:hover circle,.map-active circle,.map-node:focus-visible circle{stroke:#f4f4ef;stroke-width:2}
.map-active text{fill:#f4f4ef}
.model-readout{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:#a6aca8;font-variant-numeric:tabular-nums}
.model-readout span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.decision-summary{padding:10px 0;display:flex;gap:12px;align-items:center;border-bottom:1px solid var(--line)}
.decision-summary>span:first-child{font-size:12px;color:var(--muted);white-space:nowrap}
#chosen{font-size:29px;line-height:1.2;font-weight:500;color:var(--teal);font-variant-numeric:tabular-nums;letter-spacing:-.03em}
#chosen-note{font-size:11px;color:var(--muted);margin-left:auto;text-align:right}
.ranking-title{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:12px 0 4px}
h3{font-size:13px;font-weight:500;margin:0}
.ranking-title>span{font-size:12px;color:var(--muted)}
#ranking{max-height:244px;overflow:auto;scrollbar-color:#607368 var(--paper)}
.rank{width:100%;min-height:40px;display:grid;grid-template-columns:22px 38px minmax(0,1fr) 50px;align-items:center;gap:7px;padding:4px;border:0;background:none;text-align:left;border-radius:0}
.rank:hover{background:#31ee8a12}.rank.active{background:var(--teal);color:var(--paper)}.rank.active .coord,.rank.active .number{color:var(--paper)}.rank.active .bar{background:#05050530}.rank.active .bar i{background:var(--paper)}

.rank:focus-visible{outline-offset:-2px}
.rank .number{color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}
.rank .coord{font-size:13px;font-weight:500;font-variant-numeric:tabular-nums}
.bar{height:4px;background:#28382e;border-radius:0;overflow:hidden}
.bar i{display:block;height:100%;background:var(--teal)}
.prob{font-size:12px;text-align:right;font-variant-numeric:tabular-nums}
.order-label{color:var(--muted);font-size:12px}
.rank:has(.order-label){grid-template-columns:22px 38px minmax(0,1fr) max-content}
#all-candidates{font-size:12px}
.hint{font-size:12px;color:var(--muted);margin:4px 0 12px}
.confidence{padding:12px 0;border-top:1px solid var(--line)}
.confidence>div:first-child{display:flex;justify-content:space-between;font-size:12px}
.confidence strong{font-weight:500;font-variant-numeric:tabular-nums}
.confidence-track{height:3px;background:#28382e;margin-top:8px}
.confidence-track span{height:100%;display:block;background:var(--teal);width:0}
.confidence p{font-size:12px;color:var(--muted);margin:6px 0 0}
.reading{border-top:1px solid var(--line);padding-top:12px}
.reading h3{display:flex;justify-content:space-between;gap:8px}
.reading h3 span{font-size:12px;color:var(--muted);font-weight:400}
.reading p{font-size:12px;line-height:1.7;color:var(--muted);margin:6px 0 12px}
#assistance-note{border-left:1px solid var(--teal);padding:4px 0 4px 10px;margin:0 0 10px;color:#a6aca8;line-height:1.65;font-variant-numeric:tabular-nums}
.data-note{display:flex;gap:9px;padding:6px 0 0}
.small-dot{width:4px;height:4px;border-radius:50%;background:var(--teal);flex-shrink:0;margin-top:8px}
.data-note p{font-size:11px;color:var(--muted);margin:0;line-height:1.8}
.data-note strong{font-weight:500;color:#f4f4ef}

/* Replay + timing */
.replay{border-top:1px solid var(--line);padding-top:6px;margin-top:6px}
.replay-top{display:flex;gap:12px;align-items:center;min-height:44px}
.replay-top strong{font-size:13px;font-weight:500;white-space:nowrap}
#move-count{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
#live{margin-left:auto;white-space:nowrap}
.scrubber{display:flex;align-items:center;gap:12px}
.scrubber button{border:1px solid var(--line);background:transparent;border-radius:0;width:40px;height:40px;display:grid;place-items:center;flex-shrink:0;color:var(--ink)}
.scrubber button:hover:not(:disabled){border-color:var(--teal);color:var(--teal)}
input[type=range]{flex:1;min-width:0;width:100%;height:28px;margin:0;accent-color:var(--teal);cursor:pointer}
input[type=range]:disabled{cursor:not-allowed;opacity:.5}
.replay-caption{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;margin:4px 52px 0;gap:12px}
.replay-caption span:last-child{text-align:right}
.timing-section{border-top:1px solid var(--line);margin-top:14px;padding-top:4px}
.timing-title{display:flex;align-items:center;justify-content:space-between;gap:10px}
.timing-title h3 span{font-size:11px;color:var(--muted);font-weight:400;margin-left:8px}
#timing-empty{font-size:12px;color:var(--muted);margin:0 0 4px}
#timing-ledger{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px;max-height:120px;overflow:auto;scrollbar-color:#607368 var(--paper);padding:2px}
#timing-ledger:empty{display:none}
.time-step{min-height:34px;padding:0 10px;background:#050505;border:1px solid #343936;color:#f4f4ef;font-size:12px;border-radius:0;font-variant-numeric:tabular-nums}
.time-step:hover:not(:disabled),.time-step.active{border-color:var(--teal);background:var(--teal);color:var(--paper)}
.time-step:focus-visible{outline-offset:1px}
#timing-stats{margin-top:14px;padding:12px 0 0;border-top:1px solid var(--line)}
#stats-count{font-size:12px;color:var(--muted);margin:0 0 8px}
#timing-stats dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0}
#timing-stats dt{font-size:12px;color:var(--muted)}
#timing-stats dd{font-size:21px;color:var(--teal);margin:2px 0 0;font-variant-numeric:tabular-nums}

footer{display:flex;justify-content:space-between;flex-wrap:wrap;padding:20px 0;margin-top:28px;border-top:1px solid var(--line);font-size:11px;color:var(--muted);gap:8px 12px}
.footer-slash{margin:0 10px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes pulse{50%{opacity:.4}}
@keyframes orbit{to{transform:rotate(360deg)}}
@keyframes scan{0%,24%{opacity:1}25%,100%{opacity:.3}}
@keyframes rise{from{opacity:.6;transform:translateY(4px)}}

/* English copy */
html[lang=en] h1{font-size:clamp(1.45rem,2.15vw,2.2rem)}
html[lang=en] .players small{font-size:11px}
html[lang=en] .rank .order-label{font-size:11px}

/* Touch: full-size targets for secondary controls */
@media(pointer:coarse){.rank{min-height:44px}.time-step{min-height:44px}.scrubber button{width:44px;height:44px}input[type=range]{height:44px}.replay-caption{margin-inline:56px}}

@media(max-width:1000px){
:root{--pad:24px;--aside:260px;--gap:28px}
aside{padding-left:22px}
.players small{display:none}
h1{font:500 clamp(1.45rem,2.15vw,2.2rem)/1.08 var(--sans);margin:0;letter-spacing:-.03em}
.board-shell{position:relative;background:var(--board);padding:24px;width:100%;box-shadow:none}
.difficulty-picker{grid-template-columns:auto 160px minmax(0,220px)}
}

@media(max-width:700px){
:root{--pad:20px}
header{height:64px;padding:0 var(--pad);gap:8px}
.brand{gap:8px}
.brand strong{font:900 15px/1 var(--display);letter-spacing:-.03em;text-transform:uppercase;white-space:nowrap}
.brand-mark{width:19px;height:19px;gap:3px}
.connection{display:none}
header .language-button{margin-left:auto}
header .primary{padding:0;gap:8px}.primary svg{width:40px;height:40px;padding:10px}
main{max-width:none}
.page-heading{display:block;padding:14px 0 12px}
h1{font:500 clamp(1.45rem,2.15vw,2.2rem)/1.08 var(--sans);margin:0;letter-spacing:-.03em}
html[lang=en] h1{font-size:clamp(1.45rem,2.15vw,2.2rem)}
.page-heading p{font-size:12px}
.difficulty-picker{margin-top:12px;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto;row-gap:4px}
.difficulty-picker label{grid-row:1;grid-column:1;min-width:56px}
.difficulty-picker select{grid-row:1;grid-column:2}
.difficulty-picker>span,#difficulty-note{grid-column:1/-1;grid-row:auto;align-self:start}
.difficulty-picker>span{margin-top:2px}
.workspace{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;grid-template-areas:"play" "aside" "history"}
.board-toolbar{gap:6px;min-height:48px;padding-bottom:6px}
.players{gap:6px;font-size:13px}
.players>span{display:flex;align-items:center;gap:7px;height:32px;padding:0 10px;border:0;border-bottom:1px solid var(--line);white-space:nowrap}
.players b{font-size:10px}
.ai-player #opponent-name{max-width:96px}
.toggle{gap:6px}
.board-shell{position:relative;background:var(--board);padding:20px;width:100%;box-shadow:none}
.axis{font-size:10px}
.axis.col{top:-13px}
.axis.row{left:-13px}
.cell.heat{font-size:9px}
.cell.won{outline-width:2px;outline-offset:1px}
.board-bottom{min-height:48px}
#status{font-size:12px}
.outcome{display:flex;align-items:center;flex-wrap:wrap;gap:10px 12px;padding:12px;margin:2px 0 14px;border:1px solid var(--teal);background:transparent;scroll-margin:20px;animation:rise .24s var(--ease)}
.outcome h2{font-size:20px}
.outcome p{font-size:11px}
.result-symbol{width:26px;height:26px}
aside{border-left:0;border-top:1px solid var(--line);padding:16px 0 0;margin-top:6px}
#decision-map{max-height:184px}
.rank{min-height:44px}
.data-note p{font-size:12px}
.history{margin-top:16px}
.scrubber button{width:44px;height:44px}
.replay-caption{margin-inline:0}
.time-step{min-height:44px}
#timing-stats dd{font-size:19px}
footer{font-size:10px}
.footer-slash{margin:0 4px}
}
@media(max-width:360px){.players small{display:none}.players b{display:none}.brand strong{font-size:14px}.brand{gap:6px}header .primary{padding:0;font-size:12px;white-space:nowrap;flex-shrink:0}header .primary svg{display:none}}

@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
