/* Halo v186: a single shared edge-to-edge game surface. */
html:has(body.hg-gaming),body.hg-gaming{overflow:hidden!important;overscroll-behavior:none}
body .hg-arena{position:fixed!important;inset:0!important;width:100%!important;height:100vh!important;height:100dvh!important;max-width:none!important;max-height:none!important;padding:0!important;border:0!important;border-radius:0!important;isolation:isolate;overflow:hidden!important}
body .hg-arena .hg-stage{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;margin:0!important;border:0!important;border-radius:0!important;min-height:0;overflow:hidden}
body .hg-arena .hg-play{height:100%;width:100%;min-height:0}
body .hg-arena,body .hg-arena *{-webkit-user-select:none!important;user-select:none!important;-webkit-touch-callout:none!important}
body .hg-arena :is(input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),textarea,[contenteditable="true"]){-webkit-user-select:text!important;user-select:text!important;-webkit-touch-callout:default!important}
body .hg-arena :is(button,a){-webkit-tap-highlight-color:transparent;touch-action:manipulation}
body .hg-arena :is(svg,img){pointer-events:none;-webkit-user-drag:none}
.hg-inplay{position:absolute;left:max(12px,env(safe-area-inset-left));top:max(12px,env(safe-area-inset-top));z-index:75;display:flex;flex-direction:column;gap:10px;pointer-events:none;width:44px}
body .hg-arena .hg-inplay button{display:grid;place-items:center;box-sizing:border-box;width:44px;height:44px;min-width:44px;min-height:44px;padding:9px!important;border:2px solid #f9ecd0cc;border-radius:14px;box-shadow:0 3px 0 #163d3d44;background:linear-gradient(#4b817ad9,#234e52d9);color:#fff2d1;pointer-events:auto;touch-action:manipulation}
.hg-inplay svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
body .hg-arena .hg-inplay button:focus-visible{outline:3px solid #ffdb88;outline-offset:3px}
body .hg-arena .hg-inplay button:active{transform:translateY(2px)}
/* Keep game-specific HUDs clear of navigation; the world still paints behind it. */
body .hg-arena:is([data-game="skyguard-tank"],[data-game="island-quest"]) :is(.sg-hud,.iq-hud){left:calc(max(12px,env(safe-area-inset-left)) + 60px)}
body .hg-arena.hg-live-game #hg-battle-canvas{position:absolute;inset:0;width:100%;height:100%;max-height:none;flex:none}
body .hg-arena .hg-status{position:absolute;z-index:8;top:max(12px,env(safe-area-inset-top));left:28%;right:24%;margin:0;min-height:0;pointer-events:none;border-radius:12px;background:#102a36b0;max-height:50px;overflow:hidden}
body .hg-arena .hg-status:empty{display:none}
body .hg-arena .hg-players{position:absolute;top:max(12px,env(safe-area-inset-top));left:calc(max(12px,env(safe-area-inset-left)) + 60px);right:max(12px,env(safe-area-inset-right));padding:0;pointer-events:none}
body .hg-arena[data-game="minigolf"] .hg-controls{position:absolute;bottom:max(12px,env(safe-area-inset-bottom));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));background:#162b3caa;border-radius:18px}
/* Puzzle content keeps room for floating controls and phone safe areas. */
body .hg-arena:is([data-game="cube-drop"],[data-game="wood-slide"],[data-game="cross-math"],[data-game="ludo"],[data-game="sea-battle"],[data-game="bubble-birds"],[data-game="tic-tac-toe"]) .hg-play{padding-top:calc(max(12px,env(safe-area-inset-top)) + 48px);padding-bottom:env(safe-area-inset-bottom);box-sizing:border-box}
body .hg-arena:is([data-game="ludo"],[data-game="sea-battle"],[data-game="tic-tac-toe"]) .hg-play{padding-top:calc(max(12px,env(safe-area-inset-top)) + 84px)}
body .hg-arena[data-game="cross-math"] .hg-stage{overflow:auto}
body .hg-arena[data-game="cross-math"] .hg-play{height:auto;min-height:100%}
body .hg-arena .hg-garage{padding-top:calc(max(12px,env(safe-area-inset-top)) + 48px)}
body .hg-arena:is([data-game="cube-drop"],[data-game="wood-slide"],[data-game="cross-math"],[data-game="ludo"],[data-game="sea-battle"],[data-game="bubble-birds"],[data-game="tic-tac-toe"]) .hg-inplay{flex-direction:row;width:auto}
/* Menu options remain available inside the game, with an explicit close action. */
body .hg-arena .hg-menu,body .hg-arena .hg-chat{top:calc(max(12px,env(safe-area-inset-top)) + 54px);right:max(12px,env(safe-area-inset-right));left:auto;bottom:auto;width:min(360px,calc(100% - 24px));max-height:calc(100dvh - max(12px,env(safe-area-inset-top)) - max(12px,env(safe-area-inset-bottom)) - 72px);overflow:auto;z-index:80;box-sizing:border-box}
body .hg-arena .hg-chat{height:calc(100dvh - 94px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
.hg-room-meta h2{margin:0;font-size:20px;color:#ffe0a4}.hg-room-meta small{font-size:9px;letter-spacing:1.6px;color:#a7d6c6}
.hg-menu-tools{display:grid;grid-template-columns:1fr 1fr;gap:8px;flex-shrink:0}
body .hg-arena .hg-menu button{flex-shrink:0;min-height:44px}
body .hg-arena .hg-menu-tools button{padding:10px!important;font-size:12px}
body .hg-arena .hg-result,body .hg-arena .hg-rotate{padding-top:calc(max(12px,env(safe-area-inset-top)) + 52px);padding-bottom:max(12px,env(safe-area-inset-bottom))}
@media(orientation:portrait) and (max-width:650px){body .hg-arena[data-game="island-quest"] .iq-hud{left:calc(max(12px,env(safe-area-inset-left)) + 60px);right:max(10px,env(safe-area-inset-right))}}
@media(prefers-reduced-motion:reduce){body .hg-arena button{transition:none!important}}
/* v187: centered illustrated game menus, shared by every game. */
body .hg-arena .hg-menu-shade{display:none;position:absolute;inset:0;z-index:79;background:#14363ca6}
body .hg-arena:has(.hg-menu:not([hidden])) .hg-menu-shade{display:block}
body .hg-arena .hg-menu,body .hg-arena .hg-leave-card{background:linear-gradient(155deg,#fff1cf,#e9cd91)!important;color:#284e50;border:3px solid #fff5d8!important;border-radius:24px!important;box-shadow:0 6px 0 #8f7246,0 20px 55px #122d3c66,inset 0 0 0 2px #b18a4d;padding:20px!important;text-align:center;box-sizing:border-box}
body .hg-arena .hg-menu{top:50%!important;left:50%!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%);width:min(380px,calc(100% - 32px));max-height:calc(100% - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;overflow:auto;gap:10px;z-index:80;scrollbar-width:thin;scrollbar-color:#628d80 #ead198}
body .hg-arena .hg-menu .hg-native-eyebrow,body .hg-arena .hg-leave-card .hg-native-eyebrow{margin:0;color:#52756b;font-size:10px;font-weight:900;letter-spacing:2px}
body .hg-arena .hg-menu p,body .hg-arena .hg-leave-card p{color:#496664;line-height:1.5;font-size:13px;margin:0}
body .hg-arena .hg-menu .hg-room-meta h2,body .hg-arena .hg-leave-card h2{font-size:26px;color:#284e50;margin:4px 0 10px;font-weight:900}
body .hg-arena .hg-room-meta small{color:#52756b;letter-spacing:1px}
body .hg-arena .hg-menu .hg-menu-tools{display:flex;flex-direction:column;gap:10px}
body .hg-arena .hg-menu button,body .hg-arena .hg-leave-card button{display:block!important;width:100%!important;height:auto!important;min-height:48px!important;min-width:0!important;padding:12px 18px!important;margin:0!important;border:2px solid #fff0c4!important;border-radius:14px!important;background:linear-gradient(#699e8e,#3a726c)!important;color:#fff6d6!important;font:800 14px/1.3 system-ui!important;box-shadow:0 4px 0 #315958,inset 0 1px 0 #ffffff66!important;flex-shrink:0;text-shadow:0 1px #285a5744}
body .hg-arena .hg-menu button::before,body .hg-arena .hg-menu button::after{content:none!important}
body .hg-arena .hg-menu :is(#hg-menu-close,#hg-pause,#hg-resume),body .hg-arena .hg-leave-card #hg-leave-cancel{background:linear-gradient(#ffe7a1,#dfb45e)!important;color:#57451f!important;box-shadow:0 4px 0 #a17c3b,inset 0 1px 0 #fff8de!important;text-shadow:none}
body .hg-arena .hg-menu #hg-menu-leave,body .hg-arena .hg-leave-card #hg-leave-confirm{background:linear-gradient(#c18b65,#995f43)!important;box-shadow:0 4px 0 #75482f,inset 0 1px 0 #ffdcc766!important}
body .hg-arena :is(.hg-menu,.hg-leave-card) button:active{transform:translateY(3px);box-shadow:0 1px 0 #315958!important}
body .hg-arena :is(.hg-menu,.hg-leave-card) button:focus-visible{outline:3px solid #305f64;outline-offset:3px}
body .hg-arena .hg-leave-overlay{position:absolute;inset:0;z-index:90;background:#14363ca6;display:flex;align-items:center;justify-content:center;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));box-sizing:border-box}
body .hg-arena .hg-leave-card{width:min(380px,100%);max-height:100%;overflow:auto;animation:hg-panel-in .16s ease-out}
.hg-leave-icon{margin:12px auto 8px;width:52px;height:52px;border:2px solid #fff3ca;border-radius:16px;background:linear-gradient(#73a596,#447970);box-shadow:0 3px 0 #315958;color:#fff0c6;font:900 32px/48px system-ui}
.hg-leave-actions{display:flex;flex-direction:column;gap:12px;margin-top:20px}
@keyframes hg-panel-in{from{opacity:0;scale:.96}to{opacity:1;scale:1}}
@media(max-height:420px){body .hg-arena .hg-menu,body .hg-arena .hg-leave-card{padding:14px!important;border-radius:18px!important}.hg-leave-icon{display:none}.hg-leave-actions{margin-top:14px}}
@media(prefers-reduced-motion:reduce){body .hg-arena .hg-leave-card{animation:none}}
/* Neutralize app-wide circular close-button rules inside game panels. */
body .hg-arena .hg-menu button,body .hg-arena .hg-leave-card button{aspect-ratio:auto!important;max-height:none!important;position:static!important;inset:auto!important;flex:0 0 auto!important}