:root{color-scheme:dark;--gold:#e3c179;--ink:#f7efd9;--edge:#b4945388}*{box-sizing:border-box}body{margin:0;background:#081a2a url('../../assets/marble.webp') center/cover fixed;color:var(--ink);font:16px/1.5 system-ui,sans-serif}a{color:var(--gold)}button,select{font:inherit;touch-action:manipulation}button,select{border:1px solid var(--edge);background:#0a2236b8;color:var(--ink);border-radius:9px;padding:10px 14px;min-height:44px}button{cursor:pointer}button:disabled{opacity:.5;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #ffe19a;outline-offset:3px}.gold{background:linear-gradient(#f1d490,#b88b3e);color:#152233;font-weight:750}header,main,footer{width:min(1140px,100%);margin:auto;padding:12px 20px}header{display:flex;align-items:center;gap:20px;border-bottom:1px solid var(--edge)}header img{width:180px;height:60px;object-fit:contain}header nav{margin-left:auto;font-size:14px}h1,h2{font-family:Georgia,serif;color:var(--gold);font-weight:500}h1{font-size:clamp(27px,4vw,42px);line-height:1.1;margin:8px 0}.eyebrow{letter-spacing:.18em;color:var(--gold);font-size:11px;margin:0}.lead{margin:8px 0 18px;color:#d9dfdf}main{padding-top:22px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:22px}.surface{border:1px solid var(--edge);border-radius:16px;background:#071b2b66;backdrop-filter:blur(2px);padding:16px}.toolbar{display:flex;align-items:end;gap:10px;flex-wrap:wrap}.toolbar label{font-size:12px;color:var(--gold);display:grid;gap:4px}.toolbar select{max-width:100%}#turn{font:24px Georgia,serif;color:var(--gold);margin:12px 0 0}#message{min-height:26px;margin:6px 0;color:#e7e8de}#board{position:relative;aspect-ratio:1.12;max-width:100%;isolation:isolate}#board canvas{width:100%;height:100%;position:absolute;inset:0;z-index:1}#board [data-square]{position:absolute;z-index:2;border:0;padding:0;border-radius:0;background:transparent;min-height:0;outline-offset:-3px}#board [data-square] img,#board [data-square] .coordinate,#board [data-square] .crown{display:none}#board [data-square]:focus-visible{outline:3px solid #ffdf83;background:#ffe29c22}#board.flat{display:grid;grid-template-columns:repeat(8,1fr);aspect-ratio:1;border:5px solid #b99550;border-radius:3px;margin:12px auto 20px;width:min(100%,650px)}#board.flat canvas{display:none}#board.flat [data-square]{position:relative!important;inset:auto!important;width:100%!important;height:100%!important;aspect-ratio:1;background:#e8dfc5}#board.flat [data-square].dark{background:#153752}#board.flat [data-square].selected{box-shadow:inset 0 0 0 4px #ffe09c}#board.flat [data-square].legal{box-shadow:inset 0 0 0 4px #68c4a5}#board.flat [data-square].last{background:#93875c}#board.flat [data-square] img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}#board.flat .coordinate{display:block;position:absolute;bottom:0;left:2px;color:#142b40;font-size:9px;font-weight:700}#board.flat .dark .coordinate{color:#e7d7af}#board.flat .crown{display:block;position:absolute;top:0;right:2px;font-size:14px;color:#ffe078;text-shadow:0 1px 2px #000}.hint{font-size:12px;color:#c5d1d6;margin:8px 0}.actions{display:flex;gap:8px;flex-wrap:wrap}aside h2{font-size:22px;margin:0 0 10px}aside .surface{margin-bottom:14px}#history{max-height:190px;overflow:auto;font-size:13px;white-space:pre-wrap;font-family:ui-monospace,monospace;line-height:1.8}details summary{cursor:pointer;color:var(--gold)}details p{font-size:13px}#assetStatus{font-size:12px;color:#ccdaa8}.record{font-size:13px}dialog{border:1px solid var(--gold);border-radius:16px;background:#102c43;color:var(--ink);max-width:min(94vw,500px)}dialog::backdrop{background:#0009}.promotion{display:flex;flex-wrap:wrap;gap:10px}.promotion button{min-width:90px}footer{font-size:12px;color:#c9cbbd}#error{color:#ffbf9d}#drawOffer{padding:10px;border:1px solid var(--edge);border-radius:10px;margin-bottom:10px}#drawOffer[hidden]{display:none}.loading{opacity:.7}@media(max-width:860px){.layout{grid-template-columns:1fr}aside{display:grid;grid-template-columns:1fr 1fr;gap:12px}header,main,footer{padding-inline:14px}header img{width:140px;height:45px}}@media(max-width:500px){main{padding-top:14px}.surface{padding:12px}.toolbar{gap:8px}.toolbar select{font-size:14px;padding:9px 7px}.toolbar button{padding-inline:10px}.lead{font-size:14px;margin-bottom:12px}#board{aspect-ratio:.94;margin-inline:-9px}aside{display:block}header nav{font-size:12px}#turn{font-size:21px}.hint{font-size:11px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}