/* ============================================================
   BINGO global light / dark theme tokens
   Driven by html[data-theme="light"|"dark"] (see js/theme.js)
   ============================================================ */

html {
  color-scheme: light dark;
  font-family: 'Montserrat', var(--font-sans, system-ui, -apple-system, sans-serif);
}

body {
  font-family: 'Montserrat', var(--font-sans, system-ui, -apple-system, sans-serif);
}

/* ——— Shared app color tokens ——— */
html[data-theme="light"] {
  --color-bg: #f2f2f7;
  --color-bg-secondary: #f8f9fb;
  --color-bg-elevated: #ffffff;
  --color-bg-card: #f3f4f6;
  --color-bg-hover: #f0f1f4;
  --color-surface: #ffffff;
  --color-text: #111827;
  --color-text-secondary: #6b7280;
  --color-text-tertiary: #9ca3af;
  --color-border: rgba(0, 0, 0, 0.08);
  --color-border-strong: rgba(0, 0, 0, 0.12);
  --color-accent: #0d7377;
  --color-accent-hover: #0a5c5f;
  --color-accent-light: rgba(13, 115, 119, 0.1);
  --color-glass: rgba(255, 255, 255, 0.78);
  --color-glass-border: rgba(255, 255, 255, 0.65);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04), 0 1px 3px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.08);

  --bk-bg: #f5f5f7;
  --bk-bg-2: #ffffff;
  --bk-surface: #ffffff;
  --bk-elev: #f0f0f2;
  --bk-ink: #0a0a0f;
  --bk-muted: #6b6b70;
  --bk-line: rgba(0, 0, 0, 0.08);
  --bk-white: #ffffff;
  --bk-teal: #0a84ff;
  --bk-teal-dim: rgba(10, 132, 255, 0.1);
  --bk-accent: #0a84ff;
  --bk-accent-soft: rgba(10, 132, 255, 0.1);
  --bk-btn-bg: #0a0a0f;
  --bk-btn-fg: #ffffff;
  --bk-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --bk-glow-a: rgba(10, 132, 255, 0.12);
  --bk-glow-b: rgba(95, 175, 255, 0.08);
  --bk-nav-link: rgba(10, 10, 15, 0.62);
  --bk-card-shadow: 0 8px 32px rgba(10, 10, 15, 0.06);
  --bk-gradient-title: linear-gradient(180deg, #0a0a0f 0%, #0a0a0f 55%, #6b6b70 100%);
  --bk-logo-filter: brightness(0.12);
  --bk-kicker-color: rgba(10, 10, 15, 0.45);
  --bk-trust-fg: rgba(10, 10, 15, 0.08);
  --bk-ghost-bg: rgba(0, 0, 0, 0.04);
  --bk-ghost-border: rgba(0, 0, 0, 0.1);
  --bk-input-bg: rgba(255, 255, 255, 0.9);
  --bk-panel-bg: linear-gradient(165deg, #ffffff 0%, #f8f8fa 100%);
  --bk-panel-border: rgba(0, 0, 0, 0.08);
  --bk-panel-shadow: 0 8px 32px rgba(10, 10, 15, 0.06);
  --bk-panel-shadow-hover: 0 24px 48px -16px rgba(10, 132, 255, 0.14);
  --bk-panel-gradient-border: linear-gradient(135deg, rgba(0,0,0,0.08), rgba(0,0,0,0.02) 45%, rgba(10,132,255,0.18));
  --bk-hero-mesh:
    radial-gradient(ellipse 80% 50% at 50% -10%, rgba(10, 132, 255, 0.1) 0%, transparent 55%),
    radial-gradient(circle at 88% 18%, rgba(95, 175, 255, 0.07) 0%, transparent 42%),
    radial-gradient(circle at 12% 72%, rgba(120, 80, 255, 0.04) 0%, transparent 38%),
    #f5f5f7;
  --bk-section-alt: rgba(255, 255, 255, 0.55);

  --shell-bg: #f4f6f8;
  --shell-surface: #ffffff;
  --shell-text: #0b1220;
  --shell-muted: #6b7a8c;
  --shell-border: rgba(15, 23, 42, 0.08);
  --shell-accent: #0d9488;
  --shell-accent-soft: rgba(13, 148, 136, 0.12);
  --shell-shadow: 0 1px 2px rgba(11, 18, 32, 0.04), 0 8px 24px rgba(11, 18, 32, 0.04);
}

html[data-theme="dark"] {
  --color-bg: #050505;
  --color-bg-secondary: #0a0a0a;
  --color-bg-elevated: #141416;
  --color-bg-card: #1a1a1c;
  --color-bg-hover: #222226;
  --color-surface: #111113;
  --color-text: #f5f5f4;
  --color-text-secondary: #8a8a8e;
  --color-text-tertiary: #6b6b70;
  --color-border: rgba(255, 255, 255, 0.08);
  --color-border-strong: rgba(255, 255, 255, 0.14);
  --color-accent: #2dd4bf;
  --color-accent-hover: #14b8a6;
  --color-accent-light: rgba(45, 212, 191, 0.16);
  --color-glass: rgba(17, 17, 19, 0.85);
  --color-glass-border: rgba(255, 255, 255, 0.1);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 20px 48px rgba(0, 0, 0, 0.5);

  --bk-bg: #000000;
  --bk-bg-2: #0a0a0a;
  --bk-surface: #111113;
  --bk-elev: #17171a;
  --bk-ink: #ffffff;
  --bk-muted: rgba(255, 255, 255, 0.65);
  --bk-line: rgba(255, 255, 255, 0.1);
  --bk-white: #ffffff;
  --bk-teal: #0a84ff;
  --bk-teal-dim: rgba(10, 132, 255, 0.14);
  --bk-accent: #0a84ff;
  --bk-accent-soft: rgba(10, 132, 255, 0.14);
  --bk-btn-bg: #ffffff;
  --bk-btn-fg: #000000;
  --bk-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --bk-glow-a: rgba(10, 132, 255, 0.18);
  --bk-glow-b: rgba(95, 175, 255, 0.1);
  --bk-nav-link: rgba(255, 255, 255, 0.7);
  --bk-card-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
  --bk-gradient-title: linear-gradient(180deg, #ffffff 0%, #ffffff 40%, #b1b1b6 100%);
  --bk-logo-filter: brightness(0) invert(1);
  --bk-kicker-color: rgba(255, 255, 255, 0.45);
  --bk-trust-fg: rgba(255, 255, 255, 0.12);
  --bk-ghost-bg: rgba(255, 255, 255, 0.06);
  --bk-ghost-border: rgba(255, 255, 255, 0.12);
  --bk-input-bg: rgba(255, 255, 255, 0.04);
  --bk-panel-bg: linear-gradient(165deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.02) 100%);
  --bk-panel-border: rgba(255, 255, 255, 0.08);
  --bk-panel-shadow: 0 4px 24px rgba(0, 0, 0, 0.18);
  --bk-panel-shadow-hover: 0 24px 48px -16px rgba(10, 132, 255, 0.22);
  --bk-panel-gradient-border: linear-gradient(135deg, rgba(255,255,255,0.12), rgba(255,255,255,0.02) 45%, rgba(10,132,255,0.15));
  --bk-hero-mesh:
    radial-gradient(ellipse 80% 50% at 50% -10%, rgba(10, 132, 255, 0.14) 0%, transparent 55%),
    radial-gradient(circle at 88% 18%, rgba(95, 175, 255, 0.1) 0%, transparent 42%),
    radial-gradient(circle at 12% 72%, rgba(120, 80, 255, 0.07) 0%, transparent 38%),
    #000000;
  --bk-section-alt: transparent;

  --shell-bg: #050505;
  --shell-surface: #111113;
  --shell-text: #f5f5f4;
  --shell-muted: #8a8a8e;
  --shell-border: rgba(255, 255, 255, 0.08);
  --shell-accent: #2dd4bf;
  --shell-accent-soft: rgba(45, 212, 191, 0.14);
  --shell-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 12px 32px rgba(0, 0, 0, 0.35);
}

/* ——— App / platform shell ——— */
html[data-theme="light"] body.app-body,
html[data-theme="light"] body.admin-body,
html[data-theme="light"] body.auth-body,
html[data-theme="light"] body.welcome-body {
  --color-bg: #f2f2f7 !important;
  --color-bg-secondary: #f8f9fb !important;
  --color-bg-elevated: #ffffff !important;
  --color-bg-card: #f3f4f6 !important;
  --color-bg-hover: #f0f1f4 !important;
  --color-surface: #ffffff !important;
  --color-text: #111827 !important;
  --color-text-secondary: #6b7280 !important;
  --color-text-tertiary: #9ca3af !important;
  --color-border: rgba(0, 0, 0, 0.08) !important;
  --color-border-strong: rgba(0, 0, 0, 0.12) !important;
  --color-accent: #0d7377 !important;
  --color-accent-hover: #0a5c5f !important;
  --color-accent-light: rgba(13, 115, 119, 0.1) !important;
  background: var(--shell-bg, #f4f6f8) !important;
  color: var(--shell-text, #0b1220) !important;
}

html[data-theme="dark"] body.app-body,
html[data-theme="dark"] body.admin-body,
html[data-theme="dark"] body.auth-body,
html[data-theme="dark"] body.welcome-body {
  --color-bg: #050505 !important;
  --color-bg-secondary: #0a0a0a !important;
  --color-bg-elevated: #141416 !important;
  --color-bg-card: #1a1a1c !important;
  --color-bg-hover: #222226 !important;
  --color-surface: #111113 !important;
  --color-text: #f5f5f4 !important;
  --color-text-secondary: #8a8a8e !important;
  --color-text-tertiary: #6b6b70 !important;
  --color-border: rgba(255, 255, 255, 0.08) !important;
  --color-border-strong: rgba(255, 255, 255, 0.14) !important;
  --color-accent: #2dd4bf !important;
  --color-accent-hover: #14b8a6 !important;
  --color-accent-light: rgba(45, 212, 191, 0.16) !important;
  --color-glass: rgba(17, 17, 19, 0.85) !important;
  background: var(--shell-bg, #050505) !important;
  color: var(--shell-text, #f5f5f4) !important;
}

html[data-theme="dark"] body.app-body .app-sidebar,
html[data-theme="dark"] body.app-body .mobile-top-bar,
html[data-theme="dark"] body.app-body #mobileTopBar.mobile-top-bar {
  background: color-mix(in srgb, var(--shell-surface) 90%, transparent) !important;
  border-color: var(--shell-border) !important;
}

html[data-theme="light"] body.app-body .mobile-top-bar__logo .logo-full,
html[data-theme="light"] body.app-body .logo-full {
  filter: brightness(0.12);
}

html[data-theme="dark"] body.app-body .mobile-top-bar__logo .logo-full,
html[data-theme="dark"] body.app-body .logo-full {
  filter: brightness(0) invert(1);
}

html[data-theme="dark"] body.app-body .bottom-nav {
  background: color-mix(in srgb, var(--shell-surface) 92%, transparent) !important;
  border-top: 1px solid var(--shell-border) !important;
}

html[data-theme="dark"] body.app-body .feed-item,
html[data-theme="dark"] body.app-body .post,
html[data-theme="dark"] body.app-body .ig-post,
html[data-theme="dark"] body.app-body .post-card,
html[data-theme="dark"] body.app-body .card,
html[data-theme="dark"] body.app-body .settings-card,
html[data-theme="dark"] body.app-body .settings-section,
html[data-theme="dark"] body.app-body .widget,
html[data-theme="dark"] body.app-body .panel {
  background: var(--shell-surface) !important;
  color: var(--shell-text) !important;
  border-color: var(--shell-border) !important;
}

html[data-theme="dark"] body.app-body .post-card .post-author,
html[data-theme="dark"] body.app-body .post-card .post-caption,
html[data-theme="dark"] body.app-body .post-card .post-likes,
html[data-theme="dark"] body.app-body .post-card .post-time,
html[data-theme="dark"] body.app-body .post-card .post-header,
html[data-theme="dark"] body.app-body .post-card .post-actions {
  color: var(--shell-text) !important;
}

html[data-theme="dark"] body.app-body .post-card .post-location,
html[data-theme="dark"] body.app-body .post-card .post-comments-link {
  color: var(--shell-muted) !important;
}

html[data-theme="dark"] body.app-body .post-card .post-action,
html[data-theme="dark"] body.app-body .post-card .post-more {
  color: var(--shell-text) !important;
}

html[data-theme="dark"] body.app-body .post-card .post-action .icon-svg {
  stroke: var(--shell-text);
}

html[data-theme="dark"] body.app-body .feed-tabs {
  background: var(--shell-bg) !important;
  border-bottom-color: var(--shell-border) !important;
}

html[data-theme="dark"] body.app-body .feed-tab {
  color: var(--shell-muted) !important;
}

html[data-theme="dark"] body.app-body .feed-tab.is-active {
  color: var(--shell-text) !important;
}

html[data-theme="dark"] body.app-body .app-feed,
html[data-theme="dark"] body.app-body .app-main {
  background: transparent !important;
  color: var(--shell-text) !important;
}

html[data-theme="dark"] body.app-body .app-sidebar-user {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: var(--shell-border) !important;
}

html[data-theme="dark"] body.app-body .order-card,
html[data-theme="dark"] body.app-body .product-card,
html[data-theme="dark"] body.app-body .market-card,
html[data-theme="dark"] body.app-body .messages-layout {
  background: var(--shell-surface) !important;
  color: var(--shell-text) !important;
  border-color: var(--shell-border) !important;
}

html[data-theme="dark"] body.app-body .mobile-top-btn {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: var(--shell-border) !important;
  color: var(--shell-text) !important;
}

html[data-theme="dark"] body.app-body .stories-bar {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, transparent 100%) !important;
}

html[data-theme="dark"] body.app-body .story-bubble-name {
  color: var(--shell-text) !important;
}

html[data-theme="dark"] body.app-body .search-tab,
html[data-theme="dark"] body.app-body .settings-tab {
  color: var(--shell-muted) !important;
  border-color: var(--shell-border) !important;
}

html[data-theme="dark"] body.app-body .search-tab.active,
html[data-theme="dark"] body.app-body .settings-tab.active {
  background: var(--shell-accent) !important;
  color: #041210 !important;
}

html[data-theme="dark"] body.app-body .page-header,
html[data-theme="dark"] body.app-body .settings-lead,
html[data-theme="dark"] body.app-body .settings-hint {
  color: var(--shell-text) !important;
}

html[data-theme="dark"] body.app-body input,
html[data-theme="dark"] body.app-body textarea,
html[data-theme="dark"] body.app-body select {
  background: var(--color-bg-card) !important;
  color: var(--shell-text) !important;
  border-color: var(--shell-border) !important;
}

html[data-theme="dark"] body.app-body .chat-item,
html[data-theme="dark"] body.app-body .chat-bubble.received {
  background: var(--color-bg-card) !important;
  color: var(--shell-text) !important;
}

@media (max-width: 768px) {
  html[data-theme="dark"] body.app-body {
    background: var(--shell-bg, #050505) !important;
  }

  html[data-theme="dark"] body.app-body .post-card {
    background: var(--shell-surface, #111113) !important;
    color: var(--shell-text) !important;
    border-color: var(--shell-border) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.35) !important;
  }

  html[data-theme="dark"] body.app-body .bottom-nav,
  html[data-theme="dark"] body.app-body #bottomNav.bottom-nav {
    background: color-mix(in srgb, var(--shell-surface) 92%, transparent) !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45) !important;
  }

  html[data-theme="dark"] body.app-body .mobile-top-bar,
  html[data-theme="dark"] body.app-body #mobileTopBar.mobile-top-bar {
    background: color-mix(in srgb, var(--shell-surface) 90%, transparent) !important;
    border-bottom-color: var(--shell-border) !important;
  }
}

html[data-theme="dark"] .bottom-nav-link--create .bottom-nav-create-orb {
  background: var(--shell-accent) !important;
  color: #041210 !important;
}

html[data-theme="dark"] .ig-compose--ig,
html[data-theme="dark"] .ig-compose--sheet,
html[data-theme="dark"] .ig-music--light {
  background: var(--shell-surface, #111113) !important;
  color: var(--shell-text, #f5f5f4) !important;
}

html[data-theme="dark"] .ig-compose--ig .ig-compose__top,
html[data-theme="dark"] .ig-music--light .ig-music__top {
  background: var(--shell-surface);
  border-bottom-color: var(--shell-border);
}

html[data-theme="dark"] .ig-compose--ig textarea,
html[data-theme="dark"] .ig-compose--ig .ig-compose__row {
  background: var(--shell-surface);
  color: var(--shell-text);
  border-bottom-color: var(--shell-border);
}

html[data-theme="dark"] .ig-compose--ig .ig-compose__row-ico {
  background: var(--color-bg-card, #1a1a1c);
  color: var(--shell-text);
}

html[data-theme="dark"] .ig-compose__music-pill,
html[data-theme="dark"] .ig-compose__loc-chip {
  background: var(--color-bg-card);
  color: var(--shell-text);
  border-color: var(--shell-border);
}

html[data-theme="dark"] .ig-music--light .ig-music__search input {
  background: var(--color-bg-card);
  color: var(--shell-text);
}

html[data-theme="dark"] .ig-music--light .ig-music__row {
  border-bottom-color: var(--shell-border);
}

html[data-theme="dark"] .bottom-nav {
  background: color-mix(in srgb, var(--shell-surface) 88%, transparent) !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45) !important;
}

html[data-theme="dark"] .bottom-nav-link {
  color: var(--shell-muted) !important;
}

html[data-theme="dark"] .bottom-nav-link.active {
  color: var(--shell-text) !important;
}

html[data-theme="dark"] body.app-body .post-card .post-action .icon-svg {
  stroke: var(--shell-text, #f5f5f4);
  fill: none;
}

html[data-theme="dark"] body.app-body .bottom-nav-link {
  color: var(--shell-muted) !important;
}

html[data-theme="dark"] body.app-body .bottom-nav-link.active {
  color: var(--shell-text) !important;
}

html[data-theme="dark"] body.app-body .feed-tab.is-active {
  color: var(--shell-text) !important;
  border-bottom-color: var(--shell-accent) !important;
}

.trust-badge--inline,
.post-card .trust-badge {
  display: none !important;
}

.mobile-top-bar__actions .theme-toggle {
  width: 36px;
  height: 36px;
  border: 0;
  background: transparent;
}

/* ——— Landing (lp-black) — NV light / dark ——— */
html[data-theme="light"] body.lp-black {
  background: var(--bk-bg) !important;
  color: var(--bk-ink);
}

html[data-theme="light"] body.lp-black .bk-nav {
  background: color-mix(in srgb, var(--bk-bg) 75%, transparent);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border-bottom: 1px solid var(--bk-line);
}

html[data-theme="dark"] body.lp-black {
  background: var(--bk-bg);
  color: var(--bk-ink);
}

html[data-theme="dark"] body.lp-black .bk-nav.is-scrolled,
html[data-theme="light"] body.lp-black .bk-nav.is-scrolled {
  background: color-mix(in srgb, var(--bk-bg) 82%, transparent);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  border-bottom-color: var(--bk-line);
}

html[data-theme="light"] body.lp-black .bk-nav__links a {
  color: var(--bk-nav-link);
}

html[data-theme="light"] body.lp-black .bk-nav__links a:hover {
  color: var(--bk-ink);
  background: rgba(0, 0, 0, 0.04);
}

html[data-theme="light"] body.lp-black .bk-lang-pills {
  border-color: rgba(0, 0, 0, 0.08);
  background: rgba(255, 255, 255, 0.85);
}

html[data-theme="light"] body.lp-black .bk-lang-pills button {
  color: rgba(10, 10, 15, 0.62);
}

html[data-theme="light"] body.lp-black .bk-lang-pills button.is-active {
  background: #0a0a0f;
  color: #fff;
}

html[data-theme="light"] body.lp-black .theme-toggle {
  background: rgba(255, 255, 255, 0.85);
  border-color: rgba(0, 0, 0, 0.08);
}

html[data-theme="light"] body.lp-black .bk-showcase__scroll i {
  background: linear-gradient(180deg, rgba(10,10,15,0.35), transparent);
}

html[data-theme="light"] body.lp-black .bk-bento__cell.is-active {
  background: linear-gradient(165deg, rgba(10, 132, 255, 0.08) 0%, #ffffff 100%);
  border-color: rgba(10, 132, 255, 0.25);
}

html[data-theme="light"] body.lp-black .bk-scene__row b,
html[data-theme="light"] body.lp-black .bk-scene__row span {
  background: rgba(10, 10, 15, 0.1);
}

html[data-theme="light"] body.lp-black .bk-scene__bubble {
  background: rgba(10, 10, 15, 0.05);
  border-color: rgba(0, 0, 0, 0.06);
}

html[data-theme="light"] body.lp-black .bk-scene__cart {
  border-color: rgba(0, 0, 0, 0.12);
}

html[data-theme="light"] body.lp-black .bk-hero-chip strong {
  background: linear-gradient(135deg, #0a0a0f 0%, #6b6b70 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

html[data-theme="light"] body.lp-black .bk-card__visual--a {
  background:
    radial-gradient(circle at 30% 40%, rgba(10, 132, 255, 0.2) 0%, transparent 55%),
    linear-gradient(135deg, rgba(10, 132, 255, 0.08), rgba(95, 175, 255, 0.03));
}

html[data-theme="light"] body.lp-black .bk-card__visual--b {
  background:
    radial-gradient(circle at 70% 35%, rgba(95, 175, 255, 0.18) 0%, transparent 50%),
    linear-gradient(135deg, rgba(10, 132, 255, 0.06), rgba(120, 80, 255, 0.04));
}

html[data-theme="light"] body.lp-black .bk-card__visual--c {
  background:
    radial-gradient(circle at 50% 50%, rgba(10, 132, 255, 0.15) 0%, transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,0.02), rgba(10,132,255,0.05));
}

html[data-theme="light"] body.lp-black .bk-card__visual--d {
  background:
    radial-gradient(circle at 40% 60%, rgba(10, 132, 255, 0.18) 0%, transparent 55%),
    linear-gradient(135deg, rgba(95,175,255,0.1), rgba(10,132,255,0.04));
}

html[data-theme="light"] body.lp-black .bk-keys span {
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(0, 0, 0, 0.06);
}

html[data-theme="light"] body.lp-black .bk-keys span:hover {
  background: rgba(10, 132, 255, 0.08);
}

html[data-theme="light"] body.lp-black .bk-experience::before {
  background: radial-gradient(50% 60% at 50% 0%, rgba(10, 132, 255, 0.08) 0%, transparent 70%);
}

html[data-theme="light"] body.lp-black .bk-experience__steps button.is-active {
  background: var(--bk-accent-soft);
}

html[data-theme="light"] body.lp-black .bk-ask__hints button:hover {
  color: var(--bk-ink);
  border-color: rgba(0, 0, 0, 0.12);
  background: rgba(0, 0, 0, 0.03);
}

html[data-theme="light"] body.lp-black .bk-footer {
  background: #ffffff;
  border-top-color: var(--bk-line);
}

html[data-theme="light"] body.lp-black .bk-btn--solid {
  box-shadow: 0 8px 24px -8px rgba(10, 10, 15, 0.15);
}

html[data-theme="light"] body.lp-black .bk-btn--ghost:hover {
  background: rgba(0, 0, 0, 0.06);
}

/* Hero title gradients — NV */
html[data-theme="dark"] body.lp-black .bk-t-line:not(.bk-t-blue) {
  background: linear-gradient(180deg, #ffffff 0%, #ffffff 40%, #b1b1b6 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

html[data-theme="dark"] body.lp-black .bk-t-blue {
  background: linear-gradient(135deg, #5fafff 0%, #0a84ff 55%, #007aff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

html[data-theme="light"] body.lp-black .bk-t-line:not(.bk-t-blue) {
  background: linear-gradient(180deg, #0a0a0f 0%, #0a0a0f 55%, #6b6b70 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

html[data-theme="light"] body.lp-black .bk-t-blue {
  background: linear-gradient(135deg, #5fafff 0%, #0a84ff 55%, #007aff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

html[data-theme="light"] body.lp-black .bk-lang__opt[aria-selected="true"] {
  background: var(--bk-accent-soft, var(--bk-teal-dim));
}

html[data-theme="light"] body.lp-black .bk-nav__links .bk-nav__cta {
  color: var(--bk-accent, var(--bk-teal)) !important;
  background: var(--bk-accent-soft, var(--bk-teal-dim)) !important;
}

html[data-theme="light"] body.lp-black .bk-btn--ghost,
html[data-theme="light"] body.lp-black .bk-lang__toggle,
html[data-theme="light"] body.lp-black .theme-toggle {
  color: var(--bk-ink);
  border-color: var(--bk-line);
}

html[data-theme="light"] body.lp-black .bk-nav__burger {
  background: color-mix(in srgb, var(--bk-ink) 4%, transparent);
}

/* Experience phone mock — light surfaces + readable text */
html[data-theme="light"] body.lp-black .bk-phone__bezel {
  background: linear-gradient(160deg, #e8e8ec, #f5f5f7) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  box-shadow: 0 28px 60px rgba(0, 0, 0, 0.12) !important;
}

html[data-theme="light"] body.lp-black .bk-phone__notch {
  background: #c8c8cc !important;
}

html[data-theme="light"] body.lp-black .bk-phone__screens {
  background: #ffffff !important;
  color: #0a0a0a !important;
}

html[data-theme="light"] body.lp-black .bk-ui__ring {
  background:
    radial-gradient(circle at 50% 50%, #ffffff 0 52%, transparent 53%),
    conic-gradient(var(--bk-teal) 0 86%, rgba(0, 0, 0, 0.1) 86% 100%) !important;
}

html[data-theme="light"] body.lp-black .bk-ui__list li,
html[data-theme="light"] body.lp-black .bk-ui__card,
html[data-theme="light"] body.lp-black .bk-ui__row,
html[data-theme="light"] body.lp-black .bk-ui__ask,
html[data-theme="light"] body.lp-black .bk-ui__msg {
  background: #f3f3f5 !important;
  color: #0a0a0a !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

html[data-theme="light"] body.lp-black .bk-ui__card span,
html[data-theme="light"] body.lp-black .bk-ui__ring span,
html[data-theme="light"] body.lp-black .bk-experience__steps span {
  color: #6b6b70 !important;
}

html[data-theme="light"] body.lp-black .bk-ui__msg--out {
  background: #0a0a0a !important;
  color: #ffffff !important;
}

/* ——— Auth ——— */
html[data-theme="light"] body.auth-body,
html[data-theme="light"] body.auth-body.auth-body--bk {
  background: var(--bk-bg) !important;
  color: var(--bk-ink);
}

html[data-theme="light"] body.auth-body.auth-body--bk .auth-page,
html[data-theme="light"] body.auth-body.auth-body--bk .auth-form-side {
  background: var(--bk-bg) !important;
}

html[data-theme="light"] body.auth-body.auth-body--bk .auth-visual {
  background:
    radial-gradient(ellipse 70% 55% at 30% 20%, color-mix(in srgb, var(--bk-teal) 14%, transparent), transparent 55%),
    linear-gradient(165deg, #eef2f4 0%, var(--bk-bg) 50%, #e8ecee 100%) !important;
  color: var(--bk-ink);
}

html[data-theme="light"] body.auth-body.auth-body--bk .auth-card,
html[data-theme="light"] body.auth-body.auth-body--bk .verify-card {
  background: var(--bk-surface) !important;
  border: 1px solid var(--bk-line) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.08) !important;
}

html[data-theme="light"] body.auth-body.auth-body--bk .form-input,
html[data-theme="light"] body.auth-body.auth-body--bk .phone-country,
html[data-theme="light"] body.auth-body.auth-body--bk .phone-picker__dial,
html[data-theme="light"] body.auth-body.auth-body--bk .phone-picker__search,
html[data-theme="light"] body.auth-body.auth-body--bk .phone-picker__input {
  background: var(--bk-elev) !important;
  color: var(--bk-ink) !important;
  border-color: var(--bk-line) !important;
}

html[data-theme="light"] body.auth-body.auth-body--bk .btn-primary,
html[data-theme="light"] body.auth-body.auth-body--bk .auth-card .btn.btn-primary {
  background: var(--bk-btn-bg) !important;
  color: var(--bk-btn-fg) !important;
}

html[data-theme="light"] body.auth-body.auth-body--bk .auth-visual-logo img,
html[data-theme="light"] body.auth-body.auth-body--bk .auth-logo img {
  filter: brightness(0.12);
}

html[data-theme="light"] body.auth-body.auth-body--bk .phone-picker__panel {
  background: var(--bk-surface) !important;
  border-color: var(--bk-line);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.12);
}

html[data-theme="light"] body.auth-body.auth-body--bk .phone-picker__option {
  color: var(--bk-ink);
}

html[data-theme="light"] body.auth-body.auth-body--bk .phone-picker__option:hover,
html[data-theme="light"] body.auth-body.auth-body--bk .phone-picker__option.is-active {
  background: color-mix(in srgb, var(--bk-teal) 12%, transparent);
}

html[data-theme="light"] body.auth-body.auth-body--bk .auth-title,
html[data-theme="light"] body.auth-body.auth-body--bk .auth-visual-title,
html[data-theme="light"] body.auth-body.auth-body--bk .auth-back:hover {
  color: var(--bk-ink) !important;
}

html[data-theme="light"] body.auth-body.auth-body--bk .auth-subtitle,
html[data-theme="light"] body.auth-body.auth-body--bk .auth-visual-desc,
html[data-theme="light"] body.auth-body.auth-body--bk .auth-back,
html[data-theme="light"] body.auth-body.auth-body--bk .form-label,
html[data-theme="light"] body.auth-body.auth-body--bk .auth-footer-text,
html[data-theme="light"] body.auth-body.auth-body--bk .telegram-auth-label {
  color: var(--bk-muted) !important;
}

html[data-theme="dark"] body.auth-body.auth-body--bk .btn-primary,
html[data-theme="dark"] body.auth-body.auth-body--bk .auth-card .btn.btn-primary,
html[data-theme="dark"] body.welcome-body .btn-primary {
  background: var(--bk-btn-bg) !important;
  color: var(--bk-btn-fg) !important;
}

.auth-theme-row {
  display: flex;
  justify-content: flex-end;
  margin: -4px 0 12px;
}

.welcome-header {
  gap: 8px;
}

.welcome-header .theme-toggle {
  margin-left: auto;
}

/* ——— Welcome ——— */
html[data-theme="light"] body.welcome-body {
  background: var(--bk-bg) !important;
  color: var(--bk-ink) !important;
}

html[data-theme="light"] body.welcome-body .welcome-page {
  background:
    radial-gradient(ellipse 70% 45% at 50% -5%, color-mix(in srgb, var(--bk-teal) 12%, transparent), transparent 55%),
    var(--bk-bg);
}

html[data-theme="light"] body.welcome-body .welcome-feature,
html[data-theme="light"] body.welcome-body .welcome-form {
  background: var(--bk-surface);
  border-color: var(--bk-line);
}

html[data-theme="light"] body.welcome-body .btn-primary {
  background: var(--bk-btn-bg) !important;
  color: var(--bk-btn-fg) !important;
}

html[data-theme="light"] body.welcome-body .welcome-title,
html[data-theme="light"] body.welcome-body .welcome-header {
  color: var(--bk-ink);
}

html[data-theme="light"] body.welcome-body .welcome-desc {
  color: var(--bk-muted);
}

html[data-theme="light"] body.welcome-body .welcome-header img {
  filter: brightness(0.12);
}

html[data-theme="light"] body.welcome-body .form-input {
  background: var(--bk-elev) !important;
  color: var(--bk-ink) !important;
  border-color: var(--bk-line) !important;
}

/* App light cleanup — kill remaining dark chrome */
html[data-theme="light"] body.app-body .search-tab.active {
  background: #1d1d1f !important;
  color: #fff !important;
}

html[data-theme="light"] .bingo-install-banner {
  background: #ffffff !important;
  color: #0b1220 !important;
  border: 1px solid rgba(0, 0, 0, 0.08);
}

html[data-theme="light"] body.app-body input,
html[data-theme="light"] body.app-body textarea,
html[data-theme="light"] body.app-body select,
html[data-theme="light"] body.app-body .form-input {
  background: #ffffff;
  color: #111827;
  border-color: rgba(0, 0, 0, 0.1);
}

/* ——— Theme toggle control ——— */
.theme-toggle,
[data-theme-toggle] {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 36px;
  height: 36px;
  padding: 0;
  border-radius: 999px;
  border: 1px solid var(--bk-line, var(--shell-border, rgba(0,0,0,0.1)));
  background: transparent;
  color: var(--bk-ink, var(--shell-text, inherit));
  cursor: pointer;
  font: inherit;
  transition: background 0.2s, border-color 0.2s, transform 0.2s;
}

.theme-toggle:hover,
[data-theme-toggle]:hover {
  background: rgba(127, 127, 127, 0.12);
}

.theme-toggle svg,
[data-theme-toggle] svg {
  width: 18px;
  height: 18px;
  display: block;
}

html[data-theme="light"] .theme-toggle__moon { display: none; }
html[data-theme="dark"] .theme-toggle__sun { display: none; }

.theme-choice-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.theme-choice {
  padding: 12px 10px;
  border-radius: 12px;
  border: 1px solid var(--color-border);
  background: var(--color-bg-elevated);
  color: var(--color-text);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

.theme-choice.active {
  border-color: var(--color-accent);
  background: var(--color-accent-light);
  color: var(--color-accent);
}