#water-notebook{width:min(940px,calc(100vw - 28px));padding:28px;border:1px solid #d1ded2;border-radius:14px;background:#fff;color:#173f35}
#water-notebook::backdrop{background:#143d3566}
#water-notebook .notebook-heading h2{font-size:1.7rem;letter-spacing:-.7px;font-weight:700}
#water-notebook .notebook-heading .eyebrow{color:#77917e;font-size:.65rem;letter-spacing:1.6px}
#water-notebook .notebook-intro{font-size:.875rem;color:#4c6e59;margin:12px 0 5px}
#water-notebook .notebook-storage-note{font-size:.7rem;color:#788a7a;max-width:740px}
#water-notebook .notebook-toolbar{padding-bottom:18px;border-bottom:1px solid #e4ebe1;align-items:center}
#water-notebook .notebook-toolbar button,#water-notebook .notebook-import{background:#f7f9f4;border-color:#d8e2d3;font-size:.75rem;padding:8px 12px;min-height:38px}
#water-notebook [data-notebook-new]{background:#e9f1e3;border-color:#a8c2ab;color:#244f3a;font-weight:600}
#water-notebook .notebook-analysis-link{font-size:.75rem;margin-right:auto}
#water-notebook .notebook-editor{padding:0;border:0;margin:20px 0 24px}
#water-notebook .notebook-editor>summary{font-size:.9rem;color:#59745e;min-height:36px}
#water-notebook .notebook-editor[open]>summary{margin-bottom:14px}
#water-notebook .notebook-section-title{display:flex;gap:9px;align-items:center;font-size:.95rem;font-weight:650;line-height:1.4;margin:0;letter-spacing:-.2px}
#water-notebook .notebook-section-title>span{display:grid;place-items:center;width:24px;height:24px;background:#dce8d8;border-radius:5px;font-size:.65rem;color:#466950;font-weight:600}
#water-notebook .notebook-basics{padding:17px 18px 9px;background:#f4f6f1;border-radius:8px}
#water-notebook .notebook-basics>.notebook-form-grid{margin-top:14px;align-items:start}
#water-notebook label{display:block;font-size:.7rem;font-weight:500;color:#6d806d;line-height:1.5}
#water-notebook label>small{font-size:.65rem;font-weight:400;color:#899586;margin-left:5px}
#water-notebook input,#water-notebook select,#water-notebook textarea{display:block;min-height:42px;margin-top:6px;padding:9px 10px;border:1px solid #d3decf;border-radius:6px;color:#224c39;font-size:.875rem;line-height:1.4;box-shadow:none}
#water-notebook input::placeholder,#water-notebook textarea::placeholder{color:#9ba798;font-weight:400;opacity:1}
#water-notebook input:focus,#water-notebook select:focus,#water-notebook textarea:focus{outline:2px solid #6caa87;outline-offset:2px;border-color:#749e7f}
#water-notebook .notebook-position-settings{margin-top:8px}
#water-notebook .notebook-position-settings>summary{font-size:.7rem;color:#7e8e78;cursor:pointer;padding:7px 0;min-height:32px}
#water-notebook .notebook-position-settings .notebook-form-grid{margin:4px 0 10px}
#water-notebook .notebook-primary-section{margin-top:24px}
#water-notebook .notebook-section-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
#water-notebook .notebook-section-heading>p{font-size:.7rem;color:#84917f;margin:0}
#water-notebook .notebook-measurements{gap:14px}
#water-notebook .notebook-metric-card{min-width:0;margin:0;padding:18px 16px 10px;border:1px solid #e1e8da;background:#fafbf8;border-radius:9px}
#water-notebook .notebook-metric-card.is-primary{background:#eef4e8;border-color:#cbdcc4;border-top:3px solid #376c4b}
#water-notebook .notebook-metric-card>legend{float:left;width:100%;display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:0;margin:0 0 18px;line-height:1.5}
#water-notebook .notebook-metric-card>legend strong{font-size:.9rem;letter-spacing:-.3px}
#water-notebook .notebook-metric-card.is-primary>legend strong{font-size:1.125rem;color:#214a36}
#water-notebook .notebook-metric-card>legend small{font-size:.65rem;font-weight:400;color:#7d8d76}
#water-notebook .notebook-value-pair{clear:both;gap:10px}
#water-notebook .notebook-value-pair label{font-size:.65rem;color:#7b8d76}
#water-notebook .notebook-value-pair label>span{display:inline-block;max-width:100%;overflow-wrap:anywhere}
#water-notebook .notebook-value-pair input{min-height:50px;padding:8px 10px;text-align:center;font-size:1.35rem;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.2;background:#fff;border-color:#d3dfcb}
#water-notebook .is-primary .notebook-value-pair input{min-height:58px;font-size:1.8rem}
#water-notebook .notebook-after>span{color:#38744f;font-weight:600}
#water-notebook .notebook-value-pair .notebook-after input{border-color:#91b39a;color:#1b6040}
#water-notebook .notebook-metric-settings{clear:both;margin-top:13px;border-top:1px solid #dce5d4}
#water-notebook .notebook-metric-settings>summary{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:34px;padding:8px 0 3px;font-size:.7rem;color:#6b8064;cursor:pointer;list-style:none}
#water-notebook .notebook-metric-settings>summary::-webkit-details-marker{display:none}
#water-notebook .notebook-metric-settings>summary>span:last-child{flex:none;font-size:.65rem;color:#4a6f4d}
#water-notebook .notebook-metric-settings>summary>span:last-child:after{content:' ＋'}
#water-notebook .notebook-metric-settings[open]>summary>span:last-child:after{content:' −'}
#water-notebook .notebook-settings-fields{display:grid;grid-template-columns:1fr;gap:10px;padding:10px 0 5px}
#water-notebook .notebook-short-help{font-size:.7rem;color:#83907d;margin:10px 2px 0}
#water-notebook .notebook-additional,#water-notebook .notebook-conditions{border:1px solid #e2e8dd;border-radius:8px;padding:0 16px;margin:16px 0 0;background:#fff}
#water-notebook .notebook-additional>summary,#water-notebook .notebook-conditions>summary{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:15px 0;cursor:pointer;list-style:none;min-height:52px;line-height:1.5}
#water-notebook .notebook-additional>summary::-webkit-details-marker,#water-notebook .notebook-conditions>summary::-webkit-details-marker{display:none}
#water-notebook .notebook-additional summary strong,#water-notebook .notebook-conditions summary strong{font-size:.8125rem;font-weight:600;color:#54714f}
#water-notebook .notebook-additional summary div>span,#water-notebook .notebook-conditions summary div>span{display:inline;font-size:.65rem;color:#8a9783;margin-left:9px}
#water-notebook .notebook-additional>summary>small,#water-notebook .notebook-conditions>summary>small{flex:none;font-size:.65rem;color:#8a9783}
#water-notebook .notebook-additional>summary>small:after,#water-notebook .notebook-conditions>summary>small:after{content:' ＋';color:#4e7354}
#water-notebook .notebook-additional[open]>summary>small:after,#water-notebook .notebook-conditions[open]>summary>small:after{content:' −'}
#water-notebook .notebook-additional[open],#water-notebook .notebook-conditions[open]{padding-bottom:14px}
#water-notebook .notebook-conditions[open]>summary{margin-bottom:0}
#water-notebook .notebook-footnote{font-size:.65rem;line-height:1.8;color:#8a9584;margin:15px 2px 0}
#water-notebook .notebook-form-actions{padding-top:18px;margin-top:16px;border-top:1px solid #dfe7d8;gap:10px}
#water-notebook .notebook-form-actions .notebook-primary{font-size:.875rem;min-height:44px;padding:10px 32px;background:#21583e;border-color:#21583e;font-weight:600;letter-spacing:.02em}
#water-notebook .notebook-saved{padding-top:20px;border-top:1px solid #e2e9dc}
#water-notebook .notebook-saved-heading h3{font-size:1.125rem;letter-spacing:-.4px;color:#244c36}
@media(max-width:600px){#water-notebook{padding:20px 16px;border-radius:12px}#water-notebook .notebook-heading h2{font-size:1.45rem}#water-notebook .notebook-toolbar{gap:6px}#water-notebook .notebook-analysis-link{margin-right:0}#water-notebook .notebook-basics{padding:15px 12px 7px}#water-notebook input,#water-notebook select,#water-notebook textarea{font-size:1rem}#water-notebook .notebook-section-heading{align-items:flex-start;flex-direction:column;gap:5px}#water-notebook .notebook-section-heading>p{padding-left:33px}#water-notebook .notebook-metric-card{padding:16px 13px 9px}#water-notebook .notebook-metric-card>legend{margin-bottom:12px}#water-notebook .notebook-measurements{gap:12px}#water-notebook .notebook-value-pair input{font-size:1.4rem}#water-notebook .notebook-additional summary div>span,#water-notebook .notebook-conditions summary div>span{display:block;margin:3px 0 0}#water-notebook .notebook-form-actions>.notebook-primary{flex:1}#water-notebook .notebook-storage-note{font-size:.65rem}}

#water-notebook .notebook-metric-card>legend small{color:#63765c}#water-notebook .notebook-value-pair label{color:#65795e}#water-notebook .notebook-short-help,#water-notebook .notebook-footnote{color:#718067}
