html,body{margin:0}img{max-width:100%}[hidden]{display:none!important}
html[lang=hi] body{line-height:1.6}
.langseg button{min-width:38px}

/* Layout concept: left rail of modules + sticky command bar (search, assistant). Every page = how-it-works strip, KPIs, charts, register table with drawer. */
:root{
  --bg:#edf1ee;--surface:#ffffff;--surface-2:#f4f7f5;--ink:#131b16;--ink-2:#46544c;--ink-3:#76847c;--line:#dce3de;
  --accent:#0a7437;--accent-ink:#ffffff;--accent-soft:#dff0e5;
  --good:#1b7a3d;--warn:#a96a00;--bad:#c0392b;--info:#2a78d6;
  --good-bg:#e2f3e8;--warn-bg:#fbefd5;--bad-bg:#fbe4e1;--info-bg:#e3eefb;
  --c1:#2a78d6;--c2:#eb6834;--c3:#1baf7a;--c4:#eda100;--c5:#e87ba4;--c6:#008300;--c7:#6250d6;--c8:#e34948;
  --shadow:0 1px 2px rgba(15,30,20,.06),0 4px 14px rgba(15,30,20,.05);
  --f-display:'Bricolage Grotesque','Public Sans','Noto Sans Devanagari',system-ui,sans-serif;
  --f-body:'Public Sans','Noto Sans Devanagari',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-mono:'JetBrains Mono',ui-monospace,Menlo,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0d1310;--surface:#141c17;--surface-2:#1a241e;--ink:#e7eee9;--ink-2:#b2c0b8;--ink-3:#85948c;--line:#26332b;
  --accent:#3fbf78;--accent-ink:#06150c;--accent-soft:#17301f;
  --good:#52c47c;--warn:#e0a53a;--bad:#ef7a6c;--info:#6aa7ee;
  --good-bg:#16301f;--warn-bg:#33270e;--bad-bg:#3a1a16;--info-bg:#14263d;
  --c1:#3987e5;--c2:#d95926;--c3:#199e70;--c4:#c98500;--c5:#d55181;--c6:#008300;--c7:#9085e9;--c8:#e66767;
  --shadow:0 1px 2px rgba(0,0,0,.4);color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0d1310;--surface:#141c17;--surface-2:#1a241e;--ink:#e7eee9;--ink-2:#b2c0b8;--ink-3:#85948c;--line:#26332b;
  --accent:#3fbf78;--accent-ink:#06150c;--accent-soft:#17301f;
  --good:#52c47c;--warn:#e0a53a;--bad:#ef7a6c;--info:#6aa7ee;
  --good-bg:#16301f;--warn-bg:#33270e;--bad-bg:#3a1a16;--info-bg:#14263d;
  --c1:#3987e5;--c2:#d95926;--c3:#199e70;--c4:#c98500;--c5:#d55181;--c6:#008300;--c7:#9085e9;--c8:#e66767;
  --shadow:0 1px 2px rgba(0,0,0,.4);color-scheme:dark}
*{box-sizing:border-box}
html,body{height:100%}
body{background:var(--bg);color:var(--ink);font:14px/1.5 var(--f-body);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
.app{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100%}
.rail{background:var(--surface);border-right:1px solid var(--line);position:sticky;top:env(safe-area-inset-top,0px);height:100vh;overflow:auto;padding:18px 12px;display:flex;flex-direction:column;gap:6px}
.brand{display:flex;gap:10px;align-items:center;padding:4px 8px 14px}
.logo{width:38px;height:38px;border-radius:10px;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font:700 13px var(--f-display);letter-spacing:.02em}
.brand b{font:700 15px/1.1 var(--f-display);display:block}
.brand small{color:var(--ink-3);font-size:11.5px}
.grp{font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);padding:12px 10px 4px}
.nav{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;color:var(--ink-2);font-weight:500}
.nav:hover{background:var(--surface-2)}
.nav.on{background:var(--accent-soft);color:var(--accent);font-weight:600}
.nav svg{flex:none}
.nav .tag{margin-left:auto;font-size:10px;background:var(--warn-bg);color:var(--warn);padding:1px 6px;border-radius:99px}
svg.i{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.main{min-width:0;padding:0 24px 40px}
.bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--bg);display:flex;gap:10px;align-items:center;padding:14px 0 12px}
.search{flex:1;max-width:560px;display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:8px 12px;color:var(--ink-3);cursor:text;text-align:left}
.search span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.search kbd{white-space:nowrap;margin-left:auto;font:500 11px var(--f-mono);background:var(--surface-2);border:1px solid var(--line);border-radius:5px;padding:1px 6px}
.btn{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--surface);border-radius:9px;padding:7px 12px;cursor:pointer;font-weight:500;white-space:nowrap}
.btn:hover{border-color:var(--ink-3)}
.btn.pri{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:600}
.btn.sm{padding:4px 9px;font-size:12.5px;border-radius:7px}
.btn.big{padding:11px 18px;font-size:15px;border-radius:11px}
.btn:focus-visible,.nav:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.search:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sp{flex:1}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:3px 9px;border-radius:99px;background:var(--surface-2);border:1px solid var(--line);color:var(--ink-2)}
.chip.demo{background:var(--warn-bg);border-color:transparent;color:var(--warn);font-weight:600}
.pgh{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin:6px 0 14px}
.pgh h1{font:700 28px/1.1 var(--f-display);margin:0;letter-spacing:-.01em}
.pgh p{margin:4px 0 0;color:var(--ink-2);max-width:62ch}
.how{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px;margin:0 0 16px}
.how div{background:var(--surface);border:1px dashed var(--line);border-radius:10px;padding:9px 12px;font-size:12.5px;color:var(--ink-2);position:relative}
.how b{display:block;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:1px}
.grid{display:grid;gap:14px;margin-bottom:14px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g21{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}.g12{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:14px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:var(--shadow);min-width:0}
.card h3{margin:0 0 2px;font:700 15px var(--f-display)}
.card .sub{color:var(--ink-3);font-size:12.5px;margin-bottom:10px}
.card .hd{display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px 16px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:2px;min-width:0}
.kpi .l{font-size:12px;color:var(--ink-3)}
.kpi .v{font:700 28px/1.1 var(--f-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.kpi .d{font-size:12px;color:var(--ink-2);display:flex;gap:6px;align-items:center}
.kpi svg.sp{margin-top:4px;width:100%;height:26px}
.up{color:var(--good)}.dn{color:var(--bad)}
.badge{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:2px 8px;border-radius:99px;white-space:nowrap}
.badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.b-good{background:var(--good-bg);color:var(--good)}.b-warn{background:var(--warn-bg);color:var(--warn)}.b-bad{background:var(--bad-bg);color:var(--bad)}.b-info{background:var(--info-bg);color:var(--info)}.b-n{background:var(--surface-2);color:var(--ink-2)}
.tbl .tb{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.tbl input[type=search],.fld input,.fld select,.fld textarea{background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:7px 10px;min-width:0}
.tbl input[type=search]{flex:1;min-width:150px;max-width:300px}
.seg{display:flex;gap:4px;flex-wrap:wrap}
.seg button{border:1px solid var(--line);background:var(--surface);border-radius:99px;padding:3px 11px;font-size:12.5px;cursor:pointer;color:var(--ink-2)}
.seg button.on{background:var(--ink);color:var(--surface);border-color:var(--ink)}
.scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:13px}
th{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);text-align:left;padding:7px 10px;border-bottom:1px solid var(--line);white-space:nowrap;cursor:pointer;user-select:none}
td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
tbody tr{cursor:pointer}tbody tr:hover{background:var(--surface-2)}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}
.mono{font-family:var(--f-mono);font-size:12px}
.empty{padding:22px;text-align:center;color:var(--ink-3)}
.hb{display:grid;grid-template-columns:minmax(80px,150px) 1fr 52px;gap:10px;align-items:center;padding:4px 0;font-size:13px}
.hb .t{height:10px;background:var(--surface-2);border-radius:5px;overflow:hidden}
.hb .f{height:100%;border-radius:0 5px 5px 0;background:var(--accent)}
.hb span:last-child{text-align:right;font-variant-numeric:tabular-nums;color:var(--ink-2)}
.hb span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.legend{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12.5px;color:var(--ink-2);margin-top:8px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}
.chartwrap{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
svg.ch{width:100%;height:auto;display:block;overflow:visible}
svg.ch text{fill:var(--ink-3);font:11px var(--f-body)}
svg.ch .grid{stroke:var(--line);stroke-width:1}
svg.ch .cross{stroke:var(--ink-3);stroke-width:1;opacity:0}
svg.ch .hv:hover .cross{opacity:1}
svg.ch .hit{fill:transparent}
svg.ch [data-tip]:hover{filter:brightness(1.1)}
.heat{display:grid;gap:3px;font-size:11px;color:var(--ink-3)}
.heat div{border-radius:4px;min-height:24px;display:grid;place-items:center;font-variant-numeric:tabular-nums;color:var(--ink)}
.todo{display:flex;flex-direction:column;gap:2px}
.todo a{display:flex;gap:10px;align-items:center;padding:9px 10px;border-radius:9px}
.todo a:hover{background:var(--surface-2)}
.todo .n{font:700 16px var(--f-display);min-width:28px;font-variant-numeric:tabular-nums}
.todo small{display:block;color:var(--ink-3)}
.map{background:var(--surface-2);border-radius:12px;width:100%;height:auto;display:block;border:1px solid var(--line)}
.map .z{fill:var(--surface);stroke:var(--line);stroke-width:1}
.map .zl{fill:var(--ink-3);font:600 9.5px var(--f-body)}
.map .river{fill:none;stroke:var(--info);stroke-width:7;opacity:.18;stroke-linecap:round}
.map .rd{stroke:var(--line);stroke-width:1.2;stroke-dasharray:3 3;fill:none}
.veh{transition:transform .8s linear}
.veh circle{fill:var(--accent);stroke:var(--surface);stroke-width:2}
.veh.halt circle{fill:var(--warn)}
.veh text{fill:var(--ink);font:600 8.5px var(--f-mono);paint-order:stroke;stroke:var(--surface);stroke-width:3px}
.pulse{fill:none;stroke:var(--bad);stroke-width:1.5;stroke-dasharray:4 3}
.log{display:flex;flex-direction:column;gap:6px;max-height:230px;overflow:auto;font-size:12.5px}
.log div{background:var(--surface-2);border-radius:8px;padding:7px 10px}
.log time{font-family:var(--f-mono);font-size:11px;color:var(--ink-3);margin-right:6px}
.phone{background:var(--surface-2);border:1px solid var(--line);border-radius:22px;padding:14px;max-width:320px}
.phone .hdr{font-weight:600;font-size:12.5px;margin-bottom:8px;display:flex;gap:6px;align-items:center}
.bubble{background:var(--surface);border-radius:4px 14px 14px 14px;padding:10px 12px;box-shadow:var(--shadow);white-space:pre-wrap;font-size:13px}
.bubble time{display:block;text-align:right;color:var(--ink-3);font-size:10.5px;margin-top:4px}
.fld{display:flex;flex-direction:column;gap:4px;margin-bottom:10px;font-size:12.5px;color:var(--ink-2)}
.fld input,.fld select,.fld textarea{width:100%;color:var(--ink)}
.fld textarea{min-height:110px;resize:vertical}
.ov{position:fixed;inset:0;background:rgba(5,12,8,.5);z-index:50;display:none}
.ov.on{display:block}
.dr{position:fixed;top:0;right:0;bottom:0;width:min(520px,100%);background:var(--surface);z-index:60;padding:20px;overflow:auto;transform:translateX(105%);transition:transform .22s;box-shadow:-8px 0 30px rgba(0,0,0,.2)}
.dr.on{transform:none}
.dr h2{font:700 20px var(--f-display);margin:0 0 4px}
.dr .x{position:absolute;top:14px;right:14px}
.kv{display:grid;grid-template-columns:120px 1fr;gap:6px 12px;margin:12px 0;font-size:13px}.kv dt{color:var(--ink-3)}.kv dd{margin:0}
.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}
.ph{aspect-ratio:4/3;border-radius:10px;background:repeating-linear-gradient(135deg,var(--surface-2) 0 8px,var(--bg) 8px 16px);border:1px dashed var(--ink-3);display:grid;place-items:center;text-align:center;font-size:11.5px;color:var(--ink-3);cursor:pointer;position:relative;overflow:hidden}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ph input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.chat{display:flex;flex-direction:column;gap:10px;height:calc(100% - 140px);overflow:auto;padding:6px 0}
.msg{max-width:92%;padding:9px 12px;border-radius:12px;font-size:13px;white-space:pre-wrap}
.msg.u{align-self:flex-end;background:var(--accent);color:var(--accent-ink)}
.msg.a{align-self:flex-start;background:var(--surface-2)}
.msg table{margin-top:6px;font-size:12px}
.sugs{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.sugs button{border:1px solid var(--line);background:var(--surface);border-radius:99px;padding:4px 10px;font-size:12px;cursor:pointer}
.sr{position:fixed;top:12vh;left:50%;transform:translateX(-50%);width:min(640px,calc(100% - 24px));background:var(--surface);border:1px solid var(--line);border-radius:14px;z-index:70;box-shadow:0 20px 60px rgba(0,0,0,.3);display:none;overflow:hidden}
.sr.on{display:block}
.sr input{width:100%;border:0;border-bottom:1px solid var(--line);padding:14px 16px;font-size:16px;background:transparent;outline:none}
.sr .res{max-height:52vh;overflow:auto;padding:6px}
.sr .it{display:flex;gap:10px;align-items:center;padding:8px 10px;border-radius:8px;cursor:pointer}
.sr .it.on,.sr .it:hover{background:var(--accent-soft)}
.sr .it small{color:var(--ink-3);margin-left:auto;white-space:nowrap}
.sr .gh{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);padding:8px 10px 2px}
.tip{position:fixed;z-index:90;background:var(--ink);color:var(--surface);padding:6px 9px;border-radius:7px;font-size:12px;pointer-events:none;white-space:pre-line;display:none;max-width:240px}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--surface);padding:10px 16px;border-radius:10px;z-index:99;display:none;max-width:90%}
.prog{height:8px;background:var(--surface-2);border-radius:5px;overflow:hidden;margin:10px 0}.prog i{display:block;height:100%;background:var(--accent);width:0;transition:width .25s}
.rep{display:grid;grid-template-columns:240px minmax(0,1fr);gap:14px}
.replist{display:flex;flex-direction:column;gap:4px}
.replist button{text-align:left;border:1px solid transparent;background:transparent;border-radius:9px;padding:9px 11px;cursor:pointer;display:flex;gap:10px;align-items:center}
.replist button:hover{background:var(--surface-2)}
.replist button.on{background:var(--accent-soft);color:var(--accent);font-weight:600}
.ssc{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.ssc .card{display:flex;gap:12px;align-items:center}
.ssc h4{margin:0;font:600 14px var(--f-body)}
.ssc small{color:var(--ink-3);display:block}
.wdhs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.wdhs.row{grid-template-columns:repeat(4,minmax(0,1fr))}
.wd{display:flex;gap:10px;align-items:center;border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:10px 12px;cursor:pointer;text-align:left;min-width:0}
.wd:hover{border-color:var(--ink-3)}.wd.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.wd b{width:38px;height:38px;border-radius:10px;background:var(--sc);color:var(--sk,#fff);display:grid;place-items:center;font:700 18px var(--f-display);flex:none}
.wd span{font:700 20px/1.1 var(--f-display);font-variant-numeric:tabular-nums;display:block}
.wd small{display:block;color:var(--ink-3);font-size:11.5px}
.note{font-size:12px;color:var(--ink-3);margin-top:8px}
.menu{display:none}
@media (max-width:980px){
  .app{grid-template-columns:1fr}
  .rail{position:sticky;height:auto;flex-direction:row;overflow-x:auto;padding:8px 10px;border-right:0;border-bottom:1px solid var(--line);z-index:30;align-items:center}
  .brand,.grp{display:none}.nav{white-space:nowrap}
  .main{padding:0 16px 40px}
  .g2,.g3,.g21,.g12,.rep{grid-template-columns:minmax(0,1fr)}
  .bar{top:50px}
  .wdhs.row{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){.veh,.dr{transition:none}}
