/* Detail sections: shared product sheet plus store comparison. */
body > .n30n-qd-modal .n30n-qd-store-compare {
  display: grid !important;
  gap: 12px !important;
}

body > .n30n-qd-modal .n30n-qd-section-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
}

body > .n30n-qd-modal .n30n-qd-section-head > span {
  color: #b9c4df !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  text-align: right !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
  padding: 13px !important;
  border-color: rgba(255, 43, 214, .42) !important;
  background:
    radial-gradient(circle at 18% 8%, rgba(255, 43, 214, .16), transparent 36%),
    radial-gradient(circle at 88% 12%, rgba(0, 229, 255, .16), transparent 38%),
    rgba(4, 9, 28, .86) !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only {
  grid-template-columns: 1fr !important;
  border-color: rgba(0, 229, 255, .40) !important;
  background:
    radial-gradient(circle at 18% 8%, rgba(0, 229, 255, .15), transparent 38%),
    radial-gradient(circle at 88% 12%, rgba(255, 43, 214, .10), transparent 36%),
    rgba(4, 9, 28, .86) !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-head {
  grid-column: 1 / -1 !important;
  min-width: 0 !important;
  display: grid !important;
  gap: 4px !important;
  padding: 0 2px 2px !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-head b {
  color: #eafcff !important;
  font-size: 18px !important;
  font-weight: 950 !important;
  line-height: 1.1 !important;
  text-shadow: 0 0 12px rgba(0, 229, 255, .22) !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-head b {
  color: #00e5ff !important;
  font-size: 20px !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-head span {
  color: #b9c4df !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  line-height: 1.25 !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-card,
body > .n30n-qd-modal .n30n-qd-funnel-steam-card {
  min-width: 0 !important;
  border-radius: 10px !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .035), 0 0 24px rgba(0, 229, 255, .08) !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-copy p {
  margin: 0 !important;
  color: #b9c4df !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-button,
body > .n30n-qd-modal .n30n-qd-funnel-steam-card .n30n-qd-button {
  width: 100% !important;
  min-height: 36px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  border-radius: 8px !important;
  text-align: center !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-card {
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto auto 1fr !important;
  gap: 9px !important;
  padding: 12px !important;
  border: 1px solid rgba(0, 229, 255, .46) !important;
  background:
    radial-gradient(circle at 90% 0%, rgba(0, 229, 255, .16), transparent 54%),
    rgba(4, 9, 28, .84) !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-video-card {
  grid-column: 1 / -1 !important;
  grid-template-columns: minmax(180px, 292px) minmax(0, 1fr) !important;
  grid-template-rows: 1fr !important;
  gap: 14px !important;
  padding: 11px !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-card header {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-video-card header {
  grid-column: 1 / -1 !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-card header b {
  margin: 0 !important;
  color: #00e5ff !important;
  font-size: 18px !important;
  font-weight: 950 !important;
  line-height: 1.1 !important;
  text-transform: none !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-card header span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 22px !important;
  padding: 3px 7px !important;
  border-radius: 4px !important;
  background: #ff0033 !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 950 !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-card.is-disabled {
  opacity: .68 !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-empty {
  grid-template-columns: 1fr !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-card.is-empty {
  border-style: dashed !important;
  border-color: rgba(0, 229, 255, .32) !important;
  background:
    radial-gradient(circle at 20% 18%, rgba(0, 229, 255, .10), transparent 44%),
    rgba(4, 9, 28, .72) !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-card.is-empty .n30n-qd-funnel-video-placeholder {
  color: rgba(234, 252, 255, .42) !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-thumb {
  position: relative !important;
  min-width: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
  aspect-ratio: 16 / 9 !important;
  align-self: center !important;
  border: 1px solid rgba(0, 229, 255, .58) !important;
  border-radius: 9px !important;
  background: linear-gradient(135deg, rgba(0, 229, 255, .16), rgba(255, 43, 214, .12)) !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-video-thumb {
  grid-column: 1 !important;
  grid-row: 2 !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-thumb img,
body > .n30n-qd-modal .n30n-qd-funnel-video-placeholder {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-thumb > span:not(.n30n-qd-funnel-video-placeholder) {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 46px !important;
  height: 46px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transform: translate(-50%, -50%) !important;
  border: 1px solid rgba(255, 43, 214, .72) !important;
  border-radius: 999px !important;
  background: rgba(255, 43, 214, .75) !important;
  color: #fff !important;
  font-size: 18px !important;
  text-shadow: 0 0 10px rgba(255, 255, 255, .48) !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-placeholder {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #eafcff !important;
  font-size: 30px !important;
  font-weight: 950 !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-copy {
  min-width: 0 !important;
  display: grid !important;
  gap: 8px !important;
  align-content: start !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-copy {
  grid-column: 2 !important;
  grid-row: 2 !important;
  align-content: center !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-copy b,
body > .n30n-qd-modal .n30n-qd-funnel-steam-card b {
  color: #00e5ff !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: .04em !important;
  line-height: 1.15 !important;
  text-transform: uppercase !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-copy strong {
  color: #eafcff !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  line-height: 1.15 !important;
  overflow-wrap: anywhere !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-title {
  min-width: 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-title span {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  min-height: 20px !important;
  padding: 3px 7px !important;
  border-radius: 4px !important;
  background: #ff0033 !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-steam-card {
  grid-column: 1 / -1 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.2fr) auto minmax(0, .8fr) minmax(170px, 230px) !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(0, 229, 255, .34) !important;
  background: rgba(0, 229, 255, .07) !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-steam-card div {
  min-width: 0 !important;
  display: grid !important;
  gap: 2px !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-steam-meta {
  display: grid !important;
  gap: 2px !important;
  padding-left: 12px !important;
  border-left: 1px solid rgba(0, 229, 255, .25) !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-steam-card span {
  color: #cfd7f3 !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-steam-card strong {
  color: #64f4ff !important;
  font-size: 18px !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
}

body > .n30n-qd-modal .n30n-qd-button.is-disabled,
body > .n30n-qd-modal .n30n-qd-funnel-video-button.is-disabled {
  opacity: .52 !important;
  pointer-events: none !important;
}

body > .n30n-qd-modal .n30n-qd-detail-hub-nav {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 0 !important;
  align-items: center !important;
  padding: 0 !important;
  border: 1px solid rgba(0, 229, 255, .32) !important;
  border-radius: 9px !important;
  background: rgba(2, 13, 34, .72) !important;
  overflow: hidden !important;
}

body > .n30n-qd-modal .n30n-qd-detail-hub-nav button {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  min-height: 42px !important;
  padding: 8px 10px !important;
  border: 0 !important;
  border-right: 1px solid rgba(0, 229, 255, .20) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #e9ddff !important;
  font: inherit !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  line-height: 1.1 !important;
  cursor: pointer !important;
}

body > .n30n-qd-modal .n30n-qd-detail-hub-nav button:last-child {
  border-right: 0 !important;
}

body > .n30n-qd-modal .n30n-qd-detail-hub-nav button:first-child {
  background: rgba(255, 43, 214, .16) !important;
  color: #fff !important;
  box-shadow: inset 0 -2px 0 rgba(255, 43, 214, .78) !important;
}

body > .n30n-qd-modal .n30n-qd-detail-hub-nav button:hover,
body > .n30n-qd-modal .n30n-qd-detail-hub-nav button:focus-visible {
  border-color: rgba(0, 229, 255, .72) !important;
  background: rgba(0, 229, 255, .14) !important;
  color: #efffff !important;
}

body > .n30n-qd-modal .n30n-qd-detail-box.is-scroll-target {
  box-shadow: 0 0 0 2px rgba(255, 43, 214, .72), 0 0 32px rgba(0, 229, 255, .20) !important;
}

body > .n30n-qd-modal .n30n-qd-lazy-section {
  min-height: 104px !important;
  align-content: start !important;
  gap: 8px !important;
}

body > .n30n-qd-modal .n30n-qd-lazy-section .n30n-qd-muted-note {
  margin: 0 !important;
  max-width: 680px !important;
}

body > .n30n-qd-modal .n30n-qd-lazy-section .n30n-qd-button {
  width: min(260px, 100%) !important;
}

body > .n30n-qd-modal .n30n-qd-lazy-section.is-auto-lazy {
  min-height: 76px !important;
  background:
    linear-gradient(90deg, rgba(0, 229, 255, .035), rgba(255, 43, 214, .025)),
    rgba(3, 8, 26, .62) !important;
  opacity: .94 !important;
}

body > .n30n-qd-modal .n30n-qd-lazy-section.is-auto-lazy .n30n-qd-section-head {
  margin-bottom: 0 !important;
}

body > .n30n-qd-modal .n30n-qd-lazy-section.is-auto-lazy .n30n-qd-muted-note {
  color: rgba(221, 232, 255, .72) !important;
  font-size: 12px !important;
  line-height: 1.25 !important;
}

body > .n30n-qd-modal .n30n-qd-autoload-hint {
  width: fit-content !important;
  max-width: 100% !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  min-height: 26px !important;
  padding: 4px 9px !important;
  border: 1px dashed rgba(0, 229, 255, .28) !important;
  border-radius: 8px !important;
  background: rgba(0, 229, 255, .035) !important;
  color: #b9c4df !important;
  font-size: 12px !important;
  font-weight: 850 !important;
}

body > .n30n-qd-modal .n30n-qd-autoload-hint span {
  width: 8px !important;
  height: 8px !important;
  flex: 0 0 8px !important;
  border-radius: 999px !important;
  background: #00e5ff !important;
  box-shadow: 0 0 14px rgba(0, 229, 255, .55) !important;
}

body > .n30n-qd-modal .n30n-qd-autoload-hint b {
  min-width: 0 !important;
  color: #d9f7ff !important;
  font-size: inherit !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
}

body > .n30n-qd-modal .n30n-qd-detail-store-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
  align-items: stretch !important;
}

body > .n30n-qd-modal .n30n-qd-store-compare.store-count-2 .n30n-qd-detail-store-grid,
body > .n30n-qd-modal .n30n-qd-store-compare.store-count-4 .n30n-qd-detail-store-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body > .n30n-qd-modal .n30n-qd-store-compare.store-count-3 .n30n-qd-detail-store-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body > .n30n-qd-modal .n30n-qd-detail-store-card {
  min-width: 0 !important;
  min-height: 100% !important;
  display: grid !important;
  grid-template-rows: auto minmax(88px, auto) 40px 36px !important;
  gap: 9px !important;
  padding: 12px !important;
  border: 1px solid rgba(0, 229, 255, .38) !important;
  border-radius: 10px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(0, 229, 255, .11), transparent 50%),
    rgba(4, 9, 28, .76) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .025), 0 0 22px rgba(0, 229, 255, .08) !important;
}

body > .n30n-qd-modal .n30n-qd-detail-store-card.is-meta {
  border-color: rgba(255, 43, 214, .48) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 43, 214, .13), transparent 52%),
    rgba(18, 5, 31, .76) !important;
}

body > .n30n-qd-modal .n30n-qd-detail-store-card > header {
  min-width: 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

body > .n30n-qd-modal .n30n-qd-detail-store-card > header b {
  color: #eafcff !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

body > .n30n-qd-modal .n30n-qd-detail-store-card > header span {
  max-width: 48% !important;
  color: #aeb9d8 !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
  text-align: right !important;
}

body > .n30n-qd-modal .n30n-qd-detail-store-price {
  min-height: 88px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(0, 229, 255, .36) !important;
  border-radius: 9px !important;
  background: linear-gradient(180deg, rgba(0, 229, 255, .10), rgba(1, 26, 49, .58)) !important;
  text-align: center !important;
}

body > .n30n-qd-modal .n30n-qd-detail-store-card.is-meta .n30n-qd-detail-store-price {
  border-color: rgba(255, 43, 214, .52) !important;
  background: linear-gradient(180deg, rgba(255, 43, 214, .14), rgba(47, 7, 58, .58)) !important;
}

body > .n30n-qd-modal .n30n-qd-detail-store-price strong {
  color: #ff3fae !important;
  font-size: clamp(20px, 3vw, 30px) !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
  text-shadow: 0 0 12px rgba(255, 43, 214, .28) !important;
}

body > .n30n-qd-modal .n30n-qd-detail-store-card.is-steam .n30n-qd-detail-store-price strong {
  color: #64f4ff !important;
  text-shadow: 0 0 12px rgba(0, 229, 255, .25) !important;
}

body > .n30n-qd-modal .n30n-qd-detail-store-price del,
body > .n30n-qd-modal .n30n-qd-detail-store-price small {
  color: #aeb9d8 !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
}

body > .n30n-qd-modal .n30n-qd-detail-kv-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 0 !important;
}

body > .n30n-qd-modal .n30n-qd-detail-kv {
  min-width: 0 !important;
  margin: 0 !important;
}

body > .n30n-qd-modal .n30n-qd-detail-kv dt {
  margin: 0 0 3px !important;
  color: #00e5ff !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

body > .n30n-qd-modal .n30n-qd-detail-kv dd {
  margin: 0 !important;
  color: #dbe6ff !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  overflow-wrap: anywhere !important;
}

body > .n30n-qd-modal .n30n-qd-platform-facts-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

body > .n30n-qd-modal .n30n-qd-info-section.is-single-store .n30n-qd-platform-facts-grid {
  grid-template-columns: 1fr !important;
}

body > .n30n-qd-modal .n30n-qd-info-section.is-single-store {
  grid-column: 1 / -1 !important;
}

body > .n30n-qd-modal .n30n-qd-info-section.is-single-store .n30n-qd-platform-facts {
  width: 100% !important;
}

body > .n30n-qd-modal .n30n-qd-info-section.is-single-store .n30n-qd-detail-kv-grid {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) !important;
  gap: 10px 12px !important;
}

body > .n30n-qd-modal .n30n-qd-info-section.is-single-store .n30n-qd-platform-facts {
  padding: 12px !important;
}

body > .n30n-qd-modal .n30n-qd-info-section.is-single-store .n30n-qd-detail-kv {
  min-height: 54px !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(0, 229, 255, .14) !important;
  border-radius: 8px !important;
  background: rgba(0, 229, 255, .035) !important;
}

body > .n30n-qd-modal .n30n-qd-platform-facts {
  min-width: 0 !important;
  padding: 10px !important;
  border: 1px solid rgba(0, 229, 255, .22) !important;
  border-radius: 8px !important;
  background: rgba(2, 10, 28, .46) !important;
}

body > .n30n-qd-modal .n30n-qd-platform-facts > b {
  display: block !important;
  margin: 0 0 8px !important;
  color: #eafcff !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

body > .n30n-qd-modal .n30n-qd-detail-store-button,
body > .n30n-qd-modal .n30n-qd-detail-addon-pill {
  width: 100% !important;
  min-height: 36px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  border-radius: 8px !important;
  text-align: center !important;
}

body > .n30n-qd-modal .n30n-qd-detail-store-button.is-disabled {
  opacity: .55 !important;
  pointer-events: none !important;
}

body > .n30n-qd-modal .n30n-qd-detail-addon-pill {
  border: 1px solid rgba(0, 229, 255, .42) !important;
  background: rgba(0, 229, 255, .08) !important;
  color: #efffff !important;
  cursor: pointer !important;
  font: inherit !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  line-height: 1.1 !important;
}

body > .n30n-qd-modal .n30n-qd-detail-addon-pill.is-disabled {
  cursor: default !important;
  opacity: .55 !important;
}

body > .n30n-qd-modal .n30n-qd-detail-itemstore-link {
  border-color: rgba(255, 220, 120, .58) !important;
  background:
    linear-gradient(180deg, rgba(255, 220, 120, .16), rgba(8, 18, 36, .84)) !important;
  color: #fff2b0 !important;
}

body > .n30n-qd-modal .n30n-qd-detail-itemstore-link:hover,
body > .n30n-qd-modal .n30n-qd-detail-itemstore-link:focus-visible {
  border-color: rgba(255, 220, 120, .86) !important;
  box-shadow: 0 0 18px rgba(255, 220, 120, .20) !important;
}

body > .n30n-qd-modal .n30n-qd-detail-pill-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  margin-top: 10px !important;
}

body > .n30n-qd-modal .n30n-qd-language-groups {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

body > .n30n-qd-modal .n30n-qd-language-groups > div {
  min-width: 0 !important;
}

body > .n30n-qd-modal .n30n-qd-language-groups > div > b {
  display: block !important;
  margin: 0 0 2px !important;
  color: #00e5ff !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

body > .n30n-qd-modal .n30n-qd-language-history-row {
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr) !important;
  gap: 14px !important;
  align-items: stretch !important;
}

body > .n30n-qd-modal .n30n-qd-language-history-row > .n30n-qd-detail-box {
  height: 100% !important;
}

body > .n30n-qd-modal .n30n-qd-history-stack {
  min-width: 0 !important;
  display: grid !important;
  gap: 14px !important;
}

body > .n30n-qd-modal .n30n-qd-history-stack-parallel {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body > .n30n-qd-modal .n30n-qd-history-stack-parallel .n30n-qd-history-chart {
  min-height: 130px !important;
}

body > .n30n-qd-modal .n30n-qd-price-history-area.is-single-history .n30n-qd-history-stack {
  grid-template-columns: 1fr !important;
}

body > .n30n-qd-modal .n30n-qd-price-history-area.is-single-history .n30n-qd-history-chart {
  min-height: 150px !important;
}

body > .n30n-qd-modal .n30n-qd-history-stack > .n30n-qd-history-section {
  grid-column: auto !important;
}

body > .n30n-qd-modal .n30n-qd-detail-pill-row span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 28px !important;
  padding: 5px 10px !important;
  border: 1px solid rgba(138, 77, 255, .62) !important;
  border-radius: 999px !important;
  background: rgba(138, 77, 255, .14) !important;
  color: #e9ddff !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
}

body > .n30n-qd-modal .n30n-qd-capability-section .n30n-qd-chips {
  margin-top: 10px !important;
}

body > .n30n-qd-modal .n30n-qd-media-group {
  display: grid !important;
  gap: 9px !important;
  margin-top: 10px !important;
  padding: 10px !important;
  border: 1px solid rgba(0, 229, 255, .28) !important;
  border-radius: 9px !important;
  background:
    linear-gradient(135deg, rgba(0, 229, 255, .055), rgba(255, 43, 214, .035)),
    rgba(2, 10, 28, .54) !important;
}

body > .n30n-qd-modal .n30n-qd-media-group[hidden],
body > .n30n-qd-modal .n30n-qd-gallery-more[hidden] {
  display: none !important;
}

body > .n30n-qd-modal .n30n-qd-media-group-steam {
  border-color: rgba(100, 244, 255, .34) !important;
  background:
    linear-gradient(135deg, rgba(0, 229, 255, .075), rgba(65, 105, 225, .055)),
    rgba(2, 10, 28, .54) !important;
}

body > .n30n-qd-modal .n30n-qd-media-group-head {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

body > .n30n-qd-modal .n30n-qd-media-group-head b {
  margin: 0 !important;
  color: #00e5ff !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

body > .n30n-qd-modal .n30n-qd-media-group-head span {
  color: #e9ddff !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  text-align: right !important;
}

body > .n30n-qd-modal .n30n-qd-gallery-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  min-width: 0 !important;
  padding: 4px 0 2px !important;
}

body > .n30n-qd-modal .n30n-qd-gallery-shot {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  aspect-ratio: 16 / 9 !important;
  padding: 0 !important;
  border: 1px solid rgba(0, 229, 255, .45) !important;
  border-radius: 8px !important;
  background: rgba(2, 10, 28, .82) !important;
  overflow: hidden !important;
  cursor: zoom-in !important;
}

body > .n30n-qd-modal .n30n-qd-gallery-shot[hidden] {
  display: none !important;
}

body > .n30n-qd-modal .n30n-qd-gallery-shot img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  object-fit: cover !important;
  border: 0 !important;
  border-radius: 0 !important;
}

body > .n30n-qd-modal .n30n-qd-mini-rail {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body > .n30n-qd-modal .n30n-qd-mini-child {
  min-width: 0 !important;
  border: 1px solid rgba(0, 229, 255, .35) !important;
  border-radius: 8px !important;
  background: rgba(7, 12, 34, .82) !important;
  overflow: hidden !important;
}

body > .n30n-qd-modal .n30n-qd-mini-child button,
body > .n30n-qd-modal .n30n-qd-mini-child > a,
body > .n30n-qd-modal .n30n-qd-itemstore-card > span {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  background: rgba(2, 10, 28, .88) !important;
  cursor: pointer !important;
  text-decoration: none !important;
}

body > .n30n-qd-modal .n30n-qd-mini-child img,
body > .n30n-qd-modal .n30n-qd-mini-placeholder {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  object-fit: cover !important;
  background: linear-gradient(135deg, rgba(0, 229, 255, .12), rgba(255, 43, 214, .08)) !important;
}

body > .n30n-qd-modal .n30n-qd-mini-placeholder[hidden] {
  display: none !important;
}

body > .n30n-qd-modal .n30n-qd-mini-child.is-fallback-cover img {
  filter: saturate(.82) brightness(.72) contrast(1.05) !important;
  opacity: .88 !important;
}

body > .n30n-qd-modal .n30n-qd-mini-child.is-fallback-cover button::after,
body > .n30n-qd-modal .n30n-qd-mini-child.is-fallback-cover > a::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(2, 10, 28, .10), rgba(2, 10, 28, .72)),
    linear-gradient(135deg, rgba(0, 229, 255, .10), rgba(255, 43, 214, .12)) !important;
}

body > .n30n-qd-modal .n30n-qd-mini-cover-fallback {
  position: absolute !important;
  left: 7px !important;
  bottom: 7px !important;
  z-index: 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  max-width: calc(100% - 14px) !important;
  min-height: 19px !important;
  padding: 2px 7px !important;
  border: 1px solid rgba(0, 229, 255, .45) !important;
  border-radius: 999px !important;
  background: rgba(2, 10, 28, .78) !important;
  color: #dffaff !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
  text-transform: uppercase !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body > .n30n-qd-modal .n30n-qd-mini-child strong,
body > .n30n-qd-modal .n30n-qd-mini-child small,
body > .n30n-qd-modal .n30n-qd-mini-child b {
  display: block !important;
  padding: 4px 7px 0 !important;
}

body > .n30n-qd-modal .n30n-qd-mini-child strong {
  color: #f3fbff !important;
  font-size: 12px !important;
  line-height: 1.22 !important;
}

body > .n30n-qd-modal .n30n-qd-mini-child small {
  color: #b9c1d9 !important;
  font-size: 10px !important;
}

body > .n30n-qd-modal .n30n-qd-mini-child .n30n-qd-mini-child-flags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  padding: 5px 7px 0 !important;
}

body > .n30n-qd-modal .n30n-qd-mini-child .n30n-qd-mini-child-flags span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 18px !important;
  padding: 2px 6px !important;
  border: 1px solid rgba(255, 220, 120, .34) !important;
  border-radius: 999px !important;
  background: rgba(255, 220, 120, .08) !important;
  color: #ffeaa0 !important;
  font-size: 9px !important;
  font-style: normal !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
}

body > .n30n-qd-modal .n30n-qd-mini-child .n30n-qd-mini-child-parent {
  display: block !important;
  padding: 4px 7px 0 !important;
  color: #8df7ff !important;
  font-size: 10px !important;
  font-style: normal !important;
  line-height: 1.2 !important;
}

body > .n30n-qd-modal .n30n-qd-mini-child b {
  color: #00e5ff !important;
  font-size: 12px !important;
  padding-bottom: 7px !important;
}

body > .n30n-qd-modal .n30n-qd-itemstore-section {
  border-color: rgba(255, 220, 120, .28) !important;
}

body > .n30n-qd-modal .n30n-qd-itemstore-card {
  border-color: rgba(255, 220, 120, .36) !important;
}

body > .n30n-qd-modal .n30n-qd-itemstore-card small {
  color: #ffeaa0 !important;
}

body > .n30n-qd-modal .n30n-qd-itemstore-button {
  margin-top: 12px !important;
  width: min(360px, 100%) !important;
}

body > .n30n-qd-modal .n30n-qd-trailer-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body > .n30n-qd-modal .n30n-qd-trailer-grid video {
  width: 100% !important;
  min-width: 0 !important;
  aspect-ratio: 16 / 9 !important;
  border: 1px solid rgba(0, 229, 255, .34) !important;
  border-radius: 8px !important;
  background: #010718 !important;
}

body > .n30n-qd-modal .n30n-qd-history-section {
  display: grid !important;
  gap: 9px !important;
}

body > .n30n-qd-modal .n30n-qd-history-chart {
  min-width: 0 !important;
  padding: 8px !important;
  overflow: hidden !important;
  border: 1px solid rgba(0, 229, 255, .28) !important;
  border-radius: 9px !important;
  background:
    linear-gradient(180deg, rgba(0, 229, 255, .08), rgba(255, 43, 214, .05)),
    rgba(2, 10, 28, .72) !important;
}

body > .n30n-qd-modal .n30n-qd-history-chart svg {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  overflow: visible !important;
}

body > .n30n-qd-modal .n30n-qd-history-flat {
  display: grid !important;
  gap: 6px !important;
  padding: 12px !important;
  border: 1px solid rgba(0, 229, 255, .24) !important;
  border-radius: 9px !important;
  background:
    linear-gradient(135deg, rgba(0, 229, 255, .08), rgba(255, 43, 214, .06)),
    rgba(2, 10, 28, .72) !important;
}

body > .n30n-qd-modal .n30n-qd-history-flat strong {
  color: #eafcff !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
}

body > .n30n-qd-modal .n30n-qd-history-flat span {
  color: #aeb9d8 !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
}

body > .n30n-qd-modal .n30n-qd-history-gridline {
  stroke: rgba(185, 196, 223, .18) !important;
  stroke-width: 1 !important;
}

body > .n30n-qd-modal .n30n-qd-history-area {
  fill: rgba(255, 43, 214, .13) !important;
}

body > .n30n-qd-modal .n30n-qd-history-line {
  fill: none !important;
  stroke: #00e5ff !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  stroke-width: 3.5 !important;
  filter: drop-shadow(0 0 7px rgba(0, 229, 255, .42)) !important;
}

body > .n30n-qd-modal .n30n-qd-history-point {
  fill: #ff3fae !important;
  stroke: #eafcff !important;
  stroke-width: 2 !important;
  cursor: help !important;
  filter: drop-shadow(0 0 6px rgba(255, 43, 214, .45)) !important;
}

body > .n30n-qd-modal .n30n-qd-history-hitpoint {
  fill: transparent !important;
  stroke: transparent !important;
  cursor: help !important;
  pointer-events: all !important;
}

body > .n30n-qd-modal .n30n-qd-history-hitpoint:hover + .n30n-qd-history-point,
body > .n30n-qd-modal .n30n-qd-history-point:hover {
  fill: #ffffff !important;
  stroke: #ff3fae !important;
}

body > .n30n-qd-modal .n30n-qd-history-axis-labels {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  color: #aeb9d8 !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
}

body > .n30n-qd-modal .n30n-qd-history-axis-labels strong {
  color: #eafcff !important;
  font-weight: 950 !important;
  text-align: center !important;
}

body > .n30n-qd-modal .n30n-qd-recommendation-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body > .n30n-qd-modal .n30n-qd-recommendation-card {
  min-width: 0 !important;
  display: grid !important;
  grid-template-rows: 104px 1fr !important;
  overflow: hidden !important;
  border: 1px solid rgba(0, 229, 255, .34) !important;
  border-radius: 9px !important;
  background: rgba(3, 9, 27, .78) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .025) !important;
}

body > .n30n-qd-modal .n30n-qd-recommendation-card > button {
  width: 100% !important;
  min-width: 0 !important;
  height: 104px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: rgba(0, 229, 255, .07) !important;
  cursor: pointer !important;
}

body > .n30n-qd-modal .n30n-qd-recommendation-card img,
body > .n30n-qd-modal .n30n-qd-recommendation-placeholder {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
}

body > .n30n-qd-modal .n30n-qd-recommendation-placeholder {
  background: linear-gradient(135deg, rgba(0, 229, 255, .14), rgba(255, 43, 214, .12)) !important;
}

body > .n30n-qd-modal .n30n-qd-recommendation-body {
  min-width: 0 !important;
  display: grid !important;
  gap: 5px !important;
  align-content: start !important;
  padding: 10px !important;
}

body > .n30n-qd-modal .n30n-qd-recommendation-body strong {
  color: #eafcff !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  line-height: 1.15 !important;
  overflow-wrap: anywhere !important;
}

body > .n30n-qd-modal .n30n-qd-recommendation-body small,
body > .n30n-qd-modal .n30n-qd-recommendation-body p {
  margin: 0 !important;
  color: #aeb9d8 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
}

body > .n30n-qd-modal .n30n-qd-recommendation-body .n30n-qd-detail-pill-row {
  margin-top: 2px !important;
}

body > .n30n-qd-modal .n30n-qd-recommendation-body .n30n-qd-detail-pill-row span {
  min-height: 23px !important;
  padding: 4px 8px !important;
  font-size: 10px !important;
}

@media (max-width: 900px) {
  body > .n30n-qd-modal .n30n-qd-store-compare.store-count-2 .n30n-qd-detail-store-grid,
  body > .n30n-qd-modal .n30n-qd-store-compare.store-count-3 .n30n-qd-detail-store-grid,
  body > .n30n-qd-modal .n30n-qd-store-compare.store-count-4 .n30n-qd-detail-store-grid,
  body > .n30n-qd-modal .n30n-qd-language-groups,
  body > .n30n-qd-modal .n30n-qd-language-history-row,
  body > .n30n-qd-modal .n30n-qd-history-stack-parallel,
  body > .n30n-qd-modal .n30n-qd-platform-facts-grid,
  body > .n30n-qd-modal .n30n-qd-detail-kv-grid,
  body > .n30n-qd-modal .n30n-qd-creator-funnel {
    grid-template-columns: 1fr !important;
  }

  body > .n30n-qd-modal .n30n-qd-funnel-steam-card {
    grid-template-columns: 1fr !important;
    align-items: stretch !important;
  }

  body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-video-card {
    grid-template-columns: 1fr !important;
  }

  body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-video-thumb,
  body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-copy {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  body > .n30n-qd-modal .n30n-qd-detail-hub-nav {
    flex-wrap: wrap !important;
  }

  body > .n30n-qd-modal .n30n-qd-detail-hub-nav button {
    flex: 1 1 33.333% !important;
    border-bottom: 1px solid rgba(0, 229, 255, .18) !important;
  }

  body > .n30n-qd-modal .n30n-qd-recommendation-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 520px) {
  body > .n30n-qd-modal .n30n-qd-funnel-video-card {
    grid-template-columns: 1fr !important;
  }

  body > .n30n-qd-modal .n30n-qd-detail-hub-nav button {
    flex: 1 1 30% !important;
  }

  body > .n30n-qd-modal .n30n-qd-recommendation-grid {
    grid-template-columns: 1fr !important;
  }
}

/* v0.12.6: E-layout pass for the detail modal. */
body > .n30n-qd-modal .n30n-qd-modal-panel {
  width: min(1090px, calc(100vw - 32px)) !important;
  max-width: 1090px !important;
  padding: 16px 18px 20px !important;
  border-color: rgba(0, 229, 255, .48) !important;
  border-radius: 13px !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(0, 229, 255, .16), transparent 32%),
    radial-gradient(circle at 84% 16%, rgba(255, 43, 214, .12), transparent 34%),
    linear-gradient(180deg, rgba(5, 13, 35, .98), rgba(3, 6, 22, .985)) !important;
  box-shadow:
    0 24px 90px rgba(0, 0, 0, .74),
    0 0 0 1px rgba(255, 255, 255, .035) inset,
    0 0 34px rgba(0, 229, 255, .18),
    0 0 24px rgba(255, 43, 214, .12) !important;
}

body > .n30n-qd-modal .n30n-qd-modal-toolbar {
  min-height: 43px !important;
  margin-bottom: 12px !important;
  padding: 6px 8px !important;
  border-color: rgba(0, 229, 255, .34) !important;
  background: rgba(3, 12, 32, .72) !important;
}

body > .n30n-qd-modal .n30n-qd-modal-toolbar .n30n-qd-modal-arrow,
body > .n30n-qd-modal .n30n-qd-modal-toolbar .n30n-qd-modal-close {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
}

body > .n30n-qd-modal .n30n-qd-modal-toolbar-actions > button:not(.n30n-qd-modal-arrow):not(.n30n-qd-modal-close) {
  transform: translateY(3px) !important;
}

body > .n30n-qd-modal .n30n-qd-detail {
  gap: 12px !important;
}

body > .n30n-qd-modal .n30n-qd-detail-overview {
  grid-template-columns: minmax(260px, 330px) minmax(0, 1fr) !important;
  gap: 22px !important;
  align-items: start !important;
  padding: 0 2px 2px !important;
}

body > .n30n-qd-modal .n30n-qd-detail-hero {
  aspect-ratio: 4 / 3 !important;
  border-color: rgba(0, 229, 255, .48) !important;
  border-radius: 8px !important;
  box-shadow: 0 18px 46px rgba(0, 0, 0, .48), 0 0 28px rgba(0, 229, 255, .14) !important;
}

body > .n30n-qd-modal .n30n-qd-detail-summary {
  gap: 10px !important;
  align-content: start !important;
}

body > .n30n-qd-modal .n30n-qd-detail h2 {
  font-size: clamp(30px, 3.1vw, 42px) !important;
}

body > .n30n-qd-modal .n30n-qd-detail-summary .n30n-qd-description-box {
  padding: 12px 13px !important;
  border-color: rgba(0, 229, 255, .36) !important;
  background: rgba(3, 11, 31, .62) !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only {
  grid-template-columns: minmax(190px, .36fr) minmax(0, .64fr) !important;
  gap: 10px !important;
  align-items: stretch !important;
  padding: 10px !important;
  border-color: rgba(0, 229, 255, .46) !important;
  border-radius: 9px !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(0, 229, 255, .14), transparent 42%),
    radial-gradient(circle at 92% 0%, rgba(255, 43, 214, .10), transparent 38%),
    rgba(3, 11, 31, .76) !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-head {
  grid-column: 1 !important;
  align-content: center !important;
  gap: 5px !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(0, 229, 255, .22) !important;
  border-radius: 8px !important;
  background: rgba(0, 229, 255, .045) !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-head b {
  font-size: 17px !important;
  line-height: 1.08 !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-head span {
  font-size: 11px !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-video-card {
  grid-column: 2 !important;
  grid-row: 1 !important;
  grid-template-columns: minmax(170px, 245px) minmax(0, 1fr) !important;
  gap: 11px !important;
  padding: 8px !important;
  border-color: rgba(255, 43, 214, .42) !important;
  background:
    linear-gradient(135deg, rgba(255, 43, 214, .08), rgba(0, 229, 255, .06)),
    rgba(4, 9, 28, .78) !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-video-thumb {
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: center !important;
  border-radius: 7px !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-copy {
  grid-column: 2 !important;
  grid-row: 1 !important;
  gap: 7px !important;
  align-content: center !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-video-title strong {
  font-size: 15px !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-copy p {
  display: -webkit-box !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  font-size: 11px !important;
  line-height: 1.32 !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-video-button {
  min-height: 34px !important;
  font-size: 11px !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-steam-card {
  grid-column: 1 / -1 !important;
  margin-top: 0 !important;
}

body > .n30n-qd-modal .n30n-qd-detail-hub-nav {
  border-color: rgba(0, 229, 255, .36) !important;
  background: rgba(4, 10, 29, .74) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .025), 0 0 16px rgba(0, 229, 255, .08) !important;
}

body > .n30n-qd-modal .n30n-qd-detail-hub-nav button {
  min-height: 38px !important;
  padding: 7px 9px !important;
  color: #dbe6ff !important;
}

body > .n30n-qd-modal .n30n-qd-detail-hub-nav button:first-child {
  background: rgba(255, 43, 214, .20) !important;
  box-shadow: inset 0 -2px 0 rgba(255, 43, 214, .82) !important;
}

body > .n30n-qd-modal .n30n-qd-detail-box,
body > .n30n-qd-modal .n30n-qd-detail-grid section {
  border-color: rgba(0, 229, 255, .30) !important;
  background: rgba(4, 9, 28, .68) !important;
}

@media (max-width: 900px) {
  body > .n30n-qd-modal .n30n-qd-modal-panel {
    width: 100% !important;
    max-width: calc(100dvw - 20px) !important;
    padding: 10px 9px 16px !important;
  }

  body > .n30n-qd-modal .n30n-qd-detail-overview {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  body > .n30n-qd-modal .n30n-qd-detail-hero {
    aspect-ratio: 16 / 10 !important;
  }

  body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only,
  body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-video-card {
    grid-template-columns: 1fr !important;
  }

  body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-head,
  body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-video-card,
  body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-video-thumb,
  body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-copy {
    grid-column: 1 !important;
    grid-row: auto !important;
  }
}

@media (max-width: 520px) {
  body > .n30n-qd-modal .n30n-qd-detail h2 {
    font-size: 28px !important;
  }

  body > .n30n-qd-modal .n30n-qd-detail-hub-nav button {
    flex-basis: 50% !important;
  }
}

/* v0.12.7: N30N media/detail pass. */
body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only {
  position: relative !important;
  overflow: hidden !important;
  border-color: rgba(255, 43, 214, .48) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 229, 255, .08),
    0 0 22px rgba(0, 229, 255, .10),
    0 0 18px rgba(255, 43, 214, .10) !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 4px !important;
  background: linear-gradient(180deg, #00e5ff, #ff2bd6, #00e5ff) !important;
  box-shadow: 0 0 18px rgba(0, 229, 255, .55), 0 0 18px rgba(255, 43, 214, .42) !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-head {
  background:
    linear-gradient(135deg, rgba(0, 229, 255, .105), rgba(255, 43, 214, .055)),
    rgba(3, 11, 31, .72) !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-head b {
  color: #eafcff !important;
  text-shadow: 0 0 10px rgba(0, 229, 255, .44), 0 0 14px rgba(255, 43, 214, .24) !important;
}

body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-video-card {
  border-color: rgba(255, 43, 214, .54) !important;
  box-shadow: inset 0 0 0 1px rgba(0, 229, 255, .07), 0 0 20px rgba(255, 43, 214, .10) !important;
}

body > .n30n-qd-modal .n30n-qd-funnel-video-title span {
  background: linear-gradient(135deg, #ff2bd6, #8a4dff) !important;
  box-shadow: 0 0 10px rgba(255, 43, 214, .32) !important;
}

body > .n30n-qd-modal .n30n-qd-trailer-section,
body > .n30n-qd-modal .n30n-qd-gallery-section {
  border-color: rgba(0, 229, 255, .38) !important;
}

@media (max-width: 700px) {
  body > .n30n-qd-modal .n30n-qd-trailer-grid {
    grid-template-columns: 1fr !important;
  }

  body > .n30n-qd-modal .n30n-qd-gallery-grid,
  body > .n30n-qd-modal .n30n-qd-mini-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body > .n30n-qd-modal .n30n-qd-media-group-head {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 3px !important;
  }

  body > .n30n-qd-modal .n30n-qd-media-group-head span {
    text-align: left !important;
  }
}

/* v0.12.55: desktop detail modal must use the available viewport width. */
@media (min-width: 1000px) {
  body > .n30n-qd-modal {
    align-items: flex-start !important;
    justify-content: center !important;
    padding-left: 32px !important;
    padding-right: 32px !important;
  }

  body > .n30n-qd-modal .n30n-qd-modal-panel {
    width: min(1320px, calc(100vw - 96px)) !important;
    max-width: 1320px !important;
    min-width: min(1040px, calc(100vw - 96px)) !important;
    padding: 18px 20px 24px !important;
  }

  body > .n30n-qd-modal .n30n-qd-detail {
    width: 100% !important;
    max-width: none !important;
  }

  body > .n30n-qd-modal .n30n-qd-detail-overview {
    grid-template-columns: minmax(300px, 370px) minmax(0, 1fr) !important;
    gap: 24px !important;
  }

  body > .n30n-qd-modal .n30n-qd-detail-main {
    width: 100% !important;
    max-width: none !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }

  body > .n30n-qd-modal .n30n-qd-detail-main > * {
    grid-column: 1 / -1 !important;
  }

  body > .n30n-qd-modal .n30n-qd-language-history-row {
    grid-column: 1 / -1 !important;
  }

  body > .n30n-qd-modal .n30n-qd-info-section,
  body > .n30n-qd-modal .n30n-qd-capability-section,
  body > .n30n-qd-modal .n30n-qd-language-section,
  body > .n30n-qd-modal .n30n-qd-history-section {
    grid-column: span 6 !important;
  }

  body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only {
    grid-template-columns: minmax(230px, .32fr) minmax(0, .68fr) !important;
  }

  body > .n30n-qd-modal .n30n-qd-creator-funnel.is-video-only .n30n-qd-funnel-video-card {
    grid-template-columns: minmax(220px, 320px) minmax(0, 1fr) !important;
  }

  body > .n30n-qd-modal .n30n-qd-gallery-grid,
  body > .n30n-qd-modal .n30n-qd-mini-rail,
  body > .n30n-qd-modal .n30n-qd-recommendation-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }

  body > .n30n-qd-modal .n30n-qd-trailer-grid {
    grid-template-columns: minmax(0, .58fr) minmax(0, .42fr) !important;
  }
}

/* v0.12.55: Steam package rows without artwork should look intentional, not broken. */
body > .n30n-qd-modal .n30n-qd-rail-box[data-detail-section="steam-children"] .n30n-qd-mini-child {
  min-height: 132px !important;
}

body > .n30n-qd-modal .n30n-qd-rail-box[data-detail-section="steam-children"] .n30n-qd-mini-placeholder {
  aspect-ratio: auto !important;
  height: 42px !important;
  min-height: 42px !important;
  background:
    linear-gradient(90deg, rgba(0, 229, 255, .24), rgba(255, 43, 214, .16)),
    rgba(2, 10, 28, .82) !important;
}

/* v0.12.92: keep price history layout deterministic and separate from language blocks. */
body > .n30n-qd-modal .n30n-qd-price-history-area {
  min-width: 0 !important;
}

body > .n30n-qd-modal .n30n-qd-price-history-area.is-match-history {
  grid-column: 1 / -1 !important;
}

body > .n30n-qd-modal .n30n-qd-price-history-area.is-match-history .n30n-qd-history-stack-parallel {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  align-items: stretch !important;
}

body > .n30n-qd-modal .n30n-qd-price-history-area .n30n-qd-history-section,
body > .n30n-qd-modal .n30n-qd-language-history-row .n30n-qd-price-history-area,
body > .n30n-qd-modal .n30n-qd-language-history-row .n30n-qd-history-section {
  grid-column: auto !important;
  width: 100% !important;
}

body > .n30n-qd-modal .n30n-qd-language-history-row.is-single-history {
  grid-column: 1 / -1 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(340px, .9fr) !important;
  gap: 14px !important;
  align-items: stretch !important;
}

body > .n30n-qd-modal .n30n-qd-history-section .n30n-qd-muted-note {
  display: none !important;
}

/* v0.12.161: make single-store data, histories and child rails easier to scan. */
body > .n30n-qd-modal .n30n-qd-info-section .n30n-qd-platform-facts-grid {
  align-items: start !important;
}

body > .n30n-qd-modal .n30n-qd-info-section .n30n-qd-platform-facts {
  display: grid !important;
  align-content: start !important;
  min-height: 0 !important;
}

body > .n30n-qd-modal .n30n-qd-info-section .n30n-qd-platform-facts.is-meta-facts {
  border-color: rgba(255, 43, 214, .30) !important;
  background:
    linear-gradient(135deg, rgba(255, 43, 214, .075), rgba(0, 229, 255, .028)),
    rgba(2, 10, 28, .48) !important;
}

body > .n30n-qd-modal .n30n-qd-info-section .n30n-qd-platform-facts.is-steam-facts {
  border-color: rgba(0, 229, 255, .34) !important;
  background:
    linear-gradient(135deg, rgba(0, 229, 255, .075), rgba(255, 43, 214, .026)),
    rgba(2, 10, 28, .48) !important;
}

body > .n30n-qd-modal .n30n-qd-info-section.is-single-store .n30n-qd-detail-kv-grid {
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)) !important;
  gap: 8px !important;
}

body > .n30n-qd-modal .n30n-qd-info-section.is-single-store .n30n-qd-detail-kv {
  min-height: 42px !important;
  padding: 7px 8px !important;
}

body > .n30n-qd-modal .n30n-qd-history-section[data-history-source="meta"] {
  border-color: rgba(255, 43, 214, .34) !important;
}

body > .n30n-qd-modal .n30n-qd-history-section[data-history-source="steam"] {
  border-color: rgba(0, 229, 255, .38) !important;
}

body > .n30n-qd-modal .n30n-qd-rail-box.is-meta-rail {
  border-color: rgba(255, 43, 214, .28) !important;
}

body > .n30n-qd-modal .n30n-qd-rail-box.is-steam-rail {
  border-color: rgba(0, 229, 255, .34) !important;
}

@media (max-width: 900px) {
  body > .n30n-qd-modal .n30n-qd-price-history-area.is-match-history .n30n-qd-history-stack-parallel,
  body > .n30n-qd-modal .n30n-qd-language-history-row.is-single-history,
  body > .n30n-qd-modal .n30n-qd-info-section.is-single-store .n30n-qd-detail-kv-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 560px) {
  body > .n30n-qd-modal .n30n-qd-info-section .n30n-qd-platform-facts {
    padding: 9px !important;
  }

  body > .n30n-qd-modal .n30n-qd-history-axis-labels {
    grid-template-columns: 1fr !important;
    gap: 4px !important;
    text-align: left !important;
  }

  body > .n30n-qd-modal .n30n-qd-history-axis-labels strong {
    text-align: left !important;
  }
}
