@font-face{font-family:Plex;src:url(fonts/plex-regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Plex;src:url(fonts/plex-semibold.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Plex;src:url(fonts/plex-bold.woff2) format("woff2");font-weight:700;font-display:swap}
:root{
--bg:#F4F5F3;--surface:#fff;--surface2:#F8F9F8;--line:#E1E4E1;--line2:#ECEEEC;
--ink:#18211C;--ink2:#38433D;--muted:#5E6A63;--faint:#8D978F;
--brand:#1F6448;--brand7:#174D37;--brand1:#EAF2ED;--brand2:#D3E4DA;
--leaf:#4F8F63;--leaf1:#EDF6E6;--amber:#B07A1F;--amber1:#FBF1DF;--amberInk:#8A5A10;
--teal:#2D7395;--teal1:#E8F1F5;--terra:#A8432A;--terra1:#F8E9E2;--terraInk:#9A4427;
--r:12px;--sh:0 1px 2px rgba(28,38,32,.04);--sh2:0 10px 30px rgba(28,38,32,.10);--side:252px}
*{box-sizing:border-box;margin:0;padding:0}
*{scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.16) transparent}
html{font-size:15px;-webkit-text-size-adjust:100%}
@media(min-width:1800px){html{font-size:16.5px}}
body{font-family:Plex,"SF Arabic","Geeza Pro",Tahoma,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0}
a{color:inherit;text-decoration:none}
.num,td,.kpi-v,.tile-v,.tabnum{font-variant-numeric:tabular-nums}
.ltr{direction:ltr;unicode-bidi:isolate;display:inline-block}
.i{width:1.15rem;height:1.15rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:middle}
.mark{width:2rem;height:2rem;flex:none}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px;border-radius:6px}
@keyframes up{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(95,168,69,.5)}70%{box-shadow:0 0 0 6px rgba(95,168,69,0)}100%{box-shadow:0 0 0 0 rgba(95,168,69,0)}}
@keyframes flash{0%{background:#FFF6E2}100%{background:transparent}}
@keyframes blink{0%,80%,100%{opacity:.25}40%{opacity:1}}
/* brand + chips */
.brand{display:flex;align-items:center;gap:.6rem;white-space:nowrap}
.brand b{font-size:1.35rem;font-weight:700;letter-spacing:0;color:var(--ink)}
.brand span{font-size:.78rem;color:var(--muted);border-inline-start:1px solid var(--line);padding-inline-start:.6rem;line-height:1.2}
.chip-ic{width:2.3rem;height:2.3rem;border-radius:10px;display:inline-grid;place-items:center;flex:none}
.chip-ic.sm{width:1.9rem;height:1.9rem;border-radius:8px}.chip-ic.sm .i{width:1rem;height:1rem}
.chip-ic.green{background:var(--brand1);color:var(--brand)}.chip-ic.leaf{background:var(--leaf1);color:#3F7F2B}
.chip-ic.teal{background:var(--teal1);color:var(--teal)}.chip-ic.amber{background:var(--amber1);color:var(--amberInk)}
.chip-ic.terra{background:var(--terra1);color:var(--terraInk)}.chip-ic.gray{background:var(--line2);color:var(--ink2)}
.demo-badge{display:inline-flex;align-items:center;gap:.3rem;font-size:.72rem;font-weight:600;color:var(--amberInk);background:var(--amber1);border:1px solid #F0DDB8;border-radius:999px;padding:.12rem .6rem;white-space:nowrap}
.pill{display:inline-flex;align-items:center;gap:.3rem;font-size:.75rem;font-weight:600;border-radius:999px;padding:.1rem .6rem;white-space:nowrap;line-height:1.6}
.pill.green{background:var(--brand1);color:var(--brand)}.pill.teal{background:var(--teal1);color:#2D6480}
.pill.amber{background:var(--amber1);color:var(--amberInk)}.pill.terra{background:var(--terra1);color:var(--terraInk)}
.pill.gray{background:var(--line2);color:var(--ink2)}.pill.leaf{background:var(--leaf1);color:#3F7F2B}
.pill .dt{width:.4rem;height:.4rem;border-radius:50%;background:currentColor}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;font-weight:600;font-size:.88rem;border-radius:9px;padding:.5rem 1rem;white-space:nowrap;transition:background .15s,border-color .15s,color .15s}
.btn.sm{font-size:.8rem;padding:.32rem .7rem;border-radius:8px}.btn.lg{font-size:1rem;padding:.8rem 1.5rem;border-radius:10px}
.btn-primary{background:var(--brand);color:#fff}.btn-primary:hover{background:var(--brand7)}
.btn-ghost{background:var(--surface);border:1px solid var(--line);color:var(--ink)}.btn-ghost:hover{border-color:#C9D6CD;background:var(--surface2)}
.btn-soft{background:var(--brand1);color:var(--brand)}.btn-soft:hover{background:var(--brand2)}
.btn.done{background:var(--leaf1);color:#3F7F2B;border-color:transparent;pointer-events:none}
.icon-btn{width:2.3rem;height:2.3rem;border-radius:9px;display:inline-grid;place-items:center;color:var(--ink2);position:relative}
.icon-btn:hover{background:var(--line2)}
.icon-btn .dot{position:absolute;top:.2rem;inset-inline-end:.2rem;min-width:1rem;height:1rem;border-radius:999px;background:var(--terra);color:#fff;font-size:.62rem;display:grid;place-items:center;padding:0 .25rem;font-weight:700}
.icon-btn .dot:empty,.icon-btn .dot[data-n="0"]{display:none}

/* ===== intro ===== */
.intro{position:fixed;inset:0;z-index:60;background:var(--bg);overflow:auto;display:flex;flex-direction:column;transition:opacity .35s}
.intro::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(60rem 30rem at 85% -10%,rgba(95,168,69,.10),transparent 60%),radial-gradient(40rem 26rem at 0% 110%,rgba(26,140,140,.08),transparent 60%)}
.intro.out{opacity:0;pointer-events:none}.intro[hidden]{display:none}
.intro-bar{position:relative;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem clamp(1.1rem,4vw,3rem)}
.intro-bar-end{display:flex;align-items:center;gap:.6rem}
.intro-in{position:relative;flex:1;width:100%;max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,5rem);align-items:center;padding:1.5rem clamp(1.1rem,4vw,3rem) 2rem}
.kicker{display:inline-block;font-size:.82rem;font-weight:600;color:var(--brand);background:var(--brand1);border-radius:999px;padding:.25rem .8rem;margin-bottom:1.1rem}
.intro h1{font-size:clamp(1.9rem,3.3vw,3.1rem);line-height:1.35;font-weight:700;letter-spacing:0;margin-bottom:1rem;text-wrap:balance}
.intro h1 em{font-style:normal;color:var(--brand)}
.lead{font-size:clamp(1rem,1.2vw,1.12rem);color:var(--ink2);line-height:1.85;max-width:38rem;margin-bottom:1.6rem}
.intro-actions{display:flex;gap:.75rem;flex-wrap:wrap;margin-bottom:2rem}
.values{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.values li{display:flex;flex-direction:column;gap:.6rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1rem}
.values b{display:block;font-size:.98rem}.values small{display:block;font-size:.8rem;color:var(--muted);line-height:1.6}
.intro-roles{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:1.25rem;box-shadow:var(--sh2);display:flex;flex-direction:column;gap:.7rem}
.roles-h{font-size:.85rem;font-weight:600;color:var(--muted);margin-bottom:.2rem}
.role-card{display:flex;align-items:center;gap:.85rem;text-align:start;border:1px solid var(--line);border-radius:12px;padding:.9rem;transition:border-color .15s,background .15s}
.role-card:hover{border-color:#BFD4C6;background:var(--surface2)}
.role-card div{flex:1;min-width:0}.role-card b{display:block;font-size:.98rem}.role-card small{display:block;font-size:.8rem;color:var(--muted)}
.role-card .go{color:var(--faint)}
.intro-stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line2);margin-top:.4rem;padding-top:.9rem;text-align:center}
.intro-stats b{display:block;font-size:1.3rem;color:var(--brand)}.intro-stats small{font-size:.75rem;color:var(--muted)}
.intro-foot{position:relative;text-align:center;font-size:.76rem;color:var(--faint);padding:.8rem 1rem 1.2rem}
.intro-foot b{color:var(--muted)}

/* ===== app shell ===== */
.app{display:flex;min-height:100vh}
.side{position:fixed;top:0;bottom:0;inset-inline-start:0;width:var(--side);background:var(--surface);border-inline-end:1px solid var(--line);display:flex;flex-direction:column;z-index:40}
.side-top{display:flex;align-items:center;justify-content:space-between;padding:1rem 1rem .6rem}
.side-close{display:none}
.farm-sel{display:flex;align-items:center;gap:.6rem;margin:.2rem .8rem .6rem;padding:.6rem;border:1px solid var(--line);border-radius:10px;background:var(--surface2)}
.farm-sel b{display:block;font-size:.84rem}.farm-sel small{display:block;font-size:.72rem;color:var(--muted)}
.nav{flex:1;overflow:auto;padding:.2rem .6rem 1rem}
.nav-g{font-size:.7rem;font-weight:600;color:var(--faint);padding:.9rem .6rem .3rem}
.nav-it{display:flex;align-items:center;gap:.65rem;width:100%;padding:.48rem .6rem;border-radius:8px;font-size:.88rem;color:var(--ink2);text-align:start}
.nav-it:hover{background:var(--line2)}
.nav-it.on{background:var(--brand1);color:var(--brand);font-weight:600}
.nav-it .i{color:var(--muted)}.nav-it.on .i{color:var(--brand)}
.nav-it em{margin-inline-start:auto;font-style:normal;font-size:.68rem;font-weight:600;padding:0 .45rem;border-radius:999px;background:var(--terra1);color:var(--terraInk)}
.nav-it em.ai{background:var(--teal1);color:#106B6B}
.side-foot{border-top:1px solid var(--line2);padding:.6rem}
.main{flex:1;min-width:0;margin-inline-start:var(--side);display:flex;flex-direction:column}
.top{position:sticky;top:0;z-index:30;height:3.9rem;display:flex;align-items:center;gap:1rem;padding:0 1.5rem;background:var(--surface);border-bottom:1px solid var(--line)}
.menu-btn,.top-brand{display:none}
.seg{display:inline-flex;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:.2rem;gap:.15rem}
.seg button{display:flex;align-items:center;gap:.4rem;font-size:.84rem;font-weight:600;color:var(--muted);padding:.38rem .8rem;border-radius:8px;white-space:nowrap}
.seg button:hover{color:var(--ink)}
.seg button.on{background:var(--brand);color:#fff}
.top-end{margin-inline-start:auto;display:flex;align-items:center;gap:.5rem}
.live{display:inline-flex;align-items:center;gap:.4rem;font-size:.76rem;font-weight:600;color:#3F7F2B}
.live i{width:.5rem;height:.5rem;border-radius:50%;background:var(--leaf);animation:pulse 2s infinite}
.avatar{width:2.1rem;height:2.1rem;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:700;font-size:.9rem}
.view{flex:1;padding:1.5rem;outline:none;max-width:1720px;width:100%;margin:0 auto}
.scrim{display:none}

/* page head */
.ph{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1.2rem;flex-wrap:wrap}
.ph h2{font-size:1.45rem;font-weight:700;line-height:1.35}
.ph p{font-size:.88rem;color:var(--muted)}
.ph-act{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.crumb{font-size:.76rem;color:var(--faint);margin-bottom:.15rem}

/* grid + cards */
.g{display:grid;gap:1rem}
.g-kpi{grid-template-columns:repeat(5,minmax(0,1fr))}
.g-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g-21{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
.g-12{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
.g-32{grid-template-columns:minmax(0,3fr) minmax(0,2fr)}
.mt{margin-top:1rem}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);min-width:0;animation:up .35s ease both}
.card-h{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.9rem 1.1rem .2rem;flex-wrap:wrap}
.card-h h3{font-size:.98rem;font-weight:700;display:flex;align-items:center;gap:.5rem}
.card-h small{font-size:.76rem;color:var(--muted);font-weight:400}
.card-b{padding:.8rem 1.1rem 1.1rem}
.card-b.flush{padding:.5rem 0 .4rem}
.src{font-size:.72rem;color:var(--faint);display:flex;align-items:center;gap:.35rem}
/* kpi */
.kpi{padding:1rem 1.1rem;display:flex;flex-direction:column;gap:.5rem}
.kpi-top{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.kpi-l{font-size:.8rem;color:var(--muted);font-weight:600}
.kpi-v{font-size:1.65rem;font-weight:700;line-height:1.2;white-space:nowrap}
.kpi-v small{font-size:.8rem;font-weight:600;color:var(--muted);margin-inline-start:.25rem}
.kpi-f{display:flex;align-items:center;gap:.4rem;font-size:.76rem;color:var(--muted);flex-wrap:wrap}
.delta{display:inline-flex;align-items:center;font-weight:700;font-size:.76rem;border-radius:6px;padding:0 .35rem}
.delta.good{color:#2F7A3E;background:var(--leaf1)}.delta.bad{color:var(--terraInk);background:var(--terra1)}
.delta .i{width:.85rem;height:.85rem;stroke-width:2.2}
.flash{animation:flash 1.4s ease}
/* tables */
.tbl-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:.85rem}
th{font-size:.74rem;font-weight:600;color:var(--muted);text-align:start;padding:.55rem 1.1rem;border-bottom:1px solid var(--line);white-space:nowrap;background:var(--surface2)}
td{padding:.65rem 1.1rem;border-bottom:1px solid var(--line2);white-space:nowrap}
tr:last-child td{border-bottom:0}
tbody tr:hover td{background:#FCFBF8}
td b{font-weight:600}
td small{display:block;font-size:.72rem;color:var(--muted)}
/* lists */
.list{display:flex;flex-direction:column}
.li{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem 1.1rem;border-bottom:1px solid var(--line2)}
.li:last-child{border-bottom:0}
.li-b{flex:1;min-width:0}
.li-b b{display:block;font-size:.88rem;font-weight:600;line-height:1.5}
.li-b p{font-size:.8rem;color:var(--muted);line-height:1.6}
.li-e{display:flex;flex-direction:column;align-items:flex-end;gap:.3rem;flex:none}
.li-t{font-size:.72rem;color:var(--faint);white-space:nowrap}
.li.new{animation:flash 2s ease}
/* bars */
.bar{height:.42rem;background:var(--line2);border-radius:999px;overflow:hidden}
.bar i{display:block;height:100%;border-radius:999px;background:var(--leaf)}
/* chart */
.chart{width:100%;height:auto;display:block;overflow:visible;direction:ltr}
.chart text{font-family:Plex,Tahoma,sans-serif;font-size:11px;fill:var(--muted)}
.legend{display:flex;gap:1rem;flex-wrap:wrap;font-size:.76rem;color:var(--muted)}
.legend span{display:inline-flex;align-items:center;gap:.35rem}
.legend i{width:.7rem;height:.7rem;border-radius:3px;display:inline-block}
.legend i.ln{height:.18rem;border-radius:2px}

/* ===== map ===== */
.map-wrap{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:1rem;align-items:start}
.map-card{overflow:hidden}
.map-tools{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.8rem 1rem;border-bottom:1px solid var(--line2);flex-wrap:wrap}
.map-svg{display:block;width:100%;height:auto;background:#F1EEE4}
.plot{cursor:pointer;transition:opacity .2s,filter .2s}
.plot:hover{filter:brightness(1.05)}
.plot.sel .pshape{stroke:#1C2620;stroke-width:3}
.plot text{font-family:Plex,Tahoma,sans-serif;pointer-events:none}
.map-leg{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;padding:.7rem 1rem;font-size:.75rem;color:var(--muted);border-top:1px solid var(--line2)}
.map-leg span{display:inline-flex;align-items:center;gap:.35rem}
.map-leg i{width:.8rem;height:.8rem;border-radius:3px}
.fpanel{position:sticky;top:5rem}
.fp-head{display:flex;align-items:center;gap:.75rem;padding:1rem 1.1rem;border-bottom:1px solid var(--line2)}
.fp-head h3{font-size:1.1rem}
.fp-head p{font-size:.8rem;color:var(--muted)}
.kv{display:grid;grid-template-columns:1fr 1fr;gap:.1rem 1rem;padding:.8rem 1.1rem}
.kv div{padding:.45rem 0;border-bottom:1px dashed var(--line2)}
.kv dt{font-size:.72rem;color:var(--muted)}.kv dd{font-size:.88rem;font-weight:600}
.fp-sec{padding:.4rem 1.1rem .9rem}
.fp-sec h4{font-size:.78rem;color:var(--muted);font-weight:600;margin-bottom:.4rem}
.tags{display:flex;flex-wrap:wrap;gap:.35rem}
.fp-act{display:flex;gap:.5rem;padding:0 1.1rem 1.1rem;flex-wrap:wrap}
.mini-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
/* sensor tiles */
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.tile{padding:.9rem 1rem;display:flex;flex-direction:column;gap:.35rem;position:relative}
.tile-h{display:flex;align-items:center;gap:.5rem;font-size:.78rem;color:var(--muted);font-weight:600}
.tile-v{font-size:1.55rem;font-weight:700;line-height:1.2;transition:color .3s}
.tile-v small{font-size:.78rem;color:var(--muted);font-weight:600;margin-inline-start:.2rem}
.tile-v.tick{color:var(--teal)}
.spark{width:100%;height:28px;display:block}
.rec{display:flex;gap:.8rem;padding:.85rem 1.1rem;border-bottom:1px solid var(--line2);align-items:flex-start}
.rec:last-child{border-bottom:0}
.rec .li-b b{font-size:.9rem}
.save{font-size:.76rem;font-weight:700;color:#2D6480;background:var(--teal1);border-radius:6px;padding:.05rem .45rem;white-space:nowrap}
/* kanban */
.kan{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;align-items:start}
.col{background:#EFECE3;border-radius:12px;padding:.6rem;min-width:0}
.col-h{display:flex;align-items:center;justify-content:space-between;padding:.2rem .4rem .6rem;font-size:.85rem;font-weight:700}
.col-h span{font-size:.72rem;color:var(--muted);background:var(--surface);border-radius:999px;padding:0 .5rem}
.tcard{display:block;width:100%;text-align:start;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:.7rem .75rem;margin-bottom:.55rem;transition:border-color .15s,transform .15s;animation:up .3s ease both}
.tcard:hover{border-color:#BFD4C6}
.tcard b{display:block;font-size:.86rem;font-weight:600;line-height:1.5;margin:.35rem 0}
.tmeta{display:flex;align-items:center;justify-content:space-between;gap:.4rem;font-size:.74rem;color:var(--muted)}
.who{display:inline-flex;align-items:center;gap:.35rem}
.ava{width:1.45rem;height:1.45rem;border-radius:50%;display:inline-grid;place-items:center;font-size:.68rem;font-weight:700;color:#fff;flex:none}
.tnext{display:flex;align-items:center;gap:.25rem;font-size:.72rem;color:var(--brand);font-weight:600;margin-top:.45rem;border-top:1px dashed var(--line2);padding-top:.4rem}
.week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.5rem}
.day{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:.55rem;min-height:9rem;min-width:0}
.day h5{font-size:.78rem;color:var(--muted);margin-bottom:.4rem;display:flex;justify-content:space-between}
.day.today{border-color:var(--brand);box-shadow:inset 0 3px 0 var(--brand)}
.ev{font-size:.72rem;border-radius:6px;padding:.25rem .4rem;margin-bottom:.3rem;line-height:1.45;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* AI */
.ai-wrap{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:1rem;align-items:start}
.chat{display:flex;flex-direction:column;height:min(70vh,640px);min-height:460px}
.chat-log{flex:1;overflow:auto;padding:1rem 1.1rem;display:flex;flex-direction:column;gap:.8rem;background:var(--surface2);border-top:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.msg{max-width:88%;font-size:.88rem;line-height:1.75;border-radius:12px;padding:.65rem .85rem;animation:up .3s ease both}
.msg.me{align-self:flex-start;background:var(--brand);color:#fff;border-end-start-radius:4px}
.msg.bot{align-self:flex-end;background:var(--surface);border:1px solid var(--line);border-end-end-radius:4px}
.msg.bot .msrc{display:flex;align-items:center;gap:.3rem;font-size:.7rem;color:var(--faint);margin-top:.5rem;padding-top:.4rem;border-top:1px dashed var(--line2)}
.msg table{margin:.4rem 0;font-size:.8rem}.msg td,.msg th{padding:.3rem .5rem}
.msg ul{padding-inline-start:1.1rem;margin:.2rem 0}
.typing{display:inline-flex;gap:.25rem}.typing i{width:.4rem;height:.4rem;border-radius:50%;background:var(--muted);animation:blink 1.2s infinite}
.typing i:nth-child(2){animation-delay:.2s}.typing i:nth-child(3){animation-delay:.4s}
.qs{display:flex;gap:.4rem;flex-wrap:wrap;padding:.7rem 1.1rem 0}
.q{font-size:.8rem;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:.28rem .75rem;color:var(--ink2);white-space:nowrap}
.q:hover{border-color:var(--brand);color:var(--brand)}
.chat-in{display:flex;gap:.5rem;padding:.75rem 1.1rem}
.chat-in input{flex:1;min-width:0;border:1px solid var(--line);border-radius:9px;padding:.55rem .8rem;background:var(--surface)}
.drop{border:1.5px dashed #C9D3CB;border-radius:12px;padding:1.2rem;text-align:center;display:flex;flex-direction:column;align-items:center;gap:.5rem;background:var(--surface2)}
.drop p{font-size:.82rem;color:var(--muted)}
.diag{display:grid;grid-template-columns:7.5rem 1fr;gap:1rem;align-items:start}
.diag img,.leafph{width:7.5rem;height:7.5rem;object-fit:cover;border-radius:10px;border:1px solid var(--line)}
.leafph{background:linear-gradient(135deg,#6E9E4A,#3E6E2E);display:grid;place-items:center;color:#E9F3DF}
.leafph .i{width:2.4rem;height:2.4rem;stroke-width:1.3}
.conf{display:flex;align-items:center;gap:.6rem;font-size:.8rem}
.conf .bar{flex:1}
.scan-line{height:.3rem;border-radius:999px;background:linear-gradient(90deg,var(--teal) 0,var(--leaf) 50%,var(--teal) 100%);background-size:200% 100%;animation:sl 1s linear infinite}
@keyframes sl{to{background-position:-200% 0}}
/* integrations */
.int{padding:1.1rem;display:flex;flex-direction:column;gap:.6rem}
.int b{font-size:.95rem}.int p{font-size:.8rem;color:var(--muted);line-height:1.65;flex:1}
.int-top{display:flex;align-items:center;justify-content:space-between}
/* contact */
.contact{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:1rem;align-items:stretch}
.bcard{padding:1.6rem;display:flex;flex-direction:column;gap:1rem;background:linear-gradient(160deg,#fff 55%,#F1F7F3)}
.bcard h3{font-size:1.4rem}.bcard .role{color:var(--brand);font-weight:600}
.bline{display:flex;align-items:center;gap:.6rem;font-size:.92rem}
.qr-box{width:9rem;padding:.6rem;border:1px solid var(--line);border-radius:12px;background:#fff;text-align:center}
.qr-svg{width:100%;height:auto;display:block}
.qr-cap{font-size:.72rem;color:var(--muted);margin-top:.3rem}
.steps{list-style:none;counter-reset:s;display:flex;flex-direction:column;gap:.8rem}
.steps li{display:flex;gap:.75rem;align-items:flex-start;font-size:.88rem}
.steps li::before{counter-increment:s;content:counter(s);width:1.6rem;height:1.6rem;border-radius:50%;background:var(--brand1);color:var(--brand);font-weight:700;display:grid;place-items:center;flex:none;font-size:.8rem}
/* supervisor phone */
.sup-wrap{display:grid;grid-template-columns:400px minmax(0,1fr);gap:1.5rem;align-items:start}
.phone{background:#1C2620;border-radius:36px;padding:.7rem;box-shadow:var(--sh2)}
.phone-in{background:var(--bg);border-radius:28px;overflow:hidden;min-height:720px;display:flex;flex-direction:column}
.p-top{background:var(--brand);color:#fff;padding:1.1rem 1rem 1rem}
.p-top small{opacity:.8;font-size:.76rem}.p-top b{display:block;font-size:1.1rem}
.p-body{padding:.9rem;display:flex;flex-direction:column;gap:.75rem}
.checkin{display:flex;align-items:center;gap:.75rem;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:.8rem}
.checkin .li-b b{font-size:.88rem}
.ptask{display:flex;align-items:flex-start;gap:.7rem;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:.75rem;text-align:start;width:100%}
.ptask .box{width:1.35rem;height:1.35rem;border-radius:6px;border:1.5px solid #B8C4BC;display:grid;place-items:center;flex:none;margin-top:.1rem;color:#fff}
.ptask.ok .box{background:var(--leaf);border-color:var(--leaf)}
.ptask.ok b{text-decoration:line-through;color:var(--muted)}
.ptask b{display:block;font-size:.86rem;font-weight:600}.ptask small{font-size:.74rem;color:var(--muted)}
.p-sec{font-size:.78rem;font-weight:700;color:var(--muted);display:flex;justify-content:space-between}
.field{display:flex;flex-direction:column;gap:.3rem;font-size:.8rem}
.field select,.field textarea,.field input{border:1px solid var(--line);border-radius:9px;padding:.5rem .7rem;background:var(--surface);width:100%}
.photo-pick{display:flex;align-items:center;gap:.6rem;border:1.5px dashed #C9D3CB;border-radius:10px;padding:.6rem;font-size:.8rem;color:var(--muted);cursor:pointer;background:var(--surface)}
.photo-pick img{width:3rem;height:3rem;border-radius:8px;object-fit:cover}
/* toasts / notif / modal */
.toasts{position:fixed;bottom:1.2rem;left:50%;transform:translateX(-50%);z-index:90;display:flex;flex-direction:column;gap:.5rem;align-items:center;pointer-events:none;width:min(92vw,460px)}
.toast{display:flex;align-items:center;gap:.6rem;background:#1C2620;color:#fff;font-size:.86rem;border-radius:10px;padding:.65rem 1rem;box-shadow:var(--sh2);animation:up .25s ease both;max-width:100%}
.toast .i{color:#9FD27F}
.notif{position:fixed;top:4.3rem;inset-inline-end:1.2rem;z-index:80;width:min(92vw,380px);background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh2);animation:up .2s ease both;max-height:70vh;overflow:auto}
.notif[hidden]{display:none}
.modal{position:fixed;inset:0;z-index:95;background:rgba(28,38,32,.45);display:grid;place-items:center;padding:1rem}
.modal[hidden]{display:none}
.modal-card{background:var(--surface);border-radius:14px;width:min(560px,100%);max-height:90vh;overflow:auto;box-shadow:var(--sh2);animation:up .25s ease both}
.inv-doc{padding:1.4rem}
.inv-doc h3{font-size:1.1rem}
.inv-row{display:flex;justify-content:space-between;font-size:.86rem;padding:.4rem 0;border-bottom:1px dashed var(--line2)}
.inv-qr{width:6.5rem;flex:none}
.alert-banner{display:flex;align-items:center;gap:.8rem;background:var(--terra1);border:1px solid #EDCDBE;border-radius:12px;padding:.8rem 1rem;margin-bottom:1rem;animation:up .35s ease both}
.alert-banner .li-b b{color:var(--terraInk)}
.ai-strip{display:flex;align-items:center;gap:.9rem;background:linear-gradient(90deg,#E5F2EF,#EEF6E8);border:1px solid #CFE4DC;border-radius:12px;padding:.9rem 1.1rem}
.ai-strip .li-b b{font-size:.92rem}
.hint{font-size:.76rem;color:var(--muted)}
.empty{font-size:.84rem;color:var(--muted);padding:1rem 1.1rem}
.mob-only{display:none}

.g-5m{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.6rem}
.modchip{display:flex;align-items:center;gap:.55rem;border:1px solid var(--line);border-radius:10px;padding:.55rem .65rem;font-size:.84rem;background:var(--surface2)}
.modchip b{font-weight:600}
.mini-map .map-svg{border-radius:10px}
/* ===== responsive ===== */
@media(max-width:1500px){.g-kpi{grid-template-columns:repeat(5,minmax(0,1fr))}.kpi-v{font-size:1.45rem}.map-wrap{grid-template-columns:minmax(0,1fr) 330px}}
@media(max-width:1280px){
 .g-kpi{grid-template-columns:repeat(3,minmax(0,1fr))}
 .tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
 .roles button span{display:none}.roles button.on span{display:inline}
 .live{display:none}
 .sup-wrap{grid-template-columns:380px minmax(0,1fr)}
}
@media(max-width:1100px){
 .g-5m{grid-template-columns:repeat(3,minmax(0,1fr))}
 :root{--side:0px}
 .side{transform:translateX(100%);transition:transform .25s;width:280px;box-shadow:var(--sh2)}
 [dir=rtl] .side{transform:translateX(100%)}
 .side.open{transform:none}
 .side-close{display:inline-grid}
 .scrim.open{display:block;position:fixed;inset:0;background:rgba(28,38,32,.35);z-index:35}
 .menu-btn,.top-brand{display:inline-flex}
 .top-brand .mark{width:1.7rem;height:1.7rem}.top-brand b{font-size:1.15rem}
 .g-21,.g-12,.g-32,.ai-wrap,.map-wrap,.contact{grid-template-columns:minmax(0,1fr)}
 .fpanel{position:static}
 .kan{grid-template-columns:repeat(2,minmax(0,1fr))}
 .sup-wrap{grid-template-columns:minmax(0,1fr)}
 .intro-in{grid-template-columns:1fr}
}
@media(max-width:760px){
 html{font-size:15px}
 .top{padding:0 .75rem;gap:.4rem;height:3.5rem}
 .top .roles{display:none}
 .top-end{gap:.15rem}
 .top-end .demo-badge{font-size:.66rem;padding:.08rem .45rem}
 .avatar{display:none}
 .mob-roles{display:flex;margin:-.3rem 0 1rem;width:100%}
 .mob-roles button{flex:1;justify-content:center;padding:.45rem .3rem;font-size:.78rem}
 .mob-roles button span{display:inline!important}
 .mob-roles button .i{display:none}
 .view{padding:1rem .85rem 2rem}
 .ph h2{font-size:1.25rem}
 .g-kpi{grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
 .g-kpi .kpi:first-child{grid-column:1/-1}
 .g-4,.g-3,.g-2{grid-template-columns:minmax(0,1fr)}
 .g-5m{grid-template-columns:repeat(2,minmax(0,1fr))}
 .g-4.keep2,.g-3.keep2{grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
 .tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
 .kpi{padding:.8rem .85rem}.kpi-v{font-size:1.3rem}
 .tile{padding:.75rem .8rem}.tile-v{font-size:1.25rem}
 .kan{grid-template-columns:minmax(0,1fr)}
 .week{grid-template-columns:repeat(7,minmax(7.5rem,1fr));overflow-x:auto;padding-bottom:.4rem}
 .values{grid-template-columns:1fr}
 .values li{flex-direction:row;align-items:center}
 .intro h1 br{display:none}
 .intro-bar .btn{display:none}
 .brand span{font-size:.7rem}
 .card-h{padding:.8rem .9rem .2rem}.card-b{padding:.7rem .9rem .9rem}
 th,td{padding:.55rem .75rem}
 .li,.rec{padding:.7rem .9rem}
 .rec{flex-wrap:wrap}.rec .li-b{min-width:calc(100% - 3.2rem)}.rec>.btn{margin-inline-start:auto}
 .kv{grid-template-columns:1fr 1fr}
 .phone{background:none;padding:0;box-shadow:none;border-radius:0}
 .phone-in{border-radius:14px;min-height:0;border:1px solid var(--line)}
 .chat{height:auto;min-height:0}.chat-log{max-height:56vh;min-height:300px}
 .msg{max-width:94%}
 .chart text{font-size:10px}
 .diag{grid-template-columns:5.5rem 1fr}.diag img,.leafph{width:5.5rem;height:5.5rem}
 .hide-m{display:none}
 .mob-only{display:block}
 td small.mob-only,td .mob-only{display:inline}
 table.stack thead{display:none}
 table.stack tr{display:flex;flex-wrap:wrap;align-items:center;gap:.2rem .9rem;padding:.7rem .9rem;border-bottom:1px solid var(--line2)}
 table.stack td{border:0;padding:0;white-space:normal;font-size:.8rem;color:var(--ink2)}
 table.stack td:first-child{flex-basis:100%;font-size:.88rem;color:var(--ink)}
 table.stack td:last-child{margin-inline-start:auto}
 table.stack td small{display:inline;margin-inline-start:.3rem}
 table.stack tbody tr:hover td{background:none}
 .map-tools .seg{width:100%}.map-tools .seg button{flex:1;justify-content:center;padding:.4rem .3rem;font-size:.76rem}.map-tools .seg .i{display:none}
 .map-tools .hint{display:none}
 .map-leg{gap:.4rem .8rem;font-size:.7rem}
 table.stack td.hide-m{display:none}
 .toasts{bottom:.9rem}
 .notif{top:3.8rem;inset-inline-end:.5rem}
 .bcard{padding:1.2rem}
}
@media(min-width:761px){.mob-roles{display:none}}


/* =====================================================================
   v9 — restrained product design system
   8px grid · solid surfaces · one brand green · water blue for data · amber/red for status only
   ===================================================================== */
:root{--r:8px;--sh:0 1px 2px rgba(16,24,20,.05);--sh2:0 8px 24px rgba(16,24,20,.10);--water:#2D7395;--water1:#E8F1F5;--ease:cubic-bezier(.2,.7,.2,1)}
body{background:var(--bg)}
.view{animation:viewIn .18s ease-out both}
@keyframes viewIn{from{opacity:0}to{opacity:1}}
.card,.tcard,.msg,.alert-banner,.li.new,.toast,.notif,.modal-card{animation:none}
.flash{animation:none}
.card{border-radius:var(--r);box-shadow:var(--sh);border-color:var(--line)}
.btn{border-radius:6px;transition:background .15s,border-color .15s,color .15s}
.btn.sm{border-radius:6px}.btn.lg{border-radius:6px;font-size:.95rem;padding:.72rem 1.4rem}
.btn-soft{background:var(--surface);border:1px solid var(--line);color:var(--ink2)}.btn-soft:hover{border-color:#C7CEC9;background:var(--surface2)}
.pill{border-radius:4px;font-weight:600;padding:.05rem .5rem}
.demo-badge{border-radius:4px;font-weight:600}
.chip-ic{background:var(--surface2)!important;border:1px solid var(--line2);color:var(--muted)!important;border-radius:6px}
.chip-ic.terra{color:var(--terraInk)!important}.chip-ic.amber{color:var(--amberInk)!important}.chip-ic.teal{color:var(--water)!important}.chip-ic.green,.chip-ic.leaf{color:var(--brand)!important}
.live i{animation:none}
th{background:var(--surface2);font-size:.72rem;letter-spacing:0}
tbody tr:hover td{background:var(--surface2)}
.seg{border-radius:6px}.seg button{border-radius:4px}
.seg button.on{background:var(--brand);color:#fff}
.icon-btn,.avatar{border-radius:6px}
.avatar{background:var(--ink2)}
.top{background:var(--surface);backdrop-filter:none}
[data-home]{cursor:pointer}

/* ---------- KPI tiles: data first ---------- */
.kpi{padding:16px 16px 14px;gap:4px}
.kpi-top{min-height:0}
.kpi-top .chip-ic{display:none}
.kpi-l{font-size:.8rem;font-weight:500;color:var(--muted)}
.kpi-v{font-size:1.75rem;font-weight:600;letter-spacing:-.01em;margin-top:4px}
.kpi-v small{font-size:.82rem;font-weight:500;color:var(--muted)}
.kpi-f{font-size:.76rem;margin-top:4px;color:var(--muted)}
.delta{background:none!important;padding:0;border-radius:0;font-weight:600;gap:2px}
.delta.good{color:#2E7340}.delta.bad{color:#A8432A}
.delta .i{display:none}
.delta::before{font-size:.6rem;line-height:1}
.delta.up::before{content:"▲"}.delta.down::before{content:"▼"}
.kpi-f .pill{font-size:.72rem}
.tile{padding:16px}
.tile-h{font-weight:500;font-size:.8rem}
.tile-h .chip-ic{display:none}
.tile-v{font-weight:600;font-size:1.6rem}
.tile-v.tick{color:inherit}
.spark{height:32px;opacity:.9}

/* card header: plain titles */
.card-h{padding:16px 16px 4px}
.card-h h3{font-size:.95rem;font-weight:600}
.card-h h3 .chip-ic{display:none}
.card-b{padding:12px 16px 16px}
.legend i{border-radius:2px}
.chart text{font-size:11px;fill:#6B756F}
.chart .axis-u{font-size:10.5px;fill:#8D978F}

/* lists */
.li{padding:12px 16px}
.li>.chip-ic{width:2rem;height:2rem}

/* ---------- landing ---------- */
.intro{background:#0E1A14;color:#fff;isolation:isolate}
.intro::before{display:none}
.hero-media{position:fixed;inset:0;z-index:-1;overflow:hidden;background:#13241B}
.hero-poster{position:absolute;inset:0;background:url(media/hero.jpg) center/cover no-repeat}
.hero-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s ease}
.hero-vid.ready{opacity:1}
.hero-shade{position:absolute;inset:0;background:linear-gradient(270deg,rgba(8,16,12,.86) 0%,rgba(8,16,12,.72) 30%,rgba(8,16,12,.28) 58%,rgba(8,16,12,.08) 100%),linear-gradient(180deg,rgba(8,16,12,.62) 0,rgba(8,16,12,0) 110px),linear-gradient(0deg,rgba(8,16,12,.55) 0%,rgba(8,16,12,0) 22%)}
.intro-bar{padding:24px clamp(16px,4vw,48px);border-bottom:1px solid rgba(255,255,255,.12)}
.intro .brand b{color:#fff}.intro .brand span{color:rgba(255,255,255,.7);border-color:rgba(255,255,255,.25)}
.intro .demo-badge{background:rgba(8,16,12,.35);color:#F3DDAE;border-color:rgba(243,221,174,.6)}
.intro .btn-ghost{background:transparent;border:1px solid rgba(255,255,255,.4);color:#fff}
.intro .btn-ghost:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.7)}
.intro-in{max-width:1280px;grid-template-columns:minmax(0,1fr) 400px;gap:clamp(32px,6vw,96px);padding:48px clamp(16px,4vw,48px) 40px}
.intro .kicker{background:none;border:0;padding:0;color:rgba(255,255,255,.72);font-size:.85rem;font-weight:500;margin-bottom:16px;display:flex;align-items:center;gap:12px}
.intro .kicker::before{content:"";width:24px;height:2px;background:#7DB88F;flex:none}
.intro h1{color:#fff;font-size:clamp(2rem,3.4vw,3.25rem);line-height:1.3;font-weight:700;margin-bottom:16px;max-width:15em}
.intro h1 em{color:#fff;font-weight:600;opacity:.92}
.intro .lead{color:rgba(255,255,255,.82);font-size:1.05rem;max-width:34rem;margin-bottom:32px}
.intro-actions{gap:12px;margin-bottom:48px}
.intro .btn-primary{background:#fff;color:var(--ink)}
.intro .btn-primary:hover{background:#E9EDEA}
.intro .btn-primary .i{transform:scaleX(-1)}
.values{gap:0;border-top:1px solid rgba(255,255,255,.18);max-width:44rem}
.values li{background:none;border:0;border-radius:0;padding:16px 0 0;gap:8px;flex-direction:column}
.values li+li{padding-inline-start:24px;border-inline-start:1px solid rgba(255,255,255,.14);margin-inline-start:0}
.values li:not(:last-child){padding-inline-end:24px}
.intro .values .chip-ic{background:none!important;border:0;color:#9CCBAA!important;width:auto;height:auto;justify-content:start}
.values b{color:#fff;font-size:.95rem;font-weight:600}.values small{color:rgba(255,255,255,.7);font-size:.8rem}
.intro-roles{background:#fff;color:var(--ink);border:0;border-radius:10px;box-shadow:0 24px 48px rgba(0,0,0,.28);padding:24px;gap:0}
.roles-h{font-size:1rem;font-weight:600;color:var(--ink);margin-bottom:4px}
.roles-sub{font-size:.8rem;color:var(--muted);margin-bottom:16px}
.role-card{border:1px solid var(--line);border-radius:8px;padding:12px 14px;margin-bottom:8px;background:#fff;transition:border-color .15s,background .15s}
.role-card:hover{border-color:var(--brand);background:#F7FAF8}
.role-card .chip-ic{display:none}
.role-card b{font-size:.92rem;font-weight:600;color:var(--ink)}.role-card small{font-size:.78rem;color:var(--muted)}
.role-card .go{color:var(--faint);transform:scaleX(-1)}
.role-card:hover .go{color:var(--brand)}
.hero-live{margin-top:12px;border-top:1px solid var(--line2);padding-top:16px}
.hl-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.hl-h span{font-size:.8rem;font-weight:600;color:var(--ink2)}
.hl-h small{font-size:.72rem;color:var(--faint)}
.hl-row{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.hl{text-align:start;padding-inline-end:12px}.hl+.hl{border-inline-start:1px solid var(--line2);padding-inline-start:12px}
.hl small{display:block;font-size:.72rem;color:var(--muted)}
.hl b{display:block;direction:ltr;text-align:right;font-size:1.2rem;font-weight:600;color:var(--ink);line-height:1.4}
.hl b em{font-style:normal;font-size:.72rem;font-weight:500;color:var(--muted);margin-left:3px}
.intro-stats{margin-top:16px;padding-top:16px;border-top:1px solid var(--line2);text-align:start}
.intro-stats div+div{border-inline-start:1px solid var(--line2);padding-inline-start:12px}
.intro-stats b{color:var(--ink);font-size:1.1rem;font-weight:600}.intro-stats small{color:var(--muted)}
.intro-foot{color:rgba(255,255,255,.6);font-size:.75rem;padding:16px;border-top:1px solid rgba(255,255,255,.1)}.intro-foot b{color:rgba(255,255,255,.85);font-weight:600}

/* ---------- app shell ---------- */
.side{background:var(--surface);border-inline-end:1px solid var(--line)}
.farm-sel{border-radius:8px;background:var(--surface);gap:10px}
.farm-thumb{width:2.25rem;height:2.25rem;border-radius:6px;background:url(media/hero.jpg) center/cover;flex:none}
.nav-g{font-size:.7rem;font-weight:600;color:var(--faint);padding:16px 10px 4px}
.nav-it{border-radius:6px;padding:7px 10px;position:relative}
.nav-it.on{background:var(--brand1);color:var(--brand7)}
.nav-it.on::before{content:"";position:absolute;inset-inline-start:-.6rem;top:6px;bottom:6px;width:3px;border-radius:0 2px 2px 0;background:var(--brand)}
.nav-it em{border-radius:4px;background:#F6E3DC;color:var(--terraInk)}
.ph{margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.ph h2{font-size:1.4rem;font-weight:600}
.ph p{font-size:.86rem}
.crumb{font-size:.75rem;color:var(--muted);margin-bottom:4px}
.g{gap:16px}.mt{margin-top:16px}
.ai-strip{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:16px}
.alert-banner{border-radius:var(--r);background:#FBF1EC;border-color:#EBCFC2}
.bcard{background:var(--surface)}
.leafph{background:#E6ECE7;color:var(--brand)}
.col{background:#ECEEEC;border-radius:8px}
.tcard{border-radius:6px}
.day{border-radius:6px}.day.today{box-shadow:inset 0 2px 0 var(--brand)}
.msg{border-radius:8px}
.q{border-radius:6px}
.toast{border-radius:6px}
.modal-card{border-radius:10px}
.notif{border-radius:8px}
.scan-line{background:var(--line2);position:relative;overflow:hidden;animation:none}
.scan-line::after{content:"";position:absolute;top:0;bottom:0;width:30%;background:var(--brand);border-radius:999px;animation:scan 1.1s ease-in-out infinite}
@keyframes scan{from{inset-inline-start:-30%}to{inset-inline-start:100%}}
.phone{border-radius:32px}.phone-in{border-radius:24px}
.p-top{background:var(--brand7)}
.steps li::before{border-radius:4px}

/* map + stats */
.map-svg{background:#EEF0EC}
.stack-bar{display:flex;height:12px;border-radius:2px;overflow:hidden;gap:2px;margin:8px 0 4px}
.stack-bar i{display:block;height:100%}
.fig{display:flex;align-items:baseline;gap:6px}
.fig b{font-size:1.75rem;font-weight:600;font-variant-numeric:tabular-nums}
.fig small{font-size:.82rem;color:var(--muted)}

@media(hover:hover){.card.kpi:hover,.card.tile:hover{border-color:#CDD3CF}}

/* ---------- responsive ---------- */
@media(max-width:1100px){
 .intro-in{grid-template-columns:minmax(0,1fr);gap:32px;padding-top:32px}
 .intro-roles{max-width:560px}
 .hero-shade{background:linear-gradient(180deg,rgba(8,16,12,.62) 0%,rgba(8,16,12,.70) 45%,rgba(8,16,12,.88) 100%)}
}
@media(max-width:760px){
 .intro-bar{padding:16px}
 .intro-in{padding:24px 16px 24px}
 .intro h1{font-size:1.9rem}
 .intro .lead{font-size:.98rem;margin-bottom:24px}
 .intro-actions{margin-bottom:32px}
 .intro-actions .btn{flex:1}
 .values{grid-template-columns:1fr}
 .values li,.values li+li{flex-direction:row;align-items:flex-start;padding:12px 0;border-inline-start:0;border-bottom:1px solid rgba(255,255,255,.12)}
 .values li:not(:last-child){padding-inline-end:0}
 .values li:last-child{border-bottom:0}
 .intro-roles{padding:16px}
 .hl b{font-size:1.05rem}
 .kpi{padding:12px}.kpi-v{font-size:1.35rem}
 .ph{margin-bottom:16px;padding-bottom:12px}
 .g-kpi{gap:8px}
 .tile{padding:12px}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important;transition-duration:.01ms!important}
 .hero-vid{display:none}
}

/* =====================================================================
   v10 — palm module (same v9 system: solid cards, 1px lines, brand green)
   ===================================================================== */
.palm-top{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:16px;align-items:stretch}
.palm-ov{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);overflow:hidden}
.palm-ov-img{position:relative;min-height:220px;background:#DCE3DE;border-inline-end:1px solid var(--line)}
.palm-ov-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.palm-ov-b{padding:16px}
.palm-ov-b .card-h h3{font-size:1rem}
.palm-ov .kv{grid-template-columns:1fr 1fr}
.palm-ov .tags .pill b{font-weight:600;margin-inline-start:2px}
.palm-kpis{gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}
.palm-kpis .kpi-v{font-size:1.55rem}
.palm-tabs{display:inline-flex;flex-wrap:wrap}
.mbar{display:flex;align-items:center;gap:8px;min-width:120px}
.mbar .bar{flex:1;height:.4rem;min-width:56px}
.mbar b{min-width:2.4rem;font-weight:600}
tr.tot td{background:var(--surface2);border-top:1px solid var(--line)}
.sw{display:inline-block;width:.6rem;height:.6rem;border-radius:2px;margin-inline-end:6px;vertical-align:middle}
.gbar{display:flex;gap:0}
.gbar i{display:block;height:100%;border-radius:0}
.pstats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.pstats>div{padding:2px 16px;border-inline-start:1px solid var(--line2)}
.pstats>div:first-child{border-inline-start:0;padding-inline-start:0}
.pstats .kpi-v{font-size:1.5rem}
.pstats .kpi-f{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
/* gantt */
.gantt{min-width:760px}
.gt-row{display:grid;grid-template-columns:200px repeat(12,minmax(0,1fr));align-items:stretch;border-bottom:1px solid var(--line2)}
.gt-row:last-child{border-bottom:0}
.gt-l{grid-column:1;grid-row:1;padding:10px 12px 10px 8px;font-size:.84rem;line-height:1.4}
.gt-l b{display:block;font-weight:600}
.gt-l small{display:block;font-size:.72rem;color:var(--muted)}
.gt-head .gt-l,.gt-m{font-size:.72rem;color:var(--muted);font-weight:600;padding:8px 2px;text-align:center}
.gt-head .gt-l{text-align:start;padding-inline-start:0}
.gt-m{grid-row:1}
.gt-m.now{color:var(--brand)}
.gt-c{grid-row:1;border-inline-start:1px solid var(--line2)}
.gt-c.now,.gt-m.now{background:#F1F6F2}
.gt-bar{grid-row:1;align-self:center;height:22px;margin:0 3px;border-radius:4px;font-size:.7rem;font-weight:600;display:flex;align-items:center;justify-content:center;white-space:nowrap;overflow:hidden;position:relative;z-index:1}
.gt-bar.done{background:#CFE0D3;color:#2B5A3A;border:1px solid #B5CFBB}
.gt-bar.doing{background:var(--brand);color:#fff}
.gt-bar.todo{background:#fff;color:var(--muted);border:1px solid #C7CEC9}
@media(max-width:1500px){.palm-top{grid-template-columns:1fr}.palm-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1100px){.palm-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.pstats{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:16px}.pstats>div:nth-child(3){border-inline-start:0;padding-inline-start:0}}
@media(max-width:760px){
 .palm-ov{grid-template-columns:1fr}
 .palm-ov-img{min-height:170px;border-inline-end:0;border-bottom:1px solid var(--line)}
 .palm-kpis{gap:12px}
 .palm-kpis .kpi-v{font-size:1.3rem}
 .palm-tabs{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:2px}
 .palm-tabs button{justify-content:center}
 .pstats>div{padding:2px 10px}
 .pstats .kpi-v{font-size:1.25rem}
 .gt-row{grid-template-columns:130px repeat(12,minmax(0,1fr))}
 .gantt{min-width:640px}
 .mbar{min-width:0}
}

/* ================= v11: language + theme ================= */
@font-face{font-family:"IBM Plex Sans";src:url(fonts/plexsans-latin.woff2) format("woff2");font-weight:400 700;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
html[lang=en] body{font-family:"IBM Plex Sans",Plex,-apple-system,"Segoe UI",Roboto,sans-serif;letter-spacing:0}
html[lang=en] body .ltr-ar{font-family:Plex,sans-serif}
.i18n-wait body{opacity:0}
/* prefs controls (top bar) */
.prefs{display:inline-flex;align-items:center;gap:.35rem}
.lang-seg{padding:2px;border-radius:6px;gap:2px}
.lang-seg button{padding:.2rem .55rem;font-size:.78rem;font-weight:600;min-width:2.1rem;justify-content:center;border-radius:4px;line-height:1.4}
.lang-seg button[lang=ar]{font-family:Plex,sans-serif;font-size:.86rem;line-height:1.25}
.theme-btn{border:1px solid var(--line);background:var(--surface);width:2.1rem;height:2.1rem;border-radius:6px}
.theme-btn:hover{color:var(--ink);border-color:var(--faint)}
.theme-btn .t-sun{display:none}
[data-theme=dark] .theme-btn .t-sun{display:block}
[data-theme=dark] .theme-btn .t-moon{display:none}
.intro .lang-seg{background:rgba(8,16,12,.35);border-color:rgba(255,255,255,.3)}
.intro .lang-seg button{color:rgba(255,255,255,.78)}
.intro .lang-seg button:hover{color:#fff}
.intro .lang-seg button.on{background:#fff;color:#14231B}
.intro .theme-btn{background:rgba(8,16,12,.35);border-color:rgba(255,255,255,.3);color:#fff}
.intro .theme-btn:hover{border-color:rgba(255,255,255,.7)}
@media(max-width:760px){
 .top-end .prefs{gap:.2rem;margin-inline-end:.15rem}
 .top-end .lang-seg button{padding:.16rem .4rem;min-width:1.8rem;font-size:.72rem}
 .top-end .theme-btn{width:1.95rem;height:1.95rem}
 .intro-bar-end{gap:.4rem}
 .intro-bar-end .demo-badge{display:none}
}
@media(max-width:380px){.top-end #resetBtn{display:none}}
/* settings */
.set-wrap{display:flex;flex-direction:column;gap:16px}
.set-main{display:flex;flex-direction:column;gap:16px;min-width:0}
.set-card{scroll-margin-top:80px}
.set-sub{font-size:.74rem;font-weight:600;color:var(--muted);margin:1.2rem 0 .6rem;padding-bottom:.35rem;border-bottom:1px solid var(--line2)}
.set-sub:first-child{margin-top:0}
.form-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem 1rem}
.form-g.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.form-g.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.form-g .field{color:var(--ink2);font-weight:500}
.form-g .field small{color:var(--faint);font-size:.72rem;font-weight:400}
.field input[readonly]{background:var(--surface2);color:var(--muted)}
.ltr-in{direction:ltr;text-align:start}
[dir=rtl] .ltr-in{text-align:right}
.set-loc{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:1rem;align-items:start}
.loc-map{border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--surface2)}
.loc-map svg{display:block;width:100%;height:auto}
.loc-map span{display:block;font-size:.74rem;color:var(--muted);padding:.4rem .6rem;border-top:1px solid var(--line);text-align:center}
.lm-bg{fill:#EEF0EC}.lm-rd{stroke:#D9DCD6;stroke-width:6;fill:none}.lm-f>*{fill:#CFE0D3;stroke:#B5CFBB}.lm-pin{fill:var(--terra)}
.set-rows{display:flex;flex-direction:column}
.set-row,.sw-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--line2)}
.set-row:last-child,.sw-row:last-child{border-bottom:0}
.set-row b,.sw-row b{display:block;font-size:.88rem;font-weight:600}
.set-row small,.sw-row small{display:block;font-size:.76rem;color:var(--muted)}
.sw-row{cursor:pointer}
.seg-sm button{font-size:.8rem;padding:.3rem .75rem}
.sw{position:relative;flex:none;width:2.4rem;height:1.35rem}
.sw input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.sw i{position:absolute;inset:0;border-radius:999px;background:var(--line);transition:background .15s}
.sw i::after{content:"";position:absolute;top:3px;inset-inline-start:3px;width:calc(1.35rem - 6px);height:calc(1.35rem - 6px);border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .15s}
.sw input:checked+i{background:var(--brand)}
[dir=rtl] .sw input:checked+i::after{transform:translateX(-1.05rem)}
[dir=ltr] .sw input:checked+i::after{transform:translateX(1.05rem)}
.sw input:focus-visible+i{outline:2px solid var(--teal);outline-offset:2px}
.chk-row{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;padding-top:.2rem}
.chk{display:inline-flex;align-items:center;gap:.45rem;font-size:.85rem;color:var(--ink2);cursor:pointer}
.chk input{width:1rem;height:1rem;accent-color:var(--brand);margin:0}
.einv-st{display:flex;align-items:center;gap:.8rem;padding:.8rem 1rem;border:1px solid var(--line);border-radius:8px;background:var(--surface2)}
.einv-st>div{flex:1}.einv-st b{display:block;font-size:.9rem}.einv-st small{font-size:.76rem;color:var(--muted)}
.u-cell{display:inline-flex;align-items:center;gap:.55rem}
@media(max-width:1100px){.form-g.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.form-g.g3{grid-template-columns:repeat(2,minmax(0,1fr))}.set-loc{grid-template-columns:1fr}}
@media(max-width:760px){
 .form-g,.form-g.g3,.form-g.g4{grid-template-columns:1fr}
 .set-card .card-h{flex-wrap:wrap;gap:.5rem}
 .set-row{flex-wrap:wrap}
}
/* ---------- LTR (English) ---------- */
[dir=ltr] svg.i:has(> use[href="#i-chev"]){transform:scaleX(-1)}
[dir=ltr] .hl b{text-align:left}
@media(max-width:760px){[dir=ltr] .side{transform:translateX(-100%)}[dir=ltr] .side.open{transform:none}}
@media(min-width:761px){[dir=ltr] .hero-shade{background:linear-gradient(90deg,rgba(8,16,12,.86) 0%,rgba(8,16,12,.72) 30%,rgba(8,16,12,.28) 58%,rgba(8,16,12,.08) 100%),linear-gradient(180deg,rgba(8,16,12,.62) 0,rgba(8,16,12,0) 110px),linear-gradient(0deg,rgba(8,16,12,.55) 0%,rgba(8,16,12,0) 22%)}}
html[lang=en] .intro h1{letter-spacing:-.01em;line-height:1.15}
/* ---------- dark ---------- */
[data-theme=dark]{color-scheme:dark;
--bg:#0f1412;--surface:#161c19;--surface2:#1b221f;--line:#2a332f;--line2:#222a26;
--ink:#E4E9E6;--ink2:#C3CCC7;--muted:#97A29C;--faint:#707C76;
--brand:#2E8A62;--brand7:#3C9C72;--brand1:#18291F;--brand2:#20372A;
--leaf:#5E9F70;--leaf1:#18261B;--amber:#C99A42;--amber1:#2A2316;--amberInk:#E2B866;
--teal:#4D95B8;--teal1:#152329;--terra:#CC6A4E;--terra1:#2C1C17;--terraInk:#E88D72;
--sh:0 1px 2px rgba(0,0,0,.25);--sh2:0 12px 32px rgba(0,0,0,.5)}
[data-theme=dark] *{scrollbar-color:rgba(255,255,255,.18) transparent}
[data-theme=dark] .chip-ic.leaf,[data-theme=dark] .pill.leaf,[data-theme=dark] .btn.done,[data-theme=dark] .live,[data-theme=dark] .delta.good{color:#6DB37F}
[data-theme=dark] .delta.bad{color:#E07B5F}
[data-theme=dark] .pill.teal,[data-theme=dark] .save{color:#74B3D2}
[data-theme=dark] .nav-it em.ai{color:#62BABA}
[data-theme=dark] .nav-it em{background:#3A231C;color:#F0A58E}
[data-theme=dark] .demo-badge{border-color:#4D3E22}
[data-theme=dark] .btn-ghost:hover,[data-theme=dark] .role-card:hover,[data-theme=dark] .tcard:hover,[data-theme=dark] .btn-soft:hover,[data-theme=dark] .card.kpi:hover,[data-theme=dark] .card.tile:hover{border-color:#3B4741}
[data-theme=dark] tbody tr:hover td{background:var(--surface2)}
[data-theme=dark] .map-svg{background:#141a17}
[data-theme=dark] .col{background:#131916}
[data-theme=dark] .drop,[data-theme=dark] .photo-pick{border-color:#3B4741}
[data-theme=dark] .leafph,[data-theme=dark] .palm-ov-img{background:#1E2622}
[data-theme=dark] .bcard{background:var(--surface)}
[data-theme=dark] .phone{background:#0a0e0c;border-color:#2a332f}
[data-theme=dark] .toast{background:#26302b;border:1px solid #34403a}
[data-theme=dark] .modal{background:rgba(0,0,0,.62)}
[data-theme=dark] .scrim.open{background:rgba(0,0,0,.5)}
[data-theme=dark] .alert-banner{background:#2A1B16;border-color:#4A2E24}
[data-theme=dark] .ai-strip{background:var(--surface2);border-color:var(--line)}
[data-theme=dark] .chart text{fill:#9AA59F}
[data-theme=dark] .chart .axis-u{fill:#7A8680}
[data-theme=dark] .chart line[stroke="#E9ECE9"]{stroke:#29322E}
[data-theme=dark] .chart circle[fill="#fff"]{fill:#161c19}
[data-theme=dark] .intro-roles{background:var(--surface);box-shadow:0 24px 48px rgba(0,0,0,.5);border:1px solid var(--line)}
[data-theme=dark] .role-card{background:var(--surface)}
[data-theme=dark] .role-card:hover{background:var(--surface2)}
[data-theme=dark] .gt-c.now,[data-theme=dark] .gt-m.now{background:#18241D}
[data-theme=dark] .gt-bar.done{background:#1E3427;color:#9CCDAA;border-color:#2B4A36}
[data-theme=dark] .gt-bar.todo{background:var(--surface);border-color:#3B4741}
[data-theme=dark] .ptask .box{border-color:#4A5650}
[data-theme=dark] .plot.sel .pshape{stroke:#E4E9E6}
[data-theme=dark] .map-svg>rect[fill="#EDEEE9"]{fill:#1a211d;stroke:#2a332f}
[data-theme=dark] .map-svg>rect[fill="#E2E3DC"]{fill:#232b27}
[data-theme=dark] .map-svg rect[fill="#fff"],[data-theme=dark] .map-svg circle[fill="#fff"][stroke="#D3D7D1"]{fill:#1b221f;stroke:#36413b}
[data-theme=dark] .map-svg circle[fill="#DDE9EF"]{fill:#16262e}
[data-theme=dark] .map-svg text[style*="#6A746D"]{fill:#9AA59F!important}
[data-theme=dark] .map-svg text[style*="#2D6480"]{fill:#7DB6D3!important}
[data-theme=dark] .map-svg path[fill="#1C2620"]{fill:#E4E9E6}
[data-theme=dark] .map-svg .pshape{stroke:#0f1412}
[data-theme=dark] .map-svg .plot{filter:brightness(.84) saturate(.92)}
[data-theme=dark] .lm-bg{fill:#1a211d}[data-theme=dark] .lm-rd{stroke:#29322e}[data-theme=dark] .lm-f>*{fill:#1E3427;stroke:#2B4A36}
[data-theme=dark] .seg button.on{color:#fff}
[data-theme=dark] .btn-primary{color:#fff}
[data-theme=dark] .sw i::after{background:#E4E9E6}
[data-theme=dark] .qr-box{background:#fff}
[data-theme=dark] input,[data-theme=dark] select,[data-theme=dark] textarea{color-scheme:dark}
[data-theme=dark] .intro .btn-primary{background:#fff;color:#14231B}

/* v12: collapsible sidebar groups */
.nav-g{display:flex;align-items:center;gap:.4rem;width:100%;text-align:start;cursor:pointer;border-radius:6px;background:none;border:0;font-family:inherit;line-height:1.4}
.nav-g:hover{color:var(--muted)}
.nav-g .chv{width:.85rem;height:.85rem;margin-inline-start:auto;stroke-width:2;transition:transform .18s ease}
.nav-g .nav-gb{display:none;font-style:normal;font-size:.66rem;font-weight:600;padding:0 .4rem;border-radius:4px;background:#F6E3DC;color:var(--terraInk);line-height:1.5}
.nav-grp.collapsed .nav-g .nav-gb{display:inline-block}
[dir=rtl] .nav-grp.collapsed .nav-g .chv{transform:rotate(90deg)}
[dir=ltr] .nav-grp.collapsed .nav-g .chv{transform:rotate(-90deg)}
.nav-gi{display:grid;grid-template-rows:1fr;transition:grid-template-rows .18s ease}
.nav-gi-in{min-height:0;overflow:hidden;visibility:visible;transition:visibility 0s;padding-inline-start:.6rem;margin-inline-start:-.6rem}
.nav-grp.collapsed .nav-gi{grid-template-rows:0fr}
.nav-grp.collapsed .nav-gi-in{visibility:hidden;transition:visibility 0s .18s}
.nav-g:focus-visible{outline-offset:-2px}
[data-theme=dark] .nav-g .nav-gb{background:#3A231C;color:#F0A58E}
@media (prefers-reduced-motion:reduce){.nav-gi,.nav-g .chv{transition:none}}
/* v12: settings tabs */
.set-tabs{display:flex;gap:.25rem;border-bottom:1px solid var(--line);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;max-width:100%}
.set-tabs::-webkit-scrollbar{display:none}
.set-tabs button{display:flex;align-items:center;gap:.45rem;flex:none;white-space:nowrap;padding:.65rem .9rem;margin-bottom:-1px;border:0;border-bottom:2px solid transparent;background:none;font-family:inherit;font-size:.88rem;font-weight:500;color:var(--muted);cursor:pointer}
.set-tabs button .i{width:1rem;height:1rem}
.set-tabs button:hover{color:var(--ink)}
.set-tabs button.on{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}
.set-tabs button:focus-visible{outline-offset:-2px}
.set-main .set-card{display:none}
.set-main[data-cur=farm] #set-farm,.set-main[data-cur=users] #set-users,.set-main[data-cur=alerts] #set-alerts,.set-main[data-cur=einv] #set-einv,.set-main[data-cur=integ] #set-integ{display:block}
@media(max-width:760px){.set-tabs button{padding:.55rem .7rem;font-size:.82rem}}

/* ---- invoices page (v13) ---- */
.inv-h small{font-size:.78rem;color:var(--muted)}
.inv-tools{display:grid;grid-template-columns:minmax(0,2fr) repeat(3,minmax(0,1fr));gap:.5rem;padding:0 1.1rem .9rem}
.inv-tools select,.inv-search{border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);font:inherit;font-size:.84rem;min-width:0;height:2.35rem}
.inv-tools select{padding:0 .6rem;width:100%}
.inv-search{display:flex;align-items:center;gap:.45rem;padding:0 .7rem}
.inv-search .i{width:1rem;height:1rem;color:var(--muted);flex:none}
.inv-search input{border:0;outline:0;background:transparent;color:var(--ink);font:inherit;width:100%;min-width:0;height:100%}
.inv-search:focus-within,.inv-tools select:focus{border-color:var(--brand);outline:0}
.inv-tbl tbody tr{cursor:pointer}
.inv-tbl tbody tr:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}
.inv-tbl td,.inv-tbl th{white-space:nowrap}
.inv-empty td{text-align:center;color:var(--muted);padding:1.6rem !important;cursor:default}
.inv-calc{border:1px solid var(--line);border-radius:10px;padding:.3rem .9rem;background:var(--surface2)}
@media (max-width:1180px){.inv-tools{grid-template-columns:1fr 1fr 1fr}.inv-search{grid-column:1/-1}}
@media (max-width:760px){.inv-tools{grid-template-columns:1fr 1fr;padding:0 .9rem .8rem}.inv-tools select:last-child{grid-column:1/-1}
 .inv-tbl td,.inv-tbl th{white-space:normal}.inv-tbl td:last-child{margin-inline-start:0}.inv-tbl td:nth-child(7){margin-inline-start:auto}}
@media print{body *{visibility:hidden !important}#modal,#modal *{visibility:visible !important}#modal{position:absolute;inset:0;background:#fff !important}#modalCard{position:absolute;top:0;left:0;right:0;box-shadow:none;border:0;max-width:none;width:100%;max-height:none;overflow:visible;background:#fff !important;color:#111 !important;animation:none}#modalCard *{color:#111 !important;border-color:#ccc !important}#modalCard .btn,#modalCard [data-close]{display:none !important}}

/* v13b: landing card without live readings / stats — ends at the last role */
.intro-roles .hero-live[hidden],.intro-roles .intro-stats[hidden],.hero-live[hidden],.intro-stats[hidden]{display:none!important}
.intro-roles>.role-card:last-of-type{margin-bottom:0}
.intro-roles{height:auto;min-height:0}
[data-theme=dark] .intro .lang-seg button.on{background:#fff;color:#14231B}

/* v15: landing role card removed — copy spans one column so the drone video shows fully */
.intro-in{grid-template-columns:minmax(0,1fr)}
.intro-copy{max-width:720px}
.intro-roles{display:none!important}

/* v16 descriptor */
.intro .brand .brand-desc{font-size:.9rem;font-weight:500;letter-spacing:0}
@media (max-width:600px){.intro .brand{white-space:normal;min-width:0}.intro .brand .brand-desc{font-size:.68rem;line-height:1.3;max-width:11.5rem}}

/* ---------- v17: الري التلقائي ---------- */
.irr-tabs{margin:0 0 1rem;width:auto}
.irr-tabs button{font-size:.84rem}
.irr-tabs .i{width:15px;height:15px}
.sim-note{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--muted);border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:.5rem .8rem}
.sim-note .i{width:15px;height:15px;color:var(--faint);flex:none}
.sim-bar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:.7rem}
.sim-bar .field{flex:1 1 180px;min-width:0}
.sim-bar .btn{flex:none}
.sim-bar .btn[disabled]{opacity:.55;cursor:default}
.sim-box{margin-top:1rem;border:1px solid var(--line);border-radius:8px;padding:.9rem 1rem;min-height:132px}
.sim-idle{display:flex;align-items:center;gap:.7rem;color:var(--muted);font-size:.84rem;line-height:1.7;min-height:100px}
.sim-idle .i{width:22px;height:22px;color:var(--faint);flex:none}
.sim-head{display:flex;justify-content:space-between;align-items:flex-start;gap:.6rem;padding-bottom:.7rem;border-bottom:1px solid var(--line2)}
.sim-head b{display:block;font-size:.95rem}
.sim-head small{color:var(--muted);font-size:.76rem}
.sim-read{display:flex;gap:1.6rem;padding:.8rem 0;align-items:flex-end}
.sim-read small{display:block;font-size:.74rem;color:var(--muted);margin-bottom:.15rem}
.sim-read b{font-size:1.9rem;font-weight:600;line-height:1.1}
.sim-thr b{font-size:1.15rem;color:var(--muted)}
.sim-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45rem}
.sim-steps li{display:flex;align-items:center;gap:.55rem;font-size:.84rem;color:var(--ink2)}
.sim-steps .i{width:16px;height:16px;flex:none}
.sim-steps li.ok .i{color:var(--brand)}
.sim-steps li.run .i{color:var(--teal)}
.sim-steps li.bad{color:var(--terraInk)}
.sim-steps li.bad .i{color:var(--terraInk)}
.sim-prog{margin-top:.9rem}
.sim-prog-l{display:flex;justify-content:space-between;align-items:baseline;font-size:.8rem;color:var(--muted);margin-bottom:.35rem}
.sim-prog-l b{font-size:1.05rem;color:var(--ink);font-weight:600}
.sim-prog .bar i{background:var(--brand);transition:width 1s linear}
.sim-prog .hint{display:block;margin-top:.4rem;font-size:.72rem}
.sim-ask{margin-top:.9rem;border:1px solid var(--line);border-inline-start:3px solid var(--amber);border-radius:6px;padding:.7rem .8rem;background:var(--surface2)}
.sim-ask p{font-size:.84rem;color:var(--ink2);margin:0}
.sim-ask-b{display:flex;gap:.5rem;margin-top:.6rem}
.sim-ask-b .btn{margin:0}
.al-log{display:flex;flex-direction:column;margin:-.3rem 0}
.al-row{display:flex;align-items:flex-start;gap:.6rem;padding:.55rem 0;border-bottom:1px solid var(--line2);font-size:.82rem}
.al-row:last-child{border-bottom:0}
.al-t{color:var(--muted);font-size:.78rem;flex:none;width:2.7rem;padding-top:.05rem}
.al-d{width:.45rem;height:.45rem;border-radius:50%;flex:none;margin-top:.45rem;background:var(--faint)}
.al-d.green{background:var(--brand)}.al-d.amber{background:var(--amber)}.al-d.terra{background:var(--terra)}
.al-b{flex:1;min-width:0;display:flex;flex-wrap:wrap;gap:.1rem .35rem;color:var(--ink2);line-height:1.6}
.al-b b{font-weight:600;color:var(--ink)}
.al-sep{color:var(--faint)}
.al-r{font-weight:600}
.al-r.green{color:var(--brand)}.al-r.amber{color:var(--amberInk)}.al-r.terra{color:var(--terraInk)}.al-r.gray{color:var(--ink2)}
.al-x{color:var(--muted);flex-basis:100%;font-size:.76rem}
[data-theme=dark] .al-r.green{color:#6DB37F}
.ar-list{display:flex;flex-direction:column;margin:-.5rem -1.1rem -.6rem}
.ar-row{display:grid;grid-template-columns:minmax(92px,.9fr) 64px minmax(0,2.6fr) auto 132px 104px;align-items:center;gap:.9rem;padding:.75rem 1.1rem;border-bottom:1px solid var(--line2)}
.ar-row:last-child{border-bottom:0}
.ar-f b{display:block;font-size:.86rem}
.ar-f small,.ar-m small,.ar-w small{display:block;font-size:.72rem;color:var(--muted)}
.ar-m b{font-size:1rem;font-weight:600}
.ar-c{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem .4rem;font-size:.8rem;color:var(--ink2)}
.ar-in{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:6px;background:var(--surface);padding:0 .4rem 0 .2rem;height:1.9rem}
.ar-in input{width:2.6rem;border:0;background:transparent;font:inherit;font-weight:600;color:var(--ink);text-align:center;padding:0;-moz-appearance:textfield}
.ar-in input::-webkit-inner-spin-button,.ar-in input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.ar-in.sm input{width:2.9rem}
.ar-in i{font-style:normal;font-size:.72rem;color:var(--muted)}
.ar-in:focus-within{border-color:var(--brand)}
.ar-in input:disabled{color:var(--ink2);cursor:default}
.ar-mode{width:auto}
.ar-mode button{font-size:.76rem;padding:.3rem .6rem}
.ar-mode button:disabled{cursor:default}
.ar-mode button:disabled:not(.on){opacity:.7}
.ar-wv{display:flex;align-items:center;gap:.3rem;font-size:.8rem;margin:.1rem 0 .3rem}
.ar-wv b{font-weight:600}
.ar-w .bar i{background:var(--teal)}
.ar-v{text-align:end}
.vl-open .dt{animation:pulse 2s infinite}
.sf-row{padding:.75rem 0;border-bottom:1px solid var(--line2)}
.sf-row:first-child{padding-top:0}.sf-row:last-child{border-bottom:0;padding-bottom:0}
.sf-row b{font-size:.86rem;font-weight:600}
.sf-row .hint{font-size:.78rem;margin-top:.15rem;line-height:1.6}
.sf-time{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-top:.6rem}
.sf-time select:disabled{color:var(--ink2);opacity:1}
.auto-strip{display:flex;align-items:center;gap:.75rem;padding:.75rem 1.1rem}
.auto-strip .btn{margin:0;flex:none}
.auto-strip .amb{display:inline;color:var(--amberInk);font-weight:600;font-size:inherit}
@media (max-width:1400px){.ar-row{grid-template-columns:minmax(92px,1fr) 64px minmax(0,2.4fr) 132px 104px;grid-template-areas:"f m c w v" "f m mode w v"}
 .ar-f{grid-area:f}.ar-m{grid-area:m}.ar-c{grid-area:c}.ar-mode{grid-area:mode;justify-self:start}.ar-w{grid-area:w}.ar-v{grid-area:v}}
@media (max-width:760px){.irr-tabs{width:100%}.irr-tabs button{flex:1;justify-content:center;padding:.4rem .4rem}
 .ar-row{grid-template-columns:1fr auto;grid-template-areas:"f v" "m m" "c c" "mode mode" "w w";gap:.55rem}
 .ar-m{display:flex;align-items:baseline;gap:.5rem}.ar-m small{display:inline}
 .ar-mode{width:100%}.ar-mode button{flex:1;justify-content:center}
 .ar-wv{margin-top:0}
 .sim-bar .btn{width:100%}
 .sim-read b{font-size:1.6rem}
 .auto-strip{flex-wrap:wrap}.auto-strip .btn{margin-inline-start:auto}}
.arr{display:inline-block}html[dir=ltr] .arr{transform:scaleX(-1)}

/* v20 — installed app (standalone): keep content clear of the notch / home bar; insets are 0 elsewhere */
html{--sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px);--sal:env(safe-area-inset-left,0px);--sar:env(safe-area-inset-right,0px)}
body{padding-top:var(--sat);padding-left:var(--sal);padding-right:var(--sar)}
.sa-top{position:fixed;top:0;left:0;right:0;height:var(--sat);background:#1F6448;z-index:120;pointer-events:none}
[data-theme=dark] .sa-top{background:#0f1412}
.top{top:var(--sat)}
.main{padding-bottom:var(--sab)}
.intro{padding-top:var(--sat);padding-bottom:var(--sab);padding-left:var(--sal);padding-right:var(--sar)}
.side{padding-top:var(--sat);padding-bottom:var(--sab)}
.toasts{margin-bottom:var(--sab)}
.modal{padding-top:calc(1rem + var(--sat));padding-bottom:calc(1rem + var(--sab))}
.pwa-card{margin-bottom:1rem}
.pwa-card .set-row{padding:.2rem 0}
body:has(#intro:not([hidden]):not(.out)) .sa-top{background:transparent}
.pwa-card[hidden],#pwaBtn[hidden]{display:none!important}
@media (pointer:coarse){.lang-seg button{position:relative}.lang-seg button::after{content:"";position:absolute;inset:-9px -1px}}