.planner {
  --planner-ink: #141713;
  --planner-paper: #f4f3ed;
  --planner-muted: #b6baad;
  --planner-line: #41463b;
  --planner-accent: #d5f477;
  box-sizing: border-box;
  padding: clamp(1.4rem, 4vw, 4rem);
  background: var(--planner-ink);
  color: var(--planner-paper);
  font: inherit;
  line-height: 1.55;
  color-scheme: dark;
}
.planner *, .planner *::before, .planner *::after { box-sizing: border-box; }
.planner [hidden] { display: none !important; }
.planner-heading { max-width: 46rem; margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.planner-eyebrow { margin: 0 0 .8rem; font-size: .7rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.planner-title { margin: 0; font-size: clamp(2rem, 4.5vw, 4.5rem); font-weight: 500; line-height: 1.05; letter-spacing: -.045em; text-wrap: balance; }
.planner-intro { max-width: 38rem; margin: 1.2rem 0 0; font-size: 1rem; color: var(--planner-muted); }
.planner-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(19rem, 1fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: start; }
.planner-form { min-width: 0; margin: 0; }
.planner-fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.planner-route-fieldset { margin-bottom: 2.3rem; }
.planner-legend, .planner-context-label { display: block; max-width: 100%; margin: 0 0 1rem; padding: 0; font-size: 1rem; font-weight: 600; line-height: 1.45; }
.planner-step { margin-right: .65rem; color: var(--planner-accent); font-size: .75rem; font-variant-numeric: tabular-nums; font-weight: 500; }
.planner-routes { display: grid; gap: .6rem; }
.planner-route { display: flex; align-items: flex-start; gap: .85rem; min-height: 4.8rem; padding: 1rem; border: 1px solid var(--planner-line); cursor: pointer; transition: border-color 160ms ease, background-color 160ms ease; }
.planner-route:hover { border-color: var(--planner-paper); }
.planner-route:has(.planner-radio:checked) { border-color: var(--planner-accent); background: #20261a; }
.planner-route-copy { display: grid; gap: .2rem; }
.planner-route-title { font-size: 1.1rem; font-weight: 500; line-height: 1.3; }
.planner-route-description { font-size: .84rem; color: var(--planner-muted); }
.planner-radio, .planner-checkbox { flex: 0 0 auto; width: 1.15rem; height: 1.15rem; margin: .17rem 0 0; accent-color: var(--planner-accent); cursor: pointer; }
.planner-hint { margin: -.3rem 0 .9rem; color: var(--planner-muted); font-size: .8rem; }
.planner-goals { display: grid; gap: .4rem; }
.planner-goal { display: flex; align-items: flex-start; gap: .75rem; min-height: 2.75rem; padding: .65rem .5rem; border-bottom: 1px solid var(--planner-line); cursor: pointer; font-size: .92rem; }
.planner-goal:hover { background: #20261a; }
.planner-context { margin-top: 2rem; }
.planner-select { display: block; width: 100%; min-height: 3rem; border: 1px solid var(--planner-line); border-radius: 0; padding: .75rem 2.4rem .75rem .8rem; background: var(--planner-ink); color: var(--planner-paper); font: inherit; font-size: .9rem; }
.planner-panel + .planner-panel { margin-top: 2.3rem; }
.planner[data-planner-ready="true"] .planner-panel { margin-top: 0; }
.planner-summary { min-width: 0; padding: clamp(1.25rem, 2.5vw, 2rem); background: var(--planner-paper); color: var(--planner-ink); color-scheme: light; }
.planner-summary .planner-eyebrow { color: #62685a; }
.planner-summary-title { margin: 0; font-size: clamp(1.65rem, 2.5vw, 2.25rem); font-weight: 500; line-height: 1.15; letter-spacing: -.035em; text-wrap: balance; }
.planner-summary-lead { margin: 1rem 0 1.3rem; font-size: .85rem; color: #535a4b; }
.planner-checklist { list-style: none; margin: 0; padding: 0; }
.planner-checklist-item { position: relative; margin: 0; padding: .85rem 0 .85rem 1.35rem; border-top: 1px solid #d4d7ca; font-size: .86rem; line-height: 1.5; }
.planner-checklist-item::before { position: absolute; left: 0; top: .92rem; content: '✓'; font-size: .8rem; font-weight: 600; }
.planner-empty { margin: .6rem 0 0; font-size: .8rem; color: #62685a; }
.planner-preparation { margin-top: 1.5rem; padding-top: 1.1rem; border-top: 1px solid #babfad; }
.planner-preparation-title { margin: 0 0 .45rem; font-size: .78rem; font-weight: 600; }
.planner-preparation-copy { margin: 0; font-size: .82rem; color: #535a4b; }
.planner-cta { display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 3.3rem; margin-top: 1.8rem; padding: .9rem 1rem; border: 1px solid var(--planner-ink); background: var(--planner-ink); color: var(--planner-paper); font-size: .9rem; font-weight: 500; line-height: 1.3; text-decoration: none; transition: background-color 160ms ease, color 160ms ease; }
.planner-cta:hover { background: var(--planner-accent); color: var(--planner-ink); }
.planner-cta:visited { color: var(--planner-paper); }
.planner-cta:visited:hover { color: var(--planner-ink); }
.planner-cta span { font-size: 1.25rem; }
.planner-privacy, .planner-noscript { margin: .85rem 0 0; font-size: .71rem; color: #62685a; line-height: 1.5; }
.planner input:focus-visible, .planner select:focus-visible { outline: 3px solid var(--planner-accent); outline-offset: 4px; }
.planner-cta:focus-visible { outline: 3px solid var(--planner-ink); outline-offset: 4px; }
.planner-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@media (min-width: 75rem) {
  .planner-routes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .planner-route { flex-direction: column; gap: .9rem; min-height: 10rem; }
  .planner-route-title { font-size: 1rem; }
  .planner-route-description { font-size: .78rem; }
}
@media (max-width: 53rem) {
  .planner-layout { grid-template-columns: minmax(0, 1fr); }
  .planner-summary { margin-top: .5rem; }
}
@media (prefers-reduced-motion: reduce) {
  .planner *, .planner *::before, .planner *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
@media (forced-colors: active) {
  .planner-route:has(.planner-radio:checked) { outline: 2px solid Highlight; }
  .planner-cta { border: 1px solid LinkText; }
}
