/* Keep shop navigation outside the game's HUD and touch controls. */
.native-owner-game{--native-owner-bar:calc(56px + env(safe-area-inset-top))}
.native-owner-game iframe{height:calc(100% - var(--native-owner-bar));margin-top:var(--native-owner-bar)}
.native-owner-exit{top:calc(6px + env(safe-area-inset-top));bottom:auto}
.native-owner-surface{position:absolute;inset:0;width:100%;height:100%;overscroll-behavior:none}
/* Telegram locks the current orientation, so do not lock a portrait launch.
   A real landscape iframe works without OS/fullscreen permissions or a second SDK. */
@media (orientation:portrait){
 .native-owner-surface{inset:auto;left:50%;top:50%;width:100dvh;height:100vw;transform:translate(-50%,-50%) rotate(90deg)}
 .native-owner-game{--native-owner-bar:calc(56px + env(safe-area-inset-left))}
 .native-owner-exit{top:calc(6px + env(safe-area-inset-left));left:max(12px,env(safe-area-inset-bottom))}
}

/* Append after owner-toolbar.css. Physical insets are applied before CSS rotation. */
.native-owner-game{--native-owner-safe-top:0px;--native-owner-safe-right:0px;--native-owner-safe-bottom:0px;--native-owner-safe-left:0px;--native-owner-safe-width:calc(100vw - var(--native-owner-safe-left) - var(--native-owner-safe-right));--native-owner-safe-height:calc(100dvh - var(--native-owner-safe-top) - var(--native-owner-safe-bottom))}
.native-owner-surface{inset:auto;left:var(--native-owner-safe-left);top:var(--native-owner-safe-top);width:var(--native-owner-safe-width);height:var(--native-owner-safe-height);transform:none}
@media (orientation:portrait){.native-owner-surface{left:calc(50% + (var(--native-owner-safe-left) - var(--native-owner-safe-right))/2);top:calc(50% + (var(--native-owner-safe-top) - var(--native-owner-safe-bottom))/2);width:var(--native-owner-safe-height);height:var(--native-owner-safe-width);transform:translate(-50%,-50%) rotate(90deg)}}
.native-owner-game iframe{height:100%;margin-top:0}
.native-owner-tools-toggle,.native-owner-tool-panel button{min-height:44px;padding:8px 14px;border:1px solid #c8b99a;border-radius:24px;background:#263747ed;color:#f3e9cd;font:600 14px/1.3 system-ui;touch-action:manipulation;cursor:pointer}
.native-owner-tools-toggle{position:absolute;left:50%;top:8px;transform:translateX(-50%);z-index:4}
.native-owner-tool-panel{position:absolute;left:50%;top:60px;transform:translateX(-50%);width:max-content;max-width:calc(100% - 24px);display:flex;flex-wrap:wrap;justify-content:center;gap:8px;padding:10px;background:#101c29f2;border:1px solid #c8b99a77;border-radius:16px;z-index:4;box-sizing:border-box}
.native-owner-tool-panel[hidden]{display:none}
.native-owner-tool-panel button{position:static!important;inset:auto!important;transform:none!important;max-width:none!important;white-space:nowrap;flex:none}
.native-owner-tools-toggle:focus-visible,.native-owner-tool-panel button:focus-visible{outline:2px solid #f5df9a;outline-offset:3px}
