html,body { width:100%; height:100%; font-family:Arial,sans-serif; }
.toolbar { position:fixed; inset:0 0 auto; z-index:3; height:30px; display:flex; align-items:center; justify-content:center; gap:10px; color:#ffe087; font-size:12px; background:#171b20; }
.toolbar button,.toolbar a { color:#edf1f4; background:#303945; border:0; border-radius:4px; padding:4px 8px; font-size:11px; cursor:pointer; text-decoration:none; }
#touch-controls { display:none; position:fixed; inset:auto 12px 10px; z-index:4; align-items:center; justify-content:space-between; pointer-events:none; }
#touch-controls button { width:48px; height:44px; border:1px solid #596b72; border-radius:10px; background:#253b43; color:#fff; font-size:22px; touch-action:none; pointer-events:auto; }
.directions { display:grid; grid-template-columns:repeat(3,48px); gap:4px; }
.directions button:first-child { grid-column:2; }
.directions button:nth-child(2) { grid-column:1; }
#touch-controls .fire { width:68px; height:68px; background:#79541c; font-size:16px; }
#touch-controls button.held { background:#a36c1b; }
@media(pointer:coarse) { #touch-controls { display:flex; } }