:root {
  /* Brand — Ink + Indigo palette */
  --fb-color-primary: #3B4BD0;
  --fb-color-primary-dark: #1E2A9E;
  --fb-color-primary-hi: #6672E6;
  --fb-color-ink: #141A2E;
  --fb-color-accent: #ECEAE2;

  /* Surfaces */
  --fb-color-bg: #F5F4F0;
  --fb-color-surface: #FFFFFF;
  --fb-color-surface-alt: #ECEAE2;

  /* Text */
  --fb-color-text: #141A2E;
  --fb-color-text-muted: #5B6278;
  --fb-color-text-inverse: #F5F4F0;

  /* Borders */
  --fb-color-border: rgba(20, 26, 46, 0.10);
  --fb-color-border-strong: rgba(20, 26, 46, 0.20);

  /* Semantic */
  --fb-color-success: #2E7D5A;
  --fb-color-warning: #B7791F;
  --fb-color-danger: #B54747;
  --fb-color-info: #3E6E8E;

  /* Focus and interactive states */
  --fb-color-focus-ring: rgba(59, 75, 208, 0.18);
  --fb-color-hover-overlay: rgba(59, 75, 208, 0.05);
  --fb-color-active-overlay: rgba(59, 75, 208, 0.10);

  /* Typography */
  --fb-font-family-base: "Inter Tight", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --fb-font-family-mono: "JetBrains Mono", ui-monospace, "Cascadia Code", monospace;
  --fb-font-size-xs: 12px;
  --fb-font-size-sm: 14px;
  --fb-font-size-md: 16px;
  --fb-font-size-lg: 18px;
  --fb-font-size-xl: 24px;
  --fb-font-size-2xl: 32px;

  --fb-font-weight-regular: 400;
  --fb-font-weight-medium: 500;
  --fb-font-weight-semibold: 600;
  --fb-font-weight-bold: 700;

  --fb-line-height-tight: 1.25;
  --fb-line-height-base: 1.5;
  --fb-line-height-relaxed: 1.65;

  /* Radius */
  --fb-radius-sm: 8px;
  --fb-radius-md: 12px;
  --fb-radius-lg: 16px;
  --fb-radius-pill: 999px;

  /* Shadows */
  --fb-shadow-sm: 0 2px 8px rgba(20, 26, 46, 0.06);
  --fb-shadow-md: 0 6px 18px rgba(20, 26, 46, 0.08);
  --fb-shadow-lg: 0 14px 36px rgba(20, 26, 46, 0.12);

  /* Spacing */
  --fb-space-2xs: 2px;
  --fb-space-xs: 4px;
  --fb-space-sm: 8px;
  --fb-space-md: 12px;
  --fb-space-lg: 16px;
  --fb-space-xl: 24px;
  --fb-space-2xl: 32px;
  --fb-space-3xl: 48px;

  /* Layout */
  --fb-container-width: 1200px;
  --fb-header-height: 64px;
  --fb-sidebar-width: 264px;

  /* Component aliases */
  --fb-page-bg: var(--fb-color-bg);
  --fb-card-bg: var(--fb-color-surface);
  --fb-card-bg-alt: var(--fb-color-surface-alt);
  --fb-card-border: var(--fb-color-border);
  --fb-card-shadow: var(--fb-shadow-sm);

  --fb-heading-color: var(--fb-color-text);
  --fb-body-color: var(--fb-color-text);
  --fb-muted-color: var(--fb-color-text-muted);
  --fb-link-color: var(--fb-color-primary);
  --fb-link-hover-color: var(--fb-color-primary-dark);

  --fb-button-primary-bg: var(--fb-color-primary);
  --fb-button-primary-bg-hover: var(--fb-color-primary-dark);
  --fb-button-primary-text: #FFFFFF;

  --fb-button-secondary-bg: var(--fb-color-surface);
  --fb-button-secondary-bg-hover: var(--fb-color-surface-alt);
  --fb-button-secondary-text: var(--fb-color-text);
  --fb-button-secondary-border: var(--fb-color-border);

  --fb-button-tertiary-text: var(--fb-color-primary);
  --fb-button-tertiary-hover-bg: rgba(59, 75, 208, 0.08);

  --fb-input-bg: var(--fb-color-surface);
  --fb-input-border: var(--fb-color-border);
  --fb-input-border-hover: var(--fb-color-border-strong);
  --fb-input-border-focus: var(--fb-color-primary);
  --fb-input-text: var(--fb-color-text);
  --fb-input-placeholder: var(--fb-color-text-muted);

  --fb-nav-bg: var(--fb-color-surface);
  --fb-nav-text: var(--fb-color-text);
  --fb-nav-text-muted: var(--fb-color-text-muted);
  --fb-nav-active-bg: rgba(59, 75, 208, 0.08);
  --fb-nav-active-text: var(--fb-color-primary-dark);
  --fb-nav-border: var(--fb-color-border);

  --fb-table-header-bg: var(--fb-color-surface-alt);
  --fb-table-row-bg: var(--fb-color-surface);
  --fb-table-row-hover: rgba(59, 75, 208, 0.03);
  --fb-table-border: var(--fb-color-border);

  --fb-badge-success-bg: rgba(46, 125, 90, 0.12);
  --fb-badge-success-text: var(--fb-color-success);
  --fb-badge-warning-bg: rgba(183, 121, 31, 0.14);
  --fb-badge-warning-text: var(--fb-color-warning);
  --fb-badge-danger-bg: rgba(181, 71, 71, 0.12);
  --fb-badge-danger-text: var(--fb-color-danger);
  --fb-badge-info-bg: rgba(62, 110, 142, 0.12);
  --fb-badge-info-text: var(--fb-color-info);
}

[data-theme="dark"] {
  --fb-color-bg: #13151F;
  --fb-color-surface: #1B1E2C;
  --fb-color-surface-alt: #222638;

  --fb-color-text: #E8E9F0;
  --fb-color-text-muted: #8B90A8;
  --fb-color-text-inverse: #F5F4F0;

  --fb-color-border: rgba(255, 255, 255, 0.08);
  --fb-color-border-strong: rgba(255, 255, 255, 0.14);

  --fb-color-focus-ring: rgba(59, 75, 208, 0.28);
  --fb-color-hover-overlay: rgba(255, 255, 255, 0.04);
  --fb-color-active-overlay: rgba(255, 255, 255, 0.08);

  --fb-shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.22);
  --fb-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.28);
  --fb-shadow-lg: 0 18px 42px rgba(0, 0, 0, 0.36);

  --fb-nav-active-bg: rgba(59, 75, 208, 0.20);
  --fb-nav-active-text: #9AA0EC;
  --fb-table-row-hover: rgba(255, 255, 255, 0.03);

  --fb-badge-success-bg: rgba(46, 125, 90, 0.20);
  --fb-badge-warning-bg: rgba(183, 121, 31, 0.22);
  --fb-badge-danger-bg: rgba(181, 71, 71, 0.20);
  --fb-badge-info-bg: rgba(62, 110, 142, 0.22);
}

body {
  background: var(--fb-page-bg);
  color: var(--fb-body-color);
  font-family: var(--fb-font-family-base);
  font-size: var(--fb-font-size-md);
  line-height: var(--fb-line-height-base);
}

h1, h2, h3, h4, h5, h6 {
  color: var(--fb-heading-color);
  line-height: var(--fb-line-height-tight);
}

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