:root {
  --bg: #101010;
  --bg-subtle: #151515;
  --panel: #202020;
  --panel-hover: #272727;
  --border: rgba(255, 255, 255, 0.13);
  --border-focus: rgba(255, 255, 255, 0.24);
  --text: #ffffff;
  --text-muted: #c8c8c8;
  --text-dark: #8b8b8b;
}

html {
  background: #101010;
}

body {
  background:
    radial-gradient(900px circle at 78% 8%, rgba(var(--site-accent-rgb), 0.12), transparent 62%),
    linear-gradient(180deg, #121212 0%, #0f0f0f 44%, #151515 100%);
}

body::before {
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.026) 1px, transparent 1px);
}

body::before,
.status-dot,
.sale-icon {
  animation: none !important;
}

.noise {
  display: none !important;
}

.header,
.filter-panel,
.product-card,
.modal-backdrop,
.page-loader,
.bento-card {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.product-card::before,
.bento-card::before,
body::after {
  display: none !important;
}

.product-card,
.bento-card,
.filter-panel,
.modal-card,
.variants-card {
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28) !important;
  transition: border-color 0.16s ease, background-color 0.16s ease !important;
}

.product-card:hover,
.bento-card:hover,
.filter-panel:hover {
  transform: none !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.32) !important;
}

.product-card:hover .product-image,
.product-card:hover .product-icon,
.skin-container:hover .skin-render-img,
.wallet-card:hover .wallet-balance-amount {
  transform: none !important;
}

.reveal,
.reveal.revealed,
.hero-copy > * {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  animation: none !important;
  transition: none !important;
}

.section,
.perks,
.faq,
.footer,
#dashboard-page,
.product-card,
.bento-card {
  content-visibility: auto;
  contain-intrinsic-size: 1px 520px;
}

.product-image,
.skin-render-img {
  will-change: auto !important;
}
