/* Player v3.10.123 — final paint/compositing overrides for high-FPS interaction. */
:root {
  --perf-fast: 90ms;
  --perf-normal: 150ms;
  --perf-ease: cubic-bezier(.2,.72,.2,1);
}

html { scroll-behavior: auto; }

/* Never animate paint-heavy properties. Keep feedback on compositor-safe transforms/opacity. */
.button,
.icon-button,
.nav-button,
.mobile-bottom-nav-button,
.notification-button,
.wallet-action-tab,
.wallet-inner-tab,
.account-center-tab,
.lobby-category-button,
.featured-game-card,
.compact-game-card,
.game-logo,
.type-btn,
.mode-btn,
.ball,
.outline-btn,
.place-btn,
.side-tab,
.wallet-btn,
.drawer-action,
.mini-btn,
.menu,
.modal-save,
.modal-cancel {
  transition-property: transform, opacity, color, background-color, border-color !important;
  transition-duration: var(--perf-fast) !important;
  transition-timing-function: var(--perf-ease) !important;
}

/* Heavy sections render lazily when they are below the viewport. */
@supports (content-visibility: auto) {
  .view.active:not(.game-view) .panel,
  .view.active:not(.game-view) .panel-grid,
  .view.active:not(.game-view) .table-wrap,
  #gameLobby .game-showcase-section,
  #gameLobby .game-provider-section,
  #gameLobby .lobby-results-section,
  .side-panel,
  .summary-card,
  .txn-section {
    content-visibility: auto;
    contain-intrinsic-size: auto 420px;
  }
}

/* Contain complex layout/paint islands so a small change does not invalidate the page. */
.panel,
.stat-card,
.featured-game-card,
.compact-game-card,
.manual-card,
.keyin-card,
.summary-card,
.side-panel,
.result-entry,
.wallet-box,
.account-drawer,
.modal,
.notification-panel,
.txn-item {
  contain: layout paint style;
}

/* Desktop glass stays visible, but uses a bounded blur budget instead of stacked 16–24px filters. */
@media (min-width: 861px) {
  .topbar { backdrop-filter: blur(8px) saturate(112%) !important; -webkit-backdrop-filter: blur(8px) saturate(112%) !important; }
  .wallet-box,
  .result-entry,
  .manual-card,
  .keyin-card,
  .summary-card,
  .side-panel,
  .result-item,
  .bet-item,
  .modal,
  .account-drawer,
  .txn-item,
  .rate-field {
    backdrop-filter: blur(7px) saturate(108%) !important;
    -webkit-backdrop-filter: blur(7px) saturate(108%) !important;
  }
  .modal-overlay,
  .drawer-backdrop { backdrop-filter: blur(3px) !important; -webkit-backdrop-filter: blur(3px) !important; }
}

/* During scrolling/rapid input, prioritize frames over decorative paint. */
.ui-scrolling .topbar,
.ui-scrolling .panel,
.ui-scrolling .manual-card,
.ui-scrolling .keyin-card,
.ui-scrolling .summary-card,
.ui-scrolling .side-panel,
.ui-scrolling .wallet-box,
.ui-scrolling .result-entry,
.ui-scrolling .modal,
.ui-scrolling .account-drawer,
.ui-scrolling .notification-panel,
.ui-interacting .manual-card,
.ui-interacting .keyin-card,
.ui-interacting .summary-card,
.ui-interacting .side-panel {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
}

.ui-scrolling .featured-game-card,
.ui-scrolling .compact-game-card,
.ui-scrolling .panel,
.ui-scrolling .manual-card,
.ui-scrolling .keyin-card,
.ui-scrolling .summary-card,
.ui-scrolling .side-panel,
.ui-scrolling .txn-item {
  box-shadow: none !important;
}

.ui-scrolling .motion-reveal,
.ui-scrolling #headerBrandMark,
.ui-scrolling .game-logo.active .game-brand-logo,
.ui-paused *,
.ui-performance-lite #headerBrandMark,
.ui-performance-lite .game-logo.active .game-brand-logo {
  animation-play-state: paused !important;
}

/* Automatic fallback when the browser reports repeated long tasks. */
.ui-performance-lite .topbar,
.ui-performance-lite .panel,
.ui-performance-lite .manual-card,
.ui-performance-lite .keyin-card,
.ui-performance-lite .summary-card,
.ui-performance-lite .side-panel,
.ui-performance-lite .wallet-box,
.ui-performance-lite .result-entry,
.ui-performance-lite .modal,
.ui-performance-lite .account-drawer,
.ui-performance-lite .notification-panel,
.ui-motion-lite .topbar,
.ui-motion-lite .panel,
.ui-motion-lite .manual-card,
.ui-motion-lite .keyin-card,
.ui-motion-lite .summary-card,
.ui-motion-lite .side-panel,
.ui-motion-lite .wallet-box,
.ui-motion-lite .result-entry,
.ui-motion-lite .modal,
.ui-motion-lite .account-drawer,
.ui-motion-lite .notification-panel {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
  box-shadow: none !important;
}

.ui-performance-lite .motion-reveal,
.ui-motion-lite .motion-reveal {
  transition-duration: 0ms !important;
  animation: none !important;
}

/* Avoid a permanently promoted full-screen background on small GPUs. */
@media (max-width: 860px) {
  body::before { transform: none !important; }
  .topbar,
  .manual-card,
  .keyin-card,
  .summary-card,
  .side-panel,
  .wallet-box,
  .result-entry,
  .modal,
  .account-drawer,
  .notification-panel {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    filter: none !important;
  }
  .featured-game-card,
  .compact-game-card,
  .manual-card,
  .keyin-card,
  .summary-card,
  .side-panel { box-shadow: 0 8px 20px rgba(0,0,0,.16) !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
