:root{font-family:Georgia,Times New Roman,serif;color:#f6e9c9;background:#101b15;color-scheme:dark;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(ellipse at 50% 10%,#36402b,#1c291d 32%,#101713 80%);background-attachment:fixed}button,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:1px solid #82603b;color:#f5e7c6;background:linear-gradient(#443020,#281f18);border-radius:10px;min-height:46px;padding:10px 14px;touch-action:manipulation;box-shadow:inset 0 1px #9b744245,0 3px 9px #0005}button:hover{background:#4d3826}button:focus-visible,summary:focus-visible{outline:3px solid #f4c978;outline-offset:3px}button:disabled{cursor:default;opacity:.6}.app{max-width:760px;margin:auto;padding:20px 14px max(26px,env(safe-area-inset-bottom));background:linear-gradient(180deg,#1c271b70,#101b1555);min-height:100svh}header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}.brand{display:flex;gap:12px;align-items:center}.brand-mark{font-size:37px;color:#d9a65a;text-shadow:0 0 14px #d99a3d80;line-height:1}h1{font-size:29px;letter-spacing:1px;margin:0;color:#f7d9a0;text-shadow:0 2px 2px #000,0 0 14px #a76b2a60}h1 span{font-weight:400;color:#d9ac65;margin-left:5px}.brand p{font-family:system-ui,sans-serif;font-size:9px;letter-spacing:2px;margin:4px 0 0;color:#c5b58b}.version{font:10px system-ui,sans-serif;letter-spacing:1px;color:#b7a17b;white-space:nowrap}.status-card{border:1px solid #765b37;border-radius:14px;background:linear-gradient(125deg,#30291eea,#18251bea);padding:16px 18px;margin-bottom:12px;box-shadow:inset 0 1px #d6a75d35,0 8px 20px #0005}.status-top{display:flex;justify-content:space-between;align-items:center;font:12px system-ui,sans-serif;color:#c3ae86;gap:8px}.player{font-weight:700;color:#f5e7c8;display:flex;align-items:center;gap:8px}.player:before{content:"";width:11px;height:11px;border-radius:50%;background:#397ed9;box-shadow:0 0 12px #4b9fff}.player[data-player="1"]:before{background:#c84d40;box-shadow:0 0 12px #f2644c}h2{font-size:23px;font-weight:500;margin:12px 0 7px;color:#f7e6c4}.status-card p{font:13px/1.6 system-ui,sans-serif;color:#d2c4a5;margin:0;min-height:30px}.board-shell{overflow:hidden;border-radius:18px;border:1px solid #80613c;background:radial-gradient(ellipse at 50% 20%,#34432a,#16241b 78%);box-shadow:0 12px 35px #0008,inset 0 0 30px #0005}.board-caption{display:flex;justify-content:space-between;padding:14px 18px 0;font:10px system-ui,sans-serif;letter-spacing:2px;color:#e2b879}#phase-tag{color:#c9d29b}#board{height:clamp(350px,56svh,560px);width:100%;display:flex;align-items:center;justify-content:center}canvas{display:block;width:100%;height:100%;touch-action:none}.board-footer{display:flex;gap:13px;align-items:center;justify-content:center;padding:0 10px 16px;color:#e0cba1;font:10px system-ui,sans-serif}.board-footer span{display:flex;align-items:center;gap:5px}.dot{width:9px;height:9px;display:inline-block;border:2px solid #5597ed;box-shadow:0 0 7px #4788ee}.move-dot{border-radius:50%}.build-dot{border-radius:1px}.toolbar{display:flex;gap:10px;margin-top:14px}.toolbar button{flex:1;font-size:13px}.toolbar #new{background:linear-gradient(#3b5531,#253c25);border-color:#a48b4d;font-weight:700}.message{color:#ffd78a;line-height:1.5;font:12px system-ui,sans-serif;min-height:18px;margin:12px 0}details{border-top:1px solid #655039;padding:14px 0;color:#d2c4a5;font:13px/1.7 system-ui,sans-serif}summary{cursor:pointer;color:#f3dbac;min-height:26px;font-weight:650}ol{padding-left:20px}li{margin:8px 0}.cell-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-top:10px}.cell-grid button{font-size:10px;padding:6px 2px;min-height:48px;border-radius:7px}.cell-grid button.legal-move,.cell-grid button.legal-build{border-color:#5b9df0;color:#b7d6ff;background:#243c4b}.cell-grid button.selected{outline:2px solid #fff}.cell-grid button:disabled{opacity:.65}footer{text-align:center;color:#a18a61;font-size:11px;margin-top:16px;letter-spacing:.5px}dialog{max-width:calc(100% - 32px);width:360px;background:#29251c;color:#f5e7c8;border:1px solid #a78652;border-radius:16px;padding:24px}dialog::backdrop{background:#080d09dd}dialog h2{margin-top:0}dialog p{color:#d2c4a5;font-size:14px}dialog form{display:flex;justify-content:flex-end;gap:8px;margin-top:24px}.primary{background:#3b5531}@media(max-width:420px){.app{padding:12px 8px 24px}header{margin-bottom:12px}.version{font-size:8px}.status-card{padding:13px;margin-bottom:10px}h2{font-size:21px}.board-footer{gap:9px;font-size:9px}.brand-mark{font-size:32px}h1{font-size:24px}#board{height:clamp(340px,54svh,500px)}}