:root{--sb-w:240px;--brand:#2563eb;--sb-bg:#0f172a;--radius:.8rem}
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:.92rem;background:#f3f5f9}
[data-bs-theme=dark] body{background:#0b1120}
[data-bs-theme=dark] .card,[data-bs-theme=dark] .topbar{background:#111827;border-color:#1f2937}
.app{display:flex;min-height:100vh}
.sidebar{width:var(--sb-w);background:var(--sb-bg);color:#cbd5e1;position:fixed;inset:0 auto 0 0;display:flex;flex-direction:column;padding:1rem .8rem;z-index:1040;transition:transform .2s}
.brand{display:flex;gap:.65rem;align-items:center;color:#fff;padding:.2rem .4rem}
.logo{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,#3b82f6,#06b6d4);display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:1.1rem}
.brand-dark{display:flex;gap:.5rem;align-items:center}
.sidebar .nav-link{color:#cbd5e1;border-radius:.55rem;padding:.6rem .8rem;display:flex;gap:.7rem;align-items:center;margin-bottom:2px}
.sidebar .nav-link:hover{background:#1e293b;color:#fff}.sidebar .nav-link.active{background:var(--brand);color:#fff}
.sidebar-foot{margin-top:auto;padding:.5rem}
.main{flex:1;margin-left:var(--sb-w);min-width:0}
.topbar{position:sticky;top:0;z-index:1020;background:#fff;border-bottom:1px solid #e5e7eb;display:flex;align-items:center;gap:.6rem;padding:.6rem 1.25rem;height:58px}
.page-title{font-size:1.15rem;font-weight:700;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.content{padding:1.25rem}
.btn-icon{border:0;background:transparent;width:38px;height:38px;border-radius:.55rem;color:inherit}.btn-icon:hover{background:rgba(127,127,127,.12)}
.btn-user{border:0;display:flex;align-items:center;gap:.5rem}
.avatar{width:30px;height:30px;border-radius:50%;background:var(--brand);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:600;font-size:.85rem}
.card{border:1px solid #e5e7eb;border-radius:var(--radius);box-shadow:0 1px 2px rgba(16,24,40,.04)}
.card-header{background:transparent;font-weight:600;border-bottom:1px solid rgba(127,127,127,.15);padding:.75rem 1rem}
.backdrop{display:none}
@media (max-width:991.98px){.sidebar{transform:translateX(-100%)}.sidebar.open{transform:none}.main{margin-left:0}
 .backdrop.show{display:block;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:1030}.content{padding:.8rem}.topbar{padding:.5rem .8rem}}
/* KPI */
.kpi{padding:1rem 1.1rem;height:100%}.kpi .lbl{font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:var(--bs-secondary-color);font-weight:600}
.kpi .val{font-size:1.6rem;font-weight:700;line-height:1.2;margin-top:.25rem}.kpi .ico{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.1rem}
.kpi .delta{font-size:.75rem;font-weight:600}.up{color:#16a34a}.down{color:#dc2626}
.chart-box{position:relative;height:300px}.chart-box.tall{height:360px}
/* filter bar */
.filterbar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.ms-btn{border:1px solid var(--bs-border-color);background:var(--bs-body-bg);border-radius:.55rem;padding:.35rem .7rem;font-size:.85rem;display:inline-flex;gap:.35rem;align-items:center;max-width:240px}
.ms-btn .cnt{background:var(--brand);color:#fff;border-radius:10px;padding:0 .45rem;font-size:.72rem}
.ms-btn span.txt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-menu{width:300px;padding:.5rem}.ms-list{max-height:280px;overflow:auto}.ms-list label{display:flex;gap:.5rem;align-items:center;padding:.25rem .35rem;border-radius:.35rem;cursor:pointer;font-size:.85rem}
.ms-list label:hover{background:rgba(127,127,127,.1)}.ms-list .n{margin-left:auto;color:var(--bs-secondary-color);font-size:.75rem}
/* explorer */
.toolbar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.search-wrap{position:relative;flex:1 1 260px;max-width:420px}.search-wrap i{position:absolute;left:.7rem;top:50%;transform:translateY(-50%);color:var(--bs-secondary-color)}.search-wrap input{padding-left:2.1rem}
.chips{display:flex;flex-wrap:wrap;gap:.4rem}
.chip{display:inline-flex;align-items:center;gap:.35rem;background:rgba(37,99,235,.1);color:var(--brand);border:1px solid rgba(37,99,235,.25);border-radius:999px;padding:.2rem .35rem .2rem .7rem;font-size:.8rem;cursor:pointer;max-width:100%}
[data-bs-theme=dark] .chip{color:#93c5fd}
.chip b{font-weight:600}.chip .x{border:0;background:transparent;color:inherit;border-radius:50%;width:20px;height:20px;line-height:1;padding:0}.chip .x:hover{background:rgba(37,99,235,.2)}
.grid-wrap{overflow:auto;max-height:calc(100vh - 290px);min-height:300px;border-top:1px solid var(--bs-border-color)}
table.grid{font-size:.82rem;margin:0;border-collapse:separate;border-spacing:0;table-layout:fixed;min-width:100%}
table.grid th,table.grid td{padding:.4rem .6rem;border-bottom:1px solid var(--bs-border-color-translucent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
table.grid thead th{position:sticky;top:0;background:var(--bs-tertiary-bg);z-index:2;font-weight:600;cursor:pointer;user-select:none}
table.grid thead tr.hf th{top:33px;padding:.25rem .3rem;cursor:default}
table.grid thead tr.hf input{width:100%;min-width:0;font-size:.75rem;padding:.15rem .4rem;height:26px}
table.grid tfoot td{position:sticky;bottom:0;background:var(--bs-tertiary-bg);font-weight:700;z-index:2;border-top:2px solid var(--bs-border-color)}
table.grid td.num,table.grid th.num{text-align:right}
table.grid tbody tr:hover td{background:rgba(37,99,235,.05)}
.sort-ind{font-size:.7rem;margin-left:.25rem;color:var(--brand)}
.col-menu{width:280px;max-height:420px;overflow:auto}
.pager{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.loading{opacity:.55;transition:opacity .15s}
.login-body{min-height:100vh}.login-wrap{display:flex;min-height:100vh}
.login-art{flex:1;background:radial-gradient(circle at 20% 20%,#1e3a8a,#0f172a 60%);color:#fff;align-items:center;justify-content:center;padding:3rem}
.login-form{flex:1;display:flex;align-items:center;justify-content:center;padding:1.5rem}
@media (max-width:575.98px){.kpi{padding:.7rem .8rem}.kpi .val{font-size:1.25rem}.kpi .ico{width:30px;height:30px;font-size:.9rem}.chart-box{height:260px}.chart-box.tall{height:320px}.grid-wrap{max-height:calc(100vh - 250px)}}
table.grid tfoot td:first-child{overflow:visible;position:sticky;z-index:3}