/* Host-only geometry. The website's theme, typography, and game layouts stay in charge. */
html.telegram-mini-app {
  --ncb-tg-inset-top:calc(max(env(safe-area-inset-top,0px),var(--ncb-tg-safe-top,0px)) + var(--ncb-tg-content-safe-top,0px));
  --ncb-tg-inset-right:calc(max(env(safe-area-inset-right,0px),var(--ncb-tg-safe-right,0px)) + var(--ncb-tg-content-safe-right,0px));
  --ncb-tg-inset-bottom:calc(max(env(safe-area-inset-bottom,0px),var(--ncb-tg-safe-bottom,0px)) + var(--ncb-tg-content-safe-bottom,0px));
  --ncb-tg-inset-left:calc(max(env(safe-area-inset-left,0px),var(--ncb-tg-safe-left,0px)) + var(--ncb-tg-content-safe-left,0px));
  scroll-padding-top:var(--ncb-tg-inset-top);
  scroll-padding-bottom:var(--ncb-tg-inset-bottom);
}
html.telegram-mini-app body {
  min-height:var(--ncb-tg-viewport-stable-height,100svh);
  padding-top:var(--ncb-tg-inset-top);
  padding-right:var(--ncb-tg-inset-right);
  padding-bottom:var(--ncb-tg-inset-bottom);
  padding-left:var(--ncb-tg-inset-left);
}
html.telegram-mini-app :is(.site-dialog,.wallet-admin-confirm,.admin-panel-review-dialog) {
  max-width:calc(100vw - 32px - var(--ncb-tg-inset-left) - var(--ncb-tg-inset-right));
  max-height:calc(var(--ncb-tg-viewport-height,100dvh) - 32px - var(--ncb-tg-inset-top) - var(--ncb-tg-inset-bottom));
  inset:var(--ncb-tg-inset-top) var(--ncb-tg-inset-right) var(--ncb-tg-inset-bottom) var(--ncb-tg-inset-left);
}
html.telegram-mini-app .site-dialog.dialog-fallback {
  inset:calc(var(--ncb-tg-inset-top) + (var(--ncb-tg-viewport-height,100dvh) - var(--ncb-tg-inset-top) - var(--ncb-tg-inset-bottom))/2) auto auto calc(var(--ncb-tg-inset-left) + (100vw - var(--ncb-tg-inset-left) - var(--ncb-tg-inset-right))/2);
}
html.telegram-mini-app .skip-link {
  top:calc(12px + var(--ncb-tg-inset-top));
  left:calc(12px + var(--ncb-tg-inset-left));
}
html.telegram-mini-app .activity-feed { top:calc(20px + var(--ncb-tg-inset-top)); }
html.telegram-mini-app .activity-feed-panel {
  max-height:min(650px,calc(var(--ncb-tg-viewport-stable-height,100svh) - 180px - var(--ncb-tg-inset-top) - var(--ncb-tg-inset-bottom)));
}

/* Game frames follow the stable host viewport while dialogs follow the current viewport. */
@media(max-width:600px),(max-width:960px) and (max-height:500px) {
  html.telegram-mini-app body[data-game-ui="compact"] #games-hub {
    --ncb-game-viewport-height:clamp(360px,calc(var(--ncb-tg-viewport-stable-height,100vh) - var(--ncb-tg-inset-top) - var(--ncb-tg-inset-bottom) - 240px),620px);
  }
  html.telegram-mini-app body[data-game-ui="compact"] .game-footer {
    padding-bottom:12px;
  }
  html.telegram-mini-app body[data-game-ui="compact"] .game-header:has(#header-bonus) .player-menu-panel {
    width:min(260px,calc(100vw - 24px - var(--ncb-tg-inset-left) - var(--ncb-tg-inset-right)));
    max-height:max(44px,calc(var(--ncb-tg-viewport-height,100vh) - var(--ncb-tg-inset-top) - var(--ncb-tg-inset-bottom) - 120px));
  }
}