/* ===== Fonts: Feast of Flesh (from /assets/fonts/) ===== */
@font-face{
  font-family: "FeastOfFlesh";
  src: url("/assets/fonts/FEASFBIT.TTF") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: "FeastOfFlesh";
  src: url("/assets/fonts/FEASFBRG.TTF") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* =========================================================
   OV LEGEND — V2 THEME FOUNDATION
   Streamer (default) + RLOL Esports (body.rlol)
   Safe: lives only under /v2/
   ========================================================= */

/* --------- Brand Tokens --------- */
:root{
  /* Colors */
  --ov: #FF5600;        /* OV Orange */
  --rlol: #FF8A00;      /* RLOL Orange */
  --bg0: #050506;       /* darkest */
  --bg1: #0b0b0e;       /* base */
  --panel: rgba(22, 22, 26, 0.78);
  --panel2: rgba(18, 18, 22, 0.62);
  --text: #eaeaea;
  --muted: rgba(234,234,234,.72);

  /* Glow + lines */
  --edge: rgba(255, 86, 0, .35);
  --edge2: rgba(255, 86, 0, .18);
  --shadow: 0 18px 50px rgba(0,0,0,.55);

  /* Layout */
  --container: 1700px;
  --pad: clamp(18px, 2.2vw, 28px);
  --radius: 22px;
  --radius-sm: 16px;

  /* Type */
  --sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --display: "FeastOfFlesh", var(--sans);
}

/* --------- Global Reset --------- */
*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  color:var(--text);
  font-family:var(--sans);
  background:
    radial-gradient(1200px 800px at 65% 20%, rgba(255,86,0,.10), transparent 60%),
    radial-gradient(900px 700px at 20% 75%, rgba(255,86,0,.06), transparent 55%),
    linear-gradient(180deg, var(--bg0), var(--bg1) 45%, #070708 100%);
  overflow-x:hidden;
}

/* subtle texture (no image needed) */
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.03), transparent 35%),
    radial-gradient(circle at 80% 70%, rgba(255,255,255,.02), transparent 40%);
  mix-blend-mode: overlay;
  opacity:.35;
  z-index:-2;
}

/* optional “vignette” depth */
body::after{
  content:"";
  position:fixed;
  inset:-40px;
  pointer-events:none;
  background: radial-gradient(circle at 50% 35%, transparent 35%, rgba(0,0,0,.55) 80%);
  z-index:-1;
}

/* --------- Layout Helpers --------- */
.v2-wrap{
  max-width: min(var(--container), 98vw);
  margin: 0 auto;
  padding: 28px clamp(10px, 1.2vw, 16px) 72px;
}

.v2-grid{
  display:grid;
  gap: 18px;
}

@media (min-width: 980px){
  .v2-grid.hero{
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
    gap: 56px;
  }
}

/* ===== Left stack: logo above hero panel ===== */
.left-stack{
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 14px;
  align-content: start;
}

.seal-wrap{
  display:flex;
  justify-content:center;
  align-items:center;
  padding: 0 0 12px;
}

.seal{
  width: clamp(220px, 16vw, 340px);
  height: auto;
  display: block;
  filter:
    drop-shadow(0 0 14px rgba(255,86,0,.55))
    drop-shadow(0 0 40px rgba(255,86,0,.28));
  animation: sealPulse 4s ease-in-out infinite;
}

/* Make hero panel stretch to match right column height */
.hero-panel{ height: 100%; }

.hero-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:14px;
}

/* --------- Headings / Text --------- */
.kicker{
  color: var(--ov);
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 800;
  font-size: 12px;
  opacity: .95;
}

.h1{
  margin: 10px 0 10px;
  font-size: clamp(42px, 4.8vw, 82px);
  line-height: 1.05;              /* less aggressive than .95 */
  font-family: var(--display);
  letter-spacing: .02em;
}

.h2{
  margin: 0 0 10px;
  font-size: clamp(28px, 2.8vw, 44px);
  line-height: 1.08;
  font-family: var(--display);
}

.sub{
  color: var(--muted);
  font-size: 16px;
  line-height: 1.6;
  max-width: 62ch;
}

/* ===== Feast of Flesh — Gradient Titles ===== */
.h1,
.h2,
.card-title{
  font-family: var(--display);
  text-transform: uppercase;
  letter-spacing: .02em;

  line-height: 1.15;
  padding-top: .10em;
  padding-bottom: .10em;

  background-image: linear-gradient(
    to bottom,
    #ffffff 0%,
    #ffffff 45%,
    #ffd6b0 65%,
    #ff8a3a 82%,
    #ff5600 100%
  );

  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  -webkit-text-stroke: 0;

  text-shadow:
    0 1px 0 rgba(0,0,0,.12),
    0 0 8px rgba(255,255,255,.45),
    0 0 18px rgba(255,86,0,.55),
    0 0 36px rgba(255,86,0,.35);
}

/* ==== FIX: FeastOfFlesh “O” clipping ==== */
.h1, .h2, .card-title{
  display: inline-block;
  overflow: visible;
  padding-left: .14em;
  padding-right: .08em;
}


  /* ==== FIX: FeastOfFlesh “O” clipping (give glyph room to breathe) ==== */
.h1, .h2, .card-title{
  display: inline-block;   /* ensures padding affects the paint box */
  overflow: visible;       /* just in case a parent tries to clip */
  padding-left: .14em;     /* key: prevents left-side crop on “O” */
  padding-right: .08em;    /* small right buffer for shadows/edges */
}
  /* bright gradient: white top → OV orange bottom */
  background-image: linear-gradient(
    to bottom,
    #ffffff 0%,
    #ffffff 45%,
    #ffd6b0 65%,
    #ff8a3a 82%,
    #ff5600 100%
  );

  -webkit-background-clip: text;
  background-clip: text;

  /* Chrome key */
  -webkit-text-fill-color: transparent;
  color: transparent;

  /* no stroke (keeps it clean) */
  -webkit-text-stroke: 0;

  /* glow that doesn't “muddy” the gradient */
  text-shadow:
    0 1px 0 rgba(0,0,0,.12),
    0 0 8px rgba(255,255,255,.45),
    0 0 18px rgba(255,86,0,.55),
    0 0 36px rgba(255,86,0,.35);
}

/* --------- Panels / Cards --------- */
.panel{
  position:relative;
  background: linear-gradient(180deg, var(--panel), var(--panel2));
  border-radius: var(--radius);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: var(--shadow);
  overflow:hidden;
}

.panel.edge{
  border-color: var(--edge2);
  box-shadow:
    0 0 0 1px rgba(255,86,0,.12) inset,
    0 0 34px rgba(255,86,0,.10),
    var(--shadow);
}

.panel .in{ padding: 20px 20px 18px; }
@media (min-width: 980px){
  .panel .in{ padding: 22px 22px 20px; }
}

.card{
  border-radius: var(--radius-sm);
  border: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(16,16,18,.75), rgba(10,10,12,.55));
  box-shadow: 0 14px 38px rgba(0,0,0,.45);
  overflow:hidden;
}

.card.edge{
  border-color: rgba(255,86,0,.22);
  box-shadow:
    0 0 0 1px rgba(255,86,0,.14) inset,
    0 0 28px rgba(255,86,0,.10),
    0 14px 38px rgba(0,0,0,.45);
}

.card .in{ padding: 18px 18px 16px; }

/* Card title row (title + small pill) */
.card-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.card-title{
  font-size: 26px;
  letter-spacing: .03em;
  line-height: 1.10;
  margin: 0;
}

/* Prevent title “left cut” if a parent ever hides overflow */
.panel, .card{ overflow: visible; }
.panel .in, .card .in{ overflow: visible; }

.pill{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 999px;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.85);
  border: 1px solid rgba(255,86,0,.28);
  background: rgba(0,0,0,.35);
}

/* Links / CTAs */
a{ color: inherit; text-decoration:none; }
.cta{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  margin-top: 10px;
  color: var(--ov);
  font-weight: 800;
}
.cta:hover{ filter: brightness(1.15); }

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.35);
  color: rgba(255,255,255,.92);
  font-weight: 700;
}
.btn:hover{ border-color: rgba(255,86,0,.22); }

/* --------- Simple “HQ cards” grid --------- */
.hq-grid{
  display:grid;
  gap: 14px;
  grid-template-columns: 1fr;
}
@media (min-width: 600px){
  .hq-grid{ grid-template-columns: 1fr 1fr; }
}
.feature{ min-height: 170px; }

/* --------- RLOL Esports Skin --------- */
body.rlol{
  --edge: rgba(255,138,0,.35);
  --edge2: rgba(255,138,0,.18);
}
body.rlol .kicker,
body.rlol .cta{ color: var(--rlol); }

/* =========================
   Hover Glow + Lift (premium)
   ========================= */
.panel, .card{
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease,
    filter .18s ease;
  will-change: transform, box-shadow;
}
.panel:hover, .card:hover{
  transform: translateY(-3px);
  border-color: rgba(255,255,255,.14);
  box-shadow:
    0 0 0 1px rgba(255,86,0,.22) inset,
    0 0 42px rgba(255,86,0,.18),
    0 18px 55px rgba(0,0,0,.65);
}
.panel.edge:hover, .card.edge:hover{
  border-color: rgba(255,86,0,.40);
  box-shadow:
    0 0 0 1px rgba(255,86,0,.30) inset,
    0 0 55px rgba(255,86,0,.22),
    0 22px 70px rgba(0,0,0,.70);
}
body.rlol .panel:hover,
body.rlol .card:hover{
  box-shadow:
    0 0 0 1px rgba(255,138,0,.22) inset,
    0 0 42px rgba(255,138,0,.18),
    0 18px 55px rgba(0,0,0,.65);
}
body.rlol .panel.edge:hover,
body.rlol .card.edge:hover{
  border-color: rgba(255,138,0,.40);
  box-shadow:
    0 0 0 1px rgba(255,138,0,.30) inset,
    0 0 55px rgba(255,138,0,.22),
    0 22px 70px rgba(0,0,0,.70);
}

/* Accessibility: respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .panel, .card{ transition: none; }
  .panel:hover, .card:hover{ transform: none; }
}

@keyframes sealPulse {
  0% {
    transform: scale(1);
    filter:
      drop-shadow(0 0 14px rgba(255,86,0,.45))
      drop-shadow(0 0 40px rgba(255,86,0,.22));
  }
  50% {
    transform: scale(1.04);
    filter:
      drop-shadow(0 0 22px rgba(255,86,0,.75))
      drop-shadow(0 0 60px rgba(255,86,0,.4));
  }
  100% {
    transform: scale(1);
    filter:
      drop-shadow(0 0 14px rgba(255,86,0,.45))
      drop-shadow(0 0 40px rgba(255,86,0,.22));
  }
}

/* =========================================================
   OV BUILDS (Alpha Console) — v2 styling patch
   Scope: body.ac-builds
   ========================================================= */

body.ac-builds{
  /* keep v2 background system; this just makes builds match */
}

body.ac-builds .ac-hero,
body.ac-builds .ac-section{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

body.ac-builds .ac-hero{
  padding-top: 96px;
  padding-bottom: 22px;
}

/* Hero panel look */
body.ac-builds .ac-hero-inner{
  position: relative;
  border-radius: 26px;
  padding: 34px 28px 26px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 28px 90px rgba(0,0,0,.55);
  overflow: hidden;
}

body.ac-builds .ac-hero-inner::before{
  content:"";
  position:absolute;
  inset:-2px;
  pointer-events:none;
  background:
    radial-gradient(900px 420px at 18% 20%, rgba(255,86,0,.18), transparent 60%),
    radial-gradient(680px 340px at 85% 10%, rgba(255,138,0,.10), transparent 60%),
    radial-gradient(820px 520px at 55% 120%, rgba(255,86,0,.10), transparent 60%);
  opacity: .95;
}

body.ac-builds .ac-hero-inner > *{
  position: relative;
  z-index: 1;
}

body.ac-builds .ac-hero-inner h1{
  margin: 0 0 10px 0;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-family: "FeastOfFlesh","Impact","Arial Black",system-ui;
  font-size: clamp(44px, 5.2vw, 78px);
  line-height: 1.02;
  text-shadow:
    0 0 22px rgba(255,86,0,.55),
    0 0 52px rgba(255,86,0,.30);
}

body.ac-builds .ac-hero-inner p{
  margin: 0 0 18px 0;
  max-width: 70ch;
  opacity: .88;
  line-height: 1.55;
}

/* CTA buttons (works with your existing .btn styles if present in v2) */
body.ac-builds .ac-hero-cta{
  display:flex;
  flex-wrap:wrap;
  gap: 12px;
}

/* Sections */
body.ac-builds .ac-section{
  padding-top: 26px;
  padding-bottom: 40px;
}

body.ac-builds .ac-title{
  margin: 0 0 8px 0;
  font-family: "FeastOfFlesh","Impact","Arial Black",system-ui;
  letter-spacing: .05em;
  text-transform: uppercase;
  font-size: clamp(30px, 3.1vw, 46px);
}

body.ac-builds .ac-sub{
  margin: 0 0 18px 0;
  opacity: .82;
}

body.ac-builds .ac-subtitle{
  margin: 18px 0 12px 0;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: 12px;
  opacity: .85;
}

/* Gallery grid */
body.ac-builds .ac-grid{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 14px;
}

body.ac-builds .ac-card{
  grid-column: span 4;
  margin: 0;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 18px 44px rgba(0,0,0,.45);
  overflow: hidden;
  transform: translateY(0);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

body.ac-builds .ac-card:hover{
  transform: translateY(-3px);
  border-color: rgba(255,86,0,.22);
  box-shadow:
    0 28px 70px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,86,0,.08) inset;
}

body.ac-builds .ac-card img{
  display:block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

body.ac-builds .ac-card figcaption{
  padding: 12px 12px 14px;
  font-weight: 700;
  letter-spacing: .04em;
  opacity: .92;
}

/* Pricing card */
body.ac-builds .ac-ratecard{
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 18px 44px rgba(0,0,0,.45);
  overflow: hidden;
  padding: 14px;
}

body.ac-builds .ac-ratecard img{
  width: 100%;
  height: auto;
  display:block;
  border-radius: 16px;
}

body.ac-builds .ac-contact{
  margin-top: 16px;
}

/* Responsive */
@media (max-width: 980px){
  body.ac-builds .ac-card{ grid-column: span 6; }
}

@media (max-width: 640px){
  body.ac-builds .ac-hero{ padding-top: 78px; }
  body.ac-builds .ac-hero-inner{ padding: 26px 18px 20px; }
  body.ac-builds .ac-section{ padding-top: 18px; padding-bottom: 30px; }
  body.ac-builds .ac-card{ grid-column: span 12; }
  body.ac-builds .ac-hero, body.ac-builds .ac-section{ padding-left: 16px; padding-right: 16px; }
}

/* =========================================================
   COTW — v2 page patch
   Scope: body.cotw
   ========================================================= */

body.cotw .container.cotw-page{
  max-width: 1200px;
  margin: 0 auto;
  padding: 30px 24px 70px;
}

/* HERO tweaks */
body.cotw .cotw-hero{
  padding-top: 88px;
  padding-bottom: 22px;
}
body.cotw .cotw-title{
  font-family: "FeastOfFlesh","Impact","Arial Black",system-ui;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: clamp(44px, 5.2vw, 84px);
  line-height: 1.02;
  margin: 0 0 10px 0;
  text-shadow:
    0 0 22px rgba(255,86,0,.55),
    0 0 52px rgba(255,86,0,.30);
}

/* Section rhythm */
body.cotw .section{
  margin-top: 26px;
}
body.cotw .section-head{
  margin: 0 0 14px 0;
}
body.cotw .section-title{
  font-family: "FeastOfFlesh","Impact","Arial Black",system-ui;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: clamp(28px, 3.2vw, 44px);
  margin: 0 0 6px 0;
}
body.cotw .section-sub{
  margin: 0;
  opacity: .82;
}

/* Winner block */
body.cotw .cotw-winner{
  display: grid;
  grid-template-columns: 1.02fr 0.98fr;
  gap: 16px;
  align-items: stretch;
}

/* Winner copy card */
body.cotw .cotw-winner-copy{
  border-radius: 22px;
  padding: 20px 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 18px 44px rgba(0,0,0,.45);
  overflow: hidden;
  position: relative;
}
body.cotw .cotw-winner-copy::before{
  content:"";
  position:absolute;
  inset:-2px;
  pointer-events:none;
  background:
    radial-gradient(680px 280px at 18% 18%, rgba(255,86,0,.18), transparent 60%),
    radial-gradient(520px 240px at 85% 8%, rgba(255,138,0,.10), transparent 60%);
  opacity: .95;
}
body.cotw .cotw-winner-copy > *{ position: relative; z-index: 1; }

body.cotw .pill{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 999px;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 800;
  color: rgba(255,255,255,.92);
  border: 1px solid rgba(255,86,0,.28);
  background: linear-gradient(180deg, rgba(255,86,0,.18), rgba(255,255,255,.04));
  box-shadow: 0 12px 30px rgba(255,86,0,.10);
}

body.cotw .cotw-winner-title{
  margin: 12px 0 8px;
  font-size: 22px;
  font-weight: 900;
  letter-spacing: .02em;
}
body.cotw .cotw-winner-desc{
  margin: 0 0 14px;
  line-height: 1.55;
}

/* Winner buttons */
body.cotw .cotw-actions{
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
  margin-top: 10px;
}
body.cotw .cotw-meta{
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.08);
  opacity: .72;
  font-size: 13px;
}

/* Video card */
body.cotw .cotw-winner-video{
  border-radius: 22px;
  padding: 12px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 18px 44px rgba(0,0,0,.45);
}
body.cotw .embed-wrap{
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 16px;
  overflow: hidden;
  background: rgba(0,0,0,.5);
}
body.cotw .embed-frame{
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

/* Submit/Vote grid */
body.cotw .cotw-grid{
  margin-top: 14px;
}

/* Make feature cards feel v2 */
body.cotw .feature-card.cotw-card{
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 18px 44px rgba(0,0,0,.45);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
body.cotw .feature-card.cotw-card:hover{
  transform: translateY(-3px);
  border-color: rgba(255,86,0,.22);
  box-shadow:
    0 28px 70px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,86,0,.08) inset;
}

/* Chips */
body.cotw .chip{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(0,0,0,.20);
}

/* Mobile */
@media (max-width: 980px){
  body.cotw .cotw-winner{
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px){
  body.cotw .container.cotw-page{
    padding-left: 16px;
    padding-right: 16px;
  }
  body.cotw .cotw-hero{
    padding-top: 78px;
  }
}

/* =========================================================
   STATS (RL Tracker embed) — v2 styling
   Scope: body.stats-v2
   ========================================================= */

body.stats-v2 .container.stats-page{
  max-width: 1400px;
  margin: 0 auto;
  padding: 32px 24px 70px;
}

/* Header block */
body.stats-v2 .stats-head{
  display:flex;
  align-items:flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

body.stats-v2 .stats-title{
  font-family: "FeastOfFlesh","Impact","Arial Black",system-ui;
  letter-spacing: .05em;
  text-transform: uppercase;
  font-size: clamp(38px, 4.5vw, 64px);
  margin: 0 0 6px 0;
  text-shadow:
    0 0 18px rgba(255,86,0,.45),
    0 0 42px rgba(255,86,0,.25);
}

body.stats-v2 .stats-sub{
  margin: 0;
  opacity: .82;
  max-width: 60ch;
}

/* Buttons */
body.stats-v2 .stats-actions{
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
}

/* Embed card */
body.stats-v2 .embed-wrap{
  position: relative;
  border-radius: 26px;
  padding: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 26px 80px rgba(0,0,0,.55);
  overflow: hidden;
}

/* subtle OV glow */
body.stats-v2 .embed-wrap::before{
  content:"";
  position:absolute;
  inset:-2px;
  pointer-events:none;
  background:
    radial-gradient(900px 420px at 18% 20%, rgba(255,86,0,.18), transparent 60%),
    radial-gradient(680px 340px at 85% 10%, rgba(255,138,0,.10), transparent 60%);
  opacity:.95;
}

body.stats-v2 .embed-wrap > *{
  position: relative;
  z-index:1;
}

/* Big cinematic iframe */
body.stats-v2 .embed-frame{
  width: 100%;
  height: 78vh;       /* THIS is what makes it big */
  min-height: 780px;
  border: 0;
  border-radius: 18px;
  background:#000;
}

/* Mobile */
@media (max-width: 900px){
  body.stats-v2 .embed-frame{
    height: 70vh;
    min-height: 520px;
  }
}
@media (max-width: 600px){
  body.stats-v2 .container.stats-page{
    padding-left: 16px;
    padding-right: 16px;
  }
  body.stats-v2 .embed-frame{
    height: 62vh;
    min-height: 420px;
  }
}

/* Stats page hero logo sizing */

body.stats-v2 .hero-v2 .nav-logo,
body.stats-v2 .hero-v2 img{
  max-width: 220px;   /* try 180–240 range to taste */
  width: 100%;
  height: auto;
  margin-bottom: 16px;
}

/* =========================================================
   Stats Hero Logo — glow pulse (OV style)
   ========================================================= */

body.stats-v2 .hero-v2 img{
  animation: ovPulse 3.8s ease-in-out infinite;
  filter: drop-shadow(0 0 18px rgba(255,86,0,.45));
}

/* Reuse OV pulse animation (if not already in v2.css) */
@keyframes ovPulse{
  0%{
    filter: drop-shadow(0 0 14px rgba(255,86,0,.35));
    opacity: .92;
  }
  50%{
    filter: drop-shadow(0 0 34px rgba(255,86,0,.70));
    opacity: 1;
  }
  100%{
    filter: drop-shadow(0 0 14px rgba(255,86,0,.35));
    opacity: .92;
  }
}

/* =========================
   STATS: big seal control + pulse (robust)
   ========================= */

/* If the big seal is in the hero area, target it directly */
body.stats-v2 .stats-hero-logo,
body.stats-v2 .hero-v2 .stats-hero-logo{
  max-width: 220px;
  width: 100%;
  height: auto;
  margin: 0 0 16px;
  animation: ovPulse 4.6s ease-in-out infinite;
  filter: drop-shadow(0 0 14px rgba(255,86,0,.35));
}

/* If you didn't add a class to the image yet, this catches the first big image in the hero */
body.stats-v2 .hero-v2 img:first-of-type{
  max-width: 220px;
  width: 100%;
  height: auto;
  margin: 0 0 16px;
  animation: ovPulse 4.6s ease-in-out infinite;
  filter: drop-shadow(0 0 14px rgba(255,86,0,.35));
}

/* Pulse keyframes (safe even if it already exists) */
@keyframes ovPulse{
  0%   { filter: drop-shadow(0 0 14px rgba(255,86,0,.35)); opacity:.92; }
  50%  { filter: drop-shadow(0 0 34px rgba(255,86,0,.75)); opacity:1; }
  100% { filter: drop-shadow(0 0 14px rgba(255,86,0,.35)); opacity:.92; }
}

/* =========================
   NAV: make links look like v2 tabs
   ========================= */

.nav{
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: blur(10px);
  background: rgba(0,0,0,.35);
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.nav .nav-inner{
  max-width: 1200px;
  margin: 0 auto;
  padding: 14px 24px;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 16px;
}

.nav .logo img.nav-logo{
  height: 44px;
  width: auto;
  display:block;
  filter: drop-shadow(0 0 18px rgba(255,86,0,.35));
}

.nav nav{
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
  align-items:center;
}

.nav nav a{
  text-decoration: none;
  color: rgba(255,255,255,.86);
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: 12px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.22);
  transition: transform .12s ease, border-color .12s ease, box-shadow .12s ease;
}

.nav nav a:hover{
  transform: translateY(-1px);
  border-color: rgba(255,86,0,.22);
  box-shadow: 0 0 0 1px rgba(255,86,0,.08) inset;
}

.nav nav a.active{
  border-color: rgba(255,86,0,.35);
  background: linear-gradient(180deg, rgba(255,86,0,.20), rgba(0,0,0,.22));
  box-shadow: 0 12px 30px rgba(255,86,0,.10);
}

/* SHOP v2 */
body.shop-v2 .shop-hero .lede{ max-width: 70ch; }

body.shop-v2 .shop-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}

body.shop-v2 .shop-card{
  display:block;
  border-radius: 18px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  box-shadow: 0 18px 44px rgba(0,0,0,.45);
  text-decoration:none;
  color: inherit;
  transform: translateY(0);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

body.shop-v2 .shop-card:hover{
  transform: translateY(-3px);
  border-color: rgba(255,86,0,.22);
  box-shadow:
    0 28px 70px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,86,0,.08) inset;
}

body.shop-v2 .shop-card img{
  width:100%;
  aspect-ratio: 16/10;
  object-fit: cover;
  display:block;
}

body.shop-v2 .shop-meta{
  padding: 12px 12px 14px;
}

body.shop-v2 .shop-name{
  font-weight: 900;
  letter-spacing: .02em;
}

body.shop-v2 .shop-sub{
  font-size: 13px;
  margin-top: 2px;
  opacity: .78;
}

@media (max-width: 980px){
  body.shop-v2 .shop-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px){
  body.shop-v2 .shop-grid{ grid-template-columns: 1fr; }
}

@import url("/assets/css/mobile-fix.css");

/* =========================
   COTW – clean hero background (remove seal only)
   ========================= */

body.ov.cotw::before{
  background: none !important;
  opacity: 0 !important;
}

body.ov.cotw::after{
  background: none !important;
  opacity: 0 !important;
}

/* Keep a simple dark base */
body.ov.cotw{
  background: linear-gradient(180deg, #050505, #0b0b0b) !important;
}

/* =========================
   COTW – force remove any global background images
   ========================= */

html body.ov.cotw{
  background-image: none !important;
  background-color: #050505 !important;
}

body.ov.cotw .container,
body.ov.cotw main,
body.ov.cotw .hero,
body.ov.cotw .hero-v2{
  background-image: none !important;
}

/* =========================
   COTW – hide global OV seal layer (ALL possible sources)
   ========================= */

/* If it's a real element */
body.ov.cotw .seal-wrap,
body.ov.cotw .seal,
body.ov.cotw .hero-wordmark,
body.ov.cotw .left-stack{
  display: none !important;
}

/* If it's on html/body pseudo-elements */
body.ov.cotw::before,
body.ov.cotw::after,
body.ov.cotw::before,
body.ov.cotw::after{
  content: none !important;
  display: none !important;
  background: none !important;
  opacity: 0 !important;
}

/* If it's a background-image on wrappers */
body.ov.cotw,
body.ov.cotw,
body.ov.cotw main,
body.ov.cotw .container,
body.ov.cotw .hero,
body.ov.cotw .hero-v2{
  background-image: none !important;
}

body.ov.cotw img{
  display: none !important;
}

/* MVP LEADERBOARD STYLING */

.leaderboard {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 12px;
}

.leaderboard span {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 18px;
  border-radius: 14px;
  background: linear-gradient(145deg, #121212, #0a0a0a);
  border: 1px solid rgba(255,138,0,0.25);
  box-shadow: 0 0 18px rgba(255,138,0,0.15);
  font-weight: 700;
  transition: .25s ease;
}

.leaderboard span:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 28px rgba(255,138,0,0.4);
}

/* Rank number */
.leaderboard span strong {
  color: #ff8a00;
}

/* #1 MVP special glow */
.leaderboard span:first-child {
  border: 1px solid rgba(255,138,0,0.7);
  box-shadow: 0 0 30px rgba(255,138,0,0.6);
}