.board-view-tools { display:flex; gap:8px; }
.board-view-tools .button { flex:1; min-height:38px; padding:7px 10px; }
.turn-controls { display:grid; gap:10px; min-width:0; }
.sidebar-disclosure > summary { cursor:pointer; font-size:1rem; font-weight:600; min-height:28px; align-content:center; }
.sidebar-disclosure > summary > span { color:var(--muted); font-size:.875rem; font-weight:400; }
.disclosure-content { margin-top:12px; }
.disclosure-content > .help-button { margin:0 0 10px auto; }

.settings-dialog { width:min(490px,calc(100vw - 24px)); max-height:100dvh; overflow:auto; }
.settings-dialog .dialog-heading h2 { margin:0; }
.battlefield-settings { margin:20px 0; }
.battlefield-facts { display:grid; gap:10px; margin:14px 0; font-size:.875rem; }
.battlefield-facts > div { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.battlefield-facts dt { color:var(--muted); }
.battlefield-facts dd { margin:0; text-align:right; }
.settings-dialog .scenery-controls { margin:16px 0 0; align-items:flex-start; }
.settings-dialog .scenery-status { font-size:.875rem; }
.settings-dialog .scenery-toggle button { font-size:.875rem; }
.settings-dialog .audio-controls > summary { width:100%; }
.settings-dialog .audio-panel { position:static; width:100%; max-width:none; margin-top:10px; box-shadow:none; }
.settings-links { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }

/* The existing responsive layout remains in charge outside expanded mode. */
html:fullscreen { background:#10151c; }
body.board-expanded { overflow:hidden; }
.board-expanded > .site-header,.board-expanded > .match-heading { display:none; }
.board-expanded .game-layout { display:grid; grid-template-columns:var(--expanded-field-width,minmax(0,1fr)) minmax(var(--expanded-panel-width,300px),1fr); gap:16px; justify-content:start; align-items:start; height:100dvh; padding:0; max-width:none; }
.board-expanded .battlefield { width:var(--expanded-field-width,100%); }
.board-expanded .game-sidebar { display:flex; flex-direction:column; gap:10px; width:100%; max-height:100dvh; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:12px 12px 12px 0; scrollbar-width:thin; }
.board-expanded .turn-controls { position:sticky; top:0; z-index:25; padding-bottom:6px; background:#10151c; }
.board-expanded .turn-card { padding:12px; border-radius:10px; gap:7px 10px; }
.board-expanded .turn-card h2 { font-size:1.05rem; }
.board-expanded #actions-left { font-size:2.25rem; }
.board-expanded .undo-note { margin:0; grid-column:1 / -1; }
.board-expanded .sidebar-card { padding:12px; }
.board-expanded .game-message { order:initial; width:100%; margin:0; }
.board-expanded .watch-controls { margin:0; width:100%; flex-wrap:wrap; font-size:.875rem; }
.board-expanded #connection-status { margin:0; font-size:.875rem; line-height:1.4; color:var(--muted); }
.board-expanded #connection-status.error { color:#ffaaa2; }
.board-expanded .game-layout.expanded-stacked { grid-template-columns:minmax(0,1fr); grid-template-rows:auto minmax(0,1fr); gap:16px; }
.board-expanded .expanded-stacked .battlefield { justify-self:start; }
.board-expanded .expanded-stacked .game-sidebar { display:flex; max-height:100%; padding-right:4px; }
.board-expanded .board-key { display:none; }


/* Coordinates share the playable tiles and never reserve an outside gutter. */
.board-frame { display:block; }
.board { container-type:inline-size; }
.tile-coordinate { display:none; position:absolute; inset:0; align-items:center; justify-content:center; font-size:clamp(14px,calc(60cqw / var(--board-size,13)),56px); font-weight:700; line-height:1; color:#e1edf2; opacity:.22; z-index:0; pointer-events:none; user-select:none; }
.board-coordinates-on .tile-coordinate { display:flex; }
.tile-coordinate.corner { padding:7%; font-size:clamp(12px,calc(40cqw / var(--board-size,13)),38px); }
.tile-coordinate.rank.corner { align-items:flex-start; justify-content:flex-start; }
.tile-coordinate.file.corner { align-items:flex-end; justify-content:flex-end; }
.army-detail { display:grid; gap:3px; }
.army-detail > span { color:var(--team); }
.army-detail small { font-size:.8125rem; }
.coordinate-setting { display:flex; gap:10px; align-items:center; cursor:pointer; font-size:.875rem; min-height:44px; }
.coordinate-setting input { width:20px; height:20px; accent-color:var(--blue); }
.coordinate-note { color:var(--muted); font-size:.8125rem; line-height:1.5; margin:0 0 14px 30px; }
.settings-dialog .settings-board-key { display:flex; flex-wrap:wrap; max-width:none; justify-content:flex-start; }
.board-expanded .expanded-stacked .game-sidebar { padding:0 12px 12px; }

.board-expanded .game-layout:has(.setup-start-dock:not([hidden])) { grid-template-rows:auto minmax(0,1fr); }
.board-expanded .game-layout.expanded-stacked:has(.setup-start-dock:not([hidden])) { grid-template-rows:auto auto minmax(0,1fr); }
.board-expanded .setup-start-dock { margin:0; }