:root{--ink:#102b24;--muted:#5d716b;--line:#ccd6d0;--paper:#f4f7f2;--panel:#fff;--soft:#e8efe9;--green:#2f7650;--lime:#8ba64f;--water:#087e9a;--soil:#ae5d2b;--sun:#e5a62d;--navy:#102b45;--shadow:0 14px 35px rgba(26,55,43,.08)}

[data-theme="night"]{--ink:#edf5ef;--muted:#aebfb8;--line:#3b5149;--paper:#16231f;--panel:#1d2d27;--soft:#263a32;--green:#72b98c;--lime:#b0c875;--water:#55bdd4;--soil:#e0935d;--sun:#f0bc52;--navy:#d8e8f1;--shadow:none}

*{box-sizing:border-box}
html{max-width:100%;overflow-x:hidden;color-scheme:light}
html[data-theme="night"]{color-scheme:dark}
body{max-width:100%;margin:0;overflow-x:hidden;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;letter-spacing:0}
.app-header{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:10px clamp(18px,3vw,42px);border-bottom:1px solid var(--line);background:var(--panel);position:sticky;top:0;z-index:5}
.brand{display:flex;align-items:center;gap:15px;color:var(--ink);text-decoration:none;min-width:0}
.brand img{width:142px;height:auto}
.brand span{padding-left:15px;border-left:1px solid var(--line);color:var(--green);font-size:12px;font-weight:700;text-transform:uppercase}
.header-actions{display:flex;align-items:center;gap:10px}
.status{font-size:12px;color:var(--muted);white-space:nowrap}
.status i{display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:var(--sun)}
button,.back-link{font:700 13px Arial,Helvetica,sans-serif}
.icon-button,.back-link,.text-button{border:1px solid var(--line);background:transparent;color:var(--ink);padding:9px 12px;border-radius:4px;text-decoration:none;cursor:pointer}
.icon-button:hover,.back-link:hover,.text-button:hover{border-color:var(--green);color:var(--green)}
main{max-width:1540px;margin:0 auto;padding:34px clamp(18px,3vw,42px) 54px}
.intro{display:flex;justify-content:space-between;align-items:end;gap:36px;min-width:0;margin-bottom:32px}
.intro h1{max-width:780px;margin:8px 0 0;font:400 clamp(32px,4.2vw,62px)/1.02 Georgia,serif}
.intro>p{max-width:520px;margin:0;color:var(--muted);font-size:15px;line-height:1.55}
.eyebrow{margin:0;color:var(--green);font-size:11px;font-weight:800;letter-spacing:.13em}
.app-layout{display:grid;grid-template-columns:330px minmax(0,1fr);gap:30px;min-width:0}
.controls{width:100%;min-width:0;padding:22px;background:var(--panel);border:1px solid var(--line);align-self:start;position:sticky;top:96px;box-shadow:var(--shadow)}
.panel-heading{display:flex;justify-content:space-between;align-items:start;margin-bottom:18px}
.panel-heading h2,.chart-head h2,.decision-grid h2,.explanation h2{margin:5px 0 0;font-size:20px}
.text-button{padding:6px 9px}
.presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-bottom:20px}
.presets button{border:1px solid var(--line);background:var(--soft);color:var(--ink);padding:8px 4px;border-radius:3px;cursor:pointer;font-size:11px}
.presets button:hover,.presets button.active{border-color:var(--green);background:var(--green);color:#fff}
.controls>label{display:block;margin:0 0 16px;font-size:13px;font-weight:700}
.controls select{width:100%;margin-top:7px;border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:3px;padding:10px;font:400 13px Arial,Helvetica,sans-serif}
.controls output{float:right;color:var(--green)}
input[type="range"]{width:100%;margin-top:10px;accent-color:var(--green)}
fieldset{min-width:0;margin:0 0 18px;padding:0;border:0}
legend{margin-bottom:8px;font-size:13px;font-weight:700}
.segmented{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.segmented label{margin:0}
.segmented input{position:absolute;opacity:0;pointer-events:none}
.segmented span{display:block;padding:9px 6px;border:1px solid var(--line);border-radius:3px;text-align:center;color:var(--muted);font-size:11px;cursor:pointer}
.segmented input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--panel)}
.run-button{width:100%;border:0;border-radius:3px;background:var(--ink);color:var(--panel);padding:13px;cursor:pointer;font:700 13px Arial,Helvetica,sans-serif}
.run-button:hover{background:var(--green);color:#fff}
.scope{margin:18px 0 0;padding:13px 0 0 13px;border-left:3px solid var(--sun);color:var(--muted);font-size:12px;line-height:1.5}
.workspace{min-width:0}
.summary{display:grid;grid-template-columns:1.25fr repeat(4,1fr);border:1px solid var(--line);background:var(--panel)}
.metric{min-width:0;min-height:104px;padding:17px;border-right:1px solid var(--line)}
.metric:last-child{border-right:0}
.metric span,.metric small{display:block;color:var(--muted);font-size:10px;line-height:1.3;text-transform:uppercase}
.metric strong{display:block;margin:9px 0 5px;font-size:21px;line-height:1.08}
.metric.action strong{color:var(--soil)}
.chart-panel,.comparison-panel{margin-top:24px;padding:22px;background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow)}
.chart-head{display:flex;align-items:end;justify-content:space-between;gap:20px}
.chart-head>span{color:var(--muted);font-size:11px;text-align:right}
canvas{display:block;width:100%;height:350px;margin-top:16px}
.legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:8px;color:var(--muted);font-size:11px}
.legend i{display:inline-block;width:10px;height:10px;margin-right:6px;border-radius:2px}
.legend .control{background:var(--soil)}
.legend .hydrogel{background:var(--water)}
.legend .biochar{background:var(--lime)}
.legend .combined{background:var(--green)}
.legend .threshold{height:2px;background:var(--sun);vertical-align:middle}
.decision-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:24px;margin-top:24px}
.decision-card,.inspector{padding:22px;border:1px solid var(--line);background:var(--panel)}
.decision-card>p:not(.eyebrow),.explanation article>p:not(.eyebrow){color:var(--muted);line-height:1.55}
.decision-numbers{display:grid;grid-template-columns:1fr 1fr;margin-top:20px;border-top:1px solid var(--line)}
.decision-numbers div{padding:15px 10px 0 0}
.decision-numbers span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase}
.decision-numbers strong{display:block;margin-top:5px;font-size:18px}
.inspector-head{display:flex;justify-content:space-between;align-items:start}
.inspector-head output{color:var(--muted);font-size:12px}
.day-values{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}
.day-values div{padding:11px;background:var(--soft);border-left:3px solid var(--series-color)}
.day-values span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase}
.day-values strong{display:block;margin-top:4px}
.table-wrap{overflow-x:auto;margin-top:18px}
table{width:100%;border-collapse:collapse;font-size:13px}
th,td{padding:13px 10px;border-top:1px solid var(--line);text-align:left;white-space:nowrap}
th{color:var(--muted);font-size:10px;text-transform:uppercase}
td:first-child{font-weight:700}
.status-pill{display:inline-block;padding:5px 8px;border-radius:3px;background:var(--soft);color:var(--muted);font-size:10px;text-transform:uppercase}
.status-pill.warn{background:#fff0dc;color:#8a531a}
.status-pill.high{background:#f7ded7;color:#8a3929}
.explanation{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px;padding-top:24px;border-top:1px solid var(--line)}
.explanation article{padding-right:24px}
.explanation .method{padding-left:24px;border-left:1px solid var(--line)}
footer{max-width:1540px;margin:0 auto;padding:22px clamp(18px,3vw,42px) 34px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:11px}

@media(max-width:1100px){.app-layout{grid-template-columns:290px minmax(0,1fr)}
.summary{grid-template-columns:repeat(3,1fr)}
.metric:nth-child(3){border-right:0}
.metric:nth-child(-n+3){border-bottom:1px solid var(--line)}
}

@media(max-width:820px){.app-header{position:relative}
.brand span,.status{display:none}
.intro{display:block}
.intro>p{margin-top:18px}
.app-layout{grid-template-columns:1fr}
.controls{position:static}
.summary{grid-template-columns:1fr 1fr}
.metric,.metric:nth-child(3){border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.metric:nth-child(even){border-right:0}
.metric:last-child{grid-column:1/-1;border-bottom:0}
.decision-grid,.explanation{grid-template-columns:1fr}
.explanation .method{padding:24px 0 0;border-left:0;border-top:1px solid var(--line)}
canvas{height:300px}
footer{display:block}
footer span{display:block;margin-top:7px}
}

@media(max-width:520px){.header-actions .back-link{display:none}
.brand img{width:124px}
main{padding-top:24px}
.intro h1{max-width:100%;overflow-wrap:anywhere;font-size:34px}
.summary{grid-template-columns:1fr}
.metric,.metric:nth-child(3),.metric:nth-child(even){border-right:0}
.metric:last-child{grid-column:auto}
.chart-panel,.comparison-panel,.decision-card,.inspector{padding:16px}
.chart-head{display:block}
.chart-head>span{display:block;margin-top:8px;text-align:left}
.day-values{grid-template-columns:1fr}
canvas{height:270px}
}