*{box-sizing:border-box}body{margin:0;background:#f3f6fc;color:#20324d;font-family:Tahoma,Arial,sans-serif}.sidebar{position:fixed;inset:0 auto 0 0;width:245px;background:linear-gradient(180deg,#153b65,#102947);color:#fff;padding:20px 13px;display:flex;flex-direction:column}.brand{padding:10px 5px 25px;border-bottom:1px solid #45617f;font-size:18px}.brand small,.side-user small{display:block;color:#bcd0e5;font-size:11px;margin-top:6px}.sidebar nav{padding-top:15px;overflow:auto}.sidebar nav a{display:block;color:#e3edf8;text-decoration:none;padding:13px 12px;border-radius:9px;margin:3px 0;font-size:14px}.sidebar nav a:hover{background:#237ed4}.side-user{margin-top:auto;border:1px solid #496b8e;background:#1c426b;border-radius:10px;padding:12px;font-size:13px}.side-user a{display:block;color:#fff;margin-top:10px}.main{margin-left:245px;padding:0 25px 35px}.topbar{min-height:80px;display:flex;align-items:center;justify-content:space-between;gap:15px}.search{display:flex;background:white;border:1px solid #d5dfed;border-radius:10px;padding:5px;flex:1;max-width:850px}.search span{font-size:25px;color:#267ed1;padding:5px 10px}.search input{border:0;outline:0;flex:1;min-width:60px;padding:10px}.search button,.btn{border:0;background:#1678d3;color:white;border-radius:8px;padding:10px 18px;cursor:pointer}h1{font-size:27px;margin:15px 0 4px}h2{font-size:19px;margin:25px 0 14px}.muted{color:#7a8aa1;font-size:13px}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:20px 0}.card,.panel{background:#fff;border:1px solid #e0e7f0;border-radius:13px;padding:19px;box-shadow:0 4px 14px #19395b0b}.label{font-size:13px;color:#64758d}.value{font-size:26px;font-weight:bold;margin-top:10px}.blue{background:#e8f3ff;color:#1764b2}.purple{background:#f0eafe;color:#7043c2}.green{background:#e3f8ef;color:#128453}.orange{background:#fff1e5;color:#c6751b}.cyan{background:#e4f6fc;color:#1683a8}.red{background:#fdecea;color:#cf4545}.task-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.task{border-radius:12px;padding:17px;font-weight:bold;text-decoration:none;display:block}.task strong{display:block;font-size:25px;margin-top:8px}.table-wrap{overflow:auto;background:white;border:1px solid #e0e7f0;border-radius:12px;margin-top:15px}table{width:100%;border-collapse:collapse;min-width:650px}th,td{text-align:left;padding:13px;border-bottom:1px solid #edf1f6;font-size:13px}th{background:#f5f8fc}.form-card{max-width:500px;margin:60px auto;background:white;padding:30px;border-radius:15px;box-shadow:0 10px 35px #142d4e18}.field{margin:14px 0}.field label{display:block;font-size:13px;margin-bottom:7px}.field input{width:100%;padding:12px;border:1px solid #ccd7e5;border-radius:8px}.alert{padding:12px;background:#fff1e5;color:#9a5a13;border-radius:8px;margin:12px 0}.login-body{background:linear-gradient(135deg,#102947,#267fd2);min-height:100vh;padding:20px}@media(max-width:950px){.grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.sidebar{width:68px;padding:10px 5px}.brand{font-size:0}.brand:after{content:'◉';font-size:25px}.brand small,.side-user{display:none}.sidebar nav a{font-size:0}.sidebar nav a:first-letter{font-size:20px}.main{margin-left:68px;padding:0 10px}.grid,.task-grid{grid-template-columns:1fr 1fr}.topbar{flex-wrap:wrap;padding:10px 0}}