/* ==========================================================================
   Bandit 41 re-skin — "A Nightmare Before Christmas" x Halloween
   Cosmetic layer only. Loads AFTER style.css and switches on with the class
   "theme-nbc" on <html> (used together with "theme-spooky").
   Remove the class (or this file) and the site is back to normal.
   ========================================================================== */

.theme-nbc {
  --bg: #0a0712;
  --bg-2: #110b1d;
  --panel: #171027;
  --panel-2: #20163a;
  --line: rgba(196, 176, 255, 0.12);
  --text: #f2edf8;
  --muted: #ada3c2;
  --amber: #ff9a2e;             /* pumpkin */
  --orange: #ff5d17;            /* ember */
  --ghoul: #8fe36b;             /* graveyard green */
  --violet: #b794ff;
  --moon: #f4edd2;
  --accent-grad: linear-gradient(100deg, #ffb347, #ff6a1a);
  --ghoul-grad: linear-gradient(100deg, #c2f59b, #8fe36b 45%, #b794ff);
  --font-display: "Griffy", "Anton", cursive;
  --font-script: "Mountains of Christmas", "Pacifico", cursive;
  --pinstripe: repeating-linear-gradient(90deg, transparent 0 15px, rgba(242, 237, 248, 0.045) 15px 16px);
  --stitch: rgba(244, 237, 210, 0.22);
}

/* ------------------------------------------------------------ type */
.theme-nbc h1, .theme-nbc h2, .theme-nbc h3, .theme-nbc .display {
  text-transform: none;
  letter-spacing: 0.01em;
  line-height: 1.1;
}
/* Griffy draws smaller than Anton at the same font-size (caps 73% vs 86% of the
   em), so scale it to Anton's cap height: text matches the live site's size
   without touching any of the site's font-size values. */
.theme-nbc :is(h1, h2, h3, .display, .ticker span, .date-card .num, .stat .n, .tl-item .year, .form-card legend, .themes-roll-track span, .nf .code),
.theme-nbc .day-card::after {
  font-size-adjust: cap-height 0.86;
}
.theme-nbc .theme-word { font-size-adjust: none; }
/* Griffy only comes in one weight, so thicken its strokes a touch for readability */
.theme-nbc :is(h1, h2, h3, .display, .ticker span, .date-card .num, .stat .n, .tl-item .year, .form-card legend, .nf .code) {
  -webkit-text-stroke: max(0.45px, 0.018em) currentColor;
  paint-order: stroke fill;
}
/* gradient-filled text has no solid colour of its own to thicken with */
.theme-nbc :is(.accent, .date-card:not(.theme-nightmare) .num, .stat .n, .nf .code) { -webkit-text-stroke-color: #ff8f2a; }
.theme-nbc .theme-word { -webkit-text-stroke: 0; }
/* the headline wraps in the same four lines as the live site */
.theme-nbc .hero h1 { max-width: 6.25em; }
/* inner-page headlines break where the live site breaks ("It started with / a school dinner.") */
.theme-nbc:has(.nav-links a.active[href="story.html"]) .page-hero h1 { max-width: 8.05em; }
/* a wrapped heading should never leave one word alone on a line */
.theme-nbc h2 { text-wrap: balance; }
/* phones: Griffy is wider than Anton, so the one-line headings ("Shot from the front row",
   "Ready when you are.") only stay on one line, like the live site, at Griffy's natural size */
@media (max-width: 600px) {
  /* (doubled class: has to out-rank the :is() list that sets the adjustment) */
  .theme-nbc.theme-nbc .section-head h2, .theme-nbc.theme-nbc .contact .big-cta { font-size-adjust: none; letter-spacing: 0; }
}
/* the Bandit wordmark stays the Bandit wordmark */
.theme-nbc .brand, .theme-nbc .foot-title, .theme-nbc .intro-word { font-family: "Anton", "Arial Narrow", sans-serif; }
.theme-nbc .eyebrow { color: var(--ghoul); }
.theme-nbc .eyebrow::before {
  width: 22px;
  height: 22px;
  background: none;
  /* a tiny spiral-hill curl */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 21 C9 20 13 17 15 12 C17 7 14 3 10 4 C6 5 6 10 9.5 10.5 C12 10.8 12.5 8 10.8 7.4' fill='none' stroke='%238fe36b' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-size: contain;
}
.theme-nbc .accent {
  background: var(--accent-grad);
  -webkit-background-clip: text;
  background-clip: text;
}
/* soft glow only on the hero headlines: a drop-shadow filter on gradient text inside the
   scroll-reveal sections makes Safari's engine paint a stray pale square in the page corner */
.theme-nbc .hero h1 .accent, .theme-nbc .page-hero h1 .accent { filter: drop-shadow(0 0 18px rgba(255, 106, 26, 0.35)); }

/* ------------------------------------------------------------ script theme word */
.theme-nbc .theme-word {
  font-family: var(--font-script);
  font-weight: 700;
  letter-spacing: 0.01em;
  padding: 0.04em 0.14em 0.22em;
  margin-bottom: -0.12em;
}
.theme-nbc .theme-word.nightmare {
  background-image: linear-gradient(90deg, #8fe36b, #c2f59b, #ffb347, #b794ff, #8fe36b);
  background-size: 300% 100%;
}
.theme-nbc .hero .theme-word.nightmare { filter: drop-shadow(0 0 10px rgba(143, 227, 107, 0.28)); }

/* ------------------------------------------------------------ buttons */
.theme-nbc .btn-primary {
  color: #1d0b00;
  box-shadow: 0 8px 30px rgba(255, 106, 26, 0.38), inset 0 -3px 0 rgba(120, 40, 0, 0.25);
}
.theme-nbc .btn-primary:hover { box-shadow: 0 14px 44px rgba(255, 106, 26, 0.55), 0 0 0 3px rgba(143, 227, 107, 0.25), inset 0 -3px 0 rgba(120, 40, 0, 0.25); }
.theme-nbc .btn-ghost {
  border: 1.5px dashed var(--stitch);
  background: rgba(23, 16, 39, 0.35);
}
.theme-nbc .btn-ghost:hover { border-color: var(--ghoul); color: var(--ghoul); }

/* ------------------------------------------------------------ header */
.theme-nbc .site-header.scrolled {
  -webkit-backdrop-filter: blur(14px); /* Safari before 18 needs the prefix */
  background: rgba(10, 7, 18, 0.9);
  border-bottom-color: rgba(183, 148, 255, 0.14);
}
.theme-nbc .nav-links a.active { color: var(--amber); }
.theme-nbc .nav-links a.btn-primary.active { color: #1d0b00; } /* the Apply button on the apply page */
.theme-nbc .nav-links a:not(.btn):hover { color: var(--ghoul); }
.theme-nbc .logo-picks { color: var(--amber); }
.theme-nbc .brand b { color: var(--amber); }
@media (max-width: 860px) {
  .theme-nbc .nav-links { background: rgba(10, 7, 18, 0.97); }
}

/* candy-stripe scroll bar — Halloween colours, Christmas shape */
.theme-nbc .scroll-progress {
  height: 4px;
  background: repeating-linear-gradient(-45deg, #ff8a1f 0 8px, #f4edd2 8px 16px);
  background-size: 22.6px 22.6px;
  box-shadow: 0 0 12px rgba(255, 138, 31, 0.6);
  animation: nbcCandy 0.9s linear infinite;
}
@keyframes nbcCandy { to { background-position: 22.6px 0; } }

/* ------------------------------------------------------------ hero */
.theme-nbc .hero::before {
  background:
    linear-gradient(to top, var(--bg) 1%, rgba(10, 7, 18, 0.55) 34%, rgba(18, 10, 34, 0.36) 68%, rgba(10, 7, 18, 0.7)),
    radial-gradient(90% 70% at 30% 40%, transparent, rgba(10, 7, 18, 0.55));
}
/* photos graded for a moonlit night */
.theme-nbc .hero-bg { filter: saturate(0.5) contrast(1.08) brightness(0.78); }
.theme-nbc .hero-bg-stack::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(160deg, rgba(92, 52, 170, 0.55), rgba(22, 70, 58, 0.35));
  mix-blend-mode: color;
}
.theme-nbc .hero-eq { opacity: 0.45; }
.theme-nbc .hero .sub { color: #ddd4ea; }
.theme-nbc .chip {
  background: rgba(15, 10, 26, 0.6);
  border-color: rgba(196, 176, 255, 0.22);
  color: #e6def2;
}

/* the moonlit spiral hill scene (injected by nightmare.js) */
.nbc-scene {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: -1;
  width: min(60vw, 960px);
  aspect-ratio: 3 / 2;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 26%);
  mask-image: linear-gradient(90deg, transparent, #000 26%);
}
.nbc-scene-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; }
.nbc-far { fill: #170f2a; }
.nbc-town { fill: #251a3e; }
.nbc-rim, .nbc-front { fill: var(--bg); }
.theme-nbc .hero .nbc-scene { z-index: 0; } /* in front of the EQ bars */
/* nothing decorative may widen the page (iOS Safari can pan sideways otherwise) */
@supports (overflow: clip) {
  .theme-nbc .hero, .theme-nbc .page-hero { overflow-x: clip; }
}
/* desktop: a little extra room so the graveyard sits below the date chips */
@media (min-width: 1251px) {
  .theme-nbc .hero { padding-bottom: calc(clamp(3rem, 7vh, 5.5rem) + 150px); }
}
/* narrower laptops: a slightly smaller scene keeps the moon and tree clear of the last chip */
@media (min-width: 1251px) and (max-width: 1439px) {
  .theme-nbc .hero .nbc-scene { width: 56vw; }
}
/* tablets / small laptops: the text is as wide as the scene, so give the scene its own space below the chips */
@media (min-width: 701px) and (max-width: 1250px) {
  .theme-nbc .hero { padding-bottom: calc(clamp(3rem, 7vh, 5.5rem) + 30vw); }
}
.nbc-star { animation: nbcStar 4.5s ease-in-out infinite; animation-delay: var(--d, 0s); }
@keyframes nbcStar { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }
.nbc-win { animation: nbcWin 9s ease-in-out infinite; animation-delay: var(--d, 0s); }
@keyframes nbcWin { 0%, 62%, 84%, 100% { opacity: 1; } 72% { opacity: 0.5; } }
.nbc-cloud-a { animation: nbcDrift 40s ease-in-out infinite alternate; }
.nbc-cloud-b { animation: nbcDrift 31s ease-in-out -12s infinite alternate-reverse; }
.nbc-cloud-c { animation: nbcDrift 47s ease-in-out -20s infinite alternate; }
.nbc-mist { animation: nbcDrift 26s ease-in-out infinite alternate; }
@keyframes nbcDrift { from { transform: translateX(-26px); } to { transform: translateX(26px); } }
.nbc-bulb { animation: nbcTwinkle 2.6s ease-in-out infinite; animation-delay: var(--d, 0s); }
@keyframes nbcTwinkle { 0%, 100% { opacity: 1; } 55% { opacity: 0.5; } }
.nbc-pumpkin .nbc-face { animation: nbcFlicker 3.1s linear infinite; }
@keyframes nbcFlicker {
  0%, 100% { opacity: 1; }
  20% { opacity: 0.82; }
  23% { opacity: 1; }
  61% { opacity: 0.88; }
  64% { opacity: 1; }
}

/* bats gliding around the moon: X and Y drift on separate, out-of-step timers
   (a Lissajous wander), so they curve and turn without ever stopping dead */
.nbc-bats { position: absolute; left: 40%; top: 6%; width: 46%; height: 56%; container-type: size; }
@supports not (width: 1cqw) { .nbc-bats { display: none; } }
.nbc-bat {
  position: absolute;
  left: 0;
  top: 0;
  width: 58px;
  margin: -12px 0 0 -29px;
  color: #07050c;
  will-change: transform;
  animation: nbcBatX var(--tx, 11s) ease-in-out var(--dx, 0s) infinite alternate;
}
.nbc-bat-y { display: block; will-change: transform; animation: nbcBatY var(--ty, 7.3s) ease-in-out var(--dy, 0s) infinite alternate; }
.nbc-bat-tilt {
  display: block;
  filter: drop-shadow(0 0 1px rgba(244, 237, 210, 0.45));
  animation: nbcBatTilt var(--tt, 3.7s) ease-in-out infinite alternate;
}
.nbc-bat:nth-child(1) { --x0: 4cqw; --x1: 94cqw; --y0: 62cqh; --y1: 8cqh; }
.nbc-bat:nth-child(2) { width: 40px; margin: -8px 0 0 -20px; --x0: 88cqw; --x1: 10cqw; --y0: 18cqh; --y1: 84cqh; --tx: 8.3s; --ty: 5.9s; --tt: 2.9s; --dx: -3s; --dy: -1.5s; }
.nbc-bat:nth-child(3) { width: 28px; margin: -6px 0 0 -14px; --x0: 28cqw; --x1: 98cqw; --y0: 92cqh; --y1: 4cqh; --tx: 13s; --ty: 9.1s; --tt: 4.3s; --dx: -7s; --dy: -4s; }
@keyframes nbcBatX { from { transform: translateX(var(--x0)); } to { transform: translateX(var(--x1)); } }
@keyframes nbcBatY { from { transform: translateY(var(--y0)); } to { transform: translateY(var(--y1)); } }
@keyframes nbcBatTilt { from { transform: rotate(-9deg) scale(0.92); } to { transform: rotate(9deg) scale(1.06); } }
.nbc-bat svg { display: block; width: 100%; height: auto; overflow: visible; }
/* each wing beats from the shoulder instead of the whole bat flipping */
.nbc-bat .wing { transform-box: view-box; transform-origin: 32px 13px; animation: nbcWingL 0.21s ease-in-out infinite alternate; }
.nbc-bat .wing-r { animation-name: nbcWingR; }
.nbc-bat:nth-child(2) .wing { animation-duration: 0.18s; }
.nbc-bat:nth-child(3) .wing { animation-duration: 0.16s; }
@keyframes nbcWingL { from { transform: rotate(18deg) scaleY(0.8); } to { transform: rotate(-26deg) scaleY(1); } }
@keyframes nbcWingR { from { transform: rotate(-18deg) scaleY(0.8); } to { transform: rotate(26deg) scaleY(1); } }

/* a witch on a broomstick flies past now and then (nightmare.js) */
.nbc-witch {
  position: fixed;
  left: 0;
  z-index: 5;
  pointer-events: none;
  will-change: transform;
  animation: nbcWitchX linear forwards;
}
.nbc-witch.rev { animation-name: nbcWitchXRev; }
.nbc-witch-bob { animation: nbcWitchBob 2.3s ease-in-out infinite alternate; }
.nbc-witch svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
  filter: drop-shadow(0 0 3px rgba(143, 227, 107, 0.6)) drop-shadow(0 0 12px rgba(183, 148, 255, 0.4));
}
.nbc-witch.rev svg { transform: scaleX(-1); }
@keyframes nbcWitchX {
  from { transform: translate(-240px, 40px); }
  to { transform: translate(calc(100vw + 60px), -40px); }
}
@keyframes nbcWitchXRev {
  from { transform: translate(calc(100vw + 60px), 30px); }
  to { transform: translate(-240px, -50px); }
}
@keyframes nbcWitchBob {
  from { transform: translateY(-10px) rotate(-4deg); }
  to { transform: translateY(12px) rotate(3deg); }
}
.nbc-spark { transform-box: fill-box; transform-origin: center; animation: nbcSpark 0.9s ease-in-out infinite alternate; }
.nbc-spark:nth-child(2n) { animation-delay: -0.45s; }
@keyframes nbcSpark { from { opacity: 0.2; transform: scale(0.5); } to { opacity: 1; transform: scale(1.1); } }

/* no lightning flashes, on the loading screen or anywhere else */
.theme-nbc .spooky-lightning { visibility: hidden !important; }
.theme-nbc .intro::after { content: none; animation: none; }

/* same scene, smaller, on the inner-page headers */
.theme-nbc .page-hero { overflow: hidden; }
.nbc-scene--page {
  width: min(46vw, 640px);
  opacity: 0.95;
  /* fade the left edge and the bottom edge into the page */
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 26%), linear-gradient(to top, transparent, #000 16%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent, #000 26%), linear-gradient(to top, transparent, #000 16%);
  mask-composite: intersect;
}
.theme-nbc .page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background: radial-gradient(70% 90% at 78% 40%, rgba(92, 52, 170, 0.22), transparent 70%);
}
.theme-nbc .page-hero h1, .theme-nbc .page-hero .sub, .theme-nbc .page-hero .eyebrow { position: relative; z-index: 1; }

@media (max-width: 700px) {
  .nbc-scene--page { display: none; }
}
@media (max-width: 860px) {
  .nbc-scene--page { width: 92vw; right: -24vw; opacity: 0.38; }
  .nbc-bats { display: none; }
}
/* phones: the scene gets its own space under the hero text */
@media (max-width: 700px) {
  .theme-nbc .hero { padding-bottom: calc(1.5rem + 64vw); }
  .theme-nbc .hero .nbc-scene { width: 100vw; opacity: 1; -webkit-mask-image: none; mask-image: none; }
  .theme-nbc .hero-eq { opacity: 0.28; }
}

/* ------------------------------------------------------------ ticker: Jack's pinstripes */
.theme-nbc .ticker {
  background: var(--pinstripe), #0c0816;
  border-block: 1px solid rgba(244, 237, 210, 0.16);
}
.theme-nbc .ticker span { font-family: var(--font-display); text-transform: none; letter-spacing: 0.04em; color: #d9d0e8; }
.theme-nbc .ticker span i.snow { color: #cfe8ff; text-shadow: 0 0 8px rgba(207, 232, 255, 0.7); }

/* fairy lights strung under the ticker (Halloween Town does Christmas) */
.nbc-lights {
  position: relative;
  z-index: 3;
  height: 34px;
  margin-bottom: -34px;
  pointer-events: none;
  overflow: hidden;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='20'%3E%3Cpath d='M0 1 Q42 17 84 1' fill='none' stroke='%23231a33' stroke-width='2'/%3E%3C/svg%3E") repeat-x 0 0;
}
.nbc-lights i {
  position: absolute;
  top: 8px;
  width: 9px;
  height: 14px;
  margin-left: -4.5px;
  border-radius: 45% 45% 50% 50% / 38% 38% 62% 62%;
  background: var(--c);
  box-shadow: 0 0 10px 2px var(--c), 0 0 22px 4px color-mix(in srgb, var(--c) 45%, transparent);
  animation: nbcBulb 2.6s ease-in-out infinite;
  animation-delay: var(--d, 0s);
}
.nbc-lights i::before {
  content: "";
  position: absolute;
  top: -4px;
  left: 2px;
  width: 5px;
  height: 5px;
  border-radius: 1px;
  background: #3a3048;
}
@keyframes nbcBulb {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.35; box-shadow: 0 0 4px 0 var(--c); }
}

/* ------------------------------------------------------------ date cards */
.theme-nbc .date-card {
  background: var(--pinstripe), linear-gradient(160deg, var(--panel-2), var(--panel));
}
.theme-nbc .date-card:hover { border-color: rgba(143, 227, 107, 0.45); }
.theme-nbc .date-card .num { line-height: 1.1; }
/* Griffy is wider than Anton: keep "Bandit Forty-Three" on one line like the live site */
.theme-nbc .date-card { container-type: inline-size; }
.theme-nbc .date-card h3:not(.theme-title) { font-size: min(1.5rem, 9.8cqi); letter-spacing: 0; }
.theme-nbc .date-card .status { color: #1d0b00; }
.theme-nbc .date-card .countdown { color: var(--ghoul); }
.theme-nbc .mystery b { color: #d9d0e8; }

/* Bandit 41: the number silhouetted against a full moon */
.theme-nbc .date-card.theme-nightmare {
  border: 1px solid rgba(143, 227, 107, 0.35);
  background:
    var(--pinstripe),
    radial-gradient(120% 80% at 20% 0%, rgba(92, 52, 170, 0.35), transparent 60%),
    linear-gradient(160deg, #241840, #120c20);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.3), 0 18px 60px rgba(92, 52, 170, 0.25);
}
.theme-nbc .date-card.theme-nightmare::after {
  background:
    radial-gradient(closest-side at 76% 70%, rgba(143, 227, 107, 0.10), transparent 60%),
    radial-gradient(closest-side at 60% 16%, rgba(255, 154, 61, 0.08), transparent 55%);
}
.theme-nbc .date-card.theme-nightmare .num {
  position: relative;
  z-index: 0;
  display: inline-block;
  padding: 0 0.12em;
  background: none;
  color: #0a0712;
  -webkit-text-fill-color: #0a0712;
}
.theme-nbc .date-card.theme-nightmare .num::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 50%;
  top: 50%;
  width: 1.32em;
  height: 1.32em;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(circle at 40% 36%, #fffbe9, #f4e9c4 58%, #d6c48a);
  box-shadow: 0 0 30px 6px rgba(244, 237, 210, 0.28), 0 0 80px 20px rgba(183, 148, 255, 0.14);
}
.theme-nbc .date-card.theme-nightmare .status {
  background: var(--ghoul-grad);
  color: #0f1a08;
}
.theme-nbc .date-card .theme-word.nightmare { font-size: 1.7rem; line-height: 1.25; }
.theme-nbc .chip .theme-word.nightmare { font-size: 1.32em; line-height: 1; padding-bottom: 0.14em; margin-bottom: -0.1em; }

/* ------------------------------------------------------------ stats */
.theme-nbc .stats { background: rgba(196, 176, 255, 0.1); }
.theme-nbc .stat { background: var(--pinstripe), var(--bg); }

/* ------------------------------------------------------------ Sally's stitches */
.theme-nbc .day-card,
.theme-nbc .skill-card,
.theme-nbc .letter,
.theme-nbc .form-card {
  outline: 1.5px dashed var(--stitch);
  outline-offset: -9px;
}
.theme-nbc .day-card { background: var(--bg-2); }
.theme-nbc .day-card:hover { border-color: rgba(143, 227, 107, 0.4); outline-color: rgba(143, 227, 107, 0.45); }
.theme-nbc .day-card .d { color: var(--ghoul); font-family: var(--font-script); font-weight: 700; font-size: 1.15rem; letter-spacing: 0.02em; }
.theme-nbc .day-card::after { color: rgba(244, 237, 210, 0.07); }

.theme-nbc .split .media,
.theme-nbc .quote-media img {
  outline: 1.5px dashed rgba(244, 237, 210, 0.3);
  outline-offset: 6px;
}
.theme-nbc .split .media img,
.theme-nbc .quote-media img { filter: saturate(0.7) contrast(1.05); }
.theme-nbc .split p { color: #d7cfe4; }

/* ------------------------------------------------------------ films */
.theme-nbc #films {
  background:
    radial-gradient(60% 60% at 85% 0%, rgba(92, 52, 170, 0.18), transparent 70%),
    var(--pinstripe),
    var(--bg-2) !important;
}
.theme-nbc .film { border-color: rgba(196, 176, 255, 0.16); }
.theme-nbc .film img { filter: saturate(0.75); }
.theme-nbc .film:hover img { filter: saturate(1.05); }
.theme-nbc .film .play::before {
  background: radial-gradient(circle at 38% 32%, #ffc062, #ff7a1a 55%, #c2470b);
  box-shadow: 0 10px 34px rgba(255, 106, 26, 0.5), inset 0 -4px 0 rgba(120, 40, 0, 0.3);
}

/* ------------------------------------------------------------ quotes */
.theme-nbc .quotes {
  background:
    radial-gradient(70% 90% at 50% 0%, rgba(143, 227, 107, 0.07), transparent 65%),
    radial-gradient(50% 70% at 90% 100%, rgba(92, 52, 170, 0.16), transparent 70%),
    var(--bg-2);
}
.theme-nbc .quote blockquote::before,
.theme-nbc .quote blockquote::after {
  font-family: var(--font-script);
  font-weight: 700;
  color: var(--ghoul);
  font-size: 1.3em;
  line-height: 0;
  vertical-align: -0.12em;
}
.theme-nbc .quote cite::before { color: var(--ghoul); }
.theme-nbc .quote-dots button { background: rgba(196, 176, 255, 0.18); }

/* ------------------------------------------------------------ gallery strip */
.theme-nbc .strip a, .theme-nbc .masonry a { border-color: rgba(196, 176, 255, 0.16); }
.theme-nbc .strip img, .theme-nbc .masonry img { filter: saturate(0.45) contrast(1.05) brightness(0.92); }
.theme-nbc .strip a:hover img, .theme-nbc .masonry a:hover img { filter: saturate(1.05); }

/* ------------------------------------------------------------ themes strip */
.theme-nbc .themes-roll-track span {
  font-family: var(--font-display);
  text-transform: none;
  -webkit-text-stroke: 1px rgba(244, 237, 210, 0.32);
}
.theme-nbc .themes-roll-track i { color: var(--ghoul); }
.theme-nbc .themes-next .theme-word { font-size: clamp(2.1rem, 5vw, 3.2rem); }

/* colour EQ dividers */
.theme-nbc .wave-divider { opacity: 0.6; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='44'%3E%3Crect x='3' y='19' width='3' height='6' rx='1.5' fill='%23ff9a2e'/%3E%3Crect x='12' y='15' width='3' height='14' rx='1.5' fill='%238fe36b'/%3E%3Crect x='21' y='17' width='3' height='10' rx='1.5' fill='%23b794ff'/%3E%3Crect x='30' y='11' width='3' height='22' rx='1.5' fill='%23ff9a2e'/%3E%3Crect x='39' y='6' width='3' height='32' rx='1.5' fill='%238fe36b'/%3E%3Crect x='48' y='13' width='3' height='18' rx='1.5' fill='%23b794ff'/%3E%3Crect x='57' y='18' width='3' height='8' rx='1.5' fill='%23ff9a2e'/%3E%3Crect x='66' y='9' width='3' height='26' rx='1.5' fill='%238fe36b'/%3E%3Crect x='75' y='3' width='3' height='38' rx='1.5' fill='%23b794ff'/%3E%3Crect x='84' y='14' width='3' height='16' rx='1.5' fill='%23ff9a2e'/%3E%3Crect x='93' y='17' width='3' height='10' rx='1.5' fill='%238fe36b'/%3E%3Crect x='102' y='12' width='3' height='20' rx='1.5' fill='%23b794ff'/%3E%3Crect x='111' y='7' width='3' height='30' rx='1.5' fill='%23ff9a2e'/%3E%3Crect x='120' y='16' width='3' height='12' rx='1.5' fill='%238fe36b'/%3E%3Crect x='129' y='10' width='3' height='24' rx='1.5' fill='%23b794ff'/%3E%3Crect x='138' y='18' width='3' height='8' rx='1.5' fill='%23ff9a2e'/%3E%3Crect x='147' y='5' width='3' height='34' rx='1.5' fill='%238fe36b'/%3E%3Crect x='156' y='15' width='3' height='14' rx='1.5' fill='%23b794ff'/%3E%3Crect x='165' y='12' width='3' height='20' rx='1.5' fill='%23ff9a2e'/%3E%3Crect x='174' y='16' width='3' height='12' rx='1.5' fill='%238fe36b'/%3E%3C/svg%3E"); }

/* ------------------------------------------------------------ supporters */
.theme-nbc .logo-row a { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0 12px 34px rgba(0, 0, 0, 0.45); }
.theme-nbc .logo-row a:hover { transform: translateY(-4px) rotate(-1.5deg); box-shadow: 0 0 0 3px rgba(255, 154, 46, 0.6), 0 16px 40px rgba(0, 0, 0, 0.5); }

/* ------------------------------------------------------------ contact + footer graveyard */
.theme-nbc .contact {
  background:
    radial-gradient(70% 90% at 50% 100%, rgba(143, 227, 107, 0.12), transparent 60%),
    radial-gradient(40% 60% at 85% 100%, rgba(183, 148, 255, 0.12), transparent 70%),
    var(--bg);
}
.theme-nbc .contact-rows a:hover { color: var(--ghoul); }
.theme-nbc .site-footer {
  position: relative;
  background: #07050c;
  border-top: 0;
}
.theme-nbc .site-footer::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 100%;
  height: 74px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='74' fill='%2307050c'%3E%3Cpath transform='translate(10 74) rotate(1.5)' d='M-2 0 L-2 -49 L-5 -49 L0 -60 L5 -49 L2 -49 L2 0 Z'/%3E%3Cpath transform='translate(36 74) rotate(2.8)' d='M-2 0 L-2 -58 L-5 -58 L0 -69 L5 -58 L2 -58 L2 0 Z'/%3E%3Cpath transform='translate(62 74) rotate(-2.2)' d='M-2 0 L-2 -48 L-5 -48 L0 -59 L5 -48 L2 -48 L2 0 Z'/%3E%3Cpath transform='translate(88 74) rotate(-2.2)' d='M-2 0 L-2 -48 L-5 -48 L0 -59 L5 -48 L2 -48 L2 0 Z'/%3E%3Cpath transform='translate(114 74) rotate(-3.0)' d='M-2 0 L-2 -58 L-5 -58 L0 -69 L5 -58 L2 -58 L2 0 Z'/%3E%3Cpath transform='translate(140 74) rotate(-2.3)' d='M-2 0 L-2 -50 L-5 -50 L0 -61 L5 -50 L2 -50 L2 0 Z'/%3E%3Cpath transform='translate(166 74) rotate(-0.5)' d='M-2 0 L-2 -49 L-5 -49 L0 -60 L5 -49 L2 -49 L2 0 Z'/%3E%3Cpath transform='translate(192 74) rotate(0.9)' d='M-2 0 L-2 -59 L-5 -59 L0 -70 L5 -59 L2 -59 L2 0 Z'/%3E%3Cpath transform='translate(218 74) rotate(-1.8)' d='M-2 0 L-2 -47 L-5 -47 L0 -58 L5 -47 L2 -47 L2 0 Z'/%3E%3Cpath transform='translate(244 74) rotate(3.0)' d='M-2 0 L-2 -48 L-5 -48 L0 -59 L5 -48 L2 -48 L2 0 Z'/%3E%3Cpath transform='translate(270 74) rotate(2.4)' d='M-2 0 L-2 -59 L-5 -59 L0 -70 L5 -59 L2 -59 L2 0 Z'/%3E%3Cpath transform='translate(296 74) rotate(2.0)' d='M-2 0 L-2 -52 L-5 -52 L0 -63 L5 -52 L2 -52 L2 0 Z'/%3E%3Cpath transform='translate(322 74) rotate(2.4)' d='M-2 0 L-2 -53 L-5 -53 L0 -64 L5 -53 L2 -53 L2 0 Z'/%3E%3Cpath transform='translate(348 74) rotate(2.8)' d='M-2 0 L-2 -56 L-5 -56 L0 -67 L5 -56 L2 -56 L2 0 Z'/%3E%3Cpath transform='translate(374 74) rotate(2.0)' d='M-2 0 L-2 -50 L-5 -50 L0 -61 L5 -50 L2 -50 L2 0 Z'/%3E%3Cpath transform='translate(400 74) rotate(-0.6)' d='M-2 0 L-2 -50 L-5 -50 L0 -61 L5 -50 L2 -50 L2 0 Z'/%3E%3Cpath d='M0 38 Q105 33 210 39 T420 38 L420 42 Q315 41 210 43 T0 42 Z'/%3E%3Cpath d='M0 58 Q105 54 210 59 T420 58 L420 62 Q315 61 210 63 T0 62 Z'/%3E%3Cpath transform='translate(96 74) rotate(-7)' d='M-15 0 L-15 -30 A15 15 0 0 1 15 -30 L15 0 Z'/%3E%3Cpath transform='translate(300 74) rotate(6)' d='M-3 0 L-3 -26 L-13 -26 L-13 -32 L-3 -32 L-3 -44 L3 -44 L3 -32 L13 -32 L13 -26 L3 -26 L3 0 Z'/%3E%3Cpath d='M0 74 L0 70 Q210 64 420 70 L420 74 Z'/%3E%3C/svg%3E") repeat-x 0 100%;
  pointer-events: none;
}
.theme-nbc main > section:last-child { padding-bottom: clamp(6rem, 11vw, 9rem); }
.theme-nbc .site-footer a:hover { color: var(--ghoul); }
.theme-nbc .foot-note { border-top-color: rgba(196, 176, 255, 0.1); }

/* ------------------------------------------------------------ inner pages */
.theme-nbc .timeline::before { background: linear-gradient(var(--amber), var(--violet), transparent); }
.theme-nbc .tl-item::before { border-color: var(--ghoul); box-shadow: 0 0 10px rgba(143, 227, 107, 0.45); }
.theme-nbc .tl-item .year { color: var(--amber); }
.theme-nbc .skill-card { background: var(--bg-2); }
.theme-nbc .skill-card li::before { color: var(--ghoul); }
.theme-nbc .letter { background: var(--bg-2); }
.theme-nbc .letter p { color: #d7cfe4; }
.theme-nbc .letter.featured { background: linear-gradient(160deg, rgba(92, 52, 170, 0.28), var(--bg-2) 60%); border-color: rgba(183, 148, 255, 0.35); }
.theme-nbc .letters-cols .letter:nth-child(3n+1)::before { background: radial-gradient(circle at 34% 28%, #d9ffc2, var(--ghoul) 72%); }
.theme-nbc .letters-cols .letter:nth-child(3n+2)::before { background: radial-gradient(circle at 34% 28%, #e6d9ff, var(--violet) 72%); }
.theme-nbc .press-quote { border-left-color: var(--ghoul); }
.theme-nbc .form-card legend::before { color: var(--ghoul); }

/* ------------------------------------------------------------ snow canvas */
.nbc-snow {
  position: fixed;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  width: 100%;
  height: 100%;
}

/* ------------------------------------------------------------ misc polish */
.theme-nbc .cursor-glow { background: radial-gradient(circle, rgba(143, 227, 107, 0.06), rgba(183, 148, 255, 0.03) 45%, transparent 70%); }
.theme-nbc .note-pop { text-shadow: 0 0 14px rgba(143, 227, 107, 0.8); }
.theme-nbc ::selection { background: var(--ghoul); color: #0f1a08; }
.theme-nbc :focus-visible { outline-color: var(--ghoul); }
.theme-nbc .to-top { border-color: rgba(143, 227, 107, 0.4); color: var(--ghoul); background: rgba(17, 11, 29, 0.8); }
/* skeleton intro only: the site's cog splash is in the HTML and paints before
   nightmare.js swaps it out, so keep its contents hidden from the first frame
   and give both the same background - the swap is then invisible */
.theme-nbc .intro { background: radial-gradient(120% 120% at 50% 38%, #1c1030, #0a0712 70%); }
.theme-nbc .intro:not(.nbc-intro) > * { visibility: hidden; }

@media (prefers-reduced-motion: reduce) {
  .nbc-bulb, .nbc-face, .nbc-star, .nbc-win, .nbc-cloud, .nbc-mist, .nbc-bat, .nbc-bat-y, .nbc-bat-tilt, .nbc-bat .wing, .nbc-lights i, .theme-nbc .scroll-progress { animation: none; }
  .nbc-bats, .nbc-snow, .nbc-witch { display: none; }
}

/* ------------------------------------------------------------ loading intro: skeleton rocker
   An original character (not Disney's): rises out of the ground in front of the
   moon, strums a plectrum-shaped guitar and sings. Gentle fades only, no flashes.
   Tap / click / any key skips it. Built by nightmare.js. */
.theme-nbc .nbc-intro { overflow: hidden; }
/* a slower, softer exit than the site's default splash */
.theme-nbc .nbc-intro.done { animation: introOut 0.9s cubic-bezier(0.65, 0, 0.35, 1) forwards; }
.nbc-intro-inner { display: grid; justify-items: center; text-align: center; position: relative; z-index: 1; }
.nbc-intro-scene { display: block; width: min(80vw, 420px); height: auto; overflow: visible; }
/* timeline (s): moon 0-1.6 | skeleton rises 0.6-2.5 | BANDIT 2.2-3.6 | tag 2.7-4.1 |
   script writes on 3.3-5.0 | hold | slides away at 6.0 (nightmare.js).
   Every move uses a gentle-start, gentle-stop curve so nothing snaps in. */
.theme-nbc .nbc-intro .intro-word { margin-top: 0.1rem; animation: niTextIn 1.4s cubic-bezier(0.4, 0, 0.2, 1) 2.2s both; }
@keyframes niTextIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.nbc-intro-tag {
  margin-top: 0.6rem;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.42em;
  text-transform: uppercase;
  color: var(--muted);
  animation: niTextIn 1.4s cubic-bezier(0.4, 0, 0.2, 1) 2.7s both;
}
.nbc-intro-script {
  margin-top: 0.45rem;
  font-family: var(--font-script);
  font-weight: 700;
  font-size: clamp(1.35rem, 4.6vw, 1.75rem);
  color: var(--ghoul);
  text-shadow: 0 0 14px rgba(143, 227, 107, 0.45);
  clip-path: inset(-0.6em 100% -0.6em -1em);
  animation: niWipe 1.7s cubic-bezier(0.45, 0, 0.25, 1) 3.3s forwards;
}
@keyframes niWipe { to { clip-path: inset(-0.6em -1em -0.6em -1em); } }
.ni-skip {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 1.4rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: rgba(173, 163, 194, 0.5);
  animation: niTextIn 1s ease 3.8s both;
}
.ni-moon { transform-box: fill-box; transform-origin: center; animation: niMoon 1.6s cubic-bezier(0.4, 0, 0.2, 1) both; }
@keyframes niMoon { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: none; } }
/* a long glide up out of the ground: eases in, eases out, no bounce */
.ni-rise { animation: niRise 1.9s cubic-bezier(0.37, 0, 0.18, 1) 0.6s both; }
@keyframes niRise { from { transform: translateY(260px); } to { transform: translateY(0); } }
.ni-bat { opacity: 0; transform-box: fill-box; transform-origin: center; animation: niBatA 2.8s cubic-bezier(0.4, 0, 0.6, 1) 1s forwards; }
.ni-bat-b { animation-name: niBatB; animation-delay: 1.3s; }
.ni-bat-c { animation-name: niBatC; animation-delay: 1.6s; }
@keyframes niBatA { 0% { opacity: 0; transform: translate(0, 0) scale(0.3); } 15% { opacity: 1; } 100% { opacity: 1; transform: translate(-170px, -120px) scale(1.5); } }
@keyframes niBatB { 0% { opacity: 0; transform: translate(0, 0) scale(0.3); } 15% { opacity: 1; } 100% { opacity: 1; transform: translate(150px, -110px) scale(1.4); } }
@keyframes niBatC { 0% { opacity: 0; transform: translate(0, 0) scale(0.3); } 15% { opacity: 1; } 100% { opacity: 1; transform: translate(40px, -170px) scale(1.3); } }
.ni-flap { transform-box: fill-box; transform-origin: center; animation: niFlap 0.2s ease-in-out infinite alternate; }
@keyframes niFlap { to { transform: scaleY(0.45); } }
.ni-note { opacity: 0; transform-box: fill-box; transform-origin: center; animation: niNote 2.8s ease-out infinite; animation-delay: var(--d, 0s); }
@keyframes niNote {
  0% { opacity: 0; transform: translate(0, 0) scale(0.6); }
  15% { opacity: 1; }
  100% { opacity: 0; transform: translate(var(--x, 30px), -110px) rotate(15deg) scale(1.1); }
}
.ni-cone { transform-box: fill-box; transform-origin: center; animation: niCone 0.3s ease-in-out infinite alternate; }
@keyframes niCone { to { transform: scale(1.08); } }
.ni-face { animation: nbcFlicker 3.1s linear infinite; }
.ni-snow {
  position: absolute;
  top: -12px;
  width: var(--s, 3px);
  height: var(--s, 3px);
  border-radius: 50%;
  background: rgba(240, 244, 255, 0.8);
  animation: niSnow var(--t, 7s) linear var(--d, 0s) infinite;
}
@keyframes niSnow { to { transform: translate(var(--dx, 20px), 110vh); } }

/* very small phones (320px wide): long contact rows drop under their label instead of
   running 40px off the screen (the normal site has this overflow too) */
@media (max-width: 380px) {
  .theme-nbc .contact-rows a { flex-wrap: wrap; row-gap: 0.15rem; }
  .theme-nbc .contact-rows a span { min-width: 100%; }
}