/* Saarthi 2.0 dashboard - light agricultural theme */
:root{
  --green:#1f9d4d; --green-dark:#15803d; --green-soft:#e9f6ec; --green-line:#cfe8d5;
  --bg:#f5f9f4; --card:#ffffff; --line:#e7efe6; --ink:#17251d; --muted:#6c7f71;
  --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;
}
*{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:#fff;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:#f7fbf6;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:#5d7064;font-size:13px;font-weight:500;width:100%}
nav button:hover{background:#f2f8f1}
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:4px 6px}
.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:rgba(255,255,255,.92);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:#51625a;background:#f6faf5;
  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:#fffaf0;border:1px solid #f2e4c6;
  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:#fff;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:#fff;border-radius:9px;
  display:grid;place-items:center;color:#51625a}
.icon-btn:hover{background:#f4f9f3}
.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:#fff;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:#fff}
.btn.primary:hover{background:var(--green-dark)}
.btn.ghost{background:#f6faf5}
.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:#fff;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:#f1f8ee;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:#4a6450;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:#fff;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 #f2f6f1;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:#fbfdfa}
.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:#fbfdfa}
.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:#fff;border:2px solid #fff;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:#fbfdfa}
.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:#fff;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:#fbfdfa}
.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:#fbfdfa}
.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:rgba(255,255,255,.75);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:#fbfdfa}
.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:#fbfdfa}
.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:#f1f8ee;border:1px solid var(--green-line);border-top-left-radius:4px;align-self:flex-start}
.msg.user{background:var(--green);color:#fff;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:#fff;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:#fff;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:#fbfdfa}
.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:#fff;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:#fff;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:#fff;
  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:#fbfdfa}
.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:#fff;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 #f1f5f0;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:#fbfdfa}
.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:#fbfdfa}
.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:#f8fcf7;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:#fff;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:#fbfdfa;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:#fff;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 #f2f6f1}
.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:#4a6450;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:#fbfdfa}
.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:#fff;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:#fff;
  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:#fff;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:#fff;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:#fbfdfa;
  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:#fff;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:#90a095;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:#51625a}
.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:#f4f9f3}
.hbar-label{font-size:11px;color:#51625a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbar-track{height:9px;background:#eef3ed;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:#eef3ed}
.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:#fbfdfa;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:#eef3ed;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:#fff;
  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:#fff;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:#90a095;
  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:#fbfdfa;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:#fff;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:#fff;border-radius:20px;padding:7px 11px;font-size:11.5px;
  color:#51625a;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}
}