:root{
  --goldL:#c8a959;
  --paper:#f7f3ea; --surface:#ffffff; --ink:#152443; --ink2:#3c4b6e; --slate:#6b7690; --line:#e2dccd;
  --blue:#1f3a75; --blueSoft:#e6ecf8; --gold:#a8842e; --goldSoft:#f4ecd8; --ok:#2f7a4a; --okSoft:#e3f1e7; --bad:#b23b3b; --badSoft:#f8e3e3; --warn:#9a6b12; --warnSoft:#fbf0d5;
  --r:12px; --shadow:0 8px 24px #15244314;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.5 'Noto Sans Devanagari',system-ui,sans-serif;-webkit-tap-highlight-color:transparent}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--blue)}
.boot{padding:4rem 1rem;text-align:center;color:var(--slate)}
h1,h2,h3{margin:0;line-height:1.25;text-wrap:balance}
.hidden{display:none!important}
/* layout */
.topbar{position:sticky;top:0;z-index:20;background:linear-gradient(90deg,#152c5c,#1f3a75 60%,#25478a);color:#f3ecd9;padding:.65rem 1rem;display:flex;align-items:center;gap:.7rem;padding-top:calc(.65rem + env(safe-area-inset-top));box-shadow:0 2px 12px #15244333;border-bottom:2px solid var(--goldL)}
.mark{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,#c8a959,#a8842e);color:#152443;font-weight:900;font-size:1.15rem;display:grid;place-items:center;flex:none;box-shadow:0 3px 10px #0004}
.mark.big{width:52px;height:52px;border-radius:14px;font-size:1.6rem}
.topbar h1{font-size:1.05rem;font-weight:800;flex:1}
.topbar small{display:block;font-size:.7rem;font-weight:600;opacity:.8}
.topbar .u{font-size:.8rem;opacity:.9}
main{padding:1rem 1rem calc(4.8rem + env(safe-area-inset-bottom));max-width:1100px;margin:0 auto}
.tabs{position:fixed;bottom:0;left:0;right:0;z-index:20;display:flex;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
.tabs button{flex:1;background:none;border:0;padding:.55rem 0 .45rem;font-size:.72rem;font-weight:700;color:var(--slate);display:flex;flex-direction:column;align-items:center;gap:.1rem;cursor:pointer}
.tabs button i{font-style:normal;font-size:1.25rem;line-height:1}
.tabs button.on{color:var(--blue)}
.tabs button.add i{background:var(--blue);color:#fff;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;margin-top:-16px;box-shadow:var(--shadow)}
/* cards & type */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1rem;box-shadow:var(--shadow)}
.grid{display:grid;gap:.8rem}
.g2{grid-template-columns:repeat(2,1fr)} .g3{grid-template-columns:repeat(3,1fr)}
@media(min-width:760px){.g2m{grid-template-columns:repeat(2,1fr)} .g4m{grid-template-columns:repeat(4,1fr)}}
.stat{padding:.9rem 1rem}
.stat b{display:block;font-size:1.6rem;color:var(--blue);font-variant-numeric:tabular-nums;line-height:1.1}
.stat span{font-size:.78rem;color:var(--slate);font-weight:600}
.sec{margin:1.3rem 0 .6rem;font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}
.muted{color:var(--slate)} .small{font-size:.82rem}
.row{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.sb{justify-content:space-between}
/* bars */
.bars{display:grid;gap:.45rem}
.bar{display:grid;grid-template-columns:minmax(80px,32%) 1fr auto;gap:.6rem;align-items:center;font-size:.85rem}
.bar i{display:block;height:9px;border-radius:999px;background:var(--blueSoft);overflow:hidden}
.bar i b{display:block;height:100%;background:var(--blue);border-radius:999px}
.bar em{font-style:normal;font-variant-numeric:tabular-nums;color:var(--ink2);font-weight:700}
/* forms */
label.f{display:block;font-size:.78rem;font-weight:700;color:var(--slate);margin:.55rem 0 .2rem}
.in,select.in,textarea.in{width:100%;border:1px solid var(--line);border-radius:10px;padding:.6rem .75rem;background:#fff;outline:none;min-height:42px}
.in:focus{border-color:var(--blue);box-shadow:0 0 0 3px #1f3a7522}
textarea.in{min-height:70px;resize:vertical}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border:1px solid transparent;border-radius:999px;padding:.6rem 1.1rem;font-weight:800;cursor:pointer;background:var(--blue);color:#fff;text-decoration:none;min-height:42px;white-space:nowrap}
.btn.sec{background:var(--surface);color:var(--blue);border-color:#1f3a7555} .btn.sm{padding:.35rem .75rem;min-height:34px;font-size:.85rem}
.btn.ghost{background:transparent;color:var(--ink2);border-color:var(--line)}
.btn.danger{background:var(--badSoft);color:var(--bad);border-color:#b23b3b44}
.btn.wa{background:#1fa855;color:#fff} .btn.call{background:var(--goldSoft);color:var(--gold);border-color:#a8842e55}
.btn:disabled{opacity:.5;cursor:default}
.btn:focus-visible,.in:focus-visible,.tabs button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.icon{width:38px;height:38px;border-radius:50%;display:inline-grid;place-items:center;border:1px solid var(--line);background:#fff;cursor:pointer;text-decoration:none;font-size:1rem}
.icon.wa{background:#e6f6ea;border-color:#1fa85566} .icon.call{background:var(--goldSoft);border-color:#a8842e55}
/* filters */
.filters{position:sticky;top:calc(3.3rem + env(safe-area-inset-top));z-index:15;background:var(--paper);padding:.5rem 0 .6rem;margin:-.4rem 0 .6rem}
.filters .in{min-height:38px;padding:.4rem .6rem;font-size:.9rem}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}
@media(min-width:760px){.fgrid{grid-template-columns:repeat(4,1fr)}}
.chips{display:flex;gap:.4rem;overflow-x:auto;padding:.3rem 0;scrollbar-width:none}
.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:.3rem .75rem;font-size:.82rem;font-weight:700;color:var(--ink2);cursor:pointer;white-space:nowrap}
.chip.on{background:var(--blue);color:#fff;border-color:var(--blue)}
/* voter list */
.vlist{display:grid;gap:.55rem}
.voter{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"sel name acts" "sel rel acts" "sel cr acts" "sel loc acts";column-gap:.7rem;row-gap:.05rem;align-items:center;padding:.7rem .85rem;cursor:pointer}
.c-sel{grid-area:sel;min-width:2ch;text-align:right} .c-name{grid-area:name;display:flex;flex-wrap:wrap;gap:.4rem;align-items:center} .c-rel{grid-area:rel} .c-cr{grid-area:cr} .c-loc{grid-area:loc} .c-mob{display:none} .c-ag{display:none}
.voter .acts{grid-area:acts} .vhead{display:none}
.voter .cb{width:20px;height:20px}
.voter .n{font-weight:800;font-size:1rem}
.voter .d{font-size:.8rem;color:var(--slate)}
.voter .acts{display:flex;gap:.35rem}
.voter:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}.vdetail__head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding-bottom:.8rem;border-bottom:1px solid var(--line)}.vdetail__head h2{font-size:1.3rem}.vdetail{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-top:.9rem}.vdetail__item{min-width:0;padding:.65rem .7rem;border-radius:10px;background:var(--paper)}.vdetail__item span{display:block;margin-bottom:.12rem;font-size:.7rem;font-weight:800;color:var(--slate);letter-spacing:.04em}.vdetail__item b{display:block;overflow-wrap:anywhere;font-size:.9rem}.vdetail__notes{grid-column:1/-1}
@media(max-width:380px){.vdetail{grid-template-columns:1fr}}
.pill{display:inline-block;font-size:.7rem;font-weight:800;padding:.05rem .5rem;border-radius:999px;background:var(--blueSoft);color:var(--blue);vertical-align:middle;margin-left:.3rem}
.pill.हमारे{background:var(--okSoft);color:var(--ok)} .pill.विपक्ष{background:var(--badSoft);color:var(--bad)} .pill.अनिर्णीत{background:var(--warnSoft);color:var(--warn)}
.bulkbar{position:fixed;left:.7rem;right:.7rem;bottom:calc(4.2rem + env(safe-area-inset-bottom));z-index:19;background:var(--ink);color:#fff;border-radius:14px;padding:.6rem .8rem;display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;box-shadow:0 12px 30px #0006}
.bulkbar select{border-radius:8px;border:0;padding:.35rem .5rem;font-size:.85rem}
/* More page accordions */
.more-search{position:sticky;top:calc(3.3rem + env(safe-area-inset-top));z-index:14;background:var(--paper);padding:.7rem 0 .4rem}.more-village-area{margin:.55rem 0}.more-village-area .more-search{margin:0;padding:.7rem;background:var(--surface);border:1px solid var(--line);border-bottom:0;border-radius:var(--r) var(--r) 0 0;box-shadow:var(--shadow)}.more-village-area .more-section{margin:0;border-radius:0 0 var(--r) var(--r)}.more-section{margin:.55rem 0;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);box-shadow:var(--shadow)}.more-section summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.85rem 1rem;font-weight:800;color:var(--blue)}.more-section summary::-webkit-details-marker{display:none}.more-chev{font-size:1.35rem;line-height:1;transition:transform .2s}.more-section[open] .more-chev{transform:rotate(180deg)}.more-section__body{padding:0 1rem 1rem}.more-section__body>.card{box-shadow:none}
/* modal */
.modal{position:fixed;inset:0;z-index:40;background:#0a1230aa;display:flex;align-items:flex-end;justify-content:center}
@media(min-width:640px){.modal{align-items:center}}
.sheet{background:var(--paper);width:100%;max-width:640px;max-height:92vh;overflow:auto;border-radius:18px 18px 0 0;padding:1rem 1rem 1.4rem}
@media(min-width:640px){.sheet{border-radius:18px}}
.sheet h2{font-size:1.15rem;margin-bottom:.6rem}
/* tables */
.tw{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:#fff}
table{border-collapse:collapse;width:100%;font-size:.84rem}
th,td{padding:.5rem .6rem;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
th{font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--slate);background:var(--blueSoft)}
tr:last-child td{border-bottom:0}
td.bad{color:var(--bad);font-weight:700}
.prog{height:10px;background:var(--blueSoft);border-radius:999px;overflow:hidden}.prog b{display:block;height:100%;background:var(--blue)}
/* misc */
.auth{max-width:400px;margin:8vh auto 0}
.auth .logo{width:84px;height:84px;border-radius:50%;margin:0 auto 1rem;display:block}
.auth__portrait,.auth__eyebrow,.auth__lang{display:none}
.list{display:grid;gap:.5rem}
.item{display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.65rem .85rem}
.item b{display:block}
.item small{color:var(--slate)}
#toast{position:fixed;left:50%;bottom:calc(5.4rem + env(safe-area-inset-bottom));transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:.6rem 1rem;border-radius:999px;font-weight:700;font-size:.9rem;opacity:0;transition:.25s;z-index:60;pointer-events:none;max-width:92vw;text-align:center}
#toast.show{opacity:1;transform:translateX(-50%)}
.empty{text-align:center;color:var(--slate);padding:2.5rem 1rem}
.kbd{font-family:ui-monospace,monospace;background:var(--blueSoft);padding:.05rem .35rem;border-radius:4px;font-size:.8em}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---------- branding: auth hero ---------- */
.authwrap{padding:0 0 3rem}
.hero{position:relative;background:linear-gradient(160deg,#152c5c 0%,#1f3a75 55%,#2b4f96 100%);color:#f3ecd9;min-height:300px;display:flex;align-items:flex-end;gap:.8rem;padding:0 1.1rem 1.2rem;overflow:hidden;border-bottom:3px solid var(--goldL)}
.hero::before{content:"जन सेवा • विकास • विश्वास • जय भीम • चलो वलीदपुर •";position:absolute;left:-2%;top:12%;font-size:3.4rem;font-weight:900;color:#ffffff0a;white-space:nowrap;letter-spacing:.04em}
.hero__top{position:absolute;top:calc(.7rem + env(safe-area-inset-top));right:.9rem;z-index:2}
.hero__img{position:absolute;right:-6%;bottom:0;height:92%;filter:drop-shadow(0 10px 24px #0006);-webkit-mask-image:linear-gradient(180deg,#000 82%,transparent);mask-image:linear-gradient(180deg,#000 82%,transparent)}
.hero__txt{position:relative;z-index:1;display:grid;gap:.15rem;max-width:60%}
.hero__txt b{font-size:1.45rem;font-weight:900;line-height:1.15}
.hero__txt small{font-size:.85rem;color:#e6d6a3;font-weight:700}
.hero__txt em{font-style:normal;font-size:.72rem;color:#cfd8ea;font-weight:600;letter-spacing:.06em}
.hero__txt .mark{margin-bottom:.5rem}
.auth{margin:-1.6rem auto 0;position:relative;z-index:2;max-width:420px}
.btn.onblue{background:#ffffff1f;color:#f3ecd9;border-color:#ffffff55;backdrop-filter:blur(4px)}
/* Compact, form-first sign-in on phones */
@media(max-width:639px){
  .authwrap{min-height:100svh;padding:0;background:linear-gradient(160deg,#f7f3ea 0%,#fff 55%)}
  .authwrap>.hero{display:none}
  .auth{position:relative;min-height:100svh;margin:0;max-width:none;display:flex;flex-direction:column;justify-content:center;padding:2rem 1.35rem 2.4rem;border:0;border-radius:0;box-shadow:none;background:transparent}
  .auth__lang{display:block;position:absolute;top:calc(1rem + env(safe-area-inset-top));right:1rem}
  .auth__lang .btn{min-height:34px;margin:0!important;padding:.3rem .65rem;background:#fff;color:var(--blue);border-color:var(--line);box-shadow:0 3px 10px #15244312}
  .auth__heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.5rem}
  .auth__heading>div{min-width:0;flex:1}
  .auth__portrait{display:block;width:82px;height:82px;object-fit:cover;object-position:50% 16%;border-radius:50%;background:linear-gradient(145deg,#18346e,#315a9e);border:3px solid #fff;box-shadow:0 8px 20px #1524432b}
  .auth__eyebrow{display:block;margin-bottom:.25rem;color:var(--gold);font-size:.74rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
  .auth h2{font-size:1.55rem!important;margin:0;text-align:left!important}
  .auth h2 + p{text-align:left!important;margin:.2rem 0 0!important}
  .auth form{max-width:520px;width:100%}
  .auth .f{text-align:left;margin-top:.8rem}
  .auth .in{min-height:46px;padding:.55rem .75rem}
  .auth .btn{min-height:46px;margin-top:1.1rem!important}
}
@media(min-width:760px){.hero{min-height:340px;border-radius:0 0 28px 28px;max-width:1100px;margin:0 auto}.hero__txt{max-width:50%}}
/* ---------- पदाधिकारी ---------- */
.ch{position:relative;height:230px} .chbar{position:relative} .dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:.45rem;vertical-align:middle}
.unit{margin-top:.8rem;padding:.9rem 1rem}
.unit__h{font-weight:800;color:var(--blue);margin-bottom:.5rem;padding-bottom:.4rem;border-bottom:1px solid var(--line)}
.post{padding:.5rem 0;border-bottom:1px dashed var(--line)} .post:last-child{border-bottom:0}
.post__h{display:flex;justify-content:space-between;align-items:center;gap:.5rem;color:var(--gold);font-size:.9rem}
.holder{display:flex;justify-content:space-between;align-items:center;gap:.5rem;padding:.35rem 0 .1rem}
.holder small{display:block;color:var(--slate);font-size:.78rem}
.holder .acts{display:flex;gap:.3rem}
.holder.empty-slot{color:var(--slate);font-size:.85rem;font-style:italic}

/* ================= DESKTOP / LAPTOP (>= 900px) ================= */
.muted-on-blue{opacity:.75;font-weight:600}
@media(min-width:900px){
  main{margin-left:236px;padding:1.4rem 2rem 2.5rem;max-width:none}
  .tabs{top:calc(3.6rem + 2px);bottom:0;left:0;right:auto;width:236px;flex-direction:column;justify-content:flex-start;gap:.15rem;padding:1rem .8rem;border-top:0;border-right:1px solid var(--line);background:var(--surface)}
  .tabs button{flex:none;flex-direction:row;justify-content:flex-start;gap:.7rem;padding:.7rem .9rem;border-radius:10px;font-size:.95rem;width:100%}
  .tabs button i{font-size:1.15rem;width:26px;text-align:center}
  .tabs button.on{background:var(--blueSoft)}
  .tabs button:hover{background:var(--paper)}
  .tabs button.add{margin:.4rem 0 .6rem;background:var(--blue);color:#fff;justify-content:center}
  .tabs button.add i{width:auto;height:auto;margin:0;background:none;box-shadow:none;border-radius:0}
  .filters{top:calc(3.6rem + 2px);margin-top:-1.4rem;padding-top:1rem}
  /* The desktop page has room for the search in normal flow. Keeping it sticky
     there makes the preceding account card appear clipped while scrolling. */
  .more-search{position:static;top:auto}
  .fgrid{grid-template-columns:repeat(7,1fr)}
  .bulkbar{left:calc(236px + 2rem);right:2rem;bottom:1.2rem}
  #toast{bottom:1.5rem}
  /* voter table */
  .vlist{gap:0;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--surface)}
  .vhead,.voter{display:grid;grid-template-columns:44px 1.6fr 1.3fr .9fr 1.3fr 1.4fr .9fr 132px;grid-template-areas:none;gap:.6rem;align-items:center}
  .vhead{padding:.5rem .85rem;font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--slate);background:var(--blueSoft);font-weight:800}
  .voter{border:0;border-radius:0;box-shadow:none;border-bottom:1px solid var(--line);padding:.55rem .85rem}
  .voter:last-child{border-bottom:0} .voter:hover{background:#f9f7f1}
  .c-sel,.c-name,.c-rel,.c-ag,.c-cr,.c-loc,.c-mob{grid-area:auto;display:block}
  .c-name{display:flex;flex-direction:column;align-items:flex-start;gap:.1rem} .voter .n{font-size:.95rem} .voter .d{font-size:.84rem;color:var(--ink2)}
  .c-mob{font-variant-numeric:tabular-nums} .voter .acts{grid-area:auto;justify-content:flex-end}
  .icon{width:34px;height:34px;font-size:.9rem}
  /* dashboard + pada */
  .g3m{grid-template-columns:repeat(3,1fr)}
  .padagrid{display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem} .padagrid .unit{margin-top:0} .padagrid{margin-top:.8rem}
  /* login: two panels */
  main.authwrap{margin-left:0;display:grid;grid-template-columns:1.1fr 1fr;min-height:100vh;padding:0;align-items:stretch}
  .hero{min-height:100vh;border-radius:0;border-bottom:0;border-right:3px solid var(--goldL);max-width:none;margin:0;align-items:flex-start;padding:5.5rem 2.5rem 2.5rem}
  .hero__img{height:72%;right:-3%;bottom:0} .hero__txt{max-width:60%} .hero__txt b{font-size:2.2rem} .hero__txt small{font-size:1.1rem} .hero__txt em{font-size:.9rem}
  .hero::before{font-size:5rem;top:auto;bottom:6%;left:-4%}
  .hero__txt .mark.big{width:64px;height:64px;font-size:2rem}
  .auth{margin:auto;width:min(92%,420px);align-self:center}
  .sheet{max-width:720px}
}
@media(min-width:1280px){.vhead,.voter{grid-template-columns:48px 1.6fr 1.3fr .9fr 1.3fr 1.5fr 1fr 140px}}
