:root{--navy:#173a60;--navy-2:#304b6c;--orange:#ef7d00;--orange-2:#f69a19;--bg:#f4f7fb;--panel:#fff;--line:#d9e3ef;--text:#18304b;--muted:#6e8097;--green:#1f9d68;--red:#d94343;--amber:#d99200;--shadow:0 18px 45px rgba(23,58,96,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}button,input,select,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}.muted{color:var(--muted)}
.loading-screen{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 45%,#12365c 0,#061a33 42%,#050d1f 100%);color:#fff;overflow:hidden;transition:opacity .55s ease,visibility .55s ease}.loading-screen::before,.loading-screen::after{content:"";position:absolute;border:1px solid rgba(255,255,255,.08);border-radius:50%;width:70vw;height:70vw}.loading-screen::after{width:95vw;height:95vw}.loading-screen.done{opacity:0;visibility:hidden}.loading-screen h1{font-size:clamp(34px,6vw,72px);letter-spacing:.06em;margin:18px 0 8px;animation:titleFloat 2.8s ease-in-out infinite}.loading-screen p{color:#c9d9ea}.loading-kicker{font-weight:800;letter-spacing:.28em}.loading-orbit{position:relative;width:220px;height:220px}.orbit{position:absolute;inset:13px;border:1px solid rgba(72,219,170,.45);border-radius:50%;animation:spin 7s linear infinite}.orbit-b{inset:0;border-style:dashed;animation-duration:11s;animation-direction:reverse}.orbit-dot{position:absolute;width:9px;height:9px;background:#4fe1aa;border-radius:50%;box-shadow:0 0 16px #4fe1aa}.dot-a{left:104px;top:3px;animation:orbitDot 7s linear infinite}.dot-b{right:24px;bottom:30px;animation:orbitDotB 11s linear infinite}.loading-logo{position:absolute;inset:43px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#fff;box-shadow:0 0 0 12px rgba(255,255,255,.08),0 0 35px rgba(54,221,157,.28)}.loading-logo img{width:108px;height:auto}@keyframes spin{to{transform:rotate(360deg)}}@keyframes orbitDot{to{transform:rotate(360deg) translateX(105px) rotate(-360deg)}}@keyframes orbitDotB{to{transform:rotate(-360deg) translateX(86px) rotate(360deg)}}@keyframes titleFloat{50%{transform:translateX(12px)}}
.auth-shell{min-height:100vh;display:grid;grid-template-columns:1.05fr 1fr;background:#fff}.auth-brand-panel{padding:7vw;background:linear-gradient(140deg,#f6a51c 0,#ef7d00 56%,#dd5e00 100%);color:#fff;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}.auth-brand-panel::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:rgba(255,255,255,.13);top:-260px;right:-110px}.brand-logo-card{width:min(300px,70%);background:#fff;border-radius:16px;padding:20px;box-shadow:var(--shadow);z-index:1}.brand-logo-card img{width:100%;display:block}.eyebrow{font-size:13px;font-weight:800;letter-spacing:.17em}.orange{color:#d65e00}.auth-brand-panel h1{font-size:clamp(48px,7vw,82px);line-height:1;margin:24px 0}.auth-copy{font-size:21px;line-height:1.55;max-width:680px}.brand-pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.brand-pills span{border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:8px 13px;font-weight:700}.auth-form-panel{display:flex;align-items:center;justify-content:center;padding:48px}.auth-card{width:min(580px,100%);padding:44px;border-radius:20px;background:#fff;box-shadow:var(--shadow)}.auth-card h2{font-size:44px;margin:8px 0}.auth-card label{display:block;font-weight:700;margin-top:18px}.auth-card input{width:100%;margin-top:8px;border:1px solid #ccd9e7;border-radius:10px;padding:15px;background:#fff}.auth-actions{display:flex;gap:12px;margin-top:24px}.btn{border:0;border-radius:10px;padding:13px 20px;font-weight:800}.btn-primary{background:linear-gradient(90deg,var(--navy-2),#1384a7);color:#fff}.btn-secondary{background:#fff;color:var(--text);border:1px solid #ccd7e5}.btn-danger{background:#fff2f2;color:var(--red);border:1px solid #f1c7c7}.text-button{border:0;background:transparent;color:#087aa8;font-weight:800;padding:12px 0}.form-message{min-height:22px;font-weight:700}.form-message.error{color:var(--red)}.form-message.success{color:var(--green)}.auth-note{font-size:13px;color:var(--muted);line-height:1.5}
.pending-view{min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--bg)}.pending-card{width:min(560px,100%);background:#fff;border-radius:24px;padding:40px;text-align:center;box-shadow:var(--shadow)}.pending-card img{width:180px}.pending-icon{font-size:54px;margin:18px}
.topbar{height:49px;background:#24496f;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 28px;font-size:14px}.topbar-left,.topbar-right{display:flex;align-items:center;gap:18px}.topbar-left strong{letter-spacing:.08em}.topbar-left span{color:#dce6ef}.main-header{background:#fff;display:grid;grid-template-columns:390px minmax(280px,1fr) auto;align-items:center;gap:20px;padding:20px 28px;border-bottom:1px solid var(--line)}.brand-button{border:0;background:transparent;display:flex;align-items:center;gap:18px;text-align:left;color:var(--text)}.brand-button img{width:112px;height:auto}.brand-button span{padding-left:18px;border-left:1px solid var(--line);display:flex;flex-direction:column;gap:4px}.brand-button strong{font-size:18px}.brand-button small{color:var(--muted)}.global-search-wrap{display:grid;grid-template-columns:170px 1fr auto;border:1px solid #cbd9e7;border-radius:12px;overflow:hidden;background:#fff}.global-search-wrap select,.global-search-wrap input{border:0;padding:15px;background:#fff;color:var(--text)}.global-search-wrap select{border-right:1px solid var(--line)}.global-search-wrap input:focus,.global-search-wrap select:focus{outline:2px solid #a9c9e8;outline-offset:-2px}.global-search-wrap kbd{align-self:center;margin-right:10px;padding:5px 8px;border:1px solid #d7e0ea;border-radius:7px;background:#f5f8fb;color:#63758a}.header-actions{display:flex;align-items:center;gap:10px}.circle-btn{width:48px;height:48px;border-radius:50%;border:1px solid #d4dfeb;background:#fff;color:var(--text);font-size:20px}.circle-btn:hover{background:#f3f7fb}.badge-wrap{position:relative}.badge{position:absolute;right:-3px;top:-5px;display:grid;place-items:center;min-width:22px;height:22px;padding:0 5px;border-radius:999px;background:var(--orange);color:#fff;font-size:12px;font-weight:800}.user-chip{display:flex;align-items:center;gap:10px;min-width:165px}.user-chip span:last-child{display:flex;flex-direction:column}.user-chip small{color:var(--muted)}.avatar{width:48px;height:48px;border-radius:50%;display:grid!important;place-items:center;background:var(--orange);color:#fff;font-weight:900;font-size:20px}
.primary-nav{display:flex;align-items:stretch;background:#fff;border-bottom:1px solid var(--line);padding:0 28px;overflow-x:auto}.nav-item{white-space:nowrap;border:0;background:#fff;padding:18px 20px;color:#273b52;font-weight:700;border-bottom:3px solid transparent}.nav-item.active{color:#b95400;background:#fff8ef;border-bottom-color:var(--orange)}.nav-item:hover{background:#f7f9fc}.page-root{padding:26px;max-width:1700px;margin:0 auto}.page-title-row{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:20px}.page-title-row h1{margin:0;font-size:32px}.page-title-row p{margin:7px 0;color:var(--muted)}.dashboard-grid{display:grid;grid-template-columns:250px minmax(0,1fr) 310px;gap:18px;align-items:start}.side-stack,.support-stack{display:grid;gap:16px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:0 8px 25px rgba(23,58,96,.06);overflow:hidden}.panel-header{background:linear-gradient(90deg,#f06f00,#f49a16);color:#fff;padding:13px 16px;font-weight:800;display:flex;justify-content:space-between;align-items:center}.panel-body{padding:16px}.search-row{display:flex;gap:8px}.search-row input{min-width:0;flex:1;border:1px solid var(--line);border-radius:9px;padding:10px}.mini-button{border:0;border-radius:8px;background:#177a98;color:#fff;padding:10px 13px;font-weight:800}.donut-summary{display:flex;align-items:center;gap:16px}.donut{--pct:0;width:90px;height:90px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--green) calc(var(--pct)*1%),#e6edf4 0);position:relative}.donut::after{content:"";width:60px;height:60px;border-radius:50%;background:#fff}.donut strong{position:absolute;z-index:1;font-size:16px}.summary-list{display:grid;gap:6px;font-size:13px}.history-number{font-size:44px;font-weight:900;color:var(--navy);text-align:center}.assignment-panel .panel-body{padding:0}.assignment-toolbar{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;gap:10px;flex-wrap:wrap}.assignment-toolbar input,.assignment-toolbar select{border:1px solid var(--line);border-radius:8px;padding:10px;min-width:150px}.assignment-list{display:grid}.assignment-row{display:grid;grid-template-columns:1fr auto;gap:14px;padding:16px;border-bottom:1px solid var(--line);align-items:center}.assignment-row:last-child{border-bottom:0}.assignment-row h3{margin:0 0 6px;font-size:17px}.assignment-meta{display:flex;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:13px}.status-chip{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:800}.status-assigned{background:#e8f2ff;color:#1761a5}.status-in_progress{background:#fff3d6;color:#9b6900}.status-completed{background:#ddf5e9;color:#087344}.status-overdue{background:#ffe3e3;color:#b32626}.assignment-actions{display:flex;gap:8px}.action-button{border:1px solid #c9d6e3;background:#fff;border-radius:8px;padding:9px 12px;font-weight:800;color:var(--text)}.action-button.primary{border-color:var(--navy);background:var(--navy);color:#fff}.support-list{display:grid;gap:10px}.support-link{display:block;border-bottom:1px solid var(--line);padding-bottom:10px;color:var(--text);text-decoration:none}.support-link:last-child{border-bottom:0}.progress-bar{height:9px;background:#e7edf3;border-radius:999px;overflow:hidden;margin-top:10px}.progress-bar span{display:block;height:100%;background:linear-gradient(90deg,var(--orange),#f3b235)}
.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}.metric-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;display:flex;gap:14px;align-items:center}.metric-icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#eaf3fb;font-size:23px}.metric-card strong{font-size:28px;display:block}.metric-card small{color:var(--muted)}.course-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.course-card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column}.course-visual{height:130px;background:linear-gradient(135deg,#173a60,#1a84a8);color:#fff;padding:18px;display:flex;flex-direction:column;justify-content:space-between}.course-visual.orange{background:linear-gradient(135deg,#dd6500,#f3a01a)}.course-visual.green{background:linear-gradient(135deg,#16734d,#28a873)}.course-body{padding:16px;display:flex;flex:1;flex-direction:column}.course-body h3{margin:0 0 8px}.course-body p{color:var(--muted);font-size:14px;line-height:1.5;flex:1}.course-footer{display:flex;justify-content:space-between;align-items:center;margin-top:12px}.table-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:16px}.data-table{width:100%;border-collapse:collapse;min-width:850px}.data-table th,.data-table td{text-align:left;padding:13px;border-bottom:1px solid var(--line);font-size:14px}.data-table th{background:#f3f7fb;color:#43556a}.data-table tr:last-child td{border-bottom:0}.empty-state{text-align:center;padding:50px;color:var(--muted)}
.modal-overlay{position:fixed;inset:0;z-index:3000;background:rgba(10,27,47,.66);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:22px}.modal{width:min(820px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:18px;box-shadow:0 30px 90px rgba(0,0,0,.35);position:relative;padding:28px}.modal-close{position:absolute;right:16px;top:12px;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:#fff;font-size:24px}.modal h2{margin-top:0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.form-grid .full{grid-column:1/-1}.form-grid label{font-weight:700}.form-grid input,.form-grid select,.form-grid textarea{width:100%;margin-top:7px;padding:12px;border:1px solid #ccd8e4;border-radius:9px}.form-grid textarea{min-height:110px;resize:vertical}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.toast{position:fixed;z-index:4000;right:20px;bottom:20px;background:#173a60;color:#fff;padding:13px 17px;border-radius:11px;box-shadow:var(--shadow);max-width:360px}.toast.error{background:#a82626}.toast.success{background:#087344}
.dark{--bg:#0d1724;--panel:#142131;--line:#2a3c50;--text:#eef5fb;--muted:#9db0c4}.dark body,.dark{background:var(--bg);color:var(--text)}.dark .main-header,.dark .primary-nav,.dark .nav-item,.dark .global-search-wrap,.dark .global-search-wrap input,.dark .global-search-wrap select,.dark .circle-btn,.dark .panel,.dark .metric-card,.dark .course-card,.dark .table-wrap,.dark .modal{background:var(--panel);color:var(--text)}.dark .assignment-row,.dark .data-table th{background:transparent}.dark .nav-item.active{background:#233248}.dark .donut::after{background:var(--panel)}
@media(max-width:1250px){.main-header{grid-template-columns:300px 1fr}.header-actions{grid-column:1/-1;justify-content:flex-end}.dashboard-grid{grid-template-columns:220px minmax(0,1fr)}.support-stack{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}.course-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:850px){.auth-shell{grid-template-columns:1fr}.auth-brand-panel{min-height:42vh;padding:40px 24px}.auth-form-panel{padding:24px}.topbar{display:none}.main-header{grid-template-columns:1fr;padding:14px}.brand-button{justify-content:center}.global-search-wrap{grid-template-columns:100px 1fr}.header-actions{justify-content:center;flex-wrap:wrap}.user-chip{min-width:auto}.primary-nav{padding:0}.page-root{padding:16px}.dashboard-grid{grid-template-columns:1fr}.support-stack{grid-template-columns:1fr}.side-stack{grid-template-columns:1fr 1fr}.metric-grid{grid-template-columns:repeat(2,1fr)}.course-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.assignment-row{grid-template-columns:1fr}.assignment-actions{justify-content:flex-start}}
@media(max-width:520px){.auth-card{padding:26px 20px}.auth-actions{flex-direction:column}.side-stack{grid-template-columns:1fr}.metric-grid{grid-template-columns:1fr}.global-search-wrap kbd{display:none}.brand-button span{display:none}.header-actions .circle-btn:nth-child(1){display:none}.modal-overlay{padding:8px}.modal{padding:20px 15px}.page-title-row{flex-direction:column}.course-visual{height:110px}}