@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap";:root{font-family:DM Sans,sans-serif;color:#273044;background:#f5f7fb;font-synthesis:none;--line: #e9edf2;--muted: #9099a9;--blue: #5574de;--green: #31a47b }*{box-sizing:border-box}body{margin:0;min-width:360px;min-height:100vh;background:#f5f7fb}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.5}.boot{height:100vh;display:grid;place-content:center;justify-items:center;gap:12px;color:#838d9e}.logo{width:34px;height:34px;background:#5574de;color:#fff;border-radius:10px;display:grid;place-items:center;box-shadow:0 4px 10px #5574de30}.logo svg{width:18px}.auth-screen{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(ellipse at 50% 0,#e8edff,#f5f7fb 58%)}.auth-card{width:min(100%,415px);border:1px solid var(--line);border-radius:16px;background:#fff;padding:32px;box-shadow:0 15px 48px #2d3a5714;display:grid;gap:14px}.brand{font:800 16px Manrope,sans-serif;letter-spacing:-.5px;display:flex;gap:10px;align-items:center}.auth-card .brand{margin-bottom:14px}.overline{font-size:9px;color:#667ddb;letter-spacing:1.2px;font-weight:700}.auth-card h1{font:700 24px Manrope;letter-spacing:-.8px;margin:0;color:#293247}.subtle{color:#929aaa;font-size:12px;line-height:1.6;margin:-6px 0 5px}.auth-card label,.form-fields label{display:grid;gap:7px;color:#687386;font-size:10px;font-weight:600}.auth-card input,.form-fields input,.manual-code input{height:39px;width:100%;border:1px solid #e1e6ed;border-radius:7px;padding:0 11px;outline:0;color:#313a4d;font-size:11px}.auth-card input:focus,.form-fields input:focus,.manual-code input:focus{border-color:#8ba0ef;box-shadow:0 0 0 3px #5574de1b}.primary,.secondary{height:37px;padding:0 13px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:600;font-size:10px;white-space:nowrap}.primary{background:#5574de;color:#fff;border:1px solid #5574de;box-shadow:0 3px 8px #5574de23}.primary:hover{background:#4968d2}.secondary{background:#fff;border:1px solid #e1e6ed;color:#5f697b}.secondary:hover{background:#f8f9fc}.full{width:100%;margin-top:4px}.auth-toggle{text-align:center;font-size:10px;color:#8d96a6}.auth-toggle button{border:0;background:none;color:#5470d2;font-weight:700}.auth-note{border-top:1px solid #eff1f5;padding-top:13px;margin-top:4px;color:#8d96a6;font-size:9px;display:flex;align-items:center;justify-content:center;gap:6px}.auth-note svg{color:#51a987}.error-box{border-radius:6px;background:#fff2f0;color:#b94e47;padding:9px 10px;font-size:10px}.app{min-height:100vh}.sidebar{width:236px;position:fixed;inset:0 auto 0 0;background:#fff;border-right:1px solid var(--line);padding:23px 15px 14px;display:flex;flex-direction:column;z-index:5}.sidebar .brand{padding:0 5px;font-size:15px}.school{margin:26px 0 24px;border:1px solid #edf0f4;border-radius:10px;height:59px;padding:9px;display:flex;align-items:center;gap:9px}.school-icon{width:33px;height:33px;border-radius:9px;background:#edf1ff;color:#5471d7;font:700 16px Manrope;display:grid;place-items:center}.school div{display:grid;gap:3px;flex:1}.school b{font-size:10px}.school small{color:#929bab;font-size:9px}.school>svg{color:#9ca4b2}.section-label{padding:0 9px;margin:0 0 8px;color:#9aa1af;letter-spacing:1px;font-size:9px;font-weight:700}.sidebar nav{display:grid;gap:3px}.nav{height:38px;border:0;background:transparent;border-radius:7px;display:flex;align-items:center;gap:11px;text-align:left;padding:0 10px;color:#707a8b;font-size:11px}.nav svg{color:#8d97a7}.nav.active{background:#eff2ff;color:#506bd0;font-weight:700}.nav.active svg{color:#5574de}.courses-label{margin-top:26px;display:flex;align-items:center;justify-content:space-between}.courses-label button{border:0;background:transparent;color:#8490a1;width:23px;height:23px;display:grid;place-items:center}.course-list{display:grid;gap:3px}.course-nav{height:34px;border:0;background:transparent;border-radius:6px;display:flex;align-items:center;gap:9px;text-align:left;padding:0 10px;color:#687386;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.course-nav i{width:7px;height:7px;border-radius:50%;background:#8c79da;flex:none}.course-active{background:#f6f7fa;color:#384256;font-weight:600}.side-bottom{margin-top:auto}.profile{border-top:1px solid #edf0f3;padding:13px 2px 0;display:flex;align-items:center;gap:8px}.profile-avatar,.top-avatar{width:30px;height:30px;display:grid;place-items:center;background:#ebe5dd;color:#79644e;border-radius:50%;font-size:10px;font-weight:700;flex:none}.profile>div:nth-child(2){display:grid;gap:3px;min-width:0;flex:1}.profile b{font-size:10px;overflow:hidden;text-overflow:ellipsis}.profile small{font-size:8px;color:#959dac;overflow:hidden;text-overflow:ellipsis}.profile button,.close-nav{border:0;background:transparent;color:#8993a1;width:26px;height:26px;display:grid;place-items:center}.profile button svg,.close-nav svg{width:16px}.app main{margin-left:236px;min-height:100vh}.topbar{height:59px;background:#fff;border-bottom:1px solid var(--line);padding:0 32px;display:flex;align-items:center;justify-content:space-between}.breadcrumbs{display:flex;align-items:center;gap:8px;color:#969ead;font-size:10px}.breadcrumbs b{color:#424c60}.top-right{display:flex;align-items:center;gap:15px}.today{display:flex;align-items:center;gap:7px;color:#778194;font-size:10px}.today i{width:6px;height:6px;background:#3eb489;border-radius:50%}.top-avatar{width:27px;height:27px}.content{max-width:1250px;margin:auto;padding:28px 32px 18px}.heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:20px}.heading h1{font:700 23px Manrope;letter-spacing:-.8px;color:#283146;margin:6px 0 4px}.heading p{font-size:11px;color:#929aaa;margin:0}.heading-buttons{display:flex;gap:8px}.course-strip{min-height:72px;border:1px solid #e7ebf0;border-radius:10px;background:#fff;display:flex;align-items:center;padding:11px 14px;gap:13px;box-shadow:0 2px 6px #2f3a5609}.course-icon{width:37px;height:37px;background:#eff1ff;color:#6376d4;border-radius:9px;display:grid;place-items:center}.course-title{display:grid;gap:3px;min-width:160px}.course-title small,.course-room small,.course-enrol small{font-size:8px;color:#9aa2af;letter-spacing:.7px;font-weight:700}.course-title b{font:700 12px Manrope;color:#374156}.course-title span{font-size:9px;color:#929aaa}.course-room,.course-enrol{margin-left:auto;display:grid;gap:5px;min-width:72px}.course-room b,.course-enrol b{font-size:10px;color:#5a6578}.strip-action{height:29px;border:0;border-left:1px solid #edf0f3;padding:0 2px 0 14px;background:none;color:#6075d2;display:flex;align-items:center;gap:6px;font-size:9px;font-weight:700}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:13px 0}.stat{min-height:121px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:13px 14px;display:grid;grid-template-columns:31px 1fr;grid-template-rows:31px auto auto;column-gap:9px;align-items:center}.stat-icon{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;grid-row:1}.stat-icon.blue{background:#eef2ff;color:#5d79dd}.stat-icon.green{background:#e9f7f0;color:#39a47c}.stat-icon.orange{background:#fff4e6;color:#d39842}.stat-icon.violet{background:#f2edff;color:#9574d6}.stat>span{font-size:9px;color:#858e9f}.stat>b{grid-column:1/-1;font:700 23px Manrope;color:#2c3549;margin-top:7px}.stat>small{grid-column:1/-1;color:#969ead;font-size:9px;margin-top:-3px}.panel{border:1px solid var(--line);border-radius:10px;background:#fff;box-shadow:0 2px 7px #303c5607}.roster{overflow:hidden}.panel-head{display:flex;align-items:center;justify-content:space-between;padding:15px 17px 12px}.panel-head h2{font:700 13px Manrope;color:#323c50;margin:0 0 4px}.panel-head p{font-size:9px;color:#969ead;margin:0}.compact{height:30px;font-size:9px;padding:0 9px}.toolbar{display:flex;align-items:center;gap:8px;padding:0 17px 12px}.search{height:30px;border:1px solid #e6e9ef;border-radius:6px;display:flex;align-items:center;gap:7px;padding:0 8px;max-width:370px;flex:1;color:#9da5b2}.search input{border:0;outline:0;min-width:0;flex:1;font-size:9px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:620px}thead{background:#fafbfc}th{height:31px;border-block:1px solid #eff1f4;text-align:left;padding:0 12px;color:#9da4b0;font-size:8px;letter-spacing:.7px}th:first-child,td:first-child{padding-left:17px}th:first-child{width:34%}th:last-child{width:105px}td{height:53px;border-bottom:1px solid #f0f2f5;padding:0 12px;color:#626c7e;font-size:9px}tbody tr:last-child td{border-bottom:0}.student{display:flex;align-items:center;gap:9px}.student-avatar{width:29px;height:29px;border-radius:50%;background:#e8edfb;color:#5e77c5;display:grid;place-items:center;font-size:8px;font-weight:700}.student>div{display:grid;gap:3px}.student b{font-size:9px;color:#414b5e}.student small{font-size:8px;color:#9ba2b0}.student code,.qr-modal>code{background:#f6f7f9;border:1px solid #edf0f3;border-radius:4px;padding:4px 6px;color:#7e8796;font:8px monospace}.badge{display:inline-flex;align-items:center;gap:5px;border-radius:12px;padding:4px 7px;font-size:8px;font-weight:600}.badge i{width:5px;height:5px;background:currentColor;border-radius:50%}.badge.present{color:#31a178;background:#e8f6ef}.badge.absent{color:#848d9b;background:#f0f2f5}.time{display:flex;align-items:center;gap:5px;height:53px}.time svg{color:#a2aab7}.row-actions{display:flex;gap:2px}.row-actions button{border:0;background:transparent;width:25px;height:25px;display:grid;place-items:center;color:#8993a3;border-radius:5px}.row-actions button:hover{background:#f1f3f7;color:#526ed4}.empty{padding:22px;text-align:center;color:#929aaa;font-size:10px}.table-foot{height:42px;border-top:1px solid #eff1f4;padding:0 17px;display:flex;align-items:center;justify-content:space-between;font-size:9px;color:#9199a8}.table-foot span{color:#36a17a;font-weight:600}.bottom-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:12px;margin-top:13px}.bottom-grid .panel{min-height:165px}.recent .panel-head{padding-bottom:8px}.subtle-icon{color:#8b96a7}.recent-row{height:34px;display:flex;align-items:center;gap:9px;margin:0 17px;border-top:1px solid #f0f2f5}.recent-check{width:20px;height:20px;border-radius:50%;background:#e9f7f0;color:#38a37a;display:grid;place-items:center}.recent-check svg{width:12px}.recent-row b{font-size:9px;color:#515b6c;flex:1}.recent-row>span:nth-of-type(2),.recent-row time{font-size:8px;color:#929aaa}.recent-empty{padding:11px}.report-card{padding:16px 17px;display:grid;justify-items:start;align-content:start}.report-icon{width:31px;height:31px;display:grid;place-items:center;color:#687add;background:#eef1ff;border-radius:8px}.report-card h2{font:700 12px Manrope;margin:10px 0 4px;color:#374155}.report-card p{font-size:9px;color:#9199a8;line-height:1.5;margin:0 0 11px}.report-card .secondary{height:29px;font-size:9px}.welcome{min-height:165px;padding:25px;display:flex;align-items:center;gap:15px}.welcome-icon{width:47px;height:47px;border-radius:12px;background:#eef1ff;color:#667add;display:grid;place-items:center}.welcome>div:nth-child(2){flex:1}.welcome h2{font:700 15px Manrope;margin:0 0 5px}.welcome p{font-size:10px;color:#8e97a6;margin:0}.welcome .primary{margin-left:auto}.content footer{display:flex;justify-content:space-between;padding:18px 2px;color:#a0a7b2;font-size:8px}.content footer span:last-child{display:flex;align-items:center;gap:5px}.content footer svg{color:#52ad88}.backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#222c4173;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:20;display:grid;place-items:center;padding:18px}.modal{width:min(100%,440px);padding:22px;background:#fff;border-radius:13px;box-shadow:0 20px 65px #15203b37}.modal-title{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:16px}.modal-title h2,.qr-modal h2{font:700 18px Manrope;color:#293247;margin:5px 0 4px}.modal-title p,.qr-modal p{font-size:10px;color:#929aaa;margin:0}.close{border:0;background:transparent;color:#8993a2;width:28px;height:28px;display:grid;place-items:center}.close svg{width:18px}.form-fields{display:grid;gap:13px}.form-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}.reader{min-height:220px;background:#f2f4f8;border-radius:9px;overflow:hidden;display:grid;place-items:center}#reader{width:100%}#reader video{border-radius:8px;object-fit:cover}#reader__dashboard_section_csr button{border:0;background:#5675de;color:#fff;border-radius:5px;padding:7px 10px;font-size:9px}.manual-code{margin-top:15px;display:grid;gap:7px}.manual-code label{font-size:9px;color:#707b8d}.manual-code>div{display:flex;gap:7px}.manual-code input{flex:1}.manual-code .primary{height:39px}.qr-modal{text-align:center;display:grid;justify-items:center;gap:10px;position:relative}.qr-modal h2,.qr-modal p{margin:0}.qr-close{position:absolute;right:13px;top:13px}.qr-box{padding:14px;border:1px solid #edf0f3;border-radius:11px;margin:5px}.qr-modal>code{font-size:10px;padding:6px 10px}.qr-modal .secondary{margin-top:5px}.toast{position:fixed;right:22px;bottom:20px;z-index:35;display:flex;align-items:center;gap:9px;background:#283348;color:#fff;border-radius:8px;box-shadow:0 8px 25px #1e293b32;padding:10px 12px;max-width:min(430px,calc(100vw - 24px));font-size:10px}.toast svg{color:#71d4a8;flex:none}.toast span{flex:1}.toast button{border:0;background:transparent;color:#c0c8d3;display:grid;place-items:center}.hamburger,.close-nav,.scrim{display:none}@media(max-width:1000px){.sidebar{width:216px}.app main{margin-left:216px}.content{padding-inline:22px}.topbar{padding:0 22px}.stats{gap:8px}.stat{padding:11px}}@media(max-width:760px){.sidebar{transform:translate(-100%);transition:transform .2s;width:245px}.sidebar.show{transform:translate(0)}.app main{margin-left:0}.hamburger{width:30px;height:30px;border:0;background:transparent;color:#7c8798;display:grid;place-items:center;margin-right:9px}.hamburger svg{width:19px}.close-nav{display:grid;margin-left:auto}.brand{width:100%}.scrim{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:#15203955;border:0;z-index:4}.breadcrumbs{margin-right:auto}.topbar{justify-content:flex-start}.top-right{margin-left:auto}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.heading{align-items:flex-start;display:block}.heading-buttons{margin-top:13px}.heading-buttons>*{flex:1}.bottom-grid{grid-template-columns:1fr}.course-strip{flex-wrap:wrap}.course-title{flex:1}.course-room{margin-left:0}.strip-action{margin-left:auto}.welcome{flex-wrap:wrap}.welcome .primary{margin-left:62px}}@media(max-width:520px){body{min-width:360px}.topbar{height:54px;padding:0 12px}.today{font-size:0}.today i{width:7px;height:7px}.top-right{gap:9px}.content{padding:19px 12px 14px}.heading h1{font-size:21px}.heading-buttons .secondary,.heading-buttons .primary{font-size:9px;padding:0 8px}.course-strip{gap:9px;padding:10px}.course-title{min-width:calc(100% - 55px)}.course-room{margin-left:46px}.course-enrol{margin-left:7px}.strip-action{font-size:0;padding-left:9px}.strip-action svg{width:18px}.stats{gap:7px}.stat{min-height:108px;padding:9px;column-gap:6px}.stat>b{font-size:20px}.panel-head{padding:12px}.toolbar{padding:0 10px 10px}.table-foot{padding:0 10px}.bottom-grid .panel{min-height:155px}.content footer{font-size:7px}.auth-card{padding:25px 21px}.welcome{padding:18px}.welcome>div:nth-child(2){min-width:calc(100% - 65px)}.welcome p{line-height:1.5}.welcome .primary{margin-left:0}.report-card{min-height:150px!important}}@media print{body *{visibility:hidden!important}.qr-modal,.qr-modal *{visibility:visible!important}.backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#fff;padding:0}.qr-modal{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;box-shadow:none;border:0}.qr-close,.qr-modal .secondary{display:none!important}}.student-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.student small{max-width:240px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.welcome-actions{display:flex;gap:8px;margin-left:auto}.welcome>div:nth-child(2)>small{display:block;color:#6b7bd0;font-size:9px;margin-top:7px}.welcome-actions .primary,.welcome-actions .secondary{margin:0}@media(max-width:760px){.welcome-actions{margin-left:62px}}@media(max-width:520px){.welcome-actions{margin-left:0;width:100%}.welcome-actions>*{flex:1}}.roster-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}.roster-actions .secondary{margin:0}.welcome-actions{flex-wrap:wrap;justify-content:flex-end}@media(max-width:760px){.roster-actions{width:100%;justify-content:flex-start}.panel-head{flex-wrap:wrap;gap:10px}}@media(max-width:520px){.roster-actions{gap:5px}.roster-actions .secondary{flex:1;font-size:9px;padding-inline:7px}}.logo{overflow:hidden;padding:0;background:#fff}.logo img{display:block;width:100%;height:100%;object-fit:contain;border-radius:inherit}.sidebar .brand>span{font-size:12px;line-height:1.2;flex:1}.auth-card .brand>span{font-size:14px;line-height:1.2}.report-brand{display:flex;align-items:center;gap:9px;width:100%;text-align:left;color:#303a4d;font:700 11px Manrope,sans-serif;margin-bottom:4px}.report-brand img{width:34px;height:34px;object-fit:contain;border-radius:6px}.qr-modal .report-brand{justify-content:center;margin:0 0 3px}.qr-modal .report-brand img{width:42px;height:42px}.report-card .report-icon{margin-top:2px}.auth-card label,.form-fields label{font-size:12px}.auth-card input,.form-fields input,.manual-code input{font-size:14px}.primary,.secondary{font-size:12px}.overline{font-size:10px}.subtle{font-size:14px}.sidebar .brand>span{font-size:13px}.school b,.nav,.profile b{font-size:12px}.school small,.course-nav,.profile small,.section-label{font-size:10px}.breadcrumbs,.today{font-size:12px}.heading p{font-size:14px}.course-title small,.course-room small,.course-enrol small{font-size:10px}.course-title b{font-size:14px}.course-title span,.course-room b,.course-enrol b{font-size:12px}.strip-action{font-size:11px}.stat>span{font-size:12px}.stat>small{font-size:11px}.panel-head h2{font-size:16px}.panel-head p{font-size:12px}.compact{font-size:11px}.search input{font-size:12px}th{font-size:10px}td,.student b{font-size:12px}.student small,.student code,.badge{font-size:10px}.time{font-size:12px}.empty{font-size:13px}.table-foot{font-size:11px}.recent-row b{font-size:12px}.recent-row>span:nth-of-type(2),.recent-row time{font-size:10px}.report-card h2{font-size:15px}.report-card p{font-size:12px}.report-card .secondary{font-size:11px}.welcome h2{font-size:18px}.welcome p{font-size:13px}.content footer{font-size:10px}.modal-title p,.qr-modal p,.manual-code label,.toast,.error-box,.auth-toggle{font-size:12px}.auth-note{font-size:10px}.student-form-grid{gap:12px}@media(max-width:520px){.heading p{font-size:13px}.panel-head h2{font-size:15px}.panel-head p,td,.student b{font-size:11px}.student small{font-size:9px}.compact{font-size:10px}.content footer{font-size:9px}.welcome p{font-size:12px}}
