:root{--header-h:56px;--sidebar-w:260px;--bg:#f8f9fa;--bg-panel:#ffffff;--text:#212529;--muted:#6c757d;--border:#e9ecef;--primary:#0d6efd}
@media (prefers-color-scheme: dark){
  :root{--bg:#0f1113;--bg-panel:#15171a;--text:#e9ecef;--muted:#adb5bd;--border:#2b2f33;--primary:#4dabf7}
}
*{box-sizing:border-box}
html,body{height:100%}
body{min-height:100%;background:var(--bg);color:var(--text)}
.app-header{height:var(--header-h);z-index:1030}
.sidebar-toggle{position:absolute;opacity:0;pointer-events:none}
.app-layout{display:flex}
.app-sidebar{position:fixed;top:var(--header-h);left:0;bottom:0;width:var(--sidebar-w);background:var(--bg-panel);border-right:1px solid var(--border);overflow:auto;transition:transform .2s ease}
.app-content{flex:1;min-height:calc(100vh - var(--header-h));margin-left:var(--sidebar-w);padding-top:calc(var(--header-h) - 16px)}
#sidebar-toggle:not(:checked) ~ .app-layout .app-sidebar{transform:translateX(0)}
#sidebar-toggle:not(:checked) ~ .app-layout .app-content{margin-left:var(--sidebar-w)}
/* no-sidebar layout (e.g., login page) */
.app-layout.no-sidebar .app-content{margin-left:0}
.app-layout.no-sidebar .app-sidebar{display:none}
@media (max-width: 992px){
  #sidebar-toggle:not(:checked) ~ .app-layout .app-sidebar{transform:translateX(-100%)}
  #sidebar-toggle:not(:checked) ~ .app-layout .app-content{margin-left:0}
  #sidebar-toggle:checked ~ .app-layout .app-sidebar{transform:translateX(0)}
  #sidebar-toggle:checked ~ .app-layout .app-content{margin-left:var(--sidebar-w)}
}
.brand{border-bottom:1px solid var(--border);color:var(--text)}
.side-nav{list-style:none;margin:0;padding:8px 0}
.side-nav>li>a,.side-subnav>li>a{display:flex;align-items:center;gap:.5rem;padding:.55rem .9rem;border-radius:.375rem;color:var(--text);text-decoration:none}
.side-nav>li>a:hover,.side-subnav>li>a:hover{background:rgba(13,110,253,.1);color:var(--primary)}
.side-nav>li>a.active,.side-subnav>li>a.active{background:var(--primary);color:#fff}
.side-nav i{width:1.1rem}
.side-group{padding:.2rem .6rem}
.side-group-label{font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:.6rem .3rem}
.side-subnav{list-style:none;margin:.25rem 0 0 .2rem;padding:0}
.card{background:var(--bg-panel);border:1px solid var(--border)}
.table thead th{white-space:nowrap}
.kpi-card{border-left:.3rem solid var(--primary)}