/* Reuse the mini-games' exact glyphs (index.html / bubbles.js): Ⅱ ⚙ 🔊 🔇.
   Settings/Sound copy .records + .sound-toggle; Pause copies .pause with the
   Bulles 44px/12px HUD sizing and gameplay-shell.css session background. */
.story-quick-controls{position:absolute;right:max(10px,env(safe-area-inset-right));top:max(10px,env(safe-area-inset-top));z-index:6;display:flex;flex-direction:column;gap:5px;width:44px}
#world-quick-controls button,#coop-quick-controls button{position:static;display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;min-width:44px;min-height:44px;padding:8px;border:1px solid #ffffff30;border-radius:12px;background:#ffffff08;color:#cce5cc;font-family:ui-rounded,'SF Pro Rounded',system-ui,sans-serif;font-size:20px;font-weight:700;line-height:1;touch-action:manipulation}
#world-quick-controls .story-pause-icon,#coop-quick-controls .story-pause-icon{padding:6px;border-color:#ffffff28;background:#102239b3;color:#fff;font-size:19px;font-weight:400}
.story-quick-controls button:focus-visible{outline:3px solid #fff;outline-offset:4px}
.story-audio-settings{border:0;padding:0;margin:8px 0 16px}
.story-audio-settings legend{font-weight:750;font-size:16px;margin-bottom:8px}
.story-audio-settings label{display:flex;align-items:center;gap:10px;min-height:44px;font-size:14px}
.story-audio-settings input[type="checkbox"]{width:22px;height:22px;flex:none}
.story-audio-settings input[type="range"]{width:100%;min-height:44px;display:block;touch-action:pan-x}
.story-audio-settings output{margin-left:auto;white-space:nowrap}
.story-audio-settings button{width:100%;margin:4px 0 8px;min-height:48px}
#world-stage .world-hud,#coop-hud{right:calc(max(10px,env(safe-area-inset-right)) + 54px)}
#coop-settings-panel{position:absolute;inset:0;z-index:13;display:grid;place-items:center;padding:12px;background:#061824df;overflow:auto}
#coop-settings-panel .panel{width:min(100%,500px)}
#coop-settings-panel h2{font:500 26px/1.1 Georgia,serif;color:#ffe8b5}
@media(max-height:420px){.story-quick-controls{top:max(5px,env(safe-area-inset-top));gap:3px}}
/* Reserve the compact 44px column on short landscape screens. */
@media(orientation:landscape) and (max-height:340px) and (min-width:480px){.world-controls,#coop-controls{right:max(64px,calc(env(safe-area-inset-right) + 54px))}}
/* A very narrow split view fits a vertical column between the two pads.
   Keep every icon and arrow target at 44px; no horizontal toolbar fallback. */
@media(orientation:landscape) and (max-height:340px) and (max-width:479px){
 .story-quick-controls{left:calc((100% + env(safe-area-inset-left) - env(safe-area-inset-right) - 44px)/2);right:auto}
 .world-controls,#coop-controls{left:env(safe-area-inset-left);right:env(safe-area-inset-right)}
 #world-stage .world-hud,#world-stage[data-world-arena="true"] .world-hud,#coop-hud{left:max(6px,env(safe-area-inset-left));right:calc((100% - env(safe-area-inset-left) + env(safe-area-inset-right))/2 + 28px);width:auto;max-width:none}
}
