*{box-sizing:border-box}html,body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f8fafc;color:#0f172a}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}.layout{display:grid;grid-template-columns:270px 1fr;min-height:100vh}.sidebar{background:linear-gradient(180deg,#0f172a,#111827);color:#fff;padding:1.2rem}.sidebar .brand{font-weight:800;font-size:1.3rem;margin-bottom:1rem}.sidebar nav{display:flex;flex-direction:column;gap:.5rem}.sidebar nav a{padding:.8rem 1rem;border-radius:12px;color:#cbd5e1}.sidebar nav a.active,.sidebar nav a:hover{background:#0ea5e929;color:#fff}.main{padding:1rem}.card{background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:1rem;box-shadow:0 12px 30px #0f172a14}.topbar{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem}.page-title h1{margin:0}.page-title p{margin:.3rem 0 0;color:#64748b}.grid{display:grid;gap:1rem}.grid-4{grid-template-columns:repeat(4,1fr)}.grid-2{grid-template-columns:repeat(2,1fr)}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.field{display:flex;flex-direction:column;gap:.4rem}.field label{font-weight:700;font-size:.9rem;color:#334155}.field input,.field select,.field textarea{padding:.8rem;border:1px solid #cbd5e1;border-radius:10px}.btn{border:0;border-radius:10px;padding:.7rem 1rem;font-weight:700;cursor:pointer}.btn-primary{background:#0ea5e9;color:#fff}.btn-secondary{background:#e2e8f0;color:#0f172a}.btn-danger{background:#dc2626;color:#fff}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:.8rem;border-bottom:1px solid #e5e7eb;text-align:left}th{background:#f8fafc;color:#64748b;text-transform:uppercase;font-size:.85rem}.actions{display:flex;gap:.5rem;flex-wrap:wrap}.login-page{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#0f172a,#0369a1)}.login-card{width:min(430px,95vw);background:#fff;border-radius:20px;padding:2rem;box-shadow:0 20px 60px #0000004d}.kpi .label{color:#64748b;font-size:.9rem}.kpi .value{font-size:1.8rem;font-weight:800}.bar{height:12px;background:#e2e8f0;border-radius:999px;overflow:hidden}.bar span{display:block;height:100%;background:linear-gradient(90deg,#0ea5e9,#22c55e)}@media (max-width:1024px){.layout{grid-template-columns:1fr}.grid-4{grid-template-columns:repeat(2,1fr)}}@media (max-width:640px){.grid-4,.grid-2,.form-grid{grid-template-columns:1fr}.topbar{flex-direction:column;align-items:flex-start}}