/* tokens:begin. Generated by app/design/build-tokens.js from app/design/tokens.json. Do not edit by hand. */
:root {
  --color-surface: #f6f4ef;
  --color-surface-sunken: #ece8df;
  --color-surface-raised: #ffffff;
  --color-ink: #1f2a2e;
  --color-ink-soft: #5a6a6d;
  --color-ink-inverse: #ffffff;
  --color-inverse-surface: #1f2a2e;
  --color-inverse-ink-soft: #b9d6cf;
  --color-line: #e4e0d7;
  --color-line-strong: #c9c5bb;
  --color-accent: #0d6b63;
  --color-accent-strong: #094f49;
  --color-accent-wash: #e6f1ef;
  --color-edit-outline: #7fb3ac;
  --color-brand: #e2603f;
  --color-brand-strong: #bf4728;
  --color-brand-wash: #fbe9e2;
  --color-warn: #9a6512;
  --color-warn-wash: #f6ecd8;
  --color-positive: #2f8f57;
  --color-positive-wash: #e4f2e9;
  --color-danger: #9c351f;
  --color-evidence-on: #0d6b63;
  --color-evidence-off: #d9d4c9;
  --color-market: #6c4fa3;
  --color-market-wash: #efe8f7;
  --color-scrim: rgba(18, 28, 26, 0.48);
  --color-plan-wall: #ffffff;
  --color-plan-room: #e6f1ef;
  --color-plan-stroke: #0d6b63;
  --font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --weight-regular: 400;
  --weight-medium: 600;
  --weight-strong: 700;
  --weight-heavy: 800;
  --type-wordmark-size: 20px;
  --type-wordmark-weight: 850;
  --type-wordmark-line: 1;
  --type-wordmark-tracking: -0.04em;
  --type-display-size: 30px;
  --type-display-weight: 820;
  --type-display-line: 1.06;
  --type-display-tracking: -0.035em;
  --type-title-size: 23px;
  --type-title-weight: 780;
  --type-title-line: 1.15;
  --type-title-tracking: -0.02em;
  --type-heading-size: 17px;
  --type-heading-weight: 750;
  --type-heading-line: 1.25;
  --type-heading-tracking: -0.01em;
  --type-body-size: 15px;
  --type-body-weight: 400;
  --type-body-line: 1.45;
  --type-body-tracking: 0em;
  --type-input-size: 16px;
  --type-input-weight: 400;
  --type-input-line: 1.3;
  --type-input-tracking: 0em;
  --type-label-size: 14px;
  --type-label-weight: 700;
  --type-label-line: 1.25;
  --type-label-tracking: 0em;
  --type-caption-size: 12.5px;
  --type-caption-weight: 500;
  --type-caption-line: 1.35;
  --type-caption-tracking: 0em;
  --type-overline-size: 11.5px;
  --type-overline-weight: 800;
  --type-overline-line: 1.2;
  --type-overline-tracking: 0.08em;
  --type-number-size: 21px;
  --type-number-weight: 800;
  --type-number-line: 1.1;
  --type-number-tracking: -0.02em;
  --type-number-large-size: 40px;
  --type-number-large-weight: 820;
  --type-number-large-line: 1;
  --type-number-large-tracking: -0.03em;
  --space-3xs: 2px;
  --space-2xs: 4px;
  --space-xs: 6px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 16px;
  --space-xl: 20px;
  --space-2xl: 24px;
  --space-3xl: 32px;
  --space-4xl: 48px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-sheet: 26px;
  --radius-pill: 999px;
  --border-hairline: 1px;
  --border-control: 1.5px;
  --border-selected: 2px;
  --border-focus: 3px;
  --border-radio: 6px;
  --size-touch: 44px;
  --size-icon-sm: 16px;
  --size-icon: 20px;
  --size-icon-lg: 28px;
  --size-glyph: 40px;
  --size-glyph-lg: 52px;
  --size-check: 18px;
  --size-dot: 7px;
  --size-dot-lg: 9px;
  --size-plan-width: 52px;
  --size-plan-height: 37px;
  --size-content: 720px;
  --size-sheet: 560px;
  --size-icon-xs: 14px;
  --size-well: 36px;
  --size-radio: 22px;
  --size-handle: 40px;
  --size-label-column: 112px;
  --size-card-min: 236px;
  --size-narrow: 400px;
  --size-thumb: 64px;
  --breakpoint-wide: 640px;
  --elevation-raised: 0 1px 2px 0px rgba(16, 46, 42, 0.06);
  --elevation-toggle: 0 1px 3px 0px rgba(0, 0, 0, 0.12);
  --elevation-card: 0 22px 50px -22px rgba(16, 46, 42, 0.3), 0 3px 10px 0px rgba(20, 40, 40, 0.05);
  --elevation-popover: 0 20px 45px 0px rgba(20, 40, 40, 0.16);
  --elevation-float: 0 14px 30px -10px rgba(16, 30, 28, 0.55);
  --elevation-overlay: 0 -8px 40px 0px rgba(16, 30, 28, 0.22);
  --motion-fast: 120ms;
  --motion-base: 200ms;
  --motion-slow: 320ms;
  --easing-standard: cubic-bezier(0.2, 0.7, 0.2, 1);
  --opacity-disabled: 0.55;
}
@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-fast: 0ms;
    --motion-base: 0ms;
    --motion-slow: 0ms;
  }
}
/* tokens:end */

/* Every color, length, and duration below comes from the token block above.
   The only literal lengths are breakpoints: media queries cannot read custom
   properties, so they repeat --breakpoint-wide (640px). */

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { color-scheme: light; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html.sheet-open { overflow: hidden; }
body {
  margin: 0;
  background: var(--color-surface);
  color: var(--color-ink);
  font-family: var(--font-ui);
  font-size: var(--type-body-size);
  line-height: var(--type-body-line);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, p, dl, dd { margin: 0; }
button, input, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }
button:disabled { cursor: not-allowed; }
a { color: var(--color-accent); }
:focus-visible { outline: var(--border-focus) solid var(--color-accent); outline-offset: var(--space-3xs); }
[tabindex="-1"]:focus { outline: none; }
.icon { display: inline-flex; flex: none; width: var(--size-icon); height: var(--size-icon); }
.icon svg, .ui-icon svg { display: block; width: 100%; height: 100%; }
.ui-icon { display: inline-flex; flex: none; width: 1em; height: 1em; }
.eyebrow {
  color: var(--color-accent);
  font-size: var(--type-overline-size);
  font-weight: var(--type-overline-weight);
  line-height: var(--type-overline-line);
  letter-spacing: var(--type-overline-tracking);
  text-transform: uppercase;
}
.overline {
  display: block;
  color: var(--color-ink-soft);
  font-size: var(--type-overline-size);
  font-weight: var(--type-overline-weight);
  line-height: var(--type-overline-line);
  letter-spacing: var(--type-overline-tracking);
  text-transform: uppercase;
}
.fine { color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); }

/* ---------- Page frame ---------- */
.site-header, .page, footer { width: min(var(--size-content), calc(100% - 2 * var(--space-lg))); margin-inline: auto; }
.site-header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); min-height: calc(var(--size-touch) + var(--space-md)); }
.wordmark {
  display: inline-flex;
  align-items: center;
  min-height: var(--size-touch);
  color: var(--color-ink);
  font-size: var(--type-wordmark-size);
  font-weight: var(--type-wordmark-weight);
  line-height: var(--type-wordmark-line);
  letter-spacing: var(--type-wordmark-tracking);
  text-decoration: none;
}
.wordmark-up { position: relative; top: -0.3em; color: var(--color-brand); font-size: 0.82em; }
.page { display: grid; gap: var(--space-xl); padding-bottom: var(--space-3xl); }
.intro { display: grid; gap: var(--space-xs); padding-top: var(--space-xs); }
.intro h1 {
  font-size: var(--type-display-size);
  font-weight: var(--type-display-weight);
  line-height: var(--type-display-line);
  letter-spacing: var(--type-display-tracking);
  text-wrap: balance;
}
.intro-sub { color: var(--color-ink-soft); }
.trust-line { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2xs) var(--space-lg); color: var(--color-ink-soft); font-size: var(--type-caption-size); font-weight: var(--weight-medium); }
.trust-line > span { display: inline-flex; align-items: center; gap: var(--space-xs); white-space: nowrap; }
.trust-line > span::before { content: ""; width: var(--size-dot); height: var(--size-dot); border-radius: 50%; background: var(--color-accent); }
footer { border-top: var(--border-hairline) solid var(--color-line); padding: var(--space-lg) 0 var(--space-3xl); color: var(--color-ink-soft); font-size: var(--type-caption-size); }
.load-status:empty { display: none; }
.load-status { color: var(--color-ink-soft); font-size: var(--type-label-size); }

/* ---------- Buttons ---------- */
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-sm);
  min-height: calc(var(--size-touch) + var(--space-xs));
  border: 0;
  border-radius: var(--radius-lg);
  padding: var(--space-md) var(--space-xl);
  font-size: var(--type-body-size);
  font-weight: var(--weight-strong);
  line-height: var(--type-label-line);
  text-align: center;
  text-decoration: none;
  transition: background-color var(--motion-fast) var(--easing-standard), transform var(--motion-fast) var(--easing-standard);
}
.button:active:not(:disabled) { transform: scale(0.98); }
.button:disabled { opacity: var(--opacity-disabled); }
.button-primary { background: var(--color-accent); color: var(--color-ink-inverse); }
.button-primary:hover:not(:disabled) { background: var(--color-accent-strong); }
.button-secondary { border: var(--border-control) solid var(--color-line); background: var(--color-surface-raised); color: var(--color-accent-strong); }
.button-secondary:hover:not(:disabled) { border-color: var(--color-accent); }
.button-light { background: var(--color-surface-raised); color: var(--color-accent-strong); }
.button-text { min-height: var(--size-touch); padding: var(--space-xs) var(--space-sm); background: transparent; color: var(--color-accent-strong); font-weight: var(--weight-medium); text-decoration: underline; text-underline-offset: 0.2em; }
.icon-trailing { transition: transform var(--motion-base) var(--easing-standard); }
.button:hover .icon-trailing { transform: translateX(var(--space-3xs)); }
.text-link { display: flex; align-items: center; min-height: var(--size-touch); border: 0; padding: 0; background: none; color: var(--color-accent); font-weight: var(--weight-strong); text-decoration: underline; text-underline-offset: 0.2em; }

/* ---------- Notice ---------- */
.notice { display: flex; align-items: flex-start; gap: var(--space-sm); border-radius: var(--radius-md); padding: var(--space-sm) var(--space-md); font-size: var(--type-label-size); line-height: var(--type-caption-line); }
.notice .icon { width: var(--size-icon-sm); height: var(--size-icon-sm); margin-top: var(--space-3xs); }
.notice-info { background: var(--color-surface-sunken); color: var(--color-ink-soft); }
.notice-warn { background: var(--color-warn-wash); color: var(--color-warn); font-weight: var(--weight-medium); }

/* ---------- Intake ---------- */
.intake { display: grid; gap: var(--space-lg); scroll-margin-top: var(--space-lg); }
.answered { display: grid; gap: var(--space-sm); }
.step-card { display: grid; gap: var(--space-md); animation: step-in var(--motion-slow) var(--easing-standard) both; }
@keyframes step-in { from { opacity: 0; transform: translateY(var(--space-md)); } }
.step-kicker { color: var(--color-accent); font-size: var(--type-overline-size); font-weight: var(--type-overline-weight); letter-spacing: var(--type-overline-tracking); line-height: var(--type-overline-line); text-transform: uppercase; }
.step-title {
  font-size: var(--type-title-size);
  font-weight: var(--type-title-weight);
  line-height: var(--type-title-line);
  letter-spacing: var(--type-title-tracking);
  text-wrap: balance;
}
.step-subtitle { margin-top: calc(-1 * var(--space-xs)); color: var(--color-ink-soft); }
.step-body { display: grid; gap: var(--space-md); }
.step-actions { display: grid; gap: var(--space-xs); }
.step-actions .button-primary { width: 100%; }
.form-error { color: var(--color-danger); font-size: var(--type-label-size); font-weight: var(--weight-medium); }
.form-error:empty { display: none; }

/* Answered step and trip summary: the dashed outline always means "answered, tap to change". */
.edit-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-md);
  width: 100%;
  min-height: var(--size-touch);
  border: var(--border-control) dashed var(--color-edit-outline);
  border-radius: var(--radius-lg);
  background: var(--color-surface-raised);
  padding: var(--space-md);
  color: var(--color-ink);
  text-align: left;
  transition: background-color var(--motion-fast) var(--easing-standard), border-color var(--motion-fast) var(--easing-standard);
}
.edit-row:hover { border-color: var(--color-accent); background: var(--color-accent-wash); }
.edit-row-summary { grid-template-columns: minmax(0, 1fr) auto; }
.edit-row-icon { display: grid; place-items: center; width: var(--size-well); height: var(--size-well); border-radius: var(--radius-md); background: var(--color-accent-wash); color: var(--color-accent); }
.edit-row-text { display: grid; gap: var(--space-3xs); min-width: 0; }
.edit-row-key { color: var(--color-accent-strong); font-size: var(--type-overline-size); font-weight: var(--type-overline-weight); letter-spacing: var(--type-overline-tracking); line-height: var(--type-overline-line); text-transform: uppercase; }
.edit-row-value { font-size: var(--type-label-size); line-height: var(--type-caption-line); overflow-wrap: anywhere; }
.edit-row-title { font-size: var(--type-body-size); font-weight: var(--weight-strong); line-height: var(--type-label-line); overflow-wrap: anywhere; }
.edit-row-detail { color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.edit-row-action { display: inline-flex; align-items: center; gap: var(--space-2xs); color: var(--color-accent); font-size: var(--type-caption-size); font-weight: var(--weight-strong); }
.edit-row-action .icon { width: var(--size-icon-sm); height: var(--size-icon-sm); }

/* Endpoint card: one building in the Route and Access steps. */
.endpoint-card { display: grid; gap: var(--space-md); border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-xl); background: var(--color-surface-raised); padding: var(--space-lg); min-width: 0; }
.endpoint-title, .endpoint-card .address-field > .field-label { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-3xs) var(--space-sm); color: var(--color-ink); font-size: var(--type-body-size); font-weight: var(--weight-heavy); line-height: var(--type-label-line); }
.endpoint-dot, .endpoint-card .address-field > .field-label::before { flex: none; align-self: center; width: var(--size-dot-lg); height: var(--size-dot-lg); border-radius: 50%; background: var(--color-brand); }
.endpoint-card .address-field > .field-label::before { content: ""; }
.endpoint-to .endpoint-dot, .endpoint-to .address-field > .field-label::before { background: var(--color-accent); }
.endpoint-detail { color: var(--color-ink-soft); font-size: var(--type-caption-size); font-weight: var(--weight-regular); overflow-wrap: anywhere; }
.endpoint-card > .field-label { margin-bottom: calc(-1 * var(--space-sm)); }

/* Fields */
.field-label { display: block; color: var(--color-ink-soft); font-size: var(--type-caption-size); font-weight: var(--weight-strong); }
input[type="text"], input[type="email"], input[type="tel"], input[type="search"], input[type="date"], textarea {
  display: block;
  width: 100%;
  min-height: calc(var(--size-touch) + var(--space-3xs));
  border: var(--border-control) solid var(--color-line-strong);
  border-radius: var(--radius-md);
  background: var(--color-surface-raised);
  color: var(--color-ink);
  padding: var(--space-sm) var(--space-md);
  font-size: var(--type-input-size);
  line-height: var(--type-input-line);
  transition: border-color var(--motion-fast) var(--easing-standard), box-shadow var(--motion-fast) var(--easing-standard);
}
input[type="date"] { -webkit-appearance: none; appearance: none; text-align: left; }
textarea { resize: vertical; }
input:focus, textarea:focus { border-color: var(--color-accent); outline: none; box-shadow: 0 0 0 var(--border-focus) var(--color-accent-wash); }
.address-field { position: relative; display: grid; gap: var(--space-sm); }
.suggestions { position: absolute; top: calc(100% + var(--space-2xs)); right: 0; left: 0; z-index: 30; overflow: hidden; border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-lg); background: var(--color-surface-raised); box-shadow: var(--elevation-popover); }
.suggestion { display: flex; align-items: center; gap: var(--space-sm); width: 100%; min-height: var(--size-touch); border: 0; border-bottom: var(--border-hairline) solid var(--color-line); background: var(--color-surface-raised); padding: var(--space-sm) var(--space-md); text-align: left; font-size: var(--type-label-size); font-weight: var(--weight-medium); }
.suggestion:last-child { border-bottom: 0; }
.suggestion .icon { width: var(--size-icon-sm); height: var(--size-icon-sm); color: var(--color-accent); }
.suggestion > span:last-child { min-width: 0; overflow-wrap: anywhere; }
.suggestion:hover, .suggestion[aria-selected="true"] { background: var(--color-accent-wash); }
.suggestion[aria-selected="true"] { box-shadow: inset var(--border-focus) 0 0 0 var(--color-accent); }
.date-field { display: grid; gap: var(--space-xs); }

/* Shared selected state for every single-select control. */
.pill[aria-pressed="true"], .tile[aria-pressed="true"], .choice-card[aria-pressed="true"], .option-row[aria-pressed="true"] {
  border-color: var(--color-accent);
  background: var(--color-accent-wash);
  box-shadow: inset 0 0 0 var(--border-hairline) var(--color-accent);
}
.tile, .choice-card, .option-row, .pill, .segment, .chip { transition: background-color var(--motion-fast) var(--easing-standard), border-color var(--motion-fast) var(--easing-standard); }

.pills { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-xs); }
.pill { min-height: var(--size-touch); min-width: 0; border: var(--border-control) solid var(--color-line); border-radius: var(--radius-md); background: var(--color-surface-raised); padding: var(--space-2xs) var(--space-xs); font-size: var(--type-label-size); font-weight: var(--weight-medium); line-height: var(--type-label-line); }
.pill[aria-pressed="true"] { color: var(--color-accent-strong); font-weight: var(--weight-strong); }

.tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-sm); }
.tile { position: relative; display: flex; flex-direction: column; align-items: center; gap: var(--space-xs); min-width: 0; min-height: var(--size-touch); border: var(--border-control) solid var(--color-line); border-radius: var(--radius-lg); background: var(--color-surface-raised); padding: var(--space-md) var(--space-2xs); text-align: center; }
.tile-glyph { display: grid; place-items: center; width: var(--size-glyph); height: var(--size-glyph); border-radius: var(--radius-md); background: var(--color-surface); color: var(--color-accent); }
.tile-glyph .icon { width: var(--size-icon-lg); height: var(--size-icon-lg); }
.tile-label { font-size: var(--type-label-size); font-weight: var(--weight-strong); line-height: var(--type-label-line); text-wrap: balance; }
.tile-sub { color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); text-wrap: balance; }
.tile-check { position: absolute; top: var(--space-xs); right: var(--space-xs); display: none; place-items: center; width: var(--size-check); height: var(--size-check); border-radius: 50%; background: var(--color-accent); color: var(--color-ink-inverse); }
.tile-check .icon { width: var(--size-icon-xs); height: var(--size-icon-xs); }
.tile[aria-pressed="true"] .tile-glyph, .choice-card[aria-pressed="true"] .choice-glyph, .option-row[aria-pressed="true"] .option-glyph { background: var(--color-surface-raised); }
.tile[aria-pressed="true"] .tile-check { display: grid; }

.stepper { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); border: var(--border-control) solid var(--color-line); border-radius: var(--radius-lg); background: var(--color-surface-raised); padding: var(--space-sm) var(--space-sm) var(--space-sm) var(--space-lg); }
.stepper-text { display: grid; gap: var(--space-3xs); min-width: 0; }
.stepper-label { font-size: var(--type-label-size); font-weight: var(--weight-strong); }
.stepper-hint { color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.stepper-control { display: inline-flex; flex: none; align-items: center; gap: var(--space-3xs); border-radius: var(--radius-pill); background: var(--color-accent-wash); padding: var(--space-2xs); }
.stepper-control button { display: grid; place-items: center; width: var(--size-touch); height: var(--size-touch); border: 0; border-radius: 50%; background: var(--color-surface-raised); color: var(--color-accent); box-shadow: var(--elevation-toggle); }
.stepper-control button:active { transform: scale(0.94); }
.stepper-control input {
  width: calc(var(--size-touch) + var(--space-2xs));
  min-height: var(--size-touch);
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--color-accent-strong);
  font-size: var(--type-number-size);
  font-weight: var(--type-number-weight);
  font-variant-numeric: tabular-nums;
  text-align: center;
  -moz-appearance: textfield;
  appearance: textfield;
}
.stepper-control input::-webkit-inner-spin-button, .stepper-control input::-webkit-outer-spin-button { margin: 0; -webkit-appearance: none; }
.stepper-control input:focus { box-shadow: none; }

.question { display: grid; gap: var(--space-xs); }
.question-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-sm); min-height: var(--size-touch); margin-bottom: calc(-1 * var(--space-xs)); }
.question-text { font-size: var(--type-label-size); font-weight: var(--weight-strong); }
.info-button { display: grid; flex: none; place-items: center; width: var(--size-touch); height: var(--size-touch); margin-right: calc(-1 * var(--space-sm)); border: 0; border-radius: 50%; background: transparent; color: var(--color-accent); }
.info-button[aria-expanded="true"] { background: var(--color-accent-wash); }
.info-note { border-radius: var(--radius-md); background: var(--color-surface); padding: var(--space-sm) var(--space-md); color: var(--color-ink-soft); font-size: var(--type-label-size); line-height: var(--type-caption-line); }

.segmented { display: grid; grid-auto-columns: minmax(0, 1fr); grid-auto-flow: column; gap: var(--space-3xs); border-radius: var(--radius-md); background: var(--color-surface-sunken); padding: var(--space-2xs); }
.segment { min-height: var(--size-touch); border: 0; border-radius: var(--radius-sm); background: transparent; padding: var(--space-xs) var(--space-2xs); color: var(--color-ink-soft); font-size: var(--type-label-size); font-weight: var(--weight-medium); }
.segmented-dense .segment { padding-inline: var(--space-3xs); font-size: var(--type-caption-size); }
.segment[aria-pressed="true"] { background: var(--color-surface-raised); color: var(--color-accent-strong); font-weight: var(--weight-strong); box-shadow: var(--elevation-toggle); }

.badge { display: inline-block; border-radius: var(--radius-pill); background: var(--color-surface-sunken); padding: var(--space-3xs) var(--space-sm); color: var(--color-ink-soft); font-size: var(--type-overline-size); font-weight: var(--type-overline-weight); letter-spacing: var(--type-overline-tracking); line-height: var(--type-overline-line); text-transform: uppercase; white-space: nowrap; }
.choice-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-md); }
.choice-card { position: relative; display: flex; flex-direction: column; align-items: center; gap: var(--space-sm); min-width: 0; border: var(--border-control) solid var(--color-line); border-radius: var(--radius-xl); background: var(--color-surface-raised); padding: var(--space-xl) var(--space-md) var(--space-lg); text-align: center; }
.choice-card .badge { position: absolute; top: var(--space-sm); right: var(--space-sm); }
.choice-glyph { display: grid; place-items: center; width: var(--size-glyph-lg); height: var(--size-glyph-lg); border-radius: var(--radius-lg); background: var(--color-surface); color: var(--color-accent); }
.choice-glyph .icon { width: var(--size-icon-lg); height: var(--size-icon-lg); }
.choice-label { font-size: var(--type-heading-size); font-weight: var(--type-heading-weight); line-height: var(--type-heading-line); }
.choice-sub { color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); text-wrap: balance; }

.option-list { display: grid; gap: var(--space-sm); }
.option-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-md); width: 100%; min-height: var(--size-touch); border: var(--border-control) solid var(--color-line); border-radius: var(--radius-lg); background: var(--color-surface-raised); padding: var(--space-sm) var(--space-md); text-align: left; }
.option-glyph { display: grid; place-items: center; width: var(--size-well); height: var(--size-well); border-radius: var(--radius-md); background: var(--color-surface); color: var(--color-accent); }
.option-text { display: grid; min-width: 0; }
.option-label { font-size: var(--type-body-size); font-weight: var(--weight-strong); line-height: var(--type-label-line); }
.option-sub { color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.option-tag { color: var(--color-accent); font-size: var(--type-overline-size); font-weight: var(--type-overline-weight); letter-spacing: var(--type-overline-tracking); line-height: var(--type-overline-line); text-transform: uppercase; }
.option-radio { width: var(--size-radio); height: var(--size-radio); border: var(--border-selected) solid var(--color-line-strong); border-radius: 50%; background: var(--color-surface-raised); transition: border-width var(--motion-fast) var(--easing-standard); }
.option-row[aria-pressed="true"] .option-radio { border: var(--border-radio) solid var(--color-accent); }
.plan { display: block; width: var(--size-plan-width); height: var(--size-plan-height); }
.plan-wall { fill: var(--color-plan-wall); stroke: var(--color-plan-stroke); stroke-width: 1.6; }
.plan-room { fill: var(--color-plan-room); }
.plan-line { fill: none; stroke: var(--color-plan-stroke); stroke-width: 1.4; }
.plan-bed { fill: var(--color-plan-stroke); }
.plan-pillow { fill: var(--color-plan-wall); }

/* Disabled-by-flag options stay visible and announce aria-disabled; tapping does nothing. */
.choice-card[aria-disabled="true"], .option-row[aria-disabled="true"] { border-style: dashed; background: transparent; cursor: default; }
.choice-card[aria-disabled="true"] > :not(.badge), .option-row[aria-disabled="true"] > :not(.badge) { opacity: var(--opacity-disabled); }

/* A feature whose provider is not there yet: the same dashed, greyed look, one line on why. */
.coming-soon { position: relative; display: grid; gap: var(--space-md); border: var(--border-control) dashed var(--color-line-strong); border-radius: var(--radius-xl); padding: var(--space-lg); }
.coming-soon > .badge { position: absolute; top: var(--space-md); right: var(--space-md); }
.coming-soon-body { display: grid; gap: var(--space-sm); }
.coming-soon-body > :not(.button) { opacity: var(--opacity-disabled); }
.coming-soon-body > .button { justify-self: start; }
.coming-soon-body input:disabled { background: transparent; cursor: not-allowed; }
.coming-soon-note { display: flex; align-items: flex-start; gap: var(--space-sm); color: var(--color-ink-soft); font-size: var(--type-label-size); font-weight: var(--weight-medium); line-height: var(--type-caption-line); }
.coming-soon-note .icon { width: var(--size-icon-sm); height: var(--size-icon-sm); margin-top: var(--space-3xs); }

/* ---------- Results ---------- */
.results { display: grid; gap: var(--space-xl); scroll-margin-top: var(--space-lg); }
.results-top { display: grid; gap: var(--space-lg); }
.trip { display: grid; gap: var(--space-sm); }
.results-header { display: grid; gap: var(--space-2xs); }
.results-title { font-size: var(--type-title-size); font-weight: var(--type-title-weight); line-height: var(--type-title-line); letter-spacing: var(--type-title-tracking); }
.results-line { color: var(--color-ink-soft); font-size: var(--type-label-size); }
.results-line b { color: var(--color-ink); font-variant-numeric: tabular-nums; }
.chips { display: flex; flex-wrap: wrap; gap: var(--space-xs); }
.chip { min-height: var(--size-touch); border: var(--border-control) solid var(--color-line); border-radius: var(--radius-pill); background: var(--color-surface-raised); padding: var(--space-xs) var(--space-lg); font-size: var(--type-label-size); font-weight: var(--weight-strong); }
.chip[aria-pressed="true"] { border-color: var(--color-inverse-surface); background: var(--color-inverse-surface); color: var(--color-ink-inverse); }

.date-strip { display: grid; gap: var(--space-sm); }
.date-strip-head { display: grid; gap: var(--space-3xs); }
.date-strip-head h3 { font-size: var(--type-label-size); font-weight: var(--weight-strong); }
.date-strip-head p { color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.date-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: var(--space-3xs); margin: 0; padding: 0; list-style: none; }
.date-day { display: grid; justify-items: center; gap: var(--space-3xs); min-width: 0; border: var(--border-control) solid var(--color-line); border-radius: var(--radius-md); background: var(--color-surface-raised); padding: var(--space-xs) 0; text-align: center; font-variant-numeric: tabular-nums; }
.date-day-label { color: var(--color-ink-soft); font-size: var(--type-caption-size); font-weight: var(--weight-medium); line-height: var(--type-caption-line); }
.date-day-price { font-size: var(--type-caption-size); font-weight: var(--weight-heavy); line-height: var(--type-label-line); }
.date-day-note { color: var(--color-ink-soft); font-size: var(--type-overline-size); line-height: var(--type-overline-line); }
.date-day-lowest { border-color: var(--color-positive); background: var(--color-positive-wash); }
.date-day-lowest .date-day-note { color: var(--color-positive); font-weight: var(--weight-heavy); }
.date-day-requested { border-color: var(--color-ink); box-shadow: inset 0 0 0 var(--border-hairline) var(--color-ink); }
.date-day-requested .date-day-note { color: var(--color-ink); font-weight: var(--weight-heavy); }

.results-list { display: grid; gap: var(--space-xl); }
.results-section { display: grid; }
.row-list { display: grid; margin-inline: calc(-1 * var(--space-lg)); border-block: var(--border-hairline) solid var(--color-line); background: var(--color-surface-raised); }
.mover-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-md);
  width: 100%;
  min-height: var(--size-touch);
  border: 0;
  background: var(--color-surface-raised);
  padding: var(--space-md) var(--space-lg);
  color: var(--color-ink);
  text-align: left;
  transition: background-color var(--motion-fast) var(--easing-standard);
}
.mover-row + .mover-row, .row-list > .show-more { border-top: var(--border-hairline) solid var(--color-line); }
.mover-row:hover { background: var(--color-accent-wash); }
.mover-row:focus-visible { outline-offset: calc(-1 * var(--border-focus)); }
.mover-main { display: grid; gap: var(--space-2xs); min-width: 0; }
.mover-name { font-size: var(--type-body-size); font-weight: var(--weight-strong); line-height: var(--type-label-line); overflow-wrap: anywhere; }
.mover-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3xs) var(--space-md); color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.mover-place { display: inline-flex; align-items: center; gap: var(--space-2xs); }
.mover-place .icon { width: var(--size-icon-xs); height: var(--size-icon-xs); }
.mover-tag { color: var(--color-brand-strong); font-size: var(--type-overline-size); font-weight: var(--type-overline-weight); letter-spacing: var(--type-overline-tracking); text-transform: uppercase; }
.mover-note { color: var(--color-ink-soft); font-size: var(--type-caption-size); }
.mover-price { display: grid; justify-items: end; text-align: right; font-variant-numeric: tabular-nums; }
.mover-likely-label { color: var(--color-ink-soft); font-size: var(--type-overline-size); font-weight: var(--type-overline-weight); letter-spacing: var(--type-overline-tracking); line-height: var(--type-overline-line); text-transform: uppercase; }
.mover-likely { font-size: var(--type-number-size); font-weight: var(--type-number-weight); line-height: var(--type-number-line); letter-spacing: var(--type-number-tracking); }
.mover-range { color: var(--color-ink-soft); font-size: var(--type-caption-size); white-space: nowrap; }
.mover-row-muted .mover-likely { color: var(--color-ink-soft); }
.evidence { display: inline-flex; align-items: center; gap: var(--space-xs); }
.evidence-dots { display: inline-flex; gap: var(--space-3xs); }
.evidence-dots i { display: block; width: var(--size-dot); height: var(--size-dot); border-radius: 50%; background: var(--color-evidence-off); }
.evidence-dots i.on { background: var(--color-evidence-on); }
.show-more { display: flex; align-items: center; gap: var(--space-xs); width: 100%; min-height: var(--size-touch); border: 0; background: var(--color-surface-raised); padding: var(--space-md) var(--space-lg); color: var(--color-accent); font-weight: var(--weight-strong); text-align: left; }
.show-more .icon { width: var(--size-icon-sm); height: var(--size-icon-sm); }
.row-list-cards { grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--size-card-min)), 1fr)); gap: var(--space-md); margin-inline: 0; border: 0; background: transparent; }
.row-list-cards .mover-row { align-items: start; grid-template-columns: 1fr; border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-xl); padding: var(--space-lg); box-shadow: var(--elevation-raised); }
.row-list-cards .mover-row + .mover-row { border-top: var(--border-hairline) solid var(--color-line); }
.row-list-cards .mover-price { justify-items: start; text-align: left; }

.section-header { margin: 0; font: inherit; }
.section-toggle, .section-header-static .section-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: var(--space-xs) var(--space-md); width: 100%; min-height: var(--size-touch); border: 0; background: transparent; padding: var(--space-md) 0; color: var(--color-ink); font: inherit; text-align: left; }
.section-text { display: grid; gap: var(--space-3xs); }
.section-title { font-size: var(--type-heading-size); font-weight: var(--type-heading-weight); line-height: var(--type-heading-line); letter-spacing: var(--type-heading-tracking); }
.section-subtitle { color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.section-aside { color: var(--color-ink-soft); font-size: var(--type-caption-size); font-variant-numeric: tabular-nums; white-space: nowrap; }
.section-chevron { transition: transform var(--motion-base) var(--easing-standard); }
.section-toggle[aria-expanded="true"] .section-chevron { transform: rotate(180deg); }
.section-meter { display: block; height: var(--space-xs); margin-bottom: var(--space-md); overflow: hidden; border-radius: var(--radius-pill); background: var(--color-surface-sunken); }
.section-meter i { display: block; width: calc(var(--meter) * 100%); height: 100%; border-radius: var(--radius-pill); background: var(--color-accent); }
.section-note { padding-bottom: var(--space-sm); color: var(--color-ink-soft); font-size: var(--type-caption-size); }

.market-line { display: grid; gap: var(--space-2xs); border-radius: var(--radius-lg); background: var(--color-market-wash); padding: var(--space-md) var(--space-lg); font-size: var(--type-label-size); line-height: var(--type-caption-line); }
.market-title { color: var(--color-market); font-weight: var(--weight-heavy); }
.results-after { display: grid; gap: var(--space-lg); }
.results-after:empty { display: none; }
.narrow-prompt { position: sticky; bottom: var(--space-md); z-index: 3; display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); width: 100%; border: 0; border-radius: var(--radius-xl); background: var(--color-inverse-surface); padding: var(--space-sm) var(--space-sm) var(--space-sm) var(--space-lg); color: var(--color-ink-inverse); text-align: left; box-shadow: var(--elevation-float); }
.narrow-text { display: grid; min-width: 0; }
.narrow-title { font-size: var(--type-label-size); font-weight: var(--weight-strong); }
.narrow-detail { color: var(--color-inverse-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.narrow-action { display: inline-flex; flex: none; align-items: center; gap: var(--space-xs); min-height: var(--size-touch); border-radius: var(--radius-md); background: var(--color-brand-strong); padding: var(--space-sm) var(--space-md); font-weight: var(--weight-strong); white-space: nowrap; }

.skeleton-list { display: grid; margin-inline: calc(-1 * var(--space-lg)); border-block: var(--border-hairline) solid var(--color-line); background: var(--color-surface-raised); }
.skeleton-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-sm) var(--space-3xl); padding: var(--space-lg); }
.skeleton-row + .skeleton-row { border-top: var(--border-hairline) solid var(--color-line); }
.skeleton-row span { display: block; height: var(--space-md); border-radius: var(--radius-pill); background: var(--color-surface-sunken); animation: pulse calc(var(--motion-slow) * 4) var(--easing-standard) infinite; }
.skeleton-row span:nth-child(1) { width: 70%; }
.skeleton-row span:nth-child(2) { grid-row: span 2; width: var(--size-glyph-lg); height: var(--space-2xl); }
.skeleton-row span:nth-child(3) { width: 40%; }
@keyframes pulse { 50% { opacity: 0.45; } }

.shortlist-rail { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-md) var(--space-xl); border-radius: var(--radius-xl); background: var(--color-inverse-surface); padding: var(--space-xl); color: var(--color-ink-inverse); }
.shortlist-rail > div { flex: 1 1 var(--size-card-min); }
.shortlist-rail > .button { flex: 1 1 auto; }
.shortlist-rail .eyebrow { color: var(--color-inverse-ink-soft); }
.shortlist-copy { margin-top: var(--space-2xs); }
.planning-note { border-left: var(--border-focus) solid var(--color-accent); padding: var(--space-2xs) 0 var(--space-2xs) var(--space-md); color: var(--color-ink-soft); font-size: var(--type-caption-size); }
.guide-link { font-size: var(--type-label-size); font-weight: var(--weight-strong); }
.guide-link a, .header-cta, .guide-cta-button { display: inline-flex; align-items: center; gap: var(--space-xs); min-height: var(--size-touch); color: var(--color-accent); text-decoration: none; }
.guide-link a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.guide-link .ui-icon, .header-cta .ui-icon, .guide-cta-button .ui-icon { width: var(--size-icon-sm); height: var(--size-icon-sm); transition: transform var(--motion-base) var(--easing-standard); }
.guide-link a:hover .ui-icon, .header-cta:hover .ui-icon, .guide-cta-button:hover .ui-icon { transform: translateX(var(--space-3xs)); }

/* ---------- Outreach ---------- */
.outreach-panel { display: grid; gap: var(--space-lg); border: var(--border-hairline) solid var(--color-edit-outline); border-radius: var(--radius-xl); background: var(--color-surface-raised); padding: var(--space-xl) var(--space-lg); scroll-margin-top: var(--space-lg); }
.outreach-heading { display: grid; gap: var(--space-md); }
.outreach-heading h3 { font-size: var(--type-title-size); font-weight: var(--type-title-weight); line-height: var(--type-title-line); letter-spacing: var(--type-title-tracking); }
.outreach-heading p:not(.eyebrow) { color: var(--color-ink-soft); }
.outreach-movers { margin: 0 0 var(--space-xl); border: 0; padding: 0; }
.outreach-movers legend { float: left; font-weight: var(--weight-heavy); }
.outreach-movers #outreach-counter { display: block; color: var(--color-accent); text-align: right; }
.outreach-movers > .outreach-error { clear: both; }
.outreach-filter { clear: both; display: grid; gap: var(--space-2xs); padding-top: var(--space-sm); }
.outreach-filter small { color: var(--color-ink-soft); }
.outreach-choices { clear: both; display: grid; gap: var(--space-sm); padding-top: var(--space-sm); }
.outreach-choice { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--space-md); min-height: calc(var(--size-touch) + var(--space-lg)); border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-md); padding: var(--space-sm) var(--space-md); }
.outreach-choice:has(input:checked) { border-color: var(--color-accent); background: var(--color-accent-wash); }
.outreach-choice input, .consent-row input { width: var(--size-icon); height: var(--size-icon); margin: 0; accent-color: var(--color-accent); }
.outreach-choice strong, .outreach-choice small { display: block; }
.outreach-choice strong { font-size: var(--type-label-size); overflow-wrap: anywhere; }
.outreach-choice small { margin-top: var(--space-3xs); color: var(--color-ink-soft); font-size: var(--type-caption-size); }
.outreach-contact { display: grid; gap: var(--space-md); }
.outreach-field label { display: grid; gap: var(--space-xs); }
.outreach-error, .outreach-failure { min-height: 1.2em; margin-top: var(--space-2xs); color: var(--color-danger); font-size: var(--type-caption-size); }
.consent-row { display: flex; align-items: center; gap: var(--space-md); min-height: var(--size-touch); margin-top: var(--space-lg); font-weight: var(--weight-strong); }
.outreach-disclosure, .outreach-next { margin-top: var(--space-md); color: var(--color-ink-soft); font-size: var(--type-label-size); }
.outreach-submit { margin-top: var(--space-sm); width: 100%; }
.outreach-reference { display: inline-block; max-width: 100%; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.85em; white-space: nowrap; vertical-align: bottom; }
.outreach-confirmed { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin: var(--space-md) 0 0; padding: 0; list-style: none; }
.outreach-confirmed li { border-radius: var(--radius-pill); background: var(--color-accent-wash); padding: var(--space-xs) var(--space-md); color: var(--color-accent-strong); font-size: var(--type-caption-size); font-weight: var(--weight-strong); }

/* ---------- Mover details sheet ---------- */
.mover-sheet {
  position: fixed;
  inset: auto 0 0;
  width: 100%;
  max-width: none;
  max-height: calc(100dvh - var(--space-3xl));
  margin: 0;
  overflow: hidden;
  border: 0;
  border-radius: var(--radius-sheet) var(--radius-sheet) 0 0;
  background: var(--color-surface);
  padding: 0;
  color: var(--color-ink);
  box-shadow: var(--elevation-overlay);
}
.mover-sheet[open] { display: flex; flex-direction: column; animation: sheet-up var(--motion-slow) var(--easing-standard); }
.mover-sheet::backdrop { background: var(--color-scrim); }
@keyframes sheet-up { from { opacity: 0.4; transform: translateY(var(--space-3xl)); } }
.sheet { display: flex; flex: 1; flex-direction: column; min-height: 0; }
.sheet-handle { flex: none; width: var(--size-handle); height: var(--space-2xs); margin: var(--space-sm) auto 0; border-radius: var(--radius-pill); background: var(--color-line-strong); }
.sheet-scroll { display: grid; flex: 1; align-content: start; gap: var(--space-xl); min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: var(--space-sm) var(--space-xl) var(--space-xl); }
.sheet-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: var(--space-md); }
.sheet-title { font-size: var(--type-title-size); font-weight: var(--type-title-weight); line-height: var(--type-title-line); letter-spacing: var(--type-title-tracking); overflow-wrap: anywhere; }
.sheet-place { display: flex; align-items: center; gap: var(--space-xs); margin-top: var(--space-xs); color: var(--color-accent-strong); font-weight: var(--weight-medium); }
.sheet-place .icon { width: var(--size-icon-sm); height: var(--size-icon-sm); }
.sheet-close { display: grid; place-items: center; width: var(--size-touch); height: var(--size-touch); border: 0; border-radius: 50%; background: var(--color-surface-sunken); color: var(--color-ink); }
.price-block { display: grid; gap: var(--space-md); border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-xl); background: var(--color-surface-raised); padding: var(--space-lg); }
.price-main { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--space-md); font-variant-numeric: tabular-nums; }
.price-main > div { display: grid; gap: var(--space-2xs); }
.price-range { justify-items: end; text-align: right; }
.price-likely { font-size: var(--type-number-large-size); font-weight: var(--type-number-large-weight); line-height: var(--type-number-large-line); letter-spacing: var(--type-number-large-tracking); }
.price-range-value { font-size: var(--type-heading-size); font-weight: var(--weight-strong); white-space: nowrap; }
.price-ends { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-sm); }
.price-ends p { border-radius: var(--radius-md); background: var(--color-surface); padding: var(--space-sm) var(--space-md); color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.price-ends b { display: block; color: var(--color-ink); font-size: var(--type-label-size); font-weight: var(--weight-heavy); font-variant-numeric: tabular-nums; }
.price-note { color: var(--color-ink-soft); font-size: var(--type-caption-size); }
.sheet-section { display: grid; gap: var(--space-sm); }
.sheet-section h3 { font-size: var(--type-heading-size); font-weight: var(--type-heading-weight); line-height: var(--type-heading-line); letter-spacing: var(--type-heading-tracking); }
.sheet-evidence .evidence { font-weight: var(--weight-strong); }
.sheet-evidence .evidence-dots i { width: var(--size-dot-lg); height: var(--size-dot-lg); }
.sheet-loading { color: var(--color-ink-soft); }
.line-items { overflow: hidden; border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-lg); background: var(--color-surface-raised); }
.line-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-3xs) var(--space-md); padding: var(--space-md) var(--space-lg); font-variant-numeric: tabular-nums; }
.line-item + .line-item { border-top: var(--border-hairline) solid var(--color-line); }
.line-item dt small { display: block; color: var(--color-ink-soft); font-size: var(--type-caption-size); }
.line-item dd { font-weight: var(--weight-medium); text-align: right; white-space: nowrap; }
.line-total { background: var(--color-surface); font-weight: var(--weight-strong); }
.line-total dd { font-weight: var(--weight-heavy); }
.market-amount { color: var(--color-market); }
.fine-list { display: grid; gap: var(--space-xs); margin: 0; padding: 0; list-style: none; color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.reasons { display: grid; gap: var(--space-md); margin: 0; padding: 0; list-style: none; }
.reason { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-md); font-size: var(--type-label-size); }
.reason-icon { display: grid; place-items: center; width: var(--size-icon-lg); height: var(--size-icon-lg); border-radius: var(--radius-sm); background: var(--color-surface-sunken); color: var(--color-ink-soft); }
.reason-icon .icon { width: var(--size-icon-sm); height: var(--size-icon-sm); }
.reason-you .reason-icon { background: var(--color-brand-wash); color: var(--color-brand-strong); }
.terms { display: grid; gap: var(--space-sm); }
.term { display: grid; gap: var(--space-2xs); border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-lg); background: var(--color-surface-raised); padding: var(--space-md) var(--space-lg); }
.term-title { display: flex; align-items: flex-start; gap: var(--space-sm); font-weight: var(--weight-strong); }
.term-title .icon { width: var(--size-icon-sm); height: var(--size-icon-sm); margin-top: var(--space-3xs); color: var(--color-positive); }
.term-body { color: var(--color-ink-soft); font-size: var(--type-label-size); }
.registration { overflow: hidden; border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-lg); background: var(--color-surface-raised); }
.registration > div { display: grid; grid-template-columns: minmax(0, var(--size-label-column)) minmax(0, 1fr); gap: var(--space-md); padding: var(--space-sm) var(--space-lg); font-size: var(--type-label-size); }
.registration > div + div { border-top: var(--border-hairline) solid var(--color-line); }
.registration dt { color: var(--color-ink-soft); }
.registration dd { overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.status-positive { color: var(--color-positive); font-weight: var(--weight-strong); }
.contact-bar { display: grid; flex: none; grid-auto-columns: auto; grid-auto-flow: column; grid-template-columns: minmax(0, 1fr); gap: var(--space-sm); border-top: var(--border-hairline) solid var(--color-line); background: var(--color-surface-raised); padding: var(--space-md) var(--space-lg) calc(var(--space-md) + env(safe-area-inset-bottom)); }
.contact-bar .notice { grid-column: 1 / -1; }
.contact-primary { min-width: 0; padding-inline: var(--space-md); font-variant-numeric: tabular-nums; }
.contact-primary span { overflow-wrap: anywhere; }
.contact-square { display: grid; place-items: center; width: calc(var(--size-touch) + var(--space-xs)); min-height: calc(var(--size-touch) + var(--space-xs)); border: var(--border-control) solid var(--color-line); border-radius: var(--radius-lg); background: var(--color-surface-raised); color: var(--color-accent); }
.contact-square:hover { border-color: var(--color-accent); }

/* ---------- Photo inventory ---------- */
.notice-positive { background: var(--color-positive-wash); color: var(--color-positive); font-weight: var(--weight-medium); }
.badge-demo { background: var(--color-warn-wash); color: var(--color-warn); }
.badge-debug { background: var(--color-inverse-surface); color: var(--color-ink-inverse); }
.button-danger { background: var(--color-danger); color: var(--color-ink-inverse); }
.button-danger:hover:not(:disabled) { background: var(--color-ink); }
.icon-button { display: grid; flex: none; place-items: center; width: var(--size-touch); height: var(--size-touch); border: 0; border-radius: 50%; background: transparent; color: var(--color-ink-soft); transition: background-color var(--motion-fast) var(--easing-standard), color var(--motion-fast) var(--easing-standard); }
.icon-button:hover { background: var(--color-surface-sunken); color: var(--color-ink); }
.step-group-label { margin-bottom: calc(-1 * var(--space-xs)); color: var(--color-ink-soft); font-size: var(--type-overline-size); font-weight: var(--type-overline-weight); letter-spacing: var(--type-overline-tracking); line-height: var(--type-overline-line); text-transform: uppercase; }
.photo-step, .confirm-step { display: grid; gap: var(--space-md); }
.confirm-step { gap: var(--space-lg); }
@keyframes spin { to { transform: rotate(360deg); } }

/* Text fields */
.text-field { display: grid; gap: var(--space-xs); }
.field-hint { color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.field-error { color: var(--color-danger); font-size: var(--type-label-size); font-weight: var(--weight-medium); }
.text-field input[aria-invalid="true"] { border-color: var(--color-danger); }
.code-input { max-width: calc(var(--size-card-min) - var(--space-3xl)); font-size: var(--type-number-size) !important; font-weight: var(--weight-heavy); font-variant-numeric: tabular-nums; letter-spacing: 0.32em; }

/* Camera and library inputs: a label around a visually hidden file input. */
.capture { position: relative; display: inline-flex; align-items: center; gap: var(--space-sm); min-height: var(--size-touch); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.capture-input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.capture:focus-within { outline: var(--border-focus) solid var(--color-accent); outline-offset: var(--space-3xs); }
.capture-glyph { display: grid; flex: none; place-items: center; color: var(--color-accent); }
.capture-text { display: grid; min-width: 0; text-align: left; }
.capture-label { font-size: var(--type-label-size); font-weight: var(--weight-strong); line-height: var(--type-label-line); }
.capture-sub { color: var(--color-ink-soft); font-size: var(--type-caption-size); font-weight: var(--weight-regular); line-height: var(--type-caption-line); }
.capture-disabled { cursor: not-allowed; opacity: var(--opacity-disabled); }
.capture-tile { flex-direction: column; justify-content: center; gap: var(--space-2xs); width: var(--size-thumb); height: var(--size-thumb); border-radius: var(--radius-md); background: var(--color-accent-wash); color: var(--color-accent-strong); transition: background-color var(--motion-fast) var(--easing-standard); }
.capture-tile .capture-text { text-align: center; }
.capture-tile .capture-label { font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.capture-tile:hover { background: var(--color-plan-room); box-shadow: inset 0 0 0 var(--border-control) var(--color-accent); }
.capture-hero, .capture-square { justify-content: center; border-radius: var(--radius-lg); background: var(--color-accent-wash); color: var(--color-accent-strong); transition: box-shadow var(--motion-fast) var(--easing-standard); }
.capture-hero { width: 100%; min-height: calc(var(--size-glyph-lg) + var(--space-3xl)); padding: var(--space-lg); gap: var(--space-md); }
.capture-hero .capture-glyph { width: var(--size-glyph); height: var(--size-glyph); border-radius: var(--radius-md); background: var(--color-surface-raised); }
.capture-hero .capture-label { font-size: var(--type-body-size); }
.capture-hero:hover, .capture-square:hover { box-shadow: inset 0 0 0 var(--border-control) var(--color-accent); }
.capture-square { flex-direction: column; gap: var(--space-3xs); width: var(--size-thumb); height: var(--size-thumb); padding: var(--space-2xs); }
.capture-square .capture-text { text-align: center; }
.capture-square .capture-label { font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.capture-link { padding: 0 var(--space-2xs); color: var(--color-accent); }
.capture-link .capture-label { text-decoration: underline; text-underline-offset: 0.2em; }
.capture-link .icon { width: var(--size-icon-sm); height: var(--size-icon-sm); }
.capture-chip { border-radius: var(--radius-pill); background: var(--color-surface-raised); padding: 0 var(--space-md); color: var(--color-accent-strong); box-shadow: inset 0 0 0 var(--border-control) var(--color-line); }
.capture-chip .icon { width: var(--size-icon-sm); height: var(--size-icon-sm); }
.capture-chip:hover { box-shadow: inset 0 0 0 var(--border-control) var(--color-accent); }

/* Photos */
.photo-strip { display: flex; flex-wrap: wrap; gap: var(--space-sm); }
.photo-tile { position: relative; flex: none; width: var(--size-thumb); height: var(--size-thumb); margin: 0; overflow: hidden; border-radius: var(--radius-md); background: var(--color-surface-sunken); }
.photo-tile img { display: block; width: 100%; height: 100%; object-fit: cover; }
.photo-tile-empty { display: grid; place-items: center; width: 100%; height: 100%; color: var(--color-ink-soft); }
.photo-tile-state { position: absolute; inset: 0; display: grid; place-items: center; background: var(--color-scrim); color: var(--color-ink-inverse); }
.photo-tile-failed .photo-tile-state, .photo-tile-rejected .photo-tile-state { background: var(--color-warn-wash); color: var(--color-warn); }
.photo-tile-spinner { display: block; flex: none; width: var(--size-icon); height: var(--size-icon); border: var(--border-selected) solid currentColor; border-top-color: transparent; border-radius: 50%; animation: spin calc(var(--motion-slow) * 3) linear infinite; }
.issue-list { display: grid; gap: var(--space-xs); margin: 0; padding: 0; list-style: none; }
.issue { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 0 var(--space-sm); border-radius: var(--radius-md); background: var(--color-warn-wash); padding: var(--space-2xs) var(--space-xs) var(--space-2xs) var(--space-md); color: var(--color-warn); font-size: var(--type-label-size); font-weight: var(--weight-medium); line-height: var(--type-caption-line); }
.issue > .icon { width: var(--size-icon-sm); height: var(--size-icon-sm); }
.issue-actions { display: flex; flex-wrap: wrap; grid-column: 2; margin-left: calc(-1 * var(--space-sm)); }
.issue .button-text { color: var(--color-warn); }

/* Rooms */
.room-picker-block { display: grid; gap: var(--space-sm); }
.room-picker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-xs); }
.room-add { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-sm); min-width: 0; min-height: var(--size-touch); border: var(--border-control) solid var(--color-line); border-radius: var(--radius-md); background: var(--color-surface-raised); padding: var(--space-xs) var(--space-sm) var(--space-xs) var(--space-md); color: var(--color-ink); font-size: var(--type-label-size); font-weight: var(--weight-medium); line-height: var(--type-label-line); text-align: left; transition: border-color var(--motion-fast) var(--easing-standard), background-color var(--motion-fast) var(--easing-standard); }
.room-add > .icon:first-child { color: var(--color-accent); }
.room-add-plus { width: var(--size-icon-sm); height: var(--size-icon-sm); color: var(--color-ink-soft); }
.room-add:hover:not(:disabled) { border-color: var(--color-accent); background: var(--color-accent-wash); }
.room-add:disabled { opacity: var(--opacity-disabled); }
.room-card { display: grid; gap: var(--space-md); border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-xl); background: var(--color-surface-raised); padding: var(--space-md) var(--space-sm) var(--space-lg) var(--space-lg); box-shadow: var(--elevation-raised); }
.room-card > :not(.room-card-head) { margin-right: var(--space-sm); }
.room-card-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-md); }
.room-card-icon, .list-group-icon { display: grid; place-items: center; width: var(--size-well); height: var(--size-well); border-radius: var(--radius-md); background: var(--color-accent-wash); color: var(--color-accent); }
.room-card-text { display: grid; min-width: 0; }
.room-card-title { font-size: var(--type-heading-size); font-weight: var(--type-heading-weight); line-height: var(--type-heading-line); letter-spacing: var(--type-heading-tracking); overflow-wrap: anywhere; }
.room-card-meta { color: var(--color-ink-soft); font-size: var(--type-caption-size); font-variant-numeric: tabular-nums; }
.room-card-hint { color: var(--color-ink-soft); font-size: var(--type-label-size); line-height: var(--type-caption-line); }
.room-card-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-sm) var(--space-md); border-top: var(--border-hairline) solid var(--color-line); padding-top: var(--space-md); }
.room-card-foot .analysis-status { flex: 1 1 var(--size-card-min); }
.room-analyze { min-height: var(--size-touch); padding-block: var(--space-xs); }
.analysis-status { display: flex; align-items: flex-start; gap: var(--space-sm); color: var(--color-ink-soft); font-size: var(--type-label-size); line-height: var(--type-caption-line); }
.analysis-status > .icon, .analysis-status > .photo-tile-spinner { width: var(--size-icon-sm); height: var(--size-icon-sm); margin-top: var(--space-3xs); }
.analysis-text { display: grid; gap: var(--space-3xs); min-width: 0; }
.analysis-title { font-weight: var(--weight-strong); }
.analysis-detail { font-size: var(--type-caption-size); font-weight: var(--weight-regular); }
.analysis-ok { color: var(--color-positive); }
.analysis-pending { color: var(--color-accent-strong); }
.analysis-fallback { border-radius: var(--radius-md); background: var(--color-warn-wash); padding: var(--space-sm) var(--space-md); color: var(--color-warn); }
.analysis-status .badge { margin-left: auto; }

/* Typed items */
.capture-rows { display: grid; gap: var(--space-sm); }
.capture-rows:empty { display: none; }
.capture-row { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-md); border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-lg); background: var(--color-surface-raised); padding: var(--space-md); box-shadow: var(--elevation-raised); }
.capture-row-main { display: grid; gap: var(--space-sm); min-width: 0; }
.capture-row-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-xs) var(--space-sm); }
.capture-row-status { flex: 1 1 auto; color: var(--color-ink-soft); font-size: var(--type-caption-size); }
.add-row { justify-self: start; }

/* Confirm list */
.list-group { display: grid; gap: var(--space-sm); }
.list-group-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-md); }
.list-group-title { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-3xs) var(--space-sm); font-size: var(--type-heading-size); font-weight: var(--type-heading-weight); line-height: var(--type-heading-line); letter-spacing: var(--type-heading-tracking); }
.list-group-meta { color: var(--color-ink-soft); font-size: var(--type-caption-size); font-weight: var(--weight-medium); letter-spacing: 0; }
.list-group-body { display: grid; overflow: hidden; border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-lg); background: var(--color-surface-raised); }
.list-group-body > * + * { border-top: var(--border-hairline) solid var(--color-line); }
.list-group-body > .stepper { border-width: var(--border-hairline) 0 0; border-radius: 0; }
.list-group-body > .item-search { padding: var(--space-md) var(--space-lg) var(--space-lg); }
/* Phones: name and remove on the first line, the count and Stays below.
   Wide screens move the count and Stays up beside the name. */
.item-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: var(--space-sm) var(--space-xs); padding: var(--space-md) var(--space-sm) var(--space-md) var(--space-lg); transition: background-color var(--motion-fast) var(--easing-standard); }
.item-row > * { grid-column: 1 / -1; }
.item-row > .item-row-main { grid-column: 1; grid-row: 1; }
.item-row > .item-row-remove { grid-column: 2; grid-row: 1; }
.item-row-main { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-md); }
.item-thumb { display: block; width: var(--size-glyph); height: var(--size-glyph); border-radius: var(--radius-sm); background: var(--color-surface-sunken); object-fit: cover; }
.item-thumb-icon { display: grid; place-items: center; color: var(--color-ink-soft); }
.item-thumb-icon .icon { width: var(--size-icon-sm); height: var(--size-icon-sm); }
.item-row-text { display: grid; gap: var(--space-3xs); min-width: 0; padding-top: var(--space-3xs); }
.item-row-title { font-size: var(--type-body-size); font-weight: var(--weight-strong); line-height: var(--type-label-line); overflow-wrap: anywhere; }
.item-row-detail { color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.item-row-chips { display: flex; flex-wrap: wrap; gap: var(--space-2xs); }
.item-row-chips:empty { display: none; }
.confidence, .item-row-matching, .item-row-stays-note { display: inline-flex; align-items: center; border-radius: var(--radius-pill); padding: var(--space-3xs) var(--space-sm); font-size: var(--type-caption-size); font-weight: var(--weight-strong); line-height: var(--type-caption-line); white-space: nowrap; }
.confidence-high { background: var(--color-positive-wash); color: var(--color-positive); }
.confidence-medium { background: var(--color-accent-wash); color: var(--color-accent-strong); }
.confidence-low { background: var(--color-warn-wash); color: var(--color-warn); }
.confidence-yours, .confidence-manual, .item-row-stays-note { background: var(--color-surface-sunken); color: var(--color-ink-soft); }
.item-row-matching { background: var(--color-accent-wash); color: var(--color-accent-strong); }
.item-row-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-xs) var(--space-sm); padding-right: var(--space-sm); }
.item-row > .capture-chip { justify-self: start; }
.count-control input { width: calc(var(--size-touch) + var(--space-xs)); }
.count-control button:disabled { color: var(--color-line-strong); box-shadow: none; cursor: default; }
.stays-toggle { min-height: var(--size-touch); border: var(--border-control) solid var(--color-line); border-radius: var(--radius-pill); background: var(--color-surface-raised); padding: var(--space-xs) var(--space-lg); color: var(--color-ink-soft); font-size: var(--type-label-size); font-weight: var(--weight-strong); transition: background-color var(--motion-fast) var(--easing-standard), border-color var(--motion-fast) var(--easing-standard); }
.stays-toggle[aria-pressed="true"] { border-color: var(--color-accent); background: var(--color-accent-wash); color: var(--color-accent-strong); box-shadow: inset 0 0 0 var(--border-hairline) var(--color-accent); }
.item-row-stays { background: var(--color-surface); }
.item-row-stays .item-row-title { color: var(--color-ink-soft); text-decoration: line-through; text-decoration-thickness: var(--border-hairline); }
.item-row-stays .item-thumb, .item-row-stays .count-control { opacity: var(--opacity-disabled); }
.item-row-removed { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-xs); padding-block: var(--space-2xs); background: var(--color-surface); color: var(--color-ink-soft); font-size: var(--type-label-size); }
.item-removed-text { overflow-wrap: anywhere; }
.item-row .segmented { margin-right: var(--space-sm); }
.alternates { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-xs); padding-right: var(--space-sm); }
.alternates-label { color: var(--color-ink-soft); font-size: var(--type-caption-size); font-weight: var(--weight-strong); }
.alternate { display: inline-flex; align-items: center; gap: var(--space-xs); min-height: var(--size-touch); max-width: 100%; border: var(--border-control) solid var(--color-line); border-radius: var(--radius-pill); background: var(--color-surface-raised); padding: var(--space-2xs) var(--space-md); color: var(--color-accent-strong); font-size: var(--type-label-size); font-weight: var(--weight-medium); line-height: var(--type-caption-line); text-align: left; }
.alternate:hover { border-color: var(--color-accent); background: var(--color-accent-wash); }
.alternate .icon { width: var(--size-icon-sm); height: var(--size-icon-sm); }
.alternate-other[aria-expanded="true"] { border-color: var(--color-accent); background: var(--color-accent-wash); }
.item-search { position: relative; display: grid; gap: var(--space-xs); }
.item-row .item-search { padding-right: var(--space-sm); }
.item-search-field { position: relative; }
.item-search-icon { position: absolute; top: 50%; left: var(--space-md); width: var(--size-icon-sm); height: var(--size-icon-sm); color: var(--color-ink-soft); transform: translateY(-50%); pointer-events: none; }
.item-search-input { padding-left: calc(var(--space-md) + var(--size-icon-sm) + var(--space-sm)) !important; }
/* In the flow, not floating: the list sits inside cards that round their corners. */
.item-search .suggestions { position: static; box-shadow: none; }
.item-search-options .suggestion { align-items: flex-start; }
.suggestion-text { display: grid; min-width: 0; text-align: left; }
.suggestion-text small { color: var(--color-ink-soft); font-size: var(--type-caption-size); font-weight: var(--weight-regular); }
.item-search-empty { color: var(--color-ink-soft); font-size: var(--type-caption-size); }
.suggestion-create { color: var(--color-accent-strong); }

/* The list built by hand: notices, the search, then the list; empty regions take no gap. */
.hand-notices, .hand-list { display: grid; gap: var(--space-md); }
.hand-notices:empty, .hand-list:empty { display: none; }

/* Questions */
.questions { display: grid; gap: var(--space-md); border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-xl); background: var(--color-surface-raised); padding: var(--space-lg); }
.questions-title { font-size: var(--type-heading-size); font-weight: var(--type-heading-weight); line-height: var(--type-heading-line); letter-spacing: var(--type-heading-tracking); }
.choice-question { display: grid; gap: var(--space-sm); }
.choice-question + .choice-question { border-top: var(--border-hairline) solid var(--color-line); padding-top: var(--space-md); }
.choice-question-group { display: grid; gap: var(--space-2xs); }
.choice-question-label { color: var(--color-ink-soft); font-size: var(--type-caption-size); font-weight: var(--weight-strong); }

/* Retention */
.retention { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: var(--space-sm); border-radius: var(--radius-md); padding: var(--space-sm) var(--space-sm) var(--space-sm) var(--space-md); font-size: var(--type-label-size); line-height: var(--type-caption-line); }
.retention > .icon { width: var(--size-icon-sm); height: var(--size-icon-sm); margin-top: var(--space-3xs); }
.retention-info { background: var(--color-accent-wash); color: var(--color-accent-strong); }
.retention-positive { background: var(--color-positive-wash); color: var(--color-positive); }
.retention-warn { background: var(--color-warn-wash); color: var(--color-warn); }
.retention-body { display: grid; gap: var(--space-3xs); min-width: 0; }
.retention-text { padding-top: var(--space-3xs); font-weight: var(--weight-medium); }
.retention-message { font-size: var(--type-caption-size); font-weight: var(--weight-strong); }
.retention-actions { display: flex; flex-wrap: wrap; align-items: center; margin-left: calc(-1 * var(--space-sm)); }
.retention-actions:empty { display: none; }
.retention .button-text { color: inherit; }
.retention-confirm { display: grid; gap: var(--space-xs); padding-left: var(--space-sm); padding-top: var(--space-2xs); }
.retention-confirm-text { color: var(--color-ink); font-weight: var(--weight-strong); }
.retention-confirm-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-xs); }
.retention-confirm .button-danger { min-height: var(--size-touch); padding: var(--space-xs) var(--space-lg); font-size: var(--type-label-size); }
.trip-retention { display: grid; gap: var(--space-sm); }

/* Keep your photos? */
.keep-copy { display: grid; gap: var(--space-sm); color: var(--color-ink); }
.keep-skip-line { color: var(--color-ink-soft); }
.keep-sent { color: var(--color-ink); }
.keep-change { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--space-2xs); color: var(--color-ink-soft); }
.inline-link { padding-inline: var(--space-2xs); }
.keep-resend { justify-self: start; }

/* Email preview (mock mail only) */
.mail-drawer { overflow: hidden; border: var(--border-hairline) solid var(--color-line-strong); border-radius: var(--radius-lg); background: var(--color-surface-sunken); }
.mail-drawer-summary { display: flex; align-items: center; gap: var(--space-sm); min-height: calc(var(--size-touch) + var(--space-xs)); padding: var(--space-xs) var(--space-md); color: var(--color-ink); cursor: pointer; list-style: none; }
.mail-drawer-summary::-webkit-details-marker { display: none; }
.mail-drawer-summary > .icon:first-child { color: var(--color-accent); }
.mail-drawer-title { flex: 1; min-width: 0; font-size: var(--type-label-size); font-weight: var(--weight-strong); }
.mail-drawer-chevron { width: var(--size-icon-sm); height: var(--size-icon-sm); color: var(--color-ink-soft); transition: transform var(--motion-base) var(--easing-standard); }
.mail-drawer[open] .mail-drawer-chevron { transform: rotate(180deg); }
.mail-drawer-body { display: grid; gap: var(--space-sm); padding: 0 var(--space-md) var(--space-md); }
.mail-drawer-note { color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.mail-paper { display: grid; gap: var(--space-md); border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-md); background: var(--color-surface-raised); padding: var(--space-md) var(--space-lg); box-shadow: var(--elevation-raised); }
.mail-meta { display: grid; gap: var(--space-2xs); border-bottom: var(--border-hairline) solid var(--color-line); padding-bottom: var(--space-sm); font-size: var(--type-caption-size); }
.mail-meta > div { display: grid; grid-template-columns: var(--size-glyph-lg) minmax(0, 1fr); gap: var(--space-sm); }
.mail-meta dt { color: var(--color-ink-soft); font-weight: var(--weight-strong); }
.mail-meta dd { overflow-wrap: anywhere; }
.mail-subject { font-size: var(--type-label-size); font-weight: var(--weight-heavy); }
.mail-text { display: grid; gap: var(--space-md); font-size: var(--type-label-size); line-height: var(--type-body-line); }
.mail-text p { overflow-wrap: anywhere; }
.mail-text a { display: inline-flex; align-items: center; min-height: var(--size-touch); overflow-wrap: anywhere; word-break: break-all; font-weight: var(--weight-medium); }

/* Debug primitives panel (DESIGN D6, removable) */
.primitives { border: var(--border-hairline) solid var(--color-line-strong); border-radius: var(--radius-lg); background: var(--color-surface-raised); padding: 0 var(--space-lg) var(--space-lg); }
.primitives-summary { display: flex; align-items: center; gap: var(--space-sm); min-height: calc(var(--size-touch) + var(--space-xs)); cursor: pointer; list-style: none; }
.primitives-summary::-webkit-details-marker { display: none; }
.primitives-summary > .icon { color: var(--color-ink-soft); }
.primitives-title { flex: 1; min-width: 0; font-size: var(--type-label-size); font-weight: var(--weight-strong); }
.primitives-note { margin-bottom: var(--space-md); color: var(--color-ink-soft); font-size: var(--type-caption-size); line-height: var(--type-caption-line); }
.primitives-rows { display: grid; overflow: hidden; border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-md); }
.primitives-rows > div { display: grid; grid-template-columns: minmax(0, var(--size-label-column)) minmax(0, 1fr); gap: var(--space-md); padding: var(--space-xs) var(--space-md); font-size: var(--type-caption-size); }
.primitives-rows > div + div { border-top: var(--border-hairline) solid var(--color-line); }
.primitives-rows dt { color: var(--color-ink-soft); font-weight: var(--weight-strong); }
.primitives-rows dd { font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }

/* ---------- Emailed-link pages (rendered by app/server/landing.js) ---------- */
.signin-card.landing-card { gap: var(--space-xs); align-items: stretch; }
.landing-card .signin-wordmark { align-self: center; }
.landing-title { margin: var(--space-sm) 0 var(--space-xs); font-size: var(--type-title-size); font-weight: var(--type-title-weight); line-height: var(--type-title-line); letter-spacing: var(--type-title-tracking); text-align: center; text-wrap: balance; }
.signin-card.landing-card p { margin: 0; text-align: center; }
.signin-card.landing-card form { margin-top: var(--space-xl); }
.landing-link { display: inline-flex; align-items: center; justify-content: center; align-self: center; min-height: var(--size-touch); margin-top: var(--space-md); color: var(--color-accent); font-weight: var(--weight-strong); }
.mail-preview { margin-top: var(--space-lg); overflow: hidden; border: var(--border-hairline) solid var(--color-line-strong); border-radius: var(--radius-lg); background: var(--color-surface-sunken); text-align: left; }
.mail-preview summary { display: flex; align-items: center; min-height: calc(var(--size-touch) + var(--space-xs)); padding: var(--space-xs) var(--space-md); font-size: var(--type-label-size); font-weight: var(--weight-strong); cursor: pointer; }
.mail-preview .mail-preview-subject { margin: 0; border-top: var(--border-hairline) solid var(--color-line); background: var(--color-surface-raised); padding: var(--space-md) var(--space-md) var(--space-2xs); color: var(--color-ink); font-weight: var(--weight-heavy); text-align: left; }
.mail-preview-text { margin: 0; background: var(--color-surface-raised); padding: var(--space-2xs) var(--space-md) var(--space-md); color: var(--color-ink); font-family: var(--font-ui); font-size: var(--type-caption-size); line-height: var(--type-body-line); white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-word; }

/* ---------- Guide page ---------- */
.guide-page .site-header, .guide-page footer, .guide { width: min(var(--size-content), calc(100% - 2 * var(--space-lg))); margin-inline: auto; }
.guide-page .site-header { border-bottom: var(--border-hairline) solid var(--color-line); }
.header-cta { border: var(--border-hairline) solid var(--color-edit-outline); border-radius: var(--radius-pill); background: var(--color-accent-wash); padding: 0 var(--space-md) 0 var(--space-lg); color: var(--color-accent-strong); font-size: var(--type-label-size); font-weight: var(--weight-strong); white-space: nowrap; }
.header-cta:hover { border-color: var(--color-accent); }
.guide { padding: var(--space-3xl) 0 var(--space-sm); font-size: var(--type-heading-size); line-height: 1.65; }
.guide .eyebrow { margin-bottom: var(--space-md); }
.guide h1 { margin: 0 0 var(--space-lg); font-size: var(--type-display-size); font-weight: var(--type-display-weight); line-height: var(--type-display-line); letter-spacing: var(--type-display-tracking); }
.guide h2 { margin: 2.2em 0 0.45em; font-size: var(--type-title-size); font-weight: var(--type-title-weight); line-height: var(--type-title-line); letter-spacing: var(--type-title-tracking); }
.guide p, .guide li { max-width: 66ch; }
.guide p { margin: 0 0 1em; }
.guide-lead { color: var(--color-ink-soft); font-size: 1.1em; line-height: 1.55; }
.guide ul { display: grid; gap: 0.6em; margin: 0.2em 0 1em; padding: 0; list-style: none; }
.guide li { position: relative; padding-left: var(--space-3xl); }
.guide li::before { content: ""; position: absolute; top: 0.2em; left: 0; width: var(--space-xl); height: var(--space-xl); border-radius: 50%; background: var(--color-accent-wash); }
.guide li::after { content: ""; position: absolute; top: calc(0.2em + var(--space-2xs)); left: var(--space-sm); width: var(--space-xs); height: var(--space-md); border: solid var(--color-accent); border-width: 0 var(--border-selected) var(--border-selected) 0; transform: translateX(calc(-1 * var(--space-3xs))) rotate(45deg); }
.guide-callout { margin-top: 2.4em; border: var(--border-hairline) solid var(--color-edit-outline); border-radius: var(--radius-lg); background: var(--color-accent-wash); padding: var(--space-xl) var(--space-2xl) var(--space-xs); }
.guide-callout h2 { margin-top: 0; color: var(--color-accent-strong); }
.guide-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-md) var(--space-2xl); margin-top: 2.4em; border-radius: var(--radius-lg); background: var(--color-inverse-surface); padding: var(--space-xl) var(--space-2xl); color: var(--color-ink-inverse); }
.guide-cta p { margin: 0; font-weight: var(--weight-strong); }
.guide-cta-button { border-radius: var(--radius-md); background: var(--color-surface-raised); padding: 0 var(--space-lg); color: var(--color-accent-strong); font-weight: var(--weight-heavy); }
.guide-page footer { margin-top: var(--space-4xl); }

/* ---------- Sign-in page ---------- */
.signin-page { display: grid; min-height: 100vh; min-height: 100svh; place-items: center; padding: var(--space-2xl) var(--space-lg) 8vh; }
.signin { width: min(var(--size-narrow), 100%); margin: 0; }
.signin-card { display: flex; flex-direction: column; align-items: center; border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-sheet); background: var(--color-surface-raised); padding: var(--space-3xl) var(--space-xl); box-shadow: var(--elevation-card); text-align: center; }
.signin-card .signin-wordmark { margin-bottom: var(--space-xs); font-size: calc(var(--type-wordmark-size) * 1.7); }
.signin-card p { margin: 0 0 var(--space-2xl); color: var(--color-ink-soft); line-height: var(--type-caption-line); }
.signin-card form { width: 100%; margin: 0; }
.signin-card .primary-button { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-md); width: 100%; min-height: calc(var(--size-touch) + var(--space-xs)); border: 0; border-radius: var(--radius-lg); background: var(--color-accent); padding: var(--space-md) var(--space-lg); color: var(--color-ink-inverse); font-size: var(--type-body-size); font-weight: var(--weight-heavy); text-decoration: none; transition: background-color var(--motion-fast) var(--easing-standard); }
.signin-card .primary-button:hover { background: var(--color-accent-strong); }
.signin-card a.primary-button::after { content: ""; width: var(--size-icon-sm); height: var(--size-icon-sm); background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h13'/%3E%3Cpath d='M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h13'/%3E%3Cpath d='M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; transition: transform var(--motion-base) var(--easing-standard); }
.signin-card a.primary-button:hover::after { transform: translateX(var(--space-2xs)); }
.signin-email { display: inline-block; margin-top: var(--space-sm); color: var(--color-ink); font-weight: var(--weight-medium); overflow-wrap: anywhere; }

/* ---------- Wide screens (--breakpoint-wide) ---------- */
@media (min-width: 640px) {
  .site-header, .page, footer { width: min(var(--size-content), calc(100% - 2 * var(--space-2xl))); }
  .page { gap: var(--space-2xl); }
  .intro { padding-top: var(--space-lg); }
  .pills { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .step-actions { display: flex; flex-direction: row-reverse; align-items: center; justify-content: flex-start; gap: var(--space-md); }
  .step-actions .button-primary { width: auto; min-width: calc(var(--size-card-min) + var(--space-2xl)); }
  .row-list, .skeleton-list { margin-inline: 0; overflow: hidden; border: var(--border-hairline) solid var(--color-line); border-radius: var(--radius-lg); }
  .row-list-cards { border: 0; border-radius: 0; overflow: visible; }
  .date-day-price { font-size: var(--type-label-size); }
  .shortlist-rail > .button { flex: 0 1 auto; }
  .outreach-panel { padding: var(--space-2xl); }
  .outreach-heading { grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
  .outreach-contact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .outreach-note, .outreach-contact-error { grid-column: 1 / -1; }
  .outreach-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .outreach-submit { width: auto; }
  .mover-sheet { inset: 0; width: min(var(--size-sheet), calc(100% - 2 * var(--space-2xl))); max-height: min(calc(100dvh - 2 * var(--space-3xl)), calc(var(--size-content) + var(--space-4xl) * 2)); margin: auto; border-radius: var(--radius-xl); }
  .sheet-handle { display: none; }
  .sheet-scroll { padding-top: var(--space-xl); }
  .guide h1 { font-size: calc(var(--type-display-size) * 1.3); }
  .room-picker { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .item-row { grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; column-gap: var(--space-md); }
  .item-row > .item-row-controls { grid-column: 2; grid-row: 1; padding-right: 0; }
  .item-row > .item-row-remove { grid-column: 3; }
  .questions { padding: var(--space-xl) var(--space-2xl); }
}