@import "https://fonts.googleapis.com/css2?family=Onest:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";.auth-screen{background:linear-gradient(135deg,#f0fdf4 0%,#fff 40%,#f0fdf4 100%);flex-direction:column;justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative;overflow:hidden}.auth-bg-orb{filter:blur(80px);opacity:.4;pointer-events:none;border-radius:50%;position:absolute}.auth-bg-orb-1{background:radial-gradient(circle,#bbf7d0,#0000);width:600px;height:600px;top:-200px;left:-200px}.auth-bg-orb-2{background:radial-gradient(circle,#86efac,#0000);width:400px;height:400px;bottom:-100px;right:-100px}.auth-bg-orb-3{background:radial-gradient(circle,#dcfce7,#0000);width:300px;height:300px;top:50%;left:50%;transform:translate(-50%,-50%)}.auth-card{z-index:1;-webkit-backdrop-filter:blur(24px)saturate(180%);background:#ffffffb8;border:1px solid #ffffffe6;border-radius:24px;width:100%;max-width:420px;margin:0 20px;padding:40px;position:relative;box-shadow:0 8px 32px #22c55e1a,0 2px 8px #0000000f}.auth-logo{align-items:center;gap:10px;margin-bottom:8px;display:flex}.auth-logo-icon{background:linear-gradient(135deg,#4ade80,#16a34a);border-radius:12px;justify-content:center;align-items:center;width:40px;height:40px;display:flex;box-shadow:0 4px 12px #22c55e59}.auth-logo-icon svg{width:20px;height:20px}.auth-logo-text{background:linear-gradient(135deg,#16a34a,#166534);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:22px;font-weight:700}.auth-subtitle{color:#64748b;margin-top:4px;margin-bottom:32px;font-size:14px}.input-group{margin-bottom:14px;position:relative}.input-group label{color:#475569;text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;font-size:12px;font-weight:600;display:block}.input-wrap{position:relative}.input-icon{color:#94a3b8;pointer-events:none;display:flex;position:absolute;top:50%;left:14px;transform:translateY(-50%)}.auth-input{color:#1e293b;background:#fffc;border:1.5px solid #e2e8f0;border-radius:12px;outline:none;width:100%;padding:12px 14px 12px 42px;font-family:Onest,sans-serif;font-size:14px;transition:all .2s cubic-bezier(.4,0,.2,1)}.auth-input:focus{background:#fff;border-color:#4ade80;box-shadow:0 0 0 4px #22c55e1f}.auth-input::placeholder{color:#94a3b8}.auth-btn{color:#fff;cursor:pointer;letter-spacing:.01em;background:linear-gradient(135deg,#22c55e,#16a34a);border:none;border-radius:12px;width:100%;margin-top:8px;padding:14px;font-family:Onest,sans-serif;font-size:15px;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 16px #22c55e59}.auth-btn:hover{background:linear-gradient(135deg,#4ade80,#22c55e);transform:translateY(-1px);box-shadow:0 6px 20px #22c55e66}.auth-btn:active{transform:translateY(0)}:root{--g50:#f0fdf4;--g100:#dcfce7;--g200:#bbf7d0;--g300:#86efac;--g400:#4ade80;--g500:#22c55e;--g600:#16a34a;--g700:#15803d;--g800:#166534;--white:#fff;--s50:#f8fafc;--s100:#f1f5f9;--s200:#e2e8f0;--s300:#cbd5e1;--s400:#94a3b8;--s500:#64748b;--s600:#475569;--s700:#334155;--s800:#1e293b;--s900:#0f172a;--blue:#2563eb;--blue-bg:#2563eb14;--amber:#d97706;--amber-bg:#d9770614;--red:#dc2626;--red-bg:#dc262614;--purple:#7c3aed;--purple-bg:#7c3aed14;--r-sm:8px;--r-md:12px;--r-lg:16px;--r-xl:20px;--r-full:9999px;--sh-sm:0 1px 3px #0000000d,0 1px 2px #00000008;--sh-md:0 4px 16px #00000012,0 2px 6px #0000000a;--t:.2s cubic-bezier(.4,0,.2,1);--font:"Onest",sans-serif;--mono:"JetBrains Mono",monospace;--sidebar:240px}.demo-nav{z-index:9999;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:var(--r-full);background:#0f172ae6;border:1px solid #ffffff1a;gap:4px;padding:5px;display:flex;position:fixed;top:16px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #0000004d}.dn-btn{font-family:var(--font);color:#ffffff8c;border-radius:var(--r-full);cursor:pointer;transition:var(--t);white-space:nowrap;background:0 0;border:none;padding:5px 13px;font-size:12px;font-weight:500}.dn-btn:hover{color:#fff;background:#ffffff1a}.dn-btn.active{background:var(--g500);color:#fff}.screen{display:none}.screen.active{min-height:100vh;display:flex}.sidebar{width:var(--sidebar);border-right:1px solid var(--s100);background:#fff;flex-direction:column;flex-shrink:0;height:100vh;min-height:100vh;padding:20px 12px;display:flex;position:sticky;top:0;overflow-y:auto;box-shadow:2px 0 20px #0000000a}.sl-logo{border-bottom:1px solid var(--s100);align-items:center;gap:9px;margin-bottom:20px;padding:0 6px 20px;display:flex}.nav-i{border-radius:var(--r-md);cursor:pointer;transition:var(--t);color:var(--s500);align-items:center;gap:9px;margin-bottom:1px;padding:9px 10px;font-size:13px;font-weight:500;display:flex}.nav-badge{background:var(--g500);color:#fff;border-radius:var(--r-full);margin-left:auto;padding:1px 6px;font-size:10px;font-weight:700}.nav-badge.red{background:var(--red)}.user-row{border-radius:var(--r-md);cursor:pointer;transition:var(--t);align-items:center;gap:9px;padding:8px 10px;display:flex}.user-av{border-radius:var(--r-md);background:linear-gradient(135deg,var(--g400),var(--g600));color:#fff;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;font-size:12px;font-weight:700;display:flex}.main{background:var(--s50);flex:1;min-height:100vh;overflow-y:auto}.top-bar{z-index:100;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--s100);background:#f8fafceb;justify-content:space-between;align-items:center;padding:14px 28px;display:flex;position:sticky;top:0}.top-bar h1{color:var(--s900);font-size:18px;font-weight:700}.top-bar-sub{color:var(--s400);margin-top:2px;font-size:12px}.top-actions{align-items:center;gap:8px;display:flex}.btn{font-family:var(--font);border-radius:var(--r-md);cursor:pointer;transition:var(--t);border:none;align-items:center;gap:5px;padding:7px 14px;font-size:12px;font-weight:600;display:flex}.btn-primary{background:linear-gradient(135deg,var(--g500),var(--g600));color:#fff;box-shadow:0 2px 8px #22c55e47}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 12px #22c55e61}.btn-ghost{color:var(--s600);border:1.5px solid var(--s200);background:0 0}.btn-ghost:hover{color:var(--s800);background:#fff}.btn-danger{color:var(--red);background:#dc26261a;border:1px solid #dc262633}.btn-danger:hover{background:#dc26262e}.btn-sm{padding:5px 10px;font-size:11px}.body{padding:28px}.stats-row{grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px;display:grid}.sc{border:1px solid var(--s100);border-radius:var(--r-lg);box-shadow:var(--sh-sm);background:#fff;padding:18px}.sc-icon{border-radius:var(--r-md);justify-content:center;align-items:center;width:34px;height:34px;margin-bottom:10px;display:flex}.sc-icon svg{width:16px;height:16px}.sc-label{text-transform:uppercase;letter-spacing:.06em;color:var(--s400);margin-bottom:6px;font-size:11px;font-weight:600}.sc-val{color:var(--s900);font-size:26px;font-weight:800;line-height:1}.sc-change{color:var(--g600);margin-top:3px;font-size:11px;font-weight:600}.sec-hdr{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.sec-title{color:var(--s900);font-size:14px;font-weight:700}.sec-link{color:var(--g600);cursor:pointer;font-size:12px;font-weight:600}.card{border:1px solid var(--s100);border-radius:var(--r-lg);box-shadow:var(--sh-sm);background:#fff;overflow:hidden}.card-p{padding:20px}table{border-collapse:collapse;width:100%}thead th{text-align:left;text-transform:uppercase;letter-spacing:.06em;color:var(--s400);background:var(--s50);border-bottom:1px solid var(--s100);white-space:nowrap;padding:10px 14px;font-size:11px;font-weight:700}tbody tr{border-bottom:1px solid var(--s100);transition:var(--t)}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:var(--s50)}tbody td{color:var(--s700);vertical-align:middle;padding:12px 14px;font-size:13px}.badge{border-radius:var(--r-full);border:1px solid;align-items:center;gap:4px;padding:3px 9px;font-size:11px;font-weight:600;display:inline-flex}.badge-green{color:var(--g700);background:#22c55e1a;border-color:#22c55e33}.badge-blue{background:var(--blue-bg);color:var(--blue);border-color:#2563eb33}.badge-amber{background:var(--amber-bg);color:var(--amber);border-color:#d9770633}.badge-red{background:var(--red-bg);color:var(--red);border-color:#dc262633}.badge-purple{background:var(--purple-bg);color:var(--purple);border-color:#7c3aed33}.badge-gray{background:var(--s100);color:var(--s600);border-color:var(--s200)}.av{border-radius:var(--r-md);color:#fff;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;font-size:11px;font-weight:700;display:inline-flex}.av-green{background:linear-gradient(135deg,var(--g400),var(--g600))}.av-blue{background:linear-gradient(135deg,#60a5fa,var(--blue))}.av-purple{background:linear-gradient(135deg,#a78bfa,var(--purple))}.av-amber{background:linear-gradient(135deg,#fbbf24,var(--amber))}.av-red{background:linear-gradient(135deg,#f87171,var(--red))}.av-pink{background:linear-gradient(135deg,#f472b6,#db2777)}.av-teal{background:linear-gradient(135deg,#2dd4bf,#0d9488)}.av-cell{align-items:center;gap:9px;display:flex}.av-cell-name{color:var(--s800);font-size:13px;font-weight:600}.av-cell-email{color:var(--s400);font-size:11px}.act-menu{gap:5px;display:flex}.filter-bar{align-items:center;gap:10px;margin-bottom:18px;display:flex}.search-wrap{flex:1;max-width:320px;position:relative}.search-wrap svg{color:var(--s400);pointer-events:none;width:14px;height:14px;position:absolute;top:50%;left:10px;transform:translateY(-50%)}.search-input{width:100%;font-family:var(--font);border:1.5px solid var(--s200);border-radius:var(--r-md);color:var(--s800);transition:var(--t);background:#fff;outline:none;padding:8px 12px 8px 32px;font-size:13px}.search-input:focus{border-color:var(--g400);box-shadow:0 0 0 3px #22c55e1a}.search-input::placeholder{color:var(--s400)}.filter-select{font-family:var(--font);color:var(--s600);border:1.5px solid var(--s200);border-radius:var(--r-md);cursor:pointer;background:#fff;outline:none;padding:7px 12px;font-size:12px;font-weight:500}.modal-backdrop{z-index:500;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0f172a73;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.modal-backdrop.open{display:flex}.modal{border-radius:var(--r-xl);background:#fff;width:100%;max-width:480px;margin:20px;padding:28px;animation:.2s slideUp;box-shadow:0 20px 60px #0000002e}@keyframes slideUp{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.modal-title{color:var(--s900);margin-bottom:4px;font-size:16px;font-weight:700}.modal-sub{color:var(--s500);margin-bottom:22px;font-size:13px}.modal-footer{justify-content:flex-end;gap:8px;margin-top:22px;display:flex}.form-group{margin-bottom:14px}.form-label{text-transform:uppercase;letter-spacing:.06em;color:var(--s600);margin-bottom:5px;font-size:11px;font-weight:700;display:block}.form-row{grid-template-columns:1fr 1fr;gap:12px;display:grid}.form-input,.form-select{width:100%;font-family:var(--font);border:1.5px solid var(--s200);border-radius:var(--r-md);color:var(--s800);transition:var(--t);background:#fff;outline:none;padding:10px 12px;font-size:13px}.form-input:focus,.form-select:focus{border-color:var(--g400);box-shadow:0 0 0 3px #22c55e1a}.form-input::placeholder{color:var(--s400)}.activity-list{flex-direction:column;gap:0;display:flex}.activity-item{border-bottom:1px solid var(--s100);align-items:flex-start;gap:12px;padding:12px 0;display:flex}.activity-item:last-child{border-bottom:none}.act-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px;margin-top:4px}.act-text{color:var(--s700);font-size:13px;line-height:1.5}.act-time{color:var(--s400);margin-top:2px;font-size:11px}.class-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;margin-bottom:28px;display:grid}.class-c{border:1.5px solid var(--s100);border-radius:var(--r-lg);cursor:pointer;box-shadow:var(--sh-sm);background:#fff;transition:all .22s;overflow:hidden}.class-c:hover{border-color:#22c55e40;transform:translateY(-3px);box-shadow:0 8px 24px #22c55e1f}.class-c-hdr{align-items:flex-end;height:64px;padding:0 16px;display:flex;position:relative}.class-grade{color:var(--s900);letter-spacing:-.3px;background:#fff;border-radius:8px 8px 0 0;padding:3px 10px 0;font-size:18px;font-weight:800;position:absolute;bottom:-1px;left:14px}.class-c-body{padding:14px 16px 16px}.class-meta{gap:14px;margin-top:2px;display:flex}.class-meta-i{color:var(--s500);align-items:center;gap:4px;font-size:11px;font-weight:500;display:flex}.class-meta-i svg{width:12px;height:12px}.class-prog{background:var(--s100);border-radius:2px;height:3px;margin-top:12px;overflow:hidden}.class-prog-fill{background:linear-gradient(90deg,var(--g400),var(--g600));border-radius:2px;height:100%}.dash-grid{grid-template-columns:2fr 1fr;gap:20px;display:grid}.chart-area{background:var(--s50);border-radius:var(--r-md);justify-content:space-around;align-items:flex-end;gap:6px;height:180px;padding:12px 8px 0;display:flex}.bar-wrap{flex-direction:column;flex:1;align-items:center;gap:6px;display:flex}.bar{background:linear-gradient(180deg,var(--g400),var(--g600));border-radius:6px 6px 0 0;width:100%;min-height:4px;transition:opacity .2s}.bar:hover{opacity:.8}.bar-lbl{color:var(--s400);white-space:nowrap;font-size:10px}.pagination{border-top:1px solid var(--s100);justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.page-info{color:var(--s500);font-size:12px}.page-btns{gap:4px;display:flex}.page-btn{font-family:var(--font);border-radius:var(--r-md);border:1px solid var(--s200);cursor:pointer;color:var(--s600);transition:var(--t);background:#fff;padding:5px 10px;font-size:12px;font-weight:500}.page-btn:hover{background:var(--s50)}.page-btn.active{background:var(--g500);color:#fff;border-color:var(--g500)}.tabs{border-bottom:1px solid var(--s100);gap:0;margin-bottom:20px;display:flex}.tab-btn{font-family:var(--font);cursor:pointer;color:var(--s500);transition:var(--t);background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-1px;padding:10px 16px;font-size:13px;font-weight:500}.tab-btn.active{color:var(--g700);border-bottom-color:var(--g500);font-weight:600}.tab-btn:hover{color:var(--s800)}.role-chip{border-radius:var(--r-full);align-items:center;gap:5px;padding:3px 9px;font-size:11px;font-weight:600;display:inline-flex}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--s200);border-radius:3px}.main-content{background:var(--s50);flex:1;overflow-y:auto}.text-muted{color:var(--s400);font-size:12px}.roles-bar{flex-direction:column;gap:10px;margin-top:4px;display:flex}.roles-item-label{justify-content:space-between;margin-bottom:5px;font-size:12px;display:flex}.roles-item-label span:first-child{color:var(--s600);font-weight:500}.roles-item-label span:last-child{color:var(--s800);font-weight:700}.roles-progress{background:var(--s100);border-radius:3px;height:6px;overflow:hidden}.roles-fill{border-radius:3px;height:100%}.w74{background:linear-gradient(90deg, var(--g400), var(--g600));width:74%}.w55{width:55%}.w14{width:14%}.w3{width:3%}.amber-bg{background:linear-gradient(90deg, #fbbf24, var(--amber))}.blue-bg{background:linear-gradient(90deg, #818cf8, var(--blue))}.red-bg{background:linear-gradient(90deg, #f472b6, var(--red))}.chart-labels{justify-content:space-around;gap:6px;padding:6px 8px 0;display:flex}.logout-btn{border:1px solid var(--s200);border-radius:var(--r-md);width:100%;font-family:var(--font);color:var(--s600);cursor:pointer;transition:var(--t);background:0 0;align-items:center;gap:8px;margin-top:10px;padding:8px 10px;font-size:13px;font-weight:500;display:flex}.logout-btn:hover{background:var(--s50);color:var(--red);border-color:#dc26264d}.burger-btn{z-index:1100;border:1px solid var(--s200);border-radius:var(--r-md);cursor:pointer;box-shadow:var(--sh-sm);background:#fff;padding:6px 8px;display:none;position:fixed;top:14px;left:14px}@media (width<=768px){.app-layout{flex-direction:column}.burger-btn{display:block}.sidebar-container{z-index:1000;background:#fff;height:100%;transition:transform .3s;position:fixed;top:0;left:0;transform:translate(-100%);box-shadow:2px 0 20px #0000001a}.sidebar-container.open{transform:translate(0)}.sidebar{border-right:none;width:260px;height:100%;position:static}.main{padding-top:60px;margin-left:0!important}.top-bar{padding:10px 14px}.top-bar h1{font-size:16px}.stats-row{grid-template-columns:1fr 1fr}.dash-grid,.class-grid{grid-template-columns:1fr}.filter-bar{flex-direction:column;align-items:stretch}.search-wrap{max-width:none}}.overlay{z-index:500;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0f172a80;justify-content:center;align-items:center;padding:20px;display:none;position:fixed;inset:0}.overlay.open{display:flex}.modal{border-radius:var(--r-xl);background:#fff;flex-direction:column;width:100%;max-width:760px;max-height:90vh;animation:.22s slideUp;display:flex;overflow:hidden;box-shadow:0 24px 64px #0000002e}.modal-head{flex-shrink:0;padding:24px 28px 0}.modal-title-row{align-items:center;gap:12px;margin-bottom:4px;display:flex}.modal-ico{border-radius:11px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;display:flex;box-shadow:0 3px 10px #22c55e47}.modal-ico svg{width:18px;height:18px}.modal-title{color:var(--s900);font-size:17px;font-weight:700}.modal-sub{color:var(--s500);margin-left:50px;font-size:13px}.mode-toggle{background:var(--s100);border-radius:var(--r-md);gap:0;margin:18px 0 0;padding:3px;display:flex}.mode-btn{font-family:var(--font);border-radius:var(--r-sm);cursor:pointer;color:var(--s500);background:0 0;border:none;flex:1;justify-content:center;align-items:center;gap:6px;padding:7px 12px;font-size:12px;font-weight:600;transition:all .18s;display:flex}.mode-btn.on{color:var(--s900);background:#fff;box-shadow:0 1px 4px #0000001a}.mode-btn svg{width:14px;height:14px}.modal-divider{background:var(--s100);height:1px;margin:18px 0 0}.modal-body{flex:1;padding:0;overflow-y:auto}.single-form{padding:20px 28px}.f-section{background:var(--s50);border:1px solid var(--s100);border-radius:var(--r-md);margin-bottom:14px;padding:16px}.f-section-title{text-transform:uppercase;letter-spacing:.08em;color:var(--s500);align-items:center;gap:6px;margin-bottom:12px;font-size:11px;font-weight:700;display:flex}.f-section-title svg{width:13px;height:13px}.f-row{grid-template-columns:1fr 1fr;gap:12px;display:grid}.fg{margin-bottom:0}.flabel{text-transform:uppercase;letter-spacing:.06em;color:var(--s600);margin-bottom:5px;font-size:11px;font-weight:700;display:block}.flabel span{color:var(--red);margin-left:2px}.finput,.fselect{width:100%;font-family:var(--font);border:1.5px solid var(--s200);border-radius:var(--r-md);color:var(--s800);background:#fff;outline:none;padding:9px 12px;font-size:13px;transition:all .18s}.finput:focus,.fselect:focus{border-color:var(--g400);box-shadow:0 0 0 3px #22c55e1a}.finput::placeholder{color:var(--s400)}.f-hint{color:var(--s400);margin-top:4px;font-size:11px}.bulk-toolbar{border-bottom:1px solid var(--s100);justify-content:space-between;align-items:center;padding:16px 28px;display:flex}.bulk-info{color:var(--s600);font-size:13px}.bulk-info strong{color:var(--s900)}.bulk-table-wrap{overflow-x:auto}.bulk-table{border-collapse:collapse;width:100%;min-width:900px}.bulk-table thead th{text-align:left;text-transform:uppercase;letter-spacing:.06em;color:var(--s400);background:var(--s50);border-bottom:1px solid var(--s100);white-space:nowrap;padding:10px;font-size:10px;font-weight:700}.bulk-table tbody tr{border-bottom:1px solid var(--s100);transition:all .15s}.bulk-table tbody tr:hover{background:#f8fafccc}.bulk-table td{vertical-align:middle;padding:7px 8px}.row-num{background:var(--s100);width:24px;height:24px;color:var(--s500);border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;font-size:11px;font-weight:700;display:flex}.b-input{width:100%;font-family:var(--font);border:1.5px solid var(--s200);border-radius:var(--r-sm);color:var(--s800);background:#fff;outline:none;padding:7px 9px;font-size:12px;transition:all .15s}.b-input:focus{border-color:var(--g400);box-shadow:0 0 0 2px #22c55e1a}.b-input::placeholder{color:var(--s300)}.b-select{width:100%;font-family:var(--font);border:1.5px solid var(--s200);border-radius:var(--r-sm);color:var(--s800);background:#fff;outline:none;padding:7px 9px;font-size:12px}.row-del{cursor:pointer;width:28px;height:28px;color:var(--s400);background:0 0;border:none;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;transition:all .15s;display:flex}.row-del:hover{background:var(--red-l);color:var(--red)}.row-del svg{width:14px;height:14px}.add-row-btn{background:var(--s50);border:2px dashed var(--s200);border-radius:0 0 var(--r-md) var(--r-md);width:100%;font-family:var(--font);color:var(--s500);cursor:pointer;border-top:none;justify-content:center;align-items:center;gap:7px;padding:11px;font-size:12px;font-weight:600;transition:all .18s;display:flex}.add-row-btn:hover{color:var(--g700);background:#22c55e0f;border-color:#22c55e4d}.add-row-btn svg{width:14px;height:14px}.class-tag{color:var(--g700);border-radius:var(--r-full);background:#22c55e1a;border:1px solid #22c55e33;align-items:center;gap:5px;padding:4px 10px;font-size:12px;font-weight:600;display:inline-flex}.class-tag-dot{background:var(--g500);border-radius:50%;flex-shrink:0;width:6px;height:6px}.success-state{text-align:center;padding:40px 28px;display:none}.success-state.show{display:block}.success-icon{background:linear-gradient(135deg, var(--g400), var(--g600));border-radius:50%;justify-content:center;align-items:center;width:64px;height:64px;margin:0 auto 16px;display:flex;box-shadow:0 8px 24px #22c55e59}.success-icon svg{width:28px;height:28px}.modal-search-wrap{flex:1;max-width:260px;position:relative}.modal-search-wrap svg{color:var(--s400);pointer-events:none;width:13px;height:13px;position:absolute;top:50%;left:9px;transform:translateY(-50%)}.modal-search{width:100%;font-family:var(--font);background:var(--s50);border:1.5px solid var(--s200);border-radius:var(--r-md);color:var(--s800);outline:none;padding:7px 10px 7px 28px;font-size:12px;transition:all .18s}.modal-search:focus{border-color:var(--g400)}.modal-search::placeholder{color:var(--s400)}.modal-footer{border-top:1px solid var(--s100);background:#fff;flex-shrink:0;justify-content:space-between;align-items:center;padding:16px 28px;display:flex}.footer-left{color:var(--s500);font-size:12px}.footer-left strong{color:var(--g700)}.footer-right{gap:8px;display:flex}@media (width<=468px){.modal{border-radius:0;max-width:100%;height:100vh;max-height:100vh;margin:0}.modal-head{padding:16px 16px 0}.modal-body{padding:0}.f-row,.f-row-3{grid-template-columns:1fr}.single-form{padding:12px 14px}.bulk-toolbar{flex-wrap:wrap;padding:10px 14px}.bulk-table-wrap{overflow-x:auto}.bulk-table{min-width:600px}.top-bar{padding:10px 12px}.top-acts{flex-wrap:wrap;gap:5px}.class-grid{grid-template-columns:1fr}}.student-card-rating{border:1.5px solid var(--s100);border-radius:var(--r-lg);cursor:pointer;text-align:center;box-shadow:var(--sh-sm);background:#fff;padding:20px;transition:all .25s;position:relative;overflow:hidden}.student-card-rating:hover{border-color:#22c55e40;transform:translateY(-3px);box-shadow:0 8px 24px #22c55e1f,0 2px 8px #0000000f}.student-card-rating:before{content:"";background:linear-gradient(90deg, var(--g400), var(--g600));opacity:0;height:3px;transition:opacity .2s;position:absolute;top:0;left:0;right:0}.student-card-rating:hover:before{opacity:1}.sidebar-panel{background:var(--white);border-right:1px solid var(--gray-200);z-index:90;flex-shrink:0;width:260px;height:100vh;transition:transform .3s;position:sticky;top:0}.sidebar{flex-direction:column;width:100%;height:100%;padding:24px;display:flex}.user-av{background:linear-gradient(135deg, var(--green-400), var(--green-600));justifyContent:center;color:#fff;border-radius:10px;flex-shrink:0;align-items:center;width:36px;height:36px;font-size:13px;font-weight:700;display:flex}.burger-btn{z-index:99;background:var(--white);cursor:pointer;border:none;border-radius:12px;padding:10px;display:none;position:fixed;top:16px;left:16px;box-shadow:0 4px 6px -1px #0000001a}.sl-icon svg{width:18px;height:18px}@media (width<=768px){.burger-btn{display:block}.sidebar-panel{z-index:100;width:280px;height:100vh;position:fixed;top:0;left:0;transform:translate(-100%)}.sidebar-panel.open{transform:translate(0);box-shadow:4px 0 20px #0000001a}.sidebar-overlay{display:block}.main-content{margin-left:0;padding:80px 16px 16px}}@media (width<=480px){.sidebar-panel{width:100%}}.modal-backdrop{z-index:200;opacity:0;pointer-events:none;background:#0006;justify-content:center;align-items:center;transition:opacity .2s;display:flex;position:fixed;inset:0}.modal-backdrop.open{opacity:1;pointer-events:auto}.modal{background:#fff;border-radius:20px;width:100%;max-width:520px;max-height:90vh;padding:24px;position:relative;overflow-y:auto;box-shadow:0 20px 50px #0003}@media (width<=640px){.modal{margin:12px;border-radius:16px!important;max-width:95vw!important;padding:16px!important}.modal-footer{flex-direction:column;gap:8px}.modal-footer button{justify-content:center;width:100%;min-width:auto!important}}.card table{min-width:500px}@media (width<=640px){.card{overflow-x:auto}}.app-layout{min-height:100vh;display:flex}.sidebar-container{z-index:100;flex-shrink:0;width:260px;transition:transform .3s;position:relative}.sidebar{background:var(--white);border-right:1px solid var(--gray-200);flex-direction:column;width:100%;height:100vh;padding:24px;display:flex;position:sticky;top:0}.sl-logo{border-bottom:1px solid var(--gray-100);align-items:center;gap:10px;margin-bottom:24px;padding-bottom:24px;display:flex}.sl-icon{background:linear-gradient(135deg, var(--green-400,#22c55e), var(--green-600,#16a34a));border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;display:flex;box-shadow:0 3px 10px #22c55e4d}.sl-name{background:linear-gradient(135deg, var(--green-600,#16a34a), var(--green-800,#14532d));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:16px;font-weight:700}.sl-section{text-transform:uppercase;letter-spacing:.08em;color:var(--gray-400);margin:8px 0;padding:0 8px;font-size:10px;font-weight:700}.nav-i{border-radius:var(--radius,12px);cursor:pointer;color:var(--gray-600);align-items:center;gap:10px;margin-bottom:2px;padding:10px 12px;font-size:14px;font-weight:500;text-decoration:none;transition:all .2s;display:flex}.nav-i:hover{background:var(--gray-50);color:var(--gray-800)}.nav-i.active{color:var(--green-700,#15803d);background:linear-gradient(135deg,#22c55e1f,#22c55e0f);border:1px solid #22c55e26}.nav-i svg{flex-shrink:0;width:18px;height:18px}.sl-bottom{border-top:1px solid var(--gray-100);margin-top:auto;padding-top:16px}.user-row{border-radius:var(--radius,12px);cursor:pointer;align-items:center;gap:10px;padding:10px 12px;transition:background .2s;display:flex}.user-row:hover{background:var(--gray-50)}.user-av{background:linear-gradient(135deg, var(--green-400,#22c55e), var(--green-600,#16a34a));color:#fff;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:13px;font-weight:700;display:flex}.user-nm{color:var(--gray-800);font-size:13px;font-weight:600}.user-rl{color:var(--gray-400);font-size:11px}.logout-btn{color:#ef4444;border-radius:var(--radius,12px);cursor:pointer;background:0 0;border:none;align-items:center;gap:10px;width:100%;margin-top:8px;padding:10px 12px;font-size:14px;font-weight:500;transition:background .2s;display:flex}.logout-btn:hover{background:#fee2e2}.main-content{background:var(--gray-50);flex:1;min-height:100vh;padding:32px}.mobile-menu-btn{z-index:99;background:var(--white);cursor:pointer;border:none;border-radius:12px;padding:10px;display:none;position:fixed;top:16px;left:16px;box-shadow:0 4px 6px -1px #0000001a}.sidebar-overlay{z-index:98;background:#00000080;display:none;position:fixed;inset:0}@media (width<=768px){.mobile-menu-btn{display:block}.sidebar-container{width:280px;height:100vh;position:fixed;top:0;left:0;transform:translate(-100%)}.sidebar-container.open{transform:translate(0);box-shadow:4px 0 20px #0000001a}.sidebar-overlay{display:block}.main-content{margin-left:0;padding:80px 16px 16px}}@media (width<=480px){.sidebar-container{width:100%}}:root{--green-50:#f0fdf4;--green-100:#dcfce7;--green-200:#bbf7d0;--green-300:#86efac;--green-400:#4ade80;--green-500:#22c55e;--green-600:#16a34a;--green-700:#15803d;--green-800:#166534;--green-900:#14532d;--white:#fff;--gray-50:#f8fafc;--gray-100:#f1f5f9;--gray-200:#e2e8f0;--gray-300:#cbd5e1;--gray-400:#94a3b8;--gray-500:#64748b;--gray-600:#475569;--gray-700:#334155;--gray-800:#1e293b;--gray-900:#0f172a;--red-50:#fef2f2;--red-500:#ef4444;--red-600:#dc2626;--amber-50:#fffbeb;--amber-500:#f59e0b;--amber-600:#d97706;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--shadow-sm:0 1px 3px #0000000f,0 1px 2px #0000000a;--shadow-md:0 4px 16px #00000014,0 2px 6px #0000000a;--shadow-lg:0 8px 32px #0000001a,0 4px 12px #0000000f;--glass-bg:#ffffffb8;--glass-border:#ffffffe6;--glass-shadow:0 8px 32px #22c55e1a,0 2px 8px #0000000f;--font:"Onest",sans-serif;--mono:"JetBrains Mono",monospace;--transition:.2s cubic-bezier(.4,0,.2,1);--sidebar-w:264px}.student-page{padding:28px 36px 80px}.page-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:24px;display:flex}.page-title{letter-spacing:-.02em;color:var(--gray-900);margin:0;font-size:30px;font-weight:800}.page-sub{color:var(--gray-500);margin:6px 0 0;font-size:15px}.page-aside{align-items:center;gap:10px;display:flex}.stats{grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px;display:grid}.stat{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:var(--transition);align-items:center;gap:14px;padding:16px 18px;display:flex}.stat:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.stat-icon{background:var(--green-50);width:42px;height:42px;color:var(--green-700);border-radius:12px;flex:0 0 42px;place-items:center;display:grid}.stat-icon.amber{background:var(--amber-50);color:var(--amber-600)}.stat-icon.gray{background:var(--gray-100);color:var(--gray-700)}.stat-icon.dark{background:var(--gray-900);color:#fff}.stat-value{color:var(--gray-900);font-size:22px;font-weight:800;line-height:1}.stat-label{color:var(--gray-500);margin-top:4px;font-size:12.5px}.section{margin-bottom:32px}.section-head{align-items:center;gap:10px;margin:6px 0 14px;display:flex}.section-title{color:var(--gray-900);align-items:center;gap:10px;font-size:18px;font-weight:700;display:flex}.section-title .pill{color:var(--green-700);background:var(--green-50);border:1px solid var(--green-100);border-radius:var(--radius-full);padding:2px 9px;font-size:12px;font-weight:700}.section-title .pill.gray{color:var(--gray-600);background:var(--gray-100);border-color:var(--gray-200)}.section-link{color:var(--green-700);margin-left:auto;font-size:14px;font-weight:600;text-decoration:none}.section-link:hover{text-decoration:underline}.grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;display:grid}.card{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:var(--transition);cursor:pointer;min-height:148px;color:inherit;flex-direction:column;gap:10px;padding:18px 18px 16px;text-decoration:none;display:flex;position:relative;overflow:hidden}.card:hover{box-shadow:var(--shadow-md);border-color:var(--green-200);transform:translateY(-2px)}.card-top{align-items:center;gap:8px;display:flex}.tag{letter-spacing:.05em;color:var(--green-700);background:var(--green-50);border-radius:var(--radius-full);border:1px solid var(--green-100);text-transform:uppercase;padding:5px 10px;font-size:11px;font-weight:700}.tag.test{color:var(--gray-700);background:var(--gray-100);border-color:var(--gray-200)}.tag.new{color:#fff;background:var(--green-500);border-color:#0000;box-shadow:0 4px 10px #22c55e59}.card-icon{width:28px;height:28px;color:var(--gray-500);background:var(--gray-100);border-radius:8px;place-items:center;margin-left:auto;display:grid}.card-title{color:var(--gray-900);word-break:break-word;margin:2px 0 0;font-size:17px;font-weight:700;line-height:1.25}.card-desc{color:var(--gray-500);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:14px;line-height:1.45;display:-webkit-box;overflow:hidden}.card-foot{border-top:1px dashed var(--gray-200);color:var(--gray-500);align-items:center;gap:10px;margin-top:auto;padding-top:10px;font-size:12.5px;display:flex}.card-foot .meta{align-items:center;gap:6px;display:inline-flex}.card-cta{color:var(--green-700);align-items:center;gap:6px;margin-left:auto;font-size:13px;font-weight:600;display:inline-flex}.card-cta .arr{transition:var(--transition)}.card:hover .card-cta .arr{transform:translate(3px)}.new-corner{background:var(--green-500);border-radius:50%;width:8px;height:8px;animation:1.6s ease-in-out infinite pulse;position:absolute;top:10px;right:10px;box-shadow:0 0 0 4px #22c55e2e}@keyframes pulse{0%,to{box-shadow:0 0 #22c55e73}50%{box-shadow:0 0 0 6px #22c55e00}}.test-card{position:relative;overflow:hidden}.test-card .progress-rail{background:var(--gray-100);border-radius:99px;height:6px;overflow:hidden}.test-card .progress-fill{background:linear-gradient(90deg, var(--green-400), var(--green-600));border-radius:99px;width:0%;height:100%}.test-card .qcount{font-family:var(--mono);color:var(--gray-500);font-size:12px}.test-card .status{color:var(--gray-500);align-items:center;gap:6px;font-size:12px;font-weight:500;display:inline-flex}.status.notdone .icn{color:var(--gray-400)}.status.viewed{color:var(--amber-600)}.status.passed{color:var(--green-700)}.test-card.passed:after{content:"";pointer-events:none;border-radius:0 0 var(--radius-lg) var(--radius-lg);z-index:0;height:64px;position:absolute;bottom:0;left:0;right:0}.test-card.g5:after{background:linear-gradient(#0000,#22c55e2e)}.test-card.g4:after{background:linear-gradient(#0000,#84cc162e)}.test-card.g3:after{background:linear-gradient(#0000,#f59e0b2e)}.test-card.g2:after{background:linear-gradient(#0000,#ef44442e)}.test-card>*{z-index:1;position:relative}.grade-badge{color:#fff;width:56px;height:56px;font-size:22px;font-weight:800;font-family:var(--mono);z-index:2;border-radius:16px;place-items:center;display:grid;position:absolute;top:14px;right:14px;box-shadow:0 10px 24px #0000001a}.grade-badge .pct{font-family:var(--mono);opacity:.9;margin-top:-2px;font-size:11px;font-weight:600}.grade-badge.g5{background:linear-gradient(135deg,#34d399,#16a34a)}.grade-badge.g4{background:linear-gradient(135deg,#a3e635,#65a30d)}.grade-badge.g3{background:linear-gradient(135deg,#fbbf24,#d97706)}.grade-badge.g2{background:linear-gradient(135deg,#f87171,#dc2626)}.test-card.locked{cursor:default}.test-card.locked:hover{transform:none}.grades-wrap{grid-template-columns:1.4fr .8fr;gap:16px;display:grid}.gr-table{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden}.gr-table h3{border-bottom:1px solid var(--gray-100);margin:0;padding:18px 20px;font-size:16px}.gr-row{border-bottom:1px solid var(--gray-100);transition:var(--transition);grid-template-columns:1.6fr 1fr 90px 110px;align-items:center;gap:10px;padding:14px 20px;display:grid}.gr-row:last-child{border-bottom:0}.gr-row:hover{background:var(--gray-50)}.gr-name{color:var(--gray-900);font-weight:600}.gr-sub{color:var(--gray-500);margin-top:2px;font-size:12.5px}.gr-date{font-family:var(--mono);color:var(--gray-500);font-size:12.5px}.gr-pct{font-family:var(--mono);color:var(--gray-700);font-weight:600}.gr-grade{color:#fff;width:42px;height:42px;font-weight:800;font-family:var(--mono);border-radius:12px;justify-self:end;place-items:center;display:grid}.gr-grade.g5{background:linear-gradient(135deg,#34d399,#16a34a)}.gr-grade.g4{background:linear-gradient(135deg,#a3e635,#65a30d)}.gr-grade.g3{background:linear-gradient(135deg,#fbbf24,#d97706)}.gr-grade.g2{background:linear-gradient(135deg,#f87171,#dc2626)}.gr-side{flex-direction:column;gap:14px;display:flex}.gr-card{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:20px}.avg-ring{align-items:center;gap:18px;display:flex}.ring{--val:84;background:conic-gradient(var(--green-500) calc(var(--val)*1%), var(--gray-100) 0);border-radius:50%;flex:0 0 96px;place-items:center;width:96px;height:96px;display:grid;position:relative}.ring:after{content:"";background:#fff;border-radius:50%;position:absolute;inset:8px}.ring span{font-size:22px;font-weight:800;font-family:var(--mono);color:var(--gray-900);position:relative}.avg-meta .lbl{color:var(--gray-500);font-size:13px}.avg-meta .val{color:var(--gray-900);margin-top:2px;font-size:18px;font-weight:700}.distrib{grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px;display:grid}.distrib .d{border:1px solid var(--gray-200);text-align:center;border-radius:12px;padding:10px}.distrib .d .num{font-size:20px;font-weight:800;font-family:var(--mono)}.distrib .d .lbl{color:var(--gray-500);text-transform:uppercase;letter-spacing:.08em;font-size:11px}.d.g5{color:var(--green-700);background:#22c55e0f;border-color:#22c55e4d}.d.g4{color:#4d7c0f;background:#84cc160f;border-color:#84cc164d}.d.g3{color:var(--amber-600);background:#f59e0b0f;border-color:#f59e0b4d}.d.g2{color:var(--red-600);background:#ef44440f;border-color:#ef44444d}@media (width<=1024px){.grades-wrap{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}}@media (width<=760px){.student-page{padding:18px 16px 60px}.page-title{font-size:24px}.gr-row{grid-template-columns:1.4fr 70px 56px;font-size:14px}.gr-row .gr-date{display:none}}@media (width<=420px){.stats{grid-template-columns:repeat(2,1fr)}.stat{padding:12px}.stat-value{font-size:18px}}@media (width<=768px){.student-page{padding:16px!important}.page-head{flex-direction:column;align-items:flex-start;gap:12px}.page-title{font-size:22px!important}.stat-grid{gap:10px!important}.grid{grid-template-columns:1fr!important}}@media (width<=480px){.stat-grid{gap:10px;grid-template-columns:1fr!important}.stat{padding:12px!important}.stat-value{font-size:20px!important}.section-head{flex-direction:column;align-items:flex-start;gap:8px}.section-title{font-size:16px!important}.pill{font-size:10px}.section-link{font-size:12px}.empty{padding:32px 16px!important;font-size:13px!important}.schedule-table td,.schedule-table th{padding:4px!important;font-size:10px!important}}@media (width<=360px){.schedule-table td,.schedule-table th{padding:2px!important;font-size:9px!important}.schedule-table{min-width:500px}.stat-icon{width:32px!important;height:32px!important}}:root{--green-50:#f0fdf4;--green-100:#dcfce7;--green-200:#bbf7d0;--green-300:#86efac;--green-400:#4ade80;--green-500:#22c55e;--green-600:#16a34a;--green-700:#15803d;--green-800:#166534;--green-900:#14532d;--white:#fff;--gray-50:#f8fafc;--gray-100:#f1f5f9;--gray-200:#e2e8f0;--gray-300:#cbd5e1;--gray-400:#94a3b8;--gray-500:#64748b;--gray-600:#475569;--gray-700:#334155;--gray-800:#1e293b;--gray-900:#0f172a;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--shadow-sm:0 1px 3px #0000000f, 0 1px 2px #0000000a;--shadow-md:0 4px 16px #00000014, 0 2px 6px #0000000a;--shadow-lg:0 8px 32px #0000001a, 0 4px 12px #0000000f;--glass-bg:#ffffffb8;--glass-border:#ffffffe6;--glass-shadow:0 8px 32px #22c55e1a, 0 2px 8px #0000000f;--font:"Onest", sans-serif;--mono:"JetBrains Mono", monospace;--transition:.2s cubic-bezier(.4, 0, .2, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font);background:var(--gray-50);color:var(--gray-800);min-height:100vh;overflow-x:hidden}