:root{--navy:#081a32;--navy2:#102a4c;--blue:#1769e0;--sky:#eaf3ff;--green:#15a174;--orange:#ef903d;--ink:#16263c;--muted:#708097;--line:#e1e9f3;--bg:#f4f7fb;--white:#fff}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:"DM Sans",sans-serif}a{text-decoration:none;color:inherit}button{font:inherit}.app{min-height:100vh;display:grid;grid-template-columns:255px 1fr}.sidebar{background:var(--navy);color:#c2d1e5;padding:25px 18px;position:fixed;inset:0 auto 0 0;width:255px;z-index:30;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:10px;color:#fff;font:800 16px "Manrope";padding:0 8px 27px}.brand img{width:40px;height:40px;object-fit:contain}.brand span{display:grid;line-height:1.15}.brand small{font:600 9px "DM Sans";letter-spacing:1.2px;color:#75a9ef;margin-top:4px}.course-chip{background:#ffffff0d;border:1px solid #ffffff13;border-radius:13px;padding:14px;margin:0 2px 22px}.course-chip small{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:#7fa4d0}.course-chip strong{display:block;color:#fff;font-size:14px;margin-top:5px}.side-label{font-size:9px;letter-spacing:1.3px;text-transform:uppercase;color:#6983a2;padding:0 12px;margin:12px 0 7px}.side-nav{display:grid;gap:3px}.side-nav button,.side-nav a{border:0;background:none;color:#aebfd4;border-radius:9px;padding:11px 12px;text-align:left;display:flex;align-items:center;gap:11px;font-weight:600;font-size:13px;cursor:pointer}.side-nav button span{width:20px;text-align:center}.side-nav button:hover,.side-nav button.active,.side-nav a:hover{background:#1769e026;color:#fff}.side-nav button.active{box-shadow:inset 3px 0 var(--blue)}.side-bottom{margin-top:auto;border-top:1px solid #ffffff13;padding-top:15px}.main{grid-column:2;min-width:0}.topbar{height:72px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 34px;position:sticky;top:0;z-index:20}.mobile-menu{display:none;border:0;background:var(--sky);color:var(--blue);width:40px;height:40px;border-radius:10px}.search{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 14px;width:min(330px,38vw);color:var(--muted)}.user{display:flex;align-items:center;gap:11px}.avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#337fed,#1055bb);color:#fff;font-weight:800}.user strong{display:block;font-size:13px}.user small{color:var(--muted);font-size:11px}.content{padding:30px 34px 50px;max-width:1400px;margin:auto}.view{display:none}.view.active{display:block}.welcome{display:flex;justify-content:space-between;gap:25px;align-items:end;margin-bottom:25px}.eyebrow{font-size:11px;font-weight:700;color:var(--blue);letter-spacing:1px;text-transform:uppercase}.welcome h1,.page-title{font:800 clamp(25px,3vw,35px)/1.15 "Manrope";letter-spacing:-1.3px;margin:7px 0}.welcome p,.page-sub{color:var(--muted);font-size:14px;margin:0}.primary{border:0;border-radius:10px;padding:12px 17px;background:var(--blue);color:#fff;font-weight:700;font-size:13px;cursor:pointer;display:inline-flex;align-items:center;gap:7px}.primary:hover{background:#1056bb}.hero{background:linear-gradient(105deg,#0c315f,#1769e0);color:#fff;border-radius:19px;padding:29px 32px;display:grid;grid-template-columns:1.25fr .75fr;gap:40px;overflow:hidden;position:relative}.hero:after{content:"";position:absolute;width:290px;height:290px;border:45px solid #ffffff13;border-radius:50%;right:-80px;top:-115px}.hero h2{font:800 23px "Manrope";margin:0 0 8px}.hero p{color:#d5e5fb;font-size:13px;line-height:1.6;max-width:600px}.progress-row{display:flex;align-items:center;gap:12px;margin-top:20px}.progress-track{height:7px;border-radius:5px;background:#ffffff35;flex:1;max-width:370px;overflow:hidden}.progress-fill{height:100%;background:#7ce0b6;border-radius:5px}.progress-row span{font-size:12px;font-weight:700}.hero-side{position:relative;z-index:1;background:#ffffff13;border:1px solid #ffffff1f;border-radius:14px;padding:18px}.hero-side small{color:#bdd6f5}.hero-side strong{font:800 18px "Manrope";display:block;margin:5px 0 13px}.hero-side button{background:#fff;color:var(--blue);width:100%}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:20px 0}.stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px}.stat-top{display:flex;justify-content:space-between}.stat i{width:37px;height:37px;border-radius:10px;background:var(--sky);display:grid;place-items:center;font-style:normal}.stat b{display:block;font:800 20px "Manrope";margin-top:12px}.stat span{color:var(--muted);font-size:11px}.layout{display:grid;grid-template-columns:1.35fr .65fr;gap:18px}.panel{background:#fff;border:1px solid var(--line);border-radius:15px;padding:21px}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}.panel h3{font:700 15px "Manrope";margin:0}.link-btn{border:0;background:none;color:var(--blue);font-weight:700;font-size:11px;cursor:pointer}.lesson{display:flex;align-items:center;gap:13px;padding:13px 0;border-top:1px solid #edf1f6}.lesson:first-of-type{border-top:0}.lesson-icon{width:39px;height:39px;border-radius:10px;background:var(--sky);display:grid;place-items:center;color:var(--blue);font-size:13px}.lesson-info{flex:1}.lesson-info b{display:block;font-size:12px}.lesson-info span{font-size:10px;color:var(--muted)}.status{font-size:10px;font-weight:700;border-radius:999px;padding:5px 8px;background:#e7f7f1;color:#07865f}.status.pending{background:#fff2e7;color:#bd620f}.live{border-radius:13px;background:linear-gradient(135deg,#fff3e8,#fff9f4);border:1px solid #f9dec5;padding:18px}.live-time{color:#cb6811;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.7px}.live h4{font:700 14px "Manrope";margin:8px 0 5px}.live p{font-size:11px;color:var(--muted);margin:0 0 13px}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:23px}.tabs{display:flex;gap:7px;flex-wrap:wrap}.tab{border:1px solid var(--line);background:#fff;color:#65758d;border-radius:999px;padding:8px 13px;font-size:11px;font-weight:700;cursor:pointer}.tab.active{background:var(--ink);color:#fff;border-color:var(--ink)}.resource-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.resource{background:#fff;border:1px solid var(--line);border-radius:15px;padding:19px}.resource-type{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;background:#ffeceb;color:#e05a52}.resource.video .resource-type{background:#e9f2ff;color:var(--blue)}.resource.live-card .resource-type{background:#e6f7f0;color:var(--green)}.resource h3{font:700 13px "Manrope";margin:16px 0 5px}.resource p{color:var(--muted);font-size:11px;line-height:1.5;min-height:33px}.meta{display:flex;justify-content:space-between;color:#8794a6;font-size:10px;padding-top:13px;border-top:1px solid #edf1f6}.resource button,.resource a.action{margin-top:14px;width:100%;border:0;border-radius:8px;padding:9px;background:var(--sky);color:var(--blue);font-weight:700;font-size:11px;cursor:pointer;text-align:center;display:block}.resource button:disabled{background:#f1f3f6;color:#97a1af;cursor:not-allowed}.module-card{background:#fff;border:1px solid var(--line);border-radius:14px;margin-bottom:12px;overflow:hidden}.module-head{width:100%;border:0;background:#fff;padding:18px;display:flex;align-items:center;gap:14px;text-align:left;cursor:pointer}.module-num{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:#fff;font-weight:800;font-size:11px}.module-head div{flex:1}.module-head b{display:block;font-size:13px}.module-head small{color:var(--muted)}.module-body{display:none;border-top:1px solid var(--line);padding:8px 18px}.module-card.open .module-body{display:block}.empty-note{border:1px dashed #cdd8e6;background:#fafcff;border-radius:13px;padding:28px;text-align:center;color:var(--muted);font-size:13px}.toast{position:fixed;right:25px;bottom:25px;background:var(--ink);color:#fff;padding:13px 17px;border-radius:10px;font-size:12px;box-shadow:0 14px 40px #112a4d38;transform:translateY(80px);opacity:0;transition:.25s;z-index:50}.toast.show{transform:none;opacity:1}
@media(max-width:1000px){.app{grid-template-columns:220px 1fr}.sidebar{width:220px}.stats{grid-template-columns:1fr 1fr}.resource-grid{grid-template-columns:1fr 1fr}}@media(max-width:760px){.app{display:block}.sidebar{transform:translateX(-100%);transition:.25s;width:255px}.sidebar.open{transform:none}.main{display:block}.topbar{padding:0 16px;height:64px}.mobile-menu{display:block}.search{display:none}.content{padding:22px 15px 45px}.welcome{display:block}.welcome .primary{margin-top:15px}.hero{grid-template-columns:1fr;padding:24px}.hero-side{display:none}.layout{grid-template-columns:1fr}.resource-grid{grid-template-columns:1fr}.user strong,.user small{display:none}}