:root{
    --bb-bg:#f6f7fb;
    --bb-surface:#ffffff;
    --bb-surface-2:#f3f4f6;
  
    --bb-text:#0f172a;
    --bb-muted:rgba(15,23,42,.65);
    --bb-border:rgba(15,23,42,.10);
  
    --bb-primary:#4f46e5;
    --bb-primary-2:#6366f1;
  
    --bb-success:#16a34a;
    --bb-danger:#dc2626;
    --bb-warning:#f59e0b;
  
    --bb-radius:18px;
    --bb-radius-sm:14px;
  
    --bb-shadow-sm:0 8px 24px rgba(2,6,23,.06);
    --bb-shadow:0 16px 45px rgba(2,6,23,.08);
  
    --bb-glass:rgba(255,255,255,.70);
    --bb-glass-soft:rgba(255,255,255,.55);
    --bb-glass-border:rgba(15,23,42,.10);
  
    --bb-topbar-h:70px;
    --bb-sidebar-w:280px;
  }
  
  html[data-theme="dark"]{
    color-scheme:dark;
  
    --bb-bg:#070b14;
    --bb-surface:rgba(18,22,33,.75);
    --bb-surface-2:rgba(18,22,33,.55);
  
    --bb-text:rgba(255,255,255,.92);
    --bb-muted:rgba(255,255,255,.72);
    --bb-border:rgba(148,163,184,.18);
  
    --bb-primary:#7c3aed;
    --bb-primary-2:#6366f1;
  
    --bb-glass:rgba(18,22,33,.55);
    --bb-glass-soft:rgba(18,22,33,.45);
    --bb-glass-border:rgba(148,163,184,.16);
  
    --bb-shadow-sm:0 12px 35px rgba(0,0,0,.35);
    --bb-shadow:0 25px 65px rgba(0,0,0,.45);
  }
  
  body{
    background:var(--bb-bg);
    color:var(--bb-text);
    -webkit-font-smoothing:antialiased;
  }
  
  .bb-body{
    background:
      radial-gradient(1100px 700px at 20% 0%, rgba(99,102,241,.10), transparent 55%),
      radial-gradient(900px 600px at 90% 10%, rgba(79,70,229,.08), transparent 55%),
      var(--bb-bg);
  }
  
  .bb-glass{
    background:var(--bb-glass);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    border:1px solid var(--bb-glass-border);
    box-shadow:var(--bb-shadow-sm);
  }
  
  .bb-glass-soft{
    background:var(--bb-glass-soft);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    border:1px solid var(--bb-glass-border);
  }
  
  .bb-topbar{
    height:var(--bb-topbar-h);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    background:var(--bb-glass);
    border-bottom:1px solid var(--bb-glass-border);
    display:flex;
    align-items:center;
  }
  
  .bb-navbar{
    min-height:var(--bb-topbar-h);
  }
  
  .bb-brand{
    text-decoration:none;
    color:var(--bb-text);
    font-weight:800;
    letter-spacing:-.02em;
  }
  
  .bb-logo{
    width:38px;
    height:38px;
    border-radius:14px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(135deg, rgba(79,70,229,.15), rgba(99,102,241,.12));
    border:1px solid rgba(79,70,229,.18);
    color:var(--bb-text);
  }
  
  html[data-theme="dark"] .bb-logo{
    color:#fff;
  }
  
  .bb-shell{
    display:grid;
    grid-template-columns:var(--bb-sidebar-w) 1fr;
    min-height:calc(100vh - var(--bb-topbar-h));
  }
  
  @media (max-width: 991.98px){
    .bb-shell{ grid-template-columns:1fr; }
  }
  
  .bb-sidebar{
    position:sticky;
    top:var(--bb-topbar-h);
    height:calc(100vh - var(--bb-topbar-h));
    background:var(--bb-glass-soft);
    border-right:1px solid var(--bb-glass-border);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }
  
  .bb-sidebar-inner{
    padding:20px;
    display:flex;
    flex-direction:column;
    gap:16px;
  }
  
  .bb-sidebar-title{
    font-size:.75rem;
    text-transform:uppercase;
    letter-spacing:.14em;
    color:var(--bb-muted);
  }
  
  .bb-nav-link{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px;
    border-radius:16px;
    text-decoration:none;
    color:var(--bb-text);
    border:1px solid transparent;
    transition:all .15s ease;
  }
  
  .bb-nav-link:hover{
    background:rgba(79,70,229,.10);
    border-color:rgba(79,70,229,.20);
    transform:translateY(-2px);
  }
  
  .bb-footer{
    border-top:1px solid var(--bb-glass-border);
    background:var(--bb-glass-soft);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }
  
  .bb-btn{
    border-radius:14px;
    padding:.65rem 1rem;
    font-weight:600;
    letter-spacing:-.01em;
    transition:all .15s ease;
  }
  
  .bb-btn:active{
    transform:translateY(1px);
  }
  
  .bb-btn-primary{
    color:#fff;
    border:1px solid rgba(79,70,229,.25);
    background:linear-gradient(135deg, var(--bb-primary), var(--bb-primary-2));
    box-shadow:0 14px 30px rgba(79,70,229,.18);
  }
  
  .bb-btn-primary:hover{
    filter:brightness(1.05);
    box-shadow:0 18px 38px rgba(79,70,229,.25);
  }
  
  .bb-btn-ghost{
    background:var(--bb-surface-2);
    border:1px solid var(--bb-border);
    color:var(--bb-text);
  }
  
  .bb-btn-ghost:hover{
    background:var(--bb-surface);
    box-shadow:var(--bb-shadow-sm);
  }
  
  .bb-icon-btn{
    width:42px;
    height:42px;
    border-radius:14px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:var(--bb-surface-2);
    border:1px solid var(--bb-border);
    transition:all .15s ease;
    color:var(--bb-text);
  }
  
  .bb-icon-btn i{
    color:currentColor;
  }
  
  .bb-icon-btn:hover{
    background:var(--bb-surface);
    box-shadow:var(--bb-shadow-sm);
  }
  
  .card{
    background:var(--bb-surface);
    border:1px solid var(--bb-border) !important;
    border-radius:var(--bb-radius) !important;
    box-shadow:var(--bb-shadow-sm);
    transition:all .18s ease;
  }
  
  .card:hover{
    box-shadow:var(--bb-shadow);
  }
  
  .card-header{
    background:transparent;
    border-bottom:1px solid var(--bb-border);
  }
  
  .form-control,
  .form-select{
    border-radius:14px;
    border:1px solid var(--bb-border);
    background:var(--bb-surface-2);
    color:var(--bb-text);
    transition:all .15s ease;
  }
  
  .form-control::placeholder{
    color:var(--bb-muted);
    opacity:1;
  }
  
  html[data-theme="dark"] .form-control::placeholder{
    color:rgba(229,231,235,.52);
  }
  
  .form-control:focus,
  .form-select:focus{
    border-color:rgba(79,70,229,.45);
    box-shadow:0 0 0 .25rem rgba(79,70,229,.15);
    background:var(--bb-surface);
    color:var(--bb-text);
  }
  
  .input-group-text{
    border-radius:14px;
    border:1px solid var(--bb-border);
    background:var(--bb-surface-2);
    color:var(--bb-muted);
  }
  
  .table{
    --bs-table-bg:transparent;
    color:var(--bb-text);
  }
  
  .table thead th{
    font-size:.78rem;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:var(--bb-muted);
    border-bottom:1px solid var(--bb-border);
  }
  
  .table tbody td,
  .table tbody th{
    border-color:var(--bb-border);
  }
  
  .badge{
    border-radius:999px;
  }
  
  html[data-theme="dark"] .text-dark{
    color:var(--bb-text) !important;
  }
  
  html[data-theme="dark"] .text-muted{
    color:var(--bb-muted) !important;
  }
  
  html[data-theme="dark"] .bg-white,
  html[data-theme="dark"] .bg-light,
  html[data-theme="dark"] .bg-body-tertiary{
    background:var(--bb-surface-2) !important;
  }
  
  html[data-theme="dark"] .border,
  html[data-theme="dark"] .border-top,
  html[data-theme="dark"] .border-bottom,
  html[data-theme="dark"] .border-start,
  html[data-theme="dark"] .border-end{
    border-color:var(--bb-border) !important;
  }
  
  html[data-theme="dark"] .dropdown-menu{
    background:var(--bb-surface);
    border:1px solid var(--bb-border);
  }
  
  html[data-theme="dark"] .dropdown-item{
    color:var(--bb-text);
  }
  
  html[data-theme="dark"] .dropdown-item:hover{
    background:rgba(124,58,237,.15);
    color:#fff;
  }
  
  .bb-search{
    position:relative;
    width:min(640px, 100%);
  }
  
  .bb-search i{
    position:absolute;
    left:14px;
    top:50%;
    transform:translateY(-50%);
    color:var(--bb-muted);
  }
  
  .bb-search-input{
    padding-left:40px;
    padding-right:72px;
    height:44px;
    border-radius:999px;
    border:1px solid var(--bb-border);
    background:var(--bb-surface-2);
    box-shadow:0 6px 16px rgba(2,6,23,.04);
  }
  
  .bb-search-input:focus{
    border-color:rgba(79,70,229,.45);
    box-shadow:0 0 0 .25rem rgba(79,70,229,.14);
    background:var(--bb-surface);
  }
  
  .bb-kbd{
    position:absolute;
    right:10px;
    top:50%;
    transform:translateY(-50%);
    font-size:.75rem;
    color:var(--bb-muted);
    border:1px solid var(--bb-border);
    background:var(--bb-surface);
    border-radius:10px;
    padding:4px 8px;
  }
  
  .bb-badge-soft{
    background:rgba(79,70,229,.10);
    color:var(--bb-primary);
    border:1px solid rgba(79,70,229,.20);
    font-weight:600;
  }
  
  .bb-filter-active{
    border-color:rgba(79,70,229,.40) !important;
    box-shadow:0 0 0 .25rem rgba(79,70,229,.12);
  }
  
  .bb-sticky{
    position:sticky;
    top:calc(var(--bb-topbar-h) + 18px);
  }
  
  .bb-qcard{
    border:1px solid var(--bb-border);
    border-radius:var(--bb-radius);
    background:var(--bb-surface);
    box-shadow:var(--bb-shadow-sm);
    overflow:hidden;
  }
  
  .bb-qhead{
    padding:16px 16px 12px;
    border-bottom:1px solid var(--bb-border);
    background:var(--bb-surface);
  }
  
  .bb-qmeta{
    font-size:.78rem;
    letter-spacing:.02em;
    color:var(--bb-muted);
  }
  
  .bb-qnum{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:26px;
    height:26px;
    border-radius:10px;
    background:rgba(79,70,229,.12);
    color:var(--bb-primary);
    border:1px solid rgba(79,70,229,.18);
    font-weight:800;
  }
  
  .bb-dot{
    opacity:.65;
    padding:0 6px;
  }
  
  .bb-qbody{
    padding:14px 16px 16px;
  }
  
  .bb-option{
    cursor:pointer;
    user-select:none;
    display:block;
  }
  
  .bb-option-input{
    position:absolute;
    opacity:0;
    pointer-events:none;
  }
  
  .bb-option-ui{
    display:flex;
    gap:12px;
    padding:14px;
    border-radius:18px;
    border:1px solid var(--bb-border);
    background:var(--bb-surface-2);
    transition:transform .12s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease;
    height:100%;
  }
  
  .bb-option:hover .bb-option-ui{
    transform:translateY(-1px);
    box-shadow:var(--bb-shadow-sm);
    background:var(--bb-surface);
  }
  
  .bb-option-key{
    width:40px;
    height:40px;
    border-radius:16px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:900;
    color:var(--bb-text);
    border:1px solid var(--bb-border);
    background:rgba(15,23,42,.04);
    flex:0 0 auto;
  }
  
  html[data-theme="dark"] .bb-option-key{
    background:rgba(255,255,255,.06);
  }
  
  .bb-option-label{
    font-size:.78rem;
    text-transform:uppercase;
    letter-spacing:.10em;
    color:var(--bb-muted);
    display:block;
  }
  
  .bb-option-val{
    display:block;
    margin-top:3px;
    line-height:1.25rem;
  }
  
  .bb-option-input:checked + .bb-option-ui{
    border-color:rgba(79,70,229,.45);
    background:rgba(79,70,229,.10);
    box-shadow:0 14px 30px rgba(79,70,229,.18);
  }
  
  .bb-option-input:checked + .bb-option-ui .bb-option-key{
    background:linear-gradient(135deg, var(--bb-primary), var(--bb-primary-2));
    color:#fff;
    border-color:rgba(79,70,229,.45);
  }
  
  .bb-bottom-bar{
    position:sticky;
    bottom:0;
    margin-top:18px;
    padding:14px 0 0;
    background:linear-gradient(180deg, rgba(246,247,251,0), rgba(246,247,251,.88) 30%, rgba(246,247,251,.98));
    border-top:1px solid var(--bb-border);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }
  
  html[data-theme="dark"] .bb-bottom-bar{
    background:linear-gradient(180deg, rgba(7,11,20,0), rgba(7,11,20,.70) 28%, rgba(7,11,20,.92));
  }
  
  .bb-navq{
    width:44px;
    height:40px;
    border-radius:14px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    border:1px solid var(--bb-border);
    background:var(--bb-surface-2);
    color:var(--bb-text);
    font-weight:700;
    transition:transform .12s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease;
  }
  
  .bb-navq:hover{
    transform:translateY(-1px);
    box-shadow:var(--bb-shadow-sm);
    background:var(--bb-surface);
  }
  
  .bb-navq.answered{
    border-color:rgba(22,163,74,.35);
    background:rgba(22,163,74,.10);
    color:var(--bb-success);
  }
  
  .bb-navq.flagged{
    border-color:rgba(245,158,11,.40);
    background:rgba(245,158,11,.14);
    color:#b45309;
  }
  
  html[data-theme="dark"] .bb-navq.flagged{
    color:#fbbf24;
  }
  
  .bb-navq.active{
    border-color:rgba(79,70,229,.50);
    box-shadow:0 0 0 .25rem rgba(79,70,229,.12);
  }
  
  .bb-flag.active{
    border-color:rgba(245,158,11,.40) !important;
    box-shadow:0 0 0 .25rem rgba(245,158,11,.12);
  }
  
  .question-block:target{
    outline:2px solid rgba(79,70,229,.35);
    outline-offset:6px;
    border-radius:18px;
  }
  
  #autosaveToast{
    border-radius:16px;
    background:#0b1220;
    color:#fff;
    box-shadow:0 18px 40px rgba(2,6,23,.28);
  }
  
  .bb-ring{
    width:110px;
    height:110px;
    border-radius:999px;
    background:conic-gradient(var(--bb-primary) calc(var(--p) * 1%), rgba(15,23,42,.10) 0);
    display:grid;
    place-items:center;
    box-shadow:var(--bb-shadow-sm);
    border:1px solid var(--bb-border);
  }
  
  html[data-theme="dark"] .bb-ring{
    background:conic-gradient(var(--bb-primary) calc(var(--p) * 1%), rgba(255,255,255,.10) 0);
  }
  
  .bb-ring-in{
    width:86px;
    height:86px;
    border-radius:999px;
    background:var(--bb-surface);
    display:grid;
    place-items:center;
    text-align:center;
    border:1px solid var(--bb-border);
  }
  
  .bb-loading{
    position:fixed;
    inset:0;
    background:rgba(2,6,23,.55);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    z-index:1090;
    display:grid;
    place-items:center;
    padding:24px;
  }
  
  .bb-loading-card{
    width:min(420px, 100%);
    background:#0b1220;
    color:#fff;
    border-radius:18px;
    border:1px solid rgba(148,163,184,.18);
    box-shadow:0 22px 55px rgba(2,6,23,.45);
    padding:22px;
    text-align:center;
  }
  
  .analysis-box{
    white-space:pre-wrap;
    background:#0b1220;
    color:#e5e7eb;
    padding:16px;
    border-radius:var(--bb-radius);
    border:1px solid rgba(148,163,184,.18);
    box-shadow:0 12px 26px rgba(2,6,23,.22);
    font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size:.95rem;
  }
  
  .progress{
    border-radius:999px;
    overflow:hidden;
  }
  
  .progress-bar{
    width:calc(var(--p) * 1%);
  }
  
  .accordion-button{
    background:var(--bb-surface);
    color:var(--bb-text);
  }
  
  .accordion-button:focus{
    box-shadow:0 0 0 .25rem rgba(79,70,229,.12);
  }
  
  .accordion-button:not(.collapsed){
    background:var(--bb-surface);
    color:var(--bb-text);
  }
  
  html[data-theme="dark"] .accordion-body{
    background:rgba(18,22,33,.35);
  }
  
  html[data-theme="dark"] .accordion-button::after{
    filter:invert(1) opacity(.85);
  }
  
  .bb-panel{
    background:var(--bb-surface);
    border:1px solid var(--bb-border);
    box-shadow:var(--bb-shadow-sm);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }
  
  html[data-theme="dark"] .bb-panel{
    background:linear-gradient(180deg, rgba(18,22,33,.78), rgba(18,22,33,.65));
    border:1px solid rgba(148,163,184,.22);
    box-shadow:var(--bb-shadow);
  }
  
  html[data-theme="dark"] .bb-panel .form-control,
  html[data-theme="dark"] .bb-panel .form-select{
    background:rgba(10,14,24,.85);
    border-color:rgba(148,163,184,.25);
    color:#f3f4f6;
  }
  
  html[data-theme="dark"] .bb-panel .form-control::placeholder{
    color:rgba(229,231,235,.45);
  }
  
  html[data-theme="dark"] .bb-panel .text-muted{
    color:rgba(229,231,235,.55) !important;
  }
  
  html[data-theme="dark"] .bb-panel .form-text{
    color:rgba(255,255,255,.62) !important;
  }
  
  html[data-theme="dark"] .bb-panel .bb-btn-ghost{
    background:rgba(18,22,33,.55);
    border-color:rgba(148,163,184,.25);
  }
  
  html[data-theme="dark"] h1,
  html[data-theme="dark"] h2,
  html[data-theme="dark"] h3,
  html[data-theme="dark"] h4,
  html[data-theme="dark"] h5,
  html[data-theme="dark"] h6{
    color:rgba(255,255,255,.92) !important;
  }
  
  html[data-theme="dark"] .bb-hero-title{
    color:rgba(255,255,255,.96) !important;
  }
  
  html[data-theme="dark"] h1.display-6{
    color:rgba(255,255,255,.96) !important;
  }
  
  html[data-theme="dark"] .bb-soft-muted{
    color:rgba(255,255,255,.72) !important;
  }
  
  html[data-theme="dark"] .bb-panel > .d-flex .fw-semibold{
    color:rgba(255,255,255,.95) !important;
  }
  
  .bb-ig .bb-ig-icon{
    border-radius:14px 0 0 14px;
    border:1px solid var(--bb-border);
    background:var(--bb-surface-2);
    color:var(--bb-muted);
  }
  
  .bb-ig .bb-ig-input{
    border-radius:0 14px 14px 0;
  }
  
  html[data-theme="dark"] .bb-ig .bb-ig-icon{
    background:rgba(10,14,24,.85);
    border-color:rgba(148,163,184,.25);
    color:rgba(255,255,255,.70);
  }
  
  html[data-theme="dark"] .bb-ig .bb-ig-input{
    background:rgba(10,14,24,.85);
    border-color:rgba(148,163,184,.25);
    color:rgba(255,255,255,.92);
  }
  
  html[data-theme="dark"] .bb-ig .bb-ig-input::placeholder{
    color:rgba(255,255,255,.45);
  }
  
  .bb-stat-card{
    border:1px solid var(--bb-border);
    background:var(--bb-surface);
    box-shadow:var(--bb-shadow-sm);
    transition:all .18s ease;
  }
  
  .bb-stat-card:hover{
    transform:translateY(-3px);
    box-shadow:var(--bb-shadow);
  }
  
  html[data-theme="dark"] .bb-stat-card{
    background:rgba(18,22,33,.65);
    border-color:rgba(148,163,184,.18);
  }
  
  html[data-theme="dark"] .bb-stat-card .text-muted{
    color:rgba(255,255,255,.65) !important;
  }
  
  .bb-strong-muted{ color:#000; }
  html[data-theme="dark"] .bb-strong-muted{ color:#fff; }
  
  .bb-preview-card{
    background: var(--bb-surface);
    color: var(--bb-text);
    border: 1px solid var(--bb-border) !important;
  }
  
  html[data-theme="dark"] .bb-preview-card{
    background: rgba(10,14,24,.85);
    color: #fff;
    border-color: rgba(148,163,184,.18) !important;
  }
  
  .bb-preview-muted{
    color: rgba(15,23,42,.72);
  }
  
  html[data-theme="dark"] .bb-preview-muted{
    color: rgba(255,255,255,.75);
  }
  
  .bb-preview-badge{
    background: var(--bb-surface);
    color: var(--bb-text);
    border: 1px solid var(--bb-border);
  }
  
  html[data-theme="dark"] .bb-preview-badge{
    background: rgba(255,255,255,.10);
    color: #fff;
    border-color: rgba(255,255,255,.18);
  }
  
  .bb-preview-logo{
    background: rgba(15,23,42,.06);
    border-color: var(--bb-border);
    box-shadow: none;
  }
  
  .bb-preview-logo i{
    color: var(--bb-text);
  }
  
  html[data-theme="dark"] .bb-preview-logo{
    background: rgba(255,255,255,.10);
    border-color: rgba(255,255,255,.18);
  }
  
  html[data-theme="dark"] .bb-preview-logo i{
    color:#fff;
  }
  
  .bb-preview-step{
    border: 1px solid var(--bb-border);
    background: var(--bb-surface-2);
  }
  
  html[data-theme="dark"] .bb-preview-step{
    border-color: rgba(255,255,255,.18);
    background: rgba(255,255,255,.06);
  }
  
  html[data-theme="dark"] .bb-stat-card .fw-bold{
    color:#fff !important;
  }
  
  html[data-theme="dark"] .bb-panel .form-label,
  html[data-theme="dark"] .bb-panel .fw-semibold{
    color:#fff !important;
  }
  
  .bb-soft-box{
    background: var(--bb-surface-2);
    border: 1px solid var(--bb-border);
    border-radius: 18px;
    color: var(--bb-text);
  }
  
  .bb-soft-box .text-muted{
    color: var(--bb-muted) !important;
  }
  
  .bb-step{
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid var(--bb-border);
    background: var(--bb-surface-2);
    color: var(--bb-text);
  }
  
  .bb-step:hover{
    background: var(--bb-surface);
    box-shadow: var(--bb-shadow-sm);
  }
  
  .bb-icon-muted{
    color: var(--bb-muted) !important;
  }
  
  html[data-theme="dark"] .text-bg-light{
    background: rgba(255,255,255,.10) !important;
    color: rgba(255,255,255,.92) !important;
    border-color: rgba(255,255,255,.16) !important;
  }
  
  html[data-theme="dark"] .modal-content{
    background: var(--bb-surface);
    color: var(--bb-text);
    border-color: var(--bb-border);
  }
  
  html[data-theme="dark"] .modal-header,
  html[data-theme="dark"] .modal-footer{
    border-color: var(--bb-border) !important;
  }
  
  html[data-theme="dark"] .btn-close{
    filter: invert(1) opacity(.85);
  }
  
  @media (prefers-reduced-motion: no-preference){
    html, body, .card, .bb-topbar, .bb-sidebar, .bb-footer,
    .bb-btn, .bb-icon-btn, .form-control, .form-select, .bb-search-input{
      transition:background .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
    }
  }
  html[data-theme="dark"] .card,
html[data-theme="dark"] .card-body{
  color: var(--bb-text);
}

html[data-theme="dark"] .card .fw-semibold,
html[data-theme="dark"] .card .fw-bold,
html[data-theme="dark"] .card .h1,
html[data-theme="dark"] .card .h2,
html[data-theme="dark"] .card .h3,
html[data-theme="dark"] .card .h4,
html[data-theme="dark"] .card .h5,
html[data-theme="dark"] .card .h6{
  color: var(--bb-text) !important;
}

html[data-theme="dark"] .bb-logo{
  color: var(--bb-text);
}

html[data-theme="dark"] .bb-step .fw-semibold{
  color: var(--bb-text) !important;
}
.bb-shell{
  display:grid;
  grid-template-columns:var(--bb-sidebar-w) 1fr;
  min-height:calc(100vh - var(--bb-topbar-h));
  transition:grid-template-columns .18s ease;
}

.bb-shell.bb-sidebar-collapsed{
  grid-template-columns:0 1fr;
}

.bb-sidebar{
  position:sticky;
  top:var(--bb-topbar-h);
  height:calc(100vh - var(--bb-topbar-h));
  background:var(--bb-glass-soft);
  border-right:1px solid var(--bb-glass-border);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  overflow:hidden;
  transition:width .18s ease, opacity .18s ease, transform .18s ease;
}

.bb-shell.bb-sidebar-collapsed .bb-sidebar{
  width:0;
  opacity:0;
  border-right:none;
  transform:translateX(-8px);
}

.bb-main{
  min-width:0;
}

@media (max-width: 991.98px){
  .bb-shell,
  .bb-shell.bb-sidebar-collapsed{
    grid-template-columns:1fr;
  }
}

