*{box-sizing:border-box}
body{margin:0;font-family:Arial;background:#f4f7fb;color:#111827}
a{text-decoration:none;color:inherit}
.topbar{height:64px;background:#0f7a4b;color:white;display:flex;align-items:center;justify-content:space-between;padding:0 22px;box-shadow:0 4px 18px #0002}
.brand{font-size:22px;font-weight:800}
.logout{background:#ef4444;color:white;padding:10px 16px;border-radius:10px;font-weight:bold}
.layout{display:flex;min-height:calc(100vh - 64px)}
.sidebar{width:250px;background:#10251c;color:white;padding:18px}
.sidebar a{display:block;padding:13px 14px;margin:6px 0;border-radius:12px;color:#d1fae5;font-weight:600}
.sidebar a:hover,.sidebar a.active{background:#16a34a;color:white}
.content{flex:1;padding:24px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-bottom:24px}
.card{background:white;border-radius:18px;padding:22px;box-shadow:0 8px 25px #0001;border:1px solid #e5e7eb}
.card h3{margin:0 0 8px;font-size:15px;color:#6b7280}
.card .num{font-size:32px;font-weight:900;color:#0f7a4b}
.panel{background:white;border-radius:18px;padding:22px;box-shadow:0 8px 25px #0001;border:1px solid #e5e7eb}
h1{margin-top:0}
.btn{background:#16a34a;color:white;padding:10px 15px;border-radius:10px;border:0;font-weight:bold;cursor:pointer}
.btn-red{background:#ef4444}
input,select,textarea{width:100%;padding:12px;border:1px solid #d1d5db;border-radius:10px;margin:7px 0 14px}
table{width:100%;border-collapse:collapse;background:white}
th,td{padding:13px;border-bottom:1px solid #e5e7eb;text-align:left}
th{background:#f0fdf4;color:#166534}
.badge{background:#dcfce7;color:#166534;padding:5px 10px;border-radius:999px;font-weight:bold}
@media(max-width:800px){.layout{flex-direction:column}.sidebar{width:100%}}