/* Keep the board and primary input visible together; tools open only on demand. */
.directions{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;max-width:360px}
.directions>button,.directions button{width:100%;min-height:48px;font-size:24px}
.cell canvas{inset:18%;width:64%;height:64%}
.cell.player{overflow:visible;z-index:2}
.board-wrap{box-shadow:none}
.board-footer{font-size:11px}
.directions button:hover,.sheet button:hover,dialog button:hover,#next:hover,#weapons button.selected:hover{background:#315e69;color:#fff4dc}
.equipment{display:flex;gap:6px;align-items:start;position:relative}
#weapons{flex:1;min-width:0}#tool-menu{flex:0 0 64px}
#tool-menu summary{cursor:pointer;list-style:none;min-height:44px;border:1px solid var(--line);padding:10px 6px;text-align:center;background:#f8f5ed;font-size:15px;border-radius:3px;touch-action:manipulation}
#tool-menu summary::-webkit-details-marker{display:none}
#tool-menu summary:focus-visible{outline:3px solid #2d747d;outline-offset:2px}
#tool-menu[open] summary{background:#244954;color:#fff4dc}
#tool-menu .tools{position:absolute;z-index:5;bottom:51px;right:0;width:100%;min-width:260px;background:#f8f5ed;padding:10px;border:1px solid #96aaa8;box-shadow:0 4px 0 #0002;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0}
#tool-menu .tools button{min-height:48px;font-size:15px;padding:8px}
@media(max-width:600px){
 #app{padding:10px 12px max(12px,env(safe-area-inset-bottom))}
 header{padding:0 0 10px}header p{margin-top:4px}header button{min-height:44px}
 nav{margin:6px 0}nav button{padding:6px;min-height:44px}
 .status{margin:10px 0;gap:8px}.status span{margin-bottom:4px}.status #reaction-change{min-height:14px;margin-top:2px}
 .board-wrap{padding:8px}.board-footer{padding-top:6px;font-size:11px}
 [data-mode=adventure] .board-wrap{width:min(100%,max(232px,calc(100svh - 580px)));margin-inline:auto}
 [data-mode=adventure] .status{margin:6px 0}[data-mode=adventure] .status strong{font-size:28px}
 [data-mode=adventure] #reaction-change{font-size:11px}
 #health{padding:8px 0;font-size:14px}.message{padding:9px 0;min-height:67px}.message p{font-size:16px;line-height:1.5}
 [data-mode=adventure] .message{min-height:51px}[data-mode=adventure] #world-note{display:none}
 .directions{margin-top:4px;max-width:none;gap:7px}
 footer{margin-top:9px;padding-top:8px}footer span{font-size:11px}
 #adventure-actions{padding-top:6px}.attack{min-height:44px;margin-bottom:4px;padding:7px}
 .sheet{padding:22px}.sheet h2{font-size:29px}.sheet p{font-size:16px;line-height:1.8}
}