:root{ --app-bg:#f5f7fb; --panel:#fff; --panel-2:#fff; --border:rgba(20,33,61,.10); --muted-2:rgba(20,33,61,.58); --card:#fff; --shadow:0 18px 40px rgba(16,24,40,.10); --radius:16px; --text:#0f172a; }
    [data-bs-theme="dark"]{ --app-bg:#0b1220; --panel:#0f1b33; --panel-2:#0c172d; --border:rgba(255,255,255,.10); --muted-2:rgba(255,255,255,.60); --card:rgba(255,255,255,.06); --shadow:0 20px 60px rgba(0,0,0,.35); --text:#e8eefc; }
    body{ background:var(--app-bg); color:var(--text); }
    .app{ display:flex; min-height:100vh; }
    .sidebar{ width:280px; background:linear-gradient(180deg,var(--panel) 0%, var(--panel-2) 100%); border-right:1px solid var(--border); position:sticky; top:0; height:100vh; padding:18px; display:none; }
    @media (min-width:992px){ .sidebar{ display:flex; flex-direction:column; } }
    .content{ flex:1; }
    .topbar{ position:sticky; top:0; z-index:1020; background: color-mix(in srgb, var(--app-bg) 85%, transparent); backdrop-filter: blur(10px); border-bottom:1px solid var(--border); }
    .topbar-inner{ padding:14px 16px; } @media (min-width:992px){ .topbar-inner{ padding:14px 24px; } }
    .glass{ background:var(--card); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); }
    .brand{ display:flex; align-items:center; gap:10px; padding:10px 10px 14px; }
    .brand-mark{ width:42px; height:42px; border-radius:14px; display:grid; place-items:center; background: color-mix(in srgb, var(--text) 7%, transparent); border:1px solid var(--border); color:var(--text); }
    .nav-link{ color: color-mix(in srgb, var(--text) 78%, transparent); border-radius:12px; padding:10px 12px; display:flex; align-items:center; gap:10px; }
    .nav-link:hover{ background: color-mix(in srgb, var(--text) 6%, transparent); color:var(--text); }
    .nav-link.active{ background: color-mix(in srgb, var(--bs-primary) 16%, transparent); border:1px solid color-mix(in srgb, var(--bs-primary) 22%, transparent); color:var(--text); }
    .nav-section-title{ font-size:.75rem; color:var(--muted-2); text-transform:uppercase; letter-spacing:.08em; padding:14px 10px 8px; }
    .text-muted-3{ color:var(--muted-2)!important; }
    .btn,.form-control,.form-select{ border-radius:12px; }
    .table thead th{ border-bottom:1px solid var(--border); white-space:nowrap; }
    .table td{ border-top:1px solid var(--border); vertical-align:middle; }
      .sidebar{overflow:hidden;}
    .sidebar-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding-right:6px;margin-right:-6px;}
    .brand-mark{width:40px;height:40px;border-radius:12px;background:color-mix(in srgb, var(--app-bg) 85%, var(--panel));border:1px solid color-mix(in srgb, var(--text) 16%, transparent);}
      .profile-icon-btn{
      border:0 !important;
      background:transparent !important;
      color: color-mix(in srgb, var(--text, #334155) 90%, transparent) !important;
      padding:.2rem .35rem;
      line-height:1;
    }
    .profile-icon-btn:hover,
    .profile-icon-btn:focus,
    .profile-icon-btn:active{
      border:0 !important;
      background:transparent !important;
      box-shadow:none !important;
      color: color-mix(in srgb, var(--text, #334155) 90%, transparent) !important;
    }
    .profile-icon-btn::after{ display:none !important; }
    .profile-icon-btn i{ font-size:1.25rem; }
      .theme-icon-btn{
      border:0 !important;
      background:transparent !important;
      color: color-mix(in srgb, var(--text, #334155) 90%, transparent) !important;
      padding:.2rem .35rem;
      line-height:1;
    }
    .theme-icon-btn:hover,
    .theme-icon-btn:focus,
    .theme-icon-btn:active{
      border:0 !important;
      background:transparent !important;
      box-shadow:none !important;
      color: color-mix(in srgb, var(--text, #334155) 90%, transparent) !important;
    }
    .theme-icon-btn i{ font-size:1.25rem; }