:root{color:#172033;background:#eef2f7;font-family:Tahoma,Arial,sans-serif}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;border:0}.login-page{background:linear-gradient(135deg,#172033,#28527a);place-items:center;min-height:100vh;padding:24px;display:grid}.login-card{background:#fff;border-radius:28px;width:min(460px,100%);padding:34px;box-shadow:0 24px 60px #00000038}.eyebrow{color:#6f7a8a;letter-spacing:.04em;margin:0 0 6px;font-size:13px;font-weight:700}h1{margin:0;font-size:clamp(26px,5vw,42px)}.subtitle{color:#6f7a8a;line-height:1.8}form{gap:12px;display:grid}label{color:#344054;gap:7px;font-weight:700;display:grid}input{background:#fbfcff;border:1px solid #d6dce6;border-radius:14px;padding:13px 14px}.login-card button,.small-btn{color:#fff;background:#1f6feb;border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:13px 18px;font-weight:800;display:inline-flex}.error{color:#b42318;background:#fff1f0;border-radius:12px;padding:10px}.success{color:#027a48;font-weight:700}.app{grid-template-columns:280px 1fr;min-height:100vh;display:grid}.sidebar{color:#fff;background:#101828;flex-direction:column;gap:22px;height:100vh;padding:22px;display:flex;position:sticky;top:0}.brand-mark{align-items:center;gap:12px;display:flex}.brand-mark span{color:#aab4c4;margin-top:4px;font-size:12px;display:block}nav{gap:8px;display:grid}nav button,.logout{text-align:right;color:#d0d5dd;background:0 0;border-radius:14px;align-items:center;gap:10px;padding:12px;display:flex}nav button.active,nav button:hover{color:#fff;background:#1f6feb}.logout{background:#27364a;margin-top:auto}.content{align-content:start;gap:22px;padding:28px;display:grid}.topbar{background:#fff;border-radius:24px;justify-content:space-between;align-items:center;padding:22px;display:flex;box-shadow:0 12px 30px #1018280f}.role{color:#1f6feb;background:#eaf2ff;border-radius:99px;padding:9px 14px;font-weight:800}.stats{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}.stat-card,.panel{background:#fff;border-radius:22px;padding:20px;box-shadow:0 12px 30px #1018280f}.stat-card{gap:10px;display:grid}.stat-card span{color:#667085}.stat-card strong{font-size:34px}.panel h3{margin-top:0}.form-grid{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;min-width:620px}th,td{text-align:right;border-bottom:1px solid #eaecf0;padding:13px}th{color:#667085;background:#f9fafb}.timeline{flex-wrap:wrap;gap:10px;display:flex}.timeline span{background:#f2f4f7;border-radius:999px;padding:9px 13px}@media (width<=900px){.app{grid-template-columns:1fr}.sidebar{height:auto;position:static}nav{grid-template-columns:repeat(2,1fr)}.stats,.form-grid{grid-template-columns:1fr}.topbar{flex-direction:column;align-items:flex-start;gap:12px}}@media (width<=560px){.content,.sidebar{padding:14px}nav{grid-template-columns:1fr}.panel,.stat-card,.topbar{border-radius:16px}}