html,body{margin:0;height:100%;overflow:hidden;background:#9fc9e8;font-family:-apple-system,system-ui,sans-serif;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#cv{position:fixed;inset:0;width:100%;height:100%;touch-action:none;display:block}
.hidden{display:none!important}
#hud{position:fixed;top:calc(8px + env(safe-area-inset-top));left:8px;right:8px;display:flex;flex-wrap:wrap;gap:6px;pointer-events:none}
#hud button,#hud span{pointer-events:auto}
button{font:inherit;font-size:15px;border:0;border-radius:10px;padding:9px 12px;background:#fff;color:#222;box-shadow:0 1px 4px #0004;cursor:pointer;touch-action:manipulation}
button.on{background:#ffd166}
#faction.fire{background:#e0603a;color:#fff}#faction.army{background:#333;color:#fff}
#help{position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));color:#fff;text-shadow:0 1px 3px #000;font-size:13px;text-align:center;pointer-events:none}
#start{position:fixed;left:0;right:0;bottom:0;padding:12px 12px calc(12px + env(safe-area-inset-bottom));background:#fffe;box-shadow:0 -2px 10px #0004;text-align:center}
#start h1{margin:0 0 6px;font-size:22px}
.side{margin:8px 0}.side p{margin:2px 0 6px;font-size:14px}.side b{font-size:16px}
.spot{min-width:44px;margin:2px}.spot.sel{background:#ffd166;outline:2px solid #a67c00}
#goBtn{background:#2a9d4a;color:#fff;font-size:18px;padding:10px 28px;margin-top:6px}
.credit{font-size:11px;color:#666;margin:6px 0 0}
.tag{background:#fffd;border-radius:10px;padding:9px 12px;font-size:15px;box-shadow:0 1px 4px #0004}
.tag.fire{background:#e0603a;color:#fff}.tag.army{background:#333;color:#fff}
.sp.sel{background:#ffd166;outline:2px solid #a67c00}button:disabled{opacity:.45}
@media (max-width:600px){#hud button,.tag{font-size:13px;padding:7px 9px}}
#toast{position:fixed;top:40%;left:50%;transform:translateX(-50%);background:#ffd166;color:#222;font-weight:bold;font-size:22px;padding:12px 20px;border-radius:14px;box-shadow:0 2px 12px #0006;pointer-events:none}
#palette{position:fixed;left:6px;right:6px;bottom:calc(44px + env(safe-area-inset-bottom));display:flex;flex-wrap:wrap;gap:5px;justify-content:center;align-items:center;touch-action:none}
#palette .ptitle{color:#fff;text-shadow:0 1px 3px #000;font-size:13px;width:100%;text-align:center}
.room{touch-action:none;font-size:14px;padding:8px 10px;background:#fffe}.room.drag{background:#ffd166}
#help{font-size:12px}