:root{--navy:#17365d;--navy-d:#0f2a4a;--teal:#287d8e;--teal-d:#1f6573;--bg:#f4f7fb;--pos:#15803d;--neg:#b91c1c}
body{background:var(--bg);color:#172033;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.btn-teal{background:var(--teal);border-color:var(--teal);color:#fff}.btn-teal:hover,.btn-teal:focus{background:var(--teal-d);border-color:var(--teal-d);color:#fff}
.text-teal{color:var(--teal)}.pos{color:var(--pos)}.neg{color:var(--neg)}
.card{border:0;border-radius:16px}.card-header:first-child{border-radius:16px 16px 0 0}
a{color:var(--teal)}
.app-shell{display:flex;min-height:100vh}
.side{width:250px;flex:0 0 250px;background:var(--navy);padding:20px 0;position:sticky;top:0;height:100vh;overflow-y:auto}
.side-dark{background:var(--navy);width:260px}
.brand{color:#fff;font-weight:800;font-size:1.3rem;padding:0 20px 18px;letter-spacing:-.02em}.brand i{color:#5fd4dd}
.brand-lg{font-weight:800;font-size:1.5rem;color:var(--navy)}.brand-lg i{color:var(--teal)}
.nav-item-link{display:flex;align-items:center;gap:12px;padding:11px 20px;color:#cfe0f5;text-decoration:none;border-left:3px solid transparent}
.nav-item-link:hover{background:#ffffff12;color:#fff}
.nav-item-link.active{background:#ffffff1c;color:#fff;border-left-color:#5fd4dd}
.topbar{background:var(--navy)}
.content{flex:1;min-width:0;padding:24px;max-width:1240px}
.stat-v{font-size:1.5rem;font-weight:800;letter-spacing:-.02em;margin-top:6px;word-break:break-word}
.chart-box{position:relative;height:260px}
.avatar{width:44px;height:44px;border-radius:12px;background:var(--teal);color:#fff;display:grid;place-items:center;font-weight:700}
.avatar.sm{width:36px;height:36px;border-radius:50%}
.auth-body{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:16px;background:linear-gradient(135deg,#17365d,#287d8e)}
.auth-body .alert{max-width:440px}
.auth-card{width:100%;max-width:440px}
.auth-body>.alert{position:fixed;top:12px;z-index:10}
.table th{font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;color:#64748b;white-space:nowrap}
:focus-visible{outline:3px solid #7ec8d4;outline-offset:2px}
@media (max-width:991.98px){.content{padding:16px}}
