*{box-sizing:border-box}body{margin:0;font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#f5f7fb;color:#1e293b}
a{color:inherit;text-decoration:none}h2{margin:0}
.top{display:flex;align-items:center;gap:16px;background:#fff;padding:10px 20px;border-bottom:1px solid #e2e8f0;position:sticky;top:0;z-index:5;flex-wrap:wrap}
.top img{height:38px}.top b{font-size:16px}.top nav{display:flex;gap:4px;flex:1;flex-wrap:wrap}
.top nav a{padding:7px 12px;border-radius:8px;color:#475569}.top nav a.on,.top nav a:hover{background:#eef2ff;color:#3730a3}
main{padding:20px;max-width:1200px;margin:auto}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-bottom:20px}
.card{position:relative;overflow:hidden;color:#fff;border-radius:18px;padding:18px;min-height:130px;display:block}
.card:after{content:"";position:absolute;right:-24px;top:-24px;width:90px;height:90px;border-radius:50%;background:rgba(255,255,255,.15)}
.card .t{font-weight:600}.card .v{font-size:30px;font-weight:800;margin:8px 0 2px}.card .s{font-size:12px;opacity:.9}
.blue{background:linear-gradient(135deg,#3b82f6,#2563eb)}.slate{background:linear-gradient(135deg,#64748b,#334155)}
.green{background:linear-gradient(135deg,#22c55e,#16a34a)}.purple{background:linear-gradient(135deg,#8b5cf6,#6d28d9)}
.orange{background:linear-gradient(135deg,#f59e0b,#ea580c)}.red{background:linear-gradient(135deg,#ef4444,#dc2626)}
.box{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:16px;margin-bottom:16px}
.bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:end}
input,select,textarea{padding:8px 10px;border:1px solid #cbd5e1;border-radius:8px;font:inherit;background:#fff;min-width:0}
label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#475569;font-weight:600}
button,.btn{padding:8px 14px;border:0;border-radius:8px;background:#4f46e5;color:#fff;font:inherit;font-weight:600;cursor:pointer;display:inline-block}
button.ghost,.btn.ghost{background:#e2e8f0;color:#1e293b}button.red{background:#dc2626}button.green{background:#16a34a}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
table{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden}
th,td{padding:9px 12px;text-align:left;border-bottom:1px solid #eef2f7}th{background:#f1f5f9;font-size:12px;color:#475569}
tr[data-href]{cursor:pointer}tr[data-href]:hover{background:#f8fafc}.r{text-align:right}.due{color:#dc2626;font-weight:700}.ok{color:#16a34a;font-weight:700}
.wrap{overflow-x:auto;border-radius:12px;border:1px solid #e2e8f0}.pager{display:flex;gap:10px;align-items:center;justify-content:center;margin:14px}
.item{display:grid;grid-template-columns:170px 1fr 130px 40px;gap:8px;margin-bottom:8px}
.tot{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}.tot div{background:#f1f5f9;border-radius:10px;padding:10px}.tot b{display:block;font-size:18px}
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#0f172a;color:#fff;padding:10px 18px;border-radius:10px;z-index:99}.toast.bad{background:#b91c1c}
.err{background:#fef2f2;color:#b91c1c;padding:10px;border-radius:8px;margin-bottom:10px}
.login{max-width:360px;margin:12vh auto;text-align:center}.login img{height:90px}.login form{display:grid;gap:10px;text-align:left;margin-top:16px}
@media(max-width:700px){.item{grid-template-columns:1fr 1fr}.item input:nth-child(2){grid-column:1/3}main{padding:12px}}
@media print{.noprint,.top{display:none!important}body{background:#fff}main{padding:0}}


/* v5: student photo, profile */
.ph{width:96px;height:120px;object-fit:cover;border:1px solid #cbd5e1;border-radius:8px;background:#f1f5f9;display:block}
.ph.none{display:flex;align-items:center;justify-content:center;font-size:11px;color:#94a3b8}
.prof{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}.prof .pc{display:flex;flex-direction:column;gap:6px}
#phv .ph{width:72px;height:90px}

/* v6: student status colours, showcase items, print list, footer */
tr.st-passed td{background:#dcfce7}tr.st-left td{background:#fee2e2}
tr.st-passed:hover td{background:#bbf7d0}tr.st-left:hover td{background:#fecaca}
.sthead{padding:10px 14px;border-radius:12px;border:1px solid transparent}
.sthead.st-passed{background:#dcfce7;border-color:#86efac}.sthead.st-left{background:#fee2e2;border-color:#fca5a5}
.badge{font-size:12px;font-weight:700;padding:2px 9px;border-radius:99px;background:#fff;vertical-align:middle}
.sthead.st-passed .badge{color:#15803d}.sthead.st-left .badge{color:#b91c1c}
.item.sc{grid-template-columns:170px 1fr 130px 150px 40px}
.hint{font-size:12px;color:#64748b;margin:6px 0 0}
.prt{background:#fff;padding:16px;border:1px solid #e2e8f0;border-radius:12px;page:list}
.prt table{border:1px solid #000;border-radius:0}.prt th,.prt td{border:1px solid #000;padding:4px 7px;font-size:12px;color:#000;background:#fff}.prt tr.gt td{background:#f1f5f9}
.zt{text-align:center;padding:18px 12px;font-size:12px;color:#64748b}.zt a{color:#4f46e5;font-weight:700}.zt a:hover{text-decoration:underline}
@media(max-width:700px){.item.sc{grid-template-columns:1fr 1fr}}
@page list{size:A4 landscape;margin:10mm}
@media print{.prt{border:0;padding:0}.zt{display:none!important}}

/* v8 receipt: A4 portrait, larger text (~15-16px) - receipt on the top half, terms + next due schedule on the bottom half */
.sheet{width:210mm;height:297mm;max-width:100%;margin:0 auto 20px;background:#fff;color:#111;box-shadow:0 2px 14px rgba(15,23,42,.18);-webkit-print-color-adjust:exact;print-color-adjust:exact;font:10.5pt/1.35 system-ui,"Nirmala UI","Mangal","Noto Sans Devanagari",sans-serif;overflow:hidden}
.sheet *{box-sizing:border-box}
.sheet .half{height:148.5mm;padding:7mm 10mm 5mm;overflow:hidden}
.sheet .rbot{border-top:1.5px dashed #7b8794;padding-top:5mm}
.sheet .hd{display:flex;align-items:center;gap:4mm;border-bottom:2px solid #1e3a5f;padding-bottom:2.5mm}.sheet .lg{height:18mm;width:auto}
.sheet .nm{flex:1;text-align:center}.sheet .nm h1{margin:0;font-size:16pt;line-height:1.15;letter-spacing:.3px;color:#1e3a5f;text-transform:uppercase}
.sheet .tg{font-weight:600;font-size:10.5pt}.sheet .ad{font-size:10pt;color:#333}
.sheet .rb{text-align:right;font-size:10.5pt;white-space:nowrap;line-height:1.4}.sheet .rb b{font-size:10.5pt}
.sheet .tt{background:#1e3a5f;color:#fff;font-weight:700;padding:1mm 3mm;border-radius:1.2mm;margin-bottom:1.2mm;font-size:10.5pt;letter-spacing:.3px;text-align:center}
.sheet .info{display:grid;grid-template-columns:1fr 1fr;gap:1.5mm 6mm;margin:3.5mm 0}
.sheet .info div{display:flex;gap:2mm;border-bottom:1px solid #aab4bf;padding-bottom:.8mm;min-height:6.5mm;align-items:baseline}.sheet .info span{color:#475569;font-size:10pt;white-space:nowrap}.sheet .info b{font-size:11pt}
.sheet table{width:100%;border-collapse:collapse;border:0;border-radius:0;overflow:visible;background:none}
.sheet .it th,.sheet .it td{border:1px solid #5b6772;padding:.8mm 2.5mm;font-size:10.5pt;color:#111;background:#fff;height:7mm;line-height:1.3}.sheet .it th{background:#e6ecf3;color:#1e3a5f;font-size:10.5pt}
.sheet .c{text-align:center}.sheet .r{text-align:right}.sheet .note{font-size:9pt;color:#444;margin-top:1mm}
.sheet .bt{display:flex;gap:5mm;margin-top:3.5mm;align-items:stretch}.sheet .lf{flex:1;display:flex;flex-direction:column;justify-content:space-between;font-size:10.5pt;line-height:1.4}.sheet .lf b{font-size:10.5pt}
.sheet .sm{width:72mm;flex:none}.sheet .sm td{border:1px solid #5b6772;padding:.8mm 2.5mm;font-size:10.5pt;background:#fff;color:#111}.sheet .sm tr.b td{font-weight:700;background:#f1f5f9}.sheet .sm tr.d td{font-weight:700;background:#e6ecf3;color:#1e3a5f}
.sheet .sg{text-align:center;font-size:10pt;white-space:pre-line;border-top:1px solid #333;padding-top:1mm;margin-top:6mm;width:60mm}
.sheet .th{font-weight:700;font-size:11pt;text-decoration:underline;margin-bottom:2mm;color:#1e3a5f}.sheet .tl{font-size:10.5pt;line-height:1.4;margin-bottom:1.2mm}
.sheet .sch{margin-top:3mm;border:1px solid #5b6772;border-radius:1.2mm}.sheet .sh{background:#e6ecf3;color:#1e3a5f;font-weight:700;padding:1mm 3mm;font-size:10.5pt;border-bottom:1px solid #5b6772}
.sheet .sb{display:flex;justify-content:space-between;align-items:flex-end;padding:2mm 3.5mm}.sheet .sl div{font-size:11pt;margin:.8mm 0}.sheet .sl span{display:inline-block;width:26mm;color:#333}.sheet .sl b{border-bottom:1px dotted #333;min-width:42mm;display:inline-block;font-size:11pt}
.sheet .ss{font-size:10pt;color:#333;border-top:1px solid #333;padding-top:.8mm;min-width:48mm;text-align:center}.sheet .rbot.empty{border:0}.sheet .rbot.empty>*{display:none}.sheet .sch.nb{border:0;margin-top:0}.sheet .nt{margin-top:3mm;font-size:10.5pt;line-height:1.4}
.sheet.dense{font-size:10pt}.sheet.dense .rtop{padding-top:5mm;padding-bottom:3mm}.sheet.dense .info{margin:2mm 0}.sheet.dense .bt{margin-top:2mm}.sheet.dense .sg{margin-top:3mm}.sheet.dense .it th,.sheet.dense .it td{height:5mm;padding:.2mm 2.5mm;font-size:10pt}.sheet.dense .sm td{padding:.4mm 2.5mm;font-size:10pt}
@media screen and (max-width:900px){.sheet{zoom:.45;max-width:none}}
@page receipt{size:A4 portrait;margin:0}
.sheet{page:receipt}
@media print{@page{size:A4 portrait;margin:0}body{background:#fff}.sheet{box-shadow:none;margin:0;width:210mm;height:297mm;zoom:1}main{padding:0;max-width:none}}

/* v8: report, debits, payments print */
.prt tr.cr td{background:#dcfce7}.prt tr.db td{background:#fee2e2}.prt tr.gt td{background:#f1f5f9}
.prt tr[data-href]:hover td{filter:brightness(.97)}
.prt,.prt *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
.rep .bal{display:flex;justify-content:space-between;gap:12px;margin:0 0 10px}
.rep .bal>div{flex:1;border:1px solid #000;padding:6px 10px;border-radius:6px}.rep .bal small{display:block;color:#475569}.rep .bal b{font-size:18px}.rep .bal .rt{text-align:right}
.rsum{margin-top:12px}
@media print{.prt .noprint{display:none!important}}

.btn.sm,button.sm{padding:4px 10px;font-size:12px;border-radius:6px}
.teal{background:linear-gradient(135deg,#14b8a6,#0f766e)}
.cm{position:relative;min-width:190px}.cm summary{padding:8px 10px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;cursor:pointer;font-weight:400;color:#1e293b;list-style:none}.cm summary::-webkit-details-marker{display:none}.cm summary:after{content:' \25BE';float:right}
.cml{position:absolute;z-index:30;top:100%;left:0;margin-top:4px;background:#fff;border:1px solid #cbd5e1;border-radius:10px;padding:8px 10px;max-height:260px;overflow:auto;min-width:230px;box-shadow:0 8px 24px rgba(0,0,0,.15)}.cml label{flex-direction:row;align-items:center;gap:8px;padding:4px 0;white-space:nowrap;font-weight:500;color:#1e293b;font-size:13px}
.fl{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#475569;font-weight:600}
/* ---- print student details (shared by FM + STMS) ---- */
#spv{display:none}
@media print{
  body.printing-student #app,body.printing-student .zt,body.printing-student .toast{display:none!important}
  body.printing-student #spv{display:block;color:#000;background:#fff;font-size:12px;font-family:"Segoe UI",Arial,"Noto Sans Devanagari","Mangal",sans-serif}
  @page{size:A4 portrait;margin:12mm}
  #spv,#spv *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  #spv .sp-head{display:flex;align-items:center;gap:14px;border-bottom:2px solid #000;padding-bottom:8px;margin-bottom:12px}
  #spv .sp-head img{height:64px;width:auto}#spv h1{margin:0;font-size:22px}#spv h2{margin:2px 0 0;font-size:14px;font-weight:600;color:#333}
  #spv .sp-top{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
  #spv .sp-name{flex:1}#spv .sp-name h3{margin:0 0 8px;font-size:18px}
  #spv .sp-photo{width:34mm;height:42mm;border:1px solid #000;display:flex;align-items:center;justify-content:center;color:#888;overflow:hidden;flex:none}
  #spv .sp-photo img{width:100%;height:100%;object-fit:cover}
  #spv table{width:100%;border-collapse:collapse}
  #spv .sp-kv th{text-align:left;width:34%;padding:3px 6px;font-weight:600;border:1px solid #999;background:#f1f5f9}#spv .sp-kv td{padding:3px 6px;border:1px solid #999}
  #spv .sp-sec{margin:16px 0 6px;font-size:14px;border-bottom:1px solid #000;padding-bottom:3px}
  #spv .spc{margin-bottom:10px;page-break-inside:avoid}#spv .spc-h{font-size:13px}#spv .spc-h span{color:#444;font-size:11px;margin-left:6px}
  #spv .spc-h .spc-done{background:#dcfce7;color:#166534;font-weight:700;padding:1px 6px;border-radius:4px}
  #spv .spc-n{margin:3px 0 5px;color:#333}
  #spv .spc th,#spv .spc td{border:1px solid #000;padding:3px 6px;text-align:left;font-size:11px}#spv .spc th{background:#e2e8f0}
  #spv td.st-completed{color:#166534;font-weight:700}#spv td.st-unlocked{color:#1d4ed8}#spv td.st-locked{color:#555}
  #spv .sp-decl{margin-top:22px;page-break-inside:avoid;border:1px solid #000;padding:10px 12px}
  #spv .sp-decl h3{margin:0 0 6px;font-size:14px}#spv .sp-decl p{margin:0;font-size:13px;line-height:1.7}
  #spv .sp-sign{display:flex;justify-content:space-between;gap:18px;margin-top:48px;text-align:center;font-size:11px}
  #spv .sp-sign div{flex:1}#spv .sp-sign span{display:block;border-top:1px solid #000;margin-bottom:4px}
}
button.wa,.btn.wa{background:#25d366;color:#fff}.lk{font-size:11px;font-weight:700;color:#b91c1c}.rml{font-size:11px;margin-top:2px}

/* v30 ultra polish: design only, no functionality changes */
:root{
  --ui-bg:#f3f7ff;
  --ui-bg-2:#eef3fb;
  --ui-surface:#ffffff;
  --ui-surface-2:#f8fbff;
  --ui-line:#d7e2f0;
  --ui-line-strong:#c3d3e7;
  --ui-text:#163154;
  --ui-muted:#5d7191;
  --ui-primary:#2f63d7;
  --ui-primary-2:#214eb5;
  --ui-green:#1a9758;
  --ui-green-bg:#e7f7ee;
  --ui-red:#c73a4d;
  --ui-red-bg:#fbeaec;
  --shadow-sm:0 4px 18px rgba(24,55,99,.06);
  --shadow-md:0 10px 30px rgba(24,55,99,.10);
  --shadow-lg:0 18px 40px rgba(24,55,99,.14);
}
html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(circle at top right, rgba(47,99,215,.06), transparent 30%),
    linear-gradient(180deg,var(--ui-bg) 0%, var(--ui-bg-2) 100%);
  color:var(--ui-text);
}
a,button,input,select,textarea,.btn,.card,.box,.ptile,.cc,.top nav a,.wrap,table,.toast{transition:background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease,opacity .18s ease}
:focus-visible{outline:3px solid rgba(47,99,215,.22);outline-offset:2px}
.top{
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(199,213,229,.9);
  box-shadow:0 10px 28px rgba(25,55,99,.06);
}
.top b{font-size:17px;color:#183766;letter-spacing:.15px}
.top nav{gap:8px}
.top nav a{
  border:1px solid transparent;
  font-weight:700;
  padding:9px 14px;
  position:relative;
}
.top nav a.on,.top nav a:hover{
  background:linear-gradient(180deg,#f5f9ff,#e7efff);
  color:#214eb5;
  border-color:#bcd0fb;
  box-shadow:inset 0 0 0 1px rgba(47,99,215,.04), 0 6px 14px rgba(47,99,215,.10);
}
main{max-width:1280px;padding:24px}
h2{color:#1e3f73;letter-spacing:.15px}
.bar h2{position:relative;padding-left:16px}
.bar h2::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:5px;border-radius:999px;background:linear-gradient(180deg,#5c89ec,#2f63d7)}
.cards{gap:18px}
.card{
  min-height:138px;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:var(--shadow-md);
  border-radius:22px;
}
.card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.08),transparent 50%);pointer-events:none}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.card .t{font-size:13px;letter-spacing:.25px;text-transform:uppercase;opacity:.95}
.card .v{font-size:32px;line-height:1.1}
.box,.wrap,table,.cc,.lockscr .lkc div,.ptile,.idc,.popc{
  border-color:var(--ui-line);
  box-shadow:var(--shadow-sm);
}
.box,.cc{
  background:rgba(255,255,255,.96);
  border-radius:18px;
  padding:18px;
}
.box>h3:first-child{margin:0 0 14px;color:#8e2f41;font-size:15px}
.wrap{
  background:#fff;
  overflow:auto;
  border-radius:18px;
  box-shadow:var(--shadow-sm);
  -webkit-overflow-scrolling:touch;
}
.wrap table{min-width:680px}
.grid{gap:14px}
.row{gap:10px}
label{font-size:12px;letter-spacing:.2px;color:#4f6486}
input,select,textarea{
  min-height:42px;
  border:1px solid var(--ui-line-strong);
  border-radius:12px;
  color:var(--ui-text);
  background:linear-gradient(180deg,#fff,#fbfdff);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.9);
}
textarea{min-height:96px}
input::placeholder,textarea::placeholder{color:#8ea0bd}
input:hover,select:hover,textarea:hover{border-color:#abc2eb}
input:focus,select:focus,textarea:focus{
  border-color:#7ea4ef;
  box-shadow:0 0 0 4px rgba(47,99,215,.10);
  outline:none;
}
button,.btn{
  min-height:42px;
  border-radius:12px;
  background:linear-gradient(180deg,#3e71e6,#2f63d7);
  box-shadow:0 8px 18px rgba(47,99,215,.22);
}
button:hover,.btn:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(47,99,215,.24)}
button:active,.btn:active{transform:translateY(0)}
button.ghost,.btn.ghost{background:linear-gradient(180deg,#f8fbff,#e8eff8);color:var(--ui-text);border:1px solid var(--ui-line-strong);box-shadow:none}
button.red,.btn.red{background:linear-gradient(180deg,#dc4f62,#c73a4d);box-shadow:0 8px 18px rgba(199,58,77,.18)}
button.green,.btn.green{background:linear-gradient(180deg,#1da05f,#15844d);box-shadow:0 8px 18px rgba(21,132,77,.18)}
button.wa,.btn.wa{background:linear-gradient(180deg,#29d86b,#1ea653)}
.btn.sm,button.sm{min-height:32px;padding:4px 10px;border-radius:10px}
.box.row,.bar .row{align-items:end}
.box.row{background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,251,255,.98))}
.box.row label,.bar .row label{min-width:150px;flex:1}
table{border-collapse:separate;border-spacing:0;background:#fff}
th,td{padding:11px 12px;border-bottom:1px solid #dce6f3;vertical-align:middle}
th{
  position:sticky;top:0;z-index:1;
  background:linear-gradient(180deg,#eef4fb,#dde8f6);
  color:#26446f;
  text-transform:none;
  letter-spacing:.15px;
  font-weight:800;
}
tr:last-child td{border-bottom:0}
tr[data-href]:hover td{background:#f8fbff}
tr.st-passed td, tr.cr td{background:#dbf2e3}
tr.st-left td, tr.db td{background:#f7dede}
tr.st-passed td:first-child, tr.cr td:first-child{box-shadow:inset 4px 0 0 #22a565}
tr.st-left td:first-child, tr.db td:first-child{box-shadow:inset 4px 0 0 #dc4f62}
tr.st-passed:hover td, tr.cr:hover td{background:#d0ecd9}
tr.st-left:hover td, tr.db:hover td{background:#f3d2d6}
tr.gt td{background:#edf2f8!important;font-weight:800}
.due{color:#c73a4d;font-weight:800}.ok{color:#15844d;font-weight:800}
table td[colspan]{
  padding:22px 18px;
  text-align:center;
  font-weight:700;
  color:var(--ui-muted);
  background:linear-gradient(180deg,#fcfdff,#f6f9fd);
}
.rep .bal{gap:16px;margin-bottom:14px}
.rep .bal>div{
  border:1px solid #cad9ed;
  border-radius:16px;
  padding:16px 18px;
  background:linear-gradient(180deg,#f7fbff,#edf4fb);
  box-shadow:var(--shadow-sm);
}
.rep .bal>div:first-child b{color:#234a88}
.rep .bal>div:last-child{background:linear-gradient(180deg,#f3f8ff,#e8f0fe)}
.rep .bal small{font-size:12px;text-transform:none;color:#6880a4}
.rep .bal b{display:block;margin-top:8px;font-size:20px;color:#234a88}
.tot{gap:12px}.tot div{background:linear-gradient(180deg,#fbfdff,#f1f6fd);border:1px solid var(--ui-line);border-radius:16px;padding:14px 14px 12px;box-shadow:var(--shadow-sm);color:#436084}
.tot div b{margin-top:6px;font-size:16px;color:#234a88}
.tot.rsum div:nth-child(2){background:linear-gradient(180deg,#f3fbf6,#e5f4eb);border-color:#b9dec6;color:#246647}
.tot.rsum div:nth-child(2) b{color:#15844d}
.tot.rsum div:nth-child(3){background:linear-gradient(180deg,#fff7f7,#fcebec);border-color:#e8c3c7;color:#954250}
.tot.rsum div:nth-child(3) b{color:#c73a4d}
.pager{gap:8px}.pager a,.pager b{min-width:36px;display:inline-flex;justify-content:center;align-items:center;padding:8px 10px;border-radius:10px;border:1px solid var(--ui-line);background:#fff;box-shadow:var(--shadow-sm)}
.pager b{background:linear-gradient(180deg,#edf3ff,#dde8ff);color:#214eb5;border-color:#bdd1fb}
.toast{
  bottom:18px;
  min-width:240px;
  max-width:min(92vw,560px);
  background:linear-gradient(180deg,#183766,#112a4d);
  box-shadow:0 16px 32px rgba(17,42,77,.28);
  border:1px solid rgba(255,255,255,.1);
  border-radius:14px;
  font-weight:700;
}
.toast.bad{background:linear-gradient(180deg,#c63c50,#ad2338)}
.err{border:1px solid #efbcc4;border-radius:12px;padding:12px 14px;background:linear-gradient(180deg,#fff7f7,#fce9ec);font-weight:600}
.hint,.rml{color:#7086a6}.badge{box-shadow:0 6px 16px rgba(23,54,100,.12)}
.cm summary{
  min-height:42px;
  border-color:var(--ui-line-strong);
  border-radius:12px;
  background:linear-gradient(180deg,#fff,#fbfdff);
  display:flex;align-items:center;justify-content:space-between;
}
.cml{border-color:var(--ui-line-strong);border-radius:14px;box-shadow:var(--shadow-md)}
.login{max-width:420px;margin:9vh auto;padding:0 12px}.login img{height:94px;filter:drop-shadow(0 10px 18px rgba(30,64,175,.16))}.login form{background:#fff;padding:20px;border-radius:20px;border:1px solid var(--ui-line);box-shadow:var(--shadow-md)}
.ph{border-radius:12px;box-shadow:var(--shadow-sm)}
.prof{gap:20px}.sthead{box-shadow:var(--shadow-sm)}
.zt{margin-top:10px}
.popov{backdrop-filter:blur(4px)}
.popc{border:1px solid var(--ui-line);border-radius:22px;overflow:hidden}
.poph{background:linear-gradient(135deg,#3e71e6,#214eb5)}
.popb{background:linear-gradient(180deg,#fff,#f7faff)}
.nt{border:1px solid var(--ui-line);border-radius:12px;background:linear-gradient(180deg,#fbfdff,#f2f7fd)}
.lockscr .lkc div{background:linear-gradient(180deg,#fff,#f8fbff)}
#spv .spc-h .spc-done,.chip.completed{box-shadow:none}
@media (max-width:920px){
  main{padding:16px 14px 84px}
  .cards{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}
  .rep .bal,.tot{grid-template-columns:1fr 1fr}
}
@media (max-width:700px){
  .top{padding:10px 12px;gap:10px}
  .top img{height:32px}
  .top nav{overflow:auto;flex-wrap:nowrap;scrollbar-width:none;padding-bottom:2px}
  .top nav::-webkit-scrollbar{display:none}
  .top nav a{white-space:nowrap;padding:9px 12px}
  .bar{gap:10px;align-items:flex-start}
  .bar .row{width:100%}
  .box,.cc{padding:16px}
  .box.row label,.bar .row label{min-width:unset;width:100%}
  .grid{grid-template-columns:1fr}
  .rep .bal{flex-direction:column}
  .tot{grid-template-columns:1fr 1fr}
  .wrap{border-radius:16px}
  table{font-size:13px}
  .card{min-height:128px;padding:16px}
  .card .v{font-size:28px}
}
@media (max-width:480px){
  main{padding:14px 14px 86px}
  .cards,.tot{grid-template-columns:1fr}
  .row, .bar .row{gap:8px}
  button,.btn,input,select,textarea{width:100%}
  .top b{font-size:15px}
  .ph{width:88px;height:112px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* v31: edge-to-edge responsive layout + user-selectable dark mode */
html,body{min-width:0;max-width:100%}
#app,#view{width:100%;min-width:0;max-width:none}
main{
  width:100%;max-width:none!important;
  margin:0 auto;
  padding:clamp(12px,2vw,30px);
}
main > *{min-width:0;max-width:100%}
.box,.wrap,.prt,.cc,.cards,.grid,.tot,.rep{min-width:0;max-width:100%}
.cards{grid-template-columns:repeat(auto-fit,minmax(min(100%,195px),1fr))}
.grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,235px),1fr))}
.tot{grid-template-columns:repeat(auto-fit,minmax(min(100%,165px),1fr))}
/* Keep table columns readable, scroll INSIDE the report instead of shrinking the page. */
@media screen{
  .prt{overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  .prt > table{width:100%;min-width:750px}
  .wrap{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  .two > *, .box > *, .cc > *{min-width:0}
}
@media(max-width:700px){
  main{padding:12px}
  .cards{grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))}
  .top{gap:8px}
}
@media(max-width:480px){
  main{padding:12px}
  .cards{grid-template-columns:repeat(auto-fit,minmax(min(100%,145px),1fr))}
  .tot{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid{grid-template-columns:1fr}
  .box.row label,.bar .row label{flex:1 1 100%}
}
/* Persistent theme switcher; fixed when no toolbar is present (login). */
.gti-theme-toggle{
  flex:none;width:auto!important;min-height:38px!important;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:8px 12px!important;
  color:#234b89!important;
  background:linear-gradient(180deg,#f7faff,#eaf1fd)!important;
  border:1px solid #bdd0eb!important;border-radius:11px!important;
  box-shadow:none!important;white-space:nowrap;cursor:pointer;
  font-size:12px;font-weight:800;
}
.gti-theme-toggle:hover{background:#e4edff!important;border-color:#8babeb!important;transform:translateY(-1px)}
.gti-theme-icon{font-size:18px;line-height:1}
.gti-theme-floating{position:fixed;z-index:100;top:14px;right:16px;box-shadow:var(--shadow-md)!important}
@media(max-width:700px){.top .gti-theme-toggle{padding:7px 10px!important}}
@media(max-width:390px){.top .gti-theme-label{display:none}}
/* Dark color system: intentionally retain credit/debit semantic colors. */
html[data-gti-theme="dark"]{
  color-scheme:dark;
  --ui-bg:#0b1323;
  --ui-bg-2:#101d33;
  --ui-surface:#17263c;
  --ui-surface-2:#1b2e49;
  --ui-line:#304561;
  --ui-line-strong:#415a79;
  --ui-text:#e6efff;
  --ui-muted:#adbed7;
  --ui-primary:#7aa5ff;
  --ui-primary-2:#6b96ee;
  --ui-green:#53d69c;
  --ui-green-bg:#123b30;
  --ui-red:#ff8995;
  --ui-red-bg:#4d2633;
  --shadow-sm:0 5px 20px rgba(0,0,0,.16);
  --shadow-md:0 10px 32px rgba(0,0,0,.25);
  --shadow-lg:0 18px 44px rgba(0,0,0,.32);
}
html[data-gti-theme="dark"] body{background:radial-gradient(circle at top right,#19345a,#0b1323 55%);color:var(--ui-text)}
html[data-gti-theme="dark"] .top{background:rgba(20,34,53,.96);border-color:var(--ui-line);box-shadow:0 10px 28px rgba(0,0,0,.18)}
html[data-gti-theme="dark"] .top b,html[data-gti-theme="dark"] h2,html[data-gti-theme="dark"] h3{color:#eff6ff}
html[data-gti-theme="dark"] .top nav a{color:#c4d5eb}
html[data-gti-theme="dark"] .top nav a.on,html[data-gti-theme="dark"] .top nav a:hover{background:linear-gradient(180deg,#29466e,#203a5e);color:#c5daff;border-color:#4c6e9a;box-shadow:none}
html[data-gti-theme="dark"] .box,
html[data-gti-theme="dark"] .cc,
html[data-gti-theme="dark"] .wrap,
html[data-gti-theme="dark"] .prt,
html[data-gti-theme="dark"] .login form,
html[data-gti-theme="dark"] .popc,
html[data-gti-theme="dark"] .ptile,
html[data-gti-theme="dark"] .lockscr .lkc div{background:linear-gradient(180deg,#192a41,#14243a);border-color:var(--ui-line);color:var(--ui-text);box-shadow:var(--shadow-sm)}
html[data-gti-theme="dark"] .box.row{background:linear-gradient(180deg,#1b2c46,#17283f)}
html[data-gti-theme="dark"] .box>h3:first-child{color:#ff9faa}
html[data-gti-theme="dark"] .bar h2{color:#f2f6ff}
html[data-gti-theme="dark"] label,html[data-gti-theme="dark"] .fl{color:#bed0eb}
html[data-gti-theme="dark"] input:not([type="checkbox"]):not([type="radio"]),
html[data-gti-theme="dark"] select,
html[data-gti-theme="dark"] textarea,
html[data-gti-theme="dark"] .cm summary{background:#102138;border-color:#3a5476;color:#ebf3ff;box-shadow:none}
html[data-gti-theme="dark"] input::placeholder,html[data-gti-theme="dark"] textarea::placeholder{color:#9aacc6}
html[data-gti-theme="dark"] input:hover,html[data-gti-theme="dark"] select:hover,html[data-gti-theme="dark"] textarea:hover{border-color:#6081b0}
html[data-gti-theme="dark"] input:focus,html[data-gti-theme="dark"] select:focus,html[data-gti-theme="dark"] textarea:focus{border-color:#8aafff;box-shadow:0 0 0 4px rgba(122,165,255,.18)}
html[data-gti-theme="dark"] button.ghost,html[data-gti-theme="dark"] .btn.ghost{background:linear-gradient(180deg,#243b5b,#192e4a);color:#e3efff;border-color:#456284}
html[data-gti-theme="dark"] .gti-theme-toggle{color:#e5edff!important;background:linear-gradient(180deg,#294365,#1e3655)!important;border-color:#52739d!important}
html[data-gti-theme="dark"] .gti-theme-toggle:hover{background:#33537d!important;border-color:#7293bf!important}
html[data-gti-theme="dark"] table{background:#14243a;color:#e6efff;box-shadow:none}
html[data-gti-theme="dark"] th{background:linear-gradient(180deg,#29415f,#223854);color:#d4e6ff;border-color:#3c5370}
html[data-gti-theme="dark"] td{border-bottom-color:#31455f;color:#e3edfa}
html[data-gti-theme="dark"] tr:not(.cr):not(.db):not(.st-passed):not(.st-left):not(.gt)[data-href]:hover td{background:#233d5d}
html[data-gti-theme="dark"] tr.cr td,html[data-gti-theme="dark"] tr.st-passed td{background:#163e32;color:#cbfbe3;border-color:#275548}
html[data-gti-theme="dark"] tr.db td,html[data-gti-theme="dark"] tr.st-left td{background:#482631;color:#ffe0e4;border-color:#623642}
html[data-gti-theme="dark"] tr.cr:hover td,html[data-gti-theme="dark"] tr.st-passed:hover td{background:#205441}
html[data-gti-theme="dark"] tr.db:hover td,html[data-gti-theme="dark"] tr.st-left:hover td{background:#59313b}
html[data-gti-theme="dark"] tr.gt td{background:#293c56!important;color:#e8f2ff;border-color:#415670}
html[data-gti-theme="dark"] table td[colspan]:not(.r){background:#243752;color:#bed1eb}
html[data-gti-theme="dark"] table tr.gt td[colspan]{background:#293c56!important}
html[data-gti-theme="dark"] .prt tr.cr td{background:#163e32;color:#cbfbe3}
html[data-gti-theme="dark"] .prt tr.db td{background:#482631;color:#ffe0e4}
html[data-gti-theme="dark"] .prt tr.gt td{background:#293c56!important;color:#e8f2ff}
html[data-gti-theme="dark"] .due{color:#ff8c9a!important}
html[data-gti-theme="dark"] .ok{color:#65e1a6!important}
html[data-gti-theme="dark"] .hint,html[data-gti-theme="dark"] .rml,html[data-gti-theme="dark"] .zt{color:#b0c0d8}
html[data-gti-theme="dark"] .zt a{color:#a9c7ff}
html[data-gti-theme="dark"] .rep .bal>div{background:linear-gradient(180deg,#233958,#1d324e);border-color:#466185;box-shadow:none}
html[data-gti-theme="dark"] .rep .bal>div:last-child{background:linear-gradient(180deg,#233e63,#1b3353)}
html[data-gti-theme="dark"] .rep .bal small{color:#b1c5e2}
html[data-gti-theme="dark"] .rep .bal b,html[data-gti-theme="dark"] .rep .bal>div:first-child b{color:#d6e6ff}
html[data-gti-theme="dark"] .tot div{background:linear-gradient(180deg,#263c57,#1d3049);border-color:#3a5777;color:#b8cbe5}
html[data-gti-theme="dark"] .tot div b{color:#e9f4ff}
html[data-gti-theme="dark"] .tot.rsum div:nth-child(2){background:linear-gradient(180deg,#1c4438,#17392f);border-color:#357b5b;color:#aaefcb}
html[data-gti-theme="dark"] .tot.rsum div:nth-child(2) b{color:#76edb5}
html[data-gti-theme="dark"] .tot.rsum div:nth-child(3){background:linear-gradient(180deg,#532d3a,#412631);border-color:#89515e;color:#ffc3cd}
html[data-gti-theme="dark"] .tot.rsum div:nth-child(3) b{color:#ffa1b2}
html[data-gti-theme="dark"] .pager a,html[data-gti-theme="dark"] .pager b{background:#213853;color:#d9e9ff;border-color:#476083}
html[data-gti-theme="dark"] .pager b{background:#335587;color:#fff}
html[data-gti-theme="dark"] .cml,html[data-gti-theme="dark"] .popb{background:#172940;color:#e7f0ff;border-color:#3f5a7a}
html[data-gti-theme="dark"] .cml label{color:#e4eeff}
html[data-gti-theme="dark"] .nt{background:#1e3451;border-color:#405b7e;color:#e7f0ff}
html[data-gti-theme="dark"] .nt.un{background:#203e62;border-color:#7297f1}
html[data-gti-theme="dark"] .err{background:#4d2933;color:#ffc9d0;border-color:#8e4957}
html[data-gti-theme="dark"] .lkc span,html[data-gti-theme="dark"] .lkc small,html[data-gti-theme="dark"] .lkm{color:#bad0ed}
html[data-gti-theme="dark"] .sthead.st-passed{background:#1c4735;color:#d8ffed;border-color:#398058}
html[data-gti-theme="dark"] .sthead.st-left{background:#572a36;color:#ffe0e5;border-color:#a05466}
html[data-gti-theme="dark"] .sthead .badge{background:#19314d}
html[data-gti-theme="dark"] .ph.none{background:#263e5a;color:#b6c5dc}
html[data-gti-theme="dark"] :focus-visible{outline-color:#9dc0ff}
/* Printed exports, receipts, and ID cards remain white independent of theme. */
@media print{
  html[data-gti-theme="dark"]{color-scheme:light}
  html[data-gti-theme="dark"] body{background:#fff!important;color:#000!important}
  main{width:100%;max-width:none!important;margin:0;padding:0}
  .prt,.prt.rep{overflow:visible!important;background:#fff!important;color:#000!important;border:0!important;box-shadow:none!important}
  .prt > table{min-width:0!important}
  html[data-gti-theme="dark"] .prt table{background:#fff;color:#000}
  html[data-gti-theme="dark"] .prt th{background:#f1f5f9!important;color:#000!important;border-color:#000}
  html[data-gti-theme="dark"] .prt td{background:#fff;color:#000;border-color:#000}
  html[data-gti-theme="dark"] .prt tr.cr td{background:#dcfce7!important;color:#000!important}
  html[data-gti-theme="dark"] .prt tr.db td{background:#fee2e2!important;color:#000!important}
  html[data-gti-theme="dark"] .prt tr.gt td,html[data-gti-theme="dark"] .prt tr.gt td[colspan]{background:#f1f5f9!important;color:#000!important}
  html[data-gti-theme="dark"] .prt .bal>div,html[data-gti-theme="dark"] .prt .tot div{background:#fff!important;color:#000!important;border-color:#000!important;box-shadow:none!important}
  html[data-gti-theme="dark"] .prt .bal b,html[data-gti-theme="dark"] .prt .tot b,html[data-gti-theme="dark"] .prt .bal small{color:#000!important}
  html[data-gti-theme="dark"] .sheet{background:#fff!important;color:#111!important}
  html[data-gti-theme="dark"] .sheet th,html[data-gti-theme="dark"] .sheet td{color:#111!important}
  html[data-gti-theme="dark"] .idc{color:var(--navy);background:#f1f6fd}
}

/* Compact header: controls remain usable on phones rather than stretching to full-row buttons. */
@media(max-width:700px){
  .top > .btn, .top > button{width:auto!important;flex:0 0 auto}
  .top b{flex:1 1 180px}
  .top > span{order:3;flex:0 1 auto;margin-left:auto;font-size:12px;color:var(--ui-muted)}
  .top > .btn{order:4}
  .top .gti-theme-toggle{order:5}
  .top > button:not(.gti-theme-toggle){order:6}
  .top nav{order:10;flex:0 0 100%;width:100%;padding-top:4px}
}
@media(max-width:390px){.top .gti-theme-label{display:inline}}
@media screen and (max-width:360px){.sheet{zoom:.34}}
/* Receipt preview is a paper document even when the surrounding application is dark. */
html[data-gti-theme="dark"] .sheet,
html[data-gti-theme="dark"] .sheet table{background:#fff;color:#111}
html[data-gti-theme="dark"] .sheet table{background:transparent}
/* STMS admission option, shared FM form */
.att-optin{display:flex!important;flex-direction:row!important;align-items:center!important;gap:9px!important;border:1px solid #c7e3f4;border-radius:10px;padding:11px;background:rgba(23,146,187,.05);font-weight:650;font-size:13px}
.att-optin input{width:17px;min-width:17px;height:17px;flex:0 0 17px}