/* An optional chess table: one opening, one quiet marker, one shared game. */
.chess-glyph { fill:none;stroke:none;overflow:visible; }
.hero-play-controls { position:absolute;left:7%;bottom:14px;z-index:7;display:flex;align-items:center;gap:10px; }
.hero-play-controls .replay { position:static;min-height:44px;font-size:13px;gap:9px;padding:5px 12px 5px 6px; }
.chess-invitation .chess-glyph { width:25px;height:31px;filter:drop-shadow(0 2px 1px #36130636); }
.scene-replay { background:#efe0bc99;border:1px solid #a6814966;border-radius:50%;height:32px;width:32px;font-size:22px;line-height:1;color:#89231b; }
.chess-invitation:disabled { opacity:.55; }
.chess-station { position:relative;margin:36px 0 0;isolation:isolate;text-align:left; }
.chess-station-opening { margin:0 5.5% 30px; }
.chess-station-trigger { display:flex;align-items:center;gap:20px;width:100%;min-height:96px;padding:13px 0;border:0;border-top:1px solid #9a754e65;border-bottom:1px solid #9a754e45;background:transparent;text-align:left;position:relative; }
.chess-station-trigger::after { content:"";height:3px;position:absolute;bottom:-2px;left:0;right:0;background:linear-gradient(90deg,transparent,#9a1817 26%,#b82c1f 72%,transparent);transform:scaleX(0);transform-origin:left;transition:transform .65s cubic-bezier(.18,.75,.2,1); }
.chess-station-trigger:hover::after,.chess-station.is-open .chess-station-trigger::after { transform:scaleX(1); }
.chess-station-copy { display:grid;gap:6px;min-width:0; }
.chess-station-copy strong { font:italic 25px/1.15 WorkshopSerif,Georgia,serif;font-weight:400; }
.chess-station-copy small { font:10px/1.5 WorkshopMono,monospace;letter-spacing:.45px;color:var(--muted); }
.chess-station-action { margin-left:auto;font-size:12px;white-space:nowrap;display:flex;gap:15px;align-items:center; }
.chess-station-action i { font:normal 22px/1 Workshop,Arial,sans-serif; }
.chess-mini { display:grid;grid-template-columns:repeat(8,1fr);width:64px;height:64px;flex:0 0 64px;transform:rotate(-3deg);border:3px solid #6c3e24;outline:1px solid #ba9257;box-shadow:2px 3px 3px #31150730; }
.chess-mini span { position:relative;background:#e9d8b5; }
.chess-mini span.dark { background:#69402a; }
.chess-mini span.occupied::after { content:"";position:absolute;inset:15%;border-radius:50%;background:#a5211b;box-shadow:0 1px 1px #33150f55; }
.chess-mini span.ivory::after { background:#fff0ce;box-shadow:0 0 0 .5px #ae824e,0 1px 1px #33150f55; }
.chess-mini span.last { box-shadow:inset 0 0 0 1px #c44428; }
.chess-station-dark .chess-station-trigger { border-color:#bd925866;color:var(--cream); }
.chess-station-dark .chess-station-copy small { color:#d2b58b; }
.chess-station.is-open .chess-mini { transform:rotate(0); }
.chess-station.is-open .chess-station-action i { transform:rotate(90deg); }

.chess-buoy { position:fixed;right:8px;top:56vh;z-index:60;display:grid;place-items:center;width:44px;height:44px;padding:5px;border:1px solid #bc955e;border-radius:3px;background:linear-gradient(135deg,#854d3166,#2a120933),url('assets/walnut-texture.webp') center/150px,#4b2819;box-shadow:0 3px 7px #24100844,inset 0 0 0 2px #32170c,inset 0 0 0 3px #bb91544d;transform:translateY(-50%); }
.chess-buoy[hidden] { display:none; }
.chess-buoy::after { content:"";position:absolute;bottom:2px;left:17px;width:8px;height:2px;background:#a92720;border-radius:2px;box-shadow:0 1px #e9b77555;pointer-events:none; }
.chess-buoy .chess-mini { width:31px;height:31px;flex-basis:31px;border-width:1px;outline:1px solid #d6b3799c;transform:rotate(-4deg);box-shadow:1px 2px 2px #16070350;transition:transform .25s cubic-bezier(.2,.7,.2,1); }
.chess-buoy .chess-mini span.occupied::after { inset:18%;box-shadow:none; }
.chess-buoy .chess-mini span.last { box-shadow:inset 0 0 0 .7px #d78248; }
.chess-buoy:hover .chess-mini,.chess-buoy:focus-visible .chess-mini { transform:rotate(0); }
.chess-buoy:focus-visible { outline:2px solid #f4d5a0;outline-offset:3px;box-shadow:0 0 0 5px #72251b,0 3px 9px #24100855; }

/* The native dialog supplies the focus boundary; the document keeps its place. */
.chess-drawer { position:fixed;inset:16px 16px 16px auto;margin:0;padding:0;width:min(920px,calc(100vw - 32px));max-width:calc(100vw - 32px);max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);height:fit-content;border:1px solid #ba945b;border-radius:6px;background:#3b1d11;color:var(--ink);overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;box-shadow:0 15px 60px #1307038f;scrollbar-width:thin;scrollbar-color:#c19a60 #35180d; }
.chess-drawer::backdrop { background:#28170cb8;backdrop-filter:blur(2px); }
.chess-drawer .chess-table { margin:0;max-width:none;border:0;border-radius:0; }
.chess-drawer .chess-table-heading { position:sticky;top:0;z-index:8;padding:12px 0 14px;margin-top:-12px;margin-bottom:12px;background:linear-gradient(135deg,#82482d30,#2f170e26),url('assets/walnut-texture.webp') center/640px,#4e2517;box-shadow:0 8px 9px -9px #140603;border-bottom:1px solid #c49b5b55; }
.chess-drawer .chess-pause { min-height:44px;min-width:72px; }
.chess-drawer .chess-flight { z-index:20; }

.chess-table { position:relative;margin:22px auto 0;max-width:1000px;color:var(--ink);padding:28px;isolation:isolate;border:1px solid #b28b52;border-radius:5px;background:linear-gradient(150deg,#8f533025,transparent 45%),url('assets/walnut-texture.webp') center/640px,#4e2517;box-shadow:inset 0 0 0 5px #30170e,inset 0 0 0 6px #b58a4988,0 18px 30px -18px #31140b9c;scroll-margin-top:24px; }
.chess-table::before,.chess-table::after { content:"";position:absolute;left:calc(50% - 27px);width:54px;height:9px;background:linear-gradient(90deg,#6e4823,#dec286 18%,#956b38 49%,#eed59c 54%,#76522e);border:1px solid #613c1d;border-radius:2px;z-index:2;box-shadow:0 1px 2px #210c0770; }
.chess-table::before { top:2px; }.chess-table::after { bottom:2px; }
.chess-table-heading { display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 22px;color:var(--cream); }
.chess-table-heading p { font:10px/1.4 WorkshopMono,monospace;letter-spacing:2px;color:#d1ad76; }
.chess-table-heading h3 { font:italic 28px/1.1 WorkshopSerif,Georgia,serif;font-weight:400;margin-top:4px; }
.chess-pause { border:1px solid #b18c5b80;background:#2b110749;color:#ebd6b0;min-height:40px;padding:8px 13px;font-size:12px;border-radius:2px; }
.chess-table-body { display:grid;grid-template-columns:minmax(0,1.35fr) minmax(250px,.9fr);gap:28px;align-items:stretch; }
.chess-position { min-width:0; }
.chess-board-frame { padding:20px;position:relative;border:1px solid #d8b477;box-shadow:inset 0 0 0 4px #492516,inset 0 0 0 5px #ac814c,0 7px 10px #1a090749;background:linear-gradient(120deg,#4c2816,#754423 48%,#3b1a0f); }
.chess-board { display:grid;grid-template-rows:repeat(8,1fr);aspect-ratio:1;border:1px solid #2f160d;background:#e7d4b0;box-shadow:0 0 0 1px #e2bf834a;position:relative; }
.chess-row { display:grid;grid-template-columns:repeat(8,minmax(0,1fr));min-height:0; }
.chess-cell { position:relative;min-width:0;min-height:0;aspect-ratio:1; }
.chess-square { position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:0;padding:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(130deg,#f4e6c9,#dfc79f);isolation:isolate;touch-action:pan-y;user-select:none;-webkit-user-select:none; }
.chess-square.dark { background:linear-gradient(130deg,#70432c24,#31160e66),url('assets/walnut-texture.webp') 50% 50%/300px; }
.chess-square::before { content:"";position:absolute;inset:0;box-shadow:inset 0 0 10px #4a240908;pointer-events:none;z-index:1; }
.chess-square.last::before { background:#e6b24729;box-shadow:inset 0 0 0 2px #b8883d8c; }
.chess-square.selected::before { background:#b8191414;box-shadow:inset 0 0 0 3px #9c201b; }
.chess-square.in-check::before { background:#a9192657;box-shadow:inset 0 0 0 3px #b61920; }
.chess-square.legal::after { content:"";position:absolute;z-index:2;width:21%;height:21%;border-radius:50%;background:radial-gradient(circle at 35% 25%,#cf5f3e,#8b1c16 70%);border:1px solid #eac28b;box-shadow:0 2px 2px #38170935;pointer-events:none; }
.chess-square.legal.has-piece::after { width:83%;height:83%;border:3px solid #b42e21;background:transparent;box-shadow:0 0 0 1px #f4d399; }
.chess-square.drop-target::before { box-shadow:inset 0 0 0 4px #b7231b,inset 0 0 22px #eeb55e66; }
.chess-square:focus-visible { outline:2px solid #fff1cb;outline-offset:-5px;box-shadow:inset 0 0 0 4px #962620;z-index:4; }
.chess-man { width:79%;height:90%;max-height:none;stroke:none;fill:none;pointer-events:none;overflow:visible;filter:drop-shadow(1px 3px 1px #2e100b45);transform-origin:50% 85%;transition:transform .22s cubic-bezier(.2,.75,.2,1),filter .22s;z-index:3; }
.chess-square.playable:hover .chess-man,.chess-square.selected .chess-man { transform:translateY(-4%);filter:drop-shadow(1px 5px 2px #2e100b40); }
.chess-square.is-lifted .chess-man,.chess-square.is-landing .chess-man { visibility:hidden; }
.chess-square.is-lifted::after { content:"";position:absolute;bottom:10%;left:22%;width:56%;height:15%;background:#36150735;border-radius:50%;filter:blur(2px); }
.chess-files { position:absolute;left:20px;right:20px;bottom:3px;display:grid;grid-template-columns:repeat(8,1fr);color:#e7c791;font:9px/1 WorkshopMono,monospace;text-align:center; }
.chess-ranks { position:absolute;top:20px;bottom:20px;left:5px;display:grid;grid-template-rows:repeat(8,1fr);align-items:center;color:#e7c791;font:9px/1 WorkshopMono,monospace; }
.chess-sides { display:flex;align-items:center;justify-content:space-between;gap:10px;color:#e7ceaa;font:10px/1.3 WorkshopMono,monospace;margin-top:15px; }
.chess-sides span { display:flex;align-items:center;gap:6px; }
.chess-sides i { width:8px;height:8px;background:#a5211b;border-radius:50%;box-shadow:inset 0 1px #ed9473,0 1px 1px #120401;border:1px solid #b46e45; }
.chess-sides span:last-child i { background:#edddba;box-shadow:inset 0 1px #fff7dd; }

.chess-ledger { background:linear-gradient(110deg,#fff2d4,#ebd9b6);box-shadow:2px 5px 8px #1b0a084d,inset 0 0 35px #9c652b14;border:1px solid #c5a575;padding:25px 23px 20px;position:relative;min-width:0;display:flex;flex-direction:column; }
.chess-ledger::before { content:"";position:absolute;top:-7px;left:calc(50% - 5px);width:11px;height:11px;background:radial-gradient(circle at 32% 25%,#f1d69b,#b68e51 60%,#755026);border-radius:50%;border:1px solid #755026;box-shadow:0 2px 2px #36190f66; }
.chess-ledger-label { font:9px/1.5 WorkshopMono,monospace;letter-spacing:2px;color:#785535;border-bottom:1px solid #a982494f;padding-bottom:12px; }
.chess-status { font:italic 28px/1.1 WorkshopSerif,Georgia,serif;font-weight:400;margin:17px 0 8px;min-height:31px; }
.chess-message { font-size:12px;line-height:1.5;color:#775137;min-height:36px; }
.chess-history-head { display:grid;grid-template-columns:23px 1fr 1fr;gap:5px;margin:22px 0 6px;font:9px/1.3 WorkshopMono,monospace;text-transform:uppercase;letter-spacing:.8px;color:#7d6243; }
.chess-history { margin:0;padding:0;list-style:none;min-height:112px;max-height:154px;overflow:auto;scrollbar-width:thin;scrollbar-color:#af8a58 transparent;overscroll-behavior:contain; }
.chess-history li { display:grid;grid-template-columns:23px 1fr 1fr;gap:5px;font:13px/1.7 WorkshopMono,monospace;border-bottom:1px solid #b7986a30;padding:3px 0; }
.chess-history li>span:first-child { color:#967453;font-size:10px;padding-top:3px; }
.chess-history li>span:nth-child(2) { color:#8d1c17; }.chess-history li:last-child { background:#bd925810; }
.chess-history-empty { font:italic 18px/1.4 WorkshopSerif,Georgia,serif;padding:15px 0;color:#96734f; }
.chess-captures { min-height:29px;display:flex;flex-wrap:wrap;gap:1px;border-bottom:1px solid #aa84514f;margin-top:9px;padding-bottom:6px; }
.chess-captures svg { width:18px;height:24px;stroke:none;fill:none; }
.chess-actions { display:flex;gap:16px;justify-content:space-between;flex-wrap:wrap;margin:14px 0 8px; }
.chess-quiet { background:none;border:0;border-bottom:1px solid #8c67365f;font-size:11px;padding:9px 0;color:#6c4429;min-height:36px; }
.chess-quiet:disabled { opacity:.4; }
.chess-help { margin-top:15px;color:#805f40;font-size:10px;line-height:1.6; }
.chess-help summary { min-height:29px; }.chess-help p { margin-top:5px; }
.chess-promotion,.chess-reset { margin:12px 0;padding:12px 10px;background:#f7e8c7;border:1px solid #9c663f; }
.chess-promotion p,.chess-reset p { font-size:12px;line-height:1.4;margin-bottom:10px; }
.chess-promotion-choices { display:flex;gap:4px; }.chess-promote { flex:1;border:1px solid #ad89556e;background:#d7bf9144;padding:3px;min-height:52px; }.chess-promote svg { width:30px;height:40px;stroke:none;fill:none; }
.chess-reset-actions { display:flex;gap:22px; }
.chess-inlay { position:absolute;height:3px;top:0;left:14px;right:14px;overflow:hidden;pointer-events:none; }
.chess-inlay i { position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,#9c211b 30%,#e1ab61 50%,#9c211b 70%,transparent 100%);transform:translateX(-110%); }
.chess-station.is-committing .chess-inlay i { animation:chess-inlay-move 1.05s cubic-bezier(.18,.7,.2,1); }
@keyframes chess-inlay-move { 0% { transform:translateX(-110%); } 80%,100% { transform:translateX(110%); } }
.chess-table.is-opening { animation:chess-table-opens .65s cubic-bezier(.16,.7,.2,1) both;transform-origin:50% 0; }
@keyframes chess-table-opens { 0% { opacity:0;transform:perspective(1600px) rotateX(8deg) translateY(-10px); } 100% { opacity:1;transform:none; } }
@keyframes chess-table-opens-small { 0% { opacity:0;transform:translateY(-8px) scaleY(.985); } 100% { opacity:1;transform:none; } }
.chess-flight { position:fixed;top:0;left:0;z-index:2050;pointer-events:none;stroke:none;fill:none;overflow:visible;filter:drop-shadow(3px 10px 3px #26100945);will-change:transform; }
html.chess-carrying,html.chess-carrying body,html.chess-carrying body * { cursor:none!important;user-select:none!important; }
.chess-table:focus { outline:none; }.chess-sr { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }

@media (max-width:1000px) {
  .chess-table { padding:24px 20px; }.chess-table-body { grid-template-columns:minmax(0,1.35fr) minmax(200px,.9fr);gap:20px; }.chess-ledger { padding:21px 17px 17px; }
}
@media (max-width:760px) {
  .chess-table-body { grid-template-columns:1fr;gap:23px; }
  .chess-position { width:100%;max-width:540px;margin:0 auto; }
  .chess-ledger { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:20px; }
  .chess-ledger-label,.chess-status,.chess-message,.chess-history-head,.chess-history,.chess-history-empty,.chess-captures { grid-column:1; }
  .chess-ledger-label { grid-column:1/-1; }.chess-status { margin-top:14px; }.chess-actions { grid-column:2;grid-row:2/4;align-content:start;margin-top:14px;gap:12px;justify-content:start; }
  .chess-help { grid-column:2;grid-row:4/8;margin-top:10px; }
  .chess-promotion,.chess-reset,.chess-retry { grid-column:1/-1; }
  .chess-history { min-height:62px;max-height:112px; }.chess-history-head { margin-top:12px; }
}
@media (max-width:680px) {
  .chess-table.is-opening { animation-name:chess-table-opens-small; }
  .hero-play-controls { left:7%;bottom:14px;gap:8px; }.hero-play-controls .replay { min-height:39px;font-size:11px;padding:3px 9px 3px 4px;gap:6px; }.chess-invitation .chess-glyph { width:22px;height:28px; }.scene-replay { width:30px;height:30px;font-size:21px; }
  .chess-station { margin-top:26px; }.chess-station-opening { margin:0 5% 22px; }
  .chess-station-trigger { min-height:86px;gap:13px;padding:12px 0; }.chess-mini { width:52px;height:52px;flex-basis:52px;border-width:2px; }
  .chess-station-copy strong { font-size:21px; }.chess-station-copy small { font-size:9px; }.chess-station-action { font-size:10px;gap:8px; }.chess-station-action i { font-size:18px; }
  .chess-table { margin:18px -12px 0;padding:23px 8px 19px; }.chess-table-heading { margin-bottom:17px;gap:10px;padding:0 4px; }.chess-table-heading h3 { font-size:25px; }.chess-table-heading p { font-size:8px;letter-spacing:1.4px; }.chess-pause { min-height:38px;padding:7px 10px;font-size:11px; }
  .chess-board-frame { padding:14px; }.chess-files { left:14px;right:14px;bottom:2px; }.chess-ranks { top:14px;bottom:14px;left:3px; }.chess-sides { font-size:9px;margin-top:12px; }
  .chess-ledger { display:flex;padding:21px 19px 17px; }.chess-status { font-size:27px; }.chess-message { min-height:0; }.chess-history { max-height:110px;min-height:55px; }.chess-actions { justify-content:space-between;gap:15px;margin-top:12px; }.chess-help { font-size:11px; }.chess-quiet { font-size:12px;min-height:42px; }
  .chess-drawer { inset:auto 6px max(6px,env(safe-area-inset-bottom)) 6px;width:calc(100vw - 12px);max-width:calc(100vw - 12px);max-height:calc(100vh - 12px);max-height:calc(100dvh - 12px - env(safe-area-inset-bottom));border-radius:7px; }
  .chess-drawer .chess-table { margin:0;padding:20px 8px 18px; }
  .chess-drawer .chess-table-heading { padding:11px 4px 13px;margin-top:-11px; }
}
@media (max-width:360px) {
  .chess-station-trigger { gap:9px; }.chess-station-copy strong { font-size:18px; }.chess-mini { width:44px;height:44px;flex-basis:44px; }.chess-station-action { font-size:9px;gap:4px; }
  .chess-table { margin-left:-10px;margin-right:-10px;padding-left:7px;padding-right:7px; }.chess-board-frame { padding:12px; }.chess-files { left:12px;right:12px;font-size:8px; }.chess-ranks { top:12px;bottom:12px;font-size:8px;left:2px; }.chess-ledger { padding:18px 15px; }
  .chess-drawer .chess-table { margin:0; }
}
@media (hover:none),(pointer:coarse) { .chess-square.playable:hover .chess-man { transform:none; } }
html[data-motion="off"] .chess-table.is-opening { opacity:1;transform:none; }
@media (prefers-reduced-motion:reduce) { .chess-table.is-opening { opacity:1;transform:none; }.chess-flight { will-change:auto; } }
