/* Telega Chess v0.1 - isolated UI, no external assets. */
#btnChess {display:none}
#telegaChessOverlay[hidden], #telegaChessOverlay [hidden] {display:none!important}
#telegaChessOverlay {position:fixed;inset:0;z-index:5000;background:rgba(0,0,0,.76);display:flex;align-items:center;justify-content:center;padding:12px;box-sizing:border-box}
.chess-dialog {width:min(98vw,510px);max-height:96vh;overflow:auto;background:#17212b;color:#eef5fc;border:1px solid #334659;border-radius:14px;padding:16px;box-shadow:0 15px 65px #0008;box-sizing:border-box}
.chess-top {display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.chess-top h3 {margin:0;font-size:19px}
.chess-button {background:#2b5278;border:0;border-radius:7px;color:#fff;padding:8px 10px;font-size:14px;cursor:pointer;min-height:37px}
.chess-button:disabled {opacity:.5;cursor:default}
.chess-button.chess-danger {background:#8f3434}
.chess-button.secondary {background:#304253}
#chessGames {max-width:100%;width:100%;color:#fff;background:#243746;padding:7px;border:1px solid #456078;border-radius:7px;margin:8px 0}
#chessInfo {font-weight:600;margin:7px 0;min-height:20px;font-size:14px}
#chessPlayers {font-size:13px;color:#9bc7e6;margin-bottom:8px}
#chessBoard {display:grid;grid-template-columns:repeat(8,1fr);width:min(100%,440px);aspect-ratio:1;margin:auto;border:3px solid #435a69;box-sizing:border-box}
.chess-square {min-width:0;min-height:0;aspect-ratio:1;border:0;display:grid;place-items:center;cursor:pointer;font-family:'DejaVu Sans','Segoe UI Symbol',serif;font-size:clamp(22px,7vw,43px);line-height:1;padding:0;text-shadow:0 1px 1px #444}
.chess-square.dark {background:#a4764b}.chess-square.light {background:#e7d5ac;color:#111}
.chess-square.selected {box-shadow:inset 0 0 0 4px #43b4fc;background:#c5b64e}
.chess-actions {display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
#chessMoves {max-height:60px;overflow:auto;margin-top:10px;font-size:13px;line-height:1.5;color:#b6cedd;overflow-wrap:anywhere}
#chessNotice {min-height:17px;color:#ffc883;font-size:12px;margin-top:8px}
@media (max-width:490px){.chess-dialog{padding:9px}.chess-square{font-size:clamp(23px,8vw,40px)}}

/* Chess v0.2: recognizable solid SVG pieces and board coordinates */
#chessBoard {width:min(100%, 480px);border:2px solid #617180;border-radius:5px;overflow:hidden}
.chess-square {position:relative;isolation:isolate;overflow:hidden;touch-action:manipulation;text-shadow:none}
.chess-square.dark {background:#a87952}
.chess-square.light {background:#ead8b6}
.chess-piece {width:86%;height:86%;display:block;pointer-events:none;filter:drop-shadow(0 2px 1px #0006)}
.chess-piece .piece-body {stroke-linejoin:round;stroke-linecap:round;stroke-width:3}
.chess-piece.white .piece-body {fill:#fffaf0;stroke:#343b43}
.chess-piece.black .piece-body {fill:#181c22;stroke:#f2e7d1;stroke-width:2.6}
.chess-piece.white .piece-cut {fill:none;stroke:#343b43;stroke-width:4}
.chess-piece.black .piece-cut {fill:none;stroke:#f2e7d1;stroke-width:4}
.chess-piece.white .piece-detail {fill:#343b43;stroke:none}
.chess-piece.black .piece-detail {fill:#f2e7d1;stroke:none}
.chess-coordinate {position:absolute;font:700 clamp(9px,2vw,12px)/1 system-ui,sans-serif;pointer-events:none;z-index:2}
.chess-coordinate.rank {top:3px;left:4px}
.chess-coordinate.file {right:4px;bottom:3px}
.chess-square.dark .chess-coordinate {color:#fff7e5}
.chess-square.light .chess-coordinate {color:#67482f}
.chess-square.last-move:after {content:'';position:absolute;inset:0;background:#f7df48;opacity:.25;pointer-events:none;z-index:-1}
.chess-square.selected {box-shadow:inset 0 0 0 3px #30bafa}
#btnChess {flex:0 0 auto;min-width:32px}
@media(max-width:700px){.chess-dialog{width:min(100%,540px);max-height:calc(100dvh - 16px);padding:10px}.chess-top h3{font-size:17px}#telegaChessOverlay{padding:8px}.chess-actions{gap:5px}.chess-button{font-size:13px}}
@media(orientation:landscape) and (max-height:550px){.chess-dialog{width:min(96vw,760px);max-height:96dvh}#chessBoard{width:min(65dvh,100%,480px)}}

/* Chess v0.3: move information and optional sound */
.chess-move-summary {display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;margin:7px 0;font-size:12px;color:#b6cedd;font-variant-numeric:tabular-nums}
#chessLastMove {overflow-wrap:anywhere}
#chessSound[aria-pressed="true"] {background:#28634b}
