:root{--bg: #f8fafc;--surface: #ffffff;--surface-muted: #eff6ff;--primary: #2563EB;--primary-dark: #1D4ED8;--secondary: #14B8A6;--success: #16a34a;--warning: #d97706;--danger: #dc2626;--info: #2563EB;--ink: #0F172A;--muted: #64748B;--muted-soft: #94A3B8;--line: #E2E8F0;--field-line: #CBD5E1;--shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 8px 24px rgba(15, 23, 42, .04);--radius: 14px;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}button,input,select,textarea{font:inherit}button{cursor:pointer}.login-shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr);background:var(--bg)}.login-visual{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:42px;overflow:hidden;color:#fff;background:#0f172a}.login-visual:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,#0f172adb,#2563eb57 58%,#0f172a33),url(/assets/login-education-dashboard.png) center / cover no-repeat}.login-visual>*{position:relative;z-index:1}.brand-lockup,.user-chip,.logo-mark{display:inline-flex;align-items:center;gap:10px}.logo-mark{justify-content:center;width:38px;height:38px;border-radius:var(--radius);color:#fff;background:var(--primary);box-shadow:none;flex:0 0 auto}.brand-copy strong,.user-chip strong{display:block;line-height:1.15}.brand-copy span,.user-chip span{display:block;color:#ffffffb8;font-size:13px}.login-copy{max-width:610px}.login-copy h1{margin:0 0 14px;font-size:clamp(38px,5vw,64px);line-height:1;letter-spacing:0}.login-copy p{margin:0;max-width:580px;color:#ffffffd1;font-size:18px;line-height:1.7}.login-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:620px}.metric-glass{padding:16px;border:1px solid rgba(255,255,255,.18);border-radius:var(--radius);background:#ffffff21;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.metric-glass strong{display:block;font-size:22px}.metric-glass span{color:#ffffffc2;font-size:13px}.login-panel{display:grid;place-items:center;padding:32px}.login-card{width:min(100%,460px);padding:32px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow)}.login-card .brand-lockup{color:var(--ink);margin-bottom:28px}.login-card .brand-copy span{color:var(--muted)}.login-card h2{margin:0 0 7px;font-size:28px}.login-card>p{margin:0 0 24px;color:var(--muted)}.form-grid{display:grid;gap:16px}.field label,.filter label,.upload-box label{display:block;margin-bottom:7px;color:#334155;font-weight:650;font-size:13px}.field input,.field select,.field textarea,.filter input,.filter select,.search-input{width:100%;min-height:42px;border:1px solid var(--field-line);border-radius:var(--radius);padding:10px 12px;color:var(--ink);background:#fff;outline:none}.field input::placeholder,.field textarea::placeholder,.filter input::placeholder,.search-input::placeholder{color:var(--muted-soft)}.field textarea{min-height:94px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus,.filter input:focus,.filter select:focus,.search-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #dbeafe}.error-text{min-height:18px;margin-top:5px;color:var(--danger);font-size:12px}.error-panel{margin:0 0 16px;border:1px solid #fecaca;border-radius:var(--radius);padding:12px 14px;color:#991b1b;background:#fef2f2;font-size:14px;font-weight:650}.form-row{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--muted);font-size:14px}.checkbox-line{display:inline-flex;align-items:center;gap:8px}.text-link{border:0;padding:0;color:var(--primary);background:transparent;text-decoration:none;font-weight:650}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;border:1px solid var(--field-line);border-radius:var(--radius);padding:9px 14px;color:#334155;background:#fff;font-weight:700;text-decoration:none}.btn svg,.icon svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.btn-primary{border-color:var(--primary);color:#fff;background:var(--primary)}.btn-primary:hover{background:var(--primary-dark)}.btn-secondary{border-color:var(--field-line);color:#334155;background:#fff}.btn-secondary:hover,.btn-outline:hover,.icon-button:hover{color:var(--primary);border-color:#bfdbfe;background:var(--surface-muted)}.btn-outline{border-color:var(--field-line);background:#fff}.btn-danger{border-color:var(--danger);color:#fff;background:var(--danger)}.btn-full{width:100%}.help-line{margin:18px 0 0;text-align:center;color:var(--muted);font-size:14px}.app-shell{min-height:100vh;display:grid;grid-template-columns:276px minmax(0,1fr)}.sidebar{position:sticky;top:0;height:100vh;padding:22px 16px;border-right:1px solid var(--line);background:#fff;overflow-y:auto;z-index:20}.sidebar .brand-lockup{margin:0 8px 26px}.sidebar .brand-copy span,.user-chip span{color:var(--muted)}.nav-list{display:grid;gap:6px}.nav-item{display:flex;align-items:center;gap:10px;min-height:44px;padding:10px 12px;border-radius:var(--radius);border-left:3px solid transparent;color:#334155;text-decoration:none;font-weight:700}.nav-item:hover{color:var(--primary);background:#f1f5f9}.nav-item.active{color:var(--primary);border-left-color:var(--primary);background:var(--surface-muted);box-shadow:none}.nav-item .icon{color:#64748b}.nav-item:hover .icon,.nav-item.active .icon{color:var(--primary)}.sidebar-footer{margin-top:24px;padding:14px;border:1px solid var(--line);border-radius:var(--radius);background:#f8fafc}.layout-main{min-width:0}.topbar{position:sticky;top:0;display:flex;align-items:center;gap:14px;min-height:74px;padding:14px 26px;border-bottom:1px solid var(--line);background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none;z-index:15}.hamburger{display:none;width:42px;height:42px;border:1px solid var(--field-line);border-radius:var(--radius);color:var(--ink);background:#fff}.topbar-search{position:relative;flex:1;max-width:520px}.topbar-search .icon{position:absolute;top:50%;left:12px;transform:translateY(-50%);color:var(--muted)}.topbar-search input{padding-left:40px}.topbar-actions{margin-left:auto;display:flex;align-items:center;gap:10px}.icon-button{position:relative;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid var(--line);border-radius:var(--radius);color:#334155;background:#fff}.notification-dot{position:absolute;top:9px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--danger)}.date-chip{padding:10px 12px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;color:#475569;font-size:14px;font-weight:700}.avatar{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;color:#fff;background:var(--primary);font-weight:800}.content{padding:26px}.page-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px}.page-title h1{margin:0 0 7px;font-size:clamp(28px,4vw,38px);letter-spacing:0}.page-title p{margin:0;color:var(--muted)}.grid{display:grid;gap:16px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-6{grid-template-columns:repeat(6,minmax(0,1fr))}.card{border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow)}.card-pad{padding:18px}.stat-card{display:flex;gap:14px;min-height:120px;padding:18px}.stat-icon{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:var(--radius);color:var(--primary);background:var(--surface-muted);flex:0 0 auto}.stat-icon-primary{color:var(--primary);background:var(--surface-muted)}.stat-icon-success{color:#166534;background:#dcfce7}.stat-icon-warning{color:#92400e;background:#fef3c7}.stat-icon-danger{color:#991b1b;background:#fee2e2}.stat-content{min-width:0}.stat-label{color:var(--muted);font-weight:700;font-size:13px}.stat-value{margin-top:6px;font-size:25px;font-weight:850}.stat-note{margin-top:4px;color:var(--muted);font-size:13px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.section-title h2{margin:0;font-size:18px}.section-title p{margin:4px 0 0;color:var(--muted);font-size:13px}.filter-bar{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:12px;margin-bottom:16px}.table-wrap{overflow-x:auto}.data-table{width:100%;border-collapse:collapse}.data-table th,.data-table td{padding:14px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}.data-table tbody tr:hover{background:#f8fafc}.data-table th{color:#475569;background:#f8fafc;font-size:12px;text-transform:uppercase}.data-table input,.data-table select{width:100%;min-width:82px;min-height:36px;border:1px solid var(--field-line);border-radius:var(--radius);padding:7px 9px;background:#fff}.data-table input[type=radio]{width:18px;min-width:18px;height:18px;min-height:18px;accent-color:var(--primary)}.data-table tr:last-child td{border-bottom:0}.status-badge{display:inline-flex;align-items:center;min-height:25px;border-radius:999px;padding:4px 10px;font-size:12px;font-weight:800}.badge-success{color:#166534;background:#dcfce7}.badge-warning{color:#92400e;background:#fef3c7}.badge-danger{color:#991b1b;background:#fee2e2}.badge-info,.badge-primary{color:#1e40af;background:#dbeafe}.badge-muted{color:#475569;background:#f1f5f9}.progress-row{display:grid;gap:7px}.progress-top{display:flex;justify-content:space-between;gap:10px;color:#334155;font-weight:750;font-size:14px}.progress-track{width:100%;height:9px;overflow:hidden;border-radius:999px;background:#e2e8f0}.progress-fill{height:100%;border-radius:inherit;background:var(--primary)}.circle-progress{--value: 88;width:170px;height:170px;margin:0 auto;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--primary) calc(var(--value) * 1%),#e2e8f0 0)}.circle-progress:before{content:attr(data-value);display:grid;place-items:center;width:128px;height:128px;border-radius:50%;background:#fff;color:var(--ink);font-size:31px;font-weight:850}.announcement-list,.session-list,.file-grid,.assignment-grid{display:grid;gap:12px}.announcement,.mini-card,.file-card,.assignment-card{padding:14px;border:1px solid var(--line);border-radius:var(--radius);background:#fff}.announcement strong,.mini-card strong,.file-card strong,.assignment-card strong{display:block;margin-bottom:4px}.announcement p,.mini-card p,.file-card p,.assignment-card p{margin:0;color:var(--muted);font-size:13px}.quick-actions{display:flex;flex-wrap:wrap;gap:10px}.teacher-class-select{min-width:230px;margin:0}.chart-bars{display:grid;align-items:end;grid-template-columns:repeat(6,minmax(40px,1fr));gap:12px;min-height:230px;padding:14px 0 0}.bar-item{display:grid;align-items:end;gap:8px;height:220px;text-align:center}.bar{min-height:12px;border-radius:var(--radius) var(--radius) 2px 2px;background:var(--primary)}.bar-label{color:var(--muted);font-size:12px;font-weight:700}.line-chart{width:100%;min-height:220px}.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}.tab{border:1px solid var(--field-line);border-radius:var(--radius);padding:9px 14px;color:#475569;background:#fff;font-weight:800}.tab.active{color:var(--primary);border-color:var(--primary);background:var(--surface-muted)}.timetable-grid{display:grid;grid-template-columns:110px repeat(6,minmax(130px,1fr));min-width:920px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.time-cell,.day-cell,.class-cell{min-height:92px;padding:10px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff}.day-cell,.time-cell{display:grid;place-items:center;background:#f8fafc;font-weight:850;color:#334155}.class-block{height:100%;border-left:4px solid var(--primary);border-radius:var(--radius);padding:10px;background:#eff6ff}.class-block.lab{border-color:var(--primary);background:#eff6ff}.class-block.exam{border-color:var(--danger);background:#fee2e2}.class-block.tutorial{border-color:var(--success);background:#dcfce7}.class-block strong{display:block;margin-bottom:5px}.class-block span{display:block;color:#475569;font-size:12px}.invoice-lines{display:grid;gap:10px}.invoice-line{display:flex;justify-content:space-between;gap:16px;padding-bottom:10px;border-bottom:1px dashed var(--line)}.invoice-line:last-child{border-bottom:0;font-weight:850}.upload-box{display:grid;gap:12px}.file-drop{display:grid;place-items:center;min-height:126px;border:1px dashed #94a3b8;border-radius:var(--radius);background:#f8fafc;color:var(--muted);text-align:center;padding:16px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:18px;background:#0f172a80;z-index:60}.modal{width:min(100%,560px);max-height:calc(100vh - 36px);overflow-y:auto;border-radius:var(--radius);background:#fff;box-shadow:0 24px 60px #0f172a3d}.modal-header,.modal-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line)}.modal-footer{border-top:1px solid var(--line);border-bottom:0;justify-content:flex-end}.modal-header h2{margin:0;font-size:20px}.modal-body{padding:18px}.toast-root{position:fixed;top:18px;right:18px;display:grid;gap:10px;z-index:100}.toast{min-width:260px;max-width:360px;border-left:4px solid var(--primary);border-radius:var(--radius);padding:12px 14px;background:#fff;box-shadow:var(--shadow)}.toast strong{display:block;margin-bottom:2px}.toast span{color:var(--muted);font-size:13px}.empty-state{display:grid;place-items:center;min-height:180px;color:var(--muted);text-align:center}.mobile-backdrop{display:none}@media (max-width: 1180px){.grid-4,.grid-6,.filter-bar{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 860px){.login-shell{grid-template-columns:1fr}.login-visual{min-height:44vh;padding:28px}.login-metrics,.app-shell{grid-template-columns:1fr}.sidebar{position:fixed;left:0;transform:translate(-105%);width:286px;transition:transform .2s ease}.sidebar.open{transform:translate(0)}.mobile-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;display:block;background:#0f172a61;z-index:19}.hamburger{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}.topbar{padding:12px 16px}.date-chip,.topbar .btn span,.user-chip{display:none}.content{padding:18px}.page-hero{display:grid}.grid-2,.grid-3,.grid-4,.grid-6,.filter-bar{grid-template-columns:1fr}.data-table,.data-table thead,.data-table tbody,.data-table tr,.data-table th,.data-table td{display:block}.data-table thead{display:none}.data-table tr{border:1px solid var(--line);border-radius:var(--radius);margin-bottom:12px;background:#fff;overflow:hidden}.data-table td{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line)}.data-table td:before{content:attr(data-label);color:var(--muted);font-weight:800}}@media (max-width: 560px){.login-panel{padding:18px}.login-card{padding:22px}.topbar-search{max-width:none}.topbar-actions{gap:6px}.quick-actions .btn,.page-hero .btn{width:100%}}