html,body{margin:0;height:100%;background:#0b1030;color:#fff;font-family:system-ui,sans-serif}#app{display:flex;flex-direction:column;align-items:center;height:100dvh;box-sizing:border-box;overflow:hidden;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}#hud{padding:2px 8px;font-size:13px;flex:none;white-space:pre}#stage{position:relative;flex:1 1 0;min-height:0;width:100%;display:flex;justify-content:center}canvas{max-width:100%;max-height:100%;aspect-ratio:2 / 1;object-fit:contain;image-rendering:pixelated;display:block;touch-action:manipulation}#banner{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#000a;font-size:24px;text-align:center}#banner[hidden]{display:none}#bar{display:flex;gap:12px;justify-content:center;padding:4px 8px;flex:none}#skills,#controls{display:flex;gap:8px}button{background:#223;color:#fff;border:2px solid #556;border-radius:6px;padding:3px 8px;cursor:pointer;display:flex;align-items:center;gap:6px;font-size:13px}button.selected{border-color:#ff0}button:disabled{opacity:.4}button img{width:24px;height:24px;image-rendering:pixelated}#msg{margin-bottom:12px}#banner{flex-direction:column}#banner-buttons{display:flex;gap:8px;font-size:14px}#banner-buttons button[hidden]{display:none}#banner button{padding:6px 14px}select{background:#223;color:#fff;border:2px solid #556;border-radius:6px;padding:3px 6px;font-size:13px;max-width:230px}#bar{flex-wrap:wrap}