:root {
  color-scheme: dark;
  --ink: #07090d;
  --ink-raised: #0d1118;
  --ink-soft: #131923;
  --paper: #f6f1e8;
  --muted: #9fa5ae;
  --line: rgba(255, 255, 255, 0.12);
  --accent: #f09a32;
  --accent-hot: #e7432f;
  --accent-cool: #923cff;
  --glow: rgba(239, 67, 44, 0.35);
  --header-border: rgba(240, 154, 50, .28);
  --header-edge: rgba(241, 92, 34, .72);
  --header-a: rgba(230, 61, 35, .2);
  --header-b: rgba(18, 8, 17, .95);
  --header-trace: linear-gradient(90deg, transparent, #ff8630, #983cff, transparent);
  --header-trace-glow: #ff5b27;
  --header-tab: linear-gradient(90deg, #ff8a2a, #df392b 62%, transparent 62%);
  --header-tab-glow: rgba(241, 84, 35, .7);
  --brand-accent: #ff9a32;
  --page-deep: #05070a;
  --page-side-glow: rgba(146, 60, 255, .12);
  --body-pattern: linear-gradient(transparent, transparent);
  --season-panel-border: rgba(240, 154, 50, .28);
  --season-panel-a: rgba(83, 42, 13, .43);
  --season-panel-b: rgba(12, 15, 17, .98);
  --season-surface: rgba(15, 18, 22, .94);
  --season-surface-soft: rgba(255, 255, 255, .035);
  --season-detail: #ffd18b;
  --display: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --shell: min(1180px, calc(100vw - 40px));
}

:root[data-season="veterans"] {
  --ink: #070c15;
  --ink-raised: #0c1523;
  --ink-soft: #142238;
  --paper: #f4f0e7;
  --accent: #e9d7a7;
  --accent-hot: #c72f3f;
  --accent-cool: #315eaa;
  --glow: rgba(49, 94, 170, 0.38);
  --header-border: rgba(216, 225, 239, .3);
  --header-edge: rgba(199, 47, 63, .78);
  --header-a: rgba(49, 94, 170, .25);
  --header-b: rgba(8, 24, 48, .97);
  --header-trace: linear-gradient(90deg, transparent, #c72f3f 22%, #f4f0e7 50%, #315eaa 78%, transparent);
  --header-trace-glow: rgba(111, 151, 219, .7);
  --header-tab: linear-gradient(90deg, #c72f3f 0 31%, #e9e3d6 31% 61%, #315eaa 61% 86%, transparent 86%);
  --header-tab-glow: rgba(49, 94, 170, .7);
  --brand-accent: #f0dfb1;
  --page-deep: #020711;
  --page-side-glow: rgba(199, 47, 63, .11);
  --body-pattern:
    radial-gradient(circle, rgba(244, 240, 231, .26) 0 1px, transparent 1.5px) 12px 8px / 86px 86px,
    linear-gradient(112deg, transparent 0 42%, rgba(199, 47, 63, .035) 46%, rgba(244, 240, 231, .025) 50%, rgba(49, 94, 170, .045) 54%, transparent 59%);
  --season-panel-border: rgba(190, 207, 232, .3);
  --season-panel-a: rgba(26, 54, 94, .62);
  --season-panel-b: rgba(5, 12, 24, .98);
  --season-surface: rgba(8, 20, 38, .94);
  --season-surface-soft: rgba(86, 126, 184, .08);
  --season-detail: #dce6f5;
}

:root[data-season="christmas"] {
  --ink: #06100f;
  --ink-raised: #0b1816;
  --ink-soft: #12251f;
  --paper: #fff8e8;
  --accent: #efb83e;
  --accent-hot: #d7393f;
  --accent-cool: #178b68;
  --glow: rgba(23, 139, 104, 0.4);
  --header-border: rgba(239, 184, 62, .32);
  --header-edge: rgba(215, 57, 63, .74);
  --header-a: rgba(23, 139, 104, .24);
  --header-b: rgba(6, 28, 22, .97);
  --header-trace: linear-gradient(90deg, transparent, #d7393f 22%, #efb83e 50%, #178b68 78%, transparent);
  --header-trace-glow: rgba(239, 184, 62, .66);
  --header-tab: linear-gradient(90deg, #d7393f 0 34%, #efb83e 34% 64%, #178b68 64% 88%, transparent 88%);
  --header-tab-glow: rgba(239, 184, 62, .68);
  --brand-accent: #efc75b;
  --page-deep: #020a08;
  --page-side-glow: rgba(215, 57, 63, .1);
  --body-pattern:
    radial-gradient(circle, rgba(255, 252, 235, .24) 0 1px, transparent 1.6px) 4px 0 / 52px 66px,
    radial-gradient(circle, rgba(239, 184, 62, .16) 0 1.5px, transparent 2.1px) 23px 19px / 93px 108px;
  --season-panel-border: rgba(239, 184, 62, .3);
  --season-panel-a: rgba(21, 83, 61, .55);
  --season-panel-b: rgba(4, 17, 13, .98);
  --season-surface: rgba(7, 29, 22, .94);
  --season-surface-soft: rgba(31, 137, 100, .08);
  --season-detail: #f4ce72;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
#visit, #songs, #about { scroll-margin-top: 118px; }
body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  background:
    var(--body-pattern),
    radial-gradient(circle at 84% 10%, var(--glow), transparent 28rem),
    radial-gradient(circle at 7% 62%, var(--page-side-glow), transparent 34rem),
    linear-gradient(180deg, var(--ink), var(--page-deep) 75%);
  background-attachment: fixed;
  color: var(--paper);
  font-family: var(--sans);
  line-height: 1.55;
}

.site-loading-screen { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at 50% 42%, var(--glow), transparent 36%), linear-gradient(145deg, #050608, var(--ink-raised) 58%, #08090b); opacity: 1; visibility: visible; transition: opacity .42s ease, visibility .42s step-end; }
.site-loading-screen::before, .site-loading-screen::after { position: absolute; inset: 7%; content: ""; border: 1px solid color-mix(in srgb, var(--accent) 22%, transparent); pointer-events: none; }
.site-loading-screen::after { inset: 10%; border-style: dashed; border-color: color-mix(in srgb, var(--paper) 10%, transparent); }
.site-loading-screen.is-dismissed { opacity: 0; visibility: hidden; pointer-events: none; }
.site-loading-brand { position: relative; display: grid; justify-items: center; text-align: center; text-transform: uppercase; }
.site-loading-brand img { width: clamp(150px, 28vw, 230px); height: auto; filter: drop-shadow(0 0 24px var(--glow)); animation: site-loader-glow 1.5s ease-in-out infinite; }
.site-loading-brand strong { margin-top: 18px; font: clamp(30px, 7vw, 54px)/.86 var(--display); letter-spacing: .04em; text-shadow: 0 0 18px rgba(255,255,255,.08); }
.site-loading-brand strong em { margin-left: .14em; color: var(--brand-accent); font-style: normal; }
.site-loading-brand span { margin-top: 11px; color: var(--brand-accent); font-size: clamp(7px, 1.5vw, 10px); font-weight: 900; letter-spacing: .32em; }

body::before {
  position: fixed;
  inset: 0;
  z-index: -3;
  content: "";
  opacity: .18;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
  pointer-events: none;
}

a { color: inherit; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.shell { width: var(--shell); margin-inline: auto; }
.is-hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; left: 16px; top: -80px; z-index: 100; background: var(--paper); color: var(--ink); padding: 12px 18px; border-radius: 4px; transition: top .2s; }
.skip-link:focus { top: 16px; }

.ambient { position: fixed; z-index: -2; border-radius: 999px; filter: blur(120px); pointer-events: none; opacity: .18; }
.ambient-a { width: 380px; height: 380px; background: var(--accent-hot); right: -190px; top: 34vh; }
.ambient-b { width: 300px; height: 300px; background: var(--accent-cool); left: -200px; top: 75vh; }

.site-header {
  width: min(1280px, calc(100vw - 32px));
  height: 78px;
  margin: 14px auto 0;
  padding: 0 14px 0 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 12px;
  z-index: 100;
  overflow: visible;
  border: 1px solid var(--header-border);
  border-bottom-color: var(--header-edge);
  background:
    radial-gradient(circle at 14% 140%, var(--header-a), transparent 30%),
    linear-gradient(100deg, rgba(6, 7, 11, .98), var(--header-b) 58%, rgba(7, 8, 12, .98));
  box-shadow: 0 18px 50px rgba(0, 0, 0, .5), 0 1px 18px rgba(230, 65, 33, .12);
  backdrop-filter: blur(22px);
}
.site-header::before {
  position: absolute;
  inset: -1px 16% auto;
  height: 1px;
  content: "";
  background: var(--header-trace);
  opacity: .74;
  filter: drop-shadow(0 0 7px var(--header-trace-glow));
}
.site-header::after {
  position: absolute;
  left: 18px;
  bottom: -4px;
  width: 86px;
  height: 7px;
  content: "";
  background: var(--header-tab);
  clip-path: polygon(0 0, 100% 0, 93% 45%, 54% 45%, 47% 100%, 0 100%);
  filter: drop-shadow(0 0 7px var(--header-tab-glow));
}
.brand { display: inline-flex; align-items: center; gap: 11px; min-width: 0; text-decoration: none; }
.brand-mark {
  width: 66px;
  height: 58px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  filter: drop-shadow(0 0 11px rgba(239, 74, 32, .35));
  transition: filter .25s, transform .25s;
}
.brand:hover .brand-mark { filter: drop-shadow(0 0 15px rgba(255, 111, 32, .58)); transform: translateY(-1px) scale(1.025); }
.brand-mark img { width: 100%; height: 100%; display: block; object-fit: contain; }
.brand-type { display: flex; flex-direction: column; justify-content: center; min-width: 0; line-height: 1; text-transform: uppercase; }
.brand-kicker { order: 1; margin-top: 5px; color: var(--brand-accent); font-size: 8px; font-weight: 900; letter-spacing: .29em; white-space: nowrap; }
.brand-type strong { font: 25px/.86 var(--display); letter-spacing: .035em; white-space: nowrap; text-shadow: 0 0 18px rgba(255, 255, 255, .08); }
.brand-type strong em { margin-left: .16em; color: var(--brand-accent); font-style: normal; text-shadow: 0 0 15px var(--glow); }
.header-show-status { margin-left: auto; margin-right: 12px; min-height: 30px; padding: 0 10px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid rgba(239,67,47,.28); color: #c7a8a0; background: rgba(239,67,47,.05); text-transform: uppercase; letter-spacing: .13em; font-size: 8px; font-weight: 900; white-space: nowrap; }
.header-show-status i { width: 7px; height: 7px; border-radius: 50%; background: #df4439; box-shadow: 0 0 0 4px rgba(223,68,57,.09), 0 0 9px rgba(223,68,57,.45); }
.header-show-status.is-live { border-color: rgba(116,225,104,.38); color: #d7f3c9; background: rgba(116,225,104,.06); }
.header-show-status.is-live i { background: #80df68; box-shadow: 0 0 0 4px rgba(128,223,104,.1), 0 0 11px rgba(128,223,104,.66); animation: pulse 1.6s infinite; }
.site-nav { display: flex; align-items: center; gap: 4px; }
.site-nav a, .footer-links a { text-decoration: none; text-transform: uppercase; letter-spacing: .14em; font-size: 11px; font-weight: 800; color: #d8d8d8; transition: color .2s, background .2s, border-color .2s; }
.site-nav a { min-width: 80px; padding: 11px 12px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; text-align: center; border: 1px solid transparent; }
.site-nav a:hover { color: var(--paper); border-color: color-mix(in srgb, var(--accent) 42%, transparent); background: color-mix(in srgb, var(--accent) 10%, transparent); }
.nav-icon { width: 16px; height: 16px; flex: 0 0 auto; fill: none; stroke: var(--accent); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 5px var(--glow)); transition: stroke .2s, filter .2s, transform .2s; }
.site-nav a:hover .nav-icon { stroke: #ffbd52; filter: drop-shadow(0 0 7px rgba(255, 109, 36, .55)); transform: translateY(-1px); }
.site-nav .nav-youtube { min-width: 126px; margin-left: 6px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-color: rgba(239, 73, 40, .48); background: linear-gradient(135deg, rgba(207, 35, 35, .18), rgba(232, 91, 30, .12)); color: #fff1e8; }
.nav-youtube .nav-icon-youtube { width: 17px; height: 17px; fill: #ff4d35; stroke: none; filter: drop-shadow(0 0 6px rgba(255, 64, 42, .42)); }
.site-nav .nav-youtube:hover .nav-icon-youtube { fill: #ff7652; stroke: none; }
.site-nav .nav-youtube:hover { border-color: #f16a32; background: linear-gradient(135deg, rgba(221, 37, 34, .38), rgba(235, 93, 27, .25)); }
.nav-external { color: #f7a241; font-size: 12px; }
.footer-links a:hover { color: var(--accent); }
.nav-toggle { display: none; width: 44px; height: 44px; border: 0; background: transparent; color: white; padding: 10px; }
.nav-toggle > span:not(.sr-only) { display: block; height: 2px; background: currentColor; margin: 5px 0; }

.hero { min-height: 690px; padding: 112px 0 72px; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; position: relative; }
.hero-copy { position: relative; z-index: 2; }
.eyebrow, .section-kicker { margin: 0 0 18px; color: var(--accent); font-size: 11px; font-weight: 850; letter-spacing: .24em; text-transform: uppercase; }
.eyebrow { display: flex; align-items: center; gap: 13px; }
.eyebrow-line { width: 38px; height: 2px; background: var(--accent-hot); box-shadow: 0 0 12px var(--accent-hot); }
.hero h1, .section-heading h2, .about-copy h2 {
  margin: 0;
  font-family: var(--display);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .015em;
  line-height: .91;
}
.hero h1 { max-width: 720px; font-size: clamp(66px, 8vw, 112px); }
.hero h1 em { font-style: normal; color: transparent; -webkit-text-stroke: 1.5px var(--paper); text-shadow: 0 0 36px var(--glow); }
.hero-summary { max-width: 570px; margin: 28px 0 0; color: #c0c3c9; font-size: clamp(16px, 1.7vw, 19px); }
.hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 34px; }
.button { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 18px; padding: 0 22px; text-decoration: none; text-transform: uppercase; letter-spacing: .13em; font-size: 11px; font-weight: 900; border: 1px solid transparent; transition: transform .2s, background .2s, color .2s, border-color .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { color: #100b07; background: var(--accent); box-shadow: 0 12px 36px color-mix(in srgb, var(--accent) 24%, transparent); }
.button-primary:hover { background: var(--paper); }
.button-outline { border-color: var(--line); }
.button-outline:hover { border-color: var(--accent); color: var(--accent); }
.text-link { color: var(--paper); text-decoration-color: color-mix(in srgb, var(--accent) 60%, transparent); text-underline-offset: 6px; font-size: 13px; font-weight: 750; }
.text-link:hover { color: var(--accent); }

.hero-emblem { min-height: 500px; position: relative; display: grid; place-items: center; transform: translateX(4%); }
.hero-wing { width: min(590px, 48vw); overflow: visible; filter: drop-shadow(0 28px 80px var(--glow)); animation: wing-breathe 5s ease-in-out infinite; }
.hero-wing-fill { fill: url(#wingFill); stroke: var(--accent-hot); stroke-width: 2; }
.hero-wing-cut { fill: var(--ink); stroke: var(--accent); stroke-width: 2; }
.hero-body { fill: var(--paper); filter: drop-shadow(0 0 13px rgba(255,255,255,.6)); }
.wing-lights { fill: var(--accent); }
.orbit { position: absolute; border: 1px solid var(--line); border-radius: 50%; }
.orbit-one { width: 490px; height: 490px; }
.orbit-two { width: 370px; height: 370px; border-style: dashed; animation: spin 28s linear infinite; }
.emblem-label { position: absolute; bottom: 33px; left: 50%; transform: translateX(-50%); text-align: center; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .28em; }
.hero-meta { position: absolute; bottom: 20px; left: 0; right: 0; padding-top: 19px; display: flex; justify-content: center; gap: 14px; border-top: 1px solid var(--line); color: #a3a7ae; text-transform: uppercase; font-size: 10px; font-weight: 750; letter-spacing: .15em; }

.section-kicker { display: flex; gap: 12px; align-items: center; }
.now-playing { padding: 18px 0 94px; }
.signal-card { min-height: 142px; position: relative; display: grid; grid-template-columns: 150px minmax(185px, .8fr) minmax(170px, .72fr) minmax(240px, 1.25fr); align-items: center; gap: 0; overflow: hidden; border: 1px solid rgba(240,154,50,.42); background: linear-gradient(110deg, rgba(83,42,13,.43), rgba(21,17,14,.96) 33%, rgba(12,15,17,.98)); box-shadow: 0 18px 45px rgba(0,0,0,.28), inset 0 1px rgba(255,255,255,.025); padding: 24px 30px; }
.signal-card::before { position: absolute; inset: 0; content: ""; pointer-events: none; background: radial-gradient(circle at 8% 50%, rgba(239,67,47,.13), transparent 20%), linear-gradient(90deg, transparent, rgba(240,154,50,.025), transparent); }
.signal-card::after { content: ""; position: absolute; inset: auto -8% -180% 35%; height: 320%; border: 1px solid rgba(240,154,50,.11); transform: rotate(-10deg); }
.signal-status-block { position: relative; z-index: 2; display: grid; justify-items: center; gap: 9px; color: #ff6658; text-transform: uppercase; letter-spacing: .13em; font: 26px/1 var(--display); text-shadow: 0 0 14px rgba(255,70,56,.38); }
.signal-beacon { position: relative; width: 28px; height: 32px; display: block; }
.signal-beacon::before { position: absolute; left: 50%; top: 0; width: 20px; height: 20px; content: ""; transform: translateX(-50%); border-radius: 50% 50% 43% 43%; background: #ff6256; box-shadow: 0 0 8px #ff493e, 0 0 22px rgba(255,65,51,.76); }
.signal-beacon::after { position: absolute; left: 50%; bottom: 0; width: 8px; height: 13px; content: ""; transform: translateX(-50%); border-radius: 1px 1px 3px 3px; background: linear-gradient(180deg, #ff7b68, #9a2827); }
.signal-beacon i { position: absolute; z-index: 1; left: 50%; top: 4px; width: 5px; height: 8px; transform: translateX(-50%); border-radius: 50%; background: #ffe5b4; box-shadow: 0 0 8px #fff3bc; }
.signal-card.is-live .signal-status-block { color: #9ce37f; text-shadow: 0 0 14px rgba(116,225,104,.35); }
.signal-card.is-live .signal-beacon::before { background: #82df6c; box-shadow: 0 0 8px #82df6c, 0 0 24px rgba(116,225,104,.78); animation: pulse 1.6s infinite; }
.status-station, .status-hours, .now-copy { position: relative; z-index: 2; min-height: 74px; padding: 0 26px; display: flex; flex-direction: column; justify-content: center; border-left: 1px solid rgba(255,255,255,.09); }
.status-station p, .status-hours p, .now-copy p { margin: 0 0 5px; color: #c7b997; font-size: 8px; font-weight: 900; letter-spacing: .2em; text-transform: uppercase; }
.status-station strong { color: #ffc65e; font: clamp(38px, 4vw, 54px)/.9 var(--display); letter-spacing: .04em; white-space: nowrap; text-shadow: 0 0 18px rgba(255,177,55,.16); }
.status-station small { font: 24px/1 var(--display); letter-spacing: .08em; }
.status-hours strong { color: #f4eedb; font: 700 18px/1.25 Georgia, serif; white-space: nowrap; }
.status-hours > span { margin-top: 5px; color: #858b8b; font-size: 9px; }
.now-copy > strong { margin-bottom: 4px; color: #f3eee4; font: 24px/1 var(--display); letter-spacing: .025em; text-transform: uppercase; }
.now-copy > span:not(.next-copy) { color: var(--muted); font-size: 11px; }
.now-copy.has-artwork { padding-left: 112px; }
.now-artwork { position: absolute; left: 24px; top: 50%; width: 70px; aspect-ratio: 1; transform: translateY(-50%); overflow: hidden; border: 1px solid rgba(240,154,50,.35); background: rgba(255,255,255,.04); box-shadow: 0 10px 26px rgba(0,0,0,.32); }
.now-artwork[hidden] { display: none; }
.now-artwork img { display: block; width: 100%; height: 100%; object-fit: cover; }
.next-copy { margin-top: 8px; color: #777f82; font-size: 8px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.next-copy b { margin-left: 5px; color: #c6cac6; font-size: 10px; letter-spacing: .02em; text-transform: none; }
.signal-bars { position: absolute; z-index: 2; right: 16px; bottom: 12px; height: 28px; display: flex; align-items: flex-end; gap: 3px; opacity: .25; }
.signal-bars i { display: block; width: 4px; height: 10px; background: var(--accent); animation: equalize 1s ease-in-out infinite alternate; }
.signal-bars i:nth-child(2) { height: 24px; animation-delay: -.3s; }.signal-bars i:nth-child(3) { height: 34px; animation-delay: -.7s; }.signal-bars i:nth-child(4) { height: 19px; animation-delay: -.2s; }.signal-bars i:nth-child(5) { height: 29px; animation-delay: -.55s; }

.songs-section { padding: 88px 0 130px; border-top: 1px solid var(--line); }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; }
.section-heading h2, .about-copy h2 { font-size: clamp(50px, 7vw, 83px); }
.section-heading > p { max-width: 380px; margin: 0 0 5px; color: var(--muted); }
.song-toolbar { margin: 42px 0 26px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.interaction-summary { margin: -14px 0 22px; color: #a6adab; text-align: right; text-transform: uppercase; letter-spacing: .1em; font-size: 8px; font-weight: 850; }
.location-help { margin: 0 0 22px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 17px 18px; border: 1px solid rgba(240,154,50,.42); background: rgba(240,154,50,.07); }
.location-help[hidden] { display: none; }
.location-help strong { display: block; color: #ffd18b; text-transform: uppercase; letter-spacing: .12em; font-size: 9px; }
.location-help p { margin: 5px 0 0; color: #c0c4bf; font-size: 11px; }
.location-help .button { flex: 0 0 auto; min-width: 155px; border-color: rgba(240,154,50,.52); color: #ffe2b3; background: rgba(240,154,50,.08); }
.search-box { width: min(470px, 100%); display: flex; align-items: center; gap: 13px; border-bottom: 1px solid var(--line); padding: 12px 0; }
.search-box:focus-within { border-color: var(--accent); }
.search-box svg { width: 20px; fill: none; stroke: var(--muted); stroke-width: 1.8; }
.search-box input { width: 100%; border: 0; outline: 0; color: var(--paper); background: transparent; }
.search-box input::placeholder { color: #777d86; }
.playlist-state { display: flex; align-items: center; justify-content: flex-end; gap: 14px; }
.playlist-status { min-height: 28px; padding: 0 10px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--line); color: #c6cbd2; text-transform: uppercase; letter-spacing: .12em; font-size: 9px; font-weight: 900; }
.playlist-status i { width: 7px; height: 7px; border-radius: 50%; background: #737981; box-shadow: 0 0 0 4px rgba(115, 121, 129, .1); }
.playlist-status.is-live { border-color: rgba(128, 218, 87, .38); color: #daf4c9; background: rgba(128, 218, 87, .06); }
.playlist-status.is-live i { background: #8dde64; box-shadow: 0 0 0 4px rgba(141, 222, 100, .12), 0 0 12px rgba(141, 222, 100, .7); animation: signal-live-pulse 1.8s ease-in-out infinite; }
.playlist-status.is-browse { border-color: rgba(240, 154, 50, .34); color: #efc990; background: rgba(240, 154, 50, .05); }
.playlist-status.is-browse i { background: var(--accent); box-shadow: 0 0 9px rgba(240, 154, 50, .48); }
.playlist-status.is-offline { color: #9298a1; }
.song-count { color: var(--muted); text-transform: uppercase; letter-spacing: .16em; font-size: 10px; font-weight: 800; }
.song-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 28px; align-items: start; }
.song-layout.is-browse-only { grid-template-columns: 1fr; }
.song-browser { min-width: 0; }
.playlist-view-switch { display: flex; justify-content: flex-end; gap: 6px; margin: 0 0 12px; }
.playlist-view-button { min-height: 36px; display: inline-flex; align-items: center; gap: 8px; padding: 0 13px; border: 1px solid var(--line); background: rgba(5,7,10,.5); color: #8f959d; cursor: pointer; text-transform: uppercase; letter-spacing: .12em; font-size: 8px; font-weight: 850; transition: color .2s, border-color .2s, background .2s; }
.playlist-view-button svg { width: 14px; fill: none; stroke: currentColor; stroke-width: 1.7; }
.playlist-view-button:hover, .playlist-view-button.is-active { border-color: rgba(240,154,50,.5); background: rgba(240,154,50,.08); color: #ffd18b; }

.song-stage { position: relative; min-width: 0; height: 548px; overflow: hidden; border: 1px solid rgba(240,154,50,.16); background: radial-gradient(circle at 50% 42%, rgba(239,67,47,.12), transparent 29%), radial-gradient(ellipse at 50% 100%, rgba(146,60,255,.12), transparent 48%), linear-gradient(180deg, rgba(8,10,13,.5), rgba(5,7,9,.85)); perspective: 1150px; touch-action: pan-y; user-select: none; }
.song-stage::before { position: absolute; inset: 0; content: ""; pointer-events: none; background: linear-gradient(90deg, rgba(6,8,10,.92), transparent 15% 85%, rgba(6,8,10,.92)), radial-gradient(ellipse at 50% 92%, rgba(240,154,50,.12), transparent 42%); }
.song-stage::after { position: absolute; left: 14%; right: 14%; bottom: 25px; height: 38px; content: ""; pointer-events: none; border-radius: 50%; background: rgba(0,0,0,.8); filter: blur(18px); }
.song-stage.is-dragging { cursor: grabbing; }
.song-stage.is-grid-view { height: auto; min-height: 340px; overflow: visible; border: 0; background: transparent; perspective: none; user-select: auto; }
.song-stage.is-grid-view::before, .song-stage.is-grid-view::after { display: none; }

.song-grid.is-browse-view { position: relative; z-index: 1; height: 100%; }
.song-grid.is-browse-view .empty-state { position: absolute; inset: 0; }
.song-grid.is-grid-view { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.song-category-heading { grid-column: 1 / -1; margin: 24px 0 0; padding: 0 0 9px; border-bottom: 1px solid rgba(240,154,50,.3); color: #f0c981; font: 18px/1.1 Georgia, serif; }

.song-card { border: 1px solid rgba(255,255,255,.12); background: linear-gradient(155deg, rgba(25,24,25,.98), rgba(8,10,13,.98)); box-shadow: 0 20px 48px rgba(0,0,0,.45); transition: transform .32s cubic-bezier(.2,.75,.2,1), opacity .28s ease, border-color .24s, filter .28s, box-shadow .28s; }
.song-card.is-playing { border-color: rgba(128,218,87,.7); box-shadow: 0 20px 48px rgba(0,0,0,.45), 0 0 24px rgba(128,218,87,.12); }
.song-card.is-queued { border-color: rgba(240,154,50,.58); }
.song-card.is-unavailable { filter: saturate(.55); }

.song-grid.is-browse-view .song-card { position: absolute; top: 50%; left: 50%; width: clamp(224px, 27vw, 284px); padding: 9px; cursor: pointer; opacity: .72; filter: brightness(.58) saturate(.72); transform-style: preserve-3d; }
.song-grid.is-browse-view .song-card[data-deck-position="0"] { z-index: 5; opacity: 1; cursor: default; filter: none; transform: translate(-50%, -50%) scale(1); border-color: rgba(240,154,50,.8); box-shadow: 0 28px 75px rgba(0,0,0,.72), 0 0 32px rgba(240,111,39,.17); }
.song-grid.is-browse-view .song-card[data-deck-position="-1"] { z-index: 4; transform: translate(-136%, -50%) rotateY(24deg) scale(.84); }
.song-grid.is-browse-view .song-card[data-deck-position="1"] { z-index: 4; transform: translate(36%, -50%) rotateY(-24deg) scale(.84); }
.song-grid.is-browse-view .song-card[data-deck-position="-2"] { z-index: 3; opacity: .4; transform: translate(-202%, -50%) rotateY(33deg) scale(.68); }
.song-grid.is-browse-view .song-card[data-deck-position="2"] { z-index: 3; opacity: .4; transform: translate(102%, -50%) rotateY(-33deg) scale(.68); }
.song-grid.is-browse-view .song-card[data-deck-position="outside"] { opacity: 0; pointer-events: none; transform: translate(-50%, -50%) scale(.55); }
.song-grid.is-browse-view .song-card:not(.is-active):hover { opacity: .92; filter: brightness(.82) saturate(.9); border-color: rgba(240,154,50,.5); }

.song-poster { position: relative; width: 100%; aspect-ratio: 4 / 5.15; overflow: hidden; background: #111; }
.song-poster::after { position: absolute; inset: 0; content: ""; pointer-events: none; border: 1px solid rgba(255,255,255,.12); box-shadow: inset 0 0 60px rgba(0,0,0,.48); }
.song-poster-generated { background: radial-gradient(circle at var(--poster-flare-x) var(--poster-flare-y), color-mix(in srgb, var(--poster-glow) 82%, white) 0 2%, var(--poster-glow) 3%, transparent 19%), conic-gradient(from var(--poster-angle) at 52% 42%, var(--poster-hot), var(--poster-cool), var(--poster-ink), var(--poster-hot)); }
.song-poster-generated::before { position: absolute; inset: -35%; content: ""; background: repeating-radial-gradient(ellipse at center, transparent 0 18px, rgba(255,255,255,.075) 19px 20px, transparent 21px 38px); transform: rotate(var(--poster-angle)); opacity: .58; }
.song-poster-crest { position: absolute; z-index: 3; top: 15%; left: 50%; width: 43%; height: auto; transform: translateX(-50%); filter: drop-shadow(0 0 22px var(--poster-glow)); }
.song-poster-brand { position: absolute; z-index: 4; top: 6%; left: 8%; right: 8%; color: rgba(255,255,255,.78); text-align: center; text-transform: uppercase; letter-spacing: .28em; font-size: 6px; font-weight: 900; }
.song-poster-wings { position: absolute; z-index: 2; top: 21%; left: 50%; width: 84%; height: 38%; transform: translateX(-50%); }
.song-poster-wings::before, .song-poster-wings::after { position: absolute; top: 0; width: 48%; height: 100%; content: ""; border: 1px solid color-mix(in srgb, var(--poster-glow) 68%, white); border-radius: 80% 12% 76% 18%; opacity: .63; filter: drop-shadow(0 0 8px var(--poster-glow)); }
.song-poster-wings::before { left: 1%; transform: skewY(-13deg) rotate(-18deg); }
.song-poster-wings::after { right: 1%; transform: scaleX(-1) skewY(-13deg) rotate(-18deg); }
.song-poster-generated.motif-1 .song-poster-wings { transform: translateX(-50%) rotate(12deg) scale(.92); }
.song-poster-generated.motif-2 .song-poster-wings { transform: translateX(-50%) rotate(-10deg) scale(1.06); }
.song-poster-copy { position: absolute; z-index: 4; left: 8%; right: 8%; bottom: 7%; display: grid; gap: 7px; text-align: center; text-transform: uppercase; }
.song-poster-copy::before { width: 42px; height: 2px; margin: 0 auto 3px; content: ""; background: var(--poster-glow); box-shadow: 0 0 12px var(--poster-glow); }
.song-poster-copy strong { display: -webkit-box; overflow: hidden; color: #fff5df; font: clamp(18px, 2.4vw, 26px)/.92 var(--display); letter-spacing: .025em; text-wrap: balance; text-shadow: 0 2px 14px rgba(0,0,0,.75); -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
.song-poster-copy small { overflow: hidden; color: rgba(255,255,255,.7); font-size: 7px; font-weight: 750; letter-spacing: .12em; text-overflow: ellipsis; white-space: nowrap; }
.song-poster-custom { background: #08090c; }
.song-poster-image { width: 100%; height: 100%; display: block; object-fit: cover; }
.song-poster-custom-badge { position: absolute; z-index: 2; top: 9px; left: 9px; padding: 5px 7px; border: 1px solid rgba(255,255,255,.28); color: white; background: rgba(6,7,9,.72); text-transform: uppercase; letter-spacing: .16em; font-size: 6px; font-weight: 900; backdrop-filter: blur(8px); }

.song-info { min-width: 0; padding: 13px 5px 10px; text-align: center; }
.song-info h3 { margin: 0; font-size: 15px; line-height: 1.22; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.song-info p { margin: 5px 0 0; color: var(--muted); font-size: 10px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.song-info small { display: block; margin-top: 8px; color: var(--accent); text-transform: uppercase; letter-spacing: .12em; font-size: 7px; font-weight: 850; }
.song-info .song-availability { display: block; margin-top: 5px; color: #f2b56f; font-size: 9px; font-weight: 750; }
.song-action { width: 100%; min-height: 42px; display: flex; align-items: center; justify-content: center; gap: 9px; border: 1px solid rgba(240,154,50,.42); background: rgba(240,154,50,.06); color: #ffe0ae; cursor: pointer; text-transform: uppercase; letter-spacing: .12em; font-size: 8px; font-weight: 900; transition: background .2s, color .2s, border-color .2s; }
.song-action:hover:not(:disabled) { border-color: var(--accent); background: var(--accent); color: var(--ink); }
.song-action:disabled { cursor: not-allowed; opacity: .34; }
.song-action svg { width: 16px; fill: none; stroke: currentColor; stroke-width: 2; }

.song-grid.is-grid-view .song-card { min-height: 144px; display: grid; grid-template-columns: 104px minmax(0,1fr); gap: 15px; align-items: center; padding: 12px; box-shadow: 0 12px 28px rgba(0,0,0,.28); }
.song-grid.is-grid-view .song-card:hover { border-color: rgba(240,154,50,.48); background: rgba(255,255,255,.045); transform: translateY(-2px); }
.song-grid.is-grid-view .song-poster { grid-row: 1 / 3; width: 104px; }
.song-grid.is-grid-view .song-poster-copy strong { font-size: 14px; }
.song-grid.is-grid-view .song-info { align-self: end; padding: 0; text-align: left; }
.song-grid.is-grid-view .song-action { align-self: start; width: fit-content; min-width: 44px; padding: 0 12px; }

.song-deck-controls { min-height: 64px; display: flex; align-items: center; justify-content: center; gap: 24px; }
.song-deck-controls[hidden], .song-deck-hint[hidden] { display: none; }
.song-deck-controls button { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid rgba(240,154,50,.4); border-radius: 50%; background: radial-gradient(circle at 35% 25%, rgba(240,154,50,.22), rgba(20,15,12,.9)); color: #ffd28f; cursor: pointer; transition: transform .2s, border-color .2s, opacity .2s; }
.song-deck-controls button:hover:not(:disabled) { border-color: var(--accent); transform: translateY(-2px); }
.song-deck-controls button:disabled { cursor: default; opacity: .25; }
.song-deck-controls svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.song-deck-controls strong { min-width: 60px; color: #efe1c9; text-align: center; font-size: 11px; letter-spacing: .18em; }
.song-deck-hint { margin: -2px 0 0; color: #858b93; text-align: center; font-size: 9px; }
.queue-panel { position: sticky; top: 20px; border-top: 3px solid var(--accent-hot); background: var(--ink-soft); padding: 24px; }
.queue-panel[hidden] { display: none; }
.queue-heading { display: flex; justify-content: space-between; color: var(--accent); text-transform: uppercase; letter-spacing: .16em; font-size: 9px; font-weight: 850; }
.queue-heading strong { min-width: 23px; height: 23px; display: grid; place-items: center; border: 1px solid var(--line); color: var(--paper); }
.queue-panel h3 { margin: 10px 0 22px; font-size: 22px; }
.queue-panel ol { list-style: none; padding: 0; margin: 0; counter-reset: queue; }
.queue-panel li { counter-increment: queue; position: relative; padding: 14px 0 14px 32px; border-top: 1px solid var(--line); font-size: 12px; }
.queue-panel li::before { content: counter(queue, decimal-leading-zero); position: absolute; left: 0; color: var(--muted); font-size: 9px; font-weight: 800; }
.queue-panel li span { display: block; color: var(--muted); margin-top: 2px; font-size: 10px; }
.queue-panel .queue-empty { color: var(--muted); padding-left: 0; }
.queue-panel .queue-empty::before { display: none; }
.empty-state { min-height: 320px; grid-column: 1 / -1; display: grid; place-items: center; align-content: center; text-align: center; border: 1px dashed var(--line); padding: 48px 24px; }
.empty-state h3 { margin: 18px 0 4px; font-size: 24px; }.empty-state p { color: var(--muted); margin: 0; max-width: 430px; }
.loading-butterfly { width: 92px; height: auto; filter: drop-shadow(0 0 12px rgba(239,74,32,.45)); animation: loading-butterfly 1.35s ease-in-out infinite; }

.visit-section {
  position: relative;
  padding: 112px 0 100px;
  overflow: hidden;
  background:
    radial-gradient(circle at 79% 22%, rgba(211, 117, 45, .09), transparent 31rem),
    linear-gradient(180deg, #070b08, #040806 68%, #080b08);
  color: var(--paper);
}
.visit-section::before { position: absolute; inset: 0; content: ""; opacity: .18; pointer-events: none; background: repeating-linear-gradient(90deg, transparent 0 98px, rgba(240,154,50,.03) 99px 100px); }
:root[data-season="halloween"] .visit-section { background: transparent; }
:root[data-season="halloween"] .visit-section::before { display: none; }
.visit-intro { position: relative; z-index: 2; margin-bottom: 38px; text-align: center; }
.visit-intro .section-kicker { justify-content: center; }
.visit-intro h2 { margin: 10px 0 8px; color: #eaff58; font: clamp(58px, 8vw, 102px)/.9 var(--display); letter-spacing: .025em; text-shadow: 0 0 26px rgba(201, 255, 55, .18); }
.visit-intro p { margin: 0 auto; max-width: 620px; color: #e5e1d1; font-family: Georgia, serif; font-size: clamp(14px, 1.5vw, 18px); }
.visit-intro strong { color: #f7f0c2; }

.visit-night {
  position: relative;
  height: clamp(630px, 61vw, 760px);
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(194, 221, 75, .28);
  background: #030805;
  box-shadow: 0 32px 100px rgba(0,0,0,.68), inset 0 0 120px rgba(0,0,0,.5);
}
.visit-night::after { position: absolute; z-index: 11; inset: 0; content: ""; pointer-events: none; background: radial-gradient(ellipse at center, transparent 34%, rgba(0,0,0,.58) 110%); }
.visit-live-scene { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .65s ease, visibility .65s; }
.visit-night.is-show-live .visit-live-scene { opacity: 1; visibility: visible; }
.visit-closed-scene { position: absolute; z-index: 12; inset: 0; display: grid; place-items: center; padding: clamp(24px, 5vw, 72px); background: linear-gradient(180deg, rgba(2,6,5,.04), rgba(2,5,4,.3)), var(--visit-closed-image, url('./assets/admiral-gates-closed-v1.jpg')) center / cover no-repeat; transition: opacity .5s ease, visibility .5s; }
.visit-closed-scene[hidden] { display: none; }
.closed-sign { width: min(540px, 78%); padding: clamp(20px, 3.3vw, 38px); border: 1px solid rgba(213,232,110,.5); outline: 1px solid rgba(10,15,10,.85); outline-offset: -7px; color: #f5f0d6; background: linear-gradient(145deg, rgba(9,16,11,.95), rgba(20,24,15,.93)); box-shadow: 0 18px 65px rgba(0,0,0,.72), inset 0 0 42px rgba(198,224,78,.035); text-align: center; }
.closed-sign-kicker { display: block; margin-bottom: 12px; color: #aeb97a; font-size: 8px; font-weight: 900; letter-spacing: .28em; text-transform: uppercase; }
.closed-sign h3 { margin: 0; color: #f4eed5; font: 700 clamp(29px, 4vw, 47px)/.98 Georgia, serif; }
.closed-sign h3 span { display: block; margin-top: 8px; color: #d9ef62; font-size: .72em; font-style: italic; font-weight: 500; }
.closed-sign-details { margin: 23px 0 17px; padding: 17px 0; display: grid; grid-template-columns: 1fr 1fr; border-block: 1px solid rgba(213,232,110,.2); }
.closed-sign-details > div { display: grid; gap: 5px; padding-inline: 14px; }
.closed-sign-details > div + div { border-left: 1px solid rgba(213,232,110,.2); }
.closed-sign-details small { color: #8f9874; font-size: 7px; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.closed-sign-details strong { color: #f0dba5; font: 700 clamp(12px, 1.4vw, 17px)/1.25 Georgia, serif; }
.closed-sign p { margin: 0; color: #b9bca7; font-size: 10px; }
.visit-sky { position: absolute; z-index: 0; inset: 0 0 42%; background: radial-gradient(circle at 80% 15%, rgba(224,176,102,.12), transparent 18%), linear-gradient(180deg, #07100f, #06100a 68%, transparent); }
.visit-moon { position: absolute; top: 5%; right: 8%; width: clamp(74px, 11vw, 138px); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 37% 32%, #fff8c6 0 7%, #e1bf79 8% 13%, transparent 14%), radial-gradient(circle at 63% 61%, rgba(81,59,43,.23) 0 10%, transparent 11%), #d8ad68; box-shadow: 0 0 48px rgba(223,179,104,.32); opacity: .82; }
.visit-bat { position: absolute; color: #030304; font: 900 40px/1 var(--sans); transform: rotate(8deg); filter: drop-shadow(0 0 1px rgba(255,255,255,.28)); }
.bat-one { top: 12%; left: 14%; animation: bat-hover 6.2s ease-in-out infinite; }
.bat-two { top: 21%; right: 31%; font-size: 27px; animation: bat-hover 7.8s ease-in-out infinite -3s; }

.visit-house { position: absolute; z-index: 2; inset: 5% 3% 31%; background: linear-gradient(180deg, rgba(2,6,5,.18), rgba(2,7,4,.48)), var(--visit-live-image, url('./assets/hero-house-halloween.jpg')) center 56% / cover no-repeat; filter: brightness(.48) saturate(.84) contrast(1.08); -webkit-mask-image: linear-gradient(180deg, #000 0 82%, transparent 100%); mask-image: linear-gradient(180deg, #000 0 82%, transparent 100%); }
.visit-house::after { position: absolute; inset: 0; content: ""; background: linear-gradient(180deg, rgba(0,0,0,.02), rgba(3,10,5,.24)), radial-gradient(ellipse at 50% 95%, rgba(152,255,67,.08), transparent 35%); }
.house-light { position: absolute; z-index: 2; width: clamp(5px, .75vw, 9px); aspect-ratio: 1; border-radius: 50%; background: #a8ff36; box-shadow: 0 0 5px #b8ff4d, 0 0 14px #8cff2e, 0 0 30px rgba(137,255,42,.7); animation: house-shimmer 2.4s ease-in-out infinite; }
.house-light:nth-child(2n) { background: #9e59ff; box-shadow: 0 0 5px #c495ff, 0 0 15px #863cff, 0 0 28px rgba(131,56,255,.68); animation-delay: -.8s; }
.house-light:nth-child(3n) { background: #ff8b22; box-shadow: 0 0 5px #ffc456, 0 0 15px #ff6d1d, 0 0 28px rgba(255,100,28,.7); animation-delay: -1.5s; }
.light-one { left: 24%; top: 49%; }.light-two { left: 32%; top: 36%; }.light-three { left: 41%; top: 58%; }
.light-four { left: 50%; top: 45%; }.light-five { left: 59%; top: 61%; }.light-six { left: 68%; top: 38%; }
.light-seven { left: 75%; top: 55%; }.light-eight { left: 47%; top: 27%; }.light-nine { left: 55%; top: 32%; }

.visit-ghost { position: absolute; z-index: 5; width: clamp(82px, 9vw, 124px); opacity: .9; pointer-events: none; filter: drop-shadow(0 0 14px rgba(203,255,234,.42)) drop-shadow(0 0 28px rgba(157,120,255,.18)); }
.visit-ghost-one { left: 7%; top: 32%; animation: visit-ghost-drift 8.5s ease-in-out infinite; }
.visit-ghost-two { right: 9%; top: 27%; width: clamp(72px, 8vw, 108px); animation: visit-ghost-drift 10.5s ease-in-out infinite -4.2s; }
.visit-ghost-three { left: 55%; top: 40%; width: clamp(60px, 6.3vw, 86px); animation: visit-ghost-drift 9.4s ease-in-out infinite -6.1s; }

.visit-roadway { position: absolute; z-index: 6; left: -5%; right: -5%; bottom: 0; height: 216px; overflow: hidden; transform: perspective(700px) rotateX(3deg); transform-origin: 50% 100%; border-top: 2px solid rgba(205,201,174,.25); border-bottom: 2px solid rgba(5,6,6,.92); background: radial-gradient(circle at 18% 31%, rgba(255,255,255,.08) 0 .7px, transparent 1.5px) 0 0 / 17px 14px, radial-gradient(circle at 72% 68%, rgba(0,0,0,.42) 0 1px, transparent 1.8px) 5px 4px / 23px 19px, linear-gradient(90deg, transparent 0 10%, rgba(0,0,0,.08) 24% 36%, transparent 48% 62%, rgba(255,255,255,.025) 79%, transparent 100%), linear-gradient(180deg, #242827 0%, #191d1c 49%, #121514 100%); box-shadow: 0 -13px 28px rgba(0,0,0,.42), inset 0 10px 22px rgba(255,255,255,.018), inset 0 -16px 24px rgba(0,0,0,.3); }
.visit-roadway::before { position: absolute; z-index: 0; inset: 0; content: ""; background: linear-gradient(180deg, transparent 7%, rgba(0,0,0,.16) 20%, transparent 34%, transparent 62%, rgba(0,0,0,.2) 78%, transparent 92%), repeating-linear-gradient(97deg, transparent 0 76px, rgba(255,255,255,.016) 77px 78px, transparent 79px 143px); mix-blend-mode: multiply; pointer-events: none; }
.visit-roadway::after { position: absolute; z-index: 3; inset: 9px 0; content: ""; border-top: 2px solid rgba(202,195,155,.24); border-bottom: 2px solid rgba(202,195,155,.2); pointer-events: none; }
.traffic-lane { position: absolute; z-index: 2; left: 0; right: 0; height: 50%; }
.traffic-lane-top { top: 0; }.traffic-lane-bottom { bottom: 0; }
.road-center-line { position: absolute; z-index: 1; top: 50%; left: 0; right: 0; height: 4px; transform: translateY(-50%); opacity: .72; background: repeating-linear-gradient(90deg, transparent 0 4.5%, #c9bd79 4.7% 10.5%, transparent 10.7% 15.2%); box-shadow: 0 1px 0 rgba(0,0,0,.52), 0 0 5px rgba(212,199,126,.08); }
.visit-car { position: absolute; left: -16%; width: clamp(82px, 9vw, 116px); height: 42px; bottom: 21px; border-radius: 23px 28px 10px 10px; background: #525b38; border: 1px solid rgba(255,255,255,.16); box-shadow: 0 8px 12px rgba(0,0,0,.7); will-change: left, opacity; }
.visit-car::before { position: absolute; left: 22%; top: -16px; width: 48%; height: 20px; content: ""; border-radius: 30px 30px 3px 3px; background: inherit; clip-path: polygon(14% 100%, 27% 8%, 72% 0, 96% 100%); }
.visit-car::after { position: absolute; right: -4px; top: 13px; width: 8px; height: 8px; content: ""; border-radius: 50%; background: #fff3b0; box-shadow: 12px 1px 18px 9px rgba(255,238,154,.34); }
.visit-car i, .visit-car b { position: absolute; bottom: -8px; width: 19px; height: 19px; border: 5px solid #090b0b; border-radius: 50%; background: #939792; }
.visit-car i { left: 15px; }.visit-car b { right: 15px; }
.visit-car span { position: absolute; left: 34%; top: -11px; width: 29%; height: 14px; clip-path: polygon(11% 100%, 22% 0, 85% 0, 100% 100%); background: linear-gradient(135deg, #748382, #1d2728); }
.car-plum { background: #75405c; }.car-green { background: #4e5d32; }.car-slate { background: #526064; }
.car-watch { opacity: 0; }
.car-through { bottom: 18px; opacity: 0; transform: scale(.84) scaleX(-1); }

.pumpkin-row { position: absolute; z-index: 8; left: 0; right: 0; height: 82px; pointer-events: none; }
.pumpkin-prop { position: absolute; left: var(--pumpkin-x, 50%); bottom: var(--pumpkin-y, 0); width: clamp(48px, 5.2vw, 74px); display: block; transform: translateX(-50%) rotate(var(--pumpkin-tilt, 0deg)) scale(var(--pumpkin-scale, 1)); transform-origin: 50% 100%; }
.pumpkin-prop img { width: 100%; height: auto; display: block; filter: drop-shadow(0 5px 5px rgba(0,0,0,.68)) drop-shadow(0 0 7px rgba(255,117,22,.28)); }
.pumpkin-prop::after { position: absolute; inset: 0; content: ""; background: #ffd56a; mix-blend-mode: screen; opacity: .3; filter: brightness(.95) drop-shadow(0 0 2px rgba(255,133,22,.55)); -webkit-mask: url('./assets/pumpkin-carving-mask.svg') center / 100% 100% no-repeat; mask: url('./assets/pumpkin-carving-mask.svg') center / 100% 100% no-repeat; animation: pumpkin-carving-pulse 3.1s ease-in-out infinite; }
.pumpkin-prop:nth-child(2n) { width: clamp(43px, 4.6vw, 65px); }.pumpkin-prop:nth-child(2n)::after { animation-delay: -1.1s; }.pumpkin-prop:nth-child(3n)::after { animation-delay: -2s; }
.pumpkin-row-back { bottom: 190px; }.pumpkin-row-back .pumpkin-prop { width: clamp(42px, 4.6vw, 64px); }.pumpkin-row-front { bottom: -5px; }

.visit-details { position: relative; z-index: 40; min-height: 84px; margin-top: 12px; display: grid; grid-template-columns: 1fr 1fr auto; align-items: center; gap: 24px; padding: 13px 15px 13px 24px; border: 1px solid rgba(193,216,85,.28); background: #050b07; box-shadow: 0 15px 38px rgba(0,0,0,.38); }
.visit-detail { display: grid; gap: 2px; }.visit-detail span { color: #959b88; font-size: 8px; font-weight: 900; letter-spacing: .2em; text-transform: uppercase; }.visit-detail strong { color: #f4f0ce; font: 700 15px/1.25 Georgia, serif; white-space: nowrap; }
.visit-details .button { min-height: 48px; padding-inline: 20px; white-space: nowrap; }
.visit-guide { position: relative; z-index: 2; margin-top: 34px; padding: 30px; border: 1px solid rgba(194,221,75,.22); background: linear-gradient(145deg, rgba(18,23,16,.96), rgba(8,12,9,.96)); box-shadow: 0 26px 65px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.025); }
.visit-guide-heading { display: flex; justify-content: space-between; align-items: end; gap: 48px; margin-bottom: 22px; padding-bottom: 21px; border-bottom: 1px solid rgba(255,255,255,.08); }
.visit-guide-heading span, .pulsemesh-copy > span { color: #a8b273; text-transform: uppercase; letter-spacing: .2em; font-size: 8px; font-weight: 900; }
.visit-guide-heading h3, .pulsemesh-copy h3 { margin: 6px 0 0; color: #f2eedc; font: 700 22px/1.12 Georgia, serif; }
.visit-guide-heading p { max-width: 440px; margin: 0; color: #8f978e; font-size: 12px; line-height: 1.55; text-align: right; }
.courtesy-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.courtesy-card { min-height: 174px; position: relative; overflow: hidden; display: grid; grid-template-columns: 78px 1fr; gap: 18px; align-items: center; padding: 22px 20px; border: 1px solid rgba(255,255,255,.075); background: linear-gradient(135deg, rgba(255,255,255,.035), rgba(255,255,255,.012)); transition: transform .25s, border-color .25s, background .25s; }
.courtesy-card::after { position: absolute; right: -35px; bottom: -45px; width: 100px; height: 100px; content: ""; border: 1px solid rgba(190,223,79,.08); transform: rotate(28deg); }
.courtesy-card:hover { transform: translateY(-3px); border-color: rgba(194,221,75,.29); background: linear-gradient(135deg, rgba(194,221,75,.055), rgba(255,255,255,.014)); }
.courtesy-icon { width: 78px; aspect-ratio: 1.15; display: grid; place-items: center; border: 1px solid rgba(151,84,205,.28); background: radial-gradient(circle at 50% 50%, rgba(147,66,210,.12), transparent 70%); }
.courtesy-icon svg { width: 68px; height: 54px; overflow: visible; fill: none; stroke: #b077d5; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 6px rgba(157,76,218,.28)); }
.courtesy-icon .icon-dash, .courtesy-icon .icon-light, .courtesy-icon .icon-spark, .courtesy-icon .icon-wave { stroke: #d5f052; }
.courtesy-icon .icon-window, .courtesy-icon .icon-wheel, .courtesy-icon .icon-dial { fill: rgba(196,222,84,.14); stroke: #d5f052; }
.courtesy-card strong { color: #f1eddf; font-size: 13px; letter-spacing: .015em; }
.courtesy-card p { margin: 6px 0 0; color: #949b96; font-size: 11px; line-height: 1.55; }

.pulsemesh-card { min-height: 136px; margin-top: 12px; display: grid; grid-template-columns: 86px minmax(0, 1fr) auto; grid-template-rows: 1fr auto; align-items: center; gap: 8px 22px; padding: 22px 24px; border: 1px solid rgba(145,76,195,.32); background: radial-gradient(circle at 7% 50%, rgba(151,67,212,.13), transparent 18%), linear-gradient(120deg, rgba(22,14,27,.96), rgba(9,13,10,.98) 58%); box-shadow: inset 0 1px rgba(255,255,255,.025); transition: border-color .3s, box-shadow .3s; }
.pulsemesh-card.is-live { border-color: rgba(204,235,82,.47); box-shadow: inset 0 1px rgba(255,255,255,.025), 0 0 30px rgba(186,223,67,.055); }
.pulsemesh-mark { grid-row: 1 / -1; width: 74px; height: 58px; display: flex; align-items: center; justify-content: center; gap: 4px; border: 1px solid rgba(157,85,207,.25); background: rgba(131,52,190,.07); }
.pulsemesh-mark span { width: 5px; border-radius: 4px; background: linear-gradient(180deg, #d5f052, #9250c3); box-shadow: 0 0 8px rgba(193,231,76,.2); animation: pulsemesh-wave 1.2s ease-in-out infinite alternate; }
.pulsemesh-mark span:nth-child(1), .pulsemesh-mark span:nth-child(5) { height: 14px; animation-delay: -.7s; }.pulsemesh-mark span:nth-child(2), .pulsemesh-mark span:nth-child(4) { height: 29px; animation-delay: -.35s; }.pulsemesh-mark span:nth-child(3) { height: 43px; }
.pulsemesh-copy p { margin: 5px 0 0; color: #a7aca7; font-size: 12px; }
.pulsemesh-link { min-width: 205px; min-height: 50px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(159,88,209,.38); color: #9b9b87; background: rgba(255,255,255,.025); text-decoration: none; text-transform: uppercase; letter-spacing: .07em; font-size: 10px; font-weight: 900; transition: color .2s, border-color .2s, background .2s, transform .2s; }
.pulsemesh-link[aria-disabled="true"] { cursor: not-allowed; opacity: .66; }
.pulsemesh-link.is-live { border-color: rgba(204,235,82,.62); color: #efffa3; background: rgba(194,225,73,.09); }
.pulsemesh-link.is-live:hover { transform: translateY(-2px); background: rgba(194,225,73,.15); }
.pulsemesh-note { grid-column: 2 / -1; margin: 0; padding-top: 11px; border-top: 1px solid rgba(255,255,255,.07); color: #747c76; font-size: 9px; }
.pulsemesh-link, .pulsemesh-dialog button, .pulsemesh-dock button { font: inherit; cursor: pointer; }
.pulsemesh-dialog { width: min(940px, calc(100vw - 32px)); height: min(760px, calc(100dvh - 32px)); margin: auto; padding: 0; overflow: hidden; border: 1px solid rgba(198,232,77,.55); color: #f2eedc; background: #090c0a; box-shadow: 0 28px 100px rgba(0,0,0,.8), 0 0 42px rgba(145,76,195,.16); }
.pulsemesh-dialog::backdrop { background: rgba(3,4,3,.82); backdrop-filter: blur(6px); }
.pulsemesh-dialog[open] { display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto; }
.pulsemesh-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 18px 20px; border-bottom: 1px solid rgba(255,255,255,.09); background: linear-gradient(110deg, rgba(117,43,164,.16), rgba(189,222,70,.06)); }
.pulsemesh-dialog-header span { color: #a8b273; text-transform: uppercase; letter-spacing: .18em; font-size: 8px; font-weight: 900; }
.pulsemesh-dialog-header h2 { margin: 4px 0 0; color: #f2eedc; font: 700 25px/1.05 Georgia, serif; }
.pulsemesh-dialog-actions { display: flex; gap: 8px; }
.pulsemesh-dialog-actions button, .pulsemesh-dock button { min-height: 38px; padding: 0 13px; border: 1px solid rgba(159,88,209,.38); color: #e7e1cd; background: rgba(255,255,255,.04); text-transform: uppercase; letter-spacing: .08em; font-size: 9px; font-weight: 900; }
.pulsemesh-dialog-actions button:hover, .pulsemesh-dock button:hover { border-color: rgba(204,235,82,.62); color: #efffa3; }
.pulsemesh-dialog-instructions { margin: 0; padding: 10px 20px; color: #adb3ad; background: #0d110e; font-size: 11px; line-height: 1.45; }
.pulsemesh-frame-slot { min-height: 0; background: #111; }
.pulsemesh-frame-slot iframe { display: block; width: 100%; height: 100%; min-height: 420px; border: 0; background: #fff; }
.pulsemesh-dialog-footer { display: flex; justify-content: space-between; gap: 20px; padding: 10px 20px; border-top: 1px solid rgba(255,255,255,.09); color: #7f877f; background: #090c0a; font-size: 9px; }
.pulsemesh-dialog-footer a { color: #d9ec7d; }
.pulsemesh-dock { position: fixed; z-index: 90; right: 20px; bottom: 20px; display: flex; align-items: center; gap: 10px; padding: 10px; border: 1px solid rgba(204,235,82,.52); color: #f2eedc; background: rgba(9,12,10,.96); box-shadow: 0 14px 44px rgba(0,0,0,.56), 0 0 24px rgba(145,76,195,.14); backdrop-filter: blur(12px); }
.pulsemesh-dock[hidden] { display: none; }
.pulsemesh-dock > span { display: grid; min-width: 190px; padding: 0 8px; }
.pulsemesh-dock b { color: #efffa3; text-transform: uppercase; letter-spacing: .08em; font-size: 10px; }
.pulsemesh-dock small { margin-top: 3px; color: #858c85; font-size: 8px; }

.about-section { padding: 130px 0; display: grid; grid-template-columns: .8fr 1.2fr; gap: 10vw; align-items: center; }
.about-art { min-height: 460px; position: relative; margin: 0; overflow: hidden; border: 1px solid rgba(240,154,50,.32); background: #050506; box-shadow: 0 30px 70px rgba(0,0,0,.42), inset 0 0 0 1px rgba(255,255,255,.025); }
.about-art::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, transparent 60%, rgba(3,3,5,.86)); }
.about-art img { width: 100%; height: 100%; min-height: 460px; display: block; object-fit: cover; object-position: center; filter: saturate(.92) contrast(1.04); transition: transform 1.2s cubic-bezier(.2,.7,.2,1), filter .8s; }
.about-art:hover img { transform: scale(1.025); filter: saturate(1.04) contrast(1.06); }
.about-art figcaption { position: absolute; z-index: 1; left: 24px; right: 24px; bottom: 20px; color: #f2e8d8; font-size: 10px; font-weight: 850; letter-spacing: .18em; text-transform: uppercase; }
.about-copy p { color: #b0b4ba; font-size: 16px; max-width: 650px; }
.about-copy .about-lede { color: #e6e0d7; font-size: 18px; line-height: 1.65; }
.about-socials { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 9px; }
.social-link { min-height: 44px; padding: 0 14px; display: inline-flex; align-items: center; gap: 9px; border: 1px solid var(--line); background: rgba(255,255,255,.025); color: #ece7de; text-decoration: none; text-transform: uppercase; letter-spacing: .11em; font-size: 10px; font-weight: 850; transition: transform .2s, border-color .2s, background .2s; }
.social-link svg { width: 17px; height: 17px; fill: currentColor; stroke: none; }
.social-link:hover { transform: translateY(-2px); border-color: rgba(240,154,50,.65); background: rgba(240,154,50,.08); }
.social-youtube svg { color: #ff543d; }
.social-instagram svg { fill: none; stroke: #ef7bac; stroke-width: 1.8; }
.social-facebook svg { color: #6e9df5; }
.social-link > span:last-child { color: var(--accent); }
.show-toolkit { margin-top: 34px; padding-top: 24px; border-top: 1px solid var(--line); }
.toolkit-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 24px; }
.toolkit-heading > span { color: var(--accent); text-transform: uppercase; letter-spacing: .18em; font-size: 11px; font-weight: 900; white-space: nowrap; }
.toolkit-heading p { margin: 0; font-size: 13px; text-align: right; }
.tool-links { margin-top: 15px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.tool-links a { min-height: 70px; padding: 14px 15px; display: flex; flex-direction: column; justify-content: center; border: 1px solid rgba(255,255,255,.09); background: linear-gradient(135deg, rgba(255,255,255,.035), rgba(240,92,36,.025)); text-decoration: none; transition: border-color .2s, transform .2s, background .2s; }
.tool-links a:hover { transform: translateY(-2px); border-color: rgba(240,154,50,.55); background: linear-gradient(135deg, rgba(240,154,50,.09), rgba(146,60,255,.04)); }
.tool-links strong { color: #f0ece5; font-size: 13px; letter-spacing: .035em; }
.tool-links span { margin-top: 3px; color: #858b94; font-size: 11px; }

.site-footer { border-top: 1px solid var(--line); padding: 46px 0; }
.footer-inner { display: grid; grid-template-columns: auto 1fr auto; gap: 40px; align-items: center; }
.footer-inner > p { color: var(--muted); font-size: 12px; text-align: center; }
.footer-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 12px 18px; }
.toast { position: fixed; z-index: 100; left: 50%; bottom: 24px; max-width: min(520px, calc(100vw - 32px)); transform: translate(-50%, 140%); opacity: 0; background: var(--paper); color: var(--ink); box-shadow: 0 24px 80px rgba(0,0,0,.5); padding: 15px 20px; font-size: 13px; font-weight: 750; transition: transform .28s, opacity .28s; }
.toast.is-visible { transform: translate(-50%, 0); opacity: 1; }
.toast.is-error { border-left: 4px solid var(--accent-hot); }

@keyframes wing-breathe { 0%,100% { transform: scale(1); } 50% { transform: scale(1.018); } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pulse { 50% { opacity: .45; } }
@keyframes equalize { to { height: 8px; opacity: .35; } }
@keyframes loading-butterfly { 0%, 100% { transform: translateY(0) scale(.96); filter: drop-shadow(0 0 9px rgba(239,74,32,.34)); } 50% { transform: translateY(-5px) scale(1.035); filter: drop-shadow(0 0 18px rgba(255,126,35,.68)); } }
@keyframes site-loader-glow { 0%, 100% { transform: translateY(0) scale(.97); filter: drop-shadow(0 0 18px rgba(239,74,32,.38)); } 50% { transform: translateY(-5px) scale(1.025); filter: drop-shadow(0 0 34px rgba(255,137,38,.76)); } }
@keyframes signal-live-pulse { 50% { opacity: .52; transform: scale(.84); } }
@keyframes house-shimmer { 0%, 100% { opacity: .42; transform: scale(.76); } 45% { opacity: 1; transform: scale(1.2); } 58% { opacity: .7; transform: scale(.94); } }
@keyframes pumpkin-carving-pulse { 0%, 100% { opacity: .26; filter: brightness(.9) drop-shadow(0 0 2px rgba(255,133,22,.5)); } 48% { opacity: .92; filter: brightness(1.45) drop-shadow(0 0 7px rgba(255,150,35,.95)); } }
@keyframes visit-ghost-drift { 0%, 100% { transform: translate3d(0, 0, 0) rotate(-3deg); opacity: .45; } 46% { transform: translate3d(18px, -15px, 0) rotate(3deg); opacity: .92; } 72% { transform: translate3d(-8px, -6px, 0) rotate(-1deg); opacity: .68; } }
@keyframes bat-hover { 0%, 100% { transform: translate3d(0,0,0) rotate(8deg) scaleX(1); } 50% { transform: translate3d(18px,-9px,0) rotate(-5deg) scaleX(.78); } }
@keyframes pulsemesh-wave { to { height: 9px; opacity: .5; } }

@media (max-width: 960px) {
  :root { --shell: min(100% - 32px, 760px); }
  .header-show-status { display: none; }
  .hero { grid-template-columns: 1fr; padding-top: 80px; }
  .hero-emblem { min-height: 420px; transform: none; order: -1; margin-bottom: 10px; }
  .hero-wing { width: min(520px, 82vw); }.orbit-one { width: min(450px, 76vw); height: min(450px, 76vw); }.orbit-two { width: min(340px, 58vw); height: min(340px, 58vw); }
  .hero-meta { position: static; margin-top: 70px; flex-wrap: wrap; }
  .signal-card { grid-template-columns: 112px 1fr 1fr; padding: 25px 24px; }
  .signal-status-block { grid-row: 1 / 3; }
  .status-station, .status-hours, .now-copy { padding-inline: 22px; }
  .now-copy { grid-column: 2 / -1; min-height: 70px; padding-top: 16px; margin-top: 14px; border-top: 1px solid rgba(255,255,255,.09); }
  .song-layout { grid-template-columns: 1fr; }.queue-panel { position: static; }
  .about-section { grid-template-columns: 1fr; }
  .visit-night { height: 680px; }
  .courtesy-grid { grid-template-columns: 1fr; }
  .courtesy-card { min-height: 0; }
  .about-art { min-height: 380px; width: min(520px, 100%); }
  .about-art img { min-height: 380px; }
  .footer-inner { grid-template-columns: 1fr; text-align: center; justify-items: center; }.footer-links { flex-wrap: wrap; justify-content: center; }
}

@media (max-width: 700px) {
  .site-header { height: 68px; top: 8px; padding: 0 12px 0 10px; }
  .site-header::after { left: 10px; width: 68px; }
  .brand { gap: 7px; }
  .brand-mark { width: 53px; height: 50px; }
  .brand-type strong { font-size: 19px; }
  .brand-kicker { font-size: 6.5px; letter-spacing: .22em; }
  .nav-toggle { display: block; }
  .site-nav { position: absolute; top: calc(100% + 8px); left: 0; right: 0; display: none; align-items: stretch; flex-direction: column; gap: 0; border: 1px solid var(--line); background: #0a0d12; padding: 8px; }
  .site-nav.is-open { display: flex; }.site-nav a { min-width: 0; padding: 16px; text-align: left; }
  .site-nav .nav-youtube { min-width: 0; margin: 4px 0 0; justify-content: flex-start; }
  .hero { min-height: auto; padding-top: 50px; }.hero-emblem { min-height: 320px; }.emblem-label { bottom: 4px; }
  .hero h1 { font-size: clamp(55px, 18vw, 78px); }.hero-summary { font-size: 15px; }.hero-actions { align-items: flex-start; flex-direction: column; }
  .hero-meta { justify-content: flex-start; font-size: 8px; }
  .now-playing { width: 100%; padding: 10px 0 44px; }
  .signal-card { grid-template-columns: 86px 1fr; padding: 22px 18px; border-inline: 0; }
  .signal-status-block { grid-row: auto; font-size: 22px; }
  .status-station { min-height: 82px; padding: 0 0 0 20px; }
  .status-station strong { font-size: clamp(40px, 13vw, 52px); }
  .status-hours, .now-copy { grid-column: 1 / -1; min-height: 0; margin-top: 18px; padding: 18px 0 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.09); }
  .now-copy { margin-top: 14px; }
  .now-copy.has-artwork { min-height: 78px; padding-left: 74px; }
  .now-artwork { left: 0; width: 58px; }
  .signal-bars { display: none; }
  .section-heading { display: block; }.section-heading > p { margin-top: 20px; }.section-heading h2, .about-copy h2 { font-size: 49px; }
  .song-toolbar { align-items: stretch; flex-direction: column; }.playlist-state { justify-content: space-between; }.song-grid.is-grid-view { grid-template-columns: 1fr; }
  .interaction-summary { margin-top: -12px; text-align: left; }
  .location-help { align-items: stretch; flex-direction: column; gap: 13px; }
  .location-help .button { width: 100%; }
  .playlist-view-switch { justify-content: center; }
  .song-stage { height: 510px; margin-inline: -4px; }
  .song-grid.is-browse-view .song-card { width: min(72vw, 250px); }
  .song-grid.is-browse-view .song-card[data-deck-position="-1"] { transform: translate(-119%, -50%) rotateY(20deg) scale(.8); }
  .song-grid.is-browse-view .song-card[data-deck-position="1"] { transform: translate(19%, -50%) rotateY(-20deg) scale(.8); }
  .song-grid.is-browse-view .song-card[data-deck-position="-2"], .song-grid.is-browse-view .song-card[data-deck-position="2"] { opacity: 0; pointer-events: none; }
  .song-grid.is-grid-view .song-card { min-height: 126px; grid-template-columns: 82px minmax(0,1fr); gap: 12px; }
  .song-grid.is-grid-view .song-poster { width: 82px; }
  .song-grid.is-grid-view .song-poster-copy strong { font-size: 12px; }
  .song-grid.is-grid-view .song-action span { display: none; }
  .song-grid.is-grid-view .song-action { min-width: 42px; padding-inline: 10px; }
  .about-section { padding-block: 76px; }.visit-section { padding-block: 90px; }
  .songs-section { padding: 56px 0 48px; }
  .visit-intro { margin-bottom: 25px; }
  .visit-intro h2 { font-size: clamp(55px, 17vw, 76px); }
  .visit-night { width: 100%; height: 700px; border-inline: 0; }
  .visit-closed-scene { padding: 20px 14px; background-position: 50% center; }
  .closed-sign { width: min(94%, 460px); padding: 24px 18px; }
  .closed-sign-details { grid-template-columns: 1fr; gap: 14px; }
  .closed-sign-details > div + div { padding-top: 14px; border-top: 1px solid rgba(213,232,110,.2); border-left: 0; }
  .visit-house { inset: 10% -18% 37%; background-position: center; }
  .visit-moon { right: 5%; }
  .visit-ghost-one { top: 31%; }.visit-ghost-two { top: 25%; }.visit-ghost-three { top: 39%; }
  .visit-roadway { height: 230px; }
  .pumpkin-row-back { bottom: 204px; }.pumpkin-row-front { bottom: -3px; }
  .visit-details { min-height: 104px; grid-template-columns: 1fr 1fr; gap: 12px; padding: 14px; }
  .visit-details .button { grid-column: 1 / -1; justify-self: stretch; text-align: center; }
  .visit-detail strong { font-size: 13px; }
  .visit-guide { width: calc(100% - 24px); margin-top: 18px; padding: 20px 14px; }
  .visit-guide-heading { display: block; }
  .visit-guide-heading p { margin-top: 10px; text-align: left; }
  .courtesy-card { grid-template-columns: 67px 1fr; padding: 17px 14px; }
  .courtesy-icon { width: 64px; }.courtesy-icon svg { width: 56px; }
  .pulsemesh-card { grid-template-columns: 60px 1fr; padding: 18px 14px; gap: 12px; }
  .pulsemesh-mark { grid-row: auto; width: 58px; height: 52px; }
  .pulsemesh-copy h3 { font-size: 18px; }
  .pulsemesh-link { grid-column: 1 / -1; width: 100%; }
  .pulsemesh-note { grid-column: 1 / -1; }
  .pulsemesh-dialog { width: calc(100vw - 16px); height: calc(100dvh - 16px); }
  .pulsemesh-dialog-header { align-items: flex-start; padding: 14px; }
  .pulsemesh-dialog-header h2 { font-size: 20px; }
  .pulsemesh-dialog-actions { flex-direction: column; }
  .pulsemesh-dialog-actions button { min-height: 34px; }
  .pulsemesh-dialog-instructions, .pulsemesh-dialog-footer { padding: 9px 14px; }
  .pulsemesh-dialog-footer { display: grid; gap: 5px; }
  .pulsemesh-frame-slot iframe { min-height: 360px; }
  .pulsemesh-dock { right: 8px; bottom: 78px; left: 8px; }
  .pulsemesh-dock > span { min-width: 0; margin-right: auto; }
  .about-art, .about-art img { min-height: 300px; }
  .about-socials { display: grid; grid-template-columns: 1fr; }
  .social-link { justify-content: flex-start; }
  .toolkit-heading { display: block; }.toolkit-heading p { margin-top: 8px; text-align: left; }
  .tool-links { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .visit-car { display: none; }
  .visit-ghost { opacity: .72; }
}

/* Date-driven seasonal heroes share the real Lights On Admiral house while
   keeping each observance visually distinct. Halloween retains its animated
   character stage below. */
.seasonal-stage { display: none; }

:root[data-season="veterans"] .hero,
:root[data-season="christmas"] .hero {
  min-height: 0;
  display: block;
  padding: 34px 0 76px;
}

:root[data-season="veterans"] .hero-emblem,
:root[data-season="christmas"] .hero-emblem { display: none; }

:root[data-season="veterans"] .hero-copy,
:root[data-season="christmas"] .hero-copy {
  position: absolute;
  z-index: 12;
  top: 38px;
  left: 50%;
  width: min(1040px, 90%);
  transform: translateX(-50%);
  text-align: center;
  pointer-events: none;
}

:root[data-season="veterans"] .hero-copy .eyebrow,
:root[data-season="christmas"] .hero-copy .eyebrow { justify-content: center; margin-bottom: 10px; text-shadow: 0 2px 14px #000; }
:root[data-season="veterans"] .hero-copy .eyebrow-line,
:root[data-season="christmas"] .hero-copy .eyebrow-line { display: none; }
:root[data-season="veterans"] .hero-copy .hero-actions,
:root[data-season="christmas"] .hero-copy .hero-actions { display: none; }

:root[data-season="veterans"] .hero h1,
:root[data-season="christmas"] .hero h1 {
  max-width: none;
  font-size: clamp(50px, 6.3vw, 84px);
  color: #fff8ea;
  text-shadow: 0 3px 0 rgba(4, 11, 22, .86), 0 0 24px var(--glow), 0 8px 28px #000;
}

:root[data-season="veterans"] .hero h1 em { color: #f7f2e7; -webkit-text-stroke: 0; text-shadow: 0 0 20px rgba(49, 94, 170, .85), 0 3px 18px #000; }
:root[data-season="christmas"] .hero h1 em { color: #f1c85d; -webkit-text-stroke: 0; text-shadow: 0 0 20px rgba(215, 57, 63, .65), 0 3px 18px #000; }

:root[data-season="veterans"] .hero-summary,
:root[data-season="christmas"] .hero-summary {
  max-width: 760px;
  margin: 10px auto 0;
  color: #f0eadf;
  font: 800 clamp(11px, 1.15vw, 16px)/1.5 Georgia, serif;
  letter-spacing: .14em;
  text-transform: uppercase;
  text-shadow: 0 2px 12px #000;
}

.seasonal-stage {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 610px;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid color-mix(in srgb, var(--accent) 46%, transparent);
  background: var(--season-hero-image) center / cover no-repeat;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .65), inset 0 0 100px rgba(0, 0, 0, .28);
}

:root[data-season="veterans"] .seasonal-stage,
:root[data-season="christmas"] .seasonal-stage { display: block; }

.seasonal-stage::before {
  position: absolute;
  z-index: 3;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, rgba(2, 5, 12, .76), transparent 34%, transparent 70%, rgba(2, 5, 10, .74));
  pointer-events: none;
}
.seasonal-stage-vignette { position: absolute; z-index: 5; inset: 0; background: radial-gradient(ellipse at center, transparent 44%, rgba(0,0,0,.62) 116%); pointer-events: none; }
.seasonal-stars, .seasonal-snow { position: absolute; z-index: 4; inset: 0; pointer-events: none; }

:root[data-season="veterans"] .seasonal-stars {
  opacity: .64;
  background:
    radial-gradient(circle, #fff 0 2px, transparent 2.5px) 9% 16% / 11% 1px repeat-x,
    linear-gradient(90deg, transparent, rgba(199,47,63,.32), rgba(244,240,231,.28), rgba(49,94,170,.34), transparent) 50% 0 / 82% 2px no-repeat;
  filter: drop-shadow(0 0 7px rgba(255,255,255,.58));
}

:root[data-season="christmas"] .seasonal-snow {
  opacity: .55;
  background-image:
    radial-gradient(circle, rgba(255,255,255,.9) 0 1px, transparent 1.6px),
    radial-gradient(circle, rgba(255,255,255,.72) 0 1.5px, transparent 2px);
  background-size: 34px 42px, 67px 73px;
  background-position: 0 0, 17px 9px;
  animation: seasonal-snowfall 16s linear infinite;
  -webkit-mask-image: linear-gradient(180deg, #000, transparent 66%);
  mask-image: linear-gradient(180deg, #000, transparent 66%);
}

.seasonal-stage-footer { z-index: 10; }
:root[data-season="veterans"] .seasonal-stage-footer strong { color: #fff2ce; }
:root[data-season="christmas"] .seasonal-stage-footer strong { color: #f1cc68; }
:root[data-season="veterans"] .hero-meta,
:root[data-season="christmas"] .hero-meta { position: static; margin-top: 28px; }

:root:not([data-season="halloween"]) .visit-ghost,
:root:not([data-season="halloween"]) .pumpkin-row { display: none; }
:root[data-season="veterans"] .visit-live-scene,
:root[data-season="christmas"] .visit-live-scene {
  background:
    linear-gradient(180deg, rgba(1, 6, 14, .06), rgba(1, 7, 12, .18)),
    var(--visit-live-image) center / cover no-repeat;
}
:root[data-season="veterans"] .visit-sky,
:root[data-season="veterans"] .visit-house,
:root[data-season="veterans"] .visit-roadway,
:root[data-season="christmas"] .visit-sky,
:root[data-season="christmas"] .visit-house,
:root[data-season="christmas"] .visit-roadway { display: none; }
:root[data-season="veterans"] .visit-night { border-color: rgba(216,225,239,.32); background: #030914; }
:root[data-season="christmas"] .visit-night { border-color: rgba(239,184,62,.32); background: #03100c; }
:root[data-season="veterans"] .visit-intro h2 { color: #f5f1e8; text-shadow: -2px 0 18px rgba(199,47,63,.24), 2px 0 22px rgba(49,94,170,.34); }
:root[data-season="christmas"] .visit-intro h2 { color: #efc75b; text-shadow: 0 0 28px rgba(215,57,63,.24); }
:root[data-season="veterans"] .closed-sign { border-color: rgba(216,225,239,.52); background: linear-gradient(145deg, rgba(7,18,36,.95), rgba(15,25,43,.93)); }
:root[data-season="veterans"] .closed-sign h3 span { color: #e9d7a7; }
:root[data-season="veterans"] .closed-sign-details { border-color: rgba(216,225,239,.2); }
:root[data-season="veterans"] .closed-sign-details > div + div { border-color: rgba(216,225,239,.2); }
:root[data-season="veterans"] .closed-sign-kicker { color: #b6c7e4; }
:root[data-season="christmas"] .closed-sign { border-color: rgba(239,184,62,.52); background: linear-gradient(145deg, rgba(5,24,17,.95), rgba(28,22,13,.93)); }
:root[data-season="christmas"] .closed-sign h3 span { color: #efc75b; }
:root[data-season="christmas"] .closed-sign-details { border-color: rgba(239,184,62,.2); }
:root[data-season="christmas"] .closed-sign-details > div + div { border-color: rgba(239,184,62,.2); }
:root[data-season="christmas"] .closed-sign-kicker { color: #d5b86c; }
:root[data-season="veterans"] .visit-moon { box-shadow: 0 0 58px rgba(176,202,244,.34); }
:root[data-season="christmas"] .visit-moon { opacity: .62; box-shadow: 0 0 58px rgba(255,236,185,.42); }

/* Veterans Day and Christmas carry their palettes through the full page.
   Halloween keeps its established stage-forward orange, purple, and green. */
:root:is([data-season="veterans"], [data-season="christmas"]) .signal-card {
  border-color: var(--season-panel-border);
  background:
    radial-gradient(circle at 8% 50%, color-mix(in srgb, var(--accent-hot) 18%, transparent), transparent 22%),
    linear-gradient(112deg, var(--season-panel-a), var(--season-panel-b) 42%, color-mix(in srgb, var(--accent-cool) 9%, var(--season-panel-b)));
}
:root:is([data-season="veterans"], [data-season="christmas"]) .signal-card::before {
  background:
    radial-gradient(circle at 8% 50%, color-mix(in srgb, var(--accent-hot) 15%, transparent), transparent 20%),
    linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent) 6%, transparent), transparent);
}
:root:is([data-season="veterans"], [data-season="christmas"]) .signal-card::after { border-color: color-mix(in srgb, var(--accent-cool) 24%, transparent); }

:root:is([data-season="veterans"], [data-season="christmas"]) .songs-section {
  margin-bottom: 34px;
  padding-inline: clamp(18px, 4vw, 48px);
  border: 1px solid var(--season-panel-border);
  background:
    radial-gradient(circle at 88% 5%, color-mix(in srgb, var(--accent-hot) 11%, transparent), transparent 28rem),
    radial-gradient(circle at 8% 92%, color-mix(in srgb, var(--accent-cool) 12%, transparent), transparent 26rem),
    linear-gradient(145deg, color-mix(in srgb, var(--season-surface) 90%, transparent), color-mix(in srgb, var(--page-deep) 94%, transparent));
  box-shadow: 0 30px 80px rgba(0, 0, 0, .3), inset 0 1px rgba(255, 255, 255, .025);
}
:root:is([data-season="veterans"], [data-season="christmas"]) .section-heading h2,
:root:is([data-season="veterans"], [data-season="christmas"]) .about-copy h2 { text-shadow: 0 0 32px color-mix(in srgb, var(--glow) 58%, transparent); }
:root:is([data-season="veterans"], [data-season="christmas"]) .location-help,
:root:is([data-season="veterans"], [data-season="christmas"]) .playlist-view-button:hover,
:root:is([data-season="veterans"], [data-season="christmas"]) .playlist-view-button.is-active {
  border-color: color-mix(in srgb, var(--accent) 48%, transparent);
  background: color-mix(in srgb, var(--accent-cool) 11%, transparent);
}
:root:is([data-season="veterans"], [data-season="christmas"]) .location-help strong,
:root:is([data-season="veterans"], [data-season="christmas"]) .playlist-view-button:hover,
:root:is([data-season="veterans"], [data-season="christmas"]) .playlist-view-button.is-active { color: var(--season-detail); }
:root:is([data-season="veterans"], [data-season="christmas"]) .location-help .button {
  border-color: color-mix(in srgb, var(--accent) 55%, transparent);
  color: var(--season-detail);
  background: color-mix(in srgb, var(--accent-cool) 10%, transparent);
}
:root:is([data-season="veterans"], [data-season="christmas"]) .playlist-status.is-browse {
  border-color: color-mix(in srgb, var(--accent) 38%, transparent);
  color: var(--season-detail);
  background: color-mix(in srgb, var(--accent-cool) 8%, transparent);
}
:root:is([data-season="veterans"], [data-season="christmas"]) .song-stage {
  border-color: var(--season-panel-border);
  background:
    radial-gradient(circle at 50% 42%, color-mix(in srgb, var(--accent-hot) 13%, transparent), transparent 29%),
    radial-gradient(ellipse at 50% 100%, color-mix(in srgb, var(--accent-cool) 15%, transparent), transparent 48%),
    linear-gradient(180deg, color-mix(in srgb, var(--season-surface) 78%, transparent), var(--page-deep));
}
:root:is([data-season="veterans"], [data-season="christmas"]) .song-stage::before {
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--page-deep) 92%, transparent), transparent 15% 85%, color-mix(in srgb, var(--page-deep) 92%, transparent)),
    radial-gradient(ellipse at 50% 92%, color-mix(in srgb, var(--accent) 13%, transparent), transparent 42%);
}
:root:is([data-season="veterans"], [data-season="christmas"]) .song-grid.is-browse-view .song-card[data-deck-position="0"],
:root:is([data-season="veterans"], [data-season="christmas"]) .song-grid.is-browse-view .song-card:not(.is-active):hover,
:root:is([data-season="veterans"], [data-season="christmas"]) .song-grid.is-grid-view .song-card:hover { border-color: color-mix(in srgb, var(--accent) 70%, transparent); }
:root:is([data-season="veterans"], [data-season="christmas"]) .song-action,
:root:is([data-season="veterans"], [data-season="christmas"]) .song-deck-controls button {
  border-color: color-mix(in srgb, var(--accent) 45%, transparent);
  color: var(--season-detail);
  background: color-mix(in srgb, var(--accent-cool) 9%, var(--season-surface));
}
:root:is([data-season="veterans"], [data-season="christmas"]) .song-category-heading { border-color: color-mix(in srgb, var(--accent) 32%, transparent); color: var(--season-detail); }
:root:is([data-season="veterans"], [data-season="christmas"]) .queue-panel { border-color: var(--accent-hot); background: var(--season-surface); }

:root[data-season="veterans"] .visit-section {
  background:
    radial-gradient(circle at 83% 17%, rgba(49, 94, 170, .2), transparent 31rem),
    radial-gradient(circle at 8% 75%, rgba(199, 47, 63, .12), transparent 26rem),
    linear-gradient(180deg, #050d1b, #020711 72%, #07101f);
}
:root[data-season="christmas"] .visit-section {
  background:
    radial-gradient(circle at 83% 17%, rgba(239, 184, 62, .14), transparent 28rem),
    radial-gradient(circle at 8% 75%, rgba(215, 57, 63, .11), transparent 25rem),
    linear-gradient(180deg, #061712, #020a08 70%, #071a13);
}
:root[data-season="veterans"] .visit-section::before {
  opacity: .3;
  background:
    radial-gradient(circle, rgba(244, 240, 231, .22) 0 1px, transparent 1.5px) 0 0 / 88px 88px,
    repeating-linear-gradient(90deg, transparent 0 118px, rgba(86, 126, 184, .045) 119px 120px);
}
:root[data-season="christmas"] .visit-section::before {
  opacity: .28;
  background:
    radial-gradient(circle at 82% 15%, rgba(239, 184, 62, .2), transparent 25rem),
    repeating-linear-gradient(90deg, transparent 0 118px, rgba(23, 139, 104, .04) 119px 120px);
}
:root[data-season="christmas"] .visit-intro {
  isolation: isolate;
  padding: 34px clamp(20px, 5vw, 64px) 32px;
}
:root[data-season="christmas"] .visit-intro::before {
  position: absolute;
  z-index: -1;
  inset: -38px -10vw;
  content: "";
  pointer-events: none;
  background: radial-gradient(ellipse at center, #04130f 0 48%, rgba(4, 19, 15, .98) 62%, rgba(4, 19, 15, .82) 76%, transparent 100%);
  filter: drop-shadow(0 18px 34px rgba(0, 0, 0, .28));
}
:root:is([data-season="veterans"], [data-season="christmas"]) .visit-details,
:root:is([data-season="veterans"], [data-season="christmas"]) .visit-guide {
  border-color: var(--season-panel-border);
  background: linear-gradient(145deg, var(--season-surface), color-mix(in srgb, var(--page-deep) 96%, transparent));
}
:root:is([data-season="veterans"], [data-season="christmas"]) .visit-detail span,
:root:is([data-season="veterans"], [data-season="christmas"]) .visit-guide-heading span,
:root:is([data-season="veterans"], [data-season="christmas"]) .pulsemesh-copy > span { color: color-mix(in srgb, var(--accent) 72%, #9fa5ae); }
:root:is([data-season="veterans"], [data-season="christmas"]) .visit-detail strong,
:root:is([data-season="veterans"], [data-season="christmas"]) .visit-guide-heading h3,
:root:is([data-season="veterans"], [data-season="christmas"]) .pulsemesh-copy h3 { color: var(--paper); }
:root:is([data-season="veterans"], [data-season="christmas"]) .courtesy-card::after,
:root:is([data-season="veterans"], [data-season="christmas"]) .courtesy-card:hover { border-color: color-mix(in srgb, var(--accent) 28%, transparent); }
:root:is([data-season="veterans"], [data-season="christmas"]) .courtesy-card:hover { background: linear-gradient(135deg, color-mix(in srgb, var(--accent-cool) 10%, transparent), rgba(255,255,255,.014)); }
:root:is([data-season="veterans"], [data-season="christmas"]) .courtesy-icon {
  border-color: color-mix(in srgb, var(--accent-cool) 38%, transparent);
  background: radial-gradient(circle, color-mix(in srgb, var(--accent-cool) 15%, transparent), transparent 70%);
}
:root:is([data-season="veterans"], [data-season="christmas"]) .courtesy-icon svg { stroke: var(--accent-cool); filter: drop-shadow(0 0 6px var(--glow)); }
:root:is([data-season="veterans"], [data-season="christmas"]) .courtesy-icon .icon-dash,
:root:is([data-season="veterans"], [data-season="christmas"]) .courtesy-icon .icon-light,
:root:is([data-season="veterans"], [data-season="christmas"]) .courtesy-icon .icon-spark,
:root:is([data-season="veterans"], [data-season="christmas"]) .courtesy-icon .icon-wave { stroke: var(--accent); }
:root:is([data-season="veterans"], [data-season="christmas"]) .courtesy-icon .icon-window,
:root:is([data-season="veterans"], [data-season="christmas"]) .courtesy-icon .icon-wheel,
:root:is([data-season="veterans"], [data-season="christmas"]) .courtesy-icon .icon-dial { fill: color-mix(in srgb, var(--accent) 16%, transparent); stroke: var(--accent); }
:root:is([data-season="veterans"], [data-season="christmas"]) .pulsemesh-card {
  border-color: color-mix(in srgb, var(--accent-cool) 38%, transparent);
  background:
    radial-gradient(circle at 7% 50%, color-mix(in srgb, var(--accent-cool) 15%, transparent), transparent 18%),
    linear-gradient(120deg, var(--season-surface), var(--page-deep) 60%);
}
:root:is([data-season="veterans"], [data-season="christmas"]) .pulsemesh-mark { border-color: color-mix(in srgb, var(--accent-cool) 30%, transparent); background: color-mix(in srgb, var(--accent-cool) 9%, transparent); }
:root:is([data-season="veterans"], [data-season="christmas"]) .pulsemesh-mark span { background: linear-gradient(180deg, var(--accent), var(--accent-cool)); }
:root:is([data-season="veterans"], [data-season="christmas"]) .pulsemesh-link { border-color: color-mix(in srgb, var(--accent-cool) 40%, transparent); }
:root:is([data-season="veterans"], [data-season="christmas"]) .pulsemesh-link.is-live { border-color: color-mix(in srgb, var(--accent) 62%, transparent); color: var(--season-detail); background: color-mix(in srgb, var(--accent) 9%, transparent); }

:root:is([data-season="veterans"], [data-season="christmas"]) .about-section {
  position: relative;
  margin-bottom: 38px;
  padding-inline: clamp(18px, 4vw, 48px);
  border-block: 1px solid var(--season-panel-border);
  background:
    radial-gradient(circle at 4% 50%, color-mix(in srgb, var(--accent-cool) 11%, transparent), transparent 23rem),
    linear-gradient(135deg, color-mix(in srgb, var(--season-surface) 78%, transparent), transparent 68%);
}
:root[data-season="christmas"] .songs-section {
  background:
    radial-gradient(circle at 88% 5%, rgba(215, 57, 63, .1), transparent 28rem),
    radial-gradient(circle at 8% 92%, rgba(23, 139, 104, .13), transparent 26rem),
    linear-gradient(145deg, #071d16, #020a08);
}
:root[data-season="christmas"] .about-section {
  background:
    radial-gradient(circle at 4% 50%, rgba(23, 139, 104, .12), transparent 23rem),
    linear-gradient(135deg, #071d16, #020a08);
}
:root[data-season="christmas"] .site-footer { background: linear-gradient(180deg, #04130f, #020806); }
:root:is([data-season="veterans"], [data-season="christmas"]) .about-art { border-color: var(--season-panel-border); }
:root:is([data-season="veterans"], [data-season="christmas"]) .social-link:hover,
:root:is([data-season="veterans"], [data-season="christmas"]) .tool-links a:hover { border-color: color-mix(in srgb, var(--accent) 62%, transparent); background: color-mix(in srgb, var(--accent-cool) 9%, transparent); }
:root:is([data-season="veterans"], [data-season="christmas"]) .site-footer {
  border-color: var(--season-panel-border);
  background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--season-surface) 76%, transparent));
}

:root[data-season="veterans"] .button-primary { color: #06101f; background: linear-gradient(105deg, #f0dfb1 0 64%, #d6e0ee 64%); }
:root[data-season="christmas"] .button-primary { color: #08140f; background: linear-gradient(105deg, #efb83e 0 72%, #f5d97d 72%); }
:root[data-season="veterans"] .brand-mark { filter: drop-shadow(-5px 0 11px rgba(199,47,63,.24)) drop-shadow(5px 0 12px rgba(49,94,170,.42)); }
:root[data-season="christmas"] .brand-mark { filter: drop-shadow(-5px 0 11px rgba(215,57,63,.28)) drop-shadow(5px 0 12px rgba(23,139,104,.42)); }

@keyframes seasonal-snowfall { to { background-position: 34px 84px, -50px 155px; } }
@keyframes christmas-page-snowfall { to { background-position: 38px 104px, -58px 188px, 92px 332px; } }
@keyframes christmas-snow-drift { to { transform: translate3d(34px, 146px, 0); } }

/* Halloween hero: a layered scene so characters and atmosphere move
   independently rather than behaving like one flat animated poster. */
.halloween-stage { display: none; }

:root[data-season="halloween"] .hero {
  min-height: 0;
  display: block;
  padding: 34px 0 76px;
}

:root[data-season="halloween"] .hero-emblem { display: none; }

:root[data-season="halloween"] .hero-copy {
  position: absolute;
  z-index: 12;
  top: 34px;
  left: 50%;
  width: min(1080px, 92%);
  transform: translateX(-50%);
  text-align: center;
  pointer-events: none;
}

:root[data-season="halloween"] .hero-copy .eyebrow {
  justify-content: center;
  margin-bottom: 8px;
  text-shadow: 0 2px 12px #000;
}

:root[data-season="halloween"] .hero-copy .eyebrow-line { display: none; }

:root[data-season="halloween"] .hero h1 {
  max-width: none;
  font-size: clamp(54px, 6.8vw, 88px);
  line-height: .88;
  color: #fff4df;
  text-shadow:
    0 3px 0 #6e140d,
    0 0 10px #ff4c16,
    0 0 34px rgba(255, 61, 14, .75),
    0 8px 22px rgba(0, 0, 0, .95);
}

:root[data-season="halloween"] .hero-summary {
  max-width: none;
  margin-top: 8px;
  color: #efe7d6;
  font-family: Georgia, serif;
  font-size: clamp(12px, 1.2vw, 17px);
  font-weight: 800;
  letter-spacing: .22em;
  text-transform: uppercase;
  text-shadow: 0 2px 10px #000;
}

:root[data-season="halloween"] .hero-copy .hero-actions { display: none; }

.halloween-stage {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 610px;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent);
  background:
    linear-gradient(180deg, rgba(3, 4, 9, .12), rgba(3, 4, 9, .02) 47%, rgba(3, 4, 9, .82)),
    url('./assets/hero-house-halloween.jpg') center / cover no-repeat;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .65), inset 0 0 100px rgba(0, 0, 0, .35);
}

:root[data-season="halloween"] .halloween-stage { display: block; }

.stage-vignette {
  position: absolute;
  z-index: 9;
  inset: 0;
  background: radial-gradient(ellipse at center, transparent 42%, rgba(0, 0, 0, .72) 112%);
  pointer-events: none;
}

.halloween-page-webs,
.christmas-page-snow,
.halloween-page-effects {
  display: none;
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.halloween-page-webs,
.christmas-page-snow { z-index: 1; }
.halloween-page-effects { z-index: 60; }

:root[data-season="halloween"] .halloween-page-webs,
:root[data-season="halloween"] .halloween-page-effects { display: block; }
:root[data-season="christmas"] .christmas-page-snow { display: block; }

:root:is([data-season="halloween"], [data-season="christmas"]) body > main > .hero,
:root:is([data-season="halloween"], [data-season="christmas"]) body > main > .now-playing,
:root:is([data-season="halloween"], [data-season="christmas"]) .visit-section > .shell,
:root:is([data-season="halloween"], [data-season="christmas"]) body > main > .songs-section,
:root:is([data-season="halloween"], [data-season="christmas"]) body > main > .about-section,
:root:is([data-season="halloween"], [data-season="christmas"]) body > .site-footer {
  position: relative;
  z-index: 2;
}

.christmas-page-snow {
  inset: -28vh 0;
  opacity: .66;
  background-image:
    radial-gradient(circle, rgba(255, 255, 255, .92) 0 1.2px, transparent 1.8px),
    radial-gradient(circle, rgba(255, 250, 230, .72) 0 1.8px, transparent 2.5px),
    radial-gradient(circle, rgba(224, 240, 238, .48) 0 2.3px, transparent 3px);
  background-size: 38px 52px, 79px 94px, 137px 166px;
  background-position: 0 0, 21px 31px, 63px 12px;
  filter: drop-shadow(0 0 4px rgba(255, 255, 255, .32));
  animation: christmas-page-snowfall 18s linear infinite;
}

.christmas-page-snow::before,
.christmas-page-snow::after {
  position: absolute;
  inset: 0;
  content: "";
  background-image: radial-gradient(circle, rgba(255, 255, 255, .7) 0 1px, transparent 1.6px);
  pointer-events: none;
}
.christmas-page-snow::before { background-size: 57px 73px; background-position: 15px 9px; animation: christmas-snow-drift 13s linear infinite; }
.christmas-page-snow::after { opacity: .44; background-size: 101px 127px; background-position: 47px 33px; animation: christmas-snow-drift 24s linear infinite reverse; }

.corner-web {
  position: absolute;
  top: -12px;
  width: clamp(230px, 28vw, 410px);
  height: auto;
  opacity: .42;
  filter: grayscale(1) sepia(.12) brightness(1.08) contrast(.96) drop-shadow(0 0 8px rgba(255, 245, 221, .18));
}
.web-left { left: -12px; }
.web-right { right: -12px; transform: scaleX(-1); }

@media (max-width: 720px) {
  .corner-web { top: -6px; width: min(48vw, 200px); opacity: .34; }
  .web-left { left: -8px; }
  .web-right { right: -8px; }
}

.character { position: absolute; z-index: 5; bottom: 6%; height: 64%; pointer-events: none; }
.character img { position: absolute; display: block; user-select: none; }
.admiral-character {
  --conductor-scale: .62;
  --conductor-rise: -50%;
  --conductor-rise-peak: -55%;
  left: -3%;
  width: 42%;
  bottom: 13%;
  height: 54%;
  transform-origin: 50% 100%;
  animation: conductor-hover 10s ease-in-out infinite;
}
.performer-character {
  display: none;
  right: 0;
  bottom: 24%;
  width: 33%;
  height: 50%;
  opacity: 0;
  visibility: hidden;
}
.performer-death {
  transform-origin: 50% 92%;
  animation: none;
}
.performer-pumpkin {
  transform-origin: 50% 100%;
  animation: none;
}
.performer-phantom { animation: phantom-float 11.5s ease-in-out infinite; }
:root[data-performer="death"] .performer-death,
:root[data-performer="pumpkin"] .performer-pumpkin,
:root[data-performer="phantom"] .performer-phantom { display: block; opacity: 1; visibility: visible; }

.halloween-stage:not(.sprites-ready) .character {
  opacity: 0 !important;
  visibility: hidden !important;
}
.halloween-stage:not(.sprites-ready) .character,
.halloween-stage:not(.sprites-ready) .character-wings,
.halloween-stage:not(.sprites-ready) .admiral-baton-arm,
.halloween-stage:not(.sprites-ready) .sprite-frame {
  animation-play-state: paused !important;
}
.halloween-stage.sprites-ready .character {
  transition: opacity .3s ease-out;
}

.character-wings {
  width: 105%;
  top: 6%;
  left: 50%;
  transform: translateX(-50%);
  transform-origin: 50% 52%;
  filter: drop-shadow(0 0 15px rgba(121, 36, 255, .6)) drop-shadow(0 10px 16px rgba(0, 0, 0, .65));
}

.character-sprite {
  position: absolute;
  z-index: 2;
  height: 100%;
  aspect-ratio: var(--sprite-cell-ratio, 3 / 2);
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  overflow: hidden;
  filter: drop-shadow(0 16px 18px rgba(0, 0, 0, .78));
}

.admiral-conductor-composite {
  position: absolute;
  z-index: 2;
  height: 108%;
  aspect-ratio: 2 / 3;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  filter: drop-shadow(0 16px 18px rgba(0, 0, 0, .78));
}
.admiral-conductor-body {
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.admiral-baton-arm {
  z-index: 2;
  top: -3%;
  left: 7%;
  width: 36%;
  transform-origin: 90% 93%;
  animation: admiral-baton-conduct 4.8s ease-in-out infinite;
  will-change: transform;
}
.death-sprite {
  --sprite-image: url('./assets/death-singer-sprite-16-clean-v2.png');
  --sprite-cell-ratio: 1247 / 1261;
}
.pumpkin-sprite {
  --sprite-image: url('./assets/pumpkin-singer-sprite-16-clean-v2.png');
  --sprite-cell-ratio: 1234 / 1274;
}
.phantom-sprite {
  --sprite-image: url('./assets/phantom-singer-sprite-16-clean-v2.png');
  --sprite-cell-ratio: 1275 / 1234;
}
.sprite-frame {
  position: absolute;
  inset: 0;
  display: block;
  opacity: 1;
  background-image: var(--sprite-image);
  background-repeat: no-repeat;
  background-size: 400% 400%;
  animation: none;
}
.sprite-frame-1 { background-position: 0 0; }

.admiral-wings {
  top: -12%;
  animation: admiral-wing-flurry var(--admiral-wing-duration, 11s) ease-in-out infinite var(--admiral-wing-delay, -2s);
}
.death-wings {
  top: -30%;
  width: 112%;
  animation: death-wing-flurry var(--death-wing-duration, 14s) ease-in-out infinite var(--death-wing-delay, -4s);
}
.death-sprite { height: 104%; }
.pumpkin-sprite { height: 105%; }
.phantom-sprite { height: 108%; }

.flying-ghost {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: clamp(125px, 17vw, 250px);
  opacity: 0;
  filter: drop-shadow(0 0 24px rgba(198, 218, 255, .72));
  transform-origin: 50% 50%;
  pointer-events: none;
  will-change: transform, opacity;
}

.stage-fog {
  position: absolute;
  z-index: 7;
  left: -25%;
  width: 150%;
  height: 24%;
  bottom: -5%;
  opacity: .46;
  background:
    radial-gradient(ellipse at 15% 70%, rgba(190, 146, 255, .55), transparent 25%),
    radial-gradient(ellipse at 45% 35%, rgba(235, 236, 255, .38), transparent 24%),
    radial-gradient(ellipse at 78% 65%, rgba(210, 168, 255, .42), transparent 27%);
  background-size: 115% 100%, 130% 115%, 120% 105%;
  filter: blur(18px);
  animation: fog-creep-front 18s cubic-bezier(.45, .05, .55, .95) infinite;
  pointer-events: none;
  will-change: transform, opacity, filter, background-position;
}
.fog-back {
  bottom: 5%;
  opacity: .3;
  animation-name: fog-creep-back;
  animation-duration: 26s;
  animation-delay: -9s;
}

.stage-footer {
  position: absolute;
  z-index: 15;
  left: 50%;
  bottom: 18px;
  width: auto;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 8px;
  border: 1px solid rgba(240, 154, 50, .48);
  background: rgba(7, 4, 9, .78);
  backdrop-filter: blur(12px);
  box-shadow: 0 10px 34px rgba(0, 0, 0, .58);
}
.stage-footer p { display: none; }
.stage-footer strong { color: var(--accent); }
.stage-footer .button { min-height: 42px; white-space: nowrap; }

:root[data-season="halloween"] .hero-meta { position: static; margin-top: 28px; }

@keyframes admiral-wing-flurry {
  0%, 10%, 22%, 54%, 66%, 100% { transform: translateX(-50%) scaleX(1); }
  12% { transform: translateX(-50%) scaleX(.94); }
  14% { transform: translateX(-50%) scaleX(1.012); }
  16.5% { transform: translateX(-50%) scaleX(.955); }
  19% { transform: translateX(-50%) scaleX(1); }
  57% { transform: translateX(-50%) scaleX(.93); }
  59.5% { transform: translateX(-50%) scaleX(1.015); }
  62% { transform: translateX(-50%) scaleX(.95); }
  64.5% { transform: translateX(-50%) scaleX(1); }
}
@keyframes death-wing-flurry {
  0%, 28%, 43%, 74%, 89%, 100% { transform: translateX(-50%) scaleX(1); }
  31% { transform: translateX(-50%) scaleX(.935); }
  34% { transform: translateX(-50%) scaleX(1.012); }
  37% { transform: translateX(-50%) scaleX(.95); }
  40% { transform: translateX(-50%) scaleX(1); }
  77% { transform: translateX(-50%) scaleX(.92); }
  80% { transform: translateX(-50%) scaleX(1.018); }
  83% { transform: translateX(-50%) scaleX(.945); }
  86% { transform: translateX(-50%) scaleX(1); }
}
@keyframes conductor-gesture {
  0%, 100% { transform: rotate(-.55deg); }
  18% { transform: rotate(1.25deg); }
  38% { transform: rotate(-1.1deg); }
  61% { transform: rotate(.9deg); }
  82% { transform: rotate(-.25deg); }
}
@keyframes admiral-baton-conduct {
  0%, 100% { transform: rotate(-5deg); }
  20% { transform: rotate(3.5deg); }
  42% { transform: rotate(-2deg); }
  63% { transform: rotate(5deg); }
  82% { transform: rotate(-3.25deg); }
}
@keyframes singer-gesture {
  0%, 100% { transform: rotate(.12deg); }
  26% { transform: rotate(-.24deg); }
  52% { transform: rotate(.2deg); }
  76% { transform: rotate(-.1deg); }
}
@keyframes conductor-hover {
  0%, 100% { transform: translateY(var(--conductor-rise)) scale(var(--conductor-scale)); }
  50% { transform: translateY(var(--conductor-rise-peak)) scale(var(--conductor-scale)); }
}
@keyframes sprite-frame-cycle {
  0%, 4.6875% { opacity: 1; }
  6.25%, 98.4375% { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes conductor-fluid-cycle {
  0%, 6.24% { opacity: 1; }
  6.25%, 100% { opacity: 0; }
}
@keyframes phantom-float {
  0%, 100% { transform: translateY(0) rotate(-.18deg) scale(1); filter: drop-shadow(0 16px 18px rgba(0, 0, 0, .72)) drop-shadow(0 0 12px rgba(71, 224, 231, .25)); }
  50% { transform: translateY(-1.1%) rotate(.2deg) scale(1.004); filter: drop-shadow(0 18px 20px rgba(0, 0, 0, .68)) drop-shadow(0 0 18px rgba(71, 224, 231, .4)); }
}
@keyframes fog-creep-front {
  0%, 100% {
    opacity: .16;
    transform: translate3d(-10%, 18%, 0) scale(1.02, .68);
    filter: blur(25px);
    background-position: 0 20%, 30% 45%, 80% 35%;
  }
  18% {
    opacity: .48;
    transform: translate3d(-3%, 3%, 0) scale(1.08, 1.02);
    filter: blur(18px);
  }
  42% {
    opacity: .68;
    transform: translate3d(5%, -7%, 0) scale(1.16, 1.24);
    filter: blur(14px);
    background-position: 18% 45%, 52% 20%, 94% 60%;
  }
  68% {
    opacity: .34;
    transform: translate3d(11%, 9%, 0) scale(1.05, .84);
    filter: blur(22px);
  }
  84% {
    opacity: .58;
    transform: translate3d(1%, -2%, 0) scale(1.12, 1.12);
    filter: blur(16px);
    background-position: 8% 60%, 68% 38%, 74% 18%;
  }
}
@keyframes fog-creep-back {
  0%, 100% {
    opacity: .12;
    transform: translate3d(12%, 12%, 0) scale(1.04, .72);
    filter: blur(31px);
    background-position: 15% 30%, 64% 20%, 92% 50%;
  }
  27% {
    opacity: .4;
    transform: translate3d(2%, -5%, 0) scale(1.12, 1.08);
    filter: blur(23px);
  }
  55% {
    opacity: .22;
    transform: translate3d(-9%, 7%, 0) scale(1.02, .82);
    filter: blur(29px);
    background-position: 2% 55%, 44% 48%, 76% 15%;
  }
  78% {
    opacity: .48;
    transform: translate3d(-1%, -9%, 0) scale(1.18, 1.2);
    filter: blur(20px);
  }
}

@media (max-width: 960px) {
  :root[data-season="veterans"] .hero,
  :root[data-season="christmas"] .hero { padding-top: 24px; }
  :root[data-season="veterans"] .hero-copy,
  :root[data-season="christmas"] .hero-copy { top: 34px; width: 92%; }
  .seasonal-stage { min-height: 540px; }
  :root[data-season="halloween"] .hero { padding-top: 24px; }
  :root[data-season="halloween"] .hero-copy { top: 38px; width: 92%; }
  .halloween-stage { min-height: 540px; }
  .character { height: 57%; bottom: 11%; }
  .admiral-character { --conductor-scale: .68; left: -3%; width: 44%; height: 52%; bottom: 13%; }
  .performer-character { right: -1%; width: 36%; height: 47%; bottom: 24%; }
}

@media (max-width: 700px) {
  :root[data-season="veterans"] .hero-copy,
  :root[data-season="christmas"] .hero-copy { top: 28px; width: 94%; }
  :root[data-season="veterans"] .hero h1,
  :root[data-season="christmas"] .hero h1 { font-size: clamp(39px, 10.5vw, 56px); }
  :root[data-season="veterans"] .hero-summary,
  :root[data-season="christmas"] .hero-summary { font-size: 9px; letter-spacing: .1em; }
  .seasonal-stage { min-height: 650px; aspect-ratio: auto; background-position: center; }
  :root[data-season="halloween"] .hero-copy { top: 32px; width: 94%; }
  :root[data-season="halloween"] .hero h1 { font-size: clamp(42px, 12vw, 58px); }
  :root[data-season="halloween"] .hero-summary { font-size: 9px; letter-spacing: .12em; }
  .halloween-stage { min-height: 650px; aspect-ratio: auto; background-position: 49% center; }
  .corner-web { width: 145px; }
  .character { bottom: 16%; height: 48%; }
  .admiral-character { --conductor-scale: .72; --conductor-rise: -38%; --conductor-rise-peak: -43%; left: -10%; width: 58%; height: 46%; bottom: 18%; }
  .performer-character { right: -4%; width: 48%; height: 40%; bottom: 27%; }
  .flying-ghost { width: clamp(105px, 33vw, 165px); }
  .stage-footer { bottom: 12px; width: auto; padding: 6px; flex-direction: row; }
  .stage-footer .button { min-height: 38px; }
}

/* Phones have very little vertical room in landscape. Use one compact menu
   pattern across both narrow and modern wide phones instead of squeezing the
   desktop navigation into the header or opening a full-height link stack. */
@media (orientation: landscape) and (max-height: 560px) and (max-width: 960px) {
  .site-loading-screen::before { inset: 5%; }
  .site-loading-screen::after { inset: 8%; }
  .site-loading-brand img { width: clamp(92px, 21vh, 132px); }
  .site-loading-brand strong { margin-top: 9px; font-size: clamp(25px, 7vh, 36px); }
  .site-loading-brand span { margin-top: 7px; font-size: 6px; }

  .site-header {
    width: calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right) - 16px);
    height: 58px;
    margin-top: 6px;
    padding-right: max(8px, env(safe-area-inset-right));
    padding-left: max(8px, env(safe-area-inset-left));
    top: 6px;
  }
  .site-header::after { left: max(8px, env(safe-area-inset-left)); width: 58px; }
  .brand { gap: 7px; }
  .brand-mark { width: 47px; height: 44px; }
  .brand-type strong { font-size: 17px; }
  .brand-kicker { margin-top: 4px; font-size: 5.5px; letter-spacing: .2em; }
  .header-show-status { display: none; }
  .nav-toggle { display: block; width: 40px; height: 40px; margin-left: auto; padding: 8px; }

  .site-nav {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    left: auto;
    width: min(390px, calc(100vw - 16px));
    max-height: calc(100dvh - 76px);
    padding: 6px;
    display: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 5px;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 1px solid rgba(240, 154, 50, .38);
    background: rgba(7, 9, 13, .98);
    box-shadow: 0 18px 46px rgba(0, 0, 0, .7), 0 0 24px rgba(231, 64, 34, .12);
    backdrop-filter: blur(18px);
  }
  .site-nav.is-open { display: grid; }
  .site-nav a,
  .site-nav .nav-youtube {
    min-width: 0;
    min-height: 44px;
    margin: 0;
    padding: 9px 11px;
    justify-content: flex-start;
    text-align: left;
    border-color: rgba(240, 154, 50, .14);
    background: rgba(255, 255, 255, .025);
  }
  .site-nav .nav-youtube { border-color: rgba(239, 73, 40, .4); }

  :root[data-season="veterans"] .hero,
  :root[data-season="christmas"] .hero { padding-top: 12px; }
  :root[data-season="veterans"] .hero-copy,
  :root[data-season="christmas"] .hero-copy { top: 15px; width: 94%; }
  :root[data-season="veterans"] .hero h1,
  :root[data-season="christmas"] .hero h1 { font-size: clamp(34px, 6vw, 46px); }
  :root[data-season="veterans"] .hero-summary,
  :root[data-season="christmas"] .hero-summary { margin-top: 5px; font-size: 8px; }
  .seasonal-stage { min-height: 430px; aspect-ratio: 16 / 10; }
  :root[data-season="halloween"] .hero { padding-top: 12px; }
  :root[data-season="halloween"] .hero-copy { top: 18px; width: 94%; }
  :root[data-season="halloween"] .hero h1 { font-size: clamp(38px, 7vw, 50px); }
  :root[data-season="halloween"] .hero-summary { margin-top: 6px; font-size: 8px; }
  .halloween-stage { min-height: 430px; aspect-ratio: 16 / 10; }
  .stage-footer { bottom: 8px; }
  .song-stage { height: 430px; }
  .song-grid.is-browse-view .song-card { width: min(31vw, 216px); }
  .song-grid.is-browse-view .song-card[data-deck-position="-1"] { transform: translate(-132%, -50%) rotateY(21deg) scale(.78); }
  .song-grid.is-browse-view .song-card[data-deck-position="1"] { transform: translate(32%, -50%) rotateY(-21deg) scale(.78); }
  .song-poster-copy strong { font-size: 17px; }
}