:root{--bs-body-color:#23334d;--bs-primary:#2163de;--bs-primary-rgb:33,99,222;--bs-font-sans-serif:Inter,"Segoe UI",Arial,sans-serif;--panel-border:#e5eaf2;--panel-muted:#718097;--navy:#142847;--panel-bg:#f4f7fc;--panel-shadow:0 3px 18px #172b4d05}
body{font-size:14px;color:var(--bs-body-color);background:var(--panel-bg)}[hidden]{display:none!important}button,a,input,select{touch-action:manipulation}a{text-decoration:none}.btn{font-size:13px;font-weight:600;border-radius:7px;padding:.58rem .85rem}.btn-primary{--bs-btn-bg:#2163de;--bs-btn-border-color:#2163de;--bs-btn-hover-bg:#1753c2;--bs-btn-hover-border-color:#1753c2}.btn-light{--bs-btn-bg:#f0f4fa;--bs-btn-border-color:#f0f4fa;--bs-btn-color:#465875}.btn-lg{padding:.83rem 1rem;font-size:14px}.form-control,.form-select{font-size:14px;min-height:42px;border-color:#dbe2ed;border-radius:7px}.form-control:focus,.form-select:focus{box-shadow:0 0 0 3px #2163de18;border-color:#74a0f4}.form-label{font-size:13px;font-weight:600;margin-bottom:7px}.eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:750}.brand-mark{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#3478f4;color:#fff;font-size:27px;font-weight:650;flex-shrink:0}
#startup{position:fixed;inset:0;z-index:2000;background:var(--bs-body-bg);display:flex;justify-content:center;align-items:center;gap:13px;font-size:25px}#login{display:grid;grid-template-columns:46% 54%;min-height:100vh}.login-story{background:linear-gradient(145deg,#152e52,#175bd1);color:white;padding:45px 10%;display:flex;flex-direction:column;position:relative;overflow:hidden}.login-story:after{content:"";width:480px;height:480px;border:1px solid #ffffff18;border-radius:50%;position:absolute;right:-230px;bottom:-90px;box-shadow:0 0 0 75px #ffffff06,0 0 0 150px #ffffff04;pointer-events:none}.login-brand{display:flex;align-items:center;gap:13px;color:white;font-size:27px;font-weight:650}.story-copy{margin:auto 0;position:relative;z-index:1}.story-copy>.eyebrow{color:#afccff}.story-copy h1{font-size:clamp(38px,4vw,60px);line-height:1.15;letter-spacing:-1.7px;font-weight:650;margin:22px 0}.story-copy>p{color:#c4d6f4;line-height:1.9;font-size:16px}.story-features{display:grid;gap:20px;margin-top:46px;color:#9fbef6;font-size:12px}.story-features b{margin-left:20px;color:white;font-weight:500;font-size:14px}.story-footer{padding-top:30px;font-size:12px;color:#a8c4f0}.login-side{position:relative;display:flex;justify-content:center;align-items:center;background:var(--bs-body-bg);padding:90px 8%}.login-form-wrap{max-width:390px;width:100%}.login-form-wrap h2{font-size:30px;font-weight:650;letter-spacing:-.9px;margin:15px 0 12px}.theme-button{position:absolute;right:28px;top:26px}.login-copyright{position:absolute;bottom:26px;font-size:11px;color:var(--panel-muted)}.login-footnote{color:var(--panel-muted);font-size:12px;line-height:1.7;margin-top:28px}.verification-choice{border:1px solid var(--panel-border);padding:13px 16px;border-radius:8px;display:flex;gap:28px}.verification-choice legend{font-size:12px;width:auto;float:none;font-weight:600;margin-bottom:6px}.verification-choice label{display:flex;align-items:center;gap:8px}.otp-field{font-size:28px;letter-spacing:10px;text-align:center}
.app-wrapper{--lte-sidebar-width:235px}.app-sidebar{background:#142847;color:#afc0db;border:0}.sidebar-brand{border-color:#ffffff0d;height:78px;justify-content:start;padding:0 22px}.brand-link{gap:12px;display:flex;align-items:center;opacity:1}.brand-text{font-size:23px;color:white;font-weight:620;letter-spacing:-.5px}.brand-text small{display:block;font-size:8px;letter-spacing:1.65px;font-weight:500;color:#9fb7da;margin-top:4px}.sidebar-wrapper{padding:20px 14px;display:flex;flex-direction:column;min-height:calc(100vh - 78px)}.nav-section{font-size:9px;letter-spacing:1.4px;color:#829bbe;padding:15px 15px 9px;font-weight:700}.panel-nav{list-style:none;padding:0;margin:0}.panel-nav a{display:flex;align-items:center;gap:12px;color:#b6c7e1;padding:10px 14px;margin:2px 0;border-radius:7px;font-size:13px;transition:background .15s}.panel-nav a:hover{background:#ffffff09;color:#fff}.panel-nav a.active{background:#2163de;color:#fff;box-shadow:0 3px 12px #07172a20}.nav-icon{width:20px;height:20px;flex-shrink:0;display:block}.sidebar-note{margin-top:auto;padding:26px 10px 3px;display:flex;align-items:center;gap:12px;font-size:11px;line-height:1.7;color:#8fa6c8}.sidebar-note strong{color:#c1cfe4;font-size:10px;font-weight:500}.mini-logo{font-size:25px;font-weight:600;color:#5076ab}.app-header{border-color:var(--panel-border);min-height:70px;box-shadow:var(--panel-shadow);padding:0 24px}.header-title{display:flex;gap:16px;align-items:center;font-size:12px}.header-separator{color:#c0cada}.header-actions{margin-left:auto;display:flex;align-items:center;gap:13px;font-size:12px}.connection-dot{height:6px;width:6px;border-radius:50%;background:#25a378}.icon-button{font-size:19px;padding:3px 9px;margin-left:12px}.user-avatar{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#e9effc;color:#3664b3;font-weight:700;font-size:11px}.mobile-menu{display:none}.app-main{background:var(--panel-bg)}.scope-bar{display:flex;align-items:flex-end;gap:16px;padding:20px 30px 0}.scope-bar label{display:block;font-weight:700;font-size:9px;letter-spacing:1.2px;color:var(--panel-muted);margin-bottom:6px}.scope-school{max-width:470px;width:52%}.scope-session{width:180px}.scope-bar .form-select{font-size:12px;min-height:37px;background-color:var(--bs-body-bg)}.scope-bar>#refresh{margin-left:auto;font-size:12px}.app-content-header{display:flex;justify-content:space-between;align-items:center;padding:28px 30px 21px;gap:15px}.app-content-header h1{font-size:27px;font-weight:650;letter-spacing:-.7px;margin:6px 0}.app-content-header p{font-size:12px;margin:0}.app-content{padding:0 30px 32px}.app-footer{font-size:11px;display:flex;gap:12px;border-color:var(--panel-border);padding:17px 30px;color:var(--panel-muted);margin-top:auto}.app-footer strong{color:#4d6486}.footer-right{margin-left:auto}
.welcome-band{background:linear-gradient(115deg,#2163de,#3d7eeb);color:#fff;border-radius:10px;padding:25px 28px;display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.welcome-band h2{font-size:21px;font-weight:600;margin:0 0 7px;letter-spacing:-.4px}.welcome-band p{font-size:12px;color:#d9e7ff;margin:0}.welcome-band .date-chip{border:1px solid #ffffff40;border-radius:7px;font-size:11px;padding:10px 12px}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:0 0 22px}.stat-card{background:var(--bs-body-bg);border:1px solid var(--panel-border);border-radius:10px;padding:20px;box-shadow:var(--panel-shadow);position:relative}.stat-label{font-size:12px;color:var(--panel-muted);font-weight:500}.stat-value{font-size:30px;font-weight:650;letter-spacing:-.7px;margin-top:9px}.stat-note{font-size:10px;color:var(--panel-muted);margin-top:5px}.stat-icon{width:36px;height:36px;padding:9px;position:absolute;right:17px;top:17px;border-radius:9px;background:#eaf1ff;color:#2163de}.stat-card:nth-child(2) .stat-icon{background:#e8f6f0;color:#269271}.stat-card:nth-child(3) .stat-icon{background:#fff3df;color:#c5912f}.stat-card:nth-child(4) .stat-icon{background:#efecff;color:#7a60c2}.stat-card .stat-value.money{font-size:24px}.dashboard-columns{display:grid;grid-template-columns:1.65fr 1fr;gap:22px}.card{border:1px solid var(--panel-border);border-radius:10px;box-shadow:var(--panel-shadow);overflow:hidden}.card-header{padding:18px 20px;background:transparent;border-bottom:1px solid var(--panel-border);display:flex;justify-content:space-between;align-items:center;gap:12px}.card-title{font-size:14px;font-weight:650;margin:0;float:none}.card-subtitle{font-size:11px;color:var(--panel-muted);margin:4px 0 0}.card-body{padding:20px}.card-body p:last-child{margin-bottom:0}.shortcut{display:flex;gap:13px;align-items:center;padding:16px 0;border-bottom:1px solid var(--panel-border);color:inherit}.shortcut:last-child{border:0}.shortcut-icon{width:35px;height:35px;background:#edf3ff;color:#2163de;border-radius:8px;padding:9px}.shortcut strong{font-size:12px;display:block}.shortcut small{color:var(--panel-muted);font-size:11px}.shortcut .arrow{margin-left:auto;color:#8595af}.metric-line{display:flex;align-items:center;justify-content:space-between;margin:15px 0;font-size:12px}.metric-line strong{font-weight:650}.progress{height:6px;background:#edf1f8;margin-bottom:25px}.empty-state{text-align:center;padding:50px 22px;color:var(--panel-muted)}.empty-state .empty-icon{display:grid;place-items:center;width:56px;height:56px;background:#edf3ff;color:#5b86d0;margin:0 auto 17px;border-radius:15px;font-size:25px}.empty-state h3{font-size:16px;color:var(--bs-body-color);margin:0 0 9px}.empty-state p{font-size:12px;max-width:370px;margin:0 auto;line-height:1.7}.loading{text-align:center;padding:65px;color:var(--panel-muted);font-size:12px}.loading span{display:block;margin-top:12px}
.toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:17px 20px;border-bottom:1px solid var(--panel-border)}.search-form{display:flex;gap:7px;max-width:410px;flex:1;min-width:220px}.search-form input{min-height:36px;font-size:12px}.toolbar .form-select{min-height:36px;font-size:12px;width:auto;max-width:230px}.toolbar .count{margin-left:auto;color:var(--panel-muted);font-size:11px}.table{font-size:12px;margin:0;--bs-table-bg:transparent}.table th{background:#f9fbfe;color:#7b8ba1;font-size:10px;letter-spacing:.65px;text-transform:uppercase;font-weight:650;border-bottom:1px solid var(--panel-border);padding:13px 18px;white-space:nowrap}.table td{padding:15px 18px;vertical-align:middle;border-color:var(--panel-border)}.table tr:last-child td{border-bottom:0}.table .primary-cell{font-weight:600;color:var(--bs-body-color)}.table .secondary-cell{display:block;font-size:10px;color:var(--panel-muted);font-weight:400;margin-top:4px}.actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.actions .btn{font-size:10px;padding:5px 8px}.table td.actions-cell{min-width:140px}.status-badge{display:inline-flex;align-items:center;border-radius:5px;padding:4px 7px;font-size:10px;font-weight:600;background:#eaf7f0;color:#23875d}.status-badge.disabled,.status-badge.absent,.status-badge.rejected{background:#fff0ef;color:#b84949}.status-badge.pending,.status-badge.holiday{background:#fff4dc;color:#a57923}.status-badge.neutral{background:#edf2fb;color:#526988}.pagination-bar{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;border-top:1px solid var(--panel-border);font-size:11px;color:var(--panel-muted)}.pagination-bar .btn{font-size:11px;padding:5px 10px}.tab-bar{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:18px}.tab-bar .btn{color:var(--panel-muted);background:var(--bs-body-bg);border:1px solid var(--panel-border);font-size:11px}.tab-bar .btn.active{background:#2163de;color:#fff;border-color:#2163de}.info-note{padding:11px 15px;border-radius:6px;font-size:11px;line-height:1.7;background:#eaf2ff;color:#365a90;margin-bottom:16px}.photo-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;padding:20px}.photo-card{border:1px solid var(--panel-border);border-radius:8px;padding:12px;text-align:center}.photo-frame{aspect-ratio:7/9;max-width:144px;width:100%;margin:0 auto 12px;background:#edf2f8;display:grid;place-items:center;border-radius:5px;overflow:hidden;color:#9aaaca;font-size:33px}.photo-frame img{width:100%;height:100%;object-fit:contain}.photo-card h3{font-size:12px;margin:0 0 4px}.photo-card p{font-size:10px;color:var(--panel-muted);margin:0 0 10px}.photo-card .btn{font-size:10px;padding:5px 8px}
dialog{width:min(840px,calc(100vw - 32px));max-height:90vh;border:0;border-radius:13px;padding:0;background:var(--bs-body-bg);color:var(--bs-body-color);box-shadow:0 20px 80px #06172e55}dialog::backdrop{background:#12264385;backdrop-filter:blur(3px)}.dialog-header{position:sticky;top:0;background:var(--bs-body-bg);display:flex;justify-content:space-between;align-items:center;padding:20px 25px;border-bottom:1px solid var(--panel-border);z-index:2}.dialog-header h2{font-size:21px;margin:7px 0 0;font-weight:650}.dialog-header .btn{align-self:flex-start}.dialog-content{padding:24px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.form-grid .wide{grid-column:1/-1}.form-grid .form-label{font-size:12px}.form-grid .form-text{font-size:10px;line-height:1.6}.form-section{grid-column:1/-1;font-size:13px;font-weight:650;border-bottom:1px solid var(--panel-border);padding:10px 0;margin:0}.dialog-footer{display:flex;justify-content:flex-end;gap:9px;padding-top:24px;grid-column:1/-1}.profile-heading{display:flex;gap:24px;padding-bottom:22px;border-bottom:1px solid var(--panel-border);margin-bottom:23px}.profile-heading .photo-frame{width:140px;flex:0 0 140px;margin:0}.profile-heading h3{font-size:24px;font-weight:650;margin:5px 0 8px}.profile-heading p{font-size:12px;color:var(--panel-muted);margin-bottom:10px}.detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:20px 0}.detail-grid dt{color:var(--panel-muted);font-size:10px;font-weight:500;margin-bottom:4px}.detail-grid dd{font-size:12px;word-break:break-word;margin:0}.profile-sections>section{margin-top:24px}.profile-sections h4{font-size:14px;font-weight:650;margin-bottom:12px}.profile-sections .table-responsive{border:1px solid var(--panel-border);border-radius:7px}.credentials{background:#edf7f2;border:1px solid #cce6d9;border-radius:8px;padding:20px}.credentials dt{font-size:12px;margin:10px 0 5px;color:#47705d}.credentials dd{color:#143f2b;font:600 18px Consolas,monospace;word-break:break-all}.assignment-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.assignment-class{border:1px solid var(--panel-border);border-radius:7px;padding:13px}.assignment-class h4{font-size:13px;margin:0 0 10px}.assignment-class label{display:flex;align-items:center;gap:8px;font-size:12px;margin-bottom:6px}.upload-preview{max-width:210px;max-height:270px;object-fit:contain;display:block;margin:0 auto 15px}.photo-input{display:block;border:2px dashed #b9ccee;padding:25px;border-radius:9px;width:100%;background:#f4f8ff}.dialog-error{grid-column:1/-1;margin:0}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);padding:13px 22px;border-radius:8px;background:#1c365d;color:#fff;box-shadow:0 6px 28px #06172e33;z-index:2200;max-width:90vw;font-size:13px}
[data-bs-theme=dark]{--panel-bg:#111c2d;--panel-border:#2b3a50;--panel-muted:#97a8bf;--bs-body-bg:#1b293d;--bs-body-color:#e1e8f2;color-scheme:dark}[data-bs-theme=dark] .app-sidebar{background:#0f1b2e}[data-bs-theme=dark] .table th{background:#18253a;color:#a2b3ca}[data-bs-theme=dark] .btn-light{--bs-btn-bg:#293950;--bs-btn-border-color:#293950;--bs-btn-color:#d6e0ef}[data-bs-theme=dark] .photo-frame,[data-bs-theme=dark] .stat-icon,[data-bs-theme=dark] .shortcut-icon{background:#253b5c;color:#91baff}[data-bs-theme=dark] .form-control,[data-bs-theme=dark] .form-select{border-color:#3a4c65}[data-bs-theme=dark] .photo-input{background:#1b2d47}[data-bs-theme=dark] .credentials{background:#163c30;border-color:#2b6550}[data-bs-theme=dark] .credentials dd{color:#d5f8e7}[data-bs-theme=dark] .credentials dt{color:#a6d7be}[data-bs-theme=dark] .info-note{background:#23395a;color:#bfd5fc}html[data-bs-theme=dark] .text-primary{color:#91baff!important}html[data-bs-theme=dark] .app-footer strong{color:#b8cae5}
.app-main>.app-content-header{padding:28px 30px 21px}
@media(max-width:1199px){.app-main>.app-content-header{padding-left:22px;padding-right:22px}}
@media(max-width:650px){.app-main>.app-content-header{padding:24px 16px 18px}}
@media(min-width:992px){.app-sidebar{position:fixed;top:0;bottom:0}.app-main{min-height:calc(100vh - 70px)}}
@media(max-width:1199px){.photo-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.app-content,.scope-bar{padding-left:22px;padding-right:22px}.app-content-header{padding-left:22px;padding-right:22px}.stat-card{padding:16px}.stat-value{font-size:27px}.stat-icon{right:12px;top:12px;width:30px;height:30px;padding:7px}}
@media(max-width:991px){.mobile-menu{display:inline-block;margin-right:12px}.app-sidebar{position:fixed;inset:0 auto 0 0;z-index:1040;transform:translateX(-100%);transition:transform .2s;width:235px}.sidebar-open .app-sidebar{transform:translateX(0)}.sidebar-open:after{content:"";position:fixed;inset:0;background:#0005;z-index:1039;pointer-events:none}.app-header{padding:0 16px}.app-wrapper{display:block}.app-main{min-height:calc(100vh - 70px)}.dashboard-columns{grid-template-columns:1fr}.stats-grid{gap:12px}.photo-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.header-actions{gap:8px}.header-title>span{display:none}.story-copy h1{font-size:38px}.login-story{padding:35px 9%}.login-side{padding:90px 7%}.stat-label{font-size:11px}.stat-icon{position:static;margin-bottom:12px}.stat-value{margin-top:6px}}
@media(max-width:650px){#login{display:block}.login-story{display:none}.login-side{min-height:100vh;padding:90px 28px}.login-form-wrap h2{font-size:28px}.desktop-only,.connection-dot{display:none!important}.header-title{font-size:11px}.app-header{min-height:62px}.header-actions{gap:6px}.header-actions .btn{font-size:10px}.scope-bar{padding:18px 16px 0;flex-wrap:wrap;gap:10px}.scope-school{width:100%;max-width:none}.scope-session{flex:1}.scope-bar>#refresh{margin-left:0}.app-content-header{padding:24px 16px 18px;align-items:flex-start}.app-content-header h1{font-size:25px}.app-content-header p{max-width:250px;font-size:11px}#page-actions .btn{font-size:10px;padding:9px}.app-content{padding:0 16px 25px}.welcome-band{padding:21px;display:block}.welcome-band h2{font-size:18px}.date-chip{display:none}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.stat-card{padding:15px}.stat-icon{position:absolute;top:13px;right:13px;width:27px;height:27px;padding:6px}.stat-value{margin-top:15px}.stat-value.money{font-size:20px}.stat-label{max-width:90px}.table-directory thead{display:none}.table-directory tbody{display:block}.table-directory tr{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:18px;border-bottom:1px solid var(--panel-border)}.table-directory td{display:block;padding:0;border:0!important;font-size:12px;overflow-wrap:anywhere}.table-directory td:before{content:attr(data-label);display:block;font-size:9px;text-transform:uppercase;color:var(--panel-muted);margin-bottom:4px;letter-spacing:.5px}.table-directory td:first-child{grid-column:1/-1;margin-bottom:3px}.table-directory td:first-child .primary-cell{font-size:14px}.table-directory td.actions-cell{grid-column:1/-1;padding-top:6px}.table-directory td.actions-cell:before{display:none}.actions .btn{font-size:11px;padding:7px 10px}.toolbar{padding:13px;gap:10px}.toolbar .count{width:100%;margin:0}.search-form{min-width:0;max-width:none;width:100%}.photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:13px;gap:10px}.form-grid{grid-template-columns:1fr;gap:14px}.form-grid .wide{grid-column:1}.dialog-header,.dialog-content{padding:18px}.dialog-header h2{font-size:19px}.detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.profile-heading{gap:15px}.profile-heading .photo-frame{width:105px;flex-basis:105px}.profile-heading h3{font-size:19px}.assignment-grid{grid-template-columns:repeat(2,1fr)}.app-footer{padding:17px 16px;flex-wrap:wrap;gap:7px}.footer-right{display:none}.user-avatar{width:27px;height:27px;font-size:10px}}

/* Display copies use the same 7:9 passport frame as the Android apps. */
.passport-portrait{display:block;width:100%;height:100%;object-fit:contain;aspect-ratio:7/9;background:#fff}.text-center>.passport-portrait{width:210px;height:270px;max-width:100%;margin:0 auto 15px;border:1px solid var(--panel-border);border-radius:5px}