:root {
  color-scheme: dark;
  --app-bg: #101722;
  --surface: #1a2738;
  --surface-elevated: #26364b;
  --surface-hover: #2c3c52;
  --primary: #79c5f4;
  --primary-hover: #a0d8fa;
  --primary-foreground: #102335;
  --secondary: #273548;
  --accent: #8ed6ed;
  --text-primary: #edf3fa;
  --text-primary-rgb: 237, 243, 250;
  --text-secondary: #b3c0d2;
  --text-muted: #8191a7;
  --border: #ffffff0d;
  --border-strong: #ffffff24;
  --success: #78d5ab;
  --warning: #e6be77;
  --danger: #ee91a0;
  --info: #8bc6fa;
  --success-soft: #78d5ab14;
  --warning-soft: #e6be7714;
  --danger-soft: #ee91a014;
  --info-soft: #8bc6fa14;
  --primary-soft: #79c5f414;
  --nav-active-bg: #79c5f422;
  --nav-active-border: #79c5f433;
  --focus-ring: #79c5f48c;
  --radius-sm: 7px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --shadow-sm: 0 4px 16px #00000012;
  --shadow-md: 0 18px 48px #00000038;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --font-ui: 'Rubik', sans-serif;
  --font-heading: 'Space Grotesk', 'Rubik', sans-serif;
  --font-xs: .75rem;
  --font-sm: .8125rem;
  --font-base: .875rem;
  --font-lg: 1.125rem;
  --font-title: clamp(1.6rem, 2.5vw, 2rem);
  --sidebar-width: 248px;
  --sidebar-collapsed-width: 76px;
  --header-height: 76px;
  --overlay: #050b14b8;
  --logo-surface: #ffffff;
  --control-height: 46px;
  --component-padding: var(--space-6);
  --component-gap: var(--space-6);
  --table-cell-y: 14px;
  --table-cell-x: var(--space-4);
  --table-radius: var(--radius-md);
}

/* A future light theme can override this palette without changing components. */
:root[data-theme="light"] {
  color-scheme: light;
  --app-bg: #f4f6fa;
  --surface: #ffffff;
  --surface-elevated: #f8fafc;
  --surface-hover: #edf2f8;
  --primary: #246a9f;
  --primary-hover: #1d547e;
  --primary-foreground: #ffffff;
  --secondary: #e8eef5;
  --accent: #217fa0;
  --text-primary: #1c2b40;
  --text-primary-rgb: 28, 43, 64;
  --text-secondary: #506279;
  --text-muted: #667990;
  --border: #1c2b4010;
  --border-strong: #1c2b4030;
  --success: #217952;
  --warning: #946415;
  --danger: #b63f54;
  --info: #246a9f;
  --success-soft: #21795210;
  --warning-soft: #94641510;
  --danger-soft: #b63f5410;
  --info-soft: #246a9f10;
  --primary-soft: #246a9f10;
  --nav-active-bg: #246a9f18;
  --nav-active-border: #246a9f33;
  --focus-ring: #246a9f66;
  --shadow-sm: 0 4px 16px #1c2b4008;
  --shadow-md: 0 18px 48px #1c2b401a;
}

/* Density is a component contract, not a user preference. */
[data-density="comfortable"], .pilot-calculator {
  --control-height: 46px;
  --component-padding: var(--space-6);
  --component-gap: var(--space-6);
  --table-cell-y: 14px;
  --table-cell-x: var(--space-4);
  --table-radius: var(--radius-md);
}
[data-density="compact"] {
  --control-height: 36px;
  --component-padding: var(--space-4);
  --component-gap: var(--space-3);
  --table-cell-y: 5px;
  --table-cell-x: 7px;
  --table-radius: var(--radius-sm);
}

/* Tabler is opt-in: shell and migrated pilots only, never legacy views. */
.tabler-ui {
  --tblr-body-font-family: var(--font-ui);
  --tblr-body-font-size: var(--font-base);
  --tblr-body-font-weight: 400;
  --tblr-body-line-height: 1.5;
  --tblr-body-color: var(--text-primary);
  --tblr-secondary-color: var(--text-secondary);
  --tblr-border-color: var(--border-strong);
  --tblr-border-color-translucent: var(--border);
  --tblr-border-width: 1px;
  --tblr-border-radius: var(--radius-sm);
  --tblr-border-radius-lg: var(--radius-md);
  --tblr-border-radius-sm: var(--radius-sm);
  --tblr-bg-surface: var(--surface);
  --tblr-bg-surface-secondary: var(--surface-elevated);
  --tblr-bg-surface-tertiary: var(--surface-hover);
  --tblr-emphasis-color-rgb: var(--text-primary-rgb);
  --tblr-font-weight-medium: 500;
  --tblr-font-weight-bold: 700;
  --tblr-spacer: var(--space-4);
  --tblr-primary: var(--primary);
  --tblr-link-color: var(--primary);
  --tblr-link-hover-color: var(--primary-hover);
}