/* Shared across all pages: tokens, page texture, logo, paper. */
:root {
  --night: #0d0b18;
  --hot: #d65f7d;
  --cyan: #00f0ff;
  --paper: #e3dac9;
  --ink: #1a1a1a;
  --phosphor: #00ff66;
  --noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
html { scroll-behavior: smooth; }
body { background: var(--night); color: #f1ecf8; }

/* Worn poster texture + VHS scanlines over the whole page */
body::before, body::after {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 60;
}
body::before { background-image: var(--noise); opacity: .07; mix-blend-mode: overlay; }
body::after {
  background: repeating-linear-gradient(to bottom, rgba(0,0,0,.18) 0 1px, transparent 1px 3px);
  opacity: .35;
}

:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }

/* Logo */
.chrome {
  background: linear-gradient(180deg, #fdfdff 0%, #b9c6e4 38%, #3a2f6b 50%, #f2d9ff 58%, #ffffff 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 2px 0 #1b1236) drop-shadow(0 0 8px rgba(0,240,255,.35));
}
.neon-pink { color: var(--hot); text-shadow: 0 0 2px rgba(214,95,125,.6), 0 0 10px rgba(214,95,125,.35); }
.neon-cyan { color: var(--cyan); text-shadow: 0 0 4px #8ff8ff, 0 0 14px var(--cyan), 0 0 30px rgba(0,240,255,.5); }
.neon-box-pink { box-shadow: 0 0 0 1px var(--hot), 0 0 12px rgba(214,95,125,.35), inset 0 0 10px rgba(214,95,125,.15); }
.neon-box-cyan { box-shadow: 0 0 0 1px var(--cyan), 0 0 14px rgba(0,240,255,.45), inset 0 0 12px rgba(0,240,255,.2); }
.neon-icon { filter: drop-shadow(0 0 4px currentColor) drop-shadow(0 0 10px currentColor); }

/* Vintage paper */
.paper {
  background-color: var(--paper);
  background-image:
    var(--noise),
    radial-gradient(ellipse at 20% 10%, rgba(255,255,255,.35), transparent 55%),
    radial-gradient(ellipse at 90% 95%, rgba(120,90,50,.28), transparent 60%);
  background-blend-mode: multiply, normal, normal;
  color: var(--ink);
  box-shadow: 0 18px 40px rgba(0,0,0,.55), 0 2px 0 rgba(0,0,0,.2);
}
