/*
 * OrbitalysEngine Application Theme
 * Version: 2.0.0
 * Derived from: Orbitalys Visual System for RC2
 *
 * This is the complete application theme overlay. Load it after
 * overview-flow.css, mission-discovery.css, and styles.css. The existing
 * data-theme value on the html element remains the theme authority.
 *
 * The overlay deliberately preserves layout-critical dimensions and class
 * names used by application behavior. It supplies the Orbitalys visual
 * system to the current shell and every routed feature while retaining the
 * orb-prefixed component API for new UI.
 */

/* Foundation and compatibility tokens */

:root,
:root[data-theme="dark"],
.dark {
  color-scheme: dark;

  --background: #06100e;
  --foreground: #edf7f3;
  --card: #0a1513;
  --card-foreground: #edf7f3;
  --popover: #0a1513;
  --popover-foreground: #edf7f3;
  --primary: #86efc5;
  --primary-foreground: #04100d;
  --secondary: #10211d;
  --secondary-foreground: #edf7f3;
  --muted: #10211d;
  --muted-foreground: #8ca49d;
  --accent: #16322b;
  --accent-foreground: #edf7f3;
  --destructive: #ff6b67;
  --border: rgba(187, 226, 214, 0.14);
  --input: rgba(187, 226, 214, 0.16);
  --ring: #86efc5;

  --orb-page: #06100e;
  --orb-page-alt: #081512;
  --orb-page-deep: #040b09;
  --orb-surface: #0a1714;
  --orb-surface-elevated: #0d1d19;
  --orb-surface-active: #10251f;
  --orb-ink: #f1f8f5;
  --orb-ink-soft: #b0c3bd;
  --orb-ink-muted: #718a82;
  --orb-line: rgba(181, 221, 208, 0.14);
  --orb-line-strong: rgba(181, 221, 208, 0.24);
  --orb-mint: #86efc5;
  --orb-mint-bright: #a8ffda;
  --orb-cyan: #68bad9;
  --orb-red: #ff6965;
  --orb-amber: #f2c866;
  --orb-green: #6ce1a8;
  --orb-blue: #68bad9;
  --orb-shadow: 0 30px 90px rgba(0, 0, 0, 0.38);
  --orb-shadow-card: 0 18px 50px rgba(0, 0, 0, 0.24);
  --orb-focus: 0 0 0 3px rgba(134, 239, 197, 0.16);
  --orb-glow: 0 0 34px rgba(134, 239, 197, 0.1);

  /* This application intentionally ships only its governed Avenir faces. */
  --orb-font-sans: "Avenir";
  --orb-font-mono: "Avenir";
  --orb-weight-regular: 400;
  --orb-weight-medium: 500;
  --orb-weight-semibold: 600;
  --orb-weight-bold: 700;
  --orb-radius-xs: 3px;
  --orb-radius-sm: 5px;
  --orb-radius-md: 8px;
  --orb-radius-lg: 12px;
  --orb-header-height: 64px;
  --orb-sidebar-width: 256px;
  --orb-content-max: 1400px;

  /* Existing application vocabulary mapped to the new visual system. */
  --base-950: var(--orb-page);
  --base-900: var(--orb-page-deep);
  --base-850: var(--orb-surface);
  --base-800: var(--orb-surface-elevated);
  --base-750: var(--orb-surface-active);
  --base-700: color-mix(in srgb, var(--orb-surface-active) 72%, var(--orb-ink-muted));
  --border-default: var(--orb-line-strong);
  --text-primary: var(--orb-ink);
  --text-secondary: var(--orb-ink-muted);
  --accent-teal: var(--orb-mint);
  --accent-cyan: var(--orb-cyan);
  --accent-cyan-light: var(--orb-mint-bright);
  --critical-500: var(--orb-red);
  --critical-700: color-mix(in srgb, var(--orb-red) 16%, var(--orb-page));
  --bg: var(--orb-page);
  --surface: var(--orb-surface);
  --surface-raised: var(--orb-surface-elevated);
  --surface-soft: var(--orb-surface-active);
  --line: var(--orb-line);
  --line-strong: var(--orb-line-strong);
  --text: var(--orb-ink);
  --muted: var(--orb-ink-muted);
  --muted-strong: var(--orb-ink-soft);
  --accent: var(--orb-mint);
  --accent-strong: var(--orb-mint-bright);
  --accent-soft: rgba(134, 239, 197, 0.12);
  --warning: var(--orb-amber);
  --danger: var(--orb-red);
  --success: var(--orb-green);
  --info: var(--orb-cyan);
  --select-popup-bg: var(--orb-surface-elevated);
  --select-popup-text: var(--orb-ink);
  --select-popup-muted: var(--orb-ink-muted);
  --radius: var(--orb-radius-md);
  --shadow: var(--orb-shadow-card);
  --motion-micro: 100ms;
  --motion-component: 180ms;
  --motion-overlay: 240ms;
  --api-get: var(--orb-cyan);
  --api-write: var(--orb-amber);
  --api-delete: var(--orb-red);
}

/* Arclite's slate-blue surfaces sit above the near-black green palette.
 * Semantic risk colors remain distinct from the blue interaction accent. */
:root[data-theme="arclite"],
:root[data-theme="arclite"] .dark {
  color-scheme: dark;
  --background: #193245;
  --foreground: #edf4fc;
  --card: #203b50;
  --card-foreground: #edf4fc;
  --popover: #27465d;
  --popover-foreground: #edf4fc;
  --primary: #8dccff;
  --primary-foreground: #102a3d;
  --secondary: #294c65;
  --secondary-foreground: #edf4fc;
  --muted-foreground: #adbed0;
  --accent-foreground: #edf4fc;
  --destructive: #ff8b86;
  --border: #47647a;
  --input: #5b7c95;
  --ring: #8dccff;
  --orb-page: #193245;
  --orb-page-alt: #1c3549;
  --orb-page-deep: #162e40;
  --orb-surface: #203b50;
  --orb-surface-elevated: #27465d;
  --orb-surface-active: #294c65;
  --orb-ink: #edf4fc;
  --orb-ink-soft: #c2d2e1;
  --orb-ink-muted: #adbed0;
  --orb-line: #47647a;
  --orb-line-strong: #5b7c95;
  --orb-mint: #8dccff;
  --orb-mint-bright: #b5dfff;
  --orb-cyan: #8cd5ec;
  --orb-blue: #8dccff;
  --orb-red: #ff8b86;
  --orb-amber: #f0cc7c;
  --orb-green: #8bdfb6;
  --orb-shadow: 0 24px 64px rgba(10, 26, 39, 0.25);
  --orb-shadow-card: 0 12px 30px rgba(10, 26, 39, 0.18);
  --orb-focus: 0 0 0 3px rgba(141, 204, 255, 0.22);
  --orb-glow: 0 0 24px rgba(141, 204, 255, 0.08);
  --accent-soft: rgba(141, 204, 255, 0.12);
}

:root[data-theme="light"],
.light {
  color-scheme: light;

  --background: #f1f5f2;
  --foreground: #071510;
  --card: #ffffff;
  --card-foreground: #071510;
  --popover: #ffffff;
  --popover-foreground: #071510;
  --primary: #0b765c;
  --primary-foreground: #ffffff;
  --secondary: #e8f0ec;
  --secondary-foreground: #071510;
  --muted: #e8f0ec;
  --muted-foreground: #405c53;
  --accent: #dcebe5;
  --accent-foreground: #071510;
  --destructive: #d44843;
  --border: rgba(13, 55, 43, 0.2);
  --input: rgba(13, 55, 43, 0.26);
  --ring: #0b765c;

  --orb-page: #f1f5f2;
  --orb-page-alt: #eaf1ed;
  --orb-page-deep: #e3ece7;
  --orb-surface: #ffffff;
  --orb-surface-elevated: #f8fbf9;
  --orb-surface-active: #e6f2ec;
  --orb-ink: #071510;
  --orb-ink-soft: #29483f;
  --orb-ink-muted: #526a62;
  --orb-line: rgba(13, 55, 43, 0.2);
  --orb-line-strong: rgba(13, 55, 43, 0.34);
  --orb-mint: #0f8b69;
  --orb-mint-bright: #0b765c;
  --orb-cyan: #277d9d;
  --orb-red: #c63d39;
  --orb-amber: #916b12;
  --orb-green: #08724f;
  --orb-blue: #277d9d;
  --orb-shadow: 0 28px 80px rgba(24, 55, 46, 0.14);
  --orb-shadow-card: 0 16px 42px rgba(24, 55, 46, 0.1);
  --orb-focus: 0 0 0 3px rgba(15, 139, 105, 0.14);
  --orb-glow: 0 0 34px rgba(15, 139, 105, 0.08);

  --base-950: var(--orb-page);
  --base-900: var(--orb-surface);
  --base-850: var(--orb-surface-elevated);
  --base-800: var(--orb-page-alt);
  --base-750: var(--orb-surface-active);
  --base-700: color-mix(in srgb, var(--orb-page-deep) 72%, var(--orb-ink-muted));
  --border-default: var(--orb-line-strong);
  --text-primary: var(--orb-ink);
  --text-secondary: var(--orb-ink-muted);
  --accent-teal: var(--orb-mint);
  --accent-cyan: var(--orb-cyan);
  --accent-cyan-light: var(--orb-mint-bright);
  --critical-500: var(--orb-red);
  --critical-700: color-mix(in srgb, var(--orb-red) 10%, var(--orb-surface));
  --bg: var(--orb-page);
  --surface: var(--orb-surface);
  --surface-raised: var(--orb-surface-elevated);
  --surface-soft: var(--orb-surface-active);
  --line: var(--orb-line);
  --line-strong: var(--orb-line-strong);
  --text: var(--orb-ink);
  --muted: var(--orb-ink-muted);
  --muted-strong: var(--orb-ink-soft);
  --accent: var(--orb-mint);
  --accent-strong: var(--orb-mint-bright);
  --accent-soft: rgba(15, 139, 105, 0.1);
  --warning: var(--orb-amber);
  --danger: var(--orb-red);
  --success: var(--orb-green);
  --info: var(--orb-cyan);
  --select-popup-bg: var(--orb-surface);
  --select-popup-text: var(--orb-ink);
  --select-popup-muted: var(--orb-ink-muted);
}

/* Document, focus, and type */

html {
  min-width: 320px;
  background: var(--orb-page);
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  background:
    radial-gradient(circle at 82% 3%, rgba(134, 239, 197, 0.055), transparent 30rem),
    var(--orb-page);
  color: var(--orb-ink);
  font-family: var(--orb-font-sans);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  transition: background-color 180ms ease, color 180ms ease;
}

#app,
.orb-app {
  min-height: 100vh;
  background: transparent;
  color: var(--orb-ink);
}

button,
input,
select,
textarea {
  font: inherit;
}

a {
  color: inherit;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--orb-mint);
  outline-offset: 3px;
}

::selection {
  background: var(--orb-mint);
  color: var(--primary-foreground);
}

.muted,
.orb-muted {
  color: var(--orb-ink-muted);
}

.mono,
.orb-mono {
  font-family: var(--orb-font-mono);
  font-variant-numeric: tabular-nums;
}

.eyebrow,
.orb-eyebrow {
  color: var(--orb-mint);
  font-family: var(--orb-font-mono);
  font-size: 0.625rem;
  font-weight: var(--orb-weight-semibold);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.page-head h1,
.orb-page-title {
  color: var(--orb-ink);
  font-weight: 500;
  letter-spacing: -0.045em;
  line-height: 1.06;
  text-shadow: none;
}

.section-heading h2,
.orb-section-title {
  color: var(--orb-ink);
  font-weight: 500;
  letter-spacing: -0.025em;
}

.page-head > div > p:not(.eyebrow),
.section-heading > p,
.orb-lead,
.orb-body {
  color: var(--orb-ink-soft);
}

/* Application frame and authenticated navigation */

.shell,
.orb-app-frame {
  background:
    radial-gradient(circle at 80% 0, rgba(134, 239, 197, 0.045), transparent 34rem),
    radial-gradient(circle at 25% 100%, rgba(104, 186, 217, 0.035), transparent 40rem),
    var(--orb-page);
}

.sidebar,
.orb-sidebar {
  border-color: var(--orb-line);
  background: color-mix(in srgb, var(--orb-page-deep) 94%, transparent);
  color: var(--orb-ink-soft);
  box-shadow: 14px 0 44px rgba(0, 0, 0, 0.14);
}

.sidebar::before {
  opacity: 0.022;
  filter: sepia(1) saturate(0.6) hue-rotate(100deg);
}

.sidebar-brand {
  border-bottom-color: var(--orb-line);
}

.sidebar-brand .brand-wordmark,
.orb-brand {
  color: var(--orb-ink);
  text-shadow: none;
}

.nav-label,
.orb-sidebar-label,
.context-label {
  color: var(--orb-ink-muted);
  font-family: var(--orb-font-mono);
  font-weight: var(--orb-weight-semibold);
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.nav-link,
.nav-child-link,
.orb-sidebar-link {
  border: 1px solid transparent;
  color: var(--orb-ink-soft);
  font-weight: var(--orb-weight-medium);
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

.nav-link:hover,
.nav-child-link:hover,
.orb-sidebar-link:hover {
  border-color: var(--orb-line);
  background: var(--orb-surface);
  color: var(--orb-ink);
}

.nav-link[aria-current="page"],
.nav-child-link[aria-current="page"],
.orb-sidebar-link[aria-current="page"],
.orb-sidebar-link.is-active {
  border-color: var(--orb-line);
  background: var(--orb-surface-active);
  color: var(--orb-mint);
  box-shadow: inset 2px 0 var(--orb-mint);
}

.nav-children {
  box-shadow: inset 1px 0 var(--orb-line-strong);
}

.nav-disclosure {
  color: var(--orb-ink-muted);
}

.nav-disclosure:hover {
  background: var(--orb-surface);
  color: var(--orb-mint);
}

.sidebar-foot {
  border-color: var(--orb-line);
  background: transparent;
  color: var(--orb-ink-muted);
  box-shadow: none;
}

.topbar,
.orb-header {
  border-color: var(--orb-line);
  background: color-mix(in srgb, var(--orb-page) 88%, transparent);
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.13);
  backdrop-filter: blur(18px);
}

.context-select,
.vertical-select,
.global-search,
.theme-toggle {
  border-color: var(--orb-line-strong);
  background: var(--orb-surface-elevated);
  color: var(--orb-ink-soft);
  box-shadow: none;
}

.context-select:hover,
.vertical-select:hover,
.global-search:hover,
.theme-toggle:hover {
  border-color: color-mix(in srgb, var(--orb-mint) 58%, var(--orb-line-strong));
  color: var(--orb-ink);
}

.theme-toggle::after,
.account-menu {
  border-color: var(--orb-line-strong);
  background: var(--orb-surface-elevated);
  color: var(--orb-ink);
  box-shadow: var(--orb-shadow-card);
}

.theme-toggle[data-theme-state="orbitalys"],
.theme-toggle[data-theme-state="arclite"] {
  border-color: color-mix(in srgb, var(--orb-mint) 54%, var(--orb-line-strong));
  color: var(--orb-mint);
  box-shadow: var(--orb-glow);
}

.theme-toggle[data-theme-state="light"] {
  border-color: var(--orb-line-strong);
  color: var(--orb-ink);
}

.account-menu-trigger {
  border-color: transparent;
  color: var(--orb-ink-soft);
}

.account-menu-trigger:hover,
.account-menu-trigger[aria-expanded="true"] {
  border-color: var(--orb-line);
  background: var(--orb-surface-active);
  color: var(--orb-ink);
}

.account-menu-summary,
.account-menu-item {
  border-color: var(--orb-line);
}

.account-menu-item:hover,
.command-result:hover,
.command-result.selected {
  background: var(--orb-surface-active);
  color: var(--orb-ink);
}

.avatar {
  background: var(--orb-mint);
  color: var(--primary-foreground);
  box-shadow: 0 8px 22px rgba(134, 239, 197, 0.15);
}

.mobile-bottom-navigation {
  border-color: var(--orb-line);
  background: color-mix(in srgb, var(--orb-page-deep) 92%, transparent);
  box-shadow: 0 -14px 36px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(18px);
}

.mobile-nav-link {
  color: var(--orb-ink-muted);
}

.mobile-nav-link[aria-current="page"] {
  color: var(--orb-mint);
}

.orb-page {
  width: min(var(--orb-content-max), 100%);
}

.orb-main {
  min-width: 0;
  background: var(--orb-page);
}

.application-footer,
.login-footer {
  color: var(--orb-ink-muted);
}

/* Authentication and boot surfaces */

.boot-screen,
.login-screen {
  background:
    radial-gradient(circle at 82% 3%, rgba(134, 239, 197, 0.07), transparent 31rem),
    linear-gradient(rgba(181, 221, 208, 0.022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(181, 221, 208, 0.022) 1px, transparent 1px),
    var(--orb-page);
  background-attachment: fixed;
  background-size: auto, 48px 48px, 48px 48px, auto;
}

.login-screen {
  gap: 1.25rem;
  padding: clamp(1rem, 4vw, 3rem);
  --orb-ink-muted: #8ca49d;
}

.login-frame {
  width: min(1000px, 100%);
  grid-template-columns: minmax(0, .92fr) minmax(390px, 1.08fr);
  border: 1px solid var(--orb-line-strong);
  border-radius: var(--orb-radius-lg);
  background: var(--orb-surface);
  box-shadow: var(--orb-shadow-card);
  backdrop-filter: none;
}

.login-story {
  min-height: 640px;
  padding: clamp(2rem, 5vw, 4rem);
  background:
    radial-gradient(circle at 50% 38%, rgba(134, 239, 197, 0.07), transparent 36%),
    var(--orb-page-alt);
}

.login-brand {
  width: 100%;
  gap: 1.5rem;
}

.login-brand .brand-logo {
  width: min(230px, 75%);
  height: 230px;
  opacity: .075;
  filter: invert(1) drop-shadow(0 22px 32px rgba(0, 0, 0, .48));
}

.login-brand .brand-wordmark {
  font-size: clamp(2.2rem, 4vw, 3rem);
  letter-spacing: 0;
  white-space: nowrap;
}

.login-brand .brand-wordmark strong {
  font-weight: 900;
}

.login-brand .wordmark-engine {
  color: var(--orb-ink-soft);
}

.login-brand .brand-copyright {
  color: var(--orb-ink-muted);
  opacity: 1;
  font-size: .85rem;
}

.login-action {
  min-height: 640px;
  padding: 3rem clamp(2rem, 5vw, 4rem);
  border-left: 1px solid var(--orb-line);
  background: var(--orb-surface);
  text-shadow: none;
}

.login-action > .eyebrow {
  margin-bottom: 1rem;
  color: var(--orb-mint);
  font-size: .66rem;
  font-weight: 700;
  line-height: 1.2rem;
  letter-spacing: .16em;
  text-transform: uppercase;
}

#app .login-action h2 {
  font-size: clamp(1.65rem, 3vw, 2.1rem);
  font-weight: 400;
  line-height: 1.18;
  letter-spacing: -.04em;
}

.login-action .button.primary {
  min-height: 44px;
  font-weight: 900;
}

.login-brand-copy {
  gap: 1.5rem;
  color: var(--orb-ink);
  text-shadow: none;
}

.login-release {
  color: var(--orb-ink-muted);
  opacity: 1;
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.login-footer {
  width: min(1000px, 100%);
  opacity: .62;
  font-size: .68rem;
}

.brand-logo {
  filter: brightness(0) saturate(100%) invert(91%) sepia(19%) saturate(698%) hue-rotate(95deg) brightness(104%) contrast(91%);
}

/* Buttons and action controls */

.button,
.orb-button,
.icon-control,
.graph-control {
  border: 1px solid var(--orb-line-strong);
  border-radius: var(--orb-radius-sm);
  background: var(--orb-surface);
  color: var(--orb-ink);
  box-shadow: none;
  font-weight: var(--orb-weight-semibold);
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.button:hover,
.orb-button:hover,
.icon-control:hover,
.graph-control:hover {
  border-color: var(--orb-mint);
  background: var(--orb-surface-active);
  color: var(--orb-mint);
}

.button.primary,
.orb-button-primary,
.segmented-control .button.active,
.graph-group-menu[open] > summary {
  border-color: color-mix(in srgb, var(--orb-mint) 72%, transparent);
  background: var(--orb-mint);
  color: var(--primary-foreground);
  box-shadow: 0 8px 28px rgba(134, 239, 197, 0.13);
}

.button.primary:hover,
.orb-button-primary:hover {
  border-color: var(--orb-mint-bright);
  background: var(--orb-mint-bright);
  color: var(--primary-foreground);
  transform: translateY(-1px);
}

.button.ghost,
.orb-button-quiet {
  border-color: transparent;
  background: transparent;
  color: var(--orb-ink-soft);
}

.button.danger,
.orb-button-danger {
  border-color: color-mix(in srgb, var(--orb-red) 42%, transparent);
  background: color-mix(in srgb, var(--orb-red) 10%, transparent);
  color: var(--orb-red);
}

.button.small,
.orb-button-small {
  min-height: 34px;
  font-size: 0.75rem;
}

.button:disabled,
.orb-button:disabled {
  cursor: not-allowed;
  opacity: 0.52;
  transform: none;
}

.button.actionable-report-action {
  border-color: color-mix(in srgb, var(--orb-mint) 68%, transparent);
  background: linear-gradient(120deg, var(--orb-mint), color-mix(in srgb, var(--orb-mint) 66%, var(--orb-cyan)));
  color: var(--primary-foreground);
  box-shadow: 0 0 0 1px rgba(168, 255, 218, 0.34), 0 12px 30px rgba(0, 0, 0, 0.24);
}

.button.actionable-report-action:hover {
  background: linear-gradient(120deg, var(--orb-mint-bright), color-mix(in srgb, var(--orb-mint-bright) 72%, var(--orb-cyan)));
  color: var(--primary-foreground);
}

/* Forms, filters, and toolbar controls */

.field input,
.field select,
.field textarea,
.filter-bar input,
.filter-bar select,
.provider-select,
.snapshot-control select,
.graph-toolbar input,
.graph-toolbar select,
.api-filter-bar input,
.api-filter-bar select,
.sve-global-search input,
.sve-page-size select,
.sve-column-filters input,
.standards-policy-select select,
.orb-input,
.orb-select,
.orb-textarea {
  border: 1px solid var(--orb-line-strong);
  border-radius: var(--orb-radius-sm);
  background: var(--orb-surface-elevated);
  color: var(--orb-ink);
  box-shadow: none;
  outline: 0;
  transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.field input:hover,
.field select:hover,
.field textarea:hover,
.filter-bar input:hover,
.filter-bar select:hover,
.provider-select:hover,
.snapshot-control select:hover,
.graph-toolbar input:hover,
.graph-toolbar select:hover,
.api-filter-bar input:hover,
.api-filter-bar select:hover,
.sve-global-search input:hover,
.sve-page-size select:hover,
.sve-column-filters input:hover,
.standards-policy-select select:hover,
.orb-input:hover,
.orb-select:hover,
.orb-textarea:hover {
  border-color: color-mix(in srgb, var(--orb-mint) 42%, var(--orb-line-strong));
}

.field input:focus,
.field select:focus,
.field textarea:focus,
.filter-bar input:focus,
.filter-bar select:focus,
.provider-select:focus,
.snapshot-control select:focus,
.graph-toolbar input:focus,
.graph-toolbar select:focus,
.api-filter-bar input:focus,
.api-filter-bar select:focus,
.sve-global-search input:focus,
.sve-page-size select:focus,
.sve-column-filters input:focus,
.standards-policy-select select:focus,
.orb-input:focus,
.orb-select:focus,
.orb-textarea:focus {
  border-color: var(--orb-mint);
  box-shadow: var(--orb-focus);
}

.field label,
.orb-label {
  color: var(--orb-ink-soft);
  font-weight: var(--orb-weight-semibold);
}

.field-hint,
.orb-help {
  color: var(--orb-ink-muted);
}

.orb-error,
[aria-invalid="true"] + .field-hint {
  color: var(--orb-red);
}

select,
select option,
select optgroup {
  background-color: var(--select-popup-bg) !important;
  color: var(--select-popup-text) !important;
  -webkit-text-fill-color: var(--select-popup-text);
}

/* Shared cards, panels, and metrics */

.card,
.decision-lens,
.finding-hero,
.architecture-frame,
.decision-journey,
.lineage-strip,
.state-panel,
.discovery-panel,
.provider-selector,
.mission-quality,
.orb-card,
.orb-inspector {
  border: 1px solid var(--orb-line);
  border-radius: var(--orb-radius-md);
  background: var(--orb-surface);
  color: var(--orb-ink);
  box-shadow: none;
}

.card:hover,
.orb-card-interactive:hover {
  border-color: color-mix(in srgb, var(--orb-mint) 35%, var(--orb-line));
}

.orb-card-elevated,
.decision-lens.emphasis,
.state-panel,
.provider-selector {
  border-color: var(--orb-line-strong);
  background: var(--orb-surface-elevated);
  box-shadow: var(--orb-shadow-card);
}

.card-head,
.orb-card-header,
.mission-section-head,
.visualization-head,
.discovery-panel-head {
  border-color: var(--orb-line);
  background: linear-gradient(90deg, rgba(134, 239, 197, 0.035), transparent 48%);
}

.card-head h2,
.orb-card-title {
  color: var(--orb-ink);
  font-weight: var(--orb-weight-semibold);
}

.card-head p,
.metric-label,
.metric-note,
.metric-source {
  color: var(--orb-ink-muted);
}

.metric,
.orb-metric {
  border-color: var(--orb-line);
  background: var(--orb-surface-elevated);
  box-shadow: inset 0 2px color-mix(in srgb, var(--orb-mint) 70%, transparent);
}

.metric-value,
.orb-metric-value {
  color: var(--orb-ink);
  font-weight: var(--orb-weight-semibold);
  letter-spacing: -0.035em;
  text-shadow: none;
}

.signal,
.orb-status-dot {
  background: currentColor;
  box-shadow: 0 0 12px currentColor;
}

.action-item,
.path-steps li,
.evidence-record,
.progress-item,
.finding-summary,
.system-service,
.runtime-boundary,
.region-scope,
.job-progress,
.authorization-check,
.sve-inspector-section,
.sve-score-axis {
  border-color: var(--orb-line);
  background: color-mix(in srgb, var(--orb-surface-elevated) 92%, transparent);
  box-shadow: none;
}

.decision-lens.emphasis {
  box-shadow: inset 0 2px var(--orb-mint), var(--orb-shadow-card);
}

/* Badges, authority, and state semantics */

.badge,
.authority-label,
.permission-chip,
.orb-badge {
  border-color: var(--orb-line-strong);
  background: var(--orb-surface-elevated);
  color: var(--orb-ink-soft);
}

.authority-label.local,
.badge.success,
.badge.active,
.badge.succeeded,
.badge.passed,
.badge.ready,
.badge.current,
.badge.registered,
.badge.candidate,
.badge.pass,
.badge.automatic,
.badge.implemented,
.badge.accepted,
.badge.validated,
.orb-badge-success {
  border-color: color-mix(in srgb, var(--orb-green) 42%, transparent);
  background: color-mix(in srgb, var(--orb-green) 9%, transparent);
  color: var(--orb-green);
}

.badge.info,
.badge.observed,
.orb-badge-info {
  border-color: color-mix(in srgb, var(--orb-cyan) 42%, transparent);
  background: color-mix(in srgb, var(--orb-cyan) 9%, transparent);
  color: var(--orb-cyan);
}

.badge.warning,
.badge.pending,
.badge.provisioning,
.badge.requested,
.badge.running,
.badge.notassessed,
.badge.manual,
.badge.hybrid,
.badge.placeholder,
.badge.planned,
.authority-label.stale,
.orb-badge-warning {
  border-color: color-mix(in srgb, var(--orb-amber) 42%, transparent);
  background: color-mix(in srgb, var(--orb-amber) 9%, transparent);
  color: var(--orb-amber);
}

.badge.danger,
.badge.failed,
.badge.suspended,
.badge.revoked,
.badge.deleted,
.badge.rejected,
.badge.fail,
.authority-label.permission,
.authority-label.unavailable,
.orb-badge-danger {
  border-color: color-mix(in srgb, var(--orb-red) 42%, transparent);
  background: color-mix(in srgb, var(--orb-red) 9%, transparent);
  color: var(--orb-red);
}

.state-banner,
.authority-banner,
.sve-context-banner,
.standards-policy-banner {
  border-color: var(--orb-line-strong);
  background: var(--orb-page-alt);
  box-shadow: none;
}

.state-banner.partial,
.state-banner.stale,
.authority-banner.synthetic,
.manual-boundary,
.standards-disclaimer {
  border-color: color-mix(in srgb, var(--orb-amber) 36%, transparent);
  background: color-mix(in srgb, var(--orb-amber) 8%, var(--orb-surface));
  color: var(--orb-amber);
}

.state-banner.permission,
.authority-banner.unavailable {
  border-color: color-mix(in srgb, var(--orb-red) 36%, transparent);
  background: color-mix(in srgb, var(--orb-red) 8%, var(--orb-surface));
  color: var(--orb-red);
}

.empty,
.mission-empty,
.command-empty,
.search-empty,
.graph-inspector-empty,
.orb-empty {
  border-color: var(--orb-line-strong);
  background: var(--orb-page-alt);
  color: var(--orb-ink-muted);
}

/* Tabs, toolbars, and tables */

.section-tabs,
.orb-tabs,
.orb-toolbar,
.filter-bar,
.graph-toolbar,
.api-filter-bar,
.executive-report-toolbar {
  border-color: var(--orb-line);
  background: var(--orb-page-alt);
  box-shadow: none;
}

.section-tab,
.orb-tab {
  border-color: transparent;
  background: transparent;
  color: var(--orb-ink-muted);
}

.section-tab:hover,
.orb-tab:hover {
  color: var(--orb-ink);
}

.section-tab[aria-current="page"],
.orb-tab[aria-selected="true"],
.orb-tab.is-active {
  border-color: var(--orb-line-strong);
  background: var(--orb-surface-elevated);
  color: var(--orb-ink);
  box-shadow: inset 0 -2px var(--orb-mint);
}

.table-wrap,
.sve-table-wrap,
.orb-table-wrap {
  border-color: var(--orb-line);
  background: var(--orb-surface);
  scrollbar-color: var(--orb-line-strong) transparent;
}

table,
.orb-table {
  color: var(--orb-ink-soft);
}

th,
.orb-table th {
  border-color: var(--orb-line-strong);
  background: var(--orb-page-alt);
  color: var(--orb-ink-muted);
  font-family: var(--orb-font-mono);
}

td,
.orb-table td {
  border-color: var(--orb-line);
}

tbody tr:hover,
.sve-inspectable-row:hover,
.orb-table tbody tr:hover {
  background: color-mix(in srgb, var(--orb-mint) 4%, transparent);
}

.clickable-row:focus-visible,
.sve-inspectable-row:focus-visible {
  outline-color: var(--orb-mint);
  outline-offset: -3px;
}

/* Dialogs, command palette, account overlays, and notifications */

dialog,
.command-palette,
.mission-dialog,
.orb-dialog,
.orb-popover {
  border-color: var(--orb-line-strong);
  border-radius: var(--orb-radius-md);
  background: var(--orb-surface-elevated);
  color: var(--orb-ink);
  box-shadow: var(--orb-shadow);
}

dialog::backdrop,
.mission-dialog-backdrop,
.orb-dialog-backdrop {
  background: rgba(2, 8, 6, 0.74);
  backdrop-filter: blur(5px);
}

.dialog-head,
.dialog-actions,
.command-head,
.command-foot {
  border-color: var(--orb-line);
  background: var(--orb-surface);
}

.command-search,
.command-result,
.command-result-meta,
.command-result-icon {
  border-color: var(--orb-line);
  background: var(--orb-surface-elevated);
}

.toast {
  border-color: var(--orb-line-strong);
  background: var(--orb-surface-elevated);
  color: var(--orb-ink);
  box-shadow: var(--orb-shadow-card);
}

.toast.success {
  box-shadow: inset 3px 0 var(--orb-green), var(--orb-shadow-card);
}

.toast.danger {
  box-shadow: inset 3px 0 var(--orb-red), var(--orb-shadow-card);
}

/* Discovery, integrations, administration, decisions, and evidence */

.discovery-workbench,
.discovery-layout,
.administration-workspace,
.operational-stack,
.integration-catalog,
.decision-history,
.evidence-list {
  color: var(--orb-ink);
}

.discovery-side,
.discovery-status,
.integration-actions-card,
.membership-management,
.selected-authority,
.authorization-summary,
.operations-identity {
  border-color: var(--orb-line);
  background: var(--orb-surface);
}

.provider-selector,
.discovery-panel,
.integration-actions-card {
  box-shadow: var(--orb-shadow-card);
}

.region-option,
.permission-chip,
.recorded-action,
.decision-stage,
.evidence-gap {
  border-color: var(--orb-line);
  background: var(--orb-surface-elevated);
}

.decision-stage-number,
.decision-history-marker {
  border-color: var(--orb-mint);
  background: var(--orb-mint);
  color: var(--primary-foreground);
}

.lineage-strip span,
.permission-chip,
.request-id {
  color: var(--orb-mint);
}

.distribution-row meter,
.distribution-row meter::-webkit-meter-bar {
  background: var(--orb-page-alt);
}

.distribution-row meter::-webkit-meter-optimum-value,
.distribution-row meter::-moz-meter-bar {
  background: linear-gradient(90deg, var(--orb-mint), var(--orb-cyan));
}

.job-progress-track,
.mission-progress-track {
  border-color: var(--orb-line);
  background: var(--orb-page-alt);
}

.job-progress-track i,
.mission-progress-track > span {
  background: linear-gradient(90deg, var(--orb-mint), var(--orb-mint-bright));
}

/* Findings, standards, and inspectors */

.finding-hero,
.finding-explanation,
.sve-context-banner,
.standards-policy-banner,
.sve-inspector-dialog {
  border-color: var(--orb-line-strong);
}

.sve-scope-banner .mono,
.sve-context-copy .mono,
.standards-policy-banner .mono,
.sve-global-search > span,
.sve-page-size > span,
.standards-policy-select > span {
  color: var(--orb-ink-muted);
}

.sve-semantic-entity,
.sve-semantic-relationship,
.finding-detail-grid > *,
.sve-score-axis {
  border-color: var(--orb-line);
  background: var(--orb-page-alt);
}

.sve-score-value,
.finding-hero strong {
  color: var(--orb-mint);
}

.sve-inspector-json,
.api-example pre,
.doc-code {
  border-color: var(--orb-line);
  background: var(--orb-page-deep);
  color: var(--orb-ink-soft);
  font-family: var(--orb-font-mono);
}

/* API and Orbitalys documentation */

.api-documentation,
.orbitalys-documentation {
  --doc-surface: var(--orb-surface);
  --doc-surface-quiet: var(--orb-page-alt);
  --doc-line: var(--orb-line);
  color: var(--orb-ink);
}

.api-reference-card,
.api-contract-block,
.api-endpoint,
.doc-navigation,
.doc-section,
.doc-callout,
.doc-diagram,
.doc-flow-stage,
.doc-table {
  border-color: var(--orb-line);
  background: var(--orb-surface);
  box-shadow: none;
}

.api-endpoint[open],
.doc-section {
  background: var(--orb-surface-elevated);
}

.api-contract-meta div,
.api-filter-bar,
.doc-callout,
.doc-flow-stage,
.doc-diagram,
.doc-table {
  background: var(--orb-page-alt);
}

.doc-callout.warning {
  border-color: color-mix(in srgb, var(--orb-amber) 36%, transparent);
  background: color-mix(in srgb, var(--orb-amber) 8%, var(--orb-surface));
}

.doc-link,
.api-path,
.api-method {
  color: var(--orb-mint);
}

/* Actionable and executive reports */

.actionable-report-dialog,
.actionable-report-browser,
.executive-report-body {
  background: var(--orb-page);
  color: var(--orb-ink);
}

.actionable-report-head,
.executive-report-head {
  border-color: var(--orb-line);
  background: linear-gradient(120deg, var(--orb-surface-elevated), var(--orb-page-alt));
}

.executive-brief-card,
.executive-estimate-panel,
.executive-estimate-metrics article,
.executive-estimate-line {
  border-color: var(--orb-line);
  background: var(--orb-surface-elevated);
  box-shadow: none;
}

.executive-brief-card {
  box-shadow: inset 3px 0 var(--brief-accent, var(--orb-mint));
}

.executive-brief-card:hover {
  border-color: color-mix(in srgb, var(--orb-mint) 44%, var(--orb-line));
  background: var(--orb-surface-active);
}

.executive-brief-metrics {
  background: var(--orb-line);
}

.executive-brief-metrics > div {
  background: var(--orb-surface);
}

.executive-estimate-panel {
  border-color: color-mix(in srgb, var(--orb-amber) 36%, transparent);
  background: color-mix(in srgb, var(--orb-amber) 7%, var(--orb-surface));
}

.executive-estimate-metrics strong,
.executive-estimate-line > div:first-child strong {
  color: var(--orb-amber);
}

/* Architecture, topology, and network surfaces */

.architecture-frame,
.graph-surface,
.architecture-scroll,
.large-topology-viewport,
.service-field,
.orb-canvas {
  background-color: var(--orb-page-deep);
}

.architecture-frame,
.graph-surface,
.graph-inspector,
.large-topology-frame {
  border-color: var(--orb-line);
}

.graph-toolbar {
  background: color-mix(in srgb, var(--orb-surface) 88%, transparent);
}

.graph-statistics > span,
.semantic-relationship,
.snapshot-change-summary > span {
  border-color: var(--orb-line);
  background: var(--orb-surface-elevated);
}

.graph-statistics small,
.semantic-relationship-head strong {
  color: var(--orb-mint);
}

.graph-group-menu-content,
.graph-inspector {
  border-color: var(--orb-line-strong);
  background: var(--orb-surface-elevated);
  box-shadow: var(--orb-shadow-card);
}

.graph-group-toggle.is-collapsed {
  border-color: color-mix(in srgb, var(--orb-mint) 38%, transparent);
  background: color-mix(in srgb, var(--orb-mint) 9%, var(--orb-surface));
  color: var(--orb-mint);
}

.architecture-node rect {
  fill: var(--orb-surface-elevated);
  stroke: var(--orb-line-strong);
}

.architecture-node:hover rect,
.architecture-node:focus rect,
.architecture-node.selected rect {
  fill: var(--orb-surface-active);
  stroke: var(--orb-mint);
}

.architecture-node-title,
.service-node-label {
  fill: var(--orb-ink);
}

.architecture-node-type,
.service-node-type,
.architecture-edges text {
  fill: var(--orb-ink-muted);
}

.architecture-arrow,
.architecture-node-indicator {
  fill: var(--orb-mint);
}

.architecture-edge path,
.service-field-edge path {
  stroke: color-mix(in srgb, var(--orb-cyan) 64%, transparent);
}

.architecture-edge.semantic-related path,
.service-field-edge:hover path {
  stroke: var(--orb-mint-bright);
}

.architecture-node.change-created rect {
  stroke: var(--orb-green);
}

.architecture-node.change-updated rect {
  stroke: var(--orb-amber);
}

.service-field-domains rect,
.architecture-domains rect {
  fill: color-mix(in srgb, var(--orb-surface) 40%, transparent);
  stroke: var(--orb-line);
}

.service-field-domains text,
.architecture-domains text {
  fill: var(--orb-ink-muted);
}

.service-node-halo {
  fill: color-mix(in srgb, var(--orb-mint) 10%, transparent);
  stroke: color-mix(in srgb, var(--orb-mint) 34%, transparent);
}

.service-node-ring {
  fill: var(--orb-surface);
  stroke: color-mix(in srgb, var(--orb-mint) 82%, transparent);
}

.service-node-core {
  fill: var(--orb-page-deep);
  stroke: var(--orb-line-strong);
}

.large-topology-viewport,
.architecture-scroll,
.graph-inspector,
.graph-group-menu-content {
  scrollbar-color: var(--orb-line-strong) transparent;
}

/* Overview analytic: preserve geometry, replace its isolated palette. */

.overview-prototype,
.overview-prototype.light {
  --ink: var(--orb-page-deep);
  --panel: var(--orb-surface);
  --panel-raised: var(--orb-surface-elevated);
  --app-bg: var(--orb-page);
  --app-wash: color-mix(in srgb, var(--orb-mint) 9%, transparent);
  --surface: var(--orb-surface);
  --surface-strong: var(--orb-surface-elevated);
  --surface-raised: var(--orb-page-alt);
  --surface-control: var(--orb-surface-elevated);
  --graph-bg: var(--orb-page-deep);
  --graph-radial: color-mix(in srgb, var(--orb-mint) 9%, transparent);
  --node-bg-start: var(--orb-surface-elevated);
  --node-bg-end: var(--orb-surface);
  --relation-bg: var(--orb-page-alt);
  --line: var(--orb-line);
  --line-strong: var(--orb-line-strong);
  --cyan: var(--orb-mint);
  --text: var(--orb-ink);
  --text-strong: var(--orb-ink);
  --muted: var(--orb-ink-muted);
  --faint: color-mix(in srgb, var(--orb-ink-muted) 66%, transparent);
  --edge-label: var(--orb-ink-soft);
  --edge-label-bg: var(--orb-surface);
  --graph-grid-primary: color-mix(in srgb, var(--orb-mint) 12%, transparent);
  --graph-grid-secondary: color-mix(in srgb, var(--orb-mint) 7%, transparent);
  --minimap-mask: color-mix(in srgb, var(--orb-page-deep) 72%, transparent);
  --radius: var(--orb-radius-md);
  --overview-surface: var(--orb-surface);
  --overview-surface-strong: var(--orb-surface-elevated);
  --overview-surface-raised: var(--orb-page-alt);
  --overview-control: var(--orb-surface-elevated);
  --overview-graph: var(--orb-page-deep);
  --overview-line: var(--orb-line);
  --overview-cyan: var(--orb-mint);
  --overview-muted: var(--orb-ink-muted);
  background: var(--orb-page);
  color: var(--orb-ink);
  font-family: var(--orb-font-sans);
}

.overview-prototype-card,
.analytic-card {
  border-color: var(--orb-line-strong);
  background: var(--orb-surface);
  box-shadow: var(--orb-shadow-card);
}

.analytic-card__header,
.control-dock,
.analytic-window,
.inspector,
.search-results {
  border-color: var(--orb-line);
}

.analytic-card__header {
  background: linear-gradient(90deg, color-mix(in srgb, var(--orb-mint) 6%, transparent), transparent 52%), var(--orb-surface-elevated);
}

.control-dock,
.inspector,
.search-results {
  background: var(--orb-surface-elevated);
}

.graph-stage {
  background-color: var(--orb-page-deep);
}

.semantic-node--group,
.semantic-node--cluster,
.semantic-node--risk,
.semantic-node--entity,
.relation-node {
  border-color: var(--orb-line-strong);
  background: linear-gradient(145deg, var(--orb-surface-elevated), var(--orb-surface));
  color: var(--orb-ink);
}

.semantic-node--group:hover,
.semantic-node--cluster:hover,
.semantic-node--risk:hover,
.semantic-node--entity:hover {
  border-color: var(--orb-mint);
  box-shadow: var(--orb-focus), var(--orb-shadow-card);
}

.react-flow__controls,
.react-flow__minimap {
  border-color: var(--orb-line-strong);
  background: var(--orb-surface-elevated);
  box-shadow: var(--orb-shadow-card);
}

.react-flow__controls-button {
  border-color: var(--orb-line);
  background: var(--orb-surface-elevated);
  color: var(--orb-ink-soft);
}

.react-flow__controls-button:hover {
  background: var(--orb-surface-active);
  color: var(--orb-mint);
}

/* Mission: retain risk semantics and chart geometry under the new palette. */

.mission-page {
  --mission-risk: var(--orb-red);
  --mission-risk-soft: color-mix(in srgb, var(--orb-red) 10%, transparent);
  --mission-impact: var(--orb-amber);
  --mission-impact-soft: color-mix(in srgb, var(--orb-amber) 9%, transparent);
  --mission-positive: var(--orb-green);
  --mission-positive-soft: color-mix(in srgb, var(--orb-green) 9%, transparent);
  --mission-cyan: var(--orb-cyan);
  --mission-cyan-soft: color-mix(in srgb, var(--orb-cyan) 9%, transparent);
  --mission-panel: color-mix(in srgb, var(--orb-surface) 80%, var(--orb-page));
  color: var(--orb-ink);
}

.mission-run-progress,
.mission-metrics,
.mission-workbench,
.mission-scorecard,
.mission-analytic-card,
.mission-candidate-inspector,
.mission-definition-pair > div,
.mission-chart-frame,
.mission-map-frame {
  border-color: var(--orb-line);
  background-color: var(--mission-panel);
}

.mission-workbench,
.mission-scorecard,
.mission-analytic-card {
  box-shadow: var(--orb-shadow-card);
}

.mission-candidate-list {
  border-color: var(--orb-line);
  background: var(--orb-page-deep);
  scrollbar-color: var(--orb-cyan) var(--orb-surface);
}

.mission-candidate:hover,
.mission-candidate.selected {
  background: var(--mission-cyan-soft);
}

.mission-candidate.selected {
  box-shadow: inset 3px 0 var(--orb-green);
}

.mission-edit-action {
  border-color: var(--orb-green) !important;
  background: var(--orb-green) !important;
  color: var(--primary-foreground) !important;
}

.mission-thread li,
.mission-evidence-overview article,
.mission-confidence-band,
.mission-quality article {
  border-color: var(--orb-line);
  background: var(--orb-page-alt);
}

.mission-chart-controls,
.mission-analytics-layoutbar,
.mission-candidate-command {
  border-color: var(--orb-line);
}

/* Public orb-prefixed component API */

.orb-app-frame {
  display: grid;
  grid-template-columns: var(--orb-sidebar-width) minmax(0, 1fr);
  min-height: 100vh;
  padding-top: var(--orb-header-height);
}

.orb-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 50;
  height: var(--orb-header-height);
}

.orb-sidebar {
  position: sticky;
  top: var(--orb-header-height);
  height: calc(100vh - var(--orb-header-height));
  overflow-y: auto;
  padding: 24px 16px;
}

.orb-container,
.orb-header-inner,
.orb-page {
  width: min(var(--orb-content-max), calc(100% - 64px));
  margin-inline: auto;
}

.orb-section {
  padding-block: 56px;
}

.orb-page {
  padding-block: 40px 64px;
}

.orb-divider {
  height: 1px;
  border: 0;
  background: var(--orb-line);
}

.orb-header-inner,
.orb-brand,
.orb-nav,
.orb-sidebar-link,
.orb-button,
.orb-card-header,
.orb-card-footer,
.orb-badge,
.orb-tabs,
.orb-tab,
.orb-toolbar,
.orb-toolbar-group {
  display: flex;
  align-items: center;
}

.orb-header-inner {
  height: 100%;
  gap: 28px;
}

.orb-brand {
  gap: 10px;
  font-size: 1rem;
}

.orb-brand-mark {
  width: 37px;
  height: 34px;
  object-fit: contain;
}

.orb-copyright {
  position: relative;
  top: -0.38em;
  margin-left: 2px;
  font-size: 0.48em;
  opacity: 0.42;
}

.orb-nav {
  gap: 24px;
  margin-left: auto;
}

.orb-nav-link {
  color: var(--orb-ink-soft);
  font-size: 0.8125rem;
}

.orb-nav-link:hover,
.orb-nav-link[aria-current="page"] {
  color: var(--orb-mint);
}

.orb-sidebar-nav {
  display: grid;
  gap: 4px;
}

.orb-sidebar-link {
  min-height: 40px;
  gap: 11px;
  padding: 9px 12px;
  border-radius: var(--orb-radius-sm);
}

.orb-page-title {
  margin: 18px 0 0;
  font-size: clamp(36px, 4.2vw, 58px);
}

.orb-section-title {
  margin: 0;
  font-size: clamp(28px, 3vw, 42px);
}

.orb-card-title {
  margin: 0;
  font-size: 1.125rem;
}

.orb-lead {
  max-width: 760px;
  margin: 22px 0 0;
  font-size: 1.125rem;
  line-height: 1.72;
}

.orb-button {
  min-height: 42px;
  justify-content: center;
  gap: 9px;
  padding: 0 19px;
  cursor: pointer;
}

.orb-card-header,
.orb-card-footer {
  justify-content: space-between;
  gap: 20px;
  padding: 16px 20px;
}

.orb-card-header {
  min-height: 60px;
  border-bottom: 1px solid var(--orb-line);
}

.orb-card-body {
  padding: 20px;
}

.orb-card-footer {
  min-height: 52px;
  border-top: 1px solid var(--orb-line);
  color: var(--orb-ink-muted);
}

.orb-panel-grid,
.orb-metric-grid,
.orb-form-grid {
  display: grid;
  gap: 16px;
}

.orb-panel-grid {
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

.orb-metric-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.orb-metric {
  min-width: 0;
  padding: 18px;
}

.orb-metric-value,
.orb-metric-label {
  display: block;
}

.orb-metric-value {
  font-size: 1.75rem;
}

.orb-metric-label {
  margin-top: 8px;
  color: var(--orb-ink-muted);
  font-size: 0.625rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.orb-badge {
  min-height: 24px;
  gap: 6px;
  padding: 3px 8px;
  border: 1px solid;
  border-radius: 999px;
  font-size: 0.6875rem;
}

.orb-status-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
}

.orb-form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px 18px;
}

.orb-field {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 8px;
}

.orb-field-full {
  grid-column: 1 / -1;
}

.orb-input,
.orb-select {
  min-height: 44px;
  padding: 0 13px;
}

.orb-textarea {
  min-height: 132px;
  padding: 12px 13px;
  resize: vertical;
}

.orb-tabs {
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--orb-line);
  border-radius: var(--orb-radius-md);
}

.orb-tab {
  min-height: 34px;
  justify-content: center;
  padding: 0 13px;
  cursor: pointer;
}

.orb-toolbar {
  min-height: 56px;
  gap: 9px;
  padding: 9px 12px;
  border: 1px solid var(--orb-line);
  border-radius: var(--orb-radius-md);
}

.orb-toolbar-group {
  gap: 7px;
}

.orb-toolbar-spacer {
  flex: 1 1 auto;
}

.orb-table-wrap {
  overflow: auto;
  border: 1px solid var(--orb-line);
  border-radius: var(--orb-radius-md);
}

.orb-empty {
  display: grid;
  min-height: 240px;
  place-items: center;
  padding: 36px;
  border-style: dashed;
  text-align: center;
}

.orb-dialog-backdrop {
  position: fixed;
  inset: 0;
}

.orb-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8125rem;
}

.orb-table th,
.orb-table td {
  padding: 12px 14px;
  text-align: left;
}

.orb-canvas {
  position: relative;
  min-height: 420px;
  overflow: hidden;
  border: 1px solid var(--orb-line-strong);
  border-radius: var(--orb-radius-md);
  background-image:
    linear-gradient(var(--orb-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--orb-line) 1px, transparent 1px);
  background-size: 48px 48px;
}

.orb-node {
  min-width: 150px;
  padding: 12px 14px;
  border: 1px solid var(--orb-line-strong);
  border-radius: var(--orb-radius-md);
  background: var(--orb-surface-elevated);
  color: var(--orb-ink);
  box-shadow: var(--orb-shadow-card);
}

.orb-node:hover,
.orb-node.is-selected {
  border-color: var(--orb-mint);
  box-shadow: var(--orb-focus), var(--orb-shadow-card);
}

.orb-node-label,
.orb-node-meta {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.orb-node-meta {
  margin-top: 5px;
  color: var(--orb-ink-muted);
  font-size: 0.5625rem;
}

.orb-risk-high { border-color: color-mix(in srgb, var(--orb-red) 70%, transparent); }
.orb-risk-medium { border-color: color-mix(in srgb, var(--orb-amber) 70%, transparent); }
.orb-risk-low { border-color: color-mix(in srgb, var(--orb-green) 70%, transparent); }

.orb-inspector-section {
  padding: 18px;
  border-bottom: 1px solid var(--orb-line);
}

.orb-inspector-section:last-child,
.orb-key-value:last-child,
.orb-table tbody tr:last-child td {
  border-bottom: 0;
}

.orb-key-value {
  display: grid;
  grid-template-columns: minmax(110px, 0.7fr) minmax(0, 1.3fr);
  gap: 14px;
  padding: 9px 0;
  border-bottom: 1px solid var(--orb-line);
}

.orb-key-value dd {
  margin: 0;
  color: var(--orb-ink-soft);
}

.orb-app,
.orb-sidebar,
.orb-table-wrap {
  scrollbar-color: var(--orb-line-strong) transparent;
  scrollbar-width: thin;
}

/* Light-mode corrections for legacy high-specificity declarations. */

:root[data-theme="light"] body {
  background:
    radial-gradient(circle at 82% 3%, rgba(15, 139, 105, 0.06), transparent 30rem),
    var(--orb-page);
}

:root[data-theme="light"] .shell {
  background:
    radial-gradient(circle at 80% 0, rgba(15, 139, 105, 0.06), transparent 34rem),
    radial-gradient(circle at 25% 100%, rgba(39, 125, 157, 0.04), transparent 40rem),
    var(--orb-page);
}

:root[data-theme="light"] .sidebar {
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 14px 0 44px rgba(24, 55, 46, 0.1);
}

:root[data-theme="light"] .sidebar::before {
  opacity: 0.018;
  filter: sepia(1) saturate(0.5) hue-rotate(100deg);
}

:root[data-theme="light"] .topbar,
:root[data-theme="light"] .mobile-bottom-navigation {
  background: rgba(244, 247, 244, 0.9);
  box-shadow: 0 14px 34px rgba(24, 55, 46, 0.1);
}

:root[data-theme="light"] .brand-logo {
  filter: brightness(0) saturate(100%) invert(34%) sepia(30%) saturate(1226%) hue-rotate(115deg) brightness(92%) contrast(91%);
}

:root[data-theme="light"] .login-screen {
  --orb-ink-muted: #526a62;
}

:root[data-theme="light"] .login-frame,
:root[data-theme="light"] .card,
:root[data-theme="light"] .finding-hero,
:root[data-theme="light"] .architecture-frame,
:root[data-theme="light"] .decision-journey,
:root[data-theme="light"] .lineage-strip,
:root[data-theme="light"] .state-panel,
:root[data-theme="light"] .discovery-panel,
:root[data-theme="light"] .decision-lens,
:root[data-theme="light"] .provider-selector {
  border-color: var(--orb-line);
  background: var(--orb-surface);
  box-shadow: var(--orb-shadow-card);
}

:root[data-theme="light"] .login-action,
:root[data-theme="light"] .metric,
:root[data-theme="light"] .decision-lens.emphasis {
  background: var(--orb-surface-elevated);
  text-shadow: none;
}

:root[data-theme="light"] .button {
  border-color: var(--orb-line-strong);
  background: var(--orb-surface);
  color: var(--orb-ink);
  box-shadow: none;
}

:root[data-theme="light"] .button:hover {
  border-color: var(--orb-mint);
  background: var(--orb-surface-active);
  color: var(--orb-mint);
}

:root[data-theme="light"] .button.primary,
:root[data-theme="light"] .segmented-control .button.active,
:root[data-theme="light"] .graph-group-menu[open] > summary {
  background: var(--orb-mint);
  color: #ffffff;
}

:root[data-theme="light"] .button.danger {
  border-color: color-mix(in srgb, var(--orb-red) 42%, transparent);
  background: color-mix(in srgb, var(--orb-red) 9%, var(--orb-surface));
  color: var(--orb-red);
}

:root[data-theme="light"] .context-select,
:root[data-theme="light"] .vertical-select,
:root[data-theme="light"] .field input,
:root[data-theme="light"] .field select,
:root[data-theme="light"] .field textarea,
:root[data-theme="light"] .filter-bar input,
:root[data-theme="light"] .filter-bar select,
:root[data-theme="light"] .global-search,
:root[data-theme="light"] .theme-toggle,
:root[data-theme="light"] .provider-select,
:root[data-theme="light"] .snapshot-control select,
:root[data-theme="light"] .graph-toolbar input,
:root[data-theme="light"] .graph-toolbar select,
:root[data-theme="light"] .api-filter-bar input,
:root[data-theme="light"] .api-filter-bar select,
:root[data-theme="light"] .sve-global-search input,
:root[data-theme="light"] .sve-page-size select,
:root[data-theme="light"] .sve-column-filters input,
:root[data-theme="light"] .standards-policy-select select {
  border-color: var(--orb-line-strong);
  background: var(--orb-surface-elevated);
  color: var(--orb-ink);
  box-shadow: none;
}

:root[data-theme="light"] .account-menu,
:root[data-theme="light"] dialog,
:root[data-theme="light"] .command-palette,
:root[data-theme="light"] .toast {
  border-color: var(--orb-line-strong);
  background: var(--orb-surface-elevated);
  color: var(--orb-ink);
  box-shadow: var(--orb-shadow-card);
}

:root[data-theme="light"] .section-tabs,
:root[data-theme="light"] .state-banner,
:root[data-theme="light"] .authority-banner,
:root[data-theme="light"] .api-filter-bar,
:root[data-theme="light"] .api-contract-block,
:root[data-theme="light"] .runtime-boundary,
:root[data-theme="light"] .region-scope,
:root[data-theme="light"] .job-progress,
:root[data-theme="light"] .authorization-check {
  background: var(--orb-page-alt);
  box-shadow: none;
}

:root[data-theme="light"] th,
:root[data-theme="light"] .sve-column-filters th {
  border-color: var(--orb-line);
  background: var(--orb-page-alt);
  color: var(--orb-ink-muted);
}

:root[data-theme="light"] .api-endpoint,
:root[data-theme="light"] .doc-navigation,
:root[data-theme="light"] .doc-section,
:root[data-theme="light"] .doc-callout,
:root[data-theme="light"] .doc-flow-stage,
:root[data-theme="light"] .doc-diagram,
:root[data-theme="light"] .doc-table {
  border-color: var(--orb-line);
  background: var(--orb-surface);
  box-shadow: none;
}

:root[data-theme="light"] .architecture-scroll,
:root[data-theme="light"] .graph-surface,
:root[data-theme="light"] .large-topology-viewport,
:root[data-theme="light"] .service-field {
  background: var(--orb-page-deep);
}

:root[data-theme="light"] .graph-toolbar,
:root[data-theme="light"] .graph-inspector,
:root[data-theme="light"] .graph-group-menu-content {
  background: var(--orb-surface-elevated);
}

:root[data-theme="light"] .service-node-ring {
  fill: var(--orb-surface);
}

:root[data-theme="light"] .service-node-core {
  fill: var(--orb-page-alt);
}

:root[data-theme="light"] .overview-prototype.light .overview-prototype-card,
:root[data-theme="light"] .overview-prototype.light .overview-flow-domain,
:root[data-theme="light"] .overview-prototype.light .overview-flow-detail,
:root[data-theme="light"] .overview-prototype.light .inspector {
  border-color: var(--orb-line);
  background: var(--orb-surface-elevated);
  color: var(--orb-ink);
  box-shadow: var(--orb-shadow-card);
}

/* Blue corrections for independent diagram palettes and legacy gradients. */
:root[data-theme="arclite"] body,
:root[data-theme="arclite"] .shell {
  background: radial-gradient(circle at 82% 3%, rgba(141, 204, 255, 0.045), transparent 34rem), var(--orb-page);
}
:root[data-theme="arclite"] .sidebar::before { filter: grayscale(1); }
:root[data-theme="arclite"] .avatar { box-shadow: 0 8px 22px rgba(141, 204, 255, 0.12); }
:root[data-theme="arclite"] .login-screen { --orb-ink-muted: #adbed0; }
:root[data-theme="arclite"] input::placeholder,
:root[data-theme="arclite"] textarea::placeholder {
  color: var(--orb-ink-muted);
  opacity: 1;
}
:root[data-theme="arclite"] .et-shell {
  --et-bg: var(--orb-page-alt);
  --et-panel: var(--orb-surface);
  --et-lane: var(--orb-surface-elevated);
  --et-border: var(--orb-line-strong);
  --et-text: var(--orb-ink);
  --et-muted: var(--orb-ink-soft);
  --et-line: #8cadc7;
  --et-selected: var(--orb-surface-active);
}
:root[data-theme="arclite"] .ai-page {
  --ai-green: var(--orb-mint);
  --ai-cyan: var(--orb-cyan);
  --ai-amber: var(--orb-amber);
}

/* Responsive behavior stays aligned with the application's 767px JS switch. */

@media (max-width: 1100px) {
  .orb-container,
  .orb-header-inner,
  .orb-page {
    width: min(100% - 40px, 980px);
  }

  .orb-metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .orb-app-frame {
    grid-template-columns: 1fr;
  }

  .orb-sidebar {
    position: fixed;
    display: block;
    transform: translateX(-105%);
  }

  .orb-sidebar.is-open,
  .orb-sidebar.open {
    transform: none;
  }

  .orb-nav {
    display: none;
  }

  .orb-panel-grid {
    grid-template-columns: 1fr;
  }

  .login-screen {
    justify-content: flex-start;
    padding: .75rem;
  }

  .login-frame {
    grid-template-columns: 1fr;
  }

  .login-story {
    min-height: 250px;
    padding: 1.7rem;
  }

  .login-brand .brand-logo {
    width: 125px;
    height: 125px;
  }

  .login-brand .brand-wordmark {
    font-size: clamp(1.7rem, 7vw, 2rem);
  }

  .login-action {
    min-height: 390px;
    padding: 2rem 1.6rem;
    border-top: 1px solid var(--orb-line);
    border-left: 0;
  }
}

@media (max-width: 560px) {
  .orb-container,
  .orb-header-inner,
  .orb-page {
    width: min(100% - 28px, 520px);
  }

  .orb-section {
    padding-block: 40px;
  }

  .orb-form-grid,
  .orb-metric-grid {
    grid-template-columns: 1fr;
  }

  .orb-field-full {
    grid-column: auto;
  }

  .orb-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .orb-toolbar-group {
    flex-wrap: wrap;
  }

  .orb-page-title {
    font-size: 2.375rem;
  }
}

@media (pointer: coarse) {
  .button,
  .nav-link,
  .nav-child-link,
  .section-tab,
  .orb-button,
  .orb-tab,
  .orb-sidebar-link {
    min-height: 44px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}