/* Desktop layout — только min-width, мобильная вёрстка не трогается */

@media (min-width: 768px) {
  html {
    background-color: #0a0f16;
  }

  body.game-ui {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: 100dvh;
    background:
      radial-gradient(ellipse 100% 70% at 50% -15%, rgba(91, 159, 212, 0.1), transparent 55%),
      linear-gradient(180deg, #0a0f16 0%, #0e1520 50%, #111a28 100%) !important;
  }

  body.game-ui .bg-noise {
    opacity: 0.02 !important;
    mask-image: radial-gradient(ellipse 440px 90vh at 50% 50%, #000 28%, transparent 74%);
  }

  body.game-ui .game-bg-glow {
    mask-image: radial-gradient(ellipse 460px 90vh at 50% 40%, #000 22%, transparent 72%);
  }

  body.game-ui .app-shell {
    width: min(520px, calc(100vw - 40px)) !important;
    max-width: 520px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    border-left: 1px solid rgba(148, 178, 220, 0.1);
    border-right: 1px solid rgba(148, 178, 220, 0.1);
    border-radius: 0;
    box-shadow:
      0 0 0 1px rgba(0, 0, 0, 0.2),
      0 20px 60px rgba(0, 0, 0, 0.35);
    background:
      linear-gradient(180deg, rgba(14, 20, 30, 0.96), rgba(10, 16, 26, 0.98)) !important;
    position: relative;
    z-index: 2;
  }

  body.game-ui .game-header-stack {
    width: 100% !important;
    max-width: none !important;
  }

  body.game-ui .bottom-nav.game-dock {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    width: min(520px, calc(100vw - 40px)) !important;
    max-width: 520px !important;
    bottom: 0 !important;
    border-left: 1px solid rgba(148, 178, 220, 0.1) !important;
    border-right: 1px solid rgba(148, 178, 220, 0.1) !important;
    border-radius: 16px 16px 0 0 !important;
    box-shadow: 0 -10px 32px rgba(0, 0, 0, 0.28) !important;
  }

  body.game-ui .sticky-join-bar {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%);
    width: min(520px, calc(100vw - 40px)) !important;
    max-width: 520px !important;
    border-left: 1px solid rgba(148, 178, 220, 0.1);
    border-right: 1px solid rgba(148, 178, 220, 0.1);
    border-radius: 14px 14px 0 0;
  }

  body.game-ui .pay-modal,
  body.game-ui .filter-sheet,
  body.game-ui .task-modal,
  body.game-ui .profile-ref-modal,
  body.game-ui .receipt-card {
    max-width: 460px;
  }

  body.game-ui .giveaway-filters,
  body.game-ui .showcase-filters {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }

  body.game-ui .giveaways-list .giveaway-item {
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
  }

  body.game-ui .giveaways-list .giveaway-item:hover {
    transform: translateY(-1px);
  }

  body.game-ui .app-topbar.game-topbar {
    position: sticky !important;
    top: 0;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    max-width: none !important;
    transform: none !important;
    padding-top: calc(18px + env(safe-area-inset-top, 0px)) !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  body.game-ui .game-header-stack {
    width: 100% !important;
    max-width: none !important;
    justify-content: space-between !important;
    margin: 0 !important;
  }

  body.game-ui .browser-auth-layer {
    padding: 24px;
  }

  body.game-ui .browser-auth-card {
    width: min(460px, 100%);
  }

  body.game-ui .view,
  body.game-ui .game-panel {
    width: 100%;
  }
}

@media (min-width: 1100px) {
  body.game-ui::before {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background: radial-gradient(ellipse 520px 80vh at 50% 45%, rgba(91, 159, 212, 0.04), transparent 70%);
  }
}
