/* Harbor House — Smart Family Adventure Planner (Stage 5) */
.planner-intro{padding-bottom:var(--sp-2)}
.planner-pip{display:flex;gap:var(--sp-4);align-items:flex-start;background:#fff;border:2px solid rgba(15,35,64,.08);border-left:8px solid var(--teal);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--sp-4) var(--sp-5);max-width:760px}
.planner-pip-emoji{font-size:2rem;line-height:1.2}
.planner-pip p{margin:0;font-weight:600}
.planner-noscript{margin:var(--sp-4) 0}
.planner-banner{background:#fff7d6;border:2px solid var(--sun);border-radius:var(--radius);padding:var(--sp-4) var(--sp-5);font-weight:600;margin:var(--sp-4) 0;max-width:860px}

/* Progress */
.planner-progress{max-width:860px;margin:var(--sp-5) 0}
.planner-progress-head{display:flex;justify-content:space-between;gap:var(--sp-3);font-family:var(--font-display);font-weight:700;color:var(--navy)}
.planner-progress-track{height:16px;background:#e2e8f0;border-radius:var(--radius-full);overflow:hidden;margin:var(--sp-2) 0 var(--sp-3)}
.planner-progress-fill{height:100%;width:0;background:linear-gradient(90deg,var(--teal),var(--sun));border-radius:var(--radius-full);transition:width var(--dur) var(--ease)}
.planner-progress-steps{display:flex;gap:var(--sp-2);list-style:none;margin:0;padding:0;flex-wrap:wrap}
.planner-progress-steps li{font-size:var(--fs-sm);font-weight:800;padding:var(--sp-1) var(--sp-3);border-radius:var(--radius-full);background:#eef2f7;color:var(--ink-soft)}
.planner-progress-steps li.is-current{background:var(--navy);color:#fff}
.planner-progress-steps li.is-done{background:var(--mint);color:var(--navy)}

/* Steps & chips */
.planner-form{max-width:860px}
.planner-step{border:2px solid rgba(15,35,64,.1);border-radius:var(--radius-lg);background:#fff;box-shadow:var(--shadow-sm);padding:var(--sp-5);margin:0 0 var(--sp-5)}
.planner-step legend{font-family:var(--font-display);font-size:var(--fs-xl);font-weight:700;color:var(--navy);padding:0 var(--sp-2)}
.step-num{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--coral);color:#fff;font-size:var(--fs-lg);margin-right:var(--sp-2);vertical-align:middle}
.step-hint{color:var(--ink-soft);margin-top:calc(-1 * var(--sp-2))}
.step-error{color:#b42318;font-weight:800;margin:var(--sp-3) 0 0}
.chip-row{display:flex;gap:var(--sp-3);flex-wrap:wrap}
.chip{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:64px;min-width:120px;flex:1 1 150px;padding:var(--sp-3) var(--sp-4);border-radius:var(--radius);border:3px solid #cbd5e1;background:var(--cream);color:var(--navy);font-family:var(--font-body);cursor:pointer;text-align:left;transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease),transform var(--dur-fast) var(--ease)}
.chip-row-wrap .chip{flex:1 1 140px;min-height:56px}
.chip:hover{border-color:var(--teal);transform:translateY(-1px)}
.chip:focus-visible{outline:3px solid var(--sun);outline-offset:3px}
.chip[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff;box-shadow:var(--shadow-sm)}
.chip[aria-pressed="true"] .chip-sub{color:#ffe9a8}
.chip-emoji{font-size:1.5rem;line-height:1}
.chip-label{font-family:var(--font-display);font-size:var(--fs-lg);font-weight:800;line-height:1.15}
.chip-sub{font-size:var(--fs-sm);font-weight:700;color:var(--ink-soft)}
.planner-build-row{margin-top:var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-2);align-items:flex-start}
.planner-build-btn{min-height:56px;font-size:var(--fs-xl)}
.planner-build-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.planner-build-hint{margin:0;color:var(--ink-soft);font-weight:600}

/* How Pip picks */
.planner-how{max-width:860px;margin:var(--sp-2) 0 var(--sp-6)}
.planner-how ul{margin:0;padding-left:1.25rem}
.planner-how li{margin-bottom:var(--sp-2)}

.step-subhead{font-family:var(--font-display);font-weight:700;color:var(--navy);margin:var(--sp-4) 0 var(--sp-2)}
.chip-small{flex:1 1 100px;min-height:52px}

/* Results */
.planner-results{max-width:860px}
.results-total{font-family:var(--font-display);font-size:var(--fs-xl);font-weight:800;color:var(--navy);margin-bottom:var(--sp-1)}
.results-fit{font-weight:800;color:var(--teal);margin:0 0 var(--sp-1)}
.results-note{font-size:var(--fs-sm);color:var(--ink-soft);margin:0}
.results-summary{font-size:var(--fs-lg);color:var(--ink-soft);max-width:65ch}

/* Adventure timeline */
.itin-list{list-style:none;margin:var(--sp-4) 0;padding:0 0 0 76px;position:relative;display:flex;flex-direction:column;gap:var(--sp-4)}
.itin-list::before{content:"";position:absolute;left:70px;top:10px;bottom:10px;width:3px;border-radius:var(--radius-full);background:linear-gradient(180deg,var(--teal),var(--sun))}
.itin-card{position:relative;display:flex;gap:var(--sp-4);align-items:flex-start;background:#fff;border:2px solid rgba(15,35,64,.08);border-top:8px solid var(--wc,var(--teal));border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--sp-5)}
.itin-card.is-break{border:2px dashed var(--sun);background:#fffaf0;align-items:center}
.itin-time{position:absolute;left:-76px;top:var(--sp-4);width:58px;text-align:right;font-family:var(--font-display);font-size:var(--fs-lg);font-weight:800;color:var(--navy);line-height:1.2}
.itin-time::after{content:"";position:absolute;right:-13px;top:6px;width:11px;height:11px;border-radius:50%;background:var(--coral);border:2px solid #fff;box-shadow:var(--shadow-sm)}
.is-break .itin-time::after{background:var(--sun)}
.itin-emoji{font-size:2.4rem;line-height:1.1}
.itin-body{flex:1;min-width:0}
.itin-head-row{display:flex;gap:var(--sp-3);align-items:center;flex-wrap:wrap}
.itin-body h3{margin:0;font-size:var(--fs-xl)}
.itin-world{margin:0 0 var(--sp-1);font-weight:800}
.itin-world a{color:var(--teal);text-decoration:none}
.itin-world a:hover{text-decoration:underline}
.start-badge{background:var(--sun);color:var(--navy);font-weight:800;font-size:var(--fs-sm);padding:var(--sp-1) var(--sp-3);border-radius:var(--radius-full)}
.itin-card .pills{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin:var(--sp-2) 0}
.itin-card .pill{background:var(--cream);color:var(--navy);border:1.5px solid #e5d9bd}
.pill-duration{background:var(--navy)!important;color:#fff!important;border-color:var(--navy)!important}
.itin-tagline{font-weight:700;color:var(--ink-soft);margin-bottom:var(--sp-2)}
.itin-age-note{font-size:var(--fs-sm);font-weight:700;color:var(--navy);background:#fdf3d8;border-left:4px solid var(--sun);border-radius:var(--radius);padding:var(--sp-2) var(--sp-3);margin:0 0 var(--sp-2)}
.itin-why{margin-bottom:var(--sp-2)}
.itin-actions{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-top:var(--sp-3)}
.btn-mini{min-height:40px;padding:var(--sp-1) var(--sp-3);border-radius:var(--radius-full);border:2px solid var(--navy);background:#fff;color:var(--navy);font-family:var(--font-body);font-weight:800;font-size:var(--fs-sm);cursor:pointer}
.btn-mini:hover{background:var(--navy);color:#fff}
.btn-mini:focus-visible{outline:3px solid var(--sun);outline-offset:2px}
.btn-mini:disabled{opacity:.4;cursor:not-allowed;background:#fff;color:var(--navy)}
.itin-emoji{font-size:2.4rem;line-height:1.1}
.itin-body{flex:1;min-width:0}
.itin-head-row{display:flex;gap:var(--sp-3);align-items:center;flex-wrap:wrap}
.itin-body h3{margin:0;font-size:var(--fs-xl)}
.itin-body h3 a{color:var(--navy);text-decoration:none}
.itin-body h3 a:hover{color:var(--coral-dark);text-decoration:underline}
.start-badge{background:var(--sun);color:var(--navy);font-weight:800;font-size:var(--fs-sm);padding:var(--sp-1) var(--sp-3);border-radius:var(--radius-full)}
.itin-card .pills{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin:var(--sp-2) 0}
.itin-card .pill{background:var(--cream);color:var(--navy);border:1.5px solid #e5d9bd}
.pill-duration{background:var(--navy)!important;color:#fff!important;border-color:var(--navy)!important}
.itin-tagline{font-weight:700;color:var(--ink-soft);margin-bottom:var(--sp-2)}
.itin-why{margin-bottom:var(--sp-2)}
.itin-parent{font-size:var(--fs-sm);color:var(--ink-soft);margin:0;background:#f7fafc;border-radius:var(--radius);padding:var(--sp-3)}
.is-break .itin-parent{display:none}
.saved-note{background:#e6f7ee;border:2px solid #2d9d5f;border-radius:var(--radius);padding:var(--sp-4);font-weight:800;color:#14532d}
.results-actions{display:flex;gap:var(--sp-3);flex-wrap:wrap;margin:var(--sp-5) 0}
.results-foot{color:var(--ink-soft)}
.planner-foot-nav{display:flex;gap:var(--sp-3);flex-wrap:wrap;margin-top:var(--sp-6)}

@media (max-width:560px){
  .chip{flex:1 1 100%;min-height:56px}
  .chip-row-wrap .chip{flex:1 1 calc(50% - var(--sp-3));min-width:0}
  .chip-small{flex:1 1 calc(33% - var(--sp-3));min-width:0}
  .itin-list{padding-left:62px}
  .itin-list::before{left:56px}
  .itin-time{left:-62px;width:44px;font-size:var(--fs-base)}
  .itin-time::after{right:-12px}
  .itin-card{padding:var(--sp-4);gap:var(--sp-3)}
  .itin-emoji{font-size:2rem}
  .results-actions .btn{flex:1 1 100%}
  .planner-pip{flex-direction:row}
}
@media (prefers-reduced-motion: reduce){
  .planner-progress-fill,.chip{transition:none}
}

/* Print: itinerary only, cleanly */
@media print{
  header[data-chrome],footer[data-chrome],.planner-progress,.planner-form,.planner-how,.planner-banner,.planner-foot-nav,.results-actions,.results-foot,.planner-pip,.skip-link{display:none!important}
  body{background:#fff}
  .planner-results{max-width:none}
  .itin-list{padding-left:76px}
  .itin-list::before{display:none}
  .itin-card{break-inside:avoid;box-shadow:none;border:1.5px solid #333}
  .itin-card.is-break{border:1.5px dashed #333}
  .itin-actions{display:none!important}
  a{color:#000;text-decoration:none}
}