/* SPDX-License-Identifier: GPL-3.0-or-later
   Chessground interaction + Maurizio Monge's Spatial artwork (MIT).
   Board colors/framing are original CSS; no texture/image service is used. */
body.chess-page{--board-light:#e4eadb;--board-dark:#486b76;--board-ink:#142c43;--board-selection:#cbdf94}
.chess-table{padding-inline:6px}
body.chess-page #board{display:block;position:relative;box-sizing:border-box;border:0;border-radius:2px;padding:0;aspect-ratio:1;isolation:isolate;background:#263e4d;box-shadow:0 0 0 1px #82999e,0 0 0 5px #263e4d,0 2px 0 6px #101d2a,0 16px 32px #0005}
#board cg-container{top:50%;left:50%;transform:translate(-50%,-50%)}
#board cg-board{border-radius:2px;touch-action:none;background-color:var(--board-light);background-image:conic-gradient(var(--board-dark) 25%,var(--board-light) 0 50%,var(--board-dark) 0 75%,var(--board-light) 0);background-size:25% 25%}
#board .board-input-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(8,minmax(0,1fr));z-index:12;pointer-events:none}
body.chess-page #board .square,body.chess-page #board .square:is(.dark,.selected,.hinted,.checked,:hover){pointer-events:auto;background:transparent;box-shadow:none;border:0;border-radius:0;padding:0;min-height:0;min-width:0;touch-action:none;color:var(--board-ink)}
body.chess-page #board .square:before,body.chess-page #board .square:after{content:none}
body.chess-page #board .square .coord{z-index:1;font:800 clamp(9px,1.1vw,12px)/1 system-ui;color:#142c43;text-shadow:none}
body.chess-page #board .square.dark .coord{color:#f5fff4}
body.chess-page #board .square:focus-visible{outline:3px solid #101d2a;outline-offset:-3px;box-shadow:inset 0 0 0 5px #f5fff4}
#board .check-label{bottom:1px;background:#a40e2c;color:#fff;font:800 clamp(7px,1vw,9px)/1.1 system-ui;padding:2px 4px;border-radius:3px;letter-spacing:.025em}
#board piece{background-size:100%;background-repeat:no-repeat;background-position:center;filter:drop-shadow(0 1.5px 1px #08121d66)}
#board piece.dragging{filter:drop-shadow(0 7px 3px #08121d77);cursor:grabbing}
/* Keep the dark silhouette distinct on either square without recoloring the
   licensed artwork. The steady fine edge also survives reduced motion. */
#board piece.black{filter:drop-shadow(0 0 .7px #fff6dc) drop-shadow(0 1.5px 1px #08121d66)}
#board piece.black.dragging{filter:drop-shadow(0 0 .7px #fff6dc) drop-shadow(0 7px 3px #08121d77)}
#board piece.ghost{opacity:.25;filter:none}
#board square.selected{background:var(--board-selection);box-shadow:inset 0 0 0 2px #476324}
#board square.last-move{background:#c8dd865c;box-shadow:inset 0 0 0 2px #213a3155}
#board square.check{background:radial-gradient(ellipse at center,#f64f61 0%,#d42c48b3 45%,#b00b3700 75%);box-shadow:inset 0 0 0 3px #a40e2c}
#board square.hinted{box-shadow:inset 0 0 0 3px #174c82;background:#9fcafa77}
#board square.move-dest:after{content:'';position:absolute;left:37%;top:37%;width:26%;height:26%;border-radius:50%;background:#142c43;box-shadow:0 0 0 1.5px #f5fff4}
#board square.move-dest.oc:after{left:4%;top:4%;width:92%;height:92%;background:transparent;border:3px solid #142c43;box-shadow:0 0 0 1.5px #f5fff4}
#board square.move-dest.dark-square:after{background:#f5fff4;box-shadow:0 0 0 1.5px #142c43}
#board square.move-dest.oc.dark-square:after{background:transparent;border-color:#f5fff4;box-shadow:0 0 0 1.5px #142c43}
#board piece.pawn.white{background-image:url('pieces/spatial-wp.svg')}#board piece.knight.white{background-image:url('pieces/spatial-wn.svg')}
#board piece.bishop.white{background-image:url('pieces/spatial-wb.svg')}#board piece.rook.white{background-image:url('pieces/spatial-wr.svg')}
#board piece.queen.white{background-image:url('pieces/spatial-wq.svg')}#board piece.king.white{background-image:url('pieces/spatial-wk.svg')}
#board piece.pawn.black{background-image:url('pieces/spatial-bp.svg')}#board piece.knight.black{background-image:url('pieces/spatial-bn.svg')}
#board piece.bishop.black{background-image:url('pieces/spatial-bb.svg')}#board piece.rook.black{background-image:url('pieces/spatial-br.svg')}
#board piece.queen.black{background-image:url('pieces/spatial-bq.svg')}#board piece.king.black{background-image:url('pieces/spatial-bk.svg')}
.suite-colorblind body.chess-page{--board-light:#f6f3dd;--board-dark:#354e68;--board-selection:#bdd7fc}
.suite-colorblind #board square.last-move{background:#e8c96e77;box-shadow:inset 0 0 0 2px #101d2a}
.suite-colorblind #board square.selected{box-shadow:inset 0 0 0 3px #101d2a}
.suite-colorblind #board square.move-dest:after{box-shadow:0 0 0 2px #fff}
@media(max-width:740px){.chess-table{padding-inline:4px}body.chess-page #board{box-shadow:0 0 0 1px #82999e,0 0 0 3px #263e4d,0 2px 0 4px #101d2a,0 10px 20px #0004}}
@media(min-width:520px) and (max-height:520px) and (orientation:landscape){body.chess-page .chess-game{grid-template-columns:minmax(216px,calc(100dvh - 106px)) minmax(240px,1fr)}.chess-table{padding-inline:3px}#board .square .coord{font-size:8px}#board .check-label{font-size:7px;padding:1px 2px}}
@media(prefers-reduced-motion:reduce){#board piece{will-change:auto}}
/* Ordinary desktop/tablet rows also respect available height. Header/player
   strips are measured because fonts, mode labels and captured pieces can grow. */
@media(min-width:741px) and (min-height:521px){body.chess-page .chess-game{grid-template-columns:minmax(0,var(--chess-table-limit,620px)) minmax(250px,1fr)}}
/* Narrow zoomed windows keep the whole board above the footer too. Tall
   phones still use all available width; the measured limit only caps height. */
@media(max-width:740px) and (min-height:521px){.chess-table{width:min(100%,560px,var(--chess-table-limit,560px))}}