:root{color-scheme:dark;--ink:#f5f2ec;--muted:#b2afbc;--line:#ffffff18;--gold:#efba66}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 10% 0,#29314d 0,transparent 48%),#141821;color:var(--ink);font:15px/1.55 system-ui,sans-serif}main{max-width:1160px;margin:auto;padding:34px 28px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px;gap:16px}.eyebrow{font-size:10px;letter-spacing:3px;color:var(--gold);margin:0 0 8px}h1{font-family:Georgia,serif;font-size:45px;line-height:1;margin:0;font-weight:normal;letter-spacing:-1.5px}h1 span{font:12px system-ui;letter-spacing:2px;margin-left:17px;color:var(--muted);white-space:nowrap}.badge{border:1px solid var(--line);padding:9px 14px;border-radius:30px;color:var(--muted);font-size:12px}.toolbar{display:flex;align-items:center;gap:9px;border-top:1px solid var(--line);padding:18px 0 24px}.toolbar label{display:flex;align-items:center;gap:10px;margin-right:auto;font-size:12px;color:var(--muted)}button,select{font:inherit;color:inherit;background:#282d3a;border:1px solid #ffffff25;border-radius:9px;padding:9px 13px;cursor:pointer}button:hover:enabled,select:hover{border-color:var(--gold);background:#363c4a}button:disabled{cursor:default;opacity:.4}button:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #f7c97d;outline-offset:3px}.layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,1fr);gap:30px;align-items:start}.tabletop{padding:22px;border-radius:26px;background:linear-gradient(135deg,#5e4a3b,#2b2422);box-shadow:0 20px 50px #0005,inset 0 1px #ffffff35}#board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:11px;padding:13px;background:radial-gradient(ellipse,#536454,#2a3c34);border:1px solid #ffffff15;border-radius:12px;aspect-ratio:1}#board button{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#1d302988;border:1px solid #ffffff13;border-radius:9px;padding:2px;opacity:1;box-shadow:inset 0 3px 9px #0003}#board button:enabled:hover{background:#62725b;border:1px solid #e6c588}#board button.win{background:#b3953d66;border:2px solid #edc274}#board .cell-label{position:absolute;left:5px;top:2px;font-size:9px;opacity:.45}svg.piece{width:100%;height:100%;max-width:80px;max-height:81px;overflow:visible;filter:drop-shadow(0 4px 2px #0007)}.tabletop svg{width:86%}.board-caption{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.1px;color:var(--muted);padding:16px 3px;gap:8px}.turn{background:#252b38;border:1px solid var(--line);border-radius:17px;padding:19px 22px;margin-bottom:19px;min-height:165px}.phase{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--gold)}h2{font:24px Georgia,serif;margin:7px 0 5px}.turn p{margin:7px 0;color:#c8c7cf;font-size:13px}#held{display:flex;align-items:center;gap:14px}#held svg{width:65px;height:70px}#held span{font-size:12px;color:#e1d6c3;max-width:180px}#feedback{color:var(--gold);font-size:12px}.tray-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.tray h2{font:14px system-ui;margin:0}.tray-heading span{font-size:11px;color:var(--muted)}#pool{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}#pool button{display:flex;align-items:center;justify-content:center;padding:3px;height:75px;min-width:0;border-radius:10px;background:#252a35}#pool button:disabled{opacity:.52}#pool button.used{opacity:.12}details{margin-top:24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 2px}summary{cursor:pointer;color:#e6d0a9;font-size:13px}.rules{max-width:850px;font-size:13px;color:#c5c6cf}.rules p{margin:15px 0}#legend{display:flex;gap:18px;flex-wrap:wrap}#legend span{display:flex;align-items:center;gap:6px}#legend svg{width:40px;height:50px}footer{margin-top:23px;color:#888e9b;font-size:11px}footer p{margin:3px 0}a{color:#c4b89d} @media(max-width:700px){main{padding:23px 16px}header{margin-bottom:20px}h1{font-size:37px}h1 span{display:block;margin:10px 0 0;font-size:10px}.badge{font-size:10px;padding:7px 10px}.layout{grid-template-columns:1fr;gap:4px}.toolbar{flex-wrap:wrap;padding-bottom:16px}.toolbar label{width:100%;margin-bottom:2px;justify-content:space-between}.toolbar button{font-size:12px;padding:7px 14px}.tabletop{padding:16px;border-radius:19px}#board{gap:8px;padding:10px}.board-caption{font-size:8px;padding:12px 2px}.turn{padding:15px 18px;margin-bottom:15px;min-height:0}h2{font-size:23px}#pool{grid-template-columns:repeat(8,minmax(0,1fr));gap:4px}#pool button{height:59px;padding:0}aside{display:flex;flex-direction:column}.turn{order:0}.tray{order:1;margin-top:2px}#held svg{height:50px;width:48px}#legend{gap:8px}details{margin-top:20px}}@media(prefers-reduced-motion:no-preference){button{transition:background .15s,border-color .15s}.win svg{animation:celebrate 1s ease-in-out infinite alternate}@keyframes celebrate{to{transform:translateY(-3px)}}}