:root{--bg: #111827;--panel: #1f2937;--panel-2: #273449;--text: #f9fafb;--muted: #a7b0c0;--light-square: #f0d9b5;--dark-square: #b58863;--accent: #facc15;--danger: #ef4444;--success: #22c55e;--blue: #2563eb;--green: #16a34a;--crimson: #dc2626;--gold: #ca8a04;--purple: #7c3aed;color:var(--text);background:var(--bg);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(135deg,rgba(220,38,38,.16),transparent 34%),linear-gradient(315deg,rgba(37,99,235,.16),transparent 36%),var(--bg)}button,input,textarea{font:inherit}button{border:0;border-radius:8px;padding:.78rem 1rem;min-height:42px;background:var(--accent);color:#16110a;font-weight:800;cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}textarea{width:100%;min-height:132px;resize:vertical;border:1px solid rgba(255,255,255,.16);border-radius:8px;padding:.8rem;background:#101827;color:var(--text)}input{width:100%;min-height:44px;border:1px solid rgba(255,255,255,.16);border-radius:8px;padding:.72rem .8rem;background:#101827;color:var(--text)}h1,h2,h3,p{margin-top:0}.eyebrow{display:block;color:var(--muted);font-size:.76rem;font-weight:800;letter-spacing:0;text-transform:uppercase}.muted{color:var(--muted)}.ghost{background:#ffffff1a;color:var(--text)}.menu-screen,.setup-screen,.rules-screen,.game-over-screen{min-height:100vh;display:grid;place-items:center;padding:1rem}.game-over-screen{width:100%;color:var(--text);background:linear-gradient(135deg,rgba(220,38,38,.16),transparent 34%),linear-gradient(315deg,rgba(37,99,235,.16),transparent 36%),var(--bg)}.menu-panel,.setup-panel,.rules-panel,.game-over-panel{width:min(680px,100%);background:#1f2937f0;border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:clamp(1.2rem,4vw,2.4rem);box-shadow:0 22px 70px #00000059}.menu-panel h1,.setup-panel h1,.rules-panel h1,.game-over-panel h1{font-size:clamp(2.3rem,8vw,5.5rem);line-height:.95;margin-bottom:1rem}.game-over-panel h1{color:var(--accent)}.game-over-panel{display:grid;gap:.9rem;min-height:auto;align-content:start}.game-over-panel>p:not(.eyebrow){color:var(--muted);font-size:1.15rem}.game-over-log{margin-top:1rem}.menu-copy{color:var(--muted);font-size:1.06rem;max-width:54ch}.menu-actions,.choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.75rem}.setup-panel{display:grid;gap:.75rem}.setup-error{margin:0;border:1px solid rgba(239,68,68,.45);border-radius:8px;padding:.7rem .8rem;background:#7f1d1d57;color:#fecaca}.game-screen{min-height:100vh;padding:1rem}.topbar{width:min(1180px,100%);margin:0 auto 1rem;display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center}.topbar h1{margin:0;text-align:center;font-size:clamp(1.4rem,4vw,2.4rem)}.game-layout{width:min(1180px,100%);margin:0 auto;display:grid;grid-template-columns:minmax(520px,680px) minmax(320px,360px);gap:1rem;align-items:start;justify-content:center}.board-wrap{width:100%;display:flex;justify-content:center}.chess-board{display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,minmax(0,1fr));inline-size:min(100%,680px,calc(100vh - 112px));min-inline-size:min(100%,320px);aspect-ratio:1;border:6px solid #2a1c14;border-radius:8px;overflow:hidden;box-shadow:0 24px 60px #00000059}.board-square{position:relative;display:grid;place-items:center;width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;border-radius:0;padding:0;color:inherit;line-height:1}.board-square.light{background:var(--light-square)}.board-square.dark{background:var(--dark-square)}.board-square.selected{box-shadow:inset 0 0 0 5px var(--accent)}.board-square.valid:after{content:"";width:28%;aspect-ratio:1;border-radius:999px;background:#22c55ec7;box-shadow:0 0 0 5px #22c55e2e;position:absolute}.board-square.last-move{box-shadow:inset 0 0 0 5px #2563eb80}.board-square.reversed-move{box-shadow:inset 0 0 0 5px #ef4444c7}.board-square.reversed-move:before{content:"R";position:absolute;right:5px;bottom:4px;z-index:2;display:grid;place-items:center;width:1.25rem;aspect-ratio:1;border-radius:999px;background:#ef4444;color:#fff;font-size:.78rem;font-weight:900}.board-square.checked-king{box-shadow:inset 0 0 0 6px #ef4444f2,inset 0 0 28px #ef44448c}.board-square.checked-king:before{content:"CHECK";position:absolute;left:50%;bottom:5px;z-index:3;transform:translate(-50%);border-radius:999px;padding:.18rem .38rem;background:#ef4444;color:#fff;font-size:.58rem;font-weight:900}.square-label{position:absolute;left:4px;top:3px;font-size:clamp(.5rem,1.3vw,.72rem);color:#11182794;font-weight:800}.piece-icon{width:78%;height:78%;z-index:1;filter:drop-shadow(0 5px 2px rgba(0,0,0,.24))}.hud{display:grid;gap:.85rem}.turn-banner,.check-warning,.reverse-cue,.captured,.log{background:#1f2937f2;border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:.9rem}.check-warning{border-color:#ef444494;background:#7f1d1d75}.check-warning strong{display:block;text-transform:capitalize}.reverse-cue{border-color:#ef444473;background:#7f1d1d57}.reverse-cue strong{display:block;font-size:.98rem}.turn-banner{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.turn-banner strong{display:block;text-transform:capitalize;font-size:1.1rem}.hud-actions{display:grid}.game-card{position:relative;min-height:210px;border-radius:8px;display:grid;place-items:center;align-content:center;gap:.45rem;overflow:hidden;border:4px solid rgba(255,255,255,.9);box-shadow:0 16px 40px #00000047}.game-card:before{content:"";position:absolute;width:72%;aspect-ratio:1.45;border-radius:999px;background:#ffffffdb;transform:rotate(-20deg)}.game-card strong,.game-card span:not(.corner){z-index:1;color:#111827}.game-card strong{font-size:4.5rem;line-height:.9}.game-card span:not(.corner){font-weight:900}.game-card .corner{position:absolute;z-index:2;color:#fff;font-size:1.2rem;font-weight:900}.game-card .top{top:.65rem;left:.75rem}.game-card .bottom{right:.75rem;bottom:.65rem;transform:rotate(180deg)}.game-card.crimson{background:var(--crimson)}.game-card.blue{background:var(--blue)}.game-card.green{background:var(--green)}.game-card.gold{background:var(--gold)}.game-card.purple{background:var(--purple)}.captured h3,.log h3{margin-bottom:.6rem;font-size:1rem}.captured-list{min-height:42px;display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}.captured-piece{width:42px;height:42px;min-height:42px;padding:.1rem;background:var(--panel-2);border:1px solid rgba(255,255,255,.12)}.captured-piece.selected{outline:3px solid var(--accent)}.log{max-height:260px;overflow:auto}.log p{margin:0 0 .45rem;color:var(--muted);font-size:.9rem}.status{margin:0;padding:.65rem .8rem;border-radius:8px;background:#ffffff14;text-transform:capitalize}.status.connected{color:var(--success)}.status.disconnected{color:var(--danger)}.modal-backdrop{position:fixed;inset:0;display:grid;place-items:center;padding:1rem;background:#030712b8;z-index:10}.modal{width:min(460px,100%);background:var(--panel);border:1px solid rgba(255,255,255,.14);border-radius:8px;padding:1.25rem;box-shadow:0 22px 80px #00000073}@media(max-width:900px){.game-layout{grid-template-columns:1fr}.chess-board{inline-size:min(100%,680px)}.hud{grid-template-columns:repeat(2,minmax(0,1fr))}.game-card{min-height:170px}}@media(max-width:620px){.game-screen{padding:.6rem}.topbar{grid-template-columns:1fr}.topbar h1{order:-1}.hud{grid-template-columns:1fr}button{padding-inline:.8rem}}