/* ==========================================================
   BRR pre-login theme — shared tokens for marketing pages.
   Palette mirrors the BRR terminal dashboard:
     #0a1628 canvas · #0d1c30 panel · #162a46 elevated
     #1e3a5f border · #3b82f6 accent · #e1e5eb text
   ========================================================== */

.brr-page {
    background: #0a1628;
    color: #e1e5eb;
    min-height: calc(100vh - 64px);
    min-height: calc(100svh - 64px);
    position: relative;
    overflow-x: hidden;
}
.brr-page--glow::before {
    content: "";
    position: absolute; inset: 0 0 auto 0; height: 620px;
    background: radial-gradient(ellipse 70% 60% at 50% 0%, rgba(59,130,246,0.12), transparent 70%);
    pointer-events: none;
    z-index: 0;
}
.brr-page > * { position: relative; z-index: 1; }

.brr-section {
    padding: 96px 0;
    position: relative;
}
@media (min-width: 1024px) {
    .brr-section { padding: 128px 0; }
}
.brr-section + .brr-section { border-top: 1px solid #162a46; }
.brr-section--hero { padding-top: 80px; padding-bottom: 64px; }
.brr-section--tight { padding: 64px 0; }

.brr-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}
.brr-wrap--narrow { max-width: 820px; }
.brr-wrap--wide { max-width: 1320px; }

.brr-section-head {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 64px;
}

.brr-kicker {
    display: inline-block;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #3b82f6;
    margin-bottom: 18px;
}

.brr-h1 {
    font-size: clamp(2.5rem, 4.5vw + 0.5rem, 4.25rem);
    font-weight: 600;
    letter-spacing: -0.035em;
    line-height: 1.02;
    color: #f8fafc;
    margin: 0 0 20px 0;
}
.brr-h1 .accent {
    background: linear-gradient(180deg, #93c5fd, #3b82f6);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}

.brr-h2 {
    font-size: clamp(2rem, 3.5vw, 3rem);
    font-weight: 600;
    letter-spacing: -0.03em;
    line-height: 1.06;
    color: #f8fafc;
    margin: 0 0 16px 0;
}

.brr-h3 {
    font-size: clamp(1.25rem, 1.6vw, 1.5rem);
    font-weight: 600;
    letter-spacing: -0.018em;
    line-height: 1.2;
    color: #f8fafc;
    margin: 0 0 10px 0;
}

.brr-h4 {
    font-size: 1rem;
    font-weight: 600;
    color: #f8fafc;
    margin: 0 0 8px 0;
}

.brr-lead {
    font-size: 18px;
    line-height: 1.6;
    color: #94a3b8;
    max-width: 620px;
    margin: 0 auto;
}
.brr-section-head .brr-lead { margin-left: auto; margin-right: auto; }

.brr-prose p {
    font-size: 16px;
    line-height: 1.72;
    color: #94a3b8;
    margin: 0 0 18px 0;
}
.brr-prose p:last-child { margin-bottom: 0; }
.brr-prose a { color: #60a5fa; text-decoration: underline; text-underline-offset: 3px; }
.brr-prose a:hover { color: #93c5fd; }
.brr-prose ul, .brr-prose ol {
    color: #94a3b8;
    font-size: 16px;
    line-height: 1.72;
    padding-left: 20px;
    margin: 0 0 18px 0;
}
.brr-prose li { margin-bottom: 6px; }
.brr-prose h2 {
    font-size: 1.75rem;
    font-weight: 600;
    color: #f8fafc;
    letter-spacing: -0.02em;
    margin: 40px 0 16px 0;
}
.brr-prose h3 {
    font-size: 1.25rem;
    font-weight: 600;
    color: #f8fafc;
    margin: 32px 0 12px 0;
}
.brr-prose strong { color: #e1e5eb; font-weight: 600; }
.brr-prose code {
    background: #0d1c30;
    border: 1px solid #1e3a5f;
    border-radius: 4px;
    padding: 1px 6px;
    font-size: 0.9em;
    color: #cbd5e1;
}

.brr-card {
    background: linear-gradient(180deg, #0d1c30 0%, rgba(13,28,48,0.4) 100%);
    border: 1px solid #1e3a5f;
    border-radius: 14px;
    padding: 32px;
    transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
    position: relative;
    overflow: hidden;
}
.brr-card:hover {
    border-color: #3b82f6;
    transform: translateY(-2px);
    box-shadow: 0 24px 48px -24px rgba(59,130,246,0.35);
}
.brr-card--flat { padding: 24px; }
.brr-card--flat:hover { transform: none; box-shadow: none; border-color: #1e3a5f; }

.brr-card-icon {
    width: 42px; height: 42px;
    border-radius: 10px;
    background: rgba(59,130,246,0.12);
    border: 1px solid #1e3a5f;
    color: #60a5fa;
    display: inline-flex; align-items: center; justify-content: center;
    margin-bottom: 20px;
}

.brr-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
}
.brr-grid--3 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.brr-grid--4 { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.brr-grid--2 { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }

.brr-btn-primary {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 12px 22px;
    font-size: 14px;
    font-weight: 600;
    background: #fff;
    color: #0a1628;
    border-radius: 10px;
    border: 1px solid #fff;
    transition: transform .2s ease, background .2s ease;
}
.brr-btn-primary:hover { background: #e1e5eb; transform: translateY(-1px); color: #0a1628; }
.brr-btn-ghost {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 12px 20px;
    font-size: 14px;
    font-weight: 600;
    color: #e1e5eb;
    border-radius: 10px;
    border: 1px solid #1e3a5f;
    background: rgba(13,28,48,0.5);
    transition: all .2s ease;
}
.brr-btn-ghost:hover { border-color: #3b82f6; color: #fff; background: rgba(59,130,246,0.08); }
.brr-btn-accent {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 12px 22px;
    font-size: 14px;
    font-weight: 600;
    background: #3b82f6;
    color: #fff;
    border-radius: 10px;
    border: 1px solid #3b82f6;
    box-shadow: 0 8px 28px -10px rgba(59,130,246,0.7), inset 0 1px 0 rgba(255,255,255,0.18);
    transition: transform .2s ease, background .2s ease;
}
.brr-btn-accent:hover { background: #2563eb; transform: translateY(-1px); color: #fff; }
.brr-btn-link {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #60a5fa;
    transition: color .2s ease, gap .2s ease;
}
.brr-btn-link:hover { color: #93c5fd; gap: 10px; }

/* Keyboard focus ring — WCAG 2.1 AA. Marketing CTAs had no visible focus state
   (mouse :hover only); :focus-visible shows the ring for keyboard/AT users
   without affecting pointer clicks. */
.brr-btn-primary:focus-visible,
.brr-btn-ghost:focus-visible,
.brr-btn-accent:focus-visible,
.brr-btn-link:focus-visible {
    outline: 2px solid #60a5fa;
    outline-offset: 3px;
    border-radius: 10px;
}

/* Reusable inline conversion CTA (glossary, blog, content pages). */
.brr-inline-cta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 18px 24px;
    margin: 48px 0;
    padding: 24px 28px;
    border: 1px solid #1e3a5f;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(59,130,246,0.10), rgba(13,28,48,0.5));
}
.brr-inline-cta-body { flex: 1 1 280px; min-width: 0; }
.brr-inline-cta-title {
    margin: 0 0 4px;
    font-size: 17px;
    font-weight: 700;
    color: #f8fafc;
    letter-spacing: -0.01em;
}
.brr-inline-cta-sub { margin: 0; font-size: 13.5px; line-height: 1.55; color: #94a3b8; }
.brr-inline-cta .brr-btn-accent { flex-shrink: 0; }

.brr-eyebrow {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 6px 14px;
    border: 1px solid #1e3a5f;
    background: rgba(13,28,48,0.5);
    border-radius: 999px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #94a3b8;
}
.brr-eyebrow .dot {
    width: 6px; height: 6px; border-radius: 999px;
    background: #3b82f6;
    box-shadow: 0 0 12px #3b82f6;
}

/* Forms */
.brr-field { display: block; margin-bottom: 18px; }
.brr-field label, .brr-label {
    display: block;
    font-size: 12.5px;
    font-weight: 500;
    color: #cbd5e1;
    margin-bottom: 8px;
    letter-spacing: 0.01em;
}
.brr-input, .brr-field input, .brr-field textarea, .brr-field select {
    width: 100%;
    padding: 11px 14px;
    font-size: 14px;
    color: #f8fafc;
    background: #0d1c30;
    border: 1px solid #1e3a5f;
    border-radius: 10px;
    transition: border-color .18s ease, box-shadow .18s ease;
    font-family: inherit;
}
.brr-input::placeholder,
.brr-field input::placeholder,
.brr-field textarea::placeholder { color: #64748b; }
.brr-input:focus, .brr-field input:focus, .brr-field textarea:focus, .brr-field select:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59,130,246,0.2);
}
.brr-field textarea { min-height: 120px; resize: vertical; }
.brr-help, .brr-field .help-block, .brr-field small { display: block; font-size: 12px; color: #64748b; margin-top: 6px; }
.brr-error, .brr-field .errorlist, .brr-field ul.errorlist {
    color: #ef4444;
    font-size: 12.5px;
    list-style: none;
    padding: 0;
    margin: 6px 0 0 0;
}
.brr-form {
    background: #0d1c30;
    border: 1px solid #1e3a5f;
    border-radius: 14px;
    padding: 32px;
}

/* Stat bar */
.brr-stat-bar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    border: 1px solid #1e3a5f;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(13,28,48,0.7), rgba(10,22,40,0.4));
    overflow: hidden;
}
.brr-stat {
    padding: 28px 24px;
    border-right: 1px solid #162a46;
    border-bottom: 1px solid #162a46;
}
.brr-stat:last-child { border-right: none; }
@media (max-width: 900px) { .brr-stat { border-right: none; } }
.brr-stat .label {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 10.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: 10px;
}
.brr-stat .value {
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    font-weight: 600;
    letter-spacing: -0.03em;
    color: #f8fafc;
    line-height: 1;
}
.brr-stat .value .unit { color: #3b82f6; margin-left: 4px; }
.brr-stat .caption { margin-top: 8px; font-size: 13px; color: #94a3b8; }

/* Tick list */
.brr-tick-list { list-style: none; padding: 0; margin: 0; }
.brr-tick-list li {
    display: flex; align-items: flex-start; gap: 10px;
    padding: 8px 0;
    color: #cbd5e1;
    font-size: 14px;
    line-height: 1.5;
}
.brr-tick-list li::before {
    content: "✓";
    color: #22c55e;
    font-weight: 700;
    flex-shrink: 0;
}

/* Divider rule */
.brr-rule {
    height: 1px;
    background: linear-gradient(90deg, transparent, #1e3a5f, transparent);
    margin: 72px 0;
    border: none;
}

/* Fade animations */
@keyframes brrFade { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.brr-fade { opacity: 0; animation: brrFade .7s ease-out forwards; }
.brr-d1 { animation-delay: .05s; }
.brr-d2 { animation-delay: .15s; }
.brr-d3 { animation-delay: .25s; }
.brr-d4 { animation-delay: .35s; }
.brr-d5 { animation-delay: .5s; }

/* Table */
.brr-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.brr-table th {
    text-align: left;
    padding: 14px 16px;
    font-size: 11px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    border-bottom: 1px solid #1e3a5f;
    background: #0d1c30;
}
.brr-table td {
    padding: 14px 16px;
    color: #e1e5eb;
    border-bottom: 1px solid #162a46;
}
.brr-table tbody tr:hover { background: rgba(13,28,48,0.4); }

/* Pill / badge */
.brr-badge {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 4px 10px;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.02em;
    background: rgba(59,130,246,0.1);
    border: 1px solid rgba(59,130,246,0.3);
    color: #93c5fd;
    border-radius: 999px;
}
.brr-badge--green { background: rgba(34,197,94,0.1); border-color: rgba(34,197,94,0.3); color: #4ade80; }
.brr-badge--amber { background: rgba(245,158,11,0.1); border-color: rgba(245,158,11,0.3); color: #fbbf24; }

/* ── Pricing: billing-period toggle + Free/Pro comparison table ───────────── */
.brr-bill-toggle {
    display: inline-flex;
    background: #0d1c30;
    border: 1px solid #1e3a5f;
    border-radius: 10px;
    padding: 4px;
    gap: 2px;
}
.brr-bill-btn {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 8px 18px;
    font-size: 13px; font-weight: 600;
    color: #94a3b8;
    border-radius: 7px;
    background: transparent;
    cursor: pointer;
    transition: background .2s ease, color .2s ease;
}
.brr-bill-btn.on { background: #3b82f6; color: #fff; }
.brr-bill-btn:focus-visible { outline: 2px solid #60a5fa; outline-offset: 2px; }
.brr-bill-save {
    font-size: 10.5px; font-weight: 700; letter-spacing: 0.04em;
    padding: 2px 6px; border-radius: 999px;
    background: rgba(34,197,94,0.15); color: #4ade80;
}
.brr-bill-btn.on .brr-bill-save { background: rgba(255,255,255,0.18); color: #fff; }
.brr-price-group.is-hidden { display: none; }

/* Phase-1: add overflow-x:auto so the compare table scrolls on narrow viewports */
.brr-compare-wrap { max-width: 760px; margin: 80px auto 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.brr-compare {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #1e3a5f;
    border-radius: 12px;
    overflow: hidden;
    font-size: 14px;
}
.brr-compare th, .brr-compare td {
    padding: 13px 18px;
    text-align: left;
    border-bottom: 1px solid #162a46;
}
.brr-compare thead th {
    background: #0d1c30;
    font-size: 12px; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.08em;
    color: #94a3b8;
}
.brr-compare th.pro, .brr-compare td.pro { background: rgba(59,130,246,0.06); }
.brr-compare thead th.pro { color: #60a5fa; }
.brr-compare td:not(:first-child) { text-align: center; color: #cbd5e1; }
.brr-compare td.yes { color: #4ade80; font-weight: 700; }
.brr-compare td.no { color: #475569; }
.brr-compare tbody tr:last-child td { border-bottom: none; }
.brr-compare tbody tr:last-child { background: rgba(255,255,255,0.02); }
.brr-compare-gap {
    margin: 24px auto 0; max-width: 640px; text-align: center;
    font-size: 14px; line-height: 1.6; color: #94a3b8;
}
.brr-compare-gap strong { color: #f8fafc; }
@media (max-width: 560px) {
    .brr-compare th, .brr-compare td { padding: 11px 12px; font-size: 13px; }
}

/* ============================================================================
   Lifted from templates/landing/hero.html inline <style> (2026-05-28)
   ============================================================================ */
.brr-hero {
    background: #0a1628;
    color: #e1e5eb;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    min-height: calc(100vh - 64px);
    min-height: calc(100svh - 64px);
    display: flex;
    align-items: center;
}
.brr-hero::before {
    content: "";
    position: absolute; inset: 0;
    background-image:
        radial-gradient(ellipse 70% 40% at 50% 0%, rgba(59,130,246,0.12), transparent 70%);
    z-index: -1;
}
.brr-hero .wrap {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding: 40px 24px;
}
@media (min-width: 1024px) { .brr-hero .wrap { padding: 48px 40px; } }

.brr-hero .grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: center;
}
@media (min-width: 1024px) {
    .brr-hero .grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 56px; }
}

.brr-hero .eyebrow {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 6px 14px;
    border: 1px solid #1e3a5f;
    background: rgba(13,28,48,0.5);
    backdrop-filter: blur(8px);
    border-radius: 999px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #94a3b8;
    margin-bottom: 28px;
}
.brr-hero .eyebrow .dot {
    width: 6px; height: 6px; border-radius: 999px;
    background: #3b82f6;
    box-shadow: 0 0 12px #3b82f6;
}

.brr-hero h1 {
    font-size: clamp(2.25rem, 3.4vw + 0.5rem, 3.75rem);
    font-weight: 600;
    letter-spacing: -0.035em;
    line-height: 1.04;
    margin: 0 0 24px 0;
}
.brr-hero h1 .line-a { color: #f8fafc; display: block; }
.brr-hero h1 .line-b {
    display: block;
    background: linear-gradient(180deg, #93c5fd, #3b82f6);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}

.brr-hero .sub {
    max-width: 560px;
    font-size: 16.5px;
    color: #94a3b8;
    line-height: 1.6;
    margin: 0 0 24px;
}

.brr-hero .tag-row {
    display: flex; flex-wrap: wrap; gap: 8px;
    margin-bottom: 28px;
}
.brr-hero .tag {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 5px 11px;
    font-size: 12px;
    font-weight: 500;
    color: #cbd5e1;
    background: rgba(59,130,246,0.08);
    border: 1px solid #1e3a5f;
    border-radius: 999px;
    white-space: nowrap;
}
.brr-hero .tag svg { color: #3b82f6; }

.brr-hero .cta-row {
    display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
}
.brr-btn-primary {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 11px 20px;
    font-size: 14px;
    font-weight: 600;
    background: #fff;
    color: #0a1628;
    border-radius: 10px;
    border: 1px solid #fff;
    transition: transform .2s ease, background .2s ease;
}
.brr-btn-primary:hover { background: #e1e5eb; transform: translateY(-1px); color: #0a1628; }
.brr-btn-ghost {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 11px 18px;
    font-size: 14px;
    font-weight: 600;
    color: #e1e5eb;
    border-radius: 10px;
    border: 1px solid #1e3a5f;
    background: rgba(13,28,48,0.5);
    transition: all .2s ease;
}
.brr-btn-ghost:hover { border-color: #3b82f6; color: #fff; background: rgba(59,130,246,0.08); }

/* ===== Hero terminal mockup — mirrors dashboard/main.html ===== */
.brr-term-wrap { position: relative; }
.brr-term-glow {
    position: absolute; left: -5%; right: -5%; top: 10%; bottom: -10%;
    background: radial-gradient(ellipse at center, rgba(59,130,246,0.22), transparent 65%);
    filter: blur(56px);
    z-index: 0;
    pointer-events: none;
}
.brr-term {
    position: relative; z-index: 1;
    border-radius: 10px;
    padding: 1px;
    background: linear-gradient(180deg, rgba(59,130,246,0.4), rgba(30,58,95,0.1) 60%, rgba(59,130,246,0.22));
    box-shadow: 0 48px 96px -24px rgba(0,0,0,0.8);
}
.brr-term-inner {
    background: #0a1628;
    border-radius: 9px;
    overflow: hidden;
    color: #e1e5eb;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.tm-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 6px 12px;
    background: #0d1c30;
    border-bottom: 1px solid #1e3a5f;
    height: 32px;
}
.tm-header-left { display: flex; align-items: center; gap: 10px; }
.tm-logo {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 10.5px;
    font-weight: 700;
    color: #3b82f6;
    letter-spacing: 0.5px;
}
.tm-selector {
    display: inline-flex; align-items: center; gap: 7px;
    padding: 3px 9px;
    background: #162a46;
    border: 1px solid #1e3a5f;
    border-radius: 4px;
}
.tm-selector .k { color: #64748b; font-size: 9px; text-transform: uppercase; letter-spacing: 0.5px; }
.tm-selector .v { color: #3b82f6; font-size: 10.5px; font-weight: 600; }
.tm-selector .caret { color: #64748b; font-size: 9px; }
.tm-header-right {
    font-family: ui-monospace, monospace;
    font-size: 9.5px;
    color: #64748b;
    letter-spacing: 0.3px;
}
.tm-header-right .v { color: #e1e5eb; font-weight: 600; }
.tm-ticker {
    display: flex; gap: clamp(6px, 1.8cqi, 14px);
    padding: 0 12px;
    background: #0d1c30;
    border-bottom: 1px solid #1e3a5f;
    height: 24px;
    align-items: center;
    overflow: hidden;
    flex-wrap: nowrap;
    container: tmticker / inline-size;
}
.tm-t-item { display: flex; align-items: baseline; gap: 5px; font-family: ui-monospace, monospace; white-space: nowrap; flex: 0 0 auto; }
.tm-t-item .l { color: #64748b; font-size: clamp(7px, 1.5cqi, 8.5px); text-transform: uppercase; letter-spacing: 0.5px; }
.tm-t-item .v { font-size: clamp(8px, 1.9cqi, 10.5px); font-weight: 600; }
.tm-t-item .v.white { color: #e1e5eb; }
.tm-t-item .v.blue { color: #3b82f6; }
.tm-t-item .v.green { color: #22c55e; }
@container tmticker (max-width: 560px) { .tm-ticker .tm-t-item:nth-child(6) { display: none; } }
@container tmticker (max-width: 450px) { .tm-ticker .tm-t-item:nth-child(5) { display: none; } }
@container tmticker (max-width: 360px) { .tm-ticker .tm-t-item:nth-child(4) { display: none; } }
.tm-nav {
    display: flex; align-items: center;
    padding: 0 12px;
    background: #0d1c30;
    border-bottom: 1px solid #1e3a5f;
    height: 28px;
    overflow-x: auto;
    scrollbar-width: none;
}
.tm-nav::-webkit-scrollbar { display: none; }
.tm-tab {
    padding: 0 10px; height: 100%;
    display: inline-flex; align-items: center;
    font-family: ui-monospace, monospace;
    font-size: 9.5px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    border-bottom: 2px solid transparent;
    white-space: nowrap;
}
.tm-tab .n { opacity: 0.6; margin-right: 4px; }
.tm-tab.active { color: #3b82f6; border-bottom-color: #3b82f6; background: rgba(59,130,246,0.08); }
.tm-body { padding: 10px; background: #0a1628; }
.tm-card-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    margin-bottom: 10px;
}
.tm-panel {
    background: #0d1c30;
    border: 1px solid #1e3a5f;
    border-radius: 5px;
    overflow: hidden;
}
.tm-ph {
    padding: 6px 10px;
    background: #162a46;
    border-bottom: 1px solid #1e3a5f;
    display: flex; justify-content: space-between; align-items: center;
}
.tm-ph .t {
    font-family: ui-monospace, monospace;
    font-size: 9.5px;
    font-weight: 600;
    color: #3b82f6;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.tm-ph .s { font-size: 9px; color: #64748b; }
.tm-pb { padding: 8px 10px; }
.tm-mrow {
    display: flex; justify-content: space-between; align-items: center;
    padding: 4px 0;
    border-bottom: 1px solid #162a46;
}
.tm-mrow:last-child { border-bottom: none; }
.tm-mrow .l { font-size: 10.5px; color: #94a3b8; }
.tm-mrow .v {
    font-family: ui-monospace, monospace;
    font-size: 11.5px;
    font-weight: 600;
    color: #e1e5eb;
}
.tm-mrow .v.green { color: #22c55e; }
.tm-mrow .v.blue { color: #3b82f6; }
.tm-mrow .v.red { color: #ef4444; }
.tm-table { width: 100%; border-collapse: collapse; font-family: ui-monospace, monospace; font-size: 10px; }
.tm-table th {
    padding: 6px 8px;
    text-align: left;
    font-size: 8.5px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    border-bottom: 1px solid #1e3a5f;
    background: #0a1628;
}
.tm-table th.r, .tm-table td.r { text-align: right; }
.tm-table td {
    padding: 6px 8px;
    border-bottom: 1px solid #162a46;
    color: #e1e5eb;
}
.tm-table td.blue { color: #3b82f6; }
.tm-table td.green { color: #22c55e; }
.tm-table td.muted { color: #64748b; }
.tm-table tbody tr:last-child td { border-bottom: none; }
.tm-foot {
    display: flex; justify-content: space-between; align-items: center;
    padding: 4px 12px;
    height: 22px;
    background: #0d1c30;
    border-top: 1px solid #1e3a5f;
    font-family: ui-monospace, monospace;
    font-size: 9.5px;
    color: #64748b;
}
.tm-foot .live { color: #22c55e; }
.tm-foot .live::before {
    content: "";
    display: inline-block;
    width: 6px; height: 6px; border-radius: 999px;
    background: #22c55e; margin-right: 6px;
    box-shadow: 0 0 8px rgba(34,197,94,0.6);
    vertical-align: 1px;
    animation: brrLivePulse 2s ease-in-out infinite;
}
/* "Live" status dot breathes so the terminal mockup reads as a real feed. */
@keyframes brrLivePulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0.55); opacity: 1; }
    50%      { box-shadow: 0 0 8px 3px rgba(34,197,94,0.15); opacity: 0.65; }
}
@media (prefers-reduced-motion: reduce) {
    .tm-foot .live::before { animation: none; }
}
@keyframes brrFade { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.brr-fade { opacity: 0; animation: brrFade .7s ease-out forwards; }
.brr-d1 { animation-delay: .05s; }
.brr-d2 { animation-delay: .15s; }
.brr-d3 { animation-delay: .25s; }
.brr-d4 { animation-delay: .35s; }
.brr-d5 { animation-delay: .5s; }

/* ============================================================================
   Lifted from templates/landing/features.html inline <style> (2026-05-28)
   ============================================================================ */
.brr-sect-features {
    background: #0a1628;
    color: #e1e5eb;
    position: relative;
    padding: 140px 0;
    border-top: 1px solid #162a46;
}
@media (min-width: 1024px) { .brr-sect-features { padding: 176px 0; } }
.brr-sect-features .wrap { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.brr-sect-features .head {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 80px;
}
.brr-sect-features .kicker {
    display: inline-block;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #3b82f6;
    margin-bottom: 20px;
}
.brr-sect-features h2 {
    font-size: clamp(2.25rem, 4vw, 3.25rem);
    font-weight: 600;
    letter-spacing: -0.03em;
    line-height: 1.05;
    color: #f8fafc;
    margin-bottom: 20px;
}
.brr-sect-features .lead {
    color: #94a3b8;
    font-size: 18px;
    line-height: 1.6;
    max-width: 620px;
    margin: 0 auto;
}
.bento {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-auto-rows: minmax(220px, auto);
    gap: 20px;
}
@media (max-width: 900px) { .bento { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .bento { grid-template-columns: 1fr; } }
.cell {
    background: linear-gradient(180deg, #0d1c30 0%, rgba(13,28,48,0.4) 100%);
    border: 1px solid #1e3a5f;
    border-radius: 14px;
    padding: 32px;
    position: relative;
    overflow: hidden;
    transition: border-color .25s ease, transform .25s ease;
}
.cell:hover { border-color: #3b82f6; transform: translateY(-2px); }
.cell .tag {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 10.5px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: 18px;
    display: block;
}
.cell .icon-box {
    width: 38px; height: 38px;
    border-radius: 9px;
    background: rgba(59,130,246,0.12);
    border: 1px solid #1e3a5f;
    color: #60a5fa;
    display: inline-flex; align-items: center; justify-content: center;
    margin-bottom: 18px;
}
.cell h3 {
    font-size: 1.15rem;
    font-weight: 600;
    color: #f8fafc;
    letter-spacing: -0.015em;
    margin-bottom: 10px;
    line-height: 1.3;
}
.cell p {
    color: #94a3b8;
    font-size: 14.5px;
    line-height: 1.6;
}
.span-3 { grid-column: span 3; }
.span-2 { grid-column: span 2; }
.span-4 { grid-column: span 4; }
@media (max-width: 900px) { .span-2, .span-3, .span-4 { grid-column: span 1; } }
.chart-row {
    margin-top: 22px;
    display: flex; align-items: end; gap: 5px; height: 84px;
}
.chart-row .bar {
    flex: 1;
    background: linear-gradient(180deg, #3b82f6 0%, rgba(59,130,246,0.2) 100%);
    border-radius: 3px 3px 0 0;
    opacity: 0.85;
}
.terminal-mock {
    margin-top: 20px;
    border: 1px solid #1e3a5f;
    border-radius: 8px;
    background: #0a1628;
    padding: 12px 14px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 11px;
    color: #cbd5e1;
}
.terminal-mock .row { display: flex; justify-content: space-between; padding: 4px 0; border-bottom: 1px dashed #162a46; }
.terminal-mock .row:last-child { border-bottom: none; }
.terminal-mock .k { color: #94a3b8; }
.terminal-mock .v-g { color: #22c55e; }
.terminal-mock .v-b { color: #3b82f6; }
.terminal-mock .v-r { color: #ef4444; }

/* ============================================================================
   Lifted from templates/landing/proof.html inline <style> (2026-05-28)
   ============================================================================ */
.brr-sect-proof {
    background: #0a1628;
    color: #e1e5eb;
    position: relative;
    overflow: hidden;
    padding: 140px 0;
    border-top: 1px solid #162a46;
}
@media (min-width: 1024px) { .brr-sect-proof { padding: 176px 0 200px; } }
.brr-sect-proof::before {
    content: "";
    position: absolute; inset: 0;
    background-image:
        radial-gradient(ellipse 60% 50% at 50% 120%, rgba(59,130,246,0.28), transparent 55%),
        radial-gradient(ellipse 40% 40% at 85% 0%, rgba(99,102,241,0.12), transparent 55%);
    z-index: 0;
}
.brr-sect-proof > .wrap { position: relative; z-index: 1; max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.brr-sect-proof .head {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 80px;
}
.brr-sect-proof .kicker {
    display: inline-block;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #3b82f6;
    margin-bottom: 20px;
}
.brr-sect-proof h2.section-h2 {
    font-size: clamp(2.25rem, 4vw, 3.25rem);
    font-weight: 600;
    letter-spacing: -0.03em;
    line-height: 1.05;
    color: #f8fafc;
    margin-bottom: 20px;
}
.brr-sect-proof .lead {
    color: #94a3b8;
    font-size: 18px;
    line-height: 1.6;
    max-width: 620px;
    margin: 0 auto;
}
.stat-bar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    border: 1px solid #1e3a5f;
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(13,28,48,0.75), rgba(10,22,40,0.45));
    backdrop-filter: blur(4px);
    overflow: hidden;
}
.stat {
    padding: 36px 32px;
    border-right: 1px solid #162a46;
    border-bottom: 1px solid #162a46;
}
.stat:last-child { border-right: none; }
@media (max-width: 900px) { .stat { border-right: none; } }
.stat .label {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 10.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: 14px;
}
.stat .value {
    font-size: clamp(2rem, 3.5vw, 2.75rem);
    font-weight: 600;
    letter-spacing: -0.03em;
    color: #f8fafc;
    line-height: 1;
}
.stat .value .unit { color: #3b82f6; margin-left: 4px; }
.stat .caption {
    margin-top: 12px;
    font-size: 13.5px;
    color: #94a3b8;
}
/* Data-provenance trust strip — credible social proof: the official sources. */
.proof-trust {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px 18px;
    margin: 28px auto 0;
    padding: 18px 24px;
    max-width: 920px;
    text-align: center;
}
.proof-trust-label {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 10.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #64748b;
}
.proof-trust-sources {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px 10px;
}
.proof-trust-sources span {
    font-size: 12.5px;
    font-weight: 600;
    color: #cbd5e1;
    padding: 5px 12px;
    border: 1px solid #1e3a5f;
    border-radius: 999px;
    background: rgba(13,28,48,0.5);
    white-space: nowrap;
}

.rail-head {
    text-align: center;
    margin: 112px auto 40px;
    max-width: 640px;
}
.rail-head h3 {
    font-size: clamp(1.5rem, 2.4vw, 2rem);
    font-weight: 600;
    letter-spacing: -0.02em;
    color: #f8fafc;
}
.rail {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
}
.rail a {
    display: flex; align-items: center; justify-content: space-between;
    padding: 24px 24px;
    background: rgba(13,28,48,0.6);
    border: 1px solid #1e3a5f;
    border-radius: 12px;
    transition: border-color .2s ease, transform .2s ease, background .2s ease;
}
.rail a:hover {
    border-color: #3b82f6;
    transform: translateY(-2px);
    background: rgba(59,130,246,0.06);
}
.rail a .title {
    font-size: 15px;
    font-weight: 600;
    color: #f8fafc;
    margin-bottom: 4px;
}
.rail a .sub { font-size: 13px; color: #94a3b8; }
.rail a .arrow {
    color: #64748b;
    transition: transform .2s ease, color .2s ease;
}
.rail a:hover .arrow { color: #3b82f6; transform: translateX(4px); }
.cta-block {
    text-align: center;
    margin: 144px auto 0;
    max-width: 820px;
}
.cta-block h2 {
    font-size: clamp(2.5rem, 5.5vw, 4.5rem);
    font-weight: 600;
    letter-spacing: -0.035em;
    line-height: 1.02;
    color: #f8fafc;
    margin-bottom: 24px;
}
.cta-block h2 .grad {
    background: linear-gradient(180deg, #93c5fd, #3b82f6);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}
.cta-block p {
    color: #94a3b8;
    font-size: 18px;
    line-height: 1.6;
    margin-bottom: 40px;
}
.cta-block .brr-btn-primary {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 14px 28px;
    font-size: 15px;
    font-weight: 600;
    background: #3b82f6;
    color: #fff;
    border-radius: 12px;
    border: 1px solid #3b82f6;
    box-shadow: 0 12px 32px -10px rgba(59,130,246,0.7), inset 0 1px 0 rgba(255,255,255,0.18);
    transition: background .2s ease, transform .2s ease;
}
.cta-block .brr-btn-primary:hover { background: #2563eb; transform: translateY(-1px); }
.cta-block .fine {
    margin-top: 16px;
    font-size: 12.5px;
    color: #64748b;
}

/* ============================================================================
   Lifted from templates/landing/solutions.html inline <style> (2026-05-28)
   ============================================================================ */
.brr-sect-solutions {
    background: #0a1628;
    color: #e1e5eb;
    position: relative;
    padding: 140px 0;
    border-top: 1px solid #162a46;
}
@media (min-width: 1024px) { .brr-sect-solutions { padding: 176px 0; } }
.brr-sect-solutions .wrap { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.brr-sect-solutions .head {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 80px;
}
.brr-sect-solutions .kicker {
    display: inline-block;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #3b82f6;
    margin-bottom: 20px;
}
.brr-sect-solutions h2 {
    font-size: clamp(2.25rem, 4vw, 3.25rem);
    font-weight: 600;
    letter-spacing: -0.03em;
    line-height: 1.05;
    color: #f8fafc;
    margin-bottom: 20px;
}
.brr-sect-solutions .lead {
    color: #94a3b8;
    font-size: 18px;
    line-height: 1.6;
    max-width: 620px;
    margin: 0 auto;
}
.persona-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
}
.persona {
    position: relative;
    background: linear-gradient(180deg, #0d1c30 0%, #0a1628 100%);
    border: 1px solid #1e3a5f;
    border-radius: 14px;
    padding: 36px 32px;
    transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
    overflow: hidden;
}
.persona::before {
    content: "";
    position: absolute; top: 0; left: 0; right: 0; height: 1px;
    background: linear-gradient(90deg, transparent, rgba(59,130,246,0.5), transparent);
    opacity: 0; transition: opacity .25s ease;
}
.persona:hover { border-color: #3b82f6; transform: translateY(-3px); box-shadow: 0 24px 48px -24px rgba(59,130,246,0.35); }
.persona:hover::before { opacity: 1; }
.persona .icon {
    width: 44px; height: 44px;
    border-radius: 10px;
    background: rgba(59,130,246,0.12);
    border: 1px solid #1e3a5f;
    color: #60a5fa;
    display: inline-flex; align-items: center; justify-content: center;
    margin-bottom: 22px;
}
.persona h3 {
    font-size: 1.35rem;
    font-weight: 600;
    color: #f8fafc;
    letter-spacing: -0.015em;
    margin-bottom: 10px;
}
.persona p.desc {
    color: #94a3b8;
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 24px;
}
.persona ul {
    list-style: none; padding: 0; margin: 0 0 26px 0;
    border-top: 1px solid #162a46;
}
.persona ul li {
    display: flex; align-items: center; gap: 10px;
    padding: 11px 0;
    border-bottom: 1px solid #162a46;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 12px;
    letter-spacing: 0.04em;
    color: #cbd5e1;
}
.persona ul li .tick { color: #22c55e; }
.persona .link {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #60a5fa;
    transition: gap .2s ease, color .2s ease;
}
.persona:hover .link { color: #93c5fd; gap: 10px; }

/* ============================================================================
   Lifted from templates/landing/content.html inline <style> (2026-05-28)
   ============================================================================ */
.brr-sect-content {
    background: #0a1628;
    color: #e1e5eb;
    position: relative;
    padding: 140px 0;
    border-top: 1px solid #162a46;
}
@media (min-width: 1024px) { .brr-sect-content { padding: 176px 0; } }
.brr-sect-content .wrap { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.brr-sect-content .head {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 80px;
}
.brr-sect-content .kicker {
    display: inline-block;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #3b82f6;
    margin-bottom: 20px;
}
.brr-sect-content h2.section-h2 {
    font-size: clamp(2.25rem, 4vw, 3.25rem);
    font-weight: 600;
    letter-spacing: -0.03em;
    line-height: 1.05;
    color: #f8fafc;
    margin-bottom: 20px;
}
.brr-sect-content .lead {
    color: #94a3b8;
    font-size: 18px;
    line-height: 1.6;
    max-width: 620px;
    margin: 0 auto;
}
.two-col {
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
}
@media (min-width: 1024px) { .two-col { grid-template-columns: 1fr 1fr; gap: 80px; } }
.col-kicker {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 11px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #3b82f6;
    margin-bottom: 18px;
}
.col-head {
    font-size: clamp(1.5rem, 2.2vw, 1.875rem);
    font-weight: 600;
    letter-spacing: -0.02em;
    color: #f8fafc;
    margin-bottom: 22px;
    line-height: 1.2;
}
.col-body p {
    color: #94a3b8;
    font-size: 16px;
    line-height: 1.75;
    margin-bottom: 18px;
}
.col-body p:last-child { margin-bottom: 0; }
.rule {
    height: 1px;
    background: linear-gradient(90deg, transparent, #1e3a5f, transparent);
    margin: 96px 0 72px;
}
.audience-head {
    text-align: center;
    max-width: 640px;
    margin: 0 auto 56px;
}
.audience-head h3 {
    font-size: clamp(1.75rem, 2.8vw, 2.25rem);
    font-weight: 600;
    letter-spacing: -0.025em;
    color: #f8fafc;
    line-height: 1.15;
}
.audience-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 20px;
}
.audience-cell {
    padding: 28px;
    border: 1px solid #162a46;
    border-radius: 12px;
    background: rgba(13,28,48,0.4);
    transition: border-color .2s ease, transform .2s ease;
}
.audience-cell:hover { border-color: #1e3a5f; transform: translateY(-2px); }
.audience-cell h4 {
    font-size: 15px;
    font-weight: 600;
    color: #f8fafc;
    margin-bottom: 10px;
    letter-spacing: -0.005em;
}
.audience-cell p {
    font-size: 14px;
    color: #94a3b8;
    line-height: 1.6;
}

/* ============================================================================
   Lifted from templates/footer/footer.html inline <style> (2026-05-28)
   ============================================================================ */
.brr-footer {
    background: #0a1628;
    color: #94a3b8;
    border-top: 1px solid #162a46;
    position: relative;
    overflow: hidden;
}
.brr-footer::before {
    content: "";
    position: absolute; inset: 0;
    background-image: radial-gradient(ellipse 70% 50% at 50% 100%, rgba(59,130,246,0.08), transparent 60%);
    z-index: 0;
    pointer-events: none;
}
.brr-footer .wrap {
    position: relative; z-index: 1;
    max-width: 1200px;
    margin: 0 auto;
    padding: 80px 24px 40px;
}
@media (min-width: 1024px) { .brr-footer .wrap { padding: 112px 40px 48px; } }
.brr-footer .top {
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
}
@media (min-width: 768px) {
    .brr-footer .top {
        grid-template-columns: 1.4fr repeat(3, 1fr);
        gap: 40px;
    }
}
.brr-footer .brand-col .mark {
    display: inline-flex; align-items: center; gap: 10px;
    margin-bottom: 16px;
}
.brr-footer .brand-col .mark img { height: 28px; width: auto; }
.brr-footer .brand-col .tagline {
    font-size: 14px;
    color: #94a3b8;
    line-height: 1.6;
    max-width: 320px;
    margin-bottom: 24px;
}
.brr-footer .col-head {
    font-size: 11px;
    font-weight: 600;
    color: #cbd5e1;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin: 0 0 20px 0;
}
.brr-footer .link-list {
    list-style: none; margin: 0; padding: 0;
    display: flex; flex-direction: column; gap: 12px;
}
.brr-footer .link-list a {
    font-size: 14px;
    color: #94a3b8;
    transition: color .18s ease;
}
.brr-footer .link-list a:hover { color: #f8fafc; }
.brr-footer .social {
    display: flex; gap: 8px;
    margin-top: 4px;
}
.brr-footer .social a {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px;
    border-radius: 8px;
    border: 1px solid #1e3a5f;
    background: rgba(13,28,48,0.6);
    color: #94a3b8;
    transition: color .18s ease, border-color .18s ease, transform .18s ease;
}
.brr-footer .social a:hover {
    color: #60a5fa;
    border-color: #3b82f6;
    transform: translateY(-1px);
}
.brr-footer .social svg { width: 16px; height: 16px; }
.brr-footer .rule {
    height: 1px;
    background: linear-gradient(90deg, transparent, #1e3a5f 30%, #1e3a5f 70%, transparent);
    margin: 56px 0 28px;
}
.brr-footer .bottom {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
    font-size: 12.5px;
    color: #64748b;
}
@media (min-width: 768px) {
    .brr-footer .bottom { flex-direction: row; }
}
.brr-footer .bottom .legal-links {
    display: flex; gap: 24px;
}
.brr-footer .bottom .legal-links a {
    color: #64748b;
    transition: color .18s ease;
}
.brr-footer .bottom .legal-links a:hover { color: #cbd5e1; }

/* ============================================================================
   Lifted from templates/blog/list.html inline <style> (2026-05-28)
   Blog index — dark, editorial
   ============================================================================ */
.bl-shell { background: #0a1628; color: #e1e5eb; min-height: calc(100vh - 64px); }
.bl-hero { position: relative; overflow: hidden; padding: 88px 0 56px; border-bottom: 1px solid #162a46; }
.bl-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 50% at 50% 0%, rgba(59,130,246,0.14), transparent 70%); pointer-events: none; }
.bl-hero-inner { position: relative; z-index: 1; max-width: 1120px; margin: 0 auto; padding: 0 24px; }
.bl-kicker { display: inline-block; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: #3b82f6; margin-bottom: 18px; }
.bl-title { font-size: clamp(2rem, 3.8vw, 3rem); font-weight: 600; letter-spacing: -0.03em; line-height: 1.05; color: #f8fafc; margin: 0 0 16px 0; max-width: 820px; }
.bl-title .accent { background: linear-gradient(180deg, #93c5fd, #3b82f6); -webkit-background-clip: text; background-clip: text; color: transparent; }
.bl-lead { font-size: 17px; color: #94a3b8; line-height: 1.6; max-width: 640px; margin: 0; }
.bl-filter { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.bl-chip { display: inline-flex; align-items: center; padding: 7px 13px; font-size: 12.5px; font-weight: 500; color: #94a3b8; background: #0d1c30; border: 1px solid #1e3a5f; border-radius: 999px; text-decoration: none; transition: all .18s ease; }
.bl-chip:hover { color: #f8fafc; border-color: #3b82f6; }
.bl-chip.on { background: #3b82f6; color: #fff; border-color: #3b82f6; font-weight: 600; }
.bl-body { padding: 56px 0 96px; }
.bl-body-inner { max-width: 1120px; margin: 0 auto; padding: 0 24px; }
/* ----- Image-free blog list (June 2026) — see template comment ----------
   The .bl-*-thumb blocks were retired so posts without cover images don't
   leave blank rectangles in the grid. Cards now lead with a 4px colored
   "rail" strip whose color tracks the category slug (via .bl-accent-*
   classes), giving the listing visual rhythm without depending on R2 art.
   The .bl-accent-* palette below covers the common category slugs from
   blog/models.py; unknown slugs fall through to the default blue rail. */

/* CSS custom property holds the per-card accent. Override per category. */
.bl-feat-card, .bl-card { --bl-accent: #3b82f6; --bl-accent-soft: rgba(59,130,246,0.14); }
.bl-accent-banking-basics, .bl-accent-ffiec, .bl-accent-ffiec-call-report { --bl-accent: #3b82f6; --bl-accent-soft: rgba(59,130,246,0.14); }
.bl-accent-ubpr, .bl-accent-analysis, .bl-accent-metrics, .bl-accent-data-analysis { --bl-accent: #06b6d4; --bl-accent-soft: rgba(6,182,212,0.14); }
.bl-accent-cecl, .bl-accent-credit, .bl-accent-credit-risk, .bl-accent-loans { --bl-accent: #f59e0b; --bl-accent-soft: rgba(245,158,11,0.14); }
.bl-accent-capital, .bl-accent-basel, .bl-accent-stress-testing { --bl-accent: #8b5cf6; --bl-accent-soft: rgba(139,92,246,0.14); }
.bl-accent-deposits, .bl-accent-liquidity, .bl-accent-funding { --bl-accent: #14b8a6; --bl-accent-soft: rgba(20,184,166,0.14); }
.bl-accent-enforcement, .bl-accent-compliance, .bl-accent-regulation { --bl-accent: #ef4444; --bl-accent-soft: rgba(239,68,68,0.14); }
.bl-accent-failures, .bl-accent-mergers, .bl-accent-events { --bl-accent: #ec4899; --bl-accent-soft: rgba(236,72,153,0.14); }
.bl-accent-tutorials, .bl-accent-guides, .bl-accent-how-to { --bl-accent: #22c55e; --bl-accent-soft: rgba(34,197,94,0.14); }
.bl-accent-product, .bl-accent-platform, .bl-accent-updates { --bl-accent: #60a5fa; --bl-accent-soft: rgba(96,165,250,0.14); }

/* --- Featured (first post on page 1) — full-width banner card ----- */
.bl-feat { margin-bottom: 48px; }
.bl-feat-card {
    position: relative;
    display: flex;
    align-items: stretch;
    text-decoration: none; color: inherit;
    background: linear-gradient(135deg, #0d1c30 0%, #11253f 100%);
    border: 1px solid #1e3a5f;
    border-radius: 16px;
    overflow: hidden;
    transition: border-color .22s ease, transform .22s ease, box-shadow .22s ease;
}
.bl-feat-card:hover {
    border-color: var(--bl-accent);
    transform: translateY(-3px);
    box-shadow: 0 28px 56px -28px var(--bl-accent-soft);
}
.bl-feat-rail {
    flex: 0 0 6px;
    background: linear-gradient(180deg, var(--bl-accent), color-mix(in srgb, var(--bl-accent) 60%, transparent));
}
.bl-feat-body {
    flex: 1; min-width: 0;
    padding: 32px clamp(24px, 4vw, 44px);
    display: flex; flex-direction: column; gap: 14px;
}
.bl-feat-top { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.bl-badge-featured {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 4px 10px;
    font-family: ui-monospace, monospace;
    font-size: 10.5px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
    color: var(--bl-accent);
    background: var(--bl-accent-soft);
    border: 1px solid color-mix(in srgb, var(--bl-accent) 40%, transparent);
    border-radius: 999px;
}
.bl-badge-featured .d {
    width: 5px; height: 5px; border-radius: 999px;
    background: var(--bl-accent);
    box-shadow: 0 0 8px var(--bl-accent);
}
.bl-feat-cat {
    font-family: ui-monospace, monospace;
    font-size: 11px; font-weight: 600;
    letter-spacing: 0.14em; text-transform: uppercase;
    color: var(--bl-accent);
}
.bl-feat-title {
    font-size: clamp(1.5rem, 2.8vw, 2.25rem);
    font-weight: 600;
    letter-spacing: -0.022em;
    line-height: 1.18;
    color: #f8fafc;
    margin: 0;
    transition: color .2s ease;
}
.bl-feat-card:hover .bl-feat-title { color: var(--bl-accent); }
.bl-feat-excerpt {
    font-size: 15.5px;
    color: #94a3b8;
    line-height: 1.65;
    margin: 0;
    max-width: 760px;
}
.bl-feat-meta { display: flex; align-items: center; gap: 12px; font-size: 13px; color: #64748b; margin-top: 4px; }
.bl-feat-meta .sep { width: 3px; height: 3px; border-radius: 999px; background: #1e3a5f; }
.bl-feat-meta .read {
    color: var(--bl-accent); font-weight: 600;
    display: inline-flex; align-items: center; gap: 6px;
    transition: gap .2s ease;
}
.bl-feat-card:hover .bl-feat-meta .read { gap: 10px; }

/* --- Grid cards --------------------------------------------------- */
.bl-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
}
.bl-card {
    position: relative;
    display: flex;
    background: #0d1c30;
    border: 1px solid #1e3a5f;
    border-radius: 12px;
    overflow: hidden;
    text-decoration: none; color: inherit;
    transition: border-color .22s ease, transform .22s ease, box-shadow .22s ease;
    height: 100%;
    min-height: 180px;
}
.bl-card:hover {
    border-color: var(--bl-accent);
    transform: translateY(-3px);
    box-shadow: 0 20px 40px -20px var(--bl-accent-soft);
}
.bl-card-rail {
    flex: 0 0 4px;
    background: linear-gradient(180deg, var(--bl-accent), color-mix(in srgb, var(--bl-accent) 50%, transparent));
}
.bl-card-body {
    flex: 1; min-width: 0;
    padding: 18px 20px 18px;
    display: flex; flex-direction: column;
}
.bl-card-cat {
    display: inline-block;
    align-self: flex-start;
    padding: 3px 9px;
    font-family: ui-monospace, monospace;
    font-size: 10px; font-weight: 700;
    letter-spacing: 0.1em; text-transform: uppercase;
    color: var(--bl-accent);
    background: var(--bl-accent-soft);
    border: 1px solid color-mix(in srgb, var(--bl-accent) 30%, transparent);
    border-radius: 5px;
}
.bl-card-title {
    font-size: 16px;
    font-weight: 600;
    color: #f8fafc;
    margin: 11px 0 9px 0;
    line-height: 1.35;
    letter-spacing: -0.008em;
    transition: color .2s ease;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.bl-card:hover .bl-card-title { color: var(--bl-accent); }
.bl-card-excerpt {
    font-size: 13px;
    color: #94a3b8;
    line-height: 1.55;
    margin: 0 0 14px 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex-grow: 1;
}
.bl-card-foot {
    display: flex; justify-content: space-between; align-items: center;
    margin-top: auto;
    font-size: 12px; color: #64748b;
    padding-top: 4px;
    border-top: 1px solid rgba(30,58,95,0.5);
}
.bl-card-foot .arrow {
    color: var(--bl-accent);
    font-weight: 600;
    display: inline-flex; align-items: center; gap: 4px;
    opacity: 0;
    transform: translateX(-4px);
    transition: opacity .2s ease, transform .2s ease, gap .2s ease;
}
.bl-card:hover .bl-card-foot .arrow { opacity: 1; transform: translateX(0); gap: 7px; }
/* Touch devices have no :hover — show the "Read" affordance by default. */
@media (pointer: coarse) {
    .bl-card-foot .arrow { opacity: 1; transform: none; }
}
.bl-pag { margin-top: 56px; display: flex; justify-content: center; }
.bl-pag-group { display: inline-flex; align-items: center; gap: 4px; padding: 4px; background: #0d1c30; border: 1px solid #1e3a5f; border-radius: 12px; }
.bl-pag-group a, .bl-pag-group span { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; padding: 0 12px; font-size: 13px; font-weight: 500; color: #cbd5e1; border-radius: 8px; text-decoration: none; transition: background .18s ease, color .18s ease; }
.bl-pag-group a:hover { background: rgba(59,130,246,0.1); color: #f8fafc; }
.bl-pag-group span.on { background: #3b82f6; color: #fff; font-weight: 600; }
.bl-empty { padding: 96px 24px; text-align: center; border: 1px dashed #1e3a5f; border-radius: 16px; color: #94a3b8; }
.bl-empty p { font-size: 16px; margin: 0 0 18px 0; }

/* ============================================================================
   Lifted from templates/blog/detail.html inline <style> (2026-05-28)
   Article shell
   ============================================================================ */
.ar-shell { background: #0a1628; color: #e1e5eb; min-height: calc(100vh - 64px); }
.ar-progress { position: fixed; top: 0; left: 0; height: 3px; background: linear-gradient(90deg, #60a5fa, #3b82f6); z-index: 9999; transition: width .1s linear; box-shadow: 0 0 12px rgba(59,130,246,0.6); }
.ar-crumbs { background: rgba(13,28,48,0.6); border-bottom: 1px solid #162a46; backdrop-filter: blur(8px); }
.ar-crumbs-inner { max-width: 760px; margin: 0 auto; padding: 14px 24px; display: flex; align-items: center; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace; font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase; color: #64748b; }
.ar-crumbs a { color: #64748b; text-decoration: none; transition: color .18s ease; }
.ar-crumbs a:hover { color: #93c5fd; }
.ar-crumbs .sep { margin: 0 10px; color: #1e3a5f; }
.ar-hero { position: relative; overflow: hidden; padding: 64px 0 48px; border-bottom: 1px solid #162a46; }
.ar-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 50% at 50% 0%, rgba(59,130,246,0.1), transparent 70%); pointer-events: none; }
.ar-hero-inner { position: relative; z-index: 1; max-width: 760px; margin: 0 auto; padding: 0 24px; }
.ar-cat { font-family: ui-monospace, monospace; font-size: 11px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: #3b82f6; margin-bottom: 16px; display: inline-block; text-decoration: none; }
.ar-cat:hover { color: #93c5fd; }
.ar-title { font-size: clamp(1.875rem, 3.4vw + 0.25rem, 3rem); font-weight: 600; letter-spacing: -0.028em; line-height: 1.08; color: #f8fafc; margin: 0 0 20px 0; }
.ar-lede { font-size: 17.5px; color: #94a3b8; line-height: 1.65; max-width: 640px; margin: 0 0 28px 0; }
.ar-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-family: ui-monospace, monospace; font-size: 12px; color: #94a3b8; letter-spacing: 0.04em; }
.ar-meta .dot { width: 3px; height: 3px; border-radius: 999px; background: #1e3a5f; flex: 0 0 3px; }
.ar-byline { color: #94a3b8; }
.ar-byline strong { color: #e1e5eb; font-weight: 600; }
.ar-feat { max-width: 960px; margin: 0 auto; padding: 36px 24px 8px; }
.ar-feat-frame { border-radius: 18px; overflow: hidden; border: 1px solid #1e3a5f; box-shadow: 0 40px 80px -20px rgba(0,0,0,0.5); }
.ar-feat-frame img { display: block; width: 100%; height: auto; }
.ar-body-wrap { max-width: 720px; margin: 0 auto; padding: 48px 24px 96px; }
.ar-body > p:first-child { font-size: 1.18rem; color: #e1e5eb; line-height: 1.7; margin-bottom: 28px; }
.ar-body p { font-size: 16.5px; color: #cbd5e1; line-height: 1.78; margin: 0 0 22px 0; }
.ar-body h2 { font-size: 1.625rem; font-weight: 600; color: #f8fafc; letter-spacing: -0.02em; margin: 48px 0 18px 0; line-height: 1.2; }
.ar-body h2:first-child { margin-top: 0; }
.ar-body h3 { font-size: 1.25rem; font-weight: 600; color: #f8fafc; margin: 34px 0 14px 0; line-height: 1.3; letter-spacing: -0.01em; }
.ar-body ul, .ar-body ol { color: #cbd5e1; font-size: 16.5px; line-height: 1.75; padding-left: 22px; margin: 0 0 22px 0; }
.ar-body li { margin-bottom: 8px; }
.ar-body a { color: #60a5fa; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(96,165,250,0.4); transition: text-decoration-color .18s ease, color .18s ease; }
.ar-body a:hover { color: #93c5fd; text-decoration-color: #93c5fd; }
.ar-body strong { color: #f8fafc; font-weight: 600; }
.ar-body em { color: #e1e5eb; }
.ar-body hr { border: none; height: 1px; background: linear-gradient(90deg, transparent, #1e3a5f, transparent); margin: 44px 0; }
.ar-body blockquote { position: relative; padding: 20px 24px; margin: 28px 0; background: linear-gradient(180deg, #0d1c30, rgba(13,28,48,0.5)); border-left: 3px solid #3b82f6; border-radius: 10px; color: #e1e5eb; font-size: 17px; line-height: 1.65; font-style: italic; }
.ar-body blockquote p:last-child { margin-bottom: 0; }
.ar-body code { background: #0d1c30; border: 1px solid #1e3a5f; border-radius: 4px; padding: 2px 7px; font-size: 0.88em; color: #cbd5e1; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace; }
.ar-body pre { background: #0d1c30; border: 1px solid #1e3a5f; border-radius: 12px; padding: 18px 20px; overflow-x: auto; margin: 24px 0; font-size: 13px; line-height: 1.6; }
.ar-body pre code { background: none; border: none; padding: 0; font-size: inherit; }
.ar-body img { display: block; max-width: 100%; height: auto; border-radius: 10px; border: 1px solid #1e3a5f; margin: 24px auto; }
.ar-body table { width: 100%; border-collapse: collapse; font-size: 14px; margin: 24px 0; border: 1px solid #1e3a5f; border-radius: 10px; overflow: hidden; }
.ar-body thead { background: #162a46; }
.ar-body th { padding: 12px 14px; text-align: left; font-size: 11px; font-weight: 600; color: #94a3b8; text-transform: uppercase; letter-spacing: 0.08em; border-bottom: 1px solid #1e3a5f; }
.ar-body td { padding: 12px 14px; border-bottom: 1px solid #162a46; color: #cbd5e1; }
.ar-body tbody tr:last-child td { border-bottom: none; }
.ar-body tbody tr:hover { background: rgba(13,28,48,0.4); }
.ar-foot { border-top: 1px solid #162a46; background: #0a1628; }
.ar-foot-inner { max-width: 960px; margin: 0 auto; padding: 56px 24px; }
.ar-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 48px; }
.ar-tag { padding: 6px 13px; font-size: 12.5px; font-weight: 500; color: #94a3b8; background: #0d1c30; border: 1px solid #1e3a5f; border-radius: 999px; text-decoration: none; transition: all .18s ease; }
.ar-tag:hover { color: #93c5fd; border-color: #3b82f6; }
.ar-related-head { font-family: ui-monospace, monospace; font-size: 11px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: #3b82f6; margin-bottom: 20px; }
.ar-related-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; margin-bottom: 48px; }
.ar-related { display: flex; flex-direction: column; padding: 22px; background: #0d1c30; border: 1px solid #1e3a5f; border-radius: 12px; text-decoration: none; transition: border-color .2s ease, transform .2s ease; }
.ar-related:hover { border-color: #3b82f6; transform: translateY(-2px); }
.ar-related .rcat { font-family: ui-monospace, monospace; font-size: 10px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: #60a5fa; }
.ar-related h3 { font-size: 14.5px; font-weight: 600; color: #f8fafc; margin: 6px 0 12px; line-height: 1.4; letter-spacing: -0.008em; }
.ar-related:hover h3 { color: #93c5fd; }
.ar-related .rdate { font-size: 12px; color: #64748b; margin-top: auto; }
.ar-back { display: inline-flex; align-items: center; gap: 8px; padding-top: 40px; border-top: 1px solid #162a46; font-family: ui-monospace, monospace; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; color: #94a3b8; text-decoration: none; transition: color .2s ease, gap .2s ease; }
.ar-back:hover { color: #f8fafc; gap: 12px; }

/* ============================================================================
   Lifted from templates/banks/profile.html inline <style> (2026-05-28)
   Bank profile shell, panels, peer ranks, trend table, FAQ, CTA
   ============================================================================ */
.bp-shell { background: #0a1628; color: #e1e5eb; }
.bp-crumbs { background: #0d1c30; border-bottom: 1px solid #1e3a5f; padding: 10px 0; }
.bp-crumbs-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; display: flex; align-items: center; font-family: ui-monospace, monospace; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: #64748b; }
.bp-crumbs a { color: #64748b; text-decoration: none; }
.bp-crumbs a:hover { color: #93c5fd; }
.bp-crumbs svg { margin: 0 8px; color: #1e3a5f; }
.bp-crumbs .cur { color: #cbd5e1; }
.bp-header { border-bottom: 1px solid #162a46; padding: 56px 0 40px; position: relative; overflow: hidden; }
.bp-header::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 40% at 30% 0%, rgba(59,130,246,0.1), transparent 70%); pointer-events: none; }
.bp-header-inner { position: relative; z-index: 1; max-width: 1200px; margin: 0 auto; padding: 0 24px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 16px; }
.bp-header h1 { font-size: clamp(1.75rem, 3vw, 2.5rem); font-weight: 600; letter-spacing: -0.025em; color: #f8fafc; margin: 0 0 12px 0; line-height: 1.1; }
.bp-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 13px; color: #94a3b8; }
.bp-meta .dot { width: 3px; height: 3px; border-radius: 999px; background: #1e3a5f; }
.bp-tier { display: inline-flex; align-items: center; padding: 3px 10px; font-size: 11.5px; font-weight: 600; background: rgba(59,130,246,0.12); color: #93c5fd; border: 1px solid rgba(59,130,246,0.25); border-radius: 999px; }
.bp-hubnav { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 14px; }
.bp-hubnav-link { font-size: 12.5px; color: #60a5fa; text-decoration: none; padding: 4px 0; border-bottom: 1px dashed rgba(96,165,250,0.4); transition: color .12s, border-color .12s; }
.bp-hubnav-link:hover { color: #93c5fd; border-bottom-color: rgba(147,197,253,0.7); }
.gloss-link { color: inherit; text-decoration: none; border-bottom: 1px dotted rgba(148,163,184,0.4); transition: border-color .12s, color .12s; }
.gloss-link:hover { color: #60a5fa; border-bottom-color: rgba(96,165,250,0.7); }
.bp-similar { background: #0a1628; padding: 48px 0; border-top: 1px solid #162a46; }
.bp-similar-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.bp-similar h2 { font-size: 22px; font-weight: 700; color: #f1f5f9; margin: 0 0 18px; letter-spacing: -0.01em; }
.bp-similar-tabs { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 18px; border-bottom: 1px solid #162a46; }
.bp-tab { background: transparent; border: none; padding: 10px 16px; font-size: 13.5px; font-weight: 600; color: #64748b; cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; transition: color .15s, border-color .15s; }
.bp-tab:hover { color: #cbd5e1; }
.bp-tab.active { color: #60a5fa; border-bottom-color: #3b82f6; }
.bp-similar-panel { display: none; }
.bp-similar-panel.active { display: block; }
.bp-similar-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.bp-similar-card { display: block; padding: 14px 16px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.07); border-radius: 8px; text-decoration: none; transition: background .15s, border-color .15s, transform .12s; }
.bp-similar-card:hover { background: rgba(96,165,250,0.07); border-color: rgba(96,165,250,0.3); transform: translateY(-1px); }
.bp-similar-card .name { color: #f1f5f9; font-size: 14px; font-weight: 600; line-height: 1.3; margin-bottom: 4px; }
.bp-similar-card .meta { color: #94a3b8; font-size: 12px; }
.bp-similar-card .assets { color: #60a5fa; font-family: ui-monospace, monospace; font-size: 12px; margin-top: 4px; font-weight: 600; }
.bp-compare { background: #0a1628; padding: 40px 0; border-top: 1px solid #162a46; }
.bp-compare-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.bp-compare h2 { font-size: 22px; font-weight: 700; color: #f1f5f9; margin: 0 0 6px; letter-spacing: -0.01em; }
.bp-compare-sub { color: #94a3b8; font-size: 13.5px; margin: 0 0 18px; }
.bp-compare-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
.bp-compare-card { display: block; padding: 14px 16px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.07); border-radius: 8px; text-decoration: none; transition: background .15s, border-color .15s, transform .12s; }
.bp-compare-card:hover { background: rgba(96,165,250,0.07); border-color: rgba(96,165,250,0.3); transform: translateY(-1px); }
.bp-compare-vs { color: #f1f5f9; font-size: 13px; font-weight: 600; line-height: 1.35; margin-bottom: 4px; }
.bp-compare-vs span { color: #60a5fa; font-weight: 700; margin: 0 4px; }
.bp-compare-meta { color: #94a3b8; font-size: 12px; }
.bp-compare-foot { margin-top: 18px; font-size: 13px; }
.bp-compare-foot a { color: #60a5fa; text-decoration: none; font-weight: 600; }
.bp-compare-foot a:hover { text-decoration: underline; }
.bp-flags { background: #0a1628; padding: 40px 0; border-top: 1px solid #162a46; }
.bp-flags-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.bp-flags h2 { font-size: 22px; font-weight: 700; color: #f1f5f9; margin: 0 0 6px; letter-spacing: -0.01em; }
.bp-flags-lede { color: #94a3b8; font-size: 13.5px; margin: 0 0 18px; }
.bp-flags-list { display: flex; flex-direction: column; gap: 12px; }
.bp-flag { padding: 16px 18px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.07); background: rgba(255,255,255,0.025); }
.bp-flag-concern { border-color: rgba(248,113,113,0.32); background: rgba(248,113,113,0.06); }
.bp-flag-watch   { border-color: rgba(251,191,36,0.32);  background: rgba(251,191,36,0.05); }
.bp-flag-info    { border-color: rgba(96,165,250,0.30);  background: rgba(96,165,250,0.05); }
.bp-flag-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 6px; }
.bp-flag-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; box-shadow: 0 0 0 4px rgba(255,255,255,0.04); }
.bp-flag-concern .bp-flag-dot { background: #f87171; box-shadow: 0 0 0 4px rgba(248,113,113,0.18); }
.bp-flag-watch   .bp-flag-dot { background: #fbbf24; box-shadow: 0 0 0 4px rgba(251,191,36,0.18); }
.bp-flag-info    .bp-flag-dot { background: #60a5fa; box-shadow: 0 0 0 4px rgba(96,165,250,0.18); }
.bp-flag-label { font-weight: 600; color: #f1f5f9; font-size: 14.5px; flex: 1; }
.bp-flag-link { font-size: 12.5px; color: #60a5fa; text-decoration: none; white-space: nowrap; }
.bp-flag-link:hover { color: #93c5fd; text-decoration: underline; }
.bp-flag-detail { color: #cbd5e1; font-size: 13.5px; line-height: 1.6; margin: 0; }
.bp-ranks { background: #0a1628; padding: 48px 0; border-top: 1px solid #162a46; }
.bp-ranks-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.bp-ranks h2 { font-size: 22px; font-weight: 700; color: #f1f5f9; margin: 0 0 6px; letter-spacing: -0.01em; }
.bp-ranks-lede { color: #94a3b8; font-size: 13.5px; margin: 0 0 18px; }
.bp-ranks-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.bp-rank-card { display: block; padding: 16px 18px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.07); border-radius: 10px; text-decoration: none; transition: background .15s, border-color .15s, transform .12s; }
.bp-rank-card:hover { background: rgba(96,165,250,0.07); border-color: rgba(96,165,250,0.3); transform: translateY(-1px); }
.bp-rank-label { color: #94a3b8; font-size: 12px; font-weight: 500; margin-bottom: 6px; line-height: 1.4; }
.bp-rank-line { display: flex; align-items: baseline; gap: 8px; margin-bottom: 4px; }
.bp-rank-num { font-family: ui-monospace, monospace; color: #60a5fa; font-size: 24px; font-weight: 700; letter-spacing: -0.02em; }
.bp-rank-of { color: #64748b; font-size: 13px; }
.bp-rank-value { color: #cbd5e1; font-size: 13px; font-family: ui-monospace, monospace; }
.bp-rank-pct { color: #94a3b8; }
.bp-trend { background: #0a1628; padding: 48px 0; border-top: 1px solid #162a46; }
.bp-trend-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.bp-trend h2 { font-size: 22px; font-weight: 700; color: #f1f5f9; margin: 0 0 6px; letter-spacing: -0.01em; }
.bp-trend-lede { color: #94a3b8; font-size: 13.5px; margin: 0 0 18px; }
.bp-trend-wrap { overflow-x: auto; border: 1px solid rgba(255,255,255,0.07); border-radius: 10px; background: rgba(13,28,48,0.4); }
.bp-trend-table { width: 100%; border-collapse: collapse; }
.bp-trend-table th { background: rgba(255,255,255,0.04); padding: 12px 14px; text-align: left; color: #94a3b8; font-size: 11px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; border-bottom: 1px solid rgba(255,255,255,0.08); white-space: nowrap; }
.bp-trend-table th.num { text-align: right; }
/* JS-injected per-metric sparkline under the column label. */
.bp-trend-table th.num .bp-spark { display: block; margin: 5px 0 0 auto; }
.bp-trend-table td { padding: 11px 14px; font-size: 13.5px; color: #cbd5e1; border-bottom: 1px solid rgba(255,255,255,0.04); font-family: ui-monospace, monospace; }
.bp-trend-table td:first-child { font-family: inherit; color: #f1f5f9; }
.bp-trend-table td.num { text-align: right; }
.bp-trend-table tr:last-child td { border-bottom: none; }
.bp-trend-table tr:hover td { background: rgba(96,165,250,0.04); }
.bp-faqs { background: #0a1628; padding: 48px 0 64px; border-top: 1px solid #162a46; }
.bp-faqs-inner { max-width: 880px; margin: 0 auto; padding: 0 24px; }
.bp-faqs h2 { font-size: 22px; font-weight: 700; color: #f1f5f9; margin: 0 0 22px; letter-spacing: -0.01em; line-height: 1.25; }
.bp-faqs-list { display: flex; flex-direction: column; gap: 18px; }
.bp-faq { padding: 18px 20px; background: rgba(255,255,255,0.025); border: 1px solid rgba(255,255,255,0.07); border-radius: 8px; }
.bp-faq h3 { font-size: 15px; font-weight: 600; color: #f1f5f9; margin: 0 0 8px; line-height: 1.4; }
.bp-faq p { font-size: 14px; color: #cbd5e1; line-height: 1.65; margin: 0; }
.bp-mono { font-family: ui-monospace, monospace; font-size: 12px; color: #cbd5e1; }
.bp-live { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; font-family: ui-monospace, monospace; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: #22c55e; background: rgba(34,197,94,0.06); border: 1px solid rgba(34,197,94,0.2); border-radius: 999px; }
.bp-live .ldot { width: 6px; height: 6px; border-radius: 999px; background: #22c55e; box-shadow: 0 0 10px rgba(34,197,94,0.6); }
.bp-summary { padding: 24px 0; border-bottom: 1px solid #162a46; }
.bp-summary-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; color: #94a3b8; font-size: 14px; line-height: 1.7; }
.bp-summary strong { color: #e1e5eb; font-weight: 600; }
.bp-stats { padding: 28px 0; border-bottom: 1px solid #162a46; }
.bp-stats-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.bp-stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); border: 1px solid #1e3a5f; border-radius: 14px; background: #0d1c30; overflow: hidden; }
.bp-stat { padding: 22px 24px; border-right: 1px solid #162a46; }
.bp-stat:last-child { border-right: none; }
@media (max-width: 900px) { .bp-stat { border-right: none; border-bottom: 1px solid #162a46; } .bp-stat:last-child { border-bottom: none; } }
.bp-stat .lbl { font-family: ui-monospace, monospace; font-size: 10px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: #64748b; margin-bottom: 8px; }
.bp-stat .val { font-family: ui-monospace, monospace; font-size: 1.5rem; font-weight: 600; color: #f8fafc; letter-spacing: -0.02em; }
.bp-panels { padding: 40px 0 64px; }
.bp-panels-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; }
.bp-panel { background: #0d1c30; border: 1px solid #1e3a5f; border-radius: 12px; overflow: hidden; }
.bp-ph { padding: 12px 16px; background: #162a46; border-bottom: 1px solid #1e3a5f; display: flex; align-items: center; gap: 8px; }
.bp-ph h2 { margin: 0; font-family: ui-monospace, monospace; font-size: 11px; font-weight: 600; color: #3b82f6; text-transform: uppercase; letter-spacing: 0.14em; }
.bp-ph svg { width: 14px; height: 14px; }
.bp-row { display: flex; justify-content: space-between; align-items: center; padding: 11px 16px; border-bottom: 1px solid #162a46; font-size: 13px; }
.bp-row:last-child { border-bottom: none; }
.bp-row .k { color: #94a3b8; }
.bp-row .v { font-family: ui-monospace, monospace; font-weight: 600; color: #e1e5eb; }
.bp-row .v.g { color: #22c55e; }
.bp-row .v.y { color: #fbbf24; }
.bp-row .v.r { color: #ef4444; }
.bp-row .v.m { color: #64748b; }
/* ── Locked dashboard preview gate ──────────────────────────────────────────
   A faux BRR-terminal rendered in CSS, blurred behind a frosted veil + CTA.
   "Blurred preview gate" pattern — shows the engaged researcher exactly what
   signing up unlocks for the bank they're already looking at. */
.bp-preview { padding: 56px 0 8px; }
.bp-preview-inner { max-width: 1100px; margin: 0 auto; padding: 0 24px; }
.bp-preview-h2 {
    font-size: clamp(1.3rem, 2.2vw, 1.8rem);
    font-weight: 600;
    letter-spacing: -0.02em;
    color: #f8fafc;
    text-align: center;
    margin: 0 0 24px;
}
.bp-preview-stage {
    position: relative;
    border: 1px solid #1e3a5f;
    border-radius: 14px;
    overflow: hidden;
    background: #0a1424;
}
.bp-preview-frame { filter: blur(3px); opacity: 0.85; user-select: none; pointer-events: none; }
.bp-preview-bar {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 16px; background: #0d1c30; border-bottom: 1px solid #1e3a5f;
    font-family: ui-monospace, monospace; font-size: 11px;
}
.bp-preview-logo { color: #3b82f6; font-weight: 700; letter-spacing: 0.12em; }
.bp-preview-ent { color: #cbd5e1; }
.bp-preview-tabs {
    display: flex; gap: 18px; padding: 9px 16px; background: #0b1626;
    border-bottom: 1px solid #162a46; overflow: hidden;
    font-family: ui-monospace, monospace; font-size: 10.5px; letter-spacing: 0.08em;
}
.bp-preview-tabs span { color: #64748b; white-space: nowrap; }
.bp-preview-tabs span.on { color: #f8fafc; border-bottom: 2px solid #3b82f6; padding-bottom: 6px; }
.bp-preview-grid {
    display: grid; grid-template-columns: 2fr 1fr; gap: 16px; padding: 20px 16px;
}
.bp-preview-bars { display: flex; align-items: flex-end; gap: 8px; height: 180px; }
.bp-preview-bars span {
    flex: 1; border-radius: 3px 3px 0 0;
    background: linear-gradient(180deg, #3b82f6, rgba(59,130,246,0.25));
}
.bp-preview-tiles { display: grid; grid-template-rows: repeat(4, 1fr); gap: 10px; }
.bp-preview-tile {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 14px; border: 1px solid #1e3a5f; border-radius: 8px; background: #0d1c30;
}
.bp-preview-tile .l { font-family: ui-monospace, monospace; font-size: 11px; color: #64748b; }
.bp-preview-tile .v { font-family: ui-monospace, monospace; font-size: 16px; font-weight: 600; color: #f8fafc; }
.bp-preview-veil {
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    background: radial-gradient(ellipse 80% 80% at 50% 50%, rgba(10,20,36,0.72), rgba(10,20,36,0.94));
}
.bp-preview-lock { text-align: center; padding: 24px; max-width: 460px; }
.bp-preview-lock > svg { color: #3b82f6; margin-bottom: 12px; }
.bp-preview-headline { font-size: 13.5px; color: #cbd5e1; margin: 0 0 18px; line-height: 1.5; }

.bp-cta { padding: 72px 0; position: relative; overflow: hidden; border-top: 1px solid #162a46; }
.bp-cta::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 60% at 50% 100%, rgba(59,130,246,0.25), transparent 60%); pointer-events: none; }
.bp-cta-inner { position: relative; z-index: 1; max-width: 820px; margin: 0 auto; padding: 0 24px; text-align: center; }
.bp-cta h2 { font-size: clamp(1.75rem, 3vw, 2.5rem); font-weight: 600; letter-spacing: -0.025em; color: #f8fafc; margin: 0 0 16px 0; }
.bp-cta p { font-size: 16px; color: #94a3b8; line-height: 1.6; max-width: 580px; margin: 0 auto 28px; }
.bp-cta p strong { color: #f8fafc; font-weight: 600; }
.bp-cta-bullets { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px 40px; max-width: 640px; margin: 0 auto 32px; text-align: left; }
.bp-cta-bullets div { display: flex; align-items: center; gap: 10px; font-size: 13.5px; color: #cbd5e1; }
.bp-cta-bullets svg { color: #22c55e; flex-shrink: 0; }
/* Closing CTA (after FAQs) — lighter/tighter than the mid-page CTA so the two
   don't read as a duplicate; smaller heading, no bullet grid. */
.bp-cta--closing { padding: 56px 0; border-top: 1px solid #162a46; background: #0a1424; }
.bp-cta--closing h2 { font-size: clamp(1.4rem, 2.4vw, 1.9rem); }
.bp-cta--closing p { font-size: 15px; }
@media (max-width: 768px), (pointer: coarse) {
    .bp-shell a:not(.bp-cta-link),
    .bp-shell button {
        min-height: 48px;
        display: inline-flex;
        align-items: center;
        padding: 8px 4px;
        line-height: 1.25;
    }
    .bp-shell .bp-crumbs a,
    .bp-shell .bp-cta a {
        min-width: 48px;
        justify-content: center;
    }
    .bp-crumbs a { padding: 12px 14px; }
    .bp-shell a + a, .bp-shell a + button, .bp-shell button + a { margin-left: 8px; }
}

/* ── bp-hq: Headquarters Profile + Management cards ───────────────────────── */
.bp-hq { padding: 32px 0 8px; border-bottom: 1px solid #162a46; }
.bp-hq-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px 24px; }

/* Two-column grid; collapses to single column on narrow viewports */
/* HQ card spans full width (Management stacks below it), so the profile reads
   wide-and-short rather than a tall narrow column. */
.bp-hq-grid { display: grid; grid-template-columns: 1fr; gap: 16px; align-items: start; }

/* Shared card shell — matches bp-panel aesthetic */
.bp-hq-card,
.bp-mgmt-card {
    background: #0d1c30;
    border: 1px solid #1e3a5f;
    border-radius: 8px;
    overflow: hidden;
}

/* Card header bar — same pattern as .bp-ph */
.bp-hq-card-head,
.bp-mgmt-card-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 16px;
    background: #162a46;
    border-bottom: 1px solid #1e3a5f;
}
.bp-hq-card-head svg,
.bp-mgmt-card-head svg { width: 13px; height: 13px; flex-shrink: 0; }
.bp-hq-card-head h2,
.bp-mgmt-card-head h2 {
    margin: 0;
    font-family: ui-monospace, monospace;
    font-size: 11px;
    font-weight: 600;
    color: #3b82f6;
    text-transform: uppercase;
    letter-spacing: 0.14em;
}

/* Card body padding — HQ facts go edge-to-edge (own hairline grid), so no body
   padding there; Management keeps its inset padding. */
.bp-hq-card-body { padding: 0; }
.bp-mgmt-card-body { padding: 16px; }

/* ── Fact tiles ───────────────────────────────────────────────────────────────
   Same visual language as the headline .bp-stat row: a responsive grid of
   tiles, each a small mono uppercase label over its value. Reads wide-and-short
   and reflows by viewport instead of a rigid ragged label/value table. The 1px
   grid gap over a tinted backdrop draws the hairline dividers between tiles. */
.bp-hq-facts {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 1px;
    background: #1e3a5f;   /* = card border colour → hairlines between tiles */
    margin: 0;
}
.bp-fact {
    background: #0d1c30;
    padding: 12px 16px;
    min-width: 0;          /* let long values wrap instead of overflowing */
}
/* Long values (address, charter, metro, parent) get two tracks */
.bp-fact--wide { grid-column: span 2; }
@media (max-width: 620px) {
    .bp-hq-facts { grid-template-columns: 1fr 1fr; }
    .bp-fact--wide { grid-column: span 2; }
}

.bp-fact dt {
    font-family: ui-monospace, monospace;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: 5px;
}
.bp-fact dd {
    margin: 0;
    font-size: 13.5px;
    color: #e1e5eb;
    line-height: 1.4;
    word-break: break-word;
}

/* Mono IDs (FDIC Cert, RSSD) */
.bp-fact .mono { font-family: ui-monospace, monospace; font-size: 12.5px; color: #cbd5e1; }

/* Parent BHC link — inherits mono, subtle underline */
.bp-fact .bhc-link { color: #60a5fa; text-decoration: none; }
.bp-fact .bhc-link:hover { color: #93c5fd; text-decoration: underline; }
.bp-fact .bhc-link .mono { color: #60a5fa; }

/* External website link — accent colour with arrow */
.bp-fact .site-link { color: #3b82f6; text-decoration: none; transition: color .12s; word-break: break-all; }
.bp-fact .site-link:hover { color: #60a5fa; }

/* ── Management table ─────────────────────────────────────────────────────── */
.bp-mgmt-source {
    font-size: 11.5px;
    color: #64748b;
    margin: 0 0 12px;
    line-height: 1.5;
}
.bp-mgmt-table-wrap { overflow-x: auto; }
.bp-mgmt-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.bp-mgmt-table thead tr {
    border-bottom: 1px solid #1e3a5f;
}
.bp-mgmt-table th {
    padding: 6px 10px 8px;
    text-align: left;
    font-family: ui-monospace, monospace;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #64748b;
    white-space: nowrap;
}
.bp-mgmt-table th:first-child { padding-left: 0; }
.bp-mgmt-table th:last-child  { padding-right: 0; }
.bp-mgmt-table tbody tr {
    border-bottom: 1px solid #162a46;
    transition: background .12s;
}
.bp-mgmt-table tbody tr:last-child { border-bottom: none; }
.bp-mgmt-table tbody tr:hover { background: rgba(59,130,246,0.04); }
.bp-mgmt-table td {
    padding: 9px 10px;
    color: #cbd5e1;
    vertical-align: middle;
}
.bp-mgmt-table td:first-child { padding-left: 0; color: #f1f5f9; font-weight: 500; }
.bp-mgmt-table td:last-child  { padding-right: 0; }

/* Role pill — refined mono badge */
.bp-role-pill {
    display: inline-flex;
    align-items: center;
    padding: 2px 7px;
    font-family: ui-monospace, monospace;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: #93c5fd;
    background: rgba(59,130,246,0.12);
    border: 1px solid rgba(59,130,246,0.22);
    border-radius: 4px;
    white-space: nowrap;
}

@media (max-width: 600px) {
    /* On small screens the management title column can be long — allow wrap */
    .bp-mgmt-table td { white-space: normal; }
}


/* ============================================================================
   Lifted from templates/banks/directory.html inline <style> (2026-05-28)
   ============================================================================ */
    .dir-hero { background: #0a1628; padding: 80px 0 56px; position: relative; overflow: hidden; }
    .dir-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 70% 50% at 50% 0%, rgba(59,130,246,0.14), transparent 70%); pointer-events: none; }
    .dir-hero-inner { position: relative; z-index: 1; max-width: 1200px; margin: 0 auto; padding: 0 24px; text-align: center; }
    .dir-bar { background: rgba(10,22,40,0.85); backdrop-filter: blur(8px); border-top: 1px solid #162a46; border-bottom: 1px solid #1e3a5f; position: sticky; top: 64px; z-index: 40; padding: 16px 0; }
    .dir-bar-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
    .dir-form { display: flex; flex-wrap: wrap; gap: 10px; }
    .dir-search { flex: 1; min-width: 240px; position: relative; }
    .dir-search svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: #64748b; pointer-events: none; }
    .dir-search input { width: 100%; padding: 11px 14px 11px 42px; background: #0d1c30; border: 1px solid #1e3a5f; border-radius: 10px; color: #f8fafc; font-size: 14px; }
    .dir-search input:focus { outline: none; border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59,130,246,0.2); }
    .dir-state { min-width: 180px; padding: 11px 14px; background: #0d1c30; border: 1px solid #1e3a5f; border-radius: 10px; color: #f8fafc; font-size: 14px; }
    .dir-results { background: #0a1628; padding: 32px 0 96px; }
    .dir-results-inner { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
    .dir-meta { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; font-size: 13.5px; color: #94a3b8; }
    .dir-meta a { color: #60a5fa; font-weight: 500; text-decoration: none; font-size: 13px; }
    .dir-meta .hit { color: #e1e5eb; font-weight: 600; }
    .dir-table-wrap { overflow-x: auto; border: 1px solid #1e3a5f; border-radius: 12px; background: #0d1c30; }
    .dir-table { width: 100%; font-size: 13px; border-collapse: collapse; }
    .dir-table thead { background: #162a46; border-bottom: 1px solid #1e3a5f; }
    .dir-table th { padding: 12px 14px; font-size: 10.5px; font-weight: 600; color: #94a3b8; text-transform: uppercase; letter-spacing: 0.08em; text-align: left; white-space: nowrap; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
    .dir-table th.r { text-align: right; }
    /* Sortable column headers */
    .dir-sort { display: inline-flex; align-items: center; gap: 5px; color: #94a3b8; text-decoration: none; transition: color .12s ease; }
    .dir-table th.r .dir-sort { flex-direction: row-reverse; }
    .dir-sort:hover { color: #e1e5eb; }
    .dir-sort.on { color: #60a5fa; }
    .dir-sort-ind { font-size: 8.5px; opacity: 0.6; line-height: 1; }
    .dir-sort.on .dir-sort-ind { opacity: 1; }
    .dir-table th.dir-sorted { background: rgba(59,130,246,0.08); }
    .dir-sort:focus-visible { outline: 2px solid #60a5fa; outline-offset: 2px; border-radius: 4px; }
    .dir-table tbody tr { border-bottom: 1px solid #162a46; cursor: pointer; transition: background .15s ease; }
    .dir-table tbody tr:hover { background: rgba(59,130,246,0.06); }
    .dir-table tbody tr:last-child { border-bottom: none; }
    .dir-table td { padding: 13px 14px; color: #e1e5eb; vertical-align: middle; }
    .dir-table td.r { text-align: right; white-space: nowrap; font-family: ui-monospace, monospace; }
    .dir-table a.name { font-weight: 600; color: #60a5fa; text-decoration: none; }
    .dir-table a.name:hover { color: #93c5fd; text-decoration: underline; }
    .dir-table .sub { font-size: 11.5px; color: #64748b; margin-top: 3px; }
    .dir-table .tier { display: inline-flex; align-items: center; padding: 3px 9px; font-size: 10.5px; font-weight: 600; background: rgba(59,130,246,0.12); color: #93c5fd; border: 1px solid rgba(59,130,246,0.25); border-radius: 999px; white-space: nowrap; }
    .dir-table .g { color: #22c55e; }
    .dir-table .r-red { color: #ef4444; }
    .dir-table .a { color: #fbbf24; }
    .dir-table .m { color: #64748b; }
    .dir-pag { margin-top: 28px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
    .dir-pag-label { font-size: 13.5px; color: #94a3b8; }
    .dir-pag-ctrls { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
    .dir-pag-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; font-size: 13px; font-weight: 500; color: #cbd5e1; background: #0d1c30; border: 1px solid #1e3a5f; border-radius: 8px; text-decoration: none; transition: all .18s ease; }
    .dir-pag-btn:hover { border-color: #3b82f6; color: #f8fafc; }
    .dir-pag-num { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; padding: 0 10px; font-size: 13px; font-weight: 500; color: #cbd5e1; background: #0d1c30; border: 1px solid #1e3a5f; border-radius: 8px; text-decoration: none; transition: all .18s ease; }
    .dir-pag-num:hover { border-color: #3b82f6; color: #f8fafc; }
    .dir-pag-num.active { background: #3b82f6; color: #fff; border-color: #3b82f6; font-weight: 600; }
    .dir-pag-ellipsis { color: #64748b; padding: 0 6px; }
    .dir-empty { padding: 80px 24px; text-align: center; color: #94a3b8; border: 1px dashed #1e3a5f; border-radius: 12px; }
    .dir-empty-sub { font-size: 13.5px; color: #64748b; margin: 6px 0 20px; }
    /* Hub CTA strip — three callouts under the H1 routing to the new
       state/tier/glossary indexes. Each tile is a discrete link so the
       full card surface is clickable. */
    .dir-hubcta { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin-top: 28px; max-width: 880px; margin-left: auto; margin-right: auto; }
    .dir-hubcta-link { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; background: rgba(13,28,48,0.6); border: 1px solid #1e3a5f; border-radius: 10px; text-decoration: none; text-align: left; transition: background .15s, border-color .15s, transform .12s; }
    .dir-hubcta-link:hover { background: rgba(59,130,246,0.07); border-color: rgba(59,130,246,0.4); transform: translateY(-1px); }
    .dir-hubcta-eyebrow { font-family: ui-monospace, monospace; font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: #64748b; }
    .dir-hubcta-label { font-size: 15.5px; font-weight: 600; color: #f8fafc; }
    .dir-hubcta-sub { font-size: 12.5px; color: #94a3b8; line-height: 1.45; margin-top: 2px; }

/* ============================================================================
   Lifted from templates/banks/category_hub.html inline <style> (2026-05-28)
   ============================================================================ */
  .ch-shell { background: #0a1628; color: #e1e5eb; min-height: calc(100vh - 64px); }
  .ch-wrap { max-width: 1100px; margin: 0 auto; padding: 56px 24px 96px; }
  .ch-bc { color: #64748b; font-size: 13px; margin-bottom: 14px; }
  .ch-bc a { color: #94a3b8; text-decoration: none; }
  .ch-bc a:hover { color: #60a5fa; }
  .ch-eyebrow { color: #60a5fa; font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 10px; }
  .ch-h1 { font-size: clamp(28px, 4vw, 40px); line-height: 1.15; font-weight: 700; color: #f1f5f9; margin: 0 0 8px; letter-spacing: -0.02em; }
  .ch-sub { color: #94a3b8; font-size: 16px; margin: 0 0 24px; }
  .ch-desc { color: #cbd5e1; font-size: 15.5px; line-height: 1.65; margin: 0 0 32px; max-width: 760px; }

  .ch-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin-bottom: 36px; }
  .ch-stat { padding: 16px 18px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.07); border-radius: 8px; }
  .ch-stat .lbl { font-family: ui-monospace, monospace; font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: #64748b; margin-bottom: 6px; }
  .ch-stat .val { font-size: 22px; font-weight: 700; color: #f1f5f9; letter-spacing: -0.01em; }
  .ch-stat .unit { font-size: 13px; color: #94a3b8; margin-left: 4px; font-weight: 500; }

  .ch-top { margin: 24px 0 36px; }
  .ch-top-h { color: #94a3b8; font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; margin: 0 0 12px; }
  .ch-top-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
  .ch-top-item { padding: 12px 14px; background: rgba(96,165,250,0.06); border: 1px solid rgba(96,165,250,0.18); border-radius: 8px; display: flex; align-items: center; justify-content: space-between; text-decoration: none; transition: background .15s, border-color .15s; }
  .ch-top-item:hover { background: rgba(96,165,250,0.12); border-color: rgba(96,165,250,0.35); }
  .ch-top-name { color: #f1f5f9; font-weight: 600; font-size: 14px; line-height: 1.3; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ch-top-assets { color: #60a5fa; font-family: ui-monospace, monospace; font-size: 12.5px; font-weight: 600; margin-left: 12px; flex-shrink: 0; }

  .ch-table-wrap { overflow-x: auto; margin: 24px 0; border-radius: 10px; border: 1px solid rgba(255,255,255,0.07); }
  .ch-table { width: 100%; border-collapse: collapse; background: rgba(13,28,48,0.4); }
  .ch-table th { background: rgba(255,255,255,0.04); padding: 12px 14px; text-align: left; color: #94a3b8; font-size: 10.5px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; border-bottom: 1px solid rgba(255,255,255,0.08); white-space: nowrap; }
  .ch-table td { padding: 12px 14px; font-size: 13.5px; color: #cbd5e1; border-bottom: 1px solid rgba(255,255,255,0.04); }
  .ch-table tr:last-child td { border-bottom: none; }
  .ch-table tr:hover td { background: rgba(96,165,250,0.04); }
  .ch-table .name a { color: #f1f5f9; text-decoration: none; font-weight: 600; }
  .ch-table .name a:hover { color: #60a5fa; }
  .ch-table .num { font-family: ui-monospace, monospace; text-align: right; white-space: nowrap; }
  .ch-table .muted { color: #64748b; font-size: 12.5px; }

  .ch-empty { padding: 60px 20px; text-align: center; color: #64748b; }
  .ch-foot { margin-top: 36px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.07); color: #64748b; font-size: 13px; line-height: 1.6; }
  .ch-foot a { color: #60a5fa; text-decoration: none; }
  .ch-foot a:hover { text-decoration: underline; }
  /* Glossary-link affordance for table column headers — subtle dashed underline
     so it reads as informational without competing with the bank-name links. */
  .ch-table th .gloss-link { color: inherit; text-decoration: none; border-bottom: 1px dashed rgba(148,163,184,0.5); transition: color .12s, border-color .12s; }
  .ch-table th .gloss-link:hover { color: #60a5fa; border-bottom-color: rgba(96,165,250,0.8); }

  /* Sibling-hub navigation at page bottom — compact, alphabetical row of all
     other states (or other tiers) so visitors can jump laterally without an
     index round-trip. */
  .ch-siblings { margin-top: 28px; padding: 18px 0; border-top: 1px solid rgba(255,255,255,0.07); }
  .ch-siblings h3 { color: #94a3b8; font-size: 11.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; margin: 0 0 12px; }
  .ch-siblings-row { display: flex; flex-wrap: wrap; gap: 6px 12px; font-size: 13px; }
  .ch-siblings-row a { color: #cbd5e1; text-decoration: none; padding: 2px 0; transition: color .12s; }
  .ch-siblings-row a:hover { color: #60a5fa; }
  .ch-siblings-row a.current { color: #60a5fa; font-weight: 600; }

  .ch-state-rankings { margin-top: 32px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,0.07); }
  .ch-state-rankings h3 { color: #f1f5f9; font-size: 18px; font-weight: 700; margin: 0 0 6px; }
  .ch-state-rankings-sub { color: #94a3b8; font-size: 13.5px; margin: 0 0 16px; max-width: 720px; }
  .ch-state-rankings-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 8px 12px; }
  .ch-state-rankings-grid a { display: block; padding: 10px 14px; background: rgba(255,255,255,0.025); border: 1px solid rgba(255,255,255,0.06); border-radius: 6px; color: #cbd5e1; text-decoration: none; font-size: 13.5px; transition: background .15s, border-color .15s, color .12s; }
  .ch-state-rankings-grid a:hover { background: rgba(96,165,250,0.08); border-color: rgba(96,165,250,0.25); color: #60a5fa; }


/* ============================================================================
   Lifted from templates/glossary/detail.html inline <style> (2026-05-29)
   ============================================================================ */
    .gd-shell { background: #0a1628; color: #e1e5eb; min-height: calc(100vh - 64px); }
    .gd-wrap { max-width: 880px; margin: 0 auto; padding: 48px 24px 96px; }

    .gd-bc { color: #64748b; font-size: 13px; margin-bottom: 18px; }
    .gd-bc a { color: #94a3b8; text-decoration: none; }
    .gd-bc a:hover { color: #60a5fa; }

    .gd-eyebrow { color: #60a5fa; font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 10px; }
    .gd-h1 { font-size: clamp(28px, 4vw, 40px); line-height: 1.15; font-weight: 700; color: #f1f5f9; margin: 0 0 6px; letter-spacing: -0.02em; }
    .gd-aka { color: #64748b; font-size: 14px; margin: 0 0 28px; }

    .gd-lede { color: #cbd5e1; font-size: 18px; line-height: 1.6; margin: 0 0 36px; padding: 20px 22px; background: rgba(96,165,250,0.06); border-left: 3px solid #60a5fa; border-radius: 4px; }

    .gd-h2 { font-size: 22px; font-weight: 700; color: #e1e5eb; margin: 40px 0 14px; letter-spacing: -0.01em; }
    .gd-p { color: #cbd5e1; font-size: 16px; line-height: 1.7; margin: 0 0 16px; }

    .gd-formula { background: #0f1f3a; border: 1px solid rgba(96,165,250,0.18); border-radius: 8px; padding: 18px 22px; margin: 14px 0 18px; font-family: 'JetBrains Mono', 'SF Mono', Consolas, monospace; font-size: 15px; color: #e2e8f0; line-height: 1.5; overflow-x: auto; }
    .gd-formula-exp { color: #94a3b8; font-size: 14px; line-height: 1.65; margin: 0 0 24px; }

    .gd-thresholds { margin: 18px 0 28px; overflow-x: auto; }
    .gd-thresh-table { width: 100%; border-collapse: collapse; background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.07); border-radius: 8px; overflow: hidden; }
    .gd-thresh-table th { background: rgba(255,255,255,0.04); color: #94a3b8; font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; padding: 12px 16px; text-align: left; border-bottom: 1px solid rgba(255,255,255,0.07); }
    .gd-thresh-table td { padding: 14px 16px; border-bottom: 1px solid rgba(255,255,255,0.05); font-size: 14px; color: #cbd5e1; vertical-align: top; }
    .gd-thresh-table tr:last-child td { border-bottom: 0; }
    .gd-thresh-range { font-family: 'JetBrains Mono', 'SF Mono', Consolas, monospace; font-weight: 600; color: #e1e5eb; white-space: nowrap; }
    .gd-thresh-label { font-weight: 600; }
    .gd-thresh-label.green  { color: #22c55e; }
    .gd-thresh-label.blue   { color: #60a5fa; }
    .gd-thresh-label.yellow { color: #fbbf24; }
    .gd-thresh-label.red    { color: #f87171; }

    .gd-example { background: rgba(255,255,255,0.025); border: 1px solid rgba(255,255,255,0.07); border-left: 3px solid #fbbf24; border-radius: 6px; padding: 18px 22px; margin: 14px 0 28px; color: #cbd5e1; line-height: 1.65; font-size: 15px; }
    .gd-example strong { color: #f1f5f9; }

    .gd-faqs { margin: 28px 0; }
    .gd-faq { padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,0.07); }
    .gd-faq:last-child { border-bottom: 0; }
    .gd-faq-q { color: #f1f5f9; font-weight: 600; font-size: 16px; margin: 0 0 8px; line-height: 1.4; }
    .gd-faq-a { color: #cbd5e1; font-size: 15px; line-height: 1.65; margin: 0; }

    .gd-related { margin-top: 40px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,0.08); }
    .gd-related-h { color: #94a3b8; font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; margin: 0 0 14px; }
    .gd-related-grid { display: flex; flex-wrap: wrap; gap: 10px; }
    .gd-related a { padding: 8px 14px; background: rgba(96,165,250,0.08); border: 1px solid rgba(96,165,250,0.18); border-radius: 6px; color: #cbd5e1; text-decoration: none; font-size: 13px; font-weight: 500; transition: background .15s, color .15s; }
    .gd-related a:hover { background: rgba(96,165,250,0.16); color: #f1f5f9; }

    .gd-sources { margin-top: 32px; color: #64748b; font-size: 12px; line-height: 1.7; }
    .gd-sources-h { color: #94a3b8; font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; margin: 0 0 8px; }
    .gd-sources ul { list-style: none; padding: 0; margin: 0; }
    .gd-sources li { padding: 4px 0; }

    .gd-meta-bar { margin-top: 36px; padding: 14px 18px; background: rgba(255,255,255,0.025); border: 1px solid rgba(255,255,255,0.06); border-radius: 8px; color: #94a3b8; font-size: 13px; display: flex; flex-wrap: wrap; gap: 18px; align-items: center; }
    .gd-meta-bar strong { color: #cbd5e1; font-weight: 600; }
    .gd-meta-bar a { color: #60a5fa; text-decoration: none; }
    .gd-meta-bar a:hover { text-decoration: underline; }

    .gd-cta { margin-top: 40px; padding: 24px; background: rgba(96,165,250,0.06); border: 1px solid rgba(96,165,250,0.20); border-radius: 10px; }
    .gd-cta h3 { color: #f1f5f9; font-size: 17px; margin: 0 0 6px; font-weight: 600; }
    .gd-cta p { color: #94a3b8; font-size: 14px; margin: 0 0 14px; }
    .gd-cta-row { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; }
    .gd-cta-primary { display: inline-block; padding: 10px 18px; background: #3b82f6; color: #fff; border-radius: 6px; text-decoration: none; font-weight: 600; font-size: 14px; transition: background .15s; }
    .gd-cta-primary:hover { background: #2563eb; }
    .gd-cta-secondary { display: inline-block; padding: 9px 14px; color: #60a5fa; text-decoration: none; font-weight: 500; font-size: 13.5px; border: 1px solid rgba(96,165,250,0.3); border-radius: 6px; transition: background .15s, color .15s; }
    .gd-cta-secondary:hover { background: rgba(96,165,250,0.1); color: #93c5fd; }


/* ============================================================================
   Lifted from templates/glossary/list.html inline <style> (2026-05-29)
   ============================================================================ */
    .gl-shell { background: #0a1628; color: #e1e5eb; min-height: calc(100vh - 64px); }
    .gl-wrap { max-width: 1100px; margin: 0 auto; padding: 56px 24px 96px; }
    .gl-eyebrow { color: #60a5fa; font-size: 13px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 12px; }
    .gl-h1 { font-size: clamp(32px, 4vw, 44px); line-height: 1.1; font-weight: 700; color: #f1f5f9; margin: 0 0 14px; letter-spacing: -0.02em; }
    .gl-lede { color: #94a3b8; font-size: 17px; line-height: 1.55; max-width: 760px; margin: 0 0 40px; }
    .gl-cat { margin-top: 44px; }
    .gl-cat-h2 { font-size: 22px; font-weight: 700; color: #e1e5eb; margin: 0 0 6px; }
    .gl-cat-sub { color: #64748b; font-size: 13px; margin: 0 0 18px; }
    .gl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
    .gl-card { display: block; padding: 18px 20px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.07); border-radius: 10px; text-decoration: none; transition: background .15s, border-color .15s, transform .15s; }
    .gl-card:hover { background: rgba(96,165,250,0.07); border-color: rgba(96,165,250,0.35); transform: translateY(-1px); }
    .gl-card-name { color: #f1f5f9; font-weight: 600; font-size: 15px; margin-bottom: 6px; line-height: 1.3; }
    .gl-card-short { color: #94a3b8; font-size: 13px; line-height: 1.45; }
    .gl-toc { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 36px; padding: 14px 18px; background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.05); border-radius: 8px; }
    .gl-toc a { color: #cbd5e1; text-decoration: none; font-size: 13px; font-weight: 500; padding: 4px 10px; border-radius: 6px; transition: background .15s, color .15s; }
    .gl-toc a:hover { background: rgba(96,165,250,0.12); color: #60a5fa; }
    .gl-foot { margin-top: 56px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,0.08); color: #64748b; font-size: 13px; line-height: 1.6; }
    .gl-foot a { color: #60a5fa; text-decoration: none; }
    .gl-foot a:hover { text-decoration: underline; }


/* ============================================================================
   Lifted from templates/legal/data_updates.html inline <style> (2026-05-29)
   ============================================================================ */
  .du-wrap { background: #0a1628; color: #e1e5eb; min-height: calc(100vh - 64px); }
  .du-inner { max-width: 760px; margin: 0 auto; padding: 80px 24px 96px; }
  .du-kicker { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: #3b82f6; margin-bottom: 14px; }
  .du-h1 { font-size: clamp(1.875rem, 3.4vw + 0.25rem, 2.5rem); font-weight: 600; letter-spacing: -0.025em; line-height: 1.1; color: #f8fafc; margin: 0 0 16px 0; }
  .du-lede { font-size: 16px; color: #94a3b8; line-height: 1.65; margin: 0 0 36px 0; }
  .du-card { background: linear-gradient(180deg, #0d1c30, rgba(13,28,48,0.5)); border: 1px solid #1e3a5f; border-radius: 12px; padding: 28px; margin: 0 0 24px 0; }
  .du-card h2 { font-size: 18px; font-weight: 600; color: #f8fafc; letter-spacing: -0.01em; margin: 0 0 12px 0; }
  .du-card p { font-size: 14.5px; color: #cbd5e1; line-height: 1.65; margin: 0 0 8px 0; }
  .du-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; margin: 18px 0 4px 0; }
  .du-stat { padding: 14px 16px; background: rgba(13,28,48,0.6); border: 1px solid #162a46; border-radius: 8px; }
  .du-stat .lbl { font-family: ui-monospace, monospace; font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: #64748b; margin-bottom: 6px; }
  .du-stat .val { font-size: 22px; font-weight: 600; color: #f8fafc; letter-spacing: -0.01em; }
  .du-list { list-style: none; padding: 0; margin: 16px 0 0 0; font-family: ui-monospace, monospace; font-size: 14px; color: #cbd5e1; }
  .du-list li { padding: 8px 0; border-bottom: 1px dashed #162a46; display: flex; justify-content: space-between; gap: 14px; }
  .du-list li:last-child { border-bottom: none; }
  .du-list .q { color: #94a3b8; }
  .du-list .src { color: #64748b; font-size: 12.5px; white-space: nowrap; }
  .du-note { font-size: 13px; color: #64748b; line-height: 1.65; margin: 24px 0 0 0; }
  .du-note a { color: #60a5fa; }

  /* Pipeline status banner */
  .du-status { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; padding: 16px 20px; border-radius: 10px; margin-bottom: 24px; font-size: 14px; line-height: 1.55; }
  .du-status .dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; box-shadow: 0 0 0 4px rgba(255,255,255,0.04); }
  .du-status .body { flex: 1; min-width: 220px; }
  .du-status .lead { font-weight: 600; color: #f8fafc; }
  .du-status .sub { color: #94a3b8; font-size: 13px; margin-top: 4px; }
  .du-status.tone-green  { background: rgba(34,197,94,0.08); border: 1px solid rgba(34,197,94,0.25); }
  .du-status.tone-green  .dot { background: #22c55e; box-shadow: 0 0 0 4px rgba(34,197,94,0.18); }
  .du-status.tone-yellow { background: rgba(251,191,36,0.07); border: 1px solid rgba(251,191,36,0.3); }
  .du-status.tone-yellow .dot { background: #fbbf24; box-shadow: 0 0 0 4px rgba(251,191,36,0.18); }
  .du-status.tone-red    { background: rgba(248,113,113,0.07); border: 1px solid rgba(248,113,113,0.3); }
  .du-status.tone-red    .dot { background: #f87171; box-shadow: 0 0 0 4px rgba(248,113,113,0.18); }
  .du-status.tone-gray   { background: rgba(148,163,184,0.06); border: 1px solid rgba(148,163,184,0.22); }
  .du-status.tone-gray   .dot { background: #94a3b8; box-shadow: 0 0 0 4px rgba(148,163,184,0.14); }

  .du-mon-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 14px; }
  @media (max-width: 540px) { .du-mon-grid { grid-template-columns: 1fr; } }
  .du-mon-cell { padding: 14px 16px; background: rgba(13,28,48,0.6); border: 1px solid #162a46; border-radius: 8px; }
  .du-mon-cell .lbl { font-family: ui-monospace, monospace; font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: #64748b; margin-bottom: 6px; }
  .du-mon-cell .val { font-size: 15px; font-weight: 600; color: #f8fafc; }
  .du-mon-cell .iso { font-family: ui-monospace, monospace; font-size: 11.5px; color: #64748b; margin-top: 4px; }


/* ============================================================================
   Lifted from templates/rankings/detail.html inline <style> (2026-05-29)
   ============================================================================ */
  .lb-shell { background: #0a1628; color: #e1e5eb; min-height: calc(100vh - 64px); }
  .lb-wrap { max-width: 1100px; margin: 0 auto; padding: 48px 24px 96px; }
  .lb-bc { color: #64748b; font-size: 13px; margin-bottom: 14px; }
  .lb-bc a { color: #94a3b8; text-decoration: none; }
  .lb-bc a:hover { color: #60a5fa; }
  .lb-eyebrow { color: #60a5fa; font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 10px; }
  .lb-h1 { font-size: clamp(28px, 4vw, 40px); line-height: 1.15; font-weight: 700; color: #f1f5f9; margin: 0 0 14px; letter-spacing: -0.02em; }

  .lb-snippet { color: #cbd5e1; font-size: 16px; line-height: 1.65; margin: 0 0 28px; padding: 18px 22px; background: rgba(96,165,250,0.06); border-left: 3px solid #60a5fa; border-radius: 4px; max-width: 800px; }
  .lb-snippet strong { color: #f1f5f9; font-weight: 600; }

  .lb-state-note { color: #94a3b8; font-size: 14px; line-height: 1.55; margin: -16px 0 24px; max-width: 720px; }
  .lb-state-subnav { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; padding: 12px 16px; background: rgba(255,255,255,0.015); border: 1px solid rgba(255,255,255,0.05); border-radius: 8px; color: #94a3b8; font-size: 13px; margin-bottom: 24px; }
  .lb-state-subnav-label { color: #cbd5e1; font-weight: 600; margin-right: 4px; }
  .lb-state-subnav a { color: #60a5fa; text-decoration: none; padding: 2px 8px; border-radius: 4px; transition: background .15s; }
  .lb-state-subnav a:hover { background: rgba(96,165,250,0.1); text-decoration: none; }
  .lb-state-subnav-more { color: #94a3b8!important; margin-left: auto; font-weight: 600; }

  .lb-meta-bar { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; padding: 14px 18px; background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.06); border-radius: 8px; color: #94a3b8; font-size: 13px; margin-bottom: 24px; }
  .lb-meta-bar strong { color: #cbd5e1; font-weight: 600; }
  .lb-meta-bar a { color: #60a5fa; text-decoration: none; }
  .lb-meta-bar a:hover { text-decoration: underline; }

  .lb-table-wrap { overflow-x: auto; border: 1px solid rgba(255,255,255,0.07); border-radius: 10px; background: rgba(13,28,48,0.4); margin-bottom: 32px; }
  .lb-table { width: 100%; border-collapse: collapse; }
  .lb-table th { background: rgba(255,255,255,0.04); padding: 12px 14px; text-align: left; color: #94a3b8; font-size: 10.5px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; border-bottom: 1px solid rgba(255,255,255,0.08); white-space: nowrap; }
  .lb-table td { padding: 12px 14px; font-size: 13.5px; color: #cbd5e1; border-bottom: 1px solid rgba(255,255,255,0.04); }
  .lb-table tr:last-child td { border-bottom: none; }
  .lb-table tr:hover td { background: rgba(96,165,250,0.04); }
  .lb-rank { font-family: ui-monospace, monospace; font-weight: 700; color: #60a5fa; text-align: right; width: 60px; }
  .lb-rank.podium { color: #fbbf24; }
  .lb-table .name a { color: #f1f5f9; text-decoration: none; font-weight: 600; }
  .lb-table .name a:hover { color: #60a5fa; }
  .lb-table .muted { color: #64748b; font-size: 12.5px; }
  .lb-table .num { font-family: ui-monospace, monospace; text-align: right; white-space: nowrap; color: #e1e5eb; font-weight: 600; }

  .lb-empty { padding: 60px 24px; text-align: center; color: #64748b; border: 1px dashed rgba(255,255,255,0.1); border-radius: 10px; }

  .lb-siblings { margin-top: 28px; padding: 18px 0; border-top: 1px solid rgba(255,255,255,0.07); }
  .lb-siblings h3 { color: #94a3b8; font-size: 11.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; margin: 0 0 12px; }
  .lb-siblings-row { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13.5px; }
  .lb-siblings-row a { color: #cbd5e1; text-decoration: none; padding: 2px 0; transition: color .12s; }
  .lb-siblings-row a:hover { color: #60a5fa; }

  .lb-foot { margin-top: 32px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.07); color: #64748b; font-size: 13px; line-height: 1.6; }
  .lb-foot a { color: #60a5fa; text-decoration: none; }
  .lb-foot a:hover { text-decoration: underline; }


/* ============================================================================
   Lifted from templates/for/detail.html inline <style> (2026-05-29)
   ============================================================================ */
    .pf-cards { display: grid; grid-template-columns: 1fr; gap: 20px; margin-top: 28px; }
    @media (min-width: 768px) { .pf-cards { grid-template-columns: repeat(3, 1fr); } }
    .pf-card {
        background: rgba(59,130,246,0.04);
        border: 1px solid #1e3a5f;
        border-radius: 14px;
        padding: 24px;
        display: flex; flex-direction: column;
    }
    .pf-card h3 { font-size: 1.05rem; margin: 0 0 10px; color: #e1e5eb; }
    .pf-card p { font-size: 14px; color: #94a3b8; line-height: 1.6; margin: 0 0 16px; flex: 1; }
    .pf-card a { font-size: 13px; font-weight: 600; color: #60a5fa; text-decoration: none; }
    .pf-card a:hover { color: #93c5fd; }
    .pf-faq { margin-top: 20px; }
    .pf-faq-item { padding: 18px 0; border-bottom: 1px solid #162a46; }
    .pf-faq-item h3 { font-size: 1rem; color: #e1e5eb; margin: 0 0 8px; }
    .pf-faq-item p { font-size: 14px; color: #94a3b8; line-height: 1.65; margin: 0; }
    .pf-related { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
    .pf-related a {
        font-size: 13px; color: #cbd5e1; text-decoration: none;
        padding: 8px 14px; border: 1px solid #1e3a5f; border-radius: 999px;
        transition: border-color .18s ease, color .18s ease;
    }
    .pf-related a:hover { border-color: #3b82f6; color: #60a5fa; }
    .pf-cta-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }


/* ============================================================================
   Lifted from templates/rankings/list.html inline <style> (2026-05-29)
   ============================================================================ */
  .rk-shell { background: #0a1628; color: #e1e5eb; min-height: calc(100vh - 64px); }
  .rk-wrap { max-width: 1100px; margin: 0 auto; padding: 56px 24px 96px; }
  .rk-eyebrow { color: #60a5fa; font-size: 13px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 12px; }
  .rk-h1 { font-size: clamp(32px, 4vw, 44px); line-height: 1.1; font-weight: 700; color: #f1f5f9; margin: 0 0 14px; letter-spacing: -0.02em; }
  .rk-lede { color: #94a3b8; font-size: 17px; line-height: 1.55; max-width: 760px; margin: 0 0 40px; }
  .rk-toc { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 36px; padding: 14px 18px; background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.05); border-radius: 8px; }
  .rk-toc a { color: #cbd5e1; text-decoration: none; font-size: 13px; font-weight: 500; padding: 4px 10px; border-radius: 6px; transition: background .15s, color .15s; }
  .rk-toc a:hover { background: rgba(96,165,250,0.12); color: #60a5fa; }
  .rk-cat { margin-top: 44px; }
  .rk-cat-h2 { font-size: 22px; font-weight: 700; color: #e1e5eb; margin: 0 0 6px; }
  .rk-cat-sub { color: #64748b; font-size: 13px; margin: 0 0 18px; }
  .rk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
  .rk-card { display: block; padding: 18px 20px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.07); border-radius: 10px; text-decoration: none; transition: background .15s, border-color .15s, transform .15s; }
  .rk-card:hover { background: rgba(96,165,250,0.07); border-color: rgba(96,165,250,0.35); transform: translateY(-1px); }
  .rk-card-name { color: #f1f5f9; font-weight: 600; font-size: 15.5px; margin-bottom: 6px; line-height: 1.35; }
  .rk-card-desc { color: #94a3b8; font-size: 13px; line-height: 1.55; }

/* ============================================================================
   Lifted from templates/for/list.html inline <style> (2026-05-29)
   ============================================================================ */
    .pl-cards { display: grid; grid-template-columns: 1fr; gap: 18px; margin-top: 36px; }
    @media (min-width: 640px) { .pl-cards { grid-template-columns: repeat(2, 1fr); } }
    @media (min-width: 1024px) { .pl-cards { grid-template-columns: repeat(4, 1fr); } }
    .pl-card {
        display: block;
        background: rgba(59,130,246,0.04);
        border: 1px solid #1e3a5f;
        border-radius: 14px;
        padding: 22px;
        text-decoration: none;
        transition: border-color .18s ease, transform .18s ease;
    }
    .pl-card:hover { border-color: #3b82f6; transform: translateY(-2px); }
    .pl-card h2 { font-size: 1.05rem; color: #e1e5eb; margin: 0 0 8px; }
    .pl-card p { font-size: 13px; color: #94a3b8; line-height: 1.55; margin: 0; }

/* ============================================================================
   Lifted from templates/banks/state_index.html inline <style> (2026-05-29)
   ============================================================================ */
  .si-shell { background: #0a1628; color: #e1e5eb; min-height: calc(100vh - 64px); }
  .si-wrap { max-width: 1100px; margin: 0 auto; padding: 56px 24px 96px; }
  .si-bc { color: #64748b; font-size: 13px; margin-bottom: 14px; }
  .si-bc a { color: #94a3b8; text-decoration: none; }
  .si-bc a:hover { color: #60a5fa; }
  .si-eyebrow { color: #60a5fa; font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 10px; }
  .si-h1 { font-size: clamp(28px, 4vw, 40px); line-height: 1.15; font-weight: 700; color: #f1f5f9; margin: 0 0 14px; letter-spacing: -0.02em; }
  .si-lede { color: #94a3b8; font-size: 16px; line-height: 1.6; max-width: 720px; margin: 0 0 40px; }
  .si-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; }
  .si-card { display: block; padding: 12px 16px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.07); border-radius: 8px; text-decoration: none; color: #cbd5e1; font-weight: 500; transition: background .15s, border-color .15s, transform .12s; }
  .si-card:hover { background: rgba(96,165,250,0.08); border-color: rgba(96,165,250,0.3); color: #f1f5f9; transform: translateY(-1px); }
  .si-card .code { font-family: ui-monospace, monospace; font-size: 11px; color: #64748b; margin-right: 8px; }
  .si-about { max-width: 760px; margin: 56px 0 0; }
  .si-about h2 { font-size: 20px; font-weight: 600; color: #f1f5f9; margin: 0 0 14px; }
  .si-about p { color: #94a3b8; font-size: 15px; line-height: 1.7; margin: 0 0 14px; }

/* ============================================================================
   Lifted from templates/banks/tier_index.html inline <style> (2026-05-29)
   ============================================================================ */
  .ti-shell { background: #0a1628; color: #e1e5eb; min-height: calc(100vh - 64px); }
  .ti-wrap { max-width: 900px; margin: 0 auto; padding: 56px 24px 96px; }
  .ti-bc { color: #64748b; font-size: 13px; margin-bottom: 14px; }
  .ti-bc a { color: #94a3b8; text-decoration: none; }
  .ti-bc a:hover { color: #60a5fa; }
  .ti-eyebrow { color: #60a5fa; font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 10px; }
  .ti-h1 { font-size: clamp(28px, 4vw, 40px); line-height: 1.15; font-weight: 700; color: #f1f5f9; margin: 0 0 14px; letter-spacing: -0.02em; }
  .ti-lede { color: #94a3b8; font-size: 16px; line-height: 1.6; max-width: 720px; margin: 0 0 36px; }
  .ti-list { display: grid; gap: 14px; }
  .ti-card { display: block; padding: 22px 24px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.07); border-radius: 10px; text-decoration: none; transition: background .15s, border-color .15s, transform .12s; }
  .ti-card:hover { background: rgba(96,165,250,0.06); border-color: rgba(96,165,250,0.28); transform: translateY(-1px); }
  .ti-card h3 { margin: 0 0 6px; font-size: 18px; font-weight: 700; color: #f1f5f9; line-height: 1.3; }
  .ti-card p { margin: 0; color: #94a3b8; font-size: 13.5px; line-height: 1.55; }
  .ti-card .range { font-family: ui-monospace, monospace; font-size: 12px; color: #60a5fa; font-weight: 600; letter-spacing: 0.04em; margin-bottom: 4px; }

/* ============================================================================
   Lifted from templates/product/cecl.html inline <style> (2026-05-29)
   ============================================================================ */
    .cecl-cards { display: grid; grid-template-columns: 1fr; gap: 20px; margin-top: 28px; }
    @media (min-width: 768px) { .cecl-cards { grid-template-columns: repeat(3, 1fr); } }
    .cecl-card {
        background: rgba(59,130,246,0.04);
        border: 1px solid #1e3a5f;
        border-radius: 14px;
        padding: 24px;
    }
    .cecl-card h3 { font-size: 1.05rem; margin: 0 0 10px; color: #e1e5eb; }
    .cecl-card p { font-size: 14px; color: #94a3b8; line-height: 1.6; margin: 0; }
    .cecl-cta-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }

/* ── Branch Network (bank profile) — map + searchable list ───────────────── */
.bp-branches { padding: 0 0 40px; border-top: 1px solid #162a46; }
.bp-branches-inner { max-width: 1200px; margin: 0 auto; padding: 28px 24px 0; }
.bp-branches-h2 { font-size: 22px; font-weight: 700; color: #f1f5f9; margin: 0 0 6px; }
.bp-branches-lede { font-size: 14px; color: #94a3b8; line-height: 1.6; margin: 0 0 18px; max-width: 760px; }
.bp-branch-map {
    height: 420px; width: 100%; border: 1px solid #1e3a5f; border-radius: 10px;
    overflow: hidden; background: #0d1c30; margin-bottom: 18px;
}
/* Leaflet surfaces on the dark theme */
.bp-branch-map .leaflet-container { background: #0d1c30; font: inherit; }
.bp-branch-map .leaflet-popup-content-wrapper, .bp-branch-map .leaflet-popup-tip {
    background: #0d1c30; color: #e1e5eb; border: 1px solid #1e3a5f;
}
.bp-branch-map .leaflet-popup-content { font-size: 12.5px; line-height: 1.5; }
.bp-branch-map .leaflet-popup-content a { color: #60a5fa; }
.bp-branch-map .leaflet-bar a { background: #162a46; color: #e1e5eb; border-bottom-color: #1e3a5f; }
.bp-branch-map .leaflet-bar a:hover { background: #1e3a5f; }

.bp-branch-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 10px; }
.bp-branch-search, .bp-branch-state {
    background: #0d1c30; border: 1px solid #1e3a5f; border-radius: 6px;
    color: #e1e5eb; font-size: 13px; padding: 8px 10px; font-family: inherit;
}
.bp-branch-search { flex: 1 1 240px; min-width: 180px; }
.bp-branch-search:focus, .bp-branch-state:focus { outline: none; border-color: #3b82f6; }
.bp-branch-range { font-size: 12.5px; color: #64748b; margin-left: auto; font-family: 'JetBrains Mono', monospace; }

/* Phase-1 fix: was overflow:hidden which clips table on mobile without allowing scroll.
   Changed to overflow-x:auto so wide rows scroll inside the wrapper. */
.bp-branch-table-wrap { border: 1px solid #1e3a5f; border-radius: 10px; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
.bp-branch-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.bp-branch-table thead th {
    text-align: left; padding: 10px 14px; background: #162a46; color: #94a3b8;
    font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: .04em;
}
.bp-branch-table th.bp-branch-dep, .bp-branch-table td.bp-branch-dep { text-align: right; }
.bp-branch-table tbody td { padding: 9px 14px; color: #e1e5eb; border-top: 1px solid #162a46; }
.bp-branch-table tbody tr:hover td { background: rgba(59,130,246,0.04); }
.bp-branch-table td.bp-branch-dep { font-family: 'JetBrains Mono', monospace; color: #cbd5e1; }
.bp-branch-table td.bp-branch-zip { font-family: 'JetBrains Mono', monospace; color: #64748b; }
.bp-branch-empty { text-align: center; color: #64748b; padding: 22px 14px; }

.bp-branch-pager { display: flex; gap: 8px; justify-content: flex-end; margin-top: 12px; }
.bp-branch-pgbtn {
    background: #162a46; border: 1px solid #1e3a5f; border-radius: 6px; color: #e1e5eb;
    font-size: 12.5px; padding: 7px 14px; cursor: pointer; font-family: inherit;
}
.bp-branch-pgbtn:hover:not(:disabled) { background: #1e3a5f; }
.bp-branch-pgbtn:disabled { opacity: .4; cursor: default; }

@media (max-width: 640px) {
    .bp-branch-map { height: 300px; }
    .bp-branch-range { margin-left: 0; width: 100%; }
    .bp-branch-table td.bp-branch-zip, .bp-branch-table th.bp-branch-zip { display: none; }
}

/* ============================================================================
   EVENTS DOMAIN — /events/ public cluster (failures, mergers, enforcement,
   FDIC assistance + per-year + per-state + per-acquirer + per-failure detail).
   Naming convention `ev-*` parallels `si-*` (state index), `lb-*` (rankings),
   `gl-*` (glossary), `bp-*` (bank profile).
   ============================================================================ */
.ev-shell { background: #0a1628; color: #e1e5eb; min-height: calc(100vh - 64px); }
.ev-wrap { max-width: 1200px; margin: 0 auto; padding: 56px 24px 96px; }
.ev-wrap.ev-detail { max-width: 920px; }
.ev-bc { color: #64748b; font-size: 13px; margin-bottom: 14px; }
.ev-bc a { color: #94a3b8; text-decoration: none; }
.ev-bc a:hover { color: #60a5fa; }
.ev-eyebrow { color: #60a5fa; font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 10px; }
.ev-h1 { font-size: clamp(28px, 4vw, 40px); line-height: 1.15; font-weight: 700; color: #f1f5f9; margin: 0 0 14px; letter-spacing: -0.02em; }
.ev-h2 { font-size: 22px; font-weight: 600; color: #f1f5f9; margin: 36px 0 12px; line-height: 1.25; }
.ev-h2 .muted { color: #64748b; font-weight: 400; font-size: 14px; margin-left: 6px; }
.ev-lede { color: #94a3b8; font-size: 16px; line-height: 1.65; max-width: 820px; margin: 0 0 32px; }
.ev-cat-sub { color: #64748b; font-size: 13.5px; margin: 4px 0 16px; line-height: 1.55; }
.ev-cat-sub code { background: rgba(255,255,255,0.05); padding: 1px 6px; border-radius: 3px; font-family: ui-monospace, monospace; font-size: 12px; color: #cbd5e1; }

/* KPI tiles — same pattern as the failures dashboard, simplified for public */
.ev-kpi-row {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px; margin: 0 0 36px;
}
.ev-kpi {
  display: block; padding: 18px 20px; background: rgba(59,130,246,0.04);
  border: 1px solid #1e3a5f; border-radius: 10px; text-decoration: none; color: inherit;
  transition: background .15s, border-color .15s, transform .12s;
}
a.ev-kpi:hover { background: rgba(96,165,250,0.08); border-color: rgba(96,165,250,0.32); transform: translateY(-1px); }
.ev-kpi-num { font-size: 28px; font-weight: 700; color: #f1f5f9; letter-spacing: -0.01em; line-height: 1.1; }
.ev-kpi-label { font-size: 13px; font-weight: 600; color: #cbd5e1; margin-top: 6px; letter-spacing: 0.02em; }
.ev-kpi-sub { font-size: 11.5px; color: #64748b; margin-top: 4px; line-height: 1.4; }

/* Meta bar (used on category pages) */
.ev-meta-bar {
  display: flex; flex-wrap: wrap; gap: 18px; padding: 14px 18px;
  background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px; margin: 0 0 28px; font-size: 13px; color: #94a3b8;
}
.ev-meta-bar strong { color: #cbd5e1; font-weight: 600; }
.ev-meta-bar code { font-family: ui-monospace, monospace; font-size: 12px; color: #60a5fa; }

/* Card grid (used on the hub) */
.ev-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px; margin: 12px 0 36px;
}
.ev-card {
  display: block; padding: 18px 20px; background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07); border-radius: 10px;
  text-decoration: none; color: inherit;
  transition: background .15s, border-color .15s, transform .12s;
}
.ev-card:hover { background: rgba(96,165,250,0.08); border-color: rgba(96,165,250,0.3); transform: translateY(-1px); }
.ev-card-name { font-size: 16px; font-weight: 600; color: #f1f5f9; margin-bottom: 6px; }
.ev-card-short { font-size: 13px; color: #94a3b8; line-height: 1.55; }

/* Tables */
.ev-table-section { margin-top: 36px; }
.ev-table-wrap { overflow-x: auto; border: 1px solid rgba(255,255,255,0.06); border-radius: 8px; background: rgba(255,255,255,0.015); }
.ev-table {
  width: 100%; border-collapse: collapse; font-size: 13.5px;
  font-variant-numeric: tabular-nums;
}
.ev-table thead { background: rgba(255,255,255,0.03); }
.ev-table th {
  text-align: left; padding: 10px 14px; font-size: 12px; font-weight: 600;
  color: #94a3b8; text-transform: uppercase; letter-spacing: 0.04em;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.ev-table th.num { text-align: right; }
.ev-table td {
  padding: 9px 14px; border-bottom: 1px solid rgba(255,255,255,0.04);
  color: #cbd5e1; vertical-align: top;
}
.ev-table tbody tr:hover { background: rgba(255,255,255,0.02); }
.ev-table tbody tr:last-child td { border-bottom: none; }
.ev-table td.num { text-align: right; font-family: ui-monospace, monospace; font-size: 13px; }
.ev-table td.name { color: #e1e5eb; font-weight: 500; }
.ev-table td.name a { color: #93c5fd; text-decoration: none; }
.ev-table td.name a:hover { color: #60a5fa; text-decoration: underline; }
.ev-table td.muted { color: #64748b; font-size: 12.5px; }
.ev-table .ev-empty { text-align: center; color: #64748b; padding: 24px 12px; font-style: italic; }

/* Agency pills */
.ev-agency-pill {
  display: inline-block; padding: 2px 8px; border-radius: 4px;
  font-family: ui-monospace, monospace; font-size: 10.5px; font-weight: 600;
  letter-spacing: 0.06em; line-height: 1.4;
  background: rgba(148,163,184,0.12); color: #94a3b8;
  border: 1px solid rgba(148,163,184,0.2);
}
.ev-agency-pill.ag-occ      { background: rgba(59,130,246,0.12); color: #93c5fd; border-color: rgba(59,130,246,0.28); }
.ev-agency-pill.ag-occ_ots  { background: rgba(99,102,241,0.12); color: #a5b4fc; border-color: rgba(99,102,241,0.28); }
.ev-agency-pill.ag-fdic     { background: rgba(34,197,94,0.12); color: #86efac; border-color: rgba(34,197,94,0.28); }
.ev-agency-pill.ag-frb      { background: rgba(245,158,11,0.12); color: #fcd34d; border-color: rgba(245,158,11,0.28); }
.ev-agency-pill.ag-ncua     { background: rgba(168,85,247,0.12); color: #c4b5fd; border-color: rgba(168,85,247,0.28); }
.ev-agency-pill.ag-sec_8k   { background: rgba(236,72,153,0.12); color: #f9a8d4; border-color: rgba(236,72,153,0.28); }

/* Source-tier pill — distinguishes Pugachev (academic) enforcement rows */
.ev-src-pill {
  display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 3px;
  font-size: 10px; font-weight: 600; letter-spacing: 0.04em;
  background: rgba(148,163,184,0.08); color: #94a3b8;
  border: 1px solid rgba(148,163,184,0.16);
}

/* Detail page */
.ev-detail-card {
  margin: 24px 0 28px; padding: 22px 26px;
  background: rgba(255,255,255,0.025); border: 1px solid rgba(255,255,255,0.07);
  border-radius: 10px;
}
.ev-dl {
  display: grid; grid-template-columns: minmax(180px, max-content) 1fr;
  gap: 10px 28px; margin: 0;
}
.ev-dl dt {
  color: #64748b; font-size: 12.5px; text-transform: uppercase;
  letter-spacing: 0.04em; font-weight: 600; line-height: 1.5;
}
.ev-dl dd { margin: 0; color: #e1e5eb; font-size: 14.5px; line-height: 1.55; }
.ev-dl dd a { color: #93c5fd; text-decoration: none; }
.ev-dl dd a:hover { color: #60a5fa; text-decoration: underline; }
@media (max-width: 600px) { .ev-dl { grid-template-columns: 1fr; gap: 4px 0; } .ev-dl dd { margin-bottom: 10px; } }

.ev-context { margin: 28px 0; }
.ev-context p { color: #cbd5e1; font-size: 15px; line-height: 1.7; margin: 0 0 12px; }
.ev-context p strong { color: #f1f5f9; }

/* Foot links */
.ev-foot { margin-top: 56px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.06); }
.ev-foot p { color: #94a3b8; font-size: 13.5px; line-height: 1.65; margin: 0 0 10px; }
.ev-foot p a { color: #93c5fd; text-decoration: none; }
.ev-foot p a:hover { color: #60a5fa; text-decoration: underline; }
.ev-foot-link { color: #94a3b8; font-size: 13.5px; margin: 12px 0 0; }
.ev-foot-link a { color: #93c5fd; text-decoration: none; font-weight: 600; }
.ev-foot-link a:hover { color: #60a5fa; }
.ev-foot-link.muted { color: #64748b; font-style: italic; }

/* Recent-activity sections on the hub */
.ev-recent { margin-top: 40px; }
.ev-timeline-section { margin-top: 40px; }
.ev-cats { margin: 12px 0; }

/* ── Per-bank Event Timeline (bank profile section) ── */
.bp-events { padding: 0 0 40px; border-top: 1px solid #162a46; }
.bp-events-inner { max-width: 1200px; margin: 0 auto; padding: 28px 24px 0; }
.bp-events-h2 { font-size: 22px; font-weight: 700; color: #f1f5f9; margin: 0 0 6px; }
.bp-events-sub { color: #94a3b8; font-size: 13.5px; margin: 0 0 18px; }
/* Vertical timeline — a continuous rail with a category-coloured dot per event. */
.bp-timeline { list-style: none; margin: 0; padding: 0; position: relative; }
.bp-timeline::before {
  content: ""; position: absolute; left: 5px; top: 6px; bottom: 8px;
  width: 2px; background: #1e3a5f;
}
.bp-tl-item { position: relative; padding: 0 0 16px 26px; }
.bp-tl-item:last-child { padding-bottom: 0; }
.bp-tl-marker {
  position: absolute; left: 0; top: 3px;
  width: 12px; height: 12px; border-radius: 50%;
  background: #64748b; border: 2px solid #0a1424; box-shadow: 0 0 0 1px #1e3a5f;
}
.bp-tl-item.cat-failure .bp-tl-marker     { background: #ef4444; box-shadow: 0 0 0 1px rgba(239,68,68,0.4), 0 0 9px rgba(239,68,68,0.55); }
.bp-tl-item.cat-merger .bp-tl-marker      { background: #3b82f6; }
.bp-tl-item.cat-m_and_a .bp-tl-marker     { background: #6366f1; }
.bp-tl-item.cat-enforcement .bp-tl-marker { background: #f59e0b; }
.bp-tl-item.cat-assistance .bp-tl-marker  { background: #22c55e; }
.bp-event-cat-pill {
  display: inline-block; padding: 2px 10px; border-radius: 4px;
  font-size: 11px; font-weight: 600; letter-spacing: 0.04em;
  text-transform: uppercase; line-height: 1.5; text-align: center;
}
.bp-event-cat-pill.cat-failure    { background: rgba(239,68,68,0.14); color: #fca5a5; border: 1px solid rgba(239,68,68,0.3); }
.bp-event-cat-pill.cat-merger     { background: rgba(59,130,246,0.14); color: #93c5fd; border: 1px solid rgba(59,130,246,0.3); }
.bp-event-cat-pill.cat-m_and_a    { background: rgba(99,102,241,0.14); color: #a5b4fc; border: 1px solid rgba(99,102,241,0.3); }
.bp-event-cat-pill.cat-enforcement{ background: rgba(245,158,11,0.14); color: #fcd34d; border: 1px solid rgba(245,158,11,0.3); }
.bp-event-cat-pill.cat-assistance { background: rgba(34,197,94,0.14); color: #86efac; border: 1px solid rgba(34,197,94,0.3); }
.bp-event-cat-pill.cat-structure_change { background: rgba(148,163,184,0.12); color: #cbd5e1; border: 1px solid rgba(148,163,184,0.24); }
.bp-tl-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 4px; }
.bp-tl-date { color: #94a3b8; font-family: ui-monospace, monospace; font-size: 12.5px; }
.bp-tl-date a { color: inherit; text-decoration: none; border-bottom: 1px dashed rgba(148,163,184,0.4); }
.bp-tl-date a:hover { color: #cbd5e1; border-bottom-color: #cbd5e1; }
.bp-tl-label { color: #e1e5eb; font-size: 14px; line-height: 1.45; }
.bp-tl-src {
  display: inline-block; margin-top: 6px;
  font-size: 10px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase;
  color: #64748b; background: rgba(148,163,184,0.07);
  border: 1px solid #1e3a5f; border-radius: 4px; padding: 1px 7px;
}
.bp-events-foot { color: #64748b; font-size: 12.5px; margin-top: 16px; font-style: italic; }


/* ============================================================================
   BANK SAFETY — /banks/<rssd>/<slug>/safety/ subpages.
   Pass / Watch / Fail scorecard + per-dimension card grid + sparkline frame.
   Class prefix `bs-*`; sits inside the existing ev-shell / ev-wrap chrome.
   ============================================================================ */

/* Overall verdict banner */
.bs-overall {
  display: flex; flex-direction: column; gap: 6px;
  padding: 18px 22px; border-radius: 10px;
  margin: 4px 0 28px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.025);
}
.bs-overall-label {
  color: #64748b; font-size: 11.5px; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase;
}
.bs-overall-value { color: #f1f5f9; font-size: 18px; font-weight: 600; line-height: 1.35; }
.bs-verdict-pass    { border-color: rgba(34,197,94,0.35);  background: rgba(34,197,94,0.06); }
.bs-verdict-pass .bs-overall-value    { color: #86efac; }
.bs-verdict-watch   { border-color: rgba(245,158,11,0.35); background: rgba(245,158,11,0.06); }
.bs-verdict-watch .bs-overall-value   { color: #fcd34d; }
.bs-verdict-fail    { border-color: rgba(239,68,68,0.35);  background: rgba(239,68,68,0.06); }
.bs-verdict-fail .bs-overall-value    { color: #fca5a5; }
.bs-verdict-unknown { border-color: rgba(148,163,184,0.3); background: rgba(148,163,184,0.05); }
.bs-verdict-unknown .bs-overall-value { color: #cbd5e1; }

/* Scorecard dimension cards */
.bs-scorecard { margin-top: 28px; }
.bs-dim {
  padding: 16px 20px; margin: 0 0 12px;
  background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px; border-left-width: 4px;
}
.bs-dim-pass    { border-left-color: #22c55e; }
.bs-dim-watch   { border-left-color: #f59e0b; }
.bs-dim-fail    { border-left-color: #ef4444; }
.bs-dim-unknown { border-left-color: #475569; }

.bs-dim-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; margin-bottom: 8px;
}
.bs-dim-label { color: #f1f5f9; font-size: 16px; font-weight: 600; }
.bs-dim-pill {
  display: inline-block; padding: 3px 10px; border-radius: 4px;
  font-family: ui-monospace, monospace; font-size: 11px; font-weight: 700;
  letter-spacing: 0.08em; line-height: 1.4;
}
.bs-pill-pass    { background: rgba(34,197,94,0.16);  color: #86efac; border: 1px solid rgba(34,197,94,0.34); }
.bs-pill-watch   { background: rgba(245,158,11,0.16); color: #fcd34d; border: 1px solid rgba(245,158,11,0.34); }
.bs-pill-fail    { background: rgba(239,68,68,0.16);  color: #fca5a5; border: 1px solid rgba(239,68,68,0.34); }
.bs-pill-unknown { background: rgba(148,163,184,0.12); color: #94a3b8; border: 1px solid rgba(148,163,184,0.28); }

.bs-dim-metric { color: #cbd5e1; font-size: 14.5px; margin: 4px 0 6px; }
.bs-dim-metric strong { color: #f1f5f9; font-weight: 600; }
.bs-dim-metric .muted { color: #64748b; font-style: italic; }
.bs-dim-thresholds {
  color: #64748b; font-size: 12px; line-height: 1.6;
  font-family: ui-monospace, monospace;
  margin: 4px 0 8px;
}
.bs-thr-pass { color: #86efac; }
.bs-thr-fail { color: #fca5a5; }
.bs-dim-interp {
  margin: 6px 0 0; color: #cbd5e1; font-size: 13.5px; line-height: 1.6;
}

/* Trend sparkline frame + companion table */
.bs-trend { margin-top: 32px; }
.bs-spark-wrap {
  background: rgba(255,255,255,0.015); border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px; padding: 14px; overflow-x: auto;
}
.bs-spark { display: block; max-width: 100%; height: auto; }
.bs-spark-table {
  width: 100%; margin-top: 12px; border-collapse: collapse;
  font-size: 13px; font-variant-numeric: tabular-nums;
}
.bs-spark-table th {
  text-align: left; padding: 6px 10px; font-size: 11px; font-weight: 600;
  color: #94a3b8; text-transform: uppercase; letter-spacing: 0.04em;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.bs-spark-table th.num, .bs-spark-table td.num { text-align: right; font-family: ui-monospace, monospace; }
.bs-spark-table td {
  padding: 6px 10px; color: #cbd5e1;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.bs-spark-table tbody tr:last-child td { border-bottom: none; }

/* Methodology / disclaimer block — slightly de-emphasized */
.bs-disclaimer p { color: #94a3b8; font-size: 13.5px; line-height: 1.65; }
.bs-disclaimer p strong { color: #cbd5e1; }

/* ----------------------------------------------------------------------------
   S7 ADDITIONS: ML badge, peer/industry deltas, similar-bank rail, CTA.
   ---------------------------------------------------------------------------- */

/* ML failure-probability badge bar */
.bs-ml {
  margin: 0 0 28px;
  padding: 18px 22px;
  background: linear-gradient(180deg, rgba(96,165,250,0.08) 0%, rgba(96,165,250,0.03) 100%);
  border: 1px solid rgba(96,165,250,0.22);
  border-radius: 10px;
}
.bs-ml-row {
  display: grid; gap: 18px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 640px) {
  .bs-ml-row { grid-template-columns: 1fr; }
}
.bs-ml-cell { display: flex; flex-direction: column; gap: 6px; }
.bs-ml-lbl {
  color: #64748b; font-size: 11px; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase;
}
.bs-ml-val {
  color: #f1f5f9; font-size: 24px; font-weight: 600; line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.bs-ml-val .muted { color: #64748b; font-style: italic; font-size: 16px; font-weight: 400; }
.bs-ml-unit { color: #94a3b8; font-size: 14px; font-weight: 500; margin-left: 2px; }
.bs-ml-pill {
  display: inline-block; padding: 4px 12px; border-radius: 4px;
  font-family: ui-monospace, monospace; font-size: 13px; font-weight: 700;
  letter-spacing: 0.08em; line-height: 1.4;
}
.ml-pill-pass    { background: rgba(34,197,94,0.16);  color: #86efac; border: 1px solid rgba(34,197,94,0.34); }
.ml-pill-watch   { background: rgba(245,158,11,0.16); color: #fcd34d; border: 1px solid rgba(245,158,11,0.34); }
.ml-pill-fail    { background: rgba(239,68,68,0.16);  color: #fca5a5; border: 1px solid rgba(239,68,68,0.34); }
.ml-pill-unknown { background: rgba(148,163,184,0.12); color: #94a3b8; border: 1px solid rgba(148,163,184,0.28); }
.bs-ml-note {
  margin: 14px 0 0; color: #94a3b8; font-size: 13px; line-height: 1.65;
}
.bs-ml-note strong { color: #cbd5e1; }

/* Per-dimension peer/industry delta strip + downgrade-distance */
.bs-tier-note {
  margin: -6px 0 14px; color: #94a3b8; font-size: 13px; line-height: 1.6;
}
.bs-tier-note strong { color: #cbd5e1; font-weight: 600; }
.bs-dim-dist {
  color: #94a3b8; font-size: 12.5px;
  font-family: ui-monospace, monospace;
}
.bs-dim-peers {
  display: flex; flex-wrap: wrap; gap: 18px;
  margin: 6px 0 8px;
  font-family: ui-monospace, monospace;
  font-size: 12.5px;
}
.bs-dim-peer { color: #94a3b8; }
.bs-dim-peer-lbl { color: #64748b; margin-right: 4px; }
.bs-dim-peer-val { color: #cbd5e1; font-weight: 500; }

/* Similar-risk-profile rail */
.bs-similar { margin: 36px 0 28px; }
.bs-similar-sub {
  margin: 4px 0 16px; color: #94a3b8; font-size: 13.5px; line-height: 1.6;
}
.bs-similar-grid {
  display: grid; gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.bs-similar-card {
  display: flex; flex-direction: column; gap: 6px;
  padding: 14px 16px; border-radius: 8px;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.08);
  text-decoration: none;
  transition: background 120ms ease, border-color 120ms ease;
}
.bs-similar-card:hover {
  background: rgba(96,165,250,0.06);
  border-color: rgba(96,165,250,0.32);
}
.bs-similar-name {
  color: #f1f5f9; font-size: 14.5px; font-weight: 600; line-height: 1.35;
}
.bs-similar-meta {
  display: flex; flex-wrap: wrap; gap: 10px;
  color: #94a3b8; font-size: 12px;
  font-family: ui-monospace, monospace;
}
.bs-similar-meta > span { white-space: nowrap; }

/* High-intent conversion CTA */
.bs-cta {
  margin: 36px 0 28px;
  padding: 24px 26px; border-radius: 12px;
  background: linear-gradient(180deg, rgba(34,197,94,0.10) 0%, rgba(34,197,94,0.02) 100%);
  border: 1px solid rgba(34,197,94,0.32);
}
.bs-cta-eyebrow {
  margin: 0 0 6px;
  color: #86efac; font-size: 11px; font-weight: 700;
  letter-spacing: 0.10em; text-transform: uppercase;
}
.bs-cta-h {
  margin: 0 0 8px; color: #f1f5f9; font-size: 20px; font-weight: 600; line-height: 1.3;
}
.bs-cta-sub {
  margin: 0 0 16px; color: #cbd5e1; font-size: 14px; line-height: 1.6;
}
.bs-cta-btn {
  display: inline-block; padding: 10px 22px; border-radius: 6px;
  background: #22c55e; color: #052e16; font-size: 14px; font-weight: 600;
  text-decoration: none;
  transition: background 120ms ease;
}
.bs-cta-btn:hover { background: #4ade80; }

/* ============================================================================
   HOMEPAGE EXPLORE MODULE — internal-linking hub at the bottom of /
   Channels homepage PageRank into pillar pages + rankings + glossary +
   state hubs + curated bank profiles + alternatives. Single most-leverage
   move for getting long-tail pages out of "Crawled - not indexed".
   Class prefix `explr-`.
   ============================================================================ */
.explr-section {
  background:
    radial-gradient(1100px 520px at 18% -10%, rgba(59,130,246,0.10), transparent 60%),
    radial-gradient(900px 480px at 90% 110%, rgba(56,189,248,0.06), transparent 55%),
    linear-gradient(180deg, #0a1628 0%, #08111f 100%);
  border-top: 1px solid rgba(255,255,255,0.06);
  padding: 72px 0 88px;
}
.explr-wrap { max-width: 1240px; margin: 0 auto; padding: 0 28px; }
.explr-eyebrow {
  color: #60a5fa; font-size: 11.5px; font-weight: 700;
  letter-spacing: 0.16em; text-transform: uppercase;
  margin: 0 0 12px;
}
.explr-h2 {
  font-size: clamp(26px, 3.4vw, 34px); line-height: 1.18;
  font-weight: 700; color: #f1f5f9; margin: 0 0 14px;
  letter-spacing: -0.018em;
}
.explr-lede { color: #94a3b8; font-size: 15.5px; line-height: 1.65; max-width: 780px; margin: 0 0 44px; }

/* ----- Row 1: 4 sentence-link columns ----- */
.explr-grid {
  display: grid; gap: 22px 28px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  margin-bottom: 48px;
}
.explr-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1080px) { .explr-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px)  { .explr-grid--4 { grid-template-columns: 1fr; } }

.explr-col {
  padding: 22px 22px 20px;
  background: rgba(15,23,42,0.55);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 14px;
  backdrop-filter: blur(4px);
  transition: border-color .18s, transform .18s, background .18s;
}
.explr-col:hover { border-color: rgba(96,165,250,0.28); transform: translateY(-2px); background: rgba(15,23,42,0.72); }

.explr-col-h {
  display: flex; align-items: center; gap: 9px;
  font-size: 13px; font-weight: 700; color: #f1f5f9;
  text-transform: uppercase; letter-spacing: 0.07em;
  margin: 0 0 14px; padding-bottom: 10px;
  border-bottom: 1px solid rgba(96,165,250,0.18);
}
.explr-col-dot {
  width: 7px; height: 7px; border-radius: 2px;
  background: linear-gradient(135deg, #60a5fa, #38bdf8);
  flex-shrink: 0;
  box-shadow: 0 0 0 3px rgba(96,165,250,0.10);
}

.explr-list { list-style: none; padding: 0; margin: 0; }
.explr-list li { margin: 0 0 9px; line-height: 1.5; }
.explr-list li:last-child { margin-bottom: 0; }
.explr-list a {
  display: inline-block;
  color: #cbd5e1; text-decoration: none; font-size: 13.5px;
  border-bottom: 1px dashed transparent;
  transition: color .15s, border-color .15s, transform .12s;
}
.explr-list a:hover { color: #93c5fd; border-bottom-color: rgba(147,197,253,0.45); transform: translateX(2px); }

/* ----- Shared section header for the rows below the 4-col grid ----- */
.explr-defs-head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 14px; flex-wrap: wrap;
  margin: 0 0 18px;
  padding: 0 4px 10px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.explr-section-h {
  font-size: 16px; font-weight: 700; color: #f1f5f9;
  margin: 0; letter-spacing: -0.01em;
}
.explr-defs-all {
  color: #93c5fd; text-decoration: none; font-size: 13px; font-weight: 600;
  white-space: nowrap;
  transition: color .15s;
}
.explr-defs-all:hover { color: #60a5fa; text-decoration: underline; }

/* ----- Row 2: Metric definitions chip groups ----- */
.explr-defs {
  margin: 0 0 44px;
  padding: 26px 26px 24px;
  background: rgba(15,23,42,0.55);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 16px;
}
.explr-defs-grid {
  display: grid; gap: 22px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 960px) { .explr-defs-grid { grid-template-columns: 1fr; } }

.explr-defs-group { min-width: 0; }
.explr-defs-tag {
  display: inline-block;
  margin: 0 0 11px;
  font-size: 10.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.1em;
  color: #94a3b8;
  padding: 3px 9px;
  background: rgba(96,165,250,0.07);
  border: 1px solid rgba(96,165,250,0.18);
  border-radius: 999px;
}

.explr-chips { display: flex; flex-wrap: wrap; gap: 6px 7px; }
.explr-chips a {
  display: inline-block;
  padding: 6px 11px;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 7px;
  color: #cbd5e1;
  text-decoration: none;
  font-size: 13px; font-weight: 500;
  line-height: 1.25;
  transition: background .15s, border-color .15s, color .15s, transform .12s;
}
.explr-chips a:hover {
  background: rgba(96,165,250,0.10);
  border-color: rgba(96,165,250,0.38);
  color: #f1f5f9;
  transform: translateY(-1px);
}

/* ----- Row 3: Bank profile cards (with asset-tier subtitle) ----- */
.explr-banks {
  margin: 0 0 36px;
  padding: 26px 26px 24px;
  background: rgba(15,23,42,0.55);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 16px;
}
.explr-banks-grid {
  display: grid; gap: 10px;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
}
.explr-bank-card {
  display: flex; flex-direction: column; gap: 3px;
  padding: 13px 15px;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 9px;
  text-decoration: none;
  transition: background .15s, border-color .15s, transform .12s, box-shadow .18s;
}
.explr-bank-card:hover {
  background: rgba(96,165,250,0.08);
  border-color: rgba(96,165,250,0.38);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px -12px rgba(59,130,246,0.45);
}
.explr-bank-name { font-size: 14px; font-weight: 600; color: #f1f5f9; }
.explr-bank-meta { font-size: 11px; color: #94a3b8; letter-spacing: 0.02em; }

/* ----- Row 4: Compare pairs ----- */
.explr-pillars {
  padding: 26px 26px 24px;
  background: rgba(15,23,42,0.55);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 16px;
}
.explr-vs-grid {
  display: grid; gap: 10px;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}
.explr-vs {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 9px;
  text-decoration: none; color: #cbd5e1;
  font-size: 13.5px; font-weight: 500;
  transition: background .15s, border-color .15s, transform .12s;
}
.explr-vs > span:first-child,
.explr-vs > span:last-child { flex: 1; min-width: 0; color: #f1f5f9; }
.explr-vs > span:last-child { text-align: right; }
.explr-vs-sep {
  flex: 0 0 auto;
  font-size: 9.5px; font-weight: 700;
  color: #60a5fa;
  text-transform: uppercase; letter-spacing: 0.14em;
  padding: 2px 7px;
  background: rgba(96,165,250,0.12);
  border-radius: 4px;
}
.explr-vs:hover {
  background: rgba(96,165,250,0.08);
  border-color: rgba(96,165,250,0.38);
  transform: translateY(-1px);
}

/* ----- Legacy inline-list shim (kept for any consumers still rendering it) ----- */
.explr-list-inline { display: flex; flex-wrap: wrap; gap: 14px 20px; }
.explr-list-inline li { margin: 0; }
.explr-banks-h {
  font-size: 16px; font-weight: 700; color: #f1f5f9;
  margin: 0 0 16px; letter-spacing: -0.005em;
}
.explr-banks-foot { color: #94a3b8; font-size: 13.5px; margin: 12px 0 0; }
.explr-banks-foot a { color: #93c5fd; text-decoration: none; font-weight: 600; }
.explr-banks-foot a:hover { color: #60a5fa; text-decoration: underline; }


/* ============================================================================
   SCREENER — /screener/<slug>/ risk-screener pages.
   Card grid on the index; ranked table with Pass/Watch/Stress band pills on
   the detail. Class prefix `scr-*`. Shares ev-shell / ev-wrap chrome.
   ============================================================================ */
.scr-cards {
  display: grid; gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  margin: 12px 0 36px;
}
.scr-card {
  display: block; padding: 18px 22px;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.07); border-radius: 10px;
  text-decoration: none; color: inherit;
  transition: background .15s, border-color .15s, transform .12s;
}
.scr-card:hover {
  background: rgba(96,165,250,0.08);
  border-color: rgba(96,165,250,0.3);
  transform: translateY(-1px);
}
.scr-card-eyebrow {
  color: #60a5fa; font-size: 11px; font-weight: 600;
  letter-spacing: 0.10em; text-transform: uppercase; margin-bottom: 8px;
}
.scr-card-title { color: #f1f5f9; font-size: 16px; font-weight: 600; line-height: 1.4; }
.scr-card-meta { color: #94a3b8; font-size: 12.5px; margin-top: 8px; }

/* Headline band counts above the ranked table */
.scr-counts {
  display: grid; gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  margin: 8px 0 28px;
}
.scr-count {
  display: flex; flex-direction: column; gap: 4px;
  padding: 14px 18px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.07);
  background: rgba(255,255,255,0.025);
}
.scr-count .n { font-size: 24px; font-weight: 700; color: #f1f5f9; line-height: 1.1; }
.scr-count .l { font-size: 12px; color: #94a3b8; letter-spacing: 0.04em; text-transform: uppercase; }
.scr-count-stress { border-color: rgba(239,68,68,0.35); background: rgba(239,68,68,0.06); }
.scr-count-stress .n { color: #fca5a5; }
.scr-count-watch { border-color: rgba(245,158,11,0.35); background: rgba(245,158,11,0.06); }
.scr-count-watch .n { color: #fcd34d; }
.scr-count-pass { border-color: rgba(34,197,94,0.35); background: rgba(34,197,94,0.06); }
.scr-count-pass .n { color: #86efac; }
.scr-count-total { border-color: rgba(96,165,250,0.35); background: rgba(96,165,250,0.06); }
.scr-count-total .n { color: #93c5fd; }

/* Ranked-table row hint (subtle left-border accent by band) */
.scr-table tbody tr td:first-child { border-left: 3px solid transparent; }
.scr-row-stress td:first-child { border-left-color: #ef4444; }
.scr-row-watch  td:first-child { border-left-color: #f59e0b; }
.scr-row-pass   td:first-child { border-left-color: #22c55e; }

/* Band pill in the rightmost column */
.scr-band-pill {
  display: inline-block; padding: 3px 9px; border-radius: 4px;
  font-family: ui-monospace, monospace; font-size: 10.5px; font-weight: 700;
  letter-spacing: 0.08em; line-height: 1.4;
}
.scr-band-pass    { background: rgba(34,197,94,0.16);  color: #86efac; border: 1px solid rgba(34,197,94,0.32); }
.scr-band-watch   { background: rgba(245,158,11,0.16); color: #fcd34d; border: 1px solid rgba(245,158,11,0.32); }
.scr-band-stress  { background: rgba(239,68,68,0.16);  color: #fca5a5; border: 1px solid rgba(239,68,68,0.32); }
.scr-band-unknown { background: rgba(148,163,184,0.12); color: #94a3b8; border: 1px solid rgba(148,163,184,0.24); }


/* ── Historical-name alias eyebrow on bank profile (Chemical Bank →
       JPMorgan Chase, NationsBank → BofA, etc.) ─────────────────────────── */
.bp-historical-eyebrow {
  color: #60a5fa; font-size: 12px; font-weight: 600;
  letter-spacing: 0.10em; text-transform: uppercase;
  margin: 0 0 6px;
}
.bp-historical-eyebrow strong { color: #93c5fd; font-weight: 700; }
.bp-historical-now {
  color: #94a3b8; font-size: 0.65em; font-weight: 500;
  margin-left: 6px; display: inline-block; vertical-align: middle;
}

/* ============================================================================
   RESPONSIVE FOUNDATION — Phase 1 public-zone addendum (2026-06-01)
   Rules that apply ONLY to the public (pre-login) zone.
   Zone-shared rules live in custom-theme.css.
   ============================================================================ */

/* ── P1. holdco/profile.html subsidiary table ────────────────────────────────
   .hc-shell wraps the content; add overflow-x:auto so the table can scroll
   rather than overflow the viewport. Phase-2 agent adds .table-wrap to HTML. */
.hc-shell {
    overflow-x: auto;
}
/* Restrain the shell itself from being narrower than readable */
.hc-table { min-width: 480px; }

/* ── P2. compare/detail.html comparison table ───────────────────────────────
   .cmp-group has no overflow; wrap it. Phase-2 agent adds .table-wrap. */
.cmp-group {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* ── P3. glossary/detail.html threshold table ───────────────────────────────
   .gd-thresholds already has overflow-x:auto. Ensure the table doesn't
   prevent this from working by clearing any min-width constraint. */
.gd-thresh-table { min-width: 400px; }

/* ── P4. landing/hero.html terminal mockup table ────────────────────────────
   .tm-panel contains the table; already constrained by panel width.
   Make the panel itself scrollable on very narrow screens. */
@media (max-width: 480px) {
    .tm-panel { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ── P5. subscriptions/pricing.html brr-compare-wrap already fixed above (P1) */

/* ── P6. banks/profile.html bp-trend-wrap already has overflow-x:auto ──────
   Already handled by existing CSS at line ~1695. No change needed. */

/* ── P7. Public aliases: ensure all named table wrappers have touch scroll ──
   These already have overflow-x:auto from their own rules. Add the touch prop
   where missing so iOS inertia scrolling works. */
.ev-table-wrap,
.lb-table-wrap,
.dir-table-wrap,
.ch-table-wrap,
.bp-mgmt-table-wrap {
    -webkit-overflow-scrolling: touch;
}

/* ============================================================================
   RESPONSIVE FOUNDATION — Phase 3 public-zone addendum (2026-06-01)
   ============================================================================ */

/* ── P3-1. compare/detail.html cmp-table: border-radius + overflow moved from
   <table> onto .table-wrap in the template inline <style> (2026-06-01).
   This CSS file needs no rule — the template fix is the canonical change. */

/* ── P3-2. .tm-table (landing hero terminal mockup): enforce minimum width
   so on very narrow viewports it scrolls inside .tm-panel rather than
   squishing column text to illegible widths. */
.tm-table { min-width: 360px; }

/* ── P3-3. .hc-table td.num: prevent dollar values wrapping mid-number
   inside the scroll wrapper on narrow screens. */
.hc-table td.num { white-space: nowrap; }

/* ── P3-4. .brr-grid--3 mobile collapse check ────────────────────────────────
   The class uses repeat(auto-fit, minmax(280px, 1fr)). At 768px with 48px
   padding (24px each side), 720px content width holds two 280px columns
   comfortably. Below ~596px it naturally collapses to 1-col via auto-fit.
   No explicit breakpoint is needed — SKIP (auto-fit handles it). */

/* ── P3-5. .brr-btn-ghost: full-width on very small screens so ghost buttons
   that are alone on a line fill it rather than floating left. */
@media (max-width: 480px) {
    .brr-btn-ghost { width: 100%; justify-content: center; }
}

/* ── P3-6. Auth narrow-screen padding: reduce main padding on 320-400px
   screens. The allauth base layout uses inline style="padding:24px" on
   <main>; 24px each side = 48px consumed on a 320px screen, leaving only
   272px. Reduce to 12px to give the .brr-form card more breathing room.
   Targets <main> element globally on auth pages (layout-safe: no other
   <main> with that pattern exists in the pre-login zone at that width). */
@media (max-width: 400px) {
    main {
        padding: 12px !important;
    }
    .brr-form {
        padding: 20px 16px;
    }
}

