/* docs.html head CSS, bundled in original cascade order (cleanup stage 6a). This file is now the source: edit it directly; deploy-site.ps1 renames it by content hash. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@500;600;700;800&display=swap');
/* ---- style#sla-directory-and-brand-logo-lock-css ---- */
/* 1. Prevent the Directory filter bar from showing the orphan floating magnifying glass icon (Screenshot 114708) */
  html body input[placeholder*="Filter 21,026"] ~ svg,
  html body input[placeholder*="Filter "] ~ svg,
  html body div:has(> input[placeholder*="Filter "]) ~ svg,
  html body [data-sla-orphan-search-icon="1"] {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /* 2. Lock the Directory search/filter bar row from 0ms so it doesn't shift while loading */
  html body div:has(> div > input[placeholder*="Filter "]),
  html body [data-sla-dir-filter-row="1"] {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  html body div:has(> input[placeholder*="Filter "]),
  html body [data-sla-dir-input-wrap="1"] {
    flex: 1 1 auto !important;
    max-width: 100% !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
  }

/* ---- style#sla-instant-hero-and-corner-fix-css ---- */
/* A. Hide stray bottom-right toast & floating corner artifacts by default */
  html body #toast:not([data-sla-toast-active="1"]),
  html body #sla-copy-toast:not([data-sla-toast-active="1"]),
  html body #sla-clipboard-toast:not([data-sla-toast-active="1"]),
  html body [id*="toast"]:not([data-sla-toast-active="1"]),
  html body [class*="toast"]:not([data-sla-toast-active="1"]),
  html body [data-sla-stray-corner-hidden="1"] {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  html body [data-sla-toast-active="1"] {
    display: inline-flex !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* B. Pre-lock Hero Search Input & Row at 0ms so it never flashes full-width (Screenshot 113808_2) before settling (Screenshot 114124) */
  html body main section:first-of-type input[placeholder*="Search verified APIs"],
  html body section input[placeholder*="Search verified APIs"] {
    width: 380px !important;
    max-width: min(380px, 62vw) !important;
    min-width: 240px !important;
    flex: 0 1 380px !important;
  }

  html body [data-sla-hero-search-row="1"] {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    width: 100% !important;
  }

/* ---- style#sla-anti-black-screen-failsafe-css ---- */
html, html body {
    opacity: 1 !important;
    visibility: visible !important;
  }
  html body #sla-spotify-top10-view .sla-sp-chart-card:nth-child(n+3) {
    content-visibility: auto;
    contain-intrinsic-size: auto 640px;
  }
  html body #sla-main-directory-grid > *:nth-child(n+10) {
    content-visibility: auto;
    contain-intrinsic-size: auto 320px;
  }

/* ---- style#sla-fix-outbid-console-dossier-css ---- */
/* 1. Suppress the legacy hardcoded AgentSLA Dossier modal so it never conflicts */
  html body #sla-orientation-exact-dossier-backdrop:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /* 2. High-specificity backdrop styling for Outbid, Lock Escrow, and Dynamic Endpoint Dossier modals */
  html body #sla-live-outbid-modal-backdrop:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body #sla-live-escrow-modal-backdrop:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body #sla-live-dossier-modal-backdrop:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483647 !important;
    background: rgba(5, 8, 15, 0.86) !important;
    backdrop-filter: blur(10px) !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
  }

  html body #sla-live-outbid-modal-backdrop[data-open="true"]:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body #sla-live-escrow-modal-backdrop[data-open="true"]:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body #sla-live-dossier-modal-backdrop[data-open="true"]:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  /* 3. Pure White "X" Close Button ONLY (no blue background, no pill, no border) */
  html body #sla-live-dossier-close-btn:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body #sla-live-outbid-close-btn:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body #sla-live-escrow-close-btn:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body .sla-pure-white-close-x:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    all: unset !important;
    position: absolute !important;
    top: 22px !important;
    right: 24px !important;
    width: 28px !important;
    height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    cursor: pointer !important;
    z-index: 30 !important;
    opacity: 0.92 !important;
    transition: opacity 0.15s ease !important;
  }

  html body .sla-pure-white-close-x:hover:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    opacity: 1 !important;
  }

  /* 4. Pure White Copy Symbol ONLY (no blue pill, no text button) */
  html body #sla-live-dossier-copy-url-btn:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body .sla-pure-white-copy-symbol:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    all: unset !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    opacity: 0.9 !important;
    transition: opacity 0.15s ease, transform 0.15s ease !important;
  }

  html body #sla-live-dossier-copy-url-btn:hover:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    opacity: 1 !important;
    transform: scale(1.06) !important;
  }

  /* 5. Role Dropdown Menu inside Dossier Modal */
  html body #sla-live-dossier-role-menu:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    min-width: 220px !important;
    background: #0d1322 !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.45) !important;
    border-radius: 12px !important;
    padding: 6px !important;
    box-shadow: 0 18px 48px rgba(var(--sla-black-rgb), 0.9) !important;
    z-index: 9999 !important;
    display: none !important;
    flex-direction: column !important;
    gap: 2px !important;
  }

  html body #sla-live-dossier-role-menu[data-menu-open="true"]:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  html body .sla-dossier-dd-option:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 9px 12px !important;
    border-radius: 8px !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    color: var(--sla-text-2) !important;
    -webkit-text-fill-color: var(--sla-text-2) !important;
    background: transparent !important;
    cursor: pointer !important;
    user-select: none !important;
  }

  html body .sla-dossier-dd-option:hover:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body .sla-dossier-dd-option[data-selected="true"]:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    background: rgba(var(--sla-accent-rgb), 0.16) !important;
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
  }

  /* 6. Guarantee CONSOLE tab visibility when user clicks the top CONSOLE button */
  html body[data-sla-active-tab="console"] #tab-panel-console:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body[data-sla-active-tab="console"] #sla-isolated-console-view:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    display: flex !important;
    flex-direction: column !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 420px !important;
  }

/* ---- style#sla-nav-how-it-works-plain-link-styles ---- */
/* Make "How It Works" in the navigation bar look identical to Directory, Architecture, Pricing, FAQs, and Developer Tools */
  html body header [data-sla-nav-plain-link="true"],
  html body nav [data-sla-nav-plain-link="true"],
  html body a[href*="how-it-works"],
  html body a[href*="orientation"],
  html body header button[id*="orient"],
  html body header button[id*="how"],
  html body nav button[id*="orient"],
  html body nav button[id*="how"] {
    all: unset !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    transition: color 0.15s ease, opacity 0.15s ease !important;
  }

  html body header [data-sla-nav-plain-link="true"]:hover,
  html body nav [data-sla-nav-plain-link="true"]:hover,
  html body a[href*="how-it-works"]:hover,
  html body a[href*="orientation"]:hover {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    color: var(--sla-accent) !important;
    -webkit-text-fill-color: var(--sla-accent) !important;
    transform: none !important;
  }

/* ---- /sla-css-8404954817.css ---- */
/* Hide the redundant "AGENTSLA // Live ... llms.txt mcp.json BASE MAINNET • 8453" bar at 0ms */
  #top-bar,
  .top-bar,
  #status-bar,
  .status-bar,
  #protocol-bar,
  .protocol-bar,
  [data-sla-removed-status-bar="true"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }


  /* Static Hero Search Row & INSPECT DOSSIER Button (0ms First Paint, Zero Flicker) */
  #sla-static-hero-search-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    max-width: 700px !important;
    margin: 22px 0 10px 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  #sla-hero-search-pill-box {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    flex: 1 1 320px !important;
    max-width: 480px !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 18px !important;
    background: rgba(10, 15, 28, 0.92) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.28) !important;
    border-radius: 999px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }

  #sla-hero-search-pill-box:focus-within {
    border-color: var(--sla-accent) !important;
    box-shadow: 0 0 0 2px rgba(var(--sla-accent-rgb), 0.2) !important;
  }

  .sla-hero-search-icon {
    width: 15px !important;
    height: 15px !important;
    min-width: 15px !important;
    color: var(--sla-text-faint) !important;
    flex-shrink: 0 !important;
  }

  html body input#sla-hero-search-input {
    all: unset !important;
    box-sizing: border-box !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    height: 100% !important;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    font-family: "JetBrains Mono", Inter, system-ui, monospace !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-align: left !important;
  }

  html body input#sla-hero-search-input::placeholder {
    color: var(--sla-text-faint) !important;
    -webkit-text-fill-color: var(--sla-text-faint) !important;
    opacity: 1 !important;
  }


  /* Strict Zero-Flicker Lock for Hero Section (0ms First Paint) */
  

  #sla-static-hero-search-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    max-width: 680px !important;
    margin: 24px 0 8px 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  #sla-static-hero-search-row > *:not(#sla-hero-search-pill-box):not(#sla-hero-inspect-dossier-btn) {
    display: none !important;
  }

  #sla-hero-search-pill-box {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    flex: 1 1 300px !important;
    max-width: 460px !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 18px !important;
    background: rgba(10, 15, 28, 0.9) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.28) !important;
    border-radius: 999px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }

  #sla-hero-search-pill-box:focus-within {
    border-color: var(--sla-accent) !important;
    box-shadow: 0 0 0 2px rgba(var(--sla-accent-rgb), 0.2) !important;
  }

  .sla-hero-search-icon {
    width: 15px !important;
    height: 15px !important;
    min-width: 15px !important;
    color: var(--sla-text-faint) !important;
    flex-shrink: 0 !important;
  }

  html body input#sla-hero-search-input {
    all: unset !important;
    box-sizing: border-box !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    height: 100% !important;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    font-family: "JetBrains Mono", Inter, system-ui, monospace !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-align: left !important;
  }

  html body input#sla-hero-search-input::placeholder {
    color: var(--sla-text-faint) !important;
    -webkit-text-fill-color: var(--sla-text-faint) !important;
    opacity: 1 !important;
  }


  /* Zero-Flicker Static Layout for Hero Search Bar & Button (0ms First Paint) */
  .sla-hero-search-row-wrap > *:first-child:not(button) {
    flex: 1 1 320px !important;
    max-width: 500px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
  }

  /* Prevent any autocomplete/search dropdown menu or NPM dropdown from flashing under the Hero search bar */
  #sla-npm-dropdown,
  #npm-dropdown,
  #hero-npm-dropdown,
  .npm-dropdown,
  .sla-npm-dropdown,
  #search-dropdown,
  #hero-search-dropdown,
  #search-suggestions,
  #search-results-dropdown,
  .search-dropdown,
  .search-suggestions,
  .autocomplete-dropdown,
  .autocomplete-items,
  [id*="auto-index"],
  [class*="auto-index"],
  [data-sla-removed-npm-dropdown="true"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    height: 0 !important;
    overflow: hidden !important;
  }

  /* Hide unwanted extra inline popups (Smart Auto-Indexer, inline Verdict box, legacy Base Mainnet modal) */
  #dossier-panel,
  #pre-transaction-verdict,
  #live-verdict-panel,
  #sla-smart-auto-indexer,
  #smart-auto-indexer,
  [id*="auto-index"],
  [class*="auto-index"],
  [data-sla-hidden-extra-popup="true"],
  [data-sla-blocked-legacy-base-modal="true"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    position: absolute !important;
    left: -99999px !important;
  }

  /* Hero Search Bar Row + INSPECT DOSSIER Button Side-by-Side */
  .sla-hero-search-row-wrap {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    max-width: 720px !important;
    margin-bottom: 14px !important;
  }

  html body button#sla-hero-inspect-dossier-btn,
  html body button.sla-inspect-dossier-pill-btn {
    all: unset !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 24px !important;
    border-radius: 999px !important;
    background: var(--sla-accent) !important;
    background-color: var(--sla-accent) !important;
    border: 1px solid var(--sla-accent) !important;
    box-shadow: 0 0 22px rgba(var(--sla-accent-rgb), 0.35) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: "JetBrains Mono", Inter, system-ui, monospace !important;
    font-size: 11.5px !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    transition: transform 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease !important;
  }

  html body button#sla-hero-inspect-dossier-btn:hover,
  html body button.sla-inspect-dossier-pill-btn:hover {
    background: var(--sla-accent-soft) !important;
    background-color: var(--sla-accent-soft) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 0 28px rgba(var(--sla-accent-rgb), 0.55) !important;
  }

  /* Single Canonical Modal: Exact 1:1 Orientation Cryptographic Endpoint Dossier Modal */
  #sla-orientation-exact-dossier-backdrop {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    background: rgba(2, 6, 15, 0.86) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    z-index: 2147483647 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 18px !important;
    box-sizing: border-box !important;
  }

  #sla-orientation-exact-dossier-backdrop[data-open="true"] {
    display: flex !important;
  }

  .sla-oed-card {
    width: 100% !important;
    max-width: 720px !important;
    max-height: 92dvh !important;
    overflow-y: auto !important;
    scrollbar-width: thin !important;
    scrollbar-color: rgba(var(--sla-white-rgb), 0.16) transparent !important;
    background: #080d19 !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.24) !important;
    border-radius: 24px !important;
    box-shadow: 0 28px 90px rgba(var(--sla-black-rgb), 0.92), 0 0 48px rgba(var(--sla-accent-rgb), 0.1) !important;
    padding: 24px 26px !important;
    box-sizing: border-box !important;
    text-align: left !important;
    color: var(--sla-white) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
  }

  .sla-oed-card[data-flagged="true"] {
    border-color: rgba(var(--sla-danger-rgb), 0.45) !important;
    box-shadow: 0 28px 90px rgba(var(--sla-black-rgb), 0.94), 0 0 48px rgba(var(--sla-danger-rgb), 0.16) !important;
  }

  .sla-oed-card::-webkit-scrollbar {
    width: 6px !important;
  }

  .sla-oed-card::-webkit-scrollbar-track {
    background: transparent !important;
  }

  .sla-oed-card::-webkit-scrollbar-thumb {
    background: rgba(var(--sla-white-rgb), 0.16) !important;
    border-radius: 999px !important;
  }

  .sla-oed-top-bar {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin-bottom: 6px !important;
  }

  .sla-oed-eyebrow {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: var(--sla-warning) !important;
    -webkit-text-fill-color: var(--sla-warning) !important;
    margin: 4px 0 0 0 !important;
  }

  .sla-oed-eyebrow[data-flagged="true"] {
    color: var(--sla-danger) !important;
    -webkit-text-fill-color: var(--sla-danger) !important;
  }

  html body button.sla-oed-close-btn {
    all: unset !important;
    box-sizing: border-box !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    border-radius: 999px !important;
    background: var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-family: Inter, system-ui, sans-serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
  }

  .sla-oed-title-row {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 4px 0 12px 0 !important;
  }

  .sla-oed-logo-box {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    border-radius: 10px !important;
    background: rgba(var(--sla-accent-rgb), 0.14) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.85) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
  }

  .sla-oed-logo-box[data-flagged="true"] {
    background: rgba(var(--sla-danger-rgb), 0.16) !important;
    border: 1px solid var(--sla-danger) !important;
  }

  .sla-oed-logo-box img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  .sla-oed-title {
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: clamp(20px, 2.6vw, 26px) !important;
    font-weight: 900 !important;
    letter-spacing: -0.02em !important;
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    margin: 0 !important;
    line-height: 1.15 !important;
  }

  .sla-oed-url-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    margin-bottom: 16px !important;
  }

  .sla-oed-url-text {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--sla-accent) !important;
    -webkit-text-fill-color: var(--sla-accent) !important;
    word-break: break-all !important;
  }

  .sla-oed-url-text[data-flagged="true"] {
    color: var(--sla-danger-soft) !important;
    -webkit-text-fill-color: var(--sla-danger-soft) !important;
  }

  html body button.sla-oed-copy-pill {
    all: unset !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 9px 18px !important;
    border-radius: 999px !important;
    background: var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: "JetBrains Mono", Inter, monospace !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
  }

  .sla-oed-stats-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 10px !important;
    margin-bottom: 14px !important;
  }

  @media (max-width: 600px) {
    .sla-oed-stats-grid {
      grid-template-columns: repeat(2, 1fr) !important;
    }
  }

  .sla-oed-stat-card {
    background: rgba(13, 20, 36, 0.85) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
    border-radius: 14px !important;
    padding: 13px 14px !important;
    box-sizing: border-box !important;
  }

  .sla-oed-stat-label {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: var(--sla-text-faint) !important;
    margin-bottom: 6px !important;
  }

  .sla-oed-stat-val {
    font-family: Inter, system-ui, sans-serif !important;
    font-size: 20px !important;
    font-weight: 900 !important;
    letter-spacing: -0.02em !important;
    color: var(--sla-white) !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
  }

  /* Single Dropdown Menu Replacing the 3 View Buttons (CONSUMER / DEVELOPER / B2B PROVIDER) */
  .sla-oed-view-dropdown-wrap {
    position: relative !important;
    width: 100% !important;
    margin-bottom: 14px !important;
    box-sizing: border-box !important;
    z-index: 30 !important;
  }

  html body button.sla-oed-view-dropdown-trigger {
    all: unset !important;
    box-sizing: border-box !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding: 12px 18px !important;
    background: rgba(15, 22, 38, 0.96) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.35) !important;
    border-radius: 14px !important;
    box-shadow: 0 8px 24px rgba(var(--sla-black-rgb), 0.45) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: "JetBrains Mono", Inter, monospace !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    user-select: none !important;
    transition: border-color 0.15s ease, background-color 0.15s ease !important;
  }

  html body button.sla-oed-view-dropdown-trigger:hover {
    border-color: var(--sla-accent) !important;
    background: rgba(20, 29, 49, 0.98) !important;
  }

  .sla-oed-view-trigger-left {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
  }

  .sla-oed-view-trigger-chevron {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 14px !important;
    height: 14px !important;
    color: var(--sla-black) !important;
    transition: transform 0.18s ease !important;
  }

  html body button.sla-oed-view-dropdown-trigger[aria-expanded="true"] .sla-oed-view-trigger-chevron {
    transform: rotate(180deg) !important;
  }

  .sla-oed-view-dropdown-menu {
    position: absolute !important;
    top: calc(100% + 6px) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    background: #101728 !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.35) !important;
    border-radius: 14px !important;
    box-shadow: 0 18px 50px rgba(var(--sla-black-rgb), 0.88) !important;
    padding: 6px !important;
    margin: 0 !important;
    list-style: none !important;
    display: none !important;
    flex-direction: column !important;
    gap: 2px !important;
    box-sizing: border-box !important;
    z-index: 60 !important;
  }

  .sla-oed-view-dropdown-menu[data-open="true"] {
    display: flex !important;
  }

  html body button.sla-oed-view-dropdown-option {
    all: unset !important;
    box-sizing: border-box !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 11px 14px !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: "JetBrains Mono", Inter, monospace !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: background-color 0.14s ease, color 0.14s ease !important;
  }

  html body button.sla-oed-view-dropdown-option:hover {
    background: rgba(var(--sla-accent-rgb), 0.12) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
  }

  html body button.sla-oed-view-dropdown-option[data-selected="true"] {
    background: rgba(var(--sla-accent-rgb), 0.18) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-accent) !important;
    font-weight: 900 !important;
  }

  .sla-oed-receipt-card {
    background: rgba(6, 22, 26, 0.55) !important;
    border: 1px solid rgba(var(--sla-positive-rgb), 0.38) !important;
    border-radius: 16px !important;
    padding: 16px 18px !important;
    margin-bottom: 14px !important;
    box-sizing: border-box !important;
  }

  .sla-oed-receipt-card[data-flagged="true"] {
    background: rgba(42, 10, 18, 0.68) !important;
    border: 1px solid rgba(var(--sla-danger-rgb), 0.55) !important;
  }

  .sla-oed-receipt-top {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
    margin-bottom: 8px !important;
  }

  .sla-oed-receipt-title {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: var(--sla-positive) !important;
  }

  .sla-oed-receipt-title[data-flagged="true"] {
    color: var(--sla-danger) !important;
  }

  .sla-oed-receipt-grade {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    color: var(--sla-accent) !important;
  }

  .sla-oed-receipt-grade[data-flagged="true"] {
    color: var(--sla-danger-soft) !important;
  }

  .sla-oed-receipt-desc {
    font-size: 13.5px !important;
    line-height: 1.5 !important;
    color: var(--sla-text-2) !important;
    margin: 0 0 14px 0 !important;
  }

  .sla-oed-receipt-subgrid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
  }

  @media (max-width: 600px) {
    .sla-oed-receipt-subgrid {
      grid-template-columns: 1fr !important;
    }
  }

  .sla-oed-subbox {
    background: rgba(9, 15, 28, 0.88) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.07) !important;
    border-radius: 12px !important;
    padding: 11px 13px !important;
  }

  .sla-oed-subbox-label {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 9.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: var(--sla-text-faint) !important;
    margin-bottom: 4px !important;
  }

  .sla-oed-subbox-val {
    font-family: Inter, system-ui, sans-serif !important;
    font-size: 14.5px !important;
    font-weight: 900 !important;
  }

  .sla-oed-ladder-card {
    background: rgba(11, 17, 30, 0.8) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
    border-radius: 16px !important;
    padding: 16px 18px !important;
    margin-bottom: 14px !important;
    box-sizing: border-box !important;
  }

  .sla-oed-ladder-title {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: var(--sla-text-muted) !important;
    margin-bottom: 4px !important;
  }

  .sla-oed-ladder-sub {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    color: var(--sla-accent) !important;
    margin-bottom: 12px !important;
  }

  .sla-oed-ladder-grid {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 8px !important;
  }

  @media (max-width: 600px) {
    .sla-oed-ladder-grid {
      grid-template-columns: repeat(2, 1fr) !important;
    }
  }

  .sla-oed-rank-cell {
    background: rgba(8, 13, 25, 0.92) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
    border-radius: 12px !important;
    padding: 10px 8px !important;
    text-align: center !important;
    cursor: pointer !important;
    user-select: none !important;
  }

  .sla-oed-rank-cell[data-selected="true"] {
    border: 1.5px solid var(--sla-positive) !important;
    background: rgba(var(--sla-positive-rgb), 0.14) !important;
  }

  .sla-oed-rank-num {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    color: var(--sla-text-faint) !important;
    margin-bottom: 4px !important;
  }

  .sla-oed-rank-cell[data-selected="true"] .sla-oed-rank-num {
    color: var(--sla-positive) !important;
  }

  .sla-oed-rank-stake {
    font-family: Inter, system-ui, sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 900 !important;
    color: var(--sla-white) !important;
  }

  .sla-oed-bottom-actions {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
  }

  html body button.sla-oed-full-pill {
    all: unset !important;
    box-sizing: border-box !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 13px 20px !important;
    border-radius: 999px !important;
    background: var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: "JetBrains Mono", Inter, monospace !important;
    font-size: 11.5px !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    text-align: center !important;
    cursor: pointer !important;
  }

/* ---- style#sla-top10-7col-header-align ---- */
html body #sla-spotify-top10-view .sla-sp-col-headers,
  html body #sla-spotify-top10-view .sla-sp-thead,
  html body #sla-spotify-top10-view .sla-sp-header-7col,
  html body #sla-spotify-top10-view .sla-sp-track {
    display: grid !important;
    grid-template-columns: 32px minmax(200px, 1.35fr) minmax(175px, 1.1fr) 86px 64px 164px 248px !important;
    gap: 14px !important;
    align-items: center !important;
    padding: 8px 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  html body #sla-spotify-top10-view .sla-sp-col-headers > *,
  html body #sla-spotify-top10-view .sla-sp-header-7col > * {
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: var(--sla-text-faint) !important;
    white-space: nowrap !important;
  }
  html body #sla-spotify-top10-view .sla-sp-col-headers > .sla-sp-th-outbid,
  html body #sla-spotify-top10-view .sla-sp-header-7col > .sla-sp-th-outbid {
    grid-column: 6 / 7 !important;
    color: var(--sla-positive) !important;
    text-align: center !important;
  }
  html body #sla-spotify-top10-view .sla-sp-col-headers > *:last-child,
  html body #sla-spotify-top10-view .sla-sp-header-7col > *:last-child {
    grid-column: 7 / 8 !important;
    text-align: center !important;
  }
  @media (max-width: 1140px) {
    html body #sla-spotify-top10-view .sla-sp-col-headers,
    html body #sla-spotify-top10-view .sla-sp-thead,
    html body #sla-spotify-top10-view .sla-sp-header-7col,
    html body #sla-spotify-top10-view .sla-sp-track {
      grid-template-columns: 28px minmax(160px, 1.2fr) minmax(140px, 1fr) 74px 56px 148px 224px !important;
      gap: 10px !important;
    }
  }

/* ---- /styles.css?v=1794290989983 ---- */
:root {
  --mm-bg: #0B0D13;
  --mm-card: #12151E;
  --mm-card-hover: #181C28;
  --mm-well: #07080C;
  --mm-border: var(--sla-border);
  --usdc-blue: var(--sla-accent-strong);
  --usdc-blue-hover: #64BEFF;
  --mm-orange: var(--sla-warning-alt);
  --mm-green: var(--sla-positive-bright);
  --mm-text-white: var(--sla-white);
  --mm-text-body: #E6E8EC;
  --mm-text-muted: var(--sla-gray-ink);
}

* {
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
  background-color: var(--mm-bg) !important;
  color: var(--mm-text-white) !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  scroll-behavior: smooth;
}

/* Base Headings */
h1, h2, h3, h4, .font-horizon, .font-serif-editorial, .mm-display {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Arial Black', sans-serif !important;
  font-weight: 900 !important;
  -webkit-text-stroke: 0px transparent !important;
  letter-spacing: -0.03em !important;
  line-height: 1.08 !important;
  color: var(--sla-white) !important;
}

.font-mono-code {
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace !important;
}

/* Full-Width Single-Column Mega Headlines (Scaled 20% Smaller) */
.sla-mega-title {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  columns: auto !important;
  column-count: 1 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Arial Black', sans-serif !important;
  font-size: clamp(43px, 5.1vw, 73.6px) !important;
  font-weight: 900 !important;
  -webkit-text-stroke: 0px transparent !important;
  line-height: 1.0 !important;
  letter-spacing: -0.035em !important;
  text-transform: uppercase !important;
  color: var(--sla-white) !important;
}

/* Section & Card Kickers (Orange #F6851B) */
.sla-section-kicker {
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: var(--mm-orange) !important;
}

.sla-card-kicker {
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace !important;
  font-size: clamp(13px, 1.15vw, 14.4px) !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  color: var(--mm-orange) !important;
  text-align: center !important;
  margin-bottom: 12px !important;
}

/* Centered 20%-Scaled Ultra-Bold Card Headers */
.sla-card-title {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Arial Black', sans-serif !important;
  font-size: clamp(30.4px, 2.88vw, 41.6px) !important;
  line-height: 1.05 !important;
  font-weight: 900 !important;
  letter-spacing: -0.03em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  color: var(--sla-white) !important;
  margin-bottom: 12px !important;
}

/* Centered Circle USDC Blue Prices & Subtitles */
.sla-price-stack {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  margin: 24px 0 !important;
}

.sla-price-value {
  display: block !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Arial Black', sans-serif !important;
  font-size: clamp(38px, 3.6vw, 52px) !important;
  line-height: 1.02 !important;
  font-weight: 900 !important;
  letter-spacing: -0.03em !important;
  color: var(--usdc-blue) !important;
  text-align: center !important;
}

.sla-price-sub {
  display: block !important;
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: var(--mm-text-muted) !important;
  text-align: center !important;
  margin-top: 8px !important;
}

/* Standardized Body Copy */
.sla-body-copy {
  font-size: clamp(16px, 1.15vw, 18px) !important;
  font-weight: 500 !important;
  line-height: 1.625 !important;
  color: var(--mm-text-body) !important;
}

/* AGENTSLA Brand Mark in Navbar */
.agentsla-brand-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  -webkit-text-stroke: 0px transparent !important;
  letter-spacing: 0.08em !important;
  color: var(--sla-white) !important;
  text-decoration: none !important;
  transition: opacity 0.15s ease;
}

.agentsla-brand-pill:hover {
  background: transparent !important;
  color: var(--sla-white) !important;
  opacity: 0.9;
}

/* 3-Horizontal-Line Menu Button (NO Circle Outline Border) */
.sla-menu-wrap {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
}

.sla-menu-trigger {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 6px !important;
  color: var(--sla-white) !important;
  cursor: pointer !important;
  transition: color 0.15s ease, opacity 0.15s ease !important;
}

.sla-menu-trigger:hover,
.sla-menu-trigger[aria-expanded="true"] {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: var(--usdc-blue) !important;
}

.sla-dropdown-panel {
  position: absolute !important;
  top: calc(100% + 12px) !important;
  right: 0 !important;
  width: 250px !important;
  background-color: #12151E !important;
  border: 1.5px solid #2E364F !important;
  border-radius: 22px !important;
  padding: 14px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  box-shadow: 0 20px 48px rgba(var(--sla-black-rgb), 0.85) !important;
  z-index: 100 !important;
}

.sla-dropdown-panel.hidden {
  display: none !important;
}

/* 2-Line Credential Badge (Stays Strictly Inside Verified Protocol Credential Card) */
.sla-credential-seal-2line {
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  background-color: #0B0C0E !important;
  border: 1px solid #3B4046 !important;
  border-radius: 16px !important;
  padding: 7px 14px !important;
  max-width: 100% !important;
  flex-shrink: 0 !important;
  text-align: center !important;
}

.sla-seal-line1 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  color: var(--sla-white) !important;
  line-height: 1.2 !important;
}

.sla-seal-line2 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  color: var(--mm-green) !important;
  line-height: 1.2 !important;
  margin-top: 3px !important;
  white-space: nowrap !important;
}

/* 60-Second Live Verification Countdown Bar */
.sla-countdown-box {
  background-color: #090B10 !important;
  border: 1px solid var(--sla-border) !important;
  border-radius: 14px !important;
  padding: 10px 14px !important;
  margin-bottom: 20px !important;
}

.sla-countdown-track {
  width: 100% !important;
  height: 6px !important;
  background-color: #161A26 !important;
  border-radius: 9999px !important;
  overflow: hidden !important;
  margin-top: 7px !important;
}

.sla-countdown-fill {
  height: 100% !important;
  background: linear-gradient(90deg, var(--sla-accent-strong) 0%, var(--sla-positive-bright) 100%) !important;
  border-radius: 9999px !important;
  transition: width 0.95s linear !important;
}

/* Crisp Footer Brand Title */
.sla-footer-brand {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  -webkit-text-stroke: 0px transparent !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--sla-white) !important;
  margin-bottom: 6px !important;
}

.mm-nav, .editorial-nav {
  background-color: rgba(11, 13, 19, 0.94) !important;
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--mm-border) !important;
}

.sla-card {
  background-color: var(--mm-card) !important;
  border: 1px solid var(--mm-border) !important;
  border-radius: 20px !important;
  padding: 28px !important;
  color: var(--sla-white) !important;
  box-shadow: 0 12px 32px rgba(var(--sla-black-rgb), 0.5) !important;
  transition: border-color 0.16s ease, transform 0.16s ease;
}

.sla-card:hover {
  border-color: var(--usdc-blue) !important;
}

.sla-card-featured, .sla-card-obsidian {
  background-color: #141824 !important;
  border: 2px solid var(--usdc-blue) !important;
  border-radius: 20px !important;
  padding: 28px !important;
  color: var(--sla-white) !important;
  box-shadow: 0 16px 40px rgba(var(--sla-accent-strong-rgb), 0.16) !important;
  overflow: hidden !important;
}

/* Pill URL Badges */
.sla-url-badge {
  display: block;
  width: 100%;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--usdc-blue) !important;
  background-color: var(--mm-well) !important;
  border: 1px solid var(--mm-border) !important;
  padding: 9px 16px !important;
  border-radius: 9999px !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
  transition: all 0.15s ease;
}

.sla-url-badge:hover {
  border-color: var(--usdc-blue) !important;
  color: var(--sla-white) !important;
}

/* ALL BUTTONS FORCED TO PILLS (border-radius: 9999px) */
button, .btn-mm-orange, .btn-mm-secondary, .btn-obsidian, .btn-ivory {
  border-radius: 9999px !important;
}

.btn-mm-orange, .btn-obsidian {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background-color: var(--usdc-blue) !important;
  color: #07080C !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-weight: 700 !important;
  -webkit-text-stroke: 0px transparent !important;
  font-size: 13.5px !important;
  letter-spacing: 0.01em !important;
  padding: 12px 24px !important;
  border-radius: 9999px !important;
  border: none !important;
  cursor: pointer;
  text-decoration: none !important;
  box-shadow: 0 6px 20px rgba(var(--sla-accent-strong-rgb), 0.3) !important;
  transition: background-color 0.15s ease, transform 0.15s ease;
}

.btn-mm-orange:hover, .btn-obsidian:hover {
  background-color: var(--usdc-blue-hover) !important;
  transform: translateY(-1px);
}

.btn-mm-secondary, .btn-ivory {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background-color: var(--sla-border-2) !important;
  color: var(--sla-white) !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  padding: 12px 24px !important;
  border-radius: 9999px !important;
  border: 1px solid #36405A !important;
  cursor: pointer;
  text-decoration: none !important;
  transition: all 0.15s ease;
}

.btn-mm-secondary:hover, .btn-ivory:hover {
  background-color: #242C42 !important;
  border-color: var(--usdc-blue) !important;
}

input, select {
  background-color: var(--mm-well) !important;
  color: var(--sla-white) !important;
  border: 1px solid var(--mm-border) !important;
  border-radius: 9999px !important;
  font-weight: 600 !important;
}

input::placeholder {
  color: var(--mm-text-muted) !important;
}

input:focus, select:focus {
  border-color: var(--usdc-blue) !important;
  outline: none !important;
}

#sla-toast {
  position: fixed;
  bottom: 24px;
  right: 24px;
  background-color: var(--mm-well);
  color: var(--sla-white);
  border: 2px solid var(--usdc-blue);
  padding: 12px 22px;
  border-radius: 9999px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  font-weight: 800;
  box-shadow: 0 16px 36px rgba(var(--sla-black-rgb), 0.85);
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
  transition: all 0.2s ease;
  z-index: 9999;
}

#sla-toast.show {
  opacity: 1;
  transform: translateY(0);
}


/* FAQ Accordion & Tie-Breaker Callout Styles */
.sla-faq-item {
  background-color: var(--mm-card) !important;
  border: 1px solid var(--mm-border) !important;
  border-radius: 20px !important;
  padding: 22px 26px !important;
  transition: border-color 0.16s ease !important;
}

.sla-faq-item:hover,
.sla-faq-item[open] {
  border-color: var(--usdc-blue) !important;
}

.sla-faq-summary {
  list-style: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  cursor: pointer !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-size: clamp(17px, 1.35vw, 20px) !important;
  font-weight: 800 !important;
  color: var(--sla-white) !important;
  line-height: 1.35 !important;
}

.sla-faq-summary::-webkit-details-marker {
  display: none !important;
}

.sla-faq-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 9999px !important;
  background-color: var(--sla-border-2) !important;
  border: 1px solid #36405A !important;
  color: var(--usdc-blue) !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  flex-shrink: 0 !important;
  transition: transform 0.2s ease, background-color 0.2s ease !important;
}

.sla-faq-item[open] .sla-faq-pill {
  transform: rotate(45deg) !important;
  background-color: var(--usdc-blue) !important;
  color: #07080C !important;
}


/* White Outline on Search Bubble & Hero Title Width Lock */
#hero-search-input,
#dir-search-input,
.sla-search-input {
  border: 1.5px solid var(--sla-white) !important;
}

#hero-search-input:focus,
#dir-search-input:focus,
.sla-search-input:focus {
  border-color: var(--sla-white) !important;
  box-shadow: 0 0 0 2px rgba(var(--sla-white-rgb), 0.2) !important;
}

.sla-hero-title-locked {
  max-width: 42rem !important;
  width: 100% !important;
}


/* Orange Bubbles (#F6851B) for PROTOCOL TRANSPARENCY / FAQs Section */
.btn-faq-orange {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background-color: var(--sla-warning-alt) !important;
  color: #07080C !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-weight: 800 !important;
  font-size: 12px !important;
  letter-spacing: 0.01em !important;
  padding: 10px 24px !important;
  border-radius: 9999px !important;
  border: 1px solid var(--sla-warning-alt) !important;
  cursor: pointer !important;
  text-decoration: none !important;
  box-shadow: 0 6px 20px rgba(var(--sla-warning-alt-rgb), 0.28) !important;
  transition: background-color 0.15s ease, transform 0.15s ease !important;
}

.btn-faq-orange:hover {
  background-color: #FF9838 !important;
  transform: translateY(-1px) !important;
}

.btn-faq-secondary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background-color: var(--sla-border-2) !important;
  color: var(--sla-white) !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-weight: 800 !important;
  font-size: 12px !important;
  padding: 10px 24px !important;
  border-radius: 9999px !important;
  border: 1px solid var(--sla-warning-alt) !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
}

.btn-faq-secondary:hover {
  background-color: var(--sla-warning-alt) !important;
  color: #07080C !important;
}

#faqs .sla-faq-item:hover,
#faqs .sla-faq-item[open] {
  border-color: var(--sla-warning-alt) !important;
}

#faqs .sla-faq-pill {
  background-color: var(--sla-border-2) !important;
  border: 1.5px solid var(--sla-warning-alt) !important;
  color: var(--sla-warning-alt) !important;
}

#faqs .sla-faq-item[open] .sla-faq-pill {
  background-color: var(--sla-warning-alt) !important;
  border-color: var(--sla-warning-alt) !important;
  color: #07080C !important;
}

/* === MOBILE RESPONSIVE SUITE START === */
html, body {
  overflow-x: hidden !important;
  max-width: 100vw !important;
  -webkit-text-size-adjust: 100% !important;
}

img, svg, pre, code {
  max-width: 100% !important;
}

pre {
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

/* Tablet & Mobile Adjustments (<= 768px) */
@media (max-width: 768px) {
  .sla-mega-title {
    font-size: clamp(30px, 7.8vw, 46px) !important;
    line-height: 1.04 !important;
    letter-spacing: -0.03em !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
  }

  .sla-hero-title-locked {
    max-width: 100% !important;
  }

  .sla-card-title {
    font-size: clamp(24px, 6vw, 32px) !important;
    line-height: 1.08 !important;
  }

  .sla-price-value {
    font-size: clamp(32px, 8vw, 42px) !important;
  }

  .sla-card,
  .sla-card-featured,
  .sla-card-obsidian {
    padding: 20px !important;
    border-radius: 18px !important;
  }

  .sla-dropdown-panel {
    width: min(270px, calc(100vw - 28px)) !important;
    right: 0 !important;
  }

  .sla-faq-item {
    padding: 18px 20px !important;
  }

  .sla-faq-summary {
    font-size: 16px !important;
    align-items: flex-start !important;
  }
}

/* Smartphone Adjustments (<= 640px) */
@media (max-width: 640px) {
  /* Prevent iOS Safari from auto-zooming when tapping search bars or inputs */
  input, select, textarea {
    font-size: 16px !important;
  }

  .sla-mega-title {
    font-size: clamp(27px, 8.2vw, 36px) !important;
    line-height: 1.06 !important;
  }

  .sla-section-kicker {
    font-size: 11px !important;
    letter-spacing: 0.08em !important;
    line-height: 1.4 !important;
  }

  .sla-body-copy {
    font-size: 15px !important;
    line-height: 1.58 !important;
  }

  .btn-mm-orange,
  .btn-mm-secondary,
  .btn-obsidian,
  .btn-ivory {
    min-height: 44px !important;
    padding: 11px 18px !important;
    font-size: 13px !important;
  }

  .sla-credential-seal-2line {
    width: 100% !important;
    margin-top: 6px !important;
    padding: 8px 12px !important;
  }

  .sla-countdown-box {
    padding: 10px 12px !important;
  }

  .sla-countdown-box > div:first-child {
    font-size: 10px !important;
    gap: 6px !important;
  }

  /* Center toast on mobile screens so it never clips off-screen */
  #sla-toast {
    left: 16px !important;
    right: 16px !important;
    bottom: 16px !important;
    text-align: center !important;
    justify-content: center !important;
  }

  /* Scrollable Checkout Modal on small phone screens */
  #usdc-checkout-modal > div {
    max-height: 90vh !important;
    overflow-y: auto !important;
    padding: 20px !important;
    margin: 8px !important;
  }
}
/* === MOBILE RESPONSIVE SUITE END === */

/* === SLA-PHASE2-SPEED-RULES-START === */
html, html body {
  opacity: 1 !important;
  visibility: visible !important;
}

/* Skip layout & paint for off-screen Top 10 category charts (cards #3+) until scrolled near viewport */
html body #sla-spotify-top10-view .sla-sp-chart-card:nth-child(n+3) {
  content-visibility: auto;
  contain-intrinsic-size: auto 640px;
}

/* Skip layout & paint for off-screen Directory cards (cards #10+) until scrolled near viewport */
html body #sla-main-directory-grid > *:nth-child(n+10) {
  content-visibility: auto;
  contain-intrinsic-size: auto 320px;
}
/* === SLA-PHASE2-SPEED-RULES-END === */
/* === SLA-UNIVERSAL-WHITE-CLOSE-X-START === */
/* 1. Keep modal close buttons in their exact modal header flow while stripping the blue circle */
  html body #sla-faq-modal-close:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body #sla-legal-modal-close:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body #sla-credential-modal-close:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body button[data-sla-modal-close-x="1"]:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body [data-sla-modal-close-x="1"]:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-color: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    padding: 0 !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
  }

  html body [data-sla-modal-close-x="1"] svg,
  html body [data-sla-modal-close-x="1"] svg * {
    stroke: var(--sla-white) !important;
    color: var(--sla-white) !important;
  }

  /* 2. Ensure all links inside the hamburger menu (including "Launch Console") are crisp white unless they are the sky-blue CONNECT WALLET pill */
  html body [id*="hamburger"] a:not([class*="bg-sky"]):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body [id*="mobile-menu"] a:not([class*="bg-sky"]):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body [class*="hamburger-menu"] a:not([class*="bg-sky"]):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
  }
/* === SLA-UNIVERSAL-WHITE-CLOSE-X-END === */

/* === SLA-FOOTER-EMAIL-LINE-START === */
html body #sla-footer-email-line,
html body .sla-footer-email-line {
  display: block !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  color: var(--sla-text-3) !important;
  margin-top: 8px !important;
  margin-bottom: 4px !important;
  letter-spacing: 0.01em !important;
}
html body #sla-footer-email-line a,
html body .sla-footer-email-line a {
  color: inherit !important;
  text-decoration: none !important;
}
html body #sla-footer-email-line a:hover,
html body .sla-footer-email-line a:hover {
  color: var(--sla-white) !important;
}
/* === SLA-FOOTER-EMAIL-LINE-END === */
/* === SLA-HERO-AND-CORNER-FIX-START === */
/* A. Hide stray bottom-right toast & floating corner artifacts by default */
  html body #toast:not([data-sla-toast-active="1"]),
  html body #sla-copy-toast:not([data-sla-toast-active="1"]),
  html body #sla-clipboard-toast:not([data-sla-toast-active="1"]),
  html body [id*="toast"]:not([data-sla-toast-active="1"]),
  html body [class*="toast"]:not([data-sla-toast-active="1"]),
  html body [data-sla-stray-corner-hidden="1"] {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  html body [data-sla-toast-active="1"] {
    display: inline-flex !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* B. Pre-lock Hero Search Input & Row at 0ms so it never flashes full-width (Screenshot 113808_2) before settling (Screenshot 114124) */
  html body main section:first-of-type input[placeholder*="Search verified APIs"],
  html body section input[placeholder*="Search verified APIs"] {
    width: 380px !important;
    max-width: min(380px, 62vw) !important;
    min-width: 240px !important;
    flex: 0 1 380px !important;
  }

  html body [data-sla-hero-search-row="1"] {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    width: 100% !important;
  }
/* === SLA-HERO-AND-CORNER-FIX-END === */
/* === SLA-DIR-AND-LOGO-LOCK-START === */
/* 1. Prevent the Directory filter bar from showing the orphan floating magnifying glass icon (Screenshot 114708) */
  html body input[placeholder*="Filter 21,026"] ~ svg,
  html body input[placeholder*="Filter "] ~ svg,
  html body div:has(> input[placeholder*="Filter "]) ~ svg,
  html body [data-sla-orphan-search-icon="1"] {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /* 2. Lock the Directory search/filter bar row from 0ms so it doesn't shift while loading */
  html body div:has(> div > input[placeholder*="Filter "]),
  html body [data-sla-dir-filter-row="1"] {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  html body div:has(> input[placeholder*="Filter "]),
  html body [data-sla-dir-input-wrap="1"] {
    flex: 1 1 auto !important;
    max-width: 100% !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
  }
/* === SLA-DIR-AND-LOGO-LOCK-END === */
/* === SLA-CDM-LIVE-MODAL-START === */
#sla-live-dossier-backdrop,
#sla-live-dossier-modal-backdrop,
#sla-hero-dossier-modal-backdrop,
#sla-hero-dossier-modal-backdrop,
#sla-universal-dossier-backdrop,
#sla-orientation-exact-dossier-backdrop {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

#sla-cdm-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483646 !important;
  background: rgba(3, 7, 16, 0.84) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 18px !important;
  box-sizing: border-box !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

#sla-cdm-overlay[data-cdm-open="true"] {
  display: flex !important;
}

.sla-cdm-card {
  position: relative !important;
  width: 100% !important;
  max-width: min(590px, calc(100vw - 28px)) !important;
  max-height: calc(100dvh - 32px) !important;
  margin: auto !important;
  background: #060b14 !important;
  border: 1px solid rgba(var(--sla-accent-rgb), 0.18) !important;
  border-radius: 20px !important;
  padding: 20px 22px !important;
  color: var(--sla-text) !important;
  box-shadow: 0 28px 80px rgba(var(--sla-black-rgb), 0.86) !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  box-sizing: border-box !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

.sla-cdm-topbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 12px !important;
}

.sla-cdm-kicker {
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  color: var(--sla-warning) !important;
  text-transform: uppercase !important;
}

.sla-cdm-close {
  background: transparent !important;
  border: none !important;
  color: var(--sla-text-2) !important;
  font-size: 20px !important;
  line-height: 1 !important;
  padding: 4px 6px !important;
  cursor: pointer !important;
}

.sla-cdm-brand-row {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 10px !important;
}

.sla-cdm-logo-wrap {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--sla-surface-slate) !important;
  border: 1px solid rgba(var(--sla-text-muted-rgb), 0.18) !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
}

.sla-cdm-logo-wrap[data-white-bg="true"] {
  background: var(--sla-white) !important;
  padding: 4px !important;
}

.sla-cdm-logo-wrap img,
.sla-cdm-logo-wrap svg {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  display: block !important;
}

.sla-cdm-title {
  margin: 0 !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em !important;
  color: var(--sla-white) !important;
}

.sla-cdm-url-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin-bottom: 14px !important;
}

.sla-cdm-url-link {
  color: var(--sla-accent) !important;
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 12.5px !important;
  text-decoration: none !important;
  word-break: break-all !important;
}

.sla-cdm-url-link:hover {
  text-decoration: underline !important;
}

.sla-cdm-copy-icon-btn {
  background: transparent !important;
  border: none !important;
  color: var(--sla-white) !important;
  padding: 4px !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

/* SCALED-DOWN TOP 4 METRIC BOXES ("CATEGORY RANK", "ACTIVE STAKE", "SLA UPTIME", "EDGE SPEED") */
.sla-cdm-stats-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
  margin-bottom: 12px !important;
  box-sizing: border-box !important;
}

.sla-cdm-stat-box {
  background: #0b111e !important;
  border: 1px solid rgba(var(--sla-text-muted-rgb), 0.14) !important;
  border-radius: 12px !important;
  padding: 9px 11px !important;
  min-width: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.sla-cdm-stat-label {
  font-size: 8.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  color: var(--sla-text-faint) !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  margin-bottom: 4px !important;
}

.sla-cdm-stat-val {
  font-size: 13.5px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  color: var(--sla-white) !important;
  white-space: nowrap !important;
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
}

.sla-cdm-uptime-dot {
  width: 7px !important;
  height: 7px !important;
  min-width: 7px !important;
  border-radius: 9999px !important;
  background: var(--sla-positive) !important;
  display: inline-block !important;
}

/* CLEAN ISOLATED ROLE DROPDOWN ("CONSUMER" / "DEVELOPER" / "B2B PROVIDER") */
.sla-cdm-dd-wrap {
  position: relative !important;
  display: inline-block !important;
  margin-bottom: 12px !important;
  z-index: 30 !important;
}

.sla-cdm-dd-pill {
  height: 32px !important;
  padding: 0 14px !important;
  border-radius: 9999px !important;
  background: var(--sla-accent-strong) !important;
  color: #050c18 !important;
  border: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}

.sla-cdm-dd-menu {
  position: absolute !important;
  top: calc(100% + 6px) !important;
  left: 0 !important;
  min-width: 196px !important;
  background: #0b1220 !important;
  border: 1px solid rgba(var(--sla-accent-strong-rgb), 0.4) !important;
  border-radius: 12px !important;
  padding: 5px !important;
  box-shadow: 0 16px 38px rgba(var(--sla-black-rgb), 0.78) !important;
  display: none !important;
  flex-direction: column !important;
  gap: 3px !important;
  z-index: 60 !important;
}

.sla-cdm-dd-menu[data-open="true"] {
  display: flex !important;
}

.sla-cdm-dd-item {
  width: 100% !important;
  padding: 8px 11px !important;
  border-radius: 8px !important;
  background: transparent !important;
  border: none !important;
  color: var(--sla-text-2) !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  cursor: pointer !important;
  text-align: left !important;
}

.sla-cdm-dd-item:hover {
  background: rgba(var(--sla-accent-strong-rgb), 0.14) !important;
  color: var(--sla-white) !important;
}

.sla-cdm-dd-item[data-active="true"] {
  background: rgba(var(--sla-accent-strong-rgb), 0.22) !important;
  color: var(--sla-accent-strong) !important;
}

/* ROLE CONTENT RECEIPT CARD */
.sla-cdm-receipt {
  background: rgba(var(--sla-positive-rgb), 0.05) !important;
  border: 1px solid rgba(var(--sla-positive-rgb), 0.28) !important;
  border-radius: 14px !important;
  padding: 14px 16px !important;
  margin-bottom: 12px !important;
  display: block !important;
  box-sizing: border-box !important;
}

.sla-cdm-receipt-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-bottom: 8px !important;
}

.sla-cdm-receipt-kicker {
  font-size: 9.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  color: var(--sla-positive) !important;
  text-transform: uppercase !important;
}

.sla-cdm-receipt-badge {
  font-size: 9.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  color: var(--sla-accent) !important;
  text-transform: uppercase !important;
}

.sla-cdm-receipt-body {
  margin: 0 0 12px 0 !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  color: var(--sla-text-3) !important;
}

.sla-cdm-receipt-subgrid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
}

.sla-cdm-subcard {
  background: #070c16 !important;
  border: 1px solid rgba(var(--sla-text-muted-rgb), 0.13) !important;
  border-radius: 10px !important;
  padding: 9px 11px !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

.sla-cdm-sublabel {
  font-size: 8px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  color: var(--sla-text-faint) !important;
  text-transform: uppercase !important;
  margin-bottom: 3px !important;
  white-space: nowrap !important;
}

.sla-cdm-subval {
  font-size: 12.5px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

.sla-cdm-pre {
  margin: 6px 0 0 0 !important;
  padding: 11px 12px !important;
  background: #040811 !important;
  border: 1px solid rgba(var(--sla-text-muted-rgb), 0.14) !important;
  border-radius: 10px !important;
  color: var(--sla-text-2) !important;
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace !important;
  font-size: 11.5px !important;
  line-height: 1.45 !important;
  overflow-x: auto !important;
}

/* SCALED-DOWN LIVE RANK #1 TO #10 USDC STAKE LADDER */
.sla-cdm-ladder-box {
  background: #0a101d !important;
  border: 1px solid rgba(var(--sla-text-muted-rgb), 0.14) !important;
  border-radius: 14px !important;
  padding: 13px 14px !important;
  margin-bottom: 12px !important;
  box-sizing: border-box !important;
}

.sla-cdm-ladder-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin-bottom: 2px !important;
}

.sla-cdm-ladder-title {
  font-size: 9.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  color: var(--sla-text-muted) !important;
  text-transform: uppercase !important;
}

.sla-cdm-live-pill {
  font-size: 8.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  color: var(--sla-positive) !important;
  white-space: nowrap !important;
}

.sla-cdm-ladder-sub {
  font-size: 9px !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  color: var(--sla-accent-strong) !important;
  text-transform: uppercase !important;
  margin-bottom: 9px !important;
}

.sla-cdm-ladder-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 7px !important;
  width: 100% !important;
}

.sla-cdm-rank-btn {
  background: rgba(var(--sla-surface-slate-rgb), 0.55) !important;
  border: 1px solid rgba(var(--sla-text-muted-rgb), 0.16) !important;
  border-radius: 10px !important;
  padding: 7px 4px !important;
  min-width: 0 !important;
  text-align: center !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  transition: border-color 0.14s ease, background 0.14s ease !important;
}

.sla-cdm-rank-btn:hover {
  border-color: rgba(var(--sla-accent-strong-rgb), 0.5) !important;
}

.sla-cdm-rank-btn[data-selected="true"] {
  background: rgba(var(--sla-positive-rgb), 0.13) !important;
  border-color: var(--sla-positive) !important;
}

.sla-cdm-rank-top {
  font-size: 8px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  color: var(--sla-text-muted) !important;
  white-space: nowrap !important;
  margin-bottom: 2px !important;
}

.sla-cdm-rank-btn[data-selected="true"] .sla-cdm-rank-top {
  color: #34d399 !important;
}

.sla-cdm-rank-price {
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  color: var(--sla-white) !important;
  white-space: nowrap !important;
}

.sla-cdm-actions {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.sla-cdm-cta {
  width: 100% !important;
  height: 40px !important;
  border-radius: 9999px !important;
  background: var(--sla-accent-strong) !important;
  color: #050c18 !important;
  border: none !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}

.sla-cdm-cta:hover {
  filter: brightness(1.06) !important;
}

@media (max-width: 640px) {
  #sla-cdm-overlay { padding: 10px !important; }
  .sla-cdm-card {
    max-width: calc(100vw - 20px) !important;
    max-height: calc(100dvh - 20px) !important;
    padding: 14px 12px !important;
    border-radius: 16px !important;
  }
  .sla-cdm-title { font-size: 17px !important; }
  .sla-cdm-url-link { font-size: 11.5px !important; }
  .sla-cdm-stats-grid { gap: 5px !important; }
  .sla-cdm-stat-box { padding: 7px 5px !important; }
  .sla-cdm-stat-label { font-size: 6.5px !important; letter-spacing: 0.02em !important; }
  .sla-cdm-stat-val { font-size: 10.5px !important; gap: 3px !important; }
  .sla-cdm-receipt { padding: 11px 10px !important; }
  .sla-cdm-receipt-body { font-size: 12px !important; }
  .sla-cdm-receipt-subgrid { gap: 5px !important; }
  .sla-cdm-subcard { padding: 7px 6px !important; }
  .sla-cdm-sublabel { font-size: 6.5px !important; }
  .sla-cdm-subval { font-size: 10px !important; }
  .sla-cdm-ladder-box { padding: 10px 9px !important; }
  .sla-cdm-ladder-grid { gap: 4px !important; }
  .sla-cdm-rank-btn { padding: 6px 2px !important; }
  .sla-cdm-rank-top { font-size: 6.8px !important; }
  .sla-cdm-rank-price { font-size: 8.3px !important; letter-spacing: -0.03em !important; }
}
/* === SLA-CDM-LIVE-MODAL-END === */

/* ---- style#sla-top-nav-lock-css ---- */
html, body {
      overflow-x: clip !important;
    }
    .sla-top-nav-locked {
      position: sticky !important;
      top: 0 !important;
      z-index: 9999 !important;
    }

/* ---- /sla-css-15090d591c.css ---- */
/* Wallet Control Container (Fits 100% inside Hamburger Menu or Header) */
    .sla-wallet-bar {
      display: flex !important;
      flex-direction: column !important;
      align-items: stretch !important;
      justify-content: center !important;
      gap: 6px !important;
      width: 100% !important;
      max-width: 100% !important;
      box-sizing: border-box !important;
      padding: 0 !important;
      margin: 0 !important;
      background: transparent !important;
      border: none !important;
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
      z-index: 10000 !important;
    }
    /* If placed directly in a wide horizontal header bar (outside dropdown menu) */
    .sla-wallet-bar.sla-inline-header {
      width: auto !important;
      flex-direction: row !important;
      align-items: center !important;
    }
    .sla-wb-addr-btn {
      width: 100% !important;
      box-sizing: border-box !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      text-align: center !important;
      gap: 8px !important;
      background: rgba(var(--sla-positive-rgb), 0.12) !important;
      border: 1px solid rgba(var(--sla-positive-rgb), 0.35) !important;
      color: var(--sla-white) !important;
      font-family: 'JetBrains Mono', monospace !important;
      font-size: 12px !important;
      font-weight: 700 !important;
      padding: 11px 16px !important;
      border-radius: 999px !important;
      cursor: pointer !important;
      transition: all 0.15s ease !important;
      line-height: 1.2 !important;
      white-space: nowrap !important;
      margin: 0 !important;
    }
    .sla-wb-addr-btn:hover {
      background: rgba(var(--sla-accent-strong-rgb), 0.16) !important;
      border-color: rgba(var(--sla-accent-strong-rgb), 0.45) !important;
      color: var(--sla-accent-strong) !important;
    }
    .sla-wb-addr-btn.disconnected {
      width: 100% !important;
      box-sizing: border-box !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      text-align: center !important;
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
      background: rgba(var(--sla-accent-strong-rgb), 0.14) !important;
      border: 1px solid rgba(var(--sla-accent-strong-rgb), 0.4) !important;
      color: var(--sla-accent-strong) !important;
      font-size: 13px !important;
      font-weight: 700 !important;
      letter-spacing: 0.02em !important;
      padding: 12px 18px !important;
      border-radius: 999px !important;
    }
    .sla-wb-addr-btn.disconnected:hover {
      background: var(--sla-accent-strong) !important;
      color: #050507 !important;
    }
    .sla-wb-subrow {
      display: grid !important;
      grid-template-columns: 1fr 1fr !important;
      gap: 6px !important;
      width: 100% !important;
      box-sizing: border-box !important;
    }
    .sla-wallet-bar.sla-inline-header .sla-wb-subrow {
      display: inline-flex !important;
      width: auto !important;
    }
    .sla-wb-dot {
      width: 7px !important;
      height: 7px !important;
      border-radius: 999px !important;
      background: var(--sla-positive) !important;
      box-shadow: 0 0 8px var(--sla-positive) !important;
      flex-shrink: 0 !important;
    }
    .sla-wb-dot.off {
      background: var(--sla-accent-strong) !important;
      box-shadow: 0 0 6px var(--sla-accent-strong) !important;
    }
    .sla-wb-action-btn {
      width: 100% !important;
      box-sizing: border-box !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      text-align: center !important;
      gap: 4px !important;
      background: rgba(var(--sla-accent-strong-rgb), 0.12) !important;
      border: 1px solid rgba(var(--sla-accent-strong-rgb), 0.3) !important;
      color: var(--sla-accent-strong) !important;
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
      font-size: 10.5px !important;
      font-weight: 800 !important;
      letter-spacing: 0.04em !important;
      text-transform: uppercase !important;
      padding: 8px 8px !important;
      border-radius: 999px !important;
      cursor: pointer !important;
      transition: all 0.15s ease !important;
      line-height: 1 !important;
      white-space: nowrap !important;
      margin: 0 !important;
    }
    .sla-wb-action-btn:hover {
      background: var(--sla-accent-strong) !important;
      color: #050507 !important;
    }
    .sla-wb-action-btn.danger {
      background: rgba(var(--sla-danger-rgb), 0.12) !important;
      border-color: rgba(var(--sla-danger-rgb), 0.32) !important;
      color: var(--sla-danger-soft) !important;
    }
    .sla-wb-action-btn.danger:hover {
      background: var(--sla-danger) !important;
      color: var(--sla-white) !important;
    }

    /* Full On-Screen Wallet Manager Modal */
    #sla-wallet-modal-backdrop {
      position: fixed !important;
      inset: 0 !important;
      background: rgba(3, 4, 7, 0.84) !important;
      backdrop-filter: blur(12px) !important;
      -webkit-backdrop-filter: blur(12px) !important;
      z-index: 2147483646 !important;
      display: none;
      align-items: center !important;
      justify-content: center !important;
      padding: 16px !important;
    }
    #sla-wallet-modal-backdrop.open {
      display: flex !important;
    }
    .sla-wallet-modal {
      width: 100% !important;
      max-width: 430px !important;
      background: #0B0C10 !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.16) !important;
      border-radius: 20px !important;
      padding: 22px !important;
      box-shadow: 0 30px 80px rgba(var(--sla-black-rgb), 0.92), 0 0 0 1px rgba(var(--sla-accent-strong-rgb), 0.18) !important;
      color: var(--sla-white) !important;
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
    }
    .sla-wm-top {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      margin-bottom: 16px !important;
      padding-bottom: 12px !important;
      border-bottom: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
    }
    .sla-wm-title {
      font-size: 13px !important;
      font-weight: 900 !important;
      letter-spacing: 0.12em !important;
      text-transform: uppercase !important;
      color: var(--sla-warning-alt) !important;
    }
    .sla-wm-close {
      background: rgba(var(--sla-white-rgb), 0.06) !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.12) !important;
      color: var(--sla-gray-400) !important;
      width: 30px !important;
      height: 30px !important;
      border-radius: 999px !important;
      cursor: pointer !important;
      font-size: 14px !important;
      font-weight: 700 !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
    }
    .sla-wm-close:hover {
      color: var(--sla-white) !important;
      background: rgba(var(--sla-white-rgb), 0.16) !important;
    }
    .sla-wm-current-box {
      background: rgba(var(--sla-white-rgb), 0.03) !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
      border-radius: 14px !important;
      padding: 14px !important;
      margin-bottom: 14px !important;
    }
    .sla-wm-badge {
      display: inline-flex !important;
      align-items: center !important;
      gap: 6px !important;
      font-size: 10px !important;
      font-weight: 800 !important;
      letter-spacing: 0.12em !important;
      text-transform: uppercase !important;
      color: var(--sla-positive) !important;
      margin-bottom: 6px !important;
    }
    .sla-wm-badge.off {
      color: var(--sla-warning-alt) !important;
    }
    .sla-wm-full-address {
      font-family: 'JetBrains Mono', monospace !important;
      font-size: 12.5px !important;
      color: var(--sla-white) !important;
      word-break: break-all !important;
      line-height: 1.45 !important;
    }
    .sla-wm-disclaimer-text {
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
      font-size: 12.5px !important;
      font-weight: 400 !important;
      color: var(--sla-gray-300) !important;
      line-height: 1.55 !important;
      letter-spacing: normal !important;
      word-break: normal !important;
      overflow-wrap: break-word !important;
      word-wrap: break-word !important;
      white-space: normal !important;
      hyphens: none !important;
      -webkit-hyphens: none !important;
    }
    #sla-wm-status-msg {
      display: none;
      margin-bottom: 12px !important;
      padding: 10px 12px !important;
      border-radius: 10px !important;
      font-size: 12px !important;
      font-weight: 600 !important;
      line-height: 1.4 !important;
      background: rgba(var(--sla-accent-strong-rgb), 0.14) !important;
      border: 1px solid rgba(var(--sla-accent-strong-rgb), 0.4) !important;
      color: var(--sla-accent-pale) !important;
    }
    #sla-wm-status-msg.warn {
      background: rgba(var(--sla-warning-alt-rgb), 0.16) !important;
      border-color: rgba(var(--sla-warning-alt-rgb), 0.5) !important;
      color: var(--sla-warning-soft) !important;
    }
    .sla-wm-btn-stack {
      display: flex !important;
      flex-direction: column !important;
      gap: 8px !important;
    }
    .sla-wm-modal-btn {
      width: 100% !important;
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 12px 14px !important;
      border-radius: 12px !important;
      font-size: 13px !important;
      font-weight: 700 !important;
      cursor: pointer !important;
      transition: all 0.15s ease !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.12) !important;
      background: rgba(var(--sla-white-rgb), 0.05) !important;
      color: var(--sla-white) !important;
      text-align: left !important;
    }
    .sla-wm-modal-btn * {
      pointer-events: none !important;
    }
    .sla-wm-modal-btn:hover {
      background: rgba(var(--sla-accent-strong-rgb), 0.18) !important;
      border-color: rgba(var(--sla-accent-strong-rgb), 0.5) !important;
      color: var(--sla-accent-strong) !important;
    }
    .sla-wm-modal-btn.primary {
      background: rgba(var(--sla-accent-strong-rgb), 0.16) !important;
      border-color: rgba(var(--sla-accent-strong-rgb), 0.45) !important;
      color: var(--sla-accent-strong) !important;
    }
    .sla-wm-modal-btn.primary:hover {
      background: var(--sla-accent-strong) !important;
      color: #050507 !important;
    }
    .sla-wm-modal-btn.danger {
      background: rgba(var(--sla-danger-rgb), 0.12) !important;
      border-color: rgba(var(--sla-danger-rgb), 0.35) !important;
      color: var(--sla-danger-soft) !important;
    }
    .sla-wm-modal-btn.danger:hover {
      background: var(--sla-danger) !important;
      color: var(--sla-white) !important;
    }
    .sla-wm-subhead {
      font-size: 10px !important;
      font-weight: 800 !important;
      letter-spacing: 0.12em !important;
      text-transform: uppercase !important;
      color: var(--sla-gray-400) !important;
      margin: 14px 0 8px !important;
    }

/* ---- /sla-css-bd7385a398.css ---- */
:root {
      --sla-btn-font: inherit;
      --sla-btn-size: 11.5px;
      --sla-btn-weight: 800;
      --sla-btn-tracking: 0.06em;
      --sla-btn-radius: 999px;
    }

    /* All standard buttons & CTA links: Spotify-minimalist blue pills */
    html body button:not(#_):not(#_):not(.sla-hamburger-only-btn),
    html body input[type="button"]:not(#_):not(#_),
    html body input[type="submit"]:not(#_):not(#_),
    html body [role="button"]:not(#_):not(#_):not(.sla-hamburger-only-btn),
    html body [role="tab"]:not(#_):not(#_),
    html body a.btn:not(#_):not(#_),
    html body a[class*="btn"]:not(#_):not(#_):not(.sla-hamburger-only-btn),
    html body a[class*="button"]:not(#_):not(#_):not(.sla-hamburger-only-btn),
    html body .sla-sp-claim-btn:not(#_):not(#_),
    html body .sla-sp-btn-inspect:not(#_):not(#_),
    html body .sla-sp-btn-escrow:not(#_):not(#_),
    html body #sla-top10-directory-lists-btn:not(#_):not(#_),
    html body #sla-tab-03-top10-btn:not(#_):not(#_),
    html body .sla-forced-blue-btn:not(#_):not(#_):not(.sla-hamburger-only-btn) {
      background: var(--sla-accent) !important;
      background-color: var(--sla-accent) !important;
      background-image: none !important;
      color: #06101e !important;
      border: 1px solid var(--sla-accent) !important;
      font-family: var(--sla-btn-font) !important;
      font-size: var(--sla-btn-size) !important;
      font-weight: var(--sla-btn-weight) !important;
      letter-spacing: var(--sla-btn-tracking) !important;
      text-transform: uppercase !important;
      border-radius: var(--sla-btn-radius) !important;
      height: 34px !important;
      min-height: 34px !important;
      padding: 0 16px !important;
      line-height: 1 !important;
      white-space: nowrap !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      text-align: center !important;
      cursor: pointer !important;
      text-decoration: none !important;
      box-shadow: 0 2px 10px rgba(var(--sla-accent-rgb), 0.22) !important;
      transition: transform 0.15s ease, background-color 0.15s ease !important;
    }

    html body button:not(#_):not(#_):not(.sla-hamburger-only-btn):hover,
    html body a.btn:not(#_):not(#_):hover,
    html body a[class*="btn"]:not(#_):not(#_):not(.sla-hamburger-only-btn):hover,
    html body .sla-forced-blue-btn:not(#_):not(#_):not(.sla-hamburger-only-btn):hover {
      background: var(--sla-accent-soft) !important;
      background-color: var(--sla-accent-soft) !important;
      border-color: #bae6fd !important;
      color: #06101e !important;
      transform: translateY(-1px);
    }

    html body button.active:not(#_):not(#_):not(.sla-hamburger-only-btn),
    html body [role="tab"].active:not(#_):not(#_),
    html body .sla-forced-blue-btn.active:not(#_):not(#_):not(.sla-hamburger-only-btn) {
      border: 2px solid var(--sla-white) !important;
      box-shadow: 0 0 16px rgba(var(--sla-accent-rgb), 0.55) !important;
    }

    html body button:not(#_):not(#_):not(.sla-hamburger-only-btn) *,
    html body .sla-forced-blue-btn:not(#_):not(#_):not(.sla-hamburger-only-btn) * {
      color: #06101e !important;
      background: transparent !important;
      background-color: transparent !important;
      font-family: inherit !important;
      font-size: inherit !important;
      font-weight: inherit !important;
      letter-spacing: inherit !important;
      text-transform: uppercase !important;
    }

    /* Hide decorative left dot inside CONNECT WALLET so text centers cleanly */
    html body button:not(.sla-hamburger-only-btn) span:empty,
    html body button:not(.sla-hamburger-only-btn) div:empty,
    html body .sla-forced-blue-btn:not(.sla-hamburger-only-btn) span:empty,
    html body button:not(.sla-hamburger-only-btn) .dot,
    html body button:not(.sla-hamburger-only-btn) .status-dot {
      display: none !important;
    }

    /* Top-Right ☰ Hamburger Toggle Button */
    html body button.sla-hamburger-only-btn:not(#_):not(#_),
    html body a.sla-hamburger-only-btn:not(#_):not(#_) {
      background: rgba(var(--sla-surface-slate-rgb), 0.92) !important;
      background-color: rgba(var(--sla-surface-slate-rgb), 0.92) !important;
      color: var(--sla-white) !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.45) !important;
      border-radius: 10px !important;
      padding: 8px 12px !important;
      height: auto !important;
      min-height: 0 !important;
      box-shadow: none !important;
    }
    html body button.sla-hamburger-only-btn:not(#_):not(#_) *,
    html body a.sla-hamburger-only-btn:not(#_):not(#_) * {
      color: var(--sla-white) !important;
      stroke: var(--sla-white) !important;
    }
    html body button.sla-hamburger-only-btn:not(#_):not(#_) span:empty,
    html body a.sla-hamburger-only-btn:not(#_):not(#_) span:empty {
      background-color: var(--sla-white) !important;
      display: block !important;
    }

/* ---- style#sla-native-menu-header-sync-style ---- */
/* Fallback minimal styling ONLY if a page doesn't already style its native dropdown items */
    .sla-native-menu-fallback-panel {
      position: fixed !important;
      top: 68px !important;
      right: 24px !important;
      min-width: 230px !important;
      background: rgba(var(--sla-surface-3-rgb), 0.97) !important;
      backdrop-filter: blur(14px) !important;
      -webkit-backdrop-filter: blur(14px) !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.12) !important;
      border-radius: 14px !important;
      padding: 8px !important;
      box-shadow: 0 18px 48px rgba(var(--sla-black-rgb), 0.75) !important;
      z-index: 99990 !important;
      display: none;
      flex-direction: column !important;
      gap: 2px !important;
    }

    .sla-native-menu-fallback-panel.open {
      display: flex !important;
    }

    .sla-native-menu-fallback-link {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 9px 12px !important;
      border-radius: 9px !important;
      color: var(--sla-text-2) !important;
      font-size: 13px !important;
      font-weight: 600 !important;
      text-decoration: none !important;
      transition: background 0.15s ease, color 0.15s ease !important;
    }

    .sla-native-menu-fallback-link:hover {
      background: rgba(var(--sla-accent-rgb), 0.12) !important;
      color: var(--sla-accent) !important;
    }

    .sla-native-menu-divider {
      height: 1px !important;
      width: 100% !important;
      background: rgba(var(--sla-white-rgb), 0.08) !important;
      margin: 6px 0 !important;
    }

/* ---- style#sla-docs-live-v1-api-styles ---- */
#sla-docs-live-api-hub {
      max-width: 1080px !important;
      margin: 36px auto !important;
      padding: 26px 28px !important;
      border-radius: 22px !important;
      background: var(--sla-surface-3) !important;
      border: 1px solid rgba(var(--sla-accent-rgb), 0.3) !important;
      box-shadow: 0 20px 55px rgba(var(--sla-black-rgb), 0.7) !important;
      box-sizing: border-box !important;
    }

    .sla-docs-endpoint-grid {
      display: grid !important;
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      gap: 14px !important;
      margin-top: 16px !important;
    }

    .sla-docs-ep-card {
      padding: 16px 18px !important;
      border-radius: 16px !important;
      background: var(--sla-surface-0) !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
      display: flex !important;
      flex-direction: column !important;
      justify-content: space-between !important;
      gap: 10px !important;
    }

    .sla-docs-ep-top {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      gap: 8px !important;
    }

    .sla-docs-method-badge {
      padding: 3px 8px !important;
      border-radius: 6px !important;
      background: rgba(var(--sla-positive-rgb), 0.14) !important;
      border: 1px solid rgba(var(--sla-positive-rgb), 0.4) !important;
      color: var(--sla-positive) !important;
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
      font-size: 10px !important;
      font-weight: 900 !important;
    }

    .sla-docs-ep-path {
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
      font-size: 13px !important;
      font-weight: 800 !important;
      color: var(--sla-accent) !important;
    }

    .sla-docs-ep-desc {
      margin: 0 !important;
    }

    .sla-docs-ep-actions {
      display: flex !important;
      align-items: center !important;
      gap: 8px !important;
    }

    .sla-docs-ep-btn {
      height: 30px !important;
      padding: 0 12px !important;
      border-radius: 999px !important;
      background: rgba(var(--sla-accent-rgb), 0.14) !important;
      border: 1px solid rgba(var(--sla-accent-rgb), 0.4) !important;
      color: var(--sla-accent) !important;
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
      font-size: 10px !important;
      font-weight: 800 !important;
      text-decoration: none !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      cursor: pointer !important;
    }

    .sla-docs-ep-btn:hover {
      background: var(--sla-accent) !important;
      color: var(--sla-surface-0) !important;
    }

    @media (max-width: 820px) {
      .sla-docs-endpoint-grid {
        grid-template-columns: 1fr !important;
      }
    }

/* ---- /sla-css-b324374870.css ---- */
/* 1. Strictly 3x3 (9 cards) inside #sla-main-directory-grid */
    #sla-main-directory-grid {
      display: grid !important;
      grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
      gap: 18px !important;
      width: 100% !important;
      box-sizing: border-box !important;
      margin-bottom: 22px !important;
    }

    #sla-main-directory-grid > *:nth-child(n+10) {
      display: none !important;
    }

    /* 2. Permanently hide the secondary async #directory-grid below the pagination bar (never touches Top 10) */
    #directory-grid:not(#sla-main-directory-grid),
    .directory-grid:not(#sla-main-directory-grid),
    #registry-grid:not(#sla-main-directory-grid),
    #sla-dir-pagination-bar ~ #directory-grid,
    #sla-dir-pagination-bar ~ .directory-grid,
    [data-sla-hidden-dup-grid="true"] {
      display: none !important;
      height: 0 !important;
      margin: 0 !important;
      padding: 0 !important;
      overflow: hidden !important;
    }

    /* 3. Left orientation on "LIVE BASE MAINNET (#8453) • Sovereign Verification Oracle" & "Production M2M Endpoints & Live Staking Feeds" */
    .sla-left-orient-block,
    .sla-left-orient-block > * {
      text-align: left !important;
      align-items: flex-start !important;
      justify-content: flex-start !important;
      margin-left: 0 !important;
      margin-right: auto !important;
    }

    /* 4. Pagination Bar Styling */
    #sla-dir-pagination-bar {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      gap: 16px !important;
      flex-wrap: wrap !important;
      width: 100% !important;
      padding: 16px 22px !important;
      margin: 8px 0 28px 0 !important;
      border-radius: 16px !important;
      background: rgba(var(--sla-surface-3-rgb), 0.92) !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
      box-sizing: border-box !important;
    }

    .sla-dir-page-info {
      font-size: 12.5px !important;
      color: var(--sla-text-muted) !important;
      font-weight: 500 !important;
    }

    .sla-dir-page-info strong {
      color: var(--sla-text) !important;
      font-weight: 800 !important;
    }

    .sla-dir-page-controls {
      display: flex !important;
      align-items: center !important;
      gap: 8px !important;
      flex-wrap: wrap !important;
    }

    .sla-dir-page-btn {
      height: 34px !important;
      padding: 0 16px !important;
      border-radius: 999px !important;
      font-size: 10.5px !important;
      font-weight: 900 !important;
      letter-spacing: 0.06em !important;
      text-transform: uppercase !important;
      cursor: pointer !important;
      border: 1px solid rgba(var(--sla-accent-rgb), 0.35) !important;
      background: var(--sla-accent) !important;
      color: var(--sla-surface-0) !important;
    }

    .sla-dir-page-btn:disabled {
      background: rgba(30, 41, 59, 0.55) !important;
      border-color: rgba(var(--sla-white-rgb), 0.08) !important;
      color: var(--sla-text-faint) !important;
      cursor: not-allowed !important;
    }

    .sla-dir-page-num {
      min-width: 34px !important;
      height: 34px !important;
      padding: 0 10px !important;
      border-radius: 999px !important;
      font-size: 11px !important;
      font-weight: 800 !important;
      cursor: pointer !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.12) !important;
      background: var(--sla-surface-0) !important;
      color: var(--sla-text-3) !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
    }

    .sla-dir-page-num.active {
      border-color: var(--sla-accent) !important;
      box-shadow: 0 0 0 1px var(--sla-accent) inset !important;
      color: var(--sla-text) !important;
      background: rgba(var(--sla-accent-rgb), 0.14) !important;
    }

    @media (max-width: 980px) {
      #sla-main-directory-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      }
    }

    @media (max-width: 640px) {
      #sla-main-directory-grid {
        grid-template-columns: 1fr !important;
      }
    }

/* ---- style#sla-dossier-claim1-fullwidth-styles ---- */
html body #sla-dossier-modal-overlay button#sla-dossier-claim-rank1-btn:not(#_):not(#_):not(#_):not(#_) {
    display: flex !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    height: 48px !important;
    margin: 10px 0 0 0 !important;
    padding: 0 22px !important;
    border-radius: 999px !important;
    box-sizing: border-box !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    background: linear-gradient(90deg, var(--sla-accent) 0%, var(--sla-accent-deep) 100%) !important;
    color: #04070d !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.65) !important;
    box-shadow: 0 10px 28px rgba(var(--sla-accent-rgb), 0.22) !important;
    cursor: pointer !important;
    transition: transform 0.14s ease, filter 0.14s ease !important;
  }
  html body #sla-dossier-modal-overlay button#sla-dossier-claim-rank1-btn:not(#_):not(#_):not(#_):not(#_):hover {
    filter: brightness(1.08) !important;
    transform: translateY(-1px) !important;
  }

/* ---- /sla-css-d079c7a828.css ---- */
/* Docs: the hero text paints at once. What old scripts rebuild right after load (the hero buttons become a dropdown,
   the live API section is inserted below the hero) stays invisible, with its space kept, until they finish
   (html[data-sla-settled], set by the settled-release script). The whole page used to be hidden until then. */
  html:not([data-sla-settled="true"]) main > section:first-of-type > div.flex.flex-wrap,
  html:not([data-sla-settled="true"]) main > section:first-of-type ~ *,
  html:not([data-sla-settled="true"]) body > footer { visibility: hidden !important; }

  html body #sla-spotify-top10-view .sla-sp-col-headers,
  html body #sla-spotify-top10-view .sla-sp-thead,
  html body #sla-spotify-top10-view .sla-sp-header-7col,
  html body #sla-spotify-top10-view .sla-sp-track {
    display: grid !important;
    grid-template-columns: 32px minmax(200px, 1.35fr) minmax(175px, 1.1fr) 86px 64px 164px 248px !important;
    gap: 14px !important;
    align-items: center !important;
    padding: 8px 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  html body #sla-spotify-top10-view .sla-sp-col-headers > *,
  html body #sla-spotify-top10-view .sla-sp-header-7col > * {
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: var(--sla-text-faint) !important;
    white-space: nowrap !important;
  }
  html body #sla-spotify-top10-view .sla-sp-col-headers > .sla-sp-th-outbid,
  html body #sla-spotify-top10-view .sla-sp-header-7col > .sla-sp-th-outbid {
    grid-column: 6 / 7 !important;
    color: var(--sla-positive) !important;
    text-align: center !important;
  }
  html body #sla-spotify-top10-view .sla-sp-col-headers > *:last-child,
  html body #sla-spotify-top10-view .sla-sp-header-7col > *:last-child {
    grid-column: 7 / 8 !important;
    text-align: center !important;
  }
  @media (max-width: 1140px) {
    html body #sla-spotify-top10-view .sla-sp-col-headers,
    html body #sla-spotify-top10-view .sla-sp-thead,
    html body #sla-spotify-top10-view .sla-sp-header-7col,
    html body #sla-spotify-top10-view .sla-sp-track {
      grid-template-columns: 28px minmax(160px, 1.2fr) minmax(140px, 1fr) 74px 56px 148px 224px !important;
      gap: 10px !important;
    }
  }


    html, body {
      overflow-x: clip !important;
    }
    .sla-top-nav-locked {
      position: sticky !important;
      top: 0 !important;
      z-index: 9999 !important;
    }
  

    /* Wallet Control Container (Fits 100% inside Hamburger Menu or Header) */
    .sla-wallet-bar {
      display: flex !important;
      flex-direction: column !important;
      align-items: stretch !important;
      justify-content: center !important;
      gap: 6px !important;
      width: 100% !important;
      max-width: 100% !important;
      box-sizing: border-box !important;
      padding: 0 !important;
      margin: 0 !important;
      background: transparent !important;
      border: none !important;
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
      z-index: 10000 !important;
    }
    /* If placed directly in a wide horizontal header bar (outside dropdown menu) */
    .sla-wallet-bar.sla-inline-header {
      width: auto !important;
      flex-direction: row !important;
      align-items: center !important;
    }
    .sla-wb-addr-btn {
      width: 100% !important;
      box-sizing: border-box !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      text-align: center !important;
      gap: 8px !important;
      background: rgba(var(--sla-positive-rgb), 0.12) !important;
      border: 1px solid rgba(var(--sla-positive-rgb), 0.35) !important;
      color: var(--sla-white) !important;
      font-family: 'JetBrains Mono', monospace !important;
      font-size: 12px !important;
      font-weight: 700 !important;
      padding: 11px 16px !important;
      border-radius: 999px !important;
      cursor: pointer !important;
      transition: all 0.15s ease !important;
      line-height: 1.2 !important;
      white-space: nowrap !important;
      margin: 0 !important;
    }
    .sla-wb-addr-btn:hover {
      background: rgba(var(--sla-accent-strong-rgb), 0.16) !important;
      border-color: rgba(var(--sla-accent-strong-rgb), 0.45) !important;
      color: var(--sla-accent-strong) !important;
    }
    .sla-wb-addr-btn.disconnected {
      width: 100% !important;
      box-sizing: border-box !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      text-align: center !important;
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
      background: rgba(var(--sla-accent-strong-rgb), 0.14) !important;
      border: 1px solid rgba(var(--sla-accent-strong-rgb), 0.4) !important;
      color: var(--sla-accent-strong) !important;
      font-size: 13px !important;
      font-weight: 700 !important;
      letter-spacing: 0.02em !important;
      padding: 12px 18px !important;
      border-radius: 999px !important;
    }
    .sla-wb-addr-btn.disconnected:hover {
      background: var(--sla-accent-strong) !important;
      color: #050507 !important;
    }
    .sla-wb-subrow {
      display: grid !important;
      grid-template-columns: 1fr 1fr !important;
      gap: 6px !important;
      width: 100% !important;
      box-sizing: border-box !important;
    }
    .sla-wallet-bar.sla-inline-header .sla-wb-subrow {
      display: inline-flex !important;
      width: auto !important;
    }
    .sla-wb-dot {
      width: 7px !important;
      height: 7px !important;
      border-radius: 999px !important;
      background: var(--sla-positive) !important;
      box-shadow: 0 0 8px var(--sla-positive) !important;
      flex-shrink: 0 !important;
    }
    .sla-wb-dot.off {
      background: var(--sla-accent-strong) !important;
      box-shadow: 0 0 6px var(--sla-accent-strong) !important;
    }
    .sla-wb-action-btn {
      width: 100% !important;
      box-sizing: border-box !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      text-align: center !important;
      gap: 4px !important;
      background: rgba(var(--sla-accent-strong-rgb), 0.12) !important;
      border: 1px solid rgba(var(--sla-accent-strong-rgb), 0.3) !important;
      color: var(--sla-accent-strong) !important;
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
      font-size: 10.5px !important;
      font-weight: 800 !important;
      letter-spacing: 0.04em !important;
      text-transform: uppercase !important;
      padding: 8px 8px !important;
      border-radius: 999px !important;
      cursor: pointer !important;
      transition: all 0.15s ease !important;
      line-height: 1 !important;
      white-space: nowrap !important;
      margin: 0 !important;
    }
    .sla-wb-action-btn:hover {
      background: var(--sla-accent-strong) !important;
      color: #050507 !important;
    }
    .sla-wb-action-btn.danger {
      background: rgba(var(--sla-danger-rgb), 0.12) !important;
      border-color: rgba(var(--sla-danger-rgb), 0.32) !important;
      color: var(--sla-danger-soft) !important;
    }
    .sla-wb-action-btn.danger:hover {
      background: var(--sla-danger) !important;
      color: var(--sla-white) !important;
    }

    /* Full On-Screen Wallet Manager Modal */
    #sla-wallet-modal-backdrop {
      position: fixed !important;
      inset: 0 !important;
      background: rgba(3, 4, 7, 0.84) !important;
      backdrop-filter: blur(12px) !important;
      -webkit-backdrop-filter: blur(12px) !important;
      z-index: 2147483646 !important;
      display: none;
      align-items: center !important;
      justify-content: center !important;
      padding: 16px !important;
    }
    #sla-wallet-modal-backdrop.open {
      display: flex !important;
    }
    .sla-wallet-modal {
      width: 100% !important;
      max-width: 430px !important;
      background: #0B0C10 !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.16) !important;
      border-radius: 20px !important;
      padding: 22px !important;
      box-shadow: 0 30px 80px rgba(var(--sla-black-rgb), 0.92), 0 0 0 1px rgba(var(--sla-accent-strong-rgb), 0.18) !important;
      color: var(--sla-white) !important;
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
    }
    .sla-wm-top {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      margin-bottom: 16px !important;
      padding-bottom: 12px !important;
      border-bottom: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
    }
    .sla-wm-title {
      font-size: 13px !important;
      font-weight: 900 !important;
      letter-spacing: 0.12em !important;
      text-transform: uppercase !important;
      color: var(--sla-warning-alt) !important;
    }
    .sla-wm-close {
      background: rgba(var(--sla-white-rgb), 0.06) !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.12) !important;
      color: var(--sla-gray-400) !important;
      width: 30px !important;
      height: 30px !important;
      border-radius: 999px !important;
      cursor: pointer !important;
      font-size: 14px !important;
      font-weight: 700 !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
    }
    .sla-wm-close:hover {
      color: var(--sla-white) !important;
      background: rgba(var(--sla-white-rgb), 0.16) !important;
    }
    .sla-wm-current-box {
      background: rgba(var(--sla-white-rgb), 0.03) !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
      border-radius: 14px !important;
      padding: 14px !important;
      margin-bottom: 14px !important;
    }
    .sla-wm-badge {
      display: inline-flex !important;
      align-items: center !important;
      gap: 6px !important;
      font-size: 10px !important;
      font-weight: 800 !important;
      letter-spacing: 0.12em !important;
      text-transform: uppercase !important;
      color: var(--sla-positive) !important;
      margin-bottom: 6px !important;
    }
    .sla-wm-badge.off {
      color: var(--sla-warning-alt) !important;
    }
    .sla-wm-full-address {
      font-family: 'JetBrains Mono', monospace !important;
      font-size: 12.5px !important;
      color: var(--sla-white) !important;
      word-break: break-all !important;
      line-height: 1.45 !important;
    }
    .sla-wm-disclaimer-text {
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
      font-size: 12.5px !important;
      font-weight: 400 !important;
      color: var(--sla-gray-300) !important;
      line-height: 1.55 !important;
      letter-spacing: normal !important;
      word-break: normal !important;
      overflow-wrap: break-word !important;
      word-wrap: break-word !important;
      white-space: normal !important;
      hyphens: none !important;
      -webkit-hyphens: none !important;
    }
    #sla-wm-status-msg {
      display: none;
      margin-bottom: 12px !important;
      padding: 10px 12px !important;
      border-radius: 10px !important;
      font-size: 12px !important;
      font-weight: 600 !important;
      line-height: 1.4 !important;
      background: rgba(var(--sla-accent-strong-rgb), 0.14) !important;
      border: 1px solid rgba(var(--sla-accent-strong-rgb), 0.4) !important;
      color: var(--sla-accent-pale) !important;
    }
    #sla-wm-status-msg.warn {
      background: rgba(var(--sla-warning-alt-rgb), 0.16) !important;
      border-color: rgba(var(--sla-warning-alt-rgb), 0.5) !important;
      color: var(--sla-warning-soft) !important;
    }
    .sla-wm-btn-stack {
      display: flex !important;
      flex-direction: column !important;
      gap: 8px !important;
    }
    .sla-wm-modal-btn {
      width: 100% !important;
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 12px 14px !important;
      border-radius: 12px !important;
      font-size: 13px !important;
      font-weight: 700 !important;
      cursor: pointer !important;
      transition: all 0.15s ease !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.12) !important;
      background: rgba(var(--sla-white-rgb), 0.05) !important;
      color: var(--sla-white) !important;
      text-align: left !important;
    }
    .sla-wm-modal-btn * {
      pointer-events: none !important;
    }
    .sla-wm-modal-btn:hover {
      background: rgba(var(--sla-accent-strong-rgb), 0.18) !important;
      border-color: rgba(var(--sla-accent-strong-rgb), 0.5) !important;
      color: var(--sla-accent-strong) !important;
    }
    .sla-wm-modal-btn.primary {
      background: rgba(var(--sla-accent-strong-rgb), 0.16) !important;
      border-color: rgba(var(--sla-accent-strong-rgb), 0.45) !important;
      color: var(--sla-accent-strong) !important;
    }
    .sla-wm-modal-btn.primary:hover {
      background: var(--sla-accent-strong) !important;
      color: #050507 !important;
    }
    .sla-wm-modal-btn.danger {
      background: rgba(var(--sla-danger-rgb), 0.12) !important;
      border-color: rgba(var(--sla-danger-rgb), 0.35) !important;
      color: var(--sla-danger-soft) !important;
    }
    .sla-wm-modal-btn.danger:hover {
      background: var(--sla-danger) !important;
      color: var(--sla-white) !important;
    }
    .sla-wm-subhead {
      font-size: 10px !important;
      font-weight: 800 !important;
      letter-spacing: 0.12em !important;
      text-transform: uppercase !important;
      color: var(--sla-gray-400) !important;
      margin: 14px 0 8px !important;
    }
  

    :root {
      --sla-btn-font: inherit;
      --sla-btn-size: 11.5px;
      --sla-btn-weight: 800;
      --sla-btn-tracking: 0.06em;
      --sla-btn-radius: 999px;
    }

    /* All standard buttons & CTA links: Spotify-minimalist blue pills */
    html body button:not(#_):not(#_):not(.sla-hamburger-only-btn),
    html body input[type="button"]:not(#_):not(#_),
    html body input[type="submit"]:not(#_):not(#_),
    html body [role="button"]:not(#_):not(#_):not(.sla-hamburger-only-btn),
    html body [role="tab"]:not(#_):not(#_),
    html body a.btn:not(#_):not(#_),
    html body a[class*="btn"]:not(#_):not(#_):not(.sla-hamburger-only-btn),
    html body a[class*="button"]:not(#_):not(#_):not(.sla-hamburger-only-btn),
    html body .sla-sp-claim-btn:not(#_):not(#_),
    html body .sla-sp-btn-inspect:not(#_):not(#_),
    html body .sla-sp-btn-escrow:not(#_):not(#_),
    html body #sla-top10-directory-lists-btn:not(#_):not(#_),
    html body #sla-tab-03-top10-btn:not(#_):not(#_),
    html body .sla-forced-blue-btn:not(#_):not(#_):not(.sla-hamburger-only-btn) {
      background: var(--sla-accent) !important;
      background-color: var(--sla-accent) !important;
      background-image: none !important;
      color: #06101e !important;
      border: 1px solid var(--sla-accent) !important;
      font-family: var(--sla-btn-font) !important;
      font-size: var(--sla-btn-size) !important;
      font-weight: var(--sla-btn-weight) !important;
      letter-spacing: var(--sla-btn-tracking) !important;
      text-transform: uppercase !important;
      border-radius: var(--sla-btn-radius) !important;
      height: 34px !important;
      min-height: 34px !important;
      padding: 0 16px !important;
      line-height: 1 !important;
      white-space: nowrap !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      text-align: center !important;
      cursor: pointer !important;
      text-decoration: none !important;
      box-shadow: 0 2px 10px rgba(var(--sla-accent-rgb), 0.22) !important;
      transition: transform 0.15s ease, background-color 0.15s ease !important;
    }

    html body button:not(#_):not(#_):not(.sla-hamburger-only-btn):hover,
    html body a.btn:not(#_):not(#_):hover,
    html body a[class*="btn"]:not(#_):not(#_):not(.sla-hamburger-only-btn):hover,
    html body .sla-forced-blue-btn:not(#_):not(#_):not(.sla-hamburger-only-btn):hover {
      background: var(--sla-accent-soft) !important;
      background-color: var(--sla-accent-soft) !important;
      border-color: #bae6fd !important;
      color: #06101e !important;
      transform: translateY(-1px);
    }

    html body button.active:not(#_):not(#_):not(.sla-hamburger-only-btn),
    html body [role="tab"].active:not(#_):not(#_),
    html body .sla-forced-blue-btn.active:not(#_):not(#_):not(.sla-hamburger-only-btn) {
      border: 2px solid var(--sla-white) !important;
      box-shadow: 0 0 16px rgba(var(--sla-accent-rgb), 0.55) !important;
    }

    html body button:not(#_):not(#_):not(.sla-hamburger-only-btn) *,
    html body .sla-forced-blue-btn:not(#_):not(#_):not(.sla-hamburger-only-btn) * {
      color: #06101e !important;
      background: transparent !important;
      background-color: transparent !important;
      font-family: inherit !important;
      font-size: inherit !important;
      font-weight: inherit !important;
      letter-spacing: inherit !important;
      text-transform: uppercase !important;
    }

    /* Hide decorative left dot inside CONNECT WALLET so text centers cleanly */
    html body button:not(.sla-hamburger-only-btn) span:empty,
    html body button:not(.sla-hamburger-only-btn) div:empty,
    html body .sla-forced-blue-btn:not(.sla-hamburger-only-btn) span:empty,
    html body button:not(.sla-hamburger-only-btn) .dot,
    html body button:not(.sla-hamburger-only-btn) .status-dot {
      display: none !important;
    }

    /* Top-Right ☰ Hamburger Toggle Button */
    html body button.sla-hamburger-only-btn:not(#_):not(#_),
    html body a.sla-hamburger-only-btn:not(#_):not(#_) {
      background: rgba(var(--sla-surface-slate-rgb), 0.92) !important;
      background-color: rgba(var(--sla-surface-slate-rgb), 0.92) !important;
      color: var(--sla-white) !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.45) !important;
      border-radius: 10px !important;
      padding: 8px 12px !important;
      height: auto !important;
      min-height: 0 !important;
      box-shadow: none !important;
    }
    html body button.sla-hamburger-only-btn:not(#_):not(#_) *,
    html body a.sla-hamburger-only-btn:not(#_):not(#_) * {
      color: var(--sla-white) !important;
      stroke: var(--sla-white) !important;
    }
    html body button.sla-hamburger-only-btn:not(#_):not(#_) span:empty,
    html body a.sla-hamburger-only-btn:not(#_):not(#_) span:empty {
      background-color: var(--sla-white) !important;
      display: block !important;
    }
  

    /* Fallback minimal styling ONLY if a page doesn't already style its native dropdown items */
    .sla-native-menu-fallback-panel {
      position: fixed !important;
      top: 68px !important;
      right: 24px !important;
      min-width: 230px !important;
      background: rgba(var(--sla-surface-3-rgb), 0.97) !important;
      backdrop-filter: blur(14px) !important;
      -webkit-backdrop-filter: blur(14px) !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.12) !important;
      border-radius: 14px !important;
      padding: 8px !important;
      box-shadow: 0 18px 48px rgba(var(--sla-black-rgb), 0.75) !important;
      z-index: 99990 !important;
      display: none;
      flex-direction: column !important;
      gap: 2px !important;
    }

    .sla-native-menu-fallback-panel.open {
      display: flex !important;
    }

    .sla-native-menu-fallback-link {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 9px 12px !important;
      border-radius: 9px !important;
      color: var(--sla-text-2) !important;
      font-size: 13px !important;
      font-weight: 600 !important;
      text-decoration: none !important;
      transition: background 0.15s ease, color 0.15s ease !important;
    }

    .sla-native-menu-fallback-link:hover {
      background: rgba(var(--sla-accent-rgb), 0.12) !important;
      color: var(--sla-accent) !important;
    }

    .sla-native-menu-divider {
      height: 1px !important;
      width: 100% !important;
      background: rgba(var(--sla-white-rgb), 0.08) !important;
      margin: 6px 0 !important;
    }
  

    #sla-docs-live-api-hub {
      max-width: 1080px !important;
      margin: 36px auto !important;
      padding: 26px 28px !important;
      border-radius: 22px !important;
      background: var(--sla-surface-3) !important;
      border: 1px solid rgba(var(--sla-accent-rgb), 0.3) !important;
      box-shadow: 0 20px 55px rgba(var(--sla-black-rgb), 0.7) !important;
      box-sizing: border-box !important;
    }

    .sla-docs-endpoint-grid {
      display: grid !important;
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      gap: 14px !important;
      margin-top: 16px !important;
    }

    .sla-docs-ep-card {
      padding: 16px 18px !important;
      border-radius: 16px !important;
      background: var(--sla-surface-0) !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
      display: flex !important;
      flex-direction: column !important;
      justify-content: space-between !important;
      gap: 10px !important;
    }

    .sla-docs-ep-top {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      gap: 8px !important;
    }

    .sla-docs-method-badge {
      padding: 3px 8px !important;
      border-radius: 6px !important;
      background: rgba(var(--sla-positive-rgb), 0.14) !important;
      border: 1px solid rgba(var(--sla-positive-rgb), 0.4) !important;
      color: var(--sla-positive) !important;
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
      font-size: 10px !important;
      font-weight: 900 !important;
    }

    .sla-docs-ep-path {
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
      font-size: 13px !important;
      font-weight: 800 !important;
      color: var(--sla-accent) !important;
    }

    .sla-docs-ep-desc {
      margin: 0 !important;
    }

    .sla-docs-ep-actions {
      display: flex !important;
      align-items: center !important;
      gap: 8px !important;
    }

    .sla-docs-ep-btn {
      height: 30px !important;
      padding: 0 12px !important;
      border-radius: 999px !important;
      background: rgba(var(--sla-accent-rgb), 0.14) !important;
      border: 1px solid rgba(var(--sla-accent-rgb), 0.4) !important;
      color: var(--sla-accent) !important;
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
      font-size: 10px !important;
      font-weight: 800 !important;
      text-decoration: none !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      cursor: pointer !important;
    }

    .sla-docs-ep-btn:hover {
      background: var(--sla-accent) !important;
      color: var(--sla-surface-0) !important;
    }

    @media (max-width: 820px) {
      .sla-docs-endpoint-grid {
        grid-template-columns: 1fr !important;
      }
    }
  

    /* 1. Strictly 3x3 (9 cards) inside #sla-main-directory-grid */
    #sla-main-directory-grid {
      display: grid !important;
      grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
      gap: 18px !important;
      width: 100% !important;
      box-sizing: border-box !important;
      margin-bottom: 22px !important;
    }

    #sla-main-directory-grid > *:nth-child(n+10) {
      display: none !important;
    }

    /* 2. Permanently hide the secondary async #directory-grid below the pagination bar (never touches Top 10) */
    #directory-grid:not(#sla-main-directory-grid),
    .directory-grid:not(#sla-main-directory-grid),
    #registry-grid:not(#sla-main-directory-grid),
    #sla-dir-pagination-bar ~ #directory-grid,
    #sla-dir-pagination-bar ~ .directory-grid,
    [data-sla-hidden-dup-grid="true"] {
      display: none !important;
      height: 0 !important;
      margin: 0 !important;
      padding: 0 !important;
      overflow: hidden !important;
    }

    /* 3. Left orientation on "LIVE BASE MAINNET (#8453) • Sovereign Verification Oracle" & "Production M2M Endpoints & Live Staking Feeds" */
    .sla-left-orient-block,
    .sla-left-orient-block > * {
      text-align: left !important;
      align-items: flex-start !important;
      justify-content: flex-start !important;
      margin-left: 0 !important;
      margin-right: auto !important;
    }

    /* 4. Pagination Bar Styling */
    #sla-dir-pagination-bar {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      gap: 16px !important;
      flex-wrap: wrap !important;
      width: 100% !important;
      padding: 16px 22px !important;
      margin: 8px 0 28px 0 !important;
      border-radius: 16px !important;
      background: rgba(var(--sla-surface-3-rgb), 0.92) !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
      box-sizing: border-box !important;
    }

    .sla-dir-page-info {
      font-size: 12.5px !important;
      color: var(--sla-text-muted) !important;
      font-weight: 500 !important;
    }

    .sla-dir-page-info strong {
      color: var(--sla-text) !important;
      font-weight: 800 !important;
    }

    .sla-dir-page-controls {
      display: flex !important;
      align-items: center !important;
      gap: 8px !important;
      flex-wrap: wrap !important;
    }

    .sla-dir-page-btn {
      height: 34px !important;
      padding: 0 16px !important;
      border-radius: 999px !important;
      font-size: 10.5px !important;
      font-weight: 900 !important;
      letter-spacing: 0.06em !important;
      text-transform: uppercase !important;
      cursor: pointer !important;
      border: 1px solid rgba(var(--sla-accent-rgb), 0.35) !important;
      background: var(--sla-accent) !important;
      color: var(--sla-surface-0) !important;
    }

    .sla-dir-page-btn:disabled {
      background: rgba(30, 41, 59, 0.55) !important;
      border-color: rgba(var(--sla-white-rgb), 0.08) !important;
      color: var(--sla-text-faint) !important;
      cursor: not-allowed !important;
    }

    .sla-dir-page-num {
      min-width: 34px !important;
      height: 34px !important;
      padding: 0 10px !important;
      border-radius: 999px !important;
      font-size: 11px !important;
      font-weight: 800 !important;
      cursor: pointer !important;
      border: 1px solid rgba(var(--sla-white-rgb), 0.12) !important;
      background: var(--sla-surface-0) !important;
      color: var(--sla-text-3) !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
    }

    .sla-dir-page-num.active {
      border-color: var(--sla-accent) !important;
      box-shadow: 0 0 0 1px var(--sla-accent) inset !important;
      color: var(--sla-text) !important;
      background: rgba(var(--sla-accent-rgb), 0.14) !important;
    }

    @media (max-width: 980px) {
      #sla-main-directory-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      }
    }

    @media (max-width: 640px) {
      #sla-main-directory-grid {
        grid-template-columns: 1fr !important;
      }
    }
  

  html body #sla-dossier-modal-overlay button#sla-dossier-claim-rank1-btn:not(#_):not(#_):not(#_):not(#_) {
    display: flex !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    height: 48px !important;
    margin: 10px 0 0 0 !important;
    padding: 0 22px !important;
    border-radius: 999px !important;
    box-sizing: border-box !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    background: linear-gradient(90deg, var(--sla-accent) 0%, var(--sla-accent-deep) 100%) !important;
    color: #04070d !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.65) !important;
    box-shadow: 0 10px 28px rgba(var(--sla-accent-rgb), 0.22) !important;
    cursor: pointer !important;
    transition: transform 0.14s ease, filter 0.14s ease !important;
  }
  html body #sla-dossier-modal-overlay button#sla-dossier-claim-rank1-btn:not(#_):not(#_):not(#_):not(#_):hover {
    filter: brightness(1.08) !important;
    transform: translateY(-1px) !important;
  }


  #sla-dossier-modal-overlay #sla-rank-ladder-section {
    margin: 12px 0 14px 0;
    padding: 10px 12px;
    border-radius: 12px;
    background: rgba(8, 13, 24, 0.92);
    border: 1px solid rgba(var(--sla-accent-rgb), 0.22);
    box-sizing: border-box;
  }
  #sla-dossier-modal-overlay .sla-ladder-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
    font-family: Inter, system-ui, -apple-system, sans-serif;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.05em;
    color: var(--sla-text-muted);
    text-transform: uppercase;
  }
  #sla-dossier-modal-overlay .sla-ladder-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 6px;
  }
  #sla-dossier-modal-overlay .sla-ladder-rung {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6px 4px;
    border-radius: 8px;
    background: rgba(var(--sla-surface-slate-rgb), 0.75);
    border: 1px solid rgba(var(--sla-white-rgb), 0.08);
    cursor: pointer;
    transition: border-color 0.14s ease, background 0.14s ease;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    user-select: none;
  }
  #sla-dossier-modal-overlay .sla-ladder-rung:hover {
    border-color: rgba(var(--sla-accent-rgb), 0.65);
    background: rgba(var(--sla-accent-rgb), 0.12);
  }
  #sla-dossier-modal-overlay .sla-ladder-rung[data-active-rung="true"] {
    background: rgba(var(--sla-positive-rgb), 0.16);
    border: 1px solid var(--sla-positive);
    box-shadow: 0 0 14px rgba(var(--sla-positive-rgb), 0.22);
  }
  #sla-dossier-modal-overlay .sla-ladder-rung-rank {
    font-size: 10px;
    font-weight: 800;
    color: var(--sla-text-muted);
    line-height: 1.2;
  }
  #sla-dossier-modal-overlay .sla-ladder-rung[data-active-rung="true"] .sla-ladder-rung-rank {
    color: var(--sla-positive);
  }
  #sla-dossier-modal-overlay .sla-ladder-rung-stake {
    font-size: 11.5px;
    font-weight: 900;
    color: var(--sla-text);
    margin-top: 2px;
    line-height: 1.2;
  }
  #sla-dossier-modal-overlay .sla-ladder-rung[data-active-rung="true"] .sla-ladder-rung-stake {
    color: var(--sla-positive-soft);
  }
  #sla-search-autocomplete-dropdown {
    position: fixed;
    z-index: 99998;
    background: rgba(8, 12, 22, 0.98);
    border: 1px solid rgba(var(--sla-accent-rgb), 0.42);
    border-radius: 14px;
    box-shadow: 0 20px 50px rgba(var(--sla-black-rgb), 0.85), 0 0 25px rgba(var(--sla-accent-rgb), 0.14);
    backdrop-filter: blur(16px);
    padding: 8px;
    display: none;
    max-height: 360px;
    overflow-y: auto;
    font-family: Inter, system-ui, -apple-system, sans-serif;
  }
  .sla-ac-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 12px;
    border-radius: 10px;
    cursor: pointer;
    transition: background 0.12s ease;
    border-bottom: 1px solid rgba(var(--sla-white-rgb), 0.04);
  }
  .sla-ac-row:last-child {
    border-bottom: none;
  }
  .sla-ac-row:hover {
    background: rgba(var(--sla-accent-rgb), 0.12);
  }


  #sla-how-agentsla-works-section {
    max-width: 1220px;
    margin: 48px auto 56px auto;
    padding: 0 20px;
    box-sizing: border-box;
    font-family: Inter, system-ui, -apple-system, sans-serif;
    position: relative;
    z-index: 10;
  }
  .sla-tf-sec-header {
    text-align: center;
    margin-bottom: 28px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .sla-tf-hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 16px;
    border-radius: 999px;
    background: rgba(var(--sla-warning-rgb), 0.12);
    border: 1px solid rgba(var(--sla-warning-rgb), 0.38);
    color: var(--sla-warning);
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 16px;
  }
  #sla-how-agentsla-works-section .sla-tf-hero-title,
  #sla-typeform-modal-backdrop .sla-tf-hero-title {
    font-size: clamp(2.5rem, 5.6vw, 4.5rem) !important;
    font-weight: 900 !important;
    color: var(--sla-text) !important;
    letter-spacing: -0.035em !important;
    line-height: 1.05 !important;
    margin: 0 auto 16px auto !important;
    text-transform: uppercase !important;
    max-width: 1040px !important;
    text-align: center !important;
  }
  #sla-how-agentsla-works-section .sla-tf-hero-subtitle,
  #sla-typeform-modal-backdrop .sla-tf-hero-subtitle {
    font-size: clamp(16px, 1.8vw, 19px) !important;
    color: var(--sla-text-muted) !important;
    line-height: 1.65 !important;
    max-width: 780px !important;
    margin: 0 auto !important;
    font-weight: 400 !important;
    text-align: center !important;
  }
  .sla-tf-card-logos {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 4px;
  }
  .sla-tf-logo-stack {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
  }
  .sla-tf-logo-avatar {
    width: 26px;
    height: 26px;
    border-radius: 7px;
    background: var(--sla-surface-slate);
    border: 1px solid rgba(var(--sla-white-rgb), 0.16);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(var(--sla-black-rgb), 0.45);
  }
  .sla-tf-logo-avatar img {
    width: 18px;
    height: 18px;
    border-radius: 4px;
    object-fit: contain;
    background: var(--sla-white);
    padding: 1px;
  }
  .sla-tf-brand-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 11px;
    border-radius: 999px;
    background: rgba(var(--sla-surface-slate-rgb), 0.9);
    border: 1px solid rgba(var(--sla-white-rgb), 0.09);
    color: var(--sla-text-2);
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.01em;
    white-space: nowrap;
  }
  .sla-tf-brand-chip img {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    object-fit: contain;
    display: block;
  }
  .sla-tf-persona-switcher {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 18px;
    flex-wrap: wrap;
  }
  .sla-tf-persona-pill {
    background: rgba(var(--sla-surface-slate-rgb), 0.85);
    border: 1px solid rgba(var(--sla-white-rgb), 0.1);
    color: var(--sla-text-muted);
    padding: 10px 18px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.18s ease;
  }
  .sla-tf-persona-pill:hover {
    border-color: rgba(var(--sla-accent-rgb), 0.55);
    color: var(--sla-text);
  }
  .sla-tf-persona-pill[data-active="true"] {
    background: rgba(var(--sla-positive-rgb), 0.16);
    border-color: var(--sla-positive);
    color: var(--sla-positive-soft);
    box-shadow: 0 0 18px rgba(var(--sla-positive-rgb), 0.2);
  }
  .sla-tf-shell {
    background: linear-gradient(165deg, rgba(var(--sla-surface-2-rgb), 0.96) 0%, rgba(6, 10, 20, 0.98) 100%);
    border: 1px solid rgba(var(--sla-accent-rgb), 0.32);
    border-radius: 22px;
    padding: 32px 38px;
    box-shadow: 0 24px 64px rgba(var(--sla-black-rgb), 0.82), 0 0 32px rgba(var(--sla-accent-rgb), 0.08);
    position: relative;
    overflow: hidden;
  }
  @media (max-width: 768px) {
    .sla-tf-shell { padding: 22px 18px; }
  }
  .sla-tf-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 22px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(var(--sla-white-rgb), 0.07);
    flex-wrap: wrap;
  }
  .sla-tf-step-counter {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 11.5px;
    font-weight: 800;
    color: var(--sla-accent);
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }
  .sla-tf-progress-wrap {
    flex: 1;
    max-width: 320px;
    height: 6px;
    background: rgba(var(--sla-white-rgb), 0.08);
    border-radius: 999px;
    overflow: hidden;
  }
  .sla-tf-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--sla-positive) 0%, var(--sla-accent) 100%);
    border-radius: 999px;
    transition: width 0.38s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .sla-tf-stage {
    animation: slaTfSlideIn 0.32s cubic-bezier(0.22, 1, 0.36, 1);
  }
  @keyframes slaTfSlideIn {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
  }
  .sla-tf-q-title {
    font-size: clamp(21px, 2.8vw, 29px);
    font-weight: 900;
    color: var(--sla-text);
    letter-spacing: -0.02em;
    margin: 0 0 8px 0;
    line-height: 1.25;
  }
  .sla-tf-q-sub {
    font-size: 14.5px;
    color: var(--sla-text-muted);
    margin: 0 0 24px 0;
    line-height: 1.6;
  }
  .sla-tf-options-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
  }
  @media (max-width: 920px) {
    .sla-tf-options-list { grid-template-columns: 1fr; }
  }
  .sla-tf-option-card {
    background: rgba(var(--sla-surface-slate-rgb), 0.78);
    border: 1px solid rgba(var(--sla-white-rgb), 0.1);
    border-radius: 16px;
    padding: 20px;
    cursor: pointer;
    transition: all 0.18s cubic-bezier(0.22, 1, 0.36, 1);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 12px;
    user-select: none;
  }
  .sla-tf-option-card:hover {
    border-color: var(--sla-accent);
    background: rgba(var(--sla-accent-rgb), 0.1);
    transform: translateY(-3px);
    box-shadow: 0 14px 32px rgba(var(--sla-black-rgb), 0.55);
  }
  .sla-tf-option-card[data-selected="true"] { background: rgba(var(--sla-surface-slate-rgb), 0.78); border-color: rgba(var(--sla-white-rgb), 0.1); box-shadow: none; }
  .sla-tf-keybadge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 9px;
    border-radius: 6px;
    background: rgba(var(--sla-accent-rgb), 0.14);
    border: 1px solid rgba(var(--sla-accent-rgb), 0.4);
    color: var(--sla-accent);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 11px;
    font-weight: 800;
    width: fit-content;
  }
  .sla-tf-opt-heading {
    font-size: 16px;
    font-weight: 800;
    color: var(--sla-text);
    line-height: 1.3;
  }
  .sla-tf-opt-body {
    font-size: 13px;
    color: var(--sla-text-muted);
    line-height: 1.55;
  }
  .sla-tf-opt-metric {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 11px;
    font-weight: 800;
    color: var(--sla-positive);
    padding-top: 8px;
    border-top: 1px solid rgba(var(--sla-white-rgb), 0.06);
  }

  /* Page 04: "THE AUTONOMOUS TRUST" Mirrored Chart Design */
  .sla-arch-chart-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    margin: 18px 0 24px 0;
  }
  @media (max-width: 860px) {
    .sla-arch-chart-grid { grid-template-columns: 1fr; }
  }
  .sla-arch-col-card {
    border-radius: 20px;
    padding: 26px 28px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .sla-arch-col-legacy {
    background: linear-gradient(180deg, rgba(var(--sla-surface-slate-rgb), 0.72) 0%, rgba(9, 13, 24, 0.92) 100%);
    border: 1px solid rgba(var(--sla-white-rgb), 0.1);
    box-shadow: inset 0 1px 0 rgba(var(--sla-white-rgb), 0.04);
  }
  .sla-arch-col-sovereign {
    background: linear-gradient(165deg, rgba(var(--sla-positive-rgb), 0.12) 0%, rgba(10, 22, 40, 0.96) 55%, rgba(6, 12, 24, 0.98) 100%);
    border: 1.5px solid rgba(var(--sla-positive-rgb), 0.55);
    box-shadow: 0 20px 50px rgba(var(--sla-black-rgb), 0.65), 0 0 36px rgba(var(--sla-positive-rgb), 0.16);
  }
  .sla-arch-col-topbadge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 12px;
    border-radius: 999px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 10.5px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    width: fit-content;
    margin-bottom: 14px;
  }
  .sla-arch-badge-legacy {
    background: rgba(var(--sla-danger-rgb), 0.12);
    border: 1px solid rgba(var(--sla-danger-rgb), 0.35);
    color: var(--sla-danger-soft);
  }
  .sla-arch-badge-sovereign {
    background: rgba(var(--sla-positive-rgb), 0.18);
    border: 1px solid rgba(var(--sla-positive-rgb), 0.5);
    color: #34d399;
  }
  .sla-arch-col-heading {
    font-size: 20px;
    font-weight: 900;
    color: var(--sla-text);
    letter-spacing: -0.02em;
    margin: 0 0 16px 0;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(var(--sla-white-rgb), 0.08);
  }
  .sla-arch-row-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  .sla-arch-row-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 13px 15px;
    border-radius: 13px;
    background: rgba(5, 9, 18, 0.65);
    border: 1px solid rgba(var(--sla-white-rgb), 0.06);
  }
  .sla-arch-col-sovereign .sla-arch-row-item {
    background: rgba(6, 14, 26, 0.82);
    border-color: rgba(var(--sla-positive-rgb), 0.25);
  }
  .sla-arch-row-icon {
    width: 24px;
    height: 24px;
    border-radius: 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 900;
    flex-shrink: 0;
    margin-top: 1px;
  }
  .sla-arch-icon-x {
    background: rgba(var(--sla-danger-rgb), 0.16);
    border: 1px solid rgba(var(--sla-danger-rgb), 0.4);
    color: var(--sla-danger-soft);
  }
  .sla-arch-icon-check {
    background: rgba(var(--sla-positive-rgb), 0.22);
    border: 1px solid rgba(var(--sla-positive-rgb), 0.55);
    color: var(--sla-positive);
  }
  .sla-arch-row-label {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    margin-bottom: 3px;
  }
  .sla-arch-row-text {
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--sla-text-3);
  }
  .sla-arch-col-sovereign .sla-arch-row-text {
    color: var(--sla-text);
    font-weight: 500;
  }

  /* Interactive Protocol Lab Pages (Pages 05, 06, 07) */
  .sla-tf-single-lab-stage {
    max-width: 760px;
    margin: 0 auto;
    background: rgba(var(--sla-surface-slate-rgb), 0.88);
    border: 1px solid rgba(var(--sla-accent-rgb), 0.35);
    border-radius: 18px;
    padding: 28px 30px;
    box-shadow: 0 18px 45px rgba(var(--sla-black-rgb), 0.6);
    transition: all 0.22s ease;
  }
  .sla-tf-single-lab-stage[data-step-done="true"] {
    border-color: var(--sla-positive);
    background: linear-gradient(165deg, rgba(var(--sla-positive-rgb), 0.14) 0%, rgba(var(--sla-surface-slate-rgb), 0.92) 100%);
    box-shadow: 0 0 32px rgba(var(--sla-positive-rgb), 0.2);
  }
  .sla-tf-single-lab-stage[data-verdict="warn"] {
    border-color: var(--sla-warning) !important;
    background: linear-gradient(165deg, rgba(var(--sla-warning-rgb), 0.14) 0%, rgba(var(--sla-surface-slate-rgb), 0.94) 100%) !important;
    box-shadow: 0 0 32px rgba(var(--sla-warning-rgb), 0.18) !important;
  }
  .sla-tf-single-lab-stage[data-verdict="danger"] {
    border-color: var(--sla-danger) !important;
    background: linear-gradient(165deg, rgba(var(--sla-danger-rgb), 0.15) 0%, rgba(var(--sla-surface-slate-rgb), 0.95) 100%) !important;
    box-shadow: 0 0 32px rgba(var(--sla-danger-rgb), 0.2) !important;
  }
  .sla-tf-step-status {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 11px;
    font-weight: 900;
    padding: 4px 10px;
    border-radius: 999px;
    letter-spacing: 0.05em;
  }
  .sla-tf-step-status[data-done="false"] {
    background: rgba(var(--sla-accent-rgb), 0.14);
    color: var(--sla-accent);
    border: 1px solid rgba(var(--sla-accent-rgb), 0.35);
  }
  .sla-tf-step-status[data-done="true"] {
    background: rgba(var(--sla-positive-rgb), 0.2);
    color: var(--sla-positive);
    border: 1px solid var(--sla-positive);
  }
  .sla-tf-step-status[data-verdict="warn"] {
    background: rgba(var(--sla-warning-rgb), 0.2) !important;
    color: #fdba74 !important;
    border: 1px solid var(--sla-warning) !important;
  }
  .sla-tf-step-status[data-verdict="danger"] {
    background: rgba(var(--sla-danger-rgb), 0.22) !important;
    color: #fca5a5 !important;
    border: 1px solid var(--sla-danger) !important;
  }
  .sla-tf-lab-input {
    width: 100%;
    box-sizing: border-box;
    background: rgba(5, 9, 18, 0.94);
    border: 1px solid rgba(var(--sla-accent-rgb), 0.42);
    border-radius: 12px;
    padding: 13px 16px;
    color: var(--sla-text);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 14px;
    outline: none;
    margin-bottom: 12px;
  }
  .sla-tf-lab-input:focus {
    border-color: var(--sla-positive);
    box-shadow: 0 0 16px rgba(var(--sla-positive-rgb), 0.28);
  }
  .sla-tf-lab-btn {
    width: 100%;
    background: rgba(var(--sla-accent-rgb), 0.18);
    color: var(--sla-accent);
    border: 1px solid rgba(var(--sla-accent-rgb), 0.52);
    border-radius: 12px;
    padding: 13px 18px;
    font-size: 12.5px;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.16s ease;
  }
  .sla-tf-lab-btn:hover {
    background: rgba(var(--sla-accent-rgb), 0.3);
    color: var(--sla-text);
  }
  .sla-tf-lab-btn[data-done="true"] {
    background: rgba(var(--sla-positive-rgb), 0.24);
    color: var(--sla-positive-soft);
    border-color: var(--sla-positive);
  }
  .sla-tf-lab-btn[data-verdict="warn"] {
    background: rgba(var(--sla-warning-rgb), 0.22) !important;
    color: #fed7aa !important;
    border-color: var(--sla-warning) !important;
  }
  .sla-tf-lab-btn[data-verdict="danger"] {
    background: rgba(var(--sla-danger-rgb), 0.24) !important;
    color: #fecaca !important;
    border-color: var(--sla-danger) !important;
  }
  .sla-tf-lab-output {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12.5px;
    line-height: 1.55;
    padding: 14px 16px;
    border-radius: 10px;
    background: rgba(4, 8, 16, 0.92);
    border: 1px solid rgba(var(--sla-white-rgb), 0.09);
    color: var(--sla-text-3);
    margin-top: 14px;
  }
  .sla-tf-footer-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid rgba(var(--sla-white-rgb), 0.07);
    flex-wrap: wrap;
  }
  .sla-tf-action-btn {
    background: linear-gradient(135deg, var(--sla-positive) 0%, var(--sla-positive-strong) 100%);
    color: #04130d;
    border: none;
    border-radius: 999px;
    padding: 11px 24px;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.15s ease;
  }
  .sla-tf-action-btn:hover {
    opacity: 0.92;
  }
  .sla-tf-secondary-btn {
    background: rgba(var(--sla-accent-rgb), 0.14);
    color: var(--sla-accent);
    border: 1px solid rgba(var(--sla-accent-rgb), 0.4);
    border-radius: 999px;
    padding: 9px 18px;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
  }
  #sla-typeform-modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(3, 6, 14, 0.92);
    backdrop-filter: blur(16px);
    z-index: 999995;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    box-sizing: border-box;
    overflow-y: auto;
  }
  .sla-tf-modal-dialog {
    width: 100%;
    max-width: 1040px;
    margin: auto;
  }

  /* Universal 3-Role Dossier Modal */
  #sla-universal-dossier-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(3, 6, 14, 0.88);
    backdrop-filter: blur(14px);
    z-index: 1000005;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    box-sizing: border-box;
    overflow-y: auto;
    font-family: Inter, system-ui, -apple-system, sans-serif;
  }
  .sla-univ-dossier-card {
    width: 100%;
    max-width: 680px;
    background: linear-gradient(165deg, #080d1a 0%, #050912 100%);
    border: 1px solid rgba(var(--sla-accent-rgb), 0.35);
    border-radius: 22px;
    padding: 28px 30px;
    box-shadow: 0 28px 75px rgba(var(--sla-black-rgb), 0.92), 0 0 40px rgba(var(--sla-accent-rgb), 0.12);
    color: var(--sla-text);
    position: relative;
    margin: auto;
  }
  .sla-univ-close-btn {
    position: absolute;
    top: 22px;
    right: 22px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(var(--sla-white-rgb), 0.06);
    border: 1px solid rgba(var(--sla-white-rgb), 0.12);
    color: var(--sla-text-muted);
    font-size: 16px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .sla-univ-close-btn:hover {
    color: var(--sla-text);
    border-color: rgba(var(--sla-accent-rgb), 0.5);
  }
  .sla-univ-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 18px 0 14px 0;
  }
  @media (max-width: 640px) {
    .sla-univ-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  .sla-univ-kpi-box {
    background: rgba(var(--sla-surface-2-rgb), 0.9);
    border: 1px solid rgba(var(--sla-white-rgb), 0.08);
    border-radius: 12px;
    padding: 12px 14px;
  }
  .sla-dossier-lens-bar {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    padding: 6px;
    margin: 14px 0 16px 0;
    background: rgba(5, 9, 18, 0.92);
    border: 1px solid rgba(var(--sla-accent-rgb), 0.28);
    border-radius: 14px;
  }
  .sla-dossier-lens-btn {
    background: transparent;
    border: 1px solid transparent;
    color: var(--sla-text-muted);
    padding: 9px 10px;
    border-radius: 10px;
    font-family: Inter, system-ui, -apple-system, sans-serif;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.16s ease;
    text-align: center;
    white-space: nowrap;
  }
  .sla-dossier-lens-btn:hover {
    color: var(--sla-text);
    background: rgba(var(--sla-white-rgb), 0.05);
  }
  .sla-dossier-lens-btn[data-active="true"] {
    background: rgba(var(--sla-positive-rgb), 0.18);
    border-color: var(--sla-positive);
    color: var(--sla-positive-soft);
    box-shadow: 0 0 16px rgba(var(--sla-positive-rgb), 0.18);
  }
  .sla-consumer-safety-card {
    background: linear-gradient(165deg, rgba(var(--sla-positive-rgb), 0.11) 0%, rgba(var(--sla-surface-2-rgb), 0.95) 100%);
    border: 1px solid rgba(var(--sla-positive-rgb), 0.42);
    border-radius: 16px;
    padding: 18px 20px;
    margin-bottom: 14px;
  }
  .sla-consumer-pill-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
  }
  @media (max-width: 640px) {
    .sla-dossier-lens-bar { grid-template-columns: 1fr; }
    .sla-consumer-pill-row { grid-template-columns: 1fr; }
  }
  .sla-consumer-mini-box {
    background: rgba(5, 9, 18, 0.78);
    border: 1px solid rgba(var(--sla-white-rgb), 0.08);
    border-radius: 10px;
    padding: 10px 12px;
  }
  .sla-univ-ladder-box {
    background: rgba(var(--sla-surface-2-rgb), 0.85);
    border: 1px solid rgba(var(--sla-white-rgb), 0.08);
    border-radius: 16px;
    padding: 16px 18px;
    margin-bottom: 14px;
  }
  .sla-univ-ladder-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
  }
  @media (max-width: 640px) {
    .sla-univ-ladder-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  .sla-univ-rung {
    background: rgba(5, 9, 18, 0.9);
    border: 1px solid rgba(var(--sla-white-rgb), 0.08);
    border-radius: 10px;
    padding: 10px 8px;
    text-align: center;
    cursor: pointer;
    transition: all 0.15s ease;
  }
  .sla-univ-rung:hover {
    border-color: var(--sla-accent);
    transform: translateY(-2px);
  }
  .sla-univ-rung[data-active="true"] {
    background: rgba(var(--sla-positive-rgb), 0.16);
    border-color: var(--sla-positive);
    box-shadow: 0 0 16px rgba(var(--sla-positive-rgb), 0.2);
  }
  .sla-univ-receipt-box {
    background: rgba(var(--sla-positive-rgb), 0.07);
    border: 1px solid rgba(var(--sla-positive-rgb), 0.35);
    border-radius: 14px;
    padding: 14px 16px;
    margin-bottom: 14px;
  }
  .sla-univ-pre {
    background: #04070f;
    border: 1px solid rgba(var(--sla-white-rgb), 0.08);
    border-radius: 12px;
    padding: 14px 16px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12px;
    color: var(--sla-text-2);
    overflow-x: auto;
    margin: 10px 0 14px 0;
    line-height: 1.5;
  }
  .sla-role-cta-stack {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 14px;
  }
  .sla-role-primary-btn {
    width: 100%;
    padding: 14px 20px;
    border-radius: 999px;
    border: none;
    background: linear-gradient(135deg, var(--sla-positive) 0%, var(--sla-positive-strong) 100%);
    color: #04130d;
    font-family: Inter, system-ui, -apple-system, sans-serif;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.15s ease;
  }
  .sla-role-primary-btn:hover {
    opacity: 0.92;
  }
  .sla-role-secondary-btn {
    width: 100%;
    padding: 14px 20px;
    border-radius: 999px;
    border: none;
    background: linear-gradient(135deg, var(--sla-accent) 0%, #0284c7 100%);
    color: #041019;
    font-family: Inter, system-ui, -apple-system, sans-serif;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.15s ease;
  }
  .sla-role-secondary-btn:hover {
    opacity: 0.92;
  }


  #sla-how-agentsla-works-section .sla-tf-option-card,
  #sla-how-agentsla-works-section .sla-tf-option-card[data-selected="true"],
  #sla-how-agentsla-works-section .sla-tf-option-card[data-selected="false"],
  #sla-typeform-modal-backdrop .sla-tf-option-card,
  #sla-typeform-modal-backdrop .sla-tf-option-card[data-selected="true"],
  #sla-typeform-modal-backdrop .sla-tf-option-card[data-selected="false"] {
    background: rgba(var(--sla-surface-slate-rgb), 0.78) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.1) !important;
    box-shadow: none !important;
    transform: none !important;
    cursor: pointer !important;
    transition: all 0.18s cubic-bezier(0.22, 1, 0.36, 1) !important;
  }
  #sla-how-agentsla-works-section .sla-tf-option-card:hover,
  #sla-how-agentsla-works-section .sla-tf-option-card[data-selected="true"]:hover,
  #sla-how-agentsla-works-section .sla-tf-option-card[data-selected="false"]:hover,
  #sla-typeform-modal-backdrop .sla-tf-option-card:hover,
  #sla-typeform-modal-backdrop .sla-tf-option-card[data-selected="true"]:hover,
  #sla-typeform-modal-backdrop .sla-tf-option-card[data-selected="false"]:hover {
    border-color: var(--sla-accent) !important;
    background: rgba(var(--sla-accent-rgb), 0.1) !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 14px 32px rgba(var(--sla-black-rgb), 0.55) !important;
  }


  #sla-how-agentsla-works-section [data-exec-primary],
  #sla-how-agentsla-works-section [data-exec-secondary],
  #sla-typeform-modal-backdrop [data-exec-primary],
  #sla-typeform-modal-backdrop [data-exec-secondary] {
    display: none !important;
  }


  .sla-tf-shell .sla-tf-footer-nav {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    gap: 12px !important;
    flex-wrap: nowrap !important;
  }


  /* 1. TOP SWITCHER: Single-Line Linear/iOS Segmented Control Track (No Floating Pills) */
  #sla-how-agentsla-works-section .sla-tf-persona-switcher,
  #sla-typeform-modal-backdrop .sla-tf-persona-switcher {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 4px !important;
    max-width: 100% !important;
    margin: 0 auto 18px auto !important;
    padding: 4px !important;
    background: rgba(10, 15, 28, 0.92) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.1) !important;
    border-radius: 10px !important;
    box-shadow: inset 0 1px 0 rgba(var(--sla-white-rgb), 0.04) !important;
  }

  #sla-how-agentsla-works-section .sla-tf-persona-pill,
  #sla-typeform-modal-backdrop .sla-tf-persona-pill {
    all: unset !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
    min-height: 30px !important;
    padding: 6px 8px !important;
    border-radius: 7px !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    color: var(--sla-text-muted) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.02em !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    white-space: normal !important;
    word-break: break-word !important;
  }

  #sla-how-agentsla-works-section .sla-tf-persona-pill:hover,
  #sla-typeform-modal-backdrop .sla-tf-persona-pill:hover {
    color: var(--sla-text) !important;
    background: rgba(var(--sla-white-rgb), 0.05) !important;
  }

  #sla-how-agentsla-works-section .sla-tf-persona-pill[data-active="true"],
  #sla-typeform-modal-backdrop .sla-tf-persona-pill[data-active="true"] {
    background: rgba(var(--sla-accent-rgb), 0.14) !important;
    border-color: rgba(var(--sla-accent-rgb), 0.4) !important;
    color: var(--sla-accent) !important;
  }

  /* 2. PRIMARY STAGE & LAB BUTTONS: Sleek 8px Rectangular Bars with Multi-Line Wrap Safety */
  #sla-how-agentsla-works-section .sla-tf-action-btn,
  #sla-typeform-modal-backdrop .sla-tf-action-btn,
  #sla-how-agentsla-works-section .sla-tf-lab-btn,
  #sla-typeform-modal-backdrop .sla-tf-lab-btn {
    all: unset !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    height: auto !important;
    min-height: 36px !important;
    padding: 9px 18px !important;
    border-radius: 8px !important;
    background: rgba(var(--sla-accent-rgb), 0.14) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.48) !important;
    color: var(--sla-accent) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
  }

  #sla-how-agentsla-works-section .sla-tf-lab-btn,
  #sla-typeform-modal-backdrop .sla-tf-lab-btn {
    display: flex !important;
    width: 100% !important;
  }

  #sla-how-agentsla-works-section .sla-tf-action-btn:hover,
  #sla-typeform-modal-backdrop .sla-tf-action-btn:hover,
  #sla-how-agentsla-works-section .sla-tf-lab-btn:hover,
  #sla-typeform-modal-backdrop .sla-tf-lab-btn:hover {
    background: rgba(var(--sla-accent-rgb), 0.24) !important;
    border-color: var(--sla-accent) !important;
    color: var(--sla-text) !important;
  }

  /* 3. BOTTOM FOOTER BAR: Minimal Ghost / Hairline Micro-Buttons (Zero Bulk) */
  #sla-how-agentsla-works-section .sla-tf-footer-nav,
  #sla-typeform-modal-backdrop .sla-tf-footer-nav {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    width: 100% !important;
    margin-top: 18px !important;
    padding-top: 12px !important;
    border-top: 1px solid rgba(var(--sla-white-rgb), 0.07) !important;
    flex-wrap: nowrap !important;
  }

  #sla-how-agentsla-works-section .sla-tf-secondary-btn,
  #sla-typeform-modal-backdrop .sla-tf-secondary-btn {
    all: unset !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    height: auto !important;
    min-height: 28px !important;
    padding: 5px 11px !important;
    border-radius: 6px !important;
    background: rgba(var(--sla-white-rgb), 0.03) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.12) !important;
    color: var(--sla-text-muted) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.03em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
  }

  #sla-how-agentsla-works-section .sla-tf-secondary-btn:hover,
  #sla-typeform-modal-backdrop .sla-tf-secondary-btn:hover {
    background: rgba(var(--sla-white-rgb), 0.08) !important;
    border-color: rgba(var(--sla-accent-rgb), 0.45) !important;
    color: var(--sla-text) !important;
  }

  /* 4. DOSSIER MODAL BUTTONS: Sleek 8px Bars with Safe Wrapping */
  #sla-universal-dossier-backdrop .sla-role-primary-btn,
  #sla-universal-dossier-backdrop .sla-role-secondary-btn {
    height: auto !important;
    min-height: 38px !important;
    padding: 9px 14px !important;
    border-radius: 8px !important;
    font-size: 11.5px !important;
    line-height: 1.35 !important;
    white-space: normal !important;
    word-break: break-word !important;
  }

  /* 5. MOBILE BREAKPOINT: Ultra-Clean & Compact */
  @media (max-width: 640px) {
    #sla-how-agentsla-works-section .sla-tf-persona-switcher,
    #sla-typeform-modal-backdrop .sla-tf-persona-switcher {
      grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
      gap: 3px !important;
      padding: 3px !important;
      margin-bottom: 12px !important;
    }

    #sla-how-agentsla-works-section .sla-tf-persona-pill,
    #sla-typeform-modal-backdrop .sla-tf-persona-pill {
      font-size: 10px !important;
      padding: 5px 4px !important;
      min-height: 26px !important;
      letter-spacing: 0 !important;
    }

    #sla-how-agentsla-works-section .sla-tf-action-btn,
    #sla-typeform-modal-backdrop .sla-tf-action-btn,
    #sla-how-agentsla-works-section .sla-tf-lab-btn,
    #sla-typeform-modal-backdrop .sla-tf-lab-btn {
      font-size: 11px !important;
      padding: 8px 12px !important;
      min-height: 34px !important;
    }

    #sla-how-agentsla-works-section .sla-tf-secondary-btn,
    #sla-typeform-modal-backdrop .sla-tf-secondary-btn {
      font-size: 10px !important;
      padding: 4px 9px !important;
      min-height: 26px !important;
    }
  }


  /* 1. SHELL & PROGRESS TOPBAR: Clean 3-Part Layout on Desktop & Mobile */
  #sla-how-agentsla-works-section .sla-tf-shell,
  #sla-typeform-modal-backdrop .sla-tf-shell {
    background: linear-gradient(165deg, rgba(var(--sla-surface-2-rgb), 0.96) 0%, rgba(6, 10, 20, 0.98) 100%) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.28) !important;
    border-radius: 20px !important;
    padding: 28px 32px !important;
    box-shadow: 0 24px 60px rgba(var(--sla-black-rgb), 0.8) !important;
    box-sizing: border-box !important;
  }

  #sla-how-agentsla-works-section .sla-tf-topbar,
  #sla-typeform-modal-backdrop .sla-tf-topbar {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin-bottom: 20px !important;
    padding-bottom: 12px !important;
    border-bottom: 1px solid rgba(var(--sla-white-rgb), 0.07) !important;
    flex-wrap: nowrap !important;
  }

  /* Hide extra brand clusters inside topbar & footer nav so mobile chrome stays ultra-clean */
  .sla-topbar-brand-cluster,
  .sla-footer-ecosystem-strip {
    display: none !important;
  }

  /* 2. PAGE 01 & 02 GRID: 3-Column Bento on Desktop, 1-Column Compact Stack on Mobile */
  #sla-how-agentsla-works-section .sla-tf-options-list,
  #sla-typeform-modal-backdrop .sla-tf-options-list {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* 3. PAGE 03 (4 SECTORS): 2x2 Bento Grid on Desktop (Never 4-Across Skinny Columns!) */
  #sla-how-agentsla-works-section .sla-tf-options-list.sla-tf-sectors-bento,
  #sla-typeform-modal-backdrop .sla-tf-options-list.sla-tf-sectors-bento,
  #sla-how-agentsla-works-section .sla-tf-options-list[data-bento-sectors="true"],
  #sla-typeform-modal-backdrop .sla-tf-options-list[data-bento-sectors="true"] {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px !important;
    width: 100% !important;
  }

  /* 4. BENTO OPTION CARDS (Pages 01, 02, 03) */
  #sla-how-agentsla-works-section .sla-tf-option-card,
  #sla-typeform-modal-backdrop .sla-tf-option-card {
    background: rgba(13, 20, 36, 0.82) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.1) !important;
    border-radius: 14px !important;
    padding: 18px 20px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    gap: 12px !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  #sla-how-agentsla-works-section .sla-tf-card-logos,
  #sla-typeform-modal-backdrop .sla-tf-card-logos,
  #sla-how-agentsla-works-section .sla-card-top-flex,
  #sla-typeform-modal-backdrop .sla-card-top-flex {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    width: 100% !important;
    flex-wrap: nowrap !important;
    margin-bottom: 2px !important;
  }

  #sla-how-agentsla-works-section .sla-tf-keybadge,
  #sla-typeform-modal-backdrop .sla-tf-keybadge {
    font-size: 10.5px !important;
    padding: 3px 8px !important;
    border-radius: 6px !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
  }

  #sla-how-agentsla-works-section .sla-tf-logo-stack,
  #sla-typeform-modal-backdrop .sla-tf-logo-stack,
  #sla-how-agentsla-works-section .sla-logo-avatar-stack,
  #sla-typeform-modal-backdrop .sla-logo-avatar-stack {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    flex-wrap: nowrap !important;
    flex-shrink: 0 !important;
  }

  #sla-how-agentsla-works-section .sla-tf-opt-heading,
  #sla-typeform-modal-backdrop .sla-tf-opt-heading {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: var(--sla-text) !important;
    line-height: 1.3 !important;
    margin-top: 6px !important;
    word-break: break-word !important;
  }

  #sla-how-agentsla-works-section .sla-tf-opt-body,
  #sla-typeform-modal-backdrop .sla-tf-opt-body {
    font-size: 13px !important;
    color: var(--sla-text-muted) !important;
    line-height: 1.5 !important;
    margin-top: 6px !important;
  }

  /* Page 03 Leader Pill Row inside Sector Cards */
  .sla-sector-leader-pill {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 7px 11px !important;
    border-radius: 9px !important;
    background: rgba(6, 11, 22, 0.85) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.2) !important;
    margin-top: 8px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  #sla-how-agentsla-works-section .sla-tf-opt-metric,
  #sla-typeform-modal-backdrop .sla-tf-opt-metric {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    color: var(--sla-positive) !important;
    padding-top: 10px !important;
    border-top: 1px solid rgba(var(--sla-white-rgb), 0.07) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  /* 5. TABLET & MOBILE BREAKPOINT (<= 820px): True Mobile-First Ergonomics */
  @media (max-width: 820px) {
    #sla-how-agentsla-works-section {
      padding: 36px 14px 44px 14px !important;
    }

    #sla-how-agentsla-works-section .sla-tf-shell,
    #sla-typeform-modal-backdrop .sla-tf-shell {
      padding: 18px 16px !important;
      border-radius: 16px !important;
    }

    #sla-how-agentsla-works-section .sla-tf-q-title,
    #sla-typeform-modal-backdrop .sla-tf-q-title {
      font-size: 19px !important;
      line-height: 1.28 !important;
      margin-bottom: 6px !important;
    }

    #sla-how-agentsla-works-section .sla-tf-q-sub,
    #sla-typeform-modal-backdrop .sla-tf-q-sub {
      font-size: 13px !important;
      line-height: 1.48 !important;
      margin-bottom: 14px !important;
    }

    /* Force ALL option grids (Pages 01, 02, AND Page 03) into a 1-column stack on mobile */
    #sla-how-agentsla-works-section .sla-tf-options-list,
    #sla-typeform-modal-backdrop .sla-tf-options-list,
    #sla-how-agentsla-works-section .sla-tf-options-list.sla-tf-sectors-bento,
    #sla-typeform-modal-backdrop .sla-tf-options-list.sla-tf-sectors-bento,
    #sla-how-agentsla-works-section .sla-tf-options-list[data-bento-sectors="true"],
    #sla-typeform-modal-backdrop .sla-tf-options-list[data-bento-sectors="true"] {
      grid-template-columns: 1fr !important;
      gap: 10px !important;
    }

    /* Compact thumb-friendly cards on mobile so all options fit without endless scrolling */
    #sla-how-agentsla-works-section .sla-tf-option-card,
    #sla-typeform-modal-backdrop .sla-tf-option-card {
      padding: 14px 15px !important;
      gap: 8px !important;
      border-radius: 12px !important;
    }

    #sla-how-agentsla-works-section .sla-tf-opt-heading,
    #sla-typeform-modal-backdrop .sla-tf-opt-heading {
      font-size: 15px !important;
      margin-top: 4px !important;
    }

    #sla-how-agentsla-works-section .sla-tf-opt-body,
    #sla-typeform-modal-backdrop .sla-tf-opt-body {
      font-size: 12.5px !important;
      line-height: 1.45 !important;
      margin-top: 4px !important;
    }

    #sla-how-agentsla-works-section .sla-tf-opt-metric,
    #sla-typeform-modal-backdrop .sla-tf-opt-metric {
      font-size: 10.5px !important;
      padding-top: 8px !important;
    }

    /* Page 04 Architecture Cards on mobile */
    .sla-arch-col-card,
    .sla-arch-col-legacy,
    .sla-arch-col-sovereign {
      padding: 18px 16px !important;
      border-radius: 14px !important;
    }

    /* Prevent iOS Safari auto-zoom when tapping the search input on Pages 05-07 */
    #sla-how-agentsla-works-section input.sla-tf-lab-input,
    #sla-typeform-modal-backdrop input.sla-tf-lab-input,
    #sla-journey-input-1 {
      font-size: 16px !important;
      padding: 12px 14px !important;
    }
  }


  /* Ensure Page 03 card descriptions match the clean paragraph style of Pages 01 & 02 */
  #sla-how-agentsla-works-section .sla-tf-options-list[data-bento-sectors="true"] .sla-tf-opt-body,
  #sla-typeform-modal-backdrop .sla-tf-options-list[data-bento-sectors="true"] .sla-tf-opt-body,
  #sla-how-agentsla-works-section [data-pick-sector] .sla-tf-opt-body,
  #sla-typeform-modal-backdrop [data-pick-sector] .sla-tf-opt-body,
  .sla-sector-leader-pill {
    display: block !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    font-size: 13px !important;
    color: var(--sla-text-muted) !important;
    line-height: 1.52 !important;
    margin-top: 6px !important;
    font-weight: 400 !important;
  }


  /* 1. Hide the old 4-button switcher pills and replace with a sleek Dropdown */
  #sla-how-agentsla-works-section .sla-tf-persona-switcher,
  #sla-typeform-modal-backdrop .sla-tf-persona-switcher {
    display: none !important;
  }

  /* 2. Make the "INTERACTIVE M2M ORIENTATION" eyebrow an interactive fullscreen trigger */
  #sla-how-agentsla-works-section .sla-tf-hero-eyebrow,
  #sla-how-agentsla-works-section [data-sla-role="eyebrow"],
  #sla-typeform-modal-backdrop .sla-tf-hero-eyebrow,
  #sla-typeform-modal-backdrop [data-sla-role="eyebrow"] {
    cursor: pointer !important;
    user-select: none !important;
    transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease !important;
  }
  #sla-how-agentsla-works-section .sla-tf-hero-eyebrow:hover,
  #sla-how-agentsla-works-section [data-sla-role="eyebrow"]:hover {
    transform: translateY(-1px) !important;
    border-color: var(--sla-accent) !important;
    box-shadow: 0 0 20px rgba(var(--sla-accent-rgb), 0.25) !important;
  }

  /* 3. Custom Dark-Glass Dropdown (immune to global <button> light-blue pill rules) */
  .sla-role-dropdown-bar {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 420px !important;
    margin: 0 auto 20px auto !important;
    position: relative !important;
    z-index: 120 !important;
    box-sizing: border-box !important;
  }

  .sla-role-dropdown-trigger {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    width: 100% !important;
    padding: 11px 16px !important;
    background: rgba(12, 19, 34, 0.95) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.42) !important;
    border-radius: 12px !important;
    color: var(--sla-text) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.03em !important;
    cursor: pointer !important;
    user-select: none !important;
    box-shadow: 0 10px 28px rgba(var(--sla-black-rgb), 0.55) !important;
    transition: all 0.16s ease !important;
    box-sizing: border-box !important;
  }

  .sla-role-dropdown-trigger:hover {
    border-color: var(--sla-accent) !important;
    background: rgba(16, 26, 46, 0.98) !important;
    box-shadow: 0 12px 32px rgba(var(--sla-accent-rgb), 0.18) !important;
  }

  .sla-role-dropdown-label-wrap {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  .sla-role-dropdown-dot {
    width: 8px !important;
    height: 8px !important;
    border-radius: 999px !important;
    background: var(--sla-accent) !important;
    box-shadow: 0 0 10px var(--sla-accent) !important;
    flex-shrink: 0 !important;
  }

  .sla-role-dropdown-text {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    color: var(--sla-text) !important;
  }

  .sla-role-dropdown-chevron {
    font-size: 11px !important;
    color: var(--sla-accent) !important;
    transition: transform 0.18s ease !important;
    flex-shrink: 0 !important;
  }

  .sla-role-dropdown-bar[data-open="true"] .sla-role-dropdown-chevron {
    transform: rotate(180deg) !important;
  }

  .sla-role-dropdown-menu {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    right: 0 !important;
    background: rgba(8, 13, 26, 0.98) !important;
    backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.45) !important;
    border-radius: 13px !important;
    padding: 6px !important;
    box-shadow: 0 24px 60px rgba(var(--sla-black-rgb), 0.85) !important;
    display: none !important;
    flex-direction: column !important;
    gap: 4px !important;
    box-sizing: border-box !important;
  }

  .sla-role-dropdown-bar[data-open="true"] .sla-role-dropdown-menu {
    display: flex !important;
  }

  .sla-role-dropdown-item {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 10px 12px !important;
    border-radius: 9px !important;
    color: var(--sla-text-3) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: all 0.14s ease !important;
  }

  .sla-role-dropdown-item:hover {
    background: rgba(var(--sla-accent-rgb), 0.14) !important;
    color: var(--sla-text) !important;
  }

  .sla-role-dropdown-item[data-selected="true"] {
    background: rgba(var(--sla-positive-rgb), 0.14) !important;
    color: var(--sla-positive) !important;
    border: 1px solid rgba(var(--sla-positive-rgb), 0.35) !important;
  }

  .sla-role-dropdown-tag {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    color: var(--sla-text-faint) !important;
    text-transform: uppercase !important;
  }

  /* 4. Fullscreen Modal Upgrade (#sla-typeform-modal-backdrop) */
  #sla-typeform-modal-backdrop {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    background: rgba(3, 7, 15, 0.98) !important;
    backdrop-filter: blur(22px) !important;
    z-index: 2147483000 !important;
    overflow-y: auto !important;
    padding: 20px 16px 40px 16px !important;
    box-sizing: border-box !important;
  }

  #sla-typeform-modal-backdrop[data-open="true"] {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }

  #sla-typeform-modal-backdrop .sla-tf-modal-inner {
    width: 100% !important;
    max-width: 1120px !important;
    margin: 0 auto !important;
  }

  @media (max-width: 640px) {
    .sla-role-dropdown-bar {
      max-width: 100% !important;
      margin-bottom: 14px !important;
    }
    .sla-role-dropdown-trigger {
      padding: 10px 13px !important;
      font-size: 11.5px !important;
    }
    #sla-typeform-modal-backdrop {
      padding: 12px 10px 28px 10px !important;
    }
  }


  /* Guarantee the Fullscreen Orientation Modal hides immediately when closed via "Enter Site" */
  #sla-typeform-modal-backdrop,
  #sla-typeform-modal-backdrop[data-open="false"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  #sla-typeform-modal-backdrop[data-open="true"] {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }

  /* Style the "Enter Site" button in the modal topbar so it is always crisp, clickable, and visible */
  #sla-typeform-modal-backdrop [data-close-modal],
  #sla-typeform-modal-backdrop [data-tf-close],
  #sla-typeform-modal-backdrop .sla-tf-close-btn,
  #sla-typeform-modal-backdrop .sla-enter-site-btn {
    cursor: pointer !important;
    pointer-events: auto !important;
    z-index: 2147483647 !important;
    position: relative !important;
  }


  /* 1. Remove the inline Orientation shell from the landing page while keeping it inside the Fullscreen Modal */
  #sla-how-agentsla-works-section .sla-tf-shell,
  #sla-how-agentsla-works-section .sla-tf-persona-switcher,
  #sla-how-agentsla-works-section .sla-role-dropdown-bar {
    display: none !important;
  }

  #sla-typeform-modal-backdrop .sla-tf-shell {
    display: block !important;
  }

  /* 2. Make "WORKS" in "HOW AGENTSLA WORKS" electric blue */
  #sla-how-agentsla-works-section .sla-works-blue,
  #sla-typeform-modal-backdrop .sla-works-blue {
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
  }

  /* 3. "Start Here" Button with Black Font Color */
  .sla-start-here-btn-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    margin: 22px auto 8px auto !important;
    text-align: center !important;
  }

  #sla-start-here-fullscreen-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 36px !important;
    min-height: 44px !important;
    border-radius: 999px !important;
    background: var(--sla-accent) !important;
    border: 1px solid var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    box-shadow: 0 10px 28px rgba(var(--sla-accent-rgb), 0.28) !important;
    transition: transform 0.16s ease, background 0.16s ease, box-shadow 0.16s ease !important;
  }

  #sla-start-here-fullscreen-btn span {
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
  }

  #sla-start-here-fullscreen-btn:hover {
    background: var(--sla-accent-soft) !important;
    border-color: var(--sla-accent-soft) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 14px 34px rgba(var(--sla-accent-rgb), 0.4) !important;
  }


  /* 1. Keep the Smart Auto-Indexer popup card completely invisible so it never shifts the search bar */
  #sla-smart-auto-indexer,
  #smart-auto-indexer,
  #sla-auto-indexer-card,
  #sla-d1-auto-indexer,
  .sla-smart-auto-indexer,
  .smart-auto-indexer-card,
  [data-smart-auto-indexer],
  [data-auto-indexer],
  .sla-silent-hidden-indexer {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    position: fixed !important;
    left: -99999px !important;
    top: -99999px !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
  }

  /* 2. Horizontal Row: [ Search Bar Input ] + [ INSPECT DOSSIER Button ] on the Same Line */
  .sla-hero-search-inline-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 18px 0 14px 0 !important;
    flex-wrap: nowrap !important;
    box-sizing: border-box !important;
    position: relative !important;
    z-index: 30 !important;
  }

  .sla-hero-input-field-wrap {
    position: relative !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
  }

  .sla-hero-input-field-wrap svg.sla-hero-search-icon {
    position: absolute !important;
    left: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 16px !important;
    height: 16px !important;
    color: var(--sla-text-faint) !important;
    pointer-events: none !important;
    z-index: 3 !important;
  }

  .sla-hero-input-field-wrap input {
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 18px 0 42px !important;
    border-radius: 999px !important;
    background: rgba(8, 13, 25, 0.92) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.28) !important;
    color: var(--sla-text) !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    outline: none !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
  }

  .sla-hero-input-field-wrap input:focus {
    border-color: var(--sla-accent) !important;
    box-shadow: 0 0 0 3px rgba(var(--sla-accent-rgb), 0.18) !important;
  }

  #sla-hero-inline-inspect-btn {
    all: unset !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 24px !important;
    border-radius: 999px !important;
    background: var(--sla-accent) !important;
    border: 1px solid var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    cursor: pointer !important;
    box-shadow: 0 8px 24px rgba(var(--sla-accent-rgb), 0.28) !important;
    transition: transform 0.15s ease, background 0.15s ease, box-shadow 0.15s ease !important;
    pointer-events: auto !important;
    user-select: none !important;
  }

  #sla-hero-inline-inspect-btn:hover {
    background: var(--sla-accent-soft) !important;
    border-color: var(--sla-accent-soft) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 12px 28px rgba(var(--sla-accent-rgb), 0.4) !important;
  }

  /* Hide the old duplicate INSPECT DOSSIER button from the lower pill row */
  .sla-hidden-old-inspect-btn {
    display: none !important;
  }

  /* 3. Live Base Mainnet (#8453) Cryptographic Dossier Modal */
  #sla-hero-dossier-modal-backdrop {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    background: rgba(3, 7, 16, 0.88) !important;
    backdrop-filter: blur(18px) !important;
    z-index: 2147483646 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px 16px !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
  }

  #sla-hero-dossier-modal-backdrop[data-open="true"] {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  .sla-hd-card {
    width: 100% !important;
    max-width: 100% !important;
    background: linear-gradient(165deg, rgba(11, 18, 34, 0.98) 0%, rgba(6, 10, 20, 0.99) 100%) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.4) !important;
    border-radius: 20px !important;
    padding: 26px 28px !important;
    box-shadow: 0 28px 80px rgba(var(--sla-black-rgb), 0.9), 0 0 40px rgba(var(--sla-accent-rgb), 0.14) !important;
    color: var(--sla-text) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    box-sizing: border-box !important;
    position: relative !important;
  }

  .sla-hd-topbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding-bottom: 14px !important;
    margin-bottom: 18px !important;
    border-bottom: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
  }

  .sla-hd-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 4px 10px !important;
    border-radius: 999px !important;
    background: rgba(var(--sla-positive-rgb), 0.14) !important;
    border: 1px solid rgba(var(--sla-positive-rgb), 0.4) !important;
    color: var(--sla-positive) !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
  }

  .sla-hd-close {
    all: unset !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    padding: 6px 12px !important;
    border-radius: 8px !important;
    background: rgba(var(--sla-white-rgb), 0.05) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.14) !important;
    color: var(--sla-text-muted) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
  }

  .sla-hd-close:hover {
    background: rgba(var(--sla-white-rgb), 0.12) !important;
    color: var(--sla-text) !important;
    border-color: var(--sla-accent) !important;
  }

  .sla-hd-metrics-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin: 18px 0 !important;
  }

  .sla-hd-metric-box {
    background: rgba(var(--sla-surface-slate-rgb), 0.8) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.09) !important;
    border-radius: 12px !important;
    padding: 12px 13px !important;
    box-sizing: border-box !important;
  }

  .sla-hd-metric-label {
    font-size: 10px !important;
    font-weight: 700 !important;
    color: var(--sla-text-faint) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    margin-bottom: 5px !important;
  }

  .sla-hd-metric-val {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    color: var(--sla-text) !important;
  }

  .sla-hd-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-top: 20px !important;
  }

  .sla-hd-btn-primary,
  .sla-hd-btn-secondary {
    all: unset !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    min-height: 40px !important;
    padding: 10px 14px !important;
    border-radius: 10px !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
  }

  .sla-hd-btn-primary {
    background: var(--sla-accent) !important;
    border: 1px solid var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
  }

  .sla-hd-btn-secondary {
    background: rgba(var(--sla-accent-rgb), 0.12) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.4) !important;
    color: var(--sla-accent) !important;
  }

  @media (max-width: 640px) {
    .sla-hero-search-inline-row {
      gap: 8px !important;
    }
    .sla-hero-input-field-wrap input {
      height: 42px !important;
      min-height: 42px !important;
      font-size: 16px !important;
      padding: 0 12px 0 36px !important;
    }
    #sla-hero-inline-inspect-btn {
      height: 42px !important;
      min-height: 42px !important;
      padding: 0 14px !important;
      font-size: 11px !important;
    }
    .sla-hd-card {
      padding: 18px 16px !important;
    }
    .sla-hd-metrics-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .sla-hd-actions {
      grid-template-columns: 1fr !important;
    }
  }


  /* 1. Hero Search Row & Lower Action Button Row Spacing */
  .sla-hero-search-inline-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 22px 0 18px 0 !important;
    flex-wrap: nowrap !important;
    box-sizing: border-box !important;
  }

  .sla-hero-pill-btn-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    margin-top: 16px !important;
    width: 100% !important;
  }

  /* Ensure all 3 bottom pills (NPM I AGENTSLA, AGENTSLA.IO/MCP, AGENTSLA CREDENTIAL) share identical height & spacing */
  .sla-hero-pill-btn-row > button,
  .sla-hero-pill-btn-row > a,
  #sla-credential-trigger-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 20px !important;
    border-radius: 999px !important;
    background: var(--sla-accent) !important;
    border: 1px solid var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 900 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    user-select: none !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    transition: transform 0.15s ease, background 0.15s ease, box-shadow 0.15s ease !important;
  }

  .sla-hero-pill-btn-row > button:hover,
  .sla-hero-pill-btn-row > a:hover,
  #sla-credential-trigger-btn:hover {
    background: var(--sla-accent-soft) !important;
    border-color: var(--sla-accent-soft) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 10px 24px rgba(var(--sla-accent-rgb), 0.32) !important;
  }

  /* 2. Clean Single-Frame Modal Backdrop for "VERIFIED PROTOCOL CREDENTIAL" */
  #sla-credential-modal-backdrop {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    background: rgba(3, 7, 16, 0.88) !important;
    backdrop-filter: blur(20px) !important;
    z-index: 2147483645 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px 16px !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
  }

  #sla-credential-modal-backdrop[data-open="true"] {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  .sla-credential-modal-dialog {
    width: 100% !important;
    max-width: 640px !important;
    max-height: calc(100dvh - 40px) !important;
    overflow-y: auto !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    position: relative !important;
    margin: auto !important;
  }

  .sla-credential-modal-topbar {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    margin-bottom: 10px !important;
    padding: 0 2px !important;
  }

  .sla-credential-modal-close {
    all: unset !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    cursor: pointer !important;
    padding: 7px 14px !important;
    border-radius: 999px !important;
    background: rgba(12, 19, 35, 0.95) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.4) !important;
    color: var(--sla-text) !important;
    -webkit-text-fill-color: var(--sla-text) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    transition: all 0.15s ease !important;
    box-shadow: 0 8px 24px rgba(var(--sla-black-rgb), 0.6) !important;
  }

  .sla-credential-modal-close:hover {
    background: var(--sla-accent) !important;
    border-color: var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
  }

  /* Ensure the credential card inside the modal fills the 640px frame cleanly with balanced spacing */
  #sla-credential-modal-body {
    width: 100% !important;
    box-sizing: border-box !important;
  }

  #sla-credential-modal-body > * {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 28px 30px !important;
    border-radius: 20px !important;
    box-sizing: border-box !important;
    box-shadow: 0 28px 80px rgba(var(--sla-black-rgb), 0.9), 0 0 36px rgba(var(--sla-accent-rgb), 0.14) !important;
  }

  @media (max-width: 640px) {
    .sla-hero-pill-btn-row {
      gap: 8px !important;
    }
    .sla-hero-pill-btn-row > button,
    .sla-hero-pill-btn-row > a,
    #sla-credential-trigger-btn {
      height: 36px !important;
      min-height: 36px !important;
      padding: 0 14px !important;
      font-size: 10.5px !important;
    }
    #sla-credential-modal-body > * {
      padding: 20px 18px !important;
      border-radius: 16px !important;
    }
  }


  /* Force the Hero Section & Inner Containers to match the Directory Section's Full Width */
  [data-sla-hero-section="true"],
  [data-sla-hero-container="true"],
  [data-sla-hero-col="true"],
  [data-sla-hero-grid="true"] {
    display: block !important;
    grid-template-columns: 1fr !important;
    box-sizing: border-box !important;
  }

  [data-sla-hero-col="true"],
  [data-sla-hero-col="true"] > h1,
  [data-sla-hero-col="true"] > p,
  [data-sla-hero-col="true"] > div,
  .sla-hero-search-inline-row,
  .sla-hero-input-field-wrap,
  .sla-hero-pill-btn-row {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }


  [data-sla-hero-subcopy="true"] {
    box-sizing: border-box !important;
  }

  [data-sla-hero-subcopy="true"] a,
  [data-sla-hero-subcopy="true"] strong,
  [data-sla-hero-subcopy="true"] b,
  [data-sla-hero-subcopy="true"] span {
    font-family: inherit !important;
    font-size: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
    text-decoration: none !important;
  }

  /* Hide the old separate Pre-Transaction Safety Check paragraph below the search bar */
  [data-sla-safety-check-removed="true"] {
    display: none !important;
  }


  /* Default baseline spacing matching the Title -> Description visual gap (~36px-38px) before JS fine-tunes to the exact pixel */
  [data-sla-hero-subcopy="true"] {
    margin-bottom: 33px !important;
    padding-bottom: 0 !important;
  }

  [data-sla-search-outer-wrap="true"] {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .sla-hero-search-inline-row {
    margin-top: 0 !important;
    margin-bottom: 38px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .sla-hero-pill-btn-row {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }


  /* 1. Ensure the Full-Screen "Start Here" Orientation Modal sits ABOVE the "How It Works" Modal */
  #sla-typeform-modal-backdrop {
    z-index: 2147483647 !important;
  }

  #sla-typeform-modal-backdrop[data-open="true"],
  #sla-typeform-modal-backdrop.open,
  #sla-typeform-modal-backdrop.active {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  #sla-typeform-modal-backdrop[data-open="false"]:not(.open):not(.active) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /* 2. Blue Background + Black "X" Modal Close Button (matches Mock) */
  .sla-hiw-modal-close,
  .sla-credential-modal-close,
  .sla-hd-close,
  #sla-typeform-modal-backdrop [data-tf-close],
  #sla-typeform-modal-backdrop .sla-tf-close,
  [data-sla-black-x-close="true"] {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    border-radius: 10px !important;
    background: var(--sla-accent) !important;
    background-color: var(--sla-accent) !important;
    background-image: none !important;
    border: 1px solid var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    cursor: pointer !important;
    user-select: none !important;
    box-shadow: 0 0 22px rgba(var(--sla-accent-rgb), 0.45), 0 8px 20px rgba(var(--sla-black-rgb), 0.5) !important;
    transition: transform 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease !important;
  }

  .sla-hiw-modal-close:hover,
  .sla-credential-modal-close:hover,
  .sla-hd-close:hover,
  #sla-typeform-modal-backdrop [data-tf-close]:hover,
  #sla-typeform-modal-backdrop .sla-tf-close:hover,
  [data-sla-black-x-close="true"]:hover {
    background: var(--sla-accent-soft) !important;
    background-color: var(--sla-accent-soft) !important;
    border-color: var(--sla-accent-soft) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    box-shadow: 0 0 28px rgba(var(--sla-accent-rgb), 0.65), 0 10px 24px rgba(var(--sla-black-rgb), 0.6) !important;
    transform: translateY(-1px) !important;
  }


  /* 1. Show "HOW AGENTSLA WORKS" directly on the landing page with smooth scroll offset */
  #sla-how-agentsla-works-section {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    scroll-margin-top: 96px !important;
  }

  /* 2. "How It Works" Button in the Header */
  #sla-header-how-it-works-btn {
    all: unset !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 34px !important;
    padding: 0 16px !important;
    border-radius: 999px !important;
    background: var(--sla-accent) !important;
    border: 1px solid var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    user-select: none !important;
    transition: transform 0.15s ease, background 0.15s ease, box-shadow 0.15s ease !important;
  }

  #sla-header-how-it-works-btn:hover {
    background: var(--sla-accent-soft) !important;
    border-color: var(--sla-accent-soft) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 8px 20px rgba(var(--sla-accent-rgb), 0.32) !important;
  }


  /* Hide the original 4 FAQ pill buttons visually while keeping them in the DOM for filter binding */
  [data-sla-faq-orig-btn-row="true"] {
    display: none !important;
  }

  /* Custom FAQ Dropdown Wrapper */
  #sla-faq-dropdown-wrap {
    position: relative !important;
    display: inline-block !important;
    margin-top: 4px !important;
    margin-bottom: 24px !important;
    z-index: 50 !important;
  }

  /* Sky-Blue Pill Dropdown Trigger Button */
  #sla-faq-dropdown-trigger {
    all: unset !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    min-width: 250px !important;
    height: 42px !important;
    padding: 0 20px !important;
    border-radius: 999px !important;
    background: var(--sla-accent) !important;
    border: 1px solid var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 900 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    user-select: none !important;
    box-shadow: 0 8px 24px rgba(var(--sla-accent-rgb), 0.25) !important;
    transition: transform 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease !important;
  }

  #sla-faq-dropdown-trigger:hover {
    background: var(--sla-accent-soft) !important;
    border-color: var(--sla-accent-soft) !important;
    box-shadow: 0 10px 28px rgba(var(--sla-accent-rgb), 0.38) !important;
    transform: translateY(-1px) !important;
  }

  #sla-faq-dropdown-trigger .sla-faq-dd-chevron {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    transition: transform 0.2s ease !important;
  }

  #sla-faq-dropdown-wrap[data-open="true"] #sla-faq-dropdown-trigger .sla-faq-dd-chevron {
    transform: rotate(180deg) !important;
  }

  /* Dropdown Menu List */
  #sla-faq-dropdown-menu {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    min-width: 100% !important;
    width: max-content !important;
    background: rgba(var(--sla-surface-2-rgb), 0.98) !important;
    backdrop-filter: blur(18px) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.42) !important;
    border-radius: 16px !important;
    padding: 6px !important;
    box-shadow: 0 20px 50px rgba(var(--sla-black-rgb), 0.85), 0 0 24px rgba(var(--sla-accent-rgb), 0.15) !important;
    display: none !important;
    flex-direction: column !important;
    gap: 4px !important;
    box-sizing: border-box !important;
  }

  #sla-faq-dropdown-wrap[data-open="true"] #sla-faq-dropdown-menu {
    display: flex !important;
  }

  .sla-faq-dropdown-item {
    all: unset !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    width: 100% !important;
    padding: 11px 16px !important;
    border-radius: 11px !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    user-select: none !important;
    transition: background-color 0.15s ease, color 0.15s ease !important;
  }

  .sla-faq-dropdown-item:hover {
    background: rgba(var(--sla-accent-rgb), 0.16) !important;
    color: var(--sla-accent) !important;
    -webkit-text-fill-color: var(--sla-accent) !important;
  }

  .sla-faq-dropdown-item[data-selected="true"] {
    background: var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-weight: 900 !important;
  }


  /* Hide any injected brand/entity logos inside FAQ cards while keeping the right-hand '+' toggle button intact */
  [data-sla-faq-card="true"] img,
  [data-sla-faq-card="true"] [class*="logo"],
  [data-sla-faq-card="true"] [class*="avatar"],
  [data-sla-faq-card="true"] [class*="favicon"],
  [data-sla-faq-card="true"] [data-brand-logo],
  [data-sla-faq-logo-removed="true"] {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }


  [data-sla-fair-ranking-card-only="true"] {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }


  /* 1. Force-hide all 3 original hero buttons (including #sla-credential-trigger-btn) so ONLY the dropdown shows */
  .sla-hero-pill-btn-row > *:not(#sla-hero-actions-dropdown-wrap),
  #sla-credential-trigger-btn,
  [data-sla-hero-orig-pill="true"] {
    display: none !important;
  }

  /* 2. Preserve exact spacing between the Search Bar row and the Dropdown row */
  .sla-hero-search-inline-row {
    margin-bottom: 38px !important;
  }

  .sla-hero-pill-btn-row {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* 3. Dropdown Wrapper */
  #sla-hero-actions-dropdown-wrap {
    position: relative !important;
    display: inline-block !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 60 !important;
  }

  /* 4. Sky-Blue Pill Dropdown Trigger Button (prevent any ::before/::after duplicate icons) */
  #sla-hero-actions-dropdown-trigger {
    all: unset !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    min-width: 235px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 20px !important;
    border-radius: 999px !important;
    background: var(--sla-accent) !important;
    border: 1px solid var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 900 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    user-select: none !important;
    box-shadow: 0 8px 24px rgba(var(--sla-accent-rgb), 0.25) !important;
    transition: transform 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease !important;
  }

  #sla-hero-actions-dropdown-trigger::before,
  #sla-hero-actions-dropdown-trigger::after,
  #sla-hero-actions-dropdown-label::before,
  #sla-hero-actions-dropdown-label::after,
  .sla-hero-actions-dropdown-item::before,
  .sla-hero-actions-dropdown-item::after {
    content: none !important;
    display: none !important;
  }

  #sla-hero-actions-dropdown-trigger:hover {
    background: var(--sla-accent-soft) !important;
    border-color: var(--sla-accent-soft) !important;
    box-shadow: 0 10px 28px rgba(var(--sla-accent-rgb), 0.38) !important;
    transform: translateY(-1px) !important;
  }

  #sla-hero-actions-dropdown-label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
  }

  #sla-hero-actions-dropdown-label svg {
    width: 14px !important;
    height: 14px !important;
    stroke: var(--sla-black) !important;
    color: var(--sla-black) !important;
    flex-shrink: 0 !important;
  }

  #sla-hero-actions-dropdown-trigger .sla-hero-dd-chevron {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    transition: transform 0.2s ease !important;
  }

  #sla-hero-actions-dropdown-wrap[data-open="true"] #sla-hero-actions-dropdown-trigger .sla-hero-dd-chevron {
    transform: rotate(180deg) !important;
  }

  /* 5. Dropdown Menu Popup */
  #sla-hero-actions-dropdown-menu {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    min-width: 100% !important;
    width: max-content !important;
    background: rgba(var(--sla-surface-2-rgb), 0.98) !important;
    backdrop-filter: blur(18px) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.42) !important;
    border-radius: 16px !important;
    padding: 6px !important;
    box-shadow: 0 20px 50px rgba(var(--sla-black-rgb), 0.85), 0 0 24px rgba(var(--sla-accent-rgb), 0.15) !important;
    display: none !important;
    flex-direction: column !important;
    gap: 4px !important;
    box-sizing: border-box !important;
  }

  #sla-hero-actions-dropdown-wrap[data-open="true"] #sla-hero-actions-dropdown-menu {
    display: flex !important;
  }

  .sla-hero-actions-dropdown-item {
    all: unset !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 11px 16px !important;
    border-radius: 11px !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    user-select: none !important;
    transition: background-color 0.15s ease, color 0.15s ease !important;
  }

  .sla-hero-actions-dropdown-item svg {
    width: 14px !important;
    height: 14px !important;
    flex-shrink: 0 !important;
    stroke: currentColor !important;
  }

  .sla-hero-actions-dropdown-item:hover {
    background: rgba(var(--sla-accent-rgb), 0.16) !important;
    color: var(--sla-accent) !important;
    -webkit-text-fill-color: var(--sla-accent) !important;
  }

  .sla-hero-actions-dropdown-item[data-selected="true"] {
    background: var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-weight: 900 !important;
  }

  .sla-hero-actions-dropdown-item[data-selected="true"] svg {
    stroke: var(--sla-black) !important;
    color: var(--sla-black) !important;
  }


  /* Force all fonts and icons in both the FAQ dropdown and Hero dropdown to solid black (#000000) */
  html body #sla-faq-dropdown-wrap,
  html body #sla-faq-dropdown-wrap *,
  html body #sla-faq-dropdown-trigger,
  html body #sla-faq-dropdown-trigger *,
  html body #sla-faq-dropdown-menu,
  html body #sla-faq-dropdown-menu *,
  html body .sla-faq-dropdown-item,
  html body .sla-faq-dropdown-item *,
  html body .sla-faq-dropdown-item:hover,
  html body .sla-faq-dropdown-item:hover *,
  html body .sla-faq-dropdown-item[data-selected="true"],
  html body .sla-faq-dropdown-item[data-selected="true"] *,
  html body #sla-hero-actions-dropdown-wrap,
  html body #sla-hero-actions-dropdown-wrap *,
  html body #sla-hero-actions-dropdown-trigger,
  html body #sla-hero-actions-dropdown-trigger *,
  html body #sla-hero-actions-dropdown-menu,
  html body #sla-hero-actions-dropdown-menu *,
  html body .sla-hero-actions-dropdown-item,
  html body .sla-hero-actions-dropdown-item *,
  html body .sla-hero-actions-dropdown-item:hover,
  html body .sla-hero-actions-dropdown-item:hover *,
  html body .sla-hero-actions-dropdown-item[data-selected="true"],
  html body .sla-hero-actions-dropdown-item[data-selected="true"] * {
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-weight: 900 !important;
  }

  html body #sla-hero-actions-dropdown-wrap svg,
  html body #sla-hero-actions-dropdown-wrap svg * {
    stroke: var(--sla-black) !important;
    color: var(--sla-black) !important;
    fill: none !important;
  }



  /* Match dropdown arrow height to uppercase font cap-height in both FAQ & Hero dropdowns */
  html body #sla-faq-dropdown-trigger .sla-dd-chevron,
  html body #sla-faq-dropdown-trigger > span:last-child,
  html body #sla-hero-actions-dropdown-trigger .sla-hero-dd-chevron,
  html body #sla-hero-actions-dropdown-trigger > span:last-child {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 11.5px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    transform: scale(1.08) !important;
    transform-origin: center center !important;
    transition: transform 0.2s ease !important;
  }

  html body #sla-faq-dropdown-wrap[data-open="true"] #sla-faq-dropdown-trigger .sla-dd-chevron,
  html body #sla-faq-dropdown-wrap[data-open="true"] #sla-faq-dropdown-trigger > span:last-child,
  html body #sla-hero-actions-dropdown-wrap[data-open="true"] #sla-hero-actions-dropdown-trigger .sla-hero-dd-chevron,
  html body #sla-hero-actions-dropdown-wrap[data-open="true"] #sla-hero-actions-dropdown-trigger > span:last-child {
    transform: scale(1.08) rotate(180deg) !important;
  }



  /* Legal & Compliance Footer Column — Plain Monospace Links Matching Directory / llms-full.txt */
  #sla-footer-legal-column {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
    min-width: 220px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    text-align: left !important;
  }

  .sla-footer-legal-heading {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    color: var(--sla-warning) !important;
    -webkit-text-fill-color: var(--sla-warning) !important;
    margin: 0 0 4px 0 !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
  }

  .sla-footer-legal-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 9px !important;
    background: transparent !important;
    border: none !important;
  }

  .sla-footer-legal-list li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
  }

  /* Strictly plain text <a> link matching "Directory   Developer Tools   llms-full.txt   openapi.json   npm: agentsla" */
  html body footer a.sla-footer-legal-anchor,
  html body #sla-footer-legal-column a.sla-footer-legal-anchor {
    all: unset !important;
    display: inline-block !important;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.01em !important;
    color: var(--sla-text-3) !important;
    -webkit-text-fill-color: var(--sla-text-3) !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    width: auto !important;
    text-decoration: none !important;
    text-transform: none !important;
    cursor: pointer !important;
    transition: color 0.15s ease !important;
  }

  html body footer a.sla-footer-legal-anchor:hover,
  html body #sla-footer-legal-column a.sla-footer-legal-anchor:hover {
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  #sla-footer-legal-standalone-band {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 24px auto 12px auto !important;
    padding: 20px 24px 4px 24px !important;
    border-top: 1px solid rgba(var(--sla-white-rgb), 0.07) !important;
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    gap: 32px !important;
    background: transparent !important;
    box-sizing: border-box !important;
    text-align: left !important;
  }

  .sla-footer-regulatory-microcopy {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 18px auto 0 auto !important;
    padding: 14px 24px 0 24px !important;
    border-top: 1px solid rgba(var(--sla-white-rgb), 0.05) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 11px !important;
    line-height: 1.55 !important;
    color: var(--sla-text-faint) !important;
    text-align: left !important;
    box-sizing: border-box !important;
    background: transparent !important;
  }

  /* Full-Screen Legal & Compliance Dossier Modal */
  #sla-legal-modal-backdrop {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    background: rgba(3, 7, 15, 0.94) !important;
    backdrop-filter: blur(20px) !important;
    z-index: 2147483646 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 24px !important;
    box-sizing: border-box !important;
  }

  #sla-legal-modal-backdrop[data-open="true"] {
    display: flex !important;
  }

  .sla-legal-modal-shell {
    width: 100% !important;
    max-width: 960px !important;
    max-height: 88dvh !important;
    background: rgba(var(--sla-surface-2-rgb), 0.98) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.3) !important;
    border-radius: 22px !important;
    box-shadow: 0 28px 90px rgba(var(--sla-black-rgb), 0.88), 0 0 40px rgba(var(--sla-accent-rgb), 0.12) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    text-align: left !important;
  }

  .sla-legal-modal-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    padding: 24px 28px 18px 28px !important;
    border-bottom: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
    background: rgba(var(--sla-surface-slate-rgb), 0.6) !important;
  }

  .sla-legal-modal-eyebrow {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.14em !important;
    color: var(--sla-warning) !important;
    text-transform: uppercase !important;
    margin: 0 0 4px 0 !important;
  }

  .sla-legal-modal-title {
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: clamp(18px, 2.5vw, 24px) !important;
    font-weight: 900 !important;
    letter-spacing: -0.02em !important;
    color: var(--sla-white) !important;
    text-transform: uppercase !important;
    margin: 0 !important;
  }

  .sla-legal-modal-close {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    border-radius: 10px !important;
    background: var(--sla-accent) !important;
    border: 1px solid var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    cursor: pointer !important;
  }

  .sla-legal-tabs-bar {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 18px !important;
    padding: 14px 28px !important;
    border-bottom: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
    background: rgba(8, 13, 25, 0.85) !important;
  }

  html body .sla-legal-tab-link {
    all: unset !important;
    font-family: "JetBrains Mono", monospace !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: var(--sla-text-muted) !important;
    -webkit-text-fill-color: var(--sla-text-muted) !important;
    background: transparent !important;
    border: none !important;
    padding: 4px 0 !important;
    cursor: pointer !important;
    border-bottom: 2px solid transparent !important;
  }

  html body .sla-legal-tab-link[data-active="true"] {
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    border-bottom: 2px solid var(--sla-warning) !important;
    font-weight: 700 !important;
  }

  .sla-legal-modal-body {
    padding: 28px !important;
    overflow-y: auto !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    color: var(--sla-text-3) !important;
    font-size: 14px !important;
    line-height: 1.68 !important;
  }

  .sla-legal-modal-body h4 {
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    color: var(--sla-white) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    margin: 22px 0 8px 0 !important;
  }

  .sla-legal-modal-body h4:first-child {
    margin-top: 0 !important;
  }

  .sla-legal-modal-body p {
    margin: 0 0 14px 0 !important;
    color: var(--sla-text-3) !important;
  }

  .sla-legal-modal-body ul {
    margin: 0 0 16px 0 !important;
    padding-left: 20px !important;
    color: var(--sla-text-3) !important;
  }

  .sla-legal-modal-body li {
    margin-bottom: 6px !important;
  }



  /* 3-Column Footer Grid (Brand/Escrow Left | TOOLS Middle | LEGAL & COMPLIANCE Right) */
  #sla-footer-main-3col-row {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 8px 24px 12px 24px !important;
    display: grid !important;
    grid-template-columns: minmax(260px, 1.35fr) minmax(190px, 0.85fr) minmax(240px, 1fr) !important;
    gap: 48px !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    text-align: left !important;
  }

  @media (max-width: 860px) {
    #sla-footer-main-3col-row {
      grid-template-columns: 1fr !important;
      gap: 32px !important;
    }
  }

  /* Shared Column Styling for TOOLS and LEGAL & COMPLIANCE */
  #sla-footer-tools-column,
  #sla-footer-legal-column {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
    min-width: 190px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    text-align: left !important;
  }

  .sla-footer-legal-heading {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    color: var(--sla-warning) !important;
    -webkit-text-fill-color: var(--sla-warning) !important;
    margin: 0 0 4px 0 !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
  }

  .sla-footer-legal-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 9px !important;
    background: transparent !important;
    border: none !important;
  }

  .sla-footer-legal-list li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
  }

  /* Plain monospace <a> links (zero button bubbles) */
  html body footer a.sla-footer-legal-anchor,
  html body #sla-footer-tools-column a.sla-footer-legal-anchor,
  html body #sla-footer-legal-column a.sla-footer-legal-anchor {
    all: unset !important;
    display: inline-block !important;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.01em !important;
    color: var(--sla-text-3) !important;
    -webkit-text-fill-color: var(--sla-text-3) !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    width: auto !important;
    text-decoration: none !important;
    text-transform: none !important;
    cursor: pointer !important;
    transition: color 0.15s ease !important;
  }

  html body footer a.sla-footer-legal-anchor:hover,
  html body #sla-footer-tools-column a.sla-footer-legal-anchor:hover,
  html body #sla-footer-legal-column a.sla-footer-legal-anchor:hover {
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .sla-footer-regulatory-microcopy {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 22px auto 0 auto !important;
    padding: 14px 24px 0 24px !important;
    border-top: 1px solid rgba(var(--sla-white-rgb), 0.05) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 11px !important;
    line-height: 1.55 !important;
    color: var(--sla-text-faint) !important;
    text-align: left !important;
    box-sizing: border-box !important;
    background: transparent !important;
  }

  /* Full-Screen Legal & Compliance Dossier Modal */
  #sla-legal-modal-backdrop {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    background: rgba(3, 7, 15, 0.94) !important;
    backdrop-filter: blur(20px) !important;
    z-index: 2147483646 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 24px !important;
    box-sizing: border-box !important;
  }

  #sla-legal-modal-backdrop[data-open="true"] {
    display: flex !important;
  }

  .sla-legal-modal-shell {
    width: 100% !important;
    max-width: 960px !important;
    max-height: 88dvh !important;
    background: rgba(var(--sla-surface-2-rgb), 0.98) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.3) !important;
    border-radius: 22px !important;
    box-shadow: 0 28px 90px rgba(var(--sla-black-rgb), 0.88), 0 0 40px rgba(var(--sla-accent-rgb), 0.12) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    text-align: left !important;
  }

  .sla-legal-modal-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    padding: 24px 28px 18px 28px !important;
    border-bottom: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
    background: rgba(var(--sla-surface-slate-rgb), 0.6) !important;
  }

  .sla-legal-modal-eyebrow {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.14em !important;
    color: var(--sla-warning) !important;
    text-transform: uppercase !important;
    margin: 0 0 4px 0 !important;
  }

  .sla-legal-modal-title {
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: clamp(18px, 2.5vw, 24px) !important;
    font-weight: 900 !important;
    letter-spacing: -0.02em !important;
    color: var(--sla-white) !important;
    text-transform: uppercase !important;
    margin: 0 !important;
  }

  .sla-legal-modal-close {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    border-radius: 10px !important;
    background: var(--sla-accent) !important;
    border: 1px solid var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    cursor: pointer !important;
  }

  .sla-legal-tabs-bar {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 18px !important;
    padding: 14px 28px !important;
    border-bottom: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
    background: rgba(8, 13, 25, 0.85) !important;
  }

  html body .sla-legal-tab-link {
    all: unset !important;
    font-family: "JetBrains Mono", monospace !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: var(--sla-text-muted) !important;
    -webkit-text-fill-color: var(--sla-text-muted) !important;
    background: transparent !important;
    border: none !important;
    padding: 4px 0 !important;
    cursor: pointer !important;
    border-bottom: 2px solid transparent !important;
  }

  html body .sla-legal-tab-link[data-active="true"] {
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    border-bottom: 2px solid var(--sla-warning) !important;
    font-weight: 700 !important;
  }

  .sla-legal-modal-body {
    padding: 28px !important;
    overflow-y: auto !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    color: var(--sla-text-3) !important;
    font-size: 14px !important;
    line-height: 1.68 !important;
  }

  .sla-legal-modal-body h4 {
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    color: var(--sla-white) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    margin: 22px 0 8px 0 !important;
  }

  .sla-legal-modal-body h4:first-child {
    margin-top: 0 !important;
  }

  .sla-legal-modal-body p {
    margin: 0 0 14px 0 !important;
    color: var(--sla-text-3) !important;
  }

  .sla-legal-modal-body ul {
    margin: 0 0 16px 0 !important;
    padding-left: 20px !important;
    color: var(--sla-text-3) !important;
  }

  .sla-legal-modal-body li {
    margin-bottom: 6px !important;
  }



  /* 3-Column Footer Grid (Brand/Escrow Left | TOOLS Middle | LEGAL & COMPLIANCE Right) */
  #sla-footer-main-3col-row {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 8px 24px 12px 24px !important;
    display: grid !important;
    grid-template-columns: minmax(260px, 1.35fr) minmax(190px, 0.85fr) minmax(240px, 1fr) !important;
    gap: 48px !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    text-align: left !important;
  }

  @media (max-width: 860px) {
    #sla-footer-main-3col-row {
      grid-template-columns: 1fr !important;
      gap: 32px !important;
    }
  }

  /* Footer Brand Row: Logo + AGENT (white) + SLA (blue) */
  #sla-footer-brand-header {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    text-decoration: none !important;
  }

  #sla-footer-brand-logo-wrap {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
  }

  #sla-footer-brand-wordmark {
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    letter-spacing: -0.03em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  #sla-footer-brand-wordmark .sla-word-agent {
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
  }

  #sla-footer-brand-wordmark .sla-word-sla {
    color: var(--sla-accent) !important;
    -webkit-text-fill-color: var(--sla-accent) !important;
  }

  /* Shared Column Styling for TOOLS and LEGAL & COMPLIANCE */
  #sla-footer-tools-column,
  #sla-footer-legal-column {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
    min-width: 190px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    text-align: left !important;
  }

  .sla-footer-legal-heading {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    color: var(--sla-warning) !important;
    -webkit-text-fill-color: var(--sla-warning) !important;
    margin: 0 0 4px 0 !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
  }

  .sla-footer-legal-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 9px !important;
    background: transparent !important;
    border: none !important;
  }

  .sla-footer-legal-list li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
  }

  /* Plain monospace <a> links (zero button bubbles) */
  html body footer a.sla-footer-legal-anchor,
  html body #sla-footer-tools-column a.sla-footer-legal-anchor,
  html body #sla-footer-legal-column a.sla-footer-legal-anchor {
    all: unset !important;
    display: inline-block !important;
    font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.01em !important;
    color: var(--sla-text-3) !important;
    -webkit-text-fill-color: var(--sla-text-3) !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    width: auto !important;
    text-decoration: none !important;
    text-transform: none !important;
    cursor: pointer !important;
    transition: color 0.15s ease !important;
  }

  html body footer a.sla-footer-legal-anchor:hover,
  html body #sla-footer-tools-column a.sla-footer-legal-anchor:hover,
  html body #sla-footer-legal-column a.sla-footer-legal-anchor:hover {
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .sla-footer-regulatory-microcopy {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 22px auto 0 auto !important;
    padding: 14px 24px 0 24px !important;
    border-top: 1px solid rgba(var(--sla-white-rgb), 0.05) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 11px !important;
    line-height: 1.55 !important;
    color: var(--sla-text-faint) !important;
    text-align: left !important;
    box-sizing: border-box !important;
    background: transparent !important;
  }

  /* Full-Screen Legal & Compliance Dossier Modal */
  #sla-legal-modal-backdrop {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100dvh !important;
    background: rgba(3, 7, 15, 0.94) !important;
    backdrop-filter: blur(20px) !important;
    z-index: 2147483646 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 24px !important;
    box-sizing: border-box !important;
  }

  #sla-legal-modal-backdrop[data-open="true"] {
    display: flex !important;
  }

  .sla-legal-modal-shell {
    width: 100% !important;
    max-width: 960px !important;
    max-height: 88dvh !important;
    background: rgba(var(--sla-surface-2-rgb), 0.98) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.3) !important;
    border-radius: 22px !important;
    box-shadow: 0 28px 90px rgba(var(--sla-black-rgb), 0.88), 0 0 40px rgba(var(--sla-accent-rgb), 0.12) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    text-align: left !important;
  }

  .sla-legal-modal-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    padding: 24px 28px 18px 28px !important;
    border-bottom: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
    background: rgba(var(--sla-surface-slate-rgb), 0.6) !important;
  }

  .sla-legal-modal-eyebrow {
    font-family: "JetBrains Mono", monospace !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.14em !important;
    color: var(--sla-warning) !important;
    text-transform: uppercase !important;
    margin: 0 0 4px 0 !important;
  }

  .sla-legal-modal-title {
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: clamp(18px, 2.5vw, 24px) !important;
    font-weight: 900 !important;
    letter-spacing: -0.02em !important;
    color: var(--sla-white) !important;
    text-transform: uppercase !important;
    margin: 0 !important;
  }

  .sla-legal-modal-close {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    border-radius: 10px !important;
    background: var(--sla-accent) !important;
    border: 1px solid var(--sla-accent) !important;
    color: var(--sla-black) !important;
    -webkit-text-fill-color: var(--sla-black) !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    cursor: pointer !important;
  }

  .sla-legal-tabs-bar {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 18px !important;
    padding: 14px 28px !important;
    border-bottom: 1px solid rgba(var(--sla-white-rgb), 0.08) !important;
    background: rgba(8, 13, 25, 0.85) !important;
  }

  html body .sla-legal-tab-link {
    all: unset !important;
    font-family: "JetBrains Mono", monospace !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: var(--sla-text-muted) !important;
    -webkit-text-fill-color: var(--sla-text-muted) !important;
    background: transparent !important;
    border: none !important;
    padding: 4px 0 !important;
    cursor: pointer !important;
    border-bottom: 2px solid transparent !important;
  }

  html body .sla-legal-tab-link[data-active="true"] {
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    border-bottom: 2px solid var(--sla-warning) !important;
    font-weight: 700 !important;
  }

  .sla-legal-modal-body {
    padding: 28px !important;
    overflow-y: auto !important;
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    color: var(--sla-text-3) !important;
    font-size: 14px !important;
    line-height: 1.68 !important;
  }

  .sla-legal-modal-body h4 {
    font-family: Inter, system-ui, -apple-system, sans-serif !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    color: var(--sla-white) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    margin: 22px 0 8px 0 !important;
  }

  .sla-legal-modal-body h4:first-child {
    margin-top: 0 !important;
  }

  .sla-legal-modal-body p {
    margin: 0 0 14px 0 !important;
    color: var(--sla-text-3) !important;
  }

  .sla-legal-modal-body ul {
    margin: 0 0 16px 0 !important;
    padding-left: 20px !important;
    color: var(--sla-text-3) !important;
  }

  .sla-legal-modal-body li {
    margin-bottom: 6px !important;
  }

/* ---- style#sla-directory-row-and-sweep-css ---- */
#sla-dir-control-row {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-bottom: 14px !important;
  }
  #sla-dir-control-row > #sla-dir-search-wrap {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    flex: 1 1 0% !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 180px !important;
    height: 44px !important;
    border-radius: 9999px !important;
    background: rgba(var(--sla-surface-1-rgb), 0.92) !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.14) !important;
    padding: 0 18px 0 42px !important;
    box-sizing: border-box !important;
  }
  #sla-dir-control-row > #sla-dir-search-wrap input {
    display: block !important;
    flex: 1 1 0% !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 100% !important;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    color: var(--sla-text) !important;
    font-size: 13.5px !important;
    padding: 0 !important;
    margin: 0 !important;
  }

/* ---- style#sla-head-instant-navbar-css ---- */
/* Loaded in <head> so "How It Works" NEVER flashes as a blue pill while the page loads */
  html body header a:not(#_):not(#_):not(#_),
  html body header nav a:not(#_):not(#_):not(#_),
  html body nav a:not(#_):not(#_):not(#_) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-color: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-transform: none !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: normal !important;
  }

  html body header a[data-sla-nav-how="1"]:not(#_):not(#_):not(#_),
  html body header nav a:first-child:not(#_):not(#_):not(#_) {
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
  }

  html body[data-sla-active-tab="console"] header a[data-sla-nav-dir="1"]:not(#_):not(#_):not(#_),
  html body[data-sla-active-tab="top10"] header a[data-sla-nav-dir="1"]:not(#_):not(#_):not(#_) {
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
  }

  html body[data-sla-active-tab="directory"] header a[data-sla-nav-dir="1"] { color: var(--sla-white) !important; -webkit-text-fill-color: var(--sla-white) !important; }

/* ---- /sla-css-26a1805cc6.css ---- */
/* 1. Force ALL 3 buttons (.sla-spotify-quick-btn: DIRECTORY, CONSOLE, TOP 10 GLOBAL) to use the exact dark UI of DIRECTORY (never blue pills) */
  html body #sla-spotify-quick-picks-wrap button.sla-spotify-quick-btn:not(#_):not(#_):not(#_):not(#_),
  html body button.sla-spotify-quick-btn[data-active="false"]:not(#_):not(#_):not(#_):not(#_),
  html body button.sla-spotify-quick-btn[data-active="true"]:not(#_):not(#_):not(#_):not(#_) {
    position: relative !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 6px !important;
    background: var(--sla-border-neutral-2) !important;
    background-color: var(--sla-border-neutral-2) !important;
    background-image: none !important;
    border: 1px solid rgba(var(--sla-white-rgb), 0.12) !important;
    box-shadow: 0 4px 12px rgba(var(--sla-black-rgb), 0.35) !important;
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    overflow: hidden !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease !important;
  }

  html body #sla-spotify-quick-picks-wrap button.sla-spotify-quick-btn:hover:not(#_):not(#_):not(#_):not(#_) {
    background: var(--sla-border-neutral) !important;
    background-color: var(--sla-border-neutral) !important;
    border-color: rgba(var(--sla-accent-rgb), 0.65) !important;
  }

  html body #sla-spotify-quick-picks-wrap button.sla-spotify-quick-btn[data-active="true"]:not(#_):not(#_):not(#_):not(#_) {
    background: var(--sla-border-neutral) !important;
    background-color: var(--sla-border-neutral) !important;
    border: 1px solid rgba(var(--sla-accent-rgb), 0.85) !important;
    box-shadow: inset 0 0 0 1px rgba(var(--sla-accent-rgb), 0.5), 0 4px 12px rgba(var(--sla-black-rgb), 0.4) !important;
  }

  html body #sla-spotify-quick-picks-wrap .sla-spotify-quick-art:not(#_):not(#_):not(#_):not(#_) {
    flex: 0 0 64px !important;
    width: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    border-radius: 5px 0 0 5px !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body #sla-spotify-quick-picks-wrap .sla-spotify-quick-label:not(#_):not(#_):not(#_):not(#_) {
    flex: 1 1 auto !important;
    padding: 0 16px !important;
    font-family: "Inter", -apple-system, BlinkMacSystemFont, sans-serif !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    background: transparent !important;
    text-align: left !important;
  }

  /* 2. Permanently delete/hide the "BROWSE DIRECTORY" button (#sla-browse-directory-modal-trigger) */
  html body button#sla-browse-directory-modal-trigger:not(#_):not(#_):not(#_):not(#_),
  html body #sla-browse-directory-modal-trigger:not(#_):not(#_):not(#_):not(#_),
  html body [data-sla-browse-dir-removed="1"]:not(#_):not(#_):not(#_):not(#_) {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    pointer-events: none !important;
    overflow: hidden !important;
  }

/* ---- style#sla-header-nav-links-uniform-white-css ---- */
/* Force all top header navigation links (including "Directory") to uniform white (#ffffff), turning sky-blue (#38bdf8) ONLY on hover */
  html body header nav a:not(#_):not(#_):not(#_):not(#_):not(#_),
  html body header a[data-sla-nav-dir="1"]:not(#_):not(#_):not(#_):not(#_):not(#_),
  html body[data-sla-active-tab="directory"] header a[data-sla-nav-dir="1"]:not(#_):not(#_):not(#_):not(#_):not(#_),
  html body[data-sla-active-tab="console"] header a[data-sla-nav-dir="1"]:not(#_):not(#_):not(#_):not(#_):not(#_),
  html body[data-sla-active-tab="top10"] header a[data-sla-nav-dir="1"]:not(#_):not(#_):not(#_):not(#_):not(#_),
  html body header a[href*="directory"]:not(#_):not(#_):not(#_):not(#_):not(#_),
  html body header a[href*="#directory"]:not(#_):not(#_):not(#_):not(#_):not(#_) {
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
  }

  html body header nav a:hover:not(#_):not(#_):not(#_):not(#_):not(#_),
  html body header a[data-sla-nav-dir="1"]:hover:not(#_):not(#_):not(#_):not(#_):not(#_),
  html body header a[href*="directory"]:hover:not(#_):not(#_):not(#_):not(#_):not(#_) {
    color: var(--sla-accent) !important;
    -webkit-text-fill-color: var(--sla-accent) !important;
  }

/* ---- style#sla-delete-blue-console-pill-and-collapse-gap-css ---- */
/* 1. Hide any legacy sky-blue dropdown pill ("CONSOLE v", "DIRECTORY v", "TOP 10 GLOBAL v") */
  html body [data-sla-legacy-pill-removed="1"]:not(#_):not(#_):not(#_):not(#_),
  html body #sla-spotify-below-buttons-divider:not(#_):not(#_):not(#_):not(#_) {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
  }

  /* 2. Collapse space between the DIRECTORY / CONSOLE / TOP 10 GLOBAL row and "CRYPTOGRAPHIC VERIFICATION & SETTLEMENT" */
  html body #sla-spotify-quick-picks-wrap:not(#_):not(#_):not(#_):not(#_) {
    margin-top: 8px !important;
    margin-bottom: 4px !important;
    padding-bottom: 0 !important;
  }

  html body[data-sla-active-tab="console"] #sla-isolated-console-view:not(#_):not(#_):not(#_):not(#_),
  html body #sla-isolated-console-view:not(#_):not(#_):not(#_):not(#_) {
    margin-top: 0 !important;
    padding-top: 0 !important;
    gap: 16px !important;
  }

  html body #sla-isolated-console-view > *:first-child:not(#_):not(#_):not(#_):not(#_) {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: none !important;
  }

/* ---- style#sla-unhide-top10-cards-and-collapse-top-gap-css ---- */
/* 1. Force all Top 10 chart cards (.sla-sp-chart-card) visible immediately so they never hide behind data-sla-ready="1" */
  html body #sla-spotify-top10-view .sla-sp-chart-card:not(#_):not(#_):not(#_):not(#_),
  html body #sla-spotify-top10-view .sla-sp-chart-card:not([data-sla-ready="1"]):not(#_):not(#_):not(#_):not(#_),
  html body #sla-spotify-top10-view .sla-sp-chart-card[data-sla-ready="1"]:not(#_):not(#_):not(#_):not(#_),
  html body #sla-spotify-top10-grid:not(#_):not(#_):not(#_):not(#_) {
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* 2. Remove the horizontal line and collapse empty space between the 3 Spotify buttons and Top 10 / Console / Directory content */
  html body #sla-spotify-below-buttons-divider:not(#_):not(#_):not(#_):not(#_),
  html body hr:not(#_):not(#_):not(#_) {
    display: none !important;
    border: none !important;
    height: 0 !important;
    margin: 0 !important;
  }

  html body #sla-spotify-quick-picks-wrap:not(#_):not(#_):not(#_):not(#_) {
    margin-top: 8px !important;
    margin-bottom: 12px !important;
    padding-bottom: 0 !important;
    border-bottom: none !important;
  }

  html body #sla-spotify-top10-view:not(#_):not(#_):not(#_):not(#_),
  html body #sla-isolated-console-view:not(#_):not(#_):not(#_):not(#_) {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: none !important;
  }

  html body #sla-spotify-top10-view > *:first-child:not(#_):not(#_):not(#_):not(#_) {
    margin-top: 0 !important;
  }

/* ---- style#sla-hide-blue-pill-exact-id-css ---- */
/* Hide the blue dropdown pill & sheet by exact ID only — never touch parent containers */
  html body #sla-spotify-view-selector-wrap,
  html body #sla-spotify-view-trigger,
  html body #sla-spotify-sheet-backdrop,
  html body #sla-browse-directory-modal-trigger,
  html body #sla-spotify-below-buttons-divider {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    pointer-events: none !important;
  }

/* ---- style#sla-modal-only-white-x-css ---- */
/* 1. Keep modal close buttons in their exact modal header flow while stripping the blue circle */
  html body #sla-faq-modal-close:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body #sla-legal-modal-close:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body #sla-credential-modal-close:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body button[data-sla-modal-close-x="1"]:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body [data-sla-modal-close-x="1"]:not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-color: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
    padding: 0 !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
  }

  html body [data-sla-modal-close-x="1"] svg,
  html body [data-sla-modal-close-x="1"] svg * {
    stroke: var(--sla-white) !important;
    color: var(--sla-white) !important;
  }

  /* 2. Ensure all links inside the hamburger menu (including "Launch Console") are crisp white unless they are the sky-blue CONNECT WALLET pill */
  html body [id*="hamburger"] a:not([class*="bg-sky"]):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body [id*="mobile-menu"] a:not([class*="bg-sky"]):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_),
  html body [class*="hamburger-menu"] a:not([class*="bg-sky"]):not(#_):not(#_):not(#_):not(#_):not(#_):not(#_) {
    color: var(--sla-white) !important;
    -webkit-text-fill-color: var(--sla-white) !important;
  }