/* ============================================================
   OBSIDIAN — Bear is Fair Design System
   Warm fintech · Elegant editorial aesthetic
   Inter · JetBrains Mono
   ============================================================ */

/* Google Fonts @import REMOVED — self-hosted via static/fonts/fonts.css (GDPR compliant) */

/* ── Tokens ──────────────────────────────────────────────────── */
:root {
  --bg:         #0F1117;
  --bg-surface: #13151C;
  --bg-card:    #171920;
  --bg-raised:  #1C1E27;
  --bg-overlay: #22242E;

  --border:     rgba(255,255,255,0.09);
  --border-mid: rgba(255,255,255,0.14);
  --border-hi:  rgba(255,255,255,0.22);

  --t1: #F0F0F2;
  --t2: #9DA1B2;
  --t3: #7D8299;
  --t-inv: #08090C;

  --accent:      #4F7EFF;
  --accent-dim:  rgba(79,126,255,0.12);
  --accent-glow: rgba(79,126,255,0.22);
  --accent-hi:   #6B95FF;

  --green:     #00C9A7;
  --green-dim: rgba(0,201,167,0.12);
  --red:       #FF4D6A;
  --red-dim:   rgba(255,77,106,0.12);
  --amber:     #F5A623;
  --amber-dim: rgba(245,166,35,0.12);

  --r-xs: 4px;  --r-sm: 8px;  --r: 12px;
  --r-lg: 16px; --r-xl: 20px;

  --sh-sm:     0 1px 3px rgba(0,0,0,0.6);
  --sh:        0 4px 20px rgba(0,0,0,0.5);
  --sh-lg:     0 16px 48px rgba(0,0,0,0.6);
  --sh-accent: 0 0 32px rgba(79,126,255,0.20);

  --nav-h:  56px;
  --tx:     150ms ease;
  --tx-mid: 220ms ease;

  --text-xs: 10px;
  --text-sm: 12px;
  --text-base: 13.5px;
  --text-md: 15px;
  --text-lg: 18px;
  --text-xl: 24px;
  --lh-tight: 1.15;
  --lh-normal: 1.5;
  --lh-relaxed: 1.7;
}

/* Light theme */
[data-theme="flatly"] {
  --bg:         #F5F6F8;
  --bg-surface: #FFFFFF;
  --bg-card:    #FFFFFF;
  --bg-raised:  #F0F1F5;
  --bg-overlay: #E8EAF0;
  --border:     rgba(0,0,0,0.08);
  --border-mid: rgba(0,0,0,0.12);
  --border-hi:  rgba(0,0,0,0.20);
  --t1: #0C0E14;
  --t2: #50556A;
  --t3: #6A7090;
  --t-inv: #FFFFFF;
  --sh-sm: 0 1px 3px rgba(0,0,0,0.08);
  --sh:    0 4px 20px rgba(0,0,0,0.10);
  --sh-lg: 0 16px 48px rgba(0,0,0,0.12);
  --sh-accent: 0 0 32px rgba(79,126,255,0.12);
}
/* Light: grain barely visible */
[data-theme="flatly"] body::before { opacity: 0.012; }
/* Light: btn-close should not be inverted */
[data-theme="flatly"] .btn-close { filter: opacity(0.5) !important; }
/* Light: scrollbar */
[data-theme="flatly"] ::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.15); }
/* Light: code blocks */
[data-theme="flatly"] code { background: #EDF0F7; border-color: rgba(0,0,0,0.08); }
[data-theme="flatly"] pre { background: #EDF0F7; border-color: rgba(0,0,0,0.08); }
/* Light: dropdown menus */
[data-theme="flatly"] .dropdown-menu { background: #FFFFFF; border-color: rgba(0,0,0,0.10); box-shadow: 0 8px 30px rgba(0,0,0,0.12); }
[data-theme="flatly"] .dropdown-item { color: var(--t2); }
[data-theme="flatly"] .dropdown-item:hover { background: var(--bg-raised); color: var(--t1); }
[data-theme="flatly"] .dropdown-divider { border-color: rgba(0,0,0,0.06); }
/* Light: auth glow subtler on white */
[data-theme="flatly"] .bif-auth-glow { background: radial-gradient(ellipse, rgba(79,126,255,0.06) 0%, transparent 70%); }
/* Light: ticker badge */
[data-theme="flatly"] .bif-ticker { background: #EDF0F7; border-color: rgba(0,0,0,0.08); }
/* Light: avatar */
[data-theme="flatly"] .bif-avatar { background: var(--accent-dim); color: var(--accent); }
/* Light: navbar */
[data-theme="flatly"] .bif-navbar { background: rgba(255,255,255,0.88) !important; }
/* Light: dropdown panels */
[data-theme="flatly"] .bif-dropdown { background: #FFFFFF; border-color: rgba(0,0,0,0.10); box-shadow: 0 8px 30px rgba(0,0,0,0.12); }
/* Light: mobile overlay */
[data-theme="flatly"] .bif-mobile-overlay { background: #FFFFFF; }

/* ── Keyboard Shortcuts Modal ─────────────────────────────── */
#bifShortcutsModal { display: none; }
#bifShortcutsModal.active { display: flex; }

kbd {
  display: inline-block;
  padding: 2px 6px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: var(--t1);
  background: var(--bg-raised);
  border: 1px solid var(--border-mid);
  border-radius: 4px;
  box-shadow: 0 1px 0 var(--border);
}

/* ── Base ────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body, body.bif-body {
  margin: 0;
  background: var(--bg) !important;
  color: var(--t1) !important;
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: 14px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  min-height: 100dvh;
}

/* Grain */
body::before {
  content: '';
  position: fixed; inset: 0; z-index: 0;
  pointer-events: none; opacity: 0.028;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E");
  background-size: 200px 200px;
}

/* Skeleton loading — defined once in the Skeleton loader section below */

/* ── Typography ─────────────────────────────────────────────── */
h1,h2,h3 {
  font-family: 'Inter', -apple-system, sans-serif;
  font-weight: 600; letter-spacing: -0.02em; color: var(--t1);
  line-height: 1.25;
}
h4,h5,h6 { font-family: 'Inter', -apple-system, sans-serif; font-weight: 600; color: var(--t1); }
p, .text-body-secondary, small, .small { color: var(--t2); }
a { color: var(--accent); text-decoration: none; transition: color var(--tx); }
a:hover { color: var(--t1); }
code, pre, .bif-mono, .bif-price, .bif-stat-value {
  font-family: 'JetBrains Mono', monospace;
}

/* ── Top Navigation Bar ─────────────────────────────────────── */
.bif-navbar {
  position: sticky;
  top: 0;
  z-index: 1030;
  height: var(--nav-h);
  background: rgba(15,17,23,0.88);
  border-bottom: 1px solid var(--border);
  backdrop-filter: blur(24px) saturate(1.6);
  -webkit-backdrop-filter: blur(24px) saturate(1.6);
}

.bif-navbar__inner {
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  height: 100%;
  padding: 0 1.25rem;
  gap: 0.25rem;
}

/* Brand */
.bif-navbar__brand {
  display: flex; align-items: center; gap: 10px;
  text-decoration: none; flex-shrink: 0; padding: 0; margin: 0;
  margin-right: 1rem;
}
.bif-brand {
  font-family: 'Source Serif 4', Georgia, serif; font-size: 1.05rem;
  font-weight: 600; color: var(--t1); letter-spacing: -0.01em;
}
.bif-brand em { font-style: italic; color: var(--accent); }

/* Center nav */
.bif-navbar__center {
  display: flex;
  align-items: center;
  gap: 0.125rem;
  flex: 1;
  justify-content: center;
}

/* Right section */
.bif-navbar__right {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-left: auto;
  flex-shrink: 0;
}

.bif-navbar__search {
  position: relative;
  width: 200px;
  flex-shrink: 0;
  z-index: 1050;
}

/* Hamburger button */
.bif-hamburger {
  display: flex; align-items: center; justify-content: center;
  width: 34px; height: 34px;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--r-sm); color: var(--t2);
  cursor: pointer; transition: all var(--tx);
  font-size: 18px; margin-right: 0.5rem;
}
.bif-hamburger:hover { border-color: var(--border-hi); color: var(--t1); }

/* Nav items */
.bif-nav-item {
  position: relative;
  padding: 0.5rem 0.625rem;
  cursor: pointer;
  border-radius: 6px;
  transition: all 0.15s;
  text-decoration: none;
  display: flex;
  align-items: center;
}
.bif-nav-item__label {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--t2);
  display: flex;
  align-items: center;
  white-space: nowrap;
  pointer-events: none;
}
.bif-nav-item:hover {
  background: var(--bg-raised);
}
.bif-nav-item:hover .bif-nav-item__label {
  color: var(--t1);
}
.bif-nav-item--locked {
  opacity: 0.5;
}
.bif-nav-item--locked:hover {
  opacity: 0.75;
}

/* ── Dropdown Panels ────────────────────────────────────────── */
.bif-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 50%;
  transform: translateX(-50%) translateY(-4px);
  background: var(--bg-overlay);
  border: 1px solid var(--border-mid);
  border-radius: 12px;
  padding: 0.5rem;
  box-shadow: 0 8px 32px rgba(0,0,0,0.35);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.15s, visibility 0.15s, transform 0.15s;
  min-width: 200px;
  z-index: 1040;
  pointer-events: none;
}

/* Show dropdown on parent hover (with JS grace period) */
.bif-nav-item.bif-dropdown-open > .bif-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
  pointer-events: auto;
}

/* Mega dropdown (Research — 3 columns) */
.bif-dropdown--mega {
  min-width: 580px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.25rem;
  padding: 0.75rem;
}

/* Wide dropdown (Market — 2 columns) */
.bif-dropdown--wide {
  min-width: 400px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.25rem;
  padding: 0.75rem;
}

/* Dropdown column */
.bif-dropdown__col {
  display: flex;
  flex-direction: column;
}

/* Dropdown links */
.bif-dropdown__link {
  display: flex;
  align-items: center;
  padding: 0.4rem 0.625rem;
  border-radius: 8px;
  color: var(--t2);
  text-decoration: none;
  font-size: 13px;
  transition: all 0.12s;
  white-space: nowrap;
}
.bif-dropdown__link:hover {
  background: var(--bg-raised);
  color: var(--t1);
}
.bif-dropdown__link i {
  color: var(--accent);
  font-size: 13px;
  width: 16px;
  text-align: center;
  flex-shrink: 0;
}

/* Dropdown section headers */
.bif-dropdown__header {
  font-size: 10px;
  font-family: 'JetBrains Mono', monospace;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--t3);
  padding: 0.375rem 0.625rem 0.25rem;
}

/* Dropdown divider */
.bif-dropdown__divider {
  height: 1px;
  background: var(--border);
  margin: 0.25rem 0;
}

/* Dropdown logout section */
.bif-dropdown__logout {
  padding: 0.25rem 0.25rem 0;
}

/* ── User Menu (click-triggered) ────────────────────────────── */
.bif-user-menu {
  position: relative;
}
.bif-user-menu__trigger {
  display: flex; align-items: center; gap: 8px;
  padding: 4px 10px 4px 4px;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 99px; color: var(--t1);
  transition: all var(--tx);
  cursor: pointer;
  font-family: 'Inter', -apple-system, sans-serif;
}
.bif-user-menu__trigger:hover { border-color: var(--border-hi); }

.bif-dropdown.bif-dropdown--user {
  position: absolute;
  top: calc(100% + 4px);
  right: 0 !important;
  left: auto !important;
  transform: none !important;
  width: 260px;
  min-width: 240px;
  max-width: 280px;
  max-height: 80vh;
  overflow-y: auto;
  z-index: 1050;
}
.bif-user-menu.bif-dropdown-open .bif-dropdown--user,
.bif-user-menu:focus-within .bif-dropdown--user {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none !important;
}

/* Theme button */
.bif-theme-btn {
  width: 34px; height: 34px;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--r-sm); color: var(--t2);
  display: flex; align-items: center; justify-content: center;
  transition: all var(--tx); font-size: 14px; cursor: pointer;
}
.bif-theme-btn:hover { border-color: var(--border-hi); color: var(--t1); }

/* Sub pill */
.bif-sub-pill {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 10px; border-radius: 99px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px; font-weight: 500; letter-spacing: 0.04em;
  text-transform: uppercase; border: 1px solid;
}
.text-bg-success.bif-sub-pill, .bif-sub-pill.active-sub {
  background: var(--green-dim) !important; color: var(--green) !important;
  border-color: rgba(0,201,167,0.2) !important;
}
.text-bg-secondary.bif-sub-pill {
  background: var(--bg-raised) !important; color: var(--t3) !important;
  border-color: var(--border) !important;
}

/* Avatar */
.bif-avatar {
  width: 26px; height: 26px; border-radius: 50%;
  background: var(--accent-dim); border: 1px solid rgba(79,126,255,0.28);
  display: grid; place-items: center;
  font-family: 'Inter', -apple-system, sans-serif; font-size: 12px; color: var(--accent);
}

/* ── Bootstrap Dropdown Override ────────────────────────────── */
.dropdown-menu {
  background: var(--bg-overlay) !important;
  border: 1px solid var(--border-mid) !important;
  border-radius: var(--r-lg) !important;
  padding: 6px !important; box-shadow: var(--sh-lg) !important;
  min-width: 200px;
}
.dropdown-item {
  color: var(--t2) !important; border-radius: var(--r-sm) !important;
  padding: 8px 12px !important; font-size: 13px;
  transition: all var(--tx); display: flex; align-items: center; gap: 8px;
  font-family: 'Inter', -apple-system, sans-serif;
}
.dropdown-item:hover { background: var(--bg-card) !important; color: var(--t1) !important; }
.dropdown-item i { color: var(--accent); font-size: 14px; width: 16px; text-align: center; }
.dropdown-divider { border-color: var(--border) !important; margin: 4px 0 !important; }

/* ── Content Area ───────────────────────────────────────────── */
.bif-content-area {
  max-width: 1400px;
  margin: 0 auto;
  min-height: calc(100dvh - var(--nav-h));
  display: flex;
  flex-direction: column;
  /* position:relative and z-index:1 removed — they created a stacking
     context that trapped Bootstrap modals (position:fixed) inside this
     element.  Modals appeared BEHIND the navbar (z-index:1030), making
     them completely unresponsive ("greyed out and frozen"). */
}
.bif-main__inner {
  flex: 1;
  padding: 1.5rem;
}
.bif-content { max-width: 1160px; }
.bif-content--wide { max-width: 1560px; }
.bif-content--narrow { max-width: 820px; }

/* Page reveal — clip-path based, no opacity = no text antialiasing vibration */
@keyframes bif-reveal {
  from { clip-path: inset(8px 0 0 0); opacity: 0.01; }
  to   { clip-path: inset(0 0 0 0);   opacity: 1; }
}
.bif-reveal {
  animation: bif-reveal 0.18s ease-out forwards;
}

/* ── Progress ────────────────────────────────────────────────── */
.bif-progress { position:fixed; top:0; left:0; right:0; height:2.5px; z-index:9999; pointer-events:none; opacity:0; transition:opacity 0.2s; }
.bif-progress.active { opacity:1; }
.bif-progress__bar {
  height:100%; background:linear-gradient(90deg,var(--accent),var(--green),var(--accent));
  background-size:300%; animation:bif-loading 1s linear infinite; width:100%;
  border-radius:0 2px 2px 0;
}
@keyframes bif-loading { from{background-position:200% 0} to{background-position:-200% 0} }

/* ── Loading overlay ──────────────────────────────────────── */
/* Keep at 9998 so it fully blocks the page during form submissions.
   Bootstrap modals are raised above this in the .modal / .modal-backdrop
   overrides below (z-index 10000 / 9999), so the disclaimer modal is always
   accessible even if the overlay is active. */
.bif-overlay {
  position:fixed; inset:0; z-index:9998;
  background:rgba(8,9,12,0.7); display:none;
  align-items:center; justify-content:center;
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  animation:bif-overlay-in 0.2s ease;
}
[data-theme="flatly"] .bif-overlay { background:rgba(245,246,248,0.85); }
.bif-overlay.active { display:flex; }
.bif-overlay__card {
  background:var(--bg-raised); border:1px solid var(--border-mid);
  border-radius:var(--r-lg); padding:2.5rem 3rem; text-align:center;
  box-shadow:var(--sh-lg);
  animation:bif-card-pop 0.3s ease;
}
@keyframes bif-overlay-in { from{opacity:0} to{opacity:1} }
@keyframes bif-card-pop { from{opacity:0;transform:scale(0.95) translateY(8px)} to{opacity:1;transform:scale(1) translateY(0)} }

/* ── Page Loading Indicator ───────────────────────────────── */
.bif-page-loading {
  display: none;
  text-align: center;
  padding: 3rem 1rem;
}
.bif-page-loading.active {
  display: block;
}
.bif-page-loading__text {
  margin-top: 1rem;
  color: var(--t3);
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
}

/* ── Page transitions ─────────────────────────────────────── */
/* Staggered reveal for alerts/messages */
.alert { animation:bif-slide-in 0.3s ease both; }
@keyframes bif-slide-in { from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:translateY(0)} }

/* Table row hover highlight */
.table tbody tr { transition:background 0.15s ease; }
.table tbody tr:hover { background:var(--bg-raised) !important; }
/* Disable hover on read-only comparison tables (e.g. pricing feature grid) */
.bif-table--no-hover tbody tr:hover,
.bif-table--no-hover tbody tr:hover td { background:transparent !important; color:var(--t2) !important; cursor:default; }

/* ── Cards ───────────────────────────────────────────────────── */
.card, .bif-card {
  background: var(--bg-card) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--r-lg) !important;
  color: var(--t1) !important;
  box-shadow: var(--sh-sm);
  transition: all var(--tx-mid);
}
.card-body { padding: 1.5rem !important; }
.card-footer { background:transparent !important; border-top-color:var(--border) !important; }
.card-header { background:var(--bg-raised) !important; border-bottom-color:var(--border) !important; }
.card-title { color:var(--t1) !important; font-weight:600; font-size:0.9rem; font-family:'Inter',-apple-system,sans-serif; }
.card-text { color:var(--t2) !important; font-size:0.85rem; }
.bif-card--hover:hover {
  border-color:var(--border-mid) !important;
  box-shadow:var(--sh) !important; transform:translateY(-2px);
}

/* ── Hero section ────────────────────────────────────────────── */
.bif-hero {
  position:relative; overflow:hidden;
  border:1px solid var(--border);
  border-radius:var(--r-xl);
  background:var(--bg-card);
}
.bif-hero::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(ellipse 60% 50% at 70% -10%, rgba(79,126,255,0.18) 0%, transparent 70%),
    radial-gradient(ellipse 40% 60% at 100% 80%, rgba(0,201,167,0.10) 0%, transparent 60%),
    radial-gradient(ellipse 50% 40% at -10% 60%, rgba(79,126,255,0.07) 0%, transparent 60%);
}
.bif-hero::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(135deg, rgba(15,17,23,0) 0%, rgba(15,17,23,0.35) 100%);
}
.bif-hero > * { position:relative; z-index:1; }

/* ── Buttons ─────────────────────────────────────────────────── */
.btn { font-family:'Inter',-apple-system,sans-serif !important; font-size:13.5px !important; font-weight:500 !important; border-radius:var(--r-sm) !important; transition:all var(--tx) !important; }
.btn-primary { background:var(--accent) !important; border-color:var(--accent) !important; color:#fff !important; }
.btn-primary:hover { background:var(--accent-hi) !important; box-shadow:var(--sh-accent) !important; transform:translateY(-1px); color:#fff !important; }
.btn-outline-primary { border-color:var(--accent) !important; color:var(--accent) !important; background:transparent !important; }
.btn-outline-primary:hover { background:var(--accent) !important; color:#fff !important; }
.btn-outline-secondary { border-color:var(--border-mid) !important; color:var(--t2) !important; background:transparent !important; }
.btn-outline-secondary:hover { border-color:var(--border-hi) !important; color:var(--t1) !important; background:var(--bg-raised) !important; }
.btn-outline-danger { border-color:var(--red) !important; color:var(--red) !important; background:transparent !important; }
.btn-outline-danger:hover { background:var(--red-dim) !important; }
.btn-success { background:var(--green-dim) !important; border-color:var(--green) !important; color:var(--green) !important; }
.btn-sm { padding:5px 14px !important; font-size:12.5px !important; }

/* ── Forms ───────────────────────────────────────────────────── */
.form-control, .form-select {
  background:var(--bg-raised) !important; border:1px solid var(--border-mid) !important;
  color:var(--t1) !important; border-radius:var(--r-sm) !important;
  font-size:13.5px !important; padding:9px 12px !important;
  font-family:'Inter',-apple-system,sans-serif !important; transition:all var(--tx);
}
.form-control:focus, .form-select:focus {
  border-color:var(--accent) !important;
  box-shadow:0 0 0 3px var(--accent-dim) !important;
  background:var(--bg-card) !important;
}
.form-control::placeholder { color:var(--t3) !important; }
.form-label {
  font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:500;
  color:var(--t3); text-transform:uppercase; letter-spacing:0.07em; margin-bottom:6px;
}
.form-text { color:var(--t3) !important; font-size:11.5px; }
.form-check-input { background-color:var(--bg-raised) !important; border-color:var(--border-mid) !important; }
.form-check-input:checked { background-color:var(--accent) !important; border-color:var(--accent) !important; }
.invalid-feedback { color:var(--red) !important; font-size:12px; }
.is-invalid { border-color:var(--red) !important; }
.is-invalid:focus { box-shadow:0 0 0 3px var(--red-dim) !important; }

/* ── Alerts ──────────────────────────────────────────────────── */
.alert { border-radius:var(--r) !important; font-size:13.5px; padding:12px 16px; }
.alert-success { background:var(--green-dim) !important; border-color:rgba(0,201,167,0.2) !important; color:var(--green) !important; }
.alert-danger  { background:var(--red-dim) !important;   border-color:rgba(255,77,106,0.2) !important; color:var(--red) !important; }
.alert-warning { background:var(--amber-dim) !important; border-color:rgba(245,166,35,0.2) !important; color:var(--amber) !important; }
.alert-info    { background:var(--accent-dim) !important; border-color:rgba(79,126,255,0.2) !important; color:var(--accent) !important; }
.btn-close { filter:invert(1) opacity(0.5) !important; }

/* ── Tables ──────────────────────────────────────────────────── */
.table { color:var(--t1) !important; font-size:13px; --bs-table-bg:transparent !important; }
.table th { font-family:'JetBrains Mono',monospace; font-size:10px; text-transform:uppercase; letter-spacing:0.1em; color:var(--t3) !important; font-weight:500; padding:10px 12px; border-color:var(--border) !important; }
.table td { padding:10px 12px; vertical-align:middle; border-color:var(--border) !important; color:var(--t2) !important; }
.table tbody tr:hover td { background:var(--bg-raised) !important; color:var(--t1) !important; }
.table-responsive { border-radius:var(--r); overflow:hidden; }

/* ── Badges ──────────────────────────────────────────────────── */
.badge { font-family:'JetBrains Mono',monospace !important; font-size:9.5px !important; font-weight:500 !important; letter-spacing:0.04em; padding:3px 8px; border-radius:var(--r-xs); }
.text-bg-success { background:var(--green-dim) !important; color:var(--green) !important; border:1px solid rgba(0,201,167,0.2); }
.text-bg-danger  { background:var(--red-dim) !important;   color:var(--red) !important;   border:1px solid rgba(255,77,106,0.2); }
.text-bg-warning { background:var(--amber-dim) !important; color:var(--amber) !important; border:1px solid rgba(245,166,35,0.2); }
.text-bg-primary { background:var(--accent-dim) !important; color:var(--accent) !important; border:1px solid rgba(79,126,255,0.2); }
.text-bg-secondary { background:var(--bg-overlay) !important; color:var(--t3) !important; border:1px solid var(--border); }
.text-bg-light { background:var(--bg-raised) !important; color:var(--t2) !important; border:1px solid var(--border); }

/* ── Tabs ────────────────────────────────────────────────────── */
.nav-tabs { border-bottom-color:var(--border) !important; gap:2px; }
.nav-tabs .nav-link { color:var(--t3) !important; border:none !important; border-bottom:2px solid transparent !important; border-radius:0 !important; font-size:13px; font-weight:500; padding:8px 14px; transition:all var(--tx); background:transparent !important; }
.nav-tabs .nav-link:hover { color:var(--t1) !important; border-bottom-color:var(--border-mid) !important; }
.nav-tabs .nav-link.active { color:var(--accent) !important; border-bottom-color:var(--accent) !important; }
.nav-pills .nav-link { color:var(--t2) !important; border-radius:var(--r-sm) !important; font-size:13px; padding:6px 14px; transition:all var(--tx); background:transparent !important; }
.nav-pills .nav-link:hover { color:var(--t1) !important; background:var(--bg-card) !important; }
.nav-pills .nav-link.active { background:var(--accent-dim) !important; color:var(--accent) !important; }

/* ── Modal ───────────────────────────────────────────────────── */
/* z-index must exceed bif-overlay (9998) so modals are never blocked by it */
.modal { z-index: 10000 !important; }
.modal-backdrop { z-index: 9999 !important; }
.modal-content { background:var(--bg-overlay) !important; border:1px solid var(--border-mid) !important; border-radius:var(--r-xl) !important; box-shadow:var(--sh-lg) !important; }
.modal-header { border-bottom-color:var(--border) !important; }
.modal-footer { border-top-color:var(--border) !important; }
.modal-title { font-family:'Inter',-apple-system,sans-serif !important; color:var(--t1) !important; }

/* ── Offcanvas ───────────────────────────────────────────────── */
.bif-offcanvas { background:var(--bg-surface) !important; border-right:1px solid var(--border) !important; width:min(280px,85vw) !important; }
.offcanvas-header { border-bottom:1px solid var(--border); padding:1rem; }
.offcanvas-body { padding:0.75rem !important; }

/* ── Bottom Nav ─────────────────────────────────────────────── */
.bif-bottomnav {
  position:fixed; bottom:0; left:0; right:0; z-index:1020;
  background:rgba(15,17,23,0.96);
  border-top:1px solid var(--border);
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
  display:flex; align-items:center; justify-content:space-around;
  padding:6px 0 max(8px,env(safe-area-inset-bottom));
  height:calc(58px + max(0px,env(safe-area-inset-bottom)));
}
[data-theme="flatly"] .bif-bottomnav { background:rgba(255,255,255,0.96); }
.bif-bottomnav__item {
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:3px; color:var(--t3); text-decoration:none;
  font-family:'JetBrains Mono',monospace; font-size:8.5px; font-weight:500;
  text-transform:uppercase; letter-spacing:0.06em; transition:color var(--tx); position:relative;
}
.bif-bottomnav__item i { font-size:18px; line-height:1; }
.bif-bottomnav__item:hover, .bif-bottomnav__item.active { color:var(--accent); }
.bif-bottomnav__item.active::after { content:''; position:absolute; bottom:-8px; left:50%; transform:translateX(-50%); width:18px; height:2px; background:var(--accent); border-radius:2px; }

/* ── Mobile Overlay Menu ────────────────────────────────────── */
.bif-mobile-overlay {
  position: fixed;
  inset: 0;
  z-index: 1050;
  background: var(--bg-surface);
  display: flex;
  flex-direction: column;
  transform: translateX(-100%);
  transition: transform 0.25s ease;
  overflow-y: auto;
}
.bif-mobile-overlay.open {
  transform: translateX(0);
}
.bif-mobile-overlay__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.bif-mobile-overlay__close {
  display: flex; align-items: center; justify-content: center;
  width: 34px; height: 34px;
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--r-sm); color: var(--t2);
  cursor: pointer; font-size: 16px;
}
.bif-mobile-overlay__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}

/* Mobile accordion sections */
.bif-mobile-section {
  border-bottom: 1px solid var(--border);
}
.bif-mobile-section__toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0.875rem 1rem;
  background: none;
  border: none;
  color: var(--t1);
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s;
}
.bif-mobile-section__toggle:hover {
  background: var(--bg-raised);
}
.bif-mobile-section__chevron {
  font-size: 12px;
  color: var(--t3);
  transition: transform 0.2s;
}
.bif-mobile-section.open .bif-mobile-section__chevron {
  transform: rotate(180deg);
}
.bif-mobile-section__content {
  display: none;
  padding: 0 1rem 0.5rem 2rem;
}
.bif-mobile-section.open .bif-mobile-section__content {
  display: block;
}

.bif-mobile-link {
  display: flex;
  align-items: center;
  padding: 0.625rem 1rem;
  color: var(--t2);
  text-decoration: none;
  font-size: 13.5px;
  transition: all 0.12s;
}
.bif-mobile-link:hover {
  background: var(--bg-raised);
  color: var(--t1);
}
.bif-mobile-link--locked {
  opacity: 0.5;
  border-bottom: 1px solid var(--border);
}

/* ── Page header ─────────────────────────────────────────────── */
.bif-page-header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:1.5rem; flex-wrap:wrap; }
.bif-page-title { font-family:'Inter',-apple-system,sans-serif; font-size:1.75rem; font-weight:600; color:var(--t1); margin:0; letter-spacing:-0.01em; }
.bif-page-subtitle { font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--t3); margin-top:4px; }

/* ── Divider ─────────────────────────────────────────────────── */
.bif-divider { display:flex; align-items:center; gap:12px; margin:1.5rem 0; }
.bif-divider::before,.bif-divider::after { content:''; flex:1; height:1px; background:var(--border); }
.bif-divider span { font-family:'JetBrains Mono',monospace; font-size:9px; text-transform:uppercase; letter-spacing:0.12em; color:var(--t3); white-space:nowrap; }

/* ── Stat widgets ────────────────────────────────────────────── */
.bif-stat-label { font-family:'JetBrains Mono',monospace; font-size:9px; text-transform:uppercase; letter-spacing:0.1em; color:var(--t3); }
.bif-stat-value { font-family:'JetBrains Mono',monospace; font-size:1.3rem; font-weight:500; color:var(--t1); letter-spacing:-0.04em; line-height:1.1; }
.bif-stat-value.positive { color:var(--green); }
.bif-stat-value.negative { color:var(--red); }

/* ── Misc ────────────────────────────────────────────────────── */
.bif-ticker { display:inline-flex; align-items:center; padding:2px 8px; background:var(--bg-raised); border:1px solid var(--border); border-radius:var(--r-xs); font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:500; color:var(--t1); letter-spacing:0.04em; }
.bif-side-buy  { color:var(--green) !important; }
.bif-side-sell { color:var(--red) !important; }

/* ── Footer ──────────────────────────────────────────────────── */
.bif-footer { margin-top:auto; border-top:1px solid var(--border); padding:1.5rem 0; background:var(--bg-surface); }
.bif-footer__inner { padding: 0 1.5rem; }
.bif-footer a { color:var(--t3); font-size:12px; transition:color var(--tx); }
.bif-footer a:hover { color:var(--t1); }

/* ── Pagination ──────────────────────────────────────────────── */
.pagination { gap:4px; }
.page-link { background:var(--bg-card) !important; border-color:var(--border) !important; color:var(--t2) !important; border-radius:var(--r-sm) !important; font-size:13px; padding:6px 12px; }
.page-link:hover { border-color:var(--accent) !important; color:var(--accent) !important; background:var(--accent-dim) !important; }
.page-item.active .page-link { background:var(--accent) !important; border-color:var(--accent) !important; color:#fff !important; }

/* ── Breadcrumb ──────────────────────────────────────────────── */
.breadcrumb { font-family:'JetBrains Mono',monospace; font-size:11px; }
.breadcrumb-item { color:var(--t3); }
.breadcrumb-item.active { color:var(--t2); }
.breadcrumb-item+.breadcrumb-item::before { color:var(--border-mid); }
.breadcrumb-item a { color:var(--accent); }

/* ── List group ──────────────────────────────────────────────── */
.list-group-item { background:var(--bg-card) !important; border-color:var(--border) !important; color:var(--t1) !important; font-size:13.5px; }
.list-group-item:hover { background:var(--bg-raised) !important; }
.list-group-item.active { background:var(--accent-dim) !important; border-color:rgba(79,126,255,0.2) !important; color:var(--accent) !important; }

/* ── Code ────────────────────────────────────────────────────── */
code { background:var(--bg-raised); border:1px solid var(--border); border-radius:var(--r-xs); padding:1px 5px; font-size:12px; color:var(--accent); }
pre { background:var(--bg-raised); border:1px solid var(--border); border-radius:var(--r-sm); padding:1rem; overflow-x:auto; }
pre code { background:none; border:none; padding:0; color:var(--t1); }

/* ── Input group ─────────────────────────────────────────────── */
.input-group-text { background:var(--bg-raised) !important; border-color:var(--border-mid) !important; color:var(--t2) !important; font-size:13px; }

/* ── Utilities ───────────────────────────────────────────────── */
.text-success { color:var(--green) !important; }
.text-danger  { color:var(--red) !important; }
.text-warning { color:var(--amber) !important; }
.text-primary { color:var(--accent) !important; }
.text-muted, .text-body-secondary { color:var(--t2) !important; }
.border { border-color:var(--border) !important; }
.border-top { border-top-color:var(--border) !important; }
hr { border-color:var(--border) !important; opacity:1; }
.spinner-border { color:var(--accent); }
.navbar { padding:0 !important; }
::-webkit-scrollbar { width:4px; height:4px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:var(--border-mid); border-radius:2px; }

/* ── Trade Card ─────────────────────────────────────────────── */
.tc-grid { display:grid; grid-template-columns:1fr 300px; gap:1.25rem; align-items:start; }
@media(max-width:991px) { .tc-grid { grid-template-columns:1fr; } }

.tc-section {
  background:var(--bg-card); border:1px solid var(--border);
  border-radius:var(--r-lg); padding:1.25rem;
  margin-bottom:0.75rem; position:relative; overflow:hidden;
}
.tc-section::before {
  content:''; position:absolute; top:0; left:0; width:3px; height:100%;
  background:var(--border-mid); transition:background 220ms ease;
}
.tc-section.tc-pass::before { background:var(--green); }
.tc-section.tc-fail::before { background:var(--red); }
.tc-section.tc-warn::before { background:var(--amber); }

.tc-section-head {
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:1rem; gap:0.75rem;
}
.tc-section-title {
  font-family:'JetBrains Mono',monospace; font-size:10px;
  text-transform:uppercase; letter-spacing:0.1em; color:var(--t3);
}
.tc-section-status {
  font-family:'JetBrains Mono',monospace; font-size:9px;
  padding:2px 8px; border-radius:var(--r-xs);
}
.tc-section-status.ok { background:var(--green-dim); color:var(--green); border:1px solid rgba(0,201,167,0.18); }
.tc-section-status.blocked { background:var(--red-dim); color:var(--red); border:1px solid rgba(255,77,106,0.18); }
.tc-section-status.pending { background:var(--bg-raised); color:var(--t3); border:1px solid var(--border); }

.tc-gates { display:grid; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); gap:0.5rem; }
.tc-gate {
  display:flex; align-items:center; gap:8px;
  padding:8px 10px; background:var(--bg-raised);
  border:1px solid var(--border); border-radius:var(--r-sm);
  font-size:12.5px; color:var(--t2); cursor:pointer; transition:all 150ms ease;
}
.tc-gate:has(input:checked) { border-color:rgba(0,201,167,0.25); background:var(--green-dim); }
.tc-gate:has(input:checked) .tc-gate-label { color:var(--green); }
.tc-gate input[type="checkbox"] { margin:0; }
.tc-gate-label { font-weight:500; }

.tc-prices { display:grid; grid-template-columns:repeat(3, 1fr); gap:0.75rem; }
@media(max-width:575px) { .tc-prices { grid-template-columns:1fr; } }
.tc-price-input label {
  font-family:'JetBrains Mono',monospace; font-size:9px;
  text-transform:uppercase; letter-spacing:0.08em;
  color:var(--t3); margin-bottom:4px; display:block;
}
.tc-price-input input { font-family:'JetBrains Mono',monospace; font-size:15px; font-weight:500; letter-spacing:-0.02em; }

.tc-confirms { display:grid; grid-template-columns:1fr 1fr; gap:0.5rem; }
@media(max-width:575px) { .tc-confirms { grid-template-columns:1fr; } }

.tc-sidebar { position:sticky; top:calc(var(--nav-h) + 1rem); }
.tc-stat-grid { display:grid; grid-template-columns:1fr 1fr; gap:0.75rem; margin-bottom:1rem; }
.tc-stat {
  padding:10px 12px; background:var(--bg-raised);
  border:1px solid var(--border); border-radius:var(--r-sm); text-align:center;
}

.tc-check-list { list-style:none; padding:0; margin:0 0 1rem; }
.tc-check-item {
  display:flex; align-items:flex-start; gap:8px;
  padding:6px 0; font-size:12px; color:var(--t2);
  border-bottom:1px solid var(--border);
}
.tc-check-item:last-child { border-bottom:none; }
.tc-check-icon { flex-shrink:0; width:16px; text-align:center; }
.tc-check-icon.pass { color:var(--green); }
.tc-check-icon.fail { color:var(--red); }
.tc-check-icon.warn { color:var(--amber); }

.tc-formset-row {
  display:grid; grid-template-columns:120px 1fr 1fr auto; gap:0.5rem;
  align-items:center; padding:6px 0; border-bottom:1px solid var(--border);
}
.tc-formset-row:last-child { border-bottom:none; }
@media(max-width:575px) { .tc-formset-row { grid-template-columns:1fr 1fr; } }

.tc-status-banner {
  padding:1rem 1.25rem; border-radius:var(--r);
  display:flex; align-items:center; justify-content:center;
  gap:10px; font-size:14px; font-weight:500; margin-bottom:1rem;
}
.tc-status-banner.allowed { background:var(--green-dim); border:1px solid rgba(0,201,167,0.2); color:var(--green); }
.tc-status-banner.blocked { background:var(--red-dim); border:1px solid rgba(255,77,106,0.2); color:var(--red); }
.tc-status-banner.draft { background:var(--bg-raised); border:1px solid var(--border); color:var(--t3); }

/* ── Auth pages ─────────────────────────────────────────────── */
.bif-auth-shell {
  display:flex; align-items:center; justify-content:center;
  min-height:calc(100dvh - var(--nav-h) - 120px);
  padding:2rem 1rem;
}
.bif-auth-card {
  width:100%; max-width:420px;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r-xl);
  padding:2.5rem 2rem 2rem;
  position:relative; overflow:hidden;
  box-shadow:var(--sh);
}
.bif-auth-card--wide { max-width:480px; }
.bif-auth-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent, var(--accent), transparent);
}
.bif-auth-card--success::before {
  background:linear-gradient(90deg, transparent, var(--green), transparent);
}
.bif-auth-glow {
  position:absolute; top:-80px; left:50%; transform:translateX(-50%);
  width:260px; height:160px;
  background:radial-gradient(ellipse, rgba(79,126,255,0.10) 0%, transparent 70%);
  pointer-events:none; z-index:0;
}
.bif-auth-card > *:not(.bif-auth-glow) { position:relative; z-index:1; }
.bif-auth-icon {
  width:44px; height:44px; border-radius:var(--r);
  background:var(--accent-dim); border:1px solid rgba(79,126,255,0.18);
  display:grid; place-items:center; margin:0 auto 1.25rem;
  color:var(--accent); font-size:20px;
}
.bif-auth-icon--lg { width:52px; height:52px; font-size:22px; }
.bif-auth-icon--success {
  background:var(--green-dim); border-color:rgba(0,201,167,0.18); color:var(--green);
}
.bif-auth-title {
  font-family:'Inter',-apple-system,sans-serif; font-size:1.5rem;
  font-weight:600; color:var(--t1); text-align:center;
  letter-spacing:-0.01em; margin-bottom:0.25rem;
}
.bif-auth-subtitle {
  font-family:'Inter',-apple-system,sans-serif; font-size:13px;
  color:var(--t2); text-align:center; margin-bottom:1.75rem;
}
.bif-auth-msg {
  font-size:13.5px; color:var(--t2); line-height:1.7;
  margin-bottom:1.75rem; text-align:center;
}
.bif-auth-notice {
  background:var(--bg-raised); border:1px solid var(--border);
  border-radius:var(--r); padding:0.875rem 1rem;
  margin-bottom:1.5rem; font-size:12.5px; color:var(--t2); line-height:1.65;
}
.bif-auth-notice strong { color:var(--amber); }
.bif-auth-rules {
  margin:0.625rem 0 0; padding-left:1.125rem;
  font-size:12px; color:var(--t3); line-height:1.7;
}
.bif-auth-rules li { margin-bottom:2px; }
.bif-auth-rules strong { color:var(--t2); }
.bif-auth-legal {
  font-size:12px; color:var(--t3); margin-bottom:1.25rem; line-height:1.6;
}
.bif-auth-legal a { color:var(--accent); }
.bif-auth-footer {
  display:flex; justify-content:space-between; align-items:center;
  padding-top:1.25rem; margin-top:1.5rem;
  border-top:1px solid var(--border); font-size:12.5px;
}
.bif-auth-footer a { color:var(--t3); transition:color var(--tx); }
.bif-auth-footer a:hover { color:var(--accent); }
.bif-auth-alt {
  text-align:center; margin-top:1.5rem; font-size:13px; color:var(--t3);
}
.bif-auth-alt--bordered { padding-top:1.25rem; border-top:1px solid var(--border); }
.bif-auth-alt a { color:var(--accent); font-weight:500; }
.bif-auth-back {
  text-align:center; padding-top:1.25rem; margin-top:1.5rem;
  border-top:1px solid var(--border); font-size:13px;
}
.bif-auth-back a { color:var(--t3); transition:color var(--tx); }
.bif-auth-back a:hover { color:var(--accent); }

/* ── Markdown content (tutorials) ────────────────────────────── */
.bif-markdown h1,.bif-markdown h2,.bif-markdown h3,.bif-markdown h4 { color:var(--t1); margin-top:1.75rem; margin-bottom:0.75rem; }
.bif-markdown h1 { font-size:1.5rem; }
.bif-markdown h2 { font-size:1.25rem; padding-bottom:0.5rem; border-bottom:1px solid var(--border); }
.bif-markdown h3 { font-size:1.1rem; }
.bif-markdown p { margin-bottom:1rem; }
.bif-markdown ul,.bif-markdown ol { padding-left:1.5rem; margin-bottom:1rem; }
.bif-markdown li { margin-bottom:0.35rem; }
.bif-markdown blockquote { border-left:3px solid var(--accent); padding:0.75rem 1rem; background:var(--bg-raised); border-radius:0 var(--r-sm) var(--r-sm) 0; margin:1rem 0; color:var(--t2); font-style:italic; }
.bif-markdown img { max-width:100%; border-radius:var(--r-sm); border:1px solid var(--border); margin:1rem 0; }
.bif-markdown table { width:100%; border-collapse:collapse; margin:1rem 0; font-size:13px; }
.bif-markdown table th,.bif-markdown table td { padding:8px 12px; border:1px solid var(--border); }
.bif-markdown table th { background:var(--bg-raised); color:var(--t3); font-family:'JetBrains Mono',monospace; font-size:10px; text-transform:uppercase; letter-spacing:0.08em; }
.bif-markdown a { color:var(--accent); text-decoration:underline; text-underline-offset:2px; }
.bif-markdown a:hover { color:var(--t1); }
.bif-markdown hr { border:none; border-top:1px solid var(--border); margin:2rem 0; }

/* ── Chart ───────────────────────────────────────────────────── */
.bif-chart { width:100%; min-height:360px; border-radius:var(--r-sm); overflow:hidden; }

/* ── Skeleton loader ─────────────────────────────────────────── */
.bif-skeleton {
  background:var(--bg-raised);
  background-image:linear-gradient(90deg, var(--bg-raised) 0%, var(--bg-overlay) 40%, var(--bg-raised) 80%);
  background-size:400% 100%;
  animation:bif-shimmer 1.4s ease infinite;
  border-radius:var(--r-sm);
}
@keyframes bif-shimmer { from { background-position:200% 0; } to { background-position:-200% 0; } }

/* ── Responsive ──────────────────────────────────────────────── */

/* Mobile: add bottom padding for bottom nav */
@media (max-width:991px) {
  .bif-content-area { padding-bottom:calc(58px + max(0px,env(safe-area-inset-bottom))); }
  .bif-content, .bif-content--wide, .bif-content--narrow { padding-left:0; padding-right:0; }
}

/* Mobile */
@media (max-width:575px) {
  .bif-page-title { font-size:1.4rem; }
  .bif-hero { border-radius:var(--r); padding:1.25rem !important; }

  /* Stack hero columns */
  .bif-hero .row { flex-direction:column; }

  /* Tighter card padding */
  .bif-card, .card { border-radius:var(--r) !important; }
  .card-body { padding:1rem !important; }

  /* Table horizontal scroll hint */
  .table-responsive { -webkit-overflow-scrolling:touch; }
  .table th, .table td { white-space:nowrap; }

  /* Stat grid: 2 cols on mobile */
  .bif-stat-value { font-size:1.1rem; }

  /* Auth card: tighter on small screens */
  .bif-auth-card { padding:1.75rem 1.25rem 1.5rem; border-radius:var(--r-lg); }
  .bif-auth-title { font-size:1.25rem; }

  /* Form elements: larger tap targets */
  .btn { min-height:42px; }
  .btn-sm { min-height:36px !important; }
  .form-control, .form-select { padding:10px 12px !important; min-height:42px; }

  /* Page header: stack on mobile */
  .bif-page-header { flex-direction:column; gap:0.5rem; }

  /* Trade card: single column */
  .tc-grid { grid-template-columns:1fr; }
  .tc-gates { grid-template-columns:1fr 1fr; }
  .tc-prices { grid-template-columns:1fr; }
  .tc-confirms { grid-template-columns:1fr; }
  .tc-sidebar { position:static; }

  /* Content area: tighter padding */
  .bif-main__inner { padding:1rem; }

  /* Bottom nav: slightly taller for thumb reach */
  .bif-bottomnav { padding:8px 0 max(10px,env(safe-area-inset-bottom)); }
  .bif-bottomnav__item { font-size:8px; }
  .bif-bottomnav__item i { font-size:20px; }

  /* Chart: reduce height on mobile */
  .bif-chart { min-height:280px; }

  /* Indicator toolbar: scrollable */
  #bifIndicatorBar { overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  #bifIndicatorBar::-webkit-scrollbar { display:none; }
}

/* Small mobile (iPhone SE, etc) */
@media (max-width:374px) {
  .bif-page-title { font-size:1.2rem; }
  .bif-hero h1 { font-size:1.5rem !important; }
  .bif-brand { font-size:0.9rem; }
  .tc-gates { grid-template-columns:1fr; }
}

/* ── Reusable Components (eliminates inline styles) ─────────── */

/* Icon circles */
.bif-icon-circle {
  width: 38px; height: 38px;
  border-radius: var(--r-sm);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  font-size: 16px;
}
.bif-icon-circle--accent { background: var(--accent-dim); color: var(--accent); }
.bif-icon-circle--green { background: var(--green-dim); color: var(--green); }
.bif-icon-circle--red { background: var(--red-dim); color: var(--red); }
.bif-icon-circle--amber { background: var(--amber-dim); color: var(--amber); }

/* Interactive card (replaces onmouseenter/onmouseleave) */
.bif-card--interactive {
  cursor: pointer;
  transition: all var(--tx);
}
.bif-card--interactive:hover {
  border-color: var(--border-mid);
  background: var(--bg-raised);
  transform: translateY(-2px);
  box-shadow: var(--sh);
}

/* Hover-highlight for list items and inline links (replaces inline onmouseenter/onmouseleave JS) */
.bif-hover-bg { transition: background var(--tx), padding-left var(--tx); }
.bif-hover-bg:hover { background: var(--bg-raised); }

/* Feature card (homepage/pricing) */
.bif-feature-card {
  padding: 1.25rem;
  border-radius: var(--r);
  background: var(--bg-card);
  border: 1px solid var(--border);
  transition: all var(--tx);
}
.bif-feature-card:hover {
  border-color: var(--border-mid);
  transform: translateY(-2px);
  box-shadow: var(--sh);
}

/* Step number circles */
.bif-step-number {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--accent-dim);
  color: var(--accent);
  display: flex; align-items: center; justify-content: center;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px; font-weight: 600;
  flex-shrink: 0;
}

/* Section divider with label */
.bif-section-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--t3);
}
/* Margin variants for .bif-section-label */
.bif-section-label--mb4  { margin-bottom: 4px; }
.bif-section-label--mb6  { margin-bottom: 6px; }
.bif-section-label--mb8  { margin-bottom: 8px; }
.bif-section-label--mb12 { margin-bottom: 12px; }

/* ── Utility classes ──────────────────────────────────────────── */
.bif-pad       { padding: 1.25rem; }
.bif-pad-sm    { padding: 1rem; }
.bif-pad-lg    { padding: 1.5rem; }
.bif-hint      { font-size: 11px; color: var(--t3); }
.bif-sub       { font-size: 12px; color: var(--t3); }
.bif-body      { font-size: 12.5px; color: var(--t2); line-height: 1.65; margin: 0; }
.bif-mono-sm   { font-family: 'JetBrains Mono', monospace; font-size: 10px; color: var(--t3); }
.bif-mono-md   { font-family: 'JetBrains Mono', monospace; font-size: 12px; color: var(--t2); }
.bif-section-title   { font-size: 14px; font-weight: 500; color: var(--t1); margin-bottom: 0.5rem; }
.bif-section-heading { font-size: 15px; font-weight: 600; color: var(--t1); margin-bottom: 0.75rem; }
.bif-divider   { margin: 1.5rem 0; border-color: var(--border); }

/* Stat card */
.bif-stat-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--r);
  padding: 1rem 1.25rem;
}
.bif-stat-card__label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9px; font-weight: 500;
  text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--t3);
  margin-bottom: 4px;
}
.bif-stat-card__value {
  font-family: 'JetBrains Mono', monospace;
  font-size: 20px; font-weight: 600;
  color: var(--t1);
}

/* Empty state */
.bif-empty-state {
  text-align: center;
  padding: 3rem 1.5rem;
  color: var(--t3);
}
.bif-empty-state__icon {
  font-size: 2.5rem;
  margin-bottom: 0.75rem;
  opacity: 0.5;
}
.bif-empty-state__title {
  font-size: var(--text-md);
  font-weight: 500;
  color: var(--t2);
  margin-bottom: 0.25rem;
}
.bif-empty-state__text {
  font-size: var(--text-sm);
  color: var(--t3);
  margin-bottom: 1rem;
}

/* Data table */
.bif-table {
  width: 100%;
  font-size: var(--text-sm);
  border-collapse: collapse;
}
.bif-table th {
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--t3);
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
.bif-table td {
  padding: 10px;
  border-bottom: 1px solid var(--border);
  color: var(--t2);
}
.bif-table tr:hover td {
  background: var(--bg-raised);
}

/* Bias colors */
.bif-bias--bullish { color: var(--green); }
.bif-bias--bearish { color: var(--red); }
.bif-bias--neutral { color: var(--amber); }

/* Focus visible (accessibility) */
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
button:focus-visible, .btn:focus-visible, a:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .bif-skeleton { animation: none; background: var(--bg-raised); }
  .bif-fadein { animation: none; opacity: 1; }
}

/* Responsive tables to cards on mobile */
@media (max-width: 768px) {
  .bif-table--cards thead { display: none; }
  .bif-table--cards tr {
    display: block;
    padding: 0.75rem;
    margin-bottom: 0.5rem;
    border: 1px solid var(--border);
    border-radius: var(--r-sm);
    background: var(--bg-card);
  }
  .bif-table--cards td {
    display: flex;
    justify-content: space-between;
    padding: 4px 0;
    border: none;
  }
  .bif-table--cards td::before {
    content: attr(data-label);
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--t3);
    font-weight: 500;
  }
}

/* Search results dropdown */
.bif-search-result {
  display: block;
  padding: 8px 12px;
  color: var(--t1);
  text-decoration: none;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  border-bottom: 1px solid var(--border);
  transition: background var(--tx);
}
.bif-search-result:hover {
  background: var(--bg-raised);
  color: var(--t1);
}

/* ── Toast notifications ─────────────────────────────────────── */
.bif-toast {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-radius: var(--r);
  border: 1px solid var(--border);
  background: var(--bg-card);
  margin-bottom: 16px;
  animation: bif-toast-in 0.35s ease;
  position: relative;
  font-size: 13px;
  line-height: 1.4;
  color: var(--t1);
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.bif-toast--success { border-left: 3px solid #10B981; }
.bif-toast--success .bif-toast__icon { color: #10B981; }
.bif-toast--error, .bif-toast--danger { border-left: 3px solid #EF4444; }
.bif-toast--error .bif-toast__icon, .bif-toast--danger .bif-toast__icon { color: #EF4444; }
.bif-toast--warning { border-left: 3px solid #F59E0B; }
.bif-toast--warning .bif-toast__icon { color: #F59E0B; }
.bif-toast--info { border-left: 3px solid var(--accent); }
.bif-toast--info .bif-toast__icon { color: var(--accent); }

.bif-toast__icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}
.bif-toast__text {
  flex: 1;
}
.bif-toast__close {
  flex-shrink: 0;
  background: none;
  border: none;
  color: var(--t3);
  font-size: 18px;
  cursor: pointer;
  padding: 0 2px;
  line-height: 1;
  opacity: 0.6;
  transition: opacity 0.15s;
}
.bif-toast__close:hover { opacity: 1; }

@keyframes bif-toast-in {
  from { opacity: 0; transform: translateY(-8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Auto-dismiss after 5s */
.bif-toast.bif-toast--fade-out {
  animation: bif-toast-out 0.3s ease forwards;
}
@keyframes bif-toast-out {
  from { opacity: 1; transform: translateY(0); }
  to   { opacity: 0; transform: translateY(-8px); }
}

/* ── Mobile responsive polish ────────────────────────────────── */

/* Research ticker tabs: horizontal scroll on mobile */
@media (max-width: 768px) {
  .bif-ticker-tabs .nav-tabs {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    border-bottom: none;
    gap: 0;
  }
  .bif-ticker-tabs .nav-tabs::-webkit-scrollbar { display: none; }
  .bif-ticker-tabs .nav-tabs .nav-item { flex-shrink: 0; }

  /* Research ticker input row: stack vertically */
  .bif-ticker-form {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .bif-ticker-form .form-select,
  .bif-ticker-form .btn {
    width: 100% !important;
  }

  /* Signal filter form: stack vertically */
  .bif-filter-form .row { flex-direction: column; }
  .bif-filter-form .row > [class*="col-"] {
    flex: 0 0 100%;
    max-width: 100%;
  }

  /* Pricing cards: full width */
  .bif-pricing-grid > [class*="col-md-4"] {
    flex: 0 0 100%;
    max-width: 100%;
  }

  /* Journal trade entry cards: tighter spacing */
  .bif-journal-cards { gap: 0.5rem !important; }
  .bif-journal-cards .bif-card { border-radius: var(--r-sm) !important; }

  /* Watchlist table: horizontal scroll with hint */
  .bif-watchlist-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .bif-watchlist-wrap table {
    min-width: 700px;
  }

  /* Mega dropdown: stack to single column on tablet */
  .bif-dropdown--mega {
    min-width: 300px;
    grid-template-columns: 1fr;
  }
  .bif-dropdown--wide {
    min-width: 240px;
    grid-template-columns: 1fr;
  }
}

/* Stats grid: 2x2 on mobile */
@media (max-width: 575px) {
  .bif-stats-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* Loading indicator */
.bif-loading-indicator {
  text-align: center;
  padding: 3rem;
}
.bif-loading-indicator .spinner-border {
  width: 2rem;
  height: 2rem;
}
.bif-loading-indicator__text {
  margin-top: 1rem;
  color: var(--t3);
  font-size: 13px;
}

/* ── Stock Screener Table ─────────────────────────────────── */
.bif-screener-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.bif-screener-th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--bg-card);
  padding: 10px 12px;
  text-align: left;
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--t3);
  border-bottom: 1px solid var(--border-mid);
  white-space: nowrap;
}
.bif-screener-th--right { text-align: right; }
.bif-screener-th--sticky-col {
  position: sticky;
  left: 0;
  z-index: 3;
}
.bif-screener-sort {
  color: var(--t3);
  text-decoration: none;
  transition: color var(--tx);
}
.bif-screener-sort:hover { color: var(--accent); }
.bif-screener-row {
  transition: background var(--tx);
}
.bif-screener-row:nth-child(even) {
  background: var(--bg-surface);
}
.bif-screener-row:nth-child(odd) {
  background: var(--bg-card);
}
.bif-screener-row:hover {
  background: var(--bg-raised);
}
.bif-screener-td {
  padding: 8px 12px;
  border-bottom: 1px solid var(--border);
  color: var(--t1);
  white-space: nowrap;
}
.bif-screener-td--mono {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12.5px;
}
.bif-screener-td--right { text-align: right; }
.bif-screener-td--sticky-col {
  position: sticky;
  left: 0;
  z-index: 1;
  background: inherit;
}

/* Pulse animation (used by hero badge on home/landing) */
@keyframes bif-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .5; transform: scale(.8); }
}

/* Print: hide nav, bottom bar */
@media print {
  .bif-navbar, .bif-bottomnav, .bif-progress, .bif-toast, .bif-mobile-overlay { display:none !important; }
  .bif-content-area { margin:0; padding:0; max-width:none; }
  body { background:#fff !important; color:#000 !important; }
}