html:not(.dn-store-ready) {
  color-scheme: dark;
  background: #04090b;
}

html:not(.dn-store-ready) body {
  opacity: 1 !important;
  pointer-events: auto !important;
}

@media (min-width: 1180px) {
  [class*="store-products-module"][class*="__grid"],
  .dn-store-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    grid-auto-rows: auto !important;
    gap: 12px !important;
  }

  article[class*="store-products-module"][class*="__card"]
    [class*="store-products-module"][class*="__media"],
  .dn-store-card .dn-store-media {
    aspect-ratio: 1 / .58 !important;
  }

  article[class*="store-products-module"][class*="__card"]
    > button[class*="store-products-module"][class*="__cardMain"]
    > span[class*="store-products-module"][class*="__body"],
  .dn-store-card .dn-store-card-main > span:last-child {
    min-height: 84px !important;
    padding: 9px 11px 8px !important;
  }

}

.dn-header-ticket-native,
.dn-mobile-topup {
  box-sizing: border-box;
  color: #f4bd46;
  text-decoration: none;
  background:
    radial-gradient(circle at 50% 0, #7b4ba027, transparent 56%),
    linear-gradient(145deg, #151024, #080d18);
  border: 1px solid #755097;
  border-radius: 9px;
  box-shadow: inset 0 1px #ffffff0d, 0 8px 22px #0005;
  place-items: center;
}

.dn-header-ticket-native {
  width: 48px;
  min-width: 48px;
  height: 52px;
  display: grid;
  flex: 0 0 48px;
}

.dn-header-ticket-native:hover,
.dn-header-ticket-native:focus-visible,
.dn-mobile-topup:hover {
  color: #ffcc5a;
  border-color: #a578c5;
  background: linear-gradient(145deg, #251638, #0d1220);
}

html body .dn-header-topup {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: 20px minmax(0, 1fr) 16px !important;
  align-items: center !important;
  column-gap: 10px !important;
  width: 164px !important;
  min-width: 164px !important;
  height: 52px !important;
  min-height: 52px !important;
  max-height: 52px !important;
  padding-inline: 12px !important;
  flex: 0 0 164px !important;
  max-width: 164px !important;
  margin: 0 !important;
  color: #f7c24e !important;
  background:
    radial-gradient(circle at 12% 0, #ffc94a26, transparent 42%),
    linear-gradient(120deg, #21152c, #151124 58%, #0b101b) !important;
  border-color: #7f56a3 !important;
  box-shadow: inset 0 1px #ffffff18, 0 9px 24px #4d2a6a3d !important;
  transition: filter .16s ease, transform .16s ease,
    box-shadow .16s ease !important;
}

html body .dn-header-topup:hover {
  filter: brightness(1.12) saturate(1.05);
  transform: translateY(-1px);
  border-color: #b284d1 !important;
  box-shadow: inset 0 1px #ffffff22, 0 12px 28px #5e337655 !important;
}

html body .dn-header-topup > span {
  display: grid;
  gap: 2px;
  min-width: 0;
  text-align: left;
}

html body .dn-header-topup > span strong,
html body .dn-header-topup > span small {
  display: block;
  white-space: nowrap;
}

html body .dn-header-topup > span strong {
  font-size: 11px;
  line-height: 1;
  letter-spacing: .045em;
  text-transform: uppercase;
}

html body .dn-header-topup > span small {
  color: #d8c6e5;
  font-size: 9px;
  line-height: 1;
  letter-spacing: .025em;
}

html body .dn-header-topup > b {
  color: #f7c24e;
  font: 900 20px/1 sans-serif;
  opacity: .88;
}

.dn-mobile-topup { display: none; }

html body .dn-fortune-launcher[hidden] {
  display: none !important;
}

html body main[class*="error-module"][class*="__page"] {
  min-height: 100svh !important;
  padding: clamp(16px, 4vw, 36px) !important;
  background:
    radial-gradient(circle at 78% 18%, #54226738, transparent 38%),
    radial-gradient(circle at 18% 78%, #e95a2d18, transparent 32%),
    linear-gradient(145deg, #030711, #080a18 55%, #0d0920) !important;
}

html body main[class*="error-module"][class*="__page"]
  > section[class*="error-module"][class*="__panel"] {
  box-sizing: border-box !important;
  width: min(100%, 660px) !important;
  padding: clamp(24px, 5vw, 48px) !important;
  color: #f4f1f7 !important;
  background:
    linear-gradient(145deg, #151022f2, #070c16f5) !important;
  border: 1px solid #684687 !important;
  border-left: 3px solid #ef633d !important;
  box-shadow: inset 0 1px #ffffff0b, 0 28px 70px #0009 !important;
}

@media (min-width: 761px) {
  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced) {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
  }

  html body .dn-header-actions-enhanced {
    display: flex !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: 100% !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    justify-content: flex-end !important;
    justify-self: end !important;
    gap: 4px !important;
    padding: 4px !important;
    overflow: visible !important;
    background: #080b16ed !important;
    border: 1px solid #654585 !important;
    border-radius: 12px !important;
    box-shadow: inset 0 1px #ffffff0b, 0 10px 28px #0006 !important;
  }

  html body .dn-header-actions-enhanced [class*="__storeProfile"] {
    box-sizing: border-box !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: min(240px, 27vw) !important;
    height: 48px !important;
    min-height: 48px !important;
    flex: 0 0 auto !important;
  }

  html body .dn-header-actions-enhanced .dn-header-topup,
  html body .dn-header-actions-enhanced .dn-header-ticket-native {
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
  }

  html body .dn-header-actions-enhanced [class*="__storeProfile"] > span:nth-child(2) {
    width: max-content !important;
    min-width: 0 !important;
    flex: 0 1 auto !important;
  }
}

@media (min-width: 1181px) and (max-width: 1359.98px) {
  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced) {
    grid-template-columns: 150px minmax(300px, 1fr) 270px 270px !important;
    column-gap: 8px !important;
  }

  html body header[class*="__storeTopbar"] [class*="__storeNavigation"] {
    min-width: 0 !important;
  }

  html body header[class*="__storeTopbar"] [class*="__storeHeaderBalances"] {
    box-sizing: border-box !important;
    width: 270px !important;
    min-width: 270px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body header[class*="__storeTopbar"] [class$="__storeHeaderBalance"] {
    box-sizing: border-box !important;
    min-width: 0 !important;
  }

  html body .dn-header-topup {
    display: grid !important;
    grid-template-columns: 1fr !important;
    place-items: center !important;
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    padding: 0 !important;
    flex: 0 0 48px !important;
  }

  html body .dn-header-topup > span,
  html body .dn-header-topup > b {
    display: none !important;
  }

  html body .dn-header-topup > svg {
    width: 20px;
    height: 20px;
  }
}

@media (min-width: 1360px) {
  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced) {
    grid-template-columns: 220px minmax(370px, 1fr) 270px 426px !important;
    column-gap: 8px !important;
  }
}

@media (min-width: 761px) and (max-width: 1180px) {
  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced) {
    grid-template-columns: 270px auto !important;
    justify-content: space-between !important;
    column-gap: 12px !important;
    min-height: 80px !important;
    padding-inline: clamp(7px, 1.4vw, 16px) !important;
  }

  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced)
    [class*="__storeBrand"],
  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced)
    [class*="__storeNavigation"] {
    display: none !important;
  }

  html body .dn-header-actions-enhanced {
    gap: 4px !important;
    padding: 6px !important;
    border-radius: 15px !important;
  }

  html body .dn-header-actions-enhanced .dn-header-topup,
  html body .dn-header-actions-enhanced .dn-header-ticket-native {
    color: #f5bf49 !important;
    background:
      radial-gradient(circle at 50% 0, #7d4aa02b, transparent 58%),
      linear-gradient(145deg, #161025, #080d18) !important;
    border: 1px solid #77529a !important;
    box-shadow: inset 0 1px #ffffff0d, 0 6px 16px #0004 !important;
  }

  html body .dn-header-actions-enhanced .dn-header-topup {
    display: grid !important;
    grid-template-columns: 20px minmax(0, 1fr) 16px !important;
    place-items: initial !important;
    align-items: center !important;
    column-gap: 10px !important;
    width: clamp(168px, 22vw, 205px) !important;
    min-width: clamp(168px, 22vw, 205px) !important;
    max-width: clamp(168px, 22vw, 205px) !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    padding-inline: 12px !important;
    flex: 0 0 clamp(168px, 22vw, 205px) !important;
  }

  html body .dn-header-actions-enhanced .dn-header-topup > span {
    display: grid !important;
  }

  html body .dn-header-actions-enhanced .dn-header-topup > b {
    display: block !important;
  }

  html body .dn-header-actions-enhanced .dn-header-ticket-native {
    width: 52px !important;
    min-width: 52px !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    flex-basis: 52px !important;
  }

  html body .dn-header-actions-enhanced [class*="__storeProfile"] {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    place-items: initial !important;
    align-items: center !important;
    gap: 9px !important;
    width: max-content !important;
    min-width: 138px !important;
    max-width: min(185px, 21vw) !important;
    height: 56px !important;
    min-height: 56px !important;
    padding: 0 10px 0 5px !important;
    flex: 0 1 auto !important;
    color: #f3f3f6 !important;
    background: linear-gradient(145deg, #0d101a, #050912) !important;
    border: 1px solid #d4d7e0 !important;
    border-radius: 10px !important;
    box-shadow: inset 0 1px #ffffff10, 0 6px 16px #0005 !important;
  }

  html body .dn-header-actions-enhanced [class*="__storeProfile"] > * {
    min-width: 0 !important;
  }

  html body .dn-header-actions-enhanced [class*="__storeProfile"]
    > span:first-child {
    display: grid !important;
    place-items: center !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    border-radius: 8px !important;
    overflow: hidden !important;
  }

  html body .dn-header-actions-enhanced [class*="__storeProfile"]
    > span:first-child img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: inherit !important;
  }

  html body [class*="__storeHeaderBalances"] {
    display: grid !important;
    align-self: center !important;
    justify-self: start !important;
    width: 270px !important;
    min-width: 270px !important;
    max-width: 270px !important;
    height: 60px !important;
    min-height: 60px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0 !important;
    overflow: hidden !important;
    background: linear-gradient(145deg, #101022, #070d19) !important;
    border: 1px solid #4f376d !important;
    border-radius: 12px !important;
    box-shadow: inset 0 1px #ffffff0b, 0 9px 24px #0005 !important;
  }

  html body [class$="__storeHeaderBalance"] {
    box-sizing: border-box !important;
    height: 58px !important;
    min-height: 58px !important;
    padding: 7px 12px !important;
    grid-template-rows: 10px 22px !important;
    align-content: center !important;
    align-items: center !important;
    row-gap: 4px !important;
    overflow: hidden !important;
    color: #f7f4fb !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  html body [class$="__storeHeaderBalance"]:first-child {
    background: linear-gradient(110deg, #552d7618, transparent 72%) !important;
    border-right: 1px solid #29334d !important;
  }

  html body [class$="__storeHeaderBalance"] > span {
    min-width: 0 !important;
    overflow: hidden !important;
    font-size: clamp(7px, 1vw, 9px) !important;
    line-height: 10px !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    color: #cdb7df !important;
  }

  html body [class$="__storeHeaderBalance"] > strong {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 22px !important;
    overflow: hidden !important;
    font-size: clamp(16px, 2.1vw, 20px) !important;
    line-height: 22px !important;
    letter-spacing: -.02em !important;
    white-space: nowrap !important;
    font-variant-numeric: tabular-nums;
  }

  html body [class$="__storeHeaderBalance"] > strong svg {
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
  }

  html body [class$="__storeHeaderBalance"]:last-child > strong svg {
    color: #f4bd46 !important;
  }
}

@media (max-width: 760.98px) {
  html body header[class*="__storeTopbar"]:has(.dn-mobile-header-actions) {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    grid-template-columns: clamp(82px, 24vw, 94px) minmax(0, 270px) auto !important;
    justify-content: space-between !important;
    column-gap: clamp(4px, 1.6vw, 7px) !important;
  }

  .dn-header-ticket-native,
  html body .dn-header-topup { display: none !important; }

  .dn-mobile-topup {
    width: 44px;
    min-width: 44px;
    height: 44px;
    display: grid;
    margin: 0;
  }

  html body .dn-mobile-balances-enhanced {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: 270px !important;
    min-width: 0 !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    height: 44px !important;
    min-height: 44px !important;
    gap: 4px !important;
    overflow: visible !important;
  }

  html body .dn-mobile-balances-enhanced > * {
    box-sizing: border-box !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 3px 2px !important;
    grid-template-rows: 8px 14px !important;
    align-content: center !important;
    align-items: center !important;
    row-gap: 2px !important;
    overflow: hidden !important;
    color: #f7f4fb !important;
    background:
      radial-gradient(circle at 10% 0, #75489926, transparent 52%),
      linear-gradient(145deg, #111020, #080e19) !important;
    border: 1px solid #714c91 !important;
    border-radius: 8px !important;
    box-shadow: inset 0 1px #ffffff0b, 0 6px 16px #0004 !important;
  }

  html body .dn-mobile-balances-enhanced > * > span {
    min-width: 0 !important;
    overflow: hidden !important;
    font-size: 5px !important;
    line-height: 8px !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    color: #cbb4dc !important;
  }

  html body .dn-mobile-balances-enhanced > * > strong {
    display: flex !important;
    align-items: center !important;
    gap: 3px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 14px !important;
    overflow: hidden !important;
    font-size: clamp(8px, 2.4vw, 10px) !important;
    line-height: 14px !important;
    letter-spacing: -.035em !important;
    white-space: nowrap !important;
    font-variant-numeric: tabular-nums;
  }

  html body .dn-mobile-balances-enhanced > * > strong svg {
    width: 10px !important;
    min-width: 10px !important;
    height: 10px !important;
  }

  html body .dn-mobile-balances-enhanced > *:last-child > strong svg {
    color: #f4bd46 !important;
  }

  html body .dn-mobile-header-actions {
    display: flex;
    align-items: center;
    align-self: center;
    justify-self: end;
    grid-column: 3;
    grid-row: 1;
    gap: 3px;
    padding: 3px;
    background: #080b16ed;
    border: 1px solid #654585;
    border-radius: 11px;
    box-shadow: inset 0 1px #ffffff0b, 0 8px 22px #0006;
  }

  html body .dn-mobile-header-actions .dn-mobile-topup,
  html body .dn-mobile-header-actions [class*="__storeMobileTicket"] {
    position: relative;
    box-sizing: border-box !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    transform: none !important;
    color: #f5bf49 !important;
    background:
      radial-gradient(circle at 50% 0, #7748972b, transparent 58%),
      linear-gradient(145deg, #161025, #080d18) !important;
    border: 1px solid #77529a !important;
    border-radius: 8px !important;
    box-shadow: inset 0 1px #ffffff0d !important;
  }

  html body .dn-mobile-header-actions [class*="__storeMobileSteam"] {
    position: relative;
    box-sizing: border-box !important;
    display: grid !important;
    place-items: center !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    transform: none !important;
    color: #f3f3f6 !important;
    background: linear-gradient(145deg, #0d101a, #050912) !important;
    border: 1px solid #d4d7e0 !important;
    border-radius: 8px !important;
    box-shadow: inset 0 1px #ffffff10 !important;
  }

  html body .dn-mobile-header-actions [class*="__storeMobileSteam"] > * {
    display: none !important;
  }

  html body .dn-mobile-header-actions [class*="__storeMobileSteam"]::before {
    content: "";
    display: block;
    width: 22px;
    height: 22px;
    background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10' fill='%23f3f3f6'/%3E%3Ccircle cx='16.2' cy='7.8' r='4.2' fill='%23050912'/%3E%3Ccircle cx='16.2' cy='7.8' r='2.65' fill='none' stroke='%23f3f3f6' stroke-width='1.45'/%3E%3Cpath d='M13.55 10.9 9.7 16.15' stroke='%23050912' stroke-width='2.7' stroke-linecap='round'/%3E%3Cpath d='m3.35 14.1 4.05 1.7a3.25 3.25 0 1 1-1.35 2.15l-3.7-1.55' fill='%23050912'/%3E%3Ccircle cx='7.8' cy='18' r='2.05' fill='none' stroke='%23f3f3f6' stroke-width='1.4'/%3E%3C/svg%3E");
  }

  html body .dn-mobile-header-actions
    [class*="__storeMobileSteam"]:has(> img)::before {
    display: none;
  }

  html body .dn-mobile-header-actions
    [class*="__storeMobileSteam"] > img {
    display: block !important;
    width: 38px !important;
    height: 38px !important;
    object-fit: cover !important;
    border-radius: 6px !important;
  }

  html body .dn-mobile-header-actions .dn-mobile-topup {
    color: #ffca50 !important;
    background:
      radial-gradient(circle at 50% 0, #ffc84b20, transparent 58%),
      linear-gradient(145deg, #1b1424, #090e19) !important;
  }

  html body .dn-mobile-header-actions .dn-mobile-topup:hover,
  html body .dn-mobile-header-actions .dn-mobile-topup:focus-visible,
  html body .dn-mobile-header-actions [class*="__storeMobileSteam"]:hover,
  html body .dn-mobile-header-actions [class*="__storeMobileSteam"]:focus-visible,
  html body .dn-mobile-header-actions [class*="__storeMobileTicket"]:hover,
  html body .dn-mobile-header-actions [class*="__storeMobileTicket"]:focus-visible {
    z-index: 2;
    color: #ffcf62 !important;
    border-color: #b487d2 !important;
    background: linear-gradient(145deg, #26173a, #0d1220) !important;
  }
}

/* Individual controls do not need an additional enclosing frame. */
html body .dn-header-actions-enhanced,
html body .dn-mobile-header-actions {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Keep only the app's primary route loader; this injected copy is redundant. */
.dn-native-store-loader {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  display: none !important;
  place-items: center;
  overflow: hidden;
  background:
    linear-gradient(rgba(4, 9, 11, .72), rgba(4, 9, 11, .86)),
    repeating-linear-gradient(0deg, transparent 0 3px, rgba(255, 255, 255, .018) 4px);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  opacity: 1;
  visibility: visible;
  transition: opacity .24s ease, visibility 0s linear;
}

.dn-store-ready .dn-native-store-loader {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .24s ease, visibility 0s linear .24s;
}

.dn-native-store-loader::before,
.dn-native-store-loader::after {
  position: absolute;
  width: min(34vw, 360px);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(239, 74, 34, .62));
  content: "";
}

.dn-native-store-loader::before {
  top: calc(50% - 58px);
  left: 0;
}

.dn-native-store-loader::after {
  right: 0;
  bottom: calc(50% - 58px);
  transform: rotate(180deg);
}

.dn-native-store-loader__content {
  display: grid;
  justify-items: center;
  gap: 18px;
}

.dn-native-store-loader__logo {
  width: 8.15ch;
  color: #f4f2f7;
  font: 900 clamp(38px, 7vw, 72px)/.9 "Roboto Condensed Local", "Arial Narrow", Impact, sans-serif;
  letter-spacing: .01em;
  white-space: nowrap;
}

.dn-native-store-loader__typed {
  display: block;
  width: 0;
  overflow: hidden;
  border-right: 2px solid #ff5a36;
  animation: dn-native-loader-type 2.5s steps(8, end) infinite, dn-native-loader-cursor .68s step-end infinite;
}

.dn-native-store-loader__typed b {
  color: #ff5a36;
  font: inherit;
}

.dn-native-store-loader p {
  margin: 0;
  color: #737d91;
  font: 800 10px/1 "Roboto Condensed Local", "Arial Narrow", Arial, sans-serif;
  letter-spacing: .22em;
  text-transform: uppercase;
}

@keyframes dn-native-loader-type {
  0%, 10% { width: 0; }
  42%, 64% { width: 100%; }
  94%, 100% { width: 0; }
}

@keyframes dn-native-loader-cursor {
  0%, 48% { border-color: #ff5a36; }
  49%, 100% { border-color: transparent; }
}

@media (max-width: 600px) {
  .dn-native-store-loader {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }

  .dn-native-store-loader::before,
  .dn-native-store-loader::after {
    width: 24vw;
  }

  .dn-native-store-loader__content {
    gap: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dn-native-store-loader__typed {
    width: 100%;
    border-right: 0;
    animation: none;
  }
}

@media (max-width: 350px) {
  html body .dn-mobile-balances-enhanced {
    gap: 2px !important;
  }

  html body .dn-mobile-balances-enhanced > * {
    padding-inline: 2px !important;
  }

  html body .dn-mobile-header-actions {
    gap: 2px;
    padding: 2px;
  }

  html body .dn-mobile-balances-enhanced > * > strong svg {
    display: none !important;
  }

  html body .dn-mobile-header-actions .dn-mobile-topup,
  html body .dn-mobile-header-actions [class*="__storeMobileSteam"],
  html body .dn-mobile-header-actions [class*="__storeMobileTicket"] {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
  }
}

@media (min-width: 1500px) {
  html body [class$="__catalogRail"] {
    grid-template-columns: minmax(0, 360px) !important;
    justify-content: center !important;
  }

  html body [class$="__catalogBalance"],
  html body [class$="__recentPurchases"] {
    box-sizing: border-box !important;
    width: 360px !important;
    min-width: 360px !important;
    max-width: 360px !important;
    justify-self: center !important;
  }

  html body [class$="__catalogBalance"] {
    min-height: 274px !important;
    gap: 16px !important;
  }

  html body [class$="__recentPurchases"] {
    min-height: 280px !important;
    padding: 24px !important;
  }
}

.dn-store-actions {
  grid-template-columns: minmax(0, 1fr) clamp(82px, 42%, 122px) !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 48px !important;
  margin-top: 8px !important;
}

.dn-store-card {
  container: dn-store-card / inline-size;
  height: auto !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}

.dn-store-card[hidden] { display: none !important; }

.dn-store-card-main {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
}

.dn-store-card-main > span:last-child {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
}

.dn-store-card-main > span:last-child > span:last-child {
  margin-top: 12px !important;
}

.dn-store-actions > span {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
}

.dn-store-actions > button {
  width: 100%;
  min-width: 0 !important;
  padding-inline: 7px !important;
}

.dn-store-actions > .dn-add-cart {
  grid-column: 2;
  grid-row: 1;
  justify-self: end;
  width: 100% !important;
  max-width: 122px !important;
  min-height: 37px !important;
  padding: 0 9px !important;
  border-radius: 6px !important;
  font: 900 10.25px/1 "Roboto Condensed Local", "Arial Narrow", "Roboto Condensed", Impact, sans-serif !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  color: #fff3ec !important;
  cursor: pointer !important;
  isolation: isolate;
  overflow: hidden;
  position: relative;
  background:
    radial-gradient(circle at 15% 0, #ffb16e30, transparent 42%),
    linear-gradient(112deg, #8d2d20 0%, #c7482a 55%, #e35e34 100%) !important;
  border: 1px solid #ee7651 !important;
  box-shadow:
    0 5px 14px #56170f4a,
    inset 0 1px 0 #fff0e436 !important;
  transition:
    transform .18s ease,
    filter .18s ease,
    border-color .18s ease,
    box-shadow .18s ease !important;
}

.dn-store-actions > .dn-add-cart::before {
  content: '';
  width: 34%;
  height: 220%;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(90deg, transparent, #ffffff2e, transparent);
  position: absolute;
  top: -60%;
  left: -44%;
  transform: rotate(14deg);
  transition: left .42s ease, opacity .18s ease;
}

.dn-store-actions > .dn-add-cart::after {
  content: '\2192';
  margin-left: 4px;
  font-size: 9px;
  opacity: .7;
  display: inline-block;
  transform: translateX(0);
  transition: transform .18s ease, opacity .18s ease;
}

.dn-store-actions > .dn-add-cart:hover:not(:disabled) {
  filter: brightness(1.13) saturate(1.08);
  border-color: #ff9a70 !important;
  box-shadow:
    0 8px 19px #641b1266,
    0 0 0 1px #ff9b6e24,
    inset 0 1px 0 #fff4ea46 !important;
  transform: translateY(-1px);
}

.dn-store-actions > .dn-add-cart:disabled {
  cursor: not-allowed !important;
  filter: grayscale(.35);
  opacity: .58;
}

.dn-card-lock,
.dn-product-lock {
  color: #f0b35d;
  font: 700 11px/1.35 "Roboto Condensed Local", sans-serif;
}

.dn-card-lock {
  grid-column: 1 / -1;
  text-align: center;
}

.dn-store-actions > .dn-add-cart:hover::before {
  left: 112%;
  opacity: 1;
}

.dn-store-actions > .dn-add-cart:hover::after {
  opacity: 1;
  transform: translateX(3px);
}

.dn-store-actions > .dn-add-cart:active {
  filter: brightness(.96);
  transform: translateY(1px) scale(.995);
}

.dn-store-actions > .dn-add-cart:focus-visible {
  outline: 2px solid #8ed3ff;
  outline-offset: 2px;
}

.dn-store-actions > .dn-add-cart[data-added] {
  color: #effff5 !important;
  background: linear-gradient(110deg, #155d3d, #238b59) !important;
  border-color: #66d694 !important;
  box-shadow:
    0 8px 22px #04130b80,
    0 0 0 1px #74e6a52b,
    inset 0 1px 0 #e1ffea2b !important;
  animation: dn-cart-confirm .32s ease both;
}

.dn-store-actions > .dn-add-cart[data-added]::after {
  content: '\2713';
  opacity: 1;
  transform: none;
}

@keyframes dn-cart-confirm {
  0% { transform: scale(.975); }
  65% { transform: scale(1.012); }
  100% { transform: scale(1); }
}

@container dn-store-card (max-width: 185px) {
  .dn-store-actions {
    grid-template-columns: minmax(0, 1fr) 80px !important;
    gap: 4px !important;
  }

  .dn-store-actions > .dn-add-cart {
    max-width: 80px !important;
    min-height: 34px !important;
    padding-inline: 5px !important;
    font-size: 8.75px !important;
    letter-spacing: .025em !important;
  }

  .dn-store-actions > .dn-add-cart::after { display: none; }
}

.dn-category-icon {
  display: grid !important;
  place-items: center !important;
}

.dn-category-icon svg {
  width: 42px;
  height: 42px;
  display: block;
  filter: drop-shadow(0 4px 7px #0008);
}

.dn-category-icon img {
  display: block;
  width: 42px;
  height: 42px;
  object-fit: contain;
  border-radius: 5px;
  filter: none;
  transform: none;
  mix-blend-mode: normal;
}

.dn-privilege-card .dn-store-media,
.dn-vip-card .dn-store-media,
.dn-battlepass-card .dn-store-media {
  position: relative !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.dn-privilege-card .dn-store-media > :first-child,
.dn-vip-card .dn-store-media > :first-child,
.dn-battlepass-card .dn-store-media > :first-child {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
}

.dn-privilege-card .dn-store-media > :first-child img,
.dn-vip-card .dn-store-media > :first-child img,
.dn-battlepass-card .dn-store-media > :first-child img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
}

.dn-battlepass-card .dn-store-media > :first-child img {
  transform: scaleX(1.28) !important;
  transform-origin: 50% 50% !important;
}

[data-dn-vip-modal] .dn-vip-term-control button,
.dn-vip-term-control button {
  pointer-events: none !important;
  opacity: .32 !important;
}

[data-dn-vip-modal] .dn-vip-term-control {
  cursor: default !important;
}

#dn-cart-toggle {
  z-index: 2200;
  color: #fff;
  cursor: pointer;
  letter-spacing: .06em;
  text-transform: uppercase;
  background: #c84525;
  border: 1px solid #e05a36;
  border-radius: 8px;
  padding: 12px 16px;
  font: 900 12px/1 sans-serif;
  position: fixed;
  right: 22px;
  bottom: 22px;
  box-shadow: 0 14px 34px #0009;
}

#dn-cart-toggle[hidden] { display: none !important; }

/* Native payment screens mount/unmount their roots. Suppress cart UI even when
   an older controller clears hidden or has not processed a DOM update yet. */
html body:has(
  [class*="__topupModalBackdrop"]:not([hidden]):not([aria-hidden="true"]),
  [class*="payment-checkout-module__"][class*="__viewport"]:not([hidden]):not([aria-hidden="true"])
) #dn-cart-toggle,
html body:has(
  [class*="__topupModalBackdrop"]:not([hidden]):not([aria-hidden="true"]),
  [class*="payment-checkout-module__"][class*="__viewport"]:not([hidden]):not([aria-hidden="true"])
) #dn-cart-backdrop {
  display: none !important;
}

/* Keep the provider's cross-origin form interactive beneath the atmosphere. */
[class*="payment-checkout-module__"][class$="__widget"]:has(iframe) {
  isolation: isolate;
}

[class*="payment-checkout-module__"][class$="__widget"]:has(iframe)::before,
[class*="payment-checkout-module__"][class$="__widget"]:has(iframe)::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

[class*="payment-checkout-module__"][class$="__widget"]:has(iframe)::before {
  z-index: 1;
  background: rgba(17, 18, 20, .22);
}

[class*="payment-checkout-module__"][class$="__widget"]:has(iframe)::after {
  z-index: 2;
  background:
    radial-gradient(ellipse at 9% 24%, rgba(102, 105, 113, .16), transparent 48%),
    radial-gradient(ellipse at 88% 78%, rgba(102, 105, 113, .12), transparent 46%),
    linear-gradient(105deg, rgba(17, 18, 20, .34), transparent 28% 72%, rgba(17, 18, 20, .34));
}

@media (forced-colors: active) {
  [class*="payment-checkout-module__"][class$="__widget"]:has(iframe)::before,
  [class*="payment-checkout-module__"][class$="__widget"]:has(iframe)::after {
    display: none;
  }
}

#dn-cart-toggle[data-added] {
  background: #23804c;
  border-color: #52b979;
  transform: translateY(-3px);
}

#dn-cart-backdrop {
  z-index: 2300;
  pointer-events: none;
  opacity: 0;
  background: #020711b8;
  transition: opacity .18s;
  position: fixed;
  inset: 0;
}

#dn-cart-backdrop[hidden] { display: none !important; }

#dn-cart-backdrop[data-open] {
  pointer-events: auto;
  opacity: 1;
}

#dn-cart-panel {
  width: min(460px, 94vw);
  height: 100%;
  color: #edf3ff;
  background: #07101e;
  border-left: 1px solid #7182a852;
  flex-direction: column;
  display: flex;
  position: absolute;
  top: 0;
  right: 0;
  transform: translateX(102%);
  transition: transform .2s ease-out;
  box-shadow: -22px 0 60px #0009;
}

#dn-cart-backdrop[data-open] #dn-cart-panel { transform: translateX(0); }

.dn-cart-header {
  border-bottom: 1px solid #7182a83b;
  justify-content: space-between;
  align-items: center;
  padding: 22px;
  display: flex;
  font-weight: 900;
}

.dn-cart-heading { gap: 5px; display: grid; }
.dn-cart-heading strong { font-size: 14px; letter-spacing: .06em; }
.dn-cart-heading small { color: #8d9ab5; font-size: 11px; font-weight: 700; }
.dn-cart-header-actions { align-items: center; gap: 8px; display: flex; }
.dn-cart-clear {
  color: #aeb9cc;
  cursor: pointer;
  background: transparent;
  border: 0;
  padding: 7px;
  font-size: 11px;
  font-weight: 800;
}
.dn-cart-clear:hover { color: #fff; }

.dn-cart-close,
.dn-cart-controls button {
  color: #fff;
  cursor: pointer;
  background: #151f30;
  border: 1px solid #43506a;
  border-radius: 6px;
}

.dn-cart-close { width: 36px; height: 36px; font-size: 22px; }
.dn-cart-list { padding: 10px 18px; overflow: auto; }
.dn-cart-row {
  background: #101a2a;
  border: 1px solid #ffffff0d;
  border-radius: 8px;
  gap: 10px;
  margin-bottom: 8px;
  padding: 12px;
  display: grid;
}
.dn-cart-copy { gap: 4px; display: grid; }
.dn-cart-copy strong { font-size: 14px; }
.dn-cart-copy small { color: #8d9ab5; font-size: 11px; }
.dn-cart-unit-price { align-items: center; gap: 7px; display: flex; flex-wrap: wrap; }
.dn-cart-sale-old { color: #65738a; }
.dn-cart-sale-badge {
  color: #ffd6c6;
  background: #b94328;
  border-radius: 999px;
  padding: 3px 5px;
  font-size: 9px;
}
.dn-cart-controls { align-items: center; gap: 8px; display: flex; }
.dn-cart-controls button { min-width: 32px; min-height: 30px; }
.dn-cart-controls .dn-cart-remove { color: #ef9179; border: 0; margin-left: auto; background: transparent; }
.dn-cart-footer { border-top: 1px solid #7182a83b; gap: 12px; margin-top: auto; padding: 20px; display: grid; }
.dn-cart-summary { align-items: start; gap: 8px 14px; display: grid; grid-template-columns: minmax(120px, auto) minmax(220px, 1fr); }
.dn-cart-summary > strong { align-items: baseline; gap: 8px; display: flex; white-space: nowrap; }
.dn-cart-summary del { color: #77839a; font-size: 11px; font-weight: 700; }
.dn-cart-promo { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; }
.dn-cart-promo-input { min-width: 0; height: 40px; color: #fff; text-transform: uppercase; background: #0b1422; border: 1px solid #41506b; border-radius: 6px 0 0 6px; padding: 0 12px; outline: 0; }
.dn-cart-promo-input:focus { border-color: #1bbce0; box-shadow: 0 0 0 2px #1bbce025; }
.dn-cart-promo-button { height: 40px; color: #fff; cursor: pointer; background: #17253a; border: 1px solid #51617e; border-left: 0; border-radius: 0 6px 6px 0; padding: 0 13px; font-size: 11px; font-weight: 900; text-transform: uppercase; }
.dn-cart-promo-button:disabled { cursor: wait; opacity: .65; }
.dn-cart-promo-status { color: #ef9179; grid-column: 2; font-size: 11px; }
.dn-cart-promo-status[data-tone="success"] { color: #8fd7a0; }
.dn-cart-promo-status[data-tone="pending"] { color: #80d8ed; }
.dn-cart-checkout { color: #fff; cursor: pointer; min-height: 46px; text-transform: uppercase; background: #c84525; border: 1px solid #e05a36; border-radius: 7px; font-weight: 900; }
.dn-cart-checkout:disabled { cursor: wait; opacity: .65; }
.dn-cart-empty { color: #9ba6ba; padding: 28px 22px; }
.dn-cart-status { color: #ef9179; font-size: 12px; line-height: 1.5; }
.dn-cart-status[data-tone="success"] { color: #8fd7a0; }

#dn-vip-limit-backdrop {
  z-index: 2600;
  pointer-events: none;
  opacity: 0;
  background: #02050bd9;
  backdrop-filter: blur(9px);
  display: grid;
  place-items: center;
  padding: 20px;
  transition: opacity .18s ease;
  position: fixed;
  inset: 0;
}

#dn-vip-limit-backdrop[data-open] {
  pointer-events: auto;
  opacity: 1;
}

#dn-vip-limit-modal {
  width: min(480px, 94vw);
  color: #f4f5f8;
  text-align: center;
  background:
    radial-gradient(circle at 50% 0, #a14e252e, transparent 48%),
    linear-gradient(145deg, #12131d, #090d17);
  border: 1px solid #dc633d;
  border-radius: 12px;
  padding: 30px 30px 26px;
  box-shadow: 0 30px 90px #000c, 0 0 38px #b83f2226;
}

.dn-vip-limit-mark {
  width: 58px;
  height: 58px;
  color: #ffb36d;
  background: #c8452529;
  border: 1px solid #e66a3f;
  border-radius: 50%;
  place-items: center;
  margin: 0 auto 17px;
  font: 900 14px/1 sans-serif;
  letter-spacing: .08em;
  display: grid;
}

#dn-vip-limit-title {
  text-transform: uppercase;
  margin: 0 0 12px;
  font: 900 25px/1.08 sans-serif;
}

#dn-vip-limit-modal p {
  color: #b7becc;
  margin: 0 auto;
  font: 500 14px/1.55 sans-serif;
}

#dn-vip-limit-modal p strong { color: #fff; }

.dn-vip-limit-plans {
  gap: 9px;
  margin: 20px 0 14px;
  display: grid;
  grid-template-columns: 1fr;
}

.dn-vip-limit-plans span {
  color: #e8ecf5;
  background: #101929;
  border: 1px solid #39465d;
  border-radius: 7px;
  justify-content: space-between;
  align-items: center;
  padding: 12px 13px;
  font: 800 12px/1 sans-serif;
  display: flex;
}

.dn-vip-limit-plans b { color: #ff8a55; }

.dn-vip-limit-note {
  color: #e99472 !important;
  min-height: 22px;
}

.dn-vip-limit-close {
  width: 100%;
  min-height: 44px;
  color: #fff;
  cursor: pointer;
  text-transform: uppercase;
  background: linear-gradient(90deg, #c84525, #e15a33);
  border: 1px solid #ef724d;
  border-radius: 7px;
  margin-top: 20px;
  font: 900 12px/1 sans-serif;
  letter-spacing: .05em;
}

.dn-vip-limit-close:hover { filter: brightness(1.08); }

#dn-product-backdrop {
  z-index: 2500;
  pointer-events: none;
  opacity: 0;
  background: #02050bdb;
  backdrop-filter: blur(9px);
  place-items: center;
  padding: 20px;
  transition: opacity .18s ease;
  display: grid;
  position: fixed;
  inset: 0;
}

#dn-product-backdrop[data-open] {
  pointer-events: auto;
  opacity: 1;
}

#dn-product-modal {
  width: min(760px, 96vw);
  max-height: min(880px, 92vh);
  color: #f4f6fb;
  background:
    radial-gradient(circle at 82% 0, #7634d322, transparent 34%),
    radial-gradient(circle at 10% 0, #d15b2b20, transparent 36%),
    linear-gradient(150deg, #111825, #080d16 68%);
  border: 1px solid #66789b73;
  border-radius: 14px;
  padding: 28px;
  overflow: auto;
  position: relative;
  box-shadow: 0 34px 100px #000d, 0 0 48px #7236c41f;
}

.dn-product-close {
  width: 38px;
  height: 38px;
  color: #dfe6f4;
  cursor: pointer;
  background: #172132;
  border: 1px solid #44516a;
  border-radius: 8px;
  font-size: 24px;
  line-height: 1;
  position: absolute;
  top: 18px;
  right: 18px;
}

.dn-product-eyebrow {
  color: #ef8959;
  letter-spacing: .11em;
  text-transform: uppercase;
  font: 900 11px/1 sans-serif;
}

#dn-product-title {
  max-width: calc(100% - 54px);
  text-transform: uppercase;
  margin: 9px 0 8px;
  font: 900 clamp(25px, 5vw, 38px)/1 sans-serif;
}

.dn-product-description {
  max-width: 650px;
  color: #aeb8ca;
  margin: 0;
  font: 500 14px/1.55 sans-serif;
}

.dn-product-section-title {
  color: #dfe7f5;
  letter-spacing: .07em;
  text-transform: uppercase;
  border-top: 1px solid #ffffff14;
  margin: 22px 0 11px;
  padding-top: 18px;
  font: 900 12px/1 sans-serif;
}

.dn-product-terms {
  gap: 9px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dn-product-terms button {
  min-height: 48px;
  color: #dce5f4;
  cursor: pointer;
  background: #111d2c;
  border: 1px solid #3b4b66;
  border-radius: 8px;
  font-weight: 900;
}

.dn-product-terms button[data-selected] {
  color: #fff;
  background: linear-gradient(105deg, #c84525, #7d3ac4);
  border-color: #f17855;
  box-shadow: 0 0 24px #c848383d;
}

.dn-product-benefits {
  gap: 8px 18px;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  list-style: none;
}

.dn-product-benefits li {
  color: #c9d2e1;
  background: #0d1724;
  border: 1px solid #ffffff10;
  border-radius: 7px;
  padding: 10px 12px 10px 32px;
  font: 700 12px/1.35 sans-serif;
  position: relative;
}

.dn-product-benefits li::before {
  content: '✓';
  color: #76d899;
  position: absolute;
  left: 12px;
}

.dn-product-items {
  gap: 7px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dn-product-item {
  min-width: 0;
  color: #c2ccdc;
  background: #0a131f;
  border: 1px solid #ffffff0f;
  border-radius: 7px;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  font: 650 12px/1.3 sans-serif;
  display: flex;
}

.dn-product-item b {
  color: #ef9a63;
  white-space: nowrap;
}

.dn-bundle-card .dn-store-media {
  position: relative !important;
  overflow: hidden !important;
  background: #0a111b !important;
}

.dn-bundle-card .dn-store-media > :not(.dn-bundle-collage) {
  opacity: 0 !important;
}

.dn-bundle-collage {
  position: relative;
  display: block;
  min-width: 0;
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(ellipse at 50% 42%, rgba(238, 107, 58, .18), transparent 47%),
    radial-gradient(ellipse at 50% 100%, rgba(40, 184, 220, .09), transparent 52%),
    linear-gradient(145deg, #101a29 0%, #0a111b 57%, #0d1623 100%);
}

.dn-bundle-collage::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  background:
    linear-gradient(115deg, transparent 0 34%, rgba(255, 255, 255, .025) 34% 35%, transparent 35% 100%),
    linear-gradient(180deg, transparent 0 78%, rgba(5, 11, 18, .62) 100%);
  pointer-events: none;
}

.dn-bundle-collage::after {
  content: "";
  position: absolute;
  z-index: 1;
  right: 8%;
  bottom: 13%;
  left: 8%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(238, 107, 58, .32), transparent);
  pointer-events: none;
}

.dn-bundle-collage--card {
  position: absolute;
  z-index: 2;
  inset: 0;
}

.dn-bundle-collage--modal {
  width: 100%;
  height: 100%;
  min-height: 255px;
  box-sizing: border-box;
}

.dn-bundle-collage__tile {
  position: absolute;
  z-index: 2;
  display: block;
  width: 35%;
  height: 60%;
  pointer-events: none;
}

.dn-bundle-collage__tile[data-slot="0"] {
  z-index: 4;
  top: 8%;
  right: 25%;
  bottom: 5%;
  left: 25%;
  width: auto;
  height: auto;
}

.dn-bundle-collage__tile[data-slot="1"] {
  top: 8%;
  left: 1%;
  width: 38%;
  height: 65%;
}

.dn-bundle-collage__tile[data-slot="2"] {
  top: 7%;
  right: 1%;
  width: 39%;
  height: 64%;
}

.dn-bundle-collage__tile[data-slot="3"] {
  z-index: 5;
  bottom: 3%;
  left: 7%;
  width: 34%;
  height: 45%;
}

.dn-bundle-collage__tile[data-slot="4"] {
  z-index: 5;
  right: 7%;
  bottom: 3%;
  width: 34%;
  height: 45%;
}

/* These two armour sets use the original Rust item cut-outs. Their explicit
   profiles keep every visual on the same baseline and scale as the generated
   kit covers instead of relying on the generic five-item fan. */
.dn-bundle-collage[data-dn-bundle-key="road-sign-set"]
  .dn-bundle-collage__tile[data-slot="0"] {
  z-index: 4;
  top: 4%;
  right: auto;
  bottom: auto;
  left: 4%;
  width: 36%;
  height: 72%;
}

.dn-bundle-collage[data-dn-bundle-key="road-sign-set"]
  .dn-bundle-collage__tile[data-slot="1"] {
  z-index: 4;
  top: 4%;
  right: 4%;
  left: auto;
  width: 36%;
  height: 72%;
}

.dn-bundle-collage[data-dn-bundle-key="road-sign-set"]
  .dn-bundle-collage__tile[data-slot="2"] {
  z-index: 3;
  top: 0;
  right: 32%;
  left: 32%;
  width: auto;
  height: 68%;
}

.dn-bundle-collage[data-dn-bundle-key="road-sign-set"]
  .dn-bundle-collage__tile[data-slot="3"] {
  z-index: 5;
  right: auto;
  bottom: -1%;
  left: 29%;
  width: 24%;
  height: 50%;
}

.dn-bundle-collage[data-dn-bundle-key="road-sign-set"]
  .dn-bundle-collage__tile[data-slot="4"] {
  z-index: 6;
  right: 28%;
  bottom: 0;
  left: auto;
  width: 23%;
  height: 40%;
}

.dn-bundle-collage[data-dn-bundle-key="full-metal-set"]
  .dn-bundle-collage__tile[data-slot="0"] {
  z-index: 5;
  top: 3%;
  right: auto;
  bottom: auto;
  left: 5%;
  width: 34%;
  height: 70%;
}

.dn-bundle-collage[data-dn-bundle-key="full-metal-set"]
  .dn-bundle-collage__tile[data-slot="1"] {
  z-index: 4;
  top: 0;
  right: 32%;
  left: 32%;
  width: auto;
  height: 76%;
}

.dn-bundle-collage[data-dn-bundle-key="full-metal-set"]
  .dn-bundle-collage__tile[data-slot="2"] {
  z-index: 5;
  top: 3%;
  right: 5%;
  left: auto;
  width: 34%;
  height: 70%;
}

.dn-bundle-collage[data-dn-bundle-key="full-metal-set"]
  .dn-bundle-collage__tile[data-slot="3"] {
  z-index: 6;
  right: auto;
  bottom: -2%;
  left: 27%;
  width: 25%;
  height: 47%;
}

.dn-bundle-collage[data-dn-bundle-key="full-metal-set"]
  .dn-bundle-collage__tile[data-slot="4"] {
  z-index: 6;
  right: 27%;
  bottom: -2%;
  left: auto;
  width: 25%;
  height: 47%;
}

.dn-bundle-collage__image {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0 !important;
  object-fit: contain !important;
  filter: none !important;
  transform: none !important;
  mix-blend-mode: normal !important;
  user-select: none;
}

.dn-bundle-cover-art {
  position: absolute;
  z-index: 3;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: none;
  transform: none;
  mix-blend-mode: normal;
  user-select: none;
}

.dn-bundle-collage__meta {
  position: absolute;
  z-index: 7;
  right: 9px;
  bottom: 8px;
  padding: 4px 6px 4px 7px;
  color: #aab9c7;
  font: 800 8px/1 "Roboto Condensed", "Arial Narrow", sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
  background: rgba(6, 12, 19, .82);
  border-left: 2px solid #ee6b3a;
}

.dn-bundle-visual {
  padding: 0 !important;
}

.dn-product-item--illustrated {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  justify-content: initial;
  padding: 7px 10px;
}

.dn-product-item-icon {
  display: block;
  width: 42px;
  height: 42px;
  object-fit: contain;
  filter: none;
  transform: none;
  mix-blend-mode: normal;
}

.dn-product-item-title {
  min-width: 0;
  overflow-wrap: anywhere;
}

.dn-product-footer {
  background: #0b1421;
  border: 1px solid #ffffff12;
  border-radius: 9px;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-top: 22px;
  padding: 13px;
  display: flex;
}

.dn-product-price {
  color: #fff;
  font: 900 17px/1.2 sans-serif;
}

.dn-product-primary {
  min-height: 44px;
  color: #fff;
  cursor: pointer;
  text-transform: uppercase;
  background: linear-gradient(90deg, #c84525, #e15a33);
  border: 1px solid #ef724d;
  border-radius: 7px;
  padding: 0 19px;
  font: 900 11px/1 sans-serif;
  letter-spacing: .04em;
}

.dn-product-primary:disabled {
  cursor: not-allowed;
  opacity: .5;
}

/* Product decision surface v2. The modal is intentionally isolated from the
   native storefront layout because the host application is delivered as
   versioned Next.js chunks. */
#dn-product-modal {
  width: min(1040px, 96vw);
  max-height: min(900px, 94vh);
  padding: 0;
  overflow: hidden;
  display: grid;
  grid-template-rows: minmax(0, 1fr);
}

.dn-product-body {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-color: #53627b #0a111c;
}

.dn-product-layout {
  min-height: 100%;
  display: block;
}

.dn-product-visual {
  min-width: 0;
  align-items: stretch;
  gap: 14px;
  margin-top: 24px;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(260px, 42%) minmax(0, 1fr);
  background: transparent;
  border: 0;
}

.dn-product-visual > .dn-product-section-title {
  margin: 1px 0 10px;
  padding-top: 17px;
}

.dn-product-visual > .dn-product-terms,
.dn-product-visual > .dn-product-conditions {
  grid-template-columns: minmax(0, 1fr);
}

.dn-product-visual > .dn-product-terms button {
  min-height: 78px;
}

.dn-product-visual-media {
  min-height: 220px;
  overflow: hidden;
  display: grid;
  place-items: center;
  background: #07101bd9;
  border: 1px solid #7283a64a;
  border-radius: 12px;
  box-shadow: 0 20px 52px #01040a80, inset 0 1px #ffffff0a;
}

.dn-product-visual-media picture {
  width: 100%;
  height: 100%;
  display: block;
}

.dn-product-visual-media img,
.dn-product-visual-media picture img {
  width: 100%;
  height: 100%;
  min-height: 220px;
  display: block;
  object-fit: cover;
}

.dn-product-visual-fallback {
  min-height: 220px;
  color: #f5f7fb;
  text-align: center;
  place-items: center;
  align-content: center;
  gap: 18px;
  display: grid;
  background: #07101bd9;
  border: 1px solid #7283a64a;
  border-radius: 12px;
}

.dn-product-visual-fallback svg {
  width: 96px;
  height: 96px;
  filter: drop-shadow(0 14px 22px #0009);
}

.dn-product-visual-fallback strong {
  max-width: 220px;
  font-size: 18px;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.dn-product-delivery {
  gap: 7px;
  padding: 17px 18px;
  display: grid;
  background: #070e19b8;
  border: 1px solid #6682a53d;
  border-left: 2px solid #df643e;
  border-radius: 8px;
}

.dn-product-delivery small,
.dn-product-selection {
  color: #8495ad;
  font: 900 9px/1 sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.dn-product-delivery strong {
  color: #edf3fb;
  font: 900 14px/1.25 sans-serif;
}

.dn-product-delivery span {
  color: #91a0b4;
  font: 600 11px/1.45 sans-serif;
}

.dn-product-content {
  min-width: 0;
  padding: 35px 38px 32px;
  display: flex;
  flex-direction: column;
}

.dn-product-close {
  z-index: 2;
  top: 16px;
  right: 16px;
  box-shadow: 0 9px 24px #0008;
}

.dn-product-close:hover {
  color: #fff;
  background: #202d43;
  border-color: #6d7e9b;
}

.dn-product-close:focus-visible,
.dn-product-terms button:focus-visible,
.dn-product-primary:focus-visible,
.dn-product-quantity button:focus-visible {
  outline: 2px solid #84cfff;
  outline-offset: 2px;
}

#dn-product-title {
  max-width: calc(100% - 46px);
  margin: 9px 0 11px;
  font-size: clamp(30px, 4vw, 44px);
  letter-spacing: -.015em;
}

.dn-product-description {
  max-width: 610px;
  color: #aeb9cb;
  font-size: 13.5px;
}

.dn-product-section-title {
  margin: 24px 0 12px;
  padding-top: 20px;
}

.dn-product-terms {
  gap: 10px;
}

.dn-product-terms button {
  min-width: 0;
  min-height: 88px;
  text-align: left;
  gap: 7px;
  padding: 13px 14px;
  display: grid;
  align-content: center;
  position: relative;
  transition: border-color .16s ease, background .16s ease,
    transform .16s ease, box-shadow .16s ease;
}

.dn-product-terms button:hover {
  border-color: #667c9f;
  transform: translateY(-1px);
}

.dn-product-terms button > span {
  color: #9eadc2;
  font: 900 10px/1 sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dn-product-term-price {
  min-width: 0;
  align-items: baseline;
  gap: 7px;
  display: flex;
  flex-wrap: wrap;
}

.dn-product-term-price b {
  color: #f5f8fc;
  font: 900 19px/1 sans-serif;
}

.dn-product-term-price del {
  color: #74839a;
  font: 800 11px/1 sans-serif;
}

.dn-product-term-price em,
.dn-product-discount {
  color: #ffd6c6;
  background: #d9522e;
  border: 1px solid #f07854;
  border-radius: 999px;
  padding: 4px 6px 3px;
  font: 900 9px/1 sans-serif;
  font-style: normal;
  letter-spacing: .04em;
}

.dn-product-terms button > small {
  color: #7f90a9;
  font: 700 10px/1.2 sans-serif;
}

.dn-product-terms button[data-selected] {
  background:
    radial-gradient(circle at 100% 0, #7849bc40, transparent 46%),
    linear-gradient(135deg, #26344b, #172033);
  border-color: #df704f;
  box-shadow: 0 0 0 1px #e06c4a24, 0 12px 28px #02050b66;
}

.dn-product-terms button[data-selected]::after {
  content: '\2713';
  width: 21px;
  height: 21px;
  color: #fff;
  background: #d85b37;
  border-radius: 50%;
  place-items: center;
  display: grid;
  position: absolute;
  top: 9px;
  right: 9px;
  font: 900 11px/1 sans-serif;
}

#dn-product-modal[data-presentation="tabbed"] {
  height: auto;
}

#dn-product-modal[data-presentation="tabbed"] .dn-product-body,
#dn-product-modal[data-presentation="tabbed"] .dn-product-layout {
  min-height: 0;
  height: 100%;
}

#dn-product-modal[data-presentation="tabbed"] .dn-product-visual {
  min-height: 0;
  overflow: visible;
}

#dn-product-modal[data-presentation="tabbed"] .dn-product-visual-media,
#dn-product-modal[data-presentation="tabbed"] .dn-product-visual-fallback {
  min-height: 210px;
}

#dn-product-modal[data-presentation="tabbed"] .dn-product-visual-media img {
  min-height: 210px;
}

#dn-product-modal[data-presentation="tabbed"] .dn-product-visual >
  .dn-product-section-title {
  margin: 3px 0 10px;
  padding-top: 17px;
}

#dn-product-modal[data-presentation="tabbed"] .dn-product-visual
  .dn-product-conditions {
  grid-template-columns: minmax(0, 1fr);
}

#dn-product-modal[data-presentation="tabbed"] .dn-product-visual
  .dn-product-conditions li {
  padding: 10px 11px 10px 32px;
}

#dn-product-modal[data-presentation="tabbed"] .dn-product-content {
  min-height: 0;
  overflow: visible;
}

.dn-product-tabs {
  gap: 7px;
  margin-top: 24px;
  padding: 5px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  background: #09111d;
  border: 1px solid #ffffff12;
  border-radius: 9px;
}

.dn-product-tabs button {
  min-width: 0;
  min-height: 42px;
  color: #8291a7;
  cursor: pointer;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  font: 900 10px/1 sans-serif;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.dn-product-tabs button:hover { color: #dce5f2; }

.dn-product-tabs button[data-selected] {
  color: #fff;
  background: linear-gradient(120deg, #25334a, #182236);
  border-color: #526683;
  box-shadow: 0 7px 18px #0005, inset 0 1px #ffffff0d;
}

.dn-product-tabs button:focus-visible {
  outline: 2px solid #84cfff;
  outline-offset: 2px;
}

.dn-product-tab-panel {
  padding-top: 14px;
}

.dn-product-tab-panel[hidden] { display: none; }

#dn-product-modal[data-presentation="tabbed"] .dn-product-tab-panel >
  .dn-product-section-title:first-child {
  margin-top: 7px;
  padding-top: 16px;
}

#dn-product-modal[data-presentation="tabbed"] .dn-product-benefits li,
#dn-product-modal[data-presentation="tabbed"] .dn-product-conditions li {
  padding-block: 9px;
  font-size: 11px;
}

#dn-product-modal[data-presentation="tabbed"] .dn-product-footer {
  padding-top: 16px;
}

@media (min-width: 761px) {
  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual {
    grid-template-columns: minmax(230px, 38%) minmax(0, 1fr);
    align-items: start;
  }

  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual-media,
  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual-fallback,
  #dn-product-modal[data-presentation="tabbed"] .dn-product-delivery {
    box-sizing: border-box;
    height: 176px;
    min-height: 176px;
  }

  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual-media img,
  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual-media picture img {
    height: 176px;
    min-height: 176px;
  }

  #dn-product-modal[data-presentation="tabbed"] .dn-product-delivery {
    align-content: center;
    padding: 15px 18px;
  }
}

.dn-product-benefits,
.dn-product-conditions {
  gap: 8px;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  list-style: none;
}

.dn-product-benefits li,
.dn-product-conditions li {
  min-width: 0;
  border-radius: 7px;
  padding: 10px 12px 10px 33px;
  font: 700 11.5px/1.38 sans-serif;
  position: relative;
}

.dn-product-benefits li {
  color: #cdd7e5;
  background: #0d1824;
  border: 1px solid #69b9871c;
}

.dn-product-benefits li::before {
  content: '\2713';
  color: #72d99a;
}

.dn-product-conditions li {
  color: #c7c1b8;
  background: #191712;
  border: 1px solid #d39b4226;
}

.dn-product-conditions li::before {
  content: '!';
  color: #f2b95c;
}

.dn-product-benefits li::before,
.dn-product-conditions li::before {
  position: absolute;
  top: 10px;
  left: 12px;
  font-weight: 900;
}

.dn-product-footer {
  min-width: 0;
  margin: auto 0 0;
  padding: 20px 0 0;
  background: transparent;
  border: 0;
  border-top: 1px solid #7182a83d;
  border-radius: 0;
  backdrop-filter: none;
  box-shadow: none;
}

.dn-product-footer-copy {
  min-width: 0;
  gap: 6px;
  display: grid;
}

.dn-product-price-line {
  min-width: 0;
  align-items: center;
  gap: 9px;
  display: flex;
  flex-wrap: wrap;
}

.dn-product-price {
  font-size: 20px;
}

.dn-product-old-price {
  color: #738096;
  font: 800 12px/1 sans-serif;
}

.dn-product-footer-actions {
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  display: flex;
}

.dn-product-quantity {
  height: 44px;
  align-items: center;
  display: grid;
  grid-template-columns: 38px 38px 38px;
  background: #101a28;
  border: 1px solid #43516a;
  border-radius: 7px;
  overflow: hidden;
}

.dn-product-quantity button {
  height: 100%;
  color: #dbe5f3;
  cursor: pointer;
  background: transparent;
  border: 0;
  font: 900 18px/1 sans-serif;
}

.dn-product-quantity button:hover { background: #1a293c; }

.dn-product-quantity span {
  color: #fff;
  text-align: center;
  font: 900 13px/1 sans-serif;
}

.dn-product-primary {
  min-width: 220px;
  min-height: 46px;
  background: linear-gradient(100deg, #c74625, #e45f36);
  box-shadow: 0 10px 25px #8c2c1f40, inset 0 1px #ffffff24;
  transition: filter .16s ease, transform .16s ease;
}

.dn-product-primary:hover:not(:disabled) {
  filter: brightness(1.1);
  transform: translateY(-1px);
}

[class$="__mobileHeroBonus"],
[class$="__topupPromo"] {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 92% 0, #d6532826, transparent 35%),
    linear-gradient(145deg, #151323, #090e19 72%) !important;
  border: 1px solid #d05d3f61 !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 40px #0005 !important;
}

[class$="__catalogBalance"] {
  box-sizing: border-box !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 13px !important;
  align-content: start !important;
  gap: 12px !important;
}

[class$="__catalogBalance"] > button,
[class$="__catalogBalance"] > a,
[class$="__mobileHeroBonus"] > button,
[class$="__mobileHeroBonus"] > a,
[class$="__topupPromo"] > button,
[class$="__topupPromo"] > a {
  display: none !important;
}

[class$="__topupPromo"] {
  padding: 14px !important;
}

[class$="__mobileHeroBonus"] > span,
[class*="__topupPromoHeading"] > span {
  color: #f2b44f !important;
  letter-spacing: .07em !important;
}

[class$="__mobileHeroBonus"] > strong,
[class*="__topupPromoHeading"] > strong {
  color: #fff !important;
  letter-spacing: .025em !important;
}

[class*="__mobileHeroBonusTiers"],
[class*="__topupPromoTiers"] {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

[class*="__mobileHeroBonusTiers"] > article,
[class*="__topupPromoTiers"] > article {
  min-width: 0 !important;
  background: linear-gradient(155deg, #111b2b, #080d17) !important;
  border: 1px solid #5f71943d !important;
  border-radius: 9px !important;
  padding: 11px !important;
  display: grid !important;
  gap: 5px !important;
}

[class*="__mobileHeroBonusTiers"] > article:nth-child(2),
[class*="__topupPromoTiers"] > article:nth-child(2) {
  background: linear-gradient(155deg, #17152b, #0a0e19) !important;
}

[class*="__mobileHeroBonusTiers"] > article:nth-child(3),
[class*="__topupPromoTiers"] > article:nth-child(3) {
  background: linear-gradient(155deg, #281a12, #0b0e16) !important;
  border-color: #e09a3c4d !important;
}

[class*="__mobileHeroBonusTiers"] small,
[class*="__topupPromoTiers"] small {
  color: #95a1b7 !important;
  font-size: 9px !important;
  letter-spacing: .04em !important;
}

[class*="__mobileHeroBonusTiers"] b,
[class*="__topupPromoTiers"] article > strong {
  color: #ffbe45 !important;
  font-size: 21px !important;
  line-height: 1 !important;
}

[class*="__mobileHeroBonusTiers"] article:nth-child(2) b,
[class*="__topupPromoTiers"] article:nth-child(2) > strong {
  color: #b184ff !important;
}

[class*="__mobileHeroBonusTiers"] article > strong,
[class*="__topupPromoTiers"] article > span {
  color: #f2f5fa !important;
  font-size: 11px !important;
}

[class*="__mobileHeroBonusTiers"] em,
[class*="__topupPromoTiers"] em {
  color: #78b7f2 !important;
  font-size: 9px !important;
}

[class$="__mobileHeroBonus"] > button,
[class$="__mobileHeroBonus"] > a,
[class$="__topupPromo"] > button,
[class$="__topupPromo"] > a {
  box-sizing: border-box !important;
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 44px !important;
  margin: 12px 0 0 !important;
  flex: 0 0 auto !important;
}

[class$="__catalogBalance"] > button,
[class$="__catalogBalance"] > a {
  box-sizing: border-box !important;
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 44px !important;
  margin: 0 !important;
  align-self: start !important;
}

[class$="__mobileHeroBonus"] > button > *,
[class$="__mobileHeroBonus"] > a > *,
[class$="__topupPromo"] > button > *,
[class$="__topupPromo"] > a > * {
  min-width: 0 !important;
  border-block: 0 !important;
}

[class$="__catalogBalance"] > button > *,
[class$="__catalogBalance"] > a > * {
  min-width: 0 !important;
  border-block: 0 !important;
}

.dn-coin-card {
  min-height: 100%;
  background: linear-gradient(155deg, #111b2a, #0a101a 68%);
  border: 1px solid #c895364d;
}

.dn-coin-card-main {
  gap: 10px;
  align-items: flex-start;
  padding: 18px;
  display: flex;
  flex-direction: column;
}

.dn-coin-media {
  width: 100%;
  min-height: 132px;
  color: #ffe19a;
  background:
    radial-gradient(circle at 64% 38%, #ffd56b 0 6%, #a66d22 7% 15%, transparent 16%),
    radial-gradient(circle at 42% 58%, #f1b84d 0 10%, #76501d 11% 22%, transparent 23%),
    linear-gradient(145deg, #182638, #080e17);
  border: 1px solid #d6a44966;
  border-radius: 9px;
  place-items: center;
  font: 900 28px/1 sans-serif;
  letter-spacing: .12em;
  display: grid;
  overflow: hidden;
}

.dn-coin-media img {
  width: 100%;
  height: 132px;
  display: block;
  object-fit: cover;
}

.dn-coin-card .dn-buy-now:disabled {
  cursor: not-allowed;
  filter: grayscale(.7);
  opacity: .55;
}

.dn-coin-card-main strong { color: #fff; font-size: 18px; }
.dn-coin-card-main span { color: #b9c0ce; font-size: 13px; line-height: 1.45; }
.dn-coin-card-main small { color: #e3b95c; font-weight: 800; }
.dn-coin-card .dn-store-actions > b { color: #ffe19a; font-size: 18px; }

@media (max-width: 760.98px) {
  #dn-cart-toggle { right: 12px; bottom: 12px; }
  #dn-vip-limit-modal { padding: 25px 20px 21px; }
  .dn-vip-limit-plans { grid-template-columns: 1fr; }
  #dn-product-backdrop { align-items: end; padding: 0; }
  #dn-product-modal {
    width: 100%;
    max-height: 96dvh;
    padding: 0;
    border-radius: 16px 16px 0 0;
  }
  .dn-product-layout { grid-template-columns: minmax(0, 1fr); }
  .dn-product-visual {
    grid-template-columns: 112px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    padding: 16px;
    border-right: 0;
    margin-top: 18px;
    border-bottom: 0;
  }
  .dn-product-visual-media,
  .dn-product-visual-fallback,
  .dn-product-delivery {
    box-sizing: border-box;
    height: 148px;
    min-height: 148px;
  }
  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual-media,
  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual-fallback {
    height: 148px;
    min-height: 148px;
  }
  .dn-product-visual-media img,
  .dn-product-visual-media picture img {
    height: 148px;
    min-height: 148px;
  }
  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual-media img,
  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual-media picture img {
    height: 148px;
    min-height: 148px;
  }
  .dn-product-visual-fallback { gap: 8px; }
  .dn-product-visual-fallback svg { width: 54px; height: 54px; }
  .dn-product-visual-fallback strong { font-size: 10px; }
  .dn-product-delivery { align-content: center; padding: 12px; }
  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual >
    .dn-product-section-title,
  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual >
    .dn-product-conditions { grid-column: 1 / -1; }
  .dn-product-visual > .dn-product-section-title,
  .dn-product-visual > .dn-product-terms,
  .dn-product-visual > .dn-product-conditions { grid-column: 1 / -1; }
  .dn-product-content { padding: 24px 17px 25px; }
  #dn-product-title { font-size: clamp(27px, 9vw, 36px); }
  .dn-product-terms,
  .dn-product-benefits,
  .dn-product-conditions,
  .dn-product-items { grid-template-columns: minmax(0, 1fr); }
  .dn-bundle-collage--modal { min-height: 112px; }
  .dn-bundle-collage__meta { right: 6px; bottom: 5px; padding: 3px 5px; font-size: 7px; }
  .dn-product-item--illustrated { grid-template-columns: 36px minmax(0, 1fr) auto; }
  .dn-product-item-icon { width: 36px; height: 36px; }
  .dn-product-footer {
    align-items: stretch;
    gap: 12px;
    padding: 18px 0 0;
    flex-direction: column;
  }
  .dn-product-footer-actions { justify-content: stretch; }
  .dn-product-footer-actions .dn-product-primary { flex: 1 1 auto; }
  .dn-product-primary { width: 100%; }

  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
  }

  [class*="store-module"][class*="__content"] {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding-inline: 8px !important;
  }

  [class$="__mobileHeroBonus"],
  [class*="__mobileHeroBonusTiers"],
  [class*="__mobileHeroBonusTiers"] > article {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  [class*="__catalogExperience"],
  [class*="__catalogMain"],
  [class*="__productGrid"],
  [class*="store-products-module"][class*="__grid"],
  [class*="__catalogControls"],
  [class*="__mobilePromotionSlot"],
  .dn-store-grid,
  .dn-store-card {
    box-sizing: border-box;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  [class*="__catalogExperience"] {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  [class*="__categorySidebar"] {
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  [class*="__categorySidebarList"] {
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 8px !important;
    padding-bottom: 5px !important;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }

  [class*="__categorySidebarList"] > * {
    flex: 0 0 auto !important;
    white-space: nowrap;
  }

  [class*="__catalogControls"] {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  [class*="__catalogControls"] input,
  [class*="__catalogControls"] select,
  [class*="__catalogControls"] button {
    box-sizing: border-box;
    width: 100% !important;
    min-width: 0 !important;
  }

  [class*="__productGrid"],
  [class*="store-products-module"][class*="__grid"],
  .dn-store-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-rows: auto !important;
    gap: 8px !important;
  }

  [class*="__mobileHeroBonusTiers"] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  [class*="__mobileHeroBonusTiers"] > article {
    padding: 8px 7px !important;
    gap: 4px !important;
  }

  [class$="__mobileHeroBonus"] {
    padding-bottom: 12px !important;
  }

  [class$="__mobileHeroBonus"] > strong {
    max-width: 100% !important;
    white-space: normal !important;
    font-size: clamp(17px, 5.1vw, 20px) !important;
    line-height: 1.08 !important;
  }

  [class$="__mobileHeroBonus"] > button,
  [class$="__mobileHeroBonus"] > a {
    margin-top: 10px !important;
  }

  [class*="__mobileHeroBonusTiers"] b {
    font-size: 18px !important;
  }

  [class*="__mobileHeroBonusTiers"] small,
  [class*="__mobileHeroBonusTiers"] em {
    font-size: 8px !important;
  }

  .dn-store-media,
  .dn-store-media img {
    max-width: 100%;
  }

  .dn-store-card .dn-store-media {
    min-height: 0 !important;
    aspect-ratio: 1 / .68 !important;
  }

  .dn-store-card .dn-store-card-main > span:last-child {
    min-height: 0 !important;
    padding: 7px 8px !important;
  }

  #dn-cart-panel {
    width: 100vw;
    max-width: 100vw;
  }

  .dn-cart-header {
    padding: 16px 14px;
  }

  .dn-cart-list {
    padding: 8px;
  }

  .dn-cart-footer {
    padding: 14px;
  }

  .dn-cart-summary {
    grid-template-columns: 1fr;
  }

  .dn-cart-promo-status {
    grid-column: 1;
  }

  .dn-store-actions {
    grid-template-columns: minmax(0, 1fr) clamp(78px, 44%, 108px) !important;
    gap: 5px !important;
    min-height: 0 !important;
    padding: 7px 8px !important;
  }

  .dn-store-actions > button {
    width: 100% !important;
    max-width: 108px !important;
    min-height: 35px !important;
    padding: 6px 7px !important;
    font-size: 9.5px !important;
  }

  .dn-store-actions > .dn-add-cart::after { margin-left: 3px; }
}

@media (prefers-reduced-motion: reduce) {
  .dn-store-actions > .dn-add-cart,
  .dn-store-actions > .dn-add-cart::before,
  .dn-store-actions > .dn-add-cart::after {
    animation: none !important;
    transition: none !important;
  }
}

/* Keep the vertical category rail usable on short desktop viewports. */
@media (min-width: 1181px) {
  html body [class*="__categorySidebar"] {
    max-height: calc(100dvh - 92px) !important;
    overflow: hidden !important;
  }

  html body [class*="__categorySidebarList"] {
    min-height: 0 !important;
    max-height: calc(100dvh - 156px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain;
    scrollbar-color: rgba(104, 118, 145, .72) rgba(5, 10, 18, .36);
    scrollbar-gutter: stable;
    scrollbar-width: thin;
  }

  html body [class*="__categorySidebarList"]::-webkit-scrollbar {
    width: 5px;
  }

  html body [class*="__categorySidebarList"]::-webkit-scrollbar-track {
    background: rgba(5, 10, 18, .36);
  }

  html body [class*="__categorySidebarList"]::-webkit-scrollbar-thumb {
    background: rgba(104, 118, 145, .72);
    border-radius: 999px;
  }
}

/* Compact balances stay docked to the account actions below desktop. */
@media (min-width: 1181px) and (max-width: 1359.98px) {
  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced) {
    grid-template-columns: 150px minmax(300px, 1fr) 214px 270px !important;
  }

  html body header[class*="__storeTopbar"] [class*="__storeHeaderBalances"] {
    width: 214px !important;
    min-width: 214px !important;
    max-width: 214px !important;
  }
}

@media (min-width: 761px) and (max-width: 1180px) {
  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced) {
    grid-template-columns: minmax(0, 1fr) 214px auto !important;
    justify-content: stretch !important;
    column-gap: 8px !important;
  }

  html body header[class*="__storeTopbar"] [class*="__storeHeaderBalances"] {
    grid-column: 2 !important;
    justify-self: end !important;
  }

  html body .dn-header-actions-enhanced {
    grid-column: 3 !important;
  }
}

@media (min-width: 761px) and (max-width: 1359.98px) {
  html body header[class*="__storeTopbar"] [class*="__storeHeaderBalances"] {
    width: 214px !important;
    min-width: 214px !important;
    max-width: 214px !important;
    height: 58px !important;
    min-height: 58px !important;
    gap: 6px !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  html body header[class*="__storeTopbar"] [class$="__storeHeaderBalance"] {
    display: grid !important;
    height: 58px !important;
    min-height: 58px !important;
    padding: 7px 9px !important;
    grid-template-rows: 9px 19px !important;
    align-content: center !important;
    justify-items: center !important;
    row-gap: 5px !important;
    text-align: center !important;
    background: rgba(9, 12, 27, .76) !important;
    border: 1px solid rgba(126, 81, 164, .72) !important;
    border-radius: 10px !important;
    box-shadow: inset 0 1px rgba(255, 255, 255, .055), 0 8px 22px rgba(0, 0, 0, .3) !important;
    backdrop-filter: blur(16px) saturate(115%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(115%) !important;
  }

  html body header[class*="__storeTopbar"] [class$="__storeHeaderBalance"]:first-child {
    background: linear-gradient(135deg, rgba(54, 28, 76, .68), rgba(9, 12, 27, .78)) !important;
    border: 1px solid rgba(153, 91, 197, .78) !important;
  }

  html body header[class*="__storeTopbar"] [class$="__storeHeaderBalance"] > span {
    width: 100% !important;
    font: 700 7px/9px Arial, sans-serif !important;
    letter-spacing: .01em !important;
    text-align: center !important;
    transform: translateY(-2px) !important;
  }

  html body header[class*="__storeTopbar"] [class$="__storeHeaderBalance"] > strong {
    justify-content: center !important;
    gap: 5px !important;
    height: 19px !important;
    font: 800 14px/19px "Roboto Condensed Local", "Arial Narrow", Arial, sans-serif !important;
    letter-spacing: -.015em !important;
    transform: translateY(-2px) !important;
  }

  html body header[class*="__storeTopbar"] [class$="__storeHeaderBalance"] > strong svg {
    width: 13px !important;
    min-width: 13px !important;
    height: 13px !important;
  }
}

@media (max-width: 760.98px) {
  html body header[class*="__storeTopbar"]:has(.dn-mobile-header-actions) {
    grid-template-columns: clamp(82px, 24vw, 94px) minmax(0, 1fr) auto !important;
    justify-content: stretch !important;
  }

  html body .dn-mobile-balances-enhanced {
    width: min(214px, 100%) !important;
    max-width: 214px !important;
    justify-self: end !important;
    gap: 5px !important;
  }

  html body .dn-mobile-balances-enhanced > * {
    display: grid !important;
    padding: 5px 6px !important;
    grid-template-rows: 9px 16px !important;
    justify-items: center !important;
    row-gap: 3px !important;
    text-align: center !important;
    background: rgba(9, 12, 27, .76) !important;
    border-color: rgba(126, 81, 164, .72) !important;
    box-shadow: inset 0 1px rgba(255, 255, 255, .055), 0 7px 18px rgba(0, 0, 0, .28) !important;
    backdrop-filter: blur(16px) saturate(115%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(115%) !important;
  }

  html body .dn-mobile-balances-enhanced > *:first-child {
    background: linear-gradient(135deg, rgba(54, 28, 76, .68), rgba(9, 12, 27, .78)) !important;
  }

  html body .dn-mobile-balances-enhanced > * > span {
    width: 100% !important;
    font: 700 clamp(6px, 1vw, 7px)/9px Arial, sans-serif !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    transform: translateY(-2px) !important;
  }

  html body .dn-mobile-balances-enhanced > * > strong {
    justify-content: center !important;
    gap: 4px !important;
    height: 16px !important;
    font: 800 clamp(10px, 1.8vw, 13px)/16px "Roboto Condensed Local", "Arial Narrow", Arial, sans-serif !important;
    letter-spacing: -.015em !important;
    transform: translateY(-2px) !important;
  }

  html body .dn-mobile-balances-enhanced > * > strong svg {
    width: 11px !important;
    min-width: 11px !important;
    height: 11px !important;
  }
}

/* Preserve the brand and primary navigation throughout the tablet range. */
@media (min-width: 761px) and (max-width: 1180px) {
  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced) {
    grid-template-columns:
      clamp(110px, 15vw, 155px)
      minmax(0, 1fr)
      clamp(190px, 20vw, 214px)
      auto !important;
    grid-template-rows: 80px !important;
    min-height: 80px !important;
    height: auto !important;
    align-items: center !important;
    justify-content: stretch !important;
    column-gap: 8px !important;
    row-gap: 0 !important;
    padding-inline: clamp(7px, 1.4vw, 16px) !important;
  }

  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced)
    [class*="__storeBrand"] {
    display: flex !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: center !important;
    justify-self: start !important;
    width: min(100%, 150px) !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced)
    [class*="__storeBrand"] .brand {
    max-width: 100% !important;
  }

  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced)
    [class*="__storeNavigation"] {
    display: flex !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: stretch !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 80px !important;
    gap: clamp(8px, 1.5vw, 18px) !important;
    padding: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }

  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced)
    [class*="__storeNavigation"]::-webkit-scrollbar {
    display: none;
  }

  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced)
    [class*="__storeNavigation"] a {
    flex: 0 0 auto !important;
    gap: 5px !important;
    font-size: clamp(8px, 1.15vw, 11px) !important;
    white-space: nowrap !important;
  }

  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced)
    [class*="__storeNavigation"] a svg {
    width: 16px !important;
    height: 16px !important;
  }

  html body header[class*="__storeTopbar"] [class*="__storeHeaderBalances"] {
    grid-column: 3 !important;
    grid-row: 1 !important;
    align-self: center !important;
    justify-self: end !important;
  }

  html body .dn-header-actions-enhanced {
    grid-column: 4 !important;
    grid-row: 1 !important;
    align-self: center !important;
    justify-self: end !important;
    width: auto !important;
    gap: 4px !important;
  }

  html body header[class*="__storeTopbar"] [class*="__storeHeaderBalances"] {
    width: clamp(190px, 20vw, 214px) !important;
    min-width: clamp(190px, 20vw, 214px) !important;
    max-width: clamp(190px, 20vw, 214px) !important;
  }

  html body .dn-header-actions-enhanced .dn-header-topup,
  html body .dn-header-actions-enhanced [class*="__storeProfile"],
  html body .dn-header-actions-enhanced .dn-header-ticket-native {
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    flex: 0 0 40px !important;
  }

  html body .dn-header-actions-enhanced .dn-header-topup {
    grid-template-columns: 1fr !important;
    place-items: center !important;
    padding: 0 !important;
  }

  html body .dn-header-actions-enhanced .dn-header-topup > span,
  html body .dn-header-actions-enhanced .dn-header-topup > b,
  html body .dn-header-actions-enhanced [class*="__storeProfile"] > span:nth-child(2),
  html body .dn-header-actions-enhanced [class*="__storeProfile"] > svg {
    display: none !important;
  }

  html body .dn-header-actions-enhanced [class*="__storeProfile"] {
    display: grid !important;
    grid-template-columns: 1fr !important;
    place-items: center !important;
    padding: 2px !important;
  }

  html body .dn-header-actions-enhanced [class*="__storeProfile"] > span:first-child {
    display: grid !important;
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    place-items: center !important;
  }
}

@media (min-width: 761px) and (max-width: 820px) {
  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced)
    [class*="__storeNavigation"] {
    gap: 8px !important;
  }

  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced)
    [class*="__storeNavigation"] a {
    font-size: 8px !important;
  }
}

@media (min-width: 1100px) and (max-width: 1180px) {
  html body .dn-header-actions-enhanced .dn-header-topup {
    grid-template-columns: 18px minmax(0, 1fr) 12px !important;
    place-items: initial !important;
    align-items: center !important;
    width: clamp(140px, 15vw, 170px) !important;
    min-width: clamp(140px, 15vw, 170px) !important;
    max-width: clamp(140px, 15vw, 170px) !important;
    padding-inline: 10px !important;
    flex-basis: clamp(140px, 15vw, 170px) !important;
  }

  html body .dn-header-actions-enhanced .dn-header-topup > span {
    display: grid !important;
  }

  html body .dn-header-actions-enhanced .dn-header-topup > b {
    display: block !important;
  }

  html body .dn-header-actions-enhanced [class*="__storeProfile"] {
    grid-template-columns: auto minmax(0, 1fr) !important;
    place-items: initial !important;
    align-items: center !important;
    width: clamp(120px, 14vw, 150px) !important;
    min-width: clamp(120px, 14vw, 150px) !important;
    max-width: clamp(120px, 14vw, 150px) !important;
    padding: 3px 7px 3px 3px !important;
    flex-basis: clamp(120px, 14vw, 150px) !important;
  }

  html body .dn-header-actions-enhanced [class*="__storeProfile"] > span:nth-child(2) {
    display: grid !important;
  }
}

/* Keep every desktop/tablet header control aligned to one compact height. */
@media (min-width: 761px) {
  html body header[class*="__storeTopbar"] [class*="__storeHeaderBalances"],
  html body header[class*="__storeTopbar"] [class$="__storeHeaderBalance"],
  html body .dn-header-actions-enhanced .dn-header-topup,
  html body .dn-header-actions-enhanced [class*="__storeProfile"],
  html body .dn-header-actions-enhanced .dn-header-ticket-native {
    height: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;
  }
}

/* Keep the complete account header in the viewport while the catalog scrolls. */
html body header[class*="__storeTopbar"] {
  position: sticky !important;
  inset-block-start: 0 !important;
  top: 0 !important;
  z-index: 100 !important;
  transform: none !important;
}

@media (min-width: 761px) and (max-width: 1180px) {
  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced) {
    align-items: center !important;
  }

  html body header[class*="__storeTopbar"]:has(.dn-header-actions-enhanced)
    > [class],
  html body .dn-header-actions-enhanced {
    grid-row: 1 !important;
    align-self: center !important;
    margin-block: 0 !important;
    transform: none !important;
  }
}

/* Match the desktop scenic backdrop on scaled tablet layouts. The runtime
   class avoids gaps caused by browser zoom crossing the CSS breakpoint. */
html body [class*="__storefront"].dn-fortune-promotion-backdrop::before {
  left: clamp(260px, 27vw, 350px) !important;
  right: 0 !important;
  height: clamp(500px, 43vw, 560px) !important;
  background-size: auto, auto, cover !important;
  background-position: 0 0, 0 0, center !important;
  background-repeat: no-repeat !important;
}

/* Keep the desktop category rail below the sticky store header while the
   catalog scrolls. This intentionally does not change the header or promos. */
@media (min-width: 1181px) {
  html body [class*="__categorySidebar"] {
    top: calc(var(--store-header-height, 80px) + 16px) !important;
    max-height: calc(100dvh - var(--store-header-height, 80px) - 28px) !important;
  }

  html body [class*="__categorySidebarList"] {
    max-height: calc(100dvh - var(--store-header-height, 80px) - 92px) !important;
  }

  html body [class$="__recentPurchases"] {
    top: calc(var(--store-header-height, 80px) + 16px) !important;
  }
}

/* On tablets, use the available promotion area as two compact full-height cards. */
@media (min-width: 761px) and (max-width: 1180px) {
  html body .dn-fortune-tablet-host.is-side-by-side {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: minmax(0, 1fr) !important;
    column-gap: 12px !important;
    height: var(--dn-promotion-row-height) !important;
    min-height: var(--dn-promotion-row-height) !important;
    padding-bottom: 0 !important;
    align-items: stretch !important;
  }

  html body .dn-fortune-tablet-host.is-side-by-side
    [class$="__mobileHeroBonus"] {
    grid-column: 1 !important;
    grid-row: 1 !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto minmax(0, 1fr) !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    align-self: stretch !important;
    align-content: stretch !important;
    overflow: hidden !important;
  }

  html body .dn-fortune-tablet-host.is-side-by-side
    [class$="__mobileStoreIntro"] {
    display: none !important;
  }

  html body .dn-fortune-tablet-host.is-side-by-side
    [class$="__mobileHeroBonus"] > span,
  html body .dn-fortune-tablet-host.is-side-by-side
    [class$="__mobileHeroBonus"] > strong,
  html body .dn-fortune-tablet-host.is-side-by-side
    [class$="__mobileHeroBonus"] > [class$="__mobileHeroBonusTiers"] {
    grid-area: auto !important;
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  html body .dn-fortune-tablet-host.is-side-by-side
    [class$="__mobileHeroBonusTiers"] {
    height: 100% !important;
    align-items: stretch !important;
  }

  html body .dn-fortune-tablet-host.is-side-by-side
    [class$="__mobileHeroBonusTiers"] > article {
    align-content: center !important;
  }

  html body .dn-fortune-launcher.is-tablet-promotion.is-tablet-side-by-side {
    width: var(--dn-launcher-width) !important;
    height: var(--dn-launcher-height) !important;
  }
}

/* Final responsive and dialog safeguards. Keep these last so they also
   normalize the legacy storefront rules above. */
#dn-cart-toggle,
.dn-cart-clear,
.dn-cart-close,
.dn-cart-controls button,
.dn-cart-promo-input,
.dn-cart-promo-button,
.dn-product-close,
.dn-product-tabs button {
  box-sizing: border-box;
  min-height: 44px;
}

.dn-cart-close,
.dn-product-close {
  width: 44px;
  min-width: 44px;
  height: 44px;
}

.dn-cart-controls button {
  min-width: 44px;
}

.dn-cart-promo-input,
.dn-cart-promo-button {
  height: 44px;
}

.dn-product-quantity {
  grid-template-columns: repeat(3, 44px);
}

#dn-product-backdrop[hidden] {
  display: none !important;
}

#dn-product-modal {
  grid-template-rows: minmax(0, 1fr) auto;
}

#dn-product-modal > .dn-product-footer {
  z-index: 4;
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 14px clamp(16px, 3.6vw, 38px);
  background: rgba(8, 15, 27, .96);
  border: 0;
  border-top: 1px solid rgba(113, 130, 168, .34);
  box-shadow: 0 -12px 28px rgba(0, 0, 0, .26);
}

@media (max-width: 760.98px) {
  html body #dn-fortune-launcher-slot.is-mobile {
    margin-top: 16px !important;
  }

  html body .dn-fortune-launcher.is-rail-mounted {
    box-sizing: border-box !important;
    width: var(--dn-launcher-width) !important;
    max-width: calc(100% - var(--dn-launcher-left, 0px)) !important;
  }

  #dn-cart-panel {
    width: 100%;
    max-width: 100%;
  }

  .dn-product-visual {
    grid-template-columns: clamp(112px, 30vw, 228px) minmax(0, 1fr);
  }

  .dn-product-visual-media,
  .dn-product-visual-fallback,
  .dn-product-delivery,
  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual-media,
  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual-fallback,
  .dn-product-visual-media img,
  .dn-product-visual-media picture img,
  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual-media img,
  #dn-product-modal[data-presentation="tabbed"] .dn-product-visual-media picture img {
    height: clamp(148px, calc(6.35vw + 127.7px), 176px);
    min-height: clamp(148px, calc(6.35vw + 127.7px), 176px);
  }

  #dn-product-modal > .dn-product-footer {
    gap: 9px;
    padding: 11px clamp(12px, 4vw, 18px);
  }
}

/* Keep both the Steam glyph and authenticated avatar optically centered in
   their header control at every compact-header size. */
html body .dn-mobile-header-actions [class*="__storeMobileSteam"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

html body .dn-mobile-header-actions [class*="__storeMobileSteam"]::before,
html body .dn-mobile-header-actions [class*="__storeMobileSteam"] > img,
html body .dn-header-actions-enhanced
  [class*="__storeProfile"] > span:first-child > img {
  flex: 0 0 auto !important;
  align-self: center !important;
  justify-self: center !important;
  margin: 0 !important;
  object-position: center center !important;
  transform: none !important;
}

/* Single-item dialogs use the same purchase controls in a compact surface. */
html body #dn-product-modal[data-presentation="compact"] {
  box-sizing: border-box;
  width: min(580px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  height: auto;
  border-radius: 14px;
}

html.dn-store-ready body #dn-product-modal[data-presentation="compact"]
  .dn-product-content {
  padding: 20px 24px !important;
}

#dn-product-modal[data-presentation="compact"] .dn-product-eyebrow {
  display: block;
  padding-right: 52px;
  min-height: 14px;
  line-height: 14px;
}

.dn-product-single {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  margin-top: 12px;
}

.dn-product-single-media {
  display: grid;
  place-items: center;
  width: 96px;
  height: 96px;
  background: #0a131f;
  border: 1px solid #7283a63d;
  border-radius: 10px;
}

.dn-product-single-icon {
  display: block;
  width: 88px;
  height: 88px;
  object-fit: contain;
}

.dn-product-single-copy { min-width: 0; }

html body #dn-product-modal[data-presentation="compact"] #dn-product-title {
  max-width: none;
  margin: 0;
  font-size: 28px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.dn-product-single-amount {
  margin: 8px 0 0;
  color: #efa176;
  font: 700 14px/1.4 Arial, sans-serif;
}

html.dn-store-ready body #dn-product-modal[data-presentation="compact"]
  .dn-product-description {
  margin-top: 8px;
  font: 400 13px/1.5 Arial, sans-serif;
}

html body #dn-product-modal[data-presentation="compact"] .dn-product-delivery {
  height: auto;
  min-height: 0;
  margin-top: 16px;
  padding: 10px 14px;
  gap: 4px;
  align-content: start;
}

#dn-product-modal[data-presentation="compact"] .dn-product-delivery strong {
  font-size: 13px;
}

#dn-product-modal[data-presentation="compact"] .dn-product-delivery span {
  font-size: 12px;
}

html.dn-store-ready body #dn-product-modal[data-presentation="compact"]
  > .dn-product-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 14px 24px !important;
}

#dn-product-modal[data-presentation="compact"] .dn-product-footer-actions {
  display: contents;
}

#dn-product-modal[data-presentation="compact"] .dn-product-primary {
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
  padding: 10px 14px;
  overflow-wrap: anywhere;
}

@media (max-width: 760.98px) {
  #dn-product-backdrop:has(#dn-product-modal[data-presentation="compact"]) {
    place-items: center;
    padding: 16px;
  }

  html.dn-store-ready body #dn-product-modal[data-presentation="compact"]
    .dn-product-content {
    padding: 20px 16px !important;
  }

  .dn-product-single {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 12px;
  }

  .dn-product-single-media { width: 96px; height: 96px; }
  .dn-product-single-icon { width: 88px; height: 88px; }

  html body #dn-product-modal[data-presentation="compact"] #dn-product-title {
    font-size: 24px;
  }

  html.dn-store-ready body #dn-product-modal[data-presentation="compact"]
    > .dn-product-footer {
    padding: 14px 16px !important;
    gap: 12px;
  }
}