#water-planner { scroll-margin-top: 5rem; padding: 4rem 1.25rem; background: var(--paper); }
#water-planner .wi-wrap { max-width: 70rem; margin: auto; }
#water-planner h2 { font-family: 'Fraunces', Georgia, serif; font-size: clamp(2rem,5vw,3rem); line-height: 1.15; margin-bottom: 1rem; }
#water-planner h3 { font-family: 'Fraunces', Georgia, serif; font-size: 1.5rem; margin: 0 0 1rem; }
#water-planner p { line-height: 1.65; margin-bottom: .8rem; }
#water-planner a { color: var(--signal-on-paper); text-decoration: underline; }
.wi-intro { max-width: 48rem; }
.wi-layout { display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1.2fr); gap:1.5rem; margin-top:2rem; align-items:start; }
.wi-panel, .wi-record { padding:1.4rem; border:1px solid var(--border-warm); border-radius:1rem; background:white; min-width:0; }
.wi-record { margin-top:1rem; overflow-wrap:anywhere; }
.wi-record h4 { font-weight:600; font-size:1.2rem; margin-bottom:.5rem; }
.wi-fields { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:1rem; }
.wi-full { grid-column:1/-1; }
#water-planner label { display:block; font-weight:500; margin-bottom:.35rem; }
#water-planner input:not([type=checkbox]), #water-planner select, #water-planner textarea { width:100%; min-width:0; padding:.65rem; border:1px solid #657768; border-radius:.4rem; background:white; color:var(--ink); font:inherit; }
#water-planner input:disabled { background:#eee; }
#water-planner button { padding:.65rem 1rem; border:1px solid var(--ink); border-radius:1.5rem; font:inherit; font-weight:500; background:white; color:var(--ink); min-height:44px; cursor:pointer; }
#water-planner button.wi-primary { background:var(--ink); color:white; }
#water-planner :focus-visible { outline:3px solid var(--signal-on-paper); outline-offset:3px; }
.wi-buttons { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1rem; }
.wi-hint { font-size:.88rem; color:#46554a; }
.wi-action { background:var(--signal-soft); padding:.8rem; border-radius:.5rem; }
#wi-error { color:#9c2323; }
.wi-storage { margin-top:1.5rem; max-width:48rem; }
#water-planner .wi-check { display:flex; align-items:start; gap:.6rem; }
#wi-save { width:1.2rem; height:1.2rem; margin-top:.2rem; flex-shrink:0; }
#wi-status { min-height:1.5rem; }
#wi-print-report { display:none; }
body.wi-print-only > :not(main), body.wi-print-only main > :not(#water-planner), body.wi-print-only #water-planner .wi-wrap { display:none !important; }
body.wi-print-only #water-planner { max-width:54rem; margin:auto; padding:1.5rem; }
body.wi-print-only #wi-print-report { display:block; white-space:pre-wrap; overflow-wrap:anywhere; font:11pt/1.45 Georgia,serif; color:black; background:white; padding:1.5rem; margin-top:1.5rem; }
@media(max-width:750px) { .wi-layout { grid-template-columns:1fr; } .wi-panel { padding:1rem; } }
@media(max-width:380px) { .wi-fields { grid-template-columns:1fr; } }
@media print {
  #wi-print-controls { display:none !important; }
  body.wi-print-only > :not(main), body.wi-print-only main > :not(#water-planner), #water-planner .wi-wrap { display:none !important; }
  body.wi-print-only #water-planner, body.wi-print-only main, body.wi-print-only { padding:0 !important; margin:0 !important; background:white !important; color:black !important; overflow:visible !important; }
  #wi-print-report, body.wi-print-only #wi-print-report { display:block; padding:0; margin:0; white-space:pre-wrap; overflow-wrap:anywhere; font:11pt/1.45 Georgia,serif; }
  @page { margin:18mm; }
}