/* Theme V2 is opt-in. Every selector is scoped so Theme V1 remains unchanged. */
body[data-theme="v2"] {
  --v2-soft: color-mix(in srgb, var(--primary) 10%, var(--surface));
  --v2-panel: color-mix(in srgb, var(--surface) 88%, var(--background));
  --v2-line: color-mix(in srgb, var(--border) 74%, transparent);
  --v2-radius: 18px;
  background:
    radial-gradient(circle at 8% 18%, color-mix(in srgb, var(--primary) 8%, transparent), transparent 25rem),
    var(--background);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
body[data-theme="v2"] .site-header {
  top: 12px;
  width: min(1360px, calc(100% - 32px));
  margin: 12px auto 0;
  border: 1px solid var(--v2-line);
  border-radius: 999px;
  background: color-mix(in srgb, var(--header) 88%, transparent);
  box-shadow: 0 16px 44px color-mix(in srgb, var(--background) 72%, transparent);
  backdrop-filter: blur(18px);
}
body[data-theme="v2"] .header-inner {min-height: 62px; padding: 6px 14px 6px 22px;}
body[data-theme="v2"] .header-actions .button,
body[data-theme="v2"] .drawer-actions .button {border-radius: 999px;}
body[data-theme="v2"] .hero {
  margin-top: -86px;
  padding-top: 98px;
  border: 0;
  background:
    linear-gradient(125deg, color-mix(in srgb, var(--header) 96%, var(--background)), color-mix(in srgb, var(--primary) 18%, var(--background))),
    var(--background);
}
body[data-theme="v2"] .hero-inner {
  min-height: 520px !important;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .72fr);
  gap: 56px;
  padding: 72px 44px 30px !important;
}
body[data-theme="v2"] .hero-copy {max-width: 760px;}
body[data-theme="v2"] .eyebrow {
  display: inline-flex;
  margin-bottom: 20px;
  padding: 7px 12px;
  border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent);
  border-radius: 999px;
  color: var(--accent);
  font-size: 12px;
  letter-spacing: .15em;
  text-transform: uppercase;
}
body[data-theme="v2"] .hero-title {
  max-width: 850px;
  font-size: clamp(44px, 6vw, 82px);
  letter-spacing: -.045em;
  line-height: .96;
  text-wrap: balance;
}
body[data-theme="v2"] .hero-art {
  height: 380px !important;
  padding: 20px;
  border: 1px solid var(--v2-line);
  border-radius: 40% 60% 48% 52% / 58% 38% 62% 42%;
  background: color-mix(in srgb, var(--surface) 58%, transparent);
  mask-image: none;
  object-fit: contain;
}
body[data-theme="v2"] .hero-cta,
body[data-theme="v2"] .hero-secondary {border-radius: 999px;}
body[data-theme="v2"] main > article.container {
  width: min(1340px, calc(100% - 40px));
  margin: 30px auto 72px;
  padding: 44px 48px 52px !important;
  border: 1px solid var(--v2-line);
  border-radius: 28px;
  background: var(--v2-panel);
  box-shadow: 0 24px 70px color-mix(in srgb, var(--background) 68%, transparent);
}
body[data-theme="v2"] main > article.container > .rich-text,
body[data-theme="v2"] .article-section > .rich-text,
body[data-theme="v2"] .article-section > .article-list {max-width: 880px;}
body[data-theme="v2"] main > article.container > .rich-text {font-size: 17px;}
body[data-theme="v2"] .article-section > .rich-text p {max-width: 76ch;}
body[data-theme="v2"] h1 {font-size: clamp(34px, 4vw, 58px); letter-spacing: -.035em; text-transform: none;}
body[data-theme="v2"] h2 {letter-spacing: -.025em;}
body[data-theme="v2"] .article-section,
body[data-theme="v2"] .faq,
body[data-theme="v2"] .cta-section {margin-block: 48px;}
body[data-theme="v2"] .games {
  border: 1px solid var(--v2-line);
  border-radius: var(--v2-radius);
  background: var(--v2-soft);
}
body[data-theme="v2"] .poster {border-radius: 14px;}
body[data-theme="v2"] .faq details {border: 1px solid var(--v2-line); border-radius: 14px; background: var(--v2-soft);}
body[data-theme="v2"] footer {border-top: 1px solid var(--v2-line); background: color-mix(in srgb, var(--footer) 92%, var(--background));}

body[data-theme="v2"] .ranked-offers {
  width: min(1280px, calc(100% - 48px));
  margin: 42px auto;
  padding: clamp(26px, 4vw, 52px);
  border: 1px solid var(--v2-line);
  border-radius: 28px;
  background: linear-gradient(145deg, var(--v2-panel), color-mix(in srgb, var(--primary) 7%, var(--v2-panel)));
  box-shadow: 0 24px 70px color-mix(in srgb, var(--background) 68%, transparent);
}
body[data-theme="v2"] article.container .ranked-offers {width: 100%; margin: 38px 0 50px;}
body[data-theme="v2"] .ranked-offers-heading {display: grid; grid-template-columns: 1fr minmax(220px, .55fr); gap: 4px 32px; align-items: end; margin-bottom: 24px;}
body[data-theme="v2"] .ranked-offers-heading h2 {grid-row: 2; margin: 0; font-size: clamp(30px, 4vw, 48px);}
body[data-theme="v2"] .ranked-offers-heading > p:last-child {grid-column: 2; grid-row: 1 / span 2; color: var(--muted-text);}
body[data-theme="v2"] .ranked-offers-kicker {margin: 0; color: var(--accent); font-size: 12px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase;}
body[data-theme="v2"] .ranked-offers-list {display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; counter-reset: none;}
body[data-theme="v2"] .ranked-offers-more {display:flex;justify-content:center;margin:24px 0 0}
body[data-theme="v2"] .ranked-offer {
  display: grid;
  grid-template-columns: 74px minmax(230px, .9fr) minmax(280px, 1.25fr) auto minmax(170px, auto);
  align-items: center;
  gap: 24px;
  min-height: 142px;
  margin: 0;
  padding: 22px 24px;
  border: 1px solid var(--v2-line);
  border-radius: var(--v2-radius);
  background: color-mix(in srgb, var(--surface) 86%, transparent);
}
body[data-theme="v2"] .ranked-offer--featured {min-height: 176px; border-color: color-mix(in srgb, var(--accent) 64%, var(--v2-line)); border-width: 2px; background: linear-gradient(110deg,color-mix(in srgb,var(--accent) 13%,var(--surface)),color-mix(in srgb,var(--primary) 7%,var(--surface))); box-shadow: 0 18px 44px color-mix(in srgb,var(--primary) 14%,transparent);}
body[data-theme="v2"] .ranked-offer-rank-wrap {display: grid; justify-items: center; gap: 9px;}
body[data-theme="v2"] .ranked-offer-rank {display: grid; place-items: center; min-width: 54px; height: 54px; padding-inline: 8px; border-radius: 16px; background: var(--primary); color: var(--buttonText); font-size: 18px; font-weight: 900; box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--buttonText) 16%,transparent);}
body[data-theme="v2"] .ranked-offer--featured .ranked-offer-rank {background: linear-gradient(135deg,var(--accent),var(--primary)); transform: scale(1.08);}
body[data-theme="v2"] .ranked-offer-featured {color: var(--accent); font-size: 10px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase;}
body[data-theme="v2"] .ranked-offer-brand {display: grid; grid-template-columns: 112px 1fr; align-items: center; gap: 18px;}
body[data-theme="v2"] .ranked-offer-brand img {width: 112px; height: 74px; padding: 10px; border: 1px solid color-mix(in srgb,var(--text) 12%,transparent); border-radius: 15px; background: color-mix(in srgb, var(--text) 94%, transparent); object-fit: contain;}
body[data-theme="v2"] .ranked-offer--featured .ranked-offer-brand img {width: 126px; height: 84px;}
body[data-theme="v2"] .ranked-offer-brand h3,
body[data-theme="v2"] .ranked-offer-brand p,
body[data-theme="v2"] .ranked-offer-copy strong,
body[data-theme="v2"] .ranked-offer-rating {margin: 0;}
body[data-theme="v2"] .ranked-offer-brand h3 {font-size: 20px; line-height: 1.15;}
body[data-theme="v2"] .ranked-offer-brand p {color: var(--muted-text); font-size: 13px;}
body[data-theme="v2"] .ranked-offer-copy {display: grid; gap: 8px;}
body[data-theme="v2"] .ranked-offer-copy strong {font-size: clamp(18px, 1.8vw, 24px); line-height: 1.15; text-wrap: balance;}
body[data-theme="v2"] .ranked-offer-supporting {display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0; padding: 0; color: var(--muted-text); font-size: 13px; list-style: none;}
body[data-theme="v2"] .ranked-offer-supporting li {margin: 0;}
body[data-theme="v2"] .ranked-offer-supporting li::before {content: "✓"; margin-right: 6px; color: var(--accent); font-weight: 900;}
body[data-theme="v2"] .ranked-offer-rating {white-space: nowrap; color: var(--accent); font-size: 18px; font-weight: 800;}
body[data-theme="v2"] .ranked-offer-rating small {color: var(--muted-text); font-size: 12px;}
body[data-theme="v2"] .ranked-offer-actions {display: grid; gap: 8px; text-align: center;}
body[data-theme="v2"] .ranked-offer-primary {border-radius: 999px; white-space: nowrap;}
body[data-theme="v2"] .ranked-offer-details {color: var(--muted-text); font-size: 13px; text-decoration: underline; text-underline-offset: 3px;}
body[data-theme="v2"] .ranked-offers--compact .ranked-offer {grid-template-columns: 42px minmax(180px, 1fr) minmax(210px, 1.35fr) minmax(150px, auto); min-height: 92px;}
body[data-theme="v2"] .ranked-offers--compact .ranked-offer-supporting,
body[data-theme="v2"] .ranked-offers--compact .ranked-offer-rating {display: none;}
body[data-theme="v2"] .ranked-offers--promotion .ranked-offers-list {grid-template-columns: repeat(3, minmax(0, 1fr));}
body[data-theme="v2"] .ranked-offers--promotion .ranked-offer {grid-template-columns: 40px 1fr; align-content: start;}
body[data-theme="v2"] .ranked-offers--promotion .ranked-offer-brand,
body[data-theme="v2"] .ranked-offers--promotion .ranked-offer-copy,
body[data-theme="v2"] .ranked-offers--promotion .ranked-offer-actions {grid-column: 1 / -1;}
body[data-theme="v2"] .ranked-offers--promotion .ranked-offer-rating {grid-column: 2; grid-row: 1; justify-self: end;}

@media (max-width: 980px) {
  body[data-theme="v2"] .site-header {top: 8px; margin-top: 8px; border-radius: 24px;}
  body[data-theme="v2"] .hero {margin-top: -94px; padding-top: 104px;}
  body[data-theme="v2"] .hero-inner {min-height: 590px !important; grid-template-columns: 1fr; gap: 0; padding-inline: 28px !important;}
  body[data-theme="v2"] .hero-art {grid-row: 1; width: min(320px, 72vw) !important; height: 300px !important; justify-self: center;}
  body[data-theme="v2"] .hero-copy {margin-top: -20px; text-align: center;}
  body[data-theme="v2"] .ranked-offer,
  body[data-theme="v2"] .ranked-offers--compact .ranked-offer {grid-template-columns: 74px minmax(0, 1fr) minmax(145px, auto);}
  body[data-theme="v2"] .ranked-offer-copy,
  body[data-theme="v2"] .ranked-offer-rating {grid-column: 2;}
  body[data-theme="v2"] .ranked-offer-actions {grid-column: 3; grid-row: 1 / span 3;}
  body[data-theme="v2"] .ranked-offers--promotion .ranked-offers-list {grid-template-columns: 1fr 1fr;}
  body[data-theme="v2"] main > article.container {width: calc(100% - 32px); padding-inline: 30px !important;}
}
@media (max-width: 700px) {
  body[data-theme="v2"] .site-header {width: calc(100% - 20px);}
  body[data-theme="v2"] .hero-title {font-size: clamp(38px, 12vw, 58px);}
  body[data-theme="v2"] main > article.container {width: calc(100% - 24px); margin-block: 20px 40px; padding: 24px 18px !important; border-radius: 20px;}
  body[data-theme="v2"] .ranked-offers {width: calc(100% - 24px); margin-block: 24px; padding: 20px 12px; border-radius: 20px;}
  body[data-theme="v2"] .ranked-offers-heading {display: block; padding-inline: 6px;}
  body[data-theme="v2"] .ranked-offers-heading > p:last-child {margin-bottom: 0;}
  body[data-theme="v2"] .ranked-offer,
  body[data-theme="v2"] .ranked-offers--compact .ranked-offer,
  body[data-theme="v2"] .ranked-offers--promotion .ranked-offer {grid-template-columns: 62px minmax(0, 1fr); gap: 14px; min-height: 0; padding: 18px 16px;}
  body[data-theme="v2"] .ranked-offer--featured {padding-top: 22px;}
  body[data-theme="v2"] .ranked-offer-rank {min-width: 48px; height: 48px; border-radius: 14px;}
  body[data-theme="v2"] .ranked-offer-brand {grid-template-columns: 88px 1fr; gap: 12px;}
  body[data-theme="v2"] .ranked-offer-brand img,
  body[data-theme="v2"] .ranked-offer--featured .ranked-offer-brand img {width: 88px; height: 62px;}
  body[data-theme="v2"] .ranked-offer-copy,
  body[data-theme="v2"] .ranked-offer-actions {grid-column: 1 / -1;}
  body[data-theme="v2"] .ranked-offer-rating {grid-column: 2; grid-row: auto; justify-self: start;}
  body[data-theme="v2"] .ranked-offer-actions {display: grid; grid-template-columns: 1fr auto; align-items: center;}
  body[data-theme="v2"] .ranked-offer-actions {grid-row: auto;}
  body[data-theme="v2"] .ranked-offers--promotion .ranked-offers-list {grid-template-columns: 1fr;}
  body[data-theme="v2"] .ranked-offers--compact .ranked-offer-copy {display: grid;}
}
@media (max-width: 390px) {
  body[data-theme="v2"] .ranked-offers {padding: 18px 10px;}
  body[data-theme="v2"] .ranked-offer {grid-template-columns: 54px minmax(0,1fr); padding: 16px 13px;}
  body[data-theme="v2"] .ranked-offer-brand {grid-template-columns: 76px minmax(0,1fr);}
  body[data-theme="v2"] .ranked-offer-brand img,
  body[data-theme="v2"] .ranked-offer--featured .ranked-offer-brand img {width: 76px; height: 56px; padding: 7px;}
  body[data-theme="v2"] .ranked-offer-brand h3 {font-size: 18px;}
  body[data-theme="v2"] .ranked-offer-copy strong {font-size: 20px;}
  body[data-theme="v2"] .ranked-offer-actions {grid-template-columns: 1fr;}
  body[data-theme="v2"] .ranked-offer-primary {width: 100%;}
}

body[data-theme="v2"] .feature-list {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:32px 0;padding:0;list-style:none;}
body[data-theme="v2"] .feature-list li {margin:0;padding:22px;border:1px solid var(--v2-line);border-radius:var(--v2-radius);background:var(--v2-soft);font-weight:700;}
body[data-theme="v2"] .cta-section {padding:34px;border:1px solid color-mix(in srgb,var(--accent) 38%,var(--v2-line));border-radius:var(--v2-radius);background:linear-gradient(120deg,color-mix(in srgb,var(--primary) 12%,var(--surface)),var(--v2-soft));}
body[data-theme="v2"] .article-section {padding-top:10px;border-top:1px solid var(--v2-line);}
@media(max-width:700px){body[data-theme="v2"] .feature-list{grid-template-columns:1fr;}body[data-theme="v2"] .cta-section{padding:24px 20px;}}

body[data-theme="v2"] .games-list {grid-template-columns:repeat(2,minmax(0,1fr));}
body[data-theme="v2"] .game-card {grid-template-columns:minmax(180px,.8fr) minmax(220px,1.2fr);align-items:start;overflow:hidden;padding:0;}
body[data-theme="v2"] .game-card-art {display:block;}
body[data-theme="v2"] .game-card-art img {width:100%;height:auto;aspect-ratio:16/9;padding:0;border:0;border-radius:0;background:var(--surface);object-fit:cover;}
body[data-theme="v2"] .game-card-copy {align-self:center;padding:24px 24px 8px 0;}
body[data-theme="v2"] .game-card-copy h3 {margin:0;font-size:clamp(22px,2vw,30px);}
body[data-theme="v2"] .game-card-copy p {margin:.5rem 0;color:var(--muted-text);}
body[data-theme="v2"] .game-card-copy .game-provider {color:var(--accent);font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;}
body[data-theme="v2"] .game-card .ranked-offer-actions {grid-column:2;padding:0 24px 24px 0;text-align:left;}
body[data-theme="v2"] .game-card .ranked-offer-supporting li::before {content:"";margin:0;}
body[data-theme="v2"] .game-card .ranked-offer-supporting li {padding:4px 8px;border:1px solid var(--v2-line);border-radius:999px;}
@media(max-width:980px){body[data-theme="v2"] .games-list{grid-template-columns:1fr;}body[data-theme="v2"] .game-card .ranked-offer-actions{grid-column:2;grid-row:auto;padding-bottom:24px;}}
@media(max-width:600px){body[data-theme="v2"] .game-card{grid-template-columns:1fr;}body[data-theme="v2"] .game-card-art,body[data-theme="v2"] .game-card-copy,body[data-theme="v2"] .game-card .ranked-offer-actions{grid-column:1;}body[data-theme="v2"] .game-card-copy{padding:20px 18px 6px;}body[data-theme="v2"] .game-card .ranked-offer-actions{padding:0 18px 20px;}body[data-theme="v2"] .game-card .ranked-offer-primary{width:100%;}}