/* Бабай · Telegram Mini App: экран загрузки и безопасные зоны полноэкранного режима.
   --tg-safe-*    — системная безопасная зона (вырез, статус-бар), из Telegram.WebApp.safeAreaInset
   --tg-content-* — зона, закрытая кнопками Telegram поверх игры (contentSafeAreaInset)
   --tg-extra-*   — то, что ещё не учтено через env(safe-area-inset-*) в стилях игры. */
:root {
  --tg-top: calc(var(--tg-safe-top, 0px) + var(--tg-content-top, 0px));
  --tg-bottom: calc(var(--tg-safe-bottom, 0px) + var(--tg-content-bottom, 0px));
  --tg-left: calc(var(--tg-safe-left, 0px) + var(--tg-content-left, 0px));
  --tg-right: calc(var(--tg-safe-right, 0px) + var(--tg-content-right, 0px));
  --tg-extra-top: calc(var(--tg-content-top, 0px) + max(0px, var(--tg-safe-top, 0px) - env(safe-area-inset-top, 0px)));
  --tg-extra-bottom: calc(var(--tg-content-bottom, 0px) + max(0px, var(--tg-safe-bottom, 0px) - env(safe-area-inset-bottom, 0px)));
  --tg-extra-left: calc(var(--tg-content-left, 0px) + max(0px, var(--tg-safe-left, 0px) - env(safe-area-inset-left, 0px)));
  --tg-extra-right: calc(var(--tg-content-right, 0px) + max(0px, var(--tg-safe-right, 0px) - env(safe-area-inset-right, 0px)));
}

/* ------------------------------------------------------------ Mini App: общее */
body.tg-app {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  overscroll-behavior: none;
}
body.tg-app :is(button, img, canvas, .yard-scene, .kiosk-stage) { -webkit-user-select: none; user-select: none; }
body.net-mode #saveStatus { opacity: .8; }

/* ------------------------------------------------------------ полноэкранный режим */
body.tg-fullscreen:not(.club-live):not(.alimony-live) .shell {
  padding-top: calc(var(--tg-top) + 8px) !important;
  padding-bottom: calc(var(--tg-bottom) + 8px) !important;
  padding-left: max(10px, calc(var(--tg-left) + 6px)) !important;
  padding-right: max(10px, calc(var(--tg-right) + 6px)) !important;
}
body.tg-fullscreen.club-live .club-arena-badge,
body.tg-fullscreen.club-live .club-arena-tools,
body.tg-fullscreen.club-live #clubAlert { margin-top: var(--tg-extra-top); }
body.tg-fullscreen.club-live .club-arena-badge { margin-left: var(--tg-extra-left); }
body.tg-fullscreen.club-live .club-arena-tools { margin-right: var(--tg-extra-right); }
body.tg-fullscreen.club-live .club-bottom-dock { margin-bottom: var(--tg-extra-bottom); }
@media (orientation: landscape) and (max-height: 520px) {
  body.tg-fullscreen.club-live.touch-ui .club-bottom-dock { margin-top: var(--tg-extra-top); margin-bottom: 0; }
}
body.tg-fullscreen.alimony-live #alimony {
  --al-safe-left: calc(max(12px, env(safe-area-inset-left)) + var(--tg-extra-left));
  --al-safe-right: calc(max(12px, env(safe-area-inset-right)) + var(--tg-extra-right));
  --al-safe-top: calc(max(12px, env(safe-area-inset-top)) + var(--tg-extra-top));
  padding-bottom: calc(env(safe-area-inset-bottom) + var(--tg-extra-bottom));
}
body.tg-fullscreen.touch-ui {
  --tc-pad-l: calc(max(18px, env(safe-area-inset-left)) + var(--tg-extra-left));
  --tc-pad-r: calc(max(16px, env(safe-area-inset-right)) + var(--tg-extra-right));
  --tc-pad-b: calc(max(16px, env(safe-area-inset-bottom)) + var(--tg-extra-bottom));
}
body.tg-fullscreen .babay-presentation {
  padding: calc(env(safe-area-inset-top) + var(--tg-extra-top)) calc(env(safe-area-inset-right) + var(--tg-extra-right))
    calc(env(safe-area-inset-bottom) + var(--tg-extra-bottom)) calc(env(safe-area-inset-left) + var(--tg-extra-left));
}
body.tg-fullscreen .alimony-intro-content { margin-top: var(--tg-extra-top); }
body.tg-fullscreen #toast { margin-top: var(--tg-top); }
body.tg-fullscreen dialog[open] { top: var(--tg-top); bottom: var(--tg-bottom); max-height: calc(100dvh - var(--tg-top) - var(--tg-bottom) - 20px) !important; }

/* ------------------------------------------------------------ экран загрузки */
#babayBoot {
  position: fixed; inset: 0; z-index: 2147483000;
  display: grid; place-items: center;
  padding: calc(var(--tg-top) + 24px) 20px calc(var(--tg-bottom) + 24px);
  background: radial-gradient(120% 80% at 50% 0%, #2a1f17 0%, #131118 55%, #0b0a0e 100%);
  color: #f3ead7; font: 15px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  transition: opacity .35s ease, visibility .35s;
  overflow: auto;
}
#babayBoot.done { opacity: 0; visibility: hidden; pointer-events: none; }
#babayBoot .bb-card { width: min(440px, 100%); text-align: center; display: grid; gap: 14px; }
#babayBoot .bb-logo { display: inline-flex; align-items: baseline; justify-content: center; gap: 2px; margin: 0 auto 4px; }
#babayBoot .bb-logo b { font: 900 44px/1 Georgia, "Times New Roman", serif; letter-spacing: .06em; color: #ead7a1; text-shadow: 0 4px 24px #0009; }
#babayBoot .bb-logo i { font: 900 30px/1 Georgia, serif; font-style: normal; color: #ead7a1cc; }
#babayBoot .bb-sub { font-size: 12px; letter-spacing: .18em; color: #c1b9ac; text-transform: uppercase; }
#babayBoot .bb-title { margin: 0; font-size: 20px; font-weight: 800; color: #fff3da; }
#babayBoot .bb-text { margin: 0; color: #d8cfbf; }
#babayBoot .bb-fine { margin: 0; color: #a59d90; font-size: 12.5px; }
#babayBoot .bb-bar { height: 6px; border-radius: 6px; background: #ffffff14; overflow: hidden; }
#babayBoot .bb-bar i { display: block; height: 100%; width: 8%; border-radius: 6px; background: linear-gradient(90deg, #a87049, #ead7a1); transition: width .25s ease; }
#babayBoot .bb-bar.indeterminate i { width: 35%; animation: bb-slide 1.1s ease-in-out infinite; }
@keyframes bb-slide { 0% { transform: translateX(-110%); } 100% { transform: translateX(320%); } }
#babayBoot .bb-status { min-height: 1.4em; color: #c1b9ac; font-size: 13px; }
#babayBoot .bb-list { display: grid; gap: 8px; margin: 2px 0; }
#babayBoot button, #babayBoot a.bb-btn {
  appearance: none; border: 0; border-radius: 12px; padding: 13px 16px; width: 100%;
  font: 700 15px/1.2 inherit; font-family: inherit; color: #1b130d; background: linear-gradient(180deg, #f0d9a0, #d3a85f);
  box-shadow: 0 6px 18px #0007, inset 0 1px #fff6; cursor: pointer; text-decoration: none; display: block;
}
#babayBoot button.bb-channel { display: flex; align-items: center; justify-content: space-between; gap: 10px; text-align: left;
  color: #f3ead7; background: linear-gradient(180deg, #2c2420, #201a17); border: 1px solid #a8704955; }
#babayBoot button.bb-channel span { opacity: .75; font-weight: 600; font-size: 13px; }
#babayBoot button.bb-secondary { color: #f3ead7; background: #ffffff12; box-shadow: none; border: 1px solid #ffffff1f; }
#babayBoot button:active, #babayBoot a.bb-btn:active { transform: translateY(1px); filter: brightness(.95); }
#babayBoot button[disabled] { opacity: .6; cursor: default; }
#babayBoot .bb-error { color: #f1bb95; }
