:root{color-scheme:light;--paper:#f4f8f7;--white:#fff;--ink:#173333;--muted:#516966;--line:#dce8e3;--teal:#076958;--deep:#063f3c;--lime:#e2f2a7;--round:20px;--shadow:0 12px 35px rgba(20,63,55,.055)}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.55 "Noto Sans Bengali",system-ui,sans-serif}
a{color:var(--teal);text-underline-offset:.15em}
a:hover{color:#044c41}
button,input,select{font:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #f3a032;outline-offset:3px}
h1,h2,h3,p{margin:0}
h1,h2,h3{line-height:1.22;font-weight:750;overflow-wrap:anywhere}
h1{font-size:clamp(2rem,5vw,3.25rem);letter-spacing:-.035em}
h2{font-size:clamp(1.35rem,2.6vw,1.8rem)}
h3{font-size:1.15rem}
p{color:var(--muted)}
.wrap{width:min(1120px,calc(100% - 48px));margin-inline:auto}
.top{background:var(--white);border-bottom:1px solid var(--line)}
.top-inner,.footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:69px}
.brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);font-weight:750;font-size:1.06rem;line-height:1.2}
.brand small{display:block;margin-top:2px;color:var(--muted);font:600 10px/1.2 system-ui,sans-serif;letter-spacing:.03em}
.brand-mark{display:grid;place-items:center;width:39px;height:39px;border-radius:12px;background:var(--deep);color:var(--lime)}
.brand-mark svg{width:22px;height:22px}
.top nav{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.top nav a{display:block;border-radius:9px;padding:7px 10px;text-decoration:none;font-size:.9rem;font-weight:650;color:var(--ink)}
.top nav a:hover,.top nav a[aria-current]{background:#e8f3ed;color:var(--teal)}
.page{min-height:calc(100vh - 145px);padding-block:36px 48px}
.footer{border-top:1px solid var(--line);color:var(--muted);font-size:.82rem}
.eyebrow{font-size:.8rem;font-weight:750;color:var(--teal);margin-bottom:.45rem}
.heading{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:23px}
.heading p:not(.eyebrow){margin-top:.42rem}
.heading.compact{margin-bottom:12px;align-items:start}
.tag,.badge{display:inline-flex;align-items:center;border-radius:99px;padding:4px 11px;white-space:nowrap;background:#e7f2eb;color:#16634f;font-size:.83rem;font-weight:700}
.panel{min-width:0;border:1px solid var(--line);border-radius:var(--round);padding:22px;background:var(--white);box-shadow:var(--shadow)}
.panel+.panel,.panel+.stack,.setting-grid+.panel,.metrics+.panel{margin-top:18px}
.panel h2+p,.panel h3+p{margin-top:.4rem}
.stack{display:grid;gap:14px}
.actions{display:flex;align-items:center;flex-wrap:wrap;gap:9px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:41px;border:1px solid transparent;border-radius:11px;padding:8px 15px;cursor:pointer;text-decoration:none;font-weight:720;text-align:center;color:var(--ink);line-height:1.3}
.button:hover{filter:brightness(.96)}
.button:disabled{cursor:not-allowed;opacity:.55}
.primary{color:#fff;background:var(--teal)}
.primary:hover{color:#fff}
.soft{background:#eaf4ee;border-color:#daeae1;color:#124e44}
.danger{color:#8c2a25;background:#fff0ef;border-color:#f6d7d5}
.hint{color:var(--muted);font-size:.88rem}
.notice{padding:11px 15px;border-radius:12px;margin-bottom:14px;color:#165542;background:#e7f6eb;border:1px solid #ccebd5}
.notice.error{color:#842b25;background:#fff0ee;border-color:#f0ceca}
.notice ul{margin:.25rem 0}
.hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,1fr);align-items:center;gap:42px;overflow:hidden;border-radius:28px;padding:clamp(24px,5vw,60px);color:#fff;background:radial-gradient(ellipse at 100% 0%,#1e7770,transparent 63%),var(--deep)}
.hero h1{font-size:clamp(2.6rem,7.6vw,5rem);line-height:1.09}
.hero h1 em{color:var(--lime);font-style:normal}
.hero .eyebrow{color:#d5ebc4}
.hero .hero-copy{color:#deefeb;font-size:1.05rem;margin:16px 0 23px;max-width:43ch}
.hero .primary{background:var(--lime);color:var(--deep)}
.hero .soft{background:#ffffff17;color:#fff;border-color:#ffffff60}
.hero-preview{padding:15px;border:1px solid #ffffff50;background:#ffffff12;border-radius:20px}
.mock-camera{display:grid;place-items:center;min-height:180px;margin-top:7px;border-radius:13px;background:radial-gradient(ellipse at 50% 100%,#32534a,#152928)}
.mock-frame{width:98px;aspect-ratio:1;display:grid;place-items:center;border:2px dashed #9fd9a6;border-radius:16px;color:#ddefd9}
.mock-frame svg{width:57px}
.mock-success{display:flex;align-items:center;gap:12px;margin-top:10px;padding:9px 12px;border-radius:10px;background:#e5f7ec;color:#134a3d}
.mock-success small,.rowline small{display:block;color:var(--muted)}
.check{display:grid;place-items:center;width:32px;height:32px;background:#bee9d0;border-radius:100%;font-size:1.1rem}
.highlights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:16px}
.highlights>.panel{margin:0}
.pricing{margin-top:33px}
.price strong{font-size:2.05rem;line-height:1.55;color:var(--teal)}
.price span{color:var(--muted)}
.pricing>.hint{margin-top:12px}
.scan-grid,.setting-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.scan-grid{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);align-items:start}
.scan-grid .panel,.setting-grid .panel{margin:0}
.camera{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:16/10;max-height:430px;overflow:hidden;border:2px solid #243f3b;border-radius:15px;background:#182f2d}
.camera video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:none}
.camera-on video{display:block}
.camera-guide{display:none;width:48%;height:72%;max-width:240px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:2px dashed #eff9c2;border-radius:15px;pointer-events:none;box-shadow:0 0 0 1000px #071b1924}
.camera-on .camera-guide{display:block}
.camera-on .camera-placeholder{display:none}
.camera-placeholder{display:grid;justify-items:center;color:#e1f2ec;z-index:1;text-align:center}
.camera-placeholder span{font:600 3.2rem/1.1 system-ui,sans-serif;color:#bfe6ad}
.camera-placeholder small{color:#b6ccc4}
.scan-actions{margin-top:12px;margin-bottom:6px}
.upload-button{position:relative;overflow:hidden}
.upload-button input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.upload-button:focus-within{outline:3px solid #f3a032;outline-offset:3px}
.receipt{border-top:5px solid #a9c4b6}
.receipt[data-state=saved]{border-color:#248258;background:#f5fff7}
.receipt[data-state=duplicate]{border-color:#bf7d14;background:#fffaf0}
.receipt[data-state=invalid],.receipt[data-state=closed],.receipt[data-state=error]{border-color:#b54b45;background:#fff6f5}
.receipt-result{display:flex;align-items:center;gap:11px;font-size:1.25rem;line-height:1.3;margin:10px 0}
.receipt-result span{display:grid;place-items:center;flex:0 0 38px;height:38px;border-radius:100%;background:#e5f0e8;color:#245943;font-weight:750}
.student-preview{display:flex;align-items:center;gap:12px;border-block:1px solid var(--line);padding:14px 0;margin:12px 0}
.student-preview img,.portrait,.id-photo{object-fit:cover;border-radius:10px;background:#e9f3ee}
.student-preview b,.student-preview small,.student-preview time{display:block}
.student-preview b{font-size:1.16rem}
.student-preview small,.student-preview time{color:var(--muted)}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));align-items:end;gap:12px 15px}
.form-grid .actions:has(button+button){grid-column:1/-1}
label:not(.button){font-size:.89rem;font-weight:690}
label:not(.button):not(.switch-card)>input:not([type=checkbox]),label>select{display:block;width:100%;margin-top:4px}
input:not([type=checkbox]):not([type=hidden]),select{min-width:0;min-height:42px;padding:8px 9px;border:1px solid #bfcfc8;border-radius:9px;background:#fff;color:var(--ink)}
input[type=checkbox]{accent-color:var(--teal);width:16px;height:16px;vertical-align:middle}
input[type=file]{max-width:100%}
fieldset{border:1px solid var(--line);border-radius:12px;padding:11px 14px}
legend{color:var(--muted);padding:0 5px;font-size:.9rem;font-weight:700}
.checklist{display:flex;gap:8px 15px;flex-wrap:wrap}
.switch-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px;border-radius:12px;background:#f0f8f2;border:1px solid #d7eadf}
.switch-card strong,.switch-card small{display:block}
.switch-card small{color:var(--muted);font-size:.83rem;font-weight:500;margin-top:3px}
input.switch{appearance:none;flex:0 0 42px;width:42px;height:24px;margin:0;border:1px solid #6e8881;border-radius:50px;background:#aebfba;cursor:pointer}
input.switch::after{content:"";display:block;margin:2px;width:18px;height:18px;border-radius:50%;background:#fff}
input.switch:checked{background:var(--teal);border-color:var(--teal)}
input.switch:checked::after{transform:translateX(17px)}
.shift-form,.rowline{border-top:1px solid var(--line);padding-top:12px}
.rowline{display:flex;justify-content:space-between;align-items:center;gap:10px;overflow-wrap:anywhere}
summary{cursor:pointer;font-weight:720;color:var(--teal)}
.import-panel summary{font-size:1.04rem}
.import-panel .stack,.inline-details .shift-form{margin-top:13px}
.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:16px}
.metric{display:grid;padding:12px 14px;border-radius:14px;background:#eaf1f4;color:#304f58;font-weight:690}
.metric strong{font:750 clamp(1.6rem,5vw,2.3rem)/1.2 system-ui,sans-serif}
.metric.ok,.badge.present{background:#ddf3e6;color:#176145}
.metric.warn,.badge.late{background:#fff1d5;color:#74460b}
.metric.bad,.badge.absent{background:#fae8e6;color:#88372e}
.badge.waiting,.badge.closed{background:#eaf1f4;color:#365963}
.table-wrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;text-align:left;font-size:.9rem}
th,td{padding:9px 10px;border-bottom:1px solid #e7eeea;vertical-align:top}
thead th{color:var(--muted);white-space:nowrap;font-size:.85rem}
tbody tr:last-child>*{border-bottom:0}
tbody tr:nth-child(even){background:#f9fbfa}
form.filters,form[data-card-selection]{margin-bottom:13px}
.inline-edit{min-width:92px}
.inline-edit .stack{padding-top:8px;width:164px}
.pagination{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:14px;color:var(--muted);font-size:.9rem}
.id-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:13px}
.id-card{display:flex;flex-direction:column;overflow:hidden;border:1px solid #8ca7a0;border-radius:12px;max-width:330px;background:#fff;break-inside:avoid}
.id-card header,.id-card footer{padding:8px 12px;background:var(--deep);color:#fff}
.id-card header span,.id-card header small{display:block;font-weight:750}
.id-card header small,.id-card footer{font-size:.73rem}
.id-body{display:grid;grid-template-columns:minmax(0,1fr) 100px;align-items:center;gap:6px;flex:1;padding:10px 12px;font-size:.83rem}
.id-body strong{display:block;overflow-wrap:anywhere;font-size:1rem}
.id-photo{display:block;margin-bottom:4px}
.id-qr svg{display:block;width:100%;height:auto;background:white}
@media(max-width:780px){
  .hero{gap:20px}.wrap{width:min(100% - 28px,1120px)}
  .top-inner{align-items:flex-start;padding-block:10px;flex-wrap:wrap;gap:5px}.top nav a{padding:6px 7px}
  .highlights{grid-template-columns:repeat(2,minmax(0,1fr))}.scan-grid{grid-template-columns:minmax(0,1fr)}
  .scanner .camera{max-height:300px}
}
@media(max-width:540px){
  body{font-size:15px}.page{padding-top:23px}.hero,.highlights,.setting-grid{grid-template-columns:minmax(0,1fr)}
  .hero{padding:21px}.hero-preview{max-width:420px}.heading{align-items:start;flex-wrap:wrap;gap:9px;margin-bottom:15px}
  .panel{padding:15px;border-radius:15px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .scanner .camera{max-height:224px}.receipt{margin-top:0!important}.scan-grid{gap:9px}
}
@media print{
  @page{size:A4;margin:11mm}
  body{background:#fff;color:#000;font-size:10pt}
  .wrap{width:100%;margin:0}.page{padding:0;min-height:0}.no-print{display:none!important}
  .panel{box-shadow:none;border:0;padding:0}.table-wrap{overflow:visible}
  th,td{padding:4px 5px}.id-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:4mm}
  .id-card{max-width:none;print-color-adjust:exact;-webkit-print-color-adjust:exact}
  .id-card header,.id-card footer{color:#123c34;background:#e5f2ed}
  a{color:inherit;text-decoration:none}
}