:root{color-scheme:dark;--bg:#101b1d;--panel:#172629;--line:#304144;--ink:#eef0df;--muted:#a5b5af;--mint:#c9df9a;--accent:#d9b67a}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:14px}button,input,select{font:inherit}button,.file-button{cursor:pointer;border:1px solid var(--line);border-radius:7px;padding:10px 13px;background:#213337;color:var(--ink);transition:background .15s}button:hover,.file-button:hover{background:#34484a}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--mint);outline-offset:3px}button:disabled{opacity:.4;cursor:default}.primary{background:var(--mint);color:#16241b;border-color:var(--mint);font-weight:650}.primary:hover{background:#e0efbb}.outline{background:transparent}header{height:85px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 4vw;gap:24px}.brand{text-decoration:none;color:var(--ink);font-size:28px;font-weight:750;letter-spacing:3px;display:flex;align-items:center;gap:12px}.brand small{font-size:9px;font-weight:500;max-width:70px;letter-spacing:2px}.hex{font-size:42px;color:var(--mint)}nav{display:flex;gap:8px}nav button{background:transparent;border-color:transparent}nav .active{background:#2c3c39;color:var(--mint)}.edition,.eyebrow{font-size:10px;letter-spacing:2px;color:var(--mint);font-weight:600}.edition{color:var(--muted)}main{max-width:1600px;margin:auto;padding:30px 4vw}.intro{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:8px 0 26px}h1{font-family:Georgia,serif;font-size:clamp(30px,3.3vw,48px);font-weight:400;margin:8px 0 12px;letter-spacing:-1.3px}.intro p:not(.eyebrow){color:var(--muted);margin:0}h2{font-size:18px;font-weight:550;margin:0 0 16px}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:20px}.table-wrap{height:660px;background:#1c3032;border:1px solid #3a4c4c;border-radius:12px;overflow:hidden;position:relative}.table-top,.table-bottom{position:absolute;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:16px 20px;gap:10px;z-index:1;pointer-events:none}.table-top button{pointer-events:auto;background:#16282bc9;font-size:12px}.table-top{top:0}.table-bottom{bottom:0;font-size:10px;color:#c0d0c6;letter-spacing:.4px}#turn{background:#132326cc;padding:9px 13px;border-radius:20px}#board{width:100%;height:100%;touch-action:none}#board canvas{display:block;width:100%;height:100%}aside{min-width:0}.panel{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:20px;margin-bottom:16px}label{display:block;font-size:12px;color:var(--muted);margin-bottom:12px}select,input[type=number]{display:block;width:100%;margin-top:6px;padding:10px;background:#101f22;color:var(--ink);border:1px solid var(--line);border-radius:6px;min-width:0}.check{display:flex;gap:8px;align-items:center;font-size:12px}.check small{font-size:10px}.button-row{display:flex;gap:8px;flex-wrap:wrap}.button-row button{flex:1;white-space:nowrap}.reserve{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.reserve button{position:relative;padding:10px 2px;font-size:10px;line-height:1.5}.reserve b{display:block;font-size:19px;color:var(--accent)}.reserve button.selected{border-color:var(--mint);background:#3a4a39}.reserve small{position:absolute;right:5px;top:3px}.hint{color:var(--muted);font-size:12px;line-height:1.65}.replay{margin-top:20px}.replay>div:first-child{display:flex;justify-content:space-between;gap:10px}#replay-caption{color:var(--muted)}#timeline{width:100%;accent-color:var(--mint);margin:20px 0}.file-button{font-size:12px;margin:0;color:var(--ink)}.file-button input{display:none}#history{color:var(--muted);font:12px/1.6 monospace;max-height:64px;overflow:auto;margin-bottom:0}details{font-size:12px;line-height:1.6}summary{cursor:pointer}dt{color:var(--mint);margin-top:12px}dd{margin:3px 0;color:var(--muted)}a{color:var(--mint)}.badge{border:1px solid var(--line);border-radius:30px;color:var(--muted);padding:9px 15px;font-size:12px}.lab-layout{display:grid;grid-template-columns:310px minmax(0,1fr);gap:24px}.lab-layout>aside{align-self:start}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.profiles{display:grid;grid-template-columns:1fr 1fr}.profiles label{display:flex;align-items:center;gap:6px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px}.metrics>div{border-top:1px solid var(--mint);padding:18px 0}.metrics span{font-size:9px;color:var(--muted);letter-spacing:1px}.metrics strong{font-family:Georgia,serif;font-weight:400;display:block;font-size:38px;margin-top:8px}.scroll{overflow:auto}table{width:100%;border-collapse:collapse;font-size:12px;text-align:left}th{font-weight:400;color:var(--muted);font-size:10px;white-space:nowrap}td,th{padding:12px 8px;border-bottom:1px solid var(--line)}td:first-child,th:first-child{padding-left:0}progress{width:100%;height:6px;accent-color:var(--mint);margin-bottom:20px}#progress{font-size:12px;line-height:1.6}.error{border:1px solid #d18c76;background:#472b29;padding:16px;border-radius:8px}footer{padding:24px 4vw;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:10px;letter-spacing:1px}[hidden]{display:none!important}@media(max-width:1000px){.game-layout{grid-template-columns:minmax(0,1fr) 280px}.table-wrap{height:650px}.edition{display:none}.lab-layout{grid-template-columns:280px minmax(0,1fr)}}@media(max-width:720px){header{height:auto;min-height:78px;padding:14px 5vw;flex-wrap:wrap;gap:8px}.brand{font-size:24px}.brand small{font-size:8px}nav{gap:0}nav button{padding:8px;font-size:12px}main{padding:20px 4vw}.intro{align-items:flex-start}.intro .badge{display:none}.intro>.outline{font-size:11px;padding:8px;white-space:nowrap}.game-layout,.lab-layout{grid-template-columns:1fr}.table-wrap{height:460px}.table-top,.table-bottom{padding:12px}.table-bottom span:first-child{max-width:210px;line-height:1.5}.game-layout>aside{display:grid;grid-template-columns:1fr;gap:0}.lab-layout{gap:8px}.metrics{gap:10px}.metrics strong{font-size:30px}.metrics span{font-size:8px}.replay>div:first-child{font-size:12px}footer{line-height:1.7;flex-direction:column;gap:6px}.panel{padding:16px}}

.rules-bar{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0 24px}.rules-bar>.eyebrow,.rules-bar>.hint{grid-column:1/-1}.rules-bar>.hint{margin:2px 0}.rules-bar>.check{align-self:center;margin-top:15px}.piece-detail{margin:16px 0}.piece-detail summary{color:var(--mint);padding:8px 0}#lab-activity,#game-activity{margin-top:16px}#ending-stats{margin-bottom:28px}.rule-controls select{font-size:12px}@media(max-width:720px){.rules-bar{grid-template-columns:1fr}.rules-bar>.check{margin-top:0}}

.results{min-width:0}.rules-bar>label{min-width:0}
#players-name{display:block;width:min(100%,360px);padding:10px;margin-top:6px;background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:6px}#players-rules{max-width:360px}#players-profile{color:var(--mint)}#players th{white-space:normal}
.online-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,1fr);gap:24px}.online-panel h2{margin-bottom:8px}.online-panel input{width:100%;display:block;padding:10px;background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:6px}.online-panel .error{grid-column:1/-1}.online-panel .button-row{margin-top:14px}#online-status{line-height:1.6;color:var(--mint)}@media(max-width:720px){.online-panel{grid-template-columns:1fr;gap:12px}}
nav a{display:inline-flex;align-items:center;text-decoration:none;color:var(--ink);padding:10px 13px;border:1px solid transparent;border-radius:7px;font-size:14px}nav a:hover{background:#34484a}nav a:focus-visible{outline:2px solid var(--mint);outline-offset:3px}@media(max-width:720px){nav a{padding:8px;font-size:12px}}

/* Reserve: real 3D tile renders, with accessible native button controls. */
.reserve{gap:9px 6px;padding:12px 5px;background:linear-gradient(145deg,#122224,#203436);border:1px solid #304144;border-radius:12px}
.reserve .reserve-piece{padding:0 1px 7px;min-width:0;background:transparent;border-color:transparent;border-radius:10px;transition:background .18s,border-color .18s}
.reserve-piece img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 5px 3px #0007);transition:transform .18s,filter .18s;pointer-events:none}
.reserve-piece .piece-name{display:block;font-size:10px;line-height:1.4;color:#dce5d9}
.reserve .reserve-piece small{right:1px;top:0;min-width:20px;height:20px;padding:1px 4px;border:1px solid #52635b;border-radius:20px;background:#152626;color:#edf2df;font-size:11px;font-weight:700;box-shadow:0 2px 4px #0005}
.reserve .reserve-piece:not(:disabled):hover{background:#ffffff09;border-color:#70876a}
.reserve-piece:not(:disabled):hover img{transform:translateY(-4px) rotate(-3deg);filter:drop-shadow(0 9px 5px #0008)}
.reserve .reserve-piece.selected{background:#c9df9a18;border-color:#c9df9a;box-shadow:0 0 0 1px #c9df9a33,inset 0 -3px #c9df9a}
.reserve-piece.selected img{transform:translateY(-5px);filter:drop-shadow(0 8px 5px #0008)}
.reserve .reserve-piece:disabled{opacity:.38;cursor:default}
.reserve-piece:focus-visible{outline:2px solid #e4f4ba;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.reserve-piece img,.reserve .reserve-piece{transition:none}}

.online-chat{margin-top:18px;border-top:1px solid #a8906740;padding-top:12px}.online-reactions{display:flex;flex-wrap:wrap;gap:8px}.online-reactions button{font-size:.9rem;padding:9px 12px}.online-chat-log{max-height:180px;overflow-y:auto;overflow-wrap:anywhere}.online-chat-log p{margin:5px 0;padding:7px 10px;background:#a8906712;border-radius:8px}.online-chat-log:empty{display:none}

.piece-guide h3{margin:0 0 12px}.piece-guide p{font-size:.92rem;line-height:1.55;margin:9px 0}.piece-guide .move-legend{padding:10px;border-radius:8px;background:#18393c;color:#f2f6e9;font-weight:600}

.coach-moves{display:grid;gap:6px;max-height:240px;overflow:auto;margin-top:10px}.coach-moves button{text-align:left;font-size:.85rem}.coach-results>button{width:100%;white-space:normal}.coach-panel h3{margin-top:0}

header nav .language-switch{display:inline-flex;align-items:center;gap:5px;margin:0;padding:0 4px;font-size:11px;white-space:nowrap}header nav .language-switch select{width:auto;margin:0;padding:5px;font-size:12px;min-width:84px}

.experimental-controls{grid-column:1/-1;border:1px solid var(--line);border-radius:8px;padding:8px 10px;margin:8px 0}.experimental-controls summary{cursor:pointer;color:var(--mint);font-size:12px}.experimental-controls label.check{margin:8px 0}.experimental-controls .hint{font-size:11px}

.action-picker{max-width:min(680px,95vw);max-height:85dvh;background:var(--panel);color:var(--ink);border:1px solid var(--mint);border-radius:12px}.action-picker::backdrop{background:#0009}.action-choices{display:grid;gap:6px;max-height:50dvh;overflow:auto;margin:14px 0}.action-choices button{text-align:left;overflow-wrap:anywhere}

.personal-trainer>summary{font-size:18px;color:var(--mint);cursor:pointer}.personal-trainer p{max-width:90ch;font-size:13px;line-height:1.5}.training-game{display:flex;gap:12px;align-items:center;padding:4px 0}.training-game label{display:flex;align-items:center;gap:8px;margin:0}.training-game input{width:auto}.training-game select{max-width:180px}.training-group{border-top:1px solid var(--line);padding:12px 0}.training-group button{margin:3px;font-size:12px}.training-board{height:380px;position:relative;background:#1c3032;border-radius:8px;overflow:hidden}.training-board canvas{width:100%;height:100%}.personal-trainer section>select{width:100%;max-width:100%;margin:10px 0}@media(max-width:600px){.training-game{flex-wrap:wrap}.training-board{height:300px}}