/* Clear, clickable step navigation and explicit contrast for both calculator modes. */
body.calc-page.ridecalc-redesign:not(.budget-mode) .planner {
  color: #111816;
  background: var(--ride-snow);
}
body.calc-page.ridecalc-redesign:not(.budget-mode) .planner-header .eyebrow,
body.calc-page.ridecalc-redesign:not(.budget-mode) .planner-overview .mini-label { color: #59675f; }
body.calc-page.ridecalc-redesign:not(.budget-mode) .planner-header h2,
body.calc-page.ridecalc-redesign:not(.budget-mode) .planner-overview h2 { color: #111816; }
body.calc-page.ridecalc-redesign:not(.budget-mode) .planner-header > p:last-child,
body.calc-page.ridecalc-redesign:not(.budget-mode) .planner-overview .panel-description { color: #536059; }
body.calc-page.ridecalc-redesign:not(.budget-mode) .planner-header h2 em,
body.calc-page.ridecalc-redesign:not(.budget-mode) .planner-overview h2 em { color: var(--ride-red); }
body.calc-page.ridecalc-redesign:not(.budget-mode) .planner-roadmap li { border-color: #d9ddd5; color: #26362e; }
body.calc-page.ridecalc-redesign:not(.budget-mode) .interview {
  border-color: #d9ddd5;
  color: #111816;
  background: #fff;
  box-shadow: 0 18px 42px #101a1610;
}
body.calc-page.ridecalc-redesign:not(.budget-mode) .step-panel-content { color: #111816; }
body.calc-page.ridecalc-redesign:not(.budget-mode) .step-panel > .step-actions {
  border-color: #d9ddd5;
  background: #fff;
}
body.calc-page.ridecalc-redesign:not(.budget-mode) .step-actions > span,
body.calc-page.ridecalc-redesign:not(.budget-mode) .choice-field legend,
body.calc-page.ridecalc-redesign:not(.budget-mode) .small-label,
body.calc-page.ridecalc-redesign:not(.budget-mode) .field-hint { color: #5f6a63; }
body.calc-page.ridecalc-redesign:not(.budget-mode) .toggle-row { color: #18231d; border-color: #d9ddd5; }
body.calc-page.ridecalc-redesign:not(.budget-mode) .toggle-row small { color: #657168; }
body.calc-page.ridecalc-redesign:not(.budget-mode) .back-button { color: #18231d; border-color: #cbd3ca; }

body.calc-page.ridecalc-redesign.budget-mode .planner {
  color: var(--ride-snow);
  background: var(--ride-ink);
}
body.calc-page.ridecalc-redesign.budget-mode .planner-header h2,
body.calc-page.ridecalc-redesign.budget-mode .planner-overview h2 { color: var(--ride-snow); }
body.calc-page.ridecalc-redesign.budget-mode .planner-header .eyebrow,
body.calc-page.ridecalc-redesign.budget-mode .planner-overview .mini-label { color: var(--ride-snow-muted); }
body.calc-page.ridecalc-redesign.budget-mode .planner-header > p:last-child,
body.calc-page.ridecalc-redesign.budget-mode .planner-overview .panel-description { color: #c1d5ce; }
body.calc-page.ridecalc-redesign.budget-mode .planner-header h2 em,
body.calc-page.ridecalc-redesign.budget-mode .planner-overview h2 em { color: var(--ride-mint); }
body.calc-page.ridecalc-redesign.budget-mode .planner-roadmap li { border-color: #39423d; color: #edf2ec; }
body.calc-page.ridecalc-redesign.budget-mode .interview {
  border-color: #45544c;
  color: var(--ride-snow);
  background: #111816;
  box-shadow: 0 18px 42px #0006;
}
body.calc-page.ridecalc-redesign.budget-mode .step-panel-content { color: var(--ride-snow); }
body.calc-page.ridecalc-redesign.budget-mode .step-panel > .step-actions {
  border-color: #405149;
  background: #111816;
}
body.calc-page.ridecalc-redesign.budget-mode .step-actions > span,
body.calc-page.ridecalc-redesign.budget-mode .choice-field legend,
body.calc-page.ridecalc-redesign.budget-mode .small-label,
body.calc-page.ridecalc-redesign.budget-mode .field-hint { color: #c1d5ce; }
body.calc-page.ridecalc-redesign.budget-mode .toggle-row { color: var(--ride-snow); border-color: #405149; }
body.calc-page.ridecalc-redesign.budget-mode .toggle-row small { color: #b3c2ba; }
body.calc-page.ridecalc-redesign.budget-mode .back-button { color: var(--ride-snow); border-color: #66766d; }

body.calc-page.ridecalc-redesign .planner-roadmap li { min-width: 0; }
.planner-roadmap__button {
  display: grid;
  width: 100%;
  min-height: 62px;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  padding: 9px 8px 9px 0;
  border: 0;
  border-left: 2px solid transparent;
  color: inherit;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.planner-roadmap__button:hover:not(:disabled) { background: #758a7c12; }
.planner-roadmap__button:focus-visible { outline: 3px solid #ed1c2466; outline-offset: 2px; }
.planner-roadmap__button .step-number { align-self: start; padding-top: 3px; color: var(--ride-red); }
.planner-roadmap__copy { display: grid; min-width: 0; gap: 4px; }
.planner-roadmap__copy b { min-width: 0; color: inherit; font-size: 11px; line-height: 1.3; white-space: nowrap; overflow-wrap: normal; }
.planner-roadmap__copy .step-summary {
  display: -webkit-box;
  overflow: hidden;
  color: #68756c;
  font-size: 9px;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.planner-roadmap__button[aria-current='step'] { padding-left: 8px; border-left-color: var(--ride-red); }
.planner-roadmap__button[aria-current='step'] b,
.planner-roadmap__button[aria-current='step'] .step-summary { color: var(--ride-red); }
.planner-roadmap__button:disabled { opacity: .72; cursor: not-allowed; }
body.calc-page.ridecalc-redesign.budget-mode .planner-roadmap__copy .step-summary { color: #b7c7be; }
body.calc-page.ridecalc-redesign.budget-mode .planner-roadmap__button[aria-current='step'] b,
body.calc-page.ridecalc-redesign.budget-mode .planner-roadmap__button[aria-current='step'] .step-summary { color: #ff777d; }

.journey-step { display: none; border: 0; }
.journey-step.is-open { display: flex; min-width: 0; flex-direction: column; }
.journey-step.is-open > .step-panel:not([hidden]) { display: flex; min-width: 0; flex-direction: column; }
.builder-complete-note {
  max-width: 38rem;
  margin: auto;
  padding: 28px;
  color: #43554a;
  font-size: clamp(14px, 1.6vw, 19px);
  line-height: 1.6;
  text-align: center;
}
.builder.is-complete .journey-steps { display: none; }
.builder.is-complete .builder-complete-note:not([hidden]) { display: block; }

/* Budget mode keeps the trip controls as a light inset, with dark readable labels. */
body.calc-page.ridecalc-redesign.budget-mode .planner .trip-metric {
  color: #111816;
  border-color: #cbd3ca;
  background: #f8f8f3;
}
body.calc-page.ridecalc-redesign.budget-mode .planner .trip-metric .small-label,
body.calc-page.ridecalc-redesign.budget-mode .planner .trip-metric output { color: #26362e; }
body.calc-page.ridecalc-redesign.budget-mode .planner .trip-metric .round-button,
body.calc-page.ridecalc-redesign.budget-mode .planner .trip-metric .compact-stepper button {
  color: #18231d;
  border-color: #d2d8d0;
  background: #fff;
}
body.calc-page.ridecalc-redesign.budget-mode .planner .trip-metric .range::-webkit-slider-runnable-track,
body.calc-page.ridecalc-redesign.budget-mode .planner .trip-metric .range::-moz-range-track { background: #d9ddd5; }
body.calc-page.ridecalc-redesign.budget-mode .planner .trip-metric .range::-webkit-slider-thumb,
body.calc-page.ridecalc-redesign.budget-mode .planner .trip-metric .range::-moz-range-thumb { border-color: #f8f8f3; }

@media (max-width: 640px) {
  .planner-roadmap,
  .planner.is-step-flow .planner-roadmap {
    display: flex;
    max-width: none;
    gap: 6px;
    overflow-x: auto;
    margin: 12px 0;
    padding: 2px 1px 5px;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
  }
  .planner-roadmap li,
  .planner-roadmap li:last-child {
    flex: 0 0 auto;
    min-height: 0;
    border: 0;
  }
  .planner-roadmap__button {
    width: max-content;
    min-height: 52px;
    grid-template-columns: 18px max-content;
    gap: 6px;
    padding: 7px;
    border: 1px solid #d1d8d0;
    border-radius: 9px;
    background: #ffffff80;
  }
  .planner-roadmap__button[aria-current='step'] { border-color: var(--ride-red); background: #fff4f1; }
  .planner-roadmap__copy b { font-size: 11px; }
  .planner-roadmap__copy .step-summary { display: none; }
  body.calc-page.ridecalc-redesign.budget-mode .planner-roadmap__button { border-color: #45544c; background: #111816; }
  body.calc-page.ridecalc-redesign.budget-mode .planner-roadmap__button[aria-current='step'] { border-color: var(--ride-red); }
}

/* The questionnaire grows with its content so short viewports and text zoom do not hide fields. */
.planner.is-step-flow {
  height: auto;
  min-height: 100vh;
  min-height: 100svh;
}
.planner.is-step-flow .planner-workspace,
.planner.is-step-flow .builder,
.planner.is-step-flow .interview,
.planner.is-step-flow .journey-steps,
.planner.is-step-flow .journey-step.is-open,
.planner.is-step-flow .step-panel:not([hidden]) {
  min-height: auto;
}
.planner.is-step-flow .builder {
  height: auto;
  flex: 0 0 auto;
  overflow: visible;
}
.planner.is-step-flow .interview { overflow: visible; }
.planner.is-step-flow .step-two-options > div { overflow: visible; }
.planner.is-step-flow .step-panel:not([hidden]) {
  flex: 0 0 auto;
  overflow: visible;
}
.planner.is-step-flow .step-panel-content {
  justify-content: flex-start;
  overflow: visible;
}
.planner.is-step-flow .planner-roadmap__copy b,
.planner.is-step-flow .planner-roadmap__copy .step-summary {
  font-size: max(12px, 1em);
  line-height: 1.4;
}
.planner.is-step-flow .planner-overview > p:not(.mini-label),
.planner.is-step-flow .builder-step-intro .panel-description {
  display: block;
  overflow: visible;
  -webkit-line-clamp: unset;
}
.planner.is-step-flow .planner-overview > p:not(.mini-label),
.planner.is-step-flow .builder-step-intro .mini-label,
.planner.is-step-flow .builder-step-intro .panel-description,
.planner.is-step-flow .step-actions > span,
.planner.is-step-flow .step-actions .button {
  font-size: max(12px, 1em);
  line-height: 1.45;
}
.planner.is-step-flow .step-panel-content :is(
  .choice-field legend,
  .date-field legend,
  .date-inputs label,
  .date-inputs input,
  .trip-metric .small-label,
  .children-option,
  .group-note,
  .vibe-level-field legend,
  .vibe-choice-group legend,
  .vibe-level-options label > span,
  .vibe-choice-group .segmented label > span,
  .vibe-toggle-group .toggle-row strong,
  .vibe-toggle-group .toggle-row small,
  .food-options label span,
  .step-two-options .section-heading .eyebrow,
  .step-two-options .section-heading > p,
  .step-two-options .result-note,
  .step-two-options .stay-card h3,
  .step-two-options .stay-card p,
  .step-two-options .experience-title,
  .step-two-options .experience-description,
  .step-two-options .stay-tags span,
  .step-two-options .stay-price strong,
  .step-two-options .stay-price small,
  .step-two-options .card-details,
  .step-two-options .card-choice,
  .step-two-options .more-options-card__title,
  .step-two-options .more-options-card__action,
  .step-two-options .experience-price,
  .step-two-options .service-quantity,
  .origin-options label span,
  .route-stations > strong,
  .recommendation strong,
  .recommendation small,
  .field-hint,
  .auto-tag,
  .transport-options label > span,
  .transport-options small,
  .transfer-picker__head strong,
  .transfer-picker legend,
  .transfer-chips label,
  .transfer-type-filters button,
  .transfer-together strong,
  .transfer-together small,
  .transfer-vehicle-option strong,
  .transfer-vehicle-option small,
  .transfer-vehicle-option b,
  .transfer-picker .field-hint,
  .plan-share-cta strong,
  .plan-share-cta p,
  .plan-share-cta .button
) {
  font-size: max(12px, 1em);
  line-height: 1.4;
}

/* Keep a stable desktop center while taller content remains visible in document flow. */
@media (min-width: 641px) {
  .planner:not(.is-step-flow):has(.journey-step.is-open) .planner-workspace {
    min-height: 100svh;
    grid-template-rows: minmax(100svh, max-content);
    align-items: center;
  }
  .planner:not(.is-step-flow):has(.journey-step.is-open) .builder {
    height: auto;
    align-self: center;
    flex: 0 1 auto;
    overflow: visible;
  }
}

@media (min-width: 641px) and (max-width: 900px) {
  body.calc-page.ridecalc-redesign .planner.is-step-flow .planner-roadmap__copy b {
    font-size: 11px;
    line-height: 1.25;
  }
}

@media (max-width: 640px) {
  .planner:not(.is-step-flow):has(.journey-step.is-open) .planner-workspace {
    min-height: auto;
    grid-template-rows: auto;
  }
  .planner:not(.is-step-flow):has(.journey-step.is-open) .builder { align-self: stretch; }
}

/* Readable type and explicit states for the calculator questionnaire. */
body.calc-page.ridecalc-redesign {
  --ridecalc-readable-ink: #111816;
  --ridecalc-readable-muted: #536059;
  --ridecalc-readable-surface: #ffffff;
  --ridecalc-readable-selected: #e1f1e9;
  --ridecalc-readable-disabled-ink: #445248;
  --ridecalc-readable-disabled-surface: #e5e9e5;
  --ridecalc-readable-border: #6a7b70;
  --ridecalc-readable-focus: #367d58;
  --ridecalc-readable-active: #b10f18;
  --ridecalc-readable-dark-surface: #111816;
  --ridecalc-readable-dark-ink: #f4f5f0;
  --ridecalc-readable-dark-muted: #c1d5ce;
  --ridecalc-readable-dark-border: #66766d;
  --ridecalc-readable-dark-focus: #b7e4d1;
  --ridecalc-readable-dark-active: #ff777d;
}

body.calc-page.ridecalc-redesign .planner .step-panel-content {
  min-width: 0;
  font-size: 16px;
  line-height: 1.5;
  color: var(--ridecalc-readable-ink);
}
body.calc-page.ridecalc-redesign .planner-header > p:last-child,
body.calc-page.ridecalc-redesign .planner-overview .panel-description,
body.calc-page.ridecalc-redesign .builder-step-intro .panel-description {
  font-size: 16px;
  line-height: 1.5;
}
body.calc-page.ridecalc-redesign .planner .step-panel-content :is(
  .choice-field legend,
  .date-field legend,
  .date-inputs label,
  .trip-metric .small-label,
  .children-option,
  .vibe-level-field legend,
  .vibe-choice-group legend,
  .vibe-level-options label > span,
  .vibe-choice-group .segmented label > span,
  .vibe-toggle-group .toggle-row strong,
  .food-options label span,
  .step-two-options .section-heading > p,
  .step-two-options .result-note,
  .step-two-options .stay-card h3,
  .step-two-options .stay-card p,
  .step-two-options .experience-title,
  .step-two-options .experience-description,
  .step-two-options .stay-tags span,
  .step-two-options .stay-price strong,
  .step-two-options .stay-price small,
  .step-two-options .card-details,
  .step-two-options .card-choice,
  .step-two-options .more-options-card__title,
  .step-two-options .more-options-card__action,
  .step-two-options .experience-price,
  .step-two-options .service-quantity,
  .origin-options label span,
  .route-stations > strong,
  .recommendation strong,
  .recommendation small,
  .field-hint,
  .auto-tag,
  .transport-options label > span,
  .transport-options small,
  .transfer-picker__head strong,
  .transfer-picker legend,
  .transfer-chips label,
  .transfer-type-filters button,
  .transfer-together strong,
  .transfer-together small,
  .transfer-vehicle-option strong,
  .transfer-vehicle-option small,
  .transfer-vehicle-option b,
  .plan-share-cta strong,
  .plan-share-cta p,
  .plan-share-cta .button
) {
  min-width: 0;
  font-size: max(14px, .875em);
  line-height: 1.45;
  overflow-wrap: anywhere;
}
body.calc-page.ridecalc-redesign .planner .planner-roadmap__copy b,
body.calc-page.ridecalc-redesign .planner .step-actions .button {
  font-size: max(14px, .875em);
  line-height: 1.45;
}
body.calc-page.ridecalc-redesign .planner .planner-roadmap__copy .step-summary,
body.calc-page.ridecalc-redesign .planner .builder-step-intro .mini-label,
body.calc-page.ridecalc-redesign .planner .step-two-options .section-heading .eyebrow {
  font-size: 12px;
  line-height: 1.45;
}
body.calc-page.ridecalc-redesign .planner .planner-roadmap__button {
  min-height: 62px;
}
body.calc-page.ridecalc-redesign .planner .planner-roadmap__button[aria-current='step'] b,
body.calc-page.ridecalc-redesign .planner .planner-roadmap__button[aria-current='step'] .step-summary {
  color: var(--ridecalc-readable-active);
}
body.calc-page.ridecalc-redesign .planner .planner-roadmap__button:focus-visible {
  outline: 3px solid var(--ridecalc-readable-focus);
}
body.calc-page.ridecalc-redesign .planner .planner-roadmap__button:disabled {
  opacity: 1;
  color: var(--ridecalc-readable-disabled-ink);
  background-color: var(--ridecalc-readable-disabled-surface);
  box-shadow: inset 3px 0 0 var(--ridecalc-readable-border);
}
body.calc-page.ridecalc-redesign .planner .step-panel-content :is(
  input:not([type='checkbox']):not([type='radio']),
  select,
  textarea
) {
  max-width: 100%;
  min-width: 0;
  min-height: 44px;
  font-size: 16px;
}
body.calc-page.ridecalc-redesign .planner .date-inputs input {
  font-size: 16px;
}
body.calc-page.ridecalc-redesign .planner .step-panel-content :is(
  input:checked + span,
  input:checked ~ span,
  [aria-pressed='true'],
  [aria-checked='true'],
  [aria-selected='true']
) {
  color: var(--ridecalc-readable-ink);
  border-color: var(--ridecalc-readable-focus);
  background-color: var(--ridecalc-readable-selected);
}
body.calc-page.ridecalc-redesign .planner .step-panel-content .children-option,
body.calc-page.ridecalc-redesign .planner .step-panel-content .children-option > span:last-child {
  color: #000 !important;
  font-weight: 700;
}
body.calc-page.ridecalc-redesign .planner .step-panel-content .segmented input:checked + span {
  color: #000 !important;
  font-weight: 700;
}
body.calc-page.ridecalc-redesign .planner .step-panel-content .children-option input {
  accent-color: #000;
}
body.calc-page.ridecalc-redesign .planner .step-panel-content .children-option input:checked + .children-check {
  border-color: #000 !important;
  background-color: #000 !important;
}
body.calc-page.ridecalc-redesign .planner .step-panel-content :is(
  button,
  input,
  select,
  textarea,
  [tabindex]:not([tabindex='-1'])
):focus-visible {
  outline: 3px solid var(--ridecalc-readable-focus);
  outline-offset: 2px;
}
body.calc-page.ridecalc-redesign .planner .step-panel-content :is(button, input, select, textarea):disabled {
  opacity: 1;
  color: var(--ridecalc-readable-disabled-ink);
  border-color: var(--ridecalc-readable-border);
  background-color: var(--ridecalc-readable-disabled-surface);
  cursor: not-allowed;
}
body.calc-page.ridecalc-redesign .planner .trip-metric output,
body.calc-page.ridecalc-redesign .planner .step-two-options .stay-price strong,
body.calc-page.ridecalc-redesign .planner .step-two-options .experience-price {
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
body.calc-page.ridecalc-redesign.budget-mode .planner-header h2,
body.calc-page.ridecalc-redesign.budget-mode .planner-overview h2,
body.calc-page.ridecalc-redesign.budget-mode .planner-roadmap__button {
  color: var(--ridecalc-readable-dark-ink);
}
body.calc-page.ridecalc-redesign.budget-mode .planner-header .eyebrow,
body.calc-page.ridecalc-redesign.budget-mode .planner-overview .mini-label,
body.calc-page.ridecalc-redesign.budget-mode .planner-header > p:last-child,
body.calc-page.ridecalc-redesign.budget-mode .planner-overview .panel-description,
body.calc-page.ridecalc-redesign.budget-mode .planner-roadmap__copy .step-summary {
  color: var(--ridecalc-readable-dark-muted);
}
body.calc-page.ridecalc-redesign.budget-mode .planner .planner-roadmap__button:focus-visible {
  outline-color: var(--ridecalc-readable-dark-focus);
}
body.calc-page.ridecalc-redesign.budget-mode .planner .planner-roadmap__button:disabled {
  color: var(--ridecalc-readable-dark-muted);
  background-color: var(--ridecalc-readable-dark-surface);
  box-shadow: inset 3px 0 0 var(--ridecalc-readable-dark-border);
}
body.calc-page.ridecalc-redesign.budget-mode .planner .step-panel-content {
  color: var(--ridecalc-readable-ink);
}
body.calc-page.ridecalc-redesign.budget-mode .planner .step-panel-content :is(
  .choice-field legend,
  .date-field legend,
  .date-inputs label,
  .choice-field legend strong,
  .small-label,
  .field-hint,
  .toggle-row small
) {
  color: var(--ridecalc-readable-muted);
}
body.calc-page.ridecalc-redesign.budget-mode .planner .step-panel-content .toggle-row,
body.calc-page.ridecalc-redesign.budget-mode .planner .step-actions > span,
body.calc-page.ridecalc-redesign.budget-mode .planner .back-button {
  color: var(--ridecalc-readable-ink);
}
body.calc-page.ridecalc-redesign.budget-mode .planner .back-button {
  border-color: var(--ridecalc-readable-border);
}
body.calc-page.ridecalc-redesign.budget-mode .planner .planner-roadmap__button[aria-current='step'] b,
body.calc-page.ridecalc-redesign.budget-mode .planner .planner-roadmap__button[aria-current='step'] .step-summary {
  color: var(--ridecalc-readable-dark-active);
}
body.calc-page.ridecalc-redesign .trip-how__card p,
body.calc-page.ridecalc-redesign .finish-copy > p:last-child {
  font-size: 16px;
  line-height: 1.5;
}
body.calc-page.ridecalc-redesign .section-heading > p,
body.calc-page.ridecalc-redesign .section-heading .text-button,
body.calc-page.ridecalc-redesign .day-number,
body.calc-page.ridecalc-redesign .day-item,
body.calc-page.ridecalc-redesign .plan-caption,
body.calc-page.ridecalc-redesign .money-section :is(
  .money-total > span,
  .money-group,
  .legend-item,
  .budget-line label,
  .budget-line > span,
  .cost-row,
  .bill-total
),
body.calc-page.ridecalc-redesign .tip-card p,
body.calc-page.ridecalc-redesign .tip-card button {
  font-size: max(14px, .875em);
  line-height: 1.5;
  overflow-wrap: anywhere;
}
body.calc-page.ridecalc-redesign .money-section :is(.money-group, .legend-item, .budget-line label, .budget-line > span, .cost-row > span, .bill-total > span),
body.calc-page.ridecalc-redesign .tip-card p,
body.calc-page.ridecalc-redesign .plan-caption {
  color: var(--ridecalc-readable-muted);
}
body.calc-page.ridecalc-redesign .money-section :is(.money-group strong, .budget-line label strong, .cost-row strong, .bill-total strong),
body.calc-page.ridecalc-redesign .money-section .bill-note,
body.calc-page.ridecalc-redesign .finish-note {
  font-size: 12px;
  line-height: 1.5;
}
@media (max-width: 640px) {
  body.calc-page.ridecalc-redesign .planner :is(
    .builder,
    .interview,
    .journey-steps,
    .journey-step.is-open,
    .step-panel:not([hidden]),
    .step-panel-content,
    .date-field,
    .date-inputs
  ) {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
  }
  body.calc-page.ridecalc-redesign .planner .date-inputs {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }
  body.calc-page.ridecalc-redesign .planner .date-inputs > span { display: none; }
  body.calc-page.ridecalc-redesign .planner .date-inputs label,
  body.calc-page.ridecalc-redesign .planner .date-inputs input {
    min-width: 0;
    width: 100%;
    box-sizing: border-box;
  }
  body.calc-page.ridecalc-redesign .planner .planner-roadmap__copy b {
    font-size: 14px;
  }
  body.calc-page.ridecalc-redesign .planner .planner-roadmap__button {
    min-height: 62px;
  }
}

html.questionnaire-scroll-locked,
body.questionnaire-scroll-locked {
  position: fixed;
  top: calc(0px - var(--questionnaire-scroll-top, 0px));
  right: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}

.planner.is-step-flow {
  display: flex;
  box-sizing: border-box;
  width: 100%;
  height: 100vh;
  height: 100svh;
  height: 100dvh;
  min-height: 0;
  flex-direction: column;
  overflow: hidden;
  padding: clamp(14px, 2vw, 28px) clamp(18px, 4vw, 56px);
}
.planner.is-step-flow .planner-header {
  flex: 0 0 auto;
  margin: 0 auto 12px;
}
.planner.is-step-flow .planner-header h2 {
  margin: 4px 0;
  font-size: clamp(24px, 3vw, 38px);
}
.planner.is-step-flow .planner-header > p:last-child { margin-bottom: 0; }
.planner.is-step-flow .planner-workspace {
  display: grid;
  width: 100%;
  min-height: 0;
  grid-template-rows: minmax(0, 1fr);
  align-items: start;
  flex: 1 1 auto;
  margin: 0 auto;
}
.planner.is-step-flow .planner-overview {
  position: static;
  min-height: 0;
  align-self: start;
}
.planner.is-step-flow .builder {
  width: 100%;
  height: 100%;
  min-height: 0;
  align-self: stretch;
  flex: 1 1 auto;
  overflow: hidden;
}
.planner.is-step-flow .interview {
  display: flex;
  height: 100%;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
  overflow: hidden;
}
.planner.is-step-flow .journey-trip-summary { flex: 0 0 auto; }
.planner.is-step-flow .journey-steps {
  min-height: 0;
  flex: 1 1 auto;
  overflow: hidden;
}
.planner.is-step-flow .journey-step.is-open {
  height: 100%;
  min-height: 0;
  flex: 1 1 auto;
}
.planner.is-step-flow .step-panel:not([hidden]) {
  height: 100%;
  min-height: 0;
  flex: 1 1 auto;
  overflow: hidden;
}
.planner.is-step-flow .step-panel-content {
  min-height: 0;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  justify-content: flex-start;
  scroll-behavior: auto;
}
.planner.is-step-flow .step-panel > .step-actions {
  position: sticky;
  z-index: 2;
  bottom: 0;
  flex: 0 0 auto;
  margin-top: auto;
}
.planner.is-step-flow .trip-metric .round-button {
  min-width: 28px;
  min-height: 28px;
}

@media (min-width: 641px) {
  .planner.is-step-flow .planner-workspace {
    grid-template-rows: minmax(0, 1fr);
    align-items: start;
  }
  .planner.is-step-flow .builder { align-self: stretch; }
}

@media (max-width: 640px) {
  .planner.is-step-flow {
    padding: max(10px, env(safe-area-inset-top)) 10px max(7px, env(safe-area-inset-bottom));
  }
  .planner.is-step-flow .planner-header {
    margin-bottom: 8px;
  }
  .planner.is-step-flow .planner-header h2 {
    font-size: clamp(22px, 6vw, 30px);
  }
  .planner.is-step-flow .planner-header > p:last-child {
    display: none;
  }
  .planner.is-step-flow .planner-workspace {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: 6px;
  }
  .planner.is-step-flow .planner-overview {
    display: block;
    width: 100%;
    flex: 0 0 auto;
  }
  .planner.is-step-flow .planner-overview .mini-label { display: none; }
  .planner.is-step-flow .planner-overview h2 {
    margin: 0 0 3px;
    font-size: clamp(19px, 5.6vw, 24px);
  }
  .planner.is-step-flow .planner-overview > p:not(.mini-label) {
    display: -webkit-box;
    overflow: hidden;
    margin: 0;
    font-size: 12px;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .planner.is-step-flow .planner-roadmap {
    display: flex;
    width: 100%;
    max-width: none;
    gap: 6px;
    overflow-x: auto;
    margin: 8px 0 0;
    padding: 2px 1px 5px;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
    scroll-behavior: auto;
  }
  .planner.is-step-flow .planner-roadmap::before,
  .planner.is-step-flow .planner-roadmap::after {
    content: '';
    flex: 0 0 var(--roadmap-edge-space, 0px);
  }
  .planner.is-step-flow .planner-roadmap li,
  .planner.is-step-flow .planner-roadmap li:last-child {
    flex: 0 0 auto;
    min-height: 0;
    border: 0;
  }
  .planner.is-step-flow .planner-roadmap__button {
    width: max-content;
    min-height: 52px;
    grid-template-columns: 18px max-content;
    gap: 6px;
    padding: 7px;
    border: 1px solid #d1d8d0;
    border-radius: 9px;
    background: #ffffff80;
  }
  .planner.is-step-flow .planner-roadmap__copy b { font-size: 12px; }
  .planner.is-step-flow .planner-roadmap__copy .step-summary { display: none; }
  .planner.is-step-flow .builder { gap: 5px; }
  .planner.is-step-flow .interview { border-radius: 12px; }
  .planner.is-step-flow .step-panel:not([hidden]) { padding: 0 9px 6px; }
  .planner.is-step-flow .step-panel-content { gap: 5px; padding: 5px 0; }
  .planner.is-step-flow .step-panel > .step-actions {
    min-height: 49px;
    margin-right: -9px;
    margin-left: -9px;
    padding: 5px 9px max(5px, env(safe-area-inset-bottom));
  }
  .planner.is-step-flow .step-actions .button { min-width: 115px; min-height: 40px; }
  .planner.is-step-flow .trip-metric { min-height: 82px; padding: 6px 4px; }
  .planner.is-step-flow .trip-metric .small-label { min-height: 18px; font-size: 12px; }
  .planner.is-step-flow .trip-metric .people-value output { font-size: 18px; }
  .planner.is-step-flow .trip-metric .round-button { width: 28px; height: 28px; font-size: 15px; }
  .planner.is-step-flow .children-option { min-height: 32px; margin: 0; font-size: 12px; }
  .planner.is-step-flow .group-note { min-height: 34px; gap: 5px; padding: 5px 7px; font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .planner.is-step-flow .planner-roadmap { scroll-behavior: auto; }
}

.planner.is-step-flow:has(.journey-step.is-open) .planner-workspace {
  min-height: 0;
  grid-template-rows: minmax(0, 1fr);
  align-items: start;
}
.planner.is-step-flow:has(.journey-step.is-open) .builder { align-self: stretch; }
