:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--font-main:Arial, Helvetica, sans-serif;--space-1:4px;--space-2:8px;--space-3:12px;--rail-width:36px;--side-panel-width:320px}*{box-sizing:border-box}html,body{background:#111;height:100%;margin:0}body{font-family:var(--font-main);overflow:hidden}button{font:inherit;border-radius:0}.page-shell{--bg:#111;--surface:#262421;--surface-2:#312e2b;--surface-3:#3b3935;--border:#47433f;--text:#f8f8f7;--muted:#b8b3aa;--brand:#81b64c;--brand-strong:#6a9a37;--brand-dark:#45753c;--danger:#d64f4f;--light-square:#eeeed2;--dark-square:#769656;--shadow:0 18px 32px #0000003d;background:var(--bg);color:var(--text);gap:var(--space-2);height:100dvh;padding:var(--space-2);flex-direction:column;display:flex;overflow:hidden}.page-shell[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f4f4f2;--surface:#fff;--surface-2:#e9e8e4;--surface-3:#d9d7d1;--border:#c6c2b8;--text:#262421;--muted:#6d665d;--brand:#81b64c;--brand-strong:#6a9a37;--brand-dark:#45753c;--danger:#b23b3b;--light-square:#f0d9b5;--dark-square:#b58863;--shadow:0 18px 36px #26242129}.top-bar{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);align-items:center;gap:var(--space-2);min-height:44px;padding:var(--space-1) var(--space-2);flex:none;justify-content:space-between;margin:0;display:flex}.top-bar strong{letter-spacing:.02em;font-size:.98rem;display:block}.brand-kicker{color:var(--brand);letter-spacing:.16em;text-transform:uppercase;margin:0 0 2px;font-size:.72rem;font-weight:800}.theme-toggle,.primary-button,.secondary-button{border:1px solid var(--border);cursor:pointer;min-height:32px;padding:.4rem .7rem;font-size:.85rem;font-weight:800}.theme-toggle{background:var(--surface-2);color:var(--text)}.theme-toggle:hover,.secondary-button:hover:not(:disabled){background:var(--surface-3)}.game-layout{gap:var(--space-2);grid-template-columns:var(--rail-width) minmax(0, 1fr) var(--side-panel-width);flex:auto;max-width:none;min-height:0;margin:0;display:grid}.board-stack,.side-panel,.eval-rail{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow)}.board-stack{min-width:0;height:100%;min-height:0;padding:var(--space-2);place-items:center;width:100%;display:grid;position:relative;overflow:hidden;container-type:size}.board-stack[data-view-mode=isometric]{padding:0}.top-bar-actions{gap:var(--space-1);flex-wrap:wrap;display:flex}.slice-grid{aspect-ratio:1;align-self:center;gap:var(--space-1);grid-template-columns:repeat(var(--slice-columns), minmax(0, 1fr));height:min(calc(100cqh - 2 * var(--space-2)), calc(100cqw - 2 * var(--space-2)));width:min(calc(100cqh - 2 * var(--space-2)), calc(100cqw - 2 * var(--space-2)));justify-self:center;display:grid}.iso-canvas-shell{background:radial-gradient(circle at 30% 20%,#ffffff0a,#0000 55%),linear-gradient(#0d1117 0%,#161b22 100%);width:100%;height:100%;position:relative}.iso-html-passthrough,.iso-html-passthrough *{pointer-events:none!important}.page-shell[data-theme=light] .iso-canvas-shell{background:radial-gradient(circle at 30% 20%,#fff9,#0000 55%),linear-gradient(#e9ecef 0%,#cdd2d8 100%)}.eval-rail{gap:var(--space-1);height:100%;padding:var(--space-1);flex-direction:column;width:100%;display:flex}.eval-rail-score{color:var(--brand);font-variant-numeric:tabular-nums;letter-spacing:.02em;text-align:center;font:800 .72rem ui-monospace,Cascadia Mono,monospace}.eval-rail-score[data-loading]{opacity:.55}.eval-rail-score[data-mate]{background:var(--brand);color:#fff;letter-spacing:.04em}.eval-rail[data-mate] .eval-rail-marker{background:var(--brand-strong);height:4px}.eval-rail-track{border:1px solid var(--border);background:#111;flex:auto;min-height:0;position:relative;overflow:hidden}.eval-rail-fill{background:#f5f2e8;transition:height .2s;position:absolute;bottom:0;left:0;right:0}.eval-rail-marker{background:var(--brand);height:2px;transition:bottom .2s;position:absolute;left:0;right:0;transform:translateY(50%)}.slice{background:#111;border:2px solid #111;overflow:hidden}.page-shell[data-theme=light] .slice{background:#2f2f2f;border-color:#2f2f2f}.slice-label{color:#c9c4b8;background:#111;justify-content:space-between;padding:4px;font-size:.66rem;font-weight:800;line-height:1;display:flex}.cells{aspect-ratio:1;grid-template-columns:repeat(var(--board-columns), 1fr);grid-template-rows:repeat(var(--board-rows), 1fr);display:grid;position:relative}.cell{color:inherit;cursor:pointer;border:0;justify-content:center;align-items:center;min-width:0;padding:0;font-size:clamp(1.2rem,3.4cqi,2.6rem);display:flex;position:relative}.cell.light{background:var(--light-square)}.cell.dark{background:var(--dark-square)}.cell:hover{filter:brightness(1.08)}.cell.selected{z-index:2;box-shadow:inset 0 0 0 4px #ffee66f2}.cell.legal:after,.cell.capture:after{content:"";position:absolute}.cell.legal:after{background:#14551e6b;width:28%;height:28%}.cell.capture:after{border:5px solid #a02828b8;inset:10%}.piece{filter:drop-shadow(0 2px 1px #00000073);z-index:3;line-height:1;position:relative}.hint-arrow{pointer-events:none;z-index:4;position:absolute;inset:0}.hint-arrow line{marker-end:inherit;stroke:#f59e0be6;stroke-linecap:round;stroke-width:7px}.hint-arrow path{fill:#f59e0be6}.piece.black{color:#111;text-shadow:0 1px #ffffff5c}.piece.white{color:#fff;text-shadow:0 1px 2px #000000c7}.side-panel{gap:var(--space-2);height:100%;min-height:0;padding:var(--space-2);flex-direction:column;display:flex;position:static;top:auto;overflow:hidden}.side-panel-status{gap:var(--space-1);flex-direction:column;flex:none;display:flex}.settings-menu{position:relative}.settings-menu-trigger{white-space:nowrap}.settings-dropdown{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);gap:var(--space-2);max-height:min(80vh,640px);padding:var(--space-2);scrollbar-gutter:stable;right:0;top:calc(100% + var(--space-1));z-index:50;flex-direction:column;width:min(92vw,320px);display:flex;position:absolute;overflow-y:auto}.settings-toggle-row{gap:var(--space-1);flex-wrap:wrap;display:flex}.side-panel .actions{flex:none}.side-panel .history-panel{flex:auto;min-height:0}.panel-title,.history-heading{justify-content:space-between;align-items:center;display:flex}.side-panel h2,.side-panel h3{margin:0}.panel-title span,.history-heading span{color:var(--muted);font-size:.72rem;font-weight:800}.status,.setup-card{background:var(--surface-2);border:1px solid var(--border);padding:var(--space-2);margin:0}.status{gap:2px;display:grid}.status span{color:var(--muted);font-size:.72rem;font-weight:800;display:block}.turn{color:var(--brand);text-transform:capitalize;font-size:1rem;font-weight:900}.status-line,.rewind-state{color:var(--muted);margin:2px 0 0;font-size:.72rem;font-weight:800}.status-line.danger{color:var(--danger)}.setup-card{gap:var(--space-1);display:grid}.setup-heading{justify-content:space-between;align-items:center;display:flex}.setup-heading h3{margin:0;font-size:.92rem}.setup-heading span,.field span,.setup-note{color:var(--muted);font-size:.7rem;font-weight:800}.axis-grid{gap:var(--space-1);grid-template-columns:repeat(2,1fr);display:grid}.preset-grid{gap:var(--space-1);grid-template-columns:repeat(3,1fr);display:grid}.field{gap:3px;display:grid}.field input,.field select{background:var(--surface);border:1px solid var(--border);color:var(--text);font:inherit;border-radius:0;min-height:30px;padding:.3rem .5rem;font-size:.85rem}.setup-note{margin:0;font-weight:700;line-height:1.3}.actions{gap:var(--space-1);grid-template-columns:repeat(2,1fr);margin:0;display:grid}.primary-button{background:var(--brand);border-color:var(--brand-dark);color:#fff}.primary-button:hover{background:var(--brand-strong)}.primary-button:disabled{cursor:not-allowed;filter:grayscale(.6);opacity:.55}.secondary-button{background:var(--surface-2);color:var(--text)}.secondary-button.compact{min-height:34px;padding:.45rem .55rem;font-size:.78rem}.secondary-button:disabled{cursor:not-allowed;opacity:.45}.secondary-button[aria-pressed=true]{background:color-mix(in srgb, var(--brand) 24%, var(--surface-2));border-color:var(--brand);color:var(--text)}.bot-error{background:color-mix(in srgb, var(--danger) 16%, var(--surface));border:1px solid var(--danger);color:var(--text);padding:var(--space-2);margin:0;font-size:.8rem}.hint-error,.hint-line,.analysis-line{border:1px solid var(--border);padding:var(--space-2);margin:0;font-size:.8rem}.hint-error{background:color-mix(in srgb, var(--danger) 16%, var(--surface));color:var(--text)}.hint-line{background:color-mix(in srgb, var(--brand) 18%, var(--surface));color:var(--text);font-weight:800}.analysis-line{background:var(--surface-2);color:var(--muted);font-weight:800}.history-panel{gap:var(--space-1);flex-direction:column;min-height:0;display:flex}.history-panel .history-heading,.history-panel .rewind-controls{flex:none}.history-panel .move-list{scrollbar-gutter:stable;flex:auto;min-height:0;overflow-y:auto}.history-panel .captured-panel{flex:none}.captured-panel{border-top:1px solid var(--border);gap:var(--space-1);padding-top:var(--space-2);display:grid}.captured-list{flex-wrap:wrap;gap:3px;display:flex}.captured-piece{font-size:1.35rem;line-height:1}.captured-piece.black{color:#111;text-shadow:0 1px #ffffff5c}.captured-piece.white{color:#fff;text-shadow:0 1px 2px #000000c7}.rewind-controls{gap:var(--space-1);grid-template-columns:repeat(4,1fr);display:grid}.move-list{gap:var(--space-1);margin:0;padding:0;font-size:.82rem;list-style:none;display:grid}.move-entry{background:var(--surface-2);border:1px solid var(--border);color:var(--muted);cursor:pointer;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);text-align:left;grid-template-columns:auto minmax(0,1fr) auto;width:100%;display:grid}.move-entry:hover,.move-entry.active{border-color:var(--brand);color:var(--text)}.move-entry:disabled{cursor:not-allowed;opacity:.7}.move-ply,.move-actor,.move-eval,.move-time{color:var(--brand);font-weight:900}.move-meta{place-items:end;gap:3px;display:grid}.move-eval{font-variant-numeric:tabular-nums}.move-time{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.68rem}.move-actor{background:color-mix(in srgb, var(--brand) 18%, transparent);border:1px solid color-mix(in srgb, var(--brand) 45%, transparent);text-transform:uppercase;padding:2px 5px;font-size:.68rem}@media (max-width:1050px){:root{--side-panel-width:280px}}@media (max-width:860px){body{overflow:auto}.page-shell{height:auto;min-height:100vh;overflow:visible}.game-layout{grid-template-columns:var(--rail-width) minmax(0, 1fr);flex:none;grid-template-rows:minmax(280px,calc(100dvh - 96px)) auto}.eval-rail{grid-row:1}.board-stack{grid-area:1/2}.side-panel{grid-area:2/1/auto/-1;height:auto;max-height:none;overflow:visible}}@media (max-width:520px){.axis-grid,.preset-grid{grid-template-columns:repeat(2,1fr)}.top-bar strong{font-size:.9rem}}.popover-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);padding:var(--space-3);z-index:100;background:#0000008c;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.popover-panel{background:var(--surface);border:1px solid var(--border);gap:var(--space-2);max-width:480px;max-height:min(90vh,720px);padding:var(--space-3);flex-direction:column;width:min(100%,480px);display:flex;overflow:hidden;box-shadow:0 24px 48px #00000073}.popover-header{flex:none;justify-content:space-between;align-items:center;display:flex}.popover-header h3{margin:0;font-size:1rem}.popover-close{background:var(--surface-2);border:1px solid var(--border);color:var(--text);cursor:pointer;min-width:32px;min-height:28px;padding:2px 6px;font-size:1.1rem;line-height:1}.popover-close:hover{background:var(--surface-3)}.popover-body{gap:var(--space-2);scrollbar-gutter:stable;flex-direction:column;min-height:0;display:flex;overflow-y:auto}
