

@font-face {
  font-family: "MR Inter";
  font-style: normal;
  font-display: optional;
  font-weight: 100 900;
  src: url("/fonts/inter-latin-variable.woff2") format("woff2-variations");
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "MR Archivo";
  font-style: normal;
  font-display: optional;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  src: url("/fonts/archivo-latin-variable.woff2") format("woff2-variations");
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "MR Plex Mono";
  font-style: normal;
  font-display: optional;
  font-weight: 400;
  src: url("/fonts/ibm-plex-mono-latin-400.woff2") format("woff2");
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "MR Plex Mono";
  font-style: normal;
  font-display: optional;
  font-weight: 600;
  src: url("/fonts/ibm-plex-mono-latin-600.woff2") format("woff2");
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "MR Inter Fallback";
  font-style: normal;
  font-weight: 1 449;
  src: local("Arial"), local("Helvetica"), local("Liberation Sans"), local("Arimo");
  size-adjust: 107.12%;
  ascent-override: 90.44%;
  descent-override: 22.52%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "MR Inter Fallback";
  font-style: normal;
  font-weight: 450 549;
  src: local("Arial"), local("Helvetica"), local("Liberation Sans"), local("Arimo");
  size-adjust: 108.21%;
  ascent-override: 89.52%;
  descent-override: 22.29%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "MR Inter Fallback";
  font-style: normal;
  font-weight: 550 649;
  src: local("Arial"), local("Helvetica"), local("Liberation Sans"), local("Arimo");
  size-adjust: 109.31%;
  ascent-override: 88.62%;
  descent-override: 22.07%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "MR Inter Fallback";
  font-style: normal;
  font-weight: 650 1000;
  src: local("Arial"), local("Helvetica"), local("Liberation Sans"), local("Arimo");
  size-adjust: 110.41%;
  ascent-override: 87.74%;
  descent-override: 21.85%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "MR Archivo Fallback";
  font-style: normal;
  font-weight: 1 649;
  font-stretch: 100%;
  src: local("Arial"), local("Helvetica"), local("Liberation Sans"), local("Arimo");
  size-adjust: 102.29%;
  ascent-override: 85.84%;
  descent-override: 20.53%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "MR Archivo Fallback";
  font-style: normal;
  font-weight: 650 749;
  font-stretch: 100%;
  src: local("Arial"), local("Helvetica"), local("Liberation Sans"), local("Arimo");
  size-adjust: 105.88%;
  ascent-override: 82.93%;
  descent-override: 19.83%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "MR Archivo Fallback";
  font-style: normal;
  font-weight: 750 1000;
  font-stretch: 100%;
  src: local("Arial"), local("Helvetica"), local("Liberation Sans"), local("Arimo");
  size-adjust: 111.04%;
  ascent-override: 79.07%;
  descent-override: 18.91%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "MR Archivo Fallback";
  font-style: normal;
  font-weight: 1 1000;
  font-stretch: 101% 125%;
  src: local("Arial"), local("Helvetica"), local("Liberation Sans"), local("Arimo");
  size-adjust: 138.63%;
  ascent-override: 63.34%;
  descent-override: 15.15%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "MR Plex Mono Fallback";
  font-style: normal;
  font-weight: 400;
  src:
    local("Menlo-Regular"), local("Menlo"), local("Consolas"), local("DejaVu Sans Mono"),
    local("DejaVuSansMono"), local("Liberation Mono"), local("LiberationMono");
  size-adjust: 99.66%;
  ascent-override: 102.85%;
  descent-override: 27.59%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "MR Plex Mono Fallback";
  font-style: normal;
  font-weight: 600;
  src:
    local("Menlo-Bold"), local("Consolas-Bold"), local("DejaVuSansMono-Bold"),
    local("LiberationMono-Bold"), local("Menlo-Regular"), local("Menlo"), local("Consolas"),
    local("DejaVu Sans Mono"), local("Liberation Mono");
  size-adjust: 99.66%;
  ascent-override: 102.85%;
  descent-override: 27.59%;
  line-gap-override: 0%;
}

:root {

  --ember-900: #5e2305;
  --ember-800: #7d2f06;
  --ember-600: #a8420a;
  --ember-500: #c65310;
  --ember-400: #e4780b;
  --ember-300: #f2a24a;
  --ember-100: #fbdcc4;
  --ember-050: #fdf1e7;

  --steel-950: #0f1720;
  --steel-900: #16212c;
  --steel-850: #1e2a37;
  --steel-800: #22303d;
  --steel-600: #4a5d71;
  --steel-500: #64798f;
  --steel-300: #c3cedaff;
  --steel-200: #dde4eb;
  --steel-100: #edf1f5;
  --paper-base: #f4f6f8;
  --paper-card: #fbfcfd;

  --ground: #ffffff;
  --ground-2: #f4f6f8;
  --ground-3: #e9edf1;
  --panel: #ffffff;
  --ink: #0f1720;
  --ink-2: #3d4a57;
  --ink-3: #5f6a74;
  --line: #dfe5ea;
  --line-2: #78868f;

  --accent: #a8420a;
  --accent-hi: #e4780b;
  --accent-ink: #ffffff;
  --accent-wash: #fdf1e7;

  --ok: #166534;

  --warn: #a8420a;

  --late: #9f1239;

  --r-xs: 8px;
  --r-sm: 12px;
  --r: 18px;
  --r-lg: 28px;
  --r-xl: 40px;
  --r-pill: 999px;

  --sh-1: 0 2px 8px rgb(15 23 32 / 6%);
  --sh-2: 0 10px 30px -12px rgb(15 23 32 / 18%);
  --sh-3: 0 32px 70px -30px rgb(15 23 32 / 42%);

  --grad-ember: linear-gradient(135deg, #c65310 0%, #a8420a 55%, #7d2f06 100%);
  --grad-steel: linear-gradient(135deg, #22303d 0%, #0f1720 100%);
  --grad-wash: linear-gradient(180deg, #fdf1e7 0%, rgb(253 241 231 / 0%) 100%);

  --surface-page: var(--ground);
  --surface-raised: var(--ground-2);
  --surface-sunken: var(--ground-3);
  --surface-card: var(--panel);
  --surface-dark: var(--steel-950);
  --surface-accent-wash: var(--accent-wash);

  --text-primary: var(--ink);

  --text-secondary: var(--ink-2);

  --text-nontext: var(--ink-3);

  --text-on-dark: #e8eef4;

  --text-on-dark-secondary: #9fb0c2;

  --text-accent: var(--accent);

  --rule-decorative: var(--line);

  --rule-structural: var(--line-2);

  --action-fill: var(--accent);

  --action-fill-hover: var(--ember-500);

  --action-label: var(--accent-ink);

  --focus-ring: var(--accent);

  --focus-ring-on-dark: var(--ember-400);

  --font-display: "MR Archivo", "MR Archivo Fallback", system-ui, sans-serif;
  --font-display-expanded: "MR Archivo", "MR Archivo Fallback", system-ui, sans-serif;
  --font-body: "MR Inter", "MR Inter Fallback", system-ui, sans-serif;

  --font-data: "MR Plex Mono", "MR Plex Mono Fallback", ui-monospace, "SFMono-Regular", monospace;

  --size-display-1: clamp(2.5rem, 1.6rem + 4.5vw, 4.5rem);
  --size-display-2: clamp(2rem, 1.4rem + 3vw, 3.25rem);
  --size-h2: clamp(1.75rem, 1.4rem + 1.75vw, 2.5rem);
  --size-h3: clamp(1.375rem, 1.2rem + 0.9vw, 1.75rem);
  --size-h4: clamp(1.125rem, 1.05rem + 0.25vw, 1.25rem);
  --size-lede: clamp(1.1875rem, 1.14rem + 0.19vw, 1.3125rem);
  --size-body: clamp(1.0625rem, 1.04rem + 0.1vw, 1.125rem);
  --size-small: 0.9375rem;

  --size-label: 0.875rem;
  --size-data: clamp(0.9375rem, 0.92rem + 0.1vw, 1rem);
  --size-data-lg: clamp(1.5rem, 1.15rem + 1.5vw, 2rem);

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;
  --space-40: 160px;

  --radius-sm: 2px;
  --radius-md: 6px;
  --radius-lg: 12px;
  --radius-pill: 999px;

  --elev-1: 0 1px 2px rgb(15 23 32 / 6%), 0 2px 8px rgb(15 23 32 / 6%);
  --elev-2: 0 8px 24px rgb(15 23 32 / 10%);
  --elev-3: 0 -6px 20px rgb(15 23 32 / 12%);

  --dur-instant: 90ms;
  --dur-fast: 160ms;

  --dur-base: 240ms;

  --dur-slow: 340ms;

  --dur-rail: 520ms;

  --dur-1: var(--dur-fast);
  --dur-2: var(--dur-base);
  --dur-3: var(--dur-slow);
  --dur-4: var(--dur-rail);
  --stagger: 60ms;

  --ease-out: cubic-bezier(0.33, 1, 0.68, 1);
  --ease-standard: cubic-bezier(0.62, 0.03, 0.36, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --ease-pop: cubic-bezier(0.34, 1.4, 0.64, 1);
  --ease-rail: var(--ease-out);
  --ease-inout: var(--ease-standard);

  --ease-spring: var(--ease-pop);

  --container-md: 720px;
  --container-lg: 960px;
  --container-xl: 1160px;
  --container-2xl: 1240px;
  --gutter: var(--space-4);

  --header-height: var(--hdrh);

  --hdrh: 64px;

  --pinoff: var(--hdrh);

  --bleed-l: 0px;

  --bleed-r: 0px;

  --railw: 206px;

  --size-floor: 0.9375rem;
}

@media (min-width: 768px) {
  :root {
    --gutter: var(--space-8);
  }
}

@media (max-width: 1040px) {
  :root {
    --pinoff: calc(var(--hdrh) + 190px);
  }
}

@media (min-width: 1024px) {
  :root {
    --gutter: var(--space-10);

    --hdrh: 72px;
  }
}

@media (min-width: 1280px) {
  :root {
    --gutter: var(--space-12);
  }
}

:root[data-theme="dark"] {
  --ground: #0f1720;
  --ground-2: #16212c;
  --ground-3: #22303d;
  --panel: #16212c;
  --ink: #eef3f7;
  --ink-2: #b6c4cf;
  --ink-3: #8b9aa6;
  --line: #2b3945;
  --line-2: #6b7a87;

  --accent: #e4780b;
  --accent-hi: #f2a24a;
  --accent-ink: #0f1720;
  --accent-wash: #2a1a0d;

  --ok: #4ade80;

  --warn: #f2a24a;

  --late: #fb7185;

  --sh-1: 0 2px 8px rgb(0 0 0 / 40%);
  --sh-2: 0 10px 30px -12px rgb(0 0 0 / 60%);
  --sh-3: 0 32px 70px -30px rgb(0 0 0 / 80%);
  --grad-wash: linear-gradient(180deg, #2a1a0d 0%, rgb(42 26 13 / 0%) 100%);

  --surface-page: var(--ground);
  --surface-raised: var(--ground-2);
  --surface-sunken: var(--ground-3);
  --surface-card: var(--panel);
  --surface-dark: var(--steel-950);
  --surface-accent-wash: var(--accent-wash);

  --text-primary: var(--ink);

  --text-secondary: var(--ink-2);

  --text-nontext: var(--ink-3);

  --text-accent: var(--accent);

  --rule-decorative: var(--line);

  --rule-structural: var(--line-2);

  --action-fill: var(--accent);
  --action-fill-hover: var(--accent-hi);

  --action-label: var(--accent-ink);

  --focus-ring: var(--accent);

  --elev-1: 0 1px 0 rgb(255 255 255 / 4%) inset;
  --elev-2: 0 1px 0 rgb(255 255 255 / 4%) inset;
  --elev-3: 0 -6px 20px rgb(0 0 0 / 40%);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;

  scroll-padding-top: 88px;
  scroll-padding-bottom: 80px;
}

body {
  margin: 0;
  background: var(--surface-page);
  color: var(--text-primary);
  font-family: var(--font-body);
  font-size: var(--size-body);
  line-height: 1.6;
  font-synthesis-weight: none;
  text-rendering: optimizeLegibility;
}

img,
svg,
video {
  max-width: 100%;
  height: auto;
  display: block;
}

.display-1,
.display-2,
.h2,
.h3,
.h4 {
  font-family: var(--font-display);
  color: var(--text-primary);
  margin: 0;
  text-wrap: balance;
}

.display-1 {
  font-size: var(--size-display-1);
  font-weight: 800;
  line-height: 1.03;
  letter-spacing: -0.02em;
  max-width: 22ch;

}

@media (min-width: 1024px) {
  .display-1 {
    font-family: var(--font-display-expanded);
    font-stretch: expanded;
  }
}

.display-2 {
  font-size: var(--size-display-2);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -0.015em;
  max-width: 26ch;
}

.h2 {
  font-size: var(--size-h2);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.01em;
  max-width: 30ch;
}

.h3 {
  font-size: var(--size-h3);
  font-weight: 700;
  line-height: 1.25;
  max-width: 40ch;
}

.h4 {
  font-size: var(--size-h4);
  font-weight: 600;
  line-height: 1.35;
}

.lede {
  font-size: var(--size-lede);
  line-height: 1.55;
  max-width: 70ch;
  margin: 0;
  color: var(--text-secondary);
}

.body {
  font-size: var(--size-body);
  line-height: 1.6;
  max-width: 75ch;
  margin: 0;
}

.body-strong {
  font-weight: 600;
}

.small {
  font-size: var(--size-small);
  line-height: 1.5;
  max-width: 75ch;
  color: var(--text-secondary);
}

.label {
  font-size: var(--size-label);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.02em;
  color: var(--text-secondary);
  margin: 0;
}

.data {
  font-family: var(--font-data);
  font-size: var(--size-data);
  line-height: 1.4;
  font-variant-numeric: tabular-nums;
}

.data-lg {
  font-family: var(--font-data);
  font-size: var(--size-data-lg);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
}

code {
  overflow-wrap: anywhere;
}

.stack > * + * {
  margin-top: var(--space-4);
}
.stack-tight > * + * {
  margin-top: var(--space-3);
}
.stack-loose > * + * {
  margin-top: var(--space-8);
}
.stack-block > * + * {
  margin-top: var(--space-12);
}

.container {
  width: 100%;
  max-width: var(--container-2xl);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

@media (min-width: 768px) {
  .container {
    max-width: calc(var(--container-md) + 2 * var(--gutter));
  }
}
@media (min-width: 1024px) {
  .container {
    max-width: calc(var(--container-lg) + 2 * var(--gutter));
  }
}
@media (min-width: 1280px) {
  .container {
    max-width: calc(var(--container-xl) + 2 * var(--gutter));
  }
}
@media (min-width: 1536px) {
  .container {
    max-width: calc(var(--container-2xl) + 2 * var(--gutter));
  }
}

.section--inset .section__body {
  max-width: 68ch;
}

@media (min-width: 1024px) {
  .section--inset .section__inner {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    column-gap: var(--gutter);
  }
  .section--inset .section__label {
    grid-column: 1 / span 2;
  }
  .section--inset .section__body {
    grid-column: 3 / span 6;
  }

  .section--inset .section__inner:not(:has(.section__label)) .section__body {
    grid-column: 1 / span 8;
  }
}

.section--bleed {
  background: var(--surface-raised);
}
.section--bleed.section--dark {
  background: var(--surface-dark);
  color: var(--text-on-dark);

  --focus-ring: var(--focus-ring-on-dark);
}
.section--dark .display-1,
.section--dark .display-2,
.section--dark .h2,
.section--dark .h3,
.section--dark .h4 {
  color: var(--text-on-dark);
}
.section--dark .lede,
.section--dark .small,
.section--dark .label {
  color: var(--text-on-dark-secondary);
}

.section {
  padding-block: var(--space-16);
}
.section--rhythm-hero {
  padding-block: var(--space-12) var(--space-16);
}
.section--rhythm-argument {
  padding-block: var(--space-16);
}
.section--rhythm-instrument {
  padding-block: var(--space-12);
}
.section--rhythm-aside {
  padding-block: var(--space-10);
}
.section--rhythm-closing {
  padding-block: var(--space-20);
}

@media (min-width: 1024px) {
  .section--rhythm-hero {
    padding-block: var(--space-20) var(--space-24);
  }
  .section--rhythm-argument {
    padding-block: var(--space-24);
  }
  .section--rhythm-instrument {
    padding-block: var(--space-16);
  }
  .section--rhythm-aside {
    padding-block: var(--space-12);
  }
  .section--rhythm-closing {
    padding-block: var(--space-32);
  }
}

.section--wash {
  background: var(--surface-accent-wash);
}

.section__label {
  display: block;
  margin-bottom: var(--space-4);
}

@media (min-width: 1024px) {
  .section__label {
    margin-bottom: 0;
    padding-top: 0.6em;
  }
}

.proof-blocks {
  display: grid;
  gap: var(--space-12);
}

@media (min-width: 768px) {
  .proof-blocks {
    grid-template-columns: 1fr 1fr;
  }
  .proof-blocks > :first-child {
    grid-column: 1 / -1;
  }
}

@media (min-width: 1024px) {
  .proof-blocks {
    grid-template-columns: 5fr 4fr 3fr;
  }
  .proof-blocks > :first-child {
    grid-column: auto;
  }
}

.two-col {
  display: grid;
  gap: var(--space-6) var(--space-12);
}

@media (min-width: 768px) {
  .two-col {
    grid-template-columns: 1fr 1fr;
  }
}

:lang(es) .display-1 {
  font-size: clamp(2.375rem, 1.6rem + 3.6vw, 3.75rem);
}

:lang(es) .display-2 {
  font-size: clamp(1.875rem, 1.4rem + 2.4vw, 2.875rem);
}

:lang(es) .h2 {
  font-size: clamp(1.625rem, 1.35rem + 1.4vw, 2.25rem);
}

:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

.skip-link {
  position: absolute;
  left: var(--space-4);
  top: var(--space-2);
  z-index: 100;
  transform: translateY(-200%);
  background: var(--action-fill);
  color: var(--action-label);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  text-decoration: none;
  transition: transform var(--dur-fast) var(--ease-standard);
}

.skip-link:focus {
  transform: translateY(0);
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .ticket-rail__card {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }

  .sticky-cta {
    transform: none !important;
  }

  .site-header[data-hidden="true"] {
    transform: none !important;
  }
}

.wrap {
  width: min(1200px, 100% - 2.5rem);
  margin-inline: auto;
}

.wrap-wide {
  width: min(1400px, 100% - 2rem);
  margin-inline: auto;
}

.wrap > *,
.wrap-wide > * {
  min-width: 0;
}

.railpage {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  align-items: start;
  padding-top: 1.4rem;
}

@media (min-width: 1041px) {
  .railpage {
    grid-template-columns: var(--railw) minmax(0, 1fr);
    gap: clamp(1.4rem, 3vw, 3rem);
  }

  .railcol {
    grid-column: 2;
  }
}

.railcol {
  min-width: 0;
}

.stopsec {
  position: relative;

  scroll-margin-top: calc(var(--pinoff, 64px) + 1.5rem);
}

.stopsec + .stopsec {
  margin-top: clamp(3rem, 6vw, 5.5rem);
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--size-body);
  line-height: 1.25;

  min-width: 8rem;
  min-height: 48px;
  padding: var(--space-3) var(--space-6);
  border: 0;
  border-radius: var(--radius-md);
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  transition:
    background-color var(--dur-fast) var(--ease-standard),
    transform var(--dur-fast) var(--ease-standard);
}

.button--primary {
  background: var(--action-fill);
  color: var(--action-label);
}

.button--secondary {
  background: transparent;
  color: var(--text-primary);
  box-shadow: inset 0 0 0 1px var(--rule-structural);
}

.button--ghost {
  background: transparent;
  color: var(--text-accent);
  min-width: 0;
  padding-inline: var(--space-2);
}

.button--sm {
  min-height: 40px;
  padding: var(--space-2) var(--space-4);
}
.button--lg {
  min-height: 56px;
  padding: var(--space-4) var(--space-8);
}

@media (hover: hover) {
  .button--primary:hover {
    background: var(--action-fill-hover);
    transform: translateY(-1px);
  }
  .button--secondary:hover {
    background: var(--surface-raised);
    transform: translateY(-1px);
  }
}

.button:active {
  transform: translateY(0) scale(0.985);
  transition-duration: var(--dur-instant);
}

.button-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
  align-items: center;
}

@media (max-width: 479px) {
  .button-row .button--primary {
    width: 100%;
  }
  .button-row .button--secondary:not(:only-child) {
    background: none;
    box-shadow: none;
    color: var(--text-accent);
    text-decoration: underline;
    text-underline-offset: 3px;
    min-width: 0;
    padding-inline: 0;
  }
  .button-row .button--secondary:only-child {
    width: 100%;
    background: var(--action-fill);
    color: var(--action-label);
    box-shadow: none;
    text-decoration: none;
  }
}

@media (max-width: 479px) and (hover: hover) {
  .button-row .button--secondary:only-child:hover {
    background: var(--action-fill-hover);
  }
}

.text-link {
  color: var(--text-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition: text-decoration-thickness var(--dur-fast) var(--ease-standard);
}

.text-link:hover,
.text-link:focus-visible {
  text-decoration-thickness: 2px;
}

.section--dark .text-link {
  color: var(--ember-400);
}

.hdr {
  position: sticky;
  top: 0;
  z-index: 80;

  background: var(--surface-page);
  background: color-mix(in srgb, var(--ground) 92%, transparent);
  backdrop-filter: saturate(150%) blur(12px);
  border-bottom: 1px solid var(--line);
  transition: transform var(--dur-base) var(--ease-standard);
}

.hdr[data-hidden="true"] {
  transform: translateY(-100%);
}

.hdr__in {
  display: flex;
  align-items: center;
  gap: 1.4rem;
  padding: 0.8rem 0;

  min-height: 64px;
}

.mark {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  text-decoration: none;
  flex: 0 0 auto;
  color: var(--text-primary);

  margin-right: auto;

  min-height: 44px;
}

.mark__plate {
  width: 32px;
  height: 32px;
  border-radius: var(--r-xs);
  background: var(--grad-ember);
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  box-shadow: var(--sh-1);
}

.mark__plate svg {
  width: 21px;
  height: 21px;
}

.mark__word {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 1.05rem;
  letter-spacing: -0.02em;
}

.nav {
  display: flex;
  align-items: stretch;
  gap: 0;
  margin-left: auto;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.nav::-webkit-scrollbar {
  display: none;
}

.nav > * {
  flex: 0 0 auto;
}

.nav__ix {
  font-family: var(--font-data);
  font-size: var(--size-floor);

  color: var(--text-secondary);
  letter-spacing: 0.06em;
  font-variant-numeric: tabular-nums;
}

.nav__sep {
  align-self: center;
  width: 1px;
  height: 20px;
  background: var(--line);
  margin: 0 0.8rem;
  flex: 0 0 auto;
}

.nav__held {
  color: var(--text-secondary);
  cursor: default;
}

.nav a {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 0.94rem;
  text-decoration: none;
  color: var(--text-secondary);

  padding: 0.72rem 0.55rem;
  position: relative;

  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  white-space: nowrap;
  min-height: 44px;
}

.nav__held {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 0.94rem;
  padding: 0.72rem 0.95rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  white-space: nowrap;
  min-height: 44px;
}

.nav a:first-child {
  padding-left: 0;
}

.nav a::after {
  content: "";
  position: absolute;
  left: 0.95rem;
  right: 0.95rem;
  bottom: 0;
  height: 2px;
  border-radius: 2px 2px 0 0;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 240ms var(--ease-out);
}

.nav a:first-child::after {
  left: 0;
}

.nav a:hover {
  color: var(--text-primary);
}

.nav a[aria-current="page"] {
  color: var(--text-primary);
}

.nav a[aria-current="page"]::after {
  transform: scaleX(1);
}

.nav a:hover::after,
.nav a:focus-visible::after {
  transform: scaleX(1);
}

.hdr .button {
  min-width: 0;
  min-height: 44px;
  padding: 0.6rem 1.25rem;
  font-size: 0.92rem;
  border-radius: var(--r-pill);
}

.hdr__accessory {
  display: flex;
  align-items: center;
  gap: 0.6rem;

}

.hdr__accessory .theme-toggle {
  min-height: 44px;
  padding: 0.6rem 1.25rem;
  border-radius: var(--r-pill);
  border: 2px solid var(--line-2);
  background: transparent;
  color: var(--text-primary);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 0.92rem;
  cursor: pointer;
  transition:
    transform 180ms var(--ease-out),
    border-color 180ms var(--ease-out),
    color 180ms var(--ease-out);
}

.hdr__accessory .theme-toggle:hover {
  border-color: var(--accent);
  color: var(--accent);
  transform: translateY(-2px);
}

.nav-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  background: none;
  border: 0;
  color: var(--text-primary);
  font: inherit;
  font-size: var(--size-small);
  cursor: pointer;
  gap: var(--space-2);
}

@media (max-width: 1119px) {
  .nav {
    display: none;
  }
}

@media (min-width: 1120px) {
  .nav-toggle {
    display: none;
  }
}

@media (min-width: 1120px) {
  .hdr[data-nav="inline"] .nav {
    display: flex;
  }
  .hdr[data-nav="inline"] .nav-toggle {
    display: none;
  }
}

.hdr[data-nav="drawer"] .nav {
  display: none;
}
.hdr[data-nav="drawer"] .nav-toggle {
  display: inline-flex;
}

@media (max-width: 620px) {
  .hdr__in {
    gap: 0.6rem;
    flex-wrap: wrap;
  }

  .mark__word {
    display: none;
  }

  .hdr .button {
    padding: 0.55rem 1rem;
    font-size: 0.87rem;
  }

  .hdr__accessory .theme-toggle {
    padding: 0.55rem 1rem;
    font-size: 0.87rem;
  }
}

.nav-drawer {
  position: fixed;
  inset: 0 0 0 auto;
  width: min(88vw, 380px);
  background: var(--surface-page);
  border-inline-start: 1px solid var(--rule-decorative);
  padding: var(--space-6) var(--space-6) var(--space-12);
  z-index: 90;
  overflow-y: auto;
  transform: translateX(100%);
  transition: transform var(--dur-base) var(--ease-out);
}

.nav-drawer[data-open="true"] {
  transform: translateX(0);
}

.nav-drawer[hidden] {
  display: none;
}

.nav-drawer__backdrop {
  position: fixed;
  inset: 0;
  background: rgb(15 23 32 / 50%);
  z-index: 85;
  border: 0;
}

.nav-drawer a {
  display: block;
  padding: var(--space-3) 0;
  min-height: 44px;
  color: var(--text-primary);
  text-decoration: none;
  font-size: var(--size-lede);
}

.account-menu {
  position: relative;

  display: none;
}

@media (min-width: 768px) {
  .account-menu {
    display: block;
  }
}

[data-nav="inline"] .account-menu {
  display: block;
}

.account-menu__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  border-radius: var(--r-pill);
  color: var(--text-primary);
  cursor: pointer;

  list-style: none;
  transition: color var(--dur-fast) var(--ease-out);
}

.account-menu__toggle::-webkit-details-marker {
  display: none;
}

@media (min-width: 900px) {
  [data-nav="drawer"] .account-menu__toggle {
    gap: var(--space-2);
    padding: 0 var(--space-3);
  }

  [data-nav="drawer"] .account-menu__toggle::after {
    content: attr(aria-label);
    font-size: var(--size-small);
    white-space: nowrap;
  }
}

.account-menu__toggle:hover {
  color: var(--text-accent);
}

.account-menu__glyph {
  width: 22px;
  height: 22px;
}

.account-menu__panel {
  position: absolute;
  top: calc(100% + var(--space-2));
  right: 0;
  min-width: 208px;
  padding: var(--space-3) var(--space-4) var(--space-4);
  background: var(--surface-card);
  border-radius: var(--r-sm);
  box-shadow: var(--elev-2);
  z-index: 95;
}

.account-menu__heading,
.account-group__heading {
  margin: 0 0 var(--space-2);
  font-family: var(--font-display);
  font-size: var(--size-label);
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--text-secondary);
}

.account-menu__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.account-menu__row {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: var(--space-2) 0;
  color: var(--text-primary);
  text-decoration: none;
  font-size: var(--size-small);
}

.account-menu__row:hover {
  color: var(--text-accent);
  text-decoration: underline;
}

.account-group {
  margin-top: var(--space-6);
}

.ftr {

  background: var(--surface-dark);
  color: var(--text-on-dark);
  padding: 4.5rem 0 2.2rem;
  margin-top: 5rem;

  --focus-ring: var(--focus-ring-on-dark);
}

.ftr__cols {
  display: grid;
  gap: 2.4rem;
  grid-template-columns: 1.4fr repeat(4, minmax(140px, 1fr));
}

.ftr__cols[data-cols="3"] {
  grid-template-columns: 1.4fr repeat(3, minmax(140px, 1fr));
}

.ftr__cols[data-cols="2"] {
  grid-template-columns: 1.4fr repeat(2, minmax(140px, 1fr));
}

.ftr__cols[data-cols="1"] {
  grid-template-columns: 1.4fr minmax(140px, 1fr);
}

.ftr__sub {
  font-family: var(--font-data);
  font-size: var(--size-floor);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-on-dark-secondary, #8fa0ad);
  font-weight: 500;
  margin: 1.4rem 0 0.9rem;
}

.ftr__nav {
  display: contents;
}

@media (max-width: 1000px) {
  .ftr__cols,
  .ftr__cols[data-cols] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .ftr__cols,
  .ftr__cols[data-cols] {
    grid-template-columns: 1fr;
    gap: 1.8rem;
  }
}

.ftr__brand .mark {
  margin-bottom: 1rem;
}

.ftr .mark__word {
  color: #fff;
  display: inline;
}

.ftr__blurb {
  color: #8fa0ad;
  font-size: 0.93rem;
  max-width: 34ch;
  margin: 0;
}

.ftr h2 {
  font-family: var(--font-data);
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #8fa0ad;
  margin: 0 0 0.9rem;
  font-weight: 500;
}

.ftr ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.5rem;
}

.ftr a {
  color: #c3d0da;
  text-decoration: none;
  font-size: 0.93rem;

  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

.ftr a:hover {
  color: var(--ember-300);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ftr__contact {
  margin: 0 0 var(--space-10);
  color: #c3d0da;
  font-size: var(--size-body);
  line-height: 1.6;
}

.ftr__contact a {
  display: inline-block;
  min-height: 44px;
  padding-block: var(--space-3);
  color: var(--text-on-dark);
  text-decoration: underline;
  text-underline-offset: 3px;

  overflow-wrap: anywhere;
}

.ftr__contact a:hover {
  text-decoration-thickness: 2px;
}

.ftr__base {
  margin-top: 3rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--steel-800);
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: space-between;
  color: #93a3b0;
  font-size: 0.82rem;
}

.data-table {
  width: 100%;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
}

.data-table caption {
  text-align: start;
  font-size: var(--size-small);
  color: var(--text-secondary);
  margin-bottom: var(--space-4);
  max-width: 75ch;
}

.section--dark .data-table caption {
  color: var(--text-on-dark-secondary);
}

.data-table th,
.data-table td {
  text-align: start;
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--rule-decorative);

  min-width: 8ch;
}

.data-table th[scope="row"] {
  font-weight: 600;
  min-width: 14ch;
}

.data-table thead th {
  font-family: var(--font-body);
  font-size: var(--size-label);
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--text-secondary);
}

.section--dark .data-table thead th {
  color: var(--text-on-dark-secondary);
}

.data-table .num {
  text-align: end;
}

@media (hover: hover) {
  .data-table tbody tr:hover {
    background: var(--surface-raised);
  }
  .section--dark .data-table tbody tr:hover {
    background: var(--steel-900);
  }
}

.table-transposed {
  display: block;
}

@media (min-width: 768px) {
  .table-transposed {
    display: none;
  }
}

.table-wide {
  display: none;
}

@media (min-width: 768px) {
  .table-wide {
    display: block;
    overflow-x: visible;
  }
}

.transposed-group {
  padding: var(--space-6) 0;
  border-bottom: 1px solid var(--rule-decorative);
}

.transposed-group dl {
  margin: var(--space-4) 0 0;
  display: grid;
  gap: var(--space-3);
}

.transposed-group dt {
  font-weight: 600;
}

.transposed-group dd {
  margin: 0 0 var(--space-3);
  color: var(--text-secondary);
}

.section--dark .transposed-group dd {
  color: var(--text-on-dark-secondary);
}

.state-cell {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  white-space: nowrap;
}

.state-glyph {
  width: 12px;
  height: 12px;
  flex: none;
  border: 2px solid currentColor;
  border-radius: var(--radius-sm);
}

.state-glyph--yes {
  background: currentColor;
}

.state-glyph--partial {
  background: linear-gradient(to right, currentColor 50%, transparent 50%);
}

.state-glyph--no {
  background: none;
}

.state-cell--no {
  color: var(--text-primary);
  font-weight: 600;
}

.section--dark .state-cell--no {
  color: var(--text-on-dark);
}

.plan-cards {
  display: grid;
  gap: var(--space-6);
}

@media (min-width: 768px) {
  .plan-cards {
    display: none;
  }
}

.plan-card {
  background: var(--surface-raised);
  border-radius: var(--radius-md);
  padding: var(--space-8);
}

.plan-card__price {
  margin: var(--space-4) 0;
}

.plan-card ul {
  list-style: none;
  margin: var(--space-4) 0 0;
  padding: 0;
  display: grid;
  gap: var(--space-3);
}

.accordion {
  border-top: 1px solid var(--rule-decorative);
}

.accordion__item {
  border-bottom: 1px solid var(--rule-decorative);
}

.accordion__item > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  min-height: 56px;
  padding: var(--space-4) 0;
  cursor: pointer;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--size-h4);
  list-style: none;
}

.accordion__item > summary::-webkit-details-marker {
  display: none;
}

.accordion__chevron {
  flex: none;
  width: 16px;
  height: 16px;
  border-inline-end: 2px solid var(--text-nontext);
  border-block-end: 2px solid var(--text-nontext);
  transform: rotate(45deg);
  transition: transform var(--dur-base) var(--ease-standard);
}

.accordion__item[open] .accordion__chevron {
  transform: rotate(225deg);
}

.accordion__panel {
  padding-bottom: var(--space-6);
}

.definition-list {
  margin: 0;
  display: grid;
  gap: var(--space-10);
}

@media (min-width: 768px) {
  .definition-list--two-col {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-10) var(--space-12);
  }
}

.definition-list dt {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--size-h4);
  margin-bottom: var(--space-3);
}

.definition-list dd {
  margin: 0;
  color: var(--text-secondary);
}

.form-field {
  display: grid;
  gap: var(--space-2);
  margin-bottom: var(--space-6);
}

.form-field label {
  font-weight: 600;
  font-size: var(--size-small);
  color: var(--text-primary);
}

.form-field .form-field__description {
  font-size: var(--size-small);
  color: var(--text-secondary);
  margin: 0;
}

.form-field input,
.form-field textarea,
.form-field select {
  font: inherit;
  font-size: var(--size-body);
  color: var(--text-primary);
  background: var(--surface-card);
  min-height: 48px;
  min-width: 0;
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--rule-structural);
  border-radius: var(--radius-md);
  transition:
    border-color var(--dur-fast) var(--ease-standard),
    box-shadow var(--dur-fast) var(--ease-standard);
}

.form-field textarea {
  min-height: 140px;
  resize: vertical;
}

.form-field input:focus,
.form-field textarea:focus {
  border-color: var(--focus-ring);
  box-shadow: 0 0 0 2px var(--focus-ring);
  outline: none;
}

.form-field .form-field__error {
  margin: 0;
  font-size: var(--size-small);
  font-weight: 600;
  color: var(--text-accent);
}

.form-field .form-field__error:empty {
  display: none;
}

.form-field input[aria-invalid="true"],
.form-field textarea[aria-invalid="true"] {
  border-color: var(--late);
  border-width: 2px;
}

.form-errors {
  margin-bottom: var(--space-6);
  padding: var(--space-4) var(--space-6);
  border-radius: var(--radius-md);
  border: 2px solid var(--text-accent);
  background: var(--surface-accent-wash);
  color: var(--text-primary);
}

.form-errors:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

.form-errors[hidden] {
  display: none;
}

.form-field input[type="file"] {
  padding: var(--space-2) var(--space-3);
}

.form-honeypot {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.banner {
  padding: var(--space-4) var(--space-6);
  border-radius: var(--radius-md);
  background: var(--surface-raised);
  border-inline-start: 0;
  font-size: var(--size-small);
}

.banner--accent {
  background: var(--surface-accent-wash);
  color: var(--text-primary);
}

.banner--warn {
  background: var(--surface-accent-wash);
  color: var(--text-primary);
  border: 2px solid var(--text-accent);
}

.import-report {
  margin-top: var(--space-8);
  display: grid;
  gap: var(--space-6);
}

.import-report[hidden] {
  display: none;
}

.import-report .data-table {
  width: 100%;
}

.sticky-cta {
  position: fixed;
  inset-inline: 0;
  bottom: 0;
  z-index: 40;
  min-height: 64px;
  display: flex;
  align-items: center;
  gap: var(--space-4);
  padding: var(--space-2) var(--gutter);
  background: var(--surface-page);
  box-shadow: var(--elev-3);
  transform: translateY(100%);
  transition: transform var(--dur-slow) var(--ease-out);
}

.sticky-cta[data-visible="true"] {
  transform: translateY(0);
}

.sticky-cta .button {
  min-height: 56px;
}

.sticky-cta[inert] {
  pointer-events: none;
}

@media (min-width: 768px) {
  .sticky-cta {
    display: none;
  }
}

.prose {
  max-width: 68ch;
}

.prose h2 {
  font-family: var(--font-display);
  font-size: var(--size-h2);
  font-weight: 700;
  line-height: 1.15;
  margin: var(--space-12) 0 var(--space-3);

  scroll-margin-top: calc(var(--pinoff, 64px) + 1.5rem);
}

.prose h3 {
  font-family: var(--font-display);
  font-size: var(--size-h3);
  font-weight: 700;
  margin: var(--space-8) 0 var(--space-3);
}

.prose p,
.prose li {
  font-size: var(--size-body);
  line-height: 1.6;
}

.prose ul,
.prose ol {
  padding-inline-start: var(--space-6);
  display: grid;
  gap: var(--space-3);
}

.legal-layout {
  display: grid;
  gap: var(--space-12);
}

@media (min-width: 1024px) {
  .legal-layout {
    grid-template-columns: minmax(0, 1fr) 260px;
    gap: var(--space-16);
    align-items: start;
  }
  .toc {
    position: sticky;
    top: calc(var(--header-height) + var(--space-6));
    order: 2;
  }
}

.toc ol {
  list-style: none;
  margin: var(--space-3) 0 0;
  padding: 0;
  display: grid;
  gap: var(--space-2);
}

.toc a {
  color: var(--text-secondary);
  text-decoration: none;
  font-size: var(--size-small);
  display: inline-flex;
  min-height: 44px;
  align-items: center;
}

.toc a[aria-current="true"] {
  color: var(--text-accent);
  font-weight: 600;
}

.language-switcher {
  white-space: nowrap;

  color: var(--text-primary);
}

.ticket-rail {
  display: flex;
  gap: var(--space-4);

  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-block: var(--space-4);
  padding-inline: var(--gutter) 25vw;
  margin-inline: calc(-1 * var(--gutter));
  scrollbar-width: thin;
}

.ticket-rail:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 4px;
}

.ticket-rail__card {
  flex: none;
  width: 280px;
  scroll-snap-align: start;
  background: var(--paper-card);
  color: var(--steel-950);
  border-radius: var(--radius-lg);
  box-shadow: var(--elev-1);
  overflow: hidden;
  text-align: start;
}

@media (min-width: 768px) {
  .ticket-rail__card {
    width: 320px;
  }
}
.ticket-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);

  min-height: 88px;
  padding: var(--space-4);
  background: var(--steel-100);
  font-family: var(--font-data);
  font-weight: 600;
}

.ticket-card__body {
  padding: var(--space-4);
  display: grid;
  gap: var(--space-2);
}

.ticket-card__item {
  display: flex;
  gap: var(--space-3);
  font-size: var(--size-small);
  color: var(--steel-950);
}

.ticket-card__qty {
  font-family: var(--font-data);
  font-weight: 600;
  min-width: 2ch;
}

.ticket-card__modifier {
  padding-inline-start: var(--space-6);
  color: var(--steel-600);
  font-size: var(--size-small);
}

.ticket-card__allergen {
  margin-top: var(--space-2);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  background: #fdecdf;
  color: #7a2d05;
  font-size: var(--size-small);
  font-weight: 600;
}

.ticket-card__timer {
  font-family: var(--font-data);
  font-variant-numeric: tabular-nums;
}

button.ticket-card__header {
  width: 100%;
  border: 0;
  cursor: pointer;
  font-size: var(--size-body);
  transition: background-color var(--dur-fast) var(--ease-standard);
}

button.ticket-card__header:hover {
  background: var(--steel-200);
}

.ticket-rail__card[data-bumped="true"] {
  animation: bump-out var(--dur-rail) var(--ease-in) forwards;
}

@keyframes bump-out {
  to {
    opacity: 0;
    transform: translateX(40%);
  }
}

.rail-undo {
  margin-top: var(--space-4);
  min-height: 44px;
}

.theme-toggle {
  display: none;
  align-items: center;
  gap: var(--space-2);

  min-height: 44px;
  padding: var(--space-1) var(--space-3);
  border: 1px solid var(--rule-structural);
  border-radius: var(--radius-pill);
  background: none;
  color: var(--text-primary);
  font: inherit;
  font-size: var(--size-small);
  white-space: nowrap;
  cursor: pointer;

  transition:
    color var(--dur-fast) var(--ease-out),
    border-color var(--dur-fast) var(--ease-out);
}

.theme-toggle:hover {
  border-color: var(--action-fill);
  color: var(--text-accent);
}

@media (min-width: 768px) {
  .hdr__accessory .theme-toggle {
    display: inline-flex;
  }
}

.hdr[data-nav="inline"] .hdr__accessory .theme-toggle {
  display: inline-flex;
}

.nav-drawer__accessory .theme-toggle {
  display: inline-flex;
}

.theme-toggle__icon {
  width: 12px;
  height: 12px;
  flex: none;
  border: 2px solid currentcolor;
  border-radius: var(--radius-pill);
  background: linear-gradient(to right, currentcolor 50%, transparent 50%);
}

.theme-toggle[aria-pressed="true"] .theme-toggle__icon {
  background: currentcolor;
}

.connection-chip {
  display: none;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-pill);
  background: var(--surface-raised);
  color: var(--text-secondary);
  font-size: var(--size-small);
  text-decoration: none;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .connection-chip {
    display: inline-flex;
  }
}

.connection-chip__dot {
  width: 10px;
  height: 10px;
  flex: none;
  border: 2px solid currentColor;
  border-radius: var(--radius-pill);
  background: currentColor;
}

.connection-chip[data-state="local"] {
  color: #7a4a05;
}
.connection-chip[data-state="local"] .connection-chip__dot {
  border-radius: var(--radius-sm);
  background: transparent;
}
.connection-chip[data-state="down"] {
  color: var(--ember-600);
}
.connection-chip[data-state="down"] .connection-chip__dot {
  border-radius: var(--radius-sm);
  background: linear-gradient(to right, currentColor 50%, transparent 50%);
}

.network-control {
  border: 0;
  margin: 0 0 var(--space-6);
  padding: 0;
}

.network-control legend {
  padding: 0;
  margin-bottom: var(--space-3);
}

.network-control__options {
  display: grid;
  gap: var(--space-3);
}

@media (min-width: 768px) {
  .network-control__options {
    grid-auto-flow: column;
    justify-content: start;
  }
}

.network-control__option {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-height: 48px;
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  background: var(--surface-raised);
  cursor: pointer;
  font-size: var(--size-small);
}

.network-control__option:has(input:checked) {
  box-shadow: inset 0 0 0 2px var(--focus-ring);
  font-weight: 600;
}

.network-control__option:has(input:focus-visible) {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

.setup-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-12);
}

.setup-step {
  display: grid;
  gap: var(--space-3);
  position: relative;
  padding-inline-start: var(--space-10);
}

.setup-step::before {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline-start: var(--space-2);
  width: 2px;
  background: var(--rule-decorative);
}

.setup-step:last-child::before {
  bottom: auto;
  height: 2.5rem;
}

.setup-step__number {
  color: var(--text-nontext);
}

@media (min-width: 1024px) {
  .setup-step {
    grid-template-columns: 5rem minmax(0, 1fr);
    padding-inline-start: 0;
    column-gap: var(--space-6);
  }
  .setup-step::before {
    inset-inline-start: 5.75rem;
  }
  .setup-step__number {
    grid-row: 1 / span 3;
  }
}

.pos-wordmark {
  color: var(--text-secondary);
  font-weight: 700;
  font-family: var(--font-display);
  font-size: 20px;
  line-height: 1;
}

.pause-proof {
  display: grid;
  gap: var(--space-6);
}

@media (min-width: 768px) {
  .pause-proof {
    grid-template-columns: 1fr 1fr;
  }
}

.pause-proof figure {
  margin: 0;
}

.pause-proof figcaption {
  margin-top: var(--space-3);
  font-size: var(--size-small);
  color: var(--text-secondary);
}

.boilerplate {
  background: var(--surface-sunken);
  border-left: 3px solid var(--rule-structural);
  padding: var(--space-6);
  border-radius: var(--radius-sm);
}

.boilerplate .label {
  margin-bottom: var(--space-3);
  color: var(--text-secondary);
}

.slot-placeholder {
  display: block;
  margin-block: var(--space-6);
  padding: var(--space-6);
  border: 3px dashed #8a5a00;
  border-radius: var(--radius-md);
  background: repeating-linear-gradient(135deg, #fff8e6, #fff8e6 12px, #ffefc4 12px, #ffefc4 24px);
  color: #4a3000;
}

.slot-placeholder__tag {
  display: inline-block;
  margin-bottom: var(--space-2);
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-sm);
  background: #4a3000;
  color: #fff8e6;
  font-family: var(--font-data);
  font-size: var(--size-small);
  font-weight: 600;
}

.slot-placeholder__question {
  margin: 0;
  font-size: var(--size-small);
  line-height: 1.5;
  max-width: 75ch;
  color: #4a3000;
}

.slot-placeholder--gate {
  border-color: #0d4f6c;
  background: repeating-linear-gradient(135deg, #eaf6fb, #eaf6fb 12px, #d3ecf7 12px, #d3ecf7 24px);
  color: #062b3c;
}

.slot-placeholder--gate .slot-placeholder__tag {
  background: #062b3c;
  color: #eaf6fb;
}

.slot-placeholder--gate .slot-placeholder__question {
  color: #062b3c;
}

.placeholder-person {
  margin: 0;
  padding: 0;
  border-left: none;
}

.placeholder-person__quote {
  margin: var(--space-6) 0 0;
  padding: 0;
  max-width: 62ch;
}

.placeholder-person__quote p {
  margin: 0;
}

.placeholder-person__who {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  margin-top: var(--space-6);
}

.placeholder-person__avatar {
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
}

.placeholder-person__avatar-disc {
  fill: #4a3000;
}

.placeholder-person__avatar-initials {
  fill: #fff8e6;
  font-family: var(--font-data);
  font-size: 24px;
  font-weight: 600;
}

.placeholder-person__attribution {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.placeholder-person__name {
  font-weight: 600;
}

.error-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4) var(--space-6);
  padding: 0;
  margin: 0;
  list-style: none;
}

.error-links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

.search-form {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: end;
}

.search-form .form-field {
  margin-bottom: 0;
  flex: 1 1 240px;
}

@media (min-width: 768px) {
  .search-form .form-field {
    flex: 0 1 380px;
  }
}

.marker-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-6);
}

.marker-list li {
  position: relative;
  padding-inline-start: var(--space-8);
  font-size: var(--size-h4);
  font-family: var(--font-display);
  font-weight: 600;
}

.marker-list li::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 0.7em;
  width: var(--space-6);
  height: 2px;
  background: var(--text-nontext);

  transform: scaleX(0.35);
  transform-origin: left center;
  transition: transform var(--dur-fast) var(--ease-standard);
}

.feature-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-6);
}

@media (min-width: 768px) {
  .feature-list {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-6) var(--space-12);
  }
}

.feature-list dt,
.feature-list__term {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--size-h4);
  margin-bottom: var(--space-2);
}

.plain-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-6);
}

.segment-index__item {
  min-width: 0;
}

.segment-index__name {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--size-h4);
  line-height: 1.3;
  margin: 0 0 var(--space-2);
}

.segment-index__summary {
  margin: 0;
  color: var(--text-secondary);
}

.breadcrumbs {
  font-size: var(--size-small);
  color: var(--text-secondary);
  margin-bottom: var(--space-6);
}

.breadcrumbs ol {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin: 0;
  padding: 0;
}

.competitor-price {
  display: block;
  font-size: var(--size-h4);
}

.competitor-note,
.competitor-checked {
  display: block;
  margin-top: var(--space-2);
  color: var(--text-secondary);
}

.competitor-checked {
  font-weight: 600;
  color: var(--text-primary);
}

.chooser {
  border: 0;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-8);
}

.chooser__question {
  border: 0;
  margin: 0;
  padding: 0;
  min-inline-size: 0;

}

.chooser__question legend {
  padding: 0;
}

.chooser__help {
  color: var(--text-secondary);
  margin: var(--space-2) 0 var(--space-4);
}

.chooser__options {
  display: grid;
  gap: var(--space-3);
}

.chooser__option {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-height: 48px;
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  background: var(--surface-raised);
  cursor: pointer;
}

.chooser__option:has(input:checked) {
  box-shadow: inset 0 0 0 2px var(--focus-ring);
  font-weight: 600;
}

.chooser__option:has(input:focus-visible) {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

.chooser__result {
  margin-top: var(--space-8);
  padding: var(--space-6);
  border-radius: var(--radius-md);
  background: var(--surface-card);
}

.chooser__outcomes {
  margin-top: var(--space-8);
}

.chooser__outcome {
  padding: var(--space-6);
  border-radius: var(--radius-md);
  background: var(--surface-card);
}

.chooser__verdict {
  margin-bottom: var(--space-2);
}

.chooser__when {
  margin-top: var(--space-6);
  color: var(--text-secondary);
}

.radio-group {
  border: 0;
  margin: 0 0 var(--space-6);
  padding: 0;
}

.radio-group legend {
  padding: 0;
  margin-bottom: var(--space-3);
}

.radio-group__options {
  display: grid;
  gap: var(--space-3);
}

@media (min-width: 768px) {
  .radio-group__options {
    grid-auto-flow: column;
    justify-content: start;
  }
}

.radio-group__option {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-height: 48px;
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  background: var(--surface-raised);
  cursor: pointer;
  font-size: var(--size-small);
}

.radio-group__option:has(input:checked) {
  box-shadow: inset 0 0 0 2px var(--focus-ring);
  font-weight: 600;
}

.radio-group__option:has(input:focus-visible) {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

.radio-group__note {
  display: block;
  color: var(--text-secondary);
  font-weight: 400;
}

.roi-output {
  padding: var(--space-6);
  border-radius: var(--radius-md);
  background: var(--surface-card);
}

.roi-output dl {
  margin-bottom: 0;
}

.form-unavailable {
  max-width: 36rem;
  margin-top: var(--space-8);
  padding: var(--space-6);
  border-radius: var(--radius-md);
  border: 2px solid var(--text-accent);
  background: var(--surface-accent-wash);
  color: var(--text-primary);
}

.form-unavailable p + p {
  margin-top: var(--space-4);
}

.inert-fieldset {
  max-width: 36rem;
  margin: var(--space-8) 0 0;
  padding: 0;
  border: 0;
}

.inert-fieldset :disabled {
  opacity: 1;
  color: var(--text-primary);
  background: var(--surface-sunken);
  cursor: not-allowed;
}

[data-post-schematic-frame] {
  container-type: inline-size;
  container-name: post-schematic;
}

[data-post-schematic] text {
  display: none;
}

[data-post-schematic-legend] {
  margin: var(--space-3) 0 0;
  font-size: var(--size-small);
  line-height: 1.5;
  color: var(--text-secondary);
}

@container post-schematic (min-width: 600px) {
  [data-post-schematic] text {
    display: initial;
    font-size: 31px;
  }

  [data-post-schematic-legend] {
    display: none;
  }
}

@container post-schematic (min-width: 690px) {
  [data-post-schematic] text {
    font-size: 27px;
  }
}

@container post-schematic (min-width: 750px) {
  [data-post-schematic] text {
    font-size: 25px;
  }
}

.photo {
  display: block;
}

.photo__img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius-md);
  background: var(--surface-sunken);
}

@media (min-width: 768px) {
  .photo--band .photo__img {
    aspect-ratio: 16 / 9;
    object-fit: cover;
  }
}

.photo--focal-center .photo__img {
  object-position: 50% 50%;
}
.photo--focal-center-left .photo__img {
  object-position: 25% 50%;
}
.photo--focal-center-right .photo__img {
  object-position: 75% 50%;
}
.photo--focal-lower-left .photo__img {
  object-position: 25% 75%;
}

.pass-band {
  display: grid;
  gap: var(--space-6);
}

@media (min-width: 768px) {
  .pass-band {
    grid-template-columns: 7fr 5fr;
    align-items: start;
    gap: 24px;
  }

  .pass-band__frame {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: var(--radius-md);
    background: var(--surface-sunken);
  }

  .pass-band__frame--trail {
    align-self: end;
  }

  .pass-band__frame .photo {
    height: 100%;
  }

  .pass-band__frame .photo__img {
    aspect-ratio: auto;
    width: 100%;
    height: 106%;
    object-fit: cover;
    border-radius: 0;
  }
}

.feature-cards {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-8);
}

@media (min-width: 768px) {
  .feature-cards {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  }
}

.feature-card {
  background: var(--surface-raised);
  border-radius: var(--radius-md);
  padding: var(--space-8);
  min-width: 0;
}

.feature-card h3 {
  margin: 0 0 var(--space-4);
}

.feature-card p {
  margin: 0 0 var(--space-4);
}

.feature-card p:last-child {
  margin-bottom: 0;
}

.feature-rows {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-6);
}

.feature-row {
  min-width: 0;
  padding-bottom: var(--space-6);
  border-bottom: 1px solid var(--rule-decorative);
}

.feature-row:last-child {
  padding-bottom: 0;
  border-bottom: none;
}

.feature-row > p {
  margin: 0 0 var(--space-2);
}

.feature-row__head {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-4);
}

.feature-row__name {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--size-h4);
  line-height: 1.3;
}

a.feature-row__name {
  display: inline-flex;
  align-items: center;
  min-height: 44px;

  color: var(--text-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition: text-decoration-thickness var(--dur-fast) var(--ease-standard);
}

a.feature-row__name:hover,
a.feature-row__name:focus-visible {
  text-decoration-thickness: 2px;
}

.feature-row__id {
  font-size: var(--size-small);
  color: var(--text-secondary);
}

.feature-row__status {
  margin-bottom: 0;
}

.rail {
  min-width: 0;
  padding: 1rem 0 1.4rem;
}

.rail__hd {
  display: grid;
  gap: 0.15rem;
  margin: 0 0 1.1rem;
}

.rail__k {
  margin: 0;
  font-family: var(--font-data);
  font-size: var(--size-floor);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-secondary);
}

.rail__track {
  position: relative;
  padding-left: 1.35rem;
}

.rail__track::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 0.55rem;
  bottom: 0.55rem;
  width: 2px;
  background: var(--line);
  border-radius: 2px;
}

.rail__fill {
  position: absolute;
  left: 5px;
  top: 0.55rem;
  bottom: 0.55rem;
  width: 2px;
  background: var(--accent);
  border-radius: 2px;
  transform: scaleY(var(--p, 0));
  transform-origin: top;
}

.rail__puck {
  position: absolute;
  left: -2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 4px var(--ground);
  top: calc(0.17rem + var(--p, 0) * (100% - 1.1rem));
  z-index: 3;
  pointer-events: none;
}

.rail:not([style*="--p"]) .rail__puck,
.rail:not([style*="--p"]) .rail__fill {
  display: none;
}

.rail__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.05rem;
}

.stop {
  display: flex;
  align-items: baseline;
  gap: 0.55rem;
  position: relative;
  text-decoration: none;

  min-height: 44px;
  padding: 0.42rem 0.5rem 0.42rem 0.55rem;
  border-radius: var(--r-xs);
  color: var(--text-primary);
  transition:
    transform 160ms var(--ease-out),
    background 160ms var(--ease-out);
}

.stop::before {
  content: "";
  position: absolute;
  left: -1.35rem;
  top: 0.85rem;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--line-2);
  box-shadow: 0 0 0 3px var(--ground);
  transition:
    transform 180ms var(--ease-spring),
    background 180ms var(--ease-out);
}

.stop:hover {
  background: var(--ground-2);
  transform: translateX(3px);
}

.stop:hover::before {
  transform: scale(1.35);
  background: var(--accent);
}

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

.stop__t {
  font-family: var(--font-data);
  font-size: var(--size-floor);
  color: var(--text-secondary);
  flex: 0 0 auto;
  font-variant-numeric: tabular-nums;
}

.stop__n {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--size-floor);
  color: var(--text-secondary);
  line-height: 1.25;
}

.stop[aria-current="page"] {
  background: var(--accent-wash);
}

.stop[aria-current="page"] .stop__n {
  color: var(--accent);
  font-weight: 800;
}

.stop[aria-current="page"] .stop__t {
  color: var(--accent);
}

.stop[aria-current="page"]::before {
  background: var(--accent);
  transform: scale(1.3);
}

@media (min-width: 1041px) {
  .rail {
    position: sticky;
    top: calc(var(--hdrh, 64px) + 1.1rem);
    align-self: start;
  }
}

@media (max-width: 1040px) {
  .rail {
    position: sticky;
    top: var(--hdrh, 64px);
    z-index: 60;
    padding: 0.5rem 0 0;
    background: var(--ground);
    border-bottom: 1px solid var(--line);

    margin-left: calc(-1 * var(--bleed-l, 0px));
    margin-right: calc(-1 * var(--bleed-r, 0px));
    padding-inline: 1rem;
  }

  .rail__hd {
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
    margin-bottom: 0.5rem;
  }

  .rail__track {
    padding-left: 0;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;

    padding-block: var(--space-2);
    padding-inline: 0 22vw;

    scroll-padding-inline: 32px;

    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 2rem), transparent 100%);
    mask-image: linear-gradient(to right, #000 calc(100% - 2rem), transparent 100%);
  }

  .rail__track::-webkit-scrollbar {
    display: none;
  }

  .rail__track::before {
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
    width: auto;
    height: 2px;
  }

  .rail__fill {
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
    width: auto;
    height: 2px;
    transform: scaleX(var(--p, 0));
    transform-origin: left;
  }

  .rail__puck {
    display: none;
  }

  .rail__list {
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    gap: 0.15rem;
    padding-bottom: 0.5rem;
  }

  .stop {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.1rem;
    padding: 0.35rem 0.7rem 0.6rem;
    white-space: nowrap;
  }

  .stop::before {
    display: none;
  }

  .stop:hover {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .stop,
  .stop::before {
    transition: none;
  }
}

.board {
  background: var(--steel-950);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--elev-2, var(--elev-1));
  border: 1px solid var(--steel-800);
}

.board__bar {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
  background: var(--steel-900);
  border-bottom: 1px solid var(--steel-800);
  font-family: var(--font-data);
  font-size: var(--size-small);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-on-dark-secondary);
}

.board__dots {
  display: flex;
  gap: 5px;
  flex: none;
}

.board__dots i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--steel-800);
  display: block;
}

.board__dots i:first-child {
  background: var(--text-accent);
}

.board__label {
  flex: 1 1 auto;
  min-width: 0;
}

.board__clock {
  font-variant-numeric: tabular-nums;
  flex: none;
}

.board__body {
  padding: var(--space-4);
  color: var(--text-on-dark);
}

.board__foot {
  display: flex;
  gap: 6px;
  padding: 0 var(--space-4) var(--space-4);
  flex-wrap: wrap;
}

.board__foot span {
  font-family: var(--font-data);
  font-size: var(--size-small);
  letter-spacing: 0.06em;
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-pill);
  background: var(--steel-900);
  color: var(--text-on-dark-secondary);
}

.door-row {
  display: block;
}

.door-row .board__body {
  display: grid;
  gap: var(--space-2);
}

.door-row__heading {
  margin: 0;
  font-family: var(--font-display);
}

.door-row__link {
  color: var(--text-on-dark);
  text-decoration: none;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color 140ms var(--ease-out);
}

.door-row__link:hover,
.door-row__link:focus-visible {
  text-decoration: underline;
}

.door-row__link:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 4px;
}

.door-row__evidence {
  margin: 0;
  color: var(--text-on-dark-secondary);
}

.door-row__price {
  margin: 0;
  font-family: var(--font-data);
  font-size: var(--size-small);
  color: var(--text-on-dark-secondary);
}

.door-row__price[data-price-state="published"] {
  color: var(--text-on-dark);
}

.sample-note {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-2);
  margin: var(--space-3) 0 0;
  font-size: var(--size-small);
  color: var(--text-secondary);
}

.sample-note__tag {
  flex: none;
  font-family: var(--font-data);
  font-size: var(--size-small);
  letter-spacing: 0.1em;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  background: var(--surface-sunken);
  color: var(--text-secondary);
}

.sample-note--inline {
  display: inline-flex;
  margin: 0;
}

.sample-note__text {
  flex: 1 1 12rem;
}

.ftgrid {
  display: grid;
  gap: var(--space-4);
  grid-template-columns: 1fr;
}

@media (min-width: 720px) {
  .ftgrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1040px) {
  .ftgrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-6);
  }
}

.ftgrid--single {
  grid-template-columns: 1fr;
  max-width: 46rem;
}

.ft {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-6);
  border-radius: var(--radius-md);
  background: var(--surface-card);

  box-shadow: inset 0 0 0 1px var(--surface-sunken);
  text-decoration: none;
  color: inherit;

  transition:
    transform var(--dur-fast) var(--ease-out),
    box-shadow var(--dur-fast) var(--ease-out);
}

a.ft--go:hover {
  transform: translateY(-2px);
  box-shadow: inset 0 0 0 1px var(--text-accent);
}

a.ft--go:focus-visible {
  transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {

  .ft {
    transition: box-shadow var(--dur-fast) var(--ease-out);
  }

  a.ft--go:hover,
  a.ft--go:focus-visible {
    transform: none;
  }
}

.ft--inert {
  background: var(--surface-sunken);
}

.ft--inert .ftprice,
.ft--inert .ftgo--inert {
  color: var(--text-secondary);
}

.ft--inert .ftchip {
  background: var(--surface-page);
}

.ftstation {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  margin: 0;
  font-family: var(--font-data);
  font-size: var(--size-label);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-secondary);
}

.ftname {
  margin: 0;
  font-size: var(--size-h3);
  line-height: 1.15;
}

.ftdoes {
  margin: 0;
  color: var(--text-secondary);
}

.ftdoes--lead {
  font-size: var(--size-body);
  color: var(--text-primary);
  margin-top: var(--space-2);
}

.ft--slide {
  justify-content: flex-start;
  gap: var(--space-2);
}

.ftdetail {
  margin: 0;
}

.ftwho {
  margin: 0;
  color: var(--text-secondary);
}

.ftwho__label {
  display: block;
  font-family: var(--font-data);
  font-size: var(--size-label);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-nontext);
}

.ftchip {
  display: inline-block;
  padding: 0 var(--space-2);
  border-radius: var(--radius-pill);
  font-size: var(--size-label);
  letter-spacing: 0.04em;
  background: var(--surface-sunken);
  color: var(--text-secondary);
}

.ftchip--live {
  background: var(--surface-accent-wash);
  color: var(--text-accent);
}

.ftdoors {
  display: flex;
  gap: var(--space-2);
  margin: 0;
  padding: 0;
  list-style: none;
}

.ftdoor__mark {
  display: inline-block;
  padding: 0 var(--space-2);
  border-radius: var(--radius-sm);
  font-family: var(--font-data);
  font-size: var(--size-label);
  letter-spacing: 0.08em;
  background: var(--surface-sunken);
  color: var(--text-secondary);
}

.ftdoor--off .ftdoor__mark {
  background: none;
  opacity: 0.85;
}

.ftmeta {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-2);
  margin: 0;
}

@media (min-width: 420px) {
  .ftmeta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.ftmeta dt {
  font-family: var(--font-data);
  font-size: var(--size-label);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-nontext);
}

.ftmeta dd {
  margin: 0;
  font-size: var(--size-small);
  color: var(--text-secondary);
}

.ftprice {
  margin: 0;
  font-family: var(--font-data);
  font-size: var(--size-small);
  color: var(--text-nontext);
}

.ftgo {
  margin-top: auto;
  padding-top: var(--space-2);
  font-size: var(--size-small);
  font-weight: 600;
  color: var(--text-accent);
}

a.ft--go .ftgo::after {
  content: " \2192";
}

.ftgo--inert {
  color: var(--text-nontext);
  font-weight: 400;
}

.ftnote {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  font-size: var(--size-body);
}

.ftnote__title {
  margin: 0;
}

.ftnote p {
  margin: 0;
}

.ftfold {
  border-radius: var(--radius-md);
}

.ftfold__summary {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) 0;
  cursor: pointer;

  list-style: none;
}

.ftfold__summary::-webkit-details-marker {
  display: none;
}

.ftfold__summary::after {
  content: "";
  flex: none;
  margin-inline-start: auto;
  width: 0.55em;
  height: 0.55em;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transform-origin: center;
  transition: transform var(--dur-fast) var(--ease-out);
}

.ftfold[open] > .ftfold__summary::after {
  transform: rotate(-135deg);
}

@media (prefers-reduced-motion: reduce) {

  .ftfold__summary::after {
    transition-duration: 1ms;
  }
}

.ftfold__summary > h2 {
  display: flex;
  align-items: center;
  min-height: 44px;
  margin: 0;
}

.ftcount {
  margin-inline-start: var(--space-3);
  padding: 0 var(--space-2);
  border-radius: var(--radius-pill);
  background: var(--surface-sunken);
  color: var(--text-secondary);
  font-family: var(--font-data);
  font-size: var(--size-label);
}

.ftfold__body {
  padding-top: var(--space-4);
}

.logos {
  padding: var(--space-6) 0 var(--space-8);
}

.logos__lbl {
  text-align: center;
  font-family: var(--font-data);
  font-size: var(--size-floor, 0.9375rem);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin: 0 0 var(--space-6);
  max-width: none;
}

.logos__row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4) var(--space-10);
  justify-content: center;
  align-items: center;
}

.logo {
  font-family: var(--font-display);
  font-variation-settings:
    "wdth" 92,
    "wght" 800;
  font-size: 1.18rem;
  letter-spacing: -0.02em;
  color: var(--ink-2);
  transition: color 220ms var(--ease-out);
}

.logo:hover {
  color: var(--ink);
}

.logos__note {
  text-align: center;
  font-size: var(--size-small);
  color: var(--ink-2);
  margin: var(--space-6) auto 0;
  max-width: 60ch;
}

.car {
  margin-top: var(--space-6);
}

.car__vp {
  overflow: hidden;
  border-radius: var(--r-lg);
}

.car__track {
  display: flex;
  transform: translateX(calc(var(--i, 0) * -100%));
  transition: transform 420ms var(--ease-out);
}

.car__slide {
  flex: 0 0 100%;
  min-width: 0;
}

.car__card {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  overflow: hidden;
  box-shadow: var(--sh-1);
}

.car__card > * {
  min-width: 0;
}

.car__img {
  width: 100%;
  max-width: 720px;
  margin: 0;
}

.car__card .photo__img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
}

.car__t {
  padding: clamp(1.1rem, 2.2vw, 1.9rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--space-2);
}

.car__link {
  color: currentColor;
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
  transition: text-decoration-thickness var(--dur-fast) var(--ease-standard);
}

.car__link:visited {
  color: currentColor;
}

.car__link:hover,
.car__link:focus-visible {
  text-decoration-thickness: 2px;
}

.car__t h3 {
  margin: 0;
  font-family: var(--font-display);
  font-variation-settings:
    "wdth" 100,
    "wght" 800;
  font-size: clamp(1.2rem, 2vw, 1.6rem);
}

.car__t p {
  margin: 0;
  color: var(--ink-2);
  font-size: var(--size-body);
  max-width: 38ch;
}

.car__ix {
  font-family: var(--font-data);
  font-size: var(--size-floor, 0.9375rem);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0;
  max-width: none;
}

@media (max-width: 820px) {
  .car__card {
    grid-template-columns: minmax(0, 1fr);
  }
}

.car__ctl {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
  margin-top: var(--space-4);
}

.car__b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-width: 44px;
  min-height: 44px;
  padding: var(--space-2) var(--space-4);
  border-radius: var(--r-pill);
  border: 1px solid var(--line-2);
  background: var(--panel);
  color: var(--ink);
  cursor: pointer;
  font-family: var(--font-data);
  font-size: var(--size-floor, 0.9375rem);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  transition:
    transform 140ms var(--ease-out),
    border-color 140ms var(--ease-out),
    color 140ms var(--ease-out);
}

.car__b:hover {
  transform: translateY(-2px);
  border-color: var(--accent);
  color: var(--accent);
}

.car__b:active {
  transform: scale(0.96);
}

.car__b svg {
  width: 11px;
  height: 12px;
  flex: 0 0 auto;
}

.car__count {
  font-family: var(--font-data);
  font-size: var(--size-floor, 0.9375rem);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin: 0 var(--space-1);
  max-width: none;
}

.car__dots {
  display: flex;
  gap: 2px;
  margin-left: auto;
  flex-wrap: wrap;
}

.car__dot {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  border-radius: 50%;
}

.car__dot i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--line-2);
  display: block;
  transition:
    transform 180ms var(--ease-pop),
    background-color 180ms var(--ease-out);
}

.car__dot:hover i {
  transform: scale(1.4);
  background: var(--accent);
}

.car__dot[aria-current="true"] i {
  background: var(--accent);
  transform: scale(1.65);
}

@media (max-width: 520px) {
  .car__dot {
    width: 38px;
    height: 44px;
  }

  .car__dots {
    margin-left: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .car__track {
    transition: none;
  }
}

.band {
  background: var(--steel-950);
  color: var(--paper-base);
  position: relative;
  border-radius: var(--r-xl) 0 0 var(--r-xl);
  margin-right: calc(-1 * var(--bleed-r, 0px));
  padding: clamp(3rem, 6vw, 5rem) 0 0;

  --esc-lift: 2.5rem;

  --esc-drop: 2.5rem;

  margin-top: var(--esc-lift);

  margin-bottom: calc(var(--esc-drop) + var(--esc-lift));

  display: flow-root;

  overflow: visible;
}

@media (max-width: 1040px) {
  .band {
    margin-left: calc(-1 * var(--bleed-l, 0px));
    border-radius: 0;
  }
}

.band__in {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.15fr);
  gap: clamp(1.4rem, 4vw, 3rem);
  align-items: end;
  padding-left: clamp(1.2rem, 3vw, 2.6rem);
  padding-right: clamp(1.2rem, 3vw, 2.6rem);
}

@media (max-width: 940px) {
  .band__in {
    grid-template-columns: minmax(0, 1fr);
  }
}

.band h2 {
  color: var(--paper-base);
  max-width: 15ch;
}

.band--intro {

  margin-top: clamp(3rem, 6vw, 5.5rem);
}

.band__in--intro {
  grid-template-columns: minmax(0, 1fr);
}

.band__in--intro .band__txt p {
  max-width: 60ch;
}

.band__in--door {

  align-items: center;
  padding-bottom: clamp(1.4rem, 3vw, 2.4rem);

  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);

  padding-right: calc(clamp(1.2rem, 3vw, 2.6rem) + var(--bleed-r, 0px));
}

.band--right .band__in--door {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
}

.band--door {
  margin-top: clamp(3rem, 6vw, 5.5rem);
}

.band--door .band__esc {
  margin-top: 0;
}

.band__esc {
  padding-left: clamp(1.2rem, 3vw, 2.6rem);
  padding-right: calc(clamp(1.2rem, 3vw, 2.6rem) + var(--bleed-r, 0px));
}

.band__fig {
  min-width: 0;
  border-radius: var(--r-lg);

  overflow: hidden;
  box-shadow: var(--sh-2);
}

.band__fig .photo,
.band__fig .photo__img {
  display: block;
  width: 100%;
  height: auto;
}

.band--right .band__in--door > .band__txt {
  order: 2;
}

.band--right .band__in--door > .band__fig {
  order: 1;
}

@media (max-width: 940px) {
  .band--right .band__in--door > .band__txt,
  .band--right .band__in--door > .band__fig {
    order: 0;
  }
}

.band--door .band__txt h2 {
  max-width: 22ch;
}

.band__txt p {
  color: var(--ember-100);
  font-size: 1.02rem;
  margin: var(--space-4) 0 0;
  max-width: 42ch;
}

.band .stamp {
  color: var(--ember-300);
}

.band .stamp i {
  background: var(--ember-300);
}

.band__esc {
  position: relative;
  z-index: 3;

  margin-top: calc(-1 * clamp(3rem, 6vw, 5rem) - var(--esc-lift));
  margin-bottom: calc(-1 * var(--esc-drop));
  align-self: start;
  display: grid;
  gap: var(--space-4);
}

@media (max-width: 940px) {
  .band__esc {

    margin-top: 0;
  }

  .band--door {

    margin-top: 0;

    --esc-drop: 4.5rem;
  }
}

.band__foot {
  padding: 3.6rem clamp(1.2rem, 3vw, 2.6rem) 2.2rem;
}

.band p.band__k {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-6);
  font-family: var(--font-data);
  font-size: var(--size-floor, 0.9375rem);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ember-300);
  margin: 0;
  max-width: none;
}

.door-row h3.board__label {
  font-family: var(--font-display);
  font-variation-settings:
    "wdth" 100,
    "wght" 700;
  font-size: var(--size-h4);
  letter-spacing: -0.01em;
  text-transform: none;
  color: var(--text-on-dark);
  margin: 0;
}

.door-row .board__label-link {
  color: inherit;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color 140ms var(--ease-out);
}

.door-row .board__label-link:hover {
  color: var(--accent-hi);
}

.door-row .board__label-link:focus-visible {
  outline: 2px solid var(--focus-ring-on-dark, var(--ember-400));
  outline-offset: 4px;
}

.post {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: var(--space-4);
  box-shadow: var(--sh-1);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  max-width: 440px;
  margin: var(--space-6) 0 0;
  transition: transform 280ms var(--ease-out);
}

.post:hover {
  transform: translateY(-4px) rotate(-0.4deg);
}

.post__top {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.who__face {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  flex: 0 0 auto;
  background: var(--grad-ember);
  display: grid;
  place-items: center;
  color: #fff;
  font-family: var(--font-display);
  font-variation-settings:
    "wdth" 100,
    "wght" 800;
  font-size: 0.95rem;
}

.who__face--photo {
  background: var(--surface-sunken, #e9edf1);
  overflow: hidden;
  padding: 0;
}

.who__face--photo picture,
.who__face--photo img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  object-position: center 40%;
}

.who__n {
  font-family: var(--font-display);
  font-variation-settings:
    "wdth" 100,
    "wght" 700;
  font-size: var(--size-small);
  line-height: 1.2;
  display: block;
}

.who__r {
  font-size: var(--size-small);
  color: var(--ink-3);
}

.post__body {
  margin: 0;
  color: var(--ink);
  border: 0;
  padding: 0;
}

.post__body p {
  margin: 0;
  font-size: var(--size-body);
}

.post__foot {
  display: flex;
  gap: var(--space-4);
  font-family: var(--font-data);
  font-size: var(--size-small);
  color: var(--ink-3);
  margin-top: auto;
  padding-top: var(--space-2);
  border-top: 1px solid var(--line);
}

.post__foot button {
  background: none;
  border: 0;
  padding: var(--space-2) 0;
  min-height: 44px;
  font: inherit;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  transition:
    color 180ms var(--ease-out),
    transform 180ms var(--ease-pop);
}

.post__foot button:hover,
.post__foot button[aria-pressed="true"] {
  color: var(--accent);
}

.post__foot button:active {
  transform: scale(0.92);
}

.post__nothing {
  margin: 0;
  font-size: var(--size-small);
  color: var(--ink-3);
}

.fake {
  font-family: var(--font-data);
  font-size: var(--size-floor, 0.9375rem);
  letter-spacing: 0.06em;
  line-height: 1.45;
  text-transform: uppercase;
  color: var(--ink-2);
  margin: var(--space-4) 0 0;
  max-width: 60ch;
}

.rot--proof .post {

  max-width: none;

  background: var(--ground-2);
  border: 0;
  box-shadow: none;

  margin: 0;

  height: 100%;
  padding: var(--space-6);
}

[data-rotator][data-rotator-ready="true"].rot--proof .rot__slide {
  display: flex;
}

.rot--proof .post:hover {
  transform: none;
}

.rot--proof .post {
  max-width: 340px;
  margin-inline: auto;
}

.post__link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: inherit;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.25em;
  transition: color 180ms var(--ease-out);
}

.post__link:hover {
  color: var(--accent);
}

.rot--proof .post__body {
  max-width: none;
}

.cta {
  background: var(--grad-ember);
  color: #fff;
  border-radius: var(--r-xl);
  padding: clamp(2.2rem, 5vw, 3.4rem);
  text-align: center;
  box-shadow: var(--sh-3);
  margin-top: clamp(3rem, 6vw, 5.5rem);
}

.cta h2 {
  color: #fff;
  margin: 0 0 var(--space-4);
}

.cta p {
  color: rgb(255 255 255 / 92%);
  margin: 0 auto var(--space-6);
  max-width: 52ch;
}

.cta .btn {
  background: #fff;
  color: var(--ember-800);
  box-shadow: 0 10px 26px -12px rgb(0 0 0 / 50%);
}

.cta .btn:hover {
  background: #fff;
  transform: translateY(-2px);
}

.cta--steel {
  background: var(--grad-steel);
}

.cta--steel .btn {
  background: var(--accent);
  color: var(--accent-ink);
}

.cta--steel .btn:hover {
  background: var(--accent-hi);
}

.rot__slide + .rot__slide {
  margin-top: var(--space-8);
}

.rot__ctl {
  display: none;
}

[data-rotator][data-rotator-ready="true"] .rot__vp {
  overflow: hidden;
  border-radius: var(--r-lg);
}

[data-rotator][data-rotator-ready="true"] .rot__track {
  display: flex;

  transform: translateX(calc(var(--i, 0) * -100% / var(--per, 1)));
  transition: transform var(--dur-rail) var(--ease-out);
}

[data-rotator][data-rotator-ready="true"] .rot__slide {
  flex: 0 0 calc(100% / var(--per, 1));
  min-width: 0;
  margin-top: 0;
}

html[data-rot-early] [data-rotator]:not([data-rotator-per-view]) .rot__vp {
  overflow: hidden;
  border-radius: var(--r-lg);
}

html[data-rot-early] [data-rotator]:not([data-rotator-per-view]) .rot__track {
  display: flex;
}

html[data-rot-early] [data-rotator]:not([data-rotator-per-view]) .rot__slide {
  flex: 0 0 100%;
  min-width: 0;
  margin-top: 0;
}

html[data-rot-early]
  [data-rotator]:not([data-rotator-per-view]):not([data-rotator-ready])
  .rot__slide:not(:first-child),
html[data-rot-early]
  [data-rotator]:not([data-rotator-per-view]):not([data-rotator-ready])
  .rot__ctl {
  visibility: hidden;
}

[data-rotator][data-rotator-per-view] {
  --per: var(--per-base, 1);
}

@media (min-width: 768px) {
  [data-rotator][data-rotator-per-view] {
    --per: var(--per-md, 1);
  }
}

@media (min-width: 1041px) {
  [data-rotator][data-rotator-per-view] {
    --per: var(--per-lg, 1);
  }
}

[data-rotator][data-rotator-per-view][data-rotator-ready="true"] .rot__slide {
  padding-inline: var(--space-3);
}

[data-rotator][data-rotator-ready="true"] .rot__ctl {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
  margin-top: var(--space-4);
}

html[data-rot-early] [data-rotator]:not([data-rotator-per-view]) .rot__ctl {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
  margin-top: var(--space-4);
}

.rot__b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);

  min-width: 44px;
  min-height: 44px;
  padding: var(--space-2) var(--space-4);
  border: 1px solid var(--line-2);
  border-radius: var(--r-pill);
  background: var(--panel);
  color: var(--ink);
  cursor: pointer;
  font-family: var(--font-data);
  font-size: var(--size-label);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  transition:
    transform var(--dur-fast) var(--ease-out),
    border-color var(--dur-fast) var(--ease-out),
    color var(--dur-fast) var(--ease-out);
}

.rot__b:hover {
  transform: translateY(-2px);
  border-color: var(--accent);
  color: var(--accent);
}

.rot__b:active {
  transform: scale(0.96);
}

.rot__b svg {
  width: 11px;
  height: 12px;
  flex: 0 0 auto;
}

.rot__count {
  margin: 0 var(--space-1);
  font-family: var(--font-data);
  font-size: var(--size-label);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-3);
}

.rot__dots {
  display: flex;
  gap: var(--space-1);
  margin-left: auto;
  flex-wrap: wrap;
}

.rot__dot {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  border-radius: 50%;
}

.rot__dot i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--line-2);
  display: block;
  transition:
    transform var(--dur-fast) var(--ease-pop, var(--ease-out)),
    background var(--dur-fast) var(--ease-out);
}

.rot__dot:hover i {
  transform: scale(1.4);
  background: var(--accent);
}

.rot__dot[aria-current="true"] i {
  background: var(--accent);
  transform: scale(1.65);
}

@media (max-width: 520px) {
  .rot__dot {
    width: 38px;
    height: 44px;
  }
  .rot__dots {
    margin-left: 0;
  }
}

@media (prefers-reduced-motion: reduce) {

  [data-rotator][data-rotator-ready="true"] .rot__track {
    transition-duration: 1ms;
  }
  .rot__b,
  .rot__dot i {
    transition-duration: 1ms;
  }
}

.wrap-wide {
  width: min(1400px, 100% - 2rem);
  margin-inline: auto;
}

.wrap-wide > * {
  min-width: 0;
}

.railcol {
  min-width: 0;
}

.stopsec__label {
  margin: 0 0 var(--space-4);
}

.stage {
  position: relative;
  border-radius: var(--r-xl);
  overflow: hidden;
  background: var(--steel-950);
  box-shadow: var(--sh-3);
  isolation: isolate;
}

.stage__img-track {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.stage__img-track .rot__track,
.stage__img-track .rot__slide,
.stage__img,
.stage__img .photo__img {
  height: 100%;
}

.stage__img .photo__img {
  width: 100%;
  object-fit: cover;

  object-position: 58% 50%;
  border-radius: 0;
}

.stage__type {
  position: relative;
  z-index: 2;
  background: var(--steel-950);
  width: min(66%, 720px);
  min-height: clamp(420px, 44vw, 600px);
  padding: clamp(1.5rem, 3vw, 2.9rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1.15rem;
}

.stage h1,
.stage h2 {
  color: #fff;
}

.stage .lede {
  color: rgb(255 255 255 / 88%);
  max-width: 40ch;
}

.stage .badge {
  background: var(--steel-800);
  border-color: var(--steel-800);
  color: #fff;
  box-shadow: none;
  align-self: flex-start;
}

.stage .badge svg {
  width: 9px;
  height: 11px;
  flex: 0 0 auto;
}

.stage .prov,
.stage-figure .prov {
  color: var(--text-secondary);
}

.stage-figure {
  margin: 0;
}

.stage__type > .rot__fixed {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.15rem;
}

.stage__type > .rot__vp {
  min-width: 0;
  width: 100%;

  padding-block: 0.35em 0.1em;
}

.stage__type .rot__slide {
  padding-inline-start: 3px;
}

.stage__offer {
  margin: 0.9rem 0 0;
  max-width: 46ch;
  font-size: var(--size-small);
  color: rgb(255 255 255 / 88%);
}

.stage__type > .rot__ctl {
  margin-top: 0;
}

.stage .rot__b {
  background: transparent;
  border-color: var(--steel-800);
  color: rgb(255 255 255 / 88%);
}

.stage .rot__b:hover {
  border-color: var(--accent-hi);
  color: var(--accent-hi);
}

.stage .rot__count {
  color: rgb(255 255 255 / 88%);
}

@media (max-width: 900px) {

  .stage {
    padding-bottom: 170px;
  }

  .stage__type {
    width: 100%;
    min-height: 0;
    padding: 1.4rem 1.2rem 1.9rem;
  }

  .stage__img .photo__img {
    object-position: 50% 40%;
  }
}

.circled {
  position: relative;
  display: inline-block;
  white-space: nowrap;
}

.circled svg {
  position: absolute;
  left: -6%;
  top: -16%;
  width: 112%;
  height: 132%;
  overflow: visible;
  pointer-events: none;
}

.circled svg path {
  fill: none;
  stroke: var(--accent);
  stroke-width: 7;
  stroke-linecap: round;
  stroke-dasharray: 1400;

  stroke-dashoffset: 0;
  transition: stroke-dashoffset 1.1s cubic-bezier(0.33, 1, 0.68, 1) 0.25s;
}

.circled.in svg path {
  stroke-dashoffset: 0;
}

.stage .circled svg {
  left: -12.3%;
  width: 142.3%;
  top: -21.5%;
  height: 148%;
}

.stage .circled svg path {
  stroke: var(--ember-400);
  stroke-width: 8;

  transition: stroke-dashoffset 1.5s cubic-bezier(0.62, 0.03, 0.36, 1) 0.35s;
}

@media (prefers-reduced-motion: reduce) {
  .circled svg path {
    stroke-dashoffset: 0 !important;
  }
}

.logo-wall {
  margin-bottom: var(--space-12);
}

.logo-wall__label {
  text-align: center;
  margin: 0 0 var(--space-6);
}

.logo-wall__row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4) clamp(var(--space-4), 3vw, var(--space-10));
  justify-content: center;
  align-items: center;
}

@media (min-width: 1041px) {
  .logo-wall__row {
    flex-wrap: nowrap;
  }
}

.logo-wall__mark {
  font-family: var(--font-display);
  font-variation-settings:
    "wdth" 92,
    "wght" 800;
  font-size: var(--size-label);
  letter-spacing: 0.08em;

  color: var(--text-secondary);
  transition: color var(--dur-fast) var(--ease-out);
}

.logo-wall__mark:hover {
  color: var(--ink);
}

.logo-wall .sample-note {
  margin-top: var(--space-6);
  max-width: 62ch;
  margin-inline: auto;
}

.rooms-head {
  max-width: 42ch;
  margin-bottom: var(--space-8);
}

.rooms-head h2 {
  margin: 0;
  max-width: 18ch;
}

[data-rotator-ready="true"].rooms .rot__slide {
  display: flex;
}

.room {
  margin: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  overflow: hidden;
  box-shadow: var(--sh-1);
}

.room__img {
  display: block;
  margin: 0 auto;
  width: 100%;
}

@media (min-width: 1024px) {
  .room__img {
    max-width: 720px;
  }
}

.room__img .photo__img {
  border-radius: 0;
}

.room__cap {
  padding: var(--space-6) var(--space-6) var(--space-8);
}

.room__cap h3 {
  margin: 0;
}

.door-stack {
  display: flex;
  flex-direction: column;
  gap: var(--space-12);
  margin-top: var(--space-10);
}

.door-block__eyebrow {
  margin: 0 0 var(--space-2);
  color: var(--accent);
}

.door-block__foryou {
  margin: 0 0 var(--space-4);
  color: var(--text-secondary);
  max-width: 52ch;
}

.door-block__lede {
  margin: var(--space-4) 0 0;
  max-width: 60ch;
}

.post-wrap {
  max-width: 440px;
}

.post {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: var(--space-6);
  box-shadow: var(--sh-1);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  transition: transform var(--dur-slow) var(--ease-out);
}

.post:hover {
  transform: translateY(-4px) rotate(-0.4deg);
}

@media (prefers-reduced-motion: reduce) {

  .post {
    transition-duration: 1ms;
  }
  .post:hover {
    transform: none;
  }
}

.post__top {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.post__face {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  flex: 0 0 auto;
  background: var(--grad-ember);
  display: grid;
  place-items: center;
  color: var(--accent-ink);
  font-family: var(--font-display);
  font-variation-settings:
    "wdth" 100,
    "wght" 800;
  font-size: var(--size-label);
}

.post__n {
  font-family: var(--font-display);
  font-variation-settings:
    "wdth" 100,
    "wght" 700;
  line-height: 1.2;
  display: block;
}

.post__r {
  font-size: var(--size-small);
  color: var(--text-secondary);
}

.post__body {
  margin: 0;
  color: var(--text-primary);
}

.post__foot {
  display: flex;
  gap: var(--space-6);
  font-family: var(--font-data);
  font-size: var(--size-label);
  color: var(--text-secondary);
}

.post__foot button {
  background: none;
  border: 0;
  padding: 0;
  min-height: 44px;
  font: inherit;
  color: inherit;
  cursor: pointer;
  transition:
    color var(--dur-fast) var(--ease-out),
    transform var(--dur-fast) var(--ease-out);
}

.post__foot button:hover,
.post__foot button[aria-pressed="true"] {
  color: var(--accent);
}

.post__foot button:active {
  transform: scale(0.92);
}

.fake {
  font-family: var(--font-data);
  font-size: var(--size-small);
  letter-spacing: 0.1em;
  color: var(--text-secondary);
  margin: var(--space-6) 0 0;
  max-width: 62ch;
}

.wordmark__plate {
  width: 32px;
  height: 32px;
  border-radius: var(--r-xs);
  background: var(--grad-ember);
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  box-shadow: var(--sh-1);
  color: var(--accent-ink);
  margin-inline-end: var(--space-3);
}

.wordmark__plate svg {
  width: 21px;
  height: 21px;
}

.dsp {
  font-family: var(--font-display);
  margin: 0;
  font-variation-settings:
    "wdth" 100,
    "wght" 800;
  line-height: 0.98;
  letter-spacing: -0.028em;
  text-wrap: balance;
}

.d-hero {
  font-size: clamp(2.9rem, 6.6vw, 5.4rem);
}

.d1 {
  font-size: clamp(2.3rem, 4.6vw, 3.5rem);
}

.d2 {
  font-size: clamp(1.6rem, 2.6vw, 2.15rem);
  letter-spacing: -0.02em;
}

.eyebrow {
  font-family: var(--font-data);
  font-size: var(--size-label);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 var(--space-3);
}

.badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.42rem 0.95rem;
  border-radius: var(--r-pill);
  background: var(--panel);
  border: 1px solid var(--line);
  box-shadow: var(--sh-1);
  font-family: var(--font-data);

  font-size: var(--size-label);
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--ink-2);
}

.badge--solid {
  background: var(--accent-wash);
  border-color: transparent;
  color: var(--accent);
}

.badge__dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--accent);
}

.badge svg {
  width: 9px;
  height: 11px;
  flex: 0 0 auto;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  font-family: var(--font-display);
  font-variation-settings:
    "wdth" 100,
    "wght" 700;
  font-size: 1rem;

  min-height: 44px;
  padding: 0.92rem 1.7rem;
  border-radius: var(--r-pill);
  border: 2px solid transparent;
  background: var(--accent);
  color: var(--accent-ink);
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 6px 18px -8px rgb(168 66 10 / 70%);
  transition:
    transform 0.18s cubic-bezier(0.33, 1, 0.68, 1),
    box-shadow 0.18s ease,
    background 0.18s ease;
}

.btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 26px -10px rgb(168 66 10 / 80%);
  background: var(--accent-hi);
}

.btn:active {
  transform: translateY(0);
}

.btn:focus-visible {

  outline: 3px solid var(--focus-ring);
  outline-offset: 3px;
}

.btn--dark {
  background: var(--steel-950);
  color: #fff;
  box-shadow: 0 6px 18px -8px rgb(15 23 32 / 60%);
}

.btn--dark:hover {
  background: var(--steel-800);
}

.btn--ghost {
  background: transparent;
  color: var(--ink);
  border-color: var(--line-2);
  box-shadow: none;
}

.btn--ghost:hover {
  border-color: var(--accent);
  color: var(--accent);
  background: transparent;
  box-shadow: none;
}

.btn--lg {
  font-size: 1.08rem;
  padding: 1.05rem 2rem;
}

@media (prefers-reduced-motion: reduce) {

  .btn {
    transition-duration: 1ms;
  }
  .btn:hover {
    transform: none;
  }
}

.lede {
  font-size: clamp(1.08rem, 1.35vw, 1.28rem);
  color: var(--ink-2);
  max-width: 56ch;
  margin: 0;
}

.prov {
  font-family: var(--font-data);

  font-size: var(--size-small);
  letter-spacing: 0.09em;
  color: var(--ink-3);
  text-transform: uppercase;
  margin: 0.55rem 0 0;
}

.stop--untimed {
  gap: 0;
}

.stop--afterclock {
  border-top: 1px solid var(--line);
  margin-top: 0.4rem;
  padding-top: 0.6rem;
}

.structure-switcher ol {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
}

.structure-switcher__item {
  display: flex;
  align-items: baseline;
  gap: var(--space-3);
  min-height: 48px;
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--rule-structural);
  background: var(--surface-page);
  color: var(--text-secondary);
  text-decoration: none;

  border-top: 3px solid transparent;
  transition: background-color var(--dur-fast) var(--ease-standard);
}

.structure-switcher__number {
  font-size: var(--size-data);
  color: var(--text-secondary);
}

.structure-switcher__label {
  font-family: var(--font-body);
  font-size: var(--size-small);
}

.structure-switcher li + li .structure-switcher__item {
  margin-block-start: -1px;
}

.structure-switcher li:first-child .structure-switcher__item {
  border-start-start-radius: var(--radius-md);
  border-start-end-radius: var(--radius-md);
}

.structure-switcher li:last-child .structure-switcher__item {
  border-end-start-radius: var(--radius-md);
  border-end-end-radius: var(--radius-md);
}

.structure-switcher__item--inert {
  color: var(--text-secondary);
  background: transparent;
}

a.structure-switcher__item:hover {
  background: var(--surface-raised);
  color: var(--text-primary);
}

a.structure-switcher__item:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

.structure-switcher__item[aria-current="page"] {
  background: var(--surface-sunken);
  color: var(--text-primary);
  font-weight: 600;
  border-top-color: var(--text-accent);
}

.structure-switcher__item[aria-current="page"] .structure-switcher__number {
  color: var(--text-primary);
}

@media (min-width: 768px) {
  .structure-switcher ol {
    grid-template-columns: repeat(3, 1fr);
  }
  .structure-switcher li + li .structure-switcher__item {
    margin-block-start: 0;
    margin-inline-start: -1px;
  }
  .structure-switcher li:first-child .structure-switcher__item {
    border-radius: var(--radius-md) 0 0 var(--radius-md);
  }
  .structure-switcher li:last-child .structure-switcher__item {
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
  }
}

.stat-row {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-6) var(--space-4);
}

.stat-row__item {
  display: flex;
  flex-direction: column-reverse;
  gap: var(--space-1);
}

.stat-row__item dd {
  margin: 0;
}

.stat-row__item:nth-child(5) {
  grid-column: 1 / -1;
}

@media (min-width: 768px) {
  .stat-row {
    grid-template-columns: repeat(3, 1fr);
  }
  .stat-row__item:nth-child(5) {
    grid-column: auto;
  }
}

@media (min-width: 1024px) {
  .stat-row {
    grid-template-columns: repeat(5, 1fr);
    gap: var(--space-8);
  }
}

.stat-row__rail {
  margin-top: var(--space-6);
  padding-top: var(--space-4);
  border-top: 1px solid var(--rule-decorative);
}

.status-banner {
  margin-bottom: var(--space-6);
}

.status-banner__legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin: 0 0 var(--space-3);
}

.toc--rail {
  position: static;
}

.toc--rail ol {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  list-style: none;
  margin: var(--space-3) 0 0;
  padding: 0;
}

.toc--rail a {
  min-height: 0;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--rule-decorative);
  border-radius: var(--radius-pill);
  background: var(--surface-page);
  color: var(--text-secondary);
  font-size: var(--size-small);
  transition:
    background-color var(--dur-fast) var(--ease-standard),
    border-color var(--dur-fast) var(--ease-standard),
    color var(--dur-fast) var(--ease-standard);
}

.toc--rail a:hover,
.toc--rail a:focus-visible {
  color: var(--text-primary);
  border-color: var(--rule-structural);
  text-decoration: underline;
}

.toc--rail a:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

.hero-continuation {
  margin: var(--space-8) 0 0;
  max-width: 70ch;
  color: var(--text-secondary);
}

.price-status {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-pill);
  font-family: var(--font-data);
  font-size: var(--size-label);
  white-space: nowrap;
  vertical-align: middle;
}

.price-status__glyph {
  width: 8px;
  height: 8px;
  border-radius: var(--radius-sm);
  flex: 0 0 auto;
}

.price-status--locked {
  background: var(--surface-accent-wash);
  color: var(--text-accent);
}

.price-status--locked .price-status__glyph {
  background: currentColor;
}

.price-status--proposed {
  background: transparent;
  border: 1px dashed var(--rule-structural);
  color: var(--text-secondary);
}

.price-status--proposed .price-status__glyph {
  border: 2px solid currentColor;
}

.price-value {
  margin: 0;
}

.price-value--locked {
  color: var(--text-primary);
}

.price-value--proposed {
  color: var(--text-secondary);
}

.level-cards {
  display: grid;
  gap: var(--space-6);
}

.level-card {
  background: var(--surface-card);
  border-radius: var(--radius-md);
  padding: var(--space-6);
  min-width: 0;
}

.level-card__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
}

.level-card__head h3 {
  margin: 0;
}

.level-card__sub {
  margin: var(--space-2) 0 0;
  color: var(--text-secondary);
  max-width: 34ch;
}

.level-card__pricing {
  margin-top: var(--space-6);
}

.level-card__subprice {
  margin: var(--space-1) 0 0;
  color: var(--text-secondary);
}

.level-card__leadin {
  margin: var(--space-6) 0 0;
  color: var(--text-secondary);
}

.level-card__tail {
  margin-top: var(--space-4);
}

.level-card__bullets {
  gap: var(--space-3);
}

.level-card__bullets li {
  font-family: var(--font-body);
  font-size: var(--size-small);
  font-weight: 400;
  line-height: 1.5;
}

.level-card__bullets li::before {
  top: 0.65em;
}

.level-card__action {
  margin: var(--space-6) 0 0;
}

@media (min-width: 768px) {
  .level-cards {
    grid-template-columns: repeat(2, 1fr);
  }
  .level-card {
    padding: var(--space-8);
  }
  .level-card__bullets li {
    font-size: var(--size-body);
  }
}

@media (min-width: 1280px) {
  .level-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: auto auto auto auto auto;
  }
  .level-card {
    grid-row: span 5;
    display: grid;
    grid-template-rows: subgrid;
    row-gap: 0;
  }
}

.pull-quote__body {
  margin: var(--space-4) 0 0;
  max-width: 46ch;
  color: var(--text-primary);
}

.section--wash .pull-quote__body {
  border-top: 3px solid var(--text-accent);
  padding-top: var(--space-6);
}

.grouped-table__wide {
  display: none;
}

.grouped-table__small {
  display: block;
}

@media (min-width: 1024px) {
  .grouped-table__wide {
    display: block;
  }
  .grouped-table__small {
    display: none;
  }
}

.grouped-table th,
.grouped-table td {
  padding: var(--space-2) var(--space-4);
  vertical-align: baseline;
}

.grouped-table .c-name {
  width: 20ch;
  min-width: 14ch;
}

.grouped-table .c-price {
  width: 14ch;
}

.grouped-table .c-what {
  font-size: var(--size-small);
  color: var(--text-primary);
  max-width: 80ch;
}

.c-price__amount {
  display: block;
  color: var(--text-primary);
}

.c-price__unit {
  display: block;
  font-size: var(--size-small);
  color: var(--text-secondary);
}

.grouped-table__grouprow th {
  background: var(--surface-sunken);
  color: var(--text-primary);
  font-family: var(--font-body);
  font-size: var(--size-label);
  font-weight: 600;
  letter-spacing: 0.02em;
  border-bottom: 1px solid var(--rule-structural);
}

.grouped-table__smallgroup {
  margin-top: var(--space-8);
}

.grouped-table__smallheading {
  position: sticky;
  top: var(--header-height);
  z-index: 1;
  margin: 0;
  padding-block: var(--space-2);
  background: var(--surface-page);
  border-bottom: 1px solid var(--rule-structural);
}

.section--bleed .grouped-table__smallheading {
  background: var(--surface-raised);
}

.grouped-row {
  padding: var(--space-4) 0;
  border-bottom: 1px solid var(--rule-decorative);

  scroll-margin-top: calc(var(--pinoff, 64px) + var(--space-12));
}

.grouped-row h4 {
  margin: 0;
}

.grouped-row__meta {
  margin: var(--space-2) 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
  gap: var(--space-4);
}

.grouped-row__meta dt {
  font-size: var(--size-label);
  color: var(--text-secondary);
}

.grouped-row__meta dd {
  margin: 0;
  font-size: var(--size-small);
}

.grouped-row__what {
  margin: var(--space-2) 0 0;
}

.grouped-row__what dd {
  margin: 0;
  font-size: var(--size-small);
}

@media print {
  .toc--rail,
  .grouped-table__small {
    display: none;
  }
  .grouped-table__wide {
    display: block;
  }
  .grouped-table__smallheading {
    position: static;
  }
}

.placeholder-image {
  margin: var(--space-8) 0;
}

.placeholder-image__frame {
  aspect-ratio: var(--placeholder-ratio, 16 / 9);
  display: grid;
  place-items: center;
  border: 1px dashed var(--rule-structural);
  border-radius: var(--radius-lg);
  background-color: var(--surface-sunken);
  background-image: repeating-linear-gradient(
    135deg,
    transparent 0,
    transparent 10px,
    rgb(100 121 143 / 12%) 10px,
    rgb(100 121 143 / 12%) 20px
  );
}

.placeholder-image__tag {
  font-family: var(--font-data);
  font-size: var(--size-label);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-secondary);
  background: var(--surface-card);
  border: 1px solid var(--rule-structural);
  border-radius: var(--radius-pill);
  padding: var(--space-2) var(--space-4);
}

.placeholder-image__caption {
  margin-top: var(--space-3);
  font-size: var(--size-small);
  color: var(--text-secondary);
  max-width: 60ch;
}

.live-demo {
  border: 1px solid var(--rule-structural);
  border-radius: var(--radius-lg);
  padding: var(--space-4);
  background: var(--surface-raised);
  margin: var(--space-8) 0;
}

.live-demo__bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}

.live-demo__badge {
  font-family: var(--font-data);
  font-size: var(--size-label);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--action-label);
  background: var(--action-fill);
  border-radius: var(--radius-pill);
  padding: var(--space-1) var(--space-3);
}

.live-demo__title {
  font-family: var(--font-display);
  font-weight: 700;
  color: var(--text-primary);
}

.live-demo__hint {
  margin: var(--space-4) 0 0;
  font-size: var(--size-small);
  color: var(--text-secondary);
  max-width: 62ch;
}

.live-demo__keys {
  display: inline-block;
  font-family: var(--font-data);
  font-size: var(--size-label);
  color: var(--text-secondary);
  border: 1px solid var(--rule-structural);
  border-radius: var(--radius-sm);
  padding: 0 var(--space-2);
}

button.ticket-card__item {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  width: 100%;
  min-height: 44px;
  text-align: start;
  background: none;
  border: 0;
  border-radius: var(--radius-sm);
  padding: var(--space-2) var(--space-2);
  cursor: pointer;
  font: inherit;
  color: inherit;
  position: relative;
  transition: background-color var(--dur-fast) var(--ease-standard);
}

button.ticket-card__item:hover {
  background-color: var(--steel-200);

}

.ticket-card__item-text {
  position: relative;
}

.ticket-card__item-text::after {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 50%;
  width: 100%;
  height: 2px;
  background: var(--ember-600);

  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--dur-base) var(--ease-out);
}

button.ticket-card__item[data-struck="true"] .ticket-card__item-text::after {
  transform: scaleX(1);
}

button.ticket-card__item[data-struck="true"] {
  color: var(--steel-600);

}

button.ticket-card__item[data-struck="true"] .ticket-card__made {
  opacity: 1;
}

.ticket-card__made {
  margin-inline-start: auto;
  font-family: var(--font-data);
  font-size: var(--size-label);
  color: var(--ember-600);

  opacity: 0;
  transition: opacity var(--dur-fast) var(--ease-standard);
}

.ticket-card__progress {
  font-family: var(--font-data);
  font-size: var(--size-label);
  color: var(--steel-600);

}

button.ticket-card__item[data-void="true"] .ticket-card__item-text::after {
  background: #9a1c12;
}

button.ticket-card__item[data-void="true"] {
  color: #9a1c12;
}

button.ticket-card__item[data-void="true"] .ticket-card__made {
  display: none;
}

.ticket-card__void {
  margin-inline-start: auto;
  font-family: var(--font-data);
  font-size: var(--size-label);
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #9a1c12;

}

.ticket-rail__card[data-has-void="true"] {

  box-shadow: inset 0 0 0 2px #9a1c12;
}

.ticket-rail__card[data-all-struck="true"] {
  box-shadow: inset 0 0 0 2px var(--ember-600);
  transition: box-shadow var(--dur-base) var(--ease-standard);
}

.ticket-card__timer {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-data);
  font-variant-numeric: tabular-nums;
  transition: color var(--dur-base) var(--ease-standard);
}

.ticket-card__timer[data-timer-state="fresh"] {
  color: var(--steel-600);
}

.ticket-card__timer[data-timer-state="warn"] {
  color: var(--ember-600);
}

.ticket-card__timer[data-timer-state="late"] {
  color: #9a1c12;
}

.timer-dot {
  width: 10px;
  height: 10px;
  border-radius: var(--radius-pill);
  border: 2px solid currentcolor;
  transition: background-color var(--dur-base) var(--ease-standard);
}

.ticket-card__timer[data-timer-state="fresh"] .timer-dot {
  background-color: currentcolor;
}

.ticket-card__timer[data-timer-state="warn"] .timer-dot {
  background-color: transparent;
}

.ticket-card__timer[data-timer-state="late"] .timer-dot {
  background-color: transparent;
  border-style: dashed;
}

.timer-word {
  font-size: var(--size-label);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.ticket-card__timer[data-timer-pulse="true"] {
  animation: timer-pulse 600ms var(--ease-out) 1;
}

@keyframes timer-pulse {
  0% {
    transform: scale(1);
  }

  40% {
    transform: scale(1.12);
  }

  100% {
    transform: scale(1);
  }
}

.routing-board {
  display: grid;
  gap: var(--space-4);
  margin-top: var(--space-4);
}

@media (min-width: 640px) {
  .routing-board {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  }
}

.routing-station {
  border: 1px solid var(--rule-structural);
  border-radius: var(--radius-md);
  background: var(--surface-card);
  padding: var(--space-3);
  min-height: 132px;
  transition:
    background-color var(--dur-base) var(--ease-standard),
    box-shadow var(--dur-base) var(--ease-standard);
}

.routing-station[data-drop-target="true"],
.routing-station[data-received="true"] {
  background-color: var(--surface-accent-wash);
  box-shadow: inset 0 0 0 2px var(--action-fill);
}

.routing-station__name {
  font-family: var(--font-data);
  font-size: var(--size-label);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-secondary);
  margin: 0 0 var(--space-2);
}

.routing-station__items {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-2);
}

.routing-item {
  display: block;
  width: 100%;
  min-height: 44px;
  text-align: start;
  font: inherit;
  color: var(--text-primary);
  background: var(--surface-raised);
  border: 1px solid var(--rule-structural);
  border-radius: var(--radius-sm);
  padding: var(--space-2) var(--space-3);
  cursor: pointer;
  transition:
    background-color var(--dur-fast) var(--ease-standard),
    transform var(--dur-fast) var(--ease-standard);
}

.routing-item:hover {
  background-color: var(--surface-accent-wash);
}

.routing-item:active {
  transform: scale(0.985);
}

.routing-item[data-dragging="true"] {
  opacity: 0.55;
}

.routing-status {
  font-family: var(--font-data);
  font-size: var(--size-label);
  color: var(--text-secondary);
  min-height: 22px;
}

.offline-demo__controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}

.offline-demo[data-network="offline"] {
  box-shadow: inset 0 0 0 2px var(--rule-structural);
  transition: box-shadow var(--dur-base) var(--ease-standard);
}

.rail-undo [data-rail-undo-button],
.offline-demo__controls [data-network-toggle] {
  min-height: 44px;
}

[hidden] {
  display: none !important;
}

.rail-undo {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
  min-height: 44px;
}

.ticket-card__header {
  flex-wrap: wrap;
  gap: var(--space-2);
}

.rail-undo__status {
  font-family: var(--font-data);
  font-size: var(--size-label);
  color: var(--text-secondary);
}

@media (forced-colors: active) {
  .form-field input:focus,
  .form-field textarea:focus,
  .form-field select:focus {
    outline: 2px solid Highlight;
    outline-offset: 2px;
  }

  .ticket-rail__card[data-all-struck="true"],
  .routing-station[data-drop-target="true"],
  .routing-station[data-received="true"] {
    outline: 2px solid Highlight;
    outline-offset: -2px;
  }
}

.site-header[data-nav="drawer"] .nav-toggle {
  flex-shrink: 0;
  width: 44px;
  min-width: 44px;
  height: 44px;
  padding: 0;
  gap: 0;
  overflow: hidden;
}

.site-header[data-nav="drawer"] .nav-toggle__label {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.site-header[data-nav="drawer"] .site-header__accessory {
  display: none;
}

.nav-drawer__accessory {
  margin-top: var(--space-6);
  padding-top: var(--space-6);
  border-top: 1px solid var(--rule-decorative);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
}

.site-header[data-nav="drawer"] .wordmark {
  min-width: 0;
}

.nav-toggle__icon {
  display: block;
  position: relative;
  width: 18px;
  height: 2px;
  background: currentcolor;
}

.nav-toggle__icon::before,
.nav-toggle__icon::after {
  content: "";
  position: absolute;
  left: 0;
  width: 18px;
  height: 2px;
  background: currentcolor;
}

.nav-toggle__icon::before {
  top: -6px;
}

.nav-toggle__icon::after {
  top: 6px;
}

.site-header[data-nav="inline"] .nav-toggle__icon {
  display: none;
}

.timer-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}

.timer-controls__note {
  font-family: var(--font-data);
  font-size: var(--size-label);
  color: var(--text-secondary);
}

.timer-controls [data-timer-pause-button] {
  min-height: 44px;
}

.strike-list {
  margin-top: var(--space-8);
}

.strike-list__items {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-2);
}

.strike-list__row {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  width: 100%;
  min-height: 44px;
  text-align: start;
  font: inherit;
  font-size: var(--size-body);
  color: var(--text-primary);
  background: none;
  border: 0;
  border-radius: var(--radius-sm);
  padding: var(--space-2) var(--space-3);
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-standard);
}

.strike-list__row:hover {
  background-color: var(--surface-raised);
}

.strike-list__mark {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin-top: 3px;
  border: 2px solid var(--rule-structural);
  border-radius: var(--radius-sm);
  background: transparent;
  transition: background-color var(--dur-fast) var(--ease-standard);
}

.strike-list__row[data-struck="true"] .strike-list__mark {
  background-color: var(--action-fill);
  border-color: var(--action-fill);
}

.strike-list__row[data-struck="true"] {
  color: var(--text-secondary);
}

.strike-list__progress {
  margin-top: var(--space-4);
  font-family: var(--font-data);
  font-size: var(--size-label);
  color: var(--text-secondary);
}

.queue-count {
  font-family: var(--font-data);
  font-size: var(--size-small);
  color: var(--text-secondary);
}

.queue-list {
  list-style: none;
  margin: var(--space-3) 0 0;
  padding: 0;
  display: grid;
  gap: var(--space-2);
}

.queue-list__item {
  font-family: var(--font-data);
  font-size: var(--size-small);
  color: var(--text-secondary);
  border-inline-start: 2px solid var(--rule-structural);
  padding-inline-start: var(--space-3);
  transition:
    opacity var(--dur-base) var(--ease-in),
    transform var(--dur-base) var(--ease-in);
}

.queue-list__item[data-syncing="true"] {
  opacity: 0;
  transform: translateX(24px);
}

.ticket-rail__card[data-replacement="true"] {
  will-change: transform;
}

[data-disclosure-panel][data-entered="true"] {
  animation: disclosure-in var(--dur-base) var(--ease-out) 1;
}

@keyframes disclosure-in {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.marker-list li:hover::before,
.marker-list li:focus-within::before {
  transform: scaleX(1);
}

@media (min-width: 768px) {

  .pass-band__frame .photo__img {
    transform: translate3d(0, -3%, 0);
  }

  @supports (animation-timeline: view()) {
    .pass-band__frame--lead .photo__img {
      animation: pass-drift-rise linear both;
      animation-timeline: view();
      animation-range: entry 20% exit 80%;
    }

    .pass-band__frame--trail .photo__img {
      animation: pass-drift-settle linear both;
      animation-timeline: view();
      animation-range: entry 20% exit 80%;
    }
  }
}

@keyframes pass-drift-rise {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(0, -6%, 0);
  }
}

@keyframes pass-drift-settle {
  from {
    transform: translate3d(0, -6%, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {

  button.ticket-card__item[data-struck="true"] .ticket-card__item-text::after {
    transform: scaleX(1) !important;
  }

  button.ticket-card__item[data-struck="true"] .ticket-card__made {
    opacity: 1 !important;
  }

  .ticket-card__timer[data-timer-pulse="true"] {
    animation: none !important;
  }

  .routing-station[data-received="true"] {
    box-shadow: inset 0 0 0 2px var(--action-fill) !important;
  }

  .queue-list__item[data-syncing="true"] {
    opacity: 0 !important;
  }

  [data-disclosure-panel][data-entered="true"] {
    animation: none !important;
    opacity: 1 !important;
  }

  .marker-list li:hover::before,
  .marker-list li:focus-within::before {
    transform: scaleX(1) !important;
  }

  .pass-band__frame .photo__img {
    animation: none !important;
    transform: translate3d(0, -3%, 0) !important;
  }
}

.stopsec + .kdsrun,
.kdsrun + .stopsec {
  margin-top: clamp(3rem, 6vw, 5.5rem);
}

.kdsrun {
  position: relative;
  min-width: 0;
}

.kdsrun__stops,
.kdsrun__board {
  min-width: 0;
}

.kdsrun__board {
  margin-bottom: var(--space-8);
}

.kdsboard {
  scroll-margin-top: calc(var(--pinoff, 64px) + 1rem);
}

.kdsband__back {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  min-height: 44px;
  margin-top: var(--space-6);

  color: var(--text-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition: text-decoration-thickness var(--dur-fast) var(--ease-standard);
}

.kdsband__back:visited {
  color: var(--text-accent);
}

.kdsband__back:hover,
.kdsband__back:focus-visible {
  text-decoration-thickness: 2px;
}

.kdsboard {
  min-width: 0;
}

.kdsboard .ticket-rail {
  margin-inline: 0;
  padding-inline: 0 22%;
}

@media (max-width: 383px) {
  .kdsboard .ticket-rail__card {
    width: calc(100vw - 6.5rem);
  }
}

.kdsboard .board__body .button--secondary {
  color: var(--text-on-dark);
  box-shadow: inset 0 0 0 1px currentcolor;
}

.kdsboard .board__body .timer-controls__note,
.kdsboard .board__body .rail-undo__status {
  color: var(--text-on-dark-secondary);
}

.kdsboard__note {
  margin-top: var(--space-3);
  opacity: 0.8;
}

.tally {
  margin-bottom: var(--space-4);
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--steel-800);
}

.tally__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-2) var(--space-4);
  margin-bottom: var(--space-3);
}

.tally__title {
  margin: 0;
  font-family: var(--font-data);
  font-size: var(--size-label);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-on-dark);
}

.tally__note {
  margin: 0;

  color: var(--text-on-dark-secondary);
}

.tally__groups {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3) var(--space-8);
}

.tally__group {
  min-width: 0;
}

.tally__station {
  margin: 0 0 var(--space-1);
  font-family: var(--font-data);
  font-size: var(--size-label);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-on-dark-secondary);
}

.tally__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 2px;
}

.tally__row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: baseline;
  gap: var(--space-2);

  min-height: 28px;
  padding-block: var(--space-1);
  font-size: var(--size-small);
  color: var(--text-on-dark);
}

.tally__qty {
  font-family: var(--font-data);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  min-width: 2ch;
  text-align: end;
}

.tally__flag {
  font-family: var(--font-data);
  font-size: var(--size-label);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.tally__row[data-state="clear"] {
  color: var(--text-on-dark-secondary);
}

.tally__row[data-state="void"] {

  color: #ff8a80;
}

.tally__row[data-state="void"] .tally__qty {
  text-decoration: line-through;
}

@media (max-width: 767px) {

  .tally__groups {
    gap: var(--space-2) var(--space-4);
  }

  .tally__station {
    display: none;
  }

  .tally__list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-4);
  }

  .tally__row {
    grid-template-columns: auto auto auto;

    min-height: 0;
    padding-block: 0;
  }

  .tally {
    margin-bottom: var(--space-3);
    padding-bottom: var(--space-2);
  }

  .tally__head {
    gap: 0 var(--space-3);
    margin-bottom: var(--space-2);
  }
}

.rail-recall {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
  margin-top: var(--space-3);
}

.kdsboard .board__body .rail-recall__status {
  color: var(--text-on-dark-secondary);
}

.rail-recall [aria-disabled="true"] {
  opacity: 0.62;
}

.ticket-card__ref {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.ticket-card__line {
  display: block;
}

.ticket-card__server {
  font-family: var(--font-body);
  font-size: var(--size-label);
  font-weight: 500;
  color: var(--steel-600);

}

.kdsboard .ticket-card__header:has([data-timer-state="warn"]) {
  background: color-mix(in srgb, var(--ember-600) 10%, var(--steel-100));
}

.kdsboard .ticket-card__header:has([data-timer-state="late"]) {
  background: color-mix(in srgb, #9a1c12 12%, var(--steel-100));
}

.kdsboard button.ticket-card__header:has([data-timer-state="warn"]):hover {
  background: color-mix(in srgb, var(--ember-600) 16%, var(--steel-200));
}

.kdsboard button.ticket-card__header:has([data-timer-state="late"]):hover {
  background: color-mix(in srgb, #9a1c12 18%, var(--steel-200));
}

.board--home .board__body {
  padding-block-end: var(--space-2);
}

.kdsband__lede {
  margin-top: var(--space-6);
}

.kdsband__how {
  margin: var(--space-8) 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--space-2);
}

.kdsband__how li {
  position: relative;
  padding-inline-start: var(--space-6);
}

.kdsband__how li::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 0.55em;
  width: 10px;
  height: 2px;
  background: currentcolor;
  opacity: 0.55;
}

.kdsband__controls {
  margin-top: var(--space-6);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
  align-items: center;
}

.kdsband__hint {
  margin-top: var(--space-6);
  opacity: 0.8;
}

.eightysix {
  display: grid;
  gap: var(--space-2);
}

.eightysix__btn {
  min-height: 44px;
}

.eightysix__btn[aria-pressed="true"] {
  background: var(--steel-100);
  box-shadow: inset 0 0 0 2px currentcolor;
}

.eightysix__count,

.kdsband__receipt {
  opacity: 0.8;
}

.timer-legend {
  margin: var(--space-6) 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--space-3);
}

.timer-legend__row {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.timer-legend .timer-dot[data-timer-state="fresh"] {
  color: var(--steel-600);
  background-color: currentcolor;
}

.timer-legend .timer-dot[data-timer-state="warn"] {
  color: var(--ember-600);
  background-color: transparent;
}

.timer-legend .timer-dot[data-timer-state="late"] {
  color: #9a1c12;
  background-color: transparent;
  border-style: dashed;
}

@media (prefers-reduced-motion: reduce) {
  .timer-legend .timer-dot {
    transition: none;
  }
}

.stopmirror {

  margin: var(--space-6) 0 0;
}

.stopmirror--spine {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.stopmirror__lozenge {
  inline-size: 40px;
  block-size: 10px;
  border-radius: 2px;
  background-color: var(--steel-600);
  opacity: 0.85;
  transition:
    opacity var(--dur-base) var(--ease-out),
    transform var(--dur-base) var(--ease-out);
}

.stopmirror__lozenge[data-filled="false"] {
  background-color: transparent;
  box-shadow: inset 0 0 0 1px var(--rule-structural);
  opacity: 1;
}

.stopmirror__read {
  font-family: var(--font-data);
  font-size: var(--size-small);
  color: var(--text-secondary);
  margin-inline-start: var(--space-2);
}

.stopmirror--spine[data-moved="out"] .stopmirror__lozenge {
  transform: translateX(-6px);
}

.stopmirror--spine[data-moved="in"] .stopmirror__lozenge {
  transform: translateX(6px);
}

.stopmirror--ramp {
  max-inline-size: 420px;
}

.stopmirror--ramp [data-ramp-marker] {
  transition: transform var(--dur-base) var(--ease-out);
}

.stopmirror--ramp[data-ramp-state="warn"] {
  --text-accent: var(--ember-600);
}

.stopmirror--ramp[data-ramp-state="late"] {
  --text-accent: #9a1c12;
}

.timer-legend__row[data-live="true"] {
  font-weight: 600;
}

.timer-legend__row[data-live="false"] {
  opacity: 0.62;
}

.queue-list--ember {
  gap: 3px;
  margin-top: var(--space-3);
}

.queue-list--ember .queue-list__item {
  block-size: 4px;
  inline-size: clamp(64px, 40%, 160px);
  border-radius: 2px;
  border-inline-start: 0;
  padding-inline-start: 0;
  background-color: var(--ember-600);
  overflow: hidden;
  text-indent: -200vw;
  white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
  .stopmirror__lozenge,
  .stopmirror--ramp [data-ramp-marker] {
    transition: none;
  }

  .stopmirror--spine[data-moved="out"] .stopmirror__lozenge,
  .stopmirror--spine[data-moved="in"] .stopmirror__lozenge {
    transform: none;
  }
}

.projector {
  margin-top: var(--space-8);
  border: 1px solid var(--rule-structural);
  border-radius: var(--radius-lg);
  background: var(--surface-card);
  padding: var(--space-6);
}

.projector__controls {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-8);
  align-items: flex-start;
}

.projector__field {
  border: 0;
  margin: 0;
  padding: 0;
  min-width: 0;
}

.projector__label {
  display: block;
  font-family: var(--font-data);
  font-size: var(--size-label);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-secondary);
  padding: 0;
  margin-bottom: var(--space-3);
}

.projector__stepper {
  display: flex;
  align-items: stretch;
  gap: var(--space-2);
}

.projector__step {
  min-width: 44px;
  min-height: 44px;
  font: inherit;
  font-size: var(--size-h4);
  line-height: 1;
  color: var(--text-primary);
  background: var(--surface-raised);
  border: 1px solid var(--rule-structural);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition:
    background-color var(--dur-fast) var(--ease-standard),
    transform var(--dur-instant) var(--ease-standard);
}

.projector__step:hover {
  background-color: var(--surface-accent-wash);
}

.projector__step:active {
  transform: scale(0.94);
}

.projector__input {
  width: 5rem;
  min-height: 44px;
  font-family: var(--font-data);
  font-size: var(--size-data-lg);
  font-variant-numeric: tabular-nums;
  text-align: center;
  color: var(--text-primary);
  background: var(--surface-page);
  border: 1px solid var(--rule-structural);
  border-radius: var(--radius-md);
}

.projector__radios {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
}

.projector__radio {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  min-height: 44px;
}

.projector__radio label {
  font-size: var(--size-body);
  color: var(--text-primary);
}

.projector__figures {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-8);
  margin: var(--space-8) 0 0;
}

.projector__figure {
  min-width: 0;
}

.projector__term {
  font-family: var(--font-data);
  font-size: var(--size-label);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-secondary);
}

.projector__value {
  margin: var(--space-1) 0 0;
  font-variant-numeric: tabular-nums;
  color: var(--text-primary);
}

.projector__note {
  margin: var(--space-1) 0 0;
  font-size: var(--size-small);
  color: var(--text-secondary);
  max-width: 32ch;
}

.projector__chart-figure {
  margin: var(--space-8) 0 0;
}

.projector-chart {
  height: 180px;
  padding-bottom: var(--space-6);
}

.projector-chart__plot {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--space-1);
  height: 100%;
  align-items: end;
}

.projector-chart__col {
  display: grid;
  grid-template-rows: 1fr auto;
  height: 100%;
  min-width: 0;
}

.projector-chart__stack {
  position: relative;
  height: 100%;
  display: flex;
  align-items: flex-end;
  gap: 1px;
}

.projector-chart__bar {
  display: block;
  flex: 1 1 0;
  min-width: 0;
  height: 100%;
  transform-origin: bottom center;
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
}

.projector-chart__bar--monthly {
  background-color: var(--steel-500);
}

.projector-chart__bar--annual {
  background-color: var(--ember-500);
}

.projector-chart__tick {
  font-family: var(--font-data);
  font-size: var(--size-label);
  color: var(--text-secondary);
  text-align: center;
  padding-top: var(--space-2);
}

.projector__legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-6);
  margin-top: var(--space-4);
}

.projector__key {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-data);
  font-size: var(--size-label);
  color: var(--text-secondary);
}

.projector__key::before {
  content: "";
  width: 14px;
  height: 14px;
  border-radius: var(--radius-sm);
}

.projector__key--monthly::before {
  background-color: var(--steel-500);
}

.projector__key--annual::before {
  background-color: var(--ember-500);
}

.projector__caption {
  margin-top: var(--space-4);
  font-size: var(--size-small);
  color: var(--text-secondary);
  max-width: 68ch;
}

.projector[data-animate="true"] .projector-chart__bar {
  transition: transform var(--dur-base) var(--ease-out);
}

.form-field__error:empty {
  display: none;
}

.form-field__error {
  margin: var(--space-2) 0 0;
  font-size: var(--size-small);
  color: var(--text-accent);
}

.form-field input[aria-invalid="true"],
.form-field textarea[aria-invalid="true"] {

  border-color: var(--late);
  transition: border-color var(--dur-fast) var(--ease-standard);
}

@media (prefers-reduced-motion: reduce) {

  .projector__step:active {
    transform: none;
  }
}

/* BUILD IDENTITY — see src/build-identity.mjs. Hashed WITH this file, deliberately. */
:root { --build: "44c19d575815d9586a25c26b6d691c94d9eb519d" }
