header {
      position: sticky;
      top: 0;
      z-index: 50;
      border-bottom: 1rem solid rgba(255,255,255,.075);
      background: rgba(14,14,16,.72);
      backdrop-filter: blur(28rem) saturate(145%);
      transform: translateY(-100%);
      opacity: 0;
      transition: transform .9s var(--ease), opacity .9s var(--ease);
    }body.is-ready header { transform: translateY(0); opacity: 1; }.nav {
      min-height: 78rem;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20rem;
    }.brand {
      display: flex;
      align-items: center;
      gap: 14rem;
      font-weight: 950;
      letter-spacing: -.035em;
    }.brand-mark {
      position: relative;
      width: 48rem;
      height: 48rem;
      display: grid;
      place-items: center;
      overflow: hidden;
      border-radius: 16rem;
      color: #fff;
      background: linear-gradient(135deg, var(--red), var(--orange));
      box-shadow: 0 0 38rem rgba(226,59,40,.35), inset 0 1rem rgba(255,255,255,.3);
      transform: rotate(-4deg);
      transition: transform .45s var(--ease);
    }.brand-mark::after {
      content: "";
      position: absolute;
      inset: -50%;
      background: linear-gradient(115deg, transparent 42%, rgba(255,255,255,.55) 50%, transparent 58%);
      transform: translateX(-80%) rotate(14deg);
      animation: logoShine 4.5s ease-in-out infinite;
    }@keyframes logoShine { 55%,100% { transform: translateX(90%) rotate(14deg); } }.brand:hover .brand-mark { transform: rotate(0deg) scale(1.06); }.brand small {
      display: block;
      margin-top: 4rem;
      color: var(--muted);
      font-size: 10rem;
      letter-spacing: .2em;
    }.nav-right { display: flex; align-items: center; gap: 12rem; }.connection-status { display: none !important; }.nav-link {
      padding: 10rem 13rem;
      color: #c7c1d1;
      border-radius: 12rem;
      font-size: 12rem;
      font-weight: 850;
      transition: color .22s ease, background .22s ease;
    }.nav-link:hover { color: #fff; background: rgba(255,255,255,.055); }.status {
      display: inline-flex;
      align-items: center;
      gap: 9rem;
      padding: 9rem 12rem;
      border: 1rem solid var(--line);
      border-radius: 999rem;
      color: #d6d1df;
      background: rgba(255,255,255,.035);
      font-size: 12rem;
      font-weight: 850;
    }.status-dot { width: 8rem; height: 8rem; border-radius: 50%; background: #6d6875; }.status-dot.online { background: var(--green); box-shadow: 0 0 16rem rgba(93,229,165,.85); animation: pulseDot 2s ease infinite; }.status-dot.error { background: var(--red); box-shadow: 0 0 14rem rgba(226,59,40,.55); }@keyframes pulseDot { 50% { transform: scale(.72); opacity: .6; } }.hero {
      position: relative;
      min-height: clamp(610rem, 72vh, 720rem);
      padding: 52rem 0 28rem;
      display: grid;
      grid-template-columns: minmax(0, 1.06fr) minmax(360rem, .94fr);
      gap: 36rem;
      align-items: center;
    }.hero::before {
      content: "";
      position: absolute;
      left: -8vw;
      top: 40%;
      z-index: -1;
      color: transparent;
      -webkit-text-stroke: 1rem rgba(255,255,255,.035);
      font-size: clamp(180rem, 32vw, 500rem);
      font-weight: 1000;
      letter-spacing: -.12em;
      transform: translateY(-50%) rotate(-7deg);
      pointer-events: none;
    }.hero-copy-wrap {
      position: relative;
      padding: 8rem 0;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }.eyebrow {
      width: fit-content;
      display: inline-flex;
      align-items: center;
      gap: 9rem;
      padding: 10rem 14rem;
      border: 1rem solid rgba(226,59,40,.3);
      border-radius: 999rem;
      color: #ff9b7f;
      background: rgba(226,59,40,.08);
      box-shadow: inset 0 1rem rgba(255,255,255,.04);
      font-size: 11rem;
      font-weight: 900;
      letter-spacing: .1em;
      opacity: 0;
      transform: translateY(24rem);
      transition: opacity .9s .12s var(--ease), transform .9s .12s var(--ease);
    }body.is-ready .eyebrow { opacity: 1; transform: translateY(0); }.eyebrow i { width: 8rem; height: 8rem; border-radius: 50%; background: var(--red); box-shadow: 0 0 18rem var(--red); animation: pulseDot 1.8s ease infinite; }h1 {
      margin: 20rem 0 16rem;
      max-width: 900rem;
      font-size: clamp(54rem, 7.35vw, 104rem);
      line-height: .86;
      letter-spacing: -.085em;
      perspective: 900rem;
    }h1 .word {
      display: block;
      opacity: 0;
      transform: translateY(110%) rotateX(-22deg);
      transform-origin: 50% 100%;
      transition: opacity 1s var(--ease), transform 1.1s var(--ease);
    }h1 .word:nth-child(1) { transition-delay: .16s; }h1 .word:nth-child(2) { transition-delay: .28s; }body.is-ready h1 .word { opacity: 1; transform: translateY(0) rotateX(0); }h1 .accent {
      color: transparent;
      background: linear-gradient(105deg, #fff 4%, #ffd1c2 22%, #e23b28 53%, #f15b3e 76%, #fff 100%);
      background-size: 220% auto;
      -webkit-background-clip: text;
      background-clip: text;
      text-shadow: 0 0 60rem rgba(226,59,40,.22);
      animation: titleFlow 6s linear infinite;
    }@keyframes titleFlow { to { background-position: 220% center; } }.hero-copy {
      max-width: 760rem;
      margin: 0;
      color: #c1bbcb;
      font-size: 17rem;
      line-height: 1.68;
      opacity: 0;
      transform: translateY(22rem);
      transition: opacity .9s .42s var(--ease), transform .9s .42s var(--ease);
    }body.is-ready .hero-copy { opacity: 1; transform: translateY(0); }.hero-actions {
      display: flex;
      align-items: center;
      gap: 12rem;
      margin-top: 22rem;
      opacity: 0;
      transform: translateY(22rem);
      transition: opacity .9s .54s var(--ease), transform .9s .54s var(--ease);
    }body.is-ready .hero-actions { opacity: 1; transform: translateY(0); }.hero-cta {
      position: relative;
      overflow: hidden;
      display: inline-flex;
      align-items: center;
      gap: 10rem;
      min-height: 50rem;
      padding: 12rem 18rem;
      border-radius: 15rem;
      background: linear-gradient(135deg, var(--red), #8f160f);
      box-shadow: 0 16rem 38rem rgba(226,59,40,.23);
      font-size: 12rem;
      font-weight: 950;
      letter-spacing: .03em;
      transition: transform .25s var(--ease), filter .25s ease;
    }.hero-cta::before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(110deg, transparent 28%, rgba(255,255,255,.23) 48%, transparent 68%);
      transform: translateX(-110%);
      transition: transform .7s var(--ease);
    }.hero-cta:hover { transform: translateY(-4rem); filter: brightness(1.08); }.hero-cta:hover::before { transform: translateX(110%); }.hero-note { color: #8d8799; font-size: 12rem; font-weight: 750; }.hero-stats {
      display: flex;
      flex-wrap: wrap;
      gap: 11rem;
      margin-top: 22rem;
      opacity: 0;
      transform: translateY(24rem);
      transition: opacity .9s .64s var(--ease), transform .9s .64s var(--ease);
    }body.is-ready .hero-stats { opacity: 1; transform: translateY(0); }.stat-chip {
      position: relative;
      min-width: 154rem;
      overflow: hidden;
      padding: 15rem 17rem;
      border: 1rem solid var(--line);
      border-radius: 17rem;
      background: rgba(255,255,255,.035);
      backdrop-filter: blur(12rem);
      transition: transform .32s var(--ease), border-color .32s ease, background .32s ease;
    }.stat-chip::after {
      content: "";
      position: absolute;
      width: 70rem;
      height: 70rem;
      right: -30rem;
      bottom: -35rem;
      border-radius: 50%;
      background: rgba(226,59,40,.14);
      filter: blur(10rem);
    }.stat-chip:hover { transform: translateY(-5rem); border-color: rgba(226,59,40,.28); background: rgba(255,255,255,.055); }.stat-chip strong { display: block; font-size: 21rem; letter-spacing: -.045em; }.stat-chip span { display: block; margin-top: 4rem; color: var(--muted); font-size: 10rem; font-weight: 850; text-transform: uppercase; letter-spacing: .12em; }.next-release-wrap {
      position: relative;
      opacity: 0;
      transform: translateX(50rem) rotateY(-7deg);
      transition: opacity 1.1s .34s var(--ease), transform 1.1s .34s var(--ease);
      perspective: 1200rem;
    }body.is-ready .next-release-wrap { opacity: 1; transform: translateX(0) rotateY(0); }.orbit {
      position: absolute;
      inset: -28rem;
      z-index: -1;
      border: 1rem solid rgba(255,255,255,.07);
      border-radius: 50%;
      animation: orbitSpin 18s linear infinite;
    }.orbit::before, .orbit::after {
      content: "";
      position: absolute;
      width: 12rem;
      height: 12rem;
      border-radius: 50%;
      background: var(--red);
      box-shadow: 0 0 22rem var(--red);
    }.orbit::before { top: 12%; left: 12%; }.orbit::after { right: 9%; bottom: 16%; background: var(--cyan); box-shadow: 0 0 22rem var(--cyan); }@keyframes orbitSpin { to { transform: rotate(360deg); } }.next-release {
      position: relative;
      min-height: 408rem;
      overflow: hidden;
      padding: 26rem;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      border: 1rem solid rgba(255,255,255,.14);
      border-radius: var(--radius-xl);
      background:
        linear-gradient(to top, rgba(5,5,9,.98) 0%, rgba(5,5,9,.32) 58%, rgba(5,5,9,.07) 100%),
        radial-gradient(circle at 82% 8%, rgba(255,255,255,.19), transparent 18%),
        linear-gradient(145deg, #541329 0%, #1b1028 47%, #101a2c 100%);
      box-shadow: var(--shadow), inset 0 1rem rgba(255,255,255,.08);
      isolation: isolate;
      transform-style: preserve-3d;
      animation: cardFloat 6s ease-in-out infinite;
      cursor: pointer;
      outline: none;
    }.next-release:focus-visible { box-shadow: 0 0 0 4rem rgba(226,59,40,.24), var(--shadow), inset 0 1rem rgba(255,255,255,.08); }.next-release[aria-disabled="true"] { cursor: default; }@keyframes cardFloat { 50% { transform: translateY(-9rem); } }.next-release::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -2;
      opacity: .58;
      background: var(--next-cover, none) center / cover no-repeat;
      filter: saturate(.88) contrast(1.08);
      transform: scale(1.05);
      transition: transform 1.2s var(--ease), opacity .6s ease;
    }.next-release:hover::before { transform: scale(1.1); opacity: .68; }.next-release::after {
      content: "NEXT";
      position: absolute;
      right: -14rem;
      bottom: -24rem;
      z-index: -1;
      color: rgba(255,255,255,.045);
      font-size: 112rem;
      font-weight: 1000;
      letter-spacing: -.09em;
      transform: rotate(-8deg);
    }.card-scan {
      position: absolute;
      inset: 0;
      pointer-events: none;
      background: linear-gradient(to bottom, transparent 0%, rgba(255,255,255,.07) 49%, transparent 51%);
      background-size: 100% 180rem;
      opacity: .45;
      animation: scanMove 5s linear infinite;
    }@keyframes scanMove { to { background-position: 0 360rem; } }.next-label {
      width: fit-content;
      padding: 8rem 12rem;
      border: 1rem solid rgba(255,255,255,.18);
      border-radius: 999rem;
      background: rgba(8,7,12,.48);
      backdrop-filter: blur(12rem);
      font-size: 10rem;
      font-weight: 950;
      letter-spacing: .12em;
    }.next-content h2 { margin: 0 0 13rem; font-size: clamp(33rem, 4vw, 52rem); line-height: .96; letter-spacing: -.055em; text-wrap: balance; }.next-content p { margin: 0; color: #d4cfda; line-height: 1.58; }.next-countdown {
      margin-top: 19rem;
      display: inline-flex;
      align-items: center;
      gap: 9rem;
      padding: 12rem 14rem;
      border-radius: 15rem;
      color: #fff;
      background: linear-gradient(135deg, rgba(226,59,40,.96), rgba(255,133,98,.9));
      font-weight: 950;
      box-shadow: 0 14rem 36rem rgba(226,59,40,.24);
      animation: countdownPulse 2.5s ease-in-out infinite;
    }.next-coop[hidden] { display: none !important; }.next-coop {
      display: inline-flex;
      align-items: center;
      gap: 7rem;
      width: fit-content;
      margin-top: 10rem;
      padding: 8rem 10rem;
      border: 1rem solid rgba(93,229,165,.26);
      border-radius: 12rem;
      color: #d4ffe8;
      background: rgba(8,30,22,.52);
      backdrop-filter: blur(12rem);
      font-size: 11rem;
      font-weight: 900;
    }@keyframes countdownPulse { 50% { box-shadow: 0 18rem 46rem rgba(226,59,40,.36); transform: translateY(-2rem); } }.hero-highlights {
      grid-column: 1 / -1;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14rem;
      margin-top: 8rem;
      opacity: 0;
      transform: translateY(22rem);
      transition: opacity .9s .74s var(--ease), transform .9s .74s var(--ease);
    }body.is-ready .hero-highlights { opacity: 1; transform: translateY(0); }.quick-game-card {
      position: relative;
      min-width: 0;
      min-height: 126rem;
      overflow: hidden;
      padding: 14rem;
      display: grid;
      grid-template-columns: 96rem minmax(0, 1fr) auto;
      gap: 18rem;
      align-items: center;
      color: #fff;
      text-align: left;
      border: 1rem solid var(--line);
      border-radius: 22rem 22rem 22rem 7rem;
      background: linear-gradient(115deg, rgba(47,10,8,.9), rgba(14,4,4,.92) 68%);
      backdrop-filter: blur(16rem);
      box-shadow: inset 0 1rem rgba(255,255,255,.04);
      transition: transform .32s var(--ease), border-color .32s ease, background .32s ease, box-shadow .32s ease;
    }.quick-game-card::after {
      content: "";
      position: absolute;
      right: -38rem;
      bottom: -46rem;
      width: 100rem;
      height: 100rem;
      border-radius: 50%;
      background: rgba(226,59,40,.12);
      filter: blur(18rem);
      pointer-events: none;
    }.quick-game-card:not(:disabled):hover,
    .quick-game-card:not(:disabled):focus-visible {
      transform: translateY(-5rem);
      border-color: rgba(226,59,40,.34);
      background: linear-gradient(135deg, rgba(255,255,255,.075), rgba(226,59,40,.045));
      box-shadow: 0 18rem 42rem rgba(0,0,0,.25), inset 0 1rem rgba(255,255,255,.06);
    }.quick-game-card:focus-visible { outline: 3rem solid rgba(226,59,40,.22); outline-offset: 2rem; }.quick-game-card:disabled { cursor: default; opacity: .58; }.quick-cover {
      width: 96rem;
      height: 92rem;
      overflow: hidden;
      display: grid;
      place-items: center;
      border: 1rem solid rgba(255,255,255,.1);
      border-radius: 14rem 14rem 14rem 5rem;
      color: rgba(255,255,255,.42);
      background: linear-gradient(135deg, rgba(226,59,40,.24), rgba(181,31,21,.14));
      font-size: 13rem;
      font-weight: 1000;
      letter-spacing: -.03em;
    }.quick-cover img { width: 100%; height: 100%; display: block; object-fit: cover; }.quick-copy { min-width: 0; position: relative; z-index: 1; }.quick-kicker {
      display: block;
      margin-bottom: 8rem;
      color: #ef6b57;
      font-size: 9rem;
      font-weight: 950;
      letter-spacing: .13em;
      text-transform: uppercase;
    }.quick-title {
      display: block;
      overflow: hidden;
      color: #fff;
      font-size: clamp(16rem,1.7vw,22rem);
      font-weight: 950;
      line-height: 1.15;
      letter-spacing: -.025em;
      text-overflow: ellipsis;
      white-space: nowrap;
    }.quick-meta {
      display: block;
      overflow: hidden;
      margin-top: 8rem;
      color: var(--muted);
      font-size: 10rem;
      font-weight: 750;
      text-overflow: ellipsis;
      white-space: nowrap;
    }.quick-arrow {
      position: relative;
      z-index: 1;
      display: grid;
      place-items: center;
      width: 34rem;
      height: 34rem;
      border: 1rem solid rgba(255,255,255,.1);
      border-radius: 12rem;
      color: #fff;
      background: rgba(255,255,255,.045);
      font-size: 15rem;
      transition: transform .3s var(--ease), background .3s ease;
    }.quick-game-card:not(:disabled):hover .quick-arrow { transform: translateX(3rem); background: rgba(226,59,40,.16); }.ticker-wrap {
      overflow: hidden;
      margin: 18rem 0 28rem;
      border-top: 1rem solid var(--line);
      border-bottom: 1rem solid var(--line);
      background: rgba(255,255,255,.018);
      transform: rotate(-1deg) scale(1.015);
    }.ticker {
      --ticker-gap: 34rem;
      --ticker-shift: -50%;
      --ticker-duration: 24s;
      width: max-content;
      display: flex;
      align-items: center;
      gap: 0;
      padding: 13rem 0;
      color: #8f889b;
      font-size: 11rem;
      font-weight: 950;
      letter-spacing: .18em;
      text-transform: uppercase;
      white-space: nowrap;
      will-change: transform;
      backface-visibility: hidden;
      transform: translate3d(0, 0, 0);
    }.ticker.is-running { animation: tickerMove var(--ticker-duration) linear infinite; }.ticker-group {
      display: flex;
      flex: 0 0 auto;
      align-items: center;
      gap: var(--ticker-gap);
      min-width: max-content;
      padding-right: var(--ticker-gap);
    }.ticker-item { display: inline-flex; flex: 0 0 auto; align-items: center; gap: var(--ticker-gap); }.ticker b { color: var(--red); font-size: 15rem; }@keyframes tickerMove {
      from { transform: translate3d(0, 0, 0); }
      to { transform: translate3d(var(--ticker-shift), 0, 0); }
    }