body{margin:0;background:#fff9ec;color:#2a1f00;font-family:system-ui;display:flex;flex-direction:column;align-items:center}#top{padding:10px;display:flex;gap:8px;align-items:center;width:100%;max-width:min(720px,95vw);margin:0 auto;flex-wrap:wrap}#board{width:min(720px,95vw);aspect-ratio:1;display:grid;grid-template:repeat(8,1fr)/repeat(8,1fr);border:4px solid #2A1F00;margin:10px auto;background:#2a1f00}#wrap{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;width:100%}#side{display:flex;flex-direction:column;gap:8px;max-width:320px;padding:8px}.sq{display:flex;align-items:center;justify-content:center;position:relative;width:100%;height:100%}.l{background:#f5e7c6}.d{background:#b8813a}.hl{outline:3px solid #3fb984;outline-offset:-3px}.last{box-shadow:inset 0 0 0 3px #3fb98480}.atk{background:radial-gradient(circle,rgba(63,185,132,.45) 30%,transparent 70%)}.pc{display:flex;align-items:center;justify-content:center;width:100%;height:100%;cursor:grab}.pc svg{width:95%;height:95%;pointer-events:none}#info,#hist{width:100%;max-width:min(720px,95vw);margin:0 auto;padding:8px}#hist{max-height:160px;overflow:auto;background:#f5f1e3;border-radius:8px}input,button{background:#182433;border:1px solid #3a4d63;color:#fff;padding:6px 8px;border-radius:8px}.hidden{display:none}