:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#14213d;background:#f5f7fb;font-synthesis:none;--navy:#173c88;--blue:#2563d8;--line:#e5e9f2;--muted:#718096}
*{box-sizing:border-box}body{margin:0;min-width:320px}button,input{font:inherit}.app-shell{min-height:100vh;display:grid;grid-template-columns:minmax(330px,42%) 1fr;background:#f6f8fc}.auth-panel{padding:20px;display:flex;align-items:center;justify-content:center}.auth-card{width:min(100%,520px);padding:38px 42px;border:1px solid #edf0f5;border-radius:12px;background:#fff;box-shadow:0 16px 40px #173c8814}.brand{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:29px}.brand img{width:164px;height:auto;display:block;margin-bottom:4px}.brand small{font-size:9px;letter-spacing:2.6px;font-weight:800;color:#173c88}.eyebrow{margin:0 0 10px;color:#2260dc;font-weight:800;font-size:11px;letter-spacing:1.8px}.auth-card h1{margin:0 0 10px;font-size:24px;line-height:1.2;color:#17223a}.intro{margin:0 0 22px;color:#8290a7;font-size:13px;line-height:1.5}.roles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:23px}.role-btn{height:38px;border:1px solid #e4e9f1;background:#fff;border-radius:6px;color:#69758a;cursor:pointer;font-size:12px}.role-btn.active{background:#eef4ff;border-color:#cfe0ff;color:#2563d8;font-weight:700}.field{display:grid;gap:8px;margin-bottom:16px}.field label{font-size:12px;font-weight:700;color:#3d4961}.field-wrap{position:relative}.field-wrap span{position:absolute;left:12px;top:12px;font-size:13px;color:#8290a7}.field input{width:100%;height:42px;padding:0 13px 0 34px;border:1px solid #dde4ef;border-radius:7px;outline:none;color:#25324a;background:#fff}.field input:focus{border-color:#4a7fe0;box-shadow:0 0 0 3px #2563d81a}.login-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:42px;margin-top:10px;border:0;border-radius:7px;background:#fff;color:#17223a;font-weight:700;cursor:pointer}.login-btn:hover{background:#f1f5fb}.forgot{display:block;margin:1px auto 23px;border:0;background:none;color:#4a75ba;font-size:11px;cursor:pointer}.demo{padding-top:19px;border-top:1px solid #eef1f5;color:#97a2b5;font-size:11px;line-height:1.8}.demo strong{display:block;margin-bottom:5px;color:#4c5b75;font-size:12px}.demo button{display:block;border:0;padding:0;background:none;color:#8795aa;font-size:11px;cursor:pointer;text-align:left}.demo button:hover{color:#2563d8}.hero-panel{position:relative;min-height:100vh;overflow:hidden;padding:54px 8%;display:flex;flex-direction:column;color:#fff;background:linear-gradient(135deg,#163d97 0%,#2262d9 52%,#4d86ee 100%)}.hero-panel:after{content:"";position:absolute;inset:auto -18% -23% auto;width:70vw;height:70vw;border-radius:50%;background:#8eb8ff1a}.hero-content,.hero-footer{position:relative;z-index:1}.hero-content{max-width:560px;margin-top:34px}.hero-content .eyebrow{color:#dce9ff;font-size:9px;letter-spacing:2.2px}.hero-content h2{max-width:500px;margin:0 0 16px;font-size:clamp(34px,4.8vw,64px);font-weight:400;line-height:.98;letter-spacing:-2px}.hero-content p{max-width:460px;margin:0;color:#dbe7ff;font-size:13px;line-height:1.5}.hero-footer{display:flex;justify-content:space-between;margin-top:auto;color:#d4e1ff;font-size:9px}.dashboard{min-height:100vh;display:grid;grid-template-columns:250px 1fr;background:#f6f8fc}.sidebar{padding:24px 16px;background:#fff;border-right:1px solid var(--line)}.side-brand{display:flex;align-items:center;gap:9px;padding:0 10px 30px}.side-brand img{width:37px;height:37px}.side-brand strong{font-size:12px;line-height:1.1;color:var(--navy)}.side-brand span{display:block;color:#f0b800;font-size:8px;letter-spacing:1.5px}.nav{display:grid;gap:5px}.nav button{display:flex;align-items:center;gap:12px;padding:12px;border:0;border-radius:7px;background:none;color:#738097;text-align:left;cursor:pointer}.nav button.active,.nav button:hover{background:#edf4ff;color:#2361d4;font-weight:700}.sidebar-foot{margin-top:auto;padding:18px 10px 0;color:#a0aabc;font-size:11px}.main{padding:30px 4.5%;overflow:auto}.topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:30px}.topbar h1{margin:0;color:#17223a;font-size:26px}.topbar p{margin:6px 0 0;color:var(--muted);font-size:13px}.user-chip{display:flex;align-items:center;gap:10px;padding:8px 11px;background:#fff;border:1px solid var(--line);border-radius:9px;color:#42506a;font-size:12px}.avatar{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#e7f0ff;color:#2563d8;font-weight:800}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:26px}.stat{padding:18px;background:#fff;border:1px solid var(--line);border-radius:10px}.stat small{color:#8390a4;font-size:11px}.stat strong{display:block;margin-top:8px;color:#1e2b46;font-size:25px}.stat em{font-style:normal;color:#36a269;font-size:11px}.section-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}.panel{padding:20px;background:#fff;border:1px solid var(--line);border-radius:10px}.panel h3{margin:0 0 16px;font-size:15px;color:#25324a}.course{display:flex;align-items:center;gap:13px;padding:13px 0;border-top:1px solid #eef1f5}.course:first-of-type{border-top:0}.course-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:8px;background:#eef4ff;color:#2563d8}.course strong{display:block;font-size:12px;color:#34415a}.course small{color:#8b97a9}.progress{height:6px;margin-top:8px;border-radius:99px;background:#edf0f5;overflow:hidden}.progress i{display:block;height:100%;border-radius:inherit;background:#3976df}.schedule{display:grid;gap:10px}.schedule-item{padding:12px;border-left:3px solid #4b83eb;background:#f7f9fd}.schedule-item strong{display:block;font-size:12px}.schedule-item small{color:#8a96a8}.logout{margin-top:18px;width:100%;padding:11px;border:1px solid #e9edf4;background:#fff;border-radius:7px;color:#738097;cursor:pointer}.toast{position:fixed;right:22px;bottom:22px;padding:12px 16px;border-radius:8px;background:#17223a;color:#fff;font-size:12px;box-shadow:0 12px 30px #17223a33}
@media(max-width:800px){.app-shell{display:block}.hero-panel{min-height:265px;padding:25px 24px 22px}.hero-content{margin-top:6px}.hero-content h2{font-size:34px;letter-spacing:-1px;max-width:420px}.hero-content p{font-size:12px;max-width:420px}.hero-footer{margin-top:26px}.auth-panel{padding:16px}.auth-card{padding:29px 23px}.brand img{width:142px}.dashboard{display:block}.sidebar{padding:12px 16px;border-right:0;border-bottom:1px solid var(--line)}.side-brand{padding:0 0 12px}.nav{display:flex;overflow:auto}.nav button{white-space:nowrap;padding:9px 11px}.sidebar-foot,.sidebar .logout{display:none}.main{padding:23px 16px}.topbar{align-items:flex-start}.topbar h1{font-size:22px}.cards{grid-template-columns:repeat(2,1fr)}.section-grid{grid-template-columns:1fr}.user-chip span{display:none}}
@media(max-width:460px){.roles{gap:5px}.role-btn{font-size:11px}.hero-panel{min-height:240px}.hero-content h2{font-size:29px}.hero-footer{font-size:8px}.cards{gap:9px}.stat{padding:14px}.stat strong{font-size:21px}}