:root {
  color-scheme: light;
}

.brand-logo {
  display: block;
  width: 156px;
  height: auto;
  max-height: 42px;
  object-fit: contain;
}

.brand:has(.brand-logo) {
  flex: 0 0 auto;
}

.theme-toggle {
  flex: 0 0 auto;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-bg: #080d18;
  --color-surface: #111a2c;
  --color-surface-2: #18233a;
  --color-dark: #eaf0ff;
  --color-dark-2: #d7e2ff;
  --color-text: #edf3ff;
  --color-muted: #a6b4cc;
  --color-border: #273653;
  --accent-green: #5d7cff;
  --accent-cyan: #5d7cff;
  --dark-green: #8ca2ff;
  --success: #3ed49b;
  --warning: #f1b85b;
  --danger: #ff7180;
  --white: #111a2c;
  --shadow-soft: 0 22px 62px rgb(0 0 0 / 0.35);
  --shadow-dark: 0 28px 78px rgb(0 0 0 / 0.5);
}

:root[data-theme="dark"] body {
  background: var(--color-bg);
  color: var(--color-text);
}

:root[data-theme="dark"] .site-header,
:root[data-theme="dark"] .site-header.is-scrolled,
:root[data-theme="dark"] .mega-menu,
:root[data-theme="dark"] .mobile-nav,
:root[data-theme="dark"] .sidebar,
:root[data-theme="dark"] .topbar {
  border-color: var(--color-border);
  background: rgb(12 19 34 / 0.94);
  color: var(--color-text);
}

:root[data-theme="dark"] .brand:has(.brand-logo) {
  border: 1px solid rgb(255 255 255 / 0.12);
  border-radius: 8px;
  background: #ffffff;
  padding: 4px 8px;
}

:root[data-theme="dark"] .nav-link,
:root[data-theme="dark"] .nav-trigger,
:root[data-theme="dark"] .side-link,
:root[data-theme="dark"] .auth-back,
:root[data-theme="dark"] .form-stack > label,
:root[data-theme="dark"] .form-stack label,
:root[data-theme="dark"] .console-card > label {
  color: #c4d0e7;
}

:root[data-theme="dark"] .nav-link:hover,
:root[data-theme="dark"] .nav-trigger:hover,
:root[data-theme="dark"] .nav-link.is-active,
:root[data-theme="dark"] .nav-trigger.is-active,
:root[data-theme="dark"] .nav-trigger[aria-expanded="true"],
:root[data-theme="dark"] .side-link:hover,
:root[data-theme="dark"] .side-link.is-active,
:root[data-theme="dark"] .mega-item:hover,
:root[data-theme="dark"] .mega-network:hover {
  background: #1a2740;
  color: #ffffff;
}

:root[data-theme="dark"] .btn-secondary,
:root[data-theme="dark"] .btn-ghost,
:root[data-theme="dark"] .icon-btn,
:root[data-theme="dark"] .locale-select select,
:root[data-theme="dark"] .mobile-locale select,
:root[data-theme="dark"] .field,
:root[data-theme="dark"] .select-field,
:root[data-theme="dark"] .textarea-field {
  border-color: var(--color-border);
  background: #131e33;
  color: var(--color-text);
}

:root[data-theme="dark"] .btn-secondary:hover,
:root[data-theme="dark"] .btn-ghost:hover,
:root[data-theme="dark"] .icon-btn:hover {
  border-color: #4a6092;
  background: #1b2944;
}

:root[data-theme="dark"] .mini-icon,
:root[data-theme="dark"] .network-logo,
:root[data-theme="dark"] .auth-card-icon,
:root[data-theme="dark"] .console-avatar {
  border-color: #304263;
  background: #17233c;
  color: #8da5ff;
}

:root[data-theme="dark"] .landing-page {
  --landing-bg: #080d18;
  --landing-bg-soft: #0d1526;
  --landing-surface: #111a2c;
  --landing-surface-2: #16223a;
  --landing-border: #273653;
  --landing-border-strong: #37496d;
  --landing-text: #edf3ff;
  --landing-muted: #adbad0;
  --landing-accent: #5d7cff;
  --landing-accent-hover: #7893ff;
  --landing-accent-soft: #1a2a52;
  --landing-success: #3ed49b;
  --landing-success-soft: #102d2a;
  --landing-shadow: 0 24px 72px rgb(0 0 0 / 0.38);
  background: var(--landing-bg);
  color: var(--landing-text);
  color-scheme: dark;
}

:root[data-theme="dark"] .landing-page .page-shell,
:root[data-theme="dark"] .landing-page .ecosystem-strip,
:root[data-theme="dark"] .landing-page .site-section:not(.dark-section) {
  background: var(--landing-bg);
  color: var(--landing-text);
}

:root[data-theme="dark"] .landing-page .site-section:nth-of-type(even):not(.dark-section),
:root[data-theme="dark"] .landing-page .ecosystem-strip {
  background: var(--landing-bg-soft);
}

:root[data-theme="dark"] .landing-page .site-header,
:root[data-theme="dark"] .landing-page .site-header.is-scrolled,
:root[data-theme="dark"] .landing-page .mega-menu,
:root[data-theme="dark"] .landing-page .mobile-nav {
  border-color: var(--landing-border);
  background: rgb(12 19 34 / 0.96);
  color: var(--landing-text);
}

:root[data-theme="dark"] .landing-page .hero::before,
:root[data-theme="dark"] .landing-page .hero::after {
  opacity: 0.36;
}

:root[data-theme="dark"] .landing-page .hero-art {
  opacity: 0.18;
  filter: saturate(0.7) brightness(0.58);
}

:root[data-theme="dark"] .landing-page .section-title,
:root[data-theme="dark"] .landing-page .hero h1,
:root[data-theme="dark"] .landing-page .bento-card h3,
:root[data-theme="dark"] .landing-page .mega-item strong,
:root[data-theme="dark"] .landing-page .mega-network strong,
:root[data-theme="dark"] .landing-page .pricing-card h3 {
  color: var(--landing-text);
}

:root[data-theme="dark"] .landing-page .hero-copy,
:root[data-theme="dark"] .landing-page .section-copy,
:root[data-theme="dark"] .landing-page .muted,
:root[data-theme="dark"] .landing-page .mega-item span,
:root[data-theme="dark"] .landing-page .mega-network small {
  color: var(--landing-muted);
}

:root[data-theme="dark"] .landing-page .bento-card,
:root[data-theme="dark"] .landing-page .network-card,
:root[data-theme="dark"] .landing-page .pricing-card,
:root[data-theme="dark"] .landing-page .gateway-controls,
:root[data-theme="dark"] .landing-page .explorer-controls,
:root[data-theme="dark"] .landing-page .realtime-showcase,
:root[data-theme="dark"] .landing-page .observability-mock,
:root[data-theme="dark"] .landing-page .route-cell,
:root[data-theme="dark"] .landing-page .playground-stats,
:root[data-theme="dark"] .landing-page .wallet-overview {
  border-color: var(--landing-border);
  background: var(--landing-surface);
  color: var(--landing-text);
}

:root[data-theme="dark"] .landing-page .btn-secondary,
:root[data-theme="dark"] .landing-page .btn-ghost,
:root[data-theme="dark"] .landing-page .network-search,
:root[data-theme="dark"] .landing-page .dark-field {
  border-color: var(--landing-border-strong);
  background: #131e33;
  color: var(--landing-text);
}

:root[data-theme="dark"] .landing-page .status,
:root[data-theme="dark"] .landing-page .network-health,
:root[data-theme="dark"] .landing-page .auth-context-foot {
  border-color: #285449;
  background: #102d2a;
  color: #78e5b7;
}

:root[data-theme="dark"] .landing-page .dark-section,
:root[data-theme="dark"] .landing-page .gateway-stage,
:root[data-theme="dark"] .landing-page .code-window {
  background: #080d18;
}

:root[data-theme="dark"] .public-page .subpage-hero,
:root[data-theme="dark"] .public-page .subpage-card,
:root[data-theme="dark"] .public-page .network-card,
:root[data-theme="dark"] .public-page .console-card,
:root[data-theme="dark"] .public-page .doc-sidebar .route-cell {
  border-color: var(--color-border);
  background: var(--color-surface);
  color: var(--color-text);
}

:root[data-theme="dark"] .auth-context {
  border-color: var(--color-border);
  background: #0d1526;
}

:root[data-theme="dark"] .auth-context::after {
  background:
    linear-gradient(90deg, #0d1526 0%, rgb(13 21 38 / 0.94) 48%, rgb(13 21 38 / 0.38) 100%),
    linear-gradient(180deg, transparent 62%, #0d1526 100%);
}

:root[data-theme="dark"] .auth-copy > p:not(.auth-kicker),
:root[data-theme="dark"] .auth-back,
:root[data-theme="dark"] .auth-legal,
:root[data-theme="dark"] .check-field {
  color: var(--color-muted) !important;
}

:root[data-theme="dark"] .auth-card,
:root[data-theme="dark"] .auth-card .field,
:root[data-theme="dark"] .auth-network-row img {
  border-color: var(--color-border);
  background: var(--color-surface);
  color: var(--color-text);
}

:root[data-theme="dark"] .console-shell,
:root[data-theme="dark"] .console-main,
:root[data-theme="dark"] .content {
  background: var(--color-bg);
}

:root[data-theme="dark"] .kpi-card,
:root[data-theme="dark"] .console-card,
:root[data-theme="dark"] .table-wrap,
:root[data-theme="dark"] .drawer,
:root[data-theme="dark"] .network-card,
:root[data-theme="dark"] .route-cell,
:root[data-theme="dark"] .endpoint-box,
:root[data-theme="dark"] .playground-stats,
:root[data-theme="dark"] .console-user {
  border-color: var(--color-border);
  background: var(--color-surface);
  color: var(--color-text);
}

:root[data-theme="dark"] .route-cell:hover,
:root[data-theme="dark"] button.route-cell:hover {
  border-color: #4a6092;
  background: #192842;
  color: #a8b9ff;
}

:root[data-theme="dark"] .nav-group-title,
:root[data-theme="dark"] .topbar .fine-print,
:root[data-theme="dark"] .console-user > i,
:root[data-theme="dark"] .playground-stats span,
:root[data-theme="dark"] .console-card > label,
:root[data-theme="dark"] .form-stack label {
  color: var(--color-muted);
}

:root[data-theme="dark"] th,
:root[data-theme="dark"] td,
:root[data-theme="dark"] .playground-stats span,
:root[data-theme="dark"] .sidebar-bottom,
:root[data-theme="dark"] .console-user {
  border-color: var(--color-border);
}

@media (max-width: 540px) {
  .brand-logo {
    width: 128px;
    max-height: 34px;
  }

  :root[data-theme="dark"] .brand:has(.brand-logo) {
    padding: 3px 6px;
  }
}