@scope (.legacy) {

/* == assets/v2/base.fc7ba64c.css == */
/* SixStarsWanted — shared stylesheet (Vice City Sunset design system).
   Cached once, reused by every page. Page-specific rules stay inline. */

/* ═══════════════════════════════════════════════════════════════
   SixStarsWanted — Vice City Sunset design system
   Palette: night violet base · pink→orange→violet sunset gradient
   Type: Bebas Neue (display) · Mr Dafoe (neon script) · Inter (body)
   ═══════════════════════════════════════════════════════════════ */
:scope{
  /* channel values so translucent surfaces can follow the theme */
  --night-rgb:11,6,20;
  --dusk2-rgb:15,9,27;
  --deep-rgb:20,12,35;
  --card-rgb:26,16,46;
  --card2-rgb:34,21,65;
  --text-rgb:244,238,251;
  --sky-mid:var(--bg);
  --sky-far:var(--bg-2);

  --night:var(--bg);
  --dusk:var(--bg);
  --card:var(--surface);
  --card-2:var(--bg-2);
  --line:rgba(var(--text-rgb),.09);
  --line-strong:rgba(var(--text-rgb),.16);

  --pink:var(--coral);
  --orange:var(--coral-2);
  --violet:var(--blue);
  --teal:var(--teal);

  --text:var(--ink);
  --muted:var(--mute);
  --faint:var(--mute);

  --grad:linear-gradient(100deg,var(--coral-2) 0%,var(--coral) 52%,var(--blue) 100%);
  --grad-soft:linear-gradient(100deg,rgba(198,51,31,.16),rgba(255,90,69,.16) 52%,rgba(159,176,255,.16));

  --font-display:"Bebas Neue",Impact,sans-serif;
  --font-script:"Mr Dafoe",cursive;
  --font-body:"Inter",system-ui,-apple-system,sans-serif;

  --nav-h:64px;
  --tab-h:60px;
  --radius:16px;
  --radius-sm:10px;
  --wrap:1140px;
}
*{margin:0;padding:0;box-sizing:border-box}
:scope{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
:scope{
  background:var(--night);
  color:var(--text);
  font-family:var(--font-body);
  font-size:16px;line-height:1.65;
  overflow-x:hidden;
  padding-top:var(--nav-h);
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
::selection{background:var(--pink);color:var(--ink)}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 22px}
/* ── Skip link ─────────────────────────────────────────────── */
.skip-link{position:fixed;top:-60px;left:16px;z-index:300;background:var(--card-2);
  padding:10px 18px;border-radius:8px;border:1px solid var(--line-strong);transition:top .2s}
.skip-link:focus{top:12px}
/* ═══ TOP NAV ══════════════════════════════════════════════════ */
/* ═══ ANNOUNCEMENT BAR ═════════════════════════════════════════ */
.announce-bar{
  position:relative;z-index:1;
  background:linear-gradient(100deg,rgba(198,51,31,.16),rgba(255,90,69,.22) 50%,rgba(159,176,255,.16));
  border-bottom:1px solid var(--line-strong);
}
.announce-bar.alt{
  background:linear-gradient(100deg,rgba(159,176,255,.2),rgba(47,181,184,.16) 50%,rgba(159,176,255,.2));
}
.announce-inner{
  display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;
  padding:11px 22px;font-size:13.5px;color:var(--text);text-align:center;position:relative;
}
.announce-badge{
  display:inline-flex;align-items:center;flex-shrink:0;padding:3px 11px;border-radius:99px;
  background:var(--grad);color:var(--ink);font-weight:700;font-size:11px;letter-spacing:.09em;
  text-transform:uppercase;animation:announce-flash 1.6s ease-in-out infinite;
  -webkit-text-stroke:.6px var(--surface);paint-order:stroke fill;text-shadow:0 0 3px rgba(236,230,217,.6);
}
.announce-badge.alt{
  background:linear-gradient(100deg,var(--violet),var(--teal));
  animation:announce-flash-alt 1.6s ease-in-out infinite;
}
@keyframes announce-flash{
  0%,100%{opacity:1;box-shadow:0 0 12px rgba(255,90,69,.65)}
  50%{opacity:.5;box-shadow:0 0 2px rgba(255,90,69,.15)}
}
@keyframes announce-flash-alt{
  0%,100%{opacity:1;box-shadow:0 0 12px rgba(159,176,255,.6)}
  50%{opacity:.5;box-shadow:0 0 2px rgba(159,176,255,.15)}
}
.announce-text{max-width:640px}
.announce-pill{
  display:inline-flex;align-items:center;flex-shrink:0;gap:4px;
  padding:5px 14px;border-radius:99px;
  background:var(--grad);color:var(--ink);font-weight:600;font-size:12.5px;white-space:nowrap;
  -webkit-text-stroke:.6px var(--surface);paint-order:stroke fill;
  text-shadow:0 0 3px rgba(236,230,217,.6);
  transition:transform .15s,box-shadow .2s;
}
.announce-pill:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(255,90,69,.45);color:var(--ink)}
.announce-pill:active{transform:scale(.96)}
@media(prefers-reduced-motion:reduce){.announce-badge{animation:none}}
@media(max-width:520px){.announce-inner{padding:10px 16px}}
.nav{
  position:fixed;inset:0 0 auto 0;height:var(--nav-h);z-index:200;
  display:flex;align-items:center;gap:28px;
  padding:0 clamp(16px,3vw,36px);
  background:rgba(var(--night-rgb),.82);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.nav::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:var(--grad);opacity:.55}
.brand{display:flex;align-items:center;gap:2px;font-family:var(--font-display);
  font-size:26px;letter-spacing:.04em;line-height:1;white-space:nowrap}
.brand .stars{display:inline-flex;gap:1px;margin:0 6px;transform:translateY(-2px)}
.brand .stars span{
  font-size:13px;color:var(--coral);
  animation:star-pulse 2.6s ease-in-out infinite;
}
.brand .stars span:nth-child(1){color:var(--coral-2);animation-delay:0s}
/* orange */
.brand .stars span:nth-child(2){color:var(--ink);animation-delay:.12s}
/* red-orange */
.brand .stars span:nth-child(3){color:var(--coral);animation-delay:.24s}
/* pink */
.brand .stars span:nth-child(4){color:var(--ink);animation-delay:.36s}
/* magenta */
.brand .stars span:nth-child(5){color:var(--ink-2);animation-delay:.48s}
/* violet */
.brand .stars span:nth-child(6){color:var(--blue);animation-delay:.60s}
/* blue-violet */
@keyframes star-pulse{
  0%,100%{opacity:.78;filter:drop-shadow(0 0 3px currentColor);transform:scale(1)}
  50%    {opacity:1;  filter:drop-shadow(0 0 7px currentColor);transform:scale(1.12)}
}
@media(prefers-reduced-motion:reduce){
  .brand .stars span{animation:none;opacity:1;filter:drop-shadow(0 0 4px currentColor)}
}
.brand .w2{color:var(--muted)}
.nav-links{display:flex;gap:4px;margin-left:auto}
.nav-links a{
  position:relative;
  padding:8px 14px;border-radius:99px;font-size:14px;font-weight:500;color:var(--muted);
  transition:color .15s,background .15s;
}
.nav-links a::after{content:"";position:absolute;left:14px;right:100%;bottom:6px;height:2px;border-radius:2px;
  background:var(--grad);transition:right .25s ease}
.nav-links a:hover{color:var(--text);background:rgba(var(--text-rgb),.06)}
.nav-links a:hover::after{right:14px}
.nav-links a[aria-current="page"]{color:var(--text);background:var(--grad-soft);
  box-shadow:inset 0 0 0 1px var(--line-strong)}
.nav-links a .soon{font-size:10px;color:var(--orange);vertical-align:super;margin-left:2px;white-space:nowrap}
/* ── RDR2 pill: ember instead of neon ─────────────────────────── */
.nav-pill~.nav-pill{margin-left:0}
.nav-pill.rdr{
  color:var(--ink);
  background:linear-gradient(100deg,#FF5A5A,#F01440 55%,var(--surface));
  animation:rdr-glow 2.8s ease-in-out infinite}
.nav-pill.rdr .np-sub{color:var(--ink)}
.nav-pill.rdr .np-dot{background:var(--surface);box-shadow:0 0 9px rgba(236,230,217,.95)}
.nav-pill.rdr:hover{color:var(--ink);
  background:linear-gradient(100deg,#FF6E6E,#FF1E50 55%,var(--surface));
  filter:brightness(1.06);transform:translateY(-1px)}
.nav-pill.rdr:hover .np-sub{color:var(--ink)}
.nav-pill.rdr[aria-current="page"]{color:var(--ink);
  background:linear-gradient(100deg,#FF5A5A,#F01440 55%,var(--surface))}
.nav-pill.rdr[aria-current="page"] .np-sub{color:var(--ink)}
.nav-pill.rdr[aria-current="page"] .np-dot{background:var(--surface)}
/* the white highline: a constant bright ring, with a crimson-and-white
   glow that breathes around it */
@keyframes rdr-glow{
  0%,100%{box-shadow:inset 0 0 0 1.5px rgba(236,230,217,.9),0 0 10px rgba(240,20,64,.55),0 0 4px rgba(236,230,217,.35)}
  50%{box-shadow:inset 0 0 0 1.5px var(--ink),0 0 22px rgba(240,20,64,.95),0 0 9px rgba(236,230,217,.6)}}
@media(prefers-reduced-motion:reduce){.nav-pill.rdr{animation:none;
  box-shadow:inset 0 0 0 1.5px rgba(236,230,217,.9),0 0 16px rgba(240,20,64,.7),0 0 6px rgba(236,230,217,.45)}}
/* ── Top-bar game pill (GTA V) ─────────────────────────────────────
   Sits outside .nav-links on purpose: the links collapse into the
   bottom tab bar under 820px, the pill stays in the top bar on every
   screen size. */
.nav-pill{
  display:inline-flex;align-items:center;gap:8px;flex-shrink:0;
  padding:8px 15px;border-radius:999px;white-space:nowrap;
  font-family:var(--font-display);font-size:15px;letter-spacing:.09em;line-height:1;
  text-transform:uppercase;color:var(--text);
  background:var(--grad-soft);box-shadow:inset 0 0 0 1px var(--line-strong);
  transition:transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .18s,background .18s,color .18s}
.nav-pill .np-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;
  background:var(--grad);box-shadow:0 0 8px rgba(255,90,69,.75)}
.nav-pill .np-sub{font-family:var(--font-body);font-size:10.5px;font-weight:600;
  letter-spacing:.02em;text-transform:none;color:var(--muted);transition:color .18s}
.nav-pill:hover{color:var(--ink);background:var(--grad);transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(255,90,69,.42)}
.nav-pill:hover .np-sub{color:var(--ink)}
.nav-pill:hover .np-dot{background:var(--surface);box-shadow:0 0 8px rgba(236,230,217,.85)}
.nav-pill:active{transform:scale(.97)}
.nav-pill:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
.nav-pill[aria-current="page"]{color:var(--ink);background:var(--grad);
  box-shadow:0 4px 14px rgba(255,90,69,.32)}
.nav-pill[aria-current="page"] .np-sub{color:var(--ink)}
.nav-pill[aria-current="page"] .np-dot{background:var(--surface)}
@media(max-width:820px){.nav-pill{margin-left:auto}}
@media(max-width:520px){.nav-pill .np-sub{display:none}.nav-pill{padding:7px 13px;gap:7px}}
@media(max-width:400px){.nav-pill{font-size:13px;letter-spacing:.06em;padding:6px 11px}}
@media(prefers-reduced-motion:reduce){.nav-pill{transition:none}}
@keyframes pulse{50%{opacity:.35}}
/* ═══ MOBILE BOTTOM TAB BAR ════════════════════════════════════ */
.tabbar{
  position:fixed;left:0;right:0;bottom:0;z-index:200;
  display:none;
  height:calc(var(--tab-h) + env(safe-area-inset-bottom,0px));
  padding:0 4px env(safe-area-inset-bottom,0px);
  background:rgba(var(--dusk2-rgb),.92);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-top:1px solid var(--line);
}
.tabbar::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;
  background:var(--grad);opacity:.5}
.tabbar a{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  font-size:10px;font-weight:500;letter-spacing:.02em;color:var(--faint);
  -webkit-tap-highlight-color:transparent;
}
.tabbar svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round}
.tabbar a[aria-current="page"]{color:var(--text)}
.tabbar a[aria-current="page"] svg{
  stroke:url(/assets/#tabGrad);filter:drop-shadow(0 0 6px rgba(255,90,69,.6))}
/* ═══ HERO ═════════════════════════════════════════════════════ */
.hero{
  position:relative;overflow:hidden;
  min-height:calc(100svh - var(--nav-h));
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:56px 22px 80px;
  isolation:isolate;
}
.hero.short{min-height:auto;padding:72px 22px 56px}
/* Signature: striped Vice City sun over a horizon */
.hero-sky{position:absolute;inset:0;z-index:-3;
  background:
    radial-gradient(120% 90% at 50% 108%,rgba(255,90,69,.32),rgba(198,51,31,.12) 38%,transparent 66%),
    linear-gradient(180deg,var(--night) 0%,var(--sky-mid) 55%,var(--sky-far) 100%);
}
.hero-sun{
  position:absolute;z-index:-2;left:50%;bottom:-70px;transform:translateX(-50%);
  width:min(430px,86vw);aspect-ratio:1;border-radius:50%;
  background:linear-gradient(180deg,var(--orange) 0%,var(--pink) 58%,var(--violet) 100%);
  -webkit-mask:repeating-linear-gradient(180deg,var(--surface) 0 6.5%,transparent 6.5% 9%) ,
               linear-gradient(var(--surface) 0 0);
  -webkit-mask-composite:source-in;
  mask:repeating-linear-gradient(180deg,var(--surface) 0 6.5%,transparent 6.5% 9%);
  filter:drop-shadow(0 0 60px rgba(255,90,69,.5)) drop-shadow(0 0 130px rgba(159,176,255,.4));
  animation:sunrise 2.4s cubic-bezier(.2,.7,.2,1) both;
}
@keyframes sunrise{from{transform:translateX(-50%) translateY(90px);opacity:0}}
.hero-horizon{position:absolute;z-index:-1;left:0;right:0;bottom:0;height:120px;
  background:linear-gradient(180deg,transparent,rgba(var(--night-rgb),.94) 55%,var(--night))}
.hero-palms{position:absolute;z-index:-1;bottom:-4px;left:0;right:0;height:150px;pointer-events:none}
.hero-palms svg{width:100%;height:100%}
.eyebrow-script{
  font-family:var(--font-script);font-size:clamp(24px,4vw,34px);font-weight:400;
  color:var(--teal);text-shadow:0 0 14px rgba(47,181,184,.55),0 0 44px rgba(47,181,184,.3);
  transform:rotate(-3deg);margin-bottom:2px;
}
.hero-title{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(56px,11vw,128px);line-height:.94;letter-spacing:.015em;
  text-wrap:balance;
}
.hero-title .vi{
  background:linear-gradient(100deg,var(--coral-2),var(--coral) 40%,var(--blue) 70%,var(--coral) 100%);
  background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 4px 26px rgba(255,90,69,.45));
  animation:grad-flow 5s ease-in-out infinite;
}
@keyframes grad-flow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.hero-tagline{margin-top:14px;color:var(--muted);font-size:clamp(14px,1.8vw,17px);
  letter-spacing:.14em;text-transform:uppercase}
.hero-tagline b{color:var(--text);font-weight:600}
/* ═══ COUNTDOWN ════════════════════════════════════════════════ */
.countdown{display:flex;gap:clamp(8px,2vw,18px);margin:34px 0 10px;justify-content:center}
.cd-cell{
  min-width:clamp(66px,17vw,112px);
  padding:clamp(12px,2.4vw,20px) 6px clamp(10px,2vw,16px);
  border-radius:var(--radius);
  background:linear-gradient(180deg,rgba(var(--card2-rgb),.85),rgba(var(--deep-rgb),.85));
  border:1px solid var(--line-strong);
  box-shadow:0 14px 40px rgba(236,230,217,.45),inset 0 1px 0 rgba(236,230,217,.06);
  backdrop-filter:blur(6px);
}
.cd-num{font-family:var(--font-display);font-weight:400;
  font-size:clamp(38px,8.5vw,66px);line-height:1;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;
  font-variant-numeric:tabular-nums}
.cd-label{margin-top:5px;font-size:clamp(9px,1.4vw,11px);letter-spacing:.24em;
  text-transform:uppercase;color:var(--muted)}
.cd-note{color:var(--faint);font-size:13px;margin-top:8px}
/* ═══ BUTTONS ══════════════════════════════════════════════════ */
.btn-row{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:26px}
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:13px 26px;border-radius:99px;
  font-weight:600;font-size:15px;letter-spacing:.01em;
  transition:transform .15s,box-shadow .15s,background .15s,border-color .15s;
  -webkit-tap-highlight-color:transparent;
}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--grad);color:var(--ink);
  box-shadow:0 8px 26px rgba(255,90,69,.4)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 34px rgba(255,90,69,.55)}
.btn-ghost{border:1px solid var(--line-strong);color:var(--text);background:rgba(var(--card-rgb),.5)}
.btn-ghost:hover{border-color:var(--pink);background:rgba(255,90,69,.08)}
.btn-sm{padding:9px 18px;font-size:13.5px}
/* ═══ SECTIONS ═════════════════════════════════════════════════ */
.section{padding:clamp(56px,9vw,104px) 0;position:relative}
.section-alt{background:var(--dusk)}
.section-head{max-width:720px;margin-bottom:clamp(28px,5vw,48px)}
.section-head.center{margin-inline:auto;text-align:center}
.sec-eyebrow{font-family:var(--font-script);font-size:clamp(20px,3vw,27px);color:var(--pink);
  text-shadow:0 0 16px rgba(255,90,69,.5);transform:rotate(-2deg);display:inline-block;margin-bottom:4px}
.sec-title{font-family:var(--font-display);font-weight:400;
  font-size:clamp(34px,6vw,56px);line-height:1;letter-spacing:.02em}
.sec-sub{color:var(--muted);margin-top:12px;font-size:15.5px;max-width:640px}
.section-head.center .sec-sub{margin-inline:auto}
.sunset-rule{height:2px;border:none;background:var(--grad);opacity:.7;border-radius:2px;
  width:72px;margin:18px 0 0}
.section-head.center .sunset-rule{margin-inline:auto}
/* ═══ CARDS & GRIDS ════════════════════════════════════════════ */
.grid{display:grid;gap:18px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:980px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}
.card{
  background:linear-gradient(180deg,var(--card),rgba(var(--deep-rgb),.9));
  border:1px solid var(--line);border-radius:var(--radius);
  padding:24px;position:relative;overflow:hidden;
  transition:transform .18s,border-color .18s,box-shadow .18s;
}
.card:hover{transform:translateY(-3px);border-color:var(--line-strong);
  box-shadow:0 16px 40px rgba(236,230,217,.4)}
.card-top{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:var(--grad);
  opacity:0;transition:opacity .18s}
.card:hover .card-top{opacity:1}
.card h3{font-family:var(--font-display);font-weight:400;font-size:24px;letter-spacing:.03em;
  margin-bottom:6px}
.card p{color:var(--muted);font-size:14.5px}
.card .meta{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);
  margin-bottom:10px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.card .emoji{font-size:26px;line-height:1;margin-bottom:12px;display:block}
/* Tags / badges */
.tag{display:inline-block;padding:3px 11px;border-radius:99px;font-size:11px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase}
.tag-confirmed{background:rgba(47,181,184,.12);color:var(--teal);border:1px solid rgba(47,181,184,.35)}
.tag-community{background:rgba(198,51,31,.12);color:var(--orange);border:1px solid rgba(198,51,31,.35)}
.tag-spec{background:rgba(159,176,255,.14);color:var(--ink-2);border:1px solid rgba(159,176,255,.4)}
.tag-locked{background:rgba(var(--text-rgb),.06);color:var(--muted);border:1px solid var(--line-strong)}
.tag-live{background:rgba(255,90,69,.14);color:var(--pink);border:1px solid rgba(255,90,69,.4)}
/* Stat strip */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:36px}
@media(max-width:720px){.stats{grid-template-columns:repeat(2,1fr)}}
.stat{background:rgba(var(--card-rgb),.6);border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:16px 18px;text-align:left}
.stat .k{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}
.stat .v{font-family:var(--font-display);font-size:clamp(22px,3vw,30px);letter-spacing:.03em;
  margin-top:4px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
/* Filter chips */
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0 26px}
.chip{padding:8px 18px;border-radius:99px;font-size:13.5px;font-weight:500;color:var(--muted);
  border:1px solid var(--line-strong);background:rgba(var(--card-rgb),.5);transition:all .15s}
.chip:hover{color:var(--text);border-color:var(--pink)}
.chip.active{background:var(--grad);color:var(--ink);border-color:transparent;
  box-shadow:0 4px 16px rgba(255,90,69,.4)}
/* ═══ MEDIA / GALLERY ══════════════════════════════════════════ */
.video-frame{position:relative;border-radius:var(--radius);overflow:hidden;
  border:1px solid var(--line-strong);background:var(--bg-2);aspect-ratio:16/9;
  box-shadow:0 18px 50px rgba(236,230,217,.5)}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-cap{margin-top:12px}
.video-cap b{font-size:15px}
.video-cap span{display:block;color:var(--faint);font-size:13px;margin-top:2px}
.shots-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
@media(max-width:520px){.shots-grid{grid-template-columns:repeat(2,1fr);gap:8px}}
.shot{position:relative;border-radius:var(--radius-sm);overflow:hidden;cursor:pointer;
  aspect-ratio:16/9;background:var(--card);border:1px solid var(--line);
  transition:transform .18s,border-color .18s}
.shot img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.shot:hover{transform:translateY(-3px);border-color:var(--pink)}
.shot:hover img{transform:scale(1.05)}
.shot .lbl{position:absolute;inset:auto 0 0 0;padding:22px 12px 9px;font-size:12px;font-weight:500;
  background:linear-gradient(transparent,rgba(236,230,217,.9));opacity:0;transition:opacity .18s}
.shot:hover .lbl,.shot:focus-visible .lbl{opacity:1}
@media(hover:none){.shot .lbl{opacity:1;font-size:10.5px}}
/* Lightbox */
.lightbox{position:fixed;inset:0;z-index:400;display:none;align-items:center;justify-content:center;
  background:rgba(236,230,217,.95);backdrop-filter:blur(10px);padding:20px}
.lightbox.open{display:flex}
.lightbox img{max-width:min(1400px,94vw);max-height:82svh;border-radius:12px;
  box-shadow:0 30px 90px rgba(236,230,217,.7)}
.lb-cap{position:absolute;bottom:calc(22px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);
  color:var(--muted);font-size:13px;white-space:nowrap;display:flex;gap:14px;align-items:center}
.lb-cap b{color:var(--text)}
.lb-btn{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;
  background:rgba(var(--card-rgb),.8);border:1px solid var(--line-strong);color:var(--text);
  font-size:20px;display:flex;align-items:center;justify-content:center;transition:all .15s}
.lb-btn:hover{background:var(--pink);border-color:transparent}
.lb-prev{left:max(14px,env(safe-area-inset-left))}
.lb-next{right:max(14px,env(safe-area-inset-right))}
.lb-close{position:absolute;top:16px;right:16px;width:44px;height:44px;border-radius:50%;
  background:rgba(var(--card-rgb),.8);border:1px solid var(--line-strong);font-size:17px;
  display:flex;align-items:center;justify-content:center}
.lb-close:hover{background:var(--pink)}
@media(max-width:640px){.lb-btn{width:42px;height:42px;top:auto;bottom:64px;transform:none}}
/* ═══ NEWS LIST ════════════════════════════════════════════════ */
.news-list{display:grid;gap:12px}
.news-item{display:flex;gap:16px;align-items:baseline;padding:17px 20px;border-radius:var(--radius-sm);
  background:rgba(var(--card-rgb),.5);border:1px solid var(--line);transition:border-color .15s,background .15s}
.news-item:hover{border-color:var(--pink);background:rgba(255,90,69,.06)}
.news-item .src{flex-shrink:0;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--orange);min-width:86px}
.news-item .t{font-size:15px;font-weight:500;line-height:1.45}
.news-item .d{margin-left:auto;flex-shrink:0;font-size:12px;color:var(--faint);white-space:nowrap}
@media(max-width:620px){
  .news-item{flex-direction:column;gap:5px}
  .news-item .d{margin-left:0}
}
.news-empty{padding:30px;text-align:center;color:var(--muted);border:1px dashed var(--line-strong);
  border-radius:var(--radius-sm);font-size:14.5px}
/* ═══ PLATFORMS ════════════════════════════════════════════════ */
.platform{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.platform .name{font-family:var(--font-display);font-size:26px;letter-spacing:.03em}
.platform .status{font-size:13px;color:var(--muted)}
/* ═══ FORMS ════════════════════════════════════════════════════ */
.field{display:flex;flex-direction:column;gap:7px;margin-bottom:18px}
.field label{font-size:13px;font-weight:600;letter-spacing:.04em;color:var(--muted)}
.field input,.field textarea{
  background:rgba(var(--night-rgb),.7);border:1px solid var(--line-strong);border-radius:var(--radius-sm);
  padding:13px 16px;color:var(--text);font:inherit;font-size:15px;transition:border-color .15s;
  width:100%;
}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--pink);
  box-shadow:0 0 0 3px rgba(255,90,69,.18)}
.field textarea{min-height:150px;resize:vertical}
/* ═══ THREAD PREVIEW (forums) ══════════════════════════════════ */
.thread{display:flex;gap:14px;align-items:center;padding:16px 20px;border-radius:var(--radius-sm);
  background:rgba(var(--card-rgb),.5);border:1px solid var(--line)}
.thread .avatar{width:40px;height:40px;flex-shrink:0;border-radius:50%;background:var(--grad);
  display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:17px}
.thread .t{font-weight:600;font-size:15px}
.thread .m{font-size:12.5px;color:var(--faint);margin-top:2px}
.thread .replies{margin-left:auto;text-align:right;flex-shrink:0;font-size:12px;color:var(--muted)}
/* ═══ FAQ ══════════════════════════════════════════════════════ */
details.faq{border:1px solid var(--line);border-radius:var(--radius-sm);background:rgba(var(--card-rgb),.5);
  margin-bottom:10px;overflow:hidden}
details.faq summary{padding:17px 20px;cursor:pointer;font-weight:600;font-size:15px;list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:12px}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+";font-family:var(--font-display);font-size:22px;color:var(--pink);
  transition:transform .2s}
details.faq[open] summary::after{transform:rotate(45deg)}
details.faq .a{padding:0 20px 18px;color:var(--muted);font-size:14.5px}
/* ═══ FOOTER ═══════════════════════════════════════════════════ */
footer{border-top:1px solid var(--line);background:var(--dusk);
  padding:52px 0 calc(40px + var(--tab-h) + env(safe-area-inset-bottom,0px));margin-top:20px;
  position:relative;overflow:hidden}
footer::before{content:"";position:absolute;top:-1px;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--coral-2),var(--coral) 35%,var(--blue) 65%,var(--coral-2));
  background-size:200% 100%;opacity:.7;
  box-shadow:0 0 24px rgba(255,90,69,.4);
  animation:grad-flow 6s ease-in-out infinite}
footer::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(420px 220px at 50% -60px,rgba(255,90,69,.14),transparent 70%),
    radial-gradient(360px 220px at 0% 100%,rgba(159,176,255,.11),transparent 70%),
    radial-gradient(360px 220px at 100% 100%,rgba(47,181,184,.09),transparent 70%)}
footer>.wrap{position:relative;z-index:1}
.foot-brand{font-family:var(--font-display);font-size:26px;letter-spacing:.04em;margin-bottom:16px;
  display:flex;align-items:center;width:fit-content;text-decoration:none;color:var(--text);
  transition:filter .25s}
.foot-brand:hover{filter:drop-shadow(0 0 16px rgba(255,90,69,.45))}
.foot-brand .stars{display:inline-flex;gap:1px;margin:0 7px;transform:translateY(-2px)}
.foot-brand .stars span{font-size:14px;animation:star-pulse 2.6s ease-in-out infinite}
.foot-brand .stars span:nth-child(1){color:var(--coral-2);animation-delay:0s}
.foot-brand .stars span:nth-child(2){color:var(--ink);animation-delay:.12s}
.foot-brand .stars span:nth-child(3){color:var(--coral);animation-delay:.24s}
.foot-brand .stars span:nth-child(4){color:var(--ink);animation-delay:.36s}
.foot-brand .stars span:nth-child(5){color:var(--ink-2);animation-delay:.48s}
.foot-brand .stars span:nth-child(6){color:var(--blue);animation-delay:.60s}
.foot-brand .w2{color:var(--muted)}
@media(prefers-reduced-motion:reduce){.foot-brand .stars span{animation:none;opacity:1;filter:drop-shadow(0 0 4px currentColor)}}
.foot-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:26px}
@media(max-width:720px){.foot-grid{grid-template-columns:1fr}}
.foot-block{
  position:relative;padding:16px 18px 16px 20px;border-radius:12px;overflow:hidden;
  background:linear-gradient(180deg,rgba(var(--text-rgb),.03),transparent);
  border:1px solid var(--line);transition:border-color .2s,transform .2s,background .2s;
}
.foot-block::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--grad);opacity:0;transition:opacity .25s}
.foot-block:hover{border-color:var(--line-strong);transform:translateY(-2px);
  background:linear-gradient(180deg,rgba(var(--text-rgb),.05),transparent)}
.foot-block:hover::before{opacity:1}
.foot-block h4{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange);margin-bottom:7px;
  display:flex;align-items:center;gap:6px}
.foot-block h4::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--orange);
  box-shadow:0 0 6px var(--orange);flex-shrink:0}
.foot-block p,footer>.wrap>p{color:var(--faint);font-size:13px;line-height:1.7}
.foot-copy{margin-top:32px;padding-top:20px;border-top:1px solid var(--line);color:var(--faint);font-size:12.5px;
  display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.foot-copy::before{content:"\2605";color:var(--pink);font-size:12px;filter:drop-shadow(0 0 5px rgba(255,90,69,.6))}
.foot-top{display:flex;justify-content:center;margin-top:28px}
.foot-top-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 20px;border-radius:99px;
  border:1px solid var(--line-strong);background:rgba(var(--text-rgb),.04);
  color:var(--muted);font-size:12.5px;font-weight:600;letter-spacing:.05em;
  transition:color .2s,border-color .2s,background .2s,transform .2s;
}
.foot-top-btn:hover{color:var(--text);border-color:var(--pink);background:rgba(255,90,69,.08);transform:translateY(-2px)}
.foot-top-btn:active{transform:translateY(0) scale(.97)}
.foot-top-btn .arrow{display:inline-block;animation:foot-top-bob 2s ease-in-out infinite}
@keyframes foot-top-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.foot-top-btn .arrow{animation:none}}
@media(min-width:821px){footer{padding-bottom:44px}}
/* ═══ REVEAL ═══════════════════════════════════════════════════ */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
/* directional variants */
.reveal.from-left{transform:translateX(-32px)}
.reveal.from-right{transform:translateX(32px)}
.reveal.zoom-in{transform:scale(.92)}
.reveal.from-left.in,.reveal.from-right.in,.reveal.zoom-in.in{transform:none}
/* stagger: JS sets --i on grouped children; delay cascades the entrance */
.reveal{transition-delay:calc(var(--i,0) * 70ms)}
/* ═══════════════════════════════════════════════════════════════
   COME ALIVE — ambient motion + hover/tap micro-interactions
   ═══════════════════════════════════════════════════════════════ */
/* ── Ambient: the hero sun gently breathes and drifts ─────────── */
@keyframes sun-breathe{
  0%,100%{filter:drop-shadow(0 0 60px rgba(255,90,69,.5)) drop-shadow(0 0 130px rgba(159,176,255,.4))}
  50%    {filter:drop-shadow(0 0 78px rgba(255,90,69,.62)) drop-shadow(0 0 165px rgba(159,176,255,.5))}
}
@keyframes sun-drift{
  0%,100%{transform:translateX(-50%) translateY(0)}
  50%    {transform:translateX(-50%) translateY(-10px)}
}
.hero-sun{animation:sunrise 2.4s cubic-bezier(.2,.7,.2,1) both, sun-breathe 6s ease-in-out 2.4s infinite}
.hero-sun::after{content:"";position:absolute;inset:0;border-radius:50%;
  animation:sun-drift 9s ease-in-out 2.4s infinite}
.dash-bg .hero-sun{animation:sunrise 2.4s cubic-bezier(.2,.7,.2,1) both, sun-breathe 6s ease-in-out 2.4s infinite, sun-drift 9s ease-in-out 2.4s infinite}
/* ── Ambient: floating embers drifting up over the hero ───────── */
.embers{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.ember{position:absolute;bottom:-12px;width:5px;height:5px;border-radius:50%;
  background:radial-gradient(circle,rgba(198,51,31,.9),rgba(255,90,69,.3) 60%,transparent 70%);
  opacity:0;animation:ember-rise linear infinite}
@keyframes ember-rise{
  0%{opacity:0;transform:translateY(0) translateX(0) scale(.6)}
  12%{opacity:.9}
  85%{opacity:.5}
  100%{opacity:0;transform:translateY(-78vh) translateX(var(--drift,20px)) scale(1)}
}
/* ── Cards: springy lift + cursor-follow tilt + sheen ─────────── */
.card{transition:transform .28s cubic-bezier(.2,.8,.2,1),border-color .28s,box-shadow .28s;
  transform-style:preserve-3d;will-change:transform}
.card:hover{transform:translateY(-5px)}
.card.tilt{transition:transform .12s ease-out,border-color .28s,box-shadow .28s}
.card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(180px circle at var(--mx,50%) var(--my,0%),rgba(236,230,217,.10),transparent 60%);
  opacity:0;transition:opacity .3s}
.card:hover::after{opacity:1}
/* ── Buttons: gentle magnetic pull + sheen sweep ──────────────── */
.btn{position:relative;overflow:hidden;transition:transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .25s,border-color .2s,background .2s}
.btn::before{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(236,230,217,.28),transparent);
  transform:skewX(-18deg);transition:left .55s ease}
.btn:hover::before{left:140%}
/* ── Chips: press + pop ───────────────────────────────────────── */
.chip{transition:transform .18s cubic-bezier(.2,.8,.2,1),color .2s,border-color .2s,background .2s}
.chip:hover{transform:translateY(-2px)}
.chip:active{transform:translateY(0) scale(.95)}
.chip.active{animation:chip-pop .3s ease}
@keyframes chip-pop{0%{transform:scale(.9)}55%{transform:scale(1.08)}100%{transform:scale(1)}}
/* ── Mini-cards (home dashboard): lift + icon bounce ──────────── */
.mini-card{transition:transform .24s cubic-bezier(.2,.8,.2,1),border-color .24s}
.mini-card:hover{transform:translateY(-4px)}
.mini-card:hover .ic{animation:icon-bounce .5s ease}
@keyframes icon-bounce{0%,100%{transform:translateY(0)}40%{transform:translateY(-5px)}70%{transform:translateY(-2px)}}
.mini-card:active{transform:translateY(-1px) scale(.99)}
/* ── Logo stars: hover makes the whole row shimmer brighter ───── */
.brand:hover .stars span{animation-duration:1.1s}
.brand .stars span{transition:filter .2s}
/* ── Universal tap ripple (added by JS on press) ──────────────── */
.ripple{position:absolute;border-radius:50%;transform:scale(0);pointer-events:none;
  background:radial-gradient(circle,rgba(236,230,217,.45),transparent 70%);
  animation:ripple-out .6s ease-out forwards;z-index:2}
@keyframes ripple-out{to{transform:scale(2.4);opacity:0}}
/* ── FAQ / details: smooth marker rotate ──────────────────────── */
details.faq summary{transition:color .2s}
details.faq summary::-webkit-details-marker{display:none}
/* ── Tab bar (mobile): active tap feedback ────────────────────── */
.tabbar a{transition:transform .16s cubic-bezier(.2,.8,.2,1),color .2s}
.tabbar a:active{transform:scale(.9)}
.tabbar a[aria-current="page"] svg{animation:tab-pop .4s ease}
@keyframes tab-pop{0%{transform:scale(.8)}60%{transform:scale(1.18)}100%{transform:scale(1)}}
/* ── Neon flicker on the script eyebrows ──────────────────────── */
@keyframes neon-flicker{
  0%,100%{opacity:1;text-shadow:0 0 14px rgba(47,181,184,.55),0 0 44px rgba(47,181,184,.3)}
  50%{opacity:1;text-shadow:0 0 20px rgba(47,181,184,.85),0 0 60px rgba(47,181,184,.5)}
  52%{opacity:.72;text-shadow:0 0 6px rgba(47,181,184,.4)}
  54%{opacity:1;text-shadow:0 0 22px rgba(47,181,184,.9),0 0 66px rgba(47,181,184,.55)}
}
.eyebrow-script,.dash-eyebrow{animation:neon-flicker 5.5s ease-in-out infinite}
/* ── Shooting star sweeping across the hero sky ───────────────── */
.shooting-star{position:absolute;top:12%;left:-8%;width:2px;height:2px;border-radius:50%;
  background:var(--surface);box-shadow:0 0 8px 2px rgba(236,230,217,.9);z-index:-1;opacity:0;
  animation:shoot 9s ease-in infinite}
.shooting-star::after{content:"";position:absolute;top:50%;right:0;width:120px;height:1px;
  transform:translateY(-50%);
  background:linear-gradient(90deg,transparent,rgba(236,230,217,.8))}
@keyframes shoot{
  0%{opacity:0;transform:translate(0,0) rotate(18deg)}
  3%{opacity:1}
  12%{opacity:1;transform:translate(70vw,24vh) rotate(18deg)}
  16%,100%{opacity:0;transform:translate(78vw,26vh) rotate(18deg)}
}
/* ── Countdown digits give a little kick each second (JS toggles) ─ */
.cd-num.tick,.dc-num.tick{animation:num-tick .45s cubic-bezier(.3,1.4,.5,1)}
@keyframes num-tick{0%{transform:translateY(0)}30%{transform:translateY(-4px) scale(1.06)}100%{transform:translateY(0)}}
/* ── Page-load orchestration: hero pieces enter in sequence ───── */
@keyframes rise-in{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.hero .eyebrow-script{animation:neon-flicker 5.5s ease-in-out infinite, rise-in .7s .1s both}
.hero .hero-title{animation:rise-in .8s .22s both}
.hero .hero-tagline{animation:rise-in .7s .38s both}
.hero .countdown{animation:rise-in .7s .52s both}
.hero .cd-note{animation:rise-in .7s .64s both}
.hero .btn-row{animation:rise-in .7s .76s both}
/* ── Card icons/emoji wiggle on hover ─────────────────────────── */
.card:hover .emoji{animation:wiggle .5s ease}
@keyframes wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-9deg)}75%{transform:rotate(9deg)}}
/* ── Brand: hover lifts + tints the WANTED word ───────────────── */
.brand{transition:transform .2s cubic-bezier(.2,.8,.2,1)}
.brand:hover{transform:scale(1.03)}
.brand .w2{transition:color .25s}
.brand:hover .w2{color:var(--text)}
/* ═══ RESPONSIVE NAV SWITCH ════════════════════════════════════ */
@media(max-width:820px){
  .nav-links{display:none}
  .tabbar{display:flex}
  :scope{padding-bottom:calc(var(--tab-h) + env(safe-area-inset-bottom,0px))}
  .brand{font-size:22px}
}
@media(max-width:400px){
  .brand{font-size:19px}
}
.shot{width:100%;text-align:left}
/* ═══ REDUCED MOTION ═══════════════════════════════════════════ */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
}
.dash-bg{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.dash-bg .hero-sky,.dash-bg .hero-sun,.dash-bg .hero-horizon,.dash-bg .hero-palms{position:absolute}
:scope.home{height:100svh;overflow:hidden;padding-bottom:0}
:scope.home.modal-open{overflow:hidden}
.dash{
  position:relative;z-index:1;
  height:calc(100svh - var(--nav-h));
  display:flex;flex-direction:column;
  gap:8px;
  padding:10px clamp(12px,2.4vw,28px) 8px;
}
@media(max-width:820px){
  .dash{height:calc(100dvh - var(--nav-h) - var(--tab-h) - env(safe-area-inset-bottom,0px));padding:6px 12px 4px}
}
.dash-main{
  flex:1 1 auto;min-height:0;
  display:flex;align-items:center;justify-content:center;
}
.dash-hero{
  min-height:0;display:flex;flex-direction:column;align-items:center;text-align:center;
  gap:clamp(10px,2vh,20px);max-width:900px;
}
.dash-eyebrow{
  font-family:var(--font-script);color:var(--teal);transform:rotate(-2deg);display:inline-block;
  font-size:clamp(16px,2.8vh,28px);text-shadow:0 0 12px rgba(47,181,184,.5);width:fit-content;
}
.dash-title{
  font-family:var(--font-display);font-weight:400;line-height:.92;letter-spacing:.015em;
  font-size:clamp(36px,9vh,110px);
}
.dash-title .vi{background:linear-gradient(100deg,var(--coral-2),var(--coral) 40%,var(--blue) 70%,var(--coral) 100%);
  background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 3px 18px rgba(255,90,69,.4));animation:grad-flow 5s ease-in-out infinite}
.dash-tagline{color:var(--muted);font-size:clamp(11px,1.6vh,16px);letter-spacing:.1em;text-transform:uppercase}
.dash-tagline b{color:var(--text)}
.dash-countdown{display:flex;gap:clamp(8px,1.4vw,16px);justify-content:center}
.dc-cell{
  min-width:clamp(64px,9vw,104px);
  padding:clamp(8px,1.6vh,16px) clamp(12px,1.6vw,20px);border-radius:12px;text-align:center;
  background:linear-gradient(180deg,rgba(var(--card2-rgb),.85),rgba(var(--deep-rgb),.85));
  border:1px solid var(--line-strong);box-shadow:0 8px 22px rgba(236,230,217,.4);
}
.dc-num{
  display:inline-block;width:auto;white-space:nowrap;
  font-family:var(--font-display);font-weight:400;font-size:clamp(24px,5.6vh,54px);line-height:1.12;
  padding:0 .1em .06em;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;
  font-variant-numeric:tabular-nums}
.dc-label{margin-top:2px;font-size:clamp(7px,1vh,10px);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.dash-cta{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.dash-cta .btn{padding:clamp(9px,1.6vh,14px) clamp(16px,2.2vw,24px);font-size:clamp(12px,1.7vh,15px)}
/* ── Horizontal news ticker ───────────────────────────────────── */
.ticker{
  flex-shrink:0;display:flex;align-items:stretch;
  height:clamp(30px,4.4vh,40px);border-radius:9px;overflow:hidden;
  border:1px solid var(--line);background:rgba(var(--deep-rgb),.8);
}
.ticker-label{
  flex-shrink:0;display:flex;align-items:center;gap:6px;padding:0 clamp(10px,1.6vw,16px);
  background:var(--grad);color:var(--ink);font-family:var(--font-display);font-weight:400;
  font-size:clamp(10px,1.3vh,12px);letter-spacing:.1em;white-space:nowrap;
}
.ticker-label .live-dot{width:6px;height:6px;border-radius:50%;background:var(--surface);animation:pulse 2s infinite}
.ticker-viewport{flex:1;overflow:hidden;position:relative;min-width:0}
.ticker-track{
  position:absolute;top:0;left:0;height:100%;display:flex;align-items:center;
  white-space:nowrap;will-change:transform;
  animation:ticker-scroll linear infinite;
}
.ticker-track:hover{animation-play-state:paused}
@keyframes ticker-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ticker-item{display:inline-flex;align-items:center;padding:0 22px;font-size:clamp(11px,1.5vh,13.5px);color:var(--muted)}
.ticker-item .src{color:var(--orange);font-weight:600;margin-right:7px;letter-spacing:.03em}
.ticker-item a{color:inherit}
.ticker-item a:hover{color:var(--text)}
.ticker-sep{color:var(--pink);margin:0 4px;opacity:.7}
@media(prefers-reduced-motion:reduce){.ticker-track{animation:none;position:static;overflow-x:auto}}
.dash-bottom{
  flex:0 0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
}
@media(max-width:820px){.dash-bottom{grid-template-columns:1fr 1fr}}
.mini-card{
  background:rgba(var(--card-rgb),.55);border:1px solid var(--line);border-radius:12px;
  padding:10px 12px;display:flex;align-items:center;gap:10px;transition:border-color .15s,transform .15s;
}
.mini-card:hover{border-color:var(--pink);transform:translateY(-2px)}
.mini-card .ic{font-size:clamp(16px,2.4vh,22px);flex-shrink:0}
.mini-card .lbl{font-size:clamp(11px,1.5vh,13px);font-weight:600;line-height:1.2}
.mini-card .sub{font-size:clamp(9px,1.2vh,11px);color:var(--faint);margin-top:1px}
.mini-platforms{display:flex;gap:6px;flex:1}
.mini-plat{
  flex:1;text-align:center;padding:6px 4px;border-radius:8px;background:rgba(var(--text-rgb),.04);
  border:1px solid var(--line);font-size:clamp(9px,1.2vh,11px);font-weight:600;
}
.mini-plat.live{color:var(--teal);border-color:#148385}
.mini-plat.tbd{color:var(--faint)}
@media(max-width:820px){
  .dash-explore-row{display:none}
}
/* ── Legal bar + modal (compact footer for no-scroll pages) ──── */
.legal-bar{
  flex-shrink:0;display:flex;align-items:center;gap:10px;justify-content:center;
  font-size:clamp(9px,1.1vh,11.5px);color:var(--faint);text-align:center;padding:0 6px;
  line-height:1.3;
}
.legal-bar button{
  color:var(--pink);font-weight:600;text-decoration:underline;text-underline-offset:2px;flex-shrink:0;
  font-size:inherit;
}
.modal{
  position:fixed;inset:0;z-index:500;display:none;align-items:center;justify-content:center;
  background:rgba(236,230,217,.85);backdrop-filter:blur(8px);padding:20px;
}
.modal.open{display:flex}
.modal-card{
  position:relative;max-width:640px;width:100%;max-height:82vh;overflow-y:auto;
  background:var(--card-2);border:1px solid var(--line-strong);border-radius:var(--radius);
  padding:32px 26px 26px;
}
.modal-close{
  position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;
  background:rgba(236,230,217,.06);border:1px solid var(--line-strong);display:flex;align-items:center;justify-content:center;
}
.modal-close:hover{background:var(--pink);border-color:transparent}
/* footer nav — mirrors the top-nav pill links */
.foot-nav{display:flex;flex-wrap:wrap;gap:4px;margin:18px 0 4px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.foot-nav a{position:relative;padding:8px 14px;border-radius:99px;font-size:14px;font-weight:500;
  color:var(--muted);text-decoration:none;transition:color .15s,background .15s}
.foot-nav a::after{content:"";position:absolute;left:14px;right:100%;bottom:6px;height:2px;border-radius:2px;
  background:var(--grad);transition:right .25s ease}
.foot-nav a:hover{color:var(--text);background:rgba(var(--text-rgb),.06)}
.foot-nav a:hover::after{right:14px}
.foot-nav a[aria-current="page"]{color:var(--text);background:var(--grad-soft);
  box-shadow:inset 0 0 0 1px var(--line-strong)}
.foot-nav a .soon{font-size:10px;color:var(--orange);vertical-align:super;margin-left:2px;white-space:nowrap}
/* ── Footer redesign: the logo takes the stage, everything centres ── */
.foot-brand-img{display:block;width:min(460px,86%);margin:0 auto 4px;font-size:0}
.foot-brand-img img{width:100%;height:auto;display:block}
.foot-brand-img:hover{filter:drop-shadow(0 0 18px rgba(255,90,69,.35))}
footer .foot-nav{justify-content:center}
footer .foot-nav + p{text-align:center;max-width:720px;margin-left:auto;margin-right:auto}
.foot-copy{text-align:center}
@media(prefers-reduced-motion:reduce){.foot-brand-img{transition:none}}
/* ── perf: skip offscreen section paint work ─────────────────── */
@media (min-width:0px){
  .sec,.foot{content-visibility:auto;contain-intrinsic-size:auto 600px}
}
/* keep JS-injected thumbnails from shifting layout */
.art-thumb,.shot img{background:var(--card)}

/* ═══ THEME PILL DROPDOWN ══════════════════════════════════════ */
.theme-switch{position:relative;flex-shrink:0}
.theme-pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 15px;border-radius:99px;border:0;
  background:var(--grad);color:var(--ink);
  font:inherit;font-size:13px;font-weight:700;letter-spacing:.01em;
  -webkit-text-stroke:.6px var(--surface);paint-order:stroke fill;
  text-shadow:0 0 3px rgba(236,230,217,.55);
  cursor:pointer;
  box-shadow:0 3px 14px rgba(255,90,69,.38);
  transition:transform .15s,box-shadow .2s,filter .15s;
}
.theme-pill:hover{transform:translateY(-1px);box-shadow:0 7px 22px rgba(255,90,69,.55);filter:brightness(1.06)}
.theme-pill:active{transform:scale(.96)}
.theme-pill:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
/* the dot shows which theme is live, so the control reads as a state, not a button */
.theme-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0;
  box-shadow:inset 0 0 0 1.5px rgba(236,230,217,.85)}
[data-theme="night"] .theme-dot{background:linear-gradient(140deg,var(--surface) 45%,var(--blue))}

/* first-visit nudge: a soft ring + NEW flag, both retired the moment it's opened */
.theme-new{
  position:absolute;top:-7px;right:-5px;z-index:2;pointer-events:none;
  padding:1px 6px;border-radius:99px;
  background:var(--teal);color:var(--ink);
  font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  box-shadow:0 2px 8px rgba(47,181,184,.5);
}
.theme-switch:not(.is-new) .theme-new{display:none}
@keyframes theme-nudge{
  0%,100%{box-shadow:0 3px 14px rgba(255,90,69,.38),0 0 0 0 rgba(47,181,184,.55)}
  50%{box-shadow:0 3px 14px rgba(255,90,69,.38),0 0 0 9px rgba(47,181,184,0)}
}
.theme-switch.is-new .theme-pill{animation:theme-nudge 2.4s ease-out infinite}
@media(prefers-reduced-motion:reduce){
  .theme-switch.is-new .theme-pill{animation:none}
  .theme-pill{transition:none}
}
@media(max-width:520px){.theme-pill .theme-name{display:none}.theme-pill{padding:8px 12px}}
.theme-caret{font-size:8px;opacity:.7;transition:transform .18s}
.theme-switch.open .theme-caret{transform:rotate(180deg)}
.theme-menu{
  position:absolute;top:calc(100% + 8px);right:0;min-width:176px;z-index:260;
  background:var(--card-2);border:1px solid var(--line-strong);border-radius:12px;
  padding:6px;list-style:none;margin:0;
  box-shadow:0 18px 44px rgba(236,230,217,.45);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .16s,transform .16s,visibility .16s;
}
.theme-switch.open .theme-menu{opacity:1;visibility:visible;transform:none}
.theme-menu li{list-style:none}
.theme-menu button{
  display:flex;align-items:center;gap:9px;width:100%;
  padding:9px 11px;border:0;border-radius:8px;background:none;
  color:var(--muted);font:inherit;font-size:13.5px;font-weight:500;
  text-align:left;cursor:pointer;transition:background .13s,color .13s;
}
.theme-menu button:hover{background:rgba(var(--text-rgb),.08);color:var(--text)}
.theme-menu button[aria-selected="true"]{color:var(--text);background:var(--grad-soft)}
.theme-swatch{width:14px;height:14px;border-radius:50%;flex-shrink:0;
  border:1px solid var(--line-strong)}
.theme-swatch.night{background:linear-gradient(140deg,var(--bg) 40%,var(--blue))}
.theme-swatch.day{background:linear-gradient(140deg,var(--ink) 40%,var(--coral-2))}
@media(max-width:820px){.theme-switch{margin-left:auto}}
@media(prefers-reduced-motion:reduce){.theme-menu{transition:none}}

  

/* ── Data tables (launch guide, wanted level) ───────────────────── */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--radius-sm);background:rgba(var(--card-rgb),.55)}
.tbl{width:100%;border-collapse:collapse;font-size:14.5px;min-width:520px}
.tbl th,.tbl td{text-align:left;vertical-align:top;padding:12px 16px;border-bottom:1px solid var(--line)}
.tbl th{font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--teal);font-weight:600}
.tbl tbody tr:last-child td{border-bottom:0}
.tbl td b{color:var(--pink)}
.tbl a{color:var(--teal)}

/* ── Video vault static index ───────────────────────────────────── */
.vault-list{margin:14px 0 0;padding:0 0 0 22px;columns:2;column-gap:32px;font-size:14.5px;line-height:1.7}
@media(max-width:620px){.vault-list{columns:1}}
.vault-list li{break-inside:avoid;padding:2px 0}
.vault-list a{color:var(--text);text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:3px}
.vault-list a:hover{color:var(--pink)}
.vault-dur,.vault-date{font-family:var(--font-mono);font-size:11px;color:var(--muted);margin-left:6px}

/* ── Official clips ─────────────────────────────────────────────── */
.clip-frame{position:relative;aspect-ratio:16/9;background:var(--bg-2);border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--line)}
.clip-frame video{width:100%;height:100%;object-fit:cover;display:block;background:var(--bg-2)}
.clip-play{position:absolute;inset:0;margin:auto;width:64px;height:64px;border-radius:50%;border:2px solid rgba(236,230,217,.7);background:rgba(236,230,217,.65);color:var(--ink);font-size:22px;cursor:pointer;display:grid;place-items:center;transition:transform .2s,background .2s}
.clip-play:hover{transform:scale(1.08);background:var(--pink,var(--coral))}
.clip-play[hidden]{display:none}
.clip-card .video-cap{margin-top:10px}

/* ── Click-to-play video facades (trailers) ─────────────────────── */
.yt-facade{cursor:pointer}
.yt-facade img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.yt-facade:hover img{transform:scale(1.04)}
.yt-facade::after{display:none}
.yt-play{position:absolute;left:50%;top:50%;width:68px;height:48px;transform:translate(-50%,-50%);z-index:2;opacity:.92;transition:transform .3s ease,opacity .2s}
.yt-play svg{width:100%;height:100%;display:block;filter:drop-shadow(0 4px 12px rgba(236,230,217,.6))}
.yt-facade:hover .yt-play,.yt-facade:focus-visible .yt-play{transform:translate(-50%,-50%) scale(1.12);opacity:1}
.yt-facade:focus-visible{outline:2px solid var(--teal);outline-offset:2px}

/* ── Fan films page + rich vault index ───────────────────────────── */
.film-row{align-items:center}
.film-poster{position:relative;display:block;aspect-ratio:9/16;max-height:520px;margin:0 auto;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--line);background:var(--bg-2)}
.film-poster img{width:100%;height:100%;object-fit:cover;display:block}
.film-poster .clip-play{position:absolute;inset:0;margin:auto;width:64px;height:64px;border-radius:50%;border:2px solid rgba(236,230,217,.7);background:rgba(236,230,217,.65);color:var(--ink);font-size:22px;display:grid;place-items:center}
.vault-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin-top:16px}
.vault-card{display:grid;grid-template-columns:96px 1fr;gap:14px;align-items:start;background:rgba(var(--card-rgb),.55);border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px}
.vault-card img{width:96px;aspect-ratio:9/16;object-fit:cover;border-radius:6px;display:block;background:var(--bg-2)}
.vault-card h3{margin:0 0 4px;font-size:16px}
.vault-card .vc-meta{font-family:var(--font-mono);font-size:11px;color:var(--muted);letter-spacing:.06em;display:block;margin-bottom:6px}
.vault-card p{margin:0;font-size:13.5px;color:var(--muted);line-height:1.5}
.vault-card a.vc-play{color:var(--teal);font-size:13px;display:inline-block;margin-top:6px}
.vault-card h3 a{color:inherit;text-decoration:none}.vault-card h3 a:hover{color:var(--pink)}
.vault-card .vc-more{display:inline-block;margin-top:8px;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.vault-card .vc-noposter{display:block;width:96px;aspect-ratio:9/16;border-radius:6px;background:linear-gradient(160deg,var(--surface),var(--surface))}
@media (max-width:420px){.vault-card{grid-template-columns:72px 1fr}.vault-card img,.vault-card .vc-noposter{width:72px}}
.steps{counter-reset:step;list-style:none;margin:0;padding:0;display:grid;gap:12px;max-width:880px}
.steps li{counter-increment:step;position:relative;padding:14px 16px 14px 62px;background:rgba(var(--card-rgb),.55);border:1px solid var(--line);border-radius:var(--radius-sm);color:var(--muted);line-height:1.55;font-size:15px}
.steps li b{color:var(--text)}
.steps li::before{content:counter(step);position:absolute;left:14px;top:12px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-family:var(--font-display);font-size:20px;color:var(--ink);background:linear-gradient(135deg,var(--orange),var(--pink))}
.glossary{display:grid;grid-template-columns:max-content 1fr;gap:10px 22px;max-width:880px;margin:0}
.glossary dt{font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--teal);padding-top:2px}
.glossary dd{margin:0;color:var(--muted);line-height:1.55;font-size:15px}
@media(max-width:620px){.glossary{grid-template-columns:1fr;gap:4px 0}.glossary dd{margin-bottom:10px}}
.film-crumbs{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:16px}.film-crumbs a{color:var(--teal);text-decoration:none}.film-crumbs a:hover{text-decoration:underline}
.film-player{--arn:1.7778;--ar:16/9;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;margin:0 auto 22px;max-width:100%;width:calc(min(78vh,820px) * var(--arn));aspect-ratio:var(--ar)}
.film-player video{display:block;width:100%;height:100%;object-fit:contain;background:var(--bg-2)}
.film-head .sec-eyebrow{display:block;margin-bottom:8px}
.film-lead{font-size:17px;line-height:1.6;color:var(--muted);max-width:820px;margin:10px 0 0}
.film-body p,.film-body .film-pn,.film-body .film-actions{max-width:860px}.film-body p{font-size:16px;line-height:1.65;color:var(--muted)}
.film-note{color:var(--teal)!important}
.film-fine{font-size:13px!important;opacity:.75;border-top:1px solid var(--line);padding-top:14px;margin-top:18px}
.film-actions{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}
.film-pn{display:flex;justify-content:space-between;gap:16px;font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;border-top:1px solid var(--line);padding-top:16px}
.film-pn a{color:var(--text);text-decoration:none}.film-pn a:hover{color:var(--pink)}

/* == assets/v2/hypr-theme-plus9.f2152bc3.css == */
/* ═══════════════════════════════════════════════════════════════════
   HYPR THEME — "Leonida Uplink"
   A weathered relay terminal picking up a signal from 2026 Vice City.
   Layers: oil-black ground · cyan/magenta signal (cyberpunk) · LCARS
   elbow frame & capsules (Star Trek) · Leonida sunset ramp (GTA VI) ·
   a sky that keeps real Vice City time.
   Loaded after each page's inline <style>, so these tokens win.
   ═══════════════════════════════════════════════════════════════════ */

:scope{
  /* ground */
  --night:var(--bg); --dusk:var(--bg); --card:var(--surface); --card-2:var(--bg-2);
  --night-rgb:7,10,16; --dusk2-rgb:11,16,24; --deep-rgb:13,19,28;
  --card-rgb:16,23,34; --card2-rgb:22,32,46; --text-rgb:235,240,247;
  --sky-mid:var(--bg); --sky-far:var(--bg-2);

  /* signal */
  --teal:var(--teal); --pink:var(--coral); --orange:var(--coral-2); --violet:var(--blue);
  --hx-cyan:var(--teal); --hx-mag:var(--coral); --hx-amber:var(--coral-2);
  --hx-violet:var(--blue);

  --text:var(--ink); --muted:var(--mute); --faint:var(--mute);
  --line:#148385; --line-strong:#148385;

  --grad:linear-gradient(100deg,var(--coral-2) 0%,var(--coral) 48%,var(--teal) 100%);
  --grad-soft:linear-gradient(100deg,rgba(198,51,31,.16),rgba(255,90,69,.16) 48%,rgba(47,181,184,.16));
  --hx-plate:linear-gradient(160deg,rgba(47,181,184,.07),rgba(159,176,255,.06) 45%,rgba(255,90,69,.06));

  --font-display:"Big Shoulders Display","Bebas Neue",Impact,sans-serif;
  --font-script:"Share Tech Mono",monospace;
  --font-body:"Space Grotesk","Inter",system-ui,sans-serif;
  --font-mono:"Share Tech Mono","SFMono-Regular",Menlo,monospace;

  --radius:6px; --radius-sm:4px;
}

/* ── Ground: grain, vignette, scanlines ─────────────────────────── */
:scope{
  background:
    radial-gradient(120% 80% at 50% -10%,rgba(255,90,69,.10),transparent 55%),
    radial-gradient(90% 60% at 100% 100%,rgba(47,181,184,.07),transparent 60%),
    radial-gradient(70% 50% at 0% 90%,rgba(159,176,255,.10),transparent 60%),
    var(--night);
  font-family:var(--font-body);
}
:scope::after{ /* scanlines + vignette */
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    repeating-linear-gradient(180deg,rgba(236,230,217,0) 0 2px,rgba(236,230,217,.18) 2px 3px),
    radial-gradient(120% 120% at 50% 50%,transparent 55%,rgba(236,230,217,.55));
  opacity:.75;
}
main,.dash,footer{position:relative;z-index:1}

/* Horizon grid — fixed, drifting toward the viewer */
.hx-grid{
  position:fixed;left:-20vw;right:-20vw;bottom:0;height:38vh;z-index:0;pointer-events:none;
  transform-origin:50% 100%;transform:perspective(520px) rotateX(62deg);
  background-image:
    linear-gradient(rgba(47,181,184,.28) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,90,69,.22) 1px,transparent 1px);
  background-size:100% 44px,64px 100%;
  -webkit-mask-image:linear-gradient(180deg,transparent,var(--surface) 55%);mask-image:linear-gradient(180deg,transparent,var(--surface) 55%);
  animation:hx-grid-drift 6s linear infinite;opacity:.55;
}
@keyframes hx-grid-drift{to{background-position:0 44px,0 0}}

/* Periodic signal sweep down the page */
.hx-sweep{
  position:fixed;left:0;right:0;top:-12%;height:10%;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(47,181,184,.09) 50%,transparent);
  animation:hx-sweep 11s linear infinite;
}
@keyframes hx-sweep{0%{top:-12%}100%{top:112%}}

/* ── LCARS elbow frame (left edge, wide screens) ───────────────── */
.hx-frame{
  position:fixed;left:0;top:var(--nav-h);bottom:0;width:14px;z-index:150;pointer-events:none;
  display:none;
}
@media(min-width:1320px){.hx-frame{display:block}}
.hx-frame span{
  position:absolute;left:0;width:100%;border-radius:0 7px 7px 0;
}
.hx-frame .s1{top:18px;height:22%;background:var(--hx-amber)}
.hx-frame .s2{top:calc(22% + 26px);height:9%;background:var(--hx-violet)}
.hx-frame .s3{top:calc(31% + 34px);height:28%;background:var(--hx-cyan);animation:hx-lcars 4s steps(1) infinite}
.hx-frame .s4{top:calc(59% + 42px);height:12%;background:var(--hx-mag)}
.hx-frame .s5{top:calc(71% + 50px);bottom:18px;background:var(--hx-violet)}
@keyframes hx-lcars{0%,100%{opacity:1}50%{opacity:.35}}
.hx-frame .rd{
  position:absolute;left:20px;bottom:24px;white-space:nowrap;transform:rotate(-90deg);transform-origin:0 100%;
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.22em;color:var(--hx-cyan);opacity:.7;
}

/* ── Cursor light (desktop) ─────────────────────────────────────── */
.hx-cursor{
  position:fixed;left:0;top:0;width:520px;height:520px;margin:-260px 0 0 -260px;z-index:0;
  pointer-events:none;border-radius:50%;opacity:0;transition:opacity .4s;
  background:radial-gradient(circle,rgba(47,181,184,.11),rgba(255,90,69,.06) 40%,transparent 70%);
}
@media(hover:hover) and (pointer:fine){.hx-cursor{opacity:1}}

/* ── Nav / tabbar ───────────────────────────────────────────────── */
.nav{
  background:rgba(236,230,217,.86);
  border-bottom:1px solid rgba(47,181,184,.18);
  box-shadow:0 1px 0 rgba(159,176,255,.25),0 10px 40px rgba(236,230,217,.5);
}
.nav::after{opacity:.85;height:2px;box-shadow:0 0 14px rgba(47,181,184,.45)}
.tabbar{background:rgba(236,230,217,.94);border-top-color:#148385}
.brand{font-family:var(--font-display);font-weight:800;letter-spacing:.06em;text-shadow:0 0 18px rgba(47,181,184,.35)}
.nav-pill{border-radius:3px 14px 3px 14px;font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;font-size:12px}

/* ── Plates: every card becomes weathered copper + signal ───────── */
.news-box,.vault-strip,.dc-cell,.ticker,.section-alt .card,.card,.shot,.video-frame,
.side-box,.ovid-frame,.foot-block,.forum-card,.post,.map-card,.tile{
  border-radius:var(--radius);
  border:1px solid rgba(159,176,255,.32);
  background-image:var(--hx-plate);
  box-shadow:
    inset 0 0 0 1px rgba(47,181,184,.10),
    inset 0 1px 0 rgba(236,230,217,.05),
    0 14px 40px rgba(236,230,217,.55),
    0 0 0 6px rgba(236,230,217,.35);
  position:relative;
}
/* corner brackets */
.news-box::before,.vault-strip::before,.ticker::before,.video-frame::before,.ovid-frame::before{
  content:"";position:absolute;inset:6px;pointer-events:none;z-index:5;border-radius:2px;
  background:
    linear-gradient(var(--hx-cyan),var(--hx-cyan)) top left/14px 1px no-repeat,
    linear-gradient(var(--hx-cyan),var(--hx-cyan)) top left/1px 14px no-repeat,
    linear-gradient(var(--hx-mag),var(--hx-mag)) bottom right/14px 1px no-repeat,
    linear-gradient(var(--hx-mag),var(--hx-mag)) bottom right/1px 14px no-repeat;
  opacity:.85;
}
.news-box:hover,.vault-strip:hover{border-color:#148385;
  box-shadow:inset 0 0 0 1px rgba(47,181,184,.22),0 14px 44px rgba(236,230,217,.6),0 0 28px rgba(47,181,184,.10)}

/* LCARS header bars */
.news-box-head,.vault-strip-head{
  font-family:var(--font-mono);font-size:12px;letter-spacing:.2em;color:var(--hx-amber);
  border-bottom:1px solid rgba(159,176,255,.35);
  background:linear-gradient(90deg,rgba(198,51,31,.10),transparent 60%);
  padding-left:22px;
}
.news-box-head::before,.vault-strip-head::before{
  content:"";position:absolute;left:0;top:0;bottom:auto;height:38px;width:8px;
  background:var(--hx-amber);border-radius:0 6px 6px 0;
}
.news-dot{background:var(--hx-cyan);box-shadow:0 0 10px var(--hx-cyan)}
.vault-all,.box-pill.primary,.btn-primary{
  border-radius:3px 12px 3px 12px;font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;
}

/* ── Buttons ─────────────────────────────────────────────────────── */
.btn{border-radius:3px 14px 3px 14px;font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;
  -webkit-text-stroke:0;text-shadow:none;position:relative;overflow:hidden}
.btn-primary{background:var(--grad);color:var(--ink);font-weight:700;
  box-shadow:0 0 0 1px rgba(236,230,217,.18) inset,0 8px 28px rgba(255,90,69,.35),0 0 18px rgba(47,181,184,.25)}
.btn-primary::after{content:"";position:absolute;top:-40%;bottom:-40%;left:-30%;width:30%;
  background:linear-gradient(100deg,transparent,rgba(236,230,217,.55),transparent);transform:skewX(-20deg);
  animation:hx-shine 3.6s ease-in-out infinite}
@keyframes hx-shine{0%,60%{left:-30%}100%{left:130%}}
.btn-ghost{border:1px solid rgba(47,181,184,.35);background:rgba(236,230,217,.6);color:var(--hx-cyan)}
.btn-ghost:hover{border-color:var(--hx-cyan);background:rgba(47,181,184,.08);box-shadow:0 0 18px rgba(47,181,184,.25)}
.box-pill{border-radius:3px 10px 3px 10px;font-family:var(--font-mono);letter-spacing:.05em}
.chip{border-radius:3px 12px 3px 12px;font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;font-size:12px}
.chip.active{background:var(--hx-amber);color:var(--ink);box-shadow:0 0 16px rgba(198,51,31,.45)}

/* ── Typography ───────────────────────────────────────────────────── */
h1,h2,h3,.sec-title,.dash-title,.brand{font-family:var(--font-display);font-weight:800}
.sec-title{letter-spacing:.02em}
.sec-eyebrow,.dash-eyebrow,.eyebrow-script{
  font-family:var(--font-script);transform:none;font-size:clamp(14px,1.9vh,20px);letter-spacing:.14em;
  text-transform:uppercase;color:var(--hx-violet);text-shadow:0 0 12px rgba(159,176,255,.5);animation:none;
}
.dash-eyebrow::before,.sec-eyebrow::before{content:"▸ ";color:var(--hx-cyan)}
.dash-title{
  -webkit-text-stroke:0;
  text-shadow:
    -2px 0 rgba(47,181,184,.55),2px 0 rgba(255,90,69,.55),
    0 4px 0 rgba(236,230,217,.6),0 18px 40px rgba(236,230,217,.7);
  animation:hx-chroma 7s ease-in-out infinite;
}
.dash-title .vi{color:var(--hx-amber);text-shadow:-2px 0 rgba(47,181,184,.6),2px 0 rgba(255,90,69,.6),0 0 30px rgba(198,51,31,.55)}
@keyframes hx-chroma{
  0%,88%,100%{text-shadow:-2px 0 rgba(47,181,184,.55),2px 0 rgba(255,90,69,.55),0 4px 0 rgba(236,230,217,.6),0 18px 40px rgba(236,230,217,.7)}
  90%{text-shadow:-6px 0 rgba(47,181,184,.8),6px 0 rgba(255,90,69,.8),0 4px 0 rgba(236,230,217,.6)}
  93%{text-shadow:4px 0 rgba(47,181,184,.8),-4px 0 rgba(255,90,69,.8),0 4px 0 rgba(236,230,217,.6)}
}
.dash-title.hx-glitch{animation:hx-chroma 7s ease-in-out infinite,hx-glitch .6s steps(3) 1 both}
@keyframes hx-glitch{
  0%{clip-path:inset(0 0 60% 0);transform:translate(-4px,0)}
  25%{clip-path:inset(40% 0 20% 0);transform:translate(5px,-2px)}
  50%{clip-path:inset(70% 0 0 0);transform:translate(-3px,2px)}
  75%{clip-path:inset(10% 0 50% 0);transform:translate(2px,0)}
  100%{clip-path:inset(0 0 0 0);transform:none}
}
.tagline-pill{border-radius:3px 12px 3px 12px;font-family:var(--font-mono);border-color:rgba(198,51,31,.4);background:rgba(198,51,31,.08);color:var(--hx-amber)}

/* countdown = amber readout */
.dc-cell{background:linear-gradient(180deg,rgba(236,230,217,.9),rgba(236,230,217,.95));border-color:rgba(198,51,31,.3)}
.dc-cell::after{content:"";position:absolute;left:8px;right:8px;top:6px;height:1px;background:rgba(198,51,31,.35)}
.dc-num{font-family:var(--font-mono);background:none;-webkit-text-fill-color:var(--hx-amber);color:var(--hx-amber);
  text-shadow:0 0 6px rgba(198,51,31,.8),0 0 22px rgba(198,51,31,.45);animation:hx-flicker 4s steps(1) infinite}
.dc-label{font-family:var(--font-mono);color:var(--hx-cyan);letter-spacing:.28em}
@keyframes hx-flicker{0%,97%,100%{opacity:1}98%{opacity:.6}99%{opacity:.9}}

/* ── Hero atmosphere ─────────────────────────────────────────────── */
.hero-sky{background:
  radial-gradient(90% 60% at 50% 100%,rgba(255,90,69,.45),rgba(198,51,31,.28) 30%,transparent 65%),
  linear-gradient(180deg,var(--bg),var(--bg) 55%,var(--bg-2))}
.hero-sun{background:conic-gradient(from 180deg,var(--coral-2),var(--coral),var(--blue),var(--teal),var(--coral-2));
  filter:blur(1px) saturate(1.2);
  -webkit-mask-image:repeating-linear-gradient(180deg,var(--surface) 0 7px,transparent 7px 10px);
  mask-image:repeating-linear-gradient(180deg,var(--surface) 0 7px,transparent 7px 10px)}
.hero-horizon{background:linear-gradient(180deg,transparent,rgba(47,181,184,.18) 50%,var(--night))}
.hero-shots-scrim{background:linear-gradient(180deg,rgba(236,230,217,.35),rgba(236,230,217,.75) 60%,var(--night))}

/* ── Rows / cards micro-interactions ─────────────────────────────── */
.news-row,.vstrip-card,.oshot-card,.art-row{transition:transform .18s,color .18s,text-shadow .18s}
.news-row:hover,.vstrip-card:hover,.oshot-card:hover,.art-row:hover{
  transform:translateX(4px);text-shadow:-1px 0 rgba(47,181,184,.5),1px 0 rgba(255,90,69,.5)}
.news-row-src,.vstrip-meta,.ovid-meta,.oshot-card>span:last-child{font-family:var(--font-mono);letter-spacing:.08em;color:var(--hx-cyan);font-size:10.5px}
.shot img,.oshot-card img,.vstrip-thumb{filter:saturate(1.1) contrast(1.05)}
.shot::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 60%,rgba(236,230,217,.85));box-shadow:inset 0 0 0 1px rgba(47,181,184,.15)}
.shot:hover::after{box-shadow:inset 0 0 0 1px var(--hx-cyan),inset 0 0 24px rgba(47,181,184,.25)}
.shot .lbl{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;font-size:11px;color:var(--hx-amber)}

/* sections + footer */
.section-alt{background:linear-gradient(180deg,rgba(236,230,217,.9),rgba(159,176,255,.12))}
.sunset-rule{border:0;height:2px;background:var(--grad);opacity:.9;box-shadow:0 0 12px rgba(255,90,69,.4)}
footer{background:linear-gradient(180deg,var(--dusk),var(--surface));border-top:1px solid rgba(159,176,255,.4)}
footer h4{font-family:var(--font-mono);letter-spacing:.2em;color:var(--hx-amber);text-transform:uppercase;font-size:12px}
::selection{background:var(--hx-cyan);color:var(--ink)}
:focus-visible{outline:2px solid var(--hx-amber);outline-offset:3px}

/* ── Boot overlay ─────────────────────────────────────────────────── */
.hx-boot{
  position:fixed;inset:0;z-index:9999;background:var(--surface);display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);color:var(--hx-cyan);letter-spacing:.2em;font-size:clamp(11px,1.6vw,14px);
  transition:opacity .45s ease,visibility .45s;
}
.hx-boot.out{opacity:0;visibility:hidden}
.hx-boot .box{position:relative;padding:28px 36px;border:1px solid rgba(47,181,184,.35);min-width:min(520px,86vw)}
.hx-boot .box::before{content:"";position:absolute;left:-14px;top:0;bottom:0;width:8px;background:var(--hx-amber);border-radius:6px 0 0 6px}
.hx-boot p{margin:0 0 8px;opacity:0;transform:translateY(4px);animation:hx-boot-line .25s forwards}
.hx-boot p:nth-child(2){animation-delay:.18s}.hx-boot p:nth-child(3){animation-delay:.36s}.hx-boot p:nth-child(4){animation-delay:.58s;color:var(--hx-amber)}
.hx-boot p b{color:var(--hx-mag);font-weight:400}
.hx-boot .bar{height:2px;margin-top:14px;background:rgba(47,181,184,.15);overflow:hidden}
.hx-boot .bar i{display:block;height:100%;width:0;background:var(--grad);animation:hx-boot-bar .85s .15s ease-out forwards}
@keyframes hx-boot-line{to{opacity:1;transform:none}}
@keyframes hx-boot-bar{to{width:100%}}

/* ── Motion & small screens ────────────────────────────────────────── */
@media(max-width:820px){.hx-grid{height:26vh;opacity:.4}:scope::after{opacity:.5}}
@media(prefers-reduced-motion:reduce){
  .hx-grid,.hx-sweep,.dash-title,.dc-num,.btn-primary::after,.hx-frame .s3{animation:none!important}
  .hx-sweep,.hx-cursor{display:none}
  .hx-boot{display:none}
}

/* ── Signal field canvas ──────────────────────────────────────────── */
.hx-field{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.95;mix-blend-mode:screen}
.dash-bg .hx-field{position:absolute;z-index:5}

/* ── Living sky: variables are set every minute from Vice City time ── */
:scope{--vc-top:var(--bg);--vc-mid:var(--bg);--vc-hz:var(--bg-2);--vc-glow:var(--surface);--vc-glow2:rgba(198,51,31,.28);--vc-sun-y:118%;--vc-sun-a:.9}
.hero-sky{background:
  radial-gradient(90% 60% at 50% 100%,var(--vc-glow),var(--vc-glow2) 30%,transparent 65%),
  linear-gradient(180deg,var(--vc-top),var(--vc-mid) 55%,var(--vc-hz))!important;
  transition:background 2s linear}
.hero-sun{top:auto;bottom:calc(100% - var(--vc-sun-y));opacity:var(--vc-sun-a);transition:bottom 2s linear,opacity 2s linear}
.hx-vcclock{
  position:fixed;right:18px;bottom:18px;z-index:160;pointer-events:none;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;color:var(--hx-cyan);
  padding:8px 12px;border:1px solid rgba(47,181,184,.3);border-radius:3px 12px 3px 12px;
  background:rgba(236,230,217,.7);backdrop-filter:blur(8px);
}
.hx-vcclock b{color:var(--hx-amber);font-weight:400}
@media(max-width:820px){.hx-vcclock{bottom:calc(var(--tab-h) + 12px);right:10px;font-size:10px}}

/* ── Holographic tilt & sheen ───────────────────────────────────────── */
.hx-tilt:hover{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}
.hx-tilt{transition:transform .18s ease-out}
.hx-tilt::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:6;border-radius:inherit;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(236,230,217,.14),rgba(47,181,184,.08) 30%,rgba(255,90,69,.05) 50%,transparent 70%);
  opacity:var(--sh,0);transition:opacity .3s;mix-blend-mode:screen;
}

/* ── Narrow screens: mono digits are wider than the old condensed face ── */
@media(max-width:520px){
  .dash-countdown{gap:6px;width:100%}
  .dc-cell{min-width:0;flex:1 1 0;padding:8px 4px}
  .dc-num{font-size:clamp(22px,7.5vw,34px);letter-spacing:-.02em}
  .dc-label{font-size:7px;letter-spacing:.16em}
  .dash-cta .btn{padding:10px 14px;font-size:11px}
  .hx-vcclock{font-size:9px;padding:6px 9px}
}

  
/* ═══════════════════════════════════════════════════════════════════
   HYPR v2 — "Signal Glass"
   Second layer over the Leonida Uplink theme. Sharper glass, holo foil,
   rotating conic borders, HUD viewport corners, aurora field, particles,
   3D tilt and magnetic buttons. All decorative; degrades cleanly.
   ═══════════════════════════════════════════════════════════════════ */
@property --hx-a{syntax:"<angle>";inherits:false;initial-value:0deg}
@property --hx-mx{syntax:"<percentage>";inherits:true;initial-value:50%}
@property --hx-my{syntax:"<percentage>";inherits:true;initial-value:50%}

:scope{
  --hx-glass:rgba(236,230,217,.42);
  --hx-glass-hi:rgba(236,230,217,.14);
  --hx-glass-edge:#148385;
  --hx-foil:conic-gradient(from var(--hx-a),var(--teal),var(--blue),var(--coral),var(--coral-2),var(--teal));
}

/* ── Aurora field behind everything ─────────────────────────────── */
.hx-aurora{position:fixed;inset:-20%;z-index:0;pointer-events:none;filter:blur(70px) saturate(1.3);opacity:.55;
  background:
    radial-gradient(38% 30% at 20% 20%,rgba(47,181,184,.35),transparent 70%),
    radial-gradient(34% 28% at 80% 30%,rgba(255,90,69,.32),transparent 70%),
    radial-gradient(40% 34% at 55% 85%,rgba(159,176,255,.30),transparent 70%),
    radial-gradient(28% 22% at 10% 85%,rgba(199,116,58,.35),transparent 70%);
  animation:hx-aurora 26s ease-in-out infinite alternate}
@keyframes hx-aurora{
  0%{transform:translate(0,0) rotate(0deg) scale(1)}
  50%{transform:translate(4%,-3%) rotate(6deg) scale(1.08)}
  100%{transform:translate(-3%,4%) rotate(-5deg) scale(1.04)}}
.hx-particles{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.7}

/* ── HUD viewport corners + ticks ───────────────────────────────── */
.hx-hud{position:fixed;inset:calc(var(--nav-h) + 10px) 12px 12px 12px;z-index:140;pointer-events:none}
.hx-hud i{position:absolute;width:26px;height:26px;border:2px solid var(--hx-cyan);opacity:.75;
  filter:drop-shadow(0 0 6px rgba(47,181,184,.6))}
.hx-hud .tl{left:0;top:0;border-right:0;border-bottom:0}
.hx-hud .tr{right:0;top:0;border-left:0;border-bottom:0;border-color:var(--hx-mag)}
.hx-hud .bl{left:0;bottom:0;border-right:0;border-top:0;border-color:var(--hx-amber)}
.hx-hud .br{right:0;bottom:0;border-left:0;border-top:0}
.hx-hud .ticks{position:absolute;right:0;top:40px;bottom:40px;width:10px;
  background:repeating-linear-gradient(180deg,rgba(47,181,184,.5) 0 1px,transparent 1px 14px);opacity:.35}
.hx-hud .tag{position:absolute;right:-96px;top:50%;transform:rotate(90deg);transform-origin:center;font-family:var(--font-mono);font-size:10px;letter-spacing:.24em;color:var(--hx-mag);opacity:.7;white-space:nowrap}
.hx-hud .fps{position:absolute;left:34px;bottom:2px;font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;color:var(--hx-amber);opacity:.8}
@media(max-width:820px){.hx-hud{display:none}}

/* ── Super-sharp glass ───────────────────────────────────────────── */
.news-box,.vault-strip,.dc-cell,.ticker,.video-frame,.ovid-frame,.foot-block,.card,.tile,.forum-card,.post{
  background-color:var(--hx-glass)!important;
  -webkit-backdrop-filter:blur(22px) saturate(1.6) brightness(1.08);backdrop-filter:blur(22px) saturate(1.6) brightness(1.08);
  border:1px solid transparent;
  background-image:
    linear-gradient(var(--hx-glass),var(--hx-glass)),
    linear-gradient(135deg,var(--hx-glass-hi) 0%,rgba(236,230,217,.02) 35%,rgba(236,230,217,0) 50%,rgba(47,181,184,.18) 100%);
  background-origin:border-box;background-clip:padding-box,border-box;
  box-shadow:
    inset 0 1px 0 rgba(236,230,217,.18),
    inset 0 -1px 0 rgba(47,181,184,.12),
    inset 0 0 40px rgba(47,181,184,.04),
    0 20px 60px rgba(236,230,217,.6),
    0 0 0 1px rgba(236,230,217,.4);
}
/* refractive top edge specular */
.news-box::after,.vault-strip::after,.ovid-frame::after,.dc-cell::after{
  content:"";position:absolute;left:8%;right:8%;top:0;height:1px;pointer-events:none;z-index:6;
  background:linear-gradient(90deg,transparent,rgba(236,230,217,.7),rgba(47,181,184,.8),transparent);
  filter:blur(.3px)}
/* rotating holographic foil border, revealed on hover */
.news-box,.vault-strip,.dc-cell,.ovid-frame{isolation:isolate}
.hx-foil{position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;z-index:-1;
  padding:1px;background:var(--hx-foil);
  -webkit-mask:linear-gradient(var(--surface) 0 0) content-box,linear-gradient(var(--surface) 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .35s;animation:hx-spin 4s linear infinite}
.news-box:hover>.hx-foil,.vault-strip:hover>.hx-foil,.dc-cell:hover>.hx-foil,.ovid-frame:hover>.hx-foil{opacity:1}
.dc-cell>.hx-foil{opacity:.55}
@keyframes hx-spin{to{--hx-a:360deg}}
/* pointer-tracked sheen */
.hx-tilt{transition:transform .12s ease-out,box-shadow .3s}
.hx-tilt::before{z-index:7}
.hx-tilt .hx-sheen{position:absolute;inset:0;pointer-events:none;z-index:6;border-radius:inherit;opacity:0;transition:opacity .3s;
  background:radial-gradient(240px circle at var(--hx-mx) var(--hx-my),rgba(236,230,217,.16),rgba(47,181,184,.06) 40%,transparent 70%)}
.hx-tilt:hover .hx-sheen{opacity:1}

/* ── Holo scan on imagery ────────────────────────────────────────── */
.shot,.oshot-card img,.vstrip-thumb,.art-thumb,.ovid-frame{overflow:hidden}
.shot::before,.oshot-card::before{
  content:"";position:absolute;left:0;right:0;top:-30%;height:30%;z-index:4;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(47,181,184,.28),transparent);
  mix-blend-mode:screen;opacity:0;transition:opacity .2s}
.shot:hover::before,.oshot-card:hover::before{opacity:1;animation:hx-scan 1.1s linear infinite}
@keyframes hx-scan{to{top:110%}}
.oshot-card{position:relative}

/* ── Nav: laser underline + brand halo ───────────────────────────── */
.nav a:not(.nav-pill){position:relative}
.nav a:not(.nav-pill)::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;
  background:linear-gradient(90deg,var(--hx-cyan),var(--hx-mag));transform:scaleX(0);transform-origin:left;
  transition:transform .25s cubic-bezier(.2,.8,.2,1);box-shadow:0 0 10px var(--hx-cyan)}
.nav a:not(.nav-pill):hover::after,.nav a[aria-current]::after{transform:scaleX(1)}
.brand{position:relative}
.brand::after{content:"";position:absolute;inset:-8px -14px;z-index:-1;border-radius:999px;
  background:radial-gradient(60% 100% at 50% 50%,rgba(47,181,184,.18),transparent 70%);filter:blur(6px)}

/* ── Buttons: magnetic + energy ring ─────────────────────────────── */
.btn{transition:transform .15s cubic-bezier(.2,.8,.2,1),box-shadow .2s,background .2s,border-color .2s}
.btn-primary{box-shadow:0 0 0 1px rgba(236,230,217,.25) inset,0 10px 34px rgba(255,90,69,.45),0 0 0 0 rgba(47,181,184,.5)}
.btn-primary:hover{box-shadow:0 0 0 1px rgba(236,230,217,.3) inset,0 14px 40px rgba(255,90,69,.55),0 0 0 6px rgba(47,181,184,.14),0 0 40px rgba(47,181,184,.35)}
.btn-ghost::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:var(--hx-foil);
  -webkit-mask:linear-gradient(var(--surface) 0 0) content-box,linear-gradient(var(--surface) 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .25s;animation:hx-spin 3s linear infinite}
.btn-ghost:hover::before{opacity:1}

/* ── Title: holographic fill ─────────────────────────────────────── */
.dash-title{
  background:linear-gradient(100deg,var(--ink) 0%,var(--ink) 30%,var(--teal) 50%,var(--ink) 70%,var(--ink) 100%);
  background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:hx-chroma 7s ease-in-out infinite,hx-holo 6s linear infinite;
  filter:drop-shadow(0 4px 0 rgba(236,230,217,.6)) drop-shadow(0 18px 40px rgba(236,230,217,.7))}
.dash-title .vi{background:linear-gradient(100deg,var(--coral-2),var(--coral) 50%,var(--coral-2));background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:hx-holo 6s linear infinite reverse}
@keyframes hx-holo{to{background-position:220% 0}}

/* ── Countdown flip tick ─────────────────────────────────────────── */
.dc-num.hx-tick{animation:hx-tick .35s ease-out}
@keyframes hx-tick{0%{transform:translateY(-6px);filter:brightness(2)}100%{transform:none;filter:none}}

/* ── Scroll reveal ───────────────────────────────────────────────── */
.hx-reveal{opacity:0;transform:translateY(18px) scale(.985);transition:opacity .6s cubic-bezier(.2,.8,.2,1),transform .6s cubic-bezier(.2,.8,.2,1)}
.hx-reveal.in{opacity:1;transform:none}

/* ── Motion & mobile budget ──────────────────────────────────────── */
@media(max-width:820px){
  .hx-aurora{filter:blur(40px);opacity:.4}
  .news-box,.vault-strip,.dc-cell,.ticker,.video-frame,.ovid-frame{-webkit-backdrop-filter:blur(12px) saturate(1.3);backdrop-filter:blur(12px) saturate(1.3)}
}
@media(prefers-reduced-motion:reduce){
  .hx-aurora,.hx-foil,.btn-ghost::before,.dash-title,.dash-title .vi,.shot:hover::before,.oshot-card:hover::before{animation:none!important}
  .hx-particles{display:none}
  .hx-reveal{opacity:1;transform:none;transition:none}
  .hx-tilt{transform:none!important}
}

  
/* ═══════════════════════════════════════════════════════════════════
   HYPR v3 — "Terminal Vice"
   Third layer. Dials the LCARS/Trek chrome down ~75%, replaces it with
   a computer-terminal language (hex rain, chamfered panels, decode text,
   circuit traces, reticle cursor, page wipes) and restyles the hero
   wordmark to sit stacked like the GTA VI title lock-up: small tracked
   GRAND THEFT AUTO over a huge sunset-gradient VI.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Trek reduction ──────────────────────────────────────────────── */
.hx-frame{display:none!important}
.news-box-head::before,.vault-strip-head::before{display:none}
.news-box-head,.vault-strip-head{padding-left:16px;background:linear-gradient(90deg,rgba(47,181,184,.08),transparent 60%);color:var(--hx-cyan)}
.news-box-head .news-dot,.vault-strip-head .news-dot{display:none}
.news-box-head::after,.vault-strip-head::after{content:"_";margin-left:6px;animation:hx-caret 1s steps(1) infinite;color:var(--hx-cyan)}
.hx-hud .ticks{opacity:.18}
.hx-hud i{width:18px;height:18px;border-width:1.5px}
/* chamfered corners replace LCARS capsules */
.btn,.vault-all,.box-pill,.chip,.nav-pill,.tagline-pill{
  border-radius:2px;
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.btn-primary{clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
.dc-cell{border-radius:2px;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.dc-cell>.hx-foil,.dc-cell::after{display:none}
.dc-cell{border:1px solid rgba(47,181,184,.35);background-image:
  linear-gradient(var(--hx-glass),var(--hx-glass)),
  linear-gradient(135deg,rgba(47,181,184,.5),rgba(47,181,184,.05) 40%,rgba(255,90,69,.4))}
.news-box::before,.vault-strip::before,.ticker::before,.video-frame::before,.ovid-frame::before{
  inset:0;background:
    linear-gradient(var(--hx-cyan),var(--hx-cyan)) top left/18px 2px no-repeat,
    linear-gradient(var(--hx-cyan),var(--hx-cyan)) top left/2px 18px no-repeat,
    linear-gradient(var(--hx-cyan),var(--hx-cyan)) bottom right/18px 2px no-repeat,
    linear-gradient(var(--hx-cyan),var(--hx-cyan)) bottom right/2px 18px no-repeat}
.hx-boot .box::before{display:none}
.hx-boot .box{clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);background:rgba(47,181,184,.03)}

/* ── Circuit traces + hex rain ───────────────────────────────────── */
.hx-circuit{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.16;
  background-image:url(/assets/"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160' fill='none' stroke='%231EF2E6' stroke-width='1'><path d='M0 40h40v40h40V0M80 160v-40h40V80h40M0 120h20v40M120 0v40h40'/><circle cx='40' cy='80' r='2.5' fill='%231EF2E6'/><circle cx='120' cy='80' r='2.5' fill='%23FF2FA0'/><circle cx='20' cy='120' r='2' fill='%23FFB454'/></svg>");
  -webkit-mask-image:radial-gradient(70% 70% at 50% 40%,transparent 30%,var(--surface) 100%);mask-image:radial-gradient(70% 70% at 50% 40%,transparent 30%,var(--surface) 100%)}
.hx-rain{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.55;mix-blend-mode:screen}

/* ── Data stream bar under the nav ───────────────────────────────── */
.hx-stream{position:fixed;left:0;right:0;top:var(--nav-h);height:18px;z-index:199;pointer-events:none;overflow:hidden;
  background:rgba(236,230,217,.7);border-bottom:1px solid rgba(47,181,184,.15);
  font-family:var(--font-mono);font-size:9.5px;letter-spacing:.18em;line-height:18px;color:#148385;white-space:nowrap}
.hx-stream span{display:inline-block;padding-left:100%;animation:hx-stream 38s linear infinite}
.hx-stream b{color:var(--hx-mag);font-weight:400}.hx-stream i{color:var(--hx-amber);font-style:normal}
@keyframes hx-stream{to{transform:translateX(-100%)}}
:scope{padding-top:var(--nav-h)}
.hx-hud{top:calc(var(--nav-h) + 10px)}
@media(max-width:820px){.hx-stream{display:none}:scope{padding-top:var(--nav-h)}}

/* ── Reticle cursor + click pulse ───────────────────────────────── */
@media(hover:hover) and (pointer:fine){
  .hx-ret{position:fixed;left:0;top:0;width:34px;height:34px;margin:-17px 0 0 -17px;z-index:9998;pointer-events:none;
    border:1px solid rgba(47,181,184,.7);border-radius:50%;transition:transform .12s,border-color .2s,width .2s,height .2s,margin .2s;
    box-shadow:0 0 12px rgba(47,181,184,.4)}
  .hx-ret::before,.hx-ret::after{content:"";position:absolute;background:rgba(47,181,184,.8)}
  .hx-ret::before{left:50%;top:-6px;bottom:-6px;width:1px;margin-left:-.5px}
  .hx-ret::after{top:50%;left:-6px;right:-6px;height:1px;margin-top:-.5px}
  .hx-ret.hot{width:48px;height:48px;margin:-24px 0 0 -24px;border-color:var(--hx-mag);box-shadow:0 0 18px rgba(255,90,69,.5)}
  .hx-ret .rd{position:absolute;left:44px;top:-2px;font-family:var(--font-mono);font-size:9px;letter-spacing:.16em;color:var(--hx-cyan);white-space:nowrap;opacity:.8}
}
.hx-pulse{position:fixed;left:0;top:0;width:12px;height:12px;margin:-6px 0 0 -6px;z-index:9997;pointer-events:none;border-radius:50%;
  border:2px solid var(--hx-mag);animation:hx-pulse .6s ease-out forwards}
@keyframes hx-pulse{to{transform:scale(9);opacity:0;border-width:.5px}}

/* ── Page wipe on navigation ────────────────────────────────────── */
.hx-wipe{position:fixed;inset:0;z-index:99999;pointer-events:none;background:
  linear-gradient(180deg,rgba(236,230,217,.98),rgba(236,230,217,.98)),
  repeating-linear-gradient(180deg,transparent 0 2px,rgba(47,181,184,.15) 2px 3px);
  clip-path:inset(0 100% 0 0);transition:clip-path .38s cubic-bezier(.7,0,.3,1)}
.hx-wipe.go{clip-path:inset(0 0 0 0)}

/* ── Decode / scramble text on load ─────────────────────────────── */
.hx-decode{font-variant-ligatures:none}
.hx-decode .g{color:var(--hx-cyan);opacity:.7}

/* ── Hero wordmark: stacked title lock-up ───────────────────────── */
.dash-title{display:flex;flex-direction:column;align-items:center;line-height:.85;gap:.02em;
  background:none;-webkit-text-fill-color:initial;color:var(--text);animation:none;filter:none;text-shadow:none}
.dash-title .gta{
  display:block;font-family:var(--font-display);font-weight:900;text-transform:uppercase;
  font-size:clamp(18px,3.4vh,42px);letter-spacing:.22em;color:var(--ink);
  -webkit-text-stroke:1px rgba(236,230,217,.35);paint-order:stroke fill;
  text-shadow:0 2px 0 rgba(236,230,217,.6),0 0 18px rgba(236,230,217,.25),0 0 40px rgba(255,90,69,.25)}
.dash-title .vi{
  display:block;margin:0;font-family:var(--font-display);font-weight:900;font-style:italic;
  font-size:clamp(96px,26vh,290px);letter-spacing:-.04em;line-height:.78;transform:skewX(-6deg);
  background:linear-gradient(175deg,#FFE29A 0%,#FF9A3D 22%,var(--coral) 55%,#8B4DFF 85%,#2E7BFF 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  -webkit-text-stroke:0;padding:.06em .1em;text-shadow:none;animation:none}
.dash-title{filter:drop-shadow(0 0 2px rgba(236,230,217,.35)) drop-shadow(0 6px 0 rgba(236,230,217,.85)) drop-shadow(0 0 28px rgba(255,90,69,.55)) drop-shadow(0 0 60px rgba(139,77,255,.35));animation:hx-vi-pulse 5s ease-in-out infinite}
@keyframes hx-vi-pulse{0%,100%{filter:drop-shadow(0 0 2px rgba(236,230,217,.35)) drop-shadow(0 6px 0 rgba(236,230,217,.85)) drop-shadow(0 0 28px rgba(255,90,69,.55)) drop-shadow(0 0 60px rgba(139,77,255,.35))}
  50%{filter:drop-shadow(0 0 3px rgba(236,230,217,.8)) drop-shadow(0 6px 0 rgba(236,230,217,.85)) drop-shadow(0 0 40px rgba(198,51,31,.7)) drop-shadow(0 0 90px rgba(255,90,69,.5))}}
.dash-title.hx-glitch .vi{animation:hx-glitch .7s steps(2) 1}
.dash-hero{gap:clamp(6px,1.2vh,14px)}
.dash-eyebrow{color:var(--hx-cyan);text-shadow:0 0 12px rgba(47,181,184,.5)}
/* palm-light behind the VI */
.dash-hero::before{content:"";position:absolute;left:50%;top:38%;width:min(60vw,560px);height:min(60vw,560px);transform:translate(-50%,-50%);z-index:-1;pointer-events:none;
  background:radial-gradient(circle,rgba(255,90,69,.28),rgba(198,51,31,.14) 35%,transparent 65%);filter:blur(30px);animation:hx-aurora 14s ease-in-out infinite alternate}
.dash-hero{position:relative}

/* ── Countdown = hex readout ─────────────────────────────────────── */
.dc-cell .hx-hex{display:block;font-family:var(--font-mono);font-size:9px;letter-spacing:.2em;color:#148385;margin-top:2px}

/* ── Image glitch slices occasionally ───────────────────────────── */
.hx-slice{animation:hx-slice .5s steps(3) 1}
@keyframes hx-slice{0%{clip-path:inset(20% 0 60% 0);transform:translateX(-6px)}33%{clip-path:inset(60% 0 10% 0);transform:translateX(6px)}66%{clip-path:inset(5% 0 80% 0);transform:translateX(-3px)}100%{clip-path:none;transform:none}}

@media(max-width:820px){.hx-rain{opacity:.35}.hx-circuit{opacity:.1}.dash-title .vi{font-size:clamp(84px,22vh,180px)}}
@keyframes hx-caret{50%{opacity:0}}
@media(prefers-reduced-motion:reduce){
  .hx-rain,.hx-ret,.hx-pulse,.hx-wipe,.hx-stream span{display:none;animation:none}
  .dash-title .vi,.dash-hero::before,.news-box-head::after{animation:none}
}

  
/* ═══════════════════════════════════════════════════════════════════
   HYPR v4 — "Liquid Rice"
   Fourth layer. Glass on everything, liquid-glass refraction via SVG
   displacement in backdrop-filter, cursor-reactive borders on every
   panel, cross-document View Transitions, scroll-driven animations,
   oklch()/color-mix() tokens, a Ctrl+K command palette (Popover API),
   a live notification island, adaptive quality, Konami ULTRA mode.
   ═══════════════════════════════════════════════════════════════════ */
@property --hx-px{syntax:"<length>";inherits:true;initial-value:0px}
@property --hx-py{syntax:"<length>";inherits:true;initial-value:0px}

:scope{
  --hx-cyan:oklch(88% .17 190); --hx-mag:oklch(66% .27 350); --hx-amber:oklch(82% .16 70);
  --hx-glass:color-mix(in oklab,oklch(20% .03 250) 42%,transparent);
  --hx-glass-2:color-mix(in oklab,oklch(24% .04 250) 55%,transparent);
  --hx-edge:color-mix(in oklab,var(--hx-cyan) 45%,transparent);
  --hx-radius:8px;
  scroll-behavior:smooth;
}
/* cross-document page transitions (Chromium 126+); replaces the JS wipe when supported */
@view-transition{navigation:auto}
::view-transition-old(root){animation:hx-vt-out .32s cubic-bezier(.7,0,.3,1) both}
::view-transition-new(root){animation:hx-vt-in .42s cubic-bezier(.2,.8,.2,1) both}
@keyframes hx-vt-out{to{opacity:0;transform:scale(1.02);filter:blur(6px)}}
@keyframes hx-vt-in{from{opacity:0;transform:scale(.985);filter:blur(10px) saturate(2)}}
@supports(view-transition-name:scope){.hx-wipe{display:none}}

/* ── Global glass ────────────────────────────────────────────────── */
.nav,.tabbar,.hx-stream,.ticker,.news-box,.vault-strip,.dc-cell,.ovid-frame,.video-frame,.foot-block,
.btn-ghost,.box-pill,.chip,.nav-pill,.tagline-pill,footer .wrap,.section-alt .wrap,.lightbox .lb-btn,.card,.tile,.forum-card,.post{
  background-color:var(--hx-glass)!important;
  -webkit-backdrop-filter:blur(28px) saturate(1.8) contrast(1.05) brightness(1.06);
  backdrop-filter:blur(28px) saturate(1.8) contrast(1.05) brightness(1.06);
}
.nav{-webkit-backdrop-filter:blur(34px) saturate(2);backdrop-filter:blur(34px) saturate(2);
  background-color:color-mix(in oklab,oklch(12% .02 250) 62%,transparent)!important;
  border-bottom:1px solid var(--hx-edge)}
.tabbar{background-color:color-mix(in oklab,oklch(12% .02 250) 70%,transparent)!important;border-top:1px solid var(--hx-edge)}
/* Fresnel edge: brighter rim where the glass meets light */
.news-box,.vault-strip,.dc-cell,.ovid-frame,.video-frame,.ticker,.foot-block{
  border-radius:var(--hx-radius);
  box-shadow:
    inset 0 1px 0 color-mix(in oklab,white 28%,transparent),
    inset 0 0 0 1px color-mix(in oklab,var(--hx-cyan) 14%,transparent),
    inset 0 -20px 40px -30px color-mix(in oklab,var(--hx-mag) 40%,transparent),
    0 30px 80px -20px oklch(0% 0 0 / .8),
    0 0 0 1px oklch(0% 0 0 / .5)}

/* ── Cursor-reactive border on EVERY panel (one :scope var, no per-element JS) ── */
.news-box,.vault-strip,.dc-cell,.ovid-frame,.video-frame,.ticker,.foot-block,.btn,.box-pill,.chip{position:relative}
.hx-ring{position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;z-index:8;padding:1.5px;
  background:radial-gradient(360px circle at calc(var(--hx-px) - var(--hx-ox,0px)) calc(var(--hx-py) - var(--hx-oy,0px)),
    color-mix(in oklab,var(--hx-cyan) 85%,white),color-mix(in oklab,var(--hx-mag) 60%,transparent) 30%,transparent 70%);
  -webkit-mask:linear-gradient(var(--surface) 0 0) content-box,linear-gradient(var(--surface) 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  opacity:.9;transition:opacity .3s}
.hx-ring::after{content:"";position:absolute;inset:0;border-radius:inherit;
  background:radial-gradient(260px circle at calc(var(--hx-px) - var(--hx-ox,0px)) calc(var(--hx-py) - var(--hx-oy,0px)),color-mix(in oklab,white 10%,transparent),transparent 60%)}

/* ── Scroll-driven: progress bar + parallax hero + reveal ────────── */
.hx-progress{position:fixed;left:0;top:var(--nav-h);height:2px;width:100%;z-index:201;transform-origin:left;
  background:linear-gradient(90deg,var(--hx-cyan),var(--hx-mag),var(--hx-amber));box-shadow:0 0 12px var(--hx-cyan);
  transform:scaleX(0)}
@supports(animation-timeline:scroll()){
  .hx-progress{animation:hx-progress linear both;animation-timeline:scroll(root)}
  @keyframes hx-progress{to{transform:scaleX(1)}}
  @keyframes hx-parallax{to{transform:translateY(-40px) scale(.96);opacity:.35;filter:blur(2px)}}
  .vault-strip,.section{animation:hx-rise linear both;animation-timeline:view();animation-range:entry 0% entry 35%}
  @keyframes hx-rise{from{opacity:.2;transform:translateY(40px) perspective(900px) rotateX(6deg)}}
}
@media(max-width:820px){.hx-progress{top:var(--nav-h)}}

/* ── Notification island ─────────────────────────────────────────── */
.hx-island{position:fixed;left:50%;bottom:22px;transform:translate(-50%,160%);z-index:300;
  display:flex;align-items:center;gap:12px;padding:8px 10px 8px 14px;border-radius:999px;max-width:min(92vw,560px);
  background:color-mix(in oklab,oklch(10% .02 250) 78%,transparent);-webkit-backdrop-filter:blur(30px) saturate(2);backdrop-filter:blur(30px) saturate(2);
  border:1px solid var(--hx-edge);box-shadow:0 20px 60px oklch(0% 0 0/.6),inset 0 1px 0 color-mix(in oklab,white 25%,transparent);
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.08em;color:var(--text);
  transition:transform .6s cubic-bezier(.2,1.2,.2,1)}
.hx-island.in{transform:translate(-50%,0)}
.hx-island .dot{width:8px;height:8px;border-radius:50%;background:var(--hx-mag);box-shadow:0 0 12px var(--hx-mag);animation:pulse 1.4s infinite}
.hx-island b{color:var(--hx-amber);font-weight:400}
.hx-island a{color:var(--ink);background:var(--hx-cyan);text-decoration:none;padding:5px 12px;border-radius:999px;font-weight:600;white-space:nowrap}
.hx-island button{color:var(--muted);padding:4px 6px}
@media(max-width:820px){.hx-island{bottom:calc(var(--tab-h) + 12px);font-size:10.5px}}

/* ── Command palette (Popover API) ───────────────────────────────── */
.hx-cmd{inset:0;margin:auto;width:min(92vw,640px);border:1px solid var(--hx-edge);border-radius:14px;padding:0;
  background:color-mix(in oklab,oklch(9% .02 250) 80%,transparent);-webkit-backdrop-filter:blur(36px) saturate(2);backdrop-filter:blur(36px) saturate(2);
  color:var(--text);box-shadow:0 40px 120px oklch(0% 0 0/.8),inset 0 1px 0 color-mix(in oklab,white 25%,transparent);
  font-family:var(--font-body);opacity:0;transform:translateY(-10px) scale(.98);transition:opacity .2s,transform .2s,overlay .2s allow-discrete,display .2s allow-discrete}
.hx-cmd:popover-open{opacity:1;transform:none}
@starting-style{.hx-cmd:popover-open{opacity:0;transform:translateY(-10px) scale(.98)}}
.hx-cmd::backdrop{background:oklch(0% 0 0/.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.hx-cmd input{width:100%;padding:16px 18px;background:none;border:0;border-bottom:1px solid var(--line);color:var(--text);
  font:15px var(--font-mono);letter-spacing:.06em;outline:none}
.hx-cmd input::placeholder{color:var(--faint)}
.hx-cmd ul{list-style:none;margin:0;padding:6px;max-height:50vh;overflow:auto}
.hx-cmd li{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:8px;cursor:pointer;color:var(--muted)}
.hx-cmd li[aria-selected="true"],.hx-cmd li:hover{background:color-mix(in oklab,var(--hx-cyan) 12%,transparent);color:var(--text)}
.hx-cmd li kbd{margin-left:auto;font:10px var(--font-mono);letter-spacing:.1em;color:var(--hx-cyan);border:1px solid var(--line);padding:2px 6px;border-radius:4px}
.hx-cmd li .k{font:10px var(--font-mono);letter-spacing:.14em;color:var(--hx-amber);min-width:52px}
.hx-cmd .hint{padding:8px 14px;border-top:1px solid var(--line);font:10px var(--font-mono);letter-spacing:.14em;color:var(--faint)}
.hx-kbd{position:fixed;left:16px;bottom:34px;z-index:200;font:10px var(--font-mono);letter-spacing:.14em;color:var(--faint);
  border:1px solid var(--line);padding:5px 9px;border-radius:6px;background:var(--hx-glass);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);cursor:pointer}
.hx-kbd:hover{color:var(--hx-cyan);border-color:var(--hx-edge)}
@media(max-width:820px){.hx-kbd{display:none}}

/* ── Micro-polish ───────────────────────────────────────────────── */
h1,h2,h3,.sec-title,.dash-tagline{text-wrap:balance}
p{text-wrap:pretty}
.news-row:has(img):hover img,.art-row:hover img{transform:scale(1.06)}
.news-row img,.art-row img{transition:transform .4s cubic-bezier(.2,.8,.2,1)}
img{image-rendering:auto}
.nav a,.btn,.box-pill,.chip{transition-timing-function:cubic-bezier(.2,.8,.2,1)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:oklch(8% .02 250)}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--hx-cyan),var(--hx-mag));border-radius:99px;border:3px solid oklch(8% .02 250)}
:scope{scrollbar-color:var(--hx-cyan) oklch(8% .02 250)}
.dash-title .vi{background-image:linear-gradient(175deg,oklch(94% .1 85) 0%,oklch(76% .19 55) 22%,oklch(66% .27 350) 55%,oklch(58% .25 300) 85%,oklch(62% .2 255) 100%)}

/* ── ULTRA mode (Konami) ────────────────────────────────────────── */
:scope.hx-ultra .hx-rain{opacity:1;mix-blend-mode:normal}
:scope.hx-ultra .hx-aurora{opacity:.9;filter:blur(50px) saturate(2)}
:scope.hx-ultra .hx-grid{opacity:1;animation-duration:1.2s}
:scope.hx-ultra :scope::after{opacity:1}
:scope.hx-ultra .dash-title{animation:hx-vi-pulse 1.2s ease-in-out infinite,hx-glitch 2s steps(2) infinite}
:scope.hx-ultra .news-box,:scope.hx-ultra .vault-strip{animation:hx-hue 4s linear infinite}
@keyframes hx-hue{to{filter:hue-rotate(360deg)}}

/* ── Adaptive quality (set by JS when FPS drops) ────────────────── */
:scope.hx-lite .hx-rain,:scope.hx-lite .hx-particles,:scope.hx-lite .hx-aurora,:scope.hx-lite .hx-sweep{display:none}
:scope.hx-lite .news-box,:scope.hx-lite .vault-strip,:scope.hx-lite .ovid-frame{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
:scope.hx-lite .hx-ring{display:none}

@media(prefers-reduced-motion:reduce){
  ::view-transition-old(root),::view-transition-new(root){animation:none}
  .dash-hero,.vault-strip,.section{animation:none!important}
  .hx-island{transition:none}
}

  
/* ═══════════════════════════════════════════════════════════════════
   HYPR v5 — "Shader City"
   Fifth layer. Raw-WebGL synthwave shader skyline behind everything,
   neofetch-style system monitor, a real command terminal (` key),
   synthesized UI audio (opt-in), idle screensaver, spring easings,
   variable-font breathing, gyro parallax on mobile.
   ═══════════════════════════════════════════════════════════════════ */
:scope{
  --hx-spring:linear(0,.009,.035 2.1%,.141,.281 6.7%,.723 12.9%,.938 16.7%,1.017,1.077,1.121,1.149 24.3%,1.159,1.163,1.161,1.154 29.9%,1.129 32.8%,1.051 39.6%,1.017 43.1%,.991,.977 51%,.974 53.8%,.975 57.1%,.997 69.8%,1.003 76.9%,1.004 83.8%,1);
  --hx-snap:linear(0,.4 7%,.8 15%,1.05 25%,.98 35%,1);
}
.hx-gl{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.85}
:scope.hx-lite .hx-gl{display:none}
.hx-aurora{opacity:.28}  /* shader carries the atmosphere now */

/* spring easings on interactive things */
.btn,.box-pill,.chip,.vault-all,.nav-pill,.news-row,.vstrip-card,.oshot-card,.hx-tilt{transition-timing-function:var(--hx-spring)}
.btn:active,.box-pill:active,.chip:active{transform:scale(.94);transition-duration:.08s}

/* variable-font breathing on nav + headings (Big Shoulders wght axis) */
.nav a:not(.nav-pill){font-variation-settings:"wght" 500;transition:font-variation-settings .35s var(--hx-spring),color .2s}
.nav a:not(.nav-pill):hover{font-variation-settings:"wght" 800}
.sec-title{transition:letter-spacing .5s var(--hx-spring)}
.section:hover .sec-title{letter-spacing:.06em}

/* ── System monitor (neofetch) ────────────────────────────────────── */
.hx-sys{position:fixed;left:16px;bottom:64px;z-index:200;width:236px;padding:10px 12px;border-radius:8px;
  background:var(--hx-glass);-webkit-backdrop-filter:blur(24px) saturate(1.8);backdrop-filter:blur(24px) saturate(1.8);
  border:1px solid var(--hx-edge);box-shadow:0 20px 50px oklch(0% 0 0/.6),inset 0 1px 0 color-mix(in oklab,white 22%,transparent);
  font:10px/1.7 var(--font-mono);letter-spacing:.08em;color:var(--muted);transform:translateX(calc(-100% - 24px));transition:transform .6s var(--hx-spring)}
.hx-sys.in{transform:none}
.hx-sys .h{color:var(--hx-cyan);letter-spacing:.2em;margin-bottom:4px;display:flex;justify-content:space-between}
.hx-sys .h button{color:var(--faint);font:inherit;letter-spacing:0}
.hx-sys .h button:hover{color:var(--hx-mag)}
.hx-sys .r{display:flex;gap:8px}.hx-sys .r span:first-child{color:var(--hx-amber);min-width:52px}
.hx-sys .bar{height:4px;background:oklch(0% 0 0/.5);border-radius:2px;overflow:hidden;margin:2px 0 4px}
.hx-sys .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--hx-cyan),var(--hx-mag));transition:width .5s var(--hx-spring)}
.hx-sys .sw{display:flex;gap:4px;margin-top:6px}.hx-sys .sw i{width:14px;height:8px;border-radius:2px}
@media(max-width:1100px){.hx-sys{display:none}}

/* ── Terminal drawer ─────────────────────────────────────────────── */
.hx-term{position:fixed;left:0;right:0;top:0;height:min(46vh,420px);z-index:400;transform:translateY(-102%);
  background:color-mix(in oklab,oklch(6% .02 250) 88%,transparent);-webkit-backdrop-filter:blur(30px) saturate(1.6);backdrop-filter:blur(30px) saturate(1.6);
  border-bottom:1px solid var(--hx-edge);box-shadow:0 30px 80px oklch(0% 0 0/.7);
  font:13px/1.5 var(--font-mono);color:var(--text);display:flex;flex-direction:column;transition:transform .45s var(--hx-spring)}
.hx-term.open{transform:none}
.hx-term .out{flex:1;overflow:auto;padding:14px 18px 6px;white-space:pre-wrap;word-break:break-word}
.hx-term .out .c{color:var(--hx-cyan)}.hx-term .out .m{color:var(--hx-mag)}.hx-term .out .a{color:var(--hx-amber)}.hx-term .out .d{color:var(--faint)}
.hx-term .in{display:flex;gap:8px;padding:8px 18px 12px;border-top:1px solid var(--line)}
.hx-term .in b{color:var(--hx-mag);font-weight:400}
.hx-term input{flex:1;background:none;border:0;outline:0;color:var(--text);font:inherit;caret-color:var(--hx-cyan)}
.hx-term::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(180deg,transparent 0 2px,oklch(0% 0 0/.12) 2px 3px)}

/* ── Idle screensaver ────────────────────────────────────────────── */
.hx-saver{position:fixed;inset:0;z-index:9990;background:oklch(4% .01 250);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  opacity:0;visibility:hidden;transition:opacity 1.4s,visibility 1.4s;cursor:none}
.hx-saver.on{opacity:1;visibility:visible}
.hx-saver .t{font:900 clamp(60px,16vw,220px)/1 var(--font-display);letter-spacing:-.02em;
  background:linear-gradient(175deg,oklch(94% .1 85),oklch(76% .19 55) 25%,oklch(66% .27 350) 60%,oklch(58% .25 300));-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:hx-saver-drift 18s ease-in-out infinite alternate}
.hx-saver .s{font:12px var(--font-mono);letter-spacing:.3em;color:var(--hx-cyan);opacity:.8}
.hx-saver .d{font:11px var(--font-mono);letter-spacing:.2em;color:var(--faint)}
@keyframes hx-saver-drift{from{transform:translate(-6vw,-4vh)}to{transform:translate(6vw,4vh)}}

/* ── Audio toggle chip ───────────────────────────────────────────── */
.hx-sfx{position:fixed;right:16px;bottom:64px;z-index:200;font:10px var(--font-mono);letter-spacing:.14em;color:var(--faint);
  border:1px solid var(--line);padding:5px 9px;border-radius:6px;background:var(--hx-glass);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);cursor:pointer}
.hx-sfx.on{color:var(--hx-cyan);border-color:var(--hx-edge);box-shadow:0 0 12px color-mix(in oklab,var(--hx-cyan) 40%,transparent)}
@media(max-width:820px){.hx-sfx{bottom:calc(var(--tab-h) + 12px)}}

/* gyro parallax target */
.dash-main{transition:transform .2s ease-out;transform-style:preserve-3d}


/* let the shader skyline show through the homepage hero backdrop */
.dash-bg .hero-sky,.dash-bg .hero-horizon{background:transparent!important}
.dash-bg .hero-sun{display:none}
.dash-bg .hero-shots{opacity:1;mix-blend-mode:normal}
.dash-bg .hero-shots-scrim{background:linear-gradient(180deg,rgba(236,230,217,.15),rgba(236,230,217,.55) 70%,rgba(236,230,217,.85))}
.hx-grid{opacity:.25}
@media(prefers-reduced-motion:reduce){.hx-gl,.hx-saver{display:none}.hx-sys,.hx-term{transition:none}}

  
/* ── Enhanced nav wordmark ───────────────────────────────────────── */
.brand-x{position:relative;display:flex;align-items:center;gap:8px;padding:4px 14px 4px 6px;margin-left:-6px;border-radius:8px;overflow:hidden;flex-shrink:0;
  font-family:var(--font-display);font-weight:900;font-size:23px;letter-spacing:.04em;line-height:1;text-decoration:none;
  border:1px solid transparent;transition:border-color .3s,box-shadow .3s,transform .4s var(--hx-spring,ease)}
.brand-x::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;opacity:0;transition:opacity .3s;
  background:linear-gradient(100deg,color-mix(in oklab,var(--hx-cyan) 10%,transparent),color-mix(in oklab,var(--hx-mag) 10%,transparent))}
.brand-x:hover{border-color:var(--hx-edge);box-shadow:0 0 24px color-mix(in oklab,var(--hx-mag) 30%,transparent),inset 0 1px 0 rgba(236,230,217,.12);transform:translateY(-1px)}
.brand-x:hover::before{opacity:1}
.bx-badge{width:38px;height:38px;flex-shrink:0;display:grid;place-items:center;filter:drop-shadow(0 0 8px color-mix(in oklab,var(--hx-mag) 60%,transparent))}
.bx-badge svg{width:100%;height:100%;overflow:visible}
.bx-hex{fill:color-mix(in oklab,oklch(12% .03 250) 85%,transparent);stroke:url(/assets/#bx-grad);stroke-width:1.5;
  stroke-dasharray:110;stroke-dashoffset:0;animation:bx-trace 6s linear infinite}
.bx-star{fill:url(/assets/#bx-grad);animation:bx-beat 2.4s ease-in-out infinite;transform-origin:20px 20px}
@keyframes bx-trace{to{stroke-dashoffset:-220}}
@keyframes bx-beat{0%,100%{transform:scale(1)}50%{transform:scale(1.14) rotate(6deg)}}
.bx-text{display:flex;flex-direction:column;gap:3px}
.bx-top{display:flex;align-items:center;gap:2px;color:var(--ink);text-shadow:0 2px 0 rgba(236,230,217,.7);-webkit-font-smoothing:antialiased}
.bx-top .w2{color:var(--hx-cyan);letter-spacing:.06em;padding-right:3px}
.bx-stars{display:inline-flex;gap:2px;margin:0 7px;transform:translateY(-1px)}
.bx-stars i{width:11px;height:11px;display:block;opacity:0;transform:scale(.4);
  clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);
  background:linear-gradient(180deg,#FFF3B0,var(--coral-2) 55%,var(--coral-2));filter:drop-shadow(0 0 5px rgba(198,51,31,.9));
  animation:bx-ignite .45s var(--hx-snap,ease-out) forwards,star-pulse 2.6s ease-in-out infinite}
.bx-stars i:nth-child(1){animation-delay:.2s,.7s}.bx-stars i:nth-child(2){animation-delay:.32s,.82s}.bx-stars i:nth-child(3){animation-delay:.44s,.94s}
.bx-stars i:nth-child(4){animation-delay:.56s,1.06s}.bx-stars i:nth-child(5){animation-delay:.68s,1.18s}.bx-stars i:nth-child(6){animation-delay:.8s,1.3s}
@keyframes bx-ignite{to{opacity:1;transform:scale(1)}}
.brand-x:hover .bx-stars i{opacity:1;transform:none;animation:bx-siren .5s steps(1) infinite}
.brand-x:hover .bx-stars i:nth-child(even){animation-delay:.25s}
@keyframes bx-siren{0%,49%{background:linear-gradient(180deg,var(--ink),#FF3B3B);filter:drop-shadow(0 0 6px #FF3B3B)}50%,100%{background:linear-gradient(180deg,var(--ink),#3C78FF);filter:drop-shadow(0 0 6px #3C78FF)}}
.bx-sub{font:8.5px var(--font-mono);letter-spacing:.26em;color:var(--faint);opacity:0;transform:translateY(-4px);animation:bx-sub .5s ease-out 1.1s forwards}
.bx-sub b{color:var(--hx-cyan);font-weight:400}.bx-sub em{color:var(--ink);font-style:normal;text-shadow:0 0 6px rgba(255,59,59,.7)}
@keyframes bx-sub{to{opacity:1;transform:none}}
.bx-sheen{position:absolute;top:-40%;bottom:-40%;left:-40%;width:35%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(236,230,217,.35),transparent);transform:skewX(-20deg);opacity:0}
.brand-x:hover .bx-sheen{animation:bx-sheen .8s ease-out 1}
@keyframes bx-sheen{0%{left:-40%;opacity:1}100%{left:120%;opacity:0}}
@media(max-width:820px){.brand-x{font-size:22px;gap:8px;padding:4px 8px 4px 4px}.bx-badge{width:30px;height:30px}.bx-sub{display:none}.bx-stars i{width:9px;height:9px}}
@media(prefers-reduced-motion:reduce){.bx-hex,.bx-star,.bx-top,.bx-stars i,.bx-sub,.bx-sheen{animation:none!important}.bx-stars i{opacity:1;transform:none}.bx-sub{opacity:1;transform:none}}
  
/* ── Cinematic nav pills (original vector art, inlined) ─────────── */
.nav-pill{position:relative;overflow:hidden;padding:7px 16px 7px 14px;border-radius:6px;isolation:isolate;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
  background:var(--bg) url(/assets/"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMjAgNjAiIHByZXNlcnZlQXNwZWN0UmF0aW89InhNaWRZTWlkIHNsaWNlIj4KICA8ZGVmcz4KICAgIDxsaW5lYXJHcmFkaWVudCBpZD0ic2t5IiB4MT0iMCIgeTE9IjAiIHgyPSIwIiB5Mj0iMSI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjMUIwQjNBIi8+PHN0b3Agb2Zmc2V0PSIuNTUiIHN0b3AtY29sb3I9IiM3QTFCNkIiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNGRjdBM0QiLz48L2xpbmVhckdyYWRpZW50PgogICAgPGxpbmVhckdyYWRpZW50IGlkPSJzdW4iIHgxPSIwIiB5MT0iMCIgeDI9IjAiIHkyPSIxIj48c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9IiNGRkUyOUEiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNGRjJGQTAiLz48L2xpbmVhckdyYWRpZW50PgogICAgPGxpbmVhckdyYWRpZW50IGlkPSJzZWEiIHgxPSIwIiB5MT0iMCIgeDI9IjAiIHkyPSIxIj48c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9IiNGRjdBM0QiIHN0b3Atb3BhY2l0eT0iLjkiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiMxRUYyRTYiIHN0b3Atb3BhY2l0eT0iLjU1Ii8+PC9saW5lYXJHcmFkaWVudD4KICAgIDxtYXNrIGlkPSJzdW5tIj48cmVjdCB3aWR0aD0iMjIwIiBoZWlnaHQ9IjYwIiBmaWxsPSIjZmZmIi8+PGcgZmlsbD0iIzAwMCI+PHJlY3QgeD0iMTIwIiB5PSIzMCIgd2lkdGg9IjYwIiBoZWlnaHQ9IjIiLz48cmVjdCB4PSIxMjAiIHk9IjM1IiB3aWR0aD0iNjAiIGhlaWdodD0iMi41Ii8+PHJlY3QgeD0iMTIwIiB5PSI0MSIgd2lkdGg9IjYwIiBoZWlnaHQ9IjMiLz48cmVjdCB4PSIxMjAiIHk9IjQ4IiB3aWR0aD0iNjAiIGhlaWdodD0iMy41Ii8+PC9nPjwvbWFzaz4KICA8L2RlZnM+CiAgPHJlY3Qgd2lkdGg9IjIyMCIgaGVpZ2h0PSI2MCIgZmlsbD0idXJsKCNza3kpIi8+CiAgPGNpcmNsZSBjeD0iMTUwIiBjeT0iMzgiIHI9IjE5IiBmaWxsPSJ1cmwoI3N1bikiIG1hc2s9InVybCgjc3VubSkiLz4KICA8cmVjdCB5PSI0NiIgd2lkdGg9IjIyMCIgaGVpZ2h0PSIxNCIgZmlsbD0idXJsKCNzZWEpIi8+CiAgPGcgZmlsbD0iIzBCMDYxNCI+CiAgICA8cmVjdCB4PSI4IiB5PSIzMCIgd2lkdGg9IjciIGhlaWdodD0iMzAiLz48cmVjdCB4PSIxNyIgeT0iMjIiIHdpZHRoPSI5IiBoZWlnaHQ9IjM4Ii8+PHJlY3QgeD0iMjgiIHk9IjM0IiB3aWR0aD0iNiIgaGVpZ2h0PSIyNiIvPjxyZWN0IHg9IjM2IiB5PSIxNCIgd2lkdGg9IjEwIiBoZWlnaHQ9IjQ2Ii8+PHJlY3QgeD0iNDgiIHk9IjI2IiB3aWR0aD0iOCIgaGVpZ2h0PSIzNCIvPjxyZWN0IHg9IjU4IiB5PSIxOSIgd2lkdGg9IjciIGhlaWdodD0iNDEiLz48cmVjdCB4PSI2NyIgeT0iMzEiIHdpZHRoPSIxMSIgaGVpZ2h0PSIyOSIvPjxyZWN0IHg9IjgwIiB5PSIxMCIgd2lkdGg9IjgiIGhlaWdodD0iNTAiLz48cmVjdCB4PSI5MCIgeT0iMjgiIHdpZHRoPSI5IiBoZWlnaHQ9IjMyIi8+PHJlY3QgeD0iMTAxIiB5PSIyMSIgd2lkdGg9IjciIGhlaWdodD0iMzkiLz48cmVjdCB4PSIxMTAiIHk9IjM2IiB3aWR0aD0iMTAiIGhlaWdodD0iMjQiLz48cmVjdCB4PSIxMjIiIHk9IjI3IiB3aWR0aD0iNiIgaGVpZ2h0PSIzMyIvPjxyZWN0IHg9IjE4MCIgeT0iMzMiIHdpZHRoPSI4IiBoZWlnaHQ9IjI3Ii8+PHJlY3QgeD0iMTkwIiB5PSIyNCIgd2lkdGg9IjkiIGhlaWdodD0iMzYiLz48cmVjdCB4PSIyMDEiIHk9IjMwIiB3aWR0aD0iNyIgaGVpZ2h0PSIzMCIvPjxyZWN0IHg9IjIxMCIgeT0iMzgiIHdpZHRoPSIxMCIgaGVpZ2h0PSIyMiIvPgogIDwvZz4KICA8ZyBmaWxsPSIjMUVGMkU2IiBvcGFjaXR5PSIuODUiPjxyZWN0IHg9IjM4IiB5PSIxOCIgd2lkdGg9IjEuNSIgaGVpZ2h0PSIyIi8+PHJlY3QgeD0iNDIiIHk9IjI0IiB3aWR0aD0iMS41IiBoZWlnaHQ9IjIiLz48cmVjdCB4PSI4MiIgeT0iMTQiIHdpZHRoPSIxLjUiIGhlaWdodD0iMiIvPjxyZWN0IHg9Ijg0IiB5PSIyMiIgd2lkdGg9IjEuNSIgaGVpZ2h0PSIyIi8+PHJlY3QgeD0iMTkiIHk9IjI3IiB3aWR0aD0iMS41IiBoZWlnaHQ9IjIiLz48cmVjdCB4PSI2MCIgeT0iMjQiIHdpZHRoPSIxLjUiIGhlaWdodD0iMiIvPjxyZWN0IHg9IjE5MiIgeT0iMjgiIHdpZHRoPSIxLjUiIGhlaWdodD0iMiIvPjxyZWN0IHg9IjEwMyIgeT0iMjYiIHdpZHRoPSIxLjUiIGhlaWdodD0iMiIvPjwvZz4KICA8ZyBmaWxsPSIjRkZCNDU0IiBvcGFjaXR5PSIuOCI+PHJlY3QgeD0iNDAiIHk9IjMwIiB3aWR0aD0iMS41IiBoZWlnaHQ9IjIiLz48cmVjdCB4PSIyMSIgeT0iMzUiIHdpZHRoPSIxLjUiIGhlaWdodD0iMiIvPjxyZWN0IHg9Ijg2IiB5PSIzNCIgd2lkdGg9IjEuNSIgaGVpZ2h0PSIyIi8+PHJlY3QgeD0iNjIiIHk9IjM2IiB3aWR0aD0iMS41IiBoZWlnaHQ9IjIiLz48cmVjdCB4PSIxOTUiIHk9IjQwIiB3aWR0aD0iMS41IiBoZWlnaHQ9IjIiLz48L2c+CiAgPGcgc3Ryb2tlPSIjMEIwNjE0IiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTE2OCA2MFYzMiIvPjxwYXRoIGQ9Ik0xNjggMzNjLTYtNC0xMi0zLTE1IDFNMTY4IDMzYzYtNCAxMi0zIDE1IDFNMTY4IDMyYy0zLTYtOS04LTEzLTZNMTY4IDMyYzMtNiA5LTggMTMtNk0xNjggMzJjLTEtNiAyLTExIDYtMTJNMTY4IDMyYzEtNi0yLTExLTYtMTIiLz48L2c+CiAgPHJlY3Qgd2lkdGg9IjIyMCIgaGVpZ2h0PSI2MCIgZmlsbD0idXJsKCNza3kpIiBvcGFjaXR5PSIwIi8+Cjwvc3ZnPgo=") center/cover no-repeat!important;
  box-shadow:inset 0 0 0 1px rgba(47,181,184,.35),inset 0 1px 0 rgba(236,230,217,.18);color:var(--ink);
  text-shadow:0 1px 0 var(--surface),1px 0 0 var(--surface),-1px 0 0 var(--surface),0 -1px 0 var(--surface);min-width:150px;
  transition:transform .35s var(--hx-spring,ease),box-shadow .25s,background-position .8s ease}
.nav-pill.rdr{background:var(--surface) url(/assets/"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMjAgNjAiIHByZXNlcnZlQXNwZWN0UmF0aW89InhNaWRZTWlkIHNsaWNlIj4KICA8ZGVmcz4KICAgIDxsaW5lYXJHcmFkaWVudCBpZD0icnNreSIgeDE9IjAiIHkxPSIwIiB4Mj0iMCIgeTI9IjEiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iIzNBMEMwQyIvPjxzdG9wIG9mZnNldD0iLjUiIHN0b3AtY29sb3I9IiNCODMyMUUiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNGMEEyNEEiLz48L2xpbmVhckdyYWRpZW50PgogICAgPHJhZGlhbEdyYWRpZW50IGlkPSJyc3VuIiBjeD0iLjUiIGN5PSIuNSIgcj0iLjUiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI0ZGRjFDOSIvPjxzdG9wIG9mZnNldD0iLjYiIHN0b3AtY29sb3I9IiNGRkMwNEEiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNGRjdBMkEiIHN0b3Atb3BhY2l0eT0iMCIvPjwvcmFkaWFsR3JhZGllbnQ+CiAgICA8ZmlsdGVyIGlkPSJncmFpbiI+PGZlVHVyYnVsZW5jZSB0eXBlPSJmcmFjdGFsTm9pc2UiIGJhc2VGcmVxdWVuY3k9Ii45IiBudW1PY3RhdmVzPSIyIiBzdGl0Y2hUaWxlcz0ic3RpdGNoIi8+PGZlQ29sb3JNYXRyaXggdmFsdWVzPSIwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAuMjUgMCIvPjwvZmlsdGVyPgogIDwvZGVmcz4KICA8cmVjdCB3aWR0aD0iMjIwIiBoZWlnaHQ9IjYwIiBmaWxsPSJ1cmwoI3Jza3kpIi8+CiAgPGNpcmNsZSBjeD0iNzIiIGN5PSIzMCIgcj0iMjQiIGZpbGw9InVybCgjcnN1bikiLz4KICA8Y2lyY2xlIGN4PSI3MiIgY3k9IjMwIiByPSIxMiIgZmlsbD0iI0ZGRTM5QSIvPgogIDxwYXRoIGQ9Ik0wIDQwbDE4LTkgMTIgNiAxNi0xNCAxNCA5IDEyLTYgMjAgMTIgMTQtMTAgMTYgOCAxMi0xNCAxOCAxMiAxNC04IDIwIDkgMTQtNyAyMCAxMFY2MEgweiIgZmlsbD0iIzNBMTQwOCIvPgogIDxwYXRoIGQ9Ik0wIDQ3bDIyLTYgMTQgNSAxOC05IDE2IDcgMjQtNiAxNiA2IDIyLTggMTggNyAyMC01IDIyIDcgMjgtNlY2MEgweiIgZmlsbD0iIzFFMEEwNiIvPgogIDxnIGZpbGw9IiMwRTA1MDMiPjxwYXRoIGQ9Ik0xODYgNjBWMzhoM3YtOGgydjhoM3YyMnoiLz48cGF0aCBkPSJNMTgwIDQ2aDN2MTRoLTN6TTE5NCA0NmgzdjE0aC0zeiIvPjxwYXRoIGQ9Ik0xODYgNjBWMzAiLz48L2c+CiAgPGcgc3Ryb2tlPSIjMEUwNTAzIiBzdHJva2Utd2lkdGg9IjEuNiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBmaWxsPSJub25lIj48cGF0aCBkPSJNNDAgNjBWNDZNNDAgNDdjLTQgMC02IDQtNCA3TTQwIDQ5YzQtMSA2IDMgNCA3Ii8+PHBhdGggZD0iTTExOCA2MFY1ME0xMTggNTFjLTMgMC00IDMtMyA1Ii8+PC9nPgogIDxnIGZpbGw9IiNGRkUzOUEiPjxjaXJjbGUgY3g9IjE1MCIgY3k9IjEwIiByPSIuNyIvPjxjaXJjbGUgY3g9IjMwIiBjeT0iOCIgcj0iLjYiLz48Y2lyY2xlIGN4PSIyMDAiIGN5PSIxNCIgcj0iLjciLz48Y2lyY2xlIGN4PSIxMTAiIGN5PSI2IiByPSIuNSIvPjxjaXJjbGUgY3g9IjE3MCIgY3k9IjE4IiByPSIuNSIvPjwvZz4KICA8cmVjdCB3aWR0aD0iMjIwIiBoZWlnaHQ9IjYwIiBmaWx0ZXI9InVybCgjZ3JhaW4pIiBvcGFjaXR5PSIuNiIvPgo8L3N2Zz4K") center/cover no-repeat!important;
  box-shadow:inset 0 0 0 1px rgba(198,51,31,.45),inset 0 1px 0 rgba(236,230,217,.18);color:var(--ink)}
.nav-pill::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(236,230,217,.25),rgba(236,230,217,.55)),linear-gradient(90deg,rgba(236,230,217,.45),rgba(236,230,217,.05) 70%);transition:opacity .3s}
.nav-pill::after{content:"";position:absolute;top:-40%;bottom:-40%;left:-40%;width:35%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(236,230,217,.45),transparent);transform:skewX(-20deg);opacity:0}
.nav-pill:hover{transform:translateY(-2px) scale(1.03);background-position:60% center!important;
  box-shadow:inset 0 0 0 1px rgba(47,181,184,.8),0 10px 26px rgba(255,90,69,.45),0 0 30px rgba(47,181,184,.25);color:var(--ink)}
.nav-pill.rdr:hover{box-shadow:inset 0 0 0 1px rgba(198,51,31,.9),0 10px 26px rgba(184,50,30,.55),0 0 30px rgba(198,51,31,.3);color:var(--ink)}
.nav-pill:hover::before{opacity:.6}
.nav-pill:hover::after{animation:bx-sheen .7s ease-out 1}
.nav-pill .np-dot{width:8px;height:8px;background:var(--teal)!important;box-shadow:0 0 10px var(--teal),0 0 2px var(--ink)!important;animation:pulse 1.6s infinite}
.nav-pill.rdr .np-dot{background:var(--coral-2)!important;box-shadow:0 0 10px var(--coral-2),0 0 2px var(--ink)!important}
.nav-pill .np-sub,.nav-pill.rdr .np-sub,.nav-pill:hover .np-sub,.nav-pill.rdr:hover .np-sub{color:var(--ink);font-family:var(--font-mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;text-shadow:0 1px 0 var(--surface),1px 0 0 var(--surface),-1px 0 0 var(--surface)}
.nav-pill[aria-current="page"]{box-shadow:inset 0 0 0 2px var(--teal),0 0 18px rgba(47,181,184,.5)!important}
.nav-pill.rdr[aria-current="page"]{box-shadow:inset 0 0 0 2px var(--coral-2),0 0 18px rgba(198,51,31,.5)!important}
.nav-pill.rdr:hover .np-dot,.nav-pill:hover .np-dot{background:var(--surface)!important}
@media(max-width:1180px){.nav-pill{min-width:0;padding:7px 12px}}
  
/* ── Enhanced nav links ─────────────────────────────────────────── */
.nl-x{position:relative;gap:2px;padding:3px;border-radius:8px;background:color-mix(in oklab,oklch(14% .03 250) 88%,transparent);
  transform:translateZ(0);
  box-shadow:inset 0 0 0 1px var(--line),inset 0 1px 0 rgba(236,230,217,.08)}
.nl-x a{display:inline-flex;align-items:center;gap:6px;padding:8px 11px;border-radius:5px;white-space:nowrap;
  font-family:var(--font-display);font-weight:800;font-size:14.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--text);
  text-shadow:0 1px 0 rgba(236,230,217,.9);-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision;
  background:none;position:relative;z-index:1;transition:color .2s,transform .3s var(--hx-spring,ease);
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.nl-x a::after{display:none}
.nl-x a svg{width:16px;height:16px;flex-shrink:0;opacity:.95;stroke-width:2;transition:opacity .2s,transform .3s var(--hx-spring,ease),filter .2s}
.nl-x a:hover{color:var(--ink);background:none;transform:none;text-shadow:none}
.nl-x a:hover svg{opacity:1;transform:scale(1.15) rotate(-6deg);filter:none}
.nl-x a:hover .soon{color:var(--ink);border-color:var(--ink)}
.nl-x:hover a[aria-current="page"]:not(:hover){color:var(--text)}
.nl-x:hover a[aria-current="page"]:not(:hover) .soon{color:var(--hx-mag);border-color:color-mix(in oklab,var(--hx-mag) 50%,transparent)}
.nl-x.glow-on a[aria-current="page"]{color:var(--ink);background:none;box-shadow:none;text-shadow:none}
.nl-x a[aria-current="page"] svg{opacity:1;filter:none}
.nl-x a[aria-current="page"] .soon{color:var(--ink);border-color:var(--ink)}
/* sliding glow follows the active/hovered link */
.nl-glow{position:absolute;top:3px;left:0;height:calc(100% - 6px);width:0;z-index:0;border-radius:5px;pointer-events:none;will-change:left,width;
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);
  background:linear-gradient(100deg,var(--hx-amber),var(--hx-mag) 55%,var(--hx-cyan));
  box-shadow:0 0 18px color-mix(in oklab,var(--hx-mag) 55%,transparent),0 0 30px color-mix(in oklab,var(--hx-cyan) 25%,transparent);
  transition:left .45s var(--hx-spring,ease),width .45s var(--hx-spring,ease),opacity .2s;opacity:0}
.nl-glow.on{opacity:1}
.nl-x a .soon{font-size:8px;letter-spacing:.14em;color:var(--hx-mag);vertical-align:baseline;margin-left:0;
  border:1px solid color-mix(in oklab,var(--hx-mag) 50%,transparent);padding:1px 5px;border-radius:99px;line-height:1.3}
@media(max-width:1500px){.nl-x a{padding:8px 8px;gap:4px;font-size:13.5px;letter-spacing:.06em}.nl-x a .soon{display:none}.nav-pill{min-width:0;padding:7px 11px}}
@media(max-width:1300px){.nl-x a .nl-t{display:none}.nl-x a{padding:8px 10px}.nl-x a svg{width:17px;height:17px}}
@media(prefers-reduced-motion:reduce){.nl-glow{transition:none}}
  
/* ── State-of-the-art footer ─────────────────────────────────────── */
.ft{position:relative;margin-top:clamp(40px,7vw,96px);padding:0 0 max(28px,env(safe-area-inset-bottom));border-top:0;
  background:linear-gradient(180deg,transparent,color-mix(in oklab,oklch(6% .02 250) 70%,transparent) 12%,oklch(4% .015 250));isolation:isolate}
.ft-wave{height:40px;overflow:hidden;opacity:.9}
.ft-wave svg{width:100%;height:100%;display:block}
.ft-wave-p{fill:none;stroke:var(--hx-cyan);stroke-width:1.2;stroke-dasharray:6 8;animation:ft-dash 6s linear infinite;filter:drop-shadow(0 0 6px var(--hx-cyan))}
.ft-wave-p2{stroke:var(--hx-mag);animation-direction:reverse;filter:drop-shadow(0 0 6px var(--hx-mag))}
@keyframes ft-dash{to{stroke-dashoffset:-140}}
.ft-marquee{overflow:hidden;border-top:1px solid var(--hx-edge);border-bottom:1px solid var(--hx-edge);
  background:var(--hx-glass);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6);
  -webkit-mask-image:linear-gradient(90deg,transparent,var(--surface) 8%,var(--surface) 92%,transparent);mask-image:linear-gradient(90deg,transparent,var(--surface) 8%,var(--surface) 92%,transparent)}
.ft-marquee-track{display:flex;width:max-content;animation:ft-marquee 40s linear infinite}
.ft-marquee-track span{padding:10px 0;font-family:var(--font-display);font-weight:900;font-size:clamp(18px,2.6vw,30px);letter-spacing:.14em;color:transparent;
  -webkit-text-stroke:1px color-mix(in oklab,var(--text) 55%,transparent);white-space:nowrap}
.ft-marquee-track i{font-style:normal;-webkit-text-stroke:0;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:.02em}
.ft-marquee:hover .ft-marquee-track{animation-play-state:paused}
@keyframes ft-marquee{to{transform:translateX(-50%)}}
.ft-wrap{padding-top:clamp(28px,4vw,52px)}
.ft-grid{display:grid;grid-template-columns:1.8fr 1fr 1fr;gap:clamp(22px,3vw,48px);align-items:start}
@media(max-width:980px){.ft-grid{grid-template-columns:1fr 1fr}.ft-brand-col{grid-column:1/-1}}
@media(max-width:560px){.ft-grid{grid-template-columns:1fr}}
.ft-brand{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-family:var(--font-display);font-weight:900;font-size:34px;letter-spacing:.05em;color:var(--text);line-height:1}
.ft-brand .ft-b2{color:var(--muted)}
.ft-stars{display:inline-flex;gap:2px}
.ft-stars i{width:14px;height:14px;clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);background:var(--grad);
  animation:ft-star 2.4s ease-in-out infinite;filter:drop-shadow(0 0 6px rgba(255,90,69,.6))}
.ft-stars i:nth-child(2){animation-delay:.12s}.ft-stars i:nth-child(3){animation-delay:.24s}.ft-stars i:nth-child(4){animation-delay:.36s}.ft-stars i:nth-child(5){animation-delay:.48s}.ft-stars i:nth-child(6){animation-delay:.6s}
@keyframes ft-star{0%,100%{transform:scale(1)}50%{transform:scale(1.25) rotate(8deg)}}
.ft-tag{margin:12px 0 18px;color:var(--muted);font-size:13.5px;line-height:1.6;max-width:36ch;text-wrap:pretty}
.ft-status{display:flex;flex-direction:column;gap:6px;font:11px var(--font-mono);letter-spacing:.14em;color:var(--faint)}
.ft-st{display:flex;align-items:center;gap:10px}.ft-st b{color:var(--text);font-weight:400;margin-left:auto;font-variant-numeric:tabular-nums}
.ft-led{width:7px;height:7px;border-radius:50%;background:var(--hx-cyan);box-shadow:0 0 8px var(--hx-cyan);animation:pulse 2s infinite}
.ft-led.amber{background:var(--hx-amber);box-shadow:0 0 8px var(--hx-amber)}.ft-led.mag{background:var(--hx-mag);box-shadow:0 0 8px var(--hx-mag)}
.ft-col h3,.ft-col h4{font:11px var(--font-mono);letter-spacing:.24em;text-transform:uppercase;color:var(--hx-cyan);margin:0 0 12px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.ft-col a{display:flex;align-items:center;gap:10px;padding:7px 0;color:var(--muted);text-decoration:none;font-size:14px;transition:color .2s,transform .3s var(--hx-spring)}
.ft-col a:hover{color:var(--text);transform:translateX(6px)}
.ft-col a .k{font:10px var(--font-mono);letter-spacing:.12em;color:var(--hx-amber);opacity:.8}
.ft-col a .x{margin-left:auto;color:var(--hx-cyan);opacity:.6;font-size:12px}
.ft-col a em{font:9px var(--font-mono);letter-spacing:.14em;color:var(--hx-mag);font-style:normal;border:1px solid color-mix(in oklab,var(--hx-mag) 40%,transparent);padding:1px 6px;border-radius:99px}
.ft-console{display:flex;flex-direction:column;gap:6px}
.ft-cmd{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:6px;border:1px solid var(--line);background:var(--hx-glass);
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:var(--muted);font-size:13px;text-align:left;transition:border-color .2s,color .2s,transform .3s var(--hx-spring)}
.ft-cmd:hover{border-color:var(--hx-edge);color:var(--text);transform:translateX(4px)}
.ft-cmd kbd{font:10px var(--font-mono);letter-spacing:.08em;color:var(--hx-cyan);border:1px solid var(--hx-edge);padding:2px 6px;border-radius:4px;min-width:20px;text-align:center}
.ft-cmd span{margin-left:auto}
.ft .foot-top-btn{font-weight:400;font-size:13px;letter-spacing:0;text-transform:none;background:var(--hx-glass);box-shadow:none}
.ft-legal{margin-top:clamp(24px,3vw,40px);border:1px solid var(--line);border-radius:8px;background:var(--hx-glass);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);overflow:hidden}
.ft-legal summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:12px 16px;
  font:11px var(--font-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--faint);transition:color .2s}
.ft-legal summary::-webkit-details-marker{display:none}
.ft-legal summary:hover,.ft-legal[open] summary{color:var(--hx-cyan)}
.ft-legal-i{font-size:16px;transition:transform .3s var(--hx-spring)}
.ft-legal[open] .ft-legal-i{transform:rotate(45deg)}
.ft-legal-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;padding:0 16px 16px;border-top:1px solid var(--line);padding-top:16px}
.ft-lb h5{font:10px var(--font-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--hx-amber);margin:0 0 6px}
.ft-lb p{margin:0;color:var(--faint);font-size:12.5px;line-height:1.65}
.ft-bottom{display:flex;flex-wrap:wrap;gap:10px 24px;align-items:center;justify-content:space-between;margin-top:22px;padding-top:16px;border-top:1px solid var(--line)}
.ft .foot-copy{margin:0;padding:0;border:0;color:var(--faint);font-size:12px}
.ft .foot-copy::before{content:none}
.ft-build{margin:0;font:10px var(--font-mono);letter-spacing:.2em;color:var(--faint)}
.ft-build span:first-child{color:var(--hx-mag)}
@media(prefers-reduced-motion:reduce){.ft-marquee-track,.ft-wave-p,.ft-stars i,.ft-led{animation:none}}
  
/* ── Footer: skyline, watermark, launch road, socials ─────────── */
.ft-skyline{position:relative;height:180px;overflow:hidden;margin-top:-40px;
  background:linear-gradient(180deg,transparent,rgba(255,90,69,.10) 40%,rgba(198,51,31,.16) 70%,rgba(236,230,217,.0))}
.ft-sun{position:absolute;left:50%;bottom:-70px;width:250px;height:250px;transform:translateX(-50%);border-radius:50%;
  background:conic-gradient(from 180deg,var(--coral-2),var(--coral),var(--blue),var(--teal),var(--coral-2));filter:blur(1px) saturate(1.2);opacity:.85;
  -webkit-mask-image:repeating-linear-gradient(180deg,var(--surface) 0 9px,transparent 9px 13px),linear-gradient(180deg,var(--surface) 55%,transparent);-webkit-mask-composite:source-in;
  mask-image:repeating-linear-gradient(180deg,var(--surface) 0 9px,transparent 9px 13px),linear-gradient(180deg,var(--surface) 55%,transparent);mask-composite:intersect}
.ft-sky{position:absolute;left:0;right:0;bottom:0;width:100%;height:180px;display:block}
.ft-bld{fill:var(--surface)}
.ft-win rect{fill:var(--c,var(--teal));opacity:.15;animation:ft-win 5s ease-in-out infinite;animation-delay:var(--d,0s)}
@keyframes ft-win{0%,100%{opacity:.15}50%{opacity:.95}}
.ft-wrap{position:relative;isolation:isolate}
.ft-wm{position:absolute;right:-2%;top:-30px;z-index:-1;pointer-events:none;font:900 clamp(200px,28vw,420px)/1 var(--font-display);font-style:italic;letter-spacing:-.05em;
  background:linear-gradient(175deg,#FFE29A,#FF9A3D 22%,var(--coral) 55%,#8B4DFF 85%,#2E7BFF);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:.10;transform:skewX(-6deg)}
.ft-road{margin-top:22px;padding:14px 16px;border:1px solid var(--line);border-radius:8px;background:var(--hx-glass);position:relative;overflow:hidden}
.ft-road-h{display:flex;justify-content:space-between;font:10px var(--font-mono);letter-spacing:.22em;color:var(--hx-cyan);text-transform:uppercase;margin-bottom:8px}
.ft-road-h b{color:var(--hx-amber);font-weight:400}
.ft-road-bar{height:8px;border-radius:99px;background:oklch(0% 0 0/.5);overflow:hidden;position:relative}
.ft-road-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--hx-cyan),var(--hx-mag),var(--hx-amber));box-shadow:0 0 14px var(--hx-mag);transition:width 1.4s var(--hx-spring,ease)}
.ft-road-bar b{position:absolute;top:-4px;width:16px;height:16px;border-radius:50%;background:var(--surface);box-shadow:0 0 14px var(--hx-cyan);transform:translateX(-50%);left:0;transition:left 1.4s var(--hx-spring,ease)}
.ft-road-m{display:flex;justify-content:space-between;margin-top:6px;font:9px var(--font-mono);letter-spacing:.14em;color:var(--faint)}
.ft-social{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.ft-social a{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border:1px solid var(--line);border-radius:5px;color:var(--muted);text-decoration:none;
  font:10.5px var(--font-mono);letter-spacing:.12em;text-transform:uppercase;background:var(--hx-glass);
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);transition:color .2s,border-color .2s,transform .3s var(--hx-spring,ease)}
.ft-social a:hover{color:var(--ink);border-color:var(--hx-edge);transform:translateY(-2px)}
.ft-social svg{width:13px;height:13px;fill:currentColor}
.ft-top{margin-left:auto;display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border:1px solid var(--hx-edge);border-radius:5px;color:var(--hx-cyan);
  font:10px var(--font-mono);letter-spacing:.2em;background:var(--hx-glass);clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);transition:transform .3s var(--hx-spring,ease),color .2s}
.ft-top:hover{color:var(--ink);transform:translateY(-3px)}
.ft-top i{display:inline-block;font-style:normal;animation:ft-bounce 1.8s ease-in-out infinite}
@keyframes ft-bounce{50%{transform:translateY(-3px)}}
@media(max-width:820px){.ft-skyline{height:120px}.ft-sky{height:120px}.ft-sun{width:220px;height:220px}.ft-wm{display:none}}
@media(prefers-reduced-motion:reduce){.ft-win rect,.ft-top i{animation:none}.ft-win rect{opacity:.6}}
  

/* Effects retired site-wide on October 11, 2026: no particle/rain/aurora/grid/HUD/ember layers */
.hx-rain,.hx-particles,.hx-aurora,.hx-circuit,.hx-hud,.hx-grid,.hx-sweep,.hx-frame,.hx-field,.hx-gl,.hx-wipe,.hx-ring,.hx-foil,.hx-sheen,.hx-saver,.hx-term,.hx-cmd,.hx-kbd,.hx-progress,.embers,.shooting-star{display:none!important}
.hero-palms{display:none!important}
/* Overlays removed site-wide, October 11, 2026 */
.hero-shots-scrim,.fr-tile::after,.yt-facade::after,.vid-thumb::after,.shot::after,.oshot-card::after{display:none!important}

/* footer skyline, wave and ticker removed (Oct 12) */
.ft{border-top:1px solid var(--hx-edge)}
/* top bar: tabs on the left, brand on the right (Oct 12) */
.nav .nav-links{margin-left:0}.nav .brand{margin-left:auto}
@media(max-width:820px){.nav .brand{margin-left:0}}
/* compact footer (Oct 12) */
.ft.ft-compact{margin-top:clamp(32px,5vw,64px);padding:22px 0 max(18px,env(safe-area-inset-bottom));background:rgba(var(--night-rgb),.6);border-top:1px solid var(--hx-edge);isolation:auto}
.ft-compact .wrap{display:flex;flex-direction:column;gap:12px}
.ftc-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px}
.ftc-row2{justify-content:space-between}
.ftc-brand{font-family:var(--font-display);font-size:20px;letter-spacing:.04em;color:var(--text);text-decoration:none;white-space:nowrap}
.ftc-stars{color:var(--pink);font-size:12px;margin:0 6px;letter-spacing:.1em;vertical-align:2px}
.ftc-links{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:13px}
.ftc-links a{color:var(--muted);text-decoration:none;white-space:nowrap}
.ftc-links a:hover{color:var(--text)}
.ftc-lbl{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.ftc-official a::after{content:" \2197";font-size:11px;color:var(--teal)}
.ftc-legal{margin:0;border:0;background:transparent;padding:0;font-size:13px;position:relative}
.ftc-legal summary{cursor:pointer;list-style:none;color:var(--muted);padding:0;background:transparent;border:0;font:inherit;font-size:13px;text-transform:none;letter-spacing:0}.ftc-legal summary::after{content:" +";color:var(--teal)}.ftc-legal[open] summary::after{content:" \2212"}
.ftc-legal summary::-webkit-details-marker{display:none}
.ftc-legal summary:hover{color:var(--text)}
.ftc-legal[open]{flex-basis:100%}
.ftc-legal .ft-legal-grid{margin-top:12px;padding:14px 16px;border:1px solid var(--hx-edge);border-radius:6px;background:rgba(var(--card-rgb),.6);display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px 20px}
.ftc-legal .ft-lb h5{margin:0 0 4px;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}
.ftc-legal .ft-lb p{margin:0;font-size:12.5px;line-height:1.5;color:var(--muted)}
.ftc-copy{margin:4px 0 0;font-size:12px;color:var(--muted);line-height:1.5;border-top:1px solid var(--line);padding-top:12px}
@media(max-width:820px){.ft.ft-compact{padding-bottom:calc(var(--tab-h,64px) + 18px)}.ftc-row2{flex-direction:column;align-items:flex-start}}

/* == assets/mobile-polish.css == */
/* SixStarsWanted — phone polish (loaded on every page, applies at 820px and below)
   1. The top-left/right logo matches the desktop one: same size, badge and "LEONIDA · WANTED LEVEL MAX" line.
   2. Smoother scrolling: no scroll-boxes inside the page that catch swipes, no heavy blur on layers that
      repaint every scroll frame, anchor jumps clear the fixed header, faster taps. */

@media (max-width: 820px) {

  /* ── 1. Logo: same as desktop ─────────────────────────────────────────── */
  :scope .brand-x { font-size: 23px; gap: 8px; padding: 4px 14px 4px 6px; margin-left: 0; letter-spacing: .04em; }
  :scope .bx-badge { width: 38px; height: 38px; }
  :scope .bx-sub { display: block; }
  :scope .bx-top .w2 { padding-right: 3px; }

  /* ── 2. Scrolling ─────────────────────────────────────────────────────── */
  :scope { scroll-padding-top: calc(var(--nav-h, 64px) + 12px); -webkit-text-size-adjust: 100%; }
  a, button, summary, [role="button"] { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }

  /* the three home-page side boxes were 220px tall with their own scrollbars; let the page do the scrolling
     and show the latest few items instead */
  .news-box.side-box { height: auto; flex: 0 0 auto; }
  .side-box .news-list { max-height: none; overflow: visible; }
  .side-box .news-list > *:nth-child(n+8) { display: none; }

  /* blur on every card and pill forces a repaint on each scroll frame on phones; their fills are already
     86-96% opaque, so drop the blur there. The fixed header and tab bar keep a lighter blur. */
  .news-box, .box-pill, .hn-card, footer .wrap { -webkit-backdrop-filter: none; backdrop-filter: none; }
  .nav, .tabbar { -webkit-backdrop-filter: blur(14px) saturate(1.2); backdrop-filter: blur(14px) saturate(1.2); }

  /* ── 3. Tab bar: same look as the header buttons on bigger screens ─────── */
  :scope .tabbar a { color: var(--ink-2); }
  :scope .tabbar a[aria-current="page"] { color:var(--ink); font-weight: 600; }
  :scope .tabbar a[aria-current="page"] svg { stroke: #ff4fa3; }
}

@media (max-width: 340px) {
  :scope .brand-x { font-size: 19px; padding: 3px 8px 3px 4px; }
  :scope .bx-badge { width: 30px; height: 30px; }
  :scope .bx-sub { display: none; }
}

/* ── One navigation for every screen ──────────────────────────────────────────────────────────
   The same icon-over-label buttons everywhere. Phones (820px and below) keep them in the bottom tab bar, which
   the theme already provides. Everything wider (tablets, laptops, Macs, TVs) puts them in the header after the
   logo. Labels show from 1420px, where there is room; narrower windows show icons only. The countdown and
   pre-order widget joins the header from 1420px (the home page's own script moves it); below that it stays
   over the hero. To switch this off, delete this block and the rail-home block in index.html. */
@media (min-width: 821px) {
  :scope .nav { -webkit-backdrop-filter: blur(16px) saturate(1.3); backdrop-filter: blur(16px) saturate(1.3); background: rgba(236,230,217,.94) !important; background-color: var(--ink) !important; justify-content: flex-start; gap: 0; padding-left: 20px; padding-right: 20px; border-bottom: 2px solid; border-image: linear-gradient(90deg,var(--coral-2),var(--line-2),#19e6d4) 1; }
  :scope .nav .brand-x { order: -1; margin: 0; flex: 0 0 auto; }
  :scope .nav .nav-links { position: static; width: auto; height: auto; max-width: none; margin: 0 0 0 14px; padding: 0; display: flex; flex-direction: row; align-items: center; gap: 2px; background: transparent; border: 0; border-radius: 0; box-shadow: none; overflow: visible; transform: none; flex: 0 1 auto; min-width: 0; }
  :scope .nav .nav-links .nl-glow { display: none; }
  :scope .nav .nav-links a { position: relative; flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; width: 46px; padding: 8px 0; margin: 0; border-radius: 12px; font-size: 10px; line-height: 1.1; color: var(--ink-2); text-align: center; white-space: normal; }
  :scope .nav .nav-links a svg { width: 22px; height: 22px; }
  :scope .nav .nav-links a .nl-t { display: none; }
  :scope .nav .nav-links a:hover { color:var(--ink); background: rgba(236,230,217,.06); }
  :scope .nav .nav-links a:focus-visible { outline: 2px solid #ff4fa3; outline-offset: -2px; }
  :scope .nav .nav-links a[aria-current="page"] { color:var(--ink); background: rgba(236,230,217,.09); font-weight: 600; }
  :scope .nav .nav-links a[aria-current="page"] svg { stroke: #ff4fa3; }
  :scope .nav .nav-links .soon { position: absolute; top: 0; right: -2px; font-size: 8px; padding: 1px 4px; }
}
@media (min-width: 1420px) {
  :scope:scope, :scope { --nav-h: 72px; }
  :scope .nav { height: 72px; padding-left: 24px; padding-right: 24px; }
  :scope { padding-top: 72px; }
  :scope .nav .nav-links { margin-left: 18px; }
  :scope .nav .nav-links a { width: 66px; padding: 6px 0; }
  :scope .nav .nav-links a .nl-t { display: block; }
  :scope .nav .nav-links .soon { right: 2px; }
}

/* ── Flat footer (every screen) ───────────────────────────────────────────────────────────────
   Kept to what matters: the logo line, the share buttons, and the copyright line with Contact, RSS and the
   legal/privacy notice. The link columns duplicated the navigation, so they are hidden. Wraps on phones. */
:scope .ft3 { padding: 20px 0 max(16px, env(safe-area-inset-bottom)); }
:scope .ft3 .wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; }
:scope .ft3-brand { flex: 0 1 auto; flex-direction: row; align-items: center; flex-wrap: wrap; gap: 6px 14px; }
:scope .ft3-blurb, :scope .ft3-tag { display: none; }
:scope .ft3-col { display: none; }
:scope .ssw-share { flex: 0 1 auto; margin: 0; }
:scope .ssw-share .ssw-share-bar { margin: 0; }
:scope .ft3-bar { flex: 1 1 100%; margin-top: 2px; padding-top: 10px; gap: 6px 16px; }
:scope .ft3-bar .ft3-mini a:nth-child(3) { display: none; }
@media (max-width: 700px) {
  :scope .ft3 .wrap { justify-content: flex-start; }
  :scope .ssw-share { flex: 1 1 100%; }
  :scope .ft3-bar { flex-direction: column; align-items: flex-start; }
}

/* staff names: anyone in news/authors.txt (bylines, Six Talk box, author box) shows in amber, not link-teal */
:scope .by-mail,:scope a.by-mail,:scope span.by-mail{color:var(--orange,var(--coral-2))!important;font-weight:700;text-decoration-color:rgba(198,51,31,.45)}
:scope .by-mail:hover,:scope .by-mail:focus-visible,:scope a.by-mail:hover{color:var(--pink,var(--coral))!important}

/* short page banners (news, launch, map, media, classics, legal...): keep the living sun on the horizon
   under the text instead of behind it. The homepage hero is untouched. v11, 21 Oct 2026 */
:scope .hero.short{padding:64px 22px 124px;min-height:auto}
:scope .hero.short .hero-sun{top:auto!important;bottom:calc(118px - min(960px,150vw))!important;width:min(960px,150vw);opacity:1!important;transition:none;animation:none;
  background:linear-gradient(180deg,var(--coral-2) 0,var(--coral) 6.5%,var(--blue) 11%,var(--teal) 13%)!important;
  filter:saturate(1.2) blur(.4px) drop-shadow(0 0 46px rgba(255,90,69,.4))}
:scope .hero.short .hero-horizon{height:140px;background:linear-gradient(180deg,transparent 0%,rgba(236,230,217,.2) 45%,rgba(236,230,217,.9) 88%,var(--bg) 100%)}
:scope .hero.short .hero-title,:scope .hero.short .hero-tagline,:scope .hero.short .hero-eyebrow{position:relative;z-index:1;text-shadow:0 2px 14px rgba(236,230,217,.9)}
@media(prefers-reduced-motion:no-preference){:scope .hero.short .hero-sun{animation:none}}

/* Footer: centred, symmetrical layout (Oct 23) */
:scope .ft3 .wrap { flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 14px; }
:scope .ft3-brand { justify-content: center; }
:scope .ssw-share { flex: 0 1 auto; width: 100%; justify-content: center; }
:scope .ft3-bar { flex: 0 1 auto; width: 100%; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 8px; }
:scope .ft3-bar p { flex: 0 1 auto; max-width: 72ch; }
:scope .ft3-bar .ft3-mini { justify-content: center; flex-wrap: wrap; }
:scope .ft3-legal summary { margin: 0 auto; }
:scope .ft3-legal[open] { width: 100%; }
:scope .ft3-legal .ft-legal-grid { text-align: left; }

/* == assets/ssw-2026.css == */
/* SixStarsWanted layout update, Oct 24 2026. Same colours: every colour here is an existing theme token.
   1) text menu with a Network panel (PC)  2) tab bar + More sheet (phone)
   3) compact inner-page header instead of the sunset hero  4) tighter section spacing.
   Roll back: empty this file and assets/ssw-2026.js (menu markup still works without them). */

/* ── 1. PC menu: words instead of icons ─────────────────────────── */
@media (min-width:821px){
  :scope .nav .nav-links.ssw-nav{margin:0 0 0 16px;gap:0;flex-wrap:nowrap}
  :scope .nav .nav-links.ssw-nav a{
    width:auto;flex-direction:row;gap:4px;min-height:44px;padding:0 10px;border-radius:8px;
    font-size:13.5px;letter-spacing:.08em;white-space:nowrap}
  :scope .nav .nav-links.ssw-nav a .nl-t{display:inline!important}
  :scope .nav .nav-links.ssw-nav a svg{display:none}
  :scope .nav .nav-links.ssw-nav .ssw-chev{display:inline-block;font-size:10px;transition:transform .2s}
  :scope .nav .nav-links.ssw-nav a[aria-expanded="true"]{color:var(--text);background:rgba(var(--text-rgb),.09)}
  :scope .nav .nav-links.ssw-nav a[aria-expanded="true"] .ssw-chev{transform:rotate(180deg)}
}
@media (min-width:821px) and (max-width:1180px){
  :scope .nav .nav-links.ssw-nav{margin-left:8px}
  :scope .nav .nav-links.ssw-nav a{padding:0 7px;font-size:12.5px;letter-spacing:.05em}
  :scope .nav .brand-x .bx-sub{display:none}
}
@media (min-width:821px) and (max-width:960px){
  :scope .nav .nav-links.ssw-nav a{padding:0 5px;font-size:11.5px;letter-spacing:.03em}
  :scope .nav .brand-x{font-size:20px}
}

/* Network panel (PC) */
.ssw-net{position:fixed;left:0;right:0;top:var(--nav-h,64px);z-index:190;display:none;padding:0 20px}
.ssw-net.open{display:block}
.ssw-net-in{max-width:1140px;margin:8px auto 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;
  padding:18px;border:1px solid var(--line-strong);border-radius:var(--radius,8px);
  background:rgba(var(--dusk2-rgb),.97);box-shadow:0 24px 60px rgba(236,230,217,.55)}
.ssw-col{display:flex;flex-direction:column;gap:6px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--radius-sm,6px);background:rgba(var(--card-rgb),.6)}
.ssw-lbl{font-family:var(--font-mono,monospace);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.ssw-lbl.alt{color:var(--pink)}
.ssw-pick{display:grid;grid-template-columns:48px minmax(0,1fr);gap:10px;align-items:center;min-height:48px;color:var(--text);text-decoration:none;border-radius:6px}
.ssw-pick:hover b{color:var(--teal)}
.ssw-pick .who{font-family:var(--font-mono,monospace);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--orange)}
.ssw-pick span{font-size:13.5px;line-height:1.35}
.ssw-pick b{font-weight:600;display:block}
.ssw-pick em{font-style:normal;color:var(--muted)}
.ssw-col h3{margin:0;font-family:var(--font-display);font-weight:800;font-size:24px;letter-spacing:.02em;color:var(--text)}
.ssw-col p{margin:0;font-size:13.5px;line-height:1.5;color:var(--muted)}
.ssw-go{display:inline-flex;align-items:center;min-height:44px;font-size:13.5px;font-weight:600;color:var(--teal);text-decoration:none}
.ssw-go:hover{color:var(--text)}
@media (max-width:820px){.ssw-net{display:none!important}}

/* ── 2. Phone: tab bar More button + More sheet ─────────────────── */
:scope .tabbar .ssw-more-btn{cursor:pointer}
.ssw-sheet{position:fixed;inset:0;z-index:190;display:none}
.ssw-sheet.open{display:block}
.ssw-scrim{position:absolute;inset:0;border:0;padding:0;background:rgba(236,230,217,.6);cursor:pointer}
.ssw-panel{position:absolute;left:0;right:0;bottom:0;max-height:82vh;overflow-y:auto;overscroll-behavior:contain;
  padding:8px 16px calc(var(--tab-h,60px) + env(safe-area-inset-bottom,0px) + 10px);
  background:rgba(var(--dusk2-rgb),.99);border-top:1px solid var(--line-strong);border-radius:16px 16px 0 0;box-sizing:border-box}
.ssw-grip{display:block;width:36px;height:4px;border-radius:2px;background:var(--faint);margin:4px auto 10px}
.ssw-row{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:48px;font-size:15px;color:var(--text);
  text-decoration:none;border-bottom:1px solid var(--line)}
.ssw-row:last-child{border-bottom:0}
.ssw-row i{font-style:normal;color:var(--muted)}
.ssw-acc{appearance:none;width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;min-height:56px;
  padding:6px 0;margin:0;border:0;border-bottom:1px solid var(--line);background:none;color:var(--text);font:inherit;text-align:left;cursor:pointer}
.ssw-acc b{display:block;font-size:15px;font-weight:600}
.ssw-acc small{display:block;font-size:12.5px;color:var(--muted)}
.ssw-acc .ssw-chev{color:var(--teal);font-size:14px;transition:transform .2s}
.ssw-acc[aria-expanded="true"] .ssw-chev{transform:rotate(180deg)}
.ssw-acc-body{display:none;flex-direction:column;gap:2px;padding:8px 0 10px;border-bottom:1px solid var(--line)}
.ssw-acc-body.open{display:flex}

/* ── 3. Compact inner-page header (replaces the sunset hero) ────── */
:scope .hero.short{
  min-height:0!important;display:block;text-align:left;overflow:visible;isolation:auto;
  padding:30px max(20px,calc((100% - 1140px)/2 + 22px)) 26px!important;
  background:rgba(var(--dusk2-rgb),.85);border-bottom:1px solid var(--line)}
:scope .hero.short .hero-sky,:scope .hero.short .hero-sun,
:scope .hero.short .hero-horizon,:scope .hero.short .hero-palms{display:none!important}
:scope .hero.short .hero-eyebrow,:scope .hero.short .eyebrow-script{
  display:block;margin:0 0 10px;font-family:var(--font-mono,monospace)!important;font-size:12px!important;line-height:1.3;
  letter-spacing:.14em;text-transform:uppercase;transform:none!important;animation:none!important}
:scope .hero.short .hero-title{
  margin:0;max-width:30ch;font-size:clamp(32px,4.2vw,48px)!important;line-height:1.02;
  text-shadow:none!important;animation:none!important;text-wrap:balance}
:scope .hero.short .hero-tagline{
  margin:10px 0 0;max-width:64ch;font-size:15.5px;line-height:1.5;letter-spacing:0;text-transform:none;
  text-shadow:none!important;animation:none!important}
@media (max-width:700px){
  :scope .hero.short{padding:22px 16px 20px!important}
  :scope .hero.short .hero-title{font-size:30px!important}
  :scope .hero.short .hero-tagline{font-size:14.5px}
}

/* ── 4. Tighter rhythm for a news site ──────────────────────────── */
:scope .section{padding-top:64px;padding-bottom:64px}
:scope .hero.short + .section{padding-top:32px}
@media (max-width:700px){
  :scope .section{padding-top:40px;padding-bottom:40px}
  :scope .hero.short + .section{padding-top:22px}
}
/* stats blocks that sit inside a page header (map.html) line up with the title */
:scope .hero.short > .wrap{max-width:none;margin:18px 0 0;padding-left:0;padding-right:0}
/* ── 5. Header links in the news-site style (Oct 24): plain text, pink underline on the current section, Pre-order pill at right ── */
@media (min-width:821px){
  :scope .nav .nav-links.ssw-nav{background:none;box-shadow:none;padding:0;border:0;border-radius:0;gap:0;margin-left:22px}
  :scope .nav .nav-links.ssw-nav .nl-glow{display:none!important}
  :scope .nav .nav-links.ssw-nav a{position:relative;font-family:var(--font-body);font-weight:600;font-size:14px;text-transform:none;letter-spacing:0;color:var(--muted);background:none;border-radius:0;padding:0 2px;margin:0 10px}
  :scope .nav .nav-links.ssw-nav a::after{content:"";display:block;position:absolute;left:0;right:0;bottom:9px;height:2px;border-radius:2px;background:var(--pink);opacity:0;transition:opacity .15s}
  :scope .nav .nav-links.ssw-nav a:hover,:scope .nav .nav-links.ssw-nav a[aria-expanded="true"],:scope .nav .nav-links.ssw-nav a[aria-current="page"]{color:var(--text);background:none;box-shadow:none;text-shadow:none;transform:none}
  :scope .nav .nav-links.ssw-nav a[aria-current="page"]::after{opacity:1}
  :scope .nav .nav-links.ssw-nav .ssw-chev{font-size:9px;margin-left:3px}
  :scope .nav .ssw-pre{margin-left:auto;display:inline-flex;align-items:center;min-height:38px;padding:0 16px;border-radius:999px;background:var(--grad);color:var(--ink);font-weight:700;font-size:13.5px;text-decoration:none;white-space:nowrap;flex-shrink:0}
  :scope .nav .ssw-pre:hover{filter:brightness(1.08);color:var(--ink)}
}
@media (min-width:821px) and (max-width:1180px){:scope .nav .nav-links.ssw-nav a{font-size:13px;margin:0 7px}:scope .nav .nav-links.ssw-nav{margin-left:12px}}
@media (min-width:821px) and (max-width:960px){:scope .nav .nav-links.ssw-nav a{font-size:12.5px;margin:0 5px}:scope .nav .ssw-pre{padding:0 12px;font-size:12.5px}}
@media (max-width:820px){:scope .nav .ssw-pre{display:none}}
/* ── 6. RDR2 link in its own colours (Oct 24): red gradient, dark ink, as the old RDR2 pill ── */
.ssw-pick.rdr{padding:8px 10px;margin:2px -4px;border-radius:8px;background:linear-gradient(100deg,#FF5A5A,#F01440 55%,var(--surface));color:var(--ink);box-shadow:0 4px 18px rgba(240,20,64,.28)}
.ssw-pick.rdr .who{color:var(--ink);opacity:.85}
.ssw-pick.rdr em{color:var(--ink)}
.ssw-pick.rdr:hover{background:linear-gradient(100deg,#FF6E6E,#FF1E50 55%,var(--surface))}
.ssw-pick.rdr:hover b{color:var(--ink)}
/* SSW (Oct 26 2026): rounded corners on every screenshot - home pills/cards/rows, article hero and story cards, wiki/db images */
.hf-img,.hf-img img,.hf-pill .hf-img,.hf-feat .hf-img,.hf-card .hf-img,.hf-row .hf-img,.hf-gcard .hf-img{border-radius:14px!important;overflow:hidden}
.hf-row .hf-img,.hf-row .hf-img img{border-radius:10px!important}
.nw-hero,.nw-hero img,.nw-card img,.nw-cards .nw-card>img,figure img,.story img,.nw-body img,article img,.wrap img.ss,.wrap figure img{border-radius:14px!important}
.nw-card{overflow:hidden}
nav.nav img,.brand img,.hf-av,.hf-av img,.av img,.ssw-acct img,footer img,.tabbar img,.nw-by img{border-radius:inherit!important}
/* SSW (Oct 26 2026): wide search bar under the menu and the T-minus ticker removed (search stays in the top bar) */
.sss-bar,.hf-ticker{display:none!important}
/* == assets/logo-a.css == */
/* SixStarsWanted header logo: "Newsroom" (Oct 24, 2026). Markup: .bx-text.lg-a inside a.brand-x */
.brand-x .bx-text.lg-a{display:flex;flex-direction:column;gap:5px;min-width:0}
.lg-a .lg-wm{display:flex;align-items:center;gap:7px;font-family:var(--font-display,"Big Shoulders Display",Impact,sans-serif);font-weight:900;font-size:27px;line-height:.9;letter-spacing:.03em;text-transform:uppercase;color:var(--ink);text-shadow:0 2px 0 rgba(236,230,217,.7);white-space:nowrap}
.lg-a .lg-wm i{font-style:normal;color:var(--pink,var(--coral))}
.lg-a .lg-tab{font-family:var(--font-display,"Big Shoulders Display",Impact,sans-serif);font-weight:800;font-size:12px;line-height:1;letter-spacing:.2em;background:var(--pink,var(--coral));color:var(--ink);padding:4px 6px 3px 8px;border-radius:3px;text-shadow:none;transform:translateY(1px)}
.lg-a .lg-sub{font:9px/1 var(--font-mono,"Share Tech Mono",ui-monospace,monospace);letter-spacing:.2em;color:var(--faint,#8d8da8);text-transform:uppercase;white-space:nowrap}
.lg-a .lg-sub b{color:var(--hx-cyan,var(--teal));font-weight:400}
:scope .brand-x{gap:10px}
@media(max-width:1100px){:scope .nav .brand-x .lg-sub{display:none}}
@media(max-width:820px){.lg-a .lg-wm{font-size:22px;gap:6px}.lg-a .lg-tab{font-size:10px;padding:3px 5px 2px 7px}}
@media(max-width:400px){.lg-a .lg-wm{font-size:19px}.lg-a .lg-tab{font-size:9px}}
/* star points down (Oct 24, 2026); the independent rotate property composes with the beat animation */
.brand-x .bx-star{rotate:180deg;transform-origin:20px 20px}

/* == assets/ssw-portal.css == */
 /* v3 theme (Oct 31, 2026). Delete this line to roll back the look. */
/* SixStarsWanted portal layout + "Vice Night" theme (Oct 28, 2026). Shared by every page. Classic pages (GTA V, RDR) get :scope.pz-classic and keep their own colours. */

:scope:not(.pz-classic){--night:var(--bg);--dusk:var(--bg);--card:var(--surface);--card-2:var(--bg-2);--teal:var(--teal);--pink:var(--coral);--orange:var(--coral-2);--violet:var(--blue);--text:var(--ink);--hx-cyan:var(--teal);
--bg:var(--night);--surface:var(--card);--bar:var(--dusk);--field:var(--card-2);--fg:var(--text);--fg2:var(--ink);--muted:var(--mute);--faint:var(--mute);--line:rgba(235,240,247,.08);--line2:rgba(235,240,247,.15);
--accent:var(--teal);--ember:var(--orange);--rust:var(--violet);--red:var(--pink);--warn:var(--coral-2);--ok:#029728;--accent-soft:#148385;
--display:'Big Shoulders Display',Impact,sans-serif;--body:'Space Grotesk',system-ui,sans-serif;--mono:'Share Tech Mono',ui-monospace,monospace;--font-display:var(--display);--font-mono:var(--mono);color-scheme:dark}:scope:not(.pz-classic){background:radial-gradient(1100px 560px at 90% -8%,rgba(255,90,69,.14),transparent 62%) no-repeat,radial-gradient(900px 520px at -6% 6%,rgba(47,181,184,.10),transparent 60%) no-repeat,var(--night);color:var(--fg);font-family:var(--body)}
.mast a,.tabs a,.side a,.foot2 a,.pz-main a{color:inherit}*{box-sizing:border-box}
/* PORTAL PREVIEW: classic three-column layout in the DayZ2 palette */
:scope{margin:0;font-family:var(--body);color:var(--fg)}
.pv-bar{background:var(--red);color:var(--ink);text-align:center;font:700 12.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;padding:9px 12px}
.wrap{max-width:1320px;margin:0 auto;padding:0 16px}
.mast{margin-top:18px;border:1px solid var(--line2);border-bottom:0;border-radius:10px 10px 0 0;position:relative;overflow:hidden;isolation:isolate;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:clamp(18px,3vw,34px);min-height:170px}
.mast::before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,var(--surface) 0%,var(--surface) 50%,var(--surface) 100%)}
.mast::after{content:"";position:absolute;inset:0!important;width:auto;height:auto;z-index:-1;background:url(/screens/gta6/VINTAGE_VICE_CITY_PACK_EXCLUSIVE_LOOKS_02.jpg) center 32%/cover no-repeat!important;-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(236,230,217,.55) 10%,var(--surface) 26%,var(--surface) 74%,rgba(236,230,217,.55) 90%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,rgba(236,230,217,.55) 10%,var(--surface) 26%,var(--surface) 74%,rgba(236,230,217,.55) 90%,transparent 100%)}
.mast .brand{display:flex;align-items:center;gap:18px;text-decoration:none;color:var(--fg)}
.mast .brand svg{width:78px;height:78px;flex:none;filter:drop-shadow(0 6px 18px rgba(236,230,217,.6))}
.mast .brand b{display:block;font:800 clamp(40px,6vw,68px)/.9 var(--display);letter-spacing:.02em;text-transform:uppercase}
.mast .brand b em{font-style:normal;color:var(--red)}
.mast .brand small{display:block;margin-top:8px;font:500 12px var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--accent)}
.bcast{border:1px solid var(--line2);background:rgba(236,230,217,.85);border-radius:8px;padding:12px 16px;max-width:300px}
.bcast p{margin:0 0 4px;font:600 10.5px var(--mono);letter-spacing:.18em;color:var(--muted);text-transform:uppercase}
.bcast strong{display:block;font:500 17px/1.25 var(--mono);color:var(--accent);text-transform:uppercase}
.tabs{border-radius:0 0 10px 10px;overflow:visible;display:flex;flex-wrap:wrap;align-items:stretch;border:1px solid var(--line2);background:linear-gradient(180deg,var(--surface),var(--surface));}
.tabs a{display:flex;align-items:center;padding:14px 18px;font:700 15px var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--fg2);text-decoration:none;border-right:1px solid var(--line2)}
.tabs a:hover{color:var(--accent);background:rgba(242,174,85,.06)}
.tabs a[aria-current]{color:var(--fg);background:rgba(242,174,85,.10);box-shadow:inset 0 -3px 0 var(--accent)}
.tabs .srch{margin-left:auto;display:flex;align-items:center;padding:8px 10px;position:relative}
.tabs input{width:230px;background:var(--field);border:1px solid var(--line2);border-radius:6px;color:var(--fg);padding:9px 11px;font:inherit;font-size:14px}
.sres{position:absolute;right:10px;top:100%;width:320px;z-index:50;background:var(--surface);border:1px solid var(--line2);border-radius:8px;box-shadow:0 18px 40px rgba(236,230,217,.6);display:none;max-height:380px;overflow:auto}
.sres a{display:block;padding:9px 12px;border-bottom:1px solid var(--line);color:var(--fg2);text-decoration:none;font-size:14px}
.sres a:hover{background:rgba(242,174,85,.08);color:var(--accent)}.sres small{color:var(--faint);margin-left:6px;font-family:var(--mono);font-size:11px}
.tick{display:flex;border:1px solid var(--line2);border-top:0;background:var(--bar);overflow:hidden;border-radius:0 0 10px 10px}
.tick b{flex:none;background:var(--red);color:var(--ink);font:700 12px var(--mono);letter-spacing:.14em;padding:11px 16px;text-transform:uppercase}
.tick div{flex:1;overflow:hidden;white-space:nowrap;position:relative}
.tick span{display:inline-block;padding:10px 0;font:500 15px var(--mono);color:var(--accent);animation:tk 60s linear infinite;padding-left:100%}
.tick a{color:var(--accent);text-decoration:none;margin-right:48px}.tick a:hover{text-decoration:underline}
@keyframes tk{to{transform:translateX(-100%)}}
@media (prefers-reduced-motion:reduce){.tick span{animation:none;padding-left:16px}}
.cols{display:grid;grid-template-columns:250px minmax(0,1fr) 290px;gap:18px;margin:18px auto 26px;align-items:start}
.side{display:grid;gap:16px}
.box{border:1px solid var(--line2);border-radius:8px;background:var(--surface);overflow:hidden}
.box-h{display:flex;align-items:center;gap:10px;margin:0;padding:11px 14px;background:linear-gradient(180deg,var(--surface),var(--surface));border-bottom:1px solid var(--line2);font:700 15px var(--display);letter-spacing:.16em;text-transform:uppercase;color:var(--fg)}
.box-h::before{content:"";width:9px;height:9px;background:var(--accent);box-shadow:0 0 8px rgba(242,174,85,.6);flex:none}
.box ul{list-style:none;margin:0;padding:4px 0}
.box li a{display:flex;justify-content:space-between;gap:8px;padding:8px 14px 8px 28px;position:relative;color:var(--fg2);text-decoration:none;font-size:14.5px;border-bottom:1px solid var(--line)}
.box li:last-child a{border-bottom:0}
.box li a::before{content:"›";position:absolute;left:13px;color:var(--accent)}
.box li a:hover{color:var(--accent);background:rgba(242,174,85,.05)}
.box li a small{font:500 11px var(--mono);color:var(--faint)}
.box li a[aria-current]{color:var(--accent)}
.box-b{padding:12px 14px;display:grid;gap:10px;font-size:14.5px;color:var(--muted)}
.kv{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:6px 0}.kv:last-child{border-bottom:0}
.kv b{color:var(--fg)}
.big{font:500 26px var(--mono);color:var(--accent);line-height:1.1}
.box select,.box input[type=number]{background:var(--field);border:1px solid var(--line2);border-radius:6px;color:var(--fg);padding:7px 9px;font:inherit;font-size:14px}
.res{font:600 14px var(--mono)}.res.ok{color:var(--ok)}.res.bad{color:var(--ink)}
.chk label{display:flex;gap:9px;align-items:flex-start;padding:5px 0;color:var(--fg2);cursor:pointer}
.chk input{margin-top:3px;accent-color:var(--accent)}
.pz-shell .bar{height:10px;border-radius:5px;background:var(--field);overflow:hidden}.pz-shell .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--rust),var(--accent))}
.content{display:grid;gap:18px;min-width:0}
.head-panel{border:1px solid var(--line2);border-radius:8px;background:var(--surface);overflow:hidden}
.head-panel .hp-img{height:180px;background:url(/news/images/fan-vault-is-back.jpg) center 45%/cover;border-bottom:1px solid var(--line2)}
.head-panel .hp-txt{padding:18px 20px;display:grid;gap:8px}
.crumbs{font:500 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--accent)}
.head-panel h1{margin:0;font:800 clamp(34px,4vw,50px)/1 var(--display);text-transform:uppercase}
.head-panel .lede{margin:0;color:var(--fg2);max-width:75ch}
.head-panel .checked{margin:0;font:500 12px var(--mono);color:var(--faint)}
.index{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.index .box ul{padding:2px 0}.index .box li a{padding:6px 12px 6px 26px;font-size:14px}
.chapter{border:1px solid var(--line2);border-radius:8px;background:var(--bg);overflow:hidden}
.ch-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:14px 18px;background:linear-gradient(180deg,var(--surface),var(--surface));border-bottom:2px solid var(--accent)}
.ch-h h2{margin:0;font:800 26px var(--display);letter-spacing:.06em;text-transform:uppercase}
.ch-h h2 span{color:var(--accent);margin-right:10px;font-family:var(--mono);font-size:16px}
.ch-h a{font:500 12px var(--mono);color:var(--muted);text-decoration:none;letter-spacing:.08em;text-transform:uppercase}.ch-h a:hover{color:var(--accent)}
.ch-nav{display:flex;flex-wrap:wrap;gap:6px;padding:10px 18px;border-bottom:1px solid var(--line);background:var(--bar)}
.ch-nav a{font:500 12px var(--mono);letter-spacing:.06em;color:var(--fg2);text-decoration:none;border:1px solid var(--line2);border-radius:5px;padding:5px 9px}.ch-nav a:hover{border-color:var(--accent);color:var(--accent)}
.chapter>.sec{margin:0;padding:20px 20px 22px;border-bottom:1px solid var(--line2);background:var(--surface);scroll-margin-top:12px}
.chapter>.sec:last-child{border-bottom:0}
.chapter>.sec h2{font-size:clamp(24px,2.6vw,32px)}
.chapter>.sec p,.chapter>.sec ul{max-width:none}
.foot2{border-top:1px solid var(--line2);background:var(--bar);margin-top:10px}
.foot2 .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:20px;padding:26px 16px}
.foot2 h3{margin:0 0 8px;font:700 14px var(--display);letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.foot2 a{display:block;color:var(--muted);text-decoration:none;font-size:14px;padding:3px 0}.foot2 a:hover{color:var(--accent)}
.foot{text-align:center;padding:16px;color:var(--faint);font-size:12.5px}
details.mside,details.mside[open]{border:0;background:none;padding:0;margin:0;border-radius:0;box-shadow:none}
.box-h,.box p,.head-panel p{max-width:none}
.box-b.chk{display:grid;gap:2px}
.content .chapter{padding:0;margin:0}
.content>.chapter>.sec{padding:20px 20px 22px}
.head-panel .lede{max-width:75ch}
.box li.sub{padding:9px 14px 4px;font:700 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);border-top:1px solid var(--line2);list-style:none}
.box li.sub:first-child{border-top:0}
details.mside>summary{display:none}
@media (max-width:760px){.cols{grid-template-columns:200px minmax(0,1fr)}.side.right{grid-column:1/-1;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}}
@media (max-width:1150px) and (min-width:761px){.cols{grid-template-columns:190px minmax(0,1fr) 210px;gap:12px}.wrap{padding:0 10px}.box-h{font-size:13px;letter-spacing:.12em;padding:9px 10px}.box-b{padding:10px}.big{font-size:20px!important}.tabs a{padding:12px 11px;font-size:13.5px;letter-spacing:.1em}.tabs input{width:170px}.feature{grid-template-columns:1fr}.ch-h h2{font-size:22px}}
@media (max-width:1150px) and (min-width:641px){.box li a{font-size:13.5px;padding:7px 10px 7px 24px}.box li a::before{left:10px}}
@media (max-width:760px) and (min-width:641px){.cols{grid-template-columns:200px minmax(0,1fr)}.box li a{font-size:13.5px;padding:7px 10px 7px 24px}.box li a::before{left:10px}}
@media (max-width:640px){.cols{grid-template-columns:1fr}.side.left{order:-1}.mast{flex-direction:column;align-items:flex-start}.bcast{max-width:none}.tabs a{padding:11px 12px;font-size:13.5px}.tabs .srch{margin-left:0;width:100%}.tabs input{width:100%}.sres{left:10px;right:10px;width:auto}
details.mside>summary{display:block;cursor:pointer;padding:12px 14px;border:1px solid var(--line2);border-radius:8px;background:var(--surface);font:700 15px var(--display);letter-spacing:.14em;text-transform:uppercase}
details.mside:not([open])>.side{display:none}details.mside[open]>.side{margin-top:12px}}

/* generic pages inside the portal */
.cols .content section,.cols .content .sec{padding-block:0}
.pz-main{display:grid;gap:18px;min-width:0;align-content:start;grid-template-columns:minmax(0,1fr)!important;max-width:100%!important;width:auto!important;margin:0!important;padding:0!important}
.pz-main>*{min-width:0;max-width:100%}
.pz-main>.band{border-radius:8px;min-height:230px;margin:0}
.pz-main>section.sec,.pz-main>.sec{background:var(--surface);border:1px solid var(--line2);border-radius:8px;padding:20px 20px 22px!important;margin:0}
.pz-main>.toc.arch-nav{background:var(--surface);border:1px solid var(--line2);border-radius:8px;padding:12px;margin:0}
.pz-main>.crumbs{margin:0}
.pz-main .sec p,.pz-main .sec ul{max-width:none}
.pz-main img{max-width:100%}
.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;z-index:99;background:var(--accent);color:var(--ink);padding:8px 12px}
.pz-main .band{min-width:0;max-width:100%}
.pz-main .band-copy{min-width:0!important;max-width:100%!important;box-sizing:border-box;flex:1 1 auto}
.pz-main .toc{grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px}
.pz-main .toc a{min-height:32px;padding:5px 8px;font-size:11px}
.pz-main .ihead{grid-template-columns:minmax(0,1fr) 240px}
@media (max-width:1150px){.pz-main .ihead{grid-template-columns:1fr}}
.pz-main table{max-width:100%}
.pz-main .tbl-wrap,.pz-main .tw{max-width:100%;overflow-x:auto}
.pz-main>.ihead{background:var(--surface);border:1px solid var(--line2);border-radius:8px;padding:20px}
.pz-main>.crumbs{padding:2px 2px 0}
.pz-main .band::after{background:linear-gradient(180deg,rgba(236,230,217,.62),rgba(236,230,217,.94))!important}
.pz-main .band h1,.pz-main .band .lede{text-shadow:0 2px 10px rgba(236,230,217,.8)}

/* SixStarsWanted portal accents */
.box-h::before{background:linear-gradient(135deg,var(--pink),var(--teal))!important;box-shadow:0 0 8px rgba(255,90,69,.6)!important}
.tabs a[aria-current]{box-shadow:inset 0 -3px 0 var(--pink)!important;background:rgba(255,90,69,.10)!important}
.tabs{background:linear-gradient(180deg,var(--surface),var(--bg))!important}
.box-h{background:linear-gradient(180deg,var(--surface),var(--surface))!important}
.mast::after{content:"";position:absolute;inset:0!important;width:auto;height:auto;z-index:-1;background:url(/screens/gta6/VINTAGE_VICE_CITY_PACK_EXCLUSIVE_LOOKS_02.jpg) center 32%/cover no-repeat!important;-webkit-mask-image:linear-gradient(90deg,rgba(236,230,217,.22) 0%,rgba(236,230,217,.45) 30%,var(--surface) 58%);mask-image:linear-gradient(90deg,rgba(236,230,217,.22) 0%,rgba(236,230,217,.45) 30%,var(--surface) 58%)}
.mast{min-height:clamp(220px,24vw,320px)!important;align-items:flex-end!important}
.brand-x{display:flex;align-items:center;gap:16px;text-decoration:none}
.brand-x .bx-badge svg{width:70px;height:70px;display:block;filter:drop-shadow(0 6px 18px rgba(236,230,217,.6))}
.bx-hex{fill:var(--surface);stroke:var(--pink);stroke-width:2.4}.bx-star{fill:var(--teal);rotate:180deg;transform-origin:20px 20px}
.brand-x .lg-a .lg-wm{font-size:clamp(34px,5vw,56px)!important}.brand-x .lg-a .lg-tab{font-size:16px!important}.brand-x .lg-a .lg-sub{font-size:12px!important;display:block!important}
.bx-sheen{display:none}
.brand-x .lg-a .lg-wm i{color:var(--ink)!important;text-shadow:0 2px 0 rgba(236,230,217,.7)}
.brand-x .lg-a .lg-tab{background:#DC143C!important;color:var(--ink)!important}
.brand-x .bx-hex{stroke:#DC143C!important}
.brand-x .bx-star{fill:#DC143C!important;filter:drop-shadow(0 0 6px rgba(220,20,60,.5))}
.brand-x .lg-sub b{display:inline!important;font:inherit!important;color:var(--teal)!important;text-transform:none}
.brand-x .lg-wm{display:flex!important;font-family:var(--display)!important;line-height:.9!important}
.brand-x .lg-sub{margin-top:10px!important;letter-spacing:.22em!important;color:var(--muted)!important}
.hero-img{border:1px solid var(--line2);border-radius:8px;overflow:hidden;background:var(--surface);margin:0}
.hero-img img{display:block;width:100%;height:auto}
.cd{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center}
.cd div{background:var(--bar);border:1px solid var(--line2);border-radius:6px;padding:8px 0}
.cd b{display:block;font:800 26px/1 var(--display);color:var(--fg)}.cd small{font:500 10px var(--mono);letter-spacing:.12em;color:var(--muted);text-transform:uppercase}
.pz-shell .tag{display:inline-block;font:700 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;padding:3px 7px;border-radius:4px;background:var(--pink);color:var(--ink);margin-right:8px}
.panel{border:1px solid var(--line2);border-radius:8px;background:var(--surface);overflow:hidden}
.panel-b{padding:14px 16px}
.newsl a{display:grid;grid-template-columns:88px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--fg)}
.newsl a:last-child{border-bottom:0}
.newsl img{width:88px;height:58px;object-fit:cover;border-radius:5px;border:1px solid var(--line2)}
.newsl b{display:block;font:700 18px/1.15 var(--display);letter-spacing:.02em}.newsl a:hover b{color:var(--teal)}
.newsl p{margin:3px 0 0;color:var(--muted);font-size:13.5px}
.newsl .by{font:500 11px var(--mono);color:var(--pink);letter-spacing:.06em;text-transform:uppercase}
.start{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.start a{display:grid;gap:4px;border:1px solid var(--line2);border-radius:8px;background:var(--bar);padding:12px;text-decoration:none;color:var(--fg)}
.start a:hover{border-color:var(--teal)}
.start i{font-style:normal;font:500 10.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--pink)}
.start b{font:800 19px/1.05 var(--display);text-transform:uppercase;letter-spacing:.03em}
.start small{color:var(--muted);font-size:12.5px}
.catgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.box-h .cnt{margin-left:auto;font:500 11px var(--mono);color:var(--faint);letter-spacing:0}
.slist a{display:block;padding:7px 0;border-bottom:1px solid var(--line);color:var(--fg2);text-decoration:none;font-size:14px;line-height:1.35}
.slist a:last-child{border-bottom:0}.slist a:hover{color:var(--teal)}
.slist a small{display:block;font:500 11px var(--mono);color:var(--faint);margin-top:2px}
.ilinks{display:flex;flex-wrap:wrap;gap:6px}
.ilinks a{font-size:13px;color:var(--fg2);text-decoration:none;border:1px solid var(--line2);border-radius:5px;padding:4px 8px;background:var(--bar)}
.ilinks a:hover{border-color:var(--teal);color:var(--teal)}
.three{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.facts .kv b{color:var(--teal)}



/* bluer overall theme */
:scope:not(.pz-classic){--night:var(--surface);--dusk:var(--surface);--card:var(--surface);--card-2:var(--surface);--bg:var(--night);--surface:var(--card);--bar:var(--dusk);--field:var(--card-2);--line:#224077;--line2:#224077;--teal:#004599;--pink:var(--coral-2);--accent:#004599;--red:var(--coral-2);--muted:#284571;--fg2:var(--ink)}:scope:not(.pz-classic){background:radial-gradient(1100px 560px at 90% -8%,rgba(245,158,11,.20),transparent 62%) no-repeat,radial-gradient(900px 520px at -6% 6%,rgba(96,165,250,.12),transparent 60%) no-repeat,var(--night)!important}
.tabs{background:linear-gradient(180deg,var(--surface),var(--surface))!important}
.tabs a[aria-current]{box-shadow:inset 0 -3px 0 #60A5FA!important;background:rgba(96,165,250,.12)!important}
.box-h{background:linear-gradient(180deg,var(--surface),var(--surface))!important}
.box-h::before{background:linear-gradient(135deg,#F59E0B,#60A5FA)!important;box-shadow:0 0 8px rgba(96,165,250,.6)!important}
.mast::before{background:linear-gradient(90deg,var(--surface) 0%,var(--surface) 50%,var(--surface) 100%)!important}
.pz-shell .tag{background:var(--surface)!important;color:var(--ink)!important}
.newsl .by,.start i{color:var(--ink)!important}
.pv-bar{background:var(--surface)!important}
@media (min-width:641px){.tabs a.m-only{display:none!important}}

/* MOBILE (phones) */
@media (max-width:640px){
.wrap{padding:0 10px!important}
.mast{flex-direction:row!important;align-items:flex-end!important;min-height:200px!important;padding:14px!important;margin-top:10px!important}
.mast::after{background-position:center 30%!important;-webkit-mask-image:none!important;mask-image:none!important}
.mast::after{box-shadow:inset 0 -70px 60px -20px rgba(236,230,217,.85)}
.brand-x .lg-a .lg-wm{font-size:32px!important}
.tabs{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding:0}
.tabs .srch{grid-column:1/-1;order:-1;width:100%!important;margin:0!important;padding:10px!important;border-bottom:1px solid var(--line2)}
.tabs .srch input{width:100%!important}
.tabs a{order:0;justify-content:center;text-align:center;padding:12px 4px!important;font-size:13px!important;letter-spacing:.08em!important;border-right:1px solid var(--line2)!important;border-bottom:1px solid var(--line2)!important;min-width:0;white-space:nowrap}
.tabs a:nth-of-type(4n){border-right:0!important}
.tabs a:nth-last-of-type(-n+4){border-bottom:0!important}






.panel-b{padding:12px!important}
.newsl a{grid-template-columns:118px minmax(0,1fr)!important;gap:12px!important}.newsl p{display:none}.newsl b{font-size:16px!important}
.scards{grid-template-columns:1fr 1fr!important;gap:10px!important}
.scards b{font-size:15px!important}
.cd b{font-size:22px!important}
.box.pz-clip .pz-more{display:block}
}
.pz-more{display:none;width:100%;margin:0;padding:10px 14px;border:0;border-top:1px solid var(--line2);background:rgba(96,165,250,.08);color:var(--ink-2);font:700 13px var(--mono);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;text-align:left}
.pz-clip.pz-shut .pz-hide{display:none!important}


.scards{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.scards a{display:grid;gap:6px;align-content:start;text-decoration:none;color:var(--fg);border:1px solid var(--line2);border-radius:8px;background:var(--bar);padding:8px;transition:border-color .15s,transform .15s}
.scards a:hover{border-color:#004599;transform:translateY(-2px)}
.scards img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:5px;display:block}
.scards .by{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.scards b{font:700 17px/1.15 var(--display);letter-spacing:.02em;color:var(--ink)}.scards a:hover b{color:var(--ink-2)}

.newsl a{grid-template-columns:clamp(130px,26%,220px) minmax(0,1fr)!important;gap:16px!important;align-items:start}
.newsl img{width:100%!important;height:auto!important;aspect-ratio:16/10;object-fit:cover;border-radius:6px}


/* text and hover colours (blue theme) */
:scope:not(.pz-classic){--text:var(--ink);--fg:var(--ink);--fg2:var(--ink);--muted:#314568;--faint:#2f466a}
:scope{color:var(--fg)}
.box li a,.slist a,.flinks a{color:var(--fg2)!important;transition:color .15s,background .15s,padding-left .15s}
.box li a:hover,.slist a:hover{color:var(--ink)!important;background:rgba(96,165,250,.09)!important}
.box li a:hover::before{color:#004599!important}
.box li a[aria-current]{color:var(--ink-2)!important}
.slist a:hover small{color:var(--ink-2)!important}
.tabs a{color:var(--ink-2)!important;transition:color .15s,background .15s}
.tabs a:hover{color:var(--ink)!important;background:rgba(96,165,250,.10)!important}
.newsl b{color:var(--ink)!important;transition:color .15s}.newsl a:hover b{color:var(--ink-2)!important}
.newsl p{color:var(--muted)!important}
.start a,.ilinks a{transition:border-color .15s,transform .15s,color .15s}
.start a:hover{border-color:#004599!important;transform:translateY(-2px)}
.ilinks a:hover{border-color:#004599!important;color:var(--ink)!important;background:rgba(96,165,250,.10)!important}
.box-h a:hover{color:var(--ink-2)!important}
.facts .kv b,.big{color:var(--ink-2)!important}
.foot2 a:hover{color:var(--ink-2)!important}.foot2 h3{color:#004599!important}
.sres a:hover{background:rgba(96,165,250,.10)!important;color:var(--ink)!important}
a:focus-visible,input:focus-visible{outline:2px solid #60A5FA;outline-offset:2px}


.cd b,.facts .kv b{color:var(--ink)!important}.pz-shell .tag{color:var(--ink)!important}.pv-bar{color:var(--ink)!important}.box-h::before{background:linear-gradient(135deg,#F59E0B,#60A5FA)!important;box-shadow:0 0 8px rgba(245,158,11,.5)!important}
/* ── inner pages: the page's own <main id="main"> sits in .pz-center ── */
:scope.pz{padding-top:0!important}
.pz-center{min-width:0;display:grid;gap:18px;align-content:start}
.pz-center>main{min-width:0;margin:0;padding:0;border:1px solid var(--line2);border-radius:8px;overflow:hidden;background:var(--surface)}
.pz-center .wrap{max-width:none!important;padding-left:clamp(14px,2vw,22px)!important;padding-right:clamp(14px,2vw,22px)!important;margin:0!important;width:auto!important}
.pz-center .section{padding-top:clamp(18px,2.4vw,30px)!important;padding-bottom:clamp(18px,2.4vw,30px)!important}
.pz-center .hero{min-height:0}
.pz-center img,.pz-center video,.pz-center iframe{max-width:100%}
.pz-center table{max-width:100%}
.pz-shell .tag,.pz-shell .bar{}
/* classic pages keep their palette: the shell follows the page's own colours */
:scope.pz-classic{--bg:var(--night);--surface:var(--card);--bar:var(--dusk);--field:var(--card-2);--fg:var(--text);--fg2:var(--text);--faint:var(--muted);--line2:var(--line-strong,var(--line));--body:var(--font-body);--display:var(--font-display);--mono:var(--font-mono)}
:scope.pz-classic .tabs{background:var(--dusk)!important}
:scope.pz-classic .box-h{background:var(--card-2)!important}
:scope.pz-classic .mast::before{background:var(--night)!important}
:scope.pz-gtav{--accent:var(--ls-m,#5FB8E8);--teal:var(--ls-m,#5FB8E8)}
:scope.pz-gtav .box-h::before{background:linear-gradient(90deg,#5FB8E8,#9CCB58,#F0883C)!important;box-shadow:none!important}
:scope.pz-gtav .tabs a[aria-current]{box-shadow:inset 0 -3px 0 #F0883C!important;background:rgba(240,136,60,.10)!important}
:scope.pz-gtav .box li a:hover,:scope.pz-gtav .slist a:hover{background:rgba(95,184,232,.10)!important}
:scope.pz-rdr{--accent:#D11F26}
:scope.pz-rdr .box-h::before{background:#D11F26!important;box-shadow:0 0 8px rgba(209,31,38,.6)!important}
:scope.pz-rdr .tabs a[aria-current]{box-shadow:inset 0 -3px 0 #D11F26!important;background:rgba(209,31,38,.12)!important}
:scope.pz-rdr .box li a:hover,:scope.pz-rdr .slist a:hover{background:rgba(209,31,38,.10)!important}
:scope.pz-rdr .box li a::before{color:var(--ink)!important}
:scope.pz-classic .cd b,:scope.pz-classic .facts .kv b{color:var(--text)!important}

/* drop the old scanline overlay on Vice Night pages (classic pages keep theirs) */
:scope.pz:not(.pz-classic)::after{display:none!important}
/* New since your visit (Oct 29, 2026) */
.pz-since{margin:0 0 10px;padding:8px 12px;border:1px solid rgba(96,165,250,.35);border-left:3px solid #3B82F6;background:rgba(37,99,235,.12);border-radius:6px;font-size:13px;color:var(--text)}
.pz-since b{color:var(--ink-2)}.pz-since a{color:#004599;text-decoration:none}.pz-since a:hover{color:var(--ink-2);text-decoration:underline}
.pz-new{display:inline-block;font-style:normal;font-weight:800;font-size:9px;letter-spacing:.08em;line-height:1;padding:3px 5px;margin-right:6px;border-radius:3px;background:#2563EB;color:var(--ink);vertical-align:1px}
.box li a .pz-new{margin-right:5px}

/* footer bottom bar, centred on every width (Oct 30, 2026) */
:scope.pz .ft3-bar{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;width:100%;gap:10px!important;margin:0 auto}
:scope.pz .ft3-bar p{margin:0 auto!important;max-width:72ch;text-align:center}
:scope.pz .ft3-bar .ft3-mini{display:flex!important;flex-wrap:wrap;justify-content:center!important;align-items:center;gap:6px 18px!important;margin:0 auto}
:scope.pz .ft3-bar .ft3-mini a{margin:0!important}
:scope.pz .ft3-legal{width:100%;text-align:center!important}
:scope.pz .ft3-legal summary{display:list-item;width:max-content;max-width:100%;margin:0 auto!important}
:scope.pz .ft3 .ft3-brand{justify-content:center!important;text-align:center}

/* featured story box at the top of the middle column (Oct 30, 2026) */
a.hero-feat{display:block;position:relative;text-decoration:none;color:inherit}
a.hero-feat img{display:block;width:100%;height:auto;transition:transform .25s}
a.hero-feat:hover img{transform:scale(1.02)}
a.hero-feat .hf-txt{position:absolute;left:0;right:0;bottom:0;padding:26px 16px 14px;background:linear-gradient(180deg,rgba(236,230,217,0) 0%,rgba(236,230,217,.82) 55%,rgba(236,230,217,.95) 100%);display:flex;flex-direction:column;gap:4px}
a.hero-feat .hf-txt i{font:700 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink);font-style:normal}
a.hero-feat .hf-txt b{font:800 clamp(18px,3.2vw,26px)/1.15 var(--display);color:var(--ink)}
a.hero-feat:hover .hf-txt b{color:var(--ink-2)}
a.hero-feat .hf-txt small{font-size:13px;line-height:1.4;color:var(--ink-2)}
@media(max-width:560px){a.hero-feat .hf-txt{padding:18px 12px 10px}a.hero-feat .hf-txt small{display:none}}

/* == assets/wiki.css == */
/* GTA 6 Wiki — SixStarsWanted */
.wk{max-width:1040px;margin:0 auto}
.wk-crumbs{font:600 12px/1.4 var(--font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 22px}
.wk-crumbs a{color:var(--teal)}.wk-crumbs a:hover{color:var(--pink)}.wk-crumbs i{font-style:normal;opacity:.5;margin:0 6px}
.wk-art{display:flow-root}
.wk-art h2{font-family:var(--font-display);font-weight:400;font-size:clamp(28px,4vw,38px);letter-spacing:.03em;margin:40px 0 12px;scroll-margin-top:90px;line-height:1.05}
.wk-art h3{font-size:18px;margin:24px 0 6px;color:var(--text)}
.wk-art p{margin:0 0 14px}
.wk-art ul,.wk-art ol{margin:0 0 16px;padding-left:22px}.wk-art li{margin:5px 0}
.wk-art a{color:var(--teal);text-decoration:underline;text-decoration-color:#148385;text-underline-offset:3px}
.wk-art a:hover{color:var(--pink);text-decoration-color:var(--pink)}
.wk-lead{font-size:clamp(17px,2.2vw,20px);line-height:1.6}
.wk-box{float:right;width:min(330px,100%);margin:4px 0 22px 30px;background:linear-gradient(180deg,var(--card),rgba(var(--deep-rgb),.92));border:1px solid var(--line-strong);border-radius:var(--radius);overflow:hidden}
.wk-box img{width:100%;aspect-ratio:16/10;object-fit:cover;border-bottom:1px solid var(--line)}
.wk-box h2{margin:0;padding:12px 16px;font:700 11px/1 var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--teal);background:rgba(236,230,217,.2)}
.wk-box dl{margin:0;padding:6px 16px 12px}.wk-box dt{font:700 10.5px/1 var(--font-body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:12px 0 3px}
.wk-box dd{margin:0;font-size:14.5px;line-height:1.45}
.wk-b{display:inline-block;font:700 10px/1 var(--font-body);letter-spacing:.1em;text-transform:uppercase;padding:4px 7px;border-radius:99px;vertical-align:2px;border:1px solid;white-space:nowrap}
.wk-b.c{color:var(--teal);border-color:#148385;background:rgba(47,181,184,.08)}
.wk-b.r{color:var(--coral-2);border-color:rgba(198,51,31,.5);background:rgba(198,51,31,.08)}
.wk-b.m{color:var(--ink-2);border-color:var(--ink);background:rgba(159,176,255,.1)}
.wk-b.s{color:var(--coral);border-color:var(--ink);background:rgba(255,90,69,.08)}
.wk-b.u{color:var(--mute);border-color:var(--ink)}
.wk-toc{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 6px;padding:0;list-style:none}
.wk-toc a{display:inline-block;padding:6px 12px;border:1px solid var(--line-strong);border-radius:99px;font-size:13px;color:var(--text);text-decoration:none}
.wk-toc a:hover{border-color:var(--pink);color:var(--pink)}
.wk-note{border-left:3px solid var(--orange);background:rgba(198,51,31,.07);padding:12px 16px;border-radius:0 10px 10px 0;margin:0 0 16px;font-size:15px}
.wk-gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;margin:8px 0 18px}
.wk-gal figure{margin:0}.wk-gal a{display:block}
.wk-gal img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:12px;border:1px solid var(--line);transition:transform .18s,border-color .18s}
.wk-gal a:hover img{transform:translateY(-2px);border-color:var(--pink)}
.wk-gal figcaption{font-size:12.5px;color:var(--muted);margin-top:6px;line-height:1.4}
.wk-tbl{width:100%;border-collapse:collapse;font-size:14.5px;margin:0 0 18px}
.wk-tw{overflow-x:auto;border:1px solid var(--line-strong);border-radius:var(--radius-sm);margin:0 0 18px}
.wk-tw .wk-tbl{margin:0;min-width:520px}
.wk-tbl th,.wk-tbl td{padding:10px 14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.wk-tbl thead th{font:700 11px/1 var(--font-body);letter-spacing:.12em;text-transform:uppercase;color:var(--teal);background:rgba(236,230,217,.2)}
.wk-tbl tbody tr:last-child td,.wk-tbl tbody tr:last-child th{border-bottom:0}
.wk-faq details{border:1px solid var(--line);border-radius:12px;margin:0 0 10px;background:rgba(var(--card-rgb),.5)}
.wk-faq summary{cursor:pointer;padding:13px 16px;font-weight:600;list-style:none}
.wk-faq summary::-webkit-details-marker{display:none}
.wk-faq summary:after{content:"+";float:right;color:var(--pink)}.wk-faq details[open] summary:after{content:"–"}
.wk-faq p{padding:0 16px 14px;margin:0}
.wk-src{font-size:13.5px;color:var(--muted)}.wk-src li{margin:3px 0}
.wk-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;margin:12px 0 26px}
.wk-card{display:block;background:linear-gradient(180deg,var(--card),rgba(var(--deep-rgb),.9));border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:transform .18s,border-color .18s,box-shadow .18s;color:var(--text);text-decoration:none!important}
.wk-card:hover{transform:translateY(-3px);border-color:var(--pink);box-shadow:0 10px 30px rgba(255,90,69,.12)}
.wk-card img{width:100%;aspect-ratio:16/9;object-fit:cover}
.wk-card .t{padding:12px 16px 4px;font:700 17px/1.2 var(--font-body);color:var(--text)}
.wk-card .d{padding:0 16px 16px;font-size:13.5px;color:var(--muted);line-height:1.45}
.wk-card .n{display:inline-block;margin-left:6px;font:700 11px/1 var(--font-body);letter-spacing:.1em;color:var(--teal)}
.wk-search{position:relative;margin:0 0 26px}
.wk-search input{width:100%;padding:16px 20px;font:500 17px var(--font-body);color:var(--text);background:rgba(var(--card-rgb),.8);border:1px solid var(--line-strong);border-radius:99px;outline:none}
.wk-search input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(47,181,184,.15)}
.wk-res{margin:10px 0 0;display:none;border:1px solid var(--line-strong);border-radius:14px;background:var(--card);overflow:hidden}
.wk-res a{display:flex;gap:12px;align-items:baseline;justify-content:space-between;padding:11px 16px;border-bottom:1px solid var(--line);color:var(--text)}
.wk-res a:last-child{border-bottom:0}.wk-res a:hover{background:rgba(255,90,69,.08)}
.wk-res b{font-weight:600}.wk-res span{font-size:12px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.wk-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:0 0 30px}
.wk-key{display:flex;flex-wrap:wrap;gap:10px 18px;font-size:13.5px;color:var(--muted);margin:0 0 24px;align-items:center}
.wk-more{margin-top:34px;padding-top:6px;border-top:1px solid var(--line)}
.wk-more h2{margin-top:26px!important}
@media(max-width:720px){.wk-box{float:none;width:100%;margin:0 0 22px}.wk-art h2{margin-top:32px}}

}