:root{color-scheme:light;--bg:#f6f7f5;--ink:#1c292e;--muted:#889197;--line:#e3e7e5;--accent:#176d66;--x:#176d66;--o:#c66c49;--panel:#fff;--soft:#ecf3ef}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans SC",sans-serif;background:var(--bg);color:var(--ink);font-feature-settings:'tnum'}button,select,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.shell{max-width:1284px;padding:32px 32px 20px;margin:auto}.top{display:flex;align-items:center;justify-content:space-between;margin:0 0 27px}.brand{display:flex;align-items:baseline;gap:12px}.brand-emblem{font-size:27px;font-weight:850;letter-spacing:-1.8px}.brand-emblem sup{font-size:12px;vertical-align:super;padding-left:1px}.brand-sub{font-size:10px;font-weight:800;letter-spacing:2.2px;color:var(--accent)}.top-actions{display:flex;align-items:center;gap:12px}.segments{display:flex;gap:2px;padding:3px;background:#e9edeb;border-radius:10px}.segments button{color:#687479;border:0;background:none;padding:9px 19px;font-size:13px;font-weight:650;border-radius:8px}.segments button.selected{background:white;color:var(--ink);box-shadow:0 1px 5px #182d2612}.side-pick{background:transparent;border:1px solid var(--line);border-radius:9px;padding:8px 13px;color:#6d797c;font-size:12px}.side-pick b{color:var(--x);font-size:15px;margin-left:4px}.side-pick.hidden{display:none}.columns{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(310px,0.95fr);gap:25px;align-items:start}.play-column{min-width:0}.board-topline{display:flex;justify-content:space-between;align-items:center;height:33px;margin-bottom:13px}.turn-indicator{display:inline-flex;align-items:center;gap:8px;font-size:13px}.turn-indicator i{width:7px;height:7px;background:var(--accent);border-radius:50%}.turn-indicator b{font-size:15px}.turn-indicator.x b{color:var(--x)}.turn-indicator.o b{color:var(--o)}#turnText{color:var(--muted);font-size:12px}.board-state{font-size:12px;color:var(--muted);font-weight:600;letter-spacing:.6px}.board{width:100%;aspect-ratio:1;background:#dfe6e2;border-radius:17px;padding:11px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;box-shadow:0 14px 45px #17342d0b}.mini{border-radius:9px;background:#fff;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:2px;padding:5px;min-width:0;min-height:0;position:relative;transition:box-shadow .2s,background .2s;overflow:hidden}.mini.active{box-shadow:inset 0 0 0 2px #9ecab8,0 0 0 2px #d0e5da}.mini .cell{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;background:#f6f8f6;border:0;border-radius:3px;font-family:Arial,Helvetica,sans-serif;font-size:clamp(13px,2.8vw,35px);font-weight:350;line-height:1;color:var(--ink);padding:0;transition:background .13s}.mini .cell.mark-x{color:var(--x);font-weight:600}.mini .cell.mark-o{color:var(--o);font-weight:600}.mini .cell.can-play{cursor:pointer}.mini .cell.can-play::after{content:'';width:5px;height:5px;border-radius:50%;background:#b7ccc2;position:absolute;opacity:.7}.mini .cell.can-play:hover{background:#e0eee6}.mini .cell.can-play:hover::after{background:var(--accent);transform:scale(1.5)}.mini .cell.selected-hint{background:#e1f1e9;box-shadow:inset 0 0 0 2px #78b6a0}.mini .cell.selected-hint::after{width:8px;height:8px;background:var(--accent)}.mini .cell.last{background:#e3efeb}.mini.closed{display:flex;align-items:center;justify-content:center;padding:8px}.mini.closed.x-win{background:#e3f2ea}.mini.closed.o-win{background:#f9eae2}.mini.closed.drawn{background:#f0f1ef}.winner-mark{font-family:Arial,Helvetica,sans-serif;font-size:clamp(60px,12vw,138px);line-height:1;font-weight:550;user-select:none}.x-win .winner-mark{color:var(--x)}.o-win .winner-mark{color:var(--o)}.drawn .winner-mark{color:#a5adad;font-size:clamp(60px,10vw,110px)}.board-bottom{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:15px}.toolbar{display:flex;gap:8px}.toolbar button{width:38px;height:36px;border:1px solid var(--line);background:white;border-radius:8px;color:#607076;font-size:23px;line-height:1}.toolbar button:hover{border-color:#b0c6bb;color:var(--accent)}.move-trail{display:flex;justify-content:flex-end;align-items:center;gap:7px;max-width:65%;overflow:hidden;white-space:nowrap;color:#9aa4a7;font-size:12px}.move-trail b{font-weight:650;color:#55676d}.engine-panel{background:var(--panel);border:1px solid #e7e9e8;border-radius:15px;box-shadow:0 10px 50px #1b302d08;padding:22px 22px 17px}.engine-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:19px}.eyebrow{color:var(--ink);font-size:11px;letter-spacing:1.5px;font-weight:850}.eyebrow #engineType{font-weight:500;color:#97a2a2;margin-left:3px}.engine-light{background:#afb9b5;width:7px;height:7px;border-radius:50%;box-shadow:0 0 0 4px #f1f3f2}.engine-light.active{background:#28846d;box-shadow:0 0 0 4px #e9f4ef}.engine-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.engine-metrics>div{display:flex;flex-direction:column;gap:8px;min-width:0}.engine-metrics span{color:#96a0a2;font-size:11px}.engine-metrics strong{font-size:clamp(16px,1.8vw,21px);font-weight:720;white-space:nowrap;letter-spacing:-.7px}.engine-metrics .unit{font-size:10px;font-weight:500;letter-spacing:0}.thinking-bar{height:3px;background:#edf0ed;margin:18px 0 18px;border-radius:3px;overflow:hidden}.thinking-bar>div{height:100%;background:var(--accent);width:0%;transition:width .27s}.panel-section{padding:0 0 17px;border-bottom:1px solid #eef0ef;margin-bottom:15px;min-height:65px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px;font-size:11px;color:#8c979a;font-weight:650;letter-spacing:.45px}.section-heading strong{font-size:14px;color:var(--accent);font-weight:780}.candidates{display:flex;flex-direction:column;gap:5px;min-height:51px}.candidate{display:grid;grid-template-columns:19px 46px 1fr 52px;gap:8px;align-items:center;padding:5px 7px;border:0;background:transparent;border-radius:6px;width:100%;text-align:left}.candidate:hover,.candidate.active{background:#f1f7f3}.candidate .idx{font-size:10px;color:#b3bdbb}.candidate .name{font-size:13px;font-weight:750;color:var(--ink)}.candidate .bar{width:100%;height:4px;border-radius:6px;background:#edf0ed;overflow:hidden}.candidate .bar i{display:block;height:100%;background:#92bcab;border-radius:6px}.candidate.active .bar i{background:var(--accent)}.candidate .value{text-align:right;font-variant-numeric:tabular-nums;font-size:11px;color:#788588}.tree-section{min-height:92px}.mini-text{font-size:10px;color:#9ea9aa}.pv-tree{display:flex;align-items:center;gap:4px;min-height:50px;overflow:auto;scrollbar-width:thin}.pv-step{display:flex;align-items:center;flex:0 0 auto;gap:4px}.pv-node{display:flex;align-items:center;justify-content:center;font-size:11px;border:1px solid #e3ebe6;background:#f8faf8;border-radius:7px;min-width:38px;height:31px;color:#61716f;font-weight:650}.pv-step:first-child .pv-node{border-color:#99c7b3;background:#e9f5ee;color:var(--accent)}.pv-connector{color:#b7c5bc;font-size:14px}.proof-section{min-height:69px}.proof-state{font-size:12px!important}.proof-state.success{color:#157a59}.proof-rail{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:#8b989b}.controls{display:flex;flex-direction:column;gap:11px}.control>div{display:flex;align-items:center;justify-content:space-between;margin-bottom:5px}.control label{font-size:12px;color:#526267}.control output{font-size:12px;font-weight:750;color:#42565c;font-variant-numeric:tabular-nums}.control input[type=range]{display:block;appearance:none;width:100%;height:4px;background:#e6ebea;border-radius:6px;margin:9px 0 4px;cursor:pointer}.control input[type=range]::-webkit-slider-thumb{appearance:none;width:13px;height:13px;border-radius:50%;background:var(--accent);border:3px solid #fff;box-shadow:0 0 0 1px #90bcab}.control input[type=range]::-moz-range-thumb{width:11px;height:11px;border-radius:50%;background:var(--accent);border:2px solid #fff}.control-row{display:flex;align-items:center;justify-content:space-between;margin-top:3px}.switch-label{display:flex;align-items:center;gap:8px;font-size:12px;color:#56676c;cursor:pointer}.switch-label input{position:absolute;opacity:0}.switch{position:relative;width:26px;height:15px;border-radius:9px;background:#cdd6d0;transition:background .2s}.switch:after{content:'';position:absolute;left:2px;top:2px;width:11px;height:11px;border-radius:50%;background:white;transition:transform .2s}.switch-label input:checked+.switch{background:var(--accent)}.switch-label input:checked+.switch:after{transform:translateX(11px)}.control-row select{padding:5px 19px 5px 9px;border-radius:6px;border:1px solid #e1e8e4;background:white;color:#536569;font-size:11px;cursor:pointer}.engine-footer{display:flex;align-items:center;justify-content:space-between;padding-top:16px;margin-top:14px;border-top:1px solid #eef0ee;font-size:11px;color:#94a1a2}.engine-footer button{border:0;background:#eef4f0;color:var(--accent);padding:7px 12px;border-radius:7px;font-weight:700;font-size:11px}.page-foot{display:flex;justify-content:space-between;color:#b0bbba;font-size:9px;letter-spacing:1.5px;font-weight:700;margin-top:25px}.empty-dash{color:#aeb9b9;font-size:12px}.board.finished{box-shadow:0 0 0 3px #d4eadc inset,0 12px 45px #17342d0b}@media(max-width:910px){.shell{padding:18px 17px}.columns{grid-template-columns:minmax(0,1fr);gap:19px}.board{max-width:680px;margin:auto}.play-column{max-width:680px;width:100%;margin:auto}.engine-panel{max-width:680px;width:100%;margin:auto}.mini .cell{font-size:clamp(14px,4.2vw,44px)}.winner-mark{font-size:clamp(70px,20vw,160px)}}@media(max-width:460px){.shell{padding:13px 11px 22px}.top{margin:4px 4px 15px}.brand-emblem{font-size:23px}.brand-sub{display:none}.segments button{padding:9px 12px;font-size:12px}.side-pick{padding:7px 9px}.board{border-radius:11px;padding:7px;gap:6px}.mini{padding:3px;gap:1px;border-radius:5px}.mini .cell{font-size:clamp(14px,4vw,25px);border-radius:1px}.mini .cell.can-play::after{width:4px;height:4px}.board-topline{margin-bottom:7px}.board-bottom{margin-top:10px}.engine-panel{padding:18px 16px 15px}.winner-mark{font-size:clamp(46px,18vw,100px)}.drawn .winner-mark{font-size:55px}.page-foot{padding:0 5px}}
/* The board remains the focus; scores are low-contrast until analysis completes. */
.mini .cell .eval-tag{position:absolute;bottom:2px;right:2px;font:600 clamp(6px,.75vw,10px)/1.1 ui-monospace,Consolas,monospace;letter-spacing:-.3px;color:#5c7981;pointer-events:none;background:#ffffffbb;padding:1px 2px;border-radius:2px}
.mini .cell .eval-tag.bound{opacity:.65}
.mini .cell.eval-positive{background:#e6f2e8}.mini .cell.eval-negative{background:#faece8}
.mini .cell .mark{pointer-events:none}
.puct-metrics{font-size:11px;letter-spacing:.3px;color:#8c9b9a;min-height:14px;display:flex;justify-content:flex-end;gap:10px}
.mini .cell .eval-tag.puct{color:#8d7aa3}
@media(max-width:460px){.mini .cell .eval-tag{font-size:6px;bottom:1px;right:1px;padding:0}}
/* v9: real X/O two-segment percent bars; green D only for strict proven draws. */
.candidate .bar{display:flex;height:17px;background:#f0f3f1;border-radius:5px;overflow:hidden}
.candidate .bar i{display:flex;flex:none;align-items:center;justify-content:center;border-radius:0;min-width:0;overflow:hidden;font-style:normal;color:#fff;font-weight:750;font-size:9px;line-height:1}
.candidate .bar i span{display:block;white-space:nowrap;overflow:hidden;text-overflow:clip}
.candidate .bar i.wdl-x,.candidate.active .bar i.wdl-x{background:#1976d2}
.candidate .bar i.wdl-o,.candidate.active .bar i.wdl-o{background:#e53935}
.candidate .bar i.wdl-d,.candidate.active .bar i.wdl-d{background:#81b99a}
@media(max-width:460px){.candidate{grid-template-columns:16px 33px minmax(0,1fr) 49px;gap:5px;padding:5px 3px}.candidate .bar i{font-size:8px}}

/* v11: certified W+N / W-N / D share a consistent board and panel palette. */
.candidate .value.mate-x,.eval-tag.mate-x,#metricScore.mate-x{color:#1976d2}
.candidate .value.mate-o,.eval-tag.mate-o,#metricScore.mate-o{color:#e53935}
.candidate .value.draw,.eval-tag.draw,#metricScore.draw{color:#38815b}
.candidate .bar:empty{background:repeating-linear-gradient(120deg,#edf0f0 0 5px,#e0e5e5 5px 10px)}
