@font-face{font-family:"Space Grotesk";src:url('./fonts/space-grotesk.ttf') format('truetype');font-weight:300 700;font-style:normal;font-display:swap}
:root{color-scheme:dark;--footer-height:calc(68px + env(safe-area-inset-bottom,0px));--bg:#101714;--panel:#18201d;--border:#334039;--text:#e9eee7;--muted:#a6b6ab;--gold:#e5c785;--green:#9cd9bc;font-family:"Space Grotesk","Trebuchet MS",sans-serif;font-synthesis:none;font-size:16px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);padding-bottom:var(--footer-height)}button,a,input,select{-webkit-tap-highlight-color:transparent}button,input,select{font:inherit}button,select{font-size:.875rem;color:inherit;border:1px solid var(--border);background:#1c2822;padding:.7rem 1rem;border-radius:9px;cursor:pointer}button{min-height:44px;transition:background .16s,border-color .16s}button:hover{background:#2e4035;border-color:#78917e}button:active{background:#40553e}button:focus-visible,a:focus-visible,canvas:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:3px}button:disabled{opacity:.4;cursor:default}button:disabled:hover{background:#1c2822;border-color:var(--border)}[hidden]{display:none!important}a{color:var(--green)}.header{min-height:76px;border-bottom:1px solid var(--border);display:flex;align-items:center;padding:12px 28px;gap:24px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text);font-size:1.5rem;font-weight:600;letter-spacing:-.9px;margin-right:auto;white-space:nowrap}.brand-mark{font:2.5rem Georgia,serif;color:var(--gold);line-height:1}.game-actions{display:flex;gap:8px}.quiet-button{background:transparent;color:var(--muted)}.view-modes{display:flex;gap:3px;padding:3px;border:1px solid var(--border);border-radius:10px}.view-modes button{border:0;min-height:38px;padding:6px 13px;background:transparent}.view-modes button[aria-pressed=true]{background:var(--gold);color:#18221a}.app{display:grid;grid-template-columns:minmax(0,1fr) 310px}.board-panel{position:relative;height:calc(100svh - 76px - var(--footer-height));min-height:480px;overflow:hidden;background:radial-gradient(ellipse at 48% 48%,#1d2a23 0%,#121d17 48%,var(--bg) 76%)}#board{display:block;position:relative;z-index:1;width:100%;height:100%;touch-action:none;outline-offset:-6px;cursor:grab;opacity:0}#board:active{cursor:grabbing}#board3d{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;z-index:0}.board-loading{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;color:var(--gold);font-size:1.1rem;z-index:2}.camera-dock{position:absolute;bottom:20px;right:20px;z-index:5}.camera-toggle{width:48px;height:48px;padding:11px;background:#1b2922f5;border-color:#617366;box-shadow:0 5px 24px #0005}.camera-toggle svg{display:block;width:24px;height:24px;fill:none;stroke:var(--text);stroke-width:1.6}.camera-toggle[aria-expanded=true]{border-color:var(--gold)}.camera-panel{position:absolute;bottom:60px;right:0;width:264px;max-width:calc(100vw - 40px);display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:14px;background:#1b2822fa;border:1px solid #526957;border-radius:14px;box-shadow:0 10px 42px #0008;animation:reveal .18s ease-out}.camera-panel button{touch-action:none;user-select:none;-webkit-user-select:none;padding:10px 7px}.camera-panel button span{font-size:1.3rem;padding-right:7px;vertical-align:-1px}.camera-panel .overview{grid-column:1/-1;color:var(--gold)}.panel-heading{grid-column:1/-1;font-size:.875rem;color:var(--muted);padding:2px 0 8px}.sidebar{background:var(--panel);border-left:1px solid var(--border);display:flex;flex-direction:column;padding:28px 22px;gap:28px;max-height:calc(100svh - 76px - var(--footer-height));min-height:480px;overflow:auto;scrollbar-width:thin;scrollbar-color:#596f60 transparent}.sidebar>section,.sidebar>details{flex-shrink:0;min-width:0}.section-title{display:flex;align-items:center;justify-content:space-between;gap:10px}.eyebrow,.move-counter{font-size:.875rem;color:var(--muted)}.move-counter{white-space:nowrap}.turn-section h1{font-size:1.55rem;font-weight:500;letter-spacing:-.6px;margin:18px 0 8px;display:flex;align-items:center;gap:10px;line-height:1.25}.stone{display:inline-block;flex:none;width:17px;height:17px;background:#eef0df;border-radius:50%;border:1px solid #fff9;box-shadow:inset -3px -3px 3px #61685b33}.stone.black{background:#17241e;border:1px solid #a4b3a5;box-shadow:inset -3px -3px 3px #0009}.turn-section p,.selection-description{font-size:.875rem;line-height:1.6;color:var(--muted);margin:0}.selection-section{border-top:1px solid var(--border);padding-top:24px}h2{font-size:1rem;font-weight:500;margin:0}h3{font-size:1rem;font-weight:500;margin:0 0 16px}.selection-description{margin:10px 0}.icon-button{font-size:1.5rem;border:0;background:transparent;line-height:1;padding:5px 12px}.piece-roster{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:5px;margin-top:16px}.piece-roster button{font:1.35rem "Segoe UI Symbol","DejaVu Sans",serif;padding:4px 0;min-height:38px;border-color:#3b4b40;color:#e7eedf}.piece-roster button.black{color:#c1cec4}.piece-roster button.active{background:#46513b;border-color:var(--gold)}.keyboard-moves{margin-top:16px}.keyboard-moves summary{font-size:.875rem;color:var(--muted);cursor:pointer;min-height:32px}.destinations{display:grid;grid-template-columns:1fr 1fr;gap:6px;max-height:190px;overflow:auto;margin-top:8px}.destinations button{font-size:.875rem;text-align:left;padding:8px;overflow-wrap:anywhere}.destinations button span{float:right;color:var(--gold)}.text-button{background:transparent;border:0;padding:4px;color:var(--muted)}.empty-history{font-size:.875rem;color:var(--muted);margin:14px 0}.history-row{display:grid;grid-template-columns:26px 24px minmax(0,1fr);align-items:start;gap:6px;padding:10px 0;border-bottom:1px solid #2e3a32;font-size:.875rem}.ply{color:var(--muted);line-height:1.55}.move-symbol{font:1.3rem "Segoe UI Symbol","DejaVu Sans",serif}.move-coords{display:flex;flex-wrap:wrap;gap:2px 6px;min-width:0;line-height:1.55;font-size:.875rem;color:#c0cec2;overflow-wrap:anywhere}.move-endpoint{white-space:nowrap}.captures{display:flex;flex-wrap:nowrap;gap:8px;margin-top:12px;overflow-x:auto}.captures:empty{margin:0}.piece-symbol{flex:none;font:1.6rem/1.5 "Segoe UI Symbol","DejaVu Sans",serif;color:#eef0df}.piece-symbol.black{color:#142019;text-shadow:-.6px 0 #b8c4b7,.6px 0 #b8c4b7,0 -.6px #b8c4b7,0 .6px #b8c4b7}.bottom-bar{position:fixed;z-index:10;bottom:0;left:0;right:0;min-height:var(--footer-height);padding:10px 28px calc(10px + env(safe-area-inset-bottom,0px));background:#131e18f5;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:16px;backdrop-filter:blur(14px)}.bottom-bar>span{font-size:.875rem;color:var(--muted)}#menu-toggle{min-width:136px;display:flex;justify-content:space-between;gap:24px;background:transparent}#menu-toggle[aria-expanded=true]{border-color:var(--gold)}.settings-panel{position:fixed;z-index:9;bottom:calc(var(--footer-height) + 10px);right:20px;width:360px;max-width:calc(100vw - 40px);max-height:calc(100svh - 170px);overflow:auto;overscroll-behavior:contain;padding:24px;background:#1b2822fa;border:1px solid #526957;border-radius:16px;box-shadow:0 10px 80px #000a;animation:reveal .22s ease-out}.settings-panel>.section-title{margin-bottom:24px}.camera-section label{display:flex;align-items:center;font-size:.875rem;gap:10px;line-height:1.5;cursor:pointer}.camera-section input[type=checkbox]{accent-color:var(--gold);width:18px;height:18px;margin:0;flex:none}.tilt-controls{margin-top:22px}.tilt-controls label{justify-content:space-between}.tilt-controls label span{color:var(--gold)}.tilt-controls input{width:100%;height:24px;margin:10px 0;accent-color:var(--green);cursor:pointer}.range-labels{display:flex;justify-content:space-between;font-size:.875rem;color:var(--muted)}.camera-options{display:grid;gap:16px;margin-top:22px}.render-message{color:var(--gold)!important}.modal{max-width:720px;width:calc(100% - 32px);max-height:calc(100svh - 40px);padding:30px;background:#1b2822;color:var(--text);border:1px solid #617565;border-radius:16px;box-shadow:0 20px 100px #0008;overflow:auto}.modal::backdrop{background:#060d0bd9;backdrop-filter:blur(5px)}.modal-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.modal h2{font-size:1.75rem;font-weight:500;letter-spacing:-.5px;line-height:1.3}.modal p{font-size:1rem;line-height:1.65;color:#b9c9bd}.rules-list{padding-left:22px;margin:20px 0 24px;color:#b9c9bd;font-size:1rem;line-height:1.6}.rules-list li+li{margin-top:12px}.primary-button{color:#18221a;background:var(--gold);border-color:var(--gold);font-weight:600}.primary-button:hover{background:#f0d89f;border-color:#f0d89f}.small-modal{max-width:430px}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px;flex-wrap:wrap}.field{display:grid;gap:8px;font-size:.875rem;margin-top:20px}.field select{width:100%;min-height:46px}.modal .dialog-note{font-size:.875rem;margin-top:24px}strong{font-weight:600;color:var(--text)}#ai-retry{margin-top:16px}.zoom-zones{position:absolute;inset:0;z-index:2;pointer-events:none}.zoom-zones svg{width:100%;height:100%}.zoom-zone-in{fill:#43dfa82e;stroke:#8effd4;stroke-width:1.5;vector-effect:non-scaling-stroke}.zoom-zone-out{fill:#e9b55a20;stroke:#e9c47e;stroke-width:1.5;vector-effect:non-scaling-stroke}.zoom-zones span{position:absolute;font-size:.875rem;text-shadow:0 1px 4px #000;white-space:nowrap}.zone-in-label{left:50%;top:50%;transform:translate(-50%,-50%);color:#b2ffe4}.zone-out-label{left:7px;top:50%;writing-mode:vertical-rl;transform:translateY(-50%);color:#ffdaa1}.zone-hold-label{left:50%;top:69%;transform:translateX(-50%);color:#d4dcd7}@keyframes reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.turn-time{display:flex;align-items:baseline;flex-wrap:wrap;gap:9px;margin:4px 0 12px;color:var(--muted);font-size:.8rem}.turn-time [role=timer]{color:var(--gold);font-size:1.4rem;line-height:1.4;font-variant-numeric:tabular-nums;letter-spacing:.02em}.turn-section .ai-progress{color:var(--green);font-size:.8rem;font-variant-numeric:tabular-nums;line-height:1.7;overflow-wrap:anywhere;margin-bottom:6px}
@media(min-width:1500px){.app{grid-template-columns:minmax(0,1fr) 350px}.sidebar{padding:32px 28px}}
@media(max-width:1000px){.app{grid-template-columns:minmax(0,1fr) 280px}.sidebar{padding:24px 18px}.header{gap:16px;padding-inline:20px}}
@media(max-width:760px){.header{display:grid;grid-template-columns:1fr auto;gap:10px 16px;padding:12px 16px}.brand{font-size:1.35rem;gap:8px}.brand-mark{font-size:2.2rem}.game-actions{grid-column:1/-1;display:flex;justify-content:flex-end}.app{display:flex;flex-direction:column}.board-panel{height:calc(100svh - 130px - var(--footer-height));min-height:420px;width:100%}.sidebar{border-left:0;border-top:1px solid var(--border);max-height:none;min-height:0;padding:24px 20px;gap:24px;overflow:visible}.piece-roster{grid-template-columns:repeat(8,minmax(0,1fr));max-width:460px}.piece-roster button{min-height:44px}.camera-dock{right:16px;bottom:16px}.bottom-bar{padding-inline:16px}.bottom-bar>span{font-size:.875rem}.settings-panel{right:12px;max-width:calc(100vw - 24px);padding:22px;bottom:calc(var(--footer-height) + 10px)}.modal{padding:24px}.modal h2{font-size:1.55rem}}
@media(prefers-reduced-motion:reduce){button{transition:none}.camera-panel,.settings-panel{animation:none}}

#history-count{font-size:.875rem;color:var(--muted)}

#concede{display:block;margin-top:16px}.result-dialog{position:fixed;inset:auto;margin:0;transform:translate(-50%,-50%);padding:28px;text-align:center;overflow:auto}.result-dialog .eyebrow{margin:0 0 16px;font-size:.875rem;letter-spacing:.08em;text-transform:uppercase}.result-dialog h2{line-height:1.3;text-wrap:balance}.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:26px}.result-actions .quiet-button{grid-column:1/-1}.result-dialog::backdrop{background:#060d0b99;backdrop-filter:blur(2px)}



.piece-callouts{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:hidden}.piece-callout-group{position:absolute;inset:0;pointer-events:none}.piece-callout-line{position:absolute;left:0;top:0;height:1.5px;transform-origin:0 50%;pointer-events:none;box-shadow:0 0 3px #101714}.piece-callout{position:absolute;left:0;top:0;display:grid;place-items:center;width:44px;height:44px;min-height:44px;padding:0;border-radius:50%;border:2px solid #f3d99e;background:#24382e;font:30px/1 "Segoe UI Symbol","Apple Symbols","Noto Sans Symbols 2","DejaVu Sans",serif;transform-origin:50% 50%;box-shadow:0 3px 14px #000a,inset 0 0 0 2px #15221b;cursor:pointer;transition:background .14s,border-color .14s;touch-action:manipulation}.piece-callout.white-piece{color:#fbf5df;text-shadow:0 1px 2px #000}.piece-callout.black-piece{color:#10251b;background:#d5dcc7;text-shadow:0 1px 1px #fff7}.piece-callout.opponent{border-color:#d5b8f5}.piece-callout:hover,.piece-callout:focus-visible{border-color:#fff5dc;background:#435e4d;outline:2px solid #fff7;outline-offset:2px}.piece-callout.black-piece:hover,.piece-callout.black-piece:focus-visible{background:#f1eedc}.piece-callout.selected{border-color:#f4ce78;box-shadow:0 0 0 2px #e9c26e66,0 3px 14px #000a}

.footer-actions{display:flex;align-items:center;gap:8px;flex:none}.mute-toggle{width:44px;padding:10px;background:transparent}.help-toggle{width:44px;padding:10px;background:transparent;font-size:1.25rem;line-height:1;font-weight:600}.mute-toggle svg{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.mute-slash{display:none}.mute-toggle[aria-pressed=true]{color:var(--gold)}.mute-toggle[aria-pressed=true] .sound-waves{display:none}.mute-toggle[aria-pressed=true] .mute-slash{display:block}.audio-controls{margin-top:26px;padding-top:22px;border-top:1px solid var(--border)}.audio-controls h3{margin-bottom:18px}.volume-control{margin-top:14px}.volume-control label{justify-content:space-between;gap:8px}.volume-control output{color:var(--gold);font-variant-numeric:tabular-nums}.volume-control input{width:100%;height:24px;margin:8px 0;accent-color:var(--green);cursor:pointer}.bottom-bar>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Kerr's quiet observatory: dark walnut, warm metal and an uninterrupted board. */
:root{--panel:#1a211e;--border:#3c443a;--text:#f0eee4;--muted:#b4bcaf;--gold:#dfc18a}
.header{height:80px;min-height:80px;background:#131b17;border-bottom-color:#79644566}
.brand{gap:12px;letter-spacing:0}.brand-mark{display:block;width:42px;height:42px}
.brand-wordmark{display:grid;gap:3px;font:500 1.85rem/1 Georgia,"Times New Roman",serif;letter-spacing:.09em;text-transform:uppercase}
.brand-wordmark>span{font:500 .75rem/1.1 "Space Grotesk",sans-serif;letter-spacing:.3em;color:var(--gold);padding-left:2px}
.app{height:calc(100svh - 80px - var(--footer-height));min-height:480px;grid-template-areas:"board turn" "board details";grid-template-rows:auto minmax(0,1fr)}
.board-panel{grid-area:board;height:100%;min-height:0;background:radial-gradient(ellipse at 50% 42%,#24302a 0%,#151f19 52%,var(--bg) 85%)}
.turn-section{grid-area:turn;padding:28px 22px 22px;background:linear-gradient(135deg,#252a21,#19221c);border-left:1px solid var(--border);border-bottom:1px solid #79644566;min-width:0}
.turn-section h1{font-size:1.55rem;overflow-wrap:anywhere}.turn-section .ai-progress{font-size:.875rem;line-height:1.5}
.turn-section #turn-detail:empty{display:none}.turn-time{font-size:.875rem}.turn-time [role=timer]{font-size:1.6rem}
#concede{padding:6px 0;min-height:36px;border:0;border-radius:0;font-size:.875rem;margin-top:8px;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#6e796b}
#concede:hover{background:none;color:var(--text)}
.sidebar{grid-area:details;padding:0;min-height:0;max-height:none;gap:0;overflow:auto}
.game-drawer{width:100%;min-width:0}.game-drawer>summary{display:flex;align-items:center;gap:12px;list-style:none;cursor:pointer;min-height:60px;padding:16px 22px;font-size:.875rem;border-bottom:1px solid #79644540}
.game-drawer>summary::-webkit-details-marker{display:none}.game-drawer>summary>span{color:var(--muted);font-size:.75rem;margin-left:auto}
.game-drawer>summary::after{margin-left:auto;content:"+";color:var(--gold);font-size:1.25rem}.game-drawer[open]>summary::after{content:"−"}
.drawer-content{display:flex;flex-direction:column;gap:24px;padding:22px;min-width:0}.selection-section{border:0;padding:0}
.piece-roster button{background:#202c25;border-color:#4a5547;min-height:40px}.piece-roster button.active{background:#4c4934}
.bottom-bar{background:#151e19f5;border-top-color:#79644566}.camera-toggle{border-color:#9e8a5e99;background:#1b2722f5}
.modal{background:linear-gradient(145deg,#252d24,#17211b);border-color:#a88b556e;box-shadow:0 24px 100px #000b}
.modal::backdrop{background:#080f0ddb;backdrop-filter:blur(6px)}
#reset-dialog{max-width:480px;padding:36px}.setup-brand{display:flex;align-items:center;justify-content:center;gap:15px;margin:0 0 32px}.setup-brand img{width:56px;height:56px}.setup-brand .brand-wordmark{font-size:2.4rem}
#reset-dialog h2{text-align:center;font-size:1.6rem}#reset-dialog h2+p{text-align:center;margin:10px 0 24px;font-size:.875rem}
.setup-players{display:grid;grid-template-columns:1fr 1fr;gap:18px}.setup-players .field{margin-top:0;font-size:1rem}.setup-players select{background:#111b16;min-height:52px;padding-inline:12px}
#reset-dialog .dialog-actions{margin-top:28px}#reset-confirm{flex:1;min-height:50px}#reset-note{line-height:1.5}.setup-pending .turn-section,.setup-pending .sidebar{visibility:hidden}
@media(min-width:1500px){.turn-section{padding:30px 28px 24px}.drawer-content{padding:24px 28px}.game-drawer>summary{padding-inline:28px}}
@media(max-width:1000px) and (min-width:761px){.turn-section{padding:22px 18px 18px}.drawer-content{padding:20px 18px}.game-drawer>summary{padding-inline:18px}}
@media(max-width:760px){
  .header{display:flex;flex-wrap:wrap;height:auto;min-height:72px;gap:8px;padding:10px 12px}.brand{gap:7px;margin-right:auto}.brand-mark{width:32px;height:32px}.brand-wordmark{font-size:1.35rem}.brand-wordmark>span{font-size:.75rem;letter-spacing:.18em}
  .view-modes{padding:2px;gap:0}.view-modes button{padding:6px 10px;min-height:38px}.game-actions{display:flex;grid-column:auto}.game-actions>button{padding:8px 10px}
  .app{display:grid;height:calc(100svh - 72px - var(--footer-height));min-height:440px;grid-template-columns:minmax(0,1fr);grid-template-areas:"turn" "board" "details";grid-template-rows:auto minmax(220px,1fr) auto}
  .turn-section{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;padding:10px 16px 9px;border-left:0}
  .turn-section .section-title{grid-column:1;gap:8px;justify-content:flex-start}.turn-section .eyebrow,.move-counter{font-size:.75rem}.move-counter{padding-left:8px;border-left:1px solid var(--border)}
  .turn-section h1{grid-column:1;margin:5px 0 0;font-size:1.1rem;gap:7px;line-height:1.3}.stone{width:13px;height:13px}.turn-time{grid-column:2;grid-row:1/3;display:grid;gap:0;margin:0;text-align:right;align-content:center;font-size:.75rem}.turn-time [role=timer]{font-size:1.4rem}
  .turn-section .ai-progress{grid-column:1/-1;font-size:.75rem;margin:4px 0 0}.turn-section #turn-detail{grid-column:1/-1;font-size:.875rem;margin-top:4px}#ai-retry{grid-column:1/-1;margin-top:6px}
  #concede{grid-column:1;justify-self:start;font-size:.875rem;min-height:32px;margin:2px 0 0;padding:2px 0}
  .board-panel{height:100%;min-height:0;width:100%}.sidebar{border-top:1px solid #79644566;border-left:0;max-height:none;min-height:0;padding:0;overflow:visible}
  .game-drawer>summary{min-height:48px;padding:10px 16px}.game-drawer>summary>span{font-size:.875rem}.drawer-content{padding:16px;max-height:34svh;overflow:auto;overscroll-behavior:contain;gap:18px}.piece-roster{margin-top:10px;max-width:none}.piece-roster button{min-height:44px}
  .camera-dock{right:12px;bottom:12px}.camera-toggle{width:44px;height:44px;padding:9px}
  .setup-pending .turn-section,.setup-pending .sidebar{display:none}.setup-pending .app{grid-template-rows:minmax(0,1fr);grid-template-areas:"board"}
  #reset-dialog{padding:28px 24px}.setup-brand{margin-bottom:24px}
}
@media(max-width:360px){.header{gap:6px}.brand-mark{width:26px;height:26px}.brand-wordmark{font-size:1.15rem}.view-modes button{padding-inline:8px}.game-actions>button{padding-inline:8px}.setup-players{gap:12px}#reset-dialog{padding-inline:20px}}
@media(prefers-reduced-motion:reduce){.modal::backdrop{backdrop-filter:none}}

.ai-settings{border-top:1px solid var(--border);margin-top:24px;padding-top:20px}
.turn-actions{display:flex;gap:6px;margin-left:auto}
.turn-actions #concede,.turn-actions #ai-retry{margin:0;min-height:32px;padding:2px 0;font-size:.875rem}
.turn-actions #ai-retry{padding-inline:6px}
@media(max-width:760px){
  .turn-section{height:5.625rem;min-height:5.625rem;max-height:5.625rem;grid-template-rows:2rem 2.5rem;row-gap:2px;padding:7px 12px;overflow:hidden}
  .turn-section h1{grid-row:2;margin:0;min-height:0;align-self:stretch;align-items:center;line-height:1.1;overflow:auto}
  .turn-section .section-title{grid-row:1;grid-column:1/-1;min-width:0;gap:8px;white-space:nowrap}
  .turn-section .turn-time{grid-column:2;grid-row:2;font-size:.75rem;align-self:center}
  .turn-section .turn-time [role=timer]{font-size:1.2rem;line-height:1.1}
  .turn-section .ai-progress{grid-column:1/-1;grid-row:3;margin:0;font-size:.875rem;line-height:1.3;overflow:auto}
  .turn-section.show-ai-details{height:8.375rem;min-height:8.375rem;max-height:8.375rem;grid-template-rows:2rem 2.5rem 2.75rem;row-gap:1px}
}

.help-controls{border-top:1px solid var(--border);padding-top:18px;margin-bottom:24px}.help-controls h3{margin:0}.help-controls p{margin:10px 0;font-size:.875rem;line-height:1.6}.help-touch{display:none}@media(hover:none),(pointer:coarse){.help-touch{display:block}.help-desktop{display:none}}

#menu-toggle{align-items:center}#menu-toggle svg{display:block;width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}@media(max-width:760px){#menu-toggle{width:44px;min-width:44px;padding:10px;gap:0;justify-content:center}.settings-label{display:none}}

.volume-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.volume-heading h3{margin:0}.volume-heading output{color:var(--gold);font-size:.875rem;font-variant-numeric:tabular-nums}

.piece-roster button{display:grid;place-items:center;padding:2px 0}.piece-roster button:disabled{opacity:1}.history-button{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;text-align:left}.history-dialog{width:calc(100% - 32px);max-width:640px;overflow:hidden}.history-dialog[open]{display:flex;flex-direction:column;gap:18px}.history-dialog .modal-header{flex:none}.history-dialog .history{min-height:0;max-height:65svh;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-gutter:stable}.history-row{grid-template-columns:6ch 28px minmax(0,1fr);font-variant-numeric:tabular-nums}.history-dialog .empty-history{margin:0}.history-dialog .history:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}

.header-view-controls{display:flex;align-items:center;gap:12px;flex:none}.app{height:calc(100svh - var(--game-header-height,80px) - var(--footer-height))}@media(max-width:760px){.header-view-controls{gap:8px}.app{height:calc(100svh - var(--game-header-height,72px) - var(--footer-height))}}@media(max-width:760px){.header{display:grid;grid-template-columns:1fr auto auto;gap:8px;min-height:72px}.header .brand{grid-column:1;grid-row:1}.header .game-actions{grid-column:3;grid-row:1}.header-view-controls{display:contents}.header .support-button{grid-column:2;grid-row:1}.header .view-modes{grid-column:1/-1;grid-row:2;justify-self:end}}

.credits-button{width:100%;margin-top:24px;background:transparent}.credits-line{margin:24px 0 4px;text-align:center}

/* The launcher participates in header layout; Ko-fi only supplies the form. */
.support-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:none;min-height:44px;padding:6px 12px;border:1px solid #6dbd70;border-radius:24px;background:#5cb85c;color:#fff;font-weight:600;white-space:nowrap}
.support-button:hover{background:#4ca84c;border-color:#91d494}
.support-button img{display:block;width:36px;height:30px;object-fit:contain;flex:none}
.support-dialog{box-sizing:border-box;width:min(440px,calc(100vw - 24px));height:min(720px,calc(100svh - 32px));max-height:calc(100svh - 32px);padding:16px;overflow:hidden}
.support-dialog[open]{display:flex;flex-direction:column;gap:12px}
.support-dialog .modal-header{flex:none;margin:0}.support-dialog h2{font-size:1.2rem;margin:0}
.support-dialog iframe{display:block;flex:1;min-height:0;width:100%;border:0;border-radius:10px;background:#fff}
.support-dialog>a{flex:none;text-align:center;font-size:.875rem}
@media(max-width:760px){.support-button{width:48px;padding:6px}.support-button>span{display:none}}