/* ===== TOKENS ===== */
:root {
  --bg: #3A2016;
  --bg-warm: #45271A;
  --bg-card: #4F2D1F;
  --bg-card-hover: #5C3626;
  --ink: #F0E6D4;
  --ink-soft: #B8A88E;
  --ink-muted: #7A6B56;
  --copper: #E8923A;
  --copper-bright: #FFB44A;
  --copper-dim: #A0601E;
  --copper-glow: rgba(232,146,58,0.35);
  --copper-glow-soft: rgba(232,146,58,0.12);
  --teal: #3ABFA0;
  --teal-glow: rgba(58,191,160,0.25);
  --red: #E85545;
  --border: rgba(232,146,58,0.12);
  --border-bright: rgba(232,146,58,0.25);
  --scanline: rgba(0,0,0,0.06);
  --r: 12px;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Jersey 10',monospace;
  background:var(--bg);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
  font-size:23px;
  overflow-x:hidden;
}
h1,h2,h3{font-family:'Silkscreen',monospace;line-height:1.3;letter-spacing:0.01em;}
h1,h2{background:linear-gradient(135deg,#FF141D 0%,#FB7236 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}
a{color:inherit;text-decoration:none;}
::selection{background:var(--copper);color:var(--bg);}

/* ===== CRT SCANLINES ===== */
body::after{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:9999;
  background:repeating-linear-gradient(0deg,transparent,transparent 2px,var(--scanline) 2px,var(--scanline) 4px);
}
/* ===== WARM VIGNETTE ===== */
body::before{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:1;
  background:radial-gradient(ellipse at 50% 30%,transparent 40%,rgba(40,22,14,0.7) 100%);
}

/* ===== STARFIELD (randomized, non-repeating) ===== */
.starfield{
  position:fixed;inset:0;pointer-events:none;z-index:0;
  /* smooth even fade: bright at side edges, ~7% down the center, no hard step */
  -webkit-mask-image:linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,0.92) 7%, rgba(0,0,0,0.72) 15%, rgba(0,0,0,0.44) 24%, rgba(0,0,0,0.22) 33%, rgba(0,0,0,0.10) 42%, rgba(0,0,0,0.07) 50%, rgba(0,0,0,0.10) 58%, rgba(0,0,0,0.22) 67%, rgba(0,0,0,0.44) 76%, rgba(0,0,0,0.72) 85%, rgba(0,0,0,0.92) 93%, rgba(0,0,0,1) 100%);
          mask-image:linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,0.92) 7%, rgba(0,0,0,0.72) 15%, rgba(0,0,0,0.44) 24%, rgba(0,0,0,0.22) 33%, rgba(0,0,0,0.10) 42%, rgba(0,0,0,0.07) 50%, rgba(0,0,0,0.10) 58%, rgba(0,0,0,0.22) 67%, rgba(0,0,0,0.44) 76%, rgba(0,0,0,0.72) 85%, rgba(0,0,0,0.92) 93%, rgba(0,0,0,1) 100%);
}
.starfield::before,
.starfield::after{
  content:'';position:absolute;inset:0;
  --star-core:rgba(255,248,232,0.85);
  --star-glow:rgba(255,238,205,0.20);
  background-repeat:no-repeat;
  image-rendering:pixelated;
}
/* layer A — randomized positions */
.starfield::before{
  background-image:
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 4px 0.7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.7px 4px at 50% 50%, var(--star-core) 0%, transparent 100%);
  background-size:20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px;
  background-position:55.07% 52.07%,55.07% 52.07%,55.07% 52.07%,57.18% 11.52%,57.18% 11.52%,57.18% 11.52%,26.21% 6.35%,26.21% 6.35%,26.21% 6.35%,19.16% 24.36%,19.16% 24.36%,19.16% 24.36%,14.65% 12.24%,14.65% 12.24%,14.65% 12.24%,10.08% 84.52%,10.08% 84.52%,10.08% 84.52%,65.16% 53.14%,65.16% 53.14%,65.16% 53.14%,76.15% 67.8%,76.15% 67.8%,76.15% 67.8%,34.72% 24.05%,34.72% 24.05%,34.72% 24.05%,3.32% 38.37%,3.32% 38.37%,3.32% 38.37%,14.53% 44.37%,14.53% 44.37%,14.53% 44.37%,73.53% 17.74%,73.53% 17.74%,73.53% 17.74%,14.84% 81.7%,14.84% 81.7%,14.84% 81.7%,18.97% 33.27%,18.97% 33.27%,18.97% 33.27%,50.03% 0.5%,50.03% 0.5%,50.03% 0.5%,62.37% 58.61%,62.37% 58.61%,62.37% 58.61%,23.66% 36.63%,23.66% 36.63%,23.66% 36.63%,86.89% 32.85%,86.89% 32.85%,86.89% 32.85%,74.86% 46.66%,74.86% 46.66%,74.86% 46.66%,39.23% 34.52%,39.23% 34.52%,39.23% 34.52%,48.9% 24.11%,48.9% 24.11%,48.9% 24.11%,98.97% 54.14%,98.97% 54.14%,98.97% 54.14%,51.57% 98.05%,51.57% 98.05%,51.57% 98.05%,10.1% 95.46%,10.1% 95.46%,10.1% 95.46%,28.82% 59.83%,28.82% 59.83%,28.82% 59.83%,35.6% 52.13%,35.6% 52.13%,35.6% 52.13%,22.72% 24.01%,22.72% 24.01%,22.72% 24.01%,90.4% 62.67%,90.4% 62.67%,90.4% 62.67%,96.51% 39.97%,96.51% 39.97%,96.51% 39.97%,47.12% 38.87%,47.12% 38.87%,47.12% 38.87%,53.7% 77.83%,53.7% 77.83%,53.7% 77.83%,78.64% 26.01%,78.64% 26.01%,78.64% 26.01%,77.01% 6.06%,77.01% 6.06%,77.01% 6.06%,9.36% 27.21%,9.36% 27.21%,9.36% 27.21%,88.56% 12.2%,88.56% 12.2%,88.56% 12.2%,17.67% 59.13%,17.67% 59.13%,17.67% 59.13%,67.55% 90.99%,67.55% 90.99%,67.55% 90.99%,5.72% 1.9%,5.72% 1.9%,5.72% 1.9%,46.37% 57.95%,46.37% 57.95%,46.37% 57.95%,26.24% 94.96%,26.24% 94.96%,26.24% 94.96%,68.23% 35.49%,68.23% 35.49%,68.23% 35.49%,93.44% 84.38%,93.44% 84.38%,93.44% 84.38%,78.51% 81.19%,78.51% 81.19%,78.51% 81.19%,80.33% 88.87%,80.33% 88.87%,80.33% 88.87%,9.64% 67.53%,9.64% 67.53%,9.64% 67.53%,36.21% 68.17%,36.21% 68.17%,36.21% 68.17%,6.9% 52.48%,6.9% 52.48%,6.9% 52.48%,60.46% 84.52%,60.46% 84.52%,60.46% 84.52%,29.71% 52.75%,29.71% 52.75%,29.71% 52.75%,42.41% 82.93%,42.41% 82.93%,42.41% 82.93%,43.37% 6.41%,43.37% 6.41%,43.37% 6.41%,82.53% 51.05%,82.53% 51.05%,82.53% 51.05%,90.81% 28.21%,90.81% 28.21%,90.81% 28.21%,64.07% 20.48%,64.07% 20.48%,64.07% 20.48%,89.22% 99.29%,89.22% 99.29%,89.22% 99.29%,62.34% 97.4%,62.34% 97.4%,62.34% 97.4%,20.99% 98.4%,20.99% 98.4%,20.99% 98.4%,74.91% 79.91%,74.91% 79.91%,74.91% 79.91%,26.26% 74.36%,26.26% 74.36%,26.26% 74.36%;
  animation:twinkleA 4.2s ease-in-out infinite;
}
/* layer B — different randomized positions, out of phase */
.starfield::after{
  background-image:
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 3.4px 0.6px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 0.6px 3.4px at 50% 50%, var(--star-core) 0%, transparent 100%);
  background-size:20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px,20px 20px;
  background-position:76.29% 29.87%,76.29% 29.87%,76.29% 29.87%,15.31% 90.76%,15.31% 90.76%,15.31% 90.76%,69.09% 70.43%,69.09% 70.43%,69.09% 70.43%,64.24% 41.42%,64.24% 41.42%,64.24% 41.42%,79.17% 81.46%,79.17% 81.46%,79.17% 81.46%,81.9% 5.39%,81.9% 5.39%,81.9% 5.39%,64.69% 23.99%,64.69% 23.99%,64.69% 23.99%,8.31% 30.6%,8.31% 30.6%,8.31% 30.6%,37.51% 74.55%,37.51% 74.55%,37.51% 74.55%,80.01% 49.44%,80.01% 49.44%,80.01% 49.44%,89.85% 56.57%,89.85% 56.57%,89.85% 56.57%,58.89% 95.98%,58.89% 95.98%,58.89% 95.98%,91.63% 40.69%,91.63% 40.69%,91.63% 40.69%,1.17% 88.75%,1.17% 88.75%,1.17% 88.75%,17.42% 42.92%,17.42% 42.92%,17.42% 42.92%,94.77% 30.1%,94.77% 30.1%,94.77% 30.1%,69.31% 52.1%,69.31% 52.1%,69.31% 52.1%,31.83% 61.14%,31.83% 61.14%,31.83% 61.14%,47.51% 53.01%,47.51% 53.01%,47.51% 53.01%,25.91% 29.39%,25.91% 29.39%,25.91% 29.39%,32.61% 42.33%,32.61% 42.33%,32.61% 42.33%,86.34% 3.84%,86.34% 3.84%,86.34% 3.84%,9.72% 45.21%,9.72% 45.21%,9.72% 45.21%,96.95% 91.82%,96.95% 91.82%,96.95% 91.82%,40.46% 18.32%,40.46% 18.32%,40.46% 18.32%,72.89% 56.28%,72.89% 56.28%,72.89% 56.28%,35.92% 91.06%,35.92% 91.06%,35.92% 91.06%,94.5% 73.49%,94.5% 73.49%,94.5% 73.49%,36.19% 15.26%,36.19% 15.26%,36.19% 15.26%,67.98% 9.36%,67.98% 9.36%,67.98% 9.36%,49.3% 5.05%,49.3% 5.05%,49.3% 5.05%,23.01% 72.2%,23.01% 72.2%,23.01% 72.2%,9.95% 61.96%,9.95% 61.96%,9.95% 61.96%,25.92% 60.37%,25.92% 60.37%,25.92% 60.37%,23.02% 5.62%,23.02% 5.62%,23.02% 5.62%,55.28% 69.37%,55.28% 69.37%,55.28% 69.37%,12.92% 0.57%,12.92% 0.57%,12.92% 0.57%;
  animation:twinkleB 5.6s ease-in-out infinite;
}
@keyframes twinkleA{
  0%,100%{opacity:0.85;}
  45%{opacity:0.45;}
  70%{opacity:1;}
}
@keyframes twinkleB{
  0%,100%{opacity:0.55;}
  40%{opacity:1;}
  75%{opacity:0.4;}
}
@media(prefers-reduced-motion:reduce){
  .starfield::before,.starfield::after{animation:none;}
}

/* ===== STARFIELD ACCENTS (bright flaring hero stars) ===== */
.starfield-accents{
  position:fixed;inset:0;pointer-events:none;z-index:0;
  -webkit-mask-image:linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,0.92) 7%, rgba(0,0,0,0.72) 15%, rgba(0,0,0,0.44) 24%, rgba(0,0,0,0.22) 33%, rgba(0,0,0,0.10) 42%, rgba(0,0,0,0.07) 50%, rgba(0,0,0,0.10) 58%, rgba(0,0,0,0.22) 67%, rgba(0,0,0,0.44) 76%, rgba(0,0,0,0.72) 85%, rgba(0,0,0,0.92) 93%, rgba(0,0,0,1) 100%);
          mask-image:linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,0.92) 7%, rgba(0,0,0,0.72) 15%, rgba(0,0,0,0.44) 24%, rgba(0,0,0,0.22) 33%, rgba(0,0,0,0.10) 42%, rgba(0,0,0,0.07) 50%, rgba(0,0,0,0.10) 58%, rgba(0,0,0,0.22) 67%, rgba(0,0,0,0.44) 76%, rgba(0,0,0,0.72) 85%, rgba(0,0,0,0.92) 93%, rgba(0,0,0,1) 100%);
}
.starfield-accents::before{
  content:'';position:absolute;inset:0;
  --star-core:rgba(255,252,240,0.98);
  --star-glow:rgba(255,228,188,0.38);
  background-repeat:no-repeat;
  image-rendering:pixelated;
  background-image:
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 7px 1.0px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 1.0px 7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 7px 1.0px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 1.0px 7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 7px 1.0px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 1.0px 7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 7px 1.0px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 1.0px 7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 7px 1.0px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 1.0px 7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 7px 1.0px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 1.0px 7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 7px 1.0px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 1.0px 7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 7px 1.0px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 1.0px 7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 7px 1.0px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 1.0px 7px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(circle at 50% 50%, var(--star-glow) 0%, rgba(255,238,205,0.06) 32%, transparent 55%),
    radial-gradient(ellipse 7px 1.0px at 50% 50%, var(--star-core) 0%, transparent 100%),
    radial-gradient(ellipse 1.0px 7px at 50% 50%, var(--star-core) 0%, transparent 100%);
  background-size:30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px,30px 30px;
  background-position:16.57% 23.05%,16.57% 23.05%,16.57% 23.05%,61.49% 72.9%,61.49% 72.9%,61.49% 72.9%,69.94% 2.48%,69.94% 2.48%,69.94% 2.48%,92.92% 65.44%,92.92% 65.44%,92.92% 65.44%,82.36% 25.84%,82.36% 25.84%,82.36% 25.84%,33.51% 31.93%,33.51% 31.93%,33.51% 31.93%,10.94% 87.76%,10.94% 87.76%,10.94% 87.76%,14.45% 54.11%,14.45% 54.11%,14.45% 54.11%,45.02% 39.26%,45.02% 39.26%,45.02% 39.26%,84.25% 71.18%,84.25% 71.18%,84.25% 71.18%;
  animation:flareA 13s ease-in-out infinite;
}
@keyframes flareA{
  0%,100%{opacity:0.20;}
  38%{opacity:0.24;}
  50%{opacity:0.92;}
  62%{opacity:0.26;}
}
@media(prefers-reduced-motion:reduce){
  .starfield-accents::before{animation:none;opacity:0.5;}
}

/* ===== FADE-UP ===== */
.fade-up{opacity:0;transform:translateY(28px);transition:opacity 0.7s ease, transform 0.7s ease;}
.fade-up.visible{opacity:1;transform:translateY(0);}

/* ===== NAV ===== */
nav{
  position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between;
  padding:20px 32px;max-width:1300px;margin:0 auto;
}
.logo svg{display:block;}
.nav-links{display:flex;gap:28px;}
.nav-links a{
  font-family:'Jersey 10',monospace;font-size:23px;color:var(--ink-soft);
  transition:color .2s;letter-spacing:0.04em;
}
.nav-links a:hover{color:var(--copper);}
@media(max-width:600px){.nav-links{display:none;}}

/* ===== HERO ===== */
.hero{
  position:relative;z-index:2;max-width:1180px;margin:0 auto;
  padding:60px 32px 100px;
  display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:48px;align-items:center;justify-content:center;
}
.hero-copy{position:relative;z-index:2;}

/* --- NEON GLOW HEADINGS --- */
.hero h1{
  font-size:clamp(38px,6.6vw,72px);color:var(--ink);
  margin-bottom:20px;
  filter:
    drop-shadow(0 0 7px rgba(48,24,10,0.5))
    drop-shadow(0 0 20px rgba(48,24,10,0.2));
  animation: neonPulse 4s ease-in-out infinite;
}
@keyframes neonPulse {
  0%, 100% {
    filter:
      drop-shadow(0 0 7px rgba(48,24,10,0.5))
      drop-shadow(0 0 20px rgba(48,24,10,0.2));
  }
  50% {
    filter:
      drop-shadow(0 0 10px rgba(48,24,10,0.7))
      drop-shadow(0 0 30px rgba(48,24,10,0.3));
  }
}

/* Neon flicker on section headings */
.section-head h2 {
  filter:
    drop-shadow(0 0 5px rgba(48,24,10,0.4))
    drop-shadow(0 0 15px rgba(48,24,10,0.15));
  animation: neonFlicker 6s ease-in-out infinite;
}
@keyframes neonFlicker {
  0%, 19%, 21%, 23%, 25%, 54%, 56%, 100% {
    filter:
      drop-shadow(0 0 5px rgba(48,24,10,0.4))
      drop-shadow(0 0 15px rgba(48,24,10,0.15));
  }
  20%, 24%, 55% {
    filter:
      drop-shadow(0 0 3px rgba(48,24,10,0.2))
      drop-shadow(0 0 8px rgba(48,24,10,0.08));
  }
}

.hero-sub{font-size:28px;color:var(--ink-soft);line-height:1.6;max-width:620px;margin-bottom:32px;}
.hero .eyebrow{font-size:23px;}
.hero-sub strong{color:var(--copper-bright);}
.hero-note{font-size:22px;color:var(--ink-muted);margin-top:12px;}
.eyebrow{
  display:inline-block;font-family:'Jersey 10',monospace;font-size:20px;
  text-transform:uppercase;letter-spacing:0.18em;color:var(--copper);margin-bottom:10px;
}

/* --- ANIMATED PHONE HERO --- */
.hero-visual{
  position:relative;
  display:flex;align-items:center;justify-content:center;
}
.hero-phone{
  display:block;
  max-height:604px;width:auto;
  backface-visibility:hidden;
  transform:rotate(-8deg);
  filter:
    drop-shadow(0 0 30px rgba(232,146,58,0.25))
    drop-shadow(0 0 60px rgba(232,146,58,0.1));
  animation: phoneFloat 5s ease-in-out infinite, phoneGlow 4s ease-in-out infinite;
}
@keyframes phoneFloat{
  0%,100%{transform:rotate(-8deg) translateY(0);}
  50%{transform:rotate(-6deg) translateY(-12px);}
}
@keyframes phoneGlow{
  0%,100%{filter:drop-shadow(0 0 30px rgba(232,146,58,0.25)) drop-shadow(0 0 60px rgba(232,146,58,0.1));}
  50%{filter:drop-shadow(0 0 45px rgba(232,146,58,0.4)) drop-shadow(0 0 90px rgba(232,146,58,0.15));}
}

@media(max-width:960px){
  .hero{grid-template-columns:1fr;text-align:center;gap:40px;}
  .hero-visual{order:-1;max-width:400px;justify-self:center;}
  .hero-sub,.search-bar{margin-left:auto;margin-right:auto;}
}
@media(min-width:1200px){
  .hero{max-width:1240px;grid-template-columns:minmax(0,720px) 460px;gap:56px;padding:80px 32px 120px;}
}

/* ===== SEARCH BAR ===== */
.search-bar{
  display:inline-flex;align-items:center;
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);
  padding:8px 8px 8px 20px;max-width:560px;width:100%;transition:border-color .2s;
}
.search-bar:focus-within{border-color:var(--copper);}
.search-bar input{
  flex:1;background:none;border:none;outline:none;color:var(--ink);
  font-family:'Jersey 10',monospace;font-size:28px;min-width:0;
}
.search-bar input::placeholder{color:var(--ink-muted);}
.search-bar .suffix{color:var(--copper);font-family:'Jersey 10',monospace;font-size:28px;margin-right:10px;user-select:none;}
.search-bar button{
  background:var(--copper);color:var(--bg);border:none;border-radius:8px;
  padding:12px 26px;font-family:'Jersey 10',monospace;font-size:26px;
  cursor:pointer;transition:background .2s;letter-spacing:0.04em;
}
.search-bar button:hover{background:var(--copper-bright);}

/* ===== SECTIONS ===== */
section{position:relative;z-index:2;max-width:1100px;margin:0 auto;padding:80px 32px;}
.section-head{text-align:center;max-width:640px;margin:0 auto 48px;}
.section-head h2{font-size:clamp(27px,4.2vw,43px);margin-bottom:14px;}
.section-head p{font-size:24px;color:var(--ink-soft);line-height:1.6;}

/* ===== SIGNAL TOWER (above "who it's for") ===== */
.signal-tower{position:relative;width:90px;height:198px;margin:0 auto 22px;}
.signal-tower img{position:relative;z-index:2;display:block;width:100%;height:100%;
  image-rendering:pixelated;image-rendering:crisp-edges;
  filter:drop-shadow(0 0 22px rgba(232,146,58,.28)) drop-shadow(0 0 48px rgba(232,146,58,.12));}
.signal-tower .emit{position:absolute;left:50%;top:3px;width:0;height:0;z-index:1;}
.signal-tower .ring{position:absolute;left:0;top:0;width:110px;height:110px;margin:-55px 0 0 -55px;
  border-radius:50%;border:5px dashed transparent;border-left-color:#F37E5B;border-right-color:#F37E5B;opacity:0;}
.signal-tower .ring:nth-child(2){border-left-color:#C63362;border-right-color:#C63362;}
.signal-tower .beacon{position:absolute;left:50%;top:3px;width:8px;height:8px;margin:-4px 0 0 -4px;z-index:3;
  background:#DE3D48;box-shadow:0 0 10px 3px rgba(222,61,72,.65);}
@keyframes towerRing{0%{transform:scale(.25);opacity:0}15%{opacity:.9}100%{transform:scale(2.6);opacity:0}}
@keyframes towerBlink{0%{opacity:1}50%{opacity:.15}}
@media (prefers-reduced-motion:no-preference){
  .signal-tower .ring{animation:towerRing 2.6s ease-out infinite;}
  .signal-tower .ring:nth-child(2){animation-delay:-.867s;}
  .signal-tower .ring:nth-child(3){animation-delay:-1.733s;}
  .signal-tower .beacon{animation:towerBlink 1.4s steps(1) infinite;}
}
@media (prefers-reduced-motion:reduce){.signal-tower .ring:nth-child(1){opacity:.42;transform:scale(1.6);}}
@media(max-width:600px){
  .signal-tower{width:60px;height:132px;margin-bottom:16px;}
  .signal-tower .emit,.signal-tower .beacon{top:2px;}
  .signal-tower .ring{width:80px;height:80px;margin:-40px 0 0 -40px;border-width:4px;}
}

/* ===== AUDIENCE GRID ===== */
.audience-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.audience-card{
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);
  padding:28px 24px;transition:border-color .25s, background .25s;
}
.audience-card:hover{border-color:var(--border-bright);background:var(--bg-card-hover);}
.audience-card svg{width:32px;height:32px;stroke:var(--copper);stroke-width:1.5;fill:none;margin-bottom:14px;}
.audience-card h3{font-family:'Jersey 10',monospace;font-size:27px;color:var(--copper-bright);margin-bottom:8px;}
.audience-card p{font-size:22px;color:var(--ink-soft);line-height:1.55;}
@media(max-width:768px){.audience-grid{grid-template-columns:1fr;}}
@media(min-width:769px) and (max-width:960px){.audience-grid{grid-template-columns:repeat(2,1fr);}}

/* ===== TELCO ===== */
.telco{background:var(--bg-warm);border-top:1px solid var(--border);border-bottom:1px solid var(--border);max-width:100%;padding:80px 32px;}
.telco .section-head,.telco .telco-grid{max-width:1100px;margin-left:auto;margin-right:auto;}
.telco-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.telco-card{
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);
  padding:28px 22px;transition:border-color .25s, background .25s;
}
.telco-card:hover{border-color:var(--border-bright);background:var(--bg-card-hover);}
.telco-card svg{width:32px;height:32px;stroke:var(--teal);stroke-width:1.5;fill:none;margin-bottom:14px;}
.telco-card h3{font-family:'Jersey 10',monospace;font-size:26px;color:var(--teal);margin-bottom:4px;}
.telco-card .eg{display:block;font-size:20px;color:var(--ink-muted);margin-bottom:10px;letter-spacing:0.04em;}
.telco-card p{font-size:21px;color:var(--ink-soft);line-height:1.5;}
@media(max-width:768px){.telco-grid{grid-template-columns:1fr;}}
@media(min-width:769px) and (max-width:1024px){.telco-grid{grid-template-columns:repeat(2,1fr);}}

/* ===== FAQ ===== */
.faq-list{max-width:720px;margin:0 auto;}
.faq-item{border:1px solid var(--border);border-radius:var(--r);margin-bottom:10px;overflow:hidden;transition:border-color .2s;}
.faq-item[open]{border-color:var(--border-bright);}
.faq-item summary{
  padding:18px 24px;cursor:pointer;font-family:'Jersey 10',monospace;font-size:26px;
  color:var(--copper-bright);list-style:none;display:flex;align-items:center;justify-content:space-between;transition:background .2s;
}
.faq-item summary:hover{background:var(--bg-card);}
.faq-item summary::after{content:'＋';font-size:25px;color:var(--copper);transition:transform .2s;}
.faq-item[open] summary::after{content:'−';}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-body{padding:0 24px 20px;font-size:23px;color:var(--ink-soft);line-height:1.65;}
.faq-body a{color:var(--teal);border-bottom:1px solid var(--teal-glow);}
.faq-body a:hover{color:var(--copper-bright);}

/* ===== TIMELINE ===== */
.tl-wrap{max-width:560px;margin:0 auto;position:relative;padding-left:28px;}
.tl-wrap::before{content:'';position:absolute;left:7px;top:8px;bottom:8px;width:2px;background:var(--border-bright);}
.tl-row{display:flex;align-items:baseline;gap:16px;padding:14px 0;position:relative;}
.tl-dot{position:absolute;left:-24px;top:20px;width:12px;height:12px;border-radius:50%;background:var(--copper);box-shadow:0 0 10px var(--copper-glow);}
.tl-date{font-family:'Jersey 10',monospace;font-size:23px;color:var(--copper-bright);min-width:200px;}
.tl-label{font-size:23px;color:var(--ink-soft);}

/* ===== CTA ===== */
.cta-band{text-align:center;padding:48px 24px;border:1px solid var(--border);border-radius:var(--r);background:linear-gradient(135deg,rgba(232,146,58,0.04),rgba(58,191,160,0.03));}
.cta-band h2{font-size:clamp(27px,3.6vw,39px);margin-bottom:24px;}
.cta-btn{
  display:inline-flex;align-items:center;gap:8px;background:var(--copper);color:var(--bg);
  padding:14px 32px;border-radius:var(--r);font-family:'Jersey 10',monospace;font-size:25px;
  transition:background .2s, transform .1s;letter-spacing:0.04em;
}
.cta-btn:hover{background:var(--copper-bright);transform:translateY(-1px);}
.cta-btn svg{stroke:currentColor;fill:none;}

/* ===== POLICIES ===== */
.policy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.policy-card{
  display:block;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);padding:28px 24px;
  transition:border-color .25s, background .25s, transform .15s;
}
.policy-card:hover{border-color:var(--border-bright);background:var(--bg-card-hover);transform:translateY(-2px);}
.policy-card svg{width:32px;height:32px;stroke:var(--copper);stroke-width:1.5;fill:none;margin-bottom:14px;}
.policy-card h3{font-family:'Jersey 10',monospace;font-size:25px;color:var(--copper-bright);margin-bottom:8px;}
.policy-card p{font-size:21px;color:var(--ink-soft);line-height:1.5;margin-bottom:14px;}
.policy-link{font-size:20px;color:var(--teal);letter-spacing:0.04em;}
@media(max-width:768px){.policy-grid{grid-template-columns:1fr;}}

/* ===== SUPPORT ===== */
.support-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:720px;margin:0 auto;}
.support-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r);padding:28px 24px;transition:border-color .2s;}
.support-card:hover{border-color:var(--border-bright);}
.support-card h3{font-family:'Jersey 10',monospace;font-size:25px;color:var(--copper-bright);margin-bottom:8px;}
.support-card p{font-size:22px;color:var(--ink-soft);line-height:1.5;margin-bottom:14px;}
.support-card a{color:var(--teal);font-size:22px;border-bottom:1px solid var(--teal-glow);}
.support-card a:hover{color:var(--copper-bright);}
@media(max-width:600px){.support-grid{grid-template-columns:1fr;}}

/* ===== FOOTER ===== */
footer{
  position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;
  max-width:1300px;margin:0 auto;padding:28px 32px;border-top:1px solid var(--border);
  font-size:20px;color:var(--ink-muted);
}
footer a{margin-left:24px;transition:color .2s;}
footer a:hover{color:var(--copper);}
@media(max-width:600px){footer{flex-direction:column;gap:12px;text-align:center;}footer a{margin-left:0;margin:0 12px;}}
