.garland-tool { max-width: 1180px; margin: 0 auto; padding: 36px 24px 72px; }
.planner-heading { max-width: 850px; margin: 30px 0; }
.planner-heading h1 { font-family: 'IM Fell DW Pica', Georgia, serif; font-size: clamp(34px,4.4vw,58px); font-weight: 400; line-height: 1.12; margin: 12px 0 20px; }
.planner-heading > p:last-child { max-width: 720px; font-size: 19px; line-height: 1.7; }
.garland-planner { color: #312c2d; font-family: 'Libre Franklin', Arial, sans-serif; font-size: 16px; line-height: 1.5; }
.garland-planner [hidden] { display: none !important; }
.planner-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 28px; align-items: start; }
.planner-examples { padding: 18px 0; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; border-top: 1px solid #c9cec4; }
.garland-planner button, .garland-planner input, .garland-planner select { font: inherit; border-radius: 0; }
.garland-planner button { min-height: 44px; padding: 10px 15px; border: 1px solid #623c48; background: #faf8f5; color: #623c48; cursor: pointer; }
.garland-planner button:hover { background: #e4eaeb; }
.garland-planner :focus-visible { outline: 3px solid #63715b; outline-offset: 3px; }
.planner-form fieldset { border: 1px solid #c9cec4; padding: 18px; margin: 0 0 22px; min-width: 0; }
.planner-form legend { padding: 0 7px; font-weight: 600; color: #623c48; }
.planner-form label { display: block; margin-bottom: 16px; font-weight: 500; }
.planner-form input, .planner-form select { display: block; background: #fff; color: #312c2d; border: 1px solid #797174; padding: 11px 10px; width: 100%; min-height: 46px; margin-top: 7px; box-sizing: border-box; }
.field-pair { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 15px; }
.garland-planner .field-help { font-size: 14px; font-weight: 400; color: #5e5458; margin: 0 0 14px; }
.garland-planner .planner-primary { width: 100%; background: #623c48; color: #faf8f5; }
.garland-planner .planner-primary:hover { background: #312c2d; }
.planner-result { background: #e4eaeb; border-top: 4px solid #63715b; padding: 24px; }
.planner-result h2 { font-family: 'IM Fell DW Pica', Georgia, serif; font-size: 36px; font-weight: 400; line-height: 1.2; margin: 10px 0; }
.planner-result figure { margin: 20px 0; background: #faf8f5; padding: 8px; }
.route-diagram { display: block; width: 100%; height: auto; }
.route-diagram text { font: 18px Arial, sans-serif; fill: #312c2d; }
.span-guide { stroke: #797174; stroke-width: 1; stroke-dasharray: 6 4; }
.garland-line { fill: none; stroke: #63715b; stroke-width: 5; }
.second-layer { stroke: #623c48; stroke-width: 3; }
.fixing-point { fill: #312c2d; }
.diagram-caption { font-size: 13px; padding: 0 6px 8px; }
.plan-breakdown { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 0 14px; font-size: 15px; }
.plan-breakdown dt, .plan-breakdown dd { padding: 10px 0; margin: 0; border-bottom: 1px solid #c0c7c5; }
.plan-breakdown dd { font-weight: 600; text-align: right; }
.plan-assumptions, .rounding-detail { font-size: 14px; }
.planner-result summary { cursor: pointer; padding: 12px 0; text-decoration: underline; }
.planner-print { margin: 12px 0 18px; }
.planner-privacy { font-size: 14px; margin: 20px 0; }
.planner-error { padding: 14px; border: 2px solid #623c48; color: #623c48; }
.planner-explanation { max-width: 780px; margin: 50px auto 0; }
@media (max-width: 760px) { .planner-grid { grid-template-columns: 1fr; } .garland-tool { padding: 24px 20px 50px; } .planner-result { padding: 20px; } }
@media (max-width: 380px) { .field-pair { grid-template-columns: 1fr; gap: 0; } .plan-breakdown { font-size: 14px; gap: 0 8px; } }
@media print {
  @page { margin: 15mm; }
  body, .garland-tool { background: white !important; color: black; padding: 0; margin: 0; }
  .site-header, .site-footer, .breadcrumbs, .planner-examples, .planner-form, .planner-explanation, .planner-print, .planner-privacy, .planner-heading > p, .skip { display: none !important; }
  .planner-heading { margin: 0 0 12px; }
  .planner-heading h1 { font-size: 24px; }
  .planner-grid { display: block; }
  .planner-result { border: 1px solid #777; background: white; padding: 14px; }
  .planner-result h2 { font-size: 26px; }
  .planner-result figure { width: 70%; margin: 10px auto; break-inside: avoid; }
  .planner-result details { display: none; }
  .plan-breakdown dt, .plan-breakdown dd { padding: 5px 0; }
  .planner-result .eyebrow { margin: 0; }
  .plan-breakdown { break-inside: avoid; }
}