/* Spark design system v3 ("Desert Night"). Colors and type come from tokens.css only.
   Progressive enhancement: view transitions, scroll-driven reveals, :has(), container queries.
   No inline styles anywhere (CSP style-src 'self'). */
@view-transition { navigation: auto; }

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 6rem; scroll-behavior: smooth; }
html, body { overscroll-behavior-y: none; }
html { background: var(--night-1); }  /* iPhone Safari still bounces past the ends; the header and footer are always this dark navy, so the bounce shows the same color instead of a contrasting band */  /* no elastic bounce past the footer on phones: it left a blank band and floated the back-to-top button mid-page (Steve, 2026-10-24) */
body { margin: 0; background: var(--bg); color: var(--text); font: 400 var(--step-0)/1.65 var(--font-body);
  font-feature-settings: "cv11", "ss01"; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased;
  accent-color: var(--accent); overflow-x: clip; }
img, video, iframe, svg { max-width: 100%; }
img { height: auto; display: block; }
h1, h2, h3, h4, h5 { font-family: var(--font-display); color: var(--heading); line-height: 1.04; letter-spacing: -.025em;
  text-wrap: balance; margin: 1.6em 0 .45em; font-weight: 750; }
h1 { font-size: var(--step-4); font-weight: 800; margin-top: 0; }
h2 { font-size: var(--step-3); }
h3 { font-size: var(--step-2); letter-spacing: -.015em; }
h4 { font-size: var(--step-1); letter-spacing: -.01em; }
h5 { font-size: var(--step-0); letter-spacing: 0; }
p, li { text-wrap: pretty; }
a { color: var(--accent); text-underline-offset: .2em; text-decoration-thickness: .07em; transition: color .15s; }
a:hover { color: var(--accent-hover); }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; border-radius: 6px; }
hr { border: 0; border-top: 1px solid var(--border); margin: 2.5rem 0; }
::selection { background: rgb(255 194 38 / .45); color: inherit; }
.container { width: min(100% - 2 * var(--space), var(--container)); margin-inline: auto; }
.container.narrow { --container: 52rem; }
.muted { color: var(--text-muted); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: absolute; left: 1rem; top: -4rem; z-index: 100; background: var(--cta); color: var(--cta-text);
  padding: .6rem 1rem; border-radius: var(--radius-md); font-weight: 700; }
.skip-link:focus { top: 1rem; }
.tabular { font-variant-numeric: tabular-nums; }

/* Small typographic pieces */
.eyebrow { display: inline-flex; align-items: center; gap: .5rem; font: 650 var(--step--1)/1.2 var(--font-body);
  letter-spacing: .14em; text-transform: uppercase; color: var(--accent); margin: 0 0 .9rem; }
.eyebrow::before { content: ""; width: 1.6rem; height: 2px; border-radius: 2px; background: var(--sunset); }
.lede { font-size: var(--step-1); line-height: 1.5; color: var(--text-muted); max-width: 60ch; }
.display { font-size: var(--step-5); line-height: .92; letter-spacing: -.04em; font-weight: 800; }
.glow-text { background: var(--sunset); -webkit-background-clip: text; background-clip: text; color: transparent;
  -webkit-box-decoration-break: clone; box-decoration-break: clone; }

/* ---------- Environment strip (non-production) ---------- */
.env-strip { background: var(--env-strip-bg); color: var(--env-strip-text); font: 700 var(--step--1)/1.3 var(--font-body);
  text-align: center; padding: .35rem var(--space); display: flex; gap: .25rem 1rem; justify-content: center;
  align-items: center; flex-wrap: wrap; position: relative; z-index: 60; }
.env-strip form { display: inline; }
.env-strip button { background: none; border: 0; color: inherit; text-decoration: underline; cursor: pointer;
  font: inherit; min-height: auto; padding: 0; box-shadow: none; }
.env-strip__short { display: none; }
/* One row on phones (Steve, 2026-10-17): the short label and Leave Stage side by side. */
@media (max-width: 40rem) {
  .env-strip { flex-wrap: nowrap; white-space: nowrap; gap: .75rem; padding-block: .3rem; }
  .env-strip__long { display: none; }
  .env-strip__short { display: inline; }
}

/* ---------- Header (always night) ---------- */
.site-header { position: sticky; top: 0; z-index: 50; color: var(--night-text); view-transition-name: site-header;
  background: rgb(7 10 22 / .94); border-bottom: 1px solid var(--night-line);
  backdrop-filter: saturate(1.5) blur(16px); -webkit-backdrop-filter: saturate(1.5) blur(16px); }
.site-header::after { content: ""; position: absolute; inset: auto 0 -1px; height: 1px; background: var(--sunset); opacity: .55; }
.site-header .bar { display: flex; align-items: center; gap: 1rem; min-height: 4.5rem; }
.brand { display: inline-flex; align-items: center; gap: .6rem; text-decoration: none; color: inherit; flex: none; }
.brand img { height: 52px; width: auto; }
.nav { margin-left: auto; display: flex; align-items: center; }
.nav > ul { display: flex; gap: .1rem; list-style: none; margin: 0; padding: 0; align-items: center; }
.nav a, .nav summary { color: var(--night-text); text-decoration: none; font: 600 var(--step--1)/1.2 var(--font-body);
  padding: .65rem .8rem; border-radius: 999px; display: block; cursor: pointer; white-space: nowrap; }
.nav a:hover, .nav summary:hover, .nav details[open] > summary { background: rgb(255 255 255 / .08); color: var(--white); }
@media (min-width: 64.0625rem) {  /* the top menu words: larger and clearer (Steve, 2026-10-17) */
  .nav > ul { gap: .35rem; }
  .nav > ul > li > details > summary, .nav > ul > li > a { font-size: 1.06rem; font-weight: 650; padding: .7rem 1.05rem; color: var(--white); }
  .nav > ul > li > details > summary:hover, .nav > ul > li > details[open] > summary { background: rgb(255 194 38 / .14); color: var(--brand-gold); }
}
@media (min-width: 64.0625rem) and (max-width: 94rem) {  /* six menus (with Shop) still fit beside the buttons on a laptop */
  .nav > ul > li > details > summary, .nav > ul > li > a { padding: .7rem .8rem; }
}
.nav a[aria-current="page"] { color: var(--brand-gold); }
.nav summary { list-style: none; display: flex; align-items: center; gap: .35rem; }
.nav summary::-webkit-details-marker { display: none; }
.nav summary::after { content: ""; width: .4rem; height: .4rem; border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); opacity: .6; transition: transform .2s; }
.nav details[open] > summary::after { transform: rotate(225deg) translateY(-1px); }
.nav details { position: relative; }
.nav details > ul { position: absolute; top: calc(100% + .7rem); left: 50%; translate: -50% 0; min-width: 16rem;
  list-style: none; margin: 0; padding: .5rem; background: rgb(12 17 34 / .96); border: 1px solid var(--night-line);
  border-radius: var(--radius-lg); box-shadow: 0 30px 60px -20px rgb(0 0 0 / .8); backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px); }
.nav details[open] > ul { animation: drop .18s var(--ease-out); }
@keyframes drop { from { opacity: 0; transform: translateY(-6px); } }
.nav details ul ul { position: static; translate: none; box-shadow: none; border: 0; padding: 0 0 0 .75rem; min-width: 0;
  background: none; backdrop-filter: none; }
.nav details li a { padding: .6rem .8rem; white-space: normal; border-radius: var(--radius-sm); font-weight: 500; }
.header-actions { display: flex; align-items: center; gap: .4rem; flex: none; margin-left: auto; }  /* on phones the menu is a drawer, so this keeps search, account and menu at the right edge */
.icon-button { display: inline-grid; place-items: center; width: var(--target); height: var(--target); border-radius: 999px;
  border: 1px solid var(--night-line); background: transparent; color: var(--night-text); cursor: pointer; padding: 0;
  box-shadow: none; min-height: 0; }
.icon-button:hover { background: rgb(255 255 255 / .08); color: var(--white); border-color: rgb(255 255 255 / .25); }
.icon-button svg { width: 20px; height: 20px; }
/* Header buttons: big, bold icons on a visible chip (Steve, 2026-10-17: "really weak and tiny"); labeled on desktop */
.header-actions .icon-button { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; text-decoration: none;
  border: 1.5px solid rgb(255 255 255 / .3); background: rgb(255 255 255 / .08); color: var(--white); transition: background .15s, border-color .15s; }
.header-actions .icon-button:hover, .header-actions .icon-button:focus-visible { background: rgb(255 194 38 / .16); border-color: var(--brand-gold); }
.header-actions .icon-button svg { width: 24px; height: 24px; stroke-width: 2.25; flex: none; }
.icon-button__label { display: none; font: 650 .95rem/1 var(--font-body); white-space: nowrap; }
@media (min-width: 64.0625rem) {
  .header-actions .icon-button--labeled { width: auto; padding: 0 1.05rem 0 .85rem; }
  .icon-button--labeled .icon-button__label { display: inline; }
  .header-actions .icon-button--labeled svg { width: 22px; height: 22px; }
}
.header-actions .header-cta { display: none; }
@media (min-width: 75rem) { .header-actions .header-cta { display: inline-flex; } }
.theme-toggle .when-light, .theme-toggle .when-dark, .theme-toggle .when-system { display: none; }
:root[data-theme-choice="light"] .theme-toggle .when-light,
:root[data-theme-choice="dark"] .theme-toggle .when-dark,
:root:not([data-theme-choice]) .theme-toggle .when-system,
:root[data-theme-choice="system"] .theme-toggle .when-system { display: block; }
.menu-toggle, .header-actions .menu-toggle { display: none; }

@media (max-width: 64rem) {
  .menu-toggle, .header-actions .menu-toggle { display: inline-flex; }
  .nav > ul { flex-direction: column; align-items: stretch; gap: .25rem; }
  .nav details > ul { position: static; translate: none; box-shadow: none; border: 0; padding: 0 0 .5rem .75rem;
    background: none; backdrop-filter: none; animation: none; }
  .nav a, .nav summary { padding: .85rem .5rem; font: 700 var(--step-2)/1.15 var(--font-display); letter-spacing: -.02em;
    border-radius: var(--radius-sm); }
  .nav details li a { font: 500 var(--step-0)/1.3 var(--font-body); padding: .6rem .5rem; }
  .brand img { height: 44px; }
}
@media (min-width: 64.01rem) { .nav-close { display: none; } }
:root:has(.nav.open) { overflow: hidden; }

/* ---------- Buttons ---------- */
button, .button { display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
  min-height: var(--target); padding: .65rem 1.3rem; border-radius: 999px; border: 1.5px solid var(--border);
  background: var(--surface); color: var(--heading); font: 650 var(--step-0)/1.15 var(--font-body); cursor: pointer;
  text-decoration: none; transition: background .18s, border-color .18s, transform .18s var(--ease-out), box-shadow .18s; }
button:hover, .button:hover { border-color: var(--heading); color: var(--heading); transform: translateY(-1px); }
button svg, .button svg { width: 1.1em; height: 1.1em; flex: none; }
.cta, .button.cta { background: var(--ember); color: var(--cta-text); border-color: transparent;
  box-shadow: 0 8px 24px -10px rgb(255 103 32 / .8); }
.cta:hover, .button.cta:hover { color: var(--cta-text); border-color: transparent; box-shadow: var(--glow); transform: translateY(-2px); }
.button.ghost { background: transparent; }
.button.small, button.small { min-height: 36px; padding: .4rem .9rem; font-size: var(--step--1); }
.button.big { min-height: 56px; padding: .9rem 1.8rem; font-size: var(--step-1); }
.on-night .button:not(.cta), .night .button:not(.cta) { background: rgb(255 255 255 / .06); color: var(--white);
  border-color: rgb(255 255 255 / .3); }
.on-night .button:not(.cta):hover, .night .button:not(.cta):hover { background: rgb(255 255 255 / .14); border-color: var(--white); }
.full { width: 100%; }
.mt { margin-top: .75rem; }
.buttons { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.arrow-link { font-weight: 650; text-decoration: none; display: inline-flex; align-items: center; gap: .35rem; }
.arrow-link::after { content: "→"; transition: transform .2s var(--ease-out); }
.arrow-link:hover::after { transform: translateX(4px); }

main { display: block; min-height: 50vh; }
.page-main { padding: 2.5rem 0 4rem; }
.section { padding-block: var(--section); }
.section.tight { padding-block: calc(var(--section) * .6); }
.section-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1rem 2rem;
  margin-bottom: clamp(1.5rem, 1rem + 2vw, 2.75rem); }
.section-head h2 { margin: 0; }
.section-head .lede { margin: .6rem 0 0; }

/* ---------- Night surfaces: heroes, bands ---------- */
.night { position: relative; isolation: isolate; background: var(--sky); color: var(--night-text); overflow: hidden; }
.night :is(h1, h2, h3, h4) { color: var(--white); }
.night .lede, .night .muted { color: var(--night-muted); }
.night a:not(.button) { color: var(--brand-gold); }
.night .eyebrow { color: var(--brand-gold); }
.night ::selection { background: rgb(255 194 38 / .35); }
.sky-canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; }
.stars { position: absolute; inset: 0; z-index: -2; opacity: .7;
  background-image: radial-gradient(1px 1px at 12% 18%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 27% 62%, #fff 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 43% 30%, #ffe9b0 50%, transparent 51%), radial-gradient(1px 1px at 58% 12%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 71% 48%, #fff 50%, transparent 51%), radial-gradient(1.5px 1.5px at 86% 22%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 93% 66%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 6% 74%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 36% 8%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 64% 78%, #fff 50%, transparent 51%);
  background-size: 640px 420px; }
.night-photo { position: absolute; inset: 0; z-index: -3; }
.night-photo img { width: 100%; height: 100%; object-fit: cover; }
.night-photo::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgb(5 7 15 / .55) 0%, rgb(5 7 15 / .35) 40%, rgb(13 18 48 / .85) 85%, #0a0f1f 100%); }
.ridge { display: block; width: 100%; height: clamp(56px, 6.25vw, 150px); color: var(--bg); margin-top: -1px; position: relative; z-index: 1; }
.ridge.to-night { color: var(--night-1); }

/* Home hero: fits the screen with room around it (Steve, 2026-10-17: "way too zoomed in") */
.hero-home { min-height: min(calc(100svh - 8rem), 50rem); display: grid; align-items: center; padding: clamp(2.5rem, 1.5rem + 3vw, 4.5rem) 0 0; }
.hero-home .container { padding-bottom: clamp(3rem, 2rem + 3vw, 5rem); }
.hero-home h1 { font-size: clamp(2.5rem, 1.25rem + 3.6vw, 4.75rem); line-height: .95; letter-spacing: -.04em; max-width: 14ch; margin: 0 0 1.1rem;
  text-shadow: 0 4px 40px rgb(5 7 15 / .6); }
.hero-home .lede { font-size: clamp(1.05rem, .95rem + .35vw, 1.25rem); max-width: 44ch; color: #d6dcec; }
.hero-home .button.big { font-size: var(--step-0); padding: .85rem 1.5rem; }
.hero-home .next-panel h2 { font-size: clamp(1.35rem, 1.1rem + .8vw, 1.75rem); }
.hero-home .countdown b { font-size: clamp(1.5rem, 1.1rem + 1.2vw, 2.1rem); }
.hero-home .buttons { margin-top: 1.75rem; }
.hero-hint { font-size: var(--step--2); letter-spacing: .12em; text-transform: uppercase; color: var(--night-muted);
  margin-top: 1.5rem; display: flex; align-items: center; gap: .5rem; }
.hero-hint::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--brand-gold);
  box-shadow: 0 0 12px var(--brand-gold); animation: pulse 2s infinite; }
@keyframes pulse { 50% { opacity: .35; } }
.hero-grid { display: grid; gap: 2rem; align-items: end; }
@media (min-width: 60rem) { .hero-grid { grid-template-columns: 1.35fr 1fr; } }

.page-hero { padding: clamp(3rem, 2rem + 5vw, 6.5rem) 0 clamp(2rem, 1rem + 3vw, 3.5rem); }
.page-hero h1 { font-size: var(--step-5); line-height: .95; letter-spacing: -.04em; margin: 0 0 1rem; max-width: 18ch; }
.page-hero .lede { margin: 0; }
.page-hero.compact h1 { font-size: var(--step-4); }
.page-hero .buttons { margin-top: 1.5rem; }

/* Breadcrumbs */
.breadcrumbs { font-size: var(--step--1); color: var(--text-muted); margin-bottom: 1.1rem; }
.breadcrumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: .35rem; margin: 0; padding: 0; }
.breadcrumbs li + li::before { content: "/"; margin-right: .35rem; opacity: .5; }
.breadcrumbs a { color: inherit; text-decoration: none; }
.breadcrumbs a:hover { text-decoration: underline; }
.night .breadcrumbs { color: var(--night-muted); }
.night .breadcrumbs a { color: var(--night-muted); }

/* ---------- Next-event panel + countdown ---------- */
.next-panel { position: relative; border-radius: var(--radius-xl); padding: clamp(1.25rem, 1rem + 1.5vw, 2rem);
  background: rgb(14 20 42 / .62); border: 1px solid rgb(255 255 255 / .14); backdrop-filter: blur(18px) saturate(1.3);
  -webkit-backdrop-filter: blur(18px) saturate(1.3); box-shadow: 0 40px 80px -30px rgb(0 0 0 / .8); }
.next-panel::before { content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1px; background: var(--sunset);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); opacity: .7; pointer-events: none; }
.next-panel h2 { font-size: var(--step-2); margin: .1rem 0 .35rem; }
.next-panel .meta { color: var(--night-muted); margin: 0; display: grid; gap: .2rem; font-size: var(--step--1); }
.next-panel .meta span { display: flex; align-items: center; gap: .45rem; }
.next-panel .meta svg { width: 1rem; height: 1rem; flex: none; color: var(--brand-gold); }
.next-panel .buttons { margin-top: 1.25rem; }
.status-pill { display: inline-flex; align-items: center; gap: .4rem; font: 700 var(--step--2)/1 var(--font-body);
  letter-spacing: .1em; text-transform: uppercase; padding: .45rem .7rem; border-radius: 999px;
  background: rgb(255 194 38 / .14); color: var(--brand-gold); border: 1px solid rgb(255 194 38 / .35); }
.status-pill.live { background: rgb(90 210 143 / .14); color: #7ff0ae; border-color: rgb(90 210 143 / .4); }
.status-pill.live::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor;
  animation: pulse 1.6s infinite; }
/* The countdown follows the theme on page content (a card on registration/closed.html) and is light on night surfaces
   (heroes, the next-event panel). Was white on white on the card (fixed 2026-10-19). */
.countdown { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; margin: 1.1rem 0 0; }
.countdown div { text-align: center; padding: .7rem .2rem .55rem; border-radius: var(--radius-md); background: var(--surface-2);
  border: 1px solid var(--border); min-width: 0; }
.countdown b { display: block; font: 800 var(--step-3)/1 var(--font-display); color: var(--heading); font-variant-numeric: tabular-nums;
  letter-spacing: -.03em; }
.countdown span { display: block; font-size: var(--step--2); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted);
  margin-top: .3rem; overflow-wrap: anywhere; }
.countdown-label { margin: 1rem 0 0; font-size: var(--step--1); color: var(--text-muted); }
.night .countdown div, .next-panel .countdown div { background: rgb(255 255 255 / .06); border-color: rgb(255 255 255 / .08); }
.night .countdown b, .next-panel .countdown b { color: var(--white); }
.night .countdown span, .night .countdown-label, .next-panel .countdown span, .next-panel .countdown-label { color: var(--night-muted); }
.card > .countdown-wrap > .countdown-label:first-child { margin-top: 0; font-weight: 650; color: var(--heading); }
@media (max-width: 30rem) { .countdown span { letter-spacing: 0; text-transform: none; } }  /* "Seconds" fits a quarter of a phone at 14px */

/* ---------- Marquee ---------- */
.marquee { overflow: hidden; border-block: 1px solid var(--border); background: var(--surface); padding: 1rem 0;
  mask: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee ul { display: flex; gap: 3rem; width: max-content; list-style: none; margin: 0; padding: 0;
  animation: marquee 40s linear infinite; }
.marquee li { font: 750 var(--step-1)/1 var(--font-display); letter-spacing: -.01em; white-space: nowrap; color: var(--heading);
  display: flex; align-items: center; gap: 3rem; }
.marquee li::after { content: "✦"; color: var(--brand-orange); font-size: .8em; }
.marquee:hover ul { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-50%); } }

/* ---------- Cards and grids ---------- */
.card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg);
  padding: clamp(1.1rem, 1rem + 1vw, 1.75rem); margin: 0 0 1.25rem; box-shadow: var(--shadow); }
.card > :first-child { margin-top: 0; }
.card.narrow { max-width: 30rem; margin-inline: auto; }
.grid { display: grid; gap: clamp(1rem, .8rem + 1vw, 1.5rem); grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); }
.grid.wide { grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); }
.grid.small { grid-template-columns: repeat(auto-fill, minmax(min(100%, 11rem), 1fr)); }
form.inline { display: inline; }

.lift { transition: transform .25s var(--ease-out), box-shadow .25s, border-color .25s; }
.lift:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: color-mix(in srgb, var(--accent) 40%, var(--border)); }

/* Bento tiles (home) */
.bento { display: grid; gap: clamp(.9rem, .7rem + 1vw, 1.4rem); grid-template-columns: 1fr; }
@media (min-width: 48rem) { .bento { grid-template-columns: repeat(6, 1fr); grid-auto-rows: minmax(15rem, auto); }
  .bento .t-wide { grid-column: span 4; } .bento .t-tall { grid-column: span 2; grid-row: span 2; }
  .bento .t-half { grid-column: span 3; } .bento .t-third { grid-column: span 2; } }
.tile { position: relative; isolation: isolate; overflow: hidden; border-radius: var(--radius-xl); padding: clamp(1.25rem, 1rem + 1.5vw, 2rem);
  display: flex; flex-direction: column; justify-content: flex-end; min-height: 15rem; color: var(--white);
  text-decoration: none; background: var(--night-2); border: 1px solid rgb(255 255 255 / .06); }
.tile img.bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2;
  transition: transform .8s var(--ease-out); }
.tile::after { content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgb(5 7 15 / .05) 20%, rgb(5 7 15 / .55) 55%, rgb(5 7 15 / .92) 100%); }
.tile:hover img.bg { transform: scale(1.05); }
.tile:hover { color: var(--white); }
.tile h3 { color: var(--white); margin: 0 0 .35rem; font-size: var(--step-2); }
.tile p { margin: 0; color: #d4dae8; max-width: 40ch; }
.tile .eyebrow { color: var(--brand-gold); margin-bottom: .6rem; }
.tile .arrow-link { color: var(--brand-gold); margin-top: .9rem; }
.tile.sunset { background: var(--sunset); }
.tile.sunset::after { background: linear-gradient(180deg, transparent, rgb(5 7 15 / .35)); }
.tile.sunset p { color: var(--white); }
.tile.sunset .eyebrow, .tile.sunset .arrow-link { color: var(--white); }
.tile.sunset .eyebrow::before { background: var(--white); }
.tile .big-num { font: 800 clamp(3rem, 2rem + 4vw, 5.5rem)/.9 var(--font-display); letter-spacing: -.05em; margin-bottom: .5rem; }

/* Event cards */
.event-card { display: grid; grid-template-rows: auto 1fr; border-radius: var(--radius-lg); overflow: hidden; background: var(--surface);
  border: 1px solid var(--border); text-decoration: none; color: inherit; box-shadow: var(--shadow); }
.event-card:hover { color: inherit; }
.event-card .poster { aspect-ratio: 16 / 10; background: var(--night-1); overflow: hidden; display: grid; place-items: center; }
.event-card .poster img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease-out); }
.event-card .poster.contain img { object-fit: contain; }
.event-card:hover .poster img { transform: scale(1.04); }
.event-card .body { padding: 1.1rem 1.25rem 1.35rem; display: grid; gap: .35rem; align-content: start; }
.event-card h3 { margin: 0; font-size: var(--step-1); }
.event-card .when { font-weight: 650; color: var(--accent); font-size: var(--step--1); }
.event-card .where { color: var(--text-muted); font-size: var(--step--1); }
.poster-fallback { width: 100%; height: 100%; display: grid; place-items: center; background: var(--sky); color: var(--white);
  font: 800 var(--step-3)/1 var(--font-display); letter-spacing: -.03em; text-align: center; padding: 1rem; }
.date-badge { display: grid; place-items: center; width: 4.25rem; height: 4.5rem; border-radius: var(--radius-md); background: var(--night-1);
  color: var(--white); text-align: center; flex: none; line-height: 1; }
.date-badge b { font: 800 var(--step-2)/1 var(--font-display); }
.date-badge span { font-size: var(--step--2); letter-spacing: .12em; text-transform: uppercase; color: var(--brand-gold); }

/* Timeline of events (events index) */
.event-row { display: grid; grid-template-columns: auto 1fr; gap: 1rem 1.25rem; align-items: center; padding: 1rem 0;
  border-bottom: 1px solid var(--border); text-decoration: none; color: inherit; }
.event-row:hover h3 { color: var(--accent); }
.event-row h3 { margin: 0 0 .2rem; font-size: var(--step-1); transition: color .15s; }
.event-row p { margin: 0; color: var(--text-muted); font-size: var(--step--1); }
.year-group h2 { font-size: var(--step-2); margin: 2.5rem 0 .5rem; display: flex; align-items: center; gap: 1rem; }
.year-group h2::after { content: ""; flex: 1; height: 1px; background: var(--border); }

/* Facts strip */
.facts { display: grid; gap: 1px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); border-radius: var(--radius-lg);
  overflow: hidden; border: 1px solid var(--night-line); background: var(--night-line); margin: 2rem 0 0; }
.facts div { background: rgb(10 15 31 / .75); padding: 1rem 1.2rem; }
.facts dt { font-size: var(--step--2); letter-spacing: .12em; text-transform: uppercase; color: var(--night-muted); }
.facts dd { margin: .25rem 0 0; font: 700 var(--step-1)/1.2 var(--font-display); color: var(--white); }
.facts { margin-inline: 0; }

/* ---------- Chips, badges, categories ---------- */
.chip { display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .7rem; border-radius: 999px; background: var(--chip-bg);
  font: 600 var(--step--2)/1.2 var(--font-body); letter-spacing: .02em; color: var(--text); white-space: nowrap; }
.chip::before { content: ""; width: .5rem; height: .5rem; border-radius: 50%; background: var(--cat, var(--text-muted)); }
.chip.plain::before { display: none; }
.cat-seminar { --cat: var(--cat-seminar); } .cat-workshop { --cat: var(--cat-workshop); } .cat-shooting { --cat: var(--cat-shooting); }
.cat-display { --cat: var(--cat-display); } .cat-pit { --cat: var(--cat-pit); } .cat-safety { --cat: var(--cat-safety); }
.cat-social { --cat: var(--cat-social); } .cat-meeting { --cat: var(--cat-meeting); } .cat-vendor { --cat: var(--cat-vendor); }
.cat-registration { --cat: var(--cat-registration); } .cat-demonstration { --cat: var(--cat-demonstration); }
.cat-lecture { --cat: var(--cat-lecture); } .cat-avlecture { --cat: var(--cat-avlecture); }
.flags { display: flex; flex-wrap: wrap; gap: .35rem; list-style: none; margin: 0; padding: 0; }
.flag { font: 650 var(--step--2)/1 var(--font-body); padding: .32rem .55rem; border-radius: 6px; border: 1px solid var(--border);
  color: var(--text-muted); letter-spacing: .03em; }
.flag.warn { border-color: color-mix(in srgb, var(--cat-safety) 60%, transparent); color: var(--cat-safety); }
.flag.kids { border-color: color-mix(in srgb, var(--cat-pit) 60%, transparent); color: var(--cat-pit); }
.flag.canceled { border-color: var(--danger); color: var(--danger); }
.badge { display: inline-block; padding: .12rem .6rem; border-radius: 999px; font-size: var(--step--1); border: 1px solid var(--border); }
.badge.active, .badge.published { border-color: var(--success); color: var(--success); }
.badge.revoked, .badge.expired { border-color: var(--danger); color: var(--danger); }

/* ---------- Schedule ---------- */
.schedule-tools { position: sticky; top: 4.5rem; z-index: 20; background: color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--border); padding: .9rem 0; }
.schedule-tools .row { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: center; }
.day-tabs { display: flex; gap: .4rem; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.day-tabs::-webkit-scrollbar { display: none; }
.day-tabs a, .day-tabs button { flex: none; display: grid; justify-items: center; gap: .1rem; min-width: 4.2rem; padding: .45rem .75rem;
  border-radius: var(--radius-md); border: 1.5px solid var(--border); background: var(--surface); color: var(--text);
  text-decoration: none; font: 600 var(--step--2)/1.1 var(--font-body); letter-spacing: .08em; text-transform: uppercase; min-height: 0; }
.day-tabs b { font: 800 var(--step-1)/1 var(--font-display); letter-spacing: -.02em; }
.day-tabs [aria-pressed="true"], .day-tabs [aria-current="true"] { background: var(--night-1); color: var(--white); border-color: var(--night-1); }
:root[data-theme="dark"] .day-tabs [aria-pressed="true"] { background: var(--brand-gold); color: var(--night-0); border-color: var(--brand-gold); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .day-tabs [aria-pressed="true"] {
  background: var(--brand-gold); color: var(--night-0); border-color: var(--brand-gold); } }
.filter-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.filter-chips button { min-height: 34px; padding: .3rem .75rem; font-size: var(--step--1); font-weight: 600; background: var(--surface);
  border: 1.5px solid var(--border); color: var(--text); gap: .4rem; }
.filter-chips button::before { content: ""; width: .55rem; height: .55rem; border-radius: 50%; background: var(--cat, var(--text-muted)); }
.filter-chips button[aria-pressed="true"] { border-color: var(--cat, var(--heading)); background: color-mix(in srgb, var(--cat, var(--heading)) 14%, var(--surface)); }
.filter-chips button:hover { transform: none; }
.search { position: relative; flex: 1 1 14rem; max-width: 22rem; }
.search svg { position: absolute; left: .85rem; top: 50%; translate: 0 -50%; width: 1.1rem; height: 1.1rem; color: var(--text-muted); pointer-events: none; }
.search input { padding-left: 2.5rem; border-radius: 999px; }

.day-block { padding-top: 2rem; }
.day-block > h2 { font-size: var(--step-3); margin: 0 0 1rem; display: flex; align-items: baseline; gap: .75rem; flex-wrap: wrap; }
.day-block > h2 small { font: 500 var(--step-0)/1 var(--font-body); color: var(--text-muted); letter-spacing: 0; }
.slot { display: grid; grid-template-columns: 5.5rem 1fr; gap: .25rem 1.25rem; padding: .25rem 0; position: relative; }
.slot + .slot { border-top: 1px dashed var(--border); padding-top: .9rem; margin-top: .65rem; }
.slot time { font: 750 var(--step-0)/1.2 var(--font-display); color: var(--heading); padding-top: 1rem; font-variant-numeric: tabular-nums; }
.slot .items { display: grid; gap: .65rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
@media (max-width: 36rem) { .slot { grid-template-columns: 1fr; } .slot time { padding-top: 0; } }
.session-card { position: relative; display: grid; grid-template-columns: auto 1fr; gap: .9rem; align-items: start; padding: .85rem;
  border-radius: var(--radius-md); background: var(--surface); border: 1px solid var(--border); text-decoration: none; color: inherit;
  border-left: 4px solid var(--cat, var(--border)); }
.session-card:hover { color: inherit; }
.session-card img.thumb { width: 4.5rem; height: 4.5rem; object-fit: cover; border-radius: 10px; background: var(--surface-2); }
.session-card h3 { font: 700 var(--step-0)/1.25 var(--font-display); letter-spacing: -.01em; margin: .35rem 0 .3rem; color: var(--heading); }
.session-card:hover h3 { color: var(--accent); }
.session-card .meta { font-size: var(--step--1); color: var(--text-muted); display: flex; flex-wrap: wrap; gap: .1rem .75rem; }
.session-card.is-canceled { border-style: dashed; border-left-style: solid; }
.session-card.is-canceled img.thumb { filter: grayscale(1); opacity: .5; }
.session-card.is-canceled h3 { text-decoration: line-through; }
.session-card.is-now { box-shadow: 0 0 0 2px var(--brand-gold), var(--shadow); }
.now-badge { display: none; }
.session-card.is-now .now-badge { display: inline-flex; }
.schedule-empty { padding: 3rem 0; text-align: center; color: var(--text-muted); }
[hidden] { display: none !important; }

table.schedule-table td, table.schedule-table th { font-size: var(--step--1); }
table.schedule-table td:first-child { white-space: nowrap; font-variant-numeric: tabular-nums; }

/* Session detail */
.detail-grid { display: grid; gap: clamp(1.5rem, 1rem + 3vw, 3.5rem); align-items: start; }
@media (min-width: 60rem) { .detail-grid { grid-template-columns: minmax(0, 1fr) 22rem; } .detail-grid--buy { grid-template-columns: minmax(0, 1fr) 30rem; } }
.detail-aside { position: sticky; top: 6rem; display: grid; gap: 1rem; }
.detail-aside .card { margin: 0; }
.kv { display: grid; gap: .8rem; margin: 0; }
.kv dt { font-size: var(--step--2); letter-spacing: .12em; text-transform: uppercase; color: var(--text-muted); }
.kv dd { margin: .15rem 0 0; font-weight: 600; }
.feature-img { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); margin: 0 0 2rem; }
.feature-img img { width: 100%; }

/* People */
.person-card { display: grid; justify-items: center; text-align: center; gap: .6rem; padding: 1.25rem .9rem; border-radius: var(--radius-lg);
  background: var(--surface); border: 1px solid var(--border); text-decoration: none; color: inherit; }
.person-card:hover { color: inherit; }
.person-card h3 { margin: 0; font-size: var(--step-0); letter-spacing: -.01em; }
.person-card p { margin: 0; color: var(--text-muted); font-size: var(--step--1); }
.avatar { width: 7rem; height: 7rem; border-radius: 50%; object-fit: cover; background: var(--sky); color: var(--white);
  display: grid; place-items: center; font: 800 var(--step-2)/1 var(--font-display); letter-spacing: -.02em;
  box-shadow: 0 0 0 3px var(--surface), 0 0 0 5px color-mix(in srgb, var(--brand-orange) 55%, transparent); }
.avatar.sm { width: 2.4rem; height: 2.4rem; font-size: var(--step--1); box-shadow: 0 0 0 2px var(--surface); }
.avatar.lg { width: 11rem; height: 11rem; font-size: var(--step-4); }
.avatar-stack { display: flex; align-items: center; }
.avatar-stack > * + * { margin-left: -.6rem; }
.people-inline { display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; list-style: none; margin: 0; padding: 0; }
.people-inline a { display: inline-flex; align-items: center; gap: .6rem; text-decoration: none; font-weight: 600; color: var(--heading); }
.people-inline a:hover { color: var(--accent); }
.person-hero { display: grid; gap: 2rem; align-items: center; }
@media (min-width: 48rem) { .person-hero { grid-template-columns: auto 1fr; } }

/* Tech Talks */
.talk-card { display: grid; grid-template-rows: auto 1fr; border-radius: var(--radius-lg); overflow: hidden; background: var(--surface);
  border: 1px solid var(--border); text-decoration: none; color: inherit; }
.talk-card:hover { color: inherit; }
.talk-card .thumb { position: relative; aspect-ratio: 16 / 9; background: var(--night-1); overflow: hidden; }
.talk-card .thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease-out); }
/* The picture is the background and the session's name sits on it (Steve, 2026-10-30): a darker foot on the picture keeps the words readable. */
.thumb--art::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgb(5 7 15 / 0) 30%, rgb(5 7 15 / .8) 100%); }
.thumb__title { position: absolute; left: 1rem; right: 1rem; bottom: .85rem; z-index: 2; color: #fff; font: 800 var(--step-1)/1.1 var(--font-display); letter-spacing: -.01em; text-wrap: balance; text-shadow: 0 2px 14px rgb(0 0 0 / .6); }
.page-hero--art { min-height: clamp(18rem, 12rem + 24vw, 28rem); display: grid; align-content: end; padding-top: clamp(4rem, 3rem + 7vw, 8rem); }
.page-hero--art .night-photo::after { background: linear-gradient(90deg, rgb(5 7 15 / .6) 0%, rgb(5 7 15 / .18) 50%, rgb(5 7 15 / 0) 78%), linear-gradient(180deg, rgb(5 7 15 / .2) 0%, rgb(5 7 15 / 0) 45%, rgb(5 7 15 / .55) 100%); }
.page-hero--art h1 { text-shadow: 0 3px 28px rgb(5 7 15 / .65); }
.page-hero--art .lede { text-shadow: 0 2px 16px rgb(5 7 15 / .7); }
.talk-card:hover .thumb img { transform: scale(1.05); }
.talk-card .play { position: absolute; inset: auto auto .75rem .75rem; display: inline-flex; align-items: center; gap: .4rem;
  padding: .35rem .7rem; border-radius: 999px; background: rgb(5 7 15 / .75); color: var(--white); font: 650 var(--step--2)/1 var(--font-body);
  backdrop-filter: blur(6px); }
.talk-card .play svg { width: .9rem; height: .9rem; }
.talk-card .body { padding: 1rem 1.15rem 1.25rem; display: grid; gap: .35rem; align-content: start; }
.talk-card h3 { margin: 0; font-size: var(--step-0); letter-spacing: -.01em; line-height: 1.25; }
.talk-card:hover h3 { color: var(--accent); }
.talk-card .meta { font-size: var(--step--1); color: var(--text-muted); }
.player { aspect-ratio: 16 / 9; background: #000; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); }
.player video { width: 100%; height: 100%; display: block; }
.locked { aspect-ratio: 16 / 9; border-radius: var(--radius-lg); overflow: hidden; position: relative; isolation: isolate;
  display: grid; place-items: center; text-align: center; padding: 1.5rem; color: var(--white); }
.locked img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; filter: blur(6px) brightness(.45); transform: scale(1.1); }
.locked h2 { color: var(--white); font-size: var(--step-2); margin: .5rem 0; }
.locked p { color: #d4dae8; margin: 0 auto 1rem; max-width: 40ch; }

/* Blog */
.post-feature { display: grid; gap: 1.5rem; align-items: center; text-decoration: none; color: inherit; margin-bottom: 2.5rem; }
@media (min-width: 52rem) { .post-feature { grid-template-columns: 1.2fr 1fr; gap: 3rem; } }
.post-feature .img { border-radius: var(--radius-xl); overflow: hidden; aspect-ratio: 16 / 10; background: var(--sky); }
.post-feature .img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease-out); }
.post-feature:hover .img img { transform: scale(1.03); }
.post-feature h2 { font-size: var(--step-3); margin: .25rem 0 .75rem; }
.post-feature:hover h2 { color: var(--accent); }
.post-list { display: grid; gap: clamp(1rem, .8rem + 1vw, 1.5rem); grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
.post-card { display: flex; flex-direction: column; overflow: hidden; padding: 0; text-decoration: none; color: inherit; margin: 0; }
.post-card:hover { color: inherit; }
.post-card .img { aspect-ratio: 16 / 9; background: var(--sky); overflow: hidden; }
.post-card .img img { width: 100%; height: 100%; object-fit: cover; }
.post-card .body { padding: 1.1rem 1.25rem 1.4rem; }
.post-card h2, .post-card h3 { font-size: var(--step-1); margin: .2rem 0 .4rem; }
.post-card:hover :is(h2, h3) { color: var(--accent); }
.post-meta { font-size: var(--step--1); color: var(--text-muted); }
.tags { display: flex; flex-wrap: wrap; gap: .4rem; list-style: none; padding: 0; margin: 1rem 0; }
.tags li { font-size: var(--step--1); padding: .15rem .6rem; border-radius: 999px; background: var(--chip-bg); }

/* ---------- Editorial pages (imported content) ---------- */
.article-head { padding: clamp(2.5rem, 2rem + 4vw, 5.5rem) 0 clamp(1.5rem, 1rem + 2vw, 2.5rem); }
.article-head h1 { font-size: var(--step-5); line-height: .95; letter-spacing: -.04em; max-width: 16ch; margin: 0 0 1rem; }
.article-head .lede { margin: 0; }
.article-head .buttons { margin-top: 1.5rem; }
.article-cover { margin: 0 0 clamp(2rem, 1.5rem + 2vw, 3.5rem); }
.article-cover img { width: 100%; max-height: 34rem; object-fit: cover; border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); }
.article { display: grid; gap: 3rem; align-items: start; padding-bottom: var(--section); }
@media (min-width: 70rem) { .article.has-toc { grid-template-columns: 14rem minmax(0, 1fr); } }
.toc { position: sticky; top: 6.5rem; font-size: var(--step--1); display: none; }
@media (min-width: 70rem) { .toc { display: block; } }
.toc p { font-size: var(--step--2); letter-spacing: .12em; text-transform: uppercase; color: var(--text-muted); margin: 0 0 .75rem; }
.toc ol { list-style: none; margin: 0; padding: 0 0 0 .9rem; border-left: 2px solid var(--border); display: grid; gap: .55rem; }
.toc a { color: var(--text-muted); text-decoration: none; display: block; line-height: 1.3; }
.toc a:hover, .toc a[aria-current="true"] { color: var(--accent); }
.flow { max-width: var(--prose); }
.flow > * + * { margin-top: 1.25rem; }
.flow > :first-child { margin-top: 0; }
.flow h2 { font-size: var(--step-3); margin-top: 3rem; }
.flow h3 { font-size: var(--step-2); margin-top: 2.25rem; }
.flow h4, .flow h5, .flow h6 { font-size: var(--step-1); margin-top: 1.75rem; }
.flow :is(h2, h3, h4) + * { margin-top: .6rem; }
.flow ul, .flow ol { padding-left: 1.25rem; }
.flow li + li { margin-top: .35rem; }
.flow li::marker { color: var(--brand-orange); }
.flow img { border-radius: var(--radius-md); }
.flow table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; font-size: var(--step--1); display: block; overflow-x: auto; }
.flow th, .flow td { border-bottom: 1px solid var(--border); padding: .6rem .5rem; text-align: left; vertical-align: top; }
.flow blockquote { margin: 1.5rem 0; padding: .25rem 0 .25rem 1.25rem; border-left: 4px solid var(--brand-orange);
  font: 500 var(--step-1)/1.45 var(--font-display); color: var(--heading); }
.flow iframe { width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; border-radius: var(--radius-md); }
.flow .prose > :first-child { margin-top: 0; }
.flow .prose > * + * { margin-top: 1.1rem; }
.flow strong { color: var(--heading); }
.flow > .split { max-width: none; }
.split { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); }
.split > div { padding: 1.25rem; border-radius: var(--radius-lg); background: var(--surface); border: 1px solid var(--border); }
.split > div > :first-child { margin-top: 0; }
.split > div > * + * { margin-top: .75rem; }
.split > div h2, .split > div h3, .split > div h4 { font-size: var(--step-1); }
.split > div img { border-radius: var(--radius-sm); max-height: 14rem; width: 100%; object-fit: cover; }
.split > div img.icon { width: 3.5rem; height: 3.5rem; object-fit: contain; }
.gallery { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 12rem), 1fr)); max-width: none; }
.gallery figure { margin: 0; }
.gallery img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius-md); }
.block-image { margin: 0; }
.block-image img { border-radius: var(--radius-lg); width: 100%; max-height: 30rem; object-fit: cover; }
.block-image figcaption { font-size: var(--step--1); color: var(--text-muted); margin-top: .5rem; }
.block-video { aspect-ratio: 16 / 9; }
.block-video iframe { width: 100%; height: 100%; border: 0; border-radius: var(--radius-lg); }
.callout { position: relative; border-radius: var(--radius-lg); padding: 1.25rem 1.4rem; background: var(--surface);
  border: 1px solid var(--border); overflow: hidden; }
.callout::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--sunset); }
.callout strong { display: block; color: var(--heading); font-family: var(--font-display); font-size: var(--step-1); margin-bottom: .25rem; }
.callout p { margin: 0; color: var(--text-muted); }
.related { border-top: 1px solid var(--border); padding-top: 2rem; margin-top: 3rem; }
.related h2 { font-size: var(--step-1); margin: 0 0 1rem; }
.link-cards { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); list-style: none; padding: 0; margin: 0; }
.link-cards a { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 1.15rem; border-radius: var(--radius-md);
  background: var(--surface); border: 1px solid var(--border); text-decoration: none; color: var(--heading); font-weight: 650; }
.link-cards a::after { content: "→"; color: var(--accent); transition: transform .2s var(--ease-out); }
.link-cards a:hover { border-color: var(--accent); }
.link-cards a:hover::after { transform: translateX(4px); }
.placeholder { border: 1.5px dashed var(--border); border-radius: var(--radius-lg); padding: 1.25rem; background: var(--surface);
  color: var(--text-muted); }
.placeholder strong { color: var(--heading); }

/* Join band */
.join-band { border-radius: var(--radius-xl); padding: clamp(2rem, 1.5rem + 3vw, 4rem); display: grid; gap: 1.5rem; align-items: center; }
@media (min-width: 52rem) { .join-band { grid-template-columns: 1.4fr auto; } }
.join-band h2 { font-size: var(--step-4); margin: 0 0 .5rem; }
.join-band p { margin: 0; }

/* ---------- Forms ---------- */
label { display: block; font-weight: 600; margin: .9rem 0 .3rem; }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=search], input[type=date], input[type=tel],
input[type=datetime-local], input[type=url], textarea, select {
  width: 100%; min-height: var(--target); padding: .6rem .9rem; border: 1.5px solid var(--field-border);
  border-radius: var(--radius-md); font: inherit; color: var(--text); background: var(--surface); }
input:focus, textarea:focus, select:focus { border-color: var(--focus); outline: none; box-shadow: 0 0 0 4px color-mix(in srgb, var(--focus) 22%, transparent); }
/* Checkboxes and radios (decision 2026-10-18): one drawn look on both themes instead of the browser's flat grey box.
   ~21px, a strong unchecked border, the accent (or --control-on) when checked, a focus ring for the keyboard. */
input[type=checkbox], input[type=radio] {
  appearance: none; -webkit-appearance: none; flex: none; display: inline-block; width: 1.3rem; height: 1.3rem; min-height: 0;
  margin: 0; padding: 0; vertical-align: -.28rem; border: 2px solid var(--control-border, var(--text-muted)); border-radius: .35rem;
  background: var(--surface) no-repeat center / 85%; box-shadow: none; cursor: pointer; color: inherit;
  transition: background-color .12s ease, border-color .12s ease, box-shadow .12s ease; }
input[type=radio] { border-radius: 50%; }
input[type=checkbox]:hover, input[type=radio]:hover { border-color: var(--control-on, var(--accent)); }
input[type=checkbox]:checked { border-color: var(--control-on, var(--accent)); background-color: var(--control-on, var(--accent)); background-image: var(--check-mark); }
input[type=checkbox]:indeterminate { border-color: var(--control-on, var(--accent)); background: linear-gradient(var(--surface), var(--surface)) center / 55% 2.5px no-repeat var(--control-on, var(--accent)); }
input[type=radio]:checked { border-color: var(--control-on, var(--accent)); background: var(--control-on, var(--accent)); box-shadow: inset 0 0 0 .22rem var(--surface); }
input[type=checkbox]:focus, input[type=radio]:not(:checked):focus { box-shadow: none; }  /* the outline marks keyboard focus */
input[type=radio]:checked:focus { box-shadow: inset 0 0 0 .22rem var(--surface); }
input[type=checkbox]:focus-visible, input[type=radio]:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; border-color: var(--control-on, var(--accent)); }
input[type=checkbox]:disabled, input[type=radio]:disabled { opacity: .45; cursor: not-allowed; }
input[type=checkbox][aria-invalid="true"], input[type=radio][aria-invalid="true"] { border-color: var(--danger); }
.check { display: flex; align-items: center; gap: .6rem; font-weight: 500; }
.hint { font-size: var(--step--1); color: var(--text-muted); margin: .3rem 0 0; }
.stack > * + * { margin-top: .8rem; }
.form-grid { display: grid; gap: 0 1.25rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); }
.divider { display: flex; align-items: center; gap: .75rem; color: var(--text-muted); margin: 1.4rem 0; }
.divider::before, .divider::after { content: ""; flex: 1; border-top: 1px solid var(--border); }
/* Alerts (decision 2026-10-19, the form toolkit): a 4px bar in the alert's color, a tinted background, its icon, and a bold
   first line (.alert__title, or a leading <b>/<strong>); body text stays the page's text color. Errors, success, warnings,
   and plain notes (blue). */
.alert { --alert: var(--info); --alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M12 11v6M12 7.5h.01'/%3E%3C/svg%3E");
  position: relative; border-radius: var(--radius-md); padding: .85rem 1rem .85rem 2.9rem; margin: 0 0 1rem; color: var(--text); line-height: 1.5;
  border: 1px solid color-mix(in srgb, var(--alert) 30%, transparent); border-left: 4px solid var(--alert);
  background: color-mix(in srgb, var(--alert) 9%, var(--surface)); }
.alert::before { content: ""; position: absolute; left: .85rem; top: .95rem; width: 1.35rem; height: 1.35rem; background: var(--alert);
  -webkit-mask: var(--alert-icon) center / contain no-repeat; mask: var(--alert-icon) center / contain no-repeat; }
.alert > :first-child { margin-top: 0; }
.alert > :last-child { margin-bottom: 0; }
.alert p { margin: .3rem 0 0; }
.alert ul { margin: .4rem 0 0; padding-left: 1.2rem; }
.alert > b:first-child, .alert > strong:first-child, .alert__title { display: block; font: 750 var(--step-0)/1.4 var(--font-body); color: var(--heading);
  letter-spacing: 0; margin: 0 0 .15rem; }
.alert.error { --alert: var(--danger); --alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M12 7v6M12 16.5h.01'/%3E%3C/svg%3E"); }
.alert.success { --alert: var(--success); --alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='m7.8 12.4 2.8 2.8 5.6-5.8'/%3E%3C/svg%3E"); }
.alert.warn { --alert: var(--warning); --alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.3 4.2 2.6 17.5A2 2 0 0 0 4.3 20.5h15.4a2 2 0 0 0 1.7-3L13.7 4.2a2 2 0 0 0-3.4 0z'/%3E%3Cpath d='M12 9.5v4M12 17h.01'/%3E%3C/svg%3E"); }
.dupe-check .buttons { margin: .75rem 0 .25rem; }
.secret { font-family: ui-monospace, monospace; background: var(--surface-2); padding: .2rem .5rem; border-radius: var(--radius-sm); }

/* ---------- Form toolkit (templates/shared/forms.html and steps.html; decision 2026-10-19) ---------- */
/* The error summary: focused and scrolled to on load (static/js/form-kit.js), clear of the sticky header. */
.error-summary { scroll-margin-top: 7rem; }
.error-summary:focus { outline: 3px solid var(--focus); outline-offset: 3px; }
.error-summary__list { list-style: none; padding: 0 !important; display: grid; gap: .3rem; }
.error-summary__list a { color: var(--danger); font-weight: 650; text-decoration: underline; text-underline-offset: .18em; }
.error-summary__list a:hover { text-decoration-thickness: 2px; }
/* One field: label, control, hint, message. A field with a problem gets a red bar on its left, like the summary. */
.field { min-width: 0; scroll-margin-top: 7rem; }
.field.has-error, .apply fieldset.field-group.has-error, .field-group.has-error { border-left: 4px solid var(--danger); padding-left: .85rem; }
.field.has-error > label { color: var(--heading); }
.optional { font-weight: 500; }
.field-error { display: flex; gap: .45rem; align-items: flex-start; color: var(--danger); font-weight: 650; font-size: var(--step--1); margin: .45rem 0 0; line-height: 1.4; }
.field-error svg { width: 1.1rem; height: 1.1rem; flex: none; margin-top: .1rem; }
.field-error:not(:has(svg))::before { content: ""; width: 1.1rem; height: 1.1rem; flex: none; margin-top: .1rem; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M12 7v6M12 16.5h.01'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M12 7v6M12 16.5h.01'/%3E%3C/svg%3E") center / contain no-repeat; }
[aria-invalid="true"] { border-color: var(--danger) !important; }
.field--check { margin: .9rem 0 0; }
.field--check .check { align-items: flex-start; margin: 0; line-height: 1.45; }
.field--check .check input { margin-top: .1rem; }
/* Radio and checkbox groups: a fieldset whose legend reads like a field label (not the card fieldsets' big heading). */
.field-group, .apply fieldset.field-group { border: 0; border-radius: 0; padding: 0; margin: 1rem 0 0; background: none; min-width: 0; scroll-margin-top: 7rem; }
.field-group > legend, .apply .field-group > legend { display: block; font: 600 var(--step-0)/1.35 var(--font-body); color: var(--heading); padding: 0; margin: 0 0 .4rem; }
.field-group > .hint { margin: -.15rem 0 .45rem; }
.field-group > .choices { margin-top: 0; }
.field-group.has-error .choice, .field-group.has-error .ticket-opt, .field-group.has-error .mfg-role, .field-group.has-error .mfg-site { border-color: color-mix(in srgb, var(--danger) 55%, var(--border)); }
/* "Tell us more (optional)": optional questions folded away so a long form is shorter on a phone. */
.more-fields { margin: 1.25rem 0 0; border: 1.5px dashed var(--field-border); border-radius: var(--radius-md); padding: 0 1rem; }
.more-fields > summary { cursor: pointer; min-height: var(--target); display: flex; align-items: center; gap: .6rem; font-weight: 700; color: var(--heading); list-style: none; }
.more-fields > summary::-webkit-details-marker { display: none; }
.more-fields > summary::before { content: "+"; display: inline-grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--chip-bg); font-size: 1.15rem; line-height: 1; }
.more-fields[open] > summary::before { content: "−"; }
.more-fields[open] { padding-bottom: 1rem; }
.more-fields > summary .muted { font-weight: 500; }
/* The stepper: numbered chips on wider screens; on phones "Step 2 of 6 · Tickets" over a thin segmented bar. */
.stepper { margin: 0 0 1.5rem; }
.stepper__now { display: none; margin: 0 0 .45rem; font-size: var(--step--1); font-weight: 650; color: var(--text-muted); }
.stepper__now b { color: var(--heading); font-size: var(--step-0); }
.stepper__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .45rem .5rem; }
.stepper__step { margin: 0; min-width: 0; }
.stepper__item, button.stepper__item { display: inline-flex; align-items: center; gap: .5rem; min-height: var(--target); padding: .3rem .95rem .3rem .35rem; border-radius: 999px;
  border: 1.5px solid var(--border); background: var(--surface); color: var(--text-muted); font: 650 var(--step--1)/1.2 var(--font-body); text-decoration: none;
  box-shadow: none; transform: none; }
button.stepper__item:disabled { cursor: default; opacity: 1; }
a.stepper__item:hover, button.stepper__item:not(:disabled):hover { border-color: var(--heading); color: var(--heading); transform: none; }
a.stepper__item:focus-visible, button.stepper__item:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.stepper__dot { width: 1.75rem; height: 1.75rem; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--chip-bg); color: var(--text);
  font: 800 .85rem/1 var(--font-display); }
.is-current > .stepper__item { border-color: var(--heading); color: var(--heading); font-weight: 750; }
.is-current .stepper__dot { background: var(--ember); color: var(--cta-text); }
.is-done > .stepper__item { color: var(--heading); }
.is-done .stepper__dot { background: var(--success); }
.is-done .stepper__num { display: none; }
.is-done .stepper__dot::before { content: ""; width: 1rem; height: 1rem; background: var(--surface);
  -webkit-mask: var(--check-mark) center / contain no-repeat; mask: var(--check-mark) center / contain no-repeat; }
.has-todo > .stepper__item { border-color: var(--warning); }
.has-todo .stepper__dot { box-shadow: inset 0 0 0 2px var(--warning); }
@media (max-width: 40rem) {
  .stepper__now { display: block; }
  .stepper__list { flex-wrap: nowrap; gap: 4px; }
  .stepper__step { flex: 1 1 0; }
  .stepper__item, button.stepper__item { position: relative; display: block; width: 100%; min-height: 1.6rem; padding: 0; border: 0; border-radius: 0; background: none; }
  .stepper__item::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 6px; margin-top: -3px; border-radius: 3px; background: var(--border); }
  .is-done > .stepper__item::after { background: var(--success); }
  .is-current > .stepper__item::after { background: var(--ember); }
  .has-todo:not(.is-current) > .stepper__item::after { background: var(--warning); }
  .stepper__dot, .stepper__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

/* ---------- Footer (night) ---------- */
.site-footer { background: var(--night-1); color: var(--night-muted); padding: 1rem 0 2rem; font-size: var(--step--1); position: relative; }
.site-footer .ridge-top { display: block; width: 100%; height: clamp(56px, 6.25vw, 150px); color: var(--night-1); margin-top: -1px;
  position: absolute; bottom: 100%; left: 0; }
.footer-hero { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 1.5rem;
  padding: 2.5rem 0 2.5rem; border-bottom: 1px solid var(--night-line); }
.footer-hero p.big { font: 800 var(--step-4)/.95 var(--font-display); letter-spacing: -.04em; color: var(--white); margin: 0; max-width: 14ch; }
.site-footer h2 { color: var(--white); font: 700 var(--step-0)/1.2 var(--font-display); margin: 0 0 .9rem; letter-spacing: 0; }
.site-footer a { color: var(--night-muted); text-decoration: none; }
.site-footer a:hover { color: var(--brand-gold); }
.site-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.footer-grid { display: grid; gap: 2rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); padding: 2.5rem 0; }
.footer-base { border-top: 1px solid var(--night-line); padding-top: 1.5rem; display: flex; flex-wrap: wrap; gap: .5rem 1.5rem;
  justify-content: space-between; }
.footer-base a { text-decoration: underline; text-underline-offset: .2em; }
main + .site-footer { margin-top: clamp(56px, 6.25vw, 150px); }

/* ---------- Tables (console and lists) ---------- */
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: .65rem .5rem; border-bottom: 1px solid var(--border); vertical-align: top; }
th { font-family: var(--font-display); color: var(--heading); font-weight: 700; }
.table-wrap { overflow-x: auto; }
.row-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.row-actions form { display: inline; }
.row-actions button { min-height: 36px; padding: .35rem .8rem; font-size: var(--step--1); }

/* ---------- Console ---------- */

/* ---------- Motion ---------- */
@supports (animation-timeline: view()) {
  .reveal { animation: rise linear both; animation-timeline: view(); animation-range: entry 0% cover 22%; }
  @keyframes rise { from { opacity: 0; transform: translateY(28px) scale(.98); } }
}
.fade-in { animation: fadein .7s var(--ease-out) both; }
.fade-in.d1 { animation-delay: .08s; } .fade-in.d2 { animation-delay: .16s; } .fade-in.d3 { animation-delay: .24s; }
@keyframes fadein { from { opacity: 0; transform: translateY(14px); } }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .25s; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
  @view-transition { navigation: none; }
}
@media print {
  .site-header, .site-footer, .env-strip, .buttons, .schedule-tools, .schedule-side, .schedule-bar, .schedule-status, .sky-canvas, .ridge, .toc { display: none !important; }
  body { font-size: 10.5pt; background: #fff; color: #000; }
  .night { background: none; color: #000; }
  .night :is(h1, h2, h3) { color: #000; }
  .session-card { break-inside: avoid; border: 1px solid #999; }
  a { color: inherit; }
}

/* Presenter wall on night sections */
.faces { gap: .9rem 1.6rem; }
.night .people-inline a { color: var(--white); font-weight: 550; }
.night .people-inline a:hover { color: var(--brand-gold); }
.faces .avatar.sm { width: 3.25rem; height: 3.25rem; box-shadow: 0 0 0 2px rgb(255 255 255 / .2); }
.join-band .lede { color: var(--night-muted); }
.year-group .h-year { font-size: var(--step-2); margin: 2.25rem 0 .25rem; display: flex; align-items: center; gap: 1rem; }
.year-group .h-year::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.event-row .row-title { margin: 0 0 .2rem; font-size: var(--step-1); transition: color .15s; }
.event-row:hover .row-title { color: var(--accent); }
.event-hero { min-height: min(86svh, 50rem); display: grid; align-items: end; }
.event-hero .tagline { font: 700 var(--step-2)/1.2 var(--font-display); margin: -.25rem 0 1rem; letter-spacing: -.02em; }
.event-hero h1 { margin-bottom: .5rem; }
.event-hero .night-photo img { opacity: .55; }
.cat-counts { gap: .5rem; }
.cat-counts .chip { font-size: var(--step--1); padding: .45rem .9rem; text-decoration: none; }
.cat-counts .chip:hover { background: color-mix(in srgb, var(--cat) 18%, var(--chip-bg)); }
.mt-lg { margin-top: 2rem; }
.h-small { font-size: var(--step-1); margin: 0 0 1rem; }
a.chip { text-decoration: none; }
a.chip[aria-current="page"] { background: var(--night-1); color: var(--white); }
.presenter-row { display: flex; gap: 1rem; align-items: center; padding: .9rem 0; text-decoration: none; color: inherit; }
.presenter-row + .presenter-row { border-top: 1px solid var(--border); }
.presenter-row .avatar { width: 4.5rem; height: 4.5rem; font-size: var(--step-1); flex: none; }
.presenter-row strong { display: block; font: 700 var(--step-1)/1.2 var(--font-display); color: var(--heading); }
.presenter-row:hover strong { color: var(--accent); }
.presenter-row .muted { display: block; font-size: var(--step--1); margin-top: .2rem; }
.session-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .25rem; }
.session-list a { display: grid; gap: .3rem; justify-items: start; padding: .7rem 0; text-decoration: none; color: inherit; border-bottom: 1px solid var(--border); }
.session-list li:last-child a { border-bottom: 0; }
.session-list strong { color: var(--heading); line-height: 1.3; }
.session-list a:hover strong { color: var(--accent); }
.session-list .muted { font-size: var(--step--1); }
.night .chip { background: rgb(255 255 255 / .1); color: var(--white); }
.person-hero .avatar.lg { box-shadow: 0 0 0 4px rgb(255 255 255 / .15), 0 0 60px -10px var(--brand-orange); }
.tile.t-wide::after, .tile.t-half::after { background: linear-gradient(90deg, rgb(5 7 15 / .82) 0%, rgb(5 7 15 / .35) 55%, transparent 80%),
  linear-gradient(180deg, transparent 40%, rgb(5 7 15 / .7) 100%); }
.tile .eyebrow { flex-wrap: wrap; }
/* The desert ridge sits on the bottom edge of night sections. */
.night > .ridge { position: absolute; left: 0; bottom: -1px; z-index: 1; }
.night.page-hero, .night.hero-home { padding-bottom: calc(clamp(56px, 6.25vw, 150px) + clamp(1.5rem, 1rem + 2vw, 3rem)); }
.search input[type=search] { padding-left: 2.6rem; border-radius: 999px; }
:root[data-theme="dark"] a.chip[aria-current="page"] { background: var(--brand-gold); color: var(--night-0); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) a.chip[aria-current="page"] { background: var(--brand-gold); color: var(--night-0); } }
@media (max-width: 40rem) {
  .schedule-tools { position: static; }
  .schedule-tools.is-folded { position: sticky; top: 4.5rem; padding: .55rem 0; }  /* folded, it's one compact bar: keep it handy */
  .filter-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--space) * -1); padding-inline: var(--space); }
  .filter-chips::-webkit-scrollbar { display: none; }
  .filter-chips button { flex: none; }
  .search { max-width: none; }
}
.night-photo img { opacity: .5; }
.flow img.icon, .split img.icon { width: 3.5rem; height: 3.5rem; object-fit: contain; border-radius: 0; box-shadow: none; }
.flow > a > img.icon, .flow > img.icon { margin-bottom: -.5rem; }



/* ---------- Membership tiers ---------- */
.tiers { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); align-items: stretch; }
.tier { position: relative; display: flex; flex-direction: column; gap: .6rem; padding: 1.5rem 1.35rem; border-radius: var(--radius-xl); background: var(--surface);
  border: 1px solid var(--border); box-shadow: var(--shadow); }
.tier h3 { margin: 0; font-size: var(--step-1); }
.tier .price { margin: 0; display: flex; align-items: baseline; gap: .4rem; }
.tier .price b { font: 800 var(--step-4)/1 var(--font-display); letter-spacing: -.04em; color: var(--heading); }
.tier .price span { color: var(--text-muted); font-size: var(--step--1); }
.tier p { margin: 0; color: var(--text-muted); font-size: var(--step--1); }
.tier .eligibility { display: flex; gap: .4rem; align-items: flex-start; font-size: var(--step--2); }
.tier .eligibility svg { width: 1rem; height: 1rem; flex: none; color: var(--accent); margin-top: .1rem; }
.tier .button { margin-top: auto; }
.tier.is-featured { background: var(--night-1); color: var(--night-text); border-color: transparent; box-shadow: var(--glow); }
.tier.is-featured h3, .tier.is-featured .price b { color: var(--white); }
.tier.is-featured p, .tier.is-featured .price span { color: var(--night-muted); }
.tier.is-featured .status-pill { position: absolute; top: -.8rem; left: 1.35rem; background: var(--night-2); }
.fineprint { margin-top: 1.25rem; font-size: var(--step--1); }
.checks { list-style: none; padding: 0; margin: .5rem 0 0; display: grid; gap: .45rem; }
.checks li { display: flex; gap: .55rem; align-items: flex-start; }
.checks li::before { content: "✦"; color: var(--brand-gold); flex: none; }
.tile.sunset .checks li::before { color: var(--white); }
.tile .checks { color: #e6eaf3; }
.tier { container-type: inline-size; }
.tier .price { flex-wrap: wrap; }
.tier .price b { font-size: clamp(1.9rem, 24cqi, 3.2rem); }

/* ---------- Application and renewal forms ---------- */
.apply fieldset { border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1.25rem 1.35rem 1.5rem; margin: 0 0 1.25rem; background: var(--surface); }
.apply legend { font: 750 var(--step-1)/1.2 var(--font-display); color: var(--heading); padding: 0 .5rem; display: flex; align-items: center; gap: .6rem; }
.apply legend > span:not(.tip):not(.muted) { display: inline-grid; place-items: center; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: var(--ember);
  color: var(--cta-text); font-size: var(--step--1); }
.choices { display: grid; gap: .6rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); margin-top: .5rem; }
/* Membership choices: two across (four make a 2×2, never 3 + 1); an odd last one spans the row (Steve, 2026-10-17) */
@media (min-width: 40rem) {
  .choices--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .choices--two > .choice:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
.choice { display: flex; gap: .7rem; align-items: flex-start; padding: .85rem 1rem; border: 1.5px solid var(--border); border-radius: var(--radius-md);
  cursor: pointer; font-weight: 400; margin: 0; transition: border-color .15s, background .15s; min-width: 0; }
.choice > span, .choice > div { min-width: 0; overflow-wrap: anywhere; }  /* a long label wraps inside its box, never past it */
.choice:hover { border-color: var(--accent); }
.choice:has(input:checked) { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, var(--surface)); }
.choice input { margin-top: .1rem; flex: none; }
.choice input.inline-amount { width: 6.5rem; height: auto; margin-top: 0; flex: none; }  /* the Other amount box, not a radio */
.choice small { display: block; color: var(--text-muted); margin-top: .2rem; font-size: var(--step--1); }
.price-tag { font-weight: 700; color: var(--accent); margin-left: .25rem; }
.when-q, .when-spouse { display: none; margin-top: 1rem; }
.apply:has(input[name=qualification][value=operator]:checked) .when-q[data-q=operator],
.apply:has(input[name=qualification][value=organization]:checked) .when-q[data-q=organization],
.apply:has(input[name=qualification][value=references]:checked) .when-q[data-q=references],
.apply:has(input[name=qualification][value=testimony]:checked) .when-q[data-q=testimony],
.apply:has(input[name=tier][value=spouse]:checked) .when-spouse { display: block; }
.apply .when-student { display: none; }
.apply:has(input[name=tier][value=student]:checked) .when-student { display: block; }
.form-grid .span-2 { grid-column: 1 / -1; }
.agree { margin: 1rem 0; }
.simulate { margin-top: 3rem; text-align: center; }
.simulate .buttons { justify-content: center; margin-top: 1.25rem; }
ul.plain { list-style: none; padding: 0; }
@supports not selector(:has(a)) { .when-q, .when-spouse, .apply .when-student { display: block; } }

/* ---------- Waivers and policies ---------- */
.policy { max-height: 22rem; overflow-y: auto; padding: 1rem 1.15rem; border: 1px solid var(--border); border-radius: var(--radius-md);
  background: var(--bg); font-size: var(--step--1); line-height: 1.6; }
.policy > :first-child { margin-top: 0; }
.policy h2, .policy h3 { font-size: var(--step-1); }
.policy-block { margin: 1rem 0 .5rem; }
.policy-block summary { cursor: pointer; font: 700 var(--step-0)/1.3 var(--font-display); color: var(--heading); padding: .4rem 0; }
.policy-block .policy { margin-top: .5rem; }
.when-party, .when-kind { display: none; margin-top: 1rem; }
.apply:has(input[name=party][value=family]:checked) .when-party[data-party~=family],
.apply:has(input[name=party][value=couple]:checked) .when-party[data-party~=couple],
.apply:has(input[name=kind][value=helper]:checked) .when-kind,
.apply:has(input[name=kind][value=jline]:checked) .when-kind { display: block; }
@supports not selector(:has(a)) { .when-party, .when-kind { display: block; } }
.signature-type { font: 500 1.35rem/1.2 "Bradley Hand", "Segoe Script", "Brush Script MT", cursive; }
.sigpad { display: grid; gap: .4rem; justify-items: start; }
.sigpad canvas { width: 100%; max-width: 600px; height: auto; aspect-ratio: 600 / 140; border: 1.5px dashed var(--border); border-radius: var(--radius-md);
  background: var(--surface); touch-action: none; cursor: crosshair; }
/* Chips (days, short options): they wrap, share each row, and are never narrower than their label ("Wednesday" with its
   box), so a label can't run out of its chip at any width (decision 2026-10-18). */
.choices.chips { display: flex; flex-wrap: wrap; }
.choices.chips .choice { flex: 1 1 8.5rem; min-width: fit-content; align-items: center; padding: .75rem .85rem; gap: .6rem; }
.choices.chips .choice > span { overflow-wrap: normal; }
.mb { margin-bottom: 1.25rem; }
.callout :is(p, li) strong { display: inline; font: inherit; font-weight: 700; margin: 0; color: var(--heading); }
.callout h3 { margin: 0 0 .5rem; font-size: var(--step-1); }
.callout ul { margin: .5rem 0 0; padding-left: 1.2rem; color: var(--text-muted); }

/* ---------- My Account ---------- */
.account { display: grid; gap: 1.25rem; }
.account .card { margin: 0; }
.account .card > h2 { font-size: var(--step-2); margin: 0 0 1rem; }
.jump-links { display: flex; gap: .5rem; flex-wrap: wrap; }
.jump-links a { padding: .4rem .85rem; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); text-decoration: none;
  font-size: var(--step--1); font-weight: 600; color: var(--heading); }
.jump-links a:hover { border-color: var(--accent); color: var(--accent); }
.people-list { list-style: none; padding: 0; margin: 0 0 .75rem; display: grid; gap: .1rem; }
.people-list li { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem 0; border-bottom: 1px solid var(--border); }
.add-person summary { cursor: pointer; font-weight: 650; color: var(--accent); margin: .5rem 0; }
.orders-mini { width: 100%; border-collapse: collapse; font-size: var(--step--1); }
.receipt { max-width: 44rem; margin: 2rem auto; }
.receipt header { display: flex; gap: 1rem; align-items: center; justify-content: space-between; margin-bottom: 1.25rem; }
.receipt h1 { font-size: var(--step-3); margin: 0; text-align: right; }
.receipt header p { margin: 0; text-align: right; }
.receipt tfoot th { border-top: 2px solid var(--heading); }
.orders-mini .num, .orders-mini td.num { text-align: right; font-variant-numeric: tabular-nums; }
.card-wrap { max-width: 34rem; margin: 2.5rem auto; }
.center { text-align: center; justify-content: center; }
/* Membership card (membership/_card.html): sized in container units so it is the same card at any width. */
.member-id-frame { container-type: inline-size; width: 100%; max-width: 30rem; margin-inline: auto; }
.member-id { position: relative; overflow: hidden; aspect-ratio: 1.586; border-radius: 4.6cqw; padding: 5.2cqw 5.6cqw 5cqw;
  color: #fff; background: radial-gradient(120% 90% at 50% 120%, #4a2163 0%, #241443 28%, #0d1230 58%, #05070f 100%);
  border: 1px solid rgba(255, 194, 38, .35); box-shadow: var(--shadow-lg), var(--glow);
  display: grid; grid-template-rows: auto 1fr auto; }
.member-id::after { content: ""; position: absolute; inset: auto -10% -38% -10%; height: 62%; z-index: 0; opacity: .32;
  background: linear-gradient(100deg, #6d3fa0 0%, #d23c7c 35%, #ff6720 68%, #ffc226 100%); filter: blur(28px); }
.member-id > * { position: relative; z-index: 1; min-width: 0; }
.member-id__top { display: flex; justify-content: space-between; align-items: center; gap: 3cqw; }
.member-id__top img { height: 10.5cqw; width: auto; display: block; }
.member-id__top span { font: 700 2.9cqw/1 var(--font-body); letter-spacing: .14em; text-transform: uppercase; color: #ffc226; text-align: right; }
.member-id__who { display: flex; align-items: center; gap: 3.2cqw; align-self: center; }
.member-id__photo { width: 13cqw; height: 13cqw; border-radius: 50%; object-fit: cover; flex: none; border: .5cqw solid rgba(255, 255, 255, .7); }
.member-id__name { margin: 0; font: 800 7.6cqw/1.02 var(--font-display); letter-spacing: -.025em; overflow: hidden;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; }
.member-id--m .member-id__name { font-size: 6.4cqw; }
.member-id--l .member-id__name { font-size: 5.3cqw; }
.member-id__bottom { display: flex; justify-content: space-between; align-items: flex-end; gap: 3cqw; }
.member-id dl { display: flex; gap: 4.4cqw; margin: 0; }
.member-id dt { font: 600 2.3cqw/1.1 var(--font-body); letter-spacing: .12em; text-transform: uppercase; color: #aab4cc; white-space: nowrap; }
.member-id dd { margin: 1cqw 0 0; font: 700 3.8cqw/1.1 var(--font-body); font-variant-numeric: tabular-nums; white-space: nowrap; }
.member-id__qr { flex: none; width: 21cqw; background: #fff; border-radius: 2cqw; padding: .9cqw; }
.member-id__qr svg { width: 100%; height: auto; display: block; }
.verify { margin-top: 3rem; text-align: center; border-top: 6px solid var(--success); }
.verify.is-no { border-top-color: var(--danger); }
@media print { .noprint { display: none !important; } .member-id { box-shadow: none; -webkit-print-color-adjust: exact; print-color-adjust: exact; } .receipt { box-shadow: none; border: 0; } }
.gold-wall { list-style: none; padding: 0; margin: 0; columns: 16rem auto; column-gap: 2rem; }
.gold-wall li { break-inside: avoid; padding: .45rem 0; border-bottom: 1px solid var(--border); font-weight: 600; }
.gold-wall li::before { content: "✦ "; color: var(--brand-gold); }


/* Event registration (its steps: the one .stepper, form toolkit) */
.reg-grid { display: grid; gap: 2rem; grid-template-columns: minmax(0, 1fr) 18rem; align-items: start; }
@media (max-width: 860px) { .reg-grid { grid-template-columns: 1fr; } .reg-aside { position: static; } .reg-main { padding-bottom: 4.5rem; } }
.reg-aside { position: sticky; top: 5.5rem; display: grid; gap: .75rem; }
.reg-aside .h-small { margin: 0; }
.badge-card { --badge: var(--brand-navy); position: relative; border-radius: var(--radius-md); background: var(--surface); border: 1px solid var(--border);
  box-shadow: var(--shadow); overflow: hidden; padding: 0 0 .75rem; text-align: center; }
.badge-card__top { display: flex; align-items: center; gap: .5rem; padding: .45rem .75rem; background: var(--badge); color: var(--white);
  font-size: var(--step--2); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.badge-card__top img { height: 1.2rem; width: auto; }
.badge-card__name { font-family: var(--font-display); font-size: var(--step-2); font-weight: 760; color: var(--heading); padding: .7rem .75rem .1rem; line-height: 1.1; overflow-wrap: anywhere; }
.badge-card__type { display: inline-block; font-size: var(--step--2); font-weight: 700; color: var(--white); background: var(--badge); border-radius: 999px;
  padding: .15rem .6rem; text-transform: uppercase; letter-spacing: .05em; }
.badge-card--spouse { --badge: var(--dusk-violet); }
.badge-card--guest { --badge: var(--brand-red); }
.badge-card--child, .badge-card--student { --badge: var(--success); }
.badge-card--staff { --badge: var(--brand-orange); }
.badge-card--vendor { --badge: var(--brand-ink); }
.badge-row { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); margin-bottom: 1rem; }
.person-pick { padding: .75rem 0; border-top: 1px solid var(--border); }
.person-pick:first-of-type { border-top: 0; }
.new-person + .new-person { border-top: 1px dashed var(--border); padding-top: .5rem; }
.guest-row { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: .5rem .8rem; margin: .5rem 0; }
.guest-row > summary { cursor: pointer; font-weight: 650; }
.why-not { margin-top: .5rem; font-size: var(--step--1); color: var(--text-muted); }
.why-not > summary { cursor: pointer; }
.qty-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .5rem 0; border-top: 1px solid var(--border); }
.qty-row input { width: 5rem; }
.qty-row small { display: block; }
.goods { display: grid; gap: 1rem; }
.good { display: grid; grid-template-columns: 7rem 1fr; gap: 1rem; align-items: start; }
.good img { width: 7rem; height: 7rem; object-fit: cover; border-radius: var(--radius-sm); }
.sizes { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .5rem; }
.size { display: grid; gap: .2rem; text-align: center; font-weight: 650; font-size: var(--step--1); }
.size input { width: 4.2rem; text-align: center; }
.donation .choice { min-width: 6rem; }
.inline-amount { width: 6rem; display: inline-block; margin-left: .4rem; }
.policy-scroll { max-height: 22rem; overflow: auto; padding: 1rem; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); margin-bottom: 1rem; }
.lede-sm { font-size: var(--step-0); color: var(--text-muted); }
.volunteer-ask { border: 2px solid var(--cta); margin-bottom: 2rem; }
.volunteer-ask h2 { margin-top: 0; }

/* Volunteers */
.volunteer-party { border: 2px solid var(--cta); margin-bottom: 2rem; }
.volunteer-party h2 { margin-top: 0; }
.volunteer-nudge { font-weight: 700; color: var(--heading); margin: 1rem 0 0; }
.vparty { list-style: none; padding: 0; margin: 0; display: grid; gap: .6rem; }
.vparty > li { padding: .7rem 1rem; border-radius: var(--radius-sm); border: 1.5px solid var(--border); }
.vparty > li.needs-shift { border-color: var(--danger); }
.vparty__who { display: flex; flex-wrap: wrap; gap: .6rem; align-items: baseline; justify-content: space-between; }
.vparty > li.needs-shift .vparty__who span { color: var(--danger); font-weight: 700; }
.vparty > li.has-shift .vparty__who span { color: var(--success); font-weight: 700; }
.vparty__how { margin: 0 0 .75rem; }
.vparty__pick { cursor: pointer; justify-content: flex-start; margin: 0; font-weight: inherit; }
.vparty__pick b { flex: 1; }
.vparty__pick > span { text-align: right; }
.vparty > li:has(.vparty__pick .vcheck:checked) { border-color: var(--cta); box-shadow: 0 0 0 1px var(--cta); }
/* A plain, thick checkbox (no inherited field box): empty square, gold with a check when on. */
input.vcheck { appearance: none; -webkit-appearance: none; flex: none; width: 1.5rem; height: 1.5rem; min-height: 0; margin: 0; padding: 0;
  border: 2px solid var(--text-muted); border-radius: .4rem; background: transparent no-repeat center / 1rem; box-shadow: none; cursor: pointer;
  transition: background-color .12s ease, border-color .12s ease; }
input.vcheck:hover { border-color: var(--cta); }
input.vcheck:checked { border-color: var(--cta); background-color: var(--cta);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3L13 4.5' fill='none' stroke='%23101820' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
input.vcheck:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.vparty > li.vparty__other { border-style: dashed; }
.vparty__other .vparty__pick { flex-wrap: wrap; }
.vparty__other .vparty__pick > span { flex-basis: 100%; text-align: left; padding-left: 2.1rem; font-size: var(--step--1); }
.vparty__fields { display: none; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: .25rem 1rem; margin-top: .75rem; }
.vparty__fields .hint { grid-column: 1 / -1; margin: .25rem 0 0; }
.vparty__other:has(input[data-other]:checked) .vparty__fields { display: grid; }
.vparty__shifts { list-style: none; padding: 0; margin: .5rem 0 0; display: grid; gap: .3rem; }
.vparty__shifts li { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; justify-content: space-between; font-size: var(--step--1); }
.vjump { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1.25rem; }
.vjump .chip { text-decoration: none; font-weight: 650; }
.vjob { margin-bottom: 1.25rem; scroll-margin-top: 5rem; }
.vjob__head { display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; align-items: center; }
.vjob__pic { width: 84px; height: 84px; flex: none; border-radius: 22px; box-shadow: 0 6px 18px -8px rgb(13 21 48 / .5); }
.vjob__name { flex: 1 1 14rem; }
.vjob__about { font-size: var(--step-0); line-height: 1.6; max-width: 62rem; }
.vjob__head h2 { margin: 0; }
.vjob__head p { margin: .2rem 0 0; }
.vjob__fill { display: grid; gap: .3rem; min-width: 12rem; font-size: var(--step--1); text-align: right; margin-left: auto; }
.vjob__fill .meter { width: 100%; }
.vjob__about { margin: .75rem 0 0; }
.vjob__days { display: grid; gap: 1rem; margin-top: 1.25rem; }
.vjob__day { display: grid; grid-template-columns: 6.5rem 1fr; gap: 1rem; align-items: start; padding-top: 1rem; border-top: 1px solid var(--border); }
.vjob__day h3 { margin: .45rem 0 0; font-size: var(--step-0); }
.vjob__day h3 span { display: block; font-weight: 500; color: var(--text-muted); font-size: var(--step--1); }
.vslots { display: grid; grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr)); gap: .9rem 1rem; }
.vslot { position: relative; display: grid; align-content: start; gap: .1rem; margin: 0; min-height: 4.4rem; padding: .6rem .8rem; border-radius: var(--radius-sm); border: 1.5px solid var(--border);
  background: var(--surface); cursor: pointer; line-height: 1.25; }
.vslot input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
/* Controls drawn by their label keep the real box invisible in every state: the drawn checkbox (decision 2026-10-18) is
   more specific when disabled or checked, and drew a box over a Full shift's time (fixed 2026-10-19). */
.vslot input[type=checkbox], .vslot input[type=checkbox]:disabled, .vslot input[type=checkbox]:checked,
.vslot input[type=radio], .vslot input[type=radio]:disabled, .vslot input[type=radio]:checked { opacity: 0; width: 100%; height: 100%; border: 0; }
.gift__chip input:is([type=checkbox], [type=radio]):is(:disabled, :checked, :hover),
.gift__toggle input:is([type=checkbox], [type=radio]):is(:disabled, :checked, :hover),
.gift__org input:is([type=checkbox], [type=radio]):is(:disabled, :checked, :hover),
.pres-pill input:is([type=checkbox], [type=radio]):is(:disabled, :checked, :hover) { opacity: 0; width: 1px; height: 1px; }
.vslot__t { font-weight: 700; font-variant-numeric: tabular-nums; }
.vslot__t { font-size: var(--step-0); }
.vslot__n { font-size: var(--step--1); color: var(--text-muted); }
.vslot__who { font-size: var(--step--1); color: var(--heading); font-weight: 600; line-height: 1.3; padding-top: .2rem; margin-top: .15rem; border-top: 1px dashed var(--border); }
.vslot:has(input:checked) .vslot__who { color: var(--cta-text); border-color: rgb(0 0 0 / .2); }
.vslot:hover { border-color: var(--cta); }
.vslot:has(input:checked) { background: var(--cta); border-color: var(--cta); color: var(--cta-text); }
.vslot:has(input:checked) .vslot__n { color: var(--cta-text); }
.vslot:has(input:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }
.vslot.is-mine { border-color: var(--success); }
.vslot.is-mine .vslot__n { color: var(--success); font-weight: 700; }
.vslot.is-full { opacity: .5; cursor: not-allowed; }
.vslot.is-full input { cursor: not-allowed; }
.vdetails { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: .5rem 1rem; }
.vbar { position: sticky; bottom: 0; z-index: 5; display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; justify-content: space-between;
  margin-top: 1rem; padding: .8rem 1rem; border-radius: var(--radius-sm) var(--radius-sm) 0 0; background: var(--surface); border: 1.5px solid var(--border);
  box-shadow: var(--shadow-lg); }
.vbar.is-ready { border-color: var(--cta); }
.vbar__count { font-weight: 700; }
.vbar__warn { flex: 1 1 16rem; font-size: var(--step--1); color: var(--danger); font-weight: 600; }
.vslot.is-short { outline: 3px solid var(--danger); outline-offset: 1px; }
.vbar__who { display: inline-flex; gap: .5rem; align-items: center; margin: 0; }
.vbar__who select { width: auto; }
@media (max-width: 700px) { .vjob__day { grid-template-columns: 1fr; gap: .3rem; } .vjob__fill { text-align: left; }
  .vslots { grid-template-columns: repeat(auto-fill, minmax(8.4rem, 1fr)); gap: .7rem; } .vslot { padding: .5rem .6rem; min-height: 3.8rem; }
  .vjob__pic { width: 64px; height: 64px; border-radius: 18px; } .vjob__fill { margin-left: 0; width: 100%; }
  .vbar { flex-wrap: nowrap; padding: .6rem .75rem; } .vbar__count { font-size: var(--step--1); } .vbar .button { flex: none; } }

/* ---------- Scene: standalone pages (sign-in, stage gate) over a fireworks photo, card centered ---------- */
body.scene-page { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh;
  background: var(--scene-scrim), var(--scene-image) center / cover no-repeat fixed, var(--night-0); }
.scene { flex: 1; display: grid; place-items: center; padding: clamp(1.5rem, 1rem + 4vw, 4rem) 16px; }
.scene > .container { width: 100%; padding-inline: 0; }
.scene .card { margin-bottom: 0; background: var(--scene-glass); border-color: rgb(255 255 255 / .16); box-shadow: var(--shadow-lg);
  -webkit-backdrop-filter: blur(18px) saturate(1.3); backdrop-filter: blur(18px) saturate(1.3); }
/* Compact: the whole sign-in card fits on a laptop screen without scrolling */
.scene { padding-block: clamp(1rem, .5rem + 2.5vh, 2.5rem); }
.scene .card h1 { font-size: var(--step-2); line-height: 1.05; margin-bottom: .9rem; }
.scene .card.signin .stack > * + * { margin-top: .6rem; }
.scene .card.signin .divider { margin: .9rem 0; }
.signin__label-row { display: flex; justify-content: space-between; align-items: baseline; gap: .75rem; flex-wrap: wrap; }
.signin__label-row label { margin: 0; }
.signin__forgot { font-size: .88rem; font-weight: 600; color: var(--text-muted); text-decoration: none; padding: .35rem 0; }
.signin__forgot:hover, .signin__forgot:focus-visible { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
/* Ways out under the sign-in card: find an existing account, or apply (2026-10-17) */
.signin__help { display: grid; gap: .5rem; margin-top: 1.1rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.signin__option { display: grid; grid-template-columns: 2.25rem 1fr; gap: .75rem; align-items: center; padding: .7rem .8rem; border-radius: var(--radius-md);
  color: var(--text); text-decoration: none; border: 1px solid transparent; transition: background .15s, border-color .15s; }
.signin__option:hover, .signin__option:focus-visible { background: color-mix(in srgb, var(--surface) 70%, transparent); border-color: var(--border); }
.signin__option > svg { width: 2.25rem; height: 2.25rem; padding: .45rem; border-radius: 50%; color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); }
.signin__option b { display: block; font-size: .98rem; }
.signin__option small { display: block; color: var(--text-muted); font-size: .85rem; line-height: 1.35; margin-top: .1rem; }
.signin__badge { display: grid; place-items: center; width: 3rem; height: 3rem; margin-bottom: .75rem; border-radius: 50%; color: var(--accent);
  background: color-mix(in srgb, var(--accent) 12%, transparent); }
.signin__badge svg { width: 1.5rem; height: 1.5rem; }
.signin__lede { color: var(--text-muted); margin: 0 0 1rem; }
.signin__back { margin: 1rem 0 0; font-size: .9rem; } .signin__back a { color: var(--text-muted); font-weight: 600; text-decoration: none; }
.signin__back a:hover { color: var(--accent); }
/* The standard footer under scene pages */
.scene-foot { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .5rem 1rem;
  padding: .8rem 16px 1rem; font-size: .8rem; color: rgb(255 255 255 / .82); background: rgb(5 7 15 / .55);
  border-top: 1px solid rgb(255 255 255 / .12); }
.scene-foot.is-stage { border-top: 3px solid #e5383b; }
.scene-foot__right { display: inline-flex; align-items: center; gap: .6rem; }
.scene-foot__env { font-weight: 700; color: #ff8a8a; }
.scene-foot .version-badge { color: inherit; border-color: rgb(255 255 255 / .3); }
.scene-foot .bug-button { color: inherit; }
.scene-foot__left { display: inline-flex; align-items: center; gap: .4rem; min-width: 0; white-space: nowrap; }
.scene-foot__short { display: none; text-decoration: none; }
@media (max-width: 40rem) {  /* phones: one row; the stage strip on top already says Stage */
  .scene-foot { flex-wrap: nowrap; gap: .6rem; padding: .6rem 16px; font-size: .75rem; }
  .scene-foot__long, .scene-foot__env { display: none; }
  .scene-foot .scene-foot__short { display: inline; }
  .scene-foot .version-badge { overflow: hidden; text-overflow: ellipsis; max-width: 11rem; }
}
@media (max-width: 900px) {
  /* smaller file on phones; fixed backgrounds are janky on mobile Safari */
  body.scene-page { background: var(--scene-scrim), var(--scene-image-sm) center / cover no-repeat, var(--night-0); }
}
.choice.is-disabled { opacity: .55; cursor: not-allowed; }

.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Help tips on the public site (same macro as the console) */
.tip { position: relative; display: inline-flex; vertical-align: middle; align-self: center; flex: none; margin-left: .3rem; }
.tip .tip__btn { all: unset; box-sizing: border-box; width: 1.2rem; height: 1.2rem; border-radius: 50%; display: inline-grid; place-items: center;
  font: 700 .72rem/1 var(--font-body); color: var(--text-muted); border: 1px solid var(--border); background: var(--surface); cursor: help; }
.tip .tip__btn:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.tip__text { display: none; position: absolute; z-index: 70; left: 50%; bottom: calc(100% + .5rem); transform: translateX(-50%); width: max-content;
  max-width: min(18rem, 80vw); padding: .5rem .7rem; border-radius: var(--radius-sm); background: var(--night-2); color: var(--night-text);
  font: 500 var(--step--1)/1.45 var(--font-body); text-align: left; box-shadow: var(--shadow-lg); }
.tip__text a { color: var(--brand-gold); }
.tip:hover .tip__text, .tip__btn:focus + .tip__text, .tip:focus-within .tip__text { display: block; }
.tip.tip--start .tip__text { left: 0; transform: none; }
.tip.tip--start .tip__text::after { left: 9px; margin-left: 0; }
.tip.tip--end .tip__text { left: auto; right: 0; transform: none; }
.tip.tip--end .tip__text::after { left: auto; right: 9px; margin-left: 0; }
.tip.tip--below .tip__text { bottom: auto; top: calc(100% + 8px); }
.tip.tip--below .tip__text::after { top: auto; bottom: 100%; border-top-color: transparent; border-bottom-color: #1d1b18; }
.tip .tip__btn:hover { transform: none; border-color: var(--focus); color: var(--heading); }
.promo-row { display: flex; gap: .5rem; align-items: center; margin-top: .75rem; } .promo-row input { max-width: 14rem; }

/* Member documents */
.doc-filters { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.25rem; }
.doc-filters input[type=search] { flex: 1 1 14rem; }
.doc-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.doc-list a { display: flex; gap: .75rem; align-items: flex-start; padding: .8rem 1rem; border: 1px solid var(--border); border-radius: var(--radius-md);
  background: var(--surface); color: var(--text); text-decoration: none; }
.doc-list a:hover { border-color: var(--accent); }
.doc-list svg { width: 1.4rem; height: 1.4rem; flex: none; color: var(--accent); margin-top: .1rem; }
.doc-list small { display: block; color: var(--text-muted); }

/* Site search */
.site-search { display: flex; gap: .5rem; max-width: 40rem; margin-top: 1.25rem; }
.site-search input { flex: 1; }
.search-kinds { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }
.search-kinds a { padding: .3rem .8rem; border: 1px solid var(--border); border-radius: 999px; text-decoration: none; color: var(--text); font-size: var(--step--1); }
.search-kinds a[aria-current="true"] { background: var(--heading); color: var(--bg); border-color: var(--heading); }
.search-results { list-style: none; padding: 0; margin: 0; display: grid; gap: 1.1rem; }
.search-results a { text-decoration: none; display: block; }
.search-results b { font-size: var(--step-1); color: var(--heading); }
.search-results a:hover b { color: var(--accent); }
.search-kind { display: block; font-size: var(--step--2); text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted); }
.search-results p { margin: .2rem 0 0; color: var(--text-muted); font-size: var(--step--1); }
.search-results mark { background: var(--brand-gold); color: var(--brand-ink); padding: 0 .1em; border-radius: 2px; }

/* Surveys */
.survey .agree { padding: .75rem 0; border-top: 1px solid var(--border); }
.survey .agree p { margin: 0 0 .4rem; }
.agree-scale { display: flex; flex-wrap: wrap; gap: .35rem .9rem; font-size: var(--step--1); }
.agree-scale label { display: inline-flex; align-items: center; gap: .3rem; }

/* My Account: upcoming registrations */
.party-flags { display: flex; flex-wrap: wrap; gap: .35rem; margin: .35rem 0; }
.status-pill.warn { background: color-mix(in srgb, var(--danger) 12%, transparent); color: var(--danger); border-color: color-mix(in srgb, var(--danger) 35%, transparent); text-decoration: none; }
.badge-rename { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.badge-rename label { margin: 0; font-size: var(--step--1); }
.badge-rename input { max-width: 16rem; }
.more-events { margin-top: .25rem; }
.more-events > summary { cursor: pointer; padding: .5rem 0; font-weight: 600; }

/* ---------- Event rules ---------- */
.rule-hero { display: flex; gap: 1.25rem; align-items: center; }
.rule-hero__art { width: 88px; height: 88px; object-fit: contain; flex: none; border-radius: var(--radius-lg); background: rgb(255 255 255 / .08); padding: 10px; }
.plain-list { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; gap: .45rem; }
@media (max-width: 40rem) { .rule-hero { flex-direction: column; align-items: flex-start; } }
.survey fieldset.multi { border: 0; padding: .75rem 0; margin: 0; border-top: 1px solid var(--border); }
.survey fieldset.multi legend { font-weight: 700; padding: 0; margin-bottom: .4rem; }
.multi-choices { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr)); gap: .35rem 1rem; }
/* The public sign-in pages: the site header and footer, with the card on a band of fireworks. */
.scene--band { min-height: min(46rem, 78vh); background: var(--scene-scrim), var(--scene-image) center / cover no-repeat, var(--night-0); }
@media (max-width: 900px) { .scene--band { background: var(--scene-scrim), var(--scene-image-sm) center / cover no-repeat, var(--night-0); } }

/* ---------- Checkout ---------- */
.checkout { display: grid; gap: clamp(1rem, .8rem + 1.5vw, 2rem); align-items: start; }
@media (min-width: 56rem) { .checkout { grid-template-columns: minmax(0, 1fr) minmax(0, 26rem); } }
.checkout__lines { list-style: none; margin: 0 0 .75rem; padding: 0; }
.checkout__lines li, .checkout__row { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem 0; border-bottom: 1px solid var(--border); margin: 0; }
.checkout__lines b, .checkout__row b { white-space: nowrap; font-variant-numeric: tabular-nums; }
.checkout__total { font-size: var(--step-1); border-bottom: 0; }
.checkout__element { min-height: 12rem; margin: .5rem 0 1rem; }
.checkout__status { min-height: 1.4em; margin: 0 0 .75rem; color: var(--text-muted); }
.checkout__status.is-error { color: var(--danger, #b42318); font-weight: 600; }
.checkout__pay .h-small svg, .checkout__secure svg { width: 16px; height: 16px; vertical-align: -2px; }
.cart-group { padding-bottom: .5rem; margin-bottom: .75rem; }
.cart-group__head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.cart-group__head .eyebrow { margin: 0; }
.cart-count { position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--brand-orange, #ff6720);
  color: #101820; font: 800 11px/18px var(--font-body, Inter, sans-serif); text-align: center; }
.icon-button.has-count { position: relative; }
.renew-person { margin: 0; display: grid; gap: .6rem; align-content: start; }
.renew-person__head { display: flex; justify-content: space-between; gap: .75rem; align-items: baseline; flex-wrap: wrap; }
.renew-person__head h2 { margin: 0; }

/* ---------- My Account ---------- */
.account-shell { display: grid; gap: clamp(1rem, .8rem + 1.5vw, 2rem); align-items: start; }
@media (min-width: 60rem) { .account-shell { grid-template-columns: 15rem minmax(0, 1fr); } .account-nav { position: sticky; top: 1rem; } }
.account-nav ul { list-style: none; margin: 0 0 .75rem; padding: 0; display: grid; gap: .15rem; }
.account-nav a { display: flex; gap: .6rem; align-items: center; padding: .55rem .75rem; border-radius: var(--radius-md); text-decoration: none; color: inherit; font-weight: 600; }
.account-nav a:hover { background: color-mix(in srgb, var(--accent, #ff6720) 10%, transparent); }
.account-nav a[aria-current="page"] { background: color-mix(in srgb, var(--accent, #ff6720) 16%, transparent); color: var(--heading); }
.account-nav svg { width: 18px; height: 18px; flex: none; }
.account-main > .card, .account-main > .grid, .account-main > .callout { margin-bottom: 1.25rem; }
.hint svg, .muted svg, p > svg.nav__icon { width: 1em; height: 1em; vertical-align: -.12em; }
.cart aside .h-small { margin-top: 1.5rem; }

/* Staff viewing the site as a member (spark/identity/view_as.py) */
.view-as-strip { position: sticky; top: 0; z-index: 70; display: flex; gap: .4rem 1rem; justify-content: center; align-items: center; flex-wrap: wrap;
  padding: .55rem var(--space); background: #ffc226; color: #101820; font: 600 var(--step--1)/1.35 var(--font-body); text-align: center; }
.view-as-strip--console { background: #b8a6ff; }
.view-as-strip form { display: inline; }
.view-as-strip button { min-height: auto; padding: .3rem .8rem; border-radius: 999px; border: 1.5px solid #101820; background: #101820; color: #ffc226;
  font: 700 var(--step--1)/1 var(--font-body); cursor: pointer; box-shadow: none; transform: none; }
.view-as-strip button:hover { background: transparent; color: #101820; border-color: #101820; }

/* My Account: give a ticket to someone else (spark/registration/changes.py) */
.change-ticket { margin: .5rem 0; }
.change-ticket summary { cursor: pointer; font-weight: 650; font-size: var(--step--1); color: var(--link, inherit); }
.change-ticket form { margin-top: .6rem; padding: .9rem 1rem; border: 1px solid var(--border); border-radius: var(--radius, 12px); }
.change-ticket fieldset { border: 0; margin: 0 0 .5rem; padding: 0; display: grid; gap: .3rem; }
.change-ticket .choice { display: flex; gap: .5rem; align-items: center; margin: 0; font-weight: 500; }
.change-ticket .choice.is-off { color: var(--muted, inherit); }
.change-ticket .grid-3 { display: grid; gap: .6rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); }

/* Check-in codes */
.checkin-qr summary { cursor: pointer; font-weight: 650; font-size: var(--step--1); }
.checkin-qr .qr, .checkin-code .qr { display: grid; place-items: center; margin: .75rem 0; }
.checkin-qr .qr svg { width: 180px; height: auto; }
.checkin-code .qr svg { width: min(80vw, 320px); height: auto; }

/* ---------- My Account (2026-10-04): compact header, sections that load in place, overview for WinterBlast ---------- */
.account-hero { padding: clamp(1.4rem, 1rem + 2vw, 2.4rem) 0; }
.account-hero__inner { display: grid; grid-template-columns: auto 1fr auto; gap: .5rem 1.25rem; align-items: center; }
.account-hero h1 { font-size: var(--step-3); margin: .15rem 0 .2rem; }
.account-hero .eyebrow { margin: 0; }
.account-hero__status { margin: 0; color: var(--night-text); display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.account-hero__actions { justify-content: flex-end; margin: 0; }
.account-hero__face { text-decoration: none; border-radius: 50%; }
.account-hero__face:focus-visible { outline: 3px solid var(--brand-gold); outline-offset: 3px; }
@media (max-width: 44rem) { .account-hero__inner { grid-template-columns: auto 1fr; } .account-hero__actions { grid-column: 1 / -1; justify-content: flex-start; } }
.dot { width: .55rem; height: .55rem; border-radius: 50%; display: inline-block; background: var(--night-muted); }
.dot--ok { background: #3ddc84; box-shadow: 0 0 0 4px rgb(61 220 132 / .18); } .dot--warn { background: var(--brand-gold); box-shadow: 0 0 0 4px rgb(255 194 38 / .2); }

.face { display: inline-grid; place-items: center; flex: none; border-radius: 50%; object-fit: cover; background: linear-gradient(135deg, var(--dusk-violet), var(--brand-orange));
  color: #fff; font: 800 1rem/1 var(--font-display); letter-spacing: .02em; }
.face--sm { width: 2.25rem; height: 2.25rem; font-size: .8rem; }
.face--md { width: 3.25rem; height: 3.25rem; font-size: 1.05rem; }
.face--lg { width: 4.5rem; height: 4.5rem; font-size: 1.45rem; box-shadow: 0 0 0 3px rgb(255 255 255 / .18); }
.face--xl { width: 7rem; height: 7rem; font-size: 2.2rem; box-shadow: 0 0 0 4px var(--surface), 0 0 0 5px var(--border); }

.account-nav__group { margin: 1rem .75rem .3rem; font: 700 var(--step--2)/1.2 var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
.account-nav > ul:first-child { margin-top: 0; }
.account-nav__perks a { font-weight: 550; }
/* Phones and tablets: the sections as a two-column grid of tiles, every label whole, Sign Out included (2026-10-19; the
   sideways strip clipped labels to "Pr", "M", "Orc" and hid Sign Out). */
@media (max-width: 59.99rem) {
  .account-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
  .account-nav__group, .account-nav__perks { display: none !important; }
  .account-nav ul { display: contents; }
  .account-nav li { min-width: 0; }
  .account-nav a { height: 100%; min-height: 3rem; padding: .55rem .7rem; gap: .5rem; border: 1px solid var(--border); background: var(--surface);
    font-size: var(--step--1); line-height: 1.2; }
  .account-nav li a span { white-space: normal; overflow-wrap: anywhere; }
  .account-nav form { display: block; margin: 0; }
  .account-nav form .button { height: 100%; min-height: 3rem; font-size: var(--step--1); }
}
.account-main { min-width: 0; transition: opacity .15s; }
.account-main.is-loading { opacity: .55; pointer-events: none; }
.account-section { display: grid; gap: 1.5rem; }  /* every card and block in a section gets the same breathing room */
.account-section > * { margin: 0; }
.account-section .card { margin: 0; }
.account-section [tabindex="-1"]:focus { outline: none; }
.account-grid-2 { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); align-items: start; }
.card-head { margin-bottom: 1rem; } .card-head h2 { font-size: var(--step-2); margin: 0 0 .25rem; } .card-head p { margin: .25rem 0 0; }
.h-card { font-size: var(--step-1); margin: 0 0 .75rem; }
.section-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: .75rem; }
.section-head .h-card { margin: 0; }
.crumbs { font-size: var(--step--1); color: var(--text-muted); } .crumbs a { font-weight: 650; }

/* Overview: WinterBlast spotlight */
.spotlight { border-radius: var(--radius-lg); padding: clamp(1.25rem, 1rem + 1.5vw, 2rem); display: grid; gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr) auto; align-items: end; box-shadow: var(--shadow-lg); }
.spotlight h2 { font-size: var(--step-3); margin: .2rem 0 .15rem; } .spotlight h2 a { color: inherit !important; text-decoration: none; }
.spotlight__when { margin: 0 0 1rem; color: var(--night-muted); }
.spotlight__actions { display: grid; gap: .5rem; justify-items: stretch; min-width: 12rem; }
@media (max-width: 44rem) { .spotlight { grid-template-columns: 1fr; } .spotlight__actions { min-width: 0; } }
.checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.checklist li { display: flex; gap: .6rem; align-items: flex-start; }
.checklist svg { width: 1.15rem; height: 1.15rem; flex: none; margin-top: .15rem; }
.checklist .is-ok svg { color: #3ddc84; } .checklist .is-warn svg { color: var(--brand-gold); } .checklist .is-go svg, .checklist .is-info svg { color: var(--night-muted); }

.overview-row { display: grid; gap: 1.25rem; grid-template-columns: minmax(14rem, 1fr) minmax(0, 2fr); }
@media (max-width: 52rem) { .overview-row { grid-template-columns: 1fr; } }
.big-figure { font: 800 var(--step-3)/1 var(--font-display); color: var(--heading); margin: .25rem 0 .35rem; letter-spacing: -.02em; }
.big-figure small { font: 600 var(--step-0)/1 var(--font-body); color: var(--text-muted); letter-spacing: 0; }
.big-figure.is-warn { color: var(--brand-red); }
.membership-status p { margin: 0 0 .75rem; }
.meter { appearance: none; width: 100%; height: .55rem; border: 0; border-radius: 999px; background: var(--surface-2); overflow: hidden; margin: .25rem 0 .75rem; }
.meter::-webkit-progress-bar { background: var(--surface-2); border-radius: 999px; }
.meter::-webkit-progress-value { background: var(--success); border-radius: 999px; }
.meter::-moz-progress-bar { background: var(--success); border-radius: 999px; }
.meter.is-due::-webkit-progress-value { background: var(--brand-gold); } .meter.is-due::-moz-progress-bar { background: var(--brand-gold); }
.meter.is-urgent::-webkit-progress-value { background: var(--brand-red); } .meter.is-urgent::-moz-progress-bar { background: var(--brand-red); }
.todo-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.todo-list li { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .65rem .85rem; border-radius: var(--radius-md);
  background: var(--surface-2); border-left: 4px solid var(--border); }
.todo-list li.is-warn { border-left-color: var(--brand-orange); } .todo-list li.is-info { border-left-color: var(--sky); }
.todo-list .button { flex: none; }
.all-set { display: flex; gap: .5rem; align-items: center; color: var(--success); font-weight: 650; margin: 0; }
.all-set svg { width: 1.2rem; height: 1.2rem; }

.perk-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 14.5rem), 1fr)); }
.perk { position: relative; display: grid; gap: .35rem; align-content: start; padding: 1.1rem 1.15rem; border-radius: var(--radius-lg); background: var(--surface);
  border: 1px solid var(--border); text-decoration: none; color: var(--text); transition: transform .2s var(--ease-out), box-shadow .2s, border-color .2s; }
.perk:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: color-mix(in srgb, var(--brand-orange) 45%, var(--border)); color: var(--text); }
.perk b { color: var(--heading); font-family: var(--font-display); font-size: var(--step-1); line-height: 1.15; }
.perk__text { color: var(--text-muted); font-size: var(--step--1); }
.perk__icon { width: 2.4rem; height: 2.4rem; display: grid; place-items: center; border-radius: 12px; margin-bottom: .2rem;
  background: linear-gradient(135deg, color-mix(in srgb, var(--brand-orange) 22%, transparent), color-mix(in srgb, var(--dusk-violet) 22%, transparent)); color: var(--brand-orange); }
.perk__icon svg { width: 1.25rem; height: 1.25rem; }
.perk.is-locked { border-style: dashed; background: color-mix(in srgb, var(--surface-2) 55%, var(--surface)); }  /* no fading: text stays ≥4.5:1 (2026-10-19) */
.perk.is-locked .perk__icon { filter: grayscale(1); }
.perk__lock { display: inline-flex; gap: .35rem; align-items: center; font: 650 var(--step--2)/1 var(--font-body); color: var(--text-muted); margin-top: .25rem; }
.perk__lock svg { width: .85rem; height: .85rem; }

.news-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); }
.news-item { display: grid; gap: .35rem; align-content: start; margin: 0; text-decoration: none; color: inherit; overflow: hidden; }
.news-item img { width: calc(100% + 2.5rem); max-width: none; margin: -1.25rem -1.25rem .4rem; aspect-ratio: 16 / 9; object-fit: cover; }
.news-item b { color: var(--heading); font-size: var(--step-1); line-height: 1.2; }
.news-item__date { font: 650 var(--step--2)/1 var(--font-body); color: var(--text-muted); text-transform: uppercase; letter-spacing: .06em; }
.quick-links { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); }
.quick { display: flex; gap: .85rem; align-items: center; margin: 0; text-decoration: none; color: inherit; padding: 1rem 1.15rem; }
.quick > svg { width: 1.4rem; height: 1.4rem; color: var(--brand-orange); flex: none; }
.quick span { display: grid; } .quick b { color: var(--heading); }

/* Profile: settings rows (what it is on the left, the fields on the right) */
.settings { display: grid; }
.settings__group { border: 0; margin: 0; padding: 1.4rem 0; display: grid; gap: .25rem 2rem; grid-template-columns: 13rem minmax(0, 1fr); border-top: 1px solid var(--border); }
.settings__group:first-of-type { border-top: 0; padding-top: 0; }
.settings__label { float: left; padding: 0; display: grid; gap: .25rem; align-content: start; }
.settings__label b { color: var(--heading); font-family: var(--font-display); font-size: var(--step-1); }
.settings__label span { color: var(--text-muted); font-size: var(--step--1); }
.settings__fields label:first-child, .settings__fields .label:first-child { margin-top: 0; }
.settings__fields > .check + .check { margin-top: .5rem; }
.settings__fields.form-grid, .settings__fields .form-grid { row-gap: 1rem; }
.settings__fields .form-grid > div > label, .settings__fields.form-grid > div > label { margin-top: 0; }
.settings__fields .hint { margin-top: .35rem; }
.form-grid--tight { gap: 0 .75rem; grid-template-columns: 1fr 1fr; }
.settings__readonly { display: flex; gap: .75rem; align-items: baseline; flex-wrap: wrap; margin: .3rem 0 0; }
.label { display: block; font-weight: 600; margin: .9rem 0 .3rem; }
.settings__save { position: sticky; bottom: 0; z-index: 2; display: flex; justify-content: flex-end; padding: .9rem 0 .2rem; margin-top: .5rem;
  border-top: 1px solid var(--border); background: linear-gradient(to top, var(--surface) 70%, transparent); }
@media (max-width: 44rem) { .settings__group { grid-template-columns: 1fr; } }
.photo-edit { display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap; }
.photo-edit__body { display: grid; gap: .5rem; justify-items: start; }
.photo-edit__body form { display: inline; }
.photo-edit__form label.button { margin: 0; cursor: pointer; display: inline-flex; gap: .4rem; align-items: center; }
.photo-edit__form label.button svg { width: 1rem; height: 1rem; }
.photo-edit__form:focus-within label.button { outline: 3px solid var(--focus); outline-offset: 2px; }
.photo-edit .hint { margin: 0; max-width: 34rem; }

/* Household and renewal: one row per person */
.household-cards { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .6rem; }
.household-card { display: flex; gap: 1rem; align-items: center; padding: .85rem 1rem; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface); flex-wrap: wrap; }
.household-card.is-renewable { border-color: color-mix(in srgb, var(--success) 35%, var(--border)); }
.household-card__who { flex: 1 1 14rem; display: grid; gap: .2rem; }
.household-card__who b { color: var(--heading); }
.household-card__actions { display: flex; gap: .5rem; }
.renew-pick { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }
.renew-pick .check { margin: 0; } .renew-pick select { width: auto; max-width: 100%; }
.form-actions { display: flex; align-items: end; }

/* The membership card in a pop-up */
.card-dialog { border: 0; border-radius: var(--radius-lg); padding: 0; width: min(30rem, calc(100vw - 32px)); background: var(--surface); color: var(--text); box-shadow: var(--shadow-lg); }
.card-dialog::backdrop { background: rgb(5 7 15 / .65); backdrop-filter: blur(3px); }
.card-dialog__head { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.25rem; border-bottom: 1px solid var(--border); }
.card-dialog__head h2 { margin: 0; font-size: var(--step-1); }
.card-dialog__body { padding: 1.25rem; }
.card-dialog .member-id-frame { margin-inline: auto; }
@media (min-width: 60rem) { .account-shell { grid-template-columns: 16.5rem minmax(0, 1fr); } }
.account-nav a span { white-space: nowrap; }
.account-hero .face--lg { width: 4rem; height: 4rem; font-size: 1.3rem; }

/* My Account: two cards side by side are the same height, buttons at the bottom */
.account-grid-2--even { align-items: stretch; }
.account-grid-2--even > .card { display: flex; flex-direction: column; }
.account-grid-2--even > .card > p { margin: 0 0 .5rem; }
.account-grid-2--even .card-foot { margin-top: auto; padding-top: .75rem; }
.account-grid-2--even .card-head .eyebrow { margin: 0 0 .15rem; }
.show-more { margin: 1rem 0 0; text-align: center; }

/* Orders & Receipts: filters, compact rows */
.filter-bar { display: flex; flex-wrap: wrap; gap: .75rem 1rem; align-items: end; margin: 0 0 1rem; padding: .85rem 1rem; border: 1px solid var(--border);
  border-radius: var(--radius-md); background: color-mix(in srgb, var(--surface) 92%, var(--text) 8%); }
.filter-bar label { margin: 0 0 .3rem; font-size: var(--step--1); display: flex; gap: .3rem; align-items: center; }
.filter-bar select { width: auto; min-width: 10rem; }
.filter-bar__clear { align-self: center; font-weight: 600; }
.filter-bar__count { margin: 0 0 0 auto; align-self: center; }
.orders-list td { vertical-align: middle; padding-block: .7rem; }
.orders-list td:first-child a { font-weight: 650; }
.orders-list__pdf { text-align: right; white-space: nowrap; }
.orders-list__pdf a { display: inline-flex; gap: .3rem; align-items: center; font-weight: 600; font-size: var(--step--1); text-decoration: none; padding: .25rem .5rem;
  border: 1px solid var(--border); border-radius: var(--radius-md); }
.orders-list__pdf a:hover { border-color: var(--accent); }
.orders-list__pdf svg { width: 14px; height: 14px; }
.nowrap { white-space: nowrap; }

/* The pop-up: wide for receipts */
.card-dialog.is-wide { width: min(44rem, calc(100vw - 32px)); }
.card-dialog .receipt { margin: 0; max-width: none; }
.card-dialog .receipt header { justify-content: flex-start; margin-bottom: .75rem; }
.card-dialog .receipt header p { text-align: left; }
.card-dialog .receipt .buttons { margin-top: 1.25rem; }
.card-dialog__body { max-height: calc(100vh - 8rem); overflow-y: auto; }

/* Address suggestions (address.js) and the "did you mean" check */
.address-anchor { position: relative; }
.address-suggest { position: absolute; z-index: 20; left: 0; right: 0; top: 100%; margin: .25rem 0 0; padding: .3rem; list-style: none;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-lg); }
.address-suggest [role=option] { display: grid; gap: .05rem; padding: .5rem .65rem; border-radius: calc(var(--radius-md) - 2px); cursor: pointer; }
.address-suggest [role=option] b { color: var(--heading); font-weight: 650; }
.address-suggest [role=option] span { color: var(--text-muted); font-size: var(--step--1); }
.address-suggest [role=option]:hover, .address-suggest [aria-selected=true] { background: color-mix(in srgb, var(--accent, #ff6720) 12%, transparent); }
.address-suggest__brand { text-align: right; font-size: .7rem; color: var(--text-muted); padding: .25rem .5rem 0; }
.address-check { grid-column: 1 / -1; margin-top: .75rem; padding: .85rem 1rem; border-radius: var(--radius-md);
  border: 1px solid color-mix(in srgb, var(--success) 40%, var(--border)); background: color-mix(in srgb, var(--success) 8%, var(--surface)); }
.address-check.is-warn { border-color: color-mix(in srgb, var(--brand-gold, #ffc226) 60%, var(--border)); background: color-mix(in srgb, var(--brand-gold, #ffc226) 12%, var(--surface)); }
.address-check p { margin: 0 0 .5rem; }
.address-check .buttons { margin: .25rem 0 0; }
.form-grid + .form-grid { margin-top: 1rem; }

/* Household invitation page */
.household-join h1 { margin-top: .25rem; }
.household-join__what { margin: 1rem 0; padding-left: 1.2rem; display: grid; gap: .35rem; }
.household-join .buttons { margin-top: 1.25rem; }
.invite-list { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .5rem; }
.invite-list li { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; justify-content: space-between; padding: .7rem 1rem;
  border: 1px dashed var(--border); border-radius: var(--radius-md); }
.invite-list form { display: inline-flex; gap: .4rem; }

/* Newsletter archive */
.section-title { font-size: var(--step-3); margin: 0 0 1.25rem; }
.issue-cards { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); }
.issue-card { display: grid; grid-template-columns: 10rem minmax(0, 1fr); gap: 1.1rem; padding: 1.1rem; border: 1px solid var(--border);
  border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm, none); }
.issue-card__cover img { width: 100%; height: auto; aspect-ratio: 300 / 388; object-fit: cover; border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg); transition: transform .2s; }
.issue-card__cover:hover img { transform: translateY(-3px) rotate(-1deg); }
.issue-card__body { display: grid; gap: .35rem; align-content: start; }
.issue-card__body .eyebrow { margin: 0; }
.issue-card__body h3 { margin: 0; font-size: var(--step-1); }
.issue-card__body h3 a { color: var(--heading); text-decoration: none; }
.issue-card__body p { margin: 0; font-size: var(--step--1); color: var(--text-muted); }
.issue-card__highlights { margin: .2rem 0 .3rem; padding-left: 1.1rem; font-size: var(--step--1); display: grid; gap: .15rem; }
.decade { display: flex; gap: .75rem; align-items: baseline; margin: 2rem 0 .75rem; font-size: var(--step-2); scroll-margin-top: 6rem; }
.decade .muted { font: 500 var(--step--1) var(--font-body); }
/* Every issue as a wall of covers (page 1 of each PDF, spark/newsletter/covers.py): three across on phones */
.issue-wall { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.25rem .9rem;
  grid-template-columns: repeat(auto-fill, minmax(min(30%, 8.5rem), 1fr)); }
.issue-wall a { display: grid; gap: .15rem; align-content: start; text-decoration: none; color: inherit; height: 100%; }
.issue-wall img, .issue-wall__blank { width: 100%; height: auto; aspect-ratio: 300 / 388; object-fit: cover; object-position: top;
  border-radius: var(--radius-sm); border: 1px solid var(--border); background: var(--surface-2); box-shadow: var(--shadow);
  margin-bottom: .4rem; transition: transform .2s var(--ease-out), box-shadow .2s; }
.issue-wall__blank { display: grid; place-items: center; color: var(--accent); }
.issue-wall__blank svg { width: 1.6rem; height: 1.6rem; }
.issue-wall a:hover img, .issue-wall a:focus-visible img { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.issue-wall a:hover b { color: var(--accent); }
.issue-wall b { color: var(--heading); font-size: var(--step--1); line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden; }
.issue-wall small { color: var(--text-muted); font-size: .78rem; }
@media (max-width: 30rem) { .issue-card { grid-template-columns: 6rem minmax(0, 1fr); } }

/* ---------- Header: dropdown panels with icons (nav.py), search, My WPA (2026-10-05) ---------- */
.site-header .bar { position: relative; }
.nav details.mega { position: static; }
.nav summary[aria-current="true"] { color: var(--brand-gold); }
.mega__panel { position: absolute; top: calc(100% + .35rem); left: 50%; translate: -50% 0; z-index: 60; display: grid; gap: .25rem 1.5rem;
  width: min(44rem, calc(100vw - 2rem)); grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 1.25rem;
  background: rgb(12 17 34 / .97); border: 1px solid var(--night-line); border-radius: var(--radius-lg);
  box-shadow: 0 30px 60px -20px rgb(0 0 0 / .85); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.nav details[open] > .mega__panel { animation: drop .18s var(--ease-out); }
.mega__panel:has(.mega__col--compact) { width: min(52rem, calc(100vw - 2rem)); }
.mega__title { font: 650 .72rem/1.2 var(--font-body); letter-spacing: .12em; text-transform: uppercase; color: var(--brand-gold); margin: 0 0 .5rem .6rem; }
.nav .mega__title a { display: inline; padding: 0; color: inherit; background: none; font: inherit; }
.nav .mega__title a:hover { color: var(--white); background: none; }
.mega__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; }
.mega__col--compact ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.nav .mega__col a { display: flex; gap: .7rem; align-items: flex-start; padding: .55rem .6rem; border-radius: var(--radius-md); white-space: normal; font-weight: 500; }
.nav .mega__col--compact a { align-items: center; padding: .45rem .6rem; }
.mega__icon { flex: none; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: .6rem;
  background: rgb(255 255 255 / .06); color: var(--brand-gold); }
.mega__col--compact .mega__icon { width: 1.6rem; height: 1.6rem; border-radius: .45rem; background: none; }
.mega__icon svg { width: 1.05rem; height: 1.05rem; }
.mega__text { display: grid; gap: .1rem; min-width: 0; }
.mega__text b { color: var(--white); font-weight: 600; display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.mega__text small { color: var(--night-muted); font-size: .8rem; line-height: 1.35; }
.nav .mega__col a:hover .mega__icon { background: var(--sunset); color: var(--night-1); }
.members-tag { font: 650 .62rem/1 var(--font-body); letter-spacing: .06em; text-transform: uppercase; padding: .2rem .4rem; border-radius: 999px;
  color: var(--brand-gold); border: 1px solid rgb(255 194 38 / .45); }
.mega__foot { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: .25rem 1rem; margin-top: .5rem; padding-top: .75rem; border-top: 1px solid var(--night-line); }
.nav .mega__foot a { display: inline-flex; gap: .45rem; align-items: center; padding: .4rem .6rem; font-weight: 600; }
.mega__foot svg { width: 1rem; height: 1rem; color: var(--brand-gold); }
.my-wpa { display: inline-flex; gap: .45rem; align-items: center; padding: .3rem .85rem .3rem .3rem; border-radius: 999px; font-weight: 650;
  color: var(--white); background: rgb(255 255 255 / .07); border: 1px solid rgb(255 194 38 / .5); text-decoration: none; }
.my-wpa:hover, .my-wpa[aria-current="page"] { background: rgb(255 194 38 / .14); color: var(--white); }
.my-wpa img, .my-wpa__initials { width: 1.6rem; height: 1.6rem; border-radius: 50%; object-fit: cover; }
.my-wpa__initials { display: grid; place-items: center; background: var(--sunset); color: var(--night-1); font: 800 .62rem/1 var(--font-body); }
@media (max-width: 64rem) {
  .mega__panel { position: static; translate: none; width: auto; grid-template-columns: 1fr; padding: .25rem 0 .75rem; background: none;
    border: 0; box-shadow: none; backdrop-filter: none; animation: none; }
  .mega__col--compact ul { grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); }
  .nav .mega__col a { font: 500 var(--step-0)/1.3 var(--font-body); }
  .mega__title { margin-top: .75rem; }
}
/* the label stays on phones now that Donate and Search left the header (Steve, 2026-10-24: space between the avatar and the words) */
.my-wpa { gap: .6rem; }
@media (max-width: 30rem) { .header-actions .console-link { display: none; } } /* the phone drawer has a Console button */

/* Search: a card over the dimmed page, results as you type (Steve, 2026-10-17: icon only; nicer than a full-width bar) */
.header-search { position: fixed; inset: 0; z-index: 70; background: rgb(5 7 15 / .62); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
  display: flex; justify-content: center; align-items: flex-start; padding: clamp(4.5rem, 3rem + 6vh, 8rem) 16px 16px; animation: fade .15s ease-out; }
.header-search[hidden] { display: none; }
@keyframes fade { from { opacity: 0; } }
.header-search__card { width: min(100%, 44rem); max-height: calc(100svh - 7rem); display: flex; flex-direction: column; overflow: hidden;
  background: var(--night-1); border: 1px solid rgb(255 255 255 / .14); border-radius: var(--radius-lg); box-shadow: 0 40px 90px -30px rgb(0 0 0 / .9);
  animation: drop .18s var(--ease-out); }
.header-search__form { display: flex; align-items: center; gap: .85rem; padding: .5rem .6rem .5rem 1.25rem; border-bottom: 1px solid var(--night-line);
  color: var(--brand-gold); }
.header-search__form > svg { width: 1.5rem; height: 1.5rem; flex: none; stroke-width: 2.25; }
.header-search__form input::-webkit-search-cancel-button { display: none; }
.header-search__form input { flex: 1; min-width: 0; border: 0; background: none; color: var(--white); font: 500 var(--step-1)/1.3 var(--font-body);
  padding: .85rem 0; box-shadow: none; outline: none; }
.header-search__form input::placeholder { color: var(--night-muted); }
.header-search__close { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; flex: none; border: 0; border-radius: 999px; padding: 0;
  background: none; color: var(--night-muted); cursor: pointer; min-height: 0; box-shadow: none; }
.header-search__close:hover { background: rgb(255 255 255 / .08); color: var(--white); }
.header-search__close svg { width: 1.3rem; height: 1.3rem; }
.header-search__results { padding: .5rem; overflow-y: auto; }
.header-search__results:not(:empty) + .header-search__quick { display: none; }
.header-search__quick { padding: 1rem 1.25rem 1.25rem; }
.header-search__quick > p:first-child { margin: 0 0 .5rem; font: 650 .72rem/1 var(--font-body); letter-spacing: .12em; text-transform: uppercase; color: var(--night-muted); }
.header-search__quick ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 12rem), 1fr)); }
.header-search__quick a { display: flex; gap: .6rem; align-items: center; padding: .7rem .85rem; border-radius: var(--radius-md); text-decoration: none;
  color: var(--night-text); background: rgb(255 255 255 / .04); border: 1px solid rgb(255 255 255 / .07); font-weight: 550; }
.header-search__quick a:hover { background: rgb(255 194 38 / .12); border-color: rgb(255 194 38 / .45); color: var(--white); }
.header-search__quick svg { width: 1.15rem; height: 1.15rem; flex: none; color: var(--brand-gold); }
.header-search__tip { margin: 1rem 0 0; font-size: var(--step--1); color: var(--night-muted); }
.header-search__tip kbd { font-size: .75rem; border: 1px solid var(--night-line); border-radius: .35rem; padding: .05rem .4rem; }
@media (hover: none) { .header-search__tip { display: none; } }
.header-search__results { display: grid; gap: .15rem; }
.header-search__results:empty { display: none; }
.header-search__results a { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .1rem .75rem; padding: .6rem .9rem; border-radius: var(--radius-md);
  text-decoration: none; color: var(--night-text); }
.header-search__results a:hover, .header-search__results a[aria-selected="true"] { background: rgb(255 255 255 / .07); }
.header-search__results .kind { grid-row: span 2; align-self: start; margin-top: .15rem; font: 650 .66rem/1 var(--font-body); letter-spacing: .08em; text-transform: uppercase;
  color: var(--brand-gold); border: 1px solid rgb(255 194 38 / .4); border-radius: 999px; padding: .25rem .5rem; min-width: 5.5rem; text-align: center; }
.header-search__results b { color: var(--white); font-weight: 600; }
.header-search__results small { color: var(--night-muted); font-size: .82rem; line-height: 1.35; }
.header-search__results mark { background: none; color: var(--brand-gold); font-weight: 650; }
.header-search__results .all { display: block; text-align: center; font-weight: 650; color: var(--brand-gold); }
.header-search__results p { margin: .4rem .9rem; color: var(--night-muted); }

/* ---------- Footer (2026-10-05): columns from nav.py, contact, theme switch, one legal line ---------- */
.footer-hero { align-items: center; padding: 2.25rem 0; }
.footer-hero p.big { font-size: var(--step-3); max-width: none; }
.footer-hero__sub { margin: .6rem 0 0; color: var(--night-muted); font-size: var(--step-0); }
.footer-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 10.5rem), 1fr)); gap: 1.5rem 2rem; }
.site-footer h2 a { color: var(--white); }
.footer-contact a { display: inline-flex; gap: .5rem; align-items: center; }
.footer-contact svg { width: 1rem; height: 1rem; color: var(--brand-gold); flex: none; }
.footer-base { align-items: center; gap: .75rem 1.5rem; }
.footer-base__legal { margin: 0; display: flex; flex-wrap: wrap; gap: .35rem 1.1rem; align-items: center; font-size: var(--step--1); }
.footer-base__copy { color: var(--night-muted); font-size: var(--step--2); }
@media (min-width: 64rem) { .footer-base { flex-wrap: nowrap; } .footer-base__legal { flex-wrap: nowrap; white-space: nowrap; } }
.footer-base__legal a { text-decoration: none; }
.footer-base__tools { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; max-width: 100%; }
.theme-switch { display: inline-flex; padding: .2rem; gap: .15rem; border: 1px solid var(--night-line); border-radius: 999px; }
.theme-switch button { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 999px; border: 0; padding: 0; min-height: 0;
  background: none; color: var(--night-muted); cursor: pointer; box-shadow: none; }
.theme-switch button:hover { color: var(--white); }
.theme-switch button[aria-pressed="true"] { background: rgb(255 255 255 / .1); color: var(--brand-gold); }
.theme-switch svg { width: 1rem; height: 1rem; }
.footer-base .version-badge { color: var(--night-muted); border-color: var(--night-line); }
.staff-results { margin: 0 0 1.5rem; padding: 1rem 1.25rem; border: 1px dashed var(--border); border-radius: var(--radius-lg); }
.staff-results h2 { display: flex; gap: .4rem; align-items: center; margin: 0 0 .5rem; }
.staff-results h2 svg { width: 1rem; height: 1rem; }
.staff-results ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .25rem; }
.staff-results a { display: grid; gap: .1rem; padding: .45rem 0; text-decoration: none; color: inherit; }
.staff-results small { color: var(--text-muted); }
.header-search__results .group { margin: .6rem .9rem .2rem; font: 650 .68rem/1 var(--font-body); letter-spacing: .1em; text-transform: uppercase; color: var(--night-muted); }
.header-search__results .members-tag { margin-left: .4rem; }
.console-link { display: inline-flex; gap: .4rem; align-items: center; }

/* ---------- Phone and tablet menu: a drawer that slides out from the left (2026-10-05; off-screen left adds no sideways scroll) ---------- */
.drawer-head, .drawer-search, .drawer-foot, .drawer-quick, .nav-backdrop, .drawer-event, .nav .drawer-news { display: none; }
@media (max-width: 64rem) {
  /* Thumb reach (Steve, 2026-10-24): menu, sign in and search on the left, logo on the right; the drawer opens from the left too */
  .site-header .bar { flex-direction: row-reverse; }
  .header-actions .menu-toggle { order: -2; }
  .header-actions .header-quick.header-donate { order: -1; display: inline-flex; font-size: 0; gap: 0; width: var(--target); height: var(--target); padding: 0; justify-content: center; align-items: center; }  /* heart only on phones; next to Menu */
  .header-actions .header-quick.header-donate svg { width: 22px; height: 22px; }
  .header-actions .header-quick.header-donate { background: transparent; color: var(--night-text); border: 1px solid var(--night-line); box-shadow: none; }  /* same chip as Search and Sign In */
  .header-actions .header-quick.header-donate:hover { background: rgb(255 255 255 / .08); color: var(--white); border-color: rgb(255 255 255 / .25); }
  .header-actions .header-quick.header-donate svg { color: var(--brand-orange, #ff6720); }
  .header-actions { margin-left: 0; margin-right: auto; }
  /* The header's blur would make it the containing block for the fixed drawer; no blur while the drawer is open. */
  :root:has(.nav.open) .site-header { backdrop-filter: none; -webkit-backdrop-filter: none; z-index: 300; }  /* above the stage banner */
  .nav { position: fixed; top: 0; left: 0; bottom: 0; z-index: 200; width: min(24rem, 88vw); margin: 0; display: flex; flex-direction: column;
    align-items: stretch; background: var(--night-1); border-right: 1px solid var(--night-line); box-shadow: 30px 0 60px -20px rgb(0 0 0 / .7);
    padding: 0 0 1.25rem; overflow-y: auto; overscroll-behavior: contain;
    transform: translateX(-100%); visibility: hidden; transition: transform .28s var(--ease-out), visibility 0s linear .28s; }
  .nav.open { transform: none; visibility: visible; transition: transform .28s var(--ease-out), visibility 0s; }
  .nav-backdrop { display: block; position: fixed; inset: 0; z-index: 190; background: rgb(3 5 12 / .6); backdrop-filter: blur(2px);
    opacity: 0; transition: opacity .25s; }
  .nav-backdrop.is-open { opacity: 1; }
  .nav-backdrop[hidden] { display: none; }
  .drawer-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .9rem 1rem .9rem 1.25rem;
    position: sticky; top: 0; z-index: 2; background: var(--night-1); border-bottom: 1px solid var(--night-line); }
  .drawer-head .brand img { height: 42px; }
  .nav .drawer-head a { padding: 0; background: none; }
  .drawer-search { display: flex; align-items: center; gap: .6rem; margin: 1rem 1.25rem .5rem; padding: .2rem .9rem; border: 1px solid var(--night-line);
    border-radius: 999px; background: rgb(255 255 255 / .05); color: var(--night-muted); }
  .drawer-search:focus-within { border-color: var(--brand-gold); }
  .drawer-search svg { width: 1.1rem; height: 1.1rem; flex: none; }
  .drawer-search input { flex: 1; min-width: 0; border: 0; background: none; color: var(--white); padding: .6rem 0; box-shadow: none; outline: none; font-size: 1rem; }
  .nav > ul { flex-direction: column; align-items: stretch; gap: 0; padding: .25rem .75rem; }
  .nav > ul > li { border-bottom: 1px solid var(--night-line); }
  .nav summary { justify-content: space-between; padding: .95rem .5rem; font: 700 var(--step-1)/1.2 var(--font-display); letter-spacing: -.01em;
    border-radius: var(--radius-sm); }
  .nav summary:hover, .nav details[open] > summary { background: none; }
  .mega__panel { position: static; translate: none; width: auto; grid-template-columns: 1fr; gap: 0; padding: 0 0 .75rem; background: none;
    border: 0; box-shadow: none; backdrop-filter: none; animation: none; }
  .mega__title { margin: .5rem 0 .25rem .5rem; }
  .mega__col--compact ul { grid-template-columns: 1fr 1fr; }
  .nav .mega__col a, .nav .mega__foot a { font: 500 var(--step-0)/1.3 var(--font-body); padding: .5rem; }
  .nav .mega__col--compact a { font-size: var(--step--1); }
  .mega__text small { display: none; }  /* the drawer is for getting there fast */
  .mega__foot { margin-top: .25rem; }
  .drawer-foot { display: grid; gap: .6rem; margin-top: auto; padding: 1.25rem 1.25rem 0; }
  .nav .drawer-quick { display: grid; padding: 0 1.25rem; }
  .nav .drawer-quick .button:not(.cta) { background: rgb(255 255 255 / .06); color: var(--white); border: 1px solid var(--night-line); }
  .nav .drawer-foot a, .nav .drawer-quick a { font: 650 var(--step-0)/1.2 var(--font-body); padding: .8rem 1rem; border-radius: 999px; }  /* one size for every drawer button */
  .drawer-foot .button, .drawer-quick .button { justify-content: center; display: inline-flex; gap: .5rem; align-items: center; text-align: center; }
  .drawer-foot svg, .drawer-quick svg { width: 1.1rem; height: 1.1rem; }
  :root:has(.nav.open) { overflow: hidden; }
}
@media (max-width: 64rem) and (prefers-reduced-motion: reduce) { .nav, .nav.open, .nav-backdrop { transition: none; } }
@media (max-width: 64rem) {
  .mega__col--compact ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nav .mega__col--compact a { padding: .45rem .3rem; gap: .45rem; }
  .mega__text b { overflow-wrap: anywhere; }
  .mega__foot { gap: 0 .5rem; }
}
@media (max-width: 64rem) {
  .nav .drawer-foot .button:not(.cta) { background: rgb(255 255 255 / .06); color: var(--white); border: 1px solid var(--night-line); }
}
@media (max-width: 64rem) {
  .nav:focus { outline: none; }
  /* The next event, with what this person needs to do to register */
  .drawer-event { margin: 1.25rem 1.25rem .25rem; padding: 1rem; border-radius: var(--radius-lg); display: grid; gap: .45rem;
    background: linear-gradient(160deg, rgb(255 103 32 / .16), rgb(171 35 40 / .1) 50%, rgb(255 255 255 / .03)); border: 1px solid rgb(255 194 38 / .3); }
  .drawer-event .eyebrow { margin: 0; }
  .nav .drawer-event__name { padding: 0; background: none; font: 800 var(--step-1)/1.15 var(--font-display); color: var(--white); white-space: normal; }
  .drawer-event__when { margin: 0; color: var(--night-muted); font-size: var(--step--1); }
  .drawer-countdown { display: flex; flex-wrap: wrap; gap: .3rem .6rem; align-items: baseline; font-size: var(--step--1); color: var(--night-muted); }
  .drawer-countdown__label { width: 100%; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
  .drawer-countdown b { font: 800 var(--step-1)/1 var(--font-display); color: var(--white); margin-right: .1rem; font-variant-numeric: tabular-nums; }
  .drawer-event__status { display: grid; gap: .15rem; padding: .55rem .7rem; border-radius: var(--radius-md); background: rgb(0 0 0 / .25); font-size: var(--step--1); }
  .drawer-event__status b { color: var(--white); }
  .drawer-event__status span { color: var(--night-muted); line-height: 1.4; }
  .drawer-event__status.is-register b, .drawer-event__status.is-registered b { color: #5ad28f; }
  .drawer-event__status.is-renew b, .drawer-event__status.is-join b, .drawer-event__status.is-paused b { color: var(--brand-gold); }
  .nav .drawer-event .button { font: 650 var(--step-0)/1.2 var(--font-body); padding: .8rem 1rem; border-radius: 999px; text-align: center; justify-content: center; }
  .nav .drawer-event .button:not(.cta) { background: rgb(255 255 255 / .06); color: var(--white); border: 1px solid var(--night-line); }
  /* The newest blog post or newsletter */
  .nav .drawer-news { display: flex; gap: .75rem; align-items: center; margin: 1rem 1.25rem 0; padding: .7rem; border: 1px solid var(--night-line);
    border-radius: var(--radius-md); background: rgb(255 255 255 / .03); white-space: normal; font: inherit; }
  .drawer-news img { width: 3.5rem; height: 3.5rem; object-fit: cover; border-radius: .5rem; flex: none; }
  .drawer-news span { display: grid; gap: .15rem; min-width: 0; }
  .drawer-news small { color: var(--brand-gold); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; }
  .drawer-news b { color: var(--white); font-weight: 600; line-height: 1.3; }
}
/* Home page: can I register, and if not, why (registration/eligibility.py) */
.reg-status { display: grid; gap: .2rem; margin: 1rem 0 .25rem; padding: .75rem 1rem; border-radius: var(--radius-md); background: rgb(0 0 0 / .28);
  border-left: 3px solid var(--night-line); font-size: var(--step--1); color: var(--night-muted); }
.reg-status b { color: var(--white); font-size: var(--step-0); }
.reg-status.is-register, .reg-status.is-registered { border-left-color: #5ad28f; }
.reg-status.is-renew, .reg-status.is-join, .reg-status.is-paused, .reg-status.is-sign_in { border-left-color: var(--brand-gold); }
/* Company seats (event_apps/seats.py) */
.company-perks ul { list-style: none; margin: .5rem 0 0; padding: 0; display: grid; gap: .35rem; }
.company-perks li { display: flex; gap: .5rem; align-items: center; }
.company-perks svg { width: 1rem; height: 1rem; color: var(--success); }
.company-people .people-row { border: 0; margin: 0; padding: .75rem 0; border-bottom: 1px solid var(--border); }
.company-people .people-row:last-of-type { border-bottom: 0; }

/* Cookie banner and Privacy Choices (consent.js) */
.consent { position: fixed; z-index: 150; left: 1rem; right: 1rem; bottom: 1rem; max-width: 34rem; margin-left: auto; padding: 1rem 1.15rem;
  border-radius: var(--radius-lg); background: var(--night-1); color: var(--night-text); border: 1px solid var(--night-line);
  box-shadow: 0 20px 60px -20px rgb(0 0 0 / .8); font-size: var(--step--1); }
.consent[hidden] { display: none; }
.consent p { margin: 0 0 .75rem; }
.consent b { color: var(--white); margin-right: .35rem; }
.consent a { color: var(--brand-gold); }
.consent .buttons { margin: 0; gap: .5rem; }
.consent .button:not(.cta) { background: rgb(255 255 255 / .06); color: var(--white); border: 1px solid var(--night-line); }
.consent__full { display: none; }
.consent.is-full .consent__short { display: none; }
.consent.is-full .consent__full { display: block; }
.consent h2 { font-size: var(--step-1); color: var(--white); margin: 0 0 .5rem; }
.consent fieldset { border: 0; margin: 0 0 .75rem; padding: 0; display: grid; gap: .6rem; }
.consent .muted { color: var(--night-muted); }
.link-button { background: none; border: 0; padding: 0; min-height: 0; box-shadow: none; color: inherit; font: inherit; cursor: pointer; text-decoration: none; }
.site-footer .link-button:hover { color: var(--brand-gold); }
/* Registration: classes and workshops chosen per person */
.class-picks { display: grid; gap: .75rem; }
.class-pick { display: grid; grid-template-columns: minmax(0, 1fr) minmax(10rem, auto); gap: .5rem 1.25rem; padding: .85rem 1rem;
  border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface); }
.class-pick.is-full { opacity: .65; }
.class-pick__what { display: grid; gap: .2rem; }
.class-pick__what b { color: var(--heading); }
.class-pick__tags { display: flex; flex-wrap: wrap; gap: .35rem; font-size: var(--step--1); }
.class-pick__tags span { padding: .1rem .5rem; border-radius: 999px; border: 1px solid var(--border); }
.class-pick__tags .is-low { border-color: var(--brand-orange, #ff6720); color: var(--brand-red); }
.class-pick__who { display: grid; gap: .25rem; align-content: start; }
.class-pick__who .check { margin: 0; }
@media (max-width: 40rem) { .class-pick { grid-template-columns: 1fr; } }
/* Schedule: My Schedule stars, sign-up line, by place (2026-10-05) */
.session-wrap { position: relative; }
.session-wrap .star { position: absolute; top: .55rem; right: .55rem; width: 2rem; height: 2rem; display: grid; place-items: center; padding: 0; min-height: 0;
  border-radius: 999px; border: 1px solid var(--border); background: var(--surface); color: var(--text-muted); cursor: pointer; box-shadow: none; }
.session-wrap .star svg { width: 1rem; height: 1rem; }
.session-wrap .star[aria-pressed="true"] { color: var(--brand-gold); border-color: var(--brand-gold); background: rgb(255 194 38 / .14); }
.session-wrap.is-starred .session-card { border-color: rgb(255 194 38 / .6); }
.session-wrap .session-card { padding-right: 2.75rem; }
.signup-line { display: flex; flex-wrap: wrap; gap: .3rem .5rem; margin-top: .4rem; font-size: var(--step--1); align-items: center; }
.signup-line b { color: var(--accent); }
.signup-line span { padding: .05rem .45rem; border-radius: 999px; border: 1px solid var(--border); }
.signup-line .is-low { color: var(--brand-red); border-color: var(--brand-orange, #ff6720); }
.signup-line .is-full { color: var(--text-muted); text-decoration: line-through; }
.chip.is-mine { background: rgb(23 104 58 / .16); color: var(--success); }
.schedule-tools__more { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; }
.schedule-tools__more .filter-chips svg { width: .9rem; height: .9rem; vertical-align: -2px; }
.loc-pick select { width: auto; min-width: 11rem; }
.view-switch { display: inline-flex; border: 1px solid var(--border); border-radius: 999px; padding: .15rem; }
.view-switch button { border: 0; background: none; box-shadow: none; min-height: 0; padding: .35rem .8rem; border-radius: 999px; cursor: pointer; color: var(--text-muted); font-weight: 600; }
.view-switch button[aria-pressed="true"] { background: var(--accent); color: var(--bg); }  /* light on red, dark on gold */
.schedule-count { margin: 0 0 0 auto; }
/* By Place: a board, one column per venue with its sessions in time order; it scrolls sideways when there are many venues (Steve, 2026-10-27) */
.by-place { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(16rem, 1fr); gap: .75rem; align-items: start; overflow: auto; max-height: calc(100vh - 11rem); padding-bottom: .5rem;
  scrollbar-width: thin; scrollbar-color: var(--border) transparent; overscroll-behavior: contain; }
.by-place__col { min-width: 0; padding: 0 .6rem .6rem; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface-2, var(--surface)); }
.by-place__col > h3 { position: sticky; top: 0; z-index: 2; display: flex; gap: .4rem; align-items: center; font-size: var(--step-0); margin: 0 -.6rem .6rem; padding: .7rem .8rem; border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  background: var(--surface-2, var(--surface)); border-bottom: 1px solid var(--border); }
.by-place__col > h3 span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.by-place__col > h3 small { color: var(--text-muted); font-weight: 500; }
.by-place__col > h3 svg { width: 1rem; height: 1rem; color: var(--accent); flex: none; }
.by-place__col .items { display: grid; gap: .5rem; }
@media (max-width: 63.99rem) { .by-place { max-height: none; grid-auto-columns: 84%; scroll-snap-type: x mandatory; } .by-place__col { scroll-snap-align: start; } .by-place__col > h3 { position: static; } }
/* Event maps */
.map-frame { border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--border); box-shadow: var(--shadow-lg); background: var(--surface); }
.map-frame iframe { display: block; width: 100%; height: min(75vh, 46rem); border: 0; }
.map-facts { display: grid; gap: 1rem; margin-top: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); }
.map-facts .card { margin: 0; display: grid; gap: .4rem; align-content: start; }
.map-facts h2 { display: flex; gap: .4rem; align-items: center; margin: 0; }
.map-facts h2 svg { width: 1.1rem; height: 1.1rem; color: var(--accent); }
.map-facts p { margin: 0; }
/* Pre-Glow & Afterglow */
.glow__pair { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); }
.glow__card { margin: 0; display: grid; gap: .6rem; align-content: start; }
.glow__card .eyebrow { margin: 0; }
.glow__card h2 { margin: 0; font-size: var(--step-3); }
.glow__when { display: flex; gap: .45rem; align-items: center; margin: 0; font-weight: 600; color: var(--heading); }
.glow__when svg { width: 1.1rem; height: 1.1rem; color: var(--accent); flex: none; }
.glow__menu { margin: 0; padding-left: 1.2rem; columns: 2; }
.glow__prices { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; }
.glow__prices li { display: flex; justify-content: space-between; padding: .45rem .7rem; border: 1px solid var(--border); border-radius: var(--radius-md); }
.glow__card .button { justify-self: start; }
.glow__grid { display: grid; gap: 1.25rem; margin-top: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.glow__grid .card { margin: 0; }
.glow__grid h2 { display: flex; gap: .4rem; align-items: center; margin: 0 0 .6rem; }
.glow__grid h2 svg { width: 1.1rem; height: 1.1rem; color: var(--accent); }
.glow__bar td { padding: .35rem 0; }
.loc-pick select { padding: .45rem 2rem .45rem .8rem; font-size: var(--step--1); min-height: 0; border-radius: 999px; }
/* A page that ends with its dark header: one silhouette row (the footer's), not two. */
main > .night:last-child > .ridge { display: none; }
main:has(> .night:last-child) + .site-footer { margin-top: 0; }
.reg-wait { display: grid; gap: 1.25rem; }
.reg-wait__count { margin: 0; }
.reg-status-card { display: grid; gap: .35rem; padding: 1rem 1.25rem; border-radius: var(--radius-lg); border: 1px solid var(--border); border-left: 4px solid var(--brand-gold); background: var(--surface); }
.reg-status-card b { color: var(--heading); font-size: var(--step-1); }
.reg-status-card.is-register, .reg-status-card.is-registered { border-left-color: var(--success); }
.reg-status-card .button { justify-self: start; margin-top: .4rem; }
.reg-wait__grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); }
/* Cart: renewal dates and what's next */
.cart-dates { display: block; font-size: var(--step--1); color: var(--text-muted); margin-top: .15rem; }
.cart-dates b { color: var(--success); font-weight: 650; }
.cart-next { display: grid; gap: .3rem; margin-top: 1.25rem; padding: .9rem 1rem; border-radius: var(--radius-md); border: 1px solid var(--border);
  border-left: 3px solid var(--brand-gold); font-size: var(--step--1); }
.cart-next .eyebrow { margin: 0; }
.cart-next b { color: var(--heading); font-size: var(--step-0); }
.cart-next.is-register, .cart-next.is-registered { border-left-color: var(--success); }
.cart-next .button { margin-top: .4rem; }
.renew-first__grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); }
.renew-first__grid .card { margin: 0; display: grid; gap: .4rem; align-content: start; }
.renew-first__grid h2 { display: flex; gap: .4rem; align-items: center; margin: 0; }
.renew-first__grid h2 svg { width: 1.1rem; height: 1.1rem; color: var(--accent); }
.renew-first__grid p { margin: 0; }
/* Home: thank you, for a month after an event */
.thanks__card { padding: 1.75rem 2rem; border-radius: var(--radius-lg); border: 1px solid rgb(255 194 38 / .35);
  background: linear-gradient(135deg, rgb(255 103 32 / .12), rgb(171 35 40 / .08) 55%, transparent); }
.thanks__card h2 { font-size: var(--step-3); margin: .25rem 0 .75rem; }
.thanks__card p { max-width: 60ch; }
.thanks__card .buttons { margin-top: 1rem; }

/* "Something new on the site" (update.js): the bottom of the screen glows, a firework bursts, Refresh for Latest */
.update-glow { position: fixed; z-index: 399; left: 0; right: 0; bottom: 0; height: 9rem; pointer-events: none; opacity: 0;
  background: radial-gradient(60% 100% at 50% 100%, rgb(255 103 32 / .45), rgb(210 60 124 / .22) 45%, rgb(109 63 160 / 0) 75%);
  transition: opacity .6s; animation: update-horizon 3s ease-in-out infinite; }
.update-glow.is-in { opacity: 1; }
@keyframes update-horizon { 50% { filter: brightness(1.35); } }
.update-toast { position: fixed; z-index: 400; left: 50%; bottom: 1.25rem; transform: translate(-50%, 1.5rem); opacity: 0;
  display: flex; gap: .75rem; align-items: center; max-width: calc(100vw - 2rem); padding: .5rem .5rem .5rem .75rem; border-radius: 999px;
  background: #0b1020; color: #eef1f8; font: 500 15px/1.3 system-ui, sans-serif; border: 1px solid rgb(255 194 38 / .55);
  box-shadow: 0 0 0 1px rgb(255 103 32 / .25), 0 0 28px rgb(255 103 32 / .45), 0 18px 40px -12px rgb(0 0 0 / .7);
  transition: transform .35s cubic-bezier(.2, .8, .2, 1), opacity .35s; animation: update-glow 2.4s ease-in-out infinite; }
.update-toast.is-in { transform: translate(-50%, 0); opacity: 1; }
.update-toast__msg { display: flex; align-items: center; gap: .6rem; }
.update-toast b { color: #ffc226; margin-right: .25rem; }
.update-toast__burst { flex: none; width: 2.4rem; height: 2.4rem; overflow: visible; }
.update-toast__burst .core { fill: #fff6d6; animation: update-core 1.8s ease-out infinite; }
.update-toast__burst .ray { stroke-width: 2.2; stroke-linecap: round; stroke-dasharray: 10 20; stroke-dashoffset: 10;
  animation: update-ray 1.8s cubic-bezier(.2, .7, .3, 1) infinite; }
.update-toast__burst .ray--0 { stroke: #ffc226; }
.update-toast__burst .ray--1 { stroke: #ff6720; animation-delay: .08s; }
.update-toast__burst .ray--2 { stroke: #d23c7c; animation-delay: .16s; }
@keyframes update-ray { 0% { stroke-dashoffset: 10; opacity: 0; } 15% { opacity: 1; } 60% { stroke-dashoffset: -6; opacity: 1; }
  100% { stroke-dashoffset: -20; opacity: 0; } }
@keyframes update-core { 0%, 100% { opacity: .35; transform: scale(.7); } 12% { opacity: 1; transform: scale(1.25); } }
.update-toast__go { border: 0; border-radius: 999px; padding: .55rem 1.05rem; font-weight: 700; cursor: pointer; color: #101820; white-space: nowrap;
  background: linear-gradient(135deg, #ffc226, #ff6720); box-shadow: 0 0 18px rgb(255 103 32 / .55); min-height: 0; }
.update-toast__x { border: 0; background: none; color: #9aa3b8; font-size: 1.3rem; line-height: 1; cursor: pointer; padding: .2rem .5rem; min-height: 0; box-shadow: none; }
.update-toast__x:hover { color: #fff; }
@keyframes update-glow { 50% { box-shadow: 0 0 0 1px rgb(255 103 32 / .4), 0 0 44px rgb(255 103 32 / .7), 0 18px 40px -12px rgb(0 0 0 / .7); } }
body:has(.reg-bar) .update-toast { bottom: 5rem; }
@media (max-width: 30rem) { .update-toast { left: .75rem; right: .75rem; transform: translateY(1.5rem); gap: .4rem; }  /* one row on phones: short words, no burst */
  .update-toast.is-in { transform: none; } .update-toast__msg { flex: 1 1 auto; min-width: 0; } .update-toast__burst, .update-toast__more { display: none; } }
@media (prefers-reduced-motion: reduce) { .update-toast, .update-glow, .update-toast__burst * { animation: none; transition: none; }
  .update-toast__burst .ray { stroke-dashoffset: 0; } }

/* Testing toolbox (stage and dev only; spark/testing/toolbox.py) */
.toolbox-fab { position: fixed; z-index: 390; left: 1rem; bottom: 1rem; width: 3rem; height: 3rem; min-height: 0; padding: 0; border-radius: 50%;
  display: grid; place-items: center; border: 2px solid #ffc226; background: #101820; color: #ffc226; cursor: pointer;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .35), 0 0 0 4px rgba(255, 194, 38, .18); }
.toolbox-fab:hover, .toolbox-fab[aria-expanded="true"] { background: #ffc226; color: #101820; }
.toolbox { position: fixed; z-index: 395; left: 1rem; bottom: 4.6rem; width: min(25rem, calc(100vw - 2rem)); max-height: calc(100vh - 6rem);
  overflow: auto; border-radius: 16px; border: 1px solid var(--border); background: var(--surface, var(--bg)); color: var(--text);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .45); opacity: 0; transform: translateY(.75rem); transition: opacity .18s ease, transform .18s ease; }
.toolbox.is-open { opacity: 1; transform: none; }
.toolbox__body { padding: .9rem 1rem 1rem; font-size: var(--step--1); }
.toolbox__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: .4rem; }
.toolbox__head h2 { margin: 0; font-size: var(--step-0); }
.toolbox__x { min-height: 0; padding: .2rem .5rem; border: 0; background: none; color: inherit; font-size: 1.1rem; cursor: pointer; box-shadow: none; }
.toolbox__said { margin: 0 0 .6rem; padding: .45rem .7rem; border-radius: 10px; background: rgba(255, 194, 38, .16); border: 1px solid rgba(255, 194, 38, .5); }
.toolbox__sec { padding: .7rem 0; border-top: 1px solid var(--border); }
.toolbox__sec h3 { margin: 0 0 .45rem; font-size: var(--step--1); text-transform: uppercase; letter-spacing: .05em; }
.toolbox__who { margin: 0 0 .5rem; }
.toolbox__tag { padding: .05rem .45rem; border-radius: 999px; background: #ffc226; color: #101820; font-size: .75rem; font-weight: 700; }
.toolbox__personas { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; }
.toolbox__personas form { margin: 0; }
.toolbox__persona { width: 100%; height: 100%; min-height: 0; display: grid; align-content: start; gap: .15rem; text-align: left; padding: .5rem .6rem; border-radius: 10px;
  border: 1px solid var(--border); background: transparent; color: inherit; cursor: pointer; box-shadow: none; font: inherit; }
.toolbox__persona span { color: var(--text-muted); font-size: .78rem; line-height: 1.3; }
.toolbox__persona:hover { border-color: #ffc226; }
.toolbox__search { width: 100%; }
.toolbox__results { list-style: none; margin: .4rem 0 0; padding: 0; display: grid; gap: .3rem; }
.toolbox__results button { width: 100%; min-height: 0; display: grid; text-align: left; padding: .45rem .6rem; border-radius: 10px; border: 1px solid var(--border);
  background: transparent; color: inherit; cursor: pointer; box-shadow: none; font: inherit; }
.toolbox__results button span { color: var(--text-muted); font-size: .78rem; }
.toolbox__results button:hover { border-color: #ffc226; }
.toolbox__switches { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0; }
.toolbox__links { line-height: 1.8; }
.toolbox__foot { margin: .3rem 0 0; font-size: .75rem; }
.view-as-strip--act { background: #ff6720; }
@media print { .toolbox-fab, .toolbox { display: none; } }

/* Support with context (spark/support/context.py) */
.glance { margin: 0 0 2rem; padding: 1.25rem 1.35rem; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); }
.glance h2 { margin: 0 0 .3rem; font-size: var(--step-1); }
.glance h3 { margin: 1.2rem 0 .5rem; font-size: var(--step-0); }
.glance__fixes { list-style: none; margin: .9rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: .6rem; }
.glance__fixes a { display: grid; gap: .2rem; height: 100%; padding: .75rem .9rem; border-radius: 12px; border: 1px solid var(--border); text-decoration: none; color: inherit; }
.glance__fixes a:hover, .glance__fixes a:focus-visible { border-color: #ffc226; }
.glance__fixes b { color: var(--link, inherit); }
.glance__fixes span { color: var(--text-muted); font-size: var(--step--1); }
.glance__table { width: 100%; font-size: var(--step--1); }
.glance__acts { white-space: nowrap; }
.glance__acts a + a { margin-left: .6rem; }
.glance__list { margin: 0; padding-left: 1.1rem; display: grid; gap: .35rem; }
.glance__list a { margin-left: .4rem; }
.glance__still { margin: 1.1rem 0 0; font-weight: 600; }
.need-help { margin: 1.25rem 0 0; font-size: var(--step--1); color: var(--text-muted); }
.need-help > span { display: inline-grid; place-items: center; width: 1.3em; height: 1.3em; margin-right: .3rem; border-radius: 50%; border: 1.5px solid currentColor; font-weight: 700; font-size: .8em; }
.ask-link { font-size: var(--step--1); white-space: nowrap; }
.card-actions { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: center; align-items: center; margin: 1.1rem 0 .4rem; }
/* Renewal: WAPM per person and a gift (membership/join.py _renew_extras) */
.renew-wapm { margin-top: .2rem; padding-top: .7rem; border-top: 1px dashed var(--border); }
.renew-wapm .hint { margin: .2rem 0 0; }
.renew-gift { margin-top: 1.5rem; }
.renew-gift h2 { margin-top: 0; }
.gift-amounts { border: 0; padding: 0; margin: .6rem 0 0; }
/* Event registration: running total, who's coming (registration/routes.py _running) */
.reg-total { margin-bottom: 1.5rem; padding: 1rem 1.1rem; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); }
.reg-total h2 { margin: 0 0 .6rem; }
.reg-total__lines { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; font-size: var(--step--1); }
.reg-total__lines li { display: flex; justify-content: space-between; gap: .75rem; }
.reg-total__lines small { display: block; color: var(--text-muted); }
.reg-total__lines li > span:last-child { white-space: nowrap; font-variant-numeric: tabular-nums; }
.reg-total__sum { display: flex; justify-content: space-between; margin: .8rem 0 0; padding-top: .7rem; border-top: 1px solid var(--border); font-size: var(--step-0); }
.reg-total__sum b { font-variant-numeric: tabular-nums; }
.person-pick:not(:has(input[type=checkbox]:checked)) .person-pick__more { display: none; }
.add-person { margin: .8rem 0; padding: .9rem 1rem; border: 1px solid var(--border); border-radius: 12px; }
.add-person__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: .3rem; }
.link-button { min-height: 0; padding: 0; border: 0; background: none; box-shadow: none; color: var(--link, inherit); text-decoration: underline; cursor: pointer; font: inherit; font-size: var(--step--1); }
.add-buttons { margin-top: .6rem; }
.express { display: grid; gap: 1rem 1.5rem; align-items: center; margin-bottom: 1.5rem; border-color: rgba(255, 194, 38, .5); }
@media (min-width: 48rem) { .express { grid-template-columns: minmax(0, 1fr) auto; } }
.express__main { min-width: 0; } .express .eyebrow { margin: 0 0 .15rem; }
.express__chips { list-style: none; display: flex; flex-wrap: wrap; gap: .4rem; margin: .5rem 0; padding: 0; }
.express__chips li { padding: .2rem .7rem; border-radius: 999px; background: var(--chip-bg); font-size: var(--step--1); white-space: nowrap; }
.express__chips li.is-extra { background: transparent; border: 1px solid var(--border); color: var(--text-muted); }
.express__go { margin: 0; }
.express h2 { margin: 0 0 .3rem; }
.express p { margin: 0 0 .3rem; }
.reg-total__people { list-style: none; margin: 0 0 .6rem; padding: 0; display: grid; gap: .7rem; font-size: var(--step--1); }
.reg-total__people small { display: block; color: var(--text-muted); }
.reg-total__row { display: flex; justify-content: space-between; gap: .75rem; }
.reg-total__row span { white-space: nowrap; font-variant-numeric: tabular-nums; }
.reg-total__extra { padding-left: .6rem; }
.ticket-list { display: grid; gap: .45rem; }
.ticket-opt { display: grid; grid-template-columns: auto 1fr auto; gap: .7rem; align-items: start; padding: .7rem .9rem; border: 1px solid var(--border); border-radius: 12px; cursor: pointer; }
.ticket-opt:has(input:checked) { border-color: #ffc226; background: rgba(255, 194, 38, .07); }
.ticket-opt input { margin-top: .2rem; }
.ticket-opt__name { font-weight: 650; }
.ticket-opt__name small { display: block; font-weight: 400; color: var(--text-muted); font-size: var(--step--1); margin-top: .15rem; }
.ticket-opt__price { font-weight: 700; color: #ffc226; white-space: nowrap; }
.person-addons { margin-top: .9rem; padding-top: .9rem; border-top: 1px dashed var(--border); display: grid; gap: .75rem 1rem;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); align-items: end; }
.person-addons__who { grid-column: 1 / -1; }
.addon-tile { display: grid; gap: .35rem; margin: 0; min-width: 0; align-content: end; }
.addon-tile__label { font-size: var(--step--1); font-weight: 650; color: var(--heading); line-height: 1.25; overflow-wrap: anywhere; }
.addon-tile__control { box-sizing: border-box; width: 100%; min-width: 0; height: 2.9rem; margin: 0; border: 1px solid var(--border); border-radius: 12px;
  background: var(--surface); padding: 0 .8rem; font-size: var(--step--1); }
label.addon-tile__control { display: flex; align-items: center; gap: .55rem; cursor: pointer; font-weight: 500; }
label.addon-tile__control:has(input:checked) { border-color: var(--cta); }
.addon-tile__text { flex: 1; min-width: 0; }
.addon-tile__price { color: var(--accent); white-space: nowrap; }
.person-addons .check { margin: 0; }
.ticket-opt--none .ticket-opt__name { font-weight: 500; color: var(--text-muted); }
.person-addons--row { margin: 0 0 .8rem; padding: .7rem .9rem; border: 1px solid var(--border); border-radius: 12px; border-top-style: solid; }
.review { display: grid; gap: .2rem; }
.review-person { padding: .6rem 0 .7rem; border-bottom: 1px solid var(--border); }
.review-person__head, .review-line, .review-total { display: flex; justify-content: space-between; gap: 1rem; }
.review-person__head { font-size: var(--step-0); margin-bottom: .2rem; }
.review-line { color: var(--text-muted); font-size: var(--step--1); padding: .1rem 0 .1rem .8rem; }
.review-line span:last-child, .review-total span:last-child, .review-person__head span { white-space: nowrap; font-variant-numeric: tabular-nums; }
.review-line--strong { color: var(--text); font-size: var(--step-0); padding: .55rem 0; border-bottom: 1px solid var(--border); }
.review-total { font-weight: 800; font-size: var(--step-1); padding: .8rem 0 .4rem; }
.promo { margin-top: .6rem; font-size: var(--step--1); }
.promo summary { cursor: pointer; color: var(--text-muted); }
.promo-row { display: flex; gap: .5rem; align-items: center; margin-top: .5rem; flex-wrap: wrap; }
.promo-row input { max-width: 12rem; }
.person-pick__remove { margin-top: .4rem; color: var(--text-muted); }

/* Phones: the form first; a bar pinned to the bottom keeps the total in view (registration/_aside.html). */
.reg-bar { display: none; }
@media (max-width: 860px) {
  .reg-bar { display: flex; position: fixed; z-index: 380; left: 0; right: 0; bottom: 0; justify-content: space-between; align-items: center; gap: 1rem;
    padding: .7rem 1rem calc(.7rem + env(safe-area-inset-bottom)); background: #0d1230; color: #fff; border-top: 1px solid rgba(255, 194, 38, .45);
    box-shadow: 0 -8px 24px rgba(0, 0, 0, .35); font-size: var(--step--1); }
  .reg-bar b { font-size: var(--step-0); font-variant-numeric: tabular-nums; }
  .reg-bar a { color: #ffc226; }
  body:has(.reg-bar) .toolbox-fab { bottom: 4.6rem; }
  .person-addons { grid-template-columns: 1fr; }
  .ticket-opt { grid-template-columns: auto 1fr; }
  .ticket-opt__price { grid-column: 2; }
}
@media (max-width: 30rem) {
  .header-actions { gap: .25rem; }
  .header-actions .icon-button { width: 2.75rem; height: 2.75rem; }
}

/* Cart notes (decision 2026-10-06): a renewal a registration needs blocks checkout; reminders ask about RV, dinners, guests */
.cart-notes { color: var(--text); }
.cart-notes.error { color: var(--text); background: var(--surface); }
.cart-notes > p:first-child { margin: 0 0 .35rem; color: var(--heading); }
.cart-note { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .4rem 1rem; margin: 0; padding: .45rem 0;
  border-top: 1px solid var(--border); }
.cart-group__actions { margin: .5rem 0 0; }
.add-more { display: grid; gap: .5rem; }
.ticket-note { border: 1px solid var(--border); border-left: 3px solid var(--cta); border-radius: var(--radius-md); padding: .6rem .9rem;
  margin: 0 0 1rem; background: var(--surface); font-size: var(--step--1); }
.ticket-note p { margin: .15rem 0; }
.person-addons .check.is-off { opacity: .55; cursor: not-allowed; }
/* My Account: each person's add-ons, and asking to take something off (decision 2026-10-06) */
.party-extras { list-style: none; margin: .35rem 0 .25rem; padding: 0; display: grid; gap: .25rem; font-size: var(--step--1); }
.party-extras > li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .25rem .75rem; }
.party-extras--shared { margin: .75rem 0; }
.remove-request > summary { list-style: none; cursor: pointer; font-size: var(--step--1); }
.remove-request > summary::-webkit-details-marker { display: none; }
.remove-request[open] { flex-basis: 100%; }
.remove-request form { margin-top: .4rem; }

/* The one Forms page (decision 2026-10-06) */
.forms-find { margin-top: 1.25rem; display: grid; gap: .75rem; max-width: 46rem; }
.forms-find input[type=search] { font-size: var(--step-0); padding: .8rem 1rem; border-radius: 999px; }
.forms-chips { display: flex; flex-wrap: wrap; gap: .45rem; }
.forms-chip { min-height: 0; padding: .4rem .9rem; border-radius: 999px; border: 1px solid rgb(255 255 255 / .28); background: rgb(255 255 255 / .06);
  color: #fff; font-size: var(--step--1); font-weight: 600; cursor: pointer; box-shadow: none; }
.forms-chip:hover { border-color: #ffc226; }
.forms-chip.is-on { background: #ffc226; border-color: #ffc226; color: #101820; }
.forms-group { margin: 0 0 2.75rem; }
.forms-group__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: .5rem 1.5rem; margin-bottom: 1rem;
  border-bottom: 1px solid var(--border); padding-bottom: .6rem; }
.forms-group__head h2 { margin: 0; }
.forms-group__head p { margin: .2rem 0 0; }
/* The Forms page's cards (scoped to the list: .form-grid is also the site's form-field layout). Every card in a group is the
   same size; buttons sit at the bottom (Steve, 2026-10-17). */
ul.form-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 21rem), 1fr));
  grid-auto-rows: 1fr; }
.form-card { display: grid; grid-template-columns: 5.5rem 1fr; grid-template-rows: auto 1fr; gap: .25rem 1rem; padding: 1.1rem; border-radius: var(--radius-lg, 16px); height: 100%;
  background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow); }
.form-card:not(:has(.form-card__art)) { grid-template-columns: 1fr; }
.form-card__art { grid-row: span 2; width: 5.5rem; height: 5.5rem; border-radius: 14px; display: grid; place-items: center; background: #fff; overflow: hidden; }
.form-card__art img { display: block; width: 5.5rem; height: 5.5rem; padding: .45rem; box-sizing: border-box; object-fit: contain; }
.form-card__body h3 { margin: 0 0 .25rem; font-size: var(--step-1); }
.form-card__desc { color: var(--text-muted); font-size: var(--step--1); }
.form-card__desc p { margin: 0 0 .35rem; }
.form-card__meta { display: flex; flex-wrap: wrap; gap: .35rem; margin: .4rem 0 0; }
.form-card__actions { grid-column: 2; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .6rem; align-self: end; }
.form-card:not(:has(.form-card__art)) .form-card__actions { grid-column: 1; }
.form-card__actions .button svg { width: 1em; height: 1em; vertical-align: -.12em; }
/* Every action on a form card is the same size (Steve, 2026-11-01: "Get an Email When It Opens" and "Sign In to Fill Out" were different sizes): the full width of the card's action area, one height. */
.form-card__actions > .button, .form-card__actions .form-notify, .form-card__actions .form-notify form { width: 100%; }
.form-card__actions .button { min-height: 2.75rem; padding-block: 0; padding-inline: 1.1rem; display: inline-flex; align-items: center; justify-content: center; text-align: center; box-sizing: border-box; font-size: var(--step--1); }
.form-card__actions .form-notify .button { width: 100%; }
.form-card__upload { font-size: var(--step--1); flex-basis: 100%; }
.form-card.is-closed .form-card__art { filter: grayscale(.7); opacity: .75; }
.form-card--vendor { grid-template-columns: 1fr; text-align: center; }
.form-card--vendor .form-card__art { grid-row: auto; width: 100%; height: 8rem; justify-self: stretch; }
.form-card--vendor .form-card__art img { width: 100%; height: 8rem; padding: .6rem 1rem; }
.form-card--vendor .form-card__actions { grid-column: 1; justify-content: center; }
.form-card--vendor .form-card__meta { justify-content: center; }
.form-tag { display: inline-flex; align-items: center; gap: .3rem; padding: .15rem .55rem; border-radius: 999px; font-size: var(--step--2);
  font-weight: 700; background: var(--chip-bg); color: var(--text); }
.form-tag svg { width: .95em; height: .95em; }
.form-tag--open { background: rgb(52 168 83 / .16); color: var(--success); }
.form-tag--closed { background: var(--chip-bg); color: var(--text-muted); font-weight: 600; }
.form-tag--registered { background: rgb(255 103 32 / .14); }
.form-tag--member { background: rgb(109 63 160 / .16); }
.forms-help { margin-top: 1rem; }
.forms-help .plain-list li { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
@media (max-width: 30rem) { .form-card { grid-template-columns: 4rem 1fr; } .form-card__art, .form-card__art img { width: 4rem; height: 4rem; }
  .form-card__actions { grid-column: 1 / -1; } }
.paper-option { border: 1px dashed var(--border); border-radius: var(--radius-md); padding: .8rem 1rem; margin: 0 0 1.25rem; }
.paper-option p { margin: 0 0 .5rem; }
.paper-option .buttons { margin: 0; }
.code-input { font-size: 1.5rem; letter-spacing: .3em; text-align: center; font-variant-numeric: tabular-nums; }
.recovery-codes { columns: 2; list-style: none; padding: 0; font-size: var(--step-0); }
.recovery-codes li { margin: .2rem 0; }
.two-step-qr svg { width: 11rem; height: 11rem; border-radius: 8px; }
.two-step-key { word-break: break-all; }

/* Stripe deposit explorer: the items and form entry under each deposit line, and the tie/label form */
.table tr.subrow td { border-top: 0; padding-top: 0; font-size: .875rem; }
.table tr.subrow ul.plain { margin: 0 0 .35rem; display: grid; gap: .2rem; }
details.tie { margin-top: .35rem; }
details.tie[open] > summary { margin-bottom: .5rem; }
details.tie .filters { flex-wrap: wrap; }

/* Reports built in the background: the progress page and Your Reports on Stripe Deposits */
.report-job__status { display: flex; align-items: center; gap: .75rem; font-size: 1.1rem; margin: .25rem 0 .5rem; }
.spinner { width: 1.25rem; height: 1.25rem; border-radius: 50%; border: 3px solid var(--border); border-top-color: var(--accent); animation: spin .9s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .spinner { animation-duration: 3s; } }
.subhead { font-size: 1rem; margin: 1rem 0 .4rem; }
.report-list { display: grid; gap: .3rem; }

/* Between events: what's closed, and what to do meanwhile */
.between-hero h1 { max-width: 22ch; }
.between-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 1rem; }
.between-cards a { display: grid; gap: .35rem; height: 100%; padding: 1.25rem; border-radius: var(--radius-md); background: var(--surface); border: 1px solid var(--border);
  box-shadow: var(--shadow); color: var(--text); text-decoration: none; transition: transform .15s ease, border-color .15s ease; }
.between-cards a:hover { transform: translateY(-2px); border-color: var(--cta); }
.between-cards b { font-family: var(--font-display); font-size: var(--step-1); color: var(--heading); }
.between-cards span:last-child { color: var(--text-muted); font-size: var(--step--1); }
.between-cards__icon { width: 2.5rem; height: 2.5rem; display: grid; place-items: center; border-radius: .75rem; background: color-mix(in srgb, var(--cta) 20%, transparent); color: var(--heading); }
.between-cards__icon svg { width: 1.3rem; height: 1.3rem; }
.mega__note { display: inline-block; margin-left: .35rem; padding: .1rem .5rem; border-radius: 999px; font: 600 .7rem/1.4 var(--font-body, inherit);
  letter-spacing: .02em; text-transform: none; color: var(--text-muted); background: var(--surface-2); vertical-align: middle; }

/* Event guide pages: showcase, manufacturing, accommodations, the DO-IT week */
.guide-hero h1 { max-width: 20ch; }
.guide-hero__note { display: inline-block; margin-top: 1rem; padding: .5rem .9rem; border-radius: 999px; background: rgb(255 255 255 / .1);
  border: 1px solid rgb(255 255 255 / .2); font-size: var(--step--1); }
.guide-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, 22rem); gap: 2.5rem; align-items: start; }
.guide-split .flow > h2 { margin-top: 2rem; }
.guide-card { position: sticky; top: 6rem; padding: 1.5rem; border-radius: var(--radius-lg); background: var(--surface); border: 1px solid var(--border);
  box-shadow: var(--shadow); display: grid; gap: 1rem; }
.guide-card h2 { margin: 0; font-size: var(--step-1); }
.guide-facts { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.guide-facts li { display: grid; grid-template-columns: 2rem 1fr; gap: .6rem; align-items: start; }
.guide-facts svg { width: 2rem; height: 2rem; padding: .4rem; border-radius: .6rem; background: color-mix(in srgb, var(--cta) 22%, transparent); color: var(--heading); }
.guide-band { background: var(--surface-2); }
.timeline { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: 1rem; counter-reset: t; }
.timeline li { position: relative; display: grid; gap: .3rem; padding: 1.1rem 1.1rem 1.1rem 1.25rem; border-radius: var(--radius-md); background: var(--surface);
  border: 1px solid var(--border); border-top: 4px solid var(--cta); }
.timeline__when { font: 700 var(--step--1)/1.2 var(--font-display); color: var(--accent); text-transform: uppercase; letter-spacing: .04em; }
.timeline li span:not(.timeline__when) { color: var(--text-muted); font-size: var(--step--1); }
.timeline__show { border-top-color: var(--accent) !important; background: color-mix(in srgb, var(--cta) 10%, var(--surface)) !important; }
.steps { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .75rem; counter-reset: s; }
.steps li { counter-increment: s; display: grid; grid-template-columns: 2.6rem 1fr; grid-template-rows: auto auto; column-gap: 1rem; align-items: center;
  padding: 1rem 1.15rem; border-radius: var(--radius-md); background: var(--surface); border: 1px solid var(--border); }
.steps li::before { content: counter(s); grid-row: span 2; width: 2.6rem; height: 2.6rem; display: grid; place-items: center; border-radius: 50%;
  background: var(--cta); color: var(--cta-text); font: 800 1.1rem/1 var(--font-display); }
.steps span { color: var(--text-muted); font-size: var(--step--1); }
.week { list-style: none; margin: 0; padding: 0; display: grid; gap: .9rem; }
.week__day { display: grid; grid-template-columns: 8.5rem 1fr; gap: 1.25rem; padding: 1.2rem 1.3rem; border-radius: var(--radius-md); background: var(--surface);
  border: 1px solid var(--border); border-left: 5px solid var(--border); }
.week__day.is-highlight { border-left-color: var(--cta); background: color-mix(in srgb, var(--cta) 8%, var(--surface)); }
.week__date b { display: block; font: 800 var(--step-1)/1.1 var(--font-display); color: var(--heading); }
.week__date span { color: var(--text-muted); font-size: var(--step--1); }
.week__body h2 { margin: 0 0 .35rem; font-size: var(--step-1); }
.week__body p { margin: 0; }
.week__items { list-style: none; margin: .3rem 0 0; padding: 0; display: grid; gap: .3rem; }
.week__items li { display: grid; grid-template-columns: 8rem 1fr; gap: .75rem; }
.week__items span { font-weight: 700; color: var(--accent); font-variant-numeric: tabular-nums; }
@media (max-width: 860px) {
  .guide-split { grid-template-columns: 1fr; gap: 1.5rem; }
  .guide-card { position: static; }
}
@media (max-width: 600px) {
  .week__day { grid-template-columns: 1fr; gap: .5rem; }
  .week__items li { grid-template-columns: 6.5rem 1fr; }
}

/* Sponsors */
.sp-stats { display: flex; gap: 1rem; margin: 0; }
.sp-stats div { min-width: 7rem; padding: .8rem 1.1rem; border-radius: var(--radius-md); background: var(--surface); border: 1px solid var(--border); text-align: center; }
.sp-stats dt { font-size: var(--step--1); color: var(--text-muted); }
.sp-stats dd { margin: 0; font: 800 var(--step-2, 1.8rem)/1.1 var(--font-display); color: var(--heading); }
.sp-tier { margin: 2.25rem 0 1rem; font-size: var(--step--1); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); display: flex; align-items: center; gap: .75rem; }
.sp-tier::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.sp-logo { display: grid; place-items: center; flex: none; border-radius: var(--radius-md); background: #fff; border: 1px solid var(--border); overflow: hidden; }
.sp-logo img { width: 100%; height: 100%; object-fit: contain; padding: 10%; }
.sp-logo--lg { width: 11rem; height: 11rem; } .sp-logo--md { width: 100%; aspect-ratio: 16 / 9; } .sp-logo--sm { width: 3.25rem; height: 3.25rem; border-radius: .75rem; }
.sp-mono { font: 800 2rem/1 var(--font-display); color: var(--accent); }
.sp-logo--sm .sp-mono { font-size: 1.2rem; }
.sp-card { display: flex; flex-direction: column; gap: .75rem; padding: 1.25rem; border-radius: var(--radius-lg); background: var(--surface); border: 1px solid var(--border);
  box-shadow: var(--shadow); transition: transform .15s ease, box-shadow .15s ease; }
.sp-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.sp-card h4 { margin: 0; font-size: var(--step-1); }
.sp-card p { margin: 0; color: var(--text-muted); line-height: 1.55; }
.sp-card__head { display: flex; flex-wrap: wrap; gap: .4rem .6rem; align-items: center; }
.sp-feature { display: grid; gap: 1.25rem; }
.sp-card--feature { flex-direction: row; gap: 1.5rem; align-items: center; padding: 1.5rem; border: 2px solid var(--cta);
  background: linear-gradient(135deg, color-mix(in srgb, var(--cta) 10%, var(--surface)), var(--surface) 60%); }
.sp-card--feature h4 { font-size: var(--step-2, 1.8rem); }
.sp-card--feature p { margin-top: .5rem; color: var(--text); }
.sp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); gap: 1.1rem; }
.sp-more summary { list-style: none; cursor: pointer; }
.sp-more summary::-webkit-details-marker { display: none; }
.sp-more[open] summary { display: none; }
.sp-more summary p::after { content: " More"; color: var(--accent); font-weight: 700; }
.sp-badge { display: inline-flex; gap: .3rem; align-items: center; padding: .15rem .55rem; border-radius: 999px; background: color-mix(in srgb, var(--cta) 22%, transparent);
  color: var(--heading); font-size: .75rem; font-weight: 700; }
.sp-badge svg { width: .8rem; height: .8rem; }
.sp-tiles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: .75rem; }
.sp-tiles li { display: flex; gap: .75rem; align-items: center; padding: .75rem; border-radius: var(--radius-md); background: var(--surface); border: 1px solid var(--border); font-weight: 650; }
.sp-why { list-style: none; margin: 1rem 0; padding: 0; display: grid; gap: .75rem; }
.sp-why li { display: grid; grid-template-columns: 2.4rem 1fr; gap: .75rem; align-items: center; }
.sp-why svg { width: 2.4rem; height: 2.4rem; padding: .55rem; border-radius: .75rem; background: color-mix(in srgb, var(--cta) 22%, transparent); color: var(--heading); }
.sp-prices { list-style: none; margin: .5rem 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); gap: .4rem 1.5rem; }
.sp-prices li { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 0; border-bottom: 1px dashed var(--border); }
.sp-prices small { color: var(--text-muted); font-size: .75rem; }
@media (max-width: 700px) {
  .sp-card--feature { flex-direction: column; align-items: start; }
  .sp-logo--lg { width: 100%; height: auto; aspect-ratio: 16 / 9; }
  .section-head:has(.sp-stats) { flex-direction: column; align-items: start; }
}

.sp-card--feature.is-plain { padding: 1rem 1.25rem; }
.sp-card--feature.is-plain .sp-logo--sm { width: 3.5rem; height: 3.5rem; }

/* Member documents */
.doc-h { font-size: var(--step-1); margin: 0 0 .75rem; }
.doc-latest { list-style: none; margin: 0 0 2rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 1rem; }
.doc-card { display: grid; grid-template-columns: auto 1fr; gap: .9rem; align-items: start; height: 100%; padding: 1.1rem; border-radius: var(--radius-lg);
  background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow); color: var(--text); text-decoration: none; transition: transform .15s ease, border-color .15s ease; }
.doc-card:hover { transform: translateY(-2px); border-color: var(--tone, var(--cta)); }
.doc-card__body { display: grid; gap: .25rem; }
.doc-card__body b { color: var(--heading); line-height: 1.3; }
.doc-card__body small { color: var(--text-muted); font-size: var(--step--1); }
.doc-card__go { grid-column: 2; display: inline-flex; gap: .3rem; align-items: center; font-weight: 700; font-size: var(--step--1); color: var(--accent); }
.doc-card__go svg { width: .9rem; height: .9rem; transform: rotate(90deg); }
.doc-icon { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: .8rem; flex: none;
  background: color-mix(in srgb, var(--tone) 18%, transparent); color: var(--tone); }
.doc-icon svg { width: 1.35rem; height: 1.35rem; }
.doc-icon--board, .doc-tag--board, .doc-chip--board, .doc-card--board { --tone: #2f6fd6; }
.doc-icon--wapm-board, .doc-tag--wapm-board, .doc-chip--wapm-board, .doc-card--wapm-board { --tone: #8b4fd8; }
.doc-icon--wapm, .doc-tag--wapm, .doc-chip--wapm, .doc-card--wapm { --tone: #d9541e; }
.doc-icon--finance, .doc-tag--finance, .doc-chip--finance, .doc-card--finance { --tone: #17834a; }
:root[data-theme="dark"] .doc-icon, :root[data-theme="dark"] .doc-tag { filter: brightness(1.35); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .doc-icon, :root:not([data-theme="light"]) .doc-tag { filter: brightness(1.35); } }
.doc-tools { position: sticky; top: 4.75rem; z-index: 4; display: grid; gap: .75rem; padding: .9rem 0; margin-bottom: .5rem; background: var(--bg); }
.doc-search { display: flex; align-items: center; gap: .6rem; padding: 0 1rem; border-radius: 999px; border: 1.5px solid var(--border); background: var(--surface); }
.doc-search:focus-within { border-color: var(--cta); }
.doc-search svg { width: 1.1rem; height: 1.1rem; color: var(--text-muted); flex: none; }
.doc-search input { border: 0; background: transparent; box-shadow: none; padding: .8rem 0; min-height: 0; width: 100%; outline: none; }
.doc-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.doc-chip { min-height: 0; padding: .45rem .9rem; border-radius: 999px; border: 1.5px solid var(--border); background: var(--surface); color: var(--text);
  font: 650 var(--step--1)/1.2 var(--font-body, inherit); cursor: pointer; transform: none; }
.doc-chip span { margin-left: .3rem; color: var(--text-muted); font-weight: 500; }
.doc-chip:hover { border-color: var(--tone, var(--cta)); transform: none; }
.doc-chip.is-on { background: var(--tone, var(--cta)); border-color: var(--tone, var(--cta)); color: #fff; }
.doc-chip.is-on:not([class*="doc-chip--"]) { color: var(--cta-text); }
.doc-chip.is-on span { color: inherit; opacity: .8; }
.doc-years { display: grid; gap: .75rem; }
.doc-year { border-radius: var(--radius-lg); background: var(--surface); border: 1px solid var(--border); overflow: hidden; }
.doc-year > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 1rem; padding: 1rem 1.25rem; }
.doc-year > summary::-webkit-details-marker { display: none; }
.doc-year__y { font: 800 var(--step-1)/1 var(--font-display); color: var(--heading); }
.doc-year__n { color: var(--text-muted); font-size: var(--step--1); }
.doc-year__chev { margin-left: auto; display: grid; transition: transform .2s ease; transform: rotate(180deg); }
.doc-year__chev svg { width: 1.1rem; height: 1.1rem; }
.doc-year[open] .doc-year__chev { transform: none; }
.doc-list { list-style: none; margin: 0; padding: 0 .5rem .5rem; display: grid; }
.doc-list li + li { border-top: 1px solid var(--border); }
.doc-row { display: grid; grid-template-columns: auto 1fr auto; gap: .9rem; align-items: center; padding: .75rem; border-radius: var(--radius-md);
  color: var(--text); text-decoration: none; scroll-margin-top: 12rem; }
.doc-row:hover { background: var(--surface-2); }
.doc-row__body { display: grid; gap: .2rem; min-width: 0; }
.doc-row__body b { color: var(--heading); }
.doc-row__body small { display: flex; flex-wrap: wrap; gap: .25rem .6rem; align-items: center; font-size: var(--step--1); color: var(--text-muted); }
.doc-tag { padding: .05rem .5rem; border-radius: 999px; font-weight: 700; font-size: .72rem; color: var(--tone); background: color-mix(in srgb, var(--tone) 14%, transparent); }
.doc-row__go { padding: .35rem .8rem; border-radius: 999px; border: 1.5px solid var(--border); font-weight: 700; font-size: var(--step--1); color: var(--heading); }
.doc-row:hover .doc-row__go { border-color: var(--cta); background: var(--cta); color: var(--cta-text); }
.doc-viewer { width: min(64rem, 96vw); height: min(92vh, 60rem); max-height: none; padding: 0; border: 0; border-radius: var(--radius-lg);
  background: var(--surface); color: var(--text); box-shadow: var(--shadow-lg); display: none; flex-direction: column; overflow: hidden; }
.doc-viewer[open] { display: flex; }
.doc-viewer::backdrop { background: rgb(5 8 18 / .7); backdrop-filter: blur(3px); }
.doc-viewer__head { display: flex; flex-wrap: wrap; gap: .75rem 1rem; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; border-bottom: 1px solid var(--border); }
.doc-viewer__head h2 { margin: 0; font-size: var(--step-1); }
.doc-viewer__head p { margin: .15rem 0 0; font-size: var(--step--1); }
.doc-viewer__actions { display: flex; gap: .5rem; align-items: center; }
.doc-viewer__actions .button svg { width: 1rem; height: 1rem; }
.doc-viewer__close { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; min-height: 0; padding: 0; border-radius: 50%; border: 1.5px solid var(--border);
  background: var(--surface); color: var(--text); cursor: pointer; transform: none; }
.doc-viewer__close svg { width: 1.1rem; height: 1.1rem; }
.doc-viewer__desc { margin: 0; padding: .6rem 1.25rem; font-size: var(--step--1); background: var(--surface-2); }
.doc-viewer__frame { flex: 1; min-height: 0; background: #525659; }
.doc-viewer__frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.doc-viewer__note { margin: 0; padding: .5rem 1.25rem; font-size: .75rem; border-top: 1px solid var(--border); }
html.doc-viewing { overflow: hidden; }
@media (max-width: 640px) {
  .doc-viewer { width: 100vw; height: 100dvh; border-radius: 0; }
  .doc-row { grid-template-columns: auto 1fr; } .doc-row__go { display: none; }
  .doc-tools { top: 4rem; }
}

/* My Account → Giving: a heading per year with totals, then that year's statements and gifts */
.giving-year { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .75rem; margin: 1.5rem 0 .25rem; font-size: 1.15rem; }
.giving-year:first-of-type { margin-top: .5rem; }
.giving-year .muted { font: 500 .9rem var(--font-body); }
.giving-statements { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem 1rem; margin: 0 0 .5rem; font-size: .9rem; }
.giving-statements a { display: inline-flex; align-items: center; gap: .3rem; }
.giving-statements svg { width: 1rem; height: 1rem; }
.gift-org { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; border: 0; padding: 0; margin: .75rem 0; }
.gift-org legend { font-weight: 600; margin-bottom: .25rem; }

/* Giving pages (/give, /give/education, /give/tribute, /give/in-kind) */
.give-impact { display: inline-flex; align-items: center; gap: .5rem; margin-top: 1.25rem; padding: .5rem .9rem; border-radius: 999px;
  background: color-mix(in srgb, var(--brand-gold) 14%, transparent); color: var(--night-text); font-size: var(--step--1); }
.give-impact svg { width: 1.1rem; height: 1.1rem; color: var(--brand-gold); }
.give-ways { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); }
.give-way { display: flex; flex-direction: column; gap: .5rem; padding: 1.4rem; border-radius: var(--radius-lg); background: var(--surface);
  border: 1px solid var(--border); box-shadow: var(--shadow); transition: transform .2s var(--ease-out), border-color .2s; }
.give-way:hover { transform: translateY(-2px); border-color: var(--accent); }
.give-way h3 { margin: 0; font-size: var(--step-1); }
.give-way p { margin: 0; color: var(--text-muted); flex: 1; }
.give-way .arrow-link { margin-top: .4rem; }
.give-way__icon { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; background: var(--sunset-soft); color: var(--heading); }
.give-way__icon svg { width: 1.35rem; height: 1.35rem; }
.give-way--any { background: var(--surface-2); }
.give-list { list-style: none; padding: 0; margin: 0 0 1.5rem; display: grid; gap: .75rem; }
.give-list li { display: grid; gap: .1rem; padding-left: 1rem; border-left: 3px solid var(--brand-gold); }
.give-list span { color: var(--text-muted); font-size: var(--step--1); }
.give-offer textarea { min-height: 6rem; }
@media (prefers-reduced-motion: reduce) { .give-way, .give-way:hover { transition: none; transform: none; } }
.hint-night { margin-top: .75rem; color: var(--night-muted); font-size: var(--step--1); }

/* Phones (2026-10-17 mobile pass): iOS zooms into fields under 16px, so filters and pickers keep 16px on touch. */
@media (max-width: 48rem), (pointer: coarse) {
  .loc-pick select, .filter-bar select, .filter-bar input, .doc-filters input, .header-search__form input, .search input[type=search] { font-size: 16px; }
  .filter-chips button, .search-kinds a { min-height: 40px; }
}

/* Find My Account (2026-10-17) */
.find__ways { display: grid; grid-template-columns: repeat(3, 1fr); gap: .25rem; padding: .25rem; margin: 0 0 1rem; border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 60%, transparent); border: 1px solid var(--border); }
.find__ways a { display: grid; place-items: center; min-height: 2.6rem; border-radius: 999px; font-weight: 650; color: var(--text-muted); text-decoration: none; }
.find__ways a[aria-current] { background: var(--surface); color: var(--text); box-shadow: var(--shadow-sm, 0 1px 3px rgb(0 0 0 / .12)); }
.find__any { gap: .6rem; }
.find__results { margin: 0 0 1.25rem; }
.find__results h2 { font-size: var(--step-1); margin: 0 0 .6rem; }
.find__result { display: grid; gap: .5rem; padding: .9rem; margin-bottom: .6rem; border-radius: var(--radius-md); border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 75%, transparent); }
.find__who { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .5rem; }
.find__who small { flex-basis: 100%; color: var(--text-muted); }
.find__alt { font-size: .95rem; }
.find .hint { margin: .1rem 0 0; color: var(--text-muted); font-size: .88rem; }

/* iOS Safari gives date and time fields their own minimum width, so they overflow narrow forms (Steve, 2026-10-17) */
input[type=date], input[type=datetime-local], input[type=time], input[type=month] { -webkit-appearance: none; appearance: none;
  min-width: 0; max-width: 100%; box-sizing: border-box; display: block; }
input[type=date]::-webkit-date-and-time-value, input[type=datetime-local]::-webkit-date-and-time-value, input[type=time]::-webkit-date-and-time-value { text-align: left; }
.find__verify { border: 1px solid var(--border); border-radius: var(--radius-md); padding: .4rem 1rem 1rem; margin: .4rem 0 0; min-width: 0; }
.find__verify legend { font-weight: 700; padding: 0 .35rem; }
.find__q { font-weight: 600; margin: .9rem 0 .4rem; }
.find__events { display: grid; gap: .45rem; }
.find__events .check { margin: 0; font-weight: 500; }

/* ---------- Sponsorship (spark/sponsors, 2026-10-17) ---------- */
.spx-where { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
.spx-where li { display: grid; gap: .35rem; padding: 1.2rem; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface); }
.spx-where svg { width: 2rem; height: 2rem; color: var(--accent); }
.spx-where span { color: var(--text-muted); font-size: var(--step--1); }
.spx-packages { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); align-items: stretch; }
.spx-pkg { position: relative; display: flex; flex-direction: column; gap: .5rem; padding: 1.4rem 1.2rem; border-radius: var(--radius-lg, 1rem);
  border: 1px solid var(--border); background: var(--surface); }
.spx-pkg.is-featured { border: 2px solid var(--brand-gold, #ffc226); box-shadow: 0 10px 40px -18px rgb(255 194 38 / .55); }
.spx-pkg.is-sold { opacity: .6; }
.spx-pkg__flag { position: absolute; top: -.75rem; left: 1.2rem; padding: .15rem .7rem; border-radius: 999px; background: var(--brand-gold, #ffc226); color: #101820;
  font-size: .75rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.spx-pkg h3 { margin: 0; font-size: var(--step-1); }
.spx-pkg__price { margin: 0; font-size: var(--step-3); font-weight: 800; letter-spacing: -.02em; }
.spx-pkg__limit { margin: 0; font-size: .85rem; font-weight: 700; color: var(--accent); }
.spx-pkg__blurb { margin: 0; color: var(--text-muted); font-size: var(--step--1); }
.spx-pkg__list { list-style: none; margin: .25rem 0 1rem; padding: 0; display: grid; gap: .4rem; flex: 1; font-size: var(--step--1); }
.spx-pkg__list li { display: grid; grid-template-columns: 1.1rem 1fr; gap: .45rem; align-items: start; }
.spx-pkg__list svg { width: 1.1rem; height: 1.1rem; color: var(--success, #2f9e5b); margin-top: .1rem; }
.spx-pkg .button.is-disabled { pointer-events: none; opacity: .7; }
.spx-compare { margin-top: 1.25rem; }
.spx-compare summary { cursor: pointer; font-weight: 700; padding: .6rem 0; }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.spx-table { width: 100%; border-collapse: collapse; font-size: var(--step--1); min-width: 36rem; }
.spx-table th, .spx-table td { padding: .55rem .6rem; border-bottom: 1px solid var(--border); text-align: center; }
.spx-table th[scope=row] { text-align: left; font-weight: 600; }
.spx-table thead th { vertical-align: bottom; }
.spx-yes svg { width: 1.1rem; height: 1.1rem; color: var(--success, #2f9e5b); }
.spx-no { color: var(--text-muted); }
.spx-glow { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .75rem; }
.spx-glow li { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; padding: .9rem 1.1rem; }
.spx-glow li .button { margin-left: auto; }
.spx-friend { display: grid; grid-template-columns: auto 1fr auto; gap: 1.25rem; align-items: center; padding: 1.5rem; border-radius: var(--radius-lg, 1rem);
  background: linear-gradient(120deg, color-mix(in srgb, var(--brand-orange, #f06b2a) 14%, var(--surface)), var(--surface)); border: 1px solid var(--border); }
.spx-friend > div:first-child svg { width: 3rem; height: 3rem; color: var(--brand-orange, #f06b2a); }
.spx-friend h2 { margin: .1rem 0 .4rem; font-size: var(--step-2); }
.spx-friend p { margin: 0 0 .3rem; }
@media (max-width: 40rem) { .spx-friend { grid-template-columns: 1fr; } }
.spx-wall { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); }
.spx-wall li { display: grid; grid-template-rows: 4.5rem auto; gap: .4rem; align-content: start; padding: .6rem; border-radius: var(--radius-md); background: #fff; border: 1px solid var(--border); overflow: hidden; min-width: 0; }
.spx-wall img { width: 100%; height: 100%; min-height: 0; object-fit: contain; display: block; }
.spx-wall span { color: #1b2030; font-size: var(--step--1); font-weight: 600; line-height: 1.2; text-align: center; overflow-wrap: anywhere; }
details.faq { border-bottom: 1px solid var(--border); padding: .4rem 0; }
details.faq summary { cursor: pointer; font-weight: 650; padding: .5rem 0; }
details.faq p { color: var(--text-muted); margin: 0 0 .75rem; }

.spx-form fieldset > legend { font-size: var(--step-1); font-weight: 800; }
.spx-nav { display: flex; justify-content: space-between; gap: .75rem; margin-top: 1.25rem; }
.spx-form:not(.is-stepped) .spx-nav button[data-next], .spx-form:not(.is-stepped) .spx-nav button[data-back] { display: none; }
.spx-logo-step { display: grid; gap: 1.5rem; }
@media (min-width: 60rem) { .spx-logo-step { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; } }
.spx-editor__panel { display: grid; gap: .75rem; margin: .75rem 0; padding: .9rem; border-radius: var(--radius-md); border: 1px dashed var(--border); }
.spx-editor__stage { display: grid; place-items: center; gap: .3rem; padding: .75rem; border-radius: var(--radius-sm, .5rem);
  background: repeating-conic-gradient(#e7e7e7 0 25%, #ffffff 0 50%) 0 0 / 16px 16px; }
.spx-editor__stage canvas { max-width: 100%; max-height: 220px; height: auto; }
.spx-editor__stage small { color: #555; font-size: .75rem; }
.spx-editor__controls { display: grid; gap: .5rem; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); align-items: center; }
.spx-editor__controls label { margin: 0; font-weight: 600; font-size: .9rem; display: grid; gap: .2rem; }
.spx-editor__controls .check { display: flex; }
.spx-editor__controls input[type=range] { width: 100%; }
.spx-previews { display: grid; gap: .9rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); }
.spx-prev { margin: 0; display: grid; gap: .35rem; }
.spx-prev figcaption { font-size: .78rem; color: var(--text-muted); text-align: center; }
.spx-prev__card { display: grid; gap: .4rem; justify-items: center; text-align: center; padding: 1rem; border-radius: var(--radius-md); background: #fff; color: #101820;
  border: 1px solid #e3e3e3; min-height: 9rem; align-content: center; }
.spx-prev.is-dark .spx-prev__card { background: #0b1020; color: #f4f1ea; border-color: #2a3150; }
.spx-prev__logo { display: grid; place-items: center; width: 100%; height: 5rem; }
.spx-prev__logo img, .spx-prev__slide img, .spx-prev__page img { max-width: 100%; max-height: 100%; object-fit: contain; }
.spx-prev__logo span, .spx-prev__slide span { font-size: .8rem; color: #8a8f9c; border: 1px dashed #b7bcc8; border-radius: .4rem; padding: 1rem 1.2rem; }
.spx-prev__card small { color: inherit; opacity: .7; font-size: .8rem; }
.spx-prev__slide { aspect-ratio: 16 / 9; display: grid; place-items: center; align-content: center; gap: .35rem; padding: .75rem; border-radius: var(--radius-md);
  background: radial-gradient(ellipse at 50% 120%, #2a1440 0%, #05070f 65%); color: #f4f1ea; text-align: center; }
.spx-prev__slide small { font-size: .55rem; letter-spacing: .2em; text-transform: uppercase; color: #ffc226; }
.spx-prev__slide img { max-height: 3.4rem; background: #fff; padding: .35rem .5rem; border-radius: .4rem; }
.spx-prev__slide b { font-size: .8rem; }
.spx-prev__page { display: grid; gap: .4rem; justify-items: center; padding: 1rem; background: #fff; color: #111; border: 1px solid #ddd; border-radius: .25rem;
  min-height: 7rem; align-content: center; font-family: Georgia, serif; }
.spx-prev__page img { max-height: 3.5rem; filter: grayscale(1) contrast(1.1); }
.spx-summary { display: grid; gap: .25rem; padding: 1rem; border-radius: var(--radius-md); background: var(--surface); border: 1px solid var(--border); margin: 0 0 1rem; }
.spx-summary p { display: flex; justify-content: space-between; margin: 0; }
.spx-track { list-style: none; margin: 0 0 1.25rem; padding: 0; display: grid; gap: .6rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr)); }
.spx-track li { display: grid; gap: .15rem; padding: .8rem; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface); }
.spx-track li svg { width: 1.3rem; height: 1.3rem; color: var(--text-muted); }
.spx-track li small { color: var(--text-muted); font-size: .8rem; }
.spx-track li.is-done { border-color: color-mix(in srgb, var(--success, #2f9e5b) 50%, transparent); }
.spx-track li.is-done svg { color: var(--success, #2f9e5b); }
.spx-track li.is-now { border-color: var(--accent); } .spx-track li.is-now svg { color: var(--accent); }
.spx-track li.is-warn { border-color: var(--warning, #c98a00); } .spx-track li.is-warn svg { color: var(--warning, #c98a00); }
.spx-pay { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.spx-pay p { margin: .2rem 0 0; }
.spx-people { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.spx-people p { margin: .2rem 0 0; max-width: 40rem; }
.spx-people .button, .spx-pay .button { min-height: 44px; }
.spx-deal { margin: 0 0 1.5rem; padding: 1rem; border-radius: var(--radius-md); background: var(--surface); border: 1px solid var(--border); }
.spx-deal__list { display: grid; gap: .5rem; margin: 0; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
.spx-deal__list div { min-width: 0; }
.spx-deal__list dt { font-size: .8rem; color: var(--text-muted); }
.spx-deal__list dd { margin: 0; overflow-wrap: anywhere; }
.spx-page__grid { display: grid; gap: 2rem; }
@media (min-width: 60rem) { .spx-page__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: start; } }
.sp-friends { line-height: 1.9; color: var(--text-muted); }

/* ---------- WinterBlast accommodations: hotels, map, camping (2026-10-17) ---------- */
.stay-glance { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); }
.stay-glance li { display: grid; grid-template-columns: 2.2rem 1fr; gap: .7rem; align-items: center; padding: .9rem 1rem; border-radius: var(--radius-md);
  background: var(--surface); border: 1px solid var(--border); }
.stay-glance svg { width: 2.2rem; height: 2.2rem; padding: .45rem; border-radius: 50%; color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); }
.stay-glance b { display: block; }
.stay-glance span { color: var(--text-muted); font-size: var(--step--1); line-height: 1.35; }
.stay-glance span b { color: var(--text); font-size: var(--step-0); }
.stay-map-wrap { margin: 0 0 1.25rem; }
.stay-map { position: relative; height: clamp(18rem, 48vh, 30rem); border-radius: var(--radius-lg, 1rem); overflow: hidden; border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 70%, #9fb7c9); z-index: 0; }
.stay-map__hint { position: absolute; left: .6rem; bottom: .4rem; z-index: 500; margin: 0; padding: .2rem .5rem; border-radius: .4rem; font-size: .75rem;
  background: rgb(255 255 255 / .9); color: #333; pointer-events: none; }
.stay-map__legend { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .6rem; margin: .6rem 0 0; font-size: var(--step--1); color: var(--text-muted); }
.stay-map__legend a { margin-left: auto; font-weight: 600; }
.stay-pin { display: grid !important; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #101820; color: #fff; font: 800 13px/1 var(--font-body);
  border: 2px solid #fff; box-shadow: 0 2px 6px rgb(0 0 0 / .35); }
.stay-map__legend .stay-pin { display: inline-grid !important; width: 22px; height: 22px; font-size: 11px; }
.stay-pin--fav { background: var(--brand-orange, #f06b2a); }
.stay-pin--site { width: 34px; height: 34px; background: var(--brand-gold, #ffc226); color: #101820; font-size: 18px; }
.stay-map__legend .stay-pin--site { width: 24px; height: 24px; font-size: 13px; }
.leaflet-popup-content { font: 14px/1.4 var(--font-body); }
.stay-filters { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1rem; }
.stay-filters .chip { min-height: 40px; padding: .35rem .9rem; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); color: var(--text);
  font-weight: 600; cursor: pointer; }
.stay-filters .chip[aria-pressed="true"] { background: var(--night-1, #101820); color: #fff; border-color: transparent; }
.stay-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
.stay { display: flex; flex-direction: column; border-radius: var(--radius-lg, 1rem); overflow: hidden; background: var(--surface); border: 1px solid var(--border);
  transition: box-shadow .2s, border-color .2s; scroll-margin-top: 6rem; }
.stay.is-favorite { border-color: color-mix(in srgb, var(--brand-orange, #f06b2a) 55%, transparent); }
.stay.is-active, .stay:target { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent); }
.stay__photo { position: relative; aspect-ratio: 16 / 9; background: var(--night-1, #101820); }
.stay__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.stay__n { position: absolute; top: .6rem; left: .6rem; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: #101820; color: #fff;
  font-weight: 800; border: 2px solid #fff; }
.is-favorite .stay__n { background: var(--brand-orange, #f06b2a); }
.stay__fav { position: absolute; top: .65rem; right: .6rem; display: inline-flex; gap: .3rem; align-items: center; padding: .2rem .6rem; border-radius: 999px;
  background: rgb(16 24 32 / .82); color: #ffc226; font-size: .78rem; font-weight: 700; }
.stay__fav svg { width: .9rem; height: .9rem; }
.stay__body { display: flex; flex-direction: column; gap: .55rem; padding: 1rem 1.1rem 1.1rem; flex: 1; }
.stay__head { display: grid; gap: .15rem; }
.stay__head h3 { margin: 0; font-size: var(--step-1); line-height: 1.15; }
.stay__price { margin: 0; font-weight: 800; color: var(--accent); }
.stay__price small { font-weight: 500; color: var(--text-muted); margin-left: .1rem; }
.stay__blurb { margin: 0; color: var(--text-muted); }
.stay__features { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem; }
.stay__features li { padding: .15rem .55rem; border-radius: 999px; font-size: .8rem; background: color-mix(in srgb, var(--accent) 9%, transparent); }
.stay__note { margin: 0; font-size: .85rem; color: var(--text-muted); }
.stay__facts { display: grid; gap: .4rem; margin: .2rem 0 0; font-size: .9rem; }
.stay__facts div { display: grid; grid-template-columns: 1.2rem 1fr; gap: .5rem; align-items: start; }
.stay__facts dt svg { width: 1.1rem; height: 1.1rem; color: var(--text-muted); margin-top: .15rem; }
.stay__facts dd { margin: 0; }
.stay__facts small { color: var(--text-muted); }
.stay__code { font-family: ui-monospace, monospace; letter-spacing: .03em; }
.stay__actions { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: auto; padding-top: .5rem; }
.stay__actions .button.cta { flex: 1; }
.stay__actions [data-show-on-map] svg { width: 1rem; height: 1rem; }
.stay-map__views { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 .6rem; }
.stay-map__views .chip { min-height: 38px; padding: .3rem .85rem; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); color: var(--text); font-weight: 600; cursor: pointer; }
.stay-map__views .chip[aria-pressed="true"] { background: var(--night-1, #101820); color: #fff; border-color: transparent; }

/* ---------- WinterBlast camping page (2026-10-17) ---------- */
.camp-photo img { width: 100%; height: auto; border-radius: var(--radius-md); background: #fff; }
.camp-options { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 20rem)); }
.camp-option { padding: 1.2rem; border-radius: var(--radius-lg, 1rem); background: var(--surface); border: 1px solid var(--border); }
.camp-option.is-main { border: 2px solid var(--brand-gold, #ffc226); }
.camp-option h3 { margin: 0 0 .3rem; font-size: var(--step-0); }
.camp-option__price { margin: 0 0 .3rem; font-size: var(--step-3); font-weight: 800; letter-spacing: -.02em; }
.camp-option__price small { font-size: var(--step--1); font-weight: 500; color: var(--text-muted); }
.camp-option p:last-child { margin: 0; }
.camp-setup { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); }
.camp-setup li { padding: 1.2rem; border-radius: var(--radius-md); background: var(--surface); border: 1px solid var(--border); }
.camp-setup svg { width: 2.4rem; height: 2.4rem; padding: .5rem; border-radius: 50%; color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); }
.camp-setup h3 { margin: .6rem 0 .3rem; font-size: var(--step-1); }
.camp-setup p { margin: 0; color: var(--text-muted); }
.camp-pack { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
.camp-pack fieldset { margin: 0; padding: .9rem 1rem 1rem; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface); min-width: 0; }
.camp-pack legend { font-weight: 800; padding: 0 .3rem; }
.camp-pack .check { margin: .45rem 0 0; font-weight: 500; align-items: flex-start; }
.camp-pack .check input { margin-top: .15rem; flex: none; }
.camp-pack .check:has(input:checked) { color: var(--text-muted); text-decoration: line-through; }
.camp-rules { margin: 0 0 1rem; padding-left: 1.3rem; display: grid; gap: .5rem; }
.camp-map { height: 14rem; border-radius: var(--radius-md); overflow: hidden; border: 1px solid var(--border); margin: 0 0 .6rem; z-index: 0; position: relative; }
.camp-guide { border: 1px solid var(--border); border-radius: var(--radius-md); padding: .4rem 1.2rem; background: var(--surface); }
.camp-guide summary { cursor: pointer; padding: .7rem 0; list-style: none; }
.camp-guide summary h2 { display: inline; font-size: var(--step-1); margin: 0 .6rem 0 0; }
.camp-teaser { display: grid; grid-template-columns: auto 1fr auto; gap: 1.2rem; align-items: center; padding: 1.4rem; border-radius: var(--radius-lg, 1rem);
  background: linear-gradient(120deg, color-mix(in srgb, var(--brand-orange, #f06b2a) 14%, var(--surface)), var(--surface)); border: 1px solid var(--border);
  color: var(--text); text-decoration: none; }
.camp-teaser:hover { border-color: var(--accent); }
.camp-teaser__icon svg { width: 3rem; height: 3rem; color: var(--brand-orange, #f06b2a); }
.camp-teaser b { display: block; font-size: var(--step-2); margin: .1rem 0 .3rem; }
.camp-teaser > span:nth-child(2) > span:last-child { color: var(--text-muted); }
@media (max-width: 40rem) { .camp-teaser { grid-template-columns: 1fr; } }

/* ---------- About pages (spark/about, 2026-10-17) ---------- */
.about-cards { list-style: none; margin: 0; padding: 0; display: grid; gap: .9rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); }
.about-cards a { display: grid; gap: .3rem; height: 100%; padding: 1.1rem; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface);
  color: var(--text); text-decoration: none; transition: border-color .15s, transform .15s; }
.about-cards a:hover { border-color: var(--accent); transform: translateY(-2px); }
.about-cards svg { width: 1.8rem; height: 1.8rem; color: var(--accent); }
.about-cards span { color: var(--text-muted); font-size: var(--step--1); }
.about-purposes { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.about-purposes li { padding: 1.3rem; border-radius: var(--radius-md); background: var(--surface); border: 1px solid var(--border); }
.about-purposes svg { width: 2.4rem; height: 2.4rem; padding: .5rem; border-radius: 50%; color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); }
.about-purposes h3 { margin: .6rem 0 .3rem; font-size: var(--step-1); }
.about-purposes p { margin: 0; color: var(--text-muted); }
.about-face { display: grid; place-items: center; width: 5rem; height: 5rem; border-radius: 50%; overflow: hidden; flex: none;
  background: linear-gradient(135deg, var(--brand-orange, #f06b2a), var(--brand-gold, #ffc226)); color: #101820; font: 800 1.4rem/1 var(--font-display, inherit);
  box-shadow: 0 0 0 3px var(--surface), 0 0 0 4px var(--border); }
.about-face img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
.about-face.is-lg { width: 8.5rem; height: 8.5rem; font-size: 2.2rem; }
.about-strip { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); text-align: center; }
.about-strip li { display: grid; justify-items: center; gap: .25rem; }
.about-strip span { color: var(--text-muted); font-size: var(--step--1); }
.board-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); }
.board-card { display: grid; justify-items: center; align-content: start; gap: .4rem; padding: 1.6rem 1.2rem; text-align: center; border-radius: var(--radius-lg, 1rem);
  background: var(--surface); border: 1px solid var(--border); }
.board-card.is-lead { border: 2px solid var(--brand-gold, #ffc226); }
.board-card__role { margin: .5rem 0 0; font-size: .8rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.board-card h2 { margin: 0 0 .4rem; font-size: var(--step-1); }
.board-card .button { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .85rem; }
.board-card .button svg { width: 1rem; height: 1rem; flex: none; }
.region-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); }
.region-card { padding: 1.2rem; border-radius: var(--radius-md); background: var(--surface); border: 1px solid var(--border); }
.region-card__name { display: flex; align-items: center; gap: .35rem; margin: 0; font-size: .8rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); }
.region-card__name svg { width: 1rem; height: 1rem; }
.region-card h3 { margin: .3rem 0 .7rem; font-size: var(--step-1); }
.region-card .button svg, .board-card .button svg { width: 1rem; height: 1rem; }
.region-card__contact { display: grid; gap: .35rem; margin: 0; font-size: .92rem; }
.region-card__contact a { display: inline-flex; align-items: center; gap: .45rem; overflow-wrap: anywhere; }
.region-card__contact svg { width: 1rem; height: 1rem; flex: none; color: var(--text-muted); }
ul.region-open { list-style: none; margin: 0 0 1rem; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
ul.region-open > li { margin: 0; line-height: 1.3; }
.region-open li { padding: .3rem .8rem; border-radius: 999px; border: 1px dashed var(--border); background: var(--surface); font-weight: 600; }
.gov-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.gov-card { display: flex; flex-direction: column; gap: .5rem; padding: 1.4rem; border-radius: var(--radius-lg, 1rem); background: var(--surface); border: 1px solid var(--border); }
.gov-card.is-main { border: 2px solid var(--brand-gold, #ffc226); }
.gov-card > svg { width: 2.4rem; height: 2.4rem; color: var(--accent); }
.gov-card h2 { margin: 0; font-size: var(--step-1); }
.gov-card p { margin: 0 0 .5rem; color: var(--text-muted); flex: 1; }
.gov-card .button { align-self: flex-start; }
.gov-card .button svg, .guide-card .button svg { width: 1rem; height: 1rem; }
.board-card__email { color: var(--text-muted); font-size: .8rem; overflow-wrap: anywhere; }
.contact-to { display: grid; gap: .15rem; padding: 1rem 1.2rem; margin: 0 0 1rem; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface); }
.contact-to b { font-size: var(--step-1); } .contact-to a { font-size: var(--step--1); font-weight: 600; }
.spx-when-inkind { display: none; }
.spx-form:has(input[name=payment][value=in_kind]:checked) .spx-when-inkind { display: block; }
.spx-form:has(input[name=payment][value=in_kind]:checked) .spx-when-money { display: none; }

/* ---------- Friends of the WPA (2026-10-17) ---------- */
.friends-jump { display: flex; flex-wrap: wrap; gap: .5rem; padding-top: 1.25rem; }
.friends-jump a { padding: .35rem .85rem; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); color: var(--text);
  text-decoration: none; font-weight: 600; font-size: var(--step--1); }
.friends-jump a:hover { border-color: var(--accent); }
.friends-sponsors { list-style: none; margin: 0; padding: 0; display: grid; gap: .9rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 11rem), 1fr)); }
.friends-sponsors li { display: grid; justify-items: center; gap: .35rem; text-align: center; }
.friends-sponsors__logo { display: block; width: 100%; height: 7rem; padding: .7rem; border-radius: var(--radius-md); background: #fff;
  border: 1px solid var(--border); overflow: hidden; }
.friends-sponsors li.is-top .friends-sponsors__logo { border: 2px solid var(--brand-gold, #ffc226); }
.friends-sponsors__logo img { display: block; width: 100%; height: 100%; object-fit: contain; }
.friends-sponsors__name { font-weight: 650; font-size: var(--step--1); }
.friends-sponsors small { color: var(--text-muted); font-size: .75rem; }
.friends-people { margin-top: 1.5rem; } .friends-people h3 { font-size: var(--step-0); margin: 0 0 .3rem; }
.friends-people p { margin: 0; color: var(--text-muted); line-height: 1.9; }
.friends-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.75rem; padding: 1.4rem;
  border-radius: var(--radius-lg, 1rem); background: linear-gradient(120deg, color-mix(in srgb, var(--brand-gold, #ffc226) 16%, var(--surface)), var(--surface));
  border: 1px solid var(--border); }
.friends-cta h3 { margin: 0 0 .3rem; font-size: var(--step-1); } .friends-cta p { margin: 0; color: var(--text-muted); max-width: 60ch; }
.friends-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
.friend { display: grid; grid-template-columns: 5rem 1fr; gap: 1rem; align-items: start; height: 100%; padding: 1rem; border-radius: var(--radius-md);
  border: 1px solid var(--border); background: var(--surface); color: var(--text); text-decoration: none; transition: border-color .15s, transform .15s; }
.friend:hover { border-color: var(--accent); transform: translateY(-2px); }
.friend__logo { display: grid; place-items: center; width: 5rem; height: 5rem; padding: .45rem; border-radius: var(--radius-md); background: #fff; border: 1px solid #e6e6e6; }
.friend__logo.is-dark { background: #101820; border-color: #101820; }
.friend__logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.friend__logo svg { width: 2.2rem; height: 2.2rem; color: var(--accent); }
.friend__body { display: grid; gap: .25rem; }
.friend__body > span:not(.friend__link) { color: var(--text-muted); font-size: var(--step--1); line-height: 1.45; }
.friend__link { display: inline-flex; align-items: center; gap: .3rem; color: var(--accent); font-size: .82rem; font-weight: 600; }
.friend__link svg { width: .85rem; height: .85rem; }
.friends-duo { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); }
.friends-card { display: grid; grid-template-columns: 5rem 1fr; gap: 1rem; align-items: center; padding: 1.2rem; border-radius: var(--radius-lg, 1rem);
  border: 1px solid var(--border); background: var(--surface); color: var(--text); text-decoration: none; }
.friends-card:hover { border-color: var(--accent); }
.friends-card b { display: block; font-size: var(--step-1); margin: .1rem 0 .25rem; }
.friends-card > span:last-child > span:last-child { color: var(--text-muted); font-size: var(--step--1); }
.cf-turnstile-slot { margin: .5rem 0; } .cf-turnstile-slot:empty { margin: 0; }

/* A sponsor without a logo: their name as a wordmark on the night-sky tile (2026-10-17) */
.sp-mark { position: relative; display: grid; place-items: center; align-content: center; gap: .35rem; width: 100%; height: 100%; padding: .6rem .8rem;
  text-align: center; color: #fff; overflow: hidden; isolation: isolate;
  background: radial-gradient(ellipse at 50% 130%, color-mix(in srgb, var(--brand-orange, #f06b2a) 55%, transparent) 0%, transparent 60%),
              radial-gradient(ellipse at 15% -20%, color-mix(in srgb, #8b3fd1 60%, transparent) 0%, transparent 55%), #101527; }
.sp-mark::after { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .5;
  background-image: radial-gradient(1px 1px at 20% 30%, #fff, transparent), radial-gradient(1px 1px at 75% 20%, #fff, transparent),
    radial-gradient(1px 1px at 60% 70%, #fff, transparent), radial-gradient(1.5px 1.5px at 35% 80%, #ffc226, transparent); }
.sp-mark svg { width: 1.1rem; height: 1.1rem; color: var(--brand-gold, #ffc226); flex: none; }
.sp-mark b, .friends-sponsors__logo .sp-mark b { color: #fff; text-shadow: 0 1px 12px rgb(0 0 0 / .45); font: 800 1.05rem/1.15 var(--font-display, inherit); letter-spacing: -.01em; overflow-wrap: anywhere;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.sp-mark.is-long b { font-size: .9rem; }
.sp-mark.is-sm { padding: 0; } .sp-mark.is-sm b { font-size: 1.2rem; color: var(--brand-gold, #ffc226); }
.friends-sponsors__logo.is-mark, .sp-logo.is-mark { padding: 0; border-color: transparent; background: #101527; }
.sp-logo--lg .sp-mark b { font-size: 1.6rem; } .sp-logo--lg .sp-mark svg { width: 1.6rem; height: 1.6rem; }
.form-tag--signed_in { background: rgb(60 120 200 / .14); }

/* ---------- Privacy policy (2026-10-17) ---------- */
.privacy { display: grid; gap: 2rem; }
@media (min-width: 60rem) { .privacy { grid-template-columns: 15rem minmax(0, 1fr); align-items: start; } .privacy__toc { position: sticky; top: 6rem; } }
.privacy__toc { padding: 1rem 1.1rem; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface); }
.privacy__toc ol { margin: .4rem 0 .8rem; padding-left: 1.2rem; display: grid; gap: .3rem; font-size: var(--step--1); }
.privacy__toc a { color: var(--text); text-decoration: none; } .privacy__toc a:hover { color: var(--accent); text-decoration: underline; }
.privacy__body { max-width: 46rem; }
.privacy__body section { scroll-margin-top: 6rem; padding: 0 0 1.4rem; margin: 0 0 1.4rem; border-bottom: 1px solid var(--border); }
.privacy__body section:last-child { border-bottom: 0; }
.privacy__body h2 { font-size: var(--step-2); margin: 0 0 .6rem; }
.privacy__body ul { padding-left: 1.2rem; } .privacy__body li + li { margin-top: .4rem; }
.privacy__short { padding: 1.3rem 1.4rem !important; border-radius: var(--radius-lg, 1rem); border: 1px solid var(--border) !important;
  background: color-mix(in srgb, var(--accent) 5%, var(--surface)); }
ul.privacy__points { list-style: none; padding: 0; margin: 0; display: grid; gap: .7rem; }
ul.privacy__points li { display: grid; grid-template-columns: 1.6rem 1fr; gap: .6rem; align-items: start; margin: 0; }
ul.privacy__points svg { width: 1.4rem; height: 1.4rem; color: var(--accent); margin-top: .1rem; }

/* Schedule: folding filters and My Schedule exports (2026-10-17) */
.filters-toggle { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.6rem; padding: .35rem .9rem; border-radius: 999px;
  border: 1.5px solid var(--border); background: var(--surface); color: var(--text); font-weight: 650; cursor: pointer; box-shadow: none; }
.filters-toggle svg { width: 1rem; height: 1rem; }
.filters-toggle[aria-expanded="true"] { border-color: var(--accent); }
.filters-toggle__n { display: inline-grid; place-items: center; min-width: 1.3rem; height: 1.3rem; padding: 0 .3rem; border-radius: 999px;
  background: var(--accent); color: #fff; font-size: .75rem; }
.schedule-tools .row:first-child .schedule-count { margin-left: auto; }
.schedule-tools.is-folded { padding-bottom: .7rem; }
/* The schedule: a filter sidebar beside the sessions on a computer; on a phone the same controls are a sheet that slides up (Steve, 2026-10-27) */
.schedule-layout { --container: 96rem; display: grid; grid-template-columns: 17.5rem minmax(0, 1fr); gap: 2rem; align-items: start; padding-block: 1.5rem 3rem; }
.schedule-side { position: sticky; top: 5.5rem; max-height: calc(100vh - 6.5rem); display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); overflow: hidden; }
.side-body { overflow-y: auto; overflow-x: hidden; padding: 1rem; display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.1rem; align-content: start; scrollbar-width: thin; scrollbar-color: var(--border) transparent; }
.side-head, .side-foot, .schedule-open { display: none; }
.side-search { width: 100%; max-width: none; flex: none; }
.side-search input { width: 100%; min-width: 0; box-sizing: border-box; }
.schedule-side select { width: 100%; max-width: 100%; }
.side-block { display: grid; gap: .45rem; }
.side-title { margin: 0; font: 700 .72rem/1 var(--font-body); letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }
.side-list { flex-direction: column; flex-wrap: nowrap; gap: .15rem; }
.side-list button { width: 100%; justify-content: flex-start; gap: .55rem; min-height: 38px; border: 1px solid transparent; border-radius: .6rem; background: none; padding: .3rem .6rem; text-align: left; }
.side-list button span { flex: 1; display: inline-flex; align-items: center; gap: .4rem; }
.side-list button svg { width: .95rem; height: .95rem; }
.side-list button small { color: var(--text-muted); font-weight: 500; }
.side-list button:hover { background: var(--surface-2, var(--chip-bg)); }
.side-list--flags button::before { display: none; }
.side-links { display: grid; gap: .5rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.side-links a { display: grid; gap: .15rem; padding: .6rem .8rem; border: 1px solid var(--border); border-radius: .75rem; color: inherit; text-decoration: none; background: var(--surface-2, var(--surface)); }
.side-links a:hover { border-color: var(--accent); }
.side-links b { display: flex; align-items: center; gap: .45rem; font-size: var(--step--1); } .side-links b svg { width: 1rem; height: 1rem; color: var(--accent); }
.side-links small { color: var(--text-muted); font-size: .78rem; }
.schedule-main { min-width: 0; }
.schedule-side .mine-export { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; margin: 0; padding: .8rem; border-radius: .75rem; }
.schedule-side .mine-export__label { grid-column: 1 / -1; padding: 0; }
.schedule-side .mine-export .button { justify-content: center; text-align: center; }
.schedule-side .mine-export .button.cta, .schedule-side .mine-export .button:last-child { grid-column: 1 / -1; }
.schedule-main .slot .items { grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); }  /* a lone session fills the row; two at once share it */
.schedule-bar { position: sticky; top: 4.5rem; z-index: 15; display: flex; align-items: center; gap: .6rem; padding: .6rem 0; background: color-mix(in srgb, var(--bg) 92%, transparent); backdrop-filter: blur(8px); border-bottom: 1px solid var(--border); }
.schedule-bar .day-tabs { flex: 1; min-width: 0; }
.schedule-status { display: flex; align-items: center; gap: .6rem; margin: .8rem 0 .2rem; }
.schedule-backdrop { display: none; }
@media (max-width: 63.99rem) {
  .schedule-layout { display: block; padding-block: 0 2.5rem; }
  .schedule-side { position: fixed; inset: auto 0 0 0; z-index: 300; max-height: 88vh; border-radius: 1.25rem 1.25rem 0 0; border-bottom: 0; transform: translateY(105%); visibility: hidden; transition: transform .25s ease, visibility 0s .25s; }
  .schedule-side.is-open { transform: none; visibility: visible; transition: transform .25s ease; }
  .side-head { display: flex; align-items: center; justify-content: space-between; padding: .8rem 1rem; border-bottom: 1px solid var(--border); font-size: 1.05rem; }
  .side-foot { display: flex; gap: .6rem; padding: .8rem 1rem calc(.8rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--border); background: var(--surface); }
  .side-foot .cta { flex: 1; }
  .schedule-backdrop { display: block; position: fixed; inset: 0; z-index: 290; background: rgb(0 0 0 / .55); }
  .schedule-backdrop[hidden] { display: none; }
  .schedule-open { display: inline-flex; flex: none; }
  .side-list button { min-height: 44px; }
  html.sheet-open { overflow: hidden; }
  html.sheet-open .to-top { display: none; }
}
.mine-export { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .5rem; margin-top: .7rem; padding: .45rem .6rem; border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--brand-gold, #ffc226) 55%, var(--border)); background: color-mix(in srgb, var(--brand-gold, #ffc226) 10%, var(--surface)); }
.mine-export__label { font-weight: 700; padding: 0 .3rem; display: inline-flex; align-items: center; gap: .3rem; }
.mine-export svg { width: 1rem; height: 1rem; }
.mine-export .button.small { min-height: 2.1rem; padding: .25rem .75rem; }
@media (max-width: 40rem) { .mine-export { border-radius: var(--radius-md); } .mine-export__label { flex-basis: 100%; } }
@media (max-width: 48rem) { .schedule-tools .row:first-child .search { flex: 1 1 12rem; } .schedule-tools .row:first-child .schedule-count { margin-left: 0; } }

/* ---------- Presenters (2026-10-17) ---------- */
.presenters-tools { display: flex; flex-wrap: wrap; gap: .75rem 1rem; align-items: center; margin-bottom: 1.4rem; }
.presenters-tools .search { flex: 1 1 18rem; max-width: 26rem; }
ul.presenter-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr));
  grid-auto-rows: 1fr; }
.presenter-card { display: grid; justify-items: center; align-content: start; gap: .7rem; height: 100%; padding: 1.4rem 1.1rem; text-align: center;
  border-radius: var(--radius-lg, 1rem); border: 1px solid var(--border); background: var(--surface); color: var(--text); text-decoration: none;
  transition: border-color .15s, transform .15s; }
.presenter-card:hover { border-color: var(--accent); transform: translateY(-2px); color: var(--text); }
.presenter-card .avatar.lg { width: 7.5rem; height: 7.5rem; font-size: var(--step-2); }
.presenter-card__body { display: grid; gap: .4rem; justify-items: center; }
.presenter-card__body > b { font-size: var(--step-1); line-height: 1.2; }
.presenter-card__tags, .presenter-hero__tags { display: flex; flex-wrap: wrap; gap: .3rem; justify-content: center; margin: 0; }
.presenter-hero__tags { justify-content: flex-start; margin-top: .4rem; }
.chip-mini { padding: .15rem .55rem; border-radius: 999px; font-size: .75rem; font-weight: 700; background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--text); }
.chip-mini.is-now { background: color-mix(in srgb, var(--brand-gold, #ffc226) 30%, transparent); }
.presenter-card__bio { color: var(--text-muted); font-size: var(--step--1); line-height: 1.45; }
@media (max-width: 40rem) {
  .schedule-hero__actions { gap: .5rem; }
  .schedule-hero__actions .button { min-height: 2.6rem; padding: .4rem .9rem; font-size: var(--step--1); }
  .schedule-hero__actions .button:first-child { flex-basis: 100%; justify-content: center; }
  .schedule-tools .row:first-child { gap: .5rem; }
  .schedule-tools .day-tabs a { min-width: 3.4rem; padding: .35rem .5rem; }
  .schedule-tools .row:first-child .schedule-count { flex-basis: 100%; margin: -.1rem 0 0; font-size: var(--step--1); }
  .schedule-tools.is-folded .day-tabs { flex-basis: 100%; }
}
.gate-guest { margin-top: .9rem; } .gate-guest summary { cursor: pointer; font-weight: 600; color: var(--text-muted); font-size: .92rem; padding: .3rem 0; } .gate-guest form { margin-top: .5rem; }

/* ---------- The phone menu: one clear column with full-width rows (Steve, 2026-10-17: easy for older members' fingers,
   without being gigantic). Overrides the drawer's two-column compact lists, which squeezed long names off the edge. ---------- */
@media (max-width: 64rem) {
  .nav > ul { padding: .25rem .9rem; }
  .nav summary { min-height: 3.4rem; padding: .8rem .4rem; font-size: 1.3rem; }
  .mega__panel, .mega__panel:has(.mega__col--compact) { padding: 0 0 .9rem; grid-template-columns: minmax(0, 1fr); width: 100%; }  /* never wider than the drawer */
  .mega__col { min-width: 0; }
  .mega__col + .mega__col { margin-top: .6rem; }
  .mega__title { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .6rem; margin: .6rem .2rem .35rem; font-size: .8rem; }
  .nav .mega__title a { display: inline-flex; align-items: center; gap: .35rem; min-height: 2.2rem; color: var(--brand-gold); }
  .mega__note { font-size: .72rem; }
  .mega__col ul, .mega__col--compact ul { grid-template-columns: 1fr; gap: 0; border-radius: var(--radius-md); overflow: hidden;
    background: rgb(255 255 255 / .03); border: 1px solid var(--night-line); }
  .mega__col li + li { border-top: 1px solid var(--night-line); }
  .nav .mega__col a, .nav .mega__col--compact a { display: flex; align-items: center; gap: .8rem; min-height: 3rem; padding: .45rem .8rem;
    border-radius: 0; font: 550 1.05rem/1.25 var(--font-body); color: var(--white); }
  .nav .mega__col li a::after { content: ""; margin-left: auto; flex: none; width: .45rem; height: .45rem; border-right: 2px solid var(--night-muted);
    border-top: 2px solid var(--night-muted); transform: rotate(45deg); opacity: .7; }
  .nav .mega__col a:active { background: rgb(255 255 255 / .08); }
  .mega__icon, .mega__col--compact .mega__icon { width: 2rem; height: 2rem; border-radius: .55rem; background: rgb(255 194 38 / .1); }
  .mega__icon svg { width: 1.1rem; height: 1.1rem; }
  .mega__text { flex: 1; } .mega__text b { font-weight: 600; overflow-wrap: anywhere; }
  .mega__foot { display: grid; gap: 0; margin-top: .5rem; padding-top: 0; border-top: 0; }
  .nav .mega__foot a { min-height: 2.8rem; padding: .4rem .3rem; font: 600 1rem/1.25 var(--font-body); }
  .drawer-search input { font-size: 1.05rem; }
}
.mega__more { display: none; }
@media (max-width: 64rem) {
  .mega__col:not(.is-expanded) .mega__extra { display: none; }
  .mega__col:not(.is-expanded) ul li:nth-last-child(1 of :not(.mega__extra)) { border-bottom: 0; }
  .mega__more { display: flex; align-items: center; justify-content: center; gap: .5rem; width: 100%; min-height: 2.8rem; margin-top: .45rem;
    border-radius: var(--radius-md); border: 1px dashed var(--night-line); background: none; color: var(--brand-gold); font: 650 1rem/1.2 var(--font-body);
    cursor: pointer; box-shadow: none; }
  .mega__more::after { content: ""; width: .45rem; height: .45rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px); transition: transform .2s; }
  .mega__more[aria-expanded="true"]::after { transform: rotate(-135deg) translateY(-1px); }
}
@media (max-width: 64rem) { .nav .mega__col .mega__title, .nav .mega__col .mega__title a { color: var(--brand-gold); } }

/* Blog: a post with no picture gets a quiet night tile, not an empty box */
.post-card__blank { display: grid; place-items: center; width: 100%; height: 100%; background: var(--sky); color: var(--brand-gold); }
.post-card__blank svg { width: 2.2rem; height: 2.2rem; opacity: .7; }
/* Blog: the newsletter covers between the newest story and the rest */
.nl-strip { margin: 0 0 2.75rem; padding: clamp(1.1rem, .8rem + 1.5vw, 2rem); border-radius: var(--radius-xl);
  background: var(--surface-2); border: 1px solid var(--border); }
.nl-strip__head { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; align-items: end; justify-content: space-between; margin-bottom: 1.25rem; }
.nl-strip__head h2 { margin: .15rem 0 .25rem; font-size: var(--step-2); }
.nl-strip__head p.muted { margin: 0; max-width: 38rem; }
.nl-strip__covers { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.nl-strip__covers a { display: grid; gap: .15rem; text-decoration: none; color: inherit; }
.nl-strip__covers img { width: 100%; height: auto; aspect-ratio: 300 / 388; object-fit: cover; object-position: top; border-radius: var(--radius-sm);
  box-shadow: var(--shadow-lg); margin-bottom: .45rem; transition: transform .2s var(--ease-out); }
.nl-strip__covers a:hover img { transform: translateY(-3px) rotate(-1deg); }
.nl-strip__covers span { display: grid; gap: .1rem; }
.nl-strip__covers b { color: var(--heading); font-size: var(--step--1); line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden; }
.nl-strip__covers small { color: var(--text-muted); font-size: .78rem; }
@media (max-width: 52rem) {
  /* phones and tablets: a row you swipe, about 2.5 covers showing so it's clear there's more */
  .nl-strip__covers { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .5rem; margin-right: calc(-1 * clamp(1.1rem, .8rem + 1.5vw, 2rem)); padding-right: 1rem; }
  .nl-strip__covers li { flex: 0 0 38%; scroll-snap-align: start; }
}
/* Lifetime membership (/membership/lifetime) */
.lifetime { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); align-items: start; }
.lifetime .card { padding: clamp(1.1rem, .9rem + 1vw, 1.75rem); }
.lifetime__list { list-style: none; margin: .5rem 0 1rem; padding: 0; display: grid; gap: .65rem; }
.lifetime__list li { display: flex; gap: .65rem; align-items: flex-start; }
.lifetime__list svg { width: 1.25rem; height: 1.25rem; flex: none; margin-top: .15rem; color: var(--success); }
.lifetime__check .is-no svg { color: var(--accent); }
.lifetime__price { font-size: var(--step-2); margin: 0 0 .75rem; }
.lifetime__price .price-tag { margin: 0; font-family: var(--font-display); }
.lifetime__form textarea { width: 100%; }
.lifetime-nudge { display: flex; gap: .6rem; align-items: flex-start; margin-top: 1rem; }
.lifetime-nudge svg { width: 1.2rem; height: 1.2rem; flex: none; margin-top: .15rem; color: var(--brand-gold); }
/* Presenter portal (/presenter/<key>) */
.portal-photo { display: flex; gap: 1.1rem; align-items: center; margin-bottom: 1rem; }
.portal-photo .avatar { width: 6.5rem; height: 6.5rem; flex: none; font-size: 1.6rem; }
.portal-name { margin: 0 0 .75rem; }
.portal-when { display: flex; gap: .5rem; align-items: center; color: var(--text-muted); margin: 0 0 .75rem; }
.portal-when svg { width: 1.1rem; height: 1.1rem; flex: none; color: var(--accent); }
.portal-label { font-weight: 600; margin: 1rem 0 .35rem; }
.portal .when-time { display: none; margin-top: .5rem; }
.portal-session:has(input[value=change]:checked) .when-time { display: block; }
@supports not selector(:has(a)) { .portal .when-time { display: block; } }
@media (max-width: 30rem) { .portal-photo { flex-direction: column; align-items: flex-start; } }
.presenter-hero__tagline { margin: .1rem 0 .5rem; color: var(--night-muted); font-size: var(--step-0); }
/* Membership application: About You and How Did You Hear (Steve, 2026-10-17) */
.apply .fieldset-intro { margin: 0 0 .75rem; color: var(--text-muted); }
.apply .subhead { font: 700 var(--step-0)/1.3 var(--font-body); color: var(--heading); margin: 1.25rem 0 .35rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.apply .subhead:first-of-type { border-top: 0; padding-top: 0; margin-top: .25rem; }
.apply .subhead .muted { font-weight: 400; }
.apply .when-who { display: none; }
.how-heard:has(option[value=friend]:checked, option[value=member]:checked, option[value=guest]:checked, option[value=club]:checked, option[value=other]:checked) .when-who { display: block; }
@supports not selector(:has(a)) { .apply .when-who { display: block; } }
.found-card { padding: clamp(1.1rem, .9rem + 1vw, 1.75rem); }
.found-card h2 { display: flex; gap: .5rem; align-items: center; }
.found-card h2 svg { width: 1.3rem; height: 1.3rem; color: var(--accent); }
.found-help { margin: 1rem 0 0; padding-left: 1.1rem; display: grid; gap: .35rem; color: var(--text-muted); }
/* The gift with joining or renewing (membership/_gift.html, Steve 2026-10-17: "this layout is not nice") */
.gift__amounts { display: grid; gap: .5rem; grid-template-columns: repeat(auto-fit, minmax(4rem, 1fr)); margin: .9rem 0 0; }
.gift__chip, .gift__toggle label { position: relative; margin: 0; cursor: pointer; }
.gift__chip input, .gift__toggle input, .gift__org input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.gift__chip span { display: grid; place-items: center; min-height: 3rem; padding: .5rem; border: 1.5px solid var(--border); border-radius: var(--radius-md);
  font-weight: 700; text-align: center; background: var(--surface); transition: border-color .15s, background .15s; }
.gift__chip:hover span, .gift__org:hover, .gift__toggle label:hover span { border-color: var(--accent); }
.gift__chip input:checked + span, .gift__toggle input:checked + span { border-color: var(--brand-gold); background: color-mix(in srgb, var(--brand-gold) 16%, var(--surface)); }
.gift__chip input:focus-visible + span, .gift__toggle input:focus-visible + span, .gift__org:has(input:focus-visible) { outline: 2px solid var(--focus); outline-offset: 2px; }
.gift__other { display: none; margin-top: .9rem; max-width: 14rem; }
.gift__money { display: flex; align-items: center; gap: .4rem; }
.gift__money span { font-weight: 700; font-size: var(--step-1); }
.gift__details { display: none; margin-top: 1.1rem; padding-top: 1.1rem; border-top: 1px solid var(--border); }
.gift:has(input[name=gift_amount][value=other]:checked) .gift__other { display: block; }
.gift:has(input[name=gift_amount]:checked:not([value=""])) .gift__details { display: block; }
@supports not selector(:has(a)) { .gift__other, .gift__details { display: block; } }
.gift__label { font-weight: 600; margin: 0 0 .4rem; }
.gift__orgs { display: grid; gap: .6rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); margin-bottom: 1rem; }
.gift__org { display: block; position: relative; margin: 0; padding: .8rem 1rem; border: 1.5px solid var(--border); border-radius: var(--radius-md); cursor: pointer;
  background: var(--surface); font-weight: 400; }
.gift__org span { display: grid; gap: .15rem; }
.gift__org small { color: var(--text-muted); font-size: var(--step--1); }
.gift__org:has(input:checked) { border-color: var(--brand-gold); background: color-mix(in srgb, var(--brand-gold) 12%, var(--surface)); }
.gift__row { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); align-items: end; }
.gift__toggle { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.gift__toggle span { display: grid; place-items: center; min-height: 2.9rem; padding: .4rem .6rem; border: 1.5px solid var(--border); border-radius: var(--radius-md);
  font-weight: 600; background: var(--surface); }
.gift .hint { margin: .9rem 0 0; }
.apply .name-grid { display: grid; gap: 0 1.25rem; grid-template-columns: 1fr; }
@media (min-width: 36rem) { .apply .name-grid { grid-template-columns: 1fr 1fr; } }
/* ---------- Event staff page (/events/<series>/staff, rebuilt 2026-10-17) ---------- */
/* Layout: a side index on desktop (Steve, 2026-10-17: no horizontal chip scroll); a dropdown on phones */
.staff-layout { display: grid; gap: 1.5rem 2.25rem; align-items: start; }
@media (min-width: 60rem) { .staff-layout { grid-template-columns: 15.5rem minmax(0, 1fr); } }
.staff-index { display: grid; gap: .75rem; }
@media (min-width: 60rem) {
  .staff-index { position: sticky; top: calc(var(--header-h, 72px) + 1rem); max-height: calc(100svh - var(--header-h, 72px) - 2rem); grid-template-rows: auto auto 1fr; }
  .staff-jump { display: none; }
}
.staff-find { display: flex; align-items: center; gap: .5rem; padding: 0 .85rem; border: 1.5px solid var(--border); border-radius: 999px;
  background: var(--surface); margin: 0; font-weight: 400; }
.staff-find svg { width: 1.1rem; height: 1.1rem; color: var(--text-muted); flex: none; }
.staff-find input { border: 0; background: none; box-shadow: none; padding: .7rem 0; min-width: 0; width: 100%; font-size: var(--step-0); outline: none; }
.staff-find:focus-within { border-color: var(--accent); }
.staff-jump { margin: 0; } .staff-jump select { width: 100%; }
.staff-nav { display: none; overflow-y: auto; overscroll-behavior: contain; padding-right: .25rem; scrollbar-width: thin; }
@media (min-width: 60rem) { .staff-nav { display: block; } }
.staff-nav ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; }
.staff-nav__label { margin: .9rem 0 .3rem .6rem; font: 700 .72rem/1 var(--font-body); letter-spacing: .12em; text-transform: uppercase; color: var(--text-muted); }
.staff-nav a { display: flex; align-items: center; gap: .6rem; padding: .48rem .6rem; border-radius: var(--radius-sm); text-decoration: none;
  color: var(--text); font-size: var(--step--1); font-weight: 550; }
.staff-nav a span { flex: 1; min-width: 0; }
.staff-nav a small { color: var(--text-muted); font-size: .75rem; }
.staff-nav a svg { width: 1.05rem; height: 1.05rem; flex: none; color: var(--accent); }
.staff-nav a:hover { background: var(--surface-2); color: var(--heading); }
.staff-nav a.is-current { background: color-mix(in srgb, var(--accent) 12%, var(--surface)); color: var(--heading); font-weight: 700; }
.staff-page { display: grid; gap: 2.5rem; }
.staff-section { scroll-margin-top: calc(var(--header-h, 72px) + 1rem); }
.staff-section__title { display: flex; align-items: center; gap: .55rem; font-size: var(--step-2); margin: 0 0 1rem; }
.staff-section__title svg { width: 1.4rem; height: 1.4rem; color: var(--accent); }
.staff-section__title .muted { font: 500 var(--step-0) var(--font-body); }
.staff-none { margin: 0; color: var(--text-muted); }
.staff-face { display: inline-grid; place-items: center; width: 3.25rem; height: 3.25rem; border-radius: 50%; object-fit: cover; flex: none;
  background: var(--sunset); color: var(--night-1); font: 800 .95rem/1 var(--font-body); }
.staff-face.lg { width: 4.5rem; height: 4.5rem; font-size: 1.2rem; }
.staff-face.sm { width: 2.5rem; height: 2.5rem; font-size: .8rem; }
.staff-people { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15.5rem), 1fr)); }
.staff-person { display: flex; gap: .85rem; align-items: center; padding: .9rem 1rem; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.staff-person span, .staff-leads span { display: grid; gap: .1rem; min-width: 0; }
.staff-person b { color: var(--heading); font-size: var(--step-0); }
.staff-person small { color: var(--text-muted); font-size: var(--step--1); }
.staff-people--lead { grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); }
.staff-person--lead { padding: 1.1rem 1.25rem; border-color: rgb(255 194 38 / .55); background: color-mix(in srgb, var(--brand-gold) 8%, var(--surface)); }
.staff-person--lead b { font-size: var(--step-1); }
.staff-role { color: var(--accent) !important; font-weight: 700; font-size: .78rem !important; letter-spacing: .06em; text-transform: uppercase; }
.staff-teams { columns: 2 19rem; column-gap: 1rem; }
.staff-teams .staff-team { break-inside: avoid; display: inline-block; width: 100%; margin: 0 0 1rem; }
.staff-team { border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); padding: 1rem 1.1rem 1.1rem; scroll-margin-top: calc(var(--header-h, 72px) + 1rem); }
.staff-team:target { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent); }
.staff-team__head { display: flex; align-items: center; gap: .65rem; margin-bottom: .8rem; }
.staff-team__head h3 { margin: 0; font-size: var(--step-1); flex: 1; }
.staff-team__icon { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: var(--radius-md); flex: none;
  background: color-mix(in srgb, var(--accent) 12%, var(--surface)); color: var(--accent); }
.staff-team__icon svg { width: 1.25rem; height: 1.25rem; }
.staff-team__count { font: 700 .8rem/1 var(--font-body); color: var(--text-muted); background: var(--surface-2); border-radius: 999px; padding: .3rem .55rem; }
.staff-leads { list-style: none; margin: 0 0 .6rem; padding: 0; display: grid; gap: .55rem; }
.staff-leads li { display: flex; gap: .65rem; align-items: center; }
.staff-leads b { color: var(--heading); }
.staff-crew { list-style: none; margin: 0; padding: .65rem 0 0; border-top: 1px dashed var(--border); display: flex; flex-wrap: wrap; gap: .35rem .4rem; }
.staff-crew li { flex: none; width: auto; margin: 0; font-size: var(--step--1); line-height: 1.2; color: var(--text); background: var(--surface-2);
  border: 1px solid var(--border); border-radius: 999px; padding: .32rem .7rem; }
.staff-crew small { color: var(--text-muted); }
.staff-more { margin-top: .4rem; }
.staff-more summary { cursor: pointer; font-weight: 600; color: var(--accent); font-size: var(--step--1); padding: .35rem 0; }
.staff-more .staff-crew { border-top: 0; padding-top: .2rem; }
.staff-team__more { margin: .4rem 0 0; }
li.is-match { outline: 2px solid var(--brand-gold); outline-offset: 1px; border-radius: 999px; }
.staff-leads li.is-match, .staff-person.is-match { border-radius: var(--radius-md); }

/* "Did you mean…" on the public 404 page (content/_did_you_mean.html, spark/errors/not_found.py) */
.did-you-mean { margin: 1.25rem 0 0; max-width: 40rem; }
.did-you-mean__title { font-size: var(--step-0); margin: 0 0 .5rem; }
.did-you-mean__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.did-you-mean__link { display: flex; flex-direction: column; justify-content: center; min-height: 44px; padding: .55rem .9rem;
  border: 1px solid currentColor; border-radius: var(--radius-sm); text-decoration: none; }
.did-you-mean__link:hover, .did-you-mean__link:focus-visible { text-decoration: underline; }
.did-you-mean__name { font-weight: 600; }
.did-you-mean__path { font-size: .85em; opacity: .8; overflow-wrap: anywhere; }

/* --- Registration passes (decision 2026-10-18): the point person's page, a pass holder's link, the pass flow ---- */
.passes .pass-summary { padding: 1.25rem; margin-bottom: 1.25rem; }
.pass-counts { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin: 0 0 .9rem; text-align: center; }
.pass-counts div { background: var(--surface-2); border-radius: var(--radius-md); padding: .7rem .4rem; }
.pass-counts dt { font-size: var(--step--1); color: var(--text-muted); font-weight: 600; }
.pass-counts dd { margin: 0; font: 700 var(--step-3)/1.1 var(--font-display); color: var(--heading); }
.pass-progress { width: 100%; height: 12px; border: 0; border-radius: 999px; overflow: hidden; background: var(--surface-2); accent-color: var(--success); }
.pass-progress::-webkit-progress-bar { background: var(--surface-2); border-radius: 999px; }
.pass-progress::-webkit-progress-value { background: var(--success); border-radius: 999px; }
.pass-progress::-moz-progress-bar { background: var(--success); border-radius: 999px; }
.pass-summary__line { margin: .6rem 0 0; font-weight: 600; }
.pass-perks { margin-top: .8rem; }
.pass-perks ul { list-style: none; padding: 0; margin: .5rem 0 0; }
.pass-actions { display: flex; flex-wrap: wrap; gap: .75rem 1rem; align-items: center; margin: 0 0 1.25rem; }
.pass-actions form { display: flex; align-items: center; gap: .4rem; }
.pass-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
.pass-card { padding: 1rem 1.1rem; }
.pass-card__head { display: flex; justify-content: space-between; align-items: center; gap: .5rem; flex-wrap: wrap; }
.pass-card__slot { font-weight: 700; color: var(--text-muted); font-size: var(--step--1); text-transform: uppercase; letter-spacing: .08em; }
.pass-card__who { margin: .6rem 0; font-size: var(--step-1); overflow-wrap: anywhere; }
.pass-state--registered, .pass-state--checked_in { background: rgb(23 104 58 / .12); color: var(--success); border-color: rgb(23 104 58 / .35); }
.pass-state--invited { background: rgb(255 194 38 / .18); }
.pass-state--elsewhere { background: rgb(109 63 160 / .12); }
.pass-card--unassigned { border-style: dashed; }
.pass-card__buttons form { display: flex; flex-wrap: wrap; gap: .6rem; }
.passes .button, .passes .cta, .pass-banner + form .cta { min-height: 44px; }
.passes input[type=text], .passes input[type=email], .passes input[type=tel], .passes input[type=date], .who-form input { font-size: 16px; }
.pass-form .form-grid .pass-form__wide { grid-column: 1 / -1; }
.pass-edit { margin-top: .75rem; }
.pass-edit summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; font-weight: 600; color: var(--accent); }
.pass-link-label { display: block; margin-top: .9rem; font-size: var(--step--1); }
.pass-link { width: 100%; font-size: 16px; }
.pass-step { padding: 1.25rem; margin-bottom: 1rem; }
.pass-step__n { display: inline-grid; place-items: center; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: var(--surface-2);
  font-weight: 700; margin-right: .4rem; }
.pass-banner { padding: 1rem 1.2rem; margin-bottom: 1rem; border-left: 4px solid var(--brand-gold); }
.pass-banner .eyebrow { margin-bottom: .3rem; }
.pass-person { font-size: var(--step-1); overflow-wrap: anywhere; }
/* Rosters (registration/roster.py): progress, deadline, confirm, add several people, waiver status */
.pass-counts--four { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 30rem) { .pass-counts--four { grid-template-columns: repeat(2, 1fr); } }  /* four tiles at phone width left "120/120" no room */
.pass-counts__of { font-size: .55em; color: var(--text-muted); font-weight: 600; }
.pass-counts__word { font-size: var(--step-1) !important; padding-top: .35rem; }
.pass-deadline { display: flex; align-items: center; gap: .5rem; margin: .75rem 0 0; padding: .6rem .8rem; border-radius: var(--radius-md);
  background: var(--surface-2); }
.pass-deadline svg { width: 1.2rem; height: 1.2rem; flex: none; }
.pass-deadline--soon { background: rgb(255 194 38 / .2); }
.pass-deadline--past { background: rgb(171 35 40 / .1); }
.pass-missing { margin: .75rem 0 0; padding-left: 1.2rem; }
.pass-missing li { margin: .2rem 0; overflow-wrap: anywhere; }
.pass-confirm { padding: 1.1rem 1.2rem; margin-bottom: 1.25rem; border-left: 4px solid var(--success); }
.pass-confirm h2 { font-size: var(--step-1); margin: 0 0 .4rem; }
.pass-confirm--asked { box-shadow: 0 0 0 3px rgb(255 194 38 / .6); }
.pass-crew-note { margin: 0 0 1.25rem; padding: .9rem 1.1rem; border-radius: var(--radius-md); background: var(--surface-2); }
.pass-crew-note p { margin: 0 0 .6rem; }
.pass-crew-note form { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.pass-bulk { padding: 0; margin: 0 0 1.25rem; }
.pass-bulk > summary { min-height: 52px; display: flex; align-items: center; padding: .6rem 1.1rem; cursor: pointer; font-weight: 700; color: var(--accent); }
.pass-bulk > summary span { display: inline-flex; align-items: center; gap: .5rem; }
.pass-bulk > summary svg { width: 1.2rem; height: 1.2rem; }
.pass-bulk > :not(summary) { margin-left: 1.1rem; margin-right: 1.1rem; }
.pass-bulk > form:last-child, .pass-bulk > form:last-of-type { padding-bottom: 1.1rem; }
.pass-bulk__title { font-size: var(--step-1); margin: .4rem 0; }
.bulk-text { width: 100%; font-size: 16px; font-family: inherit; min-height: 9rem; }
.pass-bulk input[type=file] { font-size: 16px; min-height: 44px; max-width: 100%; }
.bulk-preview { list-style: none; padding: 0; margin: .75rem 0; display: grid; gap: .6rem; }
.bulk-line { padding: .7rem .8rem; border: 1px solid var(--border); border-radius: var(--radius-md); overflow-wrap: anywhere; }
.bulk-line--error { border-color: var(--danger, #ab2328); background: rgb(171 35 40 / .06); }
.bulk-line--skip { opacity: .8; }
.bulk-line__who { margin-bottom: .35rem; }
.bulk-line__notes { margin: .4rem 0 0; padding-left: 1.1rem; font-size: var(--step--1); }
.bulk-note--error { color: var(--danger, #ab2328); font-weight: 600; }
.bulk-note--warn { color: var(--text); }
.bulk-note--info { color: var(--text-muted); }
.bulk-pill { margin-right: .3rem; }
.bulk-pill--add { background: rgb(23 104 58 / .12); color: var(--success); }
.bulk-pill--error { background: rgb(171 35 40 / .12); }
.bulk-pill--member { background: rgb(255 194 38 / .2); }
.bulk-line .check { min-height: 44px; display: flex; align-items: center; gap: .5rem; }
.pass-card__pills { display: inline-flex; flex-wrap: wrap; gap: .35rem; justify-content: flex-end; }
.waiver-pill--signed { background: rgb(23 104 58 / .12); color: var(--success); border-color: rgb(23 104 58 / .35); }
.waiver-pill--missing, .waiver-pill--sent { background: rgb(255 194 38 / .2); }
.pass-card__warn { color: var(--danger, #ab2328); font-weight: 600; font-size: var(--step--1); }
@media (max-width: 480px) {
  .pass-counts--four { grid-template-columns: repeat(2, 1fr); }
  .pass-counts dd { font-size: var(--step-2); }
  .pass-actions form, .pass-card__buttons form { width: 100%; }
  .pass-actions .button, .pass-card__buttons .button, .pass-card__buttons .cta { width: 100%; justify-content: center; }
}

/* --- Selling online (decision 2026-10-18, spark/event_apps/online.py): registration Extras' vendor table, program ad and
   listing sections; the Program Ads & Listings page; an advertiser's artwork upload. Phones first: 16px inputs, 44px taps. */
.sell [hidden] { display: none !important; }
.sell__block { border-top: 1px solid var(--border); padding-top: 1rem; }
.sell__toggle { min-height: 44px; display: flex; align-items: center; gap: .6rem; font-weight: 600; }
.sell__details { margin-top: .75rem; display: grid; gap: .5rem; }
.sell input[type=text], .sell input[type=email], .sell input[type=tel], .sell textarea,
.program-ads input[type=text], .program-ads input[type=email], .program-ads input[type=tel], .program-ads textarea,
.artwork-upload input { font-size: 16px; }
.sell .choice, .sell .ticket-opt, .program-ads .choice, .program-ads .ticket-opt { min-height: 44px; }
.sell .people-row { overflow-wrap: anywhere; }
.program-ads { display: grid; gap: 1.5rem; }
.program-ads__grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); }
.program-ads .card { padding: clamp(1rem, .8rem + 1vw, 1.5rem); min-width: 0; }
.program-ads .buttons .cta, .program-ads .buttons .button, .artwork-upload .button, .add-to-cart { min-height: 44px; }
.ad-sizes { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; gap: .35rem; }
.ad-sizes li { display: flex; justify-content: space-between; gap: .75rem; flex-wrap: wrap; padding: .45rem 0; border-bottom: 1px dashed var(--border); }
.ad-sizes .is-gone { color: var(--text-muted); text-decoration: line-through; }
.artwork-upload { margin-top: 1rem; display: grid; gap: .6rem; }
@media (max-width: 480px) {
  .program-ads .buttons .cta, .program-ads .buttons .button, .add-to-cart { width: 100%; justify-content: center; }
}

/* --- Member Showcase (events/showcase.html, event_apps/received.html; decision 2026-10-18) ------------------------- */
.sc-facts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); gap: .75rem; }
.flow .sc-steps, .flow .timeline { padding-left: 0; }
.sc-facts li { display: grid; grid-template-columns: 2.4rem 1fr; gap: .75rem; align-items: center; padding: .9rem 1rem; border-radius: var(--radius-md);
  background: var(--surface); border: 1px solid var(--border); }
.sc-facts svg { width: 2.4rem; height: 2.4rem; padding: .55rem; border-radius: .7rem; background: color-mix(in srgb, var(--cta) 22%, transparent); color: var(--heading); }
.sc-facts small { display: block; font-size: var(--step--2); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
.sc-facts b { color: var(--heading); line-height: 1.3; }
.sc-code { display: inline-block; font: 800 var(--step--1)/1.2 var(--font-display); letter-spacing: .04em; padding: .2rem .5rem; border-radius: .45rem;
  background: var(--brand-ink); color: var(--brand-gold); white-space: nowrap; }
.sc-mine { list-style: none; margin: 0 0 .75rem; padding: 0; display: grid; gap: .6rem; }
.sc-mine__item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: .5rem 1rem; align-items: center; padding: .9rem 1rem;
  border-radius: var(--radius-md); background: var(--surface); border: 1px solid var(--border); }
.sc-mine__item.is-withdrawn { opacity: .65; }
.sc-mine__what { display: grid; gap: .1rem; min-width: 0; }
.sc-mine__what b { color: var(--heading); }
.sc-mine__what span { color: var(--text-muted); font-size: var(--step--1); overflow-wrap: anywhere; }
.sc-stage { font-size: var(--step--2); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: .25rem .6rem; border-radius: 999px;
  background: var(--chip-bg); color: var(--heading); white-space: nowrap; }
.sc-stage--success { background: color-mix(in srgb, var(--success) 20%, transparent); }
.sc-stage--info, .sc-stage--warning { background: color-mix(in srgb, var(--cta) 28%, transparent); }
.sc-stage--danger { background: color-mix(in srgb, var(--danger) 20%, transparent); }
.sc-steps { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .75rem; counter-reset: s; }
.sc-steps li { counter-increment: s; position: relative; display: grid; gap: .25rem; padding: 1rem 1rem 1rem 3.6rem; border-radius: var(--radius-md);
  background: var(--surface); border: 1px solid var(--border); }
.sc-steps li::before { content: counter(s); position: absolute; left: 1rem; top: .95rem; width: 1.9rem; height: 1.9rem; display: grid; place-items: center;
  border-radius: 50%; background: var(--cta); color: var(--cta-text); font: 800 var(--step--1)/1 var(--font-display); }
.sc-steps b { color: var(--heading); }
.sc-steps span { color: var(--text-muted); font-size: var(--step--1); line-height: 1.55; }
.timeline li.is-passed { border-top-color: var(--border); background: var(--surface-2); }  /* past steps: quieter, still ≥4.5:1 (no opacity) */
.timeline li.is-passed .timeline__when { color: var(--text-muted); }
.sc-lineup { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); gap: .9rem; }
.sc-lineup__item { --tone: var(--brand-gold); position: relative; display: flex; gap: .85rem; padding: 1rem 1.1rem; border-radius: var(--radius-lg);
  background: radial-gradient(circle at 90% 0%, color-mix(in srgb, var(--tone) 28%, transparent), transparent 60%), var(--night-1); color: var(--night-text);
  border: 1px solid var(--night-line); box-shadow: var(--shadow); }
.sc-lineup__item--cylinder-shell { --tone: var(--brand-orange); }
.sc-lineup__item--rocket { --tone: color-mix(in srgb, var(--cat-demonstration) 45%, var(--white)); }
.sc-lineup__item--other-pyrotechnic-device { --tone: color-mix(in srgb, var(--dusk-violet) 55%, var(--white)); }
.sc-lineup__cue { flex: none; width: 2.2rem; height: 2.2rem; display: grid; place-items: center; border-radius: 50%; background: var(--tone); color: var(--brand-ink);
  font: 800 var(--step-0)/1 var(--font-display); }
.sc-lineup__body { display: flex; flex-direction: column; gap: .4rem; min-width: 0; flex: 1; }
.sc-lineup__top { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem .65rem; }
.sc-lineup__kind { font-size: .75rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--tone); }
.sc-lineup__size { font: 800 var(--step-1)/1 var(--font-display); color: var(--white); }
.sc-lineup__meta { font-size: var(--step--1); color: var(--night-muted); }
.sc-lineup__fx { margin: 0; font-size: var(--step--1); line-height: 1.55; white-space: pre-line; overflow-wrap: anywhere; }
.sc-lineup__who { margin-top: auto; padding-top: .45rem; display: inline-flex; gap: .4rem; align-items: center; font-size: var(--step--1); font-weight: 700;
  color: var(--night-muted); border-top: 1px solid var(--night-line); }
.sc-lineup__who svg, .sc-award svg { width: 1rem; height: 1rem; }
.sc-award { display: inline-flex; gap: .3rem; align-items: center; font-size: var(--step--2); font-weight: 800; text-transform: uppercase; letter-spacing: .06em;
  color: var(--brand-ink); background: var(--brand-gold); padding: .15rem .5rem; border-radius: 999px; }
.sc-entry { display: grid; gap: .9rem; }
.sc-entry dl { display: grid; grid-template-columns: minmax(7rem, auto) 1fr; gap: .35rem 1rem; margin: 0; }
.sc-entry dt { color: var(--text-muted); font-size: var(--step--1); }
.sc-entry dd { margin: 0; color: var(--heading); overflow-wrap: anywhere; white-space: pre-line; }
.sc-entry .sc-code { font-size: var(--step-2); padding: .35rem .8rem; }
.sc-progress { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.sc-progress li { font-size: var(--step--2); font-weight: 700; padding: .25rem .6rem; border-radius: 999px; background: var(--chip-bg); color: var(--text-muted); }
.sc-progress li.is-done { background: color-mix(in srgb, var(--success) 22%, transparent); color: var(--heading); }
.sc-progress li.is-now { background: var(--cta); color: var(--cta-text); }
.sc-note { padding: .8rem 1rem; border-radius: var(--radius-md); background: color-mix(in srgb, var(--cta) 14%, var(--surface)); border: 1px solid var(--border); }
@media (max-width: 40rem) {
  .sc-facts { grid-template-columns: 1fr 1fr; gap: .5rem; }
  .sc-facts li { grid-template-columns: 1fr; gap: .4rem; padding: .75rem; align-items: start; }
  .sc-facts svg { width: 2rem; height: 2rem; padding: .45rem; }
  .sc-mine__item { grid-template-columns: auto minmax(0, 1fr); }
  .sc-mine__item .sc-stage { justify-self: start; }
  .sc-mine__item .button { grid-column: 1 / -1; justify-content: center; }
  .sc-steps li { padding-left: 3.3rem; }
  .sc-entry dl { grid-template-columns: 1fr; gap: .1rem; }
  .sc-entry dd { margin-bottom: .5rem; }
}
.now-showcase { margin: 0 0 1.25rem; padding: 1rem 1.15rem; border-radius: var(--radius-lg); background: color-mix(in srgb, var(--cta) 12%, var(--surface));
  border: 1px solid var(--border); }
.now-showcase h3 { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: 0 0 .6rem; font-size: var(--step-1); }
.now-showcase h3 svg { width: 1.2rem; height: 1.2rem; }
.now-showcase__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.now-showcase__list li { display: grid; grid-template-columns: 2rem 1fr; gap: .6rem; align-items: start; }
.now-showcase__cue { width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: 50%; background: var(--cta); color: var(--cta-text); font-weight: 800; }
.now-showcase__fx { display: block; color: var(--text-muted); font-size: var(--step--1); }
.sc-entry .checklist li::before { content: ""; flex: none; width: 1.1rem; height: 1.1rem; margin-top: .2rem; border: 2px solid var(--border); border-radius: .3rem; }
.sc-form-intro { margin-bottom: 2rem; } .sc-form-intro p + p { margin-top: .75rem; }
.sc-withdraw { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--border); }
.sc-mine__item .sc-code { justify-self: start; align-self: start; margin-top: .15rem; }

/* Member Showcase: the essentials (four lines) and the full rules as a PDF (Steve, 2026-10-18: "simplify, don't show 12 boxes") */
.sc-must { max-width: 68ch; }
.sc-must__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .9rem; }
.sc-must__list li { position: relative; padding-left: 2rem; font-size: 1.1rem; line-height: 1.55; }
.sc-must__list li::before { content: "✓"; position: absolute; left: 0; top: .15em; width: 1.35rem; height: 1.35rem; border-radius: 50%;
  display: grid; place-items: center; font: 700 .85rem/1 var(--font-body); color: #fff; background: var(--sunset); }
.sc-must__more { margin: 1.4rem 0 .6rem; }
.sc-must__more .button { min-height: 44px; }
.sc-must__ask { font-size: .95rem; }

/* ---------- Public site pass for older readers and phones (decision 2026-10-19) ---------- */
/* Header on phones: Sign In and Menu say so in words (guests saw three unlabeled circles); the tiniest phones keep the icon only for Menu */
@media (max-width: 64rem) {
  .header-actions .icon-button--labeled { width: auto; padding: 0 .8rem 0 .65rem; }
  .header-actions .icon-button--labeled .icon-button__label { display: inline; font-size: .95rem; }
  .header-actions .icon-button--labeled svg { width: 22px; height: 22px; }
}
@media (max-width: 22.5rem) {
  .header-actions .menu-toggle { width: 2.75rem; padding: 0; }
  .header-actions .menu-toggle .icon-button__label { display: none; }
}
/* The phone menu's Sign Out (there was none below 960px) */
.drawer-signout { margin: 0; }
.drawer-signout .button { width: 100%; }
@media (max-width: 64rem) { .nav .drawer-signout .button { font: 650 var(--step-0)/1.2 var(--font-body); padding: .8rem 1rem; border-radius: 999px; } }
/* Footer link groups: <details>, open and plain on wider screens, folded rows on phones (site.js) */
.footer-group > summary { list-style: none; cursor: default; }
.footer-grid > * { min-width: 0; }
.footer-contact a { max-width: 100%; overflow-wrap: anywhere; }  /* the long email address wraps instead of widening the page */
.footer-group > summary::-webkit-details-marker { display: none; }
@media (max-width: 40rem) {
  .footer-grid { grid-template-columns: 1fr; gap: 0; padding: 1rem 0 1.5rem; }
  .footer-group { border-bottom: 1px solid var(--night-line); }
  .footer-group > summary { cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 3.25rem; }
  .footer-group > summary h2 { margin: 0; }
  .footer-group > summary::after { content: ""; flex: none; width: .55rem; height: .55rem; margin-right: .35rem; border-right: 2px solid var(--night-muted);
    border-bottom: 2px solid var(--night-muted); transform: rotate(45deg) translateY(-2px); transition: transform .2s; }
  .footer-group[open] > summary::after { transform: rotate(225deg); }
  .footer-group ul { gap: 0; padding: 0 0 .75rem; }
  .footer-group ul a { display: inline-flex; align-items: center; min-height: 2.75rem; }
}
/* Sign-in: why you're here ("Sign in to register for …") */
.signin__why { display: flex; gap: .6rem; align-items: flex-start; margin: 0 0 1rem; padding: .75rem .9rem; border-radius: var(--radius-md); color: var(--text);
  background: color-mix(in srgb, var(--info) 10%, var(--surface)); border: 1px solid color-mix(in srgb, var(--info) 40%, var(--border)); font-weight: 550; line-height: 1.45; }
.signin__why svg { width: 1.2rem; height: 1.2rem; flex: none; margin-top: .15rem; color: var(--info); }
/* Status pills: one look for every status (shared/ui.html pill), like the console's badges */
.pill { --tone: var(--text-muted); display: inline-flex; align-items: center; gap: .35rem; max-width: 100%; padding: .2rem .7rem; border-radius: 999px;
  font: 650 var(--step--1)/1.3 var(--font-body); color: color-mix(in srgb, var(--tone) 80%, var(--text)); overflow-wrap: anywhere;
  background: color-mix(in srgb, var(--tone) 12%, transparent); border: 1px solid color-mix(in srgb, var(--tone) 38%, transparent); }
.pill--success { --tone: var(--success); } .pill--info { --tone: var(--info); } .pill--warning { --tone: var(--warning); }
.pill--danger { --tone: var(--danger); } .pill--neutral { --tone: var(--text-muted); }
/* Event page: the most-used pages right under the hero (two across on phones) */
.event-quick { margin-top: clamp(1.25rem, 1rem + 1.5vw, 2.25rem); }
.event-quick ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 11.5rem), 1fr)); }
.event-quick a { display: flex; align-items: center; gap: .6rem; height: 100%; min-height: 3.25rem; padding: .6rem .85rem; border-radius: var(--radius-md);
  background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow); color: var(--heading); font-weight: 650; line-height: 1.2;
  text-decoration: none; }
.event-quick a:hover { border-color: var(--accent); color: var(--accent); }
.event-quick svg { width: 1.3rem; height: 1.3rem; flex: none; color: var(--accent); }
.event-quick span { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 40rem) {
  .event-quick ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .presenter-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Phones show fewer of a long list (home: presenters, news, sessions; event: presenters); "See all" has the rest */
.phone-only { display: none; }
@media (max-width: 40rem) {
  .phone-cap-2 > :nth-child(n+3), .phone-cap-3 > :nth-child(n+4), .phone-cap-8 > :nth-child(n+9) { display: none; }
  .phone-only { display: block; }
  .night:has(> .sky-canvas) .container { text-shadow: 0 1px 14px rgb(5 7 15 / .85); }  /* words stay readable over a burst */
}
/* Registration review: the optional gift, folded */
.review-gift { margin: 0 0 1.25rem; }
.review-gift > summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 2.75rem; cursor: pointer; }
.review-gift__title { display: inline-flex; align-items: center; gap: .5rem; font: 700 var(--step-1)/1.2 var(--font-display); color: var(--heading); }
.review-gift__title svg { width: 1.2rem; height: 1.2rem; color: var(--accent); }
.review-gift[open] > summary { margin-bottom: .75rem; }
.review-gift .choices.donation { border: 0; padding: 0; margin: .5rem 0 .75rem; }
/* Tap targets on touch screens: at least 44px (WCAG 2.5.5); the help tip's circle stays small with a 44px hit area */
@media (pointer: coarse) {
  .button.small, button.small { min-height: 44px; }
  .link-button { display: inline-flex; align-items: center; min-height: 44px; }
  .check { min-height: 44px; }
  .tip .tip__btn { position: relative; }
  .tip .tip__btn::before { content: ""; position: absolute; left: 50%; top: 50%; width: 44px; height: 44px; transform: translate(-50%, -50%); }
  .session-wrap .star { width: 2.75rem; height: 2.75rem; top: .4rem; right: .4rem; }
  .session-wrap .session-card { padding-right: 3.4rem; }
  .filter-chips button, .search-kinds a, .doc-chip, .forms-chip, .stay-filters .chip, .stay-map__views .chip, .vjump .chip, .jump-links a,
  .friends-jump a, .choices.chips .choice, .day-tabs a, .day-tabs button { min-height: 44px; }
  .search-kinds a, .jump-links a, .friends-jump a, .vjump .chip { display: inline-flex; align-items: center; }
  .breadcrumbs a { display: inline-block; padding: .6rem 0; margin: -.6rem 0; }
  .breadcrumbs ol { row-gap: .25rem; }
  .theme-switch button { width: 2.75rem; height: 2.75rem; }
}

/* ---------- Manufacturing application (templates/compliance/mfg; decision 2026-10-18: one process for every event) ---------- */
.mfg { display: grid; gap: 1.25rem; }
.mfg > * { margin: 0; }
.mfg-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: clamp(1.15rem, 3vw, 1.9rem); box-shadow: var(--shadow); }
.mfg-card > :first-child { margin-top: 0; }
.mfg-card__title { font: 760 var(--step-2)/1.15 var(--font-display); color: var(--heading); margin: 0 0 .5rem; letter-spacing: -.01em; overflow-wrap: anywhere; }
.mfg-intro { color: var(--text-muted); font-size: 1.08rem; line-height: 1.6; margin: 0 0 .5rem; max-width: 62ch; }
.mfg-form { display: grid; gap: 1.25rem; }
.mfg-form label { font-size: 1.02rem; }
.mfg-form input, .mfg-form textarea, .mfg-form select { font-size: max(16px, 1rem); }
.mfg-form fieldset.mfg-group { border: 0; padding: 0; margin: 1.4rem 0 0; background: none; border-radius: 0; min-width: 0; }
.mfg-form fieldset.mfg-group legend { font: 650 1.02rem/1.3 var(--font-body); padding: 0; margin: 0 0 .1rem; display: block; color: var(--heading); }
.mfg-form .choice { min-height: 52px; align-items: center; }
.mfg-form .choice input { margin-top: 0; }
.mfg-check { display: flex; gap: .8rem; align-items: flex-start; font-weight: 500; line-height: 1.5; margin: 1.1rem 0 0; padding: .85rem 1rem; border-radius: var(--radius-md);
  background: var(--bg); border: 1.5px solid var(--border); cursor: pointer; }
.mfg-check:has(input:checked) { border-color: var(--success); background: color-mix(in srgb, var(--success) 7%, var(--surface)); }
.mfg-check { --control-on: var(--success); }
.mfg-check input { flex: none; width: 1.4rem; height: 1.4rem; margin: .1rem 0 0; }
.mfg-roles { display: grid; gap: .8rem; margin-top: .75rem; }
.mfg-role { display: grid; grid-template-columns: auto auto 1fr; gap: .9rem; align-items: center; margin: 0; padding: 1.1rem 1.2rem; border: 2px solid var(--border);
  border-radius: var(--radius-lg); cursor: pointer; font-weight: 400; transition: border-color .15s, background .15s, box-shadow .15s; }
.mfg-role:hover { border-color: var(--accent); }
.mfg-role:has(input:checked) { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 6%, var(--surface)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent); }
.mfg-role input { width: 1.4rem; height: 1.4rem; margin: 0; }
.mfg-role__icon { width: 3rem; height: 3rem; display: grid; place-items: center; border-radius: 50%; background: var(--sunset); color: #fff; }
.mfg-role__icon svg { width: 1.45rem; height: 1.45rem; }
.mfg-role__text { display: grid; gap: .25rem; min-width: 0; }
.mfg-role__text b { font: 750 var(--step-1)/1.2 var(--font-display); color: var(--heading); }
.mfg-role__text span { color: var(--text-muted); line-height: 1.5; }
.mfg-search { display: flex; flex-wrap: wrap; gap: .5rem; align-items: end; }
.mfg-search label { flex-basis: 100%; margin-bottom: 0; }
.mfg-search input { flex: 1; min-width: 0; }
.mfg-sites { display: grid; gap: .6rem; margin-top: .9rem; max-height: 28rem; overflow-y: auto; padding: .15rem; }
.mfg-site { display: grid; grid-template-columns: auto 1fr auto; gap: .8rem; align-items: center; margin: 0; padding: .9rem 1rem; border: 1.5px solid var(--border);
  border-radius: var(--radius-md); cursor: pointer; font-weight: 400; min-height: 56px; }
.mfg-site[hidden] { display: none; }
.mfg-site:has(input:checked) { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 7%, var(--surface)); }
.mfg-site input { width: 1.3rem; height: 1.3rem; margin: 0; }
.mfg-site__body { display: grid; gap: .15rem; min-width: 0; }
.mfg-site__body b { color: var(--heading); font-size: 1.08rem; overflow-wrap: anywhere; }
.mfg-site__body span { color: var(--text-muted); font-size: var(--step--1); }
.mfg-empty { color: var(--text-muted); padding: 1rem; border: 1.5px dashed var(--border); border-radius: var(--radius-md); margin: 0; }
.mfg-chosen { display: flex; gap: .9rem; align-items: flex-start; padding: 1rem 1.1rem; border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--success) 9%, var(--surface)); border: 1.5px solid color-mix(in srgb, var(--success) 45%, var(--border)); }
.mfg-chosen > svg { flex: none; width: 1.6rem; height: 1.6rem; color: var(--success); margin-top: .1rem; }
.mfg-chosen b { display: block; color: var(--heading); font-size: 1.1rem; }
.mfg-chosen span { color: var(--text-muted); }
.mfg-confirms { display: grid; gap: 0; }
.mfg-policies { list-style: none; margin: .75rem 0 0; padding: 0; display: grid; gap: 1rem; }
.mfg-policy { border: 1px solid var(--border); border-radius: var(--radius-md); padding: .75rem 1rem 1rem; background: var(--surface); }
.mfg-policy summary { cursor: pointer; display: flex; flex-wrap: wrap; justify-content: space-between; gap: .3rem 1rem; align-items: baseline; min-height: 44px; align-content: center;
  font: 720 var(--step-0)/1.3 var(--font-display); color: var(--heading); }
.mfg-policy summary .muted { font: 500 var(--step--1) var(--font-body); }
.mfg-policy .policy { margin-top: .5rem; font-size: 1rem; }
.mfg-policy .mfg-check { margin-top: .75rem; }
.mfg-sign { margin-top: 1.25rem; padding: 1rem 1.1rem 1.15rem; border-radius: var(--radius-md); background: var(--bg); border: 1.5px dashed var(--border); }
.mfg-sign label { margin-top: 0; }
.mfg-sign input { font: 500 1.4rem/1.2 "Bradley Hand", "Segoe Script", "Brush Script MT", cursive; }
.mfg-todo { padding: .9rem 1.1rem; border-radius: var(--radius-md); background: color-mix(in srgb, var(--brand-gold) 16%, var(--surface)); border: 1px solid var(--border); }
.mfg-todo ul { margin: .4rem 0 0; padding-left: 1.2rem; display: grid; gap: .25rem; }
.mfg-sub { font: 720 var(--step-1)/1.2 var(--font-display); color: var(--heading); margin: 1.5rem 0 .6rem; }
.mfg-summary { display: grid; gap: 1rem; }
.mfg-summary__part { border-top: 1px solid var(--border); padding-top: .9rem; }
.mfg-summary__part:first-child { border-top: 0; padding-top: 0; }
.mfg-summary h3 { font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); margin: 0 0 .5rem; font-family: var(--font-body); }
.mfg-summary dl { margin: 0; display: grid; gap: .45rem; }
.mfg-summary dl > div { display: grid; grid-template-columns: minmax(9rem, 14rem) 1fr; gap: 1rem; }
.mfg-summary dt { color: var(--text-muted); }
.mfg-summary dd { margin: 0; color: var(--heading); font-weight: 550; white-space: pre-line; overflow-wrap: anywhere; }
.mfg-checks { list-style: none; margin: .5rem 0 0; padding: 0; display: grid; gap: .55rem; }
.mfg-checks li { display: flex; gap: .75rem; align-items: flex-start; line-height: 1.45; }
.mfg-checks__icon { flex: none; width: 1.7rem; height: 1.7rem; border-radius: 50%; display: grid; place-items: center; color: #fff; background: var(--success); }
.mfg-checks__icon svg { width: .95rem; height: .95rem; }
.mfg-checks .is-missing .mfg-checks__icon { background: var(--brand-orange); color: var(--brand-ink); }
.mfg-checks .is-note .mfg-checks__icon { background: var(--chip-bg); color: var(--text-muted); }
.mfg-checks b { color: var(--heading); font-weight: 650; }
.mfg-checks__hint { display: block; color: var(--text-muted); font-size: var(--step--1); }
.mfg-checks--compact { margin-bottom: 1.25rem; }
.mfg-actions { display: flex; flex-wrap: wrap; gap: .9rem 1.25rem; align-items: center; justify-content: space-between; }
.mfg-actions .button.big { flex: 1 1 18rem; }
.mfg-actions__minor { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; }
.mfg-actions__minor .link-button { min-height: 44px; font-size: 1rem; }
.mfg-actions button[disabled] { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }
.mfg-keep { display: flex; gap: .5rem; align-items: flex-start; }
.mfg-keep svg { width: 1rem; height: 1rem; flex: none; margin-top: .2rem; }
.mfg-note { padding: .9rem 1.1rem; border-radius: var(--radius-md); border-left: 4px solid var(--brand-gold); background: color-mix(in srgb, var(--brand-gold) 12%, var(--surface)); line-height: 1.55; }
.mfg-note--approved { border-left-color: var(--success); background: color-mix(in srgb, var(--success) 9%, var(--surface)); }
.mfg-note--rejected { border-left-color: var(--danger); background: color-mix(in srgb, var(--danger) 7%, var(--surface)); }
.mfg-status { display: grid; gap: 1rem; }
.mfg-status__top { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: flex-start; justify-content: space-between; }
.mfg-status__top .mfg-card__title { margin: 0; }
.mfg-ref { margin: 0 0 .2rem; font-size: var(--step--1); color: var(--text-muted); font-weight: 650; }
.mfg-pill { display: inline-flex; align-items: center; padding: .3rem .8rem; border-radius: 999px; font-size: var(--step--1); font-weight: 750; white-space: nowrap;
  background: var(--chip-bg); color: var(--heading); }
.mfg-pill--submitted { background: color-mix(in srgb, var(--dusk-violet) 16%, var(--surface)); }
.mfg-pill--changes { background: color-mix(in srgb, var(--brand-gold) 35%, var(--surface)); }
.mfg-pill--approved { background: var(--success); color: #fff; }
.mfg-pill--rejected { background: color-mix(in srgb, var(--danger) 14%, var(--surface)); color: var(--danger); }
.mfg-track { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; }
.mfg-track li { position: relative; padding-top: 1.1rem; font-size: var(--step--1); font-weight: 650; color: var(--text-muted); }
.mfg-track li::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: .45rem; border-radius: 999px; background: var(--surface-2); }
.mfg-track li.is-done::before { background: var(--success); }
.mfg-track li.is-now::before { background: var(--ember); }
.mfg-track li.is-now, .mfg-track li.is-done { color: var(--heading); }
.mfg-next { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.mfg-next li { display: flex; gap: .7rem; align-items: flex-start; line-height: 1.5; }
.mfg-next svg { width: 1.3rem; height: 1.3rem; flex: none; color: var(--accent); margin-top: .1rem; }
.mfg-people { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .7rem; }
.mfg-person { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: center; padding: .9rem 1rem;
  border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--bg); }
.mfg-person__who { display: grid; min-width: 0; flex: 1 1 11rem; }
.mfg-person__who b { color: var(--heading); overflow-wrap: anywhere; }
.mfg-person__who span { color: var(--text-muted); font-size: var(--step--1); overflow-wrap: anywhere; }
.mfg-person__state { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; flex: 1 1 15rem; }
.mfg-person__acts { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; justify-content: flex-end; margin: 0 0 0 auto; }
.mfg-person__acts .button.small { min-height: 44px; }
.mfg-ask { font-size: var(--step--1); font-weight: 700; color: var(--accent); flex-basis: 100%; text-align: right; }
.mfg-mini { list-style: none; margin: 0; padding: 0; display: flex; gap: .25rem; flex-wrap: wrap; }
.mfg-mini li { font-size: .78rem; font-weight: 700; padding: .2rem .5rem; border-radius: 999px; background: var(--surface-2); color: var(--text-muted); }
.mfg-mini li.is-done { background: color-mix(in srgb, var(--success) 20%, transparent); color: var(--heading); }
.mfg-mini li.is-now { background: transparent; color: var(--heading); box-shadow: inset 0 0 0 1.5px var(--brand-gold); }
.mfg-invite { margin-top: 1.25rem; padding-top: 1.1rem; border-top: 1px solid var(--border); }
.mfg-invite label { margin-top: 0; }
.mfg-invite textarea { font-size: max(16px, 1rem); }
.mfg-complete { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; justify-content: space-between; margin-top: 1.1rem; padding: .8rem 1rem;
  border-radius: var(--radius-md); background: var(--bg); }
.mfg-complete p { margin: 0; display: flex; gap: .4rem; align-items: center; }
.mfg-complete svg { width: 1.1rem; height: 1.1rem; color: var(--success); }
.mfg-complete .button.small { min-height: 44px; }
.mfg-withdraw summary { cursor: pointer; color: var(--text-muted); min-height: 44px; display: flex; align-items: center; }
.mfg-withdraw form { padding: .5rem 0 0; }
.button.danger, button.danger { border-color: var(--danger); color: var(--danger); }
.button.big.danger { background: var(--danger); color: #fff; }
.button.big.danger:hover { color: #fff; }
.mfg-done { text-align: center; display: grid; justify-items: center; gap: .5rem; }
.mfg-done__icon { width: 4rem; height: 4rem; border-radius: 50%; display: grid; place-items: center; background: var(--success); color: #fff; }
.mfg-done__icon svg { width: 2rem; height: 2rem; }
.mfg-decide textarea { font-size: max(16px, 1rem); }
.mfg-decide--approve { border-top: 5px solid var(--success); }
.mfg-decide--changes { border-top: 5px solid var(--brand-gold); }
.mfg-decide--reject { border-top: 5px solid var(--danger); }
@media (max-width: 40rem) {
  .mfg-role { grid-template-columns: auto 1fr; padding: 1rem; }
  .mfg-role__icon { display: none; }
  .mfg-summary dl > div { grid-template-columns: 1fr; gap: .05rem; }
  .mfg-summary dd { margin-bottom: .35rem; }
  .mfg-person__acts { margin-left: 0; }
  .mfg-person__acts, .mfg-ask { justify-content: flex-start; text-align: left; }
  .mfg-actions { flex-direction: column; align-items: stretch; }
  .mfg-actions .button.big { flex: none; width: 100%; }
  .mfg-actions__minor { justify-content: space-between; }
  .mfg-site { grid-template-columns: auto 1fr; }
  .mfg-site .mfg-pill { grid-column: 2; justify-self: start; }
}

/* ---------- Sponsor packages: what's different, and Get an Email When It Opens (2026-10-19) ---------- */
/* Package cards: "Everything in Copper, plus:" above the few lines that are new (spark/sponsors/service.py cards). */
.spx-pkg__base { margin: .25rem 0 0; font-weight: 700; font-size: var(--step--1); color: var(--heading); }
.spx-pkg__base + .spx-pkg__list { margin-top: 0; }
.spx-pkg__list { align-content: start; }  /* two lines stay together at the top of a tall card */
/* Compare Every Package: the table on wide screens, a short list on phones (only what differs between packages). */
.spx-compare__list { display: none; font-size: var(--step--1); }
.spx-compare__list p { margin: .25rem 0 .75rem; }
.spx-compare__list ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.spx-compare__list li { display: grid; gap: .1rem; padding: .7rem .9rem; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface); }
.spx-compare__list li > span:last-child:not(:first-child) { color: var(--text-muted); }
.spx-compare__name { display: flex; justify-content: space-between; gap: .75rem; }
.spx-compare summary { min-height: var(--target); display: flex; align-items: center; }
@media (max-width: 40rem) {
  .spx-compare__list { display: block; }
  .spx-compare__table { display: none; }
}
/* Get an Email When It Opens (spark/events/form_interest.py): on closed Forms page cards, closed form pages, /forms/<id>/notify. */
.form-notify--card { flex-basis: 100%; }
.form-notify .button.small { min-height: var(--target); }
.form-notify .button svg { width: 1em; height: 1em; vertical-align: -.12em; }
.form-notify__on { display: inline-flex; align-items: center; gap: .4rem; margin: 0; min-height: var(--target); font-weight: 700; font-size: var(--step--1); color: var(--success); }
.form-notify__on svg { width: 1.1rem; height: 1.1rem; flex: none; }
.form-notify--box { padding: 1.25rem 1.4rem; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.form-notify--box form { display: grid; gap: .75rem; justify-items: start; }
.form-notify--box form p { margin: 0; }
.form-notify--box .field { width: 100%; max-width: 28rem; }
.form-notify--box .button { min-height: var(--target); }
.form-notify__title { display: flex; align-items: center; gap: .5rem; margin: 0 0 .5rem; font-size: var(--step-1); }
.form-notify__title svg { width: 1.3rem; height: 1.3rem; color: var(--accent); flex: none; }
@media (max-width: 40rem) { .form-notify--box .button { width: 100%; justify-content: center; } }

/* My Registrations: one card per person (2026-10-23) */
.party-list { list-style: none; padding: 0; margin: .75rem 0 1rem; display: grid; gap: .75rem; }
.party-person { padding: 1rem 1.1rem; border: 1px solid var(--border); border-radius: var(--radius, 14px); background: var(--surface-2); }
.party-person__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; }
.party-person__who { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .6rem; }
.party-person__who b { font-size: var(--step-1, 1.15rem); }
.party-person .party-flags, .upcoming-reg .party-flags { margin: 0; }
.upcoming-reg .status-pill { letter-spacing: .02em; text-transform: none; font-size: var(--step--1); padding: .35rem .7rem; }
.party-person__note { margin: .6rem 0 0; }
.party-heading { margin: 1rem 0 .35rem; font: 700 var(--step--1)/1.2 var(--font-body); letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); }
.party-person .party-heading { margin-top: .9rem; }
.upcoming-reg .party-extras { margin: 0; font-size: var(--step-0, 1rem); gap: 0; }
.upcoming-reg .party-extras > li { display: grid; grid-template-columns: 1fr auto 6.5rem; align-items: center; gap: .25rem 1rem; padding: .5rem 0; border-top: 1px solid var(--border); }
.upcoming-reg .party-extras > li:first-child { border-top: 0; }
.party-extras__price { color: var(--text-muted); font-variant-numeric: tabular-nums; text-align: right; }
.party-extras__act { text-align: right; }
.party-extras__act .remove-request[open] { grid-column: 1 / -1; text-align: left; }
.upcoming-reg .party-extras > li:has(.remove-request[open]) { grid-template-columns: 1fr auto; }
.upcoming-reg .party-extras > li:has(.remove-request[open]) .party-extras__act { grid-column: 1 / -1; text-align: left; }
.party-extras--shared { margin-bottom: .5rem; }
.party-person__tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1.5rem; margin-top: .9rem; padding-top: .9rem; border-top: 1px solid var(--border); }
.party-person__tools .badge-rename input { width: 14rem; }
.party-person__links { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; }
.party-person__links .change-ticket { margin: 0; }
.party-person__links .change-ticket[open], .party-person__off .remove-request[open] { flex-basis: 100%; }
.party-person__off .link-button { color: var(--danger); }
@media (max-width: 40rem) {
  .upcoming-reg .party-extras > li { grid-template-columns: 1fr auto; }
  .upcoming-reg .party-extras > li .party-extras__act { grid-column: 1 / -1; text-align: left; }
  .party-person__tools .badge-rename input { width: auto; flex: 1; min-width: 0; }
  .party-person__tools .badge-rename { width: 100%; }
}

/* Header and drawer: tickets and giving one tap away (2026-10-23) */
.header-actions .header-quick { display: none; gap: .4rem; }
.header-actions .header-quick svg { width: 18px; height: 18px; }
@media (min-width: 70rem) { .header-actions .header-quick:first-child { display: inline-flex; } }
@media (min-width: 82rem) { .header-actions .header-quick { display: inline-flex; } }
.drawer-quick { grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: .5rem; margin: 1rem 0 0; }
.drawer-quick .button { justify-content: center; gap: .4rem; }
.drawer-quick svg { width: 18px; height: 18px; }

/* Donate, everywhere it helps (2026-10-23) */
.button--donate { gap: .45rem; border-color: var(--brand-orange, #ff6720); }
.button--donate svg { width: 1.1em; height: 1.1em; color: var(--brand-orange, #ff6720); }
.button--donate:hover, .button--donate:focus-visible { background: color-mix(in srgb, var(--brand-orange, #ff6720) 16%, transparent); }
.donate-ask { display: grid; gap: .5rem; justify-items: start; }
.donate-ask h2 { margin: 0; }

/* My WPA → Giving: one table, years as heading rows (2026-10-23) */
.giving-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 1rem 1.5rem; margin-bottom: 1.25rem; }
.giving-head h2 { margin: 0 0 .35rem; }
.giving-head p { margin: 0; max-width: 48ch; }
.giving-head .button { flex: none; }
.giving-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; margin: 0 0 1.25rem; }
@media (max-width: 40rem) { .giving-stats > div { padding: .6rem .7rem; } }
.giving-stats > div { padding: .8rem 1rem; border: 1px solid var(--border); border-radius: var(--radius, 12px); background: var(--surface-2); }
.giving-stats dt { font-size: var(--step--1); color: var(--text-muted); margin: 0; }
.giving-stats dd { margin: .15rem 0 0; font: 700 var(--step-1, 1.2rem)/1.2 var(--font-display); font-variant-numeric: tabular-nums; }

.gift-year { margin: 0 0 1.5rem; }
.gift-year__head { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; padding: 0 0 .6rem; border-bottom: 1px solid var(--border); margin-bottom: .25rem; }
.gift-year__head h3 { margin: 0; font: 700 var(--step-2, 1.5rem)/1 var(--font-display); }
.gift-year__total { display: inline-flex; flex-wrap: wrap; gap: .4rem; }
.gift-year__total span { padding: .25rem .65rem; border-radius: 999px; background: var(--surface-2); color: var(--text-muted); font-size: var(--step--1); }
.gift-year__total b { color: var(--heading, inherit); }
.gift-year__links { margin-left: auto; display: inline-flex; flex-wrap: wrap; gap: .4rem; }
.gift-year__links .button { gap: .35rem; }
.gift-year__links svg { width: 1rem; height: 1rem; }
.gift-list { list-style: none; margin: 0; padding: 0; }
.gift-row { display: grid; grid-template-columns: 2.5rem 1fr auto auto; align-items: center; gap: .25rem 1rem; padding: .8rem .25rem; border-bottom: 1px solid var(--border); }
.gift-row:last-child { border-bottom: 0; }
.gift-row__icon { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: color-mix(in srgb, var(--brand-orange, #ff6720) 14%, transparent); color: var(--brand-orange, #ff6720); }
.gift-row__icon svg { width: 1.15rem; height: 1.15rem; }
.gift-row__what { display: grid; gap: .1rem; min-width: 0; }
.gift-row__what b { font-size: var(--step-0, 1rem); }
.gift-row__what .muted { font-size: var(--step--1); }
.gift-row__amount { display: grid; justify-items: end; font: 700 var(--step-1, 1.2rem)/1.1 var(--font-display); font-variant-numeric: tabular-nums; }
.gift-row__amount small { font: 600 var(--step--2) var(--font-body); color: var(--danger); text-transform: uppercase; letter-spacing: .05em; }
.gift-row.is-refunded .gift-row__amount { text-decoration: line-through; text-decoration-thickness: 1px; }
.gift-row__pdf { display: inline-flex; align-items: center; gap: .35rem; padding: .45rem .8rem; border: 1px solid var(--border); border-radius: 999px; text-decoration: none; font-weight: 600; font-size: var(--step--1); white-space: nowrap; }
.gift-row__pdf:hover, .gift-row__pdf:focus-visible { border-color: var(--brand-gold, #ffc226); }
.gift-row__pdf svg { width: 1rem; height: 1rem; }
@media (max-width: 40rem) {
  .gift-row { grid-template-columns: 2.5rem 1fr auto; }
  .gift-row__pdf { grid-column: 2 / -1; justify-self: start; }
  .gift-year__links { margin-left: 0; }
}

/* Forms page: a card's buttons in one row across the card (2026-10-23) */
.form-card__actions, .form-card:not(:has(.form-card__art)) .form-card__actions { grid-column: 1 / -1; padding-top: .75rem; }
.form-card__actions .button { white-space: nowrap; }
.form-card__actions > :not(.button):not(form) { flex-basis: 100%; }
.form-card__actions form { display: contents; }

/* Forms page: who can use which form, one row each (2026-10-23) */
.who-forms { list-style: none; margin: .5rem 0 1rem; padding: 0; display: grid; grid-template-columns: max-content 1fr; gap: .5rem 1rem; align-items: center; }
.who-forms li { display: contents; }
.who-forms .form-tag { justify-self: start; white-space: nowrap; }
@media (max-width: 30rem) { .who-forms { grid-template-columns: 1fr; gap: .2rem; } .who-forms li > span:last-child { margin-bottom: .5rem; } }

@media (max-width: 30rem) { .header-actions .icon-button--labeled[href="/sign-in"] { width: var(--target); padding: 0; } .header-actions .icon-button--labeled[href="/sign-in"] .icon-button__label { display: none; } }  /* narrow phones: Sign In is just the person icon so the row fits */

/* Home hero on phones: the three buttons stack as one even column (Steve, 2026-10-24: "asymmetrical") */
@media (max-width: 40rem) {
  .hero-home .buttons { flex-direction: column; align-items: stretch; }
  .hero-home .buttons .button { width: 100%; justify-content: center; text-align: center; }
}

/* Gift amounts: every chip the same size, in even rows (4 across on phones, 7 across on wider screens); more room between the rules checkbox and Continue (Steve, 2026-10-24) */
.gift__amounts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gift__chip span { height: 100%; white-space: nowrap; }
@media (min-width: 40rem) { .gift__amounts { grid-template-columns: repeat(7, minmax(0, 1fr)); } }
form .field--check ~ .buttons { margin-top: 1.75rem; }  /* the checkbox sits in a .field--check wrapper, so .agree is never the buttons' sibling */

/* Join and renew, the end of the form: room between the gift, auto-renew, rules checkbox, buttons, Stripe note and paper option (Steve, 2026-10-24) */
.auto-renew, .renew-gift { margin-bottom: 1.75rem; }
.auto-renew .check { margin-bottom: .9rem; }
form .field--check:has(.agree) { margin: 2rem 0 0; }
form .field--check ~ .buttons { margin-top: 2rem; }
form .field--check ~ .buttons + .hint { margin-top: 1.25rem; }
.paper-option { margin-top: 2.5rem; }

/* Footer base (Steve, 2026-10-24: "single, consistent, at most two rows, nothing stacked"). Wide screens: copyright, legal links and tools in one row.
   Phones: row 1 the legal links, row 2 the copyright with the theme switch (and the bug button); the version badge and the credit stay off phones. */
.footer-contact .short, .footer-base__copy .abbr { display: none; }
.footer-base__row2 { display: contents; }
.footer-base__copy { order: -1; }
@media (max-width: 40rem) {
  .site-footer { padding-bottom: 5.5rem; }  /* room so the back-to-top button never sits on the last row */
  .footer-hero { padding: 1.25rem 0 1.5rem; gap: 1rem; }
  .footer-hero p.big { font-size: var(--step-2); }
  .footer-hero__sub { font-size: var(--step--1); }
  .footer-group:not(.footer-contact) { display: none; }
  .footer-grid { padding: 0; border-top: 1px solid var(--night-line); }
  .footer-contact { border: 0; }
  .footer-contact > summary { display: none; }
  .footer-contact ul { display: flex; gap: .25rem 1.75rem; padding: 0; }
  .footer-contact ul a { min-height: 3.25rem; font-size: var(--step-0); }
  .footer-contact .long { display: none; }
  .footer-contact .short { display: inline; }
  .footer-base { display: flex; flex-direction: column; align-items: stretch; gap: .25rem; padding-top: .75rem; border-top: 1px solid var(--night-line); }
  .footer-base__legal { display: flex; flex-wrap: nowrap; justify-content: space-between; gap: .5rem; font-size: var(--step--1); white-space: nowrap; }
  .footer-base__legal a, .footer-base__legal .link-button { display: inline-flex; align-items: center; min-height: 2.75rem; font-size: inherit; }
  .footer-base__legal .credit { display: none; }
  .footer-base__row2 { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
  .footer-base__copy { order: 0; font-size: var(--step--2); opacity: .85; }
  .footer-base__copy .full { display: none; }
  .footer-base__copy .abbr { display: inline; }
  .footer-base__tools { width: auto; flex-wrap: nowrap; gap: .25rem; }
  .footer-base .version-badge { display: none; }
}
@media (min-width: 40.01rem) { .footer-base { justify-content: flex-start; } .footer-base__tools { margin-left: auto; } .footer-base__copy { margin-right: .25rem; } }

/* Narrow phones (iPhone mini/SE/13-sized, 416px and under): the Menu button is just the icon, so a signed-in header (menu, heart, search, cart, avatar, logo) fits.
   Found by the WebKit phone test: Menu was cut off the left edge. */
@media (max-width: 26rem) {
  .header-actions .menu-toggle { width: var(--target); padding: 0; }
  .header-actions .menu-toggle .icon-button__label { display: none; }
}

/* Footer on phones, tidied (Steve, 2026-10-24: "still looks awful"): two left-aligned rows in one text size, a small theme switch, no stray bug icon */
@media (max-width: 40rem) {
  .site-footer { padding-bottom: 4.75rem; }
  .footer-base { gap: 0; padding-top: .5rem; }
  .footer-base__legal { justify-content: flex-start; gap: 0 1.5rem; font-size: var(--step--1); }
  .footer-base__row2 { padding: .25rem 0 .5rem; }
  .footer-base__copy { font-size: var(--step--1); opacity: 1; }
  .footer-base .theme-switch { padding: .15rem; }
  .footer-base .theme-switch button { width: 2.25rem; height: 2.25rem; }
  .footer-base .theme-switch svg { width: .95rem; height: .95rem; }
  .footer-base__tools .bug-button { display: none; }
}

/* Footer on phones, one row (Steve, 2026-10-24: "we just need the copyright... theme as a simple icon, keep bug reporting... the footer the absolute bottom").
   The privacy links live in the menu on phones. The floating buttons ride higher so they aren't always in the corner. */
.theme-toggle--footer { display: none; }
.theme-toggle .ti { display: none; }
html:not([data-theme-choice="light"]):not([data-theme-choice="dark"]) .theme-toggle .ti-system, html[data-theme-choice="light"] .theme-toggle .ti-light, html[data-theme-choice="dark"] .theme-toggle .ti-dark { display: grid; }
@media (max-width: 40rem) {
  .site-footer { padding-bottom: .5rem; }
  .footer-base { border-top: 1px solid var(--night-line); padding-top: 0; }
  .footer-base__legal, .footer-base .theme-switch { display: none; }
  .footer-base__row2 { padding: 0; min-height: 3rem; }
  .footer-base__tools .bug-button { display: inline-flex; }
  .theme-toggle--footer { display: inline-grid; place-items: center; width: 2.5rem; height: 2.5rem; min-height: 0; padding: 0; border: 0; border-radius: 999px; background: none; color: var(--night-muted); cursor: pointer; }
  .theme-toggle--footer .ti { place-items: center; }
  .theme-toggle--footer svg { width: 1.2rem; height: 1.2rem; }
  .theme-toggle--footer:hover { color: var(--brand-gold); }
  .footer-base__row2 { padding-right: 3.5rem; }  /* the back-to-top button sits in the corner, never over the footer's icons */
}

/* My Account on phones (Steve, 2026-10-24: "not symmetrical, not the same size"): two columns of identical one-line tiles, a short label each, an odd last
   tile and Sign Out spanning the full row; the status dot sits on the status line's first row */
.account-nav .short { display: none; }
.account-hero__status { display: block; }
.account-hero__status .dot { vertical-align: middle; margin-right: .5rem; position: relative; top: -1px; }
@media (max-width: 59.99rem) {
  .account-nav { grid-auto-rows: 3.25rem; gap: .6rem; }
  .account-nav .full { display: none; }
  .account-nav .short { display: inline; }
  .account-nav li { display: block; height: 100%; }
  .account-nav li.is-wide { grid-column: 1 / -1; }
  .account-nav a { height: 100%; min-height: 0; padding: 0 .9rem; justify-content: flex-start; border-radius: var(--radius-md); }
  .account-nav li a span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; overflow-wrap: normal; }
  .account-nav form { grid-column: 1 / -1; height: 100%; }
  .account-nav form .button { height: 100%; width: 100%; min-height: 0; border-radius: var(--radius-md); font: 600 var(--step--1)/1.2 var(--font-body); }
}
/* Phone header (same day): no Donate or Search icon up here (both are in the menu); it's Menu, your account, the logo */
@media (max-width: 64rem) { .header-actions .header-quick.header-donate { display: none; } }
@media (max-width: 40rem) { .header-actions .search-button { display: none; } }

/* The testing toolbox button is draggable (static/js/toolbox.js): no page scroll or text selection while it's held */
.toolbox-fab { touch-action: none; cursor: grab; user-select: none; -webkit-user-select: none; }
.toolbox-fab.is-dragging { cursor: grabbing; transform: scale(1.08); box-shadow: 0 8px 24px rgb(0 0 0 / .5); }

/* Schedule header (Steve, 2026-10-24: "clean up this header"): Add to Calendar and one Download menu, side by side; the menu opens in place */
.schedule-hero__actions { display: flex; flex-wrap: wrap; gap: .6rem; align-items: flex-start; }
.schedule-hero__actions > .button, .dl-menu > summary { min-height: 3rem; padding: .5rem 1.25rem; font: 650 var(--step-0)/1.2 var(--font-body); display: inline-flex; align-items: center; justify-content: center; gap: .5rem; border-radius: 999px; }
.dl-menu > summary { list-style: none; cursor: pointer; }
.dl-menu > summary::-webkit-details-marker { display: none; }
.dl-menu > summary::after { content: ""; width: .45rem; height: .45rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); margin-left: .2rem; transition: transform .2s; }
.dl-menu[open] > summary::after { transform: rotate(225deg); }
.dl-menu__list { list-style: none; margin: .5rem 0 0; padding: .35rem; display: grid; gap: .1rem; min-width: min(100%, 20rem); border: 1px solid var(--night-line); border-radius: var(--radius-lg); background: rgb(12 17 34 / .92); }
.dl-menu__list a { display: grid; gap: .1rem; padding: .65rem .8rem; border-radius: var(--radius-md); color: var(--white); text-decoration: none; }
.dl-menu__list a:hover, .dl-menu__list a:focus-visible { background: rgb(255 255 255 / .08); }
.dl-menu__list b { font-weight: 650; }
.dl-menu__list small { color: var(--night-muted); font-size: var(--step--1); }
@media (max-width: 40rem) {
  .schedule-hero__actions > .button, .dl-menu { flex: 1 1 0; min-width: 0; }
  .schedule-hero__actions .button:first-child { flex-basis: 0; }
  .dl-menu > summary { width: 100%; }
  .dl-menu[open] { flex-basis: 100%; }  /* the open list takes the full row */
  .schedule-hero__actions > .button { padding: .5rem .75rem; min-height: 3rem; font-size: var(--step-0); }
}

/* My WPA → Membership → Automatic Renewal: one block per member */
.auto-renew-list { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: 1rem; }
.auto-renew-list li { padding: 1rem; border: 1px solid var(--border); border-radius: var(--radius-md); }
.auto-renew-list p { margin: 0 0 .5rem; }

/* The slide menu's My WPA panel (Steve, 2026-10-24): who you are and every account page, at the top, when you're signed in */
.drawer-me { display: none; }
@media (max-width: 64rem) {
  .nav .drawer-me { display: block; margin: 1rem 1.25rem .25rem; padding: .75rem; border: 1px solid var(--night-line); border-radius: var(--radius-lg); background: rgb(255 255 255 / .04); }
  .nav .drawer-me__who { display: flex; align-items: center; gap: .85rem; padding: .2rem .2rem .75rem; text-decoration: none; color: var(--white); background: none; }
  .drawer-me__who img, .drawer-me__initials { width: 3.25rem; height: 3.25rem; border-radius: 50%; object-fit: cover; flex: none; }
  .drawer-me__initials { display: grid; place-items: center; background: var(--sunset); color: var(--night-1); font: 800 1.05rem/1 var(--font-body); }
  .drawer-me__text { display: grid; min-width: 0; flex: 1; }
  .drawer-me__text b { font: 750 var(--step-1)/1.15 var(--font-display); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .drawer-me__text small { color: var(--night-muted); font-size: var(--step--1); }
  .drawer-me__go { color: var(--brand-gold); font-size: 1.6rem; line-height: 1; }
  .drawer-me__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 2.9rem; gap: .45rem; }
  .drawer-me__grid li { display: block; min-width: 0; }
  .drawer-me__grid li.is-wide { grid-column: 1 / -1; }
  .nav .drawer-me__grid a, .drawer-me__grid button { display: flex; align-items: center; gap: .5rem; width: 100%; height: 100%; padding: 0 .75rem; border: 1px solid var(--night-line); border-radius: var(--radius-md); background: rgb(255 255 255 / .05); color: var(--white); font: 600 var(--step--1)/1 var(--font-body); text-decoration: none; min-height: 0; cursor: pointer; justify-content: flex-start; }
  .drawer-me__grid a:hover, .drawer-me__grid button:hover { border-color: var(--brand-gold); background: rgb(255 194 38 / .1); }
  .drawer-me__grid svg { width: 1.05rem; height: 1.05rem; flex: none; color: var(--brand-gold); }
  .drawer-me__grid span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .drawer-me .drawer-signout { margin: 0; height: 100%; }
  .drawer-me .drawer-signout button { justify-content: center; color: var(--night-muted); }
}

/* My Account on phones: the slide menu's My WPA panel has every page, so the tile grid is not repeated at the top of each page (Steve, 2026-10-24) */
@media (max-width: 59.99rem) { .account-nav { display: none; } .account-shell { gap: 0; } }

/* My Account header buttons on phones (Steve, 2026-10-24): smaller, the same size, centered under the text */
@media (max-width: 44rem) {
  .account-hero__actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin-top: .25rem; }
  .account-hero__actions .button { flex: 0 0 8.5rem; min-height: 2.4rem; padding: .35rem .75rem; font-size: var(--step--1); justify-content: center; gap: .4rem; }
  .account-hero__actions .button svg { width: 1rem; height: 1rem; }
}

/* My Account on phones: the one column is exactly the page width, so nothing wide inside can push the cards off-center (Steve, 2026-10-24) */
@media (max-width: 59.99rem) { .account-shell { grid-template-columns: minmax(0, 1fr); } .account-shell > *, .account-main > *, .account-grid-2 > * { min-width: 0; max-width: 100%; } }

/* Membership card, one look per membership type (Steve, 2026-10-24: "different backgrounds, a little cooler"). Regular keeps the night-sky card;
   --tier-accent colors the type label, --tier-line the border. The tier key is on the card as member-id--tier-<key>. */
.member-id { --tier-accent: #ffc226; --tier-line: rgba(255, 194, 38, .35); border-color: var(--tier-line); }
.member-id__top span { color: var(--tier-accent); }
.member-id::before { content: ""; position: absolute; inset: 0; z-index: 0; opacity: .55; pointer-events: none;
  background-image: radial-gradient(circle at 14% 22%, rgba(255,255,255,.85) 0 .15cqw, transparent .4cqw), radial-gradient(circle at 72% 14%, rgba(255,255,255,.7) 0 .12cqw, transparent .35cqw),
    radial-gradient(circle at 88% 48%, rgba(255,255,255,.6) 0 .12cqw, transparent .3cqw), radial-gradient(circle at 36% 40%, rgba(255,255,255,.5) 0 .1cqw, transparent .3cqw); }
.member-id--tier-spouse { --tier-accent: #86f2d6; --tier-line: rgba(134, 242, 214, .45);
  background: radial-gradient(85% 75% at 100% 0%, rgba(20, 184, 166, .6) 0%, transparent 62%), radial-gradient(100% 90% at 0% 118%, rgba(190, 50, 120, .75) 0%, transparent 62%), linear-gradient(160deg, #06202a, #0a1220 58%, #1a0c1f); }
.member-id--tier-spouse::after { background: linear-gradient(100deg, #14b8a6 0%, #5eead4 40%, #ec4899 100%); }
.member-id--tier-student { --tier-accent: #7dd3fc; --tier-line: rgba(125, 211, 252, .5);
  background: radial-gradient(90% 80% at 12% -8%, rgba(37, 99, 235, .85) 0%, transparent 60%), radial-gradient(90% 80% at 100% 115%, rgba(6, 182, 212, .75) 0%, transparent 60%), linear-gradient(150deg, #071433, #0a1330 60%, #04202e); }
.member-id--tier-student::after { background: linear-gradient(100deg, #3b82f6 0%, #22d3ee 55%, #a5f3fc 100%); }
.member-id--tier-student::before { opacity: .9; }
.member-id--tier-gold { --tier-accent: #ffe08a; --tier-line: rgba(255, 214, 102, .85);
  background: linear-gradient(125deg, rgba(255, 224, 138, .28) 0%, transparent 28%, rgba(255, 196, 60, .22) 46%, transparent 60%), radial-gradient(120% 100% at 85% 0%, rgba(214, 160, 40, .55) 0%, transparent 55%), linear-gradient(160deg, #1c1407 0%, #35260a 40%, #120d04 100%);
  box-shadow: var(--shadow-lg), 0 0 0 .35cqw rgba(255, 214, 102, .22), 0 0 5cqw rgba(255, 190, 40, .28); }
.member-id--tier-gold::after { background: linear-gradient(100deg, #8a6416 0%, #ffd866 40%, #fff1b8 55%, #c9971f 100%); opacity: .4; }
.member-id--tier-gold .member-id__name { background: linear-gradient(180deg, #fff6d6, #ffd866 60%, #e0a82a); -webkit-background-clip: text; background-clip: text; color: transparent; }
.member-id--tier-lifetime { --tier-accent: #ffffff; --tier-line: rgba(226, 232, 255, .8);
  background: linear-gradient(180deg, rgba(8, 10, 25, .62) 0%, rgba(8, 10, 25, .3) 55%, rgba(8, 10, 25, .55) 100%), conic-gradient(from 215deg at 78% 18%, #151a30 0deg, #3b4a86 60deg, #aab8e8 110deg, #7a5bd6 170deg, #e8b4ff 220deg, #5fd0ff 280deg, #151a30 340deg), #0b1020;
  box-shadow: var(--shadow-lg), 0 0 0 .35cqw rgba(226, 232, 255, .25), 0 0 6cqw rgba(160, 130, 255, .35); }
.member-id--tier-lifetime::after { background: linear-gradient(100deg, rgba(255,255,255,.0) 0%, rgba(255,255,255,.55) 45%, rgba(255,255,255,0) 70%); filter: blur(10px); opacity: .5; inset: -20% -10% auto -10%; height: 90%; transform: rotate(-12deg); }
.member-id--tier-lifetime .member-id__top, .member-id--tier-lifetime .member-id__who, .member-id--tier-lifetime .member-id__bottom { text-shadow: 0 .2cqw 1.4cqw rgba(5, 7, 20, .9); }
.member-id--tier-lifetime dt { color: #d7dcf5; }
.member-id--tier-wapm { --tier-accent: #ffb27a; --tier-line: rgba(255, 140, 60, .6);
  background: radial-gradient(90% 80% at 50% 125%, rgba(255, 103, 32, .8) 0%, rgba(190, 40, 20, .5) 35%, transparent 70%), linear-gradient(170deg, #1a0a06, #0a0606 70%); }
.member-id--tier-wapm::after { background: linear-gradient(100deg, #b91c1c, #ff6720 60%, #ffc226); }
.member-id--tier-discount, .member-id--tier-pgi-doc { --tier-accent: #cbd5e1; --tier-line: rgba(203, 213, 225, .4);
  background: radial-gradient(100% 90% at 50% 120%, rgba(100, 116, 139, .6) 0%, transparent 65%), linear-gradient(160deg, #0f172a, #0a0f1f); }

/* My Events on phones (Steve, 2026-10-24: "so much is truncated and falling off"): add-on rows are label and price with the action under them,
   the badge name is a full-width field with Save beside it, flags and names stack, and the cards use the width they have */
@media (max-width: 40rem) {
  .upcoming-reg { padding: 1rem .85rem; }
  .upcoming-reg h2 { font-size: var(--step-1); line-height: 1.2; }
  .upcoming-reg h2 small { display: block; margin-top: .15rem; font-size: var(--step--1); }
  .party-person { padding: .85rem .8rem; }
  .party-person__head { display: grid; gap: .4rem; }
  .party-person__who { display: grid; gap: .1rem; }
  .party-person__who b { font-size: var(--step-1); overflow-wrap: anywhere; }
  .party-flags { gap: .3rem; }
  .upcoming-reg .status-pill { font-size: var(--step--2); padding: .3rem .6rem; max-width: 100%; white-space: normal; }
  .upcoming-reg .party-extras { font-size: var(--step--1); }
  .upcoming-reg .party-extras > li { grid-template-columns: minmax(0, 1fr) auto; gap: .1rem .75rem; padding: .6rem 0; }
  .upcoming-reg .party-extras__what { overflow-wrap: anywhere; line-height: 1.3; }
  .upcoming-reg .party-extras__act { grid-column: 1 / -1; text-align: left; }
  .upcoming-reg .party-extras__act .remove-request > summary { display: inline-block; padding: .15rem 0; font-size: var(--step--1); }
  .badge-rename { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .4rem .5rem; align-items: center; }
  .badge-rename label { grid-column: 1 / -1; font-weight: 650; }
  .badge-rename input { max-width: none; min-width: 0; width: 100%; }
  .party-person__links { display: grid; gap: .25rem; }
  .change-ticket form { padding: .75rem; }
  .party-person__tools { margin-top: .6rem; }
}

/* 2026-10-24: a staff note at the top of a page (page_blurbs) sits clear of what follows it, and of an aside beside it */
.page-blurb { margin: 0 0 clamp(1.25rem, 1rem + 1vw, 2rem); }
/* 2026-10-24: a status pill and the heading under it, and a card and the note under it, don't touch */
.status-pill:has(+ :is(h1, h2, h3)) { margin-bottom: .75rem; }
.card + :is(p, .hint) { margin-top: 1rem; }

/* 2026-10-24: the picture for a talk with none of its own: series, speaker and month on the brand's night colors (no AI-made images) */
.talk-art { position: absolute; inset: 0; display: grid; align-content: space-between; padding: 1rem 1.15rem 3.4rem; color: #fff; overflow: hidden;  /* the bottom is left clear for the Members chip */
  background: radial-gradient(circle at 85% 20%, var(--talk-glow, rgb(255 103 32 / .55)), transparent 55%), linear-gradient(160deg, var(--talk-a, #1b1342), var(--talk-b, #0a0f1f)); }
.talk-art::after { content: ""; position: absolute; right: -2.5rem; top: -2.5rem; width: 9rem; aspect-ratio: 1; border-radius: 50%; opacity: .35;
  background: repeating-conic-gradient(from 0deg, rgb(255 255 255 / .55) 0 2deg, transparent 2deg 15deg); mask: radial-gradient(circle, transparent 18%, #000 19%, #000 62%, transparent 63%); }
.talk-art--1 { --talk-a: #3a1245; --talk-b: #0a0f1f; --talk-glow: rgb(210 60 124 / .5); }
.talk-art--2 { --talk-a: #0f2a4a; --talk-b: #0a0f1f; --talk-glow: rgb(43 140 255 / .45); }
.talk-art--3 { --talk-a: #3b2410; --talk-b: #0a0f1f; --talk-glow: rgb(255 194 38 / .45); }
.talk-art__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.talk-art__shade { position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, rgb(5 7 15 / .6), rgb(5 7 15 / .1) 45%, rgb(5 7 15 / .65)); }
.talk-art__series { position: relative; z-index: 1; font: 800 var(--step--2)/1.2 var(--font-body); letter-spacing: .14em; text-transform: uppercase; color: #ffc226; max-width: 80%; }
.talk-art__who { position: relative; z-index: 1; font: 800 var(--step-1)/1.15 var(--font-display); text-wrap: balance; text-shadow: 0 2px 14px rgb(0 0 0 / .6); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.talk-art__date { position: relative; z-index: 1; font: 600 var(--step--1)/1 var(--font-body); color: rgb(255 255 255 / .75); }
.locked .talk-art { position: relative; min-height: 12rem; border-radius: var(--radius-lg); }

/* 2026-10-25: classes that had no style (the public-classes test): an organization's heading in the registration picker, the application's photo step, the sponsor levels card */
.org-picks__head { margin: 1.25rem 0 .5rem; }
.photo-step { display: grid; gap: .75rem; margin: 1.25rem 0; padding: 1rem 1.15rem; border: 1px solid var(--border); border-radius: var(--radius-lg); }
.photo-step legend { padding: 0 .4rem; font-weight: 800; }
.account-step { margin-top: 1.25rem; }
.secure-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1rem; margin: 1.25rem 0; }
.secure-option { display: grid; gap: .6rem; align-content: start; padding: 1rem 1.15rem; border: 1px solid var(--border); border-radius: var(--radius-lg); }
.secure-option h2 { margin: 0; font-size: 1.1rem; }
.secure-option p { margin: 0; }
.sponsor-levels { display: grid; gap: .75rem; margin-bottom: 1.25rem; }

/* 2026-10-25: the footer's theme switch and version badge are the same size: both pills as tall as the switch (2rem buttons, .2rem padding, 1px border), evenly padded and centered */
@media (min-width: 48.01rem) {
  .site-footer .footer-base .version-badge { box-sizing: border-box; height: calc(2.4rem + 2px); line-height: 2.4rem; padding: 0 1.1rem; }
  .site-footer .footer-base .theme-switch { box-sizing: border-box; height: calc(2.4rem + 2px); align-items: center; padding: 0 .2rem; }
  .site-footer .footer-base .theme-switch button { height: 2rem; }
  .footer-base__copy, .footer-base .bug-button { align-self: center; }
}

/* The organization calendar (/calendar): a month grid that becomes a day list on phones, a list view, kind chips and the subscribe panel (2026-10-25) */
.cal { display: block; }
.cal-bar { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; justify-content: space-between; margin-bottom: .75rem; }
.cal-views { display: inline-flex; border: 1.5px solid var(--border); border-radius: 999px; overflow: hidden; }
.cal-view { padding: .5rem 1.1rem; font-weight: 700; color: var(--text); text-decoration: none; }
.cal-view.is-on { background: var(--accent); color: var(--cta-text); }
.cal-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.cal-chip { padding: .4rem .85rem; border-radius: 999px; border: 1.5px solid var(--border); background: var(--surface); color: var(--text); text-decoration: none; font-weight: 600; font-size: .9rem; }
.cal-chip.is-on { border-color: var(--accent); background: var(--surface-2); }
.cal-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin: 1rem 0 .75rem; }
.cal-head h2 { margin: 0; font-size: 1.4rem; text-align: center; }
.cal-grid { border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; background: var(--surface); }
.cal-dow, .cal-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal-dow span { padding: .5rem; text-align: center; font-weight: 700; font-size: .85rem; background: var(--surface-2); color: var(--text-muted); }
.cal-day { min-height: 6.5rem; padding: .4rem; border-top: 1px solid var(--border); border-left: 1px solid var(--border); display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.cal-day:first-child { border-left: 0; }
.cal-day.is-other { background: var(--surface-2); color: var(--text-muted); }
.cal-day.is-today .cal-day__n { background: var(--accent); color: var(--cta-text); border-radius: 999px; }
.cal-day__n { align-self: flex-start; min-width: 1.7rem; padding: 0 .35rem; text-align: center; font-weight: 700; }
.cal-day__dow { display: none; }
.cal-item { display: block; padding: .2rem .4rem; border-radius: .4rem; border-left: 4px solid var(--cat-meeting); background: var(--surface-2); color: var(--text); text-decoration: none; font-size: .82rem; line-height: 1.25; overflow-wrap: anywhere; }
.cal-item:hover, .cal-item:focus-visible { background: var(--chip-bg); }
.cal-item.is-canceled { text-decoration: line-through; opacity: .7; }
.cal-item__time { font-weight: 700; color: var(--text-muted); }
.cal-item--board { border-left-color: var(--brand-navy); } .cal-item--wapm { border-left-color: var(--dusk-violet); } .cal-item--club { border-left-color: var(--success); }
.cal-item--online { border-left-color: var(--info); } .cal-item--workshop { border-left-color: var(--cat-workshop); } .cal-item--deadline { border-left-color: var(--danger); }
.cal-item--event { border-left-color: var(--brand-orange); }
.cal-month { margin: 1.5rem 0 .5rem; font-size: 1.25rem; }
.cal-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.cal-row { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); gap: .9rem; align-items: center; padding: .7rem .9rem; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.cal-row__date { display: grid; justify-items: center; line-height: 1.1; color: var(--text-muted); font-size: .8rem; text-transform: uppercase; }
.cal-row__date b { font-size: 1.5rem; color: var(--heading); }
.cal-row__body { display: grid; gap: .2rem; min-width: 0; overflow-wrap: anywhere; }
.cal-row__body small { color: var(--text-muted); }
.cal-tag { display: inline-block; margin-right: .4rem; padding: 0 .5rem; border-radius: 999px; background: var(--chip-bg); color: var(--text); font-weight: 700; }
.cal-subscribe { margin-top: 2rem; display: grid; gap: .75rem; }
.cal-url { width: 100%; }
.cal-facts { display: grid; gap: .6rem; margin: 0 0 1rem; }
.cal-facts div { display: grid; gap: .1rem; } .cal-facts dt { font-weight: 700; color: var(--text-muted); } .cal-facts dd { margin: 0; overflow-wrap: anywhere; }
.cal-desc p { margin: 0 0 .8rem; }
@media (max-width: 720px) {
  .cal-dow { display: none; }
  .cal-week { grid-template-columns: 1fr; }
  .cal-day { min-height: 0; border-left: 0; flex-direction: row; flex-wrap: wrap; align-items: center; }
  .cal-day.is-empty, .cal-day.is-other { display: none; }
  .cal-day__n { min-width: 6rem; text-align: left; }
  .cal-day__dow { display: inline; font-weight: 600; }
  .cal-item { flex: 1 1 12rem; }
}

/* Meet the Community (/community): member pages (2026-10-25) */
.pf-mine { margin-bottom: 1rem; padding: .8rem 1rem; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface-2); }
.pf-mine p { margin: 0; display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.pf-tools { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 1.25rem; }
.pf-tools input[type=search] { flex: 1 1 16rem; min-width: 0; }
.pf-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 1rem; }
.pf-card { display: grid; grid-template-columns: 4rem minmax(0, 1fr); gap: .9rem; align-items: start; height: 100%; padding: 1rem; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); color: var(--text); text-decoration: none; }
.pf-card:hover, .pf-card:focus-visible { border-color: var(--accent); }
.pf-card__body { display: grid; gap: .25rem; min-width: 0; overflow-wrap: anywhere; }
.pf-card__body small { color: var(--text-muted); }
.pf-card__line { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.pf-avatar { width: 4rem; height: 4rem; border-radius: 50%; object-fit: cover; background: var(--surface-2); }
.pf-avatar--initials { display: grid; place-items: center; font-weight: 800; color: var(--cta-text); background: var(--brand-navy); }
.pf-avatar--big { width: 7rem; height: 7rem; font-size: 2rem; }
.pf-person { display: block; }
.pf-person__head { display: flex; flex-wrap: wrap; gap: 1.25rem; align-items: center; margin-bottom: 1rem; }
.pf-headline { margin: 0; font-size: 1.3rem; font-weight: 600; flex: 1 1 14rem; }
.pf-answers { display: grid; gap: 1rem; margin: 0 0 1.5rem; }
.pf-answers dt { font-weight: 800; color: var(--text-muted); font-size: .9rem; text-transform: uppercase; letter-spacing: .04em; }
.pf-answers dd { margin: .2rem 0 0; font-size: 1.05rem; overflow-wrap: anywhere; }
.pf-hello { display: grid; gap: .6rem; margin-bottom: 1rem; }
.pf-hello h2 { margin: 0; }
@media (max-width: 480px) { .pf-card { grid-template-columns: 3rem minmax(0, 1fr); } .pf-avatar { width: 3rem; height: 3rem; } }

.pf-kinds { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .9rem; }
.pf-kind { padding: .4rem .85rem; border-radius: 999px; border: 1.5px solid var(--border); background: var(--surface); color: var(--text); text-decoration: none; font-weight: 600; font-size: .9rem; }
.pf-kind span { color: var(--text-muted); font-weight: 500; margin-left: .2rem; }
.pf-kind.is-on { border-color: var(--accent); background: var(--surface-2); }
.pf-chips { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .2rem; }
.pf-chip { display: inline-block; padding: 0 .55rem; border-radius: 999px; background: var(--chip-bg); color: var(--text); font-weight: 700; font-size: .78rem; line-height: 1.6; }
.pf-links { margin: 0 0 1.25rem; padding: 1rem 1.15rem; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface-2); }
.pf-links ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.pf-h { margin: 0 0 .5rem; font-size: 1rem; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted); }

/* WAPM add-on on the join form, and adding a family member on the renewal page */
.wapm-join { margin-top: 1.5rem; }
.add-family { margin-top: 1.25rem; }

/* The shop: product cards and a product page */
.shop-group { margin-bottom: 2.5rem; }
.shop-card { display: flex; flex-direction: column; gap: .35rem; text-decoration: none; color: inherit; }
.shop-card:hover { border-color: var(--accent); }
.shop-card__img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; border-radius: var(--radius-lg); background: var(--surface-2, var(--surface)); }
.shop-card__name { font-size: 1.05rem; }
.shop-card__price { font-weight: 700; color: var(--accent); }
.shop-product__img { width: 100%; max-width: 32rem; height: auto; border-radius: var(--radius-lg); }
.shop-product__details { margin-top: 1rem; }
.shop-form .field { margin-bottom: .75rem; } .shop-form select { width: 100%; text-overflow: clip; }
/* Placeholder art (store/_art.html): a soft firework burst in the item's color */
.art { --art: var(--accent); position: relative; display: grid; place-items: center; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--radius-lg); color: var(--art);
  background: radial-gradient(120% 90% at 28% 18%, color-mix(in srgb, var(--art) 34%, transparent), transparent 62%), linear-gradient(165deg, color-mix(in srgb, var(--art) 18%, var(--surface)), var(--surface-2, var(--surface))); }
.art__burst { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .42; }
.art__small { opacity: .8; }
.art__icon { position: relative; display: grid; place-items: center; width: 22%; aspect-ratio: 1; border-radius: 50%; background: color-mix(in srgb, var(--surface) 82%, transparent); box-shadow: 0 6px 18px -8px color-mix(in srgb, var(--art) 70%, transparent); }
.art__icon svg { width: 54%; height: 54%; }
.art--strip { aspect-ratio: 16 / 5; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
.art--strip .art__icon { width: 14%; }
.art--hero { max-width: 36rem; margin-bottom: 1rem; }
.art--apparel { --art: var(--cat-display); } .art--goods { --art: var(--accent); } .art--workshop { --art: var(--cat-workshop); } .art--social { --art: var(--cat-seminar); }
.art--book { --art: var(--cat-seminar); } .art--service { --art: var(--cat-shooting); } .art--seminar { --art: var(--cat-seminar); } .art--demonstration { --art: var(--cat-display); }
.art--shooting { --art: var(--cat-shooting); } .art--display { --art: var(--cat-display); } .art--other { --art: var(--accent); }

/* The Shop's front page: three ways in, then the items */
.shop-tiles { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); margin-bottom: 2.5rem; }
.shop-tile { position: relative; display: grid; grid-template-columns: 7.5rem 1fr auto; align-items: center; gap: 1rem; padding: .75rem 1rem .75rem .75rem; border: 1px solid var(--border); border-radius: var(--radius-lg);
  background: var(--surface); color: inherit; text-decoration: none; transition: border-color .15s, transform .15s; }
.shop-tile:hover { border-color: var(--accent); transform: translateY(-2px); }
.shop-tile .art { aspect-ratio: 1; border-radius: calc(var(--radius-lg) - 6px); }
.shop-tile .art__icon { width: 38%; }
.shop-tile__text { display: grid; gap: .2rem; } .shop-tile__text b { font-size: 1.1rem; } .shop-tile__text small { color: var(--text-muted); line-height: 1.35; }
.shop-tile__go { font-size: 1.4rem; color: var(--accent); }
.shop-group__title { display: flex; align-items: baseline; gap: .75rem; padding-bottom: .5rem; margin-bottom: 1rem; border-bottom: 1px solid var(--border); }
.shop-group__n { font-size: var(--step--1); font-weight: 500; color: var(--text-muted); }
.shop-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); color: inherit; text-decoration: none; transition: border-color .15s, transform .15s; }
.shop-card:hover { border-color: var(--accent); transform: translateY(-2px); }
.shop-card .art { border-radius: 0; }
.shop-card__body { display: grid; gap: .25rem; padding: .9rem 1rem 1rem; }
.shop-card__eyebrow { font-size: var(--step--1); text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted); }

/* Classes & Workshops */
.class-event { margin-bottom: 3rem; }
.class-event__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 1rem; margin-bottom: 1rem; }
.class-event__head h2 { margin: 0; }
.class-note { display: flex; gap: .6rem; align-items: start; margin: 0 0 1rem; padding: .75rem 1rem; border-radius: var(--radius); background: var(--surface-2, var(--surface)); border: 1px solid var(--border); }
.class-note svg { width: 1.2rem; height: 1.2rem; flex: none; margin-top: .15rem; color: var(--accent); }
.class-days { position: sticky; top: 0; z-index: 4; display: flex; gap: .5rem; overflow-x: auto; padding: .6rem 0; margin-bottom: 1rem; background: var(--bg); scrollbar-width: none; }
.class-days a { flex: none; display: inline-flex; align-items: baseline; gap: .35rem; padding: .45rem .9rem; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: inherit; text-decoration: none; }
.class-days a:hover { border-color: var(--accent); } .class-days small { color: var(--text-muted); }
.class-day { margin-bottom: 2rem; scroll-margin-top: 4.5rem; }
.class-day__title { margin: 0 0 .75rem; font-size: var(--step-1); }
.class-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.class-card.is-full { opacity: .72; }
.class-card__body { display: grid; gap: .35rem; padding: .9rem 1rem .5rem; flex: 1; align-content: start; }
.class-card__when { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .9rem; font-size: var(--step--1); color: var(--text-muted); }
.class-card__when svg, .class-card__where svg { width: 1em; height: 1em; margin-right: .3rem; vertical-align: -.12em; }
.class-card__where { display: inline-flex; align-items: center; }
.class-card__title { margin: 0; font-size: 1.1rem; line-height: 1.25; } .class-card__title a { color: inherit; text-decoration: none; } .class-card__title a:hover { color: var(--accent); }
.class-card__who { margin: 0; color: var(--text-muted); font-size: var(--step--1); }
.class-card__tags { display: flex; flex-wrap: wrap; gap: .35rem; margin: .15rem 0 0; }
.class-card__tags .tag { font-size: .75rem; padding: .1rem .55rem; border-radius: 999px; background: var(--chip-bg); }
.class-card__req { margin: .25rem 0 0; font-size: .8rem; line-height: 1.4; color: var(--text-muted); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.class-card__buy { padding: 0 1rem 1rem; }
.class-buy { display: flex; gap: .5rem; align-items: center; }
.class-buy select { flex: 1; min-width: 0; padding: .4rem .6rem; min-height: 36px; font-size: var(--step--1); }
.class-card__incart { display: inline-flex; align-items: center; gap: .35rem; color: var(--success, var(--accent)); font-weight: 600; }
.class-card__incart svg { width: 1.1rem; height: 1.1rem; }
.class-card__buy .full { width: 100%; }
.class-card__foot { display: flex; align-items: center; gap: .75rem; padding: .75rem 1rem .75rem; }
.class-card__price { font-weight: 700; font-size: 1.1rem; color: var(--accent); }
.class-card__seats { flex: 1; font-size: var(--step--1); color: var(--text-muted); } .class-card__seats.is-low { color: var(--warning); font-weight: 600; } .class-card__seats.is-full { color: var(--danger); font-weight: 600; }
.class-event__cta { display: flex; gap: .5rem; }
.class-grid, .shop-grid { align-items: stretch; }
@media (max-width: 480px) { .shop-tile { grid-template-columns: 5.5rem 1fr auto; } }


/* The Cleanup Pool (shared/cleanup_pool.html): a golden piggy bank taking coins, and what a share would be */
.cleanup-pool { display: grid; grid-template-columns: auto 1fr; gap: 1.25rem; align-items: center; margin-bottom: 1.25rem; border-color: var(--brand-gold); }
.cleanup-pool__bank svg { display: block; overflow: visible; }
.cleanup-pool__body { min-width: 0; }
.cleanup-pool .cp-body, .cleanup-pool .cp-snout { fill: var(--brand-gold); }
.cleanup-pool .cp-ear { fill: var(--brand-gold); stroke: var(--brand-ink); stroke-width: 3; stroke-linejoin: round; }
.cleanup-pool .cp-body, .cleanup-pool .cp-snout, .cleanup-pool .cp-leg { stroke: var(--brand-ink); stroke-width: 3; }
.cleanup-pool .cp-leg { fill: var(--brand-gold); }
.cleanup-pool .cp-tail { fill: none; stroke: var(--brand-gold); stroke-width: 5; stroke-linecap: round; }
.cleanup-pool .cp-nostril, .cleanup-pool .cp-eye { fill: var(--brand-ink); }
.cleanup-pool .cp-slot { fill: var(--brand-ink); }
.cleanup-pool .cp-dollar { font: 800 40px/1 var(--font-display); fill: var(--brand-ink); opacity: .5; }
.cleanup-pool .cp-shadow { fill: var(--text-muted); opacity: .25; }
.cleanup-pool .cp-coin { fill: var(--brand-gold); stroke: var(--brand-ink); stroke-width: 3; opacity: 0; transform-box: fill-box; transform-origin: center; }
.cleanup-pool .cp-pig { transform-box: fill-box; transform-origin: 50% 100%; }
@media (prefers-reduced-motion: no-preference) {
  .cleanup-pool .cp-coin { animation: cp-drop 3.6s ease-in infinite; }
  .cleanup-pool .cp-coin--2 { animation-delay: 1.2s; } .cleanup-pool .cp-coin--3 { animation-delay: 2.4s; }
  .cleanup-pool .cp-pig { animation: cp-jiggle 3.6s ease-out infinite; }
}
@keyframes cp-drop { 0% { opacity: 0; transform: translateY(-4px) scaleX(1); } 8% { opacity: 1; } 24% { transform: translateY(40px) scaleX(.15); opacity: 1; } 30%, 100% { transform: translateY(44px) scaleX(.1); opacity: 0; } }
@keyframes cp-jiggle { 0%, 26% { transform: none; } 30% { transform: scale(1.03, .96); } 36% { transform: scale(.99, 1.02); } 42%, 100% { transform: none; } }
.cleanup-pool h2 { margin: 0 0 .25rem; }
.cleanup-pool__big { margin: 0 0 .5rem; font-size: 1.05rem; }
.cleanup-pool__big b { font-size: 2.4rem; line-height: 1.1; color: var(--heading); margin-right: .35rem; font-variant-numeric: tabular-nums; }
.cleanup-pool__how { margin: 0 0 .6rem; }
.cleanup-pool__me { margin: .35rem 0; padding: .5rem .75rem; border-radius: var(--radius-sm); background: var(--surface-2); }
.cleanup-pool__me.is-in { border-left: 4px solid var(--success); }
.cleanup-pool__calc { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; margin: .6rem 0; }
.cleanup-pool__chips { display: inline-flex; flex-wrap: wrap; gap: .4rem; }
.cleanup-pool__chips .chip[aria-pressed="true"] { background: var(--brand-gold); color: var(--brand-ink); border-color: var(--brand-gold); }
.cleanup-pool__calc-out { font-weight: 700; color: var(--heading); }
@media (max-width: 560px) { .cleanup-pool { grid-template-columns: 1fr; justify-items: center; text-align: center; } .cleanup-pool__me { text-align: left; } .cleanup-pool__calc { justify-content: center; } }
.cleanup-pool .cp-coins, .cleanup-pool .cp-coin--1 { animation-delay: 0s; }
/* Collapsed on the volunteer page: one row that opens on a click. */
.cleanup-pool.is-collapsible { display: block; padding: 0; }
.cleanup-pool__row { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem 1rem; padding: .75rem 1.25rem; cursor: pointer; list-style: none; }
.cleanup-pool__row::-webkit-details-marker { display: none; }
.cleanup-pool__row::after { content: ""; width: .6rem; height: .6rem; margin-left: auto; border: solid var(--text-muted); border-width: 0 2px 2px 0; transform: rotate(45deg); transition: transform .15s; }
.cleanup-pool.is-collapsible[open] > .cleanup-pool__row::after { transform: rotate(-135deg); }
.cleanup-pool__row:focus-visible { outline: 2px solid var(--brand-gold); outline-offset: -2px; border-radius: var(--radius); }
.cleanup-pool__dot { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--brand-gold); color: var(--brand-ink); font: 800 1.1rem/1 var(--font-display); }
.cleanup-pool__row-title { color: var(--heading); font-size: 1.1rem; }
.cleanup-pool__row-sum b { color: var(--heading); }
.cleanup-pool.is-collapsible[open] .cleanup-pool__row-more { display: none; }
.cleanup-pool__open { display: grid; grid-template-columns: auto 1fr; gap: 1.25rem; align-items: center; padding: .25rem 1.25rem 1.25rem; }
@media (max-width: 560px) { .cleanup-pool__open { grid-template-columns: 1fr; justify-items: center; text-align: center; } }

.cleanup-pool__goal { margin: .6rem 0; }
.cleanup-pool__goal-row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .25rem .75rem; }
.cleanup-pool__ticker { list-style: none; margin: .4rem 0 .6rem; padding: 0; display: grid; gap: .15rem; font-size: .95rem; }
.cleanup-pool__ticker .muted { margin-left: .35rem; }
@media (prefers-reduced-motion: no-preference) { .cleanup-pool__ticker li { animation: cp-in .6s ease-out both; animation-delay: calc(var(--i, 0) * .25s); } }
@keyframes cp-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.cleanup-teaser { display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: center; margin: 0 0 1.25rem; border-color: var(--brand-gold); }
.cleanup-teaser p { margin: 0; }
.cleanup-teaser__pig { display: block; }
.cleanup-teaser .cp-body, .cleanup-teaser .cp-snout { fill: var(--brand-gold); stroke: var(--brand-ink); stroke-width: 3; }
.cleanup-teaser .cp-eye { fill: var(--brand-ink); } .cleanup-teaser .cp-slot { fill: var(--brand-ink); }
.club-note { border: 2px solid var(--cta); margin-bottom: 1.25rem; }
.club-note__lead { margin: 0 0 .25rem; font-size: 1.25rem; color: var(--heading); }
.club-note p { margin-top: 0; }
.club-line { margin: .5rem 0; color: var(--heading); }

.vjump--top { margin-bottom: 1rem; }
.vparty li.is-kid .vparty__who span { color: var(--text-muted); }
.vslot__who b { font-weight: 700; color: var(--text-muted); }
.vslot:has(input:checked) .vslot__who b { color: var(--cta-text); }

/* The footer's last row stays one row on a phone (Steve, 2026-10-28): the copyright never wraps, and the version shows just its commit */
.footer-base__copy { white-space: nowrap; }
@media (max-width: 40rem) {
  .footer-base__row2 { flex-wrap: nowrap; } .footer-base__tools { flex-wrap: nowrap; gap: .5rem; }
}
.print-link { margin: 2rem 0 0; }

/* Accessibility (audit 2026-10-28): the focus ring is gold on the dark surfaces (the purple one was 2.6:1 there) */
.night, .site-header, .site-footer, .header-search, .nav, .page-hero, .drawer-backdrop { --focus: #ffcb47; }
/* Volunteer shift tiles: grouped by job and day for screen readers; a picked tile shows a check and a dark edge, not only gold (1.4.1) */
fieldset.vslots { border: 0; margin: 0; padding: 0; min-width: 0; }
fieldset.vparty-set { border: 0; margin: 0; padding: 0; min-width: 0; }
.vslot:has(input:checked) { box-shadow: inset 0 0 0 2px var(--cta-text); }
.vslot:has(input:checked) .vslot__t::before { content: "✓ "; }
.vslot.is-full { opacity: 1; } .vslot.is-full .vslot__t, .vslot.is-full .vslot__n { color: var(--text-muted); }
/* What is open, at a glance: green = every spot free, gold = some left, grey = full (the shift's times still read). */
.vslot.is-open { border-color: var(--success); background: color-mix(in srgb, var(--success) 14%, transparent); }
.vslot.is-open .vslot__n { color: var(--success); font-weight: 700; }
.vslot.is-some { border-color: var(--warning); background: color-mix(in srgb, var(--warning) 14%, transparent); }
.vslot.is-some .vslot__n { color: var(--warning); font-weight: 700; }
.vslot.is-full { border-style: dashed; background: transparent; } .vslot.is-full .vslot__t { text-decoration: line-through; text-decoration-thickness: 1px; opacity: .7; }
.vslot.is-full .vslot__n { font-weight: 700; }
.vslot.is-mine { border-color: var(--success); border-style: solid; background: color-mix(in srgb, var(--success) 22%, transparent); }
.vslot:has(input:checked) { border-style: solid; }
.vlegend { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; margin: 0 0 1rem; font-size: var(--step--1); color: var(--text-muted); }
.vlegend span { display: inline-flex; align-items: center; gap: .4rem; }
.vlegend__dot { width: .9rem; height: .9rem; border-radius: 4px; border: 1.5px solid var(--border); }
.vlegend__dot.is-open, .vlegend__dot.is-mine { border-color: var(--success); background: color-mix(in srgb, var(--success) 35%, transparent); }
.vlegend__dot.is-some { border-color: var(--warning); background: color-mix(in srgb, var(--warning) 35%, transparent); }
.vlegend__dot.is-full { border-style: dashed; }
/* Job cards fold to their heading row; "Someone else" is one row. */
details.vjob > summary { list-style: none; cursor: pointer; position: relative; padding-right: 2rem; }
details.vjob > summary::-webkit-details-marker { display: none; }
details.vjob > summary::after { content: ""; position: absolute; right: .35rem; top: 50%; width: .65rem; height: .65rem; margin-top: -.45rem; border: solid var(--text-muted); border-width: 0 2px 2px 0; transform: rotate(45deg); transition: transform .15s; }
details.vjob[open] > summary::after { transform: rotate(-135deg); margin-top: -.2rem; }
details.vjob > summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 4px; border-radius: var(--radius-sm); }
details.vjob[open] > summary { margin-bottom: 1rem; }
.vjob__yours { display: inline-block; margin-left: .75rem; color: var(--success); font-weight: 700; font-size: var(--step--1); }
.vparty__other .vparty__pick > b .muted { font-weight: 400; }
.vreminders h2 { margin: 0 0 .25rem; }
.vreminders .hint { margin: 0 0 .75rem; }
.vreminders__row { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.5rem; }
/* Help tips: a 24px target without a bigger circle (2.5.8), and the "More" link reachable by keyboard and screen reader (shown on focus) */
.tip .tip__btn { position: relative; } .tip .tip__btn::after { content: ""; position: absolute; inset: -3px; }
.tip__more { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tip__more:focus { position: static; width: auto; height: auto; clip: auto; margin-left: .35rem; font-size: var(--step--1); }
/* A sponsor's page (sponsors/profile.html) */
.sponsor-grid { display: grid; grid-template-columns: minmax(0, 1fr) 20rem; gap: 2.5rem; align-items: start; }
@media (max-width: 52rem) { .sponsor-grid { grid-template-columns: 1fr; } }
.sponsor-id { display: flex; align-items: center; gap: 1.25rem; margin: 0 0 1.25rem; }
.sponsor-id h2 { margin: 0; }
.sponsor-logo { width: 9rem; height: 6rem; object-fit: contain; background: #fff; border-radius: var(--radius-sm); padding: .5rem; border: 1px solid var(--border); flex: none; }
.sponsor-lede { font-size: var(--step-1); line-height: 1.6; max-width: 40rem; }
.sponsor-offers { padding-left: 1.2rem; } .sponsor-offers li { margin: .25rem 0; }
.sponsor-members { background: var(--surface-2); border-left: 4px solid var(--brand-gold); padding: .75rem 1rem; border-radius: var(--radius-sm); }
.sponsor-years { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1.25rem; }
.sponsor-years span { font-size: var(--step--1); font-weight: 700; padding: .2rem .6rem; border-radius: 999px; background: var(--surface-2); }
.sponsor-sources { margin-top: 1.25rem; font-size: var(--step--1); }
.sponsor-ad { margin: 0; } .sponsor-ad img { width: 100%; height: auto; border-radius: var(--radius-sm); box-shadow: 0 8px 30px rgb(0 0 0 / .25); }
.sponsor-ad figcaption { font-size: var(--step--1); color: var(--text-muted); margin-top: .4rem; }
.sponsor-share { display: flex; gap: .75rem; align-items: center; margin-top: 1.25rem; font-size: var(--step--1); color: var(--text-muted); }
.sponsor-share .q svg { width: 5rem; height: 5rem; display: block; background: #fff; padding: .25rem; border-radius: .25rem; }
.sponsor-page .is-mark { display: grid; place-items: center; }
.sponsor-main { min-width: 0; } .sponsor-side { min-width: 0; }
/* Program downloads (shared/program_links.html) */
.program-dl { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .75rem 1.5rem; align-items: center; margin: 1.25rem 0; border-color: var(--brand-gold); }
.program-dl p { margin: .25rem 0 0; } .program-dl h2 { margin: 0; }
@media (max-width: 40rem) { .program-dl { grid-template-columns: 1fr; } }
.program-dl--inline { display: inline-flex; flex-wrap: wrap; gap: .5rem; }
.program-row { margin: .5rem 0 1rem; }

/* The mailing lists' archive (shared/list_archive.html) */
.list-archive__search { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-bottom: .5rem; }
.list-archive__search input[type=search] { flex: 1 1 14rem; min-width: 0; }
.list-threads { list-style: none; padding: 0; margin: 0; }
.list-thread { padding: .7rem 0; border-bottom: 1px solid var(--border); display: grid; gap: .15rem; }
.list-thread .muted, .list-thread .subtle { font-size: var(--step--1); }
.list-thread.is-hidden, .list-post.is-hidden { opacity: .6; }
.list-thread__title { margin: .5rem 0 1rem; }
.list-post { border: 1px solid var(--border); border-radius: 10px; padding: .9rem 1rem; margin: 0 0 1rem; overflow-wrap: anywhere; }
.list-post__head { margin-bottom: .5rem; }
.list-post__body p { margin: 0 0 .75rem; }
.list-post__quote { margin: 0 0 .75rem; padding: .25rem 0 .25rem .8rem; border-left: 3px solid var(--border); color: var(--text-muted); font-size: var(--step--1); }
.list-post__files { margin: .5rem 0 0; padding-left: 1.2rem; }
.list-join fieldset, #main .card form > fieldset { margin-bottom: 1rem; }  /* the lists page: choices, then the button (spacing test) */

/* Seats-taken bar on class cards (width steps of 5% through data-pct: no inline style under the CSP) */
.seat-meter { display: block; height: 6px; margin-top: .3rem; border-radius: 999px; background: var(--chip-bg); overflow: hidden; }
.seat-meter__fill { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.is-low .seat-meter__fill, .seat-meter.is-low .seat-meter__fill { background: var(--warning); } .is-full .seat-meter__fill, .seat-meter.is-full .seat-meter__fill { background: var(--danger); }
.seat-meter__fill[data-pct="0"] { width: 0%; }
.seat-meter__fill[data-pct="5"] { width: 5%; }
.seat-meter__fill[data-pct="10"] { width: 10%; }
.seat-meter__fill[data-pct="15"] { width: 15%; }
.seat-meter__fill[data-pct="20"] { width: 20%; }
.seat-meter__fill[data-pct="25"] { width: 25%; }
.seat-meter__fill[data-pct="30"] { width: 30%; }
.seat-meter__fill[data-pct="35"] { width: 35%; }
.seat-meter__fill[data-pct="40"] { width: 40%; }
.seat-meter__fill[data-pct="45"] { width: 45%; }
.seat-meter__fill[data-pct="50"] { width: 50%; }
.seat-meter__fill[data-pct="55"] { width: 55%; }
.seat-meter__fill[data-pct="60"] { width: 60%; }
.seat-meter__fill[data-pct="65"] { width: 65%; }
.seat-meter__fill[data-pct="70"] { width: 70%; }
.seat-meter__fill[data-pct="75"] { width: 75%; }
.seat-meter__fill[data-pct="80"] { width: 80%; }
.seat-meter__fill[data-pct="85"] { width: 85%; }
.seat-meter__fill[data-pct="90"] { width: 90%; }
.seat-meter__fill[data-pct="95"] { width: 95%; }
.seat-meter__fill[data-pct="100"] { width: 100%; }

/* My Schedule (events/my_schedule.html) */
.myday { margin-bottom: 1.5rem; } .myday__title { margin: 0 0 .5rem; font-size: var(--step-1); }
.myday__rows { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.myday__row { display: grid; grid-template-columns: 6.5rem 1fr auto; gap: .75rem; align-items: center; padding: .65rem .9rem; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.myday__time { font-weight: 700; color: var(--accent); } .myday__time small, .myday__what small { display: block; font-weight: 400; color: var(--text-muted); font-size: var(--step--1); }
.myday__what a { font-weight: 600; color: inherit; text-decoration: none; } .myday__what a:hover { color: var(--accent); }
.myday__addr { overflow-wrap: anywhere; user-select: all; }
.myday-list { min-width: 0; }

/* Quick look pop-up on schedule cards (events/_preview.html, static/js/session-preview.js) */
.session-wrap .peek { position: absolute; top: 2.9rem; right: .55rem; width: 2rem; height: 2rem; display: grid; place-items: center; padding: 0; min-height: 0; border-radius: 50%; border: 1px solid var(--border); background: var(--surface); color: var(--text-muted); cursor: pointer; }
.session-wrap .peek svg { width: 1rem; height: 1rem; } .session-wrap .peek:hover { color: var(--accent); border-color: var(--accent); }
@media (max-width: 48rem) { .session-wrap .peek { width: 2.75rem; height: 2.75rem; top: 3.4rem; right: .4rem; } }
.preview-dialog { width: min(36rem, calc(100vw - 2rem)); max-height: 85vh; overflow: auto; padding: 1.5rem; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); color: var(--text); }
.preview-dialog::backdrop { background: rgb(0 0 0 / .6); }
.preview-dialog__close { position: absolute; top: .5rem; right: .75rem; border: 0; background: none; color: inherit; font-size: 1.75rem; line-height: 1; cursor: pointer; min-height: 0; }
.preview__title { margin: .35rem 0 .25rem; font-size: var(--step-2); } .preview__who { margin: 0 0 .75rem; color: var(--text-muted); }
.preview__facts { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .35rem; font-size: var(--step--1); }
.preview__facts svg { width: 1em; height: 1em; margin-right: .4rem; vertical-align: -.12em; }
.preview__text { max-height: 14rem; overflow: auto; margin-bottom: 1rem; }
.preview__actions { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; }
.preview__facts .is-low { color: var(--warning); font-weight: 600; } .preview__facts .is-full { color: var(--danger); font-weight: 600; }
.preview__kind { margin: 0; }

/* Schedule polish (2026-10-31): cards line up and read in one pass */
.session-wrap { height: 100%; } .session-wrap .session-card { height: 100%; box-sizing: border-box; transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease; }
.session-wrap .session-card:hover { transform: translateY(-2px); }
.session-card .meta { gap: .15rem 0; } .session-card .meta > span { display: inline-flex; align-items: center; }
.session-card .meta > span + span::before { content: "·"; margin: 0 .5rem; opacity: .55; }
.session-card .meta > span:nth-child(n+2):not(.flag) { overflow: hidden; text-overflow: ellipsis; }
.session-card h3 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.session-wrap .peek, .session-wrap .star { opacity: .8; transition: opacity .15s, color .15s, border-color .15s; } .session-wrap:hover .peek, .session-wrap:hover .star, .session-wrap .star[aria-pressed="true"], .peek:focus-visible { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .session-wrap .session-card { transition: none; } .session-wrap .session-card:hover { transform: none; } }

/* Cleanup teaser: the whole pig, shares and shifts in one card (2026-10-31) */
.cleanup-teaser .cp-leg { fill: var(--brand-gold); stroke: var(--brand-ink); stroke-width: 3; } .cleanup-teaser .cp-ear { fill: var(--brand-gold); stroke: var(--brand-ink); stroke-width: 3; stroke-linejoin: round; }
.cleanup-teaser .cp-tail { fill: none; stroke: var(--brand-gold); stroke-width: 5; stroke-linecap: round; } .cleanup-teaser .cp-nostril { fill: var(--brand-ink); }
.cleanup-teaser { margin: 1.25rem 0; } .cleanup-teaser__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; margin-top: .6rem !important; }
/* Member benefits: always an even grid; a short last row stretches to fill it */
@media (min-width: 56rem) {
  .perk-grid { grid-template-columns: repeat(6, 1fr); } .perk-grid > .perk { grid-column: span 2; }
  .perk-grid > .perk:nth-child(3n+1):last-child { grid-column: span 6; }
  .perk-grid > .perk:nth-child(3n+2):last-child, .perk-grid > .perk:nth-child(3n+1):nth-last-child(2) { grid-column: span 3; }
}
@media (min-width: 30rem) and (max-width: 55.99rem) { .perk-grid { grid-template-columns: repeat(2, 1fr); } .perk-grid > .perk:last-child:nth-child(odd) { grid-column: span 2; } }
@media (max-width: 29.99rem) { .perk-grid { grid-template-columns: 1fr; } }

/* Receipt pop-up: the PDF itself */
.receipt-pop__meta { margin: 0 0 .75rem; } .receipt-pop__pdf { display: block; width: 100%; height: min(70vh, 46rem); border: 1px solid var(--border); border-radius: var(--radius-sm); background: #fff; margin-bottom: .75rem; }
.history-scroll { max-height: 26rem; overflow: auto; }
.align-dates { margin: 1rem 0; }
.add-family, .auto-renew, .align-dates, .account .add-family, .account .auto-renew, .account .align-dates { margin-block: 1rem; }

/* Support page (2026-10-31): the form comes first, your account sits beside it */
.support-layout { display: grid; gap: 2rem; align-items: start; max-width: 70rem; }
@media (min-width: 60rem) { .support-layout { grid-template-columns: minmax(0, 1fr) 22rem; } .support-side { position: sticky; top: 6rem; } }
.support-form { display: grid; gap: 1.1rem; padding: clamp(1rem, 3vw, 2rem); border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); }
.support-form .field { margin: 0; }
.support-more { border-top: 1px solid var(--border); padding-top: .75rem; } .support-more > summary { cursor: pointer; font-weight: 600; color: var(--text-muted); margin-bottom: .75rem; }
.support-more[open] > summary { color: var(--heading); }
.support-side .glance { font-size: var(--step--1); }
.preview-dialog--wide { width: min(52rem, calc(100vw - 2rem)); }
@media (max-width: 48rem) { .pdf-pop__frame { display: none; } }  /* phones: a PDF preview in a frame shows one page; the buttons do the job */
.cleanup-teaser__body { min-width: 0; } .receipt-pop { display: block; } .support-main { min-width: 0; }
.pres-profile-card, .pres-sessions { margin-bottom: 1.5rem; } .pres-badge--draft { background: var(--surface-2); border-color: var(--border); color: var(--text-muted); }

/* My WPA menu (header): the chip opens a panel of the places people use most */
.my-wpa-menu { position: relative; } .my-wpa-menu > summary { list-style: none; cursor: pointer; } .my-wpa-menu > summary::-webkit-details-marker { display: none; }
.my-wpa__caret { width: .45rem; height: .45rem; margin-left: .15rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); opacity: .7; }
.my-wpa-menu[open] .my-wpa__caret { transform: rotate(225deg); }
.my-wpa-menu__panel { position: absolute; right: 0; top: calc(100% + .5rem); z-index: 60; width: 17rem; padding: .5rem; border: 1px solid var(--night-line, var(--border)); border-radius: var(--radius-lg); background: var(--night-2, var(--surface)); box-shadow: var(--shadow-lg, 0 18px 50px rgb(0 0 0 / .45)); }
.my-wpa-menu__who { display: grid; padding: .6rem .75rem .7rem; border-bottom: 1px solid var(--night-line, var(--border)); margin-bottom: .35rem; color: var(--white, inherit); text-decoration: none; }
.my-wpa-menu__who small { color: var(--night-text, var(--text-muted)); }
.my-wpa-menu__panel ul { list-style: none; margin: 0; padding: 0; }
.my-wpa-menu__panel li a { display: flex; align-items: center; gap: .6rem; padding: .5rem .75rem; border-radius: var(--radius-sm); color: var(--night-text, inherit); text-decoration: none; font-weight: 600; }
.my-wpa-menu__panel li a:hover, .my-wpa-menu__panel li a:focus-visible { background: rgb(255 194 38 / .14); color: var(--white, inherit); }
.my-wpa-menu__panel li svg { width: 1.05rem; height: 1.05rem; color: var(--brand-orange, #ff6720); }
.my-wpa-menu__out { margin: .35rem 0 0; padding-top: .35rem; border-top: 1px solid var(--night-line, var(--border)); } .my-wpa-menu__out button { width: 100%; text-align: left; padding: .5rem .75rem; border: 0; background: none; color: var(--night-text, inherit); font-weight: 600; cursor: pointer; border-radius: var(--radius-sm); }
.my-wpa-menu__out button:hover { background: rgb(255 255 255 / .08); }
button.cta:disabled, .button.cta[aria-disabled="true"] { opacity: .45; cursor: not-allowed; box-shadow: none; filter: grayscale(.5); }
.label-row { display: flex; align-items: center; gap: .3rem; margin-bottom: .35rem; } .label-row > label { margin: 0; }
.person-pick__head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; } .person-pick__head .check { margin: 0; }
.person-pick__remove { flex: none; white-space: nowrap; }
.person-pick__more--aligned { align-items: end; } .person-pick__more--aligned .label-row { min-height: 1.5rem; }

/* Forms page: icon tiles instead of clip-art, an upload button, a staff Manage link (2026-10-29) */
.form-card__art--icon { background: linear-gradient(145deg, #ffc226, #ff6720); color: #101820; }
.form-card__art--icon svg { width: 2.6rem; height: 2.6rem; stroke-width: 1.7; }
.form-card.is-closed .form-card__art--icon { filter: grayscale(.8); opacity: .7; }
.form-card__actions .form-card__upload { flex-basis: auto; font-size: var(--step--1); border-style: dashed; }
.form-card__actions .form-card__upload svg { width: 1em; height: 1em; vertical-align: -.12em; }
.forms-manage { margin: 1rem 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.dob-ask { display: grid; gap: .35rem; max-width: 22rem; margin: .5rem 0 0; } .dob-ask label { font-size: var(--step--1); color: var(--text-muted); }

/* Tickets & Prices (events/tickets.html) and the early-bird note on the Tickets step */
.tix__h { margin: 2rem 0 .75rem; } .tix-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); }
.tix-card h3 { margin: .2rem 0 .4rem; } .tix-card .eyebrow { margin: 0; }
.tix-card__price { font: 800 2rem/1.1 var(--font-display); color: var(--heading); margin: 0 0 .5rem; display: flex; align-items: center; gap: .6rem; }
.tix-card__early { margin: 0 0 .6rem; padding: .5rem .75rem; border-radius: var(--radius-sm); background: rgb(255 194 38 / .12); border-left: 3px solid var(--brand-gold); font-size: var(--step--1); }
.tix-card__facts { list-style: none; margin: .5rem 0 0; padding: 0; display: grid; gap: .35rem; font-size: var(--step--1); color: var(--text-muted); } .tix-card__facts svg { width: 1em; height: 1em; margin-right: .4rem; vertical-align: -.12em; }
.tix-table { width: 100%; border-collapse: collapse; } .tix-table th, .tix-table td { padding: .6rem .9rem; border-bottom: 1px solid var(--border); text-align: left; } .tix-table .num { text-align: right; white-space: nowrap; }
.tix-steps { display: grid; gap: .75rem; padding-left: 1.25rem; } .tix { min-width: 0; } .has-early { border-color: rgb(255 194 38 / .5); }
.ticket-opt__early { display: block; color: var(--brand-gold); font-weight: 600; }
.early-bird { margin: 1rem 0 .25rem; padding: .85rem 1rem; border-radius: var(--radius-md); border: 1px solid var(--brand-gold); background: rgb(255 193 37 / .1); display: grid; gap: .35rem; }
.early-bird__head { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem; color: var(--white); }
.early-bird__head b { font-size: var(--step-2); color: var(--brand-gold); }
.early-bird__head s { opacity: .7; }
.early-bird__tag { padding: .1rem .55rem; border-radius: 999px; background: var(--brand-gold); color: #1a1405; font-weight: 700; font-size: var(--step--1); text-transform: uppercase; letter-spacing: .04em; }
.early-bird .countdown-wrap { margin: 0; }
.early-bird__link { justify-self: start; font-size: var(--step--1); color: var(--brand-gold); text-decoration: underline; }
.receipt.review { max-width: none; margin: 0 0 1.25rem; }
.club-line { margin: 0 0 1.25rem; }
.club-line p { margin: .35rem 0; }
.club-line .buttons { margin-top: .75rem; }
.vol-dialog { width: min(1000px, 94vw); height: min(88vh, 900px); padding: 0; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); color: var(--text); }
.vol-dialog[open] { display: flex; flex-direction: column; }
.vol-dialog::backdrop { background: rgb(0 0 0 / .65); }
.vol-dialog__bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .6rem 1rem; border-bottom: 1px solid var(--border); }
.vol-dialog__bar h2 { margin: 0; font-size: var(--step-1); }
.vol-dialog__frame { flex: 1; width: 100%; border: 0; background: var(--bg, transparent); }
.club-line__more p { margin: 0 0 .5rem; }
.embed-done { display: none; margin: 0 0 1rem; }
.is-embed .site-header, .is-embed .site-footer, .is-embed .page-hero, .is-embed .night, .is-embed .vjump--top, .is-embed .reg-bar, .is-embed [data-to-top] { display: none !important; }
.is-embed .embed-done { display: block; position: sticky; top: 0; z-index: 5; padding: .5rem 0; background: var(--bg, var(--surface)); }
.cover-fees { margin: .75rem 0; padding: .75rem 0 0; border-top: 1px solid var(--border); }
.cover-fees .hint { margin: .25rem 0 0 1.9rem; }
.review-gift .buttons { display: none; }  /* the gift saves as it's chosen (register.js); without script it saves with Add to Cart */
.review-quick { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; padding-top: .75rem; border-top: 1px solid var(--border); }
.review-quick .hint { margin: 0; flex: 1 1 14rem; }
.review-badges { margin: 0 0 1.25rem; }
.review-badges > summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 2.75rem; cursor: pointer; list-style: none; }
.review-badges > summary::-webkit-details-marker { display: none; }
.review-badges > summary h2 { margin: 0; }
.review-badges[open] > summary { margin-bottom: .75rem; }
.review-finish { margin: 0 0 1.25rem; display: grid; gap: .6rem; }
.review-finish__total { display: flex; justify-content: space-between; align-items: baseline; font-size: var(--step-1); }
.review-finish .hint, .review-finish .alert { margin: 0; }
.review-finish .buttons { margin: .25rem 0 0; }
.early-bird__clock { margin: 0; font-size: var(--step--1); color: var(--text-muted); }
.early-bird__clock b { color: var(--white); font-variant-numeric: tabular-nums; }
.early-bird__clock a { color: var(--brand-gold); }
.choice-more { display: none; margin-top: .75rem; }
fieldset:has(input[data-tier="student"]:checked) .choice-more--student,
fieldset:has(input[data-tier="decline"]:checked) .choice-more--decline { display: block; }
.addon-card { display: grid; grid-template-columns: 3.25rem minmax(0, 1fr) auto; gap: .5rem 1rem; align-items: start; padding: .9rem 0; border-top: 1px solid var(--border); }
.addon-card__pic { display: grid; place-items: center; width: 3.25rem; height: 3.25rem; border-radius: var(--radius-md); background: rgb(255 193 37 / .12); color: var(--brand-gold); }
.addon-card__pic svg { width: 1.6rem; height: 1.6rem; }
.addon-card__title { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .6rem; }
.addon-card__body .muted { margin: .25rem 0 0; }
.addon-card__more { margin-top: .5rem; }
.addon-card__more > summary { cursor: pointer; color: var(--brand-gold); font-weight: 600; }
.addon-card__text { margin-top: .5rem; padding: .75rem 1rem; border-radius: var(--radius-md); background: var(--surface); }
.addon-card__text p { margin: .25rem 0; } .addon-card__text ul { margin: .25rem 0 .5rem 1.1rem; padding: 0; }
.addon-card__pick input[type=number] { width: 5rem; }
@media (max-width: 40rem) { .addon-card { grid-template-columns: 2.75rem minmax(0, 1fr); } .addon-card__pick { grid-column: 2; } }
.review-promo { margin: 0 0 1.25rem; display: grid; gap: .25rem; }
.review-promo .promo-row { margin-top: .25rem; }
.club-line > summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 2.75rem; cursor: pointer; list-style: none; }
.club-line > summary::-webkit-details-marker { display: none; }
.club-line > summary h2 { margin: 0; }
.club-line[open] > summary { margin-bottom: .5rem; }
.review-gift > summary::-webkit-details-marker { display: none; }
.review-gift > summary { list-style: none; }
.club-sub { font-weight: 500; font-size: var(--step-0); margin-left: .35rem; }
.review-promo > summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 2.75rem; cursor: pointer; list-style: none; }
.review-promo > summary::-webkit-details-marker { display: none; }
.review-promo[open] > summary { margin-bottom: .5rem; }
.review-promo > summary h2, .club-line > summary h2, .review-gift > summary h2, .review-badges > summary h2 { margin: 0; }
/* The promo code card on the review page: a quiet header with a chevron, and the code box and Apply joined into one control. */
.review-promo > summary:focus { outline: none; }
.review-promo > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: var(--radius-md); }
.review-promo > summary .muted { display: inline-flex; align-items: center; gap: .4rem; font-size: var(--step--1); }
.review-promo > summary .muted::after { content: ""; width: .5rem; height: .5rem; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg) translateY(-2px); transition: transform .15s; }
.review-promo[open] > summary .muted::after { transform: rotate(-135deg) translateY(-2px); }
.review-promo .promo-row { display: flex; flex-wrap: nowrap; align-items: stretch; gap: 0; max-width: 28rem; margin-top: .5rem; }
.review-promo .promo-row input { flex: 1 1 auto; min-width: 0; max-width: none; margin: 0; text-transform: uppercase; letter-spacing: .06em; font-weight: 600;
  border-radius: 999px 0 0 999px; padding-left: 1.1rem; }
.review-promo .promo-row input::placeholder { text-transform: none; letter-spacing: 0; font-weight: 400; }
.review-promo .promo-row .button { margin: 0; border-radius: 0 999px 999px 0; padding-inline: 1.4rem; }
.review-promo .promo-row .status-pill { margin-right: .75rem; }
/* The confirmation page (templates/registration/done.html) */
.done-hero__buttons { margin-top: 1rem; }
.done-grid { display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1fr) 20rem; align-items: start; }
.done-main, .done-side { display: grid; gap: 1.25rem; min-width: 0; align-content: start; }
.done-main .card, .done-side .card { margin: 0; }
.done-list { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: 1rem; }
.done-item { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: 1rem; padding: 1rem; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface-2, var(--surface)); }
.done-item h3 { margin: 0 0 .25rem; font-size: var(--step-1); display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.done-item p { margin: 0 0 .6rem; }
.done-item__mark { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--brand-gold); color: #1a1405; font-weight: 800; }
.done-item__mark svg { width: 1.2rem; height: 1.2rem; }
.done-item.is-done { opacity: .85; border-color: transparent; }
.done-item.is-done .done-item__mark { background: #5ad28f; }
.done-item.is-info .done-item__mark { background: transparent; border: 1px solid var(--border); color: var(--brand-gold); }
.done-people { list-style: none; margin: .5rem 0; padding: 0; display: grid; gap: .5rem; }
.done-people li { display: flex; justify-content: space-between; align-items: center; gap: .75rem; }
.done-facts { margin: 1rem 0 .75rem; display: grid; gap: .5rem; }
.done-facts div { display: flex; justify-content: space-between; gap: 1rem; border-top: 1px solid var(--border); padding-top: .5rem; }
.done-facts dt { color: var(--text-muted); } .done-facts dd { margin: 0; text-align: right; font-weight: 600; }
.done-badges > summary { display: flex; align-items: center; justify-content: space-between; cursor: pointer; list-style: none; min-height: 2.5rem; }
.done-badges > summary::-webkit-details-marker { display: none; }
.done-badges[open] > summary { margin-bottom: .75rem; }
@media (max-width: 62rem) { .done-grid { grid-template-columns: 1fr; } .done-side { order: -1; } }

/* The four lanes: Sponsor, Advertise, Fire a Display, Vend (shared/lanes.html) */
.lanes { margin: 0 0 1.5rem; }
.lanes__title { font-size: var(--step-1); margin: 0 0 .75rem; }
.lanes__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 36rem) { .lanes__list { grid-template-columns: 1fr; } }
.lane { display: grid; grid-template-rows: auto 1fr auto; gap: .5rem; padding: 1.1rem; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface); }
.lane.is-current { border-color: var(--accent); }
.lane__name { font-size: var(--step-1); }
.lane__what { color: var(--text-muted); font-size: var(--step--1); }
.lane__go { font-weight: 600; }
.lane__here { color: var(--accent); font-weight: 600; font-size: var(--step--1); }

/* Wider application forms, and the ad form (templates/event_apps/ad_form.html, static/js/ad-form.js) */
.container.wide-form { --container: 64rem; }
.container.wide-form.is-ad { --container: 76rem; }
.lanes-slim { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1.1rem; margin: 0 0 1.25rem; font-size: var(--step--1); }
.lanes-slim__lead { color: var(--text-muted); }
.lanes-slim a { font-weight: 600; }

.adf { position: relative; }  /* the ad, display and vendor sign-up forms' wrapper */
.adf-layout { display: grid; gap: 1.75rem; align-items: start; }
@media (min-width: 64rem) { .adf-layout { grid-template-columns: minmax(0, 1fr) 19rem; } .adf-aside { position: sticky; top: 6rem; } }
.adf-main { display: grid; gap: 1.5rem; min-width: 0; }
.adf-card { padding: clamp(1.1rem, 2.4vw, 1.75rem); border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface); display: grid; gap: 1rem; min-width: 0; }
.adf-card h2 { display: flex; align-items: center; gap: .75rem; margin: 0; font-size: var(--step-1); }
.adf-card .hint { margin: 0; }
.adf-n { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--ember); color: var(--cta-text); font-weight: 800; font-size: var(--step--1); flex: none; }

/* Sizes: a picture of the page with the ad on it */
.adf-sizes { display: grid; gap: .85rem; grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr)); }
.adf-size { position: relative; display: grid; grid-template-rows: 7.5rem auto auto auto; justify-items: center; gap: .2rem; padding: .85rem .7rem; text-align: center; cursor: pointer;
  border: 1.5px solid var(--border); border-radius: var(--radius-md); background: transparent; }
.vf-notice { margin: 0 0 1.1rem; padding: .75rem 1rem; border-left: 4px solid var(--accent); border-radius: var(--radius-md); background: color-mix(in srgb, var(--accent) 10%, transparent); font-size: var(--step--1); }
.vf-grid { display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0 0 1rem; }
@media (max-width: 40rem) { .vf-grid { grid-template-columns: 1fr; } }
.vf-card { display: grid; gap: .5rem; align-content: start; padding: 1rem 1.1rem; border: 1.5px solid var(--border); border-radius: var(--radius-md); }
.vf-card__head { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; }
.vf-card__name { font-weight: 700; font-size: var(--step-1, 1.15rem); }
.vf-card__price { font-weight: 800; font-size: var(--step-2, 1.4rem); color: var(--accent); }
.vf-card__price small { font-weight: 500; font-size: var(--step--1); color: var(--text-muted); }
.vf-card__note { margin: 0; color: var(--text-muted); font-size: var(--step--1); min-height: 2.9em; }
@media (max-width: 40rem) { .vf-card__note { min-height: 0; } }
.vf-card__line { margin: 0; min-height: 1.3em; font-weight: 600; }
.vf-sells { border: 0; padding: 0; margin: 1rem 0 0; display: grid; gap: .4rem; }
.vf-sells legend { font-weight: 700; padding: 0; margin-bottom: .3rem; }
.adf-size-wrap { display: grid; gap: .4rem; align-content: start; }
.adf-ink { display: grid; gap: .3rem; padding: .55rem .7rem; border: 1.5px solid var(--border); border-radius: var(--radius-md); font-size: var(--step--1); }
.adf-ink[hidden] { display: none; }
.adf-ink__opt { display: flex; align-items: center; gap: .45rem; cursor: pointer; }
.adf-ink__opt b { margin-left: auto; }
.adf-size:hover { border-color: var(--accent); }
.adf-size input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.adf-size:has(input:checked) { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); }
.adf-size:has(input:focus-visible) { outline: 3px solid var(--accent); outline-offset: 2px; }
.adf-size.is-disabled { opacity: .5; cursor: not-allowed; }
.adf-size__pic { display: grid; place-items: center; height: 100%; }
.adf-size__name { font-weight: 700; }
.adf-size__meta { color: var(--text-muted); font-size: var(--step--1); min-height: 1.2em; }
.adf-size__price { color: var(--accent); font-weight: 800; font-size: var(--step-0, 1rem); }
.ad-shape { position: relative; display: block; height: 100%; aspect-ratio: 8.5 / 11; border-radius: 3px; border: 1px solid var(--border); overflow: hidden; max-width: 100%;
  background: repeating-linear-gradient(to bottom, transparent 0 .32rem, rgb(255 255 255 / .09) .32rem .4rem); }
.ad-shape--spread { aspect-ratio: 17 / 11; background: linear-gradient(to right, transparent calc(50% - 1px), var(--border) calc(50% - 1px) calc(50% + 1px), transparent calc(50% + 1px)),
  repeating-linear-gradient(to bottom, transparent 0 .32rem, rgb(255 255 255 / .09) .32rem .4rem); }
.ad-shape__ad { position: absolute; background: var(--accent); border-radius: 2px; inset: 0; }
.ad-shape--half .ad-shape__ad { inset: auto 0 0 0; height: 50%; }
.ad-shape--quarter .ad-shape__ad { inset: auto 0 0 auto; width: 50%; height: 50%; }
.ad-shape--card .ad-shape__ad { inset: auto 7% 6% auto; width: 41%; height: 18%; }
.adf-sum .ad-shape { height: 9rem; }

/* Artwork: a drop zone, then a small editor */
.adf-art { display: grid; gap: 1rem; }
.adf-drop { display: grid; gap: .3rem; justify-items: center; text-align: center; padding: 2rem 1rem; border: 2px dashed var(--border); border-radius: var(--radius-md); cursor: pointer; position: relative; }
.adf-drop:hover, .adf-drop.is-over { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.adf-drop:has(input:focus-visible) { outline: 3px solid var(--accent); outline-offset: 2px; }
.adf-drop input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.adf-drop__big { font-size: var(--step-1); font-weight: 700; }
.adf-drop__small, .adf-drop__best { color: var(--text-muted); font-size: var(--step--1); }
.adf-files { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.adf-files li { padding: .3rem .6rem; border: 1px solid var(--border); border-radius: 99px; font-size: var(--step--1); }
.adf-editor { display: grid; gap: 1.25rem; align-items: start; }
@media (min-width: 48rem) { .adf-editor { grid-template-columns: minmax(0, 20rem) minmax(0, 1fr); } }
.adf-editor__stage { padding: .6rem; border: 1px solid var(--border); border-radius: var(--radius-md); background: repeating-conic-gradient(rgb(255 255 255 / .06) 0 25%, transparent 0 50%) 0 0 / 16px 16px; }
.adf-editor__stage canvas { display: block; width: 100%; height: auto; border-radius: 2px; touch-action: none; cursor: grab; max-height: 28rem; margin-inline: auto; }
.adf-editor__tools { display: grid; gap: .9rem; }
.adf-fit { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; }
.adf-range { display: grid; gap: .3rem; font-weight: 600; }

/* Payment */
.adf-pays { display: grid; gap: .85rem; }
@media (min-width: 40rem) { .adf-pays { grid-template-columns: 1fr 1fr; } }
.adf-pay { display: grid; grid-template-columns: auto 1fr; gap: .15rem .75rem; align-items: start; padding: 1rem; border: 1.5px solid var(--border); border-radius: var(--radius-md); cursor: pointer; }
.adf-pay:hover { border-color: var(--accent); }
.adf-pay:has(input:checked) { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); }
.adf-pay input { grid-row: 1 / span 2; margin-top: .3rem; }
.adf-pay__name { font-weight: 700; }
.adf-pay__note { color: var(--text-muted); font-size: var(--step--1); }

/* The summary beside the form */
.adf-sum { display: grid; gap: .6rem; justify-items: start; padding: 1.25rem; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface); }
.adf-sum__pic { display: grid; place-items: center; width: 100%; padding: .5rem 0; }
.adf-sum__name { margin: 0; font: 800 var(--step-1, 1.25rem)/1.2 var(--font-display); }
.adf-sum__price { margin: 0; color: var(--accent); font-weight: 800; font-size: var(--step-1, 1.25rem); }
.adf-sum__facts { display: grid; gap: .5rem; margin: 0; width: 100%; }
.adf-sum__facts dt { color: var(--text-muted); font-size: var(--step--1); }
.adf-sum__facts dd { margin: 0; font-weight: 600; }
.adf-sum__incl { margin: 0; padding-left: 1.1rem; font-size: var(--step--1); color: var(--text-muted); }

/* The ad form's steps: one card open at a time, a closed one shows what was chosen */
.adf-card > summary { list-style: none; display: flex; align-items: center; gap: .75rem; cursor: pointer; min-width: 0; }
.adf-card > summary::-webkit-details-marker { display: none; }
.adf-card > summary::after { content: ""; flex: none; width: .6rem; height: .6rem; margin-left: .25rem; border-right: 2px solid var(--text-muted); border-bottom: 2px solid var(--text-muted); transform: rotate(45deg); transition: transform .15s; }
.adf-card[open] > summary::after { transform: rotate(-135deg); }
.adf-card > summary:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; border-radius: 4px; }
.adf-t { font: 800 var(--step-1, 1.25rem)/1.2 var(--font-display); }
.adf-line { margin-left: auto; min-width: 0; color: var(--text-muted); font-size: var(--step--1); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: right; }
.adf-card[open] .adf-line { display: none; }
.adf-body { display: grid; gap: 1rem; margin-top: 1rem; }
.adf-next { margin: .25rem 0 0; }
.adf-need { margin: 0; color: var(--danger); font-weight: 600; }

/* Ways to take part, on the event page (templates/events/event.html) */
.opp-head { margin: 1.5rem 0 .75rem; font-size: var(--step--1); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.opp-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); }
.opp { display: grid; grid-template-rows: auto 1fr auto auto; gap: .5rem; padding: 1.15rem; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--surface); }
.opp__name { font-size: var(--step-1); }
.opp__what { color: var(--text-muted); font-size: var(--step--1); }
.opp__from { color: var(--accent); font-weight: 700; font-size: var(--step--1); }
.opp__go { font-weight: 600; }

/* The Sponsorship page's definitions (templates/sponsors/hub.html) */
.hub-defs { display: grid; gap: 1rem 2rem; margin: 0 0 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
.hub-defs dt { font: 800 var(--step-1, 1.25rem)/1.2 var(--font-display); margin-bottom: .25rem; }
.hub-defs dd { margin: 0; color: var(--text-muted); }
.adf-card[hidden] { display: none; }
.adf-sizes--plain { grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); }
.adf-size--plain { grid-template-rows: auto auto auto; align-content: center; min-height: 6.5rem; }

/* "Presented by" on a sponsored show or session (sponsors.service.schedule_credits) */
.presented { display: inline-block; margin: .15rem 0 .35rem; padding: .15rem .6rem; border-radius: 99px; font-size: var(--step--1); color: var(--accent); border: 1px solid var(--accent); }
.presented--hero { margin: .5rem 0 0; }

/* The contracts' lettered paragraphs and initialed-services tables (spark/displays/display_text.py); the same look in the console editor and on the signing page */
.policy p.ag1, .policy p.ag2, .policy p.ag3, .policy p.ag4 { text-indent: -1.4rem; }
.policy p.ag1 { margin-left: 2.2rem; } .policy p.ag2 { margin-left: 3.8rem; } .policy p.ag3 { margin-left: 5.4rem; } .policy p.ag4 { margin-left: 7rem; }
.policy p.ag1 > b:first-child, .policy p.ag2 > b:first-child, .policy p.ag3 > b:first-child, .policy p.ag4 > b:first-child { display: inline-block; min-width: 1.4rem; }
.policy table.ag-table { width: 100%; border-collapse: collapse; margin: .6rem 0 1rem; font-size: .92em; }
.policy table.ag-table th, .policy table.ag-table td { border: 1px solid var(--border); padding: .35rem .5rem; vertical-align: top; }
.policy table.ag-table th { text-align: left; } .policy table.ag-table td.ag-x { width: 5.5rem; text-align: center; }

/* The vendor form's optional sponsorship (spark/templates/event_apps/vendor_form.html) */
.vf-addon { margin: 1.25rem 0 0; padding: 0; border: 0; }
.vf-addon legend { font: 700 var(--step-0) var(--font-display); color: var(--heading); padding: 0; margin-bottom: .25rem; }
.vf-addons { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: .6rem; margin-top: .6rem; }
.vf-addon__opt { display: flex; align-items: flex-start; gap: .6rem; padding: .7rem .85rem; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface); cursor: pointer; }
.vf-addon__opt:has(input:checked) { border-color: var(--brand-gold); box-shadow: 0 0 0 1px var(--brand-gold); }
.vf-addon__opt span { display: grid; gap: .15rem; } .vf-addon__opt i { font-style: normal; font-weight: 700; color: var(--accent); }
.vf-addon__opt small { color: var(--text-muted); font-size: var(--step--2); }
.vf-more { margin-top: .5rem; } .vf-more > summary { cursor: pointer; font-weight: 600; padding: .4rem 0; min-height: 44px; display: flex; align-items: center; }

/* An order sheet for regulated materials: orders go through the WPA (spark/explosives/purchasing.py) */
.form-card__regulated { margin: .6rem 0 0; padding: .65rem .85rem; border-left: 4px solid var(--gold, #c8a24a); background: rgba(200, 162, 74, .12); border-radius: 0 6px 6px 0; font-size: .92rem; line-height: 1.45; }
.form-card__regulated strong { display: block; margin-bottom: .15rem; }
.spx-last { border: 1px solid var(--border); border-radius: 10px; padding: .75rem 1rem; margin: 0 0 1rem; display: grid; gap: .5rem; }
.spx-last__opt img { object-fit: contain; border-radius: 6px; background: #fff; vertical-align: middle; }
.event-hero__logo { display: block; max-width: min(320px, 70%); max-height: 110px; width: auto; height: auto; margin: 0 0 .75rem; }

/* My Account: the cards' text sits above their buttons, which line up along the bottom with room above them */
.account-grid-2--even .member-card-summary > .hint, .account-grid-2--even .member-card-summary > .alert { margin: .25rem 0 .75rem; }
.account-grid-2--even .card-foot { padding-top: 1rem; }
/* My Account → Automatic Renewal: the type picker and its buttons on one line, one height */
.auto-renew-list .buttons { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.auto-renew-list .buttons form { display: flex; align-items: center; gap: .75rem; margin: 0; }
.auto-renew-list select { width: auto; min-width: 14rem; }
.auto-renew-list select, .auto-renew-list .button { min-height: 2.75rem; margin: 0; }
.auto-renew-list .button { display: inline-flex; align-items: center; justify-content: center; padding-block: 0; }

/* The mailing lists' archive: a month heat-map to browse by, conversation previews, and replies indented under what they answer */
.arch-summary { margin: 0 0 .75rem; color: var(--text-muted); }
.arch-summary b { color: var(--text); }
.arch-nav { display: grid; gap: .5rem; margin: .25rem 0 1rem; }
.arch-years { display: flex; gap: .35rem; overflow-x: auto; padding-bottom: .25rem; scrollbar-width: thin; }
.arch-year { flex: 0 0 auto; display: inline-flex; align-items: baseline; gap: .4rem; padding: .3rem .7rem; border-radius: 999px; border: 1px solid var(--border); text-decoration: none; color: var(--text); font-weight: 700; font-size: .95rem; }
.arch-year small { font-weight: 600; font-size: .75rem; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.arch-year:hover { border-color: var(--accent, #f5b73b); }
.arch-year.is-on { background: color-mix(in srgb, var(--accent, #f5b73b) 24%, transparent); border-color: var(--accent, #f5b73b); }
.arch-months { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: .25rem; }
.arch-month { position: relative; display: flex; flex-direction: column; align-items: center; gap: 0; padding: .3rem 0 .45rem; border-radius: 8px; border: 1px solid var(--border); text-decoration: none; color: var(--text); font-size: .8rem; font-weight: 700; overflow: hidden; }
.arch-month small { font-size: .7rem; font-weight: 600; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.arch-month::after { content: ""; position: absolute; left: 0; bottom: 0; height: 3px; width: var(--pct, 0%); background: var(--accent, #f5b73b); }
.arch-month:hover { border-color: var(--accent, #f5b73b); }
.arch-month.is-on { background: color-mix(in srgb, var(--accent, #f5b73b) 24%, transparent); border-color: var(--accent, #f5b73b); }
.arch-month.is-empty { opacity: .35; border-style: dashed; }
.arch-month.is-empty::after { display: none; }
@media (max-width: 40rem) { .arch-months { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.arch-heading { margin: 1rem 0 .25rem; font-size: var(--step-1, 1.15rem); }
.list-thread__link { display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
.arch-count { display: inline-grid; place-items: center; min-width: 1.5rem; padding: 0 .45rem; height: 1.4rem; border-radius: 999px; font-size: 12px; font-weight: 700; background: color-mix(in srgb, var(--accent, #f5b73b) 22%, transparent); color: var(--text); }
.list-thread__snippet { color: var(--text-muted); font-size: var(--step--1, .9rem); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.arch-thread-meta { margin: -.5rem 0 1rem; }
.list-post--d1 { margin-left: 1rem; border-left: 3px solid var(--accent, #f5b73b); }
.list-post--d2 { margin-left: 2rem; border-left: 3px solid var(--accent, #f5b73b); }
.list-post--d3 { margin-left: 3rem; border-left: 3px solid var(--accent, #f5b73b); }
.list-post--d4 { margin-left: 4rem; border-left: 3px solid var(--accent, #f5b73b); }
@media (max-width: 40rem) { .list-post--d3 { margin-left: 2rem; } .list-post--d4 { margin-left: 2rem; } }

.toolbox__launch { list-style: none; margin: 6px 0 10px; padding: 0; display: grid; gap: 6px; font-size: 14px; }
.toolbox__group { border-top: 1px solid var(--border); padding: .35rem 0; }
.toolbox__group > summary { cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .35rem 0; font-size: var(--step--1); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.toolbox__group > summary::-webkit-details-marker { display: none; }
.toolbox__group > summary::after { content: "+"; font-weight: 400; opacity: .7; margin-left: auto; padding-left: .5rem; }
.toolbox__group[open] > summary::after { content: "–"; }
.toolbox__groupbody { padding: .25rem 0 .5rem; }
.toolbox__sub { margin: .8rem 0 .35rem; font-size: var(--step--1); text-transform: uppercase; letter-spacing: .05em; opacity: .8; }

.card.narrow.cart-empty { margin-inline: 0; }
.cart-empty-help { max-width: 30rem; margin-top: 1rem; }
.cart-empty-help .need-help { margin: 0; }

.wapm-callout { border: 1px solid var(--border); }
.wapm-levels { list-style: none; margin: .6rem 0 1rem; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; }
.wapm-levels li { display: flex; gap: .5rem; align-items: baseline; } .wapm-levels span { color: var(--text-muted); }