.waitlist-shell { --waitlist-accent: var(--signal); max-width: 74rem; padding-bottom: var(--space-10); }
.waitlist-intro { width: min(48rem,100%); margin: clamp(var(--space-8),8vh,var(--space-16)) auto var(--space-8); text-align: center; }
.waitlist-intro h1 { max-width: 15ch; margin: var(--space-3) auto; color: var(--paper); font-family: var(--display); font-size: clamp(2rem,5vw,3.5rem); font-weight: 500; line-height: 1.03; letter-spacing: -.045em; text-wrap: balance; }
.waitlist-intro > p:not(.eyebrow) { max-width: 55ch; margin-inline: auto; color: var(--paper-muted); line-height: 1.6; }
.waitlist-pricing-note { color: var(--waitlist-accent) !important; font-size: .875rem; }
.waitlist-card { width: min(54rem,100%); margin-inline: auto; padding: clamp(var(--space-5),5vw,var(--space-10)); }
.waitlist-view { display: grid; gap: var(--space-3); }
.waitlist-view h2 { margin: 0; color: var(--paper); font-family: var(--display); font-size: clamp(1.6rem,3vw,2.35rem); font-weight: 500; line-height: 1.12; letter-spacing: -.035em; }
.waitlist-view > .eyebrow { margin: var(--space-2) 0 0; color: var(--waitlist-accent); font-weight: 700; }
.waitlist-section-description, .waitlist-view > p:not(.eyebrow) { color: var(--paper-muted); line-height: 1.65; }
.waitlist-pricing-note, .waitlist-callout { border-inline-start: 2px solid var(--waitlist-accent); padding: var(--space-3) var(--space-4); border-radius: 0 var(--radius-md) var(--radius-md) 0; background: color-mix(in srgb,var(--waitlist-accent) 8%,var(--ink-raised)); }
.waitlist-progress-copy { display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--space-2); color:var(--paper-muted); font-size:.875rem; }
.waitlist-progress-copy b { color:var(--paper); }
.waitlist-stage-gate { display:grid; max-width:50rem; gap:var(--space-4); margin-inline:auto; padding-block:clamp(var(--space-5),5vw,var(--space-10)); }
.waitlist-stage-gate > p:not(.eyebrow) { max-width:58ch; margin:0; color:var(--paper-muted); line-height:1.65; }
.waitlist-stage-gate .waitlist-actions { margin-top:var(--space-3); }
.waitlist-progress { height: var(--space-2); overflow:hidden; border-radius:999px; background:var(--ink-soft); }
.waitlist-progress span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--waitlist-accent),color-mix(in srgb,var(--waitlist-accent) 58%,var(--paper))); box-shadow:0 0 var(--space-4) color-mix(in srgb,var(--waitlist-accent) 42%,transparent); transition:width 240ms ease; }
.waitlist-form { display:grid; gap:var(--space-4); margin-top:var(--space-4); }
.waitlist-field { display:grid; min-width:0; gap:var(--space-2); margin:0; color:var(--paper); font-size:.875rem; }
.waitlist-field > span:first-child, .waitlist-field legend { color:var(--paper); font-weight:650; }
.waitlist-field legend { padding:0; }
.waitlist-field input:not([type=checkbox]):not([type=radio]), .waitlist-field textarea, .waitlist-field select { width:100%; min-height:var(--touch-target); padding:var(--space-3) var(--space-4); border:1px solid var(--line-strong); border-radius:var(--radius-md); background:var(--ink-raised); color:var(--paper); }
.waitlist-field textarea { min-height:7rem; resize:vertical; line-height:1.5; }
.waitlist-field input[readonly] { color:var(--paper-muted); }
.waitlist-field small, .field-note { color:var(--paper-muted); font-size:.8125rem; line-height:1.5; }
.waitlist-field fieldset, fieldset.waitlist-field { min-width:0; padding:0; border:0; }
.waitlist-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-2); margin-top:var(--space-3); }
.waitlist-choice { display:flex; min-width:0; min-height:3.25rem; align-items:flex-start; gap:var(--space-3); padding:var(--space-3); border:1px solid var(--line); border-radius:var(--radius-md); background:var(--ink-raised); cursor:pointer; transition:border-color 180ms ease,background 180ms ease; }
.waitlist-choice:has(input:checked) { border-color:var(--waitlist-accent); background:color-mix(in srgb,var(--waitlist-accent) 10%,var(--ink-raised)); }
.waitlist-choice input, .waitlist-confirm input, .waitlist-plan input { flex:0 0 auto; width:1.1rem; height:1.1rem; margin:var(--space-1) 0 0; accent-color:var(--waitlist-accent); }
.waitlist-choice span { display:grid; gap:var(--space-1); color:var(--paper); line-height:1.4; }
.waitlist-choice b { font-weight:600; }
.waitlist-choice small { color:var(--paper-muted); font-weight:400; }
.waitlist-confirm { display:flex; align-items:flex-start; gap:var(--space-3); padding:var(--space-3); border:1px solid var(--line); border-radius:var(--radius-md); color:var(--paper-muted); line-height:1.5; }
.waitlist-confirm a { color:var(--waitlist-accent); }
.waitlist-money { display:flex; align-items:center; gap:var(--space-2); }
.waitlist-money b { color:var(--waitlist-accent); font-size:1.2rem; }
.waitlist-rank { display:grid; gap:var(--space-3); }
.waitlist-rank > label { display:grid; gap:var(--space-2); color:var(--paper-muted); }
.waitlist-plans { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-2); margin-top:var(--space-3); }
.waitlist-plan { display:flex; min-width:0; gap:var(--space-3); padding:var(--space-3); border:1px solid var(--line); border-radius:var(--radius-md); background:var(--ink-raised); cursor:pointer; }
.waitlist-plan:has(input:checked) { border-color:var(--waitlist-accent); background:color-mix(in srgb,var(--waitlist-accent) 10%,var(--ink-raised)); }
.waitlist-plan span { display:grid; gap:var(--space-1); color:var(--paper); }
.waitlist-plan small { color:var(--paper-muted); line-height:1.45; }
.waitlist-plan-guide { display:grid; gap:var(--space-4); margin-top:var(--space-3); }
.waitlist-table-scroll { max-width:100%; overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius-md); background:var(--ink-raised); }
.waitlist-plan-comparison { width:100%; min-width:38rem; table-layout:fixed; border-collapse:collapse; color:var(--paper); font-size:.8125rem; text-align:left; }
.waitlist-plan-comparison th:first-child { width:12%; }
.waitlist-plan-comparison th:nth-child(2) { width:18%; }
.waitlist-plan-comparison th:nth-child(3) { width:28%; }
.waitlist-plan-comparison th:nth-child(4) { width:30%; }
.waitlist-plan-comparison th:nth-child(5) { width:12%; }
.waitlist-plan-comparison caption { padding:var(--space-3) var(--space-4); color:var(--paper); font-family:var(--display); font-size:1.15rem; font-weight:600; text-align:left; }
.waitlist-plan-comparison th,.waitlist-plan-comparison td { padding:var(--space-3); border-top:1px solid var(--line); vertical-align:top; }
.waitlist-plan-comparison thead th { color:var(--paper-muted); font-weight:600; }
.waitlist-plan-comparison tbody th { color:var(--waitlist-accent); font-weight:700; }
.waitlist-plan-comparison td small { display:block; margin-top:var(--space-1); color:var(--paper-muted); white-space:nowrap; }
.waitlist-plan-comparison tbody tr:nth-child(even) { background:color-mix(in srgb,var(--surface) 52%,transparent); }
.waitlist-dot-plus { display:grid; gap:var(--space-2); margin:0; padding:var(--space-3) var(--space-4); border-inline-start:2px solid var(--waitlist-accent); border-radius:0 var(--radius-md) var(--radius-md) 0; background:color-mix(in srgb,var(--waitlist-accent) 8%,var(--ink-raised)); color:var(--paper-muted); line-height:1.5; }
.waitlist-dot-plus b { color:var(--paper); }
.waitlist-personalised { padding:var(--space-4); border:1px solid color-mix(in srgb,var(--waitlist-accent) 35%,var(--line)); border-radius:var(--radius-md); background:color-mix(in srgb,var(--waitlist-accent) 8%,var(--ink-raised)); color:var(--paper) !important; }
.waitlist-actions { display:flex; justify-content:space-between; gap:var(--space-3); margin-top:var(--space-2); }
.waitlist-actions button, .waitlist-link-button { display:inline-flex; min-height:var(--touch-target); align-items:center; justify-content:center; padding-inline:var(--space-5); border-radius:999px; text-decoration:none; cursor:pointer; }
.waitlist-actions .next-button, .waitlist-link-button { border:1px solid var(--waitlist-accent); background:var(--waitlist-accent); color:var(--ink); font-weight:700; }
.waitlist-actions .back-button { border:1px solid var(--line-strong); background:transparent; color:var(--paper); }
.waitlist-actions button:disabled { cursor:wait; opacity:.65; }
.waitlist-error { min-height:1.25em; margin:0; color:var(--spark); font-size:.875rem; }
.waitlist-social { gap:var(--space-3); }
.waitlist-social-rows { display:grid; gap:var(--space-3); }
.waitlist-social-row { display:grid; grid-template-columns:minmax(8rem,.65fr) minmax(0,1.35fr) auto; gap:var(--space-3); align-items:end; padding:var(--space-3); border:1px solid var(--line); border-radius:var(--radius-md); background:color-mix(in srgb,var(--surface) 78%,var(--ink)); }
.waitlist-social-row label { display:grid; min-width:0; gap:var(--space-2); color:var(--paper-muted); font-size:.8rem; }
.waitlist-social-row input,.waitlist-social-row select { width:100%; min-height:var(--touch-target); padding:var(--space-3); border:1px solid var(--line-strong); border-radius:var(--radius-md); background:var(--ink-raised); color:var(--paper); }
.social-add,.social-remove { min-height:var(--touch-target); padding-inline:var(--space-4); border:1px solid var(--line-strong); border-radius:999px; background:transparent; color:var(--paper); cursor:pointer; }
.social-add { justify-self:start; color:var(--waitlist-accent); }
.social-add:hover,.social-remove:hover { border-color:var(--waitlist-accent); }
.social-add:focus-visible,.social-remove:focus-visible { outline:2px solid var(--paper); outline-offset:2px; }
#waitlist-panel[hidden] { display:none!important; }
.homepage-waitlist { width:min(100%,76rem); margin:0 auto clamp(32px,7vh,84px); }
.waitlist-save-state, .autosave-note { color:var(--paper-muted); font-size:.8125rem; }
.waitlist-card > .autosave-note { margin:var(--space-4) 0 0; }
.waitlist-section-description { margin:0; }
.waitlist-view > .completion { display:grid; gap:var(--space-3); }
.waitlist-view > .completion p { margin:0; color:var(--paper-muted); line-height:1.6; }
.waitlist-view > .completion .eyebrow { color:var(--waitlist-accent); }
@media (max-width: 40rem) {
  .waitlist-shell { width:calc(100% - 2 * var(--space-4)); }
  .waitlist-intro { margin-block:var(--space-8) var(--space-5); text-align:left; }
  .waitlist-intro h1 { margin-inline:0; }
  .waitlist-card { padding:var(--space-4); }
  .waitlist-options, .waitlist-plans { grid-template-columns:1fr; }
  .waitlist-actions { position:sticky; bottom:var(--space-2); z-index:2; padding:var(--space-2); border-radius:var(--radius-lg); background:color-mix(in srgb,var(--ink) 92%,transparent); backdrop-filter:blur(12px); }
  .waitlist-actions button { flex:1; }
  .waitlist-social-row { grid-template-columns:minmax(0,1fr); }
  .social-remove { justify-self:start; }
}
@media (prefers-reduced-motion: reduce) {
  .waitlist-progress span, .waitlist-choice { transition:none; }
}

/* Keep the application calm and legible while giving each step a clear place. */
.waitlist-shell {
  display: grid;
  width: min(88rem, calc(100% - 2 * clamp(20px, 5vw, 76px)));
  max-width: none;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "brand" "intro" "form";
  align-content: start;
  align-items: start;
  column-gap: clamp(28px, 5vw, 76px);
  row-gap: clamp(32px, 5vh, 56px);
}
.waitlist-shell > .signal-brand { grid-area: brand; gap: 16px; min-height: 86px; border-color: color-mix(in srgb, var(--signal) 18%, var(--line)); }
.waitlist-shell .signal-home-mark { width: 3.75rem; height: 3.75rem; filter: drop-shadow(0 0 20px color-mix(in srgb, var(--signal) 28%, transparent)); }
.signal-brand-copy { display: grid; gap: 2px; }
.signal-wordmark { color: var(--paper); font-size: 15px; font-weight: 650; letter-spacing: -.02em; }
.signal-tagline { color: var(--paper-dim); font-size: 9px; letter-spacing: .16em; text-transform: uppercase; }
.waitlist-intro { grid-area: intro; position: static; width: min(100%, 70rem); margin: 0 auto; padding-top: 10px; text-align: left; }
.waitlist-intro h1 { max-width: 17ch; margin: 14px 0 20px; font-size: clamp(2.6rem, 5vw, 4.5rem); line-height: 1; letter-spacing: -.055em; }
.waitlist-intro > p:not(.eyebrow) { max-width: 64ch; margin-inline: 0; font-size: 1rem; line-height: 1.7; }
.waitlist-intro .waitlist-pricing-note { margin-top: var(--space-4); border: 0; border-left: 1px solid color-mix(in srgb, var(--waitlist-accent) 54%, var(--line)); border-radius: 0; background: transparent; font-size: .8rem; }
.waitlist-card { grid-area: form; width: min(100%, 70rem); margin: 0 auto; padding: clamp(24px, 4vw, 52px); border: 1px solid var(--line); border-radius: var(--radius-lg); background: linear-gradient(155deg, color-mix(in srgb, var(--surface-raised) 86%, transparent), color-mix(in srgb, var(--surface) 76%, transparent)); box-shadow: inset 0 1px 0 color-mix(in srgb, var(--paper) 4%, transparent); }
.waitlist-view { gap: var(--space-4); }
.waitlist-view h2 { font-size: clamp(1.9rem, 3.3vw, 2.8rem); }
.waitlist-field { gap: 10px; font-size: .9rem; }
.waitlist-field input:not([type=checkbox]):not([type=radio]), .waitlist-field textarea, .waitlist-field select { border-color: color-mix(in srgb, var(--paper) 17%, transparent); background: color-mix(in srgb, var(--ink) 78%, var(--surface)); }
.waitlist-actions { margin-top: var(--space-5); }
.waitlist-actions button { min-width: 118px; font-weight: 650; }
@media (max-width: 880px) {
  .waitlist-shell { grid-template-columns: minmax(0, 1fr); grid-template-areas: "brand" "intro" "form"; row-gap: 22px; }
  .waitlist-intro { width: min(100%, 70rem); padding-top: 6px; }
  .waitlist-intro h1 { max-width: 17ch; font-size: clamp(2.7rem, 7vw, 4.25rem); }
  .waitlist-card { width: min(100%, 70rem); }
}
@media (max-width: 760px) {
  .waitlist-shell { width: calc(100% - 32px); grid-template-columns: minmax(0, 1fr); grid-template-areas: "brand" "intro" "form"; row-gap: 20px; }
  .waitlist-shell > .signal-brand { min-height: 68px; }
  .waitlist-shell .signal-home-mark { width: 3rem; height: 3rem; }
  .waitlist-intro { position: static; padding-top: 8px; }
  .waitlist-intro h1 { max-width: 12ch; margin: 12px 0; font-size: clamp(2.5rem, 11vw, 3.6rem); }
  .waitlist-intro > p:not(.eyebrow) { max-width: 55ch; font-size: .94rem; }
  .waitlist-intro .waitlist-pricing-note { margin-top: 16px; }
  .waitlist-card { padding: clamp(18px, 5vw, 26px); border-radius: 24px; }
}
@media (max-width: 40rem) {
  .waitlist-stage-gate { padding-block:var(--space-4); }
  .waitlist-stage-gate .waitlist-actions { position:static; padding:0; background:transparent; backdrop-filter:none; }
}
@media (prefers-reduced-motion: reduce) { .waitlist-progress span, .waitlist-choice { transition: none; } }