:root{
  --panel-bg:#07101d;
  --panel-bg-soft:#0a1728;
  --panel-card:rgba(12,26,44,.76);
  --panel-card-strong:rgba(10,22,38,.94);
  --panel-line:rgba(148,183,218,.14);
  --panel-line-strong:rgba(94,234,212,.26);
  --panel-text:#edf7ff;
  --panel-muted:#91a7bd;
  --panel-accent:#5eead4;
  --panel-blue:#60a5fa;
  --panel-danger:#fb7185;
  --panel-warning:#fbbf24;
  --panel-success:#4ade80;
  --panel-radius:20px;
}

html{scroll-behavior:smooth}
body{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:
    radial-gradient(circle at 8% -10%,rgba(45,212,191,.18),transparent 34%),
    radial-gradient(circle at 96% 5%,rgba(59,130,246,.16),transparent 32%),
    linear-gradient(160deg,#050a12 0%,#07111e 44%,#091828 100%) !important;
  color:var(--panel-text);
  letter-spacing:-.006em;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.28;
  background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:linear-gradient(to bottom,black,transparent 78%);
}

.topbar{
  background:rgba(4,10,18,.82) !important;
  border-bottom:1px solid var(--panel-line) !important;
  box-shadow:0 10px 36px rgba(0,0,0,.18);
}
.topbar .brand-mark{
  width:34px;height:34px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,rgba(94,234,212,.2),rgba(96,165,250,.18));
  border:1px solid rgba(94,234,212,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 22px rgba(0,0,0,.24);
}
.app-version{
  display:inline-flex;align-items:center;padding:3px 8px;border-radius:999px;
  background:rgba(96,165,250,.1);border:1px solid rgba(96,165,250,.2);
  color:#bddcff;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
}

.glass,.glass-soft{
  background:linear-gradient(145deg,rgba(14,29,48,.86),rgba(8,20,35,.74)) !important;
  border:1px solid var(--panel-line) !important;
  box-shadow:0 18px 50px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.035) !important;
}
.glass{border-radius:var(--panel-radius) !important}
.glass-soft{border-radius:18px !important}

.sidebar{
  width:auto !important;
  margin-top:16px;
  height:calc(100vh - 98px) !important;
  background:rgba(7,16,29,.72) !important;
  scrollbar-width:thin;
}
.sidebar .section{
  color:#6f879f !important;
  font-weight:800;
  letter-spacing:.14em !important;
}
.sidebar a.item{
  min-height:44px;
  background:transparent !important;
  border-color:transparent !important;
  color:#aebfd1 !important;
}
.sidebar a.item:hover,.sidebar a.item.active{
  color:#f5fbff !important;
  background:linear-gradient(90deg,rgba(94,234,212,.12),rgba(96,165,250,.08)) !important;
  border-color:rgba(94,234,212,.16) !important;
}
.sidebar a.item.active{box-shadow:inset 3px 0 0 var(--panel-accent)}
.sidebar .pill{
  background:rgba(255,255,255,.04) !important;
  border-color:rgba(255,255,255,.08) !important;
  color:#758ca3 !important;
}
.sidebar a.item.active .pill,.sidebar a.item:hover .pill{color:#b9fff4 !important;border-color:rgba(94,234,212,.16) !important}

.page-heading{
  display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;
  padding:8px 2px;
}
.page-heading h1,.page-heading h2,.page-heading h3{font-weight:760;letter-spacing:-.035em}
.eyebrow{
  display:inline-flex;align-items:center;gap:7px;margin-bottom:8px;
  color:#86a7c6;font-size:11px;font-weight:800;letter-spacing:.14em;
}
.pill-soft{
  display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:999px;
  color:#a9bfd3;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);font-size:11px;
}
.metric-card{
  position:relative;overflow:hidden;min-height:118px;
}
.metric-card::after{
  content:"";position:absolute;width:110px;height:110px;border-radius:50%;right:-44px;top:-52px;
  background:radial-gradient(circle,rgba(94,234,212,.16),transparent 65%);
}
.metric-value{font-size:30px;font-weight:780;letter-spacing:-.05em;line-height:1}
.metric-label{color:var(--panel-muted);font-size:12px;margin-top:8px}
.metric-icon{
  width:40px;height:40px;border-radius:13px;display:grid;place-items:center;
  background:rgba(94,234,212,.1);border:1px solid rgba(94,234,212,.18);color:#8ff7e6;
}

.btn-soft,.chip,.chip-btn,.ap-chip{
  border-radius:12px !important;
  transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease !important;
}
.btn-soft:hover,.chip:hover,.chip-btn:hover,.ap-chip:hover{box-shadow:0 10px 28px rgba(0,0,0,.2)}
.form-control,.form-select{
  background:rgba(5,13,23,.72) !important;
  border-color:rgba(148,183,218,.14) !important;
  color:var(--panel-text) !important;
  border-radius:12px !important;
}
.form-control:focus,.form-select:focus{
  border-color:rgba(94,234,212,.42) !important;
  box-shadow:0 0 0 4px rgba(94,234,212,.08) !important;
}
.table>:not(caption)>*>*{border-bottom-color:rgba(255,255,255,.07) !important}
.table tbody tr{transition:background .14s ease}
.table tbody tr:hover{background:rgba(94,234,212,.035)}

.menu-card{
  min-height:190px;
  background:linear-gradient(150deg,rgba(13,29,48,.92),rgba(8,20,34,.78)) !important;
}
.menu-card .folder-icon{
  width:44px;height:44px;display:grid;place-items:center;border-radius:14px;
  color:#82e9dc;background:rgba(94,234,212,.09);border:1px solid rgba(94,234,212,.16);
}
.menu-card:hover{transform:translateY(-3px) !important;box-shadow:0 24px 54px rgba(0,0,0,.3) !important}
.dashboard-search{
  position:relative;min-width:min(100%,330px);
}
.dashboard-search i{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#718ba4}
.dashboard-search input{padding-left:41px !important}
.empty-state{padding:48px 24px;text-align:center}
.empty-state .empty-icon{font-size:38px;color:#6d879e}

.codeview{
  background:#06101c !important;
  border-color:rgba(148,183,218,.14) !important;
  line-height:1.65;
}

.offcanvas{background:#07111f !important}
.offcanvas .item{
  display:flex;align-items:center;justify-content:space-between;text-decoration:none;color:#b7c7d7;
  padding:11px 12px;border-radius:12px;border:1px solid transparent;
}
.offcanvas .item:hover,.offcanvas .item.active{background:rgba(94,234,212,.08);border-color:rgba(94,234,212,.14);color:#fff}
.offcanvas .section{font-size:11px;letter-spacing:.13em;color:#71879d;text-transform:uppercase;margin:18px 6px 8px}

.footer-credit{background:rgba(7,16,29,.88) !important;border-color:var(--panel-line) !important}
.muted{color:var(--panel-muted) !important}

@media(max-width:991px){
  .sidebar{height:calc(100vh - 92px) !important}
}
@media(max-width:767px){
  main.py-4{padding-top:18px !important}
  .page-heading{align-items:flex-start}
  .metric-value{font-size:26px}
  .menu-card{min-height:170px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}