@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600&display=swap";:root{--bg-base:#f8fafc;--bg-surface:#fff;--bg-elevated:#f1f5f9;--bg-card:#fff;--bg-card-hover:#f5f3ff;--bg-input:#f1f5f9;--bg-highlight:#ede9fe;--border-subtle:#3b82f614;--border-default:#3b82f61f;--border-medium:#3b82f62e;--border-strong:#3b82f640;--brand:#3b82f6;--brand-light:#3b82f6;--brand-lighter:#60a5fa;--brand-glow:#3b82f633;--green:#10b981;--green-dim:#10b9811f;--red:#ef4444;--red-dim:#ef44441f;--amber:#f59e0b;--amber-dim:#f59e0b1f;--purple:#8b5cf6;--purple-dim:#8b5cf61f;--cyan:#06b6d4;--cyan-dim:#06b6d41f;--text-primary:#1e293b;--text-secondary:#64748b;--text-muted:#94a3b8;--text-faint:#cbd5e1;--sidebar-w:248px;--header-h:60px;--radius-xs:4px;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-full:9999px;--shadow-sm:0 1px 3px #3b82f61a;--shadow-md:0 4px 16px #3b82f61f;--shadow-lg:0 8px 40px #3b82f626;--shadow-brand:0 0 30px #3b82f633;--ease:cubic-bezier(.4,0,.2,1);--t:.16s}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{background:var(--bg-base);color:var(--text-primary);-webkit-font-smoothing:antialiased;min-height:100vh;font-family:Inter,system-ui,sans-serif;line-height:1.5;overflow-x:hidden}a{color:inherit;text-decoration:none}button{cursor:pointer;background:0 0;border:none;font-family:inherit}img{max-width:100%;display:block}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#3b82f633;border-radius:99px}::-webkit-scrollbar-thumb:hover{background:#3b82f64d}.layout{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-w);z-index:100;height:100vh;transition:transform var(--t) var(--ease);background:linear-gradient(#fff 0%,#f5f3ff 100%);border-right:1px solid #3b82f61a;flex-direction:column;display:flex;position:fixed;top:0;left:0;overflow:hidden auto}.main-content{margin-left:var(--sidebar-w);background:linear-gradient(135deg,#f8fafc 0%,#f5f3ff 50%,#fff 100%);flex-direction:column;flex:1;min-height:100vh;display:flex}.topbar{height:var(--header-h);z-index:50;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fffc;border-bottom:1px solid #3b82f61a;justify-content:space-between;align-items:center;padding:0 28px;display:flex;position:sticky;top:0}.page-content{flex:1;padding:28px}.sidebar-brand{border-bottom:1px solid var(--border-subtle);align-items:center;gap:10px;padding:20px 20px 16px;display:flex}.sidebar-logo-mark{background:var(--brand);border-radius:var(--radius-sm);flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.sidebar-nav{flex:1;padding:12px}.nav-section-label{color:var(--text-muted);letter-spacing:1.2px;text-transform:uppercase;padding:10px 8px 4px;font-size:10px;font-weight:600}.nav-item{border-radius:var(--radius-sm);color:var(--text-secondary);transition:all var(--t) var(--ease);cursor:pointer;align-items:center;gap:10px;width:100%;margin-bottom:1px;padding:8px 10px;font-size:13.5px;font-weight:500;display:flex;position:relative}.nav-item:hover{background:var(--bg-elevated);color:var(--text-primary)}.nav-item.active{color:#3b82f6;background:#3b82f614;font-weight:600}.nav-item.active:before{content:"";background:#3b82f6;border-radius:0 2px 2px 0;width:3px;height:18px;position:absolute;top:50%;left:0;transform:translateY(-50%)}.nav-icon{opacity:.8;flex-shrink:0;width:18px;height:18px}.nav-item.active .nav-icon,.nav-item:hover .nav-icon{opacity:1}.sidebar-footer{border-top:1px solid var(--border-subtle);padding:14px}.sidebar-user{border-radius:var(--radius-md);cursor:pointer;transition:background var(--t) var(--ease);align-items:center;gap:10px;padding:8px;display:flex}.sidebar-user:hover{background:var(--bg-elevated)}.field{flex-direction:column;gap:5px;display:flex}.field-label{color:var(--text-secondary);letter-spacing:.3px;font-size:12px;font-weight:500}input,textarea,select{background:var(--bg-input);border:1px solid var(--border-default);color:var(--text-primary);border-radius:var(--radius-sm);transition:border-color var(--t) var(--ease), box-shadow var(--t) var(--ease);outline:none;width:100%;padding:10px 14px;font-family:inherit;font-size:14px}input::placeholder,textarea::placeholder{color:var(--text-muted)}input:focus,textarea:focus,select:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}select option{background:var(--bg-elevated)}.input-wrap{position:relative}.input-wrap input{padding-left:40px}.input-icon{color:var(--text-muted);pointer-events:none;width:16px;height:16px;position:absolute;top:50%;left:13px;transform:translateY(-50%)}.btn{border-radius:var(--radius-sm);letter-spacing:.1px;transition:all var(--t) var(--ease);white-space:nowrap;cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;gap:7px;padding:9px 18px;font-family:inherit;font-size:13.5px;font-weight:600;display:inline-flex}.btn-primary{color:#fff;background:linear-gradient(90deg,#3b82f6 0%,#8b5cf6 100%);border-color:#0000}.btn-primary:hover{background:linear-gradient(90deg,#1d4ed8 0%,#6d28d9 100%);border-color:#0000;box-shadow:0 4px 14px #3b82f64d}.btn-primary:active{background:linear-gradient(90deg,#1e40af 0%,#581c87 100%)}.btn-ghost{color:var(--text-secondary);border-color:var(--border-default);background:0 0}.btn-ghost:hover{background:var(--bg-elevated);color:var(--text-primary);border-color:var(--border-medium)}.btn-danger{background:var(--red-dim);color:var(--red);border-color:#ef444433}.btn-danger:hover{background:#ef444433}.btn-success{background:var(--green-dim);color:var(--green);border-color:#10b98133}.btn-success:hover{background:#10b98133}.btn-sm{padding:6px 13px;font-size:12.5px}.btn-lg{padding:12px 24px;font-size:15px}.btn:disabled{opacity:.5;cursor:not-allowed}.card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:22px}.card-hover{transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease),transform var(--t) var(--ease)}.card-hover:hover{border-color:var(--border-medium);box-shadow:var(--shadow-md);transform:translateY(-1px)}.stat-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;display:grid}.stat-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);transition:border-color var(--t);padding:20px;position:relative;overflow:hidden}.stat-card:before{content:"";filter:blur(40px);pointer-events:none;background:linear-gradient(135deg,#3b82f61a,#8b5cf614);border-radius:50%;width:80px;height:80px;position:absolute;top:0;right:0}.stat-card:hover{border-color:var(--border-medium)}.stat-label{color:var(--text-muted);letter-spacing:.5px;text-transform:uppercase;margin-bottom:10px;font-size:12px;font-weight:500}.stat-value{letter-spacing:-.5px;font-size:28px;font-weight:800;line-height:1}.stat-sub{color:var(--text-muted);margin-top:6px;font-size:12px}.stat-icon-wrap{border-radius:var(--radius-md);justify-content:center;align-items:center;width:40px;height:40px;margin-bottom:14px;display:flex}.badge{border-radius:var(--radius-full);letter-spacing:.2px;align-items:center;gap:4px;padding:3px 9px;font-size:11.5px;font-weight:600;display:inline-flex}.badge-blue{color:#3b82f6;background:#3b82f61a;border:1px solid #3b82f633}.badge-green{background:var(--green-dim);color:var(--green);border:1px solid #10b98133}.badge-red{background:var(--red-dim);color:var(--red);border:1px solid #ef444433}.badge-amber{background:var(--amber-dim);color:var(--amber);border:1px solid #f59e0b33}.badge-purple{background:var(--purple-dim);color:var(--purple);border:1px solid #8b5cf633}.badge-gray{color:var(--text-secondary);border:1px solid var(--border-default);background:#ffffff0a}.table-wrap{border-radius:var(--radius-lg);border:1px solid var(--border-subtle);overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:13.5px}thead th{color:var(--text-muted);letter-spacing:.8px;text-transform:uppercase;border-bottom:1px solid var(--border-subtle);text-align:left;background:var(--bg-elevated);white-space:nowrap;padding:11px 16px;font-size:11px;font-weight:600}tbody td{border-bottom:1px solid var(--border-subtle);color:var(--text-secondary);padding:13px 16px}tbody tr:last-child td{border-bottom:none}tbody tr{transition:background var(--t)}tbody tr:hover td{background:var(--bg-elevated);color:var(--text-primary)}.overlay{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:1000;background:#000000b3;justify-content:center;align-items:center;padding:20px;animation:.15s fadeIn;display:flex;position:fixed;inset:0}.modal{background:var(--bg-card);border:1px solid var(--border-medium);border-radius:var(--radius-xl);width:100%;max-width:520px;max-height:90vh;box-shadow:var(--shadow-lg);padding:28px;animation:.2s slideUp;overflow-y:auto}.modal-lg{max-width:700px}.modal-header{justify-content:space-between;align-items:center;margin-bottom:22px;display:flex}.modal-title{font-size:17px;font-weight:700}.modal-close{color:var(--text-muted);border-radius:var(--radius-xs);transition:all var(--t);padding:4px;display:flex}.modal-close:hover{color:var(--text-primary);background:var(--bg-elevated)}.tabs{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);gap:2px;padding:3px;display:flex}.tab-btn{color:var(--text-muted);transition:all var(--t);cursor:pointer;background:0 0;border:none;border-radius:5px;flex:1;padding:7px 14px;font-size:13px;font-weight:500}.tab-btn.active{background:var(--bg-card);color:var(--text-primary);box-shadow:var(--shadow-sm);font-weight:600}.tab-btn:hover:not(.active){color:var(--text-secondary)}.progress{border-radius:var(--radius-full);background:#ede9fe;height:5px;overflow:hidden}.progress-fill{border-radius:var(--radius-full);height:100%;transition:width .6s var(--ease);background:linear-gradient(90deg,#3b82f6 0%,#8b5cf6 100%)}.progress-fill.green{background:var(--green)}.spinner{border:2px solid #3b82f626;border-top-color:#3b82f6;border-radius:50%;flex-shrink:0;width:18px;height:18px;animation:.65s linear infinite spin}.spinner-sm{width:14px;height:14px}.spinner-lg{border-width:2.5px;width:24px;height:24px}.alert{border-radius:var(--radius-md);align-items:flex-start;gap:10px;padding:11px 14px;font-size:13.5px;line-height:1.5;display:flex}.alert-info{color:#3b82f6;background:#3b82f614;border:1px solid #3b82f633}.alert-warn{background:var(--amber-dim);color:var(--amber);border:1px solid #f59e0b33}.alert-success{background:var(--green-dim);color:var(--green);border:1px solid #10b98133}.alert-error{background:var(--red-dim);color:var(--red);border:1px solid #ef444433}.empty{color:var(--text-muted);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:60px 20px;display:flex}.empty-icon{width:44px;height:44px;color:var(--text-faint)}.empty p{color:var(--text-muted);max-width:240px;font-size:14px;line-height:1.6}.auth-page{background:linear-gradient(135deg,#f8fafc 0%,#f5f3ff 100%);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex;position:relative;overflow:hidden}.auth-glow-1{pointer-events:none;background:radial-gradient(circle,#3b82f626 0%,#0000 65%);width:700px;height:700px;position:absolute;top:-20%;right:-10%}.auth-glow-2{pointer-events:none;background:radial-gradient(circle,#8b5cf61f 0%,#0000 65%);width:600px;height:600px;position:absolute;bottom:-20%;left:-10%}.auth-grid{pointer-events:none;background-image:linear-gradient(#ffffff04 1px,#0000 1px),linear-gradient(90deg,#ffffff04 1px,#0000 1px);background-size:60px 60px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(80% 80%,#000 0%,#0000 100%);mask-image:radial-gradient(80% 80%,#000 0%,#0000 100%)}.auth-card{background:var(--bg-card);border:1px solid var(--border-medium);border-radius:var(--radius-xl);z-index:1;width:100%;max-width:440px;box-shadow:var(--shadow-lg);padding:36px;position:relative}.auth-card-wide{max-width:700px}.auth-logo{background:var(--brand);border-radius:var(--radius-md);justify-content:center;align-items:center;width:40px;height:40px;margin:0 auto 20px;display:flex}.otp-group{justify-content:center;gap:10px;display:flex}.otp-box{text-align:center;border:1px solid var(--border-default);border-radius:var(--radius-md);background:var(--bg-input);width:52px;height:58px;color:var(--text-primary);transition:all var(--t);outline:none;font-family:JetBrains Mono,monospace;font-size:22px;font-weight:700}.otp-box:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.course-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);transition:all var(--t) var(--ease);cursor:pointer;overflow:hidden}.course-card:hover{border-color:var(--border-medium);box-shadow:var(--shadow-md);transform:translateY(-2px)}.course-thumb{background:var(--bg-elevated);object-fit:cover;justify-content:center;align-items:center;width:100%;height:150px;display:flex}.course-body{padding:16px}.teacher-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);transition:all var(--t);text-align:center;padding:22px}.teacher-card:hover{border-color:var(--border-medium);box-shadow:var(--shadow-md)}.teacher-avatar{background:var(--bg-highlight);border:2px solid var(--border-default);width:72px;height:72px;color:var(--text-primary);border-radius:50%;justify-content:center;align-items:center;margin:0 auto 12px;font-size:26px;font-weight:800;display:flex;overflow:hidden}.divider{background:var(--border-subtle);height:1px;margin:20px 0}.page-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:24px;display:flex}.page-title{letter-spacing:-.3px;font-size:22px;font-weight:800}.page-subtitle{color:var(--text-muted);margin-top:3px;font-size:13.5px}.avatar{object-fit:cover;background:var(--bg-highlight);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-weight:700;display:flex;overflow:hidden}.g2{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}.g3{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}.g4{grid-template-columns:repeat(4,1fr);gap:14px;display:grid}@media (width<=1100px){.g4,.g3{grid-template-columns:repeat(2,1fr)}}@media (width<=640px){.g4,.g3,.g2{grid-template-columns:1fr}.page-content{padding:16px}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.fade-in{animation:.25s fadeIn}.slide-up{animation:.25s slideUp}@media (width<=900px){:root{--sidebar-w:0px}.sidebar{transform:translate(-248px)}.sidebar.open{width:248px;box-shadow:var(--shadow-lg);transform:translate(0)}.main-content{margin-left:0}}.text-brand{color:var(--brand-light)}.text-muted{color:var(--text-muted)}.text-secondary{color:var(--text-secondary)}.font-mono{font-family:JetBrains Mono,monospace}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.flex{display:flex}.flex-center{justify-content:center;align-items:center;display:flex}.flex-between{justify-content:space-between;align-items:center;display:flex}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.w-full{width:100%}.loading-page{min-height:100vh;color:var(--text-muted);justify-content:center;align-items:center;gap:12px;font-size:14px;display:flex}.tag{border-radius:var(--radius-full);background:var(--bg-highlight);color:var(--text-secondary);border:1px solid var(--border-subtle);align-items:center;padding:3px 10px;font-size:11.5px;font-weight:500;display:inline-flex}.icon-row{color:var(--text-muted);align-items:center;gap:6px;font-size:13px;display:flex}.icon-row svg{flex-shrink:0;width:14px;height:14px}