*{box-sizing:border-box;margin:0;padding:0}:root{color:#172b4d;background:#f3f6fb;font-family:Segoe UI,Arial,sans-serif}body{min-width:320px;min-height:100vh}button{font:inherit;cursor:pointer}.app{min-height:100vh;display:flex}.sidebar{color:#fff;background:#102d50;flex-direction:column;flex-shrink:0;width:255px;min-height:100vh;padding:28px 17px;display:flex}.brand{align-items:center;gap:12px;padding:5px 12px 35px;display:flex}.brand-icon{color:#102d50;background:#a6d82c;border-radius:12px;place-items:center;width:46px;height:46px;font-size:27px;font-weight:900;display:grid}.brand h2{letter-spacing:1.5px;font-size:19px}.brand small{color:#a6d82c;letter-spacing:3px;font-size:10px;font-weight:700}nav{flex-direction:column;gap:8px;display:flex}.nav-item{color:#d5e0ed;text-align:left;background:0 0;border:0;border-radius:9px;width:100%;padding:14px 13px;font-size:14px;transition:all .2s}.nav-item:hover,.nav-item.active{color:#fff;background:#23496f}.nav-item.active{border-left:4px solid #a6d82c;font-weight:700}.sidebar-bottom{color:#bdcbd9;align-items:center;gap:9px;margin-top:auto;padding:20px 12px 0;font-size:12px;display:flex}.online-dot{background:#a6d82c;border-radius:50%;width:9px;height:9px}.main{flex:1;min-width:0;padding:38px 45px 20px}.page-header{justify-content:space-between;align-items:center;gap:20px;margin-bottom:30px;display:flex}.eyebrow{color:#6b819a;letter-spacing:2px;margin-bottom:9px;font-size:11px;font-weight:800}.page-header h1{color:#102d50;margin-bottom:7px;font-size:29px}.subtitle{color:#718096;font-size:14px}.date-box{text-align:right;background:#fff;border:1px solid #e5ebf2;border-radius:10px;flex-direction:column;gap:5px;padding:13px 19px;display:flex}.date-box span{color:#8b9aab;letter-spacing:1.5px;font-size:9px;font-weight:800}.date-box strong{color:#102d50;font-size:13px}.welcome-card{color:#fff;background:linear-gradient(115deg,#153b63,#24577e);border-radius:16px;justify-content:space-between;align-items:center;min-height:205px;padding:35px 38px;display:flex;overflow:hidden}.welcome-label{color:#b8e65a;letter-spacing:2px;font-size:10px;font-weight:800}.welcome-card h2{margin:12px 0;font-size:27px;line-height:1.25}.welcome-card p{color:#d1dfec;max-width:480px;font-size:13px;line-height:1.6}.welcome-symbol{color:#b8e65a;border:15px solid #ffffff1f;border-radius:35px;flex-shrink:0;place-items:center;width:135px;height:135px;font-size:75px;font-weight:900;display:grid;transform:rotate(10deg)}.section-heading{margin:32px 0 18px}.section-heading h2{color:#183754;margin-bottom:5px;font-size:19px}.section-heading p{color:#8795a7;font-size:13px}.activity-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.activity-card{text-align:left;background:#fff;border:1px solid #e5ebf2;border-radius:12px;flex-direction:column;align-items:flex-start;min-height:155px;padding:22px;transition:all .2s;display:flex;position:relative}.activity-card:hover{border-color:#a6d82c;transform:translateY(-3px);box-shadow:0 8px 25px #14325017}.activity-icon{margin-bottom:12px;font-size:25px}.activity-card strong{color:#183754;margin-bottom:6px;font-size:14px}.activity-card small{color:#8291a3;font-size:12px}.card-arrow{color:#8caf2a;font-size:20px;position:absolute;bottom:20px;right:20px}.notice{color:#526d22;background:#f0f7df;border:1px solid #e1edc6;border-radius:10px;align-items:flex-start;gap:13px;margin-top:23px;padding:17px 19px;display:flex}.notice>span{font-size:20px}.notice strong{font-size:13px}.notice p{color:#70834d;margin-top:5px;font-size:12px}.module-card{background:#fff;border:1px solid #e5ebf2;border-radius:14px;min-height:270px;padding:35px}.module-icon{color:#638a16;background:#edf5dc;border-radius:12px;place-items:center;width:48px;height:48px;margin-bottom:20px;font-size:23px;display:grid}.module-card h2{color:#183754;margin-bottom:10px}.module-card p{color:#718096;font-size:14px}.module-status{color:#638a16;letter-spacing:1px;background:#edf5dc;border-radius:6px;margin-top:25px;padding:8px 12px;font-size:10px;font-weight:800;display:inline-block}.module-card .module-note{margin-top:14px;font-size:12px}footer{color:#95a1af;border-top:1px solid #e5ebf2;margin-top:35px;padding:17px 0;font-size:11px}footer span{color:#a6d82c;padding:0 5px}@media (width<=850px){.sidebar{width:205px}.main{padding:28px 22px}}@media (width<=600px){.app{flex-direction:column}.sidebar{width:100%;min-height:auto;padding:14px}.brand{padding:4px 7px 15px}nav{grid-template-columns:repeat(2,1fr);display:grid}.nav-item{padding:11px 9px;font-size:12px}.sidebar-bottom{display:none}.main{padding:23px 15px}.page-header{flex-direction:column;align-items:flex-start}.page-header h1{font-size:24px}.date-box{text-align:left}.welcome-card{padding:25px 20px}.welcome-card h2{font-size:23px}.welcome-symbol{display:none}.activity-grid{grid-template-columns:1fr}}.login-page{background:#f3f6fb;justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.login-card{text-align:center;background:#fff;border-radius:16px;width:100%;max-width:420px;padding:40px;box-shadow:0 10px 40px #102d501a}.login-card .brand-icon{margin:0 auto 20px}.login-card h1{color:#102d50;margin-bottom:9px;font-size:23px}.login-card>p{color:#718096;margin-bottom:28px;font-size:13px}.login-card form{text-align:left;flex-direction:column;gap:10px;display:flex}.login-card label{color:#183754;margin-top:8px;font-size:13px;font-weight:700}.login-card input{border:1px solid #dce4ee;border-radius:8px;outline:none;width:100%;padding:13px;font-size:14px}.login-card input:focus{border-color:#78a925;box-shadow:0 0 0 3px #a6d82c26}.login-card form button{color:#fff;background:#173f65;border:none;border-radius:8px;margin-top:18px;padding:14px;font-weight:700}.login-card form button:hover{background:#24577e}.login-card form button:disabled{opacity:.6;cursor:wait}#login-message{color:#c0392b;min-height:15px;margin:15px 0;font-size:12px}.login-card>small{color:#8795a7;font-size:11px}