/* Season: Halloween 2026 (design/halloween-2026/ART-DIRECTION.md section 8, round 2: the character; what changed and how to switch it off:
   design/halloween-2026/SITE-CHANGES.md). A dated exception to design/03-design-system.md's "no illustrations".

   This file ships only while site/config.json season.enabled is true: build_site.py hashes it to
   /assets/css/season.<hash>.css (fixed copy season.css) and base.html links it after site.css. It is NOT part of
   site.css (40 KB budget, and the map page links site.css; the map stays byte-identical). Everything that dresses
   the page is keyed on <html data-season="halloween">, which the build writes inside the window and the inline head
   script removes for a reader who opted out (localStorage atlas.season = off) or whose clock is outside the window.
   The few unprefixed rules at the top are the "off" state of the season's own markup: hidden, so an opted-out
   reader gets the year-round page with nothing moved. Hidden pictures are loading="lazy", so they are never fetched.
   Data palettes (palette.css), map colours, --ok/--warn/--bad and figures are untouched. Tokens only, no hex,
   except the mark's data URI (the same exception components.css makes for .brand .mark). */

/* ---------- off state: the season's markup, hidden unless the attribute is on ---------- */
.season-band-pic,.season-band-video,.season-credit,.season-footer,.season-404,.season-only{display:none}
/* the footer toggle stays visible when off (it is how a reader turns the look back on); site.js hides it once the
   window has closed. Same pill as .theme-toggle. */
.season-toggle{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--panel);border-radius:var(--r-pill);padding:4px 10px;font-size:var(--fs-1);color:var(--muted);transition:border-color var(--t-fast) var(--ease)}
.season-toggle[hidden]{display:none}
@media (max-width:640px){.season-toggle,.theme-toggle{min-height:44px}}

/* ---------- tokens (round 3, owner 2026-10-19 night: "a dark gray two tone", spooky all the way around) ----------
   One dark charcoal palette in light AND dark mode while the look is on (the round-2 cream/violet pair is retired).
   Contrast on --bg: ink 15.4:1, muted 8.6:1, faint 4.6:1, accent 8.3:1; accent-ink on accent 9.1:1. --bg-2 is the
   second tone of the page's diagonal bands. The party colours and --ok/--warn/--bad take tokens.css's dark values,
   since the page is dark whatever the reader's scheme. */
:root[data-season="halloween"],:root[data-season="halloween"][data-theme="dark"],:root[data-season="halloween"][data-theme="light"]{
  color-scheme:dark;
  --bg:#1a1a1e; --bg-2:#212126; --panel:#26262c; --panel-2:#2e2e35;
  --ink:#f2ede5; --muted:#c4bcb1; --faint:#948c82;
  --line:#3a3a42; --line-strong:#56565f;
  --accent:#ff9a3c; --accent-ink:#1a0e04; --accent-soft:#3b2814; --accent-line:#8a5a2a;
  --warm:#ff8a4c; --warm-soft:#3a2410;
  --ok:#5fc48f; --warn:#e0a24a; --bad:#ff7a72;
  --p-r:#ff7a72; --p-d:#79aef2; --p-none:#9aa8b5;
  --shadow:0 8px 28px rgba(0,0,0,.55); --shadow-sm:0 1px 2px rgba(0,0,0,.4),0 2px 8px rgba(0,0,0,.3);
  --season-glow:#ff9a3c; --season-gold:#ffc85a; --season-purple:#8f6bd6;
}
@media (prefers-color-scheme: dark){
  :root[data-season="halloween"]:not([data-theme="light"]){color-scheme:dark}
}
/* tokens.css's prefers-contrast block sits on bare :root, which the season's :root[data-season] outranks; this puts
   back lighter muted text and stronger lines on the charcoal. */
@media (prefers-contrast: more){
  :root[data-season="halloween"]{ --muted:#ddd6cc; --line:#6a6a74; --line-strong:#8a8a94; }
}

/* ---------- the page: a starry night (owner, 2026-10-20: "i dont like the stripes... think a starry or mystical
   background"): charcoal to midnight, a violet nebula top left, a teal haze right, an ember glow low, the moon's glow
   top right, and three star tiles of coprime sizes (420, 677, 911 px) so the field never visibly repeats ---------- */
[data-season="halloween"] body{background-color:var(--bg);background-image:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='911' height='911'%3E%3Cpath d='M238 487q0.8 4.3 5.1 5.1q-4.3 0.8 -5.1 5.1q-0.8 -4.3 -5.1 -5.1q4.3 -0.8 5.1 -5.1z' fill='%23fff4d6' opacity='.8'/%3E%3Cpath d='M541 555q0.6 3.6 4.2 4.2q-3.6 0.6 -4.2 4.2q-0.6 -3.6 -4.2 -4.2q3.6 -0.6 4.2 -4.2z' fill='%23fff4d6' opacity='.8'/%3E%3Cpath d='M51 730q0.7 4.1 4.8 4.8q-4.1 0.7 -4.8 4.8q-0.7 -4.1 -4.8 -4.8q4.1 -0.7 4.8 -4.8z' fill='%23fff4d6' opacity='.8'/%3E%3Cpath d='M234 861q0.8 4.6 5.4 5.4q-4.6 0.8 -5.4 5.4q-0.8 -4.6 -5.4 -5.4q4.6 -0.8 5.4 -5.4z' fill='%23fff4d6' opacity='.8'/%3E%3Cpath d='M734 429q0.9 5.0 5.9 5.9q-5.0 0.9 -5.9 5.9q-0.9 -5.0 -5.9 -5.9q5.0 -0.9 5.9 -5.9z' fill='%23fff4d6' opacity='.8'/%3E%3C/svg%3E"),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='677' height='677'%3E%3Ccircle cx='458' cy='531' r='1.5' fill='%23ffffff' opacity='0.75'/%3E%3Ccircle cx='196' cy='100' r='1.3' fill='%23c9d6ff' opacity='0.65'/%3E%3Ccircle cx='73' cy='220' r='1.3' fill='%23c9d6ff' opacity='0.78'/%3E%3Ccircle cx='137' cy='367' r='1.4' fill='%23ffffff' opacity='0.84'/%3E%3Ccircle cx='67' cy='493' r='1.6' fill='%23c9d6ff' opacity='0.71'/%3E%3Ccircle cx='619' cy='564' r='1.7' fill='%23ffffff' opacity='0.93'/%3E%3Ccircle cx='495' cy='543' r='1.4' fill='%23c9d6ff' opacity='0.61'/%3E%3Ccircle cx='478' cy='5' r='1.4' fill='%23ffd9a0' opacity='0.74'/%3E%3Ccircle cx='325' cy='339' r='1.4' fill='%23ffffff' opacity='0.91'/%3E%3Ccircle cx='166' cy='18' r='1.4' fill='%23c9d6ff' opacity='0.60'/%3E%3Ccircle cx='87' cy='192' r='1.4' fill='%23c9d6ff' opacity='0.84'/%3E%3Ccircle cx='459' cy='31' r='1.2' fill='%23c9d6ff' opacity='0.82'/%3E%3Ccircle cx='45' cy='342' r='1.6' fill='%23c9d6ff' opacity='0.56'/%3E%3Ccircle cx='58' cy='116' r='1.3' fill='%23ffd9a0' opacity='0.74'/%3E%3Ccircle cx='420' cy='595' r='1.6' fill='%23ffffff' opacity='0.58'/%3E%3Ccircle cx='6' cy='260' r='1.6' fill='%23ffffff' opacity='0.93'/%3E%3C/svg%3E"),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='420'%3E%3Ccircle cx='136' cy='63' r='0.8' fill='%23ffffff' opacity='0.28'/%3E%3Ccircle cx='24' cy='213' r='0.5' fill='%23ffd9a0' opacity='0.45'/%3E%3Ccircle cx='38' cy='178' r='0.9' fill='%23ffffff' opacity='0.31'/%3E%3Ccircle cx='398' cy='242' r='0.7' fill='%23ffd9a0' opacity='0.69'/%3E%3Ccircle cx='361' cy='122' r='0.6' fill='%23ffffff' opacity='0.30'/%3E%3Ccircle cx='76' cy='244' r='0.8' fill='%23c9d6ff' opacity='0.42'/%3E%3Ccircle cx='25' cy='87' r='0.8' fill='%23ffffff' opacity='0.44'/%3E%3Ccircle cx='190' cy='126' r='0.9' fill='%23ffffff' opacity='0.56'/%3E%3Ccircle cx='221' cy='368' r='0.9' fill='%23c9d6ff' opacity='0.38'/%3E%3Ccircle cx='176' cy='318' r='0.6' fill='%23ffd9a0' opacity='0.47'/%3E%3Ccircle cx='281' cy='321' r='0.8' fill='%23ffffff' opacity='0.64'/%3E%3Ccircle cx='250' cy='244' r='0.7' fill='%23ffffff' opacity='0.63'/%3E%3Ccircle cx='279' cy='25' r='0.9' fill='%23ffffff' opacity='0.54'/%3E%3Ccircle cx='120' cy='162' r='0.8' fill='%23c9d6ff' opacity='0.26'/%3E%3Ccircle cx='49' cy='25' r='0.9' fill='%23ffffff' opacity='0.31'/%3E%3Ccircle cx='366' cy='34' r='0.7' fill='%23ffffff' opacity='0.50'/%3E%3Ccircle cx='363' cy='117' r='0.7' fill='%23ffffff' opacity='0.41'/%3E%3Ccircle cx='63' cy='74' r='0.6' fill='%23ffffff' opacity='0.36'/%3E%3Ccircle cx='110' cy='2' r='0.7' fill='%23ffffff' opacity='0.42'/%3E%3Ccircle cx='290' cy='217' r='0.8' fill='%23ffd9a0' opacity='0.55'/%3E%3Ccircle cx='378' cy='328' r='0.9' fill='%23ffffff' opacity='0.61'/%3E%3Ccircle cx='43' cy='266' r='0.5' fill='%23c9d6ff' opacity='0.28'/%3E%3Ccircle cx='143' cy='22' r='0.5' fill='%23ffd9a0' opacity='0.32'/%3E%3Ccircle cx='153' cy='11' r='0.9' fill='%23ffd9a0' opacity='0.53'/%3E%3Ccircle cx='106' cy='146' r='0.7' fill='%23ffffff' opacity='0.31'/%3E%3Ccircle cx='196' cy='203' r='0.5' fill='%23c9d6ff' opacity='0.30'/%3E%3Ccircle cx='348' cy='68' r='0.5' fill='%23c9d6ff' opacity='0.68'/%3E%3Ccircle cx='228' cy='11' r='0.8' fill='%23ffffff' opacity='0.69'/%3E%3Ccircle cx='110' cy='154' r='0.6' fill='%23ffffff' opacity='0.60'/%3E%3Ccircle cx='138' cy='94' r='0.9' fill='%23ffffff' opacity='0.69'/%3E%3Ccircle cx='344' cy='311' r='0.6' fill='%23c9d6ff' opacity='0.48'/%3E%3Ccircle cx='12' cy='117' r='0.6' fill='%23ffffff' opacity='0.56'/%3E%3Ccircle cx='394' cy='415' r='1.0' fill='%23c9d6ff' opacity='0.41'/%3E%3Ccircle cx='83' cy='86' r='0.8' fill='%23ffffff' opacity='0.66'/%3E%3Ccircle cx='274' cy='336' r='0.5' fill='%23ffffff' opacity='0.55'/%3E%3Ccircle cx='315' cy='201' r='0.6' fill='%23ffffff' opacity='0.61'/%3E%3Ccircle cx='408' cy='166' r='0.7' fill='%23c9d6ff' opacity='0.68'/%3E%3Ccircle cx='53' cy='63' r='1.0' fill='%23ffd9a0' opacity='0.61'/%3E%3Ccircle cx='347' cy='412' r='0.8' fill='%23c9d6ff' opacity='0.41'/%3E%3Ccircle cx='6' cy='408' r='0.8' fill='%23ffffff' opacity='0.49'/%3E%3Ccircle cx='366' cy='347' r='0.6' fill='%23c9d6ff' opacity='0.36'/%3E%3Ccircle cx='246' cy='109' r='0.7' fill='%23ffffff' opacity='0.31'/%3E%3Ccircle cx='192' cy='245' r='1.0' fill='%23ffffff' opacity='0.44'/%3E%3Ccircle cx='223' cy='220' r='0.5' fill='%23c9d6ff' opacity='0.45'/%3E%3Ccircle cx='336' cy='72' r='0.7' fill='%23c9d6ff' opacity='0.58'/%3E%3Ccircle cx='218' cy='233' r='0.9' fill='%23c9d6ff' opacity='0.30'/%3E%3Ccircle cx='116' cy='324' r='0.8' fill='%23ffffff' opacity='0.50'/%3E%3Ccircle cx='186' cy='257' r='0.8' fill='%23ffffff' opacity='0.48'/%3E%3Ccircle cx='224' cy='201' r='1.0' fill='%23ffffff' opacity='0.56'/%3E%3Ccircle cx='109' cy='235' r='1.0' fill='%23ffd9a0' opacity='0.63'/%3E%3Ccircle cx='51' cy='186' r='0.5' fill='%23ffd9a0' opacity='0.36'/%3E%3Ccircle cx='281' cy='329' r='0.9' fill='%23ffffff' opacity='0.32'/%3E%3Ccircle cx='60' cy='371' r='1.0' fill='%23ffffff' opacity='0.35'/%3E%3Ccircle cx='205' cy='416' r='0.9' fill='%23ffffff' opacity='0.32'/%3E%3Ccircle cx='142' cy='82' r='0.7' fill='%23ffd9a0' opacity='0.57'/%3E%3Ccircle cx='233' cy='185' r='0.5' fill='%23ffffff' opacity='0.40'/%3E%3Ccircle cx='27' cy='414' r='0.9' fill='%23ffd9a0' opacity='0.69'/%3E%3Ccircle cx='112' cy='17' r='0.9' fill='%23ffd9a0' opacity='0.37'/%3E%3Ccircle cx='177' cy='383' r='0.9' fill='%23ffd9a0' opacity='0.37'/%3E%3Ccircle cx='386' cy='240' r='0.9' fill='%23ffd9a0' opacity='0.29'/%3E%3Ccircle cx='289' cy='179' r='0.5' fill='%23ffffff' opacity='0.67'/%3E%3Ccircle cx='35' cy='360' r='0.5' fill='%23c9d6ff' opacity='0.64'/%3E%3Ccircle cx='232' cy='389' r='0.6' fill='%23c9d6ff' opacity='0.31'/%3E%3Ccircle cx='46' cy='68' r='0.5' fill='%23c9d6ff' opacity='0.34'/%3E%3Ccircle cx='319' cy='122' r='0.8' fill='%23c9d6ff' opacity='0.33'/%3E%3Ccircle cx='105' cy='6' r='0.9' fill='%23ffffff' opacity='0.50'/%3E%3Ccircle cx='393' cy='45' r='0.9' fill='%23ffffff' opacity='0.44'/%3E%3Ccircle cx='165' cy='213' r='0.8' fill='%23ffffff' opacity='0.69'/%3E%3Ccircle cx='297' cy='267' r='0.7' fill='%23ffd9a0' opacity='0.41'/%3E%3Ccircle cx='55' cy='30' r='0.9' fill='%23c9d6ff' opacity='0.37'/%3E%3C/svg%3E"),
  radial-gradient(34rem 22rem at 100% 0,rgba(255,214,150,.10),transparent 70%),
  radial-gradient(56rem 40rem at 0 0,rgba(143,107,214,.20),transparent 65%),
  radial-gradient(44rem 34rem at 100% 55%,rgba(64,150,175,.10),transparent 70%),
  radial-gradient(60rem 30rem at 30% 100%,rgba(255,130,50,.09),transparent 70%),
  linear-gradient(180deg,#15141d 0%,#1a1a1e 55%,#1c1922 100%);
  background-attachment:fixed;scrollbar-color:var(--line-strong) var(--bg)}
[data-season="halloween"] ::selection{background:var(--accent);color:var(--accent-ink)}
/* cobwebs in the two top corners of the window; z-index -1 paints them over the canvas (body's background is
   propagated there) and under all content */
[data-season="halloween"] body::before,[data-season="halloween"] body::after{content:"";position:fixed;top:3.25rem;width:clamp(110px,10vw,180px);aspect-ratio:1;
  pointer-events:none;z-index:-1;opacity:.42;background:no-repeat 0 0/100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='none' stroke='%23d9d4cc' stroke-width='1'%3E%3Cpath d='M0 0L100 18M0 0L78 58M0 0L56 82M0 0L18 100M0 0L96 40'/%3E%3Cpath d='M16 3Q12 8 13 13Q8 12 3 16M34 6Q26 16 27 26Q18 25 6 34M54 10Q42 26 43 40Q30 40 10 54M74 14Q58 36 60 54Q42 55 14 74M93 17Q76 46 77 69Q56 72 17 93'/%3E%3Cg fill='%23ffa242' stroke='none'%3E%3Cpath d='M58 70q3-4 6-1q1-2 3-1q2-1 3 1q3-3 6 1q-4 0-6 2q-1-1-3 1q-2-2-3-1q-2-2-6-2z'/%3E%3Cpath d='M74 86q2-3 5-1q1-1 2-1q1 0 2 1q3-2 5 1q-3 0-5 2q-1-1-2 0q-1-1-2 0q-2-2-5-2z' opacity='.7'/%3E%3Cpath d='M40 88q2-3 4-1q1-1 2-1q1 0 2 1q2-2 4 1q-3 0-4 1q-1-1-2 0q-1-1-2 0q-1-1-4-1z' opacity='.55'/%3E%3C/g%3E%3C/svg%3E")}
@media (max-width:1099px){[data-season="halloween"] body::before,[data-season="halloween"] body::after{display:none}}
/* the home page's body is a size container, which keeps its background from reaching the canvas, so -1 would sit
   under it there */
[data-season="halloween"] body.home::before,[data-season="halloween"] body.home::after{z-index:0}
[data-season="halloween"] body::before{left:0}
[data-season="halloween"] body::after{right:0;transform:scaleX(-1)}

/* ---------- trimmings: glowing headings, orange hover glow on blocks ---------- */
[data-season="halloween"] h1{text-shadow:0 0 22px rgba(255,154,60,.22)}
[data-season="halloween"] :is(.card,.tile){transition:box-shadow var(--t-base) var(--ease),border-color var(--t-base) var(--ease)}
[data-season="halloween"] :is(.card,.tile):hover{border-color:var(--accent-line);box-shadow:0 0 0 1px var(--accent-line),0 8px 26px rgba(255,140,40,.13)}
[data-season="halloween"] .btn-primary{box-shadow:0 0 14px rgba(255,154,60,.35)}

/* ---------- the cast peeking over the edges of blocks and buttons (season.js peek(); aria-hidden, never clickable) ----------
   The holder is a window above the block's top edge; the character stands in it with its lower half below the
   window, so it reads as hiding behind the block. It rises when the block scrolls into view and ducks while the
   reader points at the block. */
.cb-peek{display:none}
[data-season="halloween"] .cb-peek{display:block;position:absolute;z-index:3;overflow:hidden;pointer-events:none;width:var(--pw,58px);height:calc(var(--pw,58px) * .5)}
[data-season="halloween"] .cb-peek img{display:block;width:100%;height:auto;transform:translateY(55%);transition:transform 650ms cubic-bezier(.2,.9,.25,1.25);
  filter:drop-shadow(0 0 8px rgba(255,170,80,.45))}
[data-season="halloween"] .cb-peek.up img{transform:translateY(4%)}
[data-season="halloween"] .cb-peek.duck img{transform:translateY(55%);transition-duration:220ms}
@media (prefers-reduced-motion: reduce){[data-season="halloween"] .cb-peek img{transition:none}}
@media print{[data-season="halloween"] .cb-peek,[data-season="halloween"] body::before,[data-season="halloween"] body::after{display:none}}

/* ---------- header: the gold hairline and the lit mark (round 2 retires the leaf) ---------- */
[data-season="halloween"] .site-header::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;pointer-events:none;opacity:.7;
  background:linear-gradient(90deg,transparent,var(--season-gold) 30%,var(--season-gold) 70%,transparent)}
@media (max-width:640px){[data-season="halloween"] .site-header{position:relative}}
/* the mark: site/static/icons/favicon-halloween.svg, printed by `python scripts/site/brandmark.py --season halloween` */
[data-season="halloween"] .brand .mark{background-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 32 32%22 role=%22img%22 aria-label=%22Cracked Buckeye, Halloween%22%3E%3Cdefs%3E%3CradialGradient id=%22g%22 cx=%2235%25%22 cy=%2230%25%22 r=%2275%25%22%3E%3Cstop offset=%220%22 stop-color=%22%236e3516%22/%3E%3Cstop offset=%221%22 stop-color=%22%232e170a%22/%3E%3C/radialGradient%3E%3CradialGradient id=%22w%22 cx=%2264%25%22 cy=%2250%25%22 r=%2252%25%22%3E%3Cstop offset=%220%22 stop-color=%22%23ffa242%22 stop-opacity=%22.75%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23ffa242%22 stop-opacity=%22.22%22/%3E%3Cstop offset=%221%22 stop-color=%22%23ffa242%22 stop-opacity=%220%22/%3E%3C/radialGradient%3E%3CradialGradient id=%22e%22 cx=%2242%25%22 cy=%2238%25%22 r=%2270%25%22%3E%3Cstop offset=%220%22 stop-color=%22%23ffe08a%22/%3E%3Cstop offset=%221%22 stop-color=%22%23ffa242%22/%3E%3C/radialGradient%3E%3CclipPath id=%22c%22%3E%3Ccircle cx=%2216%22 cy=%2216%22 r=%2215%22/%3E%3C/clipPath%3E%3C/defs%3E%3Ccircle cx=%2216%22 cy=%2216%22 r=%2215%22 fill=%22url(%23g)%22/%3E%3Ccircle cx=%2216%22 cy=%2216%22 r=%2215%22 fill=%22url(%23w)%22/%3E%3Cellipse cx=%2211.5%22 cy=%2218.5%22 rx=%226%22 ry=%225%22 fill=%22url(%23e)%22/%3E%3Cg clip-path=%22url(%23c)%22 fill=%22none%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M19.6 1.6 L21.4 8.2 L18.4 13 L22.2 19 L19.2 25 L21.2 30.4%22 stroke=%22%23ffa242%22 stroke-width=%225%22 opacity=%22.55%22/%3E%3Cpath d=%22M19.6 1.6 L21.4 8.2 L18.4 13 L22.2 19 L19.2 25 L21.2 30.4%22 stroke=%22%23ffd37a%22 stroke-width=%222.5%22/%3E%3Cpath d=%22M19.6 1.6 L21.4 8.2 L18.4 13 L22.2 19 L19.2 25 L21.2 30.4%22 stroke=%22%23fff4d6%22 stroke-width=%221%22/%3E%3C/g%3E%3C/svg%3E")}

/* ---------- home: the hero band (home.html wraps the hometown hero in .season-band) ----------
   Round 2: the character on a transparent ground, on the page's own flat --bg; no scrim, no text shadow, the hero
   text is the ordinary ink (14.6:1). From 64rem the picture spans the full width behind the hero (100cqw: the body is
   a size container on the home page, so no horizontal scrollbar the way 100vw gives one), drawn whole ("contain")
   and anchored bottom-right, where the file puts the character, clear of the text column. Below 64rem the
   character would land on the search box, so it sits above the hero in the flow instead: the 2:1 phone file on
   phones, the wide file at 220 px tall from 48 to 64rem. */
[data-season="halloween"] body.home{container-type:inline-size}
[data-season="halloween"] .season-band{position:relative;isolation:isolate}
[data-season="halloween"] .season-band-pic{display:block;position:relative;margin-inline:calc(50% - 50vw);margin-inline:calc(50% - 50cqw);aspect-ratio:2 / 1}
[data-season="halloween"] .season-band-art{display:block;width:100%;height:100%;object-fit:contain;object-position:100% 100%}
[data-season="halloween"] .season-band .hero-home{padding-top:var(--s-3)}
[data-season="halloween"] .season-credit{display:flex;justify-content:flex-end;align-items:center;gap:6px;margin:calc(-1 * var(--s-4)) 0 var(--s-4);font-size:var(--fs-1);color:var(--muted)}
[data-season="halloween"] .season-credit button{font:inherit;color:inherit;background:none;border:0;padding:0 2px;min-height:44px;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
@media (min-width:48rem) and (max-width:63.99rem){
  [data-season="halloween"] .season-band-pic{margin-inline:0;aspect-ratio:auto;height:220px}
}
@media (min-width:64rem){
  [data-season="halloween"] .season-band{display:flex;flex-direction:column;justify-content:center;min-height:clamp(26rem,33.333cqw,34rem);margin-bottom:var(--s-5)}
  /* picture and video (season.js), full-bleed behind the hero */
  [data-season="halloween"] .season-band-pic,[data-season="halloween"] .season-band-video{position:absolute;inset-block:0;z-index:-1;aspect-ratio:auto;margin:0;
    left:calc(50% - 50vw);left:calc(50% - 50cqw);width:100vw;width:100cqw}
  /* the loop season.js inserts after load (desktop, light mode, motion allowed, no Save-Data); it fades in over the
     still once it is actually playing, so a slow or missing file never shows as a box. Dark mode keeps the still. */
  [data-season="halloween"] .season-band-video{display:block;height:100%;max-width:none;object-fit:contain;object-position:100% 100%;opacity:0;transition:opacity 600ms var(--ease)}
  [data-season="halloween"] .season-band-video.on{opacity:1}
  [data-season="halloween"] .season-band .hero-home{padding:var(--s-7) 0}
  [data-season="halloween"] .season-band .hero-home h1{max-width:15ch}
  [data-season="halloween"] .season-band .hero-home .lead{max-width:44ch}
  [data-season="halloween"] .season-credit{position:absolute;right:0;bottom:var(--s-2);margin:0}
  [data-season="halloween"] .season-credit button{min-height:0}
}
@media (prefers-color-scheme: dark){[data-season="halloween"]:not([data-theme="light"]) .season-band-video{display:none}}
[data-season="halloween"][data-theme="dark"] .season-band-video{display:none}

/* ---------- footer: the character (E3) peeking over the footer's top border, and the toggle ---------- */
[data-season="halloween"] .season-footer{display:block;position:relative;height:clamp(80px,10vw,160px);margin-top:calc(-1 * clamp(80px,10vw,160px));pointer-events:none}
[data-season="halloween"] .site-footer{margin-top:calc(var(--s-6) + clamp(80px,10vw,160px))}
[data-season="halloween"] .season-footer img{display:block;width:100%;height:100%;object-fit:cover;object-position:90% 100%}

/* ---------- 404: the side-eye (E2) above the H1 ---------- */
[data-season="halloween"] .season-404{display:block;max-width:24rem;margin:0 0 var(--s-4)}
[data-season="halloween"] .season-404 img{display:block;width:100%;height:auto;aspect-ratio:16 / 9}
[data-season="halloween"] .season-only{display:inline}

/* ---------- the static "Local legend" card (CAST.md 1.5; partials/legend_card.html) ---------- */
html:not([data-season]) .legend-card{display:none}
.legend-body{display:grid;gap:var(--s-4);justify-items:center;margin-top:var(--s-4)}
.legend-body h3{margin:0 0 var(--s-2)}
.legend-body p{margin:0 0 var(--s-2)}
.legend-art{position:relative;display:block;width:112px;aspect-ratio:1;border-radius:50%;background:var(--panel-2);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--season-gold) 40%,transparent);transition:transform var(--t-base) var(--ease)}
.legend-art img{display:block;width:100%;height:100%;object-fit:contain}
.legend-art .v-eyes{--d:112px;position:absolute;inset:0;opacity:0;mix-blend-mode:screen;pointer-events:none;transition:opacity 250ms var(--ease);
  background:radial-gradient(calc(var(--d) * .11) circle at var(--eye-l),var(--season-gold),transparent),
  radial-gradient(calc(var(--d) * .11) circle at var(--eye-r),var(--season-gold),transparent)}
.legend-body:is(:hover,:focus-within) .legend-art{transform:translateY(-4px)}
.legend-body:is(:hover,:focus-within) .legend-art .v-eyes{opacity:.7}
@media (min-width:40rem){
  .legend-body{grid-template-columns:160px minmax(0,1fr);justify-items:start;align-items:start}
  .legend-art{width:160px}
  .legend-art .v-eyes{--d:160px}
}

@media (prefers-reduced-motion: reduce){
  .season-toggle{transition:none}
  .legend-art,.legend-art .v-eyes{transition:none}
  .legend-body:is(:hover,:focus-within) .legend-art{transform:none}
  .legend-body:is(:hover,:focus-within) .legend-art .v-eyes{opacity:0}
  [data-season="halloween"] .season-band-video{display:none}
}
@media print{
  [data-season="halloween"] .season-band-pic,[data-season="halloween"] .season-band-video,[data-season="halloween"] .season-credit,
  [data-season="halloween"] .season-footer,[data-season="halloween"] .season-404{display:none}
}