@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
*{box-sizing:border-box}
[hidden]{display:none!important}
:root{
 --navy:#092957;--navy2:#174783;--blue:#2563eb;--blue2:#0d6efd;
 --ink:#102a43;--muted:#72819a;--line:#dce5f0;--bg:#f5f8fc;
 --soft:#edf4ff;--green:#10b981;--yellow:#eab308;--red:#ef4444;
}
html,body{margin:0;min-height:100%;font-family:Inter,Arial,sans-serif;color:var(--ink);background:var(--bg);font-size:13px}
body{min-height:100vh}
a{text-decoration:none;color:inherit}
.top-shell{max-width:1220px;margin:12px auto 0;padding:0 12px}
.hero{
 position:relative;overflow:hidden;min-height:182px;border-radius:17px 17px 15px 15px;
 background:linear-gradient(110deg,#071d3d 0%,#0d3265 48%,#204f88 100%);
 color:#fff;box-shadow:0 18px 40px rgba(10,35,69,.15)
}
.hero:before,.hero:after{content:"";position:absolute;border-radius:50%;border:44px solid rgba(255,255,255,.055);width:190px;height:190px;right:-50px;top:-125px}
.hero:after{width:150px;height:150px;right:110px;top:-95px;border-width:34px}
.hero-accent{position:absolute;right:28px;bottom:26px;width:61px;height:3px;background:#f3c623;border-radius:4px}
.hero-content{position:relative;z-index:2;padding:27px 28px 22px}
.kicker{font-size:10px;font-weight:800;letter-spacing:1px;color:#ffd52a;text-transform:uppercase}
.hero h1{font-size:27px;line-height:1.15;margin:11px 0 7px;letter-spacing:-.8px;color:#fff}
.hero p{margin:0;max-width:690px;color:#d4e1f3;font-size:11.5px;line-height:1.65}
.hero-date{margin-top:22px;font-size:11px;color:#e5edf7}
.user-pill{position:absolute;right:27px;top:25px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.10);padding:8px 12px;border-radius:999px;font-size:10px;font-weight:700}
.user-pill i{display:inline-block;width:7px;height:7px;background:#5ee4a6;border-radius:50%;margin-right:5px}
.nav-float{
 position:relative;z-index:5;margin:-7px 16px 0;background:#fff;border:1px solid #dce5f0;
 border-radius:17px;box-shadow:0 10px 28px rgba(30,55,88,.10);padding:12px;
 display:flex;gap:8px;align-items:center
}
.nav-float a{
 flex:1;text-align:center;border:1px solid #dce5f0;background:#fbfdff;border-radius:12px;
 padding:15px 10px;color:#284363;font-size:11px;font-weight:700;transition:.15s
}
.nav-float a:hover,.nav-float a.active{background:#eef5ff;border-color:#bfd5fb;color:#1554b5}
.nav-float .ico{font-size:15px;color:#2563eb;display:block;margin-bottom:5px}
.page-wrap{max-width:1220px;margin:0 auto;padding:18px 12px 34px}
.filter-card,.panel,.form-card,.stat-card{background:#fff;border:1px solid #dce5f0;border-radius:16px;box-shadow:0 8px 26px rgba(25,51,83,.055)}
.filter-card{padding:13px 15px;margin-bottom:18px}
.filter-title{font-size:9px;color:#74839a;text-transform:uppercase;font-weight:800;letter-spacing:.5px;margin-bottom:8px}
.filter-row{display:flex;gap:8px;align-items:center}
select,input,textarea{
 font:inherit;color:#233b57;background:#f9fbfd;border:1px solid #d9e3ef;border-radius:10px;
 outline:none;padding:11px 12px;width:100%
}
input:focus,select:focus,textarea:focus{border-color:#78a9e9;box-shadow:0 0 0 3px rgba(37,99,235,.08)}
.btn{border:0;border-radius:10px;padding:11px 16px;font-weight:700;font-size:11px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.btn-primary{background:linear-gradient(90deg,#173f80,#2563eb);color:#fff;box-shadow:0 7px 16px rgba(37,99,235,.16)}
.btn-light{background:#eef2f7;color:#52647b}
.btn-danger{background:#fff0f0;color:#c52f38}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:14px}
.stat-card{min-height:116px;padding:15px;position:relative;overflow:hidden}
.stat-card:after{content:"";position:absolute;width:72px;height:72px;border-radius:50%;right:-18px;bottom:-30px;background:#eaf1ff}
.stat-card:nth-child(2):after{background:#e3f7ef}.stat-card:nth-child(3):after{background:#fff3d4}.stat-card:nth-child(4):after{background:#ffebed}
.stat-icon{width:29px;height:29px;border-radius:8px;background:#edf3ff;color:#2563eb;display:grid;place-items:center;font-size:13px}
.stat-card:nth-child(2) .stat-icon{background:#e8f8f0;color:#16a879}.stat-card:nth-child(3) .stat-icon{background:#fff5d9;color:#c58b0b}.stat-card:nth-child(4) .stat-icon{background:#ffeded;color:#e34d55}
.stat-label{position:absolute;right:15px;top:20px;color:#7d8aa0;font-size:9px}
.stat-value{font-size:23px;font-weight:800;margin-top:16px;letter-spacing:-.5px}
.stat-sub{font-size:9px;color:#6e7e94;margin-top:4px}
.notice{background:#fff;border:1px solid #dce5f0;border-radius:14px;padding:13px 16px;margin-bottom:14px;display:flex;gap:12px;align-items:center}
.notice-icon{width:30px;height:30px;border-radius:8px;background:#fff3d7;color:#bd8300;display:grid;place-items:center}
.notice b{font-size:11px}.notice span{display:block;color:#7a889e;font-size:9px;margin-top:2px}
.two-col{display:grid;grid-template-columns:1.75fr 1fr;gap:14px}
.panel{padding:15px}
.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px}
.panel-title{font-size:12px;font-weight:800}.panel-note{font-size:8px;color:#8793a7}
.chart{height:255px;position:relative;padding:10px 8px 24px}
.chart-grid{position:absolute;inset:14px 12px 26px 34px;display:flex;flex-direction:column;justify-content:space-between}
.chart-grid span{border-top:1px solid #edf1f6;position:relative}
.chart-grid span:before{content:attr(data-v);position:absolute;left:-25px;top:-7px;font-size:8px;color:#9aa6b7}
.chart-svg{position:absolute;inset:14px 12px 26px 34px}
.chart-labels{position:absolute;left:34px;right:12px;bottom:2px;display:flex;justify-content:space-between;color:#8a97aa;font-size:8px}
.rank-list{display:flex;flex-direction:column;gap:7px}
.rank-row{border:1px solid #dfe7f1;border-radius:11px;padding:10px;display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:9px;background:#fbfdff}
.rank-no{width:25px;height:25px;border-radius:8px;background:#eef4ff;color:#174783;display:grid;place-items:center;font-size:9px;font-weight:800}
.rank-name{font-weight:800;font-size:10px}.rank-meta{color:#8b98aa;font-size:8px;margin-top:3px}.rank-score{font-size:10px;font-weight:800;color:#e02f35}
.table-wrap{overflow:auto}
.table{width:100%;border-collapse:collapse}.table th{font-size:9px;text-transform:uppercase;color:#7c8ba0;background:#f6f9fc;text-align:left;padding:10px}.table td{padding:11px;border-top:1px solid #edf1f5;font-size:10px;vertical-align:top}
.pill{display:inline-flex;padding:4px 7px;border-radius:999px;font-size:8px;font-weight:800;background:#e5f8ed;color:#15955f}.pill.warn{background:#fff4d7;color:#ae7600}.pill.red{background:#ffebec;color:#c33139}.pill.blue{background:#eaf2ff;color:#2360c7}
.form-card{padding:20px}.form-head{display:flex;align-items:center;gap:11px;margin-bottom:18px}.form-icon{width:31px;height:31px;border-radius:9px;background:#edf3ff;color:#2563eb;display:grid;place-items:center}.form-title{font-size:13px;font-weight:800}.form-note{margin-left:auto;color:#8a96a9;font-size:9px}.form-grid{display:grid;grid-template-columns:280px minmax(0,1fr);gap:15px}.full{grid-column:1/-1}.field label{display:block;font-size:10px;font-weight:700;margin-bottom:7px}.required{color:#d83b42}.help{display:block;color:#8c99aa;font-size:8px;margin-top:5px}.selected{border:1px solid #c9dbf3;background:#f4f8ff;border-radius:10px;padding:11px;display:flex;justify-content:space-between;align-items:center}.selected b{font-size:11px}.selected small{display:block;color:#75869c;font-size:9px;margin-top:3px}.suggestions{position:relative}.suggestion-list{position:absolute;left:0;right:0;top:100%;z-index:20;background:#fff;border:1px solid #dce5f0;border-radius:10px;box-shadow:0 15px 30px rgba(20,42,70,.12);max-height:250px;overflow:auto}.suggestion{display:block;width:100%;text-align:left;border:0;background:#fff;padding:10px 12px;border-bottom:1px solid #eef2f6;cursor:pointer}.suggestion:hover{background:#f3f7fd}.suggestion strong{display:block;font-size:10px}.suggestion small{font-size:8px;color:#8190a4}.rule-box{border:1px solid #dfe7f1;background:#f8fafc;border-radius:10px;padding:12px;font-size:9px;color:#67788e;line-height:1.6}.form-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:5px}.wide{width:100%}
.data-toolbar{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:9px;margin-bottom:14px}
.data-list{display:flex;flex-direction:column;gap:9px}.record{border:1px solid #dfe7f1;border-radius:12px;padding:13px 14px;background:#fff;display:grid;grid-template-columns:42px 1fr auto;gap:11px;align-items:center}.avatar{width:37px;height:37px;border-radius:10px;background:linear-gradient(145deg,#174783,#2563eb);color:#fff;display:grid;place-items:center;font-weight:800}.record-name{font-size:10px;font-weight:800}.record-meta{font-size:8px;color:#7e8ca0;margin-top:3px}.record-detail{font-size:9px;margin-top:7px;color:#314b68}.record-sub{font-size:8px;color:#8190a2;margin-top:4px}.record-actions{display:flex;align-items:center;gap:8px}.score{padding:7px 10px;border-radius:8px;background:#ddfae9;color:#15955f;font-size:9px;font-weight:800}.icon-btn{width:31px;height:31px;border:0;border-radius:8px;background:#edf3ff;color:#2862c6;cursor:pointer}.icon-btn.delete{background:#ffeded;color:#d33b44}
.empty{text-align:center;padding:35px;color:#8a96a8;font-size:10px}.alert{padding:11px 13px;border-radius:9px;font-size:10px;margin-bottom:12px}.alert.danger{background:#fff0ef;color:#a82b25;border:1px solid #f0c8c4}.alert.success{background:#eaf9f0;color:#176b3a;border:1px solid #c4e8d0}
.footer{max-width:1220px;margin:auto;padding:0 12px 24px;color:#9aa6b7;font-size:9px;display:flex;justify-content:space-between}
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:28px;background:linear-gradient(135deg,#eef3f8 0%,#f8fafc 55%,#e8eef6 100%);position:relative;overflow:hidden}.login-page:before{content:"";position:absolute;inset:-30%;background:radial-gradient(circle at 20% 20%,rgba(31,78,121,.10),transparent 28%),radial-gradient(circle at 85% 80%,rgba(37,99,235,.08),transparent 30%);pointer-events:none}.login-shell{width:min(920px,96vw);display:grid;grid-template-columns:1.02fr .98fr;background:#fff;border:1px solid #d9e2ec;border-radius:24px;overflow:hidden;box-shadow:0 24px 70px rgba(18,48,80,.16);position:relative;z-index:1}.login-panel{padding:42px 44px}.login-panel.brand-panel{background:linear-gradient(150deg,#102f59 0%,#174a7e 58%,#1d5d94 100%);color:#fff;position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:520px;overflow:hidden}.brand-panel:before,.brand-panel:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.12);border-radius:50%;pointer-events:none}.brand-panel:before{width:330px;height:330px;right:-150px;top:-120px}.brand-panel:after{width:260px;height:260px;left:-150px;bottom:-120px}.ministry-line{display:flex;align-items:center;gap:12px;position:relative;z-index:1}.login-emblem{width:50px;height:50px;border:1px solid rgba(255,255,255,.38);border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.10);box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}.login-emblem svg{width:28px;height:28px}.brand-kicker{font-size:9px;letter-spacing:1.5px;font-weight:800;text-transform:uppercase;opacity:.78}.brand-name{font-size:12px;font-weight:800;letter-spacing:.4px;margin-top:3px}.brand-copy{position:relative;z-index:1;margin-top:auto;padding-top:60px}.brand-copy h1{font-size:32px;line-height:1.18;margin:0 0 13px;font-weight:850;letter-spacing:-.6px}.brand-copy p{font-size:12px;line-height:1.8;margin:0;color:rgba(255,255,255,.78);max-width:410px}.brand-footer{position:relative;z-index:1;margin-top:30px;padding-top:16px;border-top:1px solid rgba(255,255,255,.16);font-size:9px;color:rgba(255,255,255,.62)}.login-panel.form-panel{display:flex;flex-direction:column;justify-content:center}.login-form-head{margin-bottom:24px}.login-form-head .eyebrow{font-size:9px;font-weight:800;color:#2563a6;letter-spacing:1.3px;text-transform:uppercase;margin-bottom:8px}.login-title{text-align:left;font-size:25px;font-weight:850;color:#14283d;margin:0 0 7px;letter-spacing:-.35px}.login-sub{text-align:left;color:#748396;font-size:11px;line-height:1.65;margin:0}.login-card{width:auto;background:transparent;border:0;border-radius:0;padding:0;box-shadow:none}.login-card label{display:block;font-size:10px;font-weight:800;color:#33485d;margin:14px 0 7px}.login-card input:not([type=hidden]){width:100%;height:46px;border:1px solid #d4dee9;border-radius:10px;background:#fbfcfe;padding:0 13px;font:inherit;font-size:12px;color:#203449;outline:none;box-sizing:border-box;transition:.2s}.login-card input:not([type=hidden]):focus{border-color:#3977ad;box-shadow:0 0 0 3px rgba(37,99,235,.10);background:#fff}.login-card .btn{margin-top:18px;height:46px;border-radius:10px;font-size:11px;font-weight:800;letter-spacing:.2px}.login-card .btn.wide{width:100%}.login-note{text-align:center;font-size:9px;color:#94a0ad;margin-top:18px;line-height:1.6}.login-card .alert{margin-bottom:14px}.login-security{display:flex;align-items:center;justify-content:center;gap:6px;font-size:9px;color:#8997a6;margin-top:12px}.login-security:before{content:"✓";width:16px;height:16px;border-radius:50%;display:grid;place-items:center;background:#e8f2eb;color:#2e7a4b;font-weight:900}@media(max-width:760px){.login-page{padding:16px}.login-shell{grid-template-columns:1fr;max-width:480px}.login-panel.brand-panel{min-height:250px;padding:28px 30px}.brand-copy{padding-top:34px}.brand-copy h1{font-size:25px}.brand-footer{margin-top:25px}.login-panel.form-panel{padding:32px 30px}}@media(max-width:420px){.login-panel.brand-panel{min-height:220px}.login-panel{padding:25px 22px}.brand-copy h1{font-size:22px}.login-title{font-size:22px}}
.install-shell{max-width:900px;margin:25px auto;padding:0 14px}.install-card{background:#fff;border:1px solid #dce5f0;border-radius:17px;padding:25px;box-shadow:0 15px 40px rgba(20,45,78,.09)}
@media(max-width:850px){.two-col{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}.data-toolbar{grid-template-columns:1fr 1fr}.nav-float{overflow:auto}.nav-float a{min-width:125px}.hero{min-height:190px}}
@media(max-width:600px){.top-shell{margin-top:6px;padding:0 6px}.hero-content{padding:22px 18px}.hero h1{font-size:22px}.user-pill{right:16px;top:18px}.nav-float{margin:-6px 8px 0;padding:8px}.nav-float a{padding:12px 8px}.page-wrap{padding:14px 8px}.stats{grid-template-columns:1fr 1fr;gap:8px}.stat-card{min-height:105px}.form-grid{grid-template-columns:1fr}.full{grid-column:auto}.form-actions{grid-template-columns:1fr}.data-toolbar{grid-template-columns:1fr}.record{grid-template-columns:36px 1fr}.record-actions{grid-column:2}.footer{padding:0 8px;flex-direction:column;gap:5px}}

.today-panel{margin-top:14px}
.today-table-wrap{overflow:auto}
.today-panel .table td{white-space:normal}

/* V7 global feedback popup */
.toast-stack{position:fixed;right:22px;top:22px;z-index:99999;display:flex;flex-direction:column;gap:10px;width:min(390px,calc(100vw - 28px));pointer-events:none}
.toast{pointer-events:auto;background:#fff;border:1px solid #dce5f0;border-radius:13px;box-shadow:0 16px 38px rgba(20,45,78,.16);padding:13px 14px;display:grid;grid-template-columns:34px 1fr 22px;gap:10px;align-items:start;animation:toastIn .24s ease both}
.toast.success{border-left:4px solid #10b981}.toast.error{border-left:4px solid #ef4444}.toast.info{border-left:4px solid #2563eb}.toast.warning{border-left:4px solid #eab308}
.toast-icon{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;font-weight:900;font-size:14px}
.toast.success .toast-icon{background:#e8f8f0;color:#129866}.toast.error .toast-icon{background:#ffeded;color:#d53a43}.toast.info .toast-icon{background:#eaf2ff;color:#2563eb}.toast.warning .toast-icon{background:#fff4d8;color:#b77a00}
.toast-title{font-size:11px;font-weight:800;color:#173451;margin-top:1px}.toast-message{font-size:9px;color:#718199;line-height:1.55;margin-top:3px}
.toast-close{border:0;background:transparent;color:#9aa6b7;cursor:pointer;font-size:15px;padding:0}
.toast-progress{height:2px;background:#e9eef5;border-radius:2px;grid-column:2/4;overflow:hidden;margin-top:2px}.toast-progress i{display:block;height:100%;background:#2563eb;transform-origin:left;animation:toastProgress 4.5s linear forwards}
.toast.success .toast-progress i{background:#10b981}.toast.error .toast-progress i{background:#ef4444}.toast.warning .toast-progress i{background:#eab308}
@keyframes toastIn{from{opacity:0;transform:translateY(-10px) translateX(12px)}to{opacity:1;transform:none}}
@keyframes toastOut{to{opacity:0;transform:translateY(-8px) translateX(12px)}}
@keyframes toastProgress{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@media(max-width:600px){.toast-stack{right:14px;top:14px}}

.record-actions form{margin:0;display:inline-flex}
.table .btn{padding:7px 9px;font-size:9px}
.field input[type=file]{background:#fff}
.detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:4px}.detail-grid>div{background:#f8fafc;border:1px solid #edf1f5;border-radius:12px;padding:12px}.detail-label{font-size:8px;text-transform:uppercase;letter-spacing:.04em;color:#8b98aa;font-weight:800;margin-bottom:5px}.detail-value{font-size:11px;font-weight:800;color:#24364d}@media(max-width:760px){.detail-grid{grid-template-columns:1fr 1fr}}@media(max-width:480px){.detail-grid{grid-template-columns:1fr}}
.student-link{color:#1f5fbf;text-decoration:none;border-bottom:1px dashed #9dbce8}.student-link:hover{text-decoration:underline;color:#174a96}