*{box-sizing:border-box}body{margin:0;background:#eeeada;color:#263f36;font:16px/1.45 system-ui}main{max-width:1050px;margin:auto;padding:28px 24px}small{letter-spacing:.16em;font-size:11px;font-weight:800;color:#69735b}h1{font:46px Georgia;margin:8px 0}h1 em{font-weight:normal;color:#9b753e}p{margin:12px 0}button,input,select{font:inherit;color:inherit}button,input,select{border:1px solid #b2b79c;border-radius:9px;background:#fffcf0;padding:10px}button{cursor:pointer}button:disabled{opacity:.45;cursor:default}button:focus-visible{outline:3px solid #267f91}.setup{display:flex;gap:12px;flex-wrap:wrap;align-items:end}.setup label{font-size:12px}.setup label>*{display:block}.setup input{width:140px}.layout{display:grid;grid-template-columns:1.5fr 1fr;gap:28px;margin-top:24px}#status{background:#294f42;color:#fff9e7;padding:12px;border-radius:10px;margin-bottom:12px;min-height:48px;font-weight:700}#board{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;background:#b6bda0;padding:8px;border-radius:12px}.cell{aspect-ratio:1;padding:3px;position:relative;border:2px solid transparent;background:#e9e6d2}.cell.legal{border-color:#8d9d6d;background:#fffce7}.cell.selected{outline:3px solid #286c90;z-index:1}.token{display:block;width:100%;height:100%;border-radius:50%;background-image:url('pieces.webp');background-size:200% 200%;border:4px solid #3d7660}.token.p2{border-color:#bd7c27}.cell small{position:absolute;bottom:0;right:2px;background:#fffcf0;font-size:10px;letter-spacing:0;color:#263f36;padding:0 2px}h2{font:25px Georgia;margin:5px 0 12px}#pieces{display:flex;gap:8px}#pieces button{flex:1;padding:7px;font-size:12px}#pieces button[aria-pressed=true]{outline:3px solid #3d7660}.mini{width:54px;height:54px;background-image:url('pieces.webp');background-size:200% 200%;display:block;margin:auto;border-radius:9px}#reserves{background:#fffae9;padding:14px;border-radius:10px;margin:20px 0}#reserves p{margin:6px 0;font-size:14px}.actions{display:flex;gap:8px;flex-wrap:wrap}#commit{background:#305b4a;color:white}#preview,#message{font-size:14px;min-height:42px}details{margin-top:20px;border-top:1px solid #bec3aa;padding-top:16px}summary{cursor:pointer;font-weight:700}footer{font-size:12px;color:#63735d;margin-top:25px}@media(max-width:650px){main{padding:18px 14px}h1{font-size:34px}.layout{grid-template-columns:1fr;gap:10px}#board{gap:4px;padding:5px}.token{border-width:3px}#pieces .mini{width:40px;height:40px}#reserves{margin:12px 0}.setup{gap:7px}.setup select{max-width:210px}.setup input{width:125px}.cell small{font-size:9px}#message{min-height:20px}}
