/* ── Планшет / компьютер: вариант A (владелец, 2026-09-23) ─────────────────
   Всё приложение — столбец телефонной ширины по центру, по бокам тёмное поле.
   Контент не растягивается: на 1280px ученик видит тот же экран, что на
   телефоне. Файл подключён последним и работает только от 600px — телефон
   он не трогает вообще.

   Полноэкранные слои (шторки, лента, плеер, экран ученика, диалоги) обычно
   прибиты к краям окна (position:fixed; inset:0) — сдвигаем им края к краям
   столбца. Слои, которые JS рисует инлайн-стилем, ловим по атрибуту style
   (браузер хранит его в виде «position: fixed; inset: 0px»). */
@media (min-width: 600px) {
  :root {
    --col: 480px;
    --side: max(0px, calc((100vw - var(--col)) / 2));
  }

  html { background: #050507; }
  body {
    max-width: var(--col);
    margin: 0 auto;
    min-height: 100vh;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.05), 0 0 80px rgba(0, 0, 0, 0.7);
  }

  /* Слои во весь экран → во весь столбец. */
  .sheet,
  .app-dialog,
  .media-lightbox,
  #bootCover,
  .slot-bg, .slot-bg-sparkles, .slot-bg-orbs,
  .slot-bonus-overlay, .slot-payout-choice-overlay,
  .slot-intro-overlay, .slot-bonus-video-overlay,
  .slot-skin.slot-screen.slot-focus,
  .avatar-live-video-wrap.avatar-fullscreen-mode,
  body > [style*="position: fixed"][style*="inset: 0"] {
    left: var(--side) !important;
    right: var(--side) !important;
  }
  .avatar-live-video-wrap.avatar-fullscreen-mode { width: auto !important; }

  /* Прибитые к низу панели. */
  .bottom-nav {
    left: calc(var(--side) + 4px) !important;
    right: calc(var(--side) + 4px) !important;
  }
  .ss-prompter,
  .avatar-screen.avatar-live-active .avatar-live-dock {
    left: var(--side) !important;
    right: var(--side) !important;
  }
  .toast-stack,
  .tour-card {
    left: calc(var(--side) + 16px) !important;
    right: calc(var(--side) + 16px) !important;
  }
}