@import url('../../runtime/fullscreen.css');
#arcade-game[data-game="chess"]{--chess-line:#3b5548;--chess-mint:#c6fac6;--chess-text:#edf3e3;color:var(--chess-text);color-scheme:dark;max-width:800px;width:100%;font-family:var(--mono)}
#arcade-game[data-game="chess"] *{box-sizing:border-box}
#arcade-game[data-game="chess"] button,#arcade-game[data-game="chess"] select{font:inherit;color:inherit;min-height:44px;border:1px solid var(--chess-line);background:#14251c;cursor:pointer}
#arcade-game[data-game="chess"] button:disabled{opacity:.42;cursor:default}
#arcade-game[data-game="chess"] button:focus-visible,#arcade-game[data-game="chess"] select:focus-visible{outline:2px solid #edb37f;outline-offset:-3px;z-index:5}
#arcade-game[data-game="chess"] .terminal{display:block;height:auto;max-height:none;border:1px solid var(--chess-line);background:#0a150f;min-width:0}
#arcade-game[data-game="chess"] .terminal-top{height:auto;min-height:44px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px;padding:5px 10px;border-bottom:1px solid var(--chess-line);font-size:9px}
#arcade-game[data-game="chess"] .runtime-indicator{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
#arcade-game[data-game="chess"] .terminal-actions{display:flex;gap:6px}
#arcade-game[data-game="chess"] .text-button{border:0;background:transparent;font-size:9px;padding:0 5px}
#arcade-game[data-game="chess"] .chess-settings{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:8px;padding:12px;border-bottom:1px solid var(--chess-line)}
#arcade-game[data-game="chess"] label{display:grid;gap:6px;font-size:8px;letter-spacing:.07em;color:#b4c7b7;min-width:0}
#arcade-game[data-game="chess"] select{width:100%;max-width:100%;padding:4px;font-size:10px}
#arcade-game[data-game="chess"] .chess-turn{min-height:42px;padding:10px 12px;font-size:11px;line-height:1.5;color:var(--chess-mint);border-bottom:1px solid var(--chess-line)}
#arcade-game[data-game="chess"] .game-area{height:auto;grid-column:auto;grid-row:auto;position:relative;width:100%;aspect-ratio:1;max-width:640px;margin:auto;background:#162a21;min-height:0}
#arcade-game[data-game="chess"] #chess-board{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(8,minmax(0,1fr));width:100%;height:100%;position:absolute;inset:0}
#arcade-game[data-game="chess"] .chess-row{display:contents}
#arcade-game[data-game="chess"] .chess-square{min-width:0;min-height:0;width:100%;height:100%;border:0;position:relative;padding:2px;display:flex;align-items:center;justify-content:center;touch-action:manipulation;border-radius:0}
#arcade-game[data-game="chess"] .square-light{background:#9cb89c}
#arcade-game[data-game="chess"] .square-dark{background:#305044}
#arcade-game[data-game="chess"] .chess-square.last-move{box-shadow:inset 0 0 0 3px #edb37fa0}
#arcade-game[data-game="chess"] .chess-square.selected{box-shadow:inset 0 0 0 4px #ffe3ab}
#arcade-game[data-game="chess"] .chess-square.legal:after{content:'';position:absolute;width:22%;height:22%;border-radius:50%;background:#0c201dc9;border:2px solid #eef4cf;pointer-events:none}
#arcade-game[data-game="chess"] .chess-square.in-check{background:#ab5445}
#arcade-game[data-game="chess"] .piece{width:88%;height:88%;pointer-events:none;stroke-width:2.2;stroke-linejoin:round;filter:drop-shadow(0 2px 1px #0005)}
#arcade-game[data-game="chess"] .piece-w{fill:#f0edd1;stroke:#172e24}
#arcade-game[data-game="chess"] .piece-b{fill:#15271e;stroke:#d0d6b2}
#arcade-game[data-game="chess"] .piece-eye{fill:#15271e;stroke:none}
#arcade-game[data-game="chess"] .piece-cut{fill:none;stroke:#7d8e72}
#arcade-game[data-game="chess"] .square-coordinate{position:absolute;bottom:1px;left:2px;font-size:8px;line-height:1.1;pointer-events:none;color:#10251a}
#arcade-game[data-game="chess"] .square-dark .square-coordinate{color:#e8edcd}
#arcade-game[data-game="chess"] .screen-overlay{position:absolute;inset:0;display:grid;place-items:center;padding:16px;background:#06100ce8;text-align:center;z-index:6}
#arcade-game[data-game="chess"] [hidden]{display:none!important}
#arcade-game[data-game="chess"] .overlay-content h2{font-size:clamp(28px,4vw,48px);letter-spacing:-.06em;color:var(--chess-mint);margin:12px 0}
#arcade-game[data-game="chess"] .overlay-eyebrow{font-size:9px;letter-spacing:.12em;color:#b9cfbd}
#arcade-game[data-game="chess"] #overlay-description{font-size:11px;line-height:1.8;max-width:36ch;white-space:pre-line}
#arcade-game[data-game="chess"] .start-button{background:#c6fac6;color:#10251a;padding:10px 20px;font-size:11px;font-weight:bold;margin-top:12px}
#arcade-game[data-game="chess"] .promotion-panel{position:absolute;inset:0;z-index:7;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#06100cf2;padding:10px;text-align:center;font-size:12px}
#arcade-game[data-game="chess"] .promotion-panel>div{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
#arcade-game[data-game="chess"] .promotion-panel button{padding:5px 10px;font-size:10px}
#arcade-game[data-game="chess"] .chess-tools{display:flex;flex-wrap:wrap;gap:5px;padding:8px;border-top:1px solid var(--chess-line)}
#arcade-game[data-game="chess"] .chess-tools button{flex:1;padding:4px 7px;white-space:nowrap;font-size:9px}
#arcade-game[data-game="chess"] .chess-ledger{display:grid;grid-template-columns:1fr 1fr;padding:8px 12px;gap:6px;font-size:10px;border-top:1px solid var(--chess-line);color:#cbd9c8}
#arcade-game[data-game="chess"] .ledger-label{display:block;font-size:8px;color:#b2c4b4;margin-bottom:4px}
#arcade-game[data-game="chess"] #move-history{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:5px 14px;list-style:none;margin:2px 0 0;padding:3px 0;max-height:70px;overflow:auto;min-height:18px;line-height:1.6}
#arcade-game[data-game="chess"] .terminal-bottom{display:flex;justify-content:space-between;padding:8px 10px;font-size:8px;color:#acc5b1;border-top:1px solid var(--chess-line)}
#arcade-game[data-game="chess"].is-expanded .terminal{display:flex}
#arcade-game[data-game="chess"].is-expanded .game-area{max-width:none}
#arcade-game[data-game="chess"].is-expanded .chess-settings{padding:5px 8px}
#arcade-game[data-game="chess"].is-expanded .chess-ledger{padding:4px 8px}
#arcade-game[data-game="chess"].is-expanded #move-history{max-height:36px}
@media(max-width:420px){#arcade-game[data-game="chess"] .chess-settings{gap:5px;padding:7px}#arcade-game[data-game="chess"] select{font-size:9px}#arcade-game[data-game="chess"] .terminal-actions{width:100%;justify-content:space-between}#arcade-game[data-game="chess"] .square-coordinate{font-size:6px}}
@media(min-width:600px) and (max-height:500px){#arcade-game[data-game="chess"].is-expanded .terminal{display:grid;grid-template-columns:minmax(0,1fr) 260px;grid-template-rows:44px auto auto auto minmax(0,1fr)}#arcade-game[data-game="chess"].is-expanded .terminal-top{grid-column:1/-1;grid-row:1}#arcade-game[data-game="chess"].is-expanded .game-area{grid-column:1;grid-row:2/6}#arcade-game[data-game="chess"].is-expanded .chess-settings{grid-column:2;grid-row:2;grid-template-columns:1fr 1fr}#arcade-game[data-game="chess"].is-expanded .chess-settings label:first-child{grid-column:1/-1}#arcade-game[data-game="chess"].is-expanded .chess-turn{grid-column:2;grid-row:3;font-size:10px;padding:4px;min-height:0}#arcade-game[data-game="chess"].is-expanded .chess-tools{grid-column:2;grid-row:4;padding:4px}#arcade-game[data-game="chess"].is-expanded .chess-ledger{grid-column:2;grid-row:5;overflow:auto}#arcade-game[data-game="chess"].is-expanded .chess-ledger>div{display:none}}
#arcade-game[data-game="chess"] .sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap}
#arcade-game[data-game="chess"] .terminal-bottom a{color:inherit;text-underline-offset:3px}
#arcade-game[data-game="chess"] .online-room{grid-column:1/-1;min-width:0;border-top:1px solid var(--chess-line);padding-top:8px}
#arcade-game[data-game="chess"] .online-room input{font:inherit;font-size:10px;min-height:36px;width:100%;min-width:0;background:#0a150f;border:1px solid var(--chess-line);color:var(--chess-text);padding:5px}
#arcade-game[data-game="chess"] .online-room button{font-size:9px;padding:4px 6px}
#arcade-game[data-game="chess"] .room-controls{display:grid;grid-template-columns:1fr 1.1fr 1fr;align-items:end;gap:6px}
#arcade-game[data-game="chess"] #room-invite{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px;align-items:end;margin-top:6px}
#arcade-game[data-game="chess"] #room-status{font-size:10px;line-height:1.5;color:var(--chess-mint);margin:7px 0 3px}
#arcade-game[data-game="chess"] .room-note{font-size:9px;line-height:1.5;margin:0;color:#b4c7b7}
#arcade-game[data-game="chess"] .online-room:has(#room-invite:not([hidden])) .room-controls{display:none}
#arcade-game[data-game="chess"].is-expanded .room-note{display:none}
#arcade-game[data-game="chess"].is-expanded[data-mode="online"] .chess-ledger{display:none}
@media(max-width:420px),(max-height:500px){#arcade-game[data-game="chess"] #room-invite{grid-template-columns:1fr 1fr}#arcade-game[data-game="chess"] #room-invite label{grid-column:1/-1}}
#arcade-game[data-game="chess"].is-expanded[data-mode="online"] .chess-settings:has(#room-invite:not([hidden]))>label{display:none}
#arcade-game[data-game="chess"].is-expanded[data-mode="online"] .online-room{border:0;padding-top:0}
@media(min-width:600px) and (max-height:500px){#arcade-game[data-game="chess"].is-expanded[data-mode="online"] #room-status{font-size:9px;margin:3px 0}#arcade-game[data-game="chess"].is-expanded[data-mode="online"] #room-invite{margin:0}#arcade-game[data-game="chess"].is-expanded[data-mode="online"] .chess-turn{font-size:9px;padding:3px}}
