*{margin:0;padding:0;box-sizing:border-box}html{height:100%}body{min-height:100%;background:#1a1714;color:#e8e2d9;font-family:system-ui,sans-serif;display:flex;justify-content:center;-webkit-tap-highlight-color:transparent}#app{width:min(100vw,60vh);padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);display:flex;flex-direction:column;gap:12px}.status{min-height:44px;display:flex;align-items:center;justify-content:center;font-size:18px}.board{display:grid;width:100%;aspect-ratio:1;-webkit-user-select:none;user-select:none}.cell{position:relative;border:0;padding:0;font:inherit;aspect-ratio:1;display:flex;align-items:center;justify-content:center;cursor:pointer}.cell.light{background:#b8a488}.cell.dark{background:#7a5f43}.cell.selected{outline:3px solid #f2c14e;outline-offset:-3px;z-index:1}.cell.target-move:after{content:"";position:absolute;width:28%;height:28%;border-radius:50%;background:#f2c14ed9}.cell.target-attack{outline:3px solid #d64541;outline-offset:-3px;z-index:1}.piece{font-size:min(9vw,5.4vh);line-height:1}.piece.player{color:#f5f1e8;text-shadow:0 1px 2px rgba(0,0,0,.6)}.piece.enemy{color:#262019;text-shadow:0 1px 1px rgba(255,255,255,.25)}.hp{position:absolute;right:4%;bottom:2%;font-size:min(3.4vw,2vh);font-weight:700;color:#fff;background:#333;border-radius:999px;min-width:1.5em;text-align:center;padding:1px 2px}.footer{display:flex;justify-content:center;padding-bottom:12px}.new-battle,.log-toggle{min-height:44px;min-width:44px;padding:0 24px;font:inherit;font-size:16px;color:#e8e2d9;background:#33291f;border:1px solid #55452f;border-radius:8px;cursor:pointer}.footer{gap:12px}.log{margin:0 12px 16px;border:1px solid #55452f;border-radius:8px;padding:8px 12px}.log summary{min-height:44px;display:flex;align-items:center;cursor:pointer}.log pre{font-size:13px;line-height:1.5;white-space:pre-wrap;word-break:break-word;max-height:40vh;overflow-y:auto;color:#c9c0b2}