@font-face{font-family:Poppins;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/poppins-400.woff2) format('woff2')}
@font-face{font-family:Poppins;font-style:normal;font-weight:500;font-display:swap;src:url(fonts/poppins-500.woff2) format('woff2')}
@font-face{font-family:Poppins;font-style:normal;font-weight:600;font-display:swap;src:url(fonts/poppins-600.woff2) format('woff2')}
@font-face{font-family:Poppins;font-style:normal;font-weight:700;font-display:swap;src:url(fonts/poppins-700.woff2) format('woff2')}

:root{--navy:#0d1b3e;--navy2:#13265a;--navy3:#1c3270;--green:#16a34a;--green2:#22c55e;--greenbg:#e8f7ee;--red:#dc2626;--redbg:#fdecec;--amber:#d97706;--amberbg:#fff4e0;--blue:#2563eb;--bluebg:#e8efff;--ink:#0f172a;--mute:#64748b;--line:#e2e8f0;--bg:#f4f6fa;--card:#fff;--r:14px;--sh:0 1px 2px rgba(15,23,42,.06),0 4px 14px rgba(15,23,42,.05)}
*{box-sizing:border-box}svg{width:18px;height:18px;flex:none;vertical-align:-3px}html,body{margin:0;padding:0}
body{font-family:Poppins,"Noto Sans Telugu","Nirmala UI",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:var(--bg);font-size:15px;line-height:1.5;-webkit-tap-highlight-color:transparent}
body.te{font-family:"Noto Sans Telugu","Nirmala UI",Gautami,Poppins,system-ui,sans-serif}
a{color:var(--blue);text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{line-height:1.25;margin:0 0 .4em}h1{font-size:1.6rem}h2{font-size:1.2rem}h3{font-size:1.02rem}
.hidden{display:none!important}.mute{color:var(--mute)}.small{font-size:.84rem}.tiny{font-size:.74rem}.right{text-align:right}.center{text-align:center}.nowrap{white-space:nowrap}
.layout{display:flex;min-height:100vh}
.side{width:262px;background:var(--navy);color:#cfd8ee;position:fixed;inset:0 auto 0 0;display:flex;flex-direction:column;z-index:40;overflow-y:auto}
.brand{display:flex;gap:12px;align-items:center;padding:20px 18px 16px;border-bottom:1px solid rgba(255,255,255,.08)}
.crest{width:46px;height:46px;border-radius:50%;background:#fff;display:grid;place-items:center;flex:none;box-shadow:0 0 0 3px var(--green2)}
.crest svg{width:40px!important;height:40px!important}
.brand b{color:#fff;display:block;font-size:1.05rem}.brand span{font-size:.72rem;color:#9fb0d6;display:block;line-height:1.3}
.nav{padding:10px 10px;flex:1}.nav a{display:flex;align-items:center;gap:12px;padding:11px 14px;color:#cfd8ee;border-radius:10px;margin:2px 0;font-size:.93rem}
.nav a svg{width:19px;height:19px;flex:none;opacity:.9}.nav a:hover{background:var(--navy2);color:#fff}
.nav a.on{background:var(--green);color:#fff;font-weight:600}.nav .sep{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:#7286b8;padding:14px 14px 4px}
.nav .badge{margin-left:auto;background:#f59e0b;color:#1f1300;border-radius:20px;font-size:.7rem;padding:1px 8px;font-weight:600}
.sidefoot{padding:14px 16px;border-top:1px solid rgba(255,255,255,.08);font-size:.78rem;color:#93a3c9}
.langsw{display:inline-flex;background:var(--navy2);border-radius:20px;padding:3px}.langsw button{border:0;background:none;color:#cfd8ee;padding:5px 12px;border-radius:16px;cursor:pointer;font-size:.8rem}.langsw button.on{background:var(--green);color:#fff}
.main{margin-left:262px;flex:1;min-width:0;display:flex;flex-direction:column}
.top{display:none;position:sticky;top:0;z-index:30;background:var(--navy);color:#fff;padding:10px 12px;align-items:center;gap:10px}
.top .t{font-weight:600;flex:1;font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.iconbtn{border:0;background:transparent;color:inherit;width:40px;height:40px;border-radius:10px;display:grid;place-items:center;cursor:pointer}.iconbtn svg{width:22px;height:22px}
.deskbar{display:flex;align-items:center;gap:12px;padding:12px 28px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.deskbar .search{flex:1;max-width:460px;position:relative}.deskbar .search input{width:100%;padding:9px 12px 9px 38px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}
.deskbar .search svg{position:absolute;left:11px;top:10px;width:18px;height:18px;color:var(--mute)}
.who{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:.86rem}.avatar{width:34px;height:34px;border-radius:50%;background:var(--greenbg);color:var(--green);display:grid;place-items:center;font-weight:700}
.content{padding:24px 28px 110px;max-width:1240px;width:100%}
.banner{background:var(--amberbg);color:#7a4300;padding:9px 14px;border-radius:10px;font-size:.86rem;margin-bottom:12px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.banner.red{background:var(--redbg);color:#8a1212}.banner.blue{background:var(--bluebg);color:#173c8f}.banner.green{background:var(--greenbg);color:#0d5a2a}
.demo-strip{background:#fff7d6;color:#6b5200;font-size:.78rem;text-align:center;padding:5px 10px;border-bottom:1px solid #f1e2a0}
.card{background:var(--card);border-radius:var(--r);box-shadow:var(--sh);padding:18px;margin-bottom:16px;border:1px solid #edf0f5}
.card h2{display:flex;align-items:center;gap:8px}.card h2 svg{width:20px;height:20px;color:var(--green)}.card .head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.grid{display:grid;gap:14px}.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.kpi{background:#fff;border-radius:var(--r);padding:16px;box-shadow:var(--sh);border:1px solid #edf0f5;display:flex;gap:12px;align-items:center}
.kpi .ic{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;flex:none}.kpi .ic svg{width:24px;height:24px}
.kpi b{font-size:1.45rem;display:block;line-height:1.1}.kpi span{font-size:.8rem;color:var(--mute)}
.ic.g{background:var(--greenbg);color:var(--green)}.ic.r{background:var(--redbg);color:var(--red)}.ic.a{background:var(--amberbg);color:var(--amber)}.ic.b{background:var(--bluebg);color:var(--blue)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:#fff;color:var(--ink);padding:10px 16px;border-radius:10px;cursor:pointer;font-weight:500;font-size:.92rem;min-height:42px;text-decoration:none;white-space:nowrap}
.btn svg{width:18px;height:18px}.btn:hover{border-color:#cbd5e1}.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.pri{background:var(--green);border-color:var(--green);color:#fff}.btn.pri:hover{background:#12873d}
.btn.navy{background:var(--navy);border-color:var(--navy);color:#fff}.btn.red{background:#fff;border-color:#f3b4b4;color:var(--red)}.btn.wa{background:#25d366;border-color:#25d366;color:#053b1c;font-weight:600}
.btn.big{min-height:52px;font-size:1rem;padding:12px 22px;border-radius:12px}.btn.sm{min-height:34px;padding:6px 11px;font-size:.82rem}.btn.block{width:100%}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.row.between{justify-content:space-between}.grow{flex:1}
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}.chips::-webkit-scrollbar{display:none}
.chip{border:1px solid var(--line);background:#fff;border-radius:20px;padding:7px 14px;white-space:nowrap;cursor:pointer;font-size:.86rem;font-weight:500}.chip.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.chip .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;background:#cbd5e1}.chip .dot.ok{background:var(--green2)}
label.f{display:block;font-size:.8rem;color:var(--mute);margin:10px 0 4px;font-weight:500}
input.i,select.i,textarea.i{width:100%;padding:11px 12px;border:1px solid #cfd7e3;border-radius:10px;background:#fff;font-size:16px}
textarea.i{min-height:110px;resize:vertical}input.i:focus,select.i:focus,textarea.i:focus{outline:2px solid #86efac;border-color:var(--green)}
.i.bad{border-color:var(--red);background:#fff6f6}.err{color:var(--red);font-size:.82rem;margin-top:4px}
table.t{width:100%;border-collapse:collapse;font-size:.88rem}table.t th{text-align:left;color:var(--mute);font-weight:500;font-size:.78rem;border-bottom:1px solid var(--line);padding:8px 8px;white-space:nowrap;background:#fafbfd;position:sticky;top:0}
table.t td{border-bottom:1px solid #eef1f6;padding:9px 8px;vertical-align:middle}table.t tr.click{cursor:pointer}table.t tr.click:hover td{background:#f8fafc}
.tablewrap{overflow:auto;max-width:100%;border-radius:10px;border:1px solid var(--line)}
.pill{display:inline-block;border-radius:20px;padding:2px 10px;font-size:.75rem;font-weight:600;white-space:nowrap}
.pill.P{background:var(--greenbg);color:#0d7a35}.pill.A{background:var(--redbg);color:var(--red)}.pill.L{background:var(--amberbg);color:#9a5200}.pill.LV{background:var(--bluebg);color:var(--blue)}
.pill.pending{background:var(--amberbg);color:#9a5200}.pill.opened{background:var(--greenbg);color:#0d7a35}.pill.skipped,.pill.cancelled{background:#eef1f6;color:var(--mute)}.pill.low{background:var(--redbg);color:var(--red)}.pill.gray{background:#eef1f6;color:#475569}
/* attendance */
.attbar{position:sticky;top:61px;z-index:15;background:var(--bg);padding:10px 0}
.counts{display:flex;gap:8px;flex-wrap:wrap}.counts span{background:#fff;border:1px solid var(--line);border-radius:10px;padding:6px 12px;font-size:.86rem}.counts b{font-size:1rem}
.stu{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#fff;border:1px solid #edf0f5;border-radius:12px;margin-bottom:8px;transition:background .15s}
.stu.A{background:#fff3f3;border-color:#f6c9c9}.stu.L{background:#fffaf0;border-color:#f6dfb2}.stu.LV{background:#f3f7ff;border-color:#cfdcfb}
.roll{width:36px;height:36px;border-radius:50%;background:var(--bg);display:grid;place-items:center;font-weight:600;font-size:.86rem;flex:none}
.stu .nm{flex:1;min-width:0;cursor:pointer}.stu .nm b{display:block;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stu .nm small{color:var(--mute);font-size:.74rem}
.seg{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;flex:none}.seg button{border:0;background:#fff;width:44px;height:40px;font-weight:600;font-size:.82rem;cursor:pointer;color:#64748b;border-left:1px solid var(--line)}.seg button:first-child{border-left:0}
.seg button.on.P{background:var(--green);color:#fff}.seg button.on.A{background:var(--red);color:#fff}.seg button.on.L{background:var(--amber);color:#fff}.seg button.on.LV{background:var(--blue);color:#fff}
.savebar{position:fixed;left:262px;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);padding:12px 28px;display:flex;gap:10px;align-items:center;z-index:25;box-shadow:0 -4px 14px rgba(15,23,42,.06)}
/* marks */
.mk{width:90px;text-align:center;padding:9px 6px;border:1px solid #cfd7e3;border-radius:9px;font-size:16px;font-weight:600}.mk.bad{border-color:var(--red);background:#fff2f2;color:var(--red)}.mk.ab{background:#eef1f6;color:var(--mute)}
/* charts */
.chart{width:100%!important;height:auto!important;display:block}.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:.78rem;color:var(--mute)}.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.bars .b{display:flex;align-items:center;gap:8px;margin:6px 0;font-size:.84rem}.bars .b span:first-child{width:130px;flex:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bars .track{flex:1;background:#eef1f6;border-radius:6px;height:12px;overflow:hidden}.bars .fill{height:100%;border-radius:6px;background:var(--green)}.bars .v{width:48px;text-align:right;font-weight:600}
.heat td.h{text-align:center;font-weight:600;border-radius:0}
.ring{--p:0;width:84px;height:84px;border-radius:50%;background:conic-gradient(var(--c,var(--green)) calc(var(--p)*1%),#e8edf3 0);display:grid;place-items:center;flex:none}.ring b{width:64px;height:64px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:1rem}
.dots{display:flex;flex-wrap:wrap;gap:4px}.dots i{width:16px;height:16px;border-radius:4px;display:block;background:#e2e8f0}.dots i.P{background:#4ade80}.dots i.A{background:#f87171}.dots i.L{background:#fbbf24}.dots i.LV{background:#93c5fd}
/* modal + toast */
.modal{position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:60;display:flex;align-items:center;justify-content:center;padding:16px}
.sheet{background:#fff;border-radius:18px;width:100%;max-width:560px;max-height:92vh;overflow:auto;padding:20px;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.sheet .x{float:right}
.toast{position:fixed;left:50%;bottom:92px;transform:translateX(-50%) translateY(20px);background:#0f172a;color:#fff;padding:12px 16px;border-radius:12px;z-index:80;opacity:0;pointer-events:none;transition:.2s;display:flex;gap:14px;align-items:center;max-width:92vw;font-size:.9rem}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto}.toast button{background:none;border:0;color:#86efac;font-weight:700;cursor:pointer;padding:4px}
.msgcard{border:2px solid #bbf7d0;border-radius:16px;padding:16px;background:#fbfffc}.msgcard .to{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:10px}
.phonechip{display:inline-block;background:#eef1f6;border-radius:8px;padding:4px 10px;font-weight:600;margin:3px 4px 0 0;cursor:pointer;border:2px solid transparent}.phonechip.on{border-color:var(--green);background:var(--greenbg)}
.progress{height:8px;background:#e2e8f0;border-radius:6px;overflow:hidden}.progress i{display:block;height:100%;background:var(--green)}
.empty{text-align:center;color:var(--mute);padding:30px 10px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:14px;overflow-x:auto}.tabs button{border:0;background:none;padding:10px 14px;cursor:pointer;color:var(--mute);font-weight:500;border-bottom:3px solid transparent;white-space:nowrap}.tabs button.on{color:var(--navy);border-color:var(--green)}
.bottomnav{display:none}
/* public site */
.hero{position:relative;min-height:440px;border-radius:0;overflow:hidden;color:#fff;display:flex;align-items:flex-end;background:#2d3e2f center/cover no-repeat}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,27,62,.25) 0%,rgba(13,27,62,.55) 45%,rgba(13,27,62,.92))}
.hero .in{position:relative;padding:40px;max-width:760px}.hero h1{font-size:2.5rem;margin:0}.hero p{font-size:1.05rem;color:#e5ecff;margin:.4em 0 1.2em}
.hero .tag{display:inline-block;background:rgba(34,197,94,.9);color:#fff;font-size:.78rem;padding:4px 12px;border-radius:20px;margin-bottom:12px;font-weight:600}
.pub{padding:28px;max-width:1100px}.pub .card p{color:#334155}.feat{display:flex;gap:12px}.feat .ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;flex:none}.feat .ic svg{width:22px;height:22px}
.stat{text-align:center;padding:18px}.stat b{display:block;font-size:2rem;color:var(--navy)}.stat span{color:var(--mute);font-size:.86rem}
.photo{border-radius:14px;width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:#dfe6ee}
.loginbox{max-width:440px;margin:30px auto}.roles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:8px 0 6px}.roles button{border:1px solid var(--line);background:#fff;border-radius:12px;padding:12px 6px;cursor:pointer;font-size:.82rem;font-weight:500;display:flex;flex-direction:column;align-items:center;gap:6px}.roles button svg{width:24px;height:24px;color:var(--navy)}.roles button:hover{border-color:var(--green);background:var(--greenbg)}
.spinner{width:22px;height:22px;border:3px solid #cbd5e1;border-top-color:var(--green);border-radius:50%;animation:sp 0.8s linear infinite;margin:30px auto}@keyframes sp{to{transform:rotate(360deg)}}
.reg td,.reg th{padding:5px 4px!important;text-align:center;font-size:.76rem}.reg td.n,.reg th.n{text-align:left;position:sticky;left:0;background:#fff;z-index:2;min-width:150px}.reg td.c{font-weight:700}.reg td.c.A{color:var(--red);background:#fff0f0}.reg td.c.L{color:var(--amber)}.reg td.c.LV{color:var(--blue)}.reg td.c.P{color:#16a34a}
@media (max-width:900px){
 .side{transform:translateX(-100%);transition:transform .2s;width:280px;box-shadow:0 0 40px rgba(0,0,0,.3)}.side.open{transform:none}
 .main{margin-left:0}.top{display:flex}.deskbar{display:none}
 .content{padding:14px 12px 150px}.pub{padding:14px 12px 40px}
 .g4{grid-template-columns:repeat(2,minmax(0,1fr))}.g3,.g2{grid-template-columns:1fr}
 .kpi{padding:12px;gap:10px}.kpi .ic{width:38px;height:38px}.kpi b{font-size:1.2rem}
 .savebar{left:0;bottom:62px;padding:10px 12px}
 .bottomnav{display:flex;position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--line);z-index:30;padding-bottom:env(safe-area-inset-bottom)}
 .bottomnav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:7px 2px 8px;color:#64748b;font-size:.68rem;position:relative}.bottomnav a svg{width:22px;height:22px}.bottomnav a.on{color:var(--green);font-weight:600}
 .bottomnav .badge{position:absolute;top:3px;left:55%;background:#f59e0b;color:#1f1300;border-radius:10px;font-size:.62rem;padding:0 5px;font-weight:700}
 .hero{min-height:360px}.hero .in{padding:22px}.hero h1{font-size:1.8rem}
 .seg button{width:40px;height:42px}.attbar{top:60px;padding:6px 0}.counts{flex-wrap:nowrap;overflow-x:auto;gap:6px}.counts span{padding:4px 8px;font-size:.8rem;white-space:nowrap}.stu{padding:8px 8px}.stu .nm b{font-size:.92rem}
 h1{font-size:1.3rem}.toast{bottom:140px}
 .hide-m{display:none!important}
}
@media (min-width:901px){.hide-d{display:none!important}}
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:35}
@media print{.side,.top,.deskbar,.bottomnav,.savebar,.noprint,.demo-strip,.toast{display:none!important}.main{margin:0}.content{padding:0;max-width:none}.card{box-shadow:none;border:1px solid #ccc;break-inside:avoid}body{background:#fff;font-size:12px}.tablewrap{overflow:visible;border:0}table.t th{position:static}}

.empty svg{width:34px;height:34px;color:var(--green)}.hero{background-position:center 70%}

/* ---- second pass (Nov 3): bigger tap targets, phone and tablet layout fixes ---- */
.btn.sm{min-height:40px;min-width:40px}
.langsw button{min-height:34px;padding:6px 14px}
input[type=checkbox]{width:20px;height:20px;accent-color:var(--green);vertical-align:middle;margin:0}
table.t td input[type=checkbox],table.t th input[type=checkbox]{width:22px;height:22px}
label.chk{display:inline-flex;align-items:center;gap:8px;min-height:40px;cursor:pointer}
.head a.small,a.small{display:inline-flex;align-items:center;gap:6px;min-height:40px}
.chip{min-height:40px}
.counts .cnt{display:inline-flex;align-items:center;gap:6px}
.big-banner{font-size:1rem;padding:12px 14px}
.pmsg{border-top:1px solid var(--line);padding:10px 0}.pmsg:first-of-type{border-top:0}
.content{max-width:1480px}
/* tablet landscape and small laptops: slimmer sidebar, 2 column cards */
@media (min-width:901px) and (max-width:1180px){
 .side{width:220px}.main{margin-left:220px}.savebar{left:220px}
 .g4{grid-template-columns:repeat(2,minmax(0,1fr))}
 .content{padding:20px 20px 110px}
}
/* laptop: attendance in two columns so 40 children fit without long scrolling */
@media (min-width:1200px){
 #attlist{display:grid;grid-template-columns:1fr 1fr;column-gap:10px}
}
@media (max-width:900px){
 .chips{flex-wrap:wrap;overflow:visible}
 .tabs{flex-wrap:wrap}
 .bottomnav a{font-size:.75rem}
 .fullm{flex-basis:100%;max-width:none!important}
 .stu .nm b{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.25}
 .stu .nm small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .counts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:visible;gap:6px}
 .counts span.cnt{justify-content:center;flex-direction:column;gap:2px;padding:6px 2px;text-align:center;font-size:.78rem}
}
@media (max-width:380px){
 .seg button{width:36px}
 .stu{gap:7px}
 .roll{width:30px;height:30px;font-size:.8rem}
}

.iconbtn{flex:none}
table.reg td.n a{display:block;padding:8px 0}

@media (max-width:900px){.g3,.g2{grid-template-columns:minmax(0,1fr)}}
.grid>*{min-width:0}

.printonly{display:none}
@media print{.printonly{display:block}table.t th.hide-m,table.t td.hide-m{display:table-cell!important}.hide-d{display:none!important}.content{padding:0!important}.savebar,.bottomnav{display:none!important}}