/* Saarthi 2.0 dashboard - one agricultural theme, in daylight and after dark.
   Every colour the two themes disagree about is a token. A rule that hard-codes a
   surface cannot follow the theme, which is why the surfaces were tokenised. */
:root{
  --green:#1f9d4d; --green-dark:#15803d; --green-soft:#e9f6ec; --green-line:#cfe8d5;
  --bg:#f5f9f4; --card:#ffffff; --line:#e7efe6; --ink:#17251d; --muted:#6c7f71;
  --surface-2:#fbfdfa; --surface-3:#f1f8ee; --ink-soft:#4a6450; --muted-soft:#90a095;
  --blue:#2f80d6; --blue-soft:#e8f1fc; --amber:#d9930c; --amber-soft:#fdf3e0;
  --red:#c6513f; --red-soft:#fdeeea; --purple:#6b57c9;
  --radius:14px; --shadow:0 4px 18px rgba(30,70,40,.05);
  --sidebar:248px;
  --topbar-bg:rgba(255,255,255,.92);
  --field-ink:#17251d;
  color-scheme:light;
}

/* Dark theme: neutral black, not a dark green.
   The greens stay as ACCENTS - the brand colour belongs on buttons, the active nav
   item and the charts, not on every panel. A first pass tinted all the surfaces green
   and the whole screen read as green rather than dark.

   There is one dark block, not two. The theme is resolved to an explicit data-theme
   by a small script in <head> before first paint, so the OS preference needs no
   separate @media copy of all these values to drift out of step with this one. */
:root[data-theme="dark"]{
  --green:#35c46a; --green-dark:#6ee098; --green-soft:#16271c; --green-line:#2c5b3b;
  --bg:#0b0b0d; --card:#141417; --line:#2b2b31; --ink:#ededf0; --muted:#9797a1;
  --surface-2:#1a1a1e; --surface-3:#212126; --ink-soft:#c9c9d0; --muted-soft:#78787f;
  --blue:#6aa9ec; --blue-soft:#15202d; --amber:#e8a93a; --amber-soft:#2b2410;
  --red:#e2705c; --red-soft:#2e1b18; --purple:#9b8ae0;
  --shadow:0 4px 20px rgba(0,0,0,.55);
  --topbar-bg:rgba(20,20,23,.93);
  --field-ink:#ededf0;
  color-scheme:dark;
}

*{box-sizing:border-box}
/* An author `display` rule beats the UA stylesheet's [hidden]{display:none}, which is
   how the "Running all 15 agents" panel (a display:grid .empty-state) stayed on screen
   after the run finished. Make the attribute win everywhere. */
[hidden]{display:none !important}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font:14px/1.5 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:Manrope,Inter,sans-serif;margin:0;letter-spacing:-.3px}
h1{font-size:25px;font-weight:800}
h2{font-size:16px;font-weight:700}
h3{font-size:13px;font-weight:700}
p{margin:0;color:var(--muted)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--green-dark)}

/* ---------------- sidebar ---------------- */
.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);background:var(--card);border-right:1px solid var(--line);
  display:flex;flex-direction:column;padding:18px 14px;z-index:30}
.brand{display:flex;gap:10px;align-items:center;padding:4px 6px 16px}
.brand-mark{width:38px;height:38px;border-radius:11px;background:var(--green-soft);display:grid;place-items:center}
.brand-text b{display:block;font:800 19px Manrope;letter-spacing:-.4px}
.brand-text small{display:block;font-size:10px;color:var(--muted);margin-top:1px}
.farm-pill{display:flex;align-items:center;gap:9px;width:100%;background:var(--surface-2);border:1px solid var(--line);
  border-radius:10px;padding:9px 11px;text-align:left;color:var(--ink);margin-bottom:14px}
.farm-pill b{display:block;font-size:12px}
.farm-pill small{display:block;font-size:10px;color:var(--muted)}
.farm-pill span:nth-child(2){flex:1}
.farm-dot{width:8px;height:8px;border-radius:50%;background:var(--green)}
nav{display:grid;gap:2px;overflow-y:auto;flex:1;margin:0 -4px;padding:0 4px}
nav::-webkit-scrollbar{width:0}
nav button{display:flex;align-items:center;gap:10px;border:0;background:none;text-align:left;
  padding:9px 11px;border-radius:9px;color:var(--muted);font-size:13px;font-weight:500;width:100%}
nav button:hover{background:var(--surface-3)}
nav button.active{background:var(--green-soft);color:var(--green-dark);font-weight:700}
nav button i{width:18px;height:18px;display:inline-grid;place-items:center;flex:none}
nav button i svg{width:17px;height:17px}
.side-foot{border-top:1px solid var(--line);padding-top:12px;margin-top:8px}
.side-lang{display:flex;align-items:center;gap:8px;color:var(--muted);padding:6px 8px;border:1px solid var(--line);border-radius:9px;margin-bottom:10px}
.side-lang select{border:0;background:none;flex:1;font-size:12px;outline:none}
.user{display:flex;align-items:center;gap:9px;padding:6px;width:100%;text-align:left;
  background:none;border:1px solid transparent;border-radius:10px;color:inherit}
.user:hover{background:var(--surface-3);border-color:var(--line)}
.user svg{margin-left:auto;color:var(--muted)}
button.avatar{border:0}
.user b{display:block;font-size:12px}
.user small{display:block;font-size:10px;color:var(--muted)}
.avatar{width:32px;height:32px;border-radius:50%;background:#dff0e2;color:var(--green-dark);
  display:grid;place-items:center;font:700 12px Manrope;flex:none}
.avatar.sm{width:28px;height:28px;font-size:11px}

/* ---------------- top bar ---------------- */
main{margin-left:var(--sidebar);min-height:100vh;display:flex;flex-direction:column}
.topbar{position:sticky;top:0;z-index:20;height:58px;background:var(--topbar-bg);backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:0 22px}
.top-farm{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted);background:var(--surface-2);
  border:1px solid var(--line);padding:6px 11px;border-radius:9px}
.top-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.weather-pill{display:flex;align-items:center;gap:7px;background:var(--amber-soft);border:1px solid var(--line);
  border-radius:9px;padding:5px 10px;font-size:12px}
.weather-pill b{font-size:12px}
.weather-pill small{color:var(--muted);font-size:11px}
.wsun{width:14px;height:14px;border-radius:50%;background:radial-gradient(circle,#ffd24d 55%,#ffb703);display:inline-block}
.top-right select{border:1px solid var(--line);background:var(--card);border-radius:9px;padding:6px 8px;font-size:12px;outline:none}
.icon-btn{position:relative;width:34px;height:34px;border:1px solid var(--line);background:var(--card);border-radius:9px;
  display:grid;place-items:center;color:var(--muted)}
.icon-btn:hover{background:var(--surface-2)}
.icon-btn .dot{position:absolute;top:6px;right:7px;width:7px;height:7px;border-radius:50%;background:var(--red)}
.only-mobile{display:none}

/* ---------------- layout ---------------- */
.content{padding:20px 22px 30px;max-width:1420px;width:100%;margin:0 auto;flex:1}
.page{display:none;animation:fade .18s ease}
.page.active{display:block}
@keyframes fade{from{opacity:.3;transform:translateY(3px)}to{opacity:1;transform:none}}
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;margin-bottom:16px;flex-wrap:wrap}
.page-head p{font-size:12.5px;margin-top:3px}
.head-controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow);min-width:0}
.card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:12px}
.card-head p{font-size:11.5px;margin-top:2px}
.cols{display:grid;grid-template-columns:1.25fr 1fr;gap:14px;margin-bottom:14px}
.cols.three{grid-template-columns:repeat(3,1fr)}
.cols.soil-top{grid-template-columns:.8fr 1.6fr}
.cols.weather-top{grid-template-columns:1fr 1.5fr}
.badge{font-size:11px;background:var(--green-soft);color:var(--green-dark);border:1px solid var(--green-line);
  padding:5px 10px;border-radius:20px;white-space:nowrap;font-weight:600}
.badge.warn{background:var(--amber-soft);color:#8a6400;border-color:#f0dcae}
.badge.bad{background:var(--red-soft);color:#9c3a2a;border-color:#f3cfc6}
.badge.info{background:var(--blue-soft);color:#1b5fa8;border-color:#cbe0f7}
.btn{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:9px;padding:9px 14px;
  font-size:12.5px;font-weight:600;transition:.15s}
.btn:hover{background:#f5faf4}
.btn.primary{background:var(--green);border-color:var(--green);color:var(--card)}
.btn.primary:hover{background:var(--green-dark)}
.btn.ghost{background:var(--surface-2)}
.btn.sm{padding:7px 11px;font-size:12px}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.link{border:0;background:none;color:var(--green-dark);font-size:12px;font-weight:700}
.mini-select,.field select,.field input,.textarea{border:1px solid var(--line);background:var(--card);border-radius:9px;
  padding:8px 10px;font-size:12.5px;outline:none;width:100%}
.mini-select{width:auto;min-width:150px}
.field{display:block;margin-bottom:10px}
.field span{display:block;font-size:11px;color:var(--muted);margin-bottom:4px;font-weight:600}
.textarea{resize:vertical;font-family:inherit}
.hint{font-size:11px;color:var(--muted);margin-top:8px;line-height:1.45}
.hint.center{text-align:center}
.notice{background:var(--surface-3);border:1px solid var(--green-line);border-radius:11px;padding:11px 13px;
  font-size:12px;color:#3c5a45;margin-bottom:14px}
.mini-title{margin:16px 0 8px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.6px}
.foot{display:flex;justify-content:space-between;gap:10px;color:#9aa89d;font-size:11px;padding:20px 2px 4px;flex-wrap:wrap}

/* ---------------- hero + metrics ---------------- */
.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:16px;background:linear-gradient(104deg,#eaf7e5,#ddf0d8);
  border:1px solid var(--green-line);border-radius:16px;padding:22px;margin-bottom:14px;align-items:center}
.hero h1{font-size:24px}
.hero p{color:var(--ink-soft);margin:6px 0 14px;font-size:13px}
.hero-art{min-width:0}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
.metric{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow)}
.metric .m-top{display:flex;align-items:center;gap:9px}
.metric .m-ico{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:var(--green-soft);color:var(--green-dark)}
.metric .m-ico.blue{background:var(--blue-soft);color:#1b5fa8}
.metric .m-ico.amber{background:var(--amber-soft);color:#8a6400}
.metric .m-ico.purple{background:#efeafb;color:var(--purple)}
.metric h3{font-size:11.5px;color:var(--muted);font-weight:600}
.metric .m-val{font:800 24px Manrope;margin:9px 0 3px}
.metric .m-val small{font-size:12px;color:var(--muted);font-weight:600}
.metric .m-sub{font-size:11px;color:var(--green-dark);font-weight:600}
.metric .m-sub.muted{color:var(--muted)}
.bar{height:5px;background:#eef2ed;border-radius:6px;margin-top:9px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--green);border-radius:6px}
.bar i.blue{background:var(--blue)}
.bar i.amber{background:var(--amber)}

/* ---------------- lists ---------------- */
.reco-list{display:grid}
.reco{display:flex;align-items:center;gap:11px;padding:11px 0;border-bottom:1px solid #f0f4ef;cursor:pointer}
.reco:last-child{border:0}
.reco .r-ico{width:32px;height:32px;border-radius:9px;background:var(--green-soft);color:var(--green-dark);display:grid;place-items:center;flex:none}
.reco b{display:block;font-size:12.5px}
.reco small{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.reco span{flex:1;min-width:0}
.check-list{list-style:none;margin:0;padding:0}
.check-list li{display:flex;gap:9px;align-items:flex-start;padding:8px 0;border-bottom:1px solid var(--surface-2);font-size:12.5px}
.check-list li:last-child{border:0}
.check-list .tick{width:16px;height:16px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--green-soft);color:var(--green-dark);font-size:10px;font-weight:800;margin-top:1px}
.check-list .tick.warn{background:var(--amber-soft);color:#8a6400}
.check-list .tick.bad{background:var(--red-soft);color:#9c3a2a}
.alert-list{display:grid;gap:9px}
.alert{display:flex;gap:11px;align-items:flex-start;border:1px solid var(--line);border-radius:11px;padding:11px;background:var(--surface-2)}
.alert.warn{background:var(--amber-soft);border-color:#f0dcae}
.alert.bad{background:var(--red-soft);border-color:#f3cfc6}
.alert b{display:block;font-size:12.5px}
.alert small{display:block;font-size:11.5px;color:var(--muted);margin-top:3px}
.cap-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.cap{border:1px solid var(--line);border-radius:11px;padding:11px;background:var(--surface-2)}
.cap b{display:block;font-size:12px;margin-bottom:5px}
.cap small{display:block;font-size:11px;color:var(--muted);line-height:1.4}
.cap .pill{display:inline-block;font-size:10px;padding:2px 8px;border-radius:20px;margin-bottom:6px;font-weight:700}
.cap .pill.on{background:var(--green-soft);color:var(--green-dark)}
.cap .pill.off{background:var(--amber-soft);color:#8a6400}

/* ---------------- field map ---------------- */
.fieldmap{position:relative;height:218px;border-radius:12px;overflow:hidden;
  background:repeating-linear-gradient(102deg,#cfe6b4 0 34px,#e2f0cd 35px 48px);display:flex;align-items:center;justify-content:space-around;padding:12px}
.plot{background:#3f8f4e;color:var(--card);border:2px solid var(--card);border-radius:10px;padding:10px 12px;font-size:10.5px;line-height:1.5;box-shadow:0 6px 14px rgba(20,60,30,.18)}
.plot:nth-child(2){background:#74a953;transform:rotate(3deg)}
.plot:nth-child(1){transform:rotate(-4deg)}
.plot:nth-child(3){background:#c79b4b;transform:rotate(-1deg)}
.plot b{display:block;font-size:11.5px;margin-bottom:2px}

/* ---------------- charts ---------------- */
.chart-box{width:100%;min-height:170px}
.chart-box svg{width:100%;height:auto;display:block}
.chart-legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:8px;font-size:11px;color:var(--muted)}
.chart-legend span{display:flex;align-items:center;gap:5px}
.chart-legend i{width:9px;height:9px;border-radius:3px;display:inline-block}
.empty-chart{display:grid;place-items:center;height:170px;color:var(--muted);font-size:12px;
  border:1px dashed var(--line);border-radius:11px;text-align:center;padding:14px}

/* ---------------- gauge + params ---------------- */
.gauge-card{display:flex;flex-direction:column}
.gauge-wrap{display:grid;place-items:center;padding:6px 0 2px}
.param-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.param{border:1px solid var(--line);border-radius:11px;padding:11px;background:var(--surface-2)}
.param .p-top{display:flex;align-items:center;justify-content:space-between;gap:6px}
.param .p-ico{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:var(--green-soft);color:var(--green-dark);font-size:11px;font-weight:800}
.param small{display:block;font-size:10.5px;color:var(--muted);margin-top:7px}
.param b{display:block;font:800 17px Manrope;margin-top:2px}
.param .p-band{font-size:10px;font-weight:700;padding:2px 7px;border-radius:20px;background:var(--green-soft);color:var(--green-dark)}
.param .p-band.low{background:var(--blue-soft);color:#1b5fa8}
.param .p-band.high{background:var(--amber-soft);color:#8a6400}
.param .p-band.unknown{background:#f0f2ef;color:var(--muted)}

/* ---------------- crops ---------------- */
.crop-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
.crop{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.crop .c-art{height:94px;display:grid;place-items:center;background:linear-gradient(140deg,#e7dca6,#bcd892)}
.crop:nth-child(2) .c-art{background:linear-gradient(140deg,#d6ebb6,#8cc082)}
.crop:nth-child(3) .c-art{background:linear-gradient(140deg,#f7e8a6,#dcdd86)}
.crop:nth-child(4) .c-art{background:linear-gradient(140deg,#d8e8b3,#92c591)}
.crop .c-body{padding:12px}
.crop .c-top{display:flex;justify-content:space-between;align-items:center;gap:6px}
.crop h3{font-size:14px}
.crop .c-score{font:800 15px Manrope;color:var(--green-dark)}
.crop .c-meta{font-size:11px;color:var(--muted);margin-top:7px;display:grid;gap:3px}
.factor-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;text-align:center}
.factor{border:1px solid var(--line);border-radius:11px;padding:12px 8px;background:var(--surface-2)}
.factor b{display:block;font-size:11.5px;margin-top:7px}
.factor small{display:block;font-size:10.5px;color:var(--muted);margin-top:2px}
.timeline{display:grid;grid-template-columns:repeat(auto-fit,minmax(78px,1fr));gap:8px;text-align:center}
.tl{border:1px solid var(--line);border-radius:11px;padding:11px 6px;background:var(--surface-2)}
.tl b{display:block;font-size:10.5px;margin-top:6px;text-transform:capitalize}
.tl small{display:block;font-size:10px;color:var(--muted)}

/* ---------------- weather ---------------- */
.weather-now{display:flex;flex-direction:column;justify-content:center;gap:12px;background:linear-gradient(140deg,#eef7fd,#f1faef)}
.wn-top{display:flex;align-items:center;gap:14px}
.wn-temp{font:800 38px Manrope}
.wn-cond{font-size:13px;color:var(--muted)}
.wn-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.wn-stat{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:9px;text-align:center}
.wn-stat small{display:block;font-size:10.5px;color:var(--muted)}
.wn-stat b{display:block;font-size:13px;margin-top:3px}
.forecast{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}
.fc{border:1px solid var(--line);border-radius:11px;padding:11px 7px;text-align:center;background:var(--surface-2)}
.fc b{display:block;font-size:13px;margin-top:6px}
.fc small{display:block;font-size:10.5px;color:var(--muted);margin-top:2px}
.fc .fc-day{font-size:11px;font-weight:700;color:var(--muted)}

/* ---------------- chat ---------------- */
.chat-card{padding:0;overflow:hidden;max-width:980px}
.chat-head{display:flex;align-items:center;gap:10px;padding:13px 15px;border-bottom:1px solid var(--line);background:var(--surface-2)}
.chat-head div{flex:1}
.chat-head b{font-size:13px}
.chat-head small{display:block;font-size:11px;color:var(--muted)}
.chat-avatar{width:32px;height:32px;border-radius:50%;background:var(--green-soft);color:var(--green-dark);display:grid;place-items:center}
.chat-avatar.sm{width:26px;height:26px}
.messages{padding:16px;display:flex;flex-direction:column;gap:11px;min-height:280px;max-height:52vh;overflow-y:auto}
.messages.sm{min-height:200px;max-height:300px;padding:12px}
.msg{max-width:84%;padding:10px 13px;border-radius:13px;font-size:12.8px;line-height:1.55;white-space:pre-wrap;word-wrap:break-word}
.msg.bot{background:var(--surface-3);border:1px solid var(--green-line);border-top-left-radius:4px;align-self:flex-start}
.msg.user{background:var(--green);color:var(--card);border-bottom-right-radius:4px;align-self:flex-end}
.msg.sys{background:var(--amber-soft);border:1px solid #f0dcae;font-size:11.5px;align-self:stretch;color:#7a5a07}
.msg .meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.msg .tag{font-size:10px;background:var(--card);border:1px solid var(--green-line);color:var(--green-dark);border-radius:20px;padding:2px 7px}
.msg .src{font-size:10.5px;color:var(--muted);margin-top:6px}
.typing{display:flex;gap:4px;align-items:center}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--green);animation:blink 1s infinite}
.typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,100%{opacity:.25}50%{opacity:1}}
.quick-row{display:flex;gap:7px;flex-wrap:wrap;padding:0 15px 10px}
.quick{border:1px solid var(--green-line);background:var(--card);color:var(--green-dark);border-radius:20px;
  padding:6px 11px;font-size:11.5px;font-weight:600}
.quick:hover{background:var(--green-soft)}
.chat-form{display:flex;gap:8px;padding:12px 14px;border-top:1px solid var(--line);background:var(--surface-2)}
.chat-form input{flex:1;min-width:0;border:1px solid var(--line);border-radius:10px;padding:10px 12px;outline:none}
.chat-form.sm{padding:10px}
.icon-btn.mic.recording{background:var(--red-soft);border-color:#f3cfc6;color:var(--red);animation:pulse 1.1s infinite}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
.toggle{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--muted);
  border:1px solid var(--line);border-radius:20px;padding:5px 10px;background:var(--card);cursor:pointer}
.toggle input{accent-color:var(--green);margin:0}
.toggle.sm{font-size:11px;padding:4px 8px}

/* ---------------- fab chatbot ---------------- */
.fab{position:fixed;right:22px;bottom:22px;width:54px;height:54px;border-radius:50%;border:0;z-index:40;
  background:var(--green);color:var(--card);display:grid;place-items:center;box-shadow:0 10px 24px rgba(26,120,60,.35)}
.fab:hover{background:var(--green-dark)}
.chatbot{position:fixed;right:22px;bottom:86px;width:360px;max-width:calc(100vw - 32px);background:var(--card);
  border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 44px rgba(20,60,30,.18);z-index:41;overflow:hidden}
.chatbot-head{display:flex;align-items:center;gap:9px;padding:11px 12px;border-bottom:1px solid var(--line);background:var(--surface-2)}
.chatbot-head div{flex:1;min-width:0}
.chatbot-head b{font-size:12.5px}
.chatbot-head small{display:block;font-size:10.5px;color:var(--muted)}
.chatbot-head select{border:1px solid var(--line);border-radius:8px;padding:4px 6px;font-size:11px;background:var(--card);max-width:92px}
.chatbot-toggles{display:flex;gap:6px;padding:9px 12px 0}

/* ---------------- tables / flows ---------------- */
.table{width:100%;overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:12px}
th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);
  padding:9px 10px;background:#f7faf6;border-bottom:1px solid var(--line);font-weight:700;white-space:nowrap}
td{padding:9px 10px;border-bottom:1px solid var(--surface-2);vertical-align:top}
tr:last-child td{border-bottom:0}
td.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.up{color:var(--green-dark);font-weight:700}
.down{color:var(--red);font-weight:700}
.flow{display:flex;align-items:stretch;gap:7px;flex-wrap:wrap}
.flow .node{flex:1;min-width:112px;border:1px solid var(--line);border-radius:11px;padding:11px 9px;text-align:center;background:var(--surface-2)}
.flow .node b{display:block;font-size:11.5px;margin-top:7px}
.flow .node small{display:block;font-size:10px;color:var(--muted);margin-top:3px}
.flow .arrow{display:grid;place-items:center;color:var(--green);font-size:15px;min-width:14px}
.endpoint-list{display:grid;gap:7px;margin-top:12px}
.endpoint{display:flex;gap:9px;align-items:center;font-size:11.5px;background:#f8fbf7;border:1px solid var(--line);
  border-radius:9px;padding:8px 10px;overflow-wrap:anywhere}
.endpoint .verb{font:700 10px Manrope;background:var(--green-soft);color:var(--green-dark);border-radius:5px;padding:2px 6px;flex:none}
.code{background:#14261c;color:#cfe9d6;border-radius:11px;padding:13px;font:11.5px/1.6 ui-monospace,Consolas,monospace;
  overflow-x:auto;margin-top:12px;white-space:pre}

/* ---------------- agents ---------------- */
.agent-list{display:grid;gap:8px;max-height:460px;overflow-y:auto}
.agent-item{border:1px solid var(--line);border-radius:11px;padding:10px 11px;background:var(--surface-2)}
.agent-item b{font-size:12px;display:block}
.agent-item small{display:block;font-size:11px;color:var(--muted);margin-top:3px}
.agent-item .num{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:6px;
  background:var(--green-soft);color:var(--green-dark);font:700 10px Manrope;margin-right:7px}
.shared-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
.shared{border:1px solid #d9e6f5;background:var(--blue-soft);border-radius:11px;padding:11px}
.shared b{display:block;font-size:11.5px}
.shared small{display:block;font-size:10.5px;color:#4a6480;margin-top:3px}

/* ---------------- misc ---------------- */
.upload{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;height:150px;
  border:1.5px dashed var(--green-line);border-radius:12px;background:var(--surface-2);color:var(--green-dark);cursor:pointer;text-align:center;padding:12px}
.upload b{font-size:12.5px}
.upload small{font-size:10.5px;color:var(--muted);max-width:230px}
.upload.drag{background:var(--green-soft);border-color:var(--green)}
.preview{margin-top:10px;min-height:0}
.preview img{width:100%;border-radius:11px;border:1px solid var(--line)}
.chip-row{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.chip{border:1px solid var(--line);background:var(--card);border-radius:20px;padding:5px 10px;font-size:11.5px;color:#56685c}
.chip.on{background:var(--green-soft);border-color:var(--green-line);color:var(--green-dark);font-weight:700}
.empty-state{display:grid;place-items:center;gap:6px;text-align:center;padding:24px 14px;border:1px dashed var(--line);
  border-radius:12px;background:var(--surface-2);color:var(--muted)}
.empty-state b{font-size:12.5px;color:var(--ink)}
.empty-state small{font-size:11px;max-width:260px}
.mode-list{display:grid;gap:8px}
.mode{text-align:left;border:1px solid var(--line);background:var(--card);border-radius:11px;padding:11px 12px}
.mode b{display:block;font-size:12.5px}
.mode small{display:block;font-size:11px;color:var(--muted);margin-top:3px}
.mode.selected{border-color:var(--green);background:#f3fbf2}
.status-list{display:grid;gap:8px}
.status-row{display:flex;justify-content:space-between;gap:10px;font-size:12px;padding:8px 0;border-bottom:1px solid var(--surface-2)}
.status-row:last-child{border:0}
.status-row span:first-child{color:var(--muted)}
.status-row b{text-align:right;overflow-wrap:anywhere}
.price-card{display:flex;flex-direction:column;justify-content:center}
.price-big{font:800 36px Manrope;margin:6px 0}
.price-sub{font-size:12px;color:var(--muted)}
.helpline{background:var(--green-soft);border:1px solid var(--green-line);border-radius:12px;padding:14px;text-align:center}
.helpline b{display:block;font:800 20px Manrope;color:var(--green-dark);letter-spacing:.5px}
.helpline small{display:block;font-size:11px;color:var(--ink-soft);margin-top:5px}
.ivr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.ivr{border:1px solid var(--line);border-radius:9px;padding:7px;text-align:center;font-size:11px;background:var(--surface-2)}
.ivr b{display:block;font:700 12px Manrope;color:var(--green-dark)}
.report-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
.report{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:15px;box-shadow:var(--shadow)}
.report .r-ico{width:34px;height:34px;border-radius:10px;background:var(--green-soft);color:var(--green-dark);display:grid;place-items:center;margin-bottom:10px}
.report b{display:block;font-size:12.5px}
.report small{display:block;font-size:11px;color:var(--muted);margin:5px 0 11px;min-height:32px}
#toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,16px);background:#17251d;color:var(--card);
  padding:11px 16px;border-radius:10px;font-size:12.5px;opacity:0;pointer-events:none;transition:.2s;z-index:60;max-width:92vw}
#toast.show{opacity:1;transform:translate(-50%,0)}
.trace{margin-top:14px}
.trace details{border:1px solid var(--line);border-radius:11px;background:var(--card);margin-bottom:7px;padding:10px 12px}
.trace summary{cursor:pointer;font-size:12.5px;font-weight:600;display:flex;gap:8px;align-items:center}
.trace summary .num{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:6px;background:var(--green-soft);color:var(--green-dark);font:700 10px Manrope}
.trace ul{margin:9px 0 0;padding-left:18px;font-size:12px;color:#44584a}
.trace li{margin-bottom:3px}
.trace .warn-li{color:#8a6400}

/* ---------------- responsive ---------------- */
@media(max-width:1200px){
  .metrics{grid-template-columns:repeat(2,1fr)}
  .param-grid{grid-template-columns:repeat(3,1fr)}
  .crop-grid,.report-grid{grid-template-columns:repeat(2,1fr)}
  .cap-grid{grid-template-columns:repeat(2,1fr)}
  .cols.three{grid-template-columns:1fr 1fr}
}
@media(max-width:980px){
  .cols,.cols.soil-top,.cols.weather-top,.cols.three{grid-template-columns:1fr}
  .hero{grid-template-columns:1fr}
  .hero-art{display:none}
}
@media(max-width:820px){
  .sidebar{transform:translateX(-100%);transition:.2s;box-shadow:none}
  .sidebar.open{transform:none;box-shadow:12px 0 40px rgba(20,50,30,.18)}
  main{margin-left:0}
  .only-mobile{display:grid}
  .content{padding:16px 13px 26px}
  .top-farm{display:none}
  .forecast{grid-template-columns:repeat(3,1fr)}
  .factor-row{grid-template-columns:repeat(2,1fr)}
  .chatbot{right:12px;left:12px;width:auto;bottom:80px}
}
@media(max-width:560px){
  .metrics,.param-grid,.crop-grid,.report-grid,.cap-grid{grid-template-columns:1fr 1fr}
  .ivr-grid{grid-template-columns:repeat(2,1fr)}
  h1{font-size:21px}
  .shared-grid{grid-template-columns:1fr}
}

/* ---------------- run-pipeline button ---------------- */
.run-pipe{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.run-pipe .pulse{width:8px;height:8px;border-radius:50%;background:var(--card);opacity:.9;flex:none}
.run-pipe .pulse.on{animation:pulsedot .9s infinite}
.btn.ghost .pulse,.btn:not(.primary) .pulse{background:var(--green)}
@keyframes pulsedot{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}
.hero-actions{display:flex;gap:9px;flex-wrap:wrap;align-items:center}
.hero .hint{margin-top:9px}

/* ---------------- agent board (overview) ---------------- */
.agent-board{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.agent-card{border:1px solid var(--line);border-radius:12px;padding:11px;background:var(--surface-2);
  display:flex;flex-direction:column;gap:5px;cursor:pointer;transition:.15s;min-height:124px}
.agent-card:hover{border-color:var(--green-line);background:#f4faf2;transform:translateY(-1px)}
.agent-card.idle{opacity:.78}
.agent-top{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.agent-top .num{display:inline-grid;place-items:center;width:21px;height:21px;border-radius:7px;
  background:var(--green);color:var(--card);font:800 10px Manrope;flex:none}
.agent-top b{font-size:11.5px;line-height:1.3;flex:1;min-width:0}
.agent-top .badge{font-size:9.5px;padding:2px 7px}
.agent-card small{font-size:10.5px;color:var(--muted);line-height:1.45}
.agent-card .agent-head-line{color:var(--ink);font-weight:600}
.agent-foot{margin-top:auto;display:flex;gap:9px;flex-wrap:wrap;font-size:9.5px;color:var(--muted-soft);padding-top:6px}
.agent-foot .sev{font-weight:700;color:#8a6400}
.agent-foot .sev.high{color:var(--red)}
.agent-foot .sev.medium{color:#8a6400}
.agent-foot .sev.low{color:var(--green-dark)}

/* ---------------- pipeline results page ---------------- */
.answer-text{color:var(--ink);font-size:13px;line-height:1.65;white-space:pre-wrap}
#pipelineEmpty .typing{margin-bottom:8px}

@media(max-width:1200px){.agent-board{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){
  .agent-board{grid-template-columns:repeat(2,1fr)}
  .run-pipe{font-size:11.5px;padding:8px 10px}
  .topbar .run-pipe span.pulse{display:none}
}
@media(max-width:560px){.agent-board{grid-template-columns:1fr}}

/* ---------------- pipeline results: charts first, text on demand ---------------- */
.donut-wrap{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center}
.donut-legend{display:grid;gap:6px;font-size:11.5px;min-width:118px}
.donut-legend span{display:flex;align-items:center;gap:7px;color:var(--muted)}
.donut-legend i{width:9px;height:9px;border-radius:3px;flex:none}
.donut-legend b{margin-left:auto;font-variant-numeric:tabular-nums}

.hbars{display:grid;gap:6px}
.hbar{display:grid;grid-template-columns:150px 1fr 44px;align-items:center;gap:9px;cursor:pointer;
  padding:2px 3px;border-radius:7px}
.hbar:hover{background:var(--surface-2)}
.hbar-label{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbar-track{height:9px;background:var(--surface-3);border-radius:7px;overflow:hidden}
.hbar-track i{display:block;height:100%;border-radius:7px;transition:width .4s ease}
.hbar-value{font-size:10.5px;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}

.stacked{display:grid;gap:9px}
.stacked-bar{display:flex;height:26px;border-radius:9px;overflow:hidden;background:var(--surface-3)}
.stacked-bar i{display:block;height:100%;transition:width .4s ease}

.legend-chip{font-size:10px;font-weight:700;padding:3px 9px;border-radius:20px;
  background:var(--green-soft);color:var(--green-dark);border:1px solid var(--green-line)}
.legend-chip.warn{background:var(--amber-soft);color:#8a6400;border-color:#f0dcae}
.legend-chip.bad{background:var(--red-soft);color:#9c3a2a;border-color:#f3cfc6}

.agent-matrix{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}
.matrix-cell{position:relative;text-align:left;border:1px solid var(--line);border-left:4px solid var(--green);
  background:var(--surface-2);border-radius:11px;padding:10px 11px;display:grid;gap:5px;transition:.15s}
.matrix-cell:hover{background:#f3faf2;transform:translateY(-1px)}
.matrix-cell.selected{border-color:var(--green);background:var(--green-soft);box-shadow:0 0 0 2px #cfe8d5}
.matrix-cell.ok{border-left-color:#2f9e4f}
.matrix-cell.warn{border-left-color:#d9930c}
.matrix-cell.bad{border-left-color:#c6513f}
.mc-num{font:800 10px Manrope;color:var(--muted)}
.mc-name{font-size:11px;font-weight:700;line-height:1.3;min-height:28px}
.mc-ring{display:block;height:5px;background:var(--surface-3);border-radius:6px;overflow:hidden}
.mc-ring i{display:block;height:100%;background:currentColor;opacity:.75;border-radius:6px}
.matrix-cell.ok .mc-ring i{background:#2f9e4f}
.matrix-cell.warn .mc-ring i{background:#d9930c}
.matrix-cell.bad .mc-ring i{background:#c6513f}
.mc-pct{font-size:9.5px;color:var(--muted)}
.mc-sev{position:absolute;top:8px;right:8px;width:7px;height:7px;border-radius:50%;background:#d9930c}
.mc-sev.high{background:var(--red)}
.mc-sev.low{background:#8fc99a}

.agent-drawer{margin-top:12px;border:1px solid var(--green-line);border-radius:12px;background:var(--card);
  padding:13px;box-shadow:0 6px 20px rgba(30,70,40,.07)}
.drawer-head{display:flex;align-items:center;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.drawer-head .num{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:8px;
  background:var(--green);color:var(--card);font:800 11px Manrope;flex:none}
.drawer-head div{flex:1;min-width:0}
.drawer-head b{font-size:13px;display:block}
.drawer-head small{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.drawer-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:12px 0}
.drawer-block h4{font-size:10px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin:0 0 5px}
.drawer-block ul{margin:0;padding-left:16px;font-size:11.5px;line-height:1.55;color:#3f5246}
.drawer-block li{margin-bottom:3px}
.drawer-block.warn ul{color:#8a6400}
.drawer-block.muted ul{color:var(--muted)}
.drawer-foot{display:flex;gap:14px;flex-wrap:wrap;font-size:10.5px;color:var(--muted-soft);
  border-top:1px solid var(--line);padding-top:9px}

.check-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.check-tile{border:1px solid var(--line);border-radius:11px;padding:11px;background:var(--surface-2);text-align:center}
.check-tile.flag{background:var(--amber-soft);border-color:#f0dcae}
.check-tile .ct-ico{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;
  background:var(--green-soft);color:var(--green-dark);font:800 10px Manrope;margin-bottom:6px}
.check-tile.flag .ct-ico{background:var(--card);color:#8a6400}
.check-tile b{display:block;font:800 14px Manrope}
.check-tile small{display:block;font-size:10px;color:var(--muted);margin-top:2px}

.answer-card .answer-text{font-size:12.5px;line-height:1.65;white-space:pre-wrap;color:var(--ink)}
.answer-text.clamped{display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.flag-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:11px}
.flag{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;background:var(--amber-soft);
  border:1px solid #f0dcae;color:#7a5a07;border-radius:20px;padding:4px 9px;max-width:100%}
.question-chips{display:flex;gap:7px;flex-wrap:wrap}
.qchip{border:1px solid var(--line);background:var(--card);border-radius:20px;padding:7px 11px;font-size:11.5px;
  color:var(--muted);text-align:left;max-width:100%}
.qchip:hover{background:var(--green-soft);border-color:var(--green-line);color:var(--green-dark)}

@media(max-width:1200px){
  .agent-matrix{grid-template-columns:repeat(3,1fr)}
  .check-grid{grid-template-columns:repeat(2,1fr)}
  .drawer-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
  .agent-matrix{grid-template-columns:repeat(2,1fr)}
  .hbar{grid-template-columns:96px 1fr 38px}
}

/* ---------------- pest page: model screening ---------------- */
.model-card{margin-bottom:14px}
.model-stats{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow)}
.model-stats div{text-align:center}
.model-stats b{display:block;font:800 18px Manrope;color:var(--green-dark)}
.model-stats small{display:block;font-size:10px;color:var(--muted);margin-top:3px;line-height:1.35}
.model-classes{display:grid;gap:7px;max-height:300px;overflow-y:auto}
.crop-row{display:flex;gap:9px;align-items:baseline;font-size:11.5px;border-bottom:1px solid var(--surface-2);padding-bottom:6px}
.crop-row b{min-width:92px;text-transform:capitalize}
.crop-row span{display:flex;gap:5px;flex-wrap:wrap}
.crop-row i{font-style:normal;background:var(--green-soft);color:var(--green-dark);
  border-radius:20px;padding:2px 8px;font-size:10.5px}
.limit-list{margin:10px 0 0;padding-left:16px;font-size:10.5px;color:var(--muted);line-height:1.5}
.screen-top{display:flex;justify-content:space-between;align-items:center;gap:12px;
  border-radius:12px;padding:14px;background:var(--green-soft);border:1px solid var(--green-line)}
.screen-top.flagged{background:var(--amber-soft);border-color:#f0dcae}
.screen-top small{display:block;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.screen-top b{display:block;font:800 17px Manrope;margin-top:3px}
.screen-conf{text-align:right}
.screen-conf b{font:800 24px Manrope;color:var(--green-dark)}
.screen-top.flagged .screen-conf b{color:#8a6400}
.screen-note{font-size:11.5px;color:var(--muted);margin:11px 0 0;line-height:1.55}
.prob-row{display:grid;grid-template-columns:1fr 90px 52px;align-items:center;gap:9px;
  font-size:11.5px;padding:4px 0}
.prob-track{height:7px;background:var(--surface-3);border-radius:6px;overflow:hidden}
.prob-track i{display:block;height:100%;background:#6b57c9;border-radius:6px}
.prob-row b{text-align:right;font-variant-numeric:tabular-nums;font-size:11px;color:var(--muted)}
@media(max-width:1200px){.model-stats{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.model-stats{grid-template-columns:repeat(2,1fr)}}
.screen-top.mismatch{background:var(--red-soft);border-color:#f3cfc6}
.screen-top.mismatch .screen-conf b{color:var(--red)}
.match-ok{font-size:11px;color:var(--green-dark);background:var(--green-soft);
  border:1px solid var(--green-line);border-radius:9px;padding:8px 10px;margin:10px 0 0}

/* ================= theme toggle ================= */
/* One button, two glyphs: whichever theme you are NOT in is the one offered. */
#themeBtn .ic-moon{display:none}
body.is-dark #themeBtn .ic-sun{display:none}
body.is-dark #themeBtn .ic-moon{display:block}

/* ================= profile ================= */
.two-up{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
@media(max-width:640px){.two-up{grid-template-columns:1fr}}
.field input[readonly]{background:var(--surface-2);color:var(--muted)}
.sticky-save{position:sticky;bottom:12px;z-index:5;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:10px 14px;box-shadow:var(--shadow);align-items:center;margin-bottom:14px}
.sticky-save .hint{margin:0}
.danger-card{border-color:var(--line)}
.fact-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:9px;margin-bottom:14px}
.fact{background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:9px 11px}
.fact b{display:block;font-size:11px;color:var(--muted);text-transform:capitalize}
.fact span{display:block;font-size:13px;font-weight:600;margin:2px 0 3px;overflow-wrap:anywhere}
.fact small{font-size:10px;color:var(--muted-soft)}
.erase-row{display:flex;gap:14px;align-items:center;flex-wrap:wrap;border-top:1px solid var(--line);
  padding-top:14px;margin-top:4px}
.erase-row>div{flex:1;min-width:240px}
.erase-row b{display:block;font-size:13px}
.erase-row small{display:block;font-size:11px;color:var(--muted);margin-top:3px}
.btn.danger{background:var(--red);border-color:var(--red);color:#fff}
.btn.danger:hover{filter:brightness(1.07)}

/* ================= field map ================= */
.map-cols{grid-template-columns:1.35fr 1fr}
@media(max-width:980px){.map-cols{grid-template-columns:1fr}}
.map-wrap{position:relative;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.leaflet-map{height:420px;width:100%;background:var(--surface-2)}
.map-zoom{position:absolute;right:10px;top:10px;z-index:500;display:grid;gap:6px}
.map-zoom .icon-btn{background:var(--card);border:1px solid var(--line);width:32px;height:32px;
  font:700 17px/1 Manrope;box-shadow:var(--shadow)}
.map-fallback{position:absolute;inset:0;display:grid;place-content:center;text-align:center;gap:6px;
  background:var(--surface-2);padding:20px;z-index:600}
.map-fallback b{font-size:14px}
.map-fallback small{color:var(--muted);max-width:320px}
.btn-row.tight{margin-top:0}
.field-form .field{margin-bottom:9px}
.field-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:11px}
.field-card{border:1px solid var(--line);border-radius:12px;padding:12px;background:var(--surface-2)}
.field-card-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:9px}
.field-card-head b{font:700 14px Manrope}
.chip-static{font-size:10px;background:var(--green-soft);color:var(--green-dark);
  border:1px solid var(--green-line);border-radius:20px;padding:3px 9px;white-space:nowrap}
.field-card-rows{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.field-card-rows span{display:block}
.field-card-rows small{display:block;font-size:10px;color:var(--muted)}
.field-card-rows b{font-size:12px}
/* Leaflet's own chrome has to follow the theme too, or it glows white in the dark. */
.leaflet-control-attribution{background:var(--card) !important;color:var(--muted) !important;font-size:9px !important}
.leaflet-control-attribution a{color:var(--green-dark) !important}
.leaflet-tooltip{background:var(--card);color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow)}
.leaflet-tooltip-top:before{border-top-color:var(--line)}

/* ================= pest result ================= */
.pest-graphic{margin-bottom:12px}
.verdict-row{display:flex;gap:16px;align-items:center;padding:14px;border-radius:12px;
  border:1px solid var(--line);background:var(--surface-2);margin-bottom:12px}
.verdict-row.good{background:var(--green-soft);border-color:var(--green-line)}
.verdict-row.flagged,.verdict-row.warn{background:var(--amber-soft);border-color:var(--amber)}
.verdict-row.bad{background:var(--red-soft);border-color:var(--red)}
.verdict-text{min-width:0}
.verdict-text b{display:block;font:700 17px Manrope;margin:4px 0 2px;overflow-wrap:anywhere}
.verdict-text small{display:block;font-size:11px;color:var(--muted)}
.verdict-tag{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;
  padding:3px 9px;border-radius:20px;background:var(--card);border:1px solid var(--line)}
.verdict-tag.good{color:var(--green-dark)}
.verdict-tag.flagged,.verdict-tag.warn{color:var(--amber)}
.verdict-tag.bad{color:var(--red)}

/* ================= manual sensor entry ================= */
.manual-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:0 10px;margin-top:4px}
.field.compact{margin-bottom:8px}
.field.compact span{font-size:11px}
.field.compact span i{color:var(--muted-soft);font-style:normal}
.mini-title{margin:16px 0 6px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;font-size:10px}

/* ================= calls ================= */
.pending-call{margin-top:11px;padding:10px 12px;border-radius:10px;background:var(--amber-soft);
  border:1px solid var(--amber)}
.pending-call b{display:block;font-size:12px}
.pending-call small{display:block;font-size:11px;color:var(--muted);margin-top:3px}
.cell-note{display:block;font-size:10px;color:var(--muted);margin-top:3px}
.cell-note.bad{color:var(--red)}
/* Dark mode inverts the map raster. Only the tiles are filtered - the plot rectangles
   and markers sit above it untouched, so a green field stays green. */
.leaflet-container.tiles-dark .leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.92) contrast(.92)}

/* ================= map: compact (overview) and full screen ================= */
/* The overview card keeps the height the illustration had, so replacing the drawing
   with a real map does not reflow the grid around it. */
.map-wrap.compact{border-radius:12px}
.leaflet-map.compact{height:208px}
.map-wrap:fullscreen{border-radius:0;border:0}
.map-wrap:fullscreen .leaflet-map{height:100vh}
.map-zoom .icon-btn svg{display:block}
.field .opt{font-style:normal;color:var(--muted-soft);font-weight:500}
/* The full-screen fallback for browsers that refuse the Fullscreen API. */
.map-wrap.map-maximised{position:fixed;inset:0;z-index:200;border-radius:0;border:0;background:var(--bg)}
.map-wrap.map-maximised .leaflet-map{height:100vh}

/* ================= admin ================= */
.row-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.row-actions .btn{white-space:nowrap}
#adminTable td{vertical-align:top}
