:root, [data-theme="light"] {
  --base-background: #ffffff;
  --base-foreground: #0a0a0a;
  --base-card: #ffffff;
  --base-card-foreground: #0a0a0a;
  --base-muted: #f5f5f5;
  --base-muted-foreground: #737373;
  --base-primary: #0f172a;
  --base-primary-foreground: #fafafa;
  --base-secondary: #f5f5f5;
  --base-secondary-foreground: #172554;
  --base-accent: #f5f5f5;
  --base-accent-foreground: #171717;
  --base-popover: #ffffff;
  --base-popover-foreground: #0a0a0a;
  --base-destructive: #dc2626;
  --base-destructive-foreground: #fef2f2;
  --base-border: #e5e5e5;
  --base-input: #e5e5e5;
  --base-ring: #a3a3a3;
  --base-sidebar: #fafafa;
  --base-sidebar-foreground: #0a0a0a;
  --base-sidebar-primary: #171717;
  --base-sidebar-primary-foreground: #fafafa;
  --base-sidebar-accent: #f5f5f5;
  --base-sidebar-accent-foreground: #171717;
  --base-sidebar-border: #e5e5e5;
  --base-sidebar-ring: #a3a3a3;
  --base-chart-1: #818bdf;
  --base-chart-2: #00a59a;
  --base-chart-3: #ea6f59;
  --base-chart-4: #3e9fb8;
  --base-chart-5: #e8668d;
  --base-chart-other: #98938c;
  --base-status-good: #00a59a;
  --base-status-warning: #da7e1b;
  --base-status-critical: #dc2626;
  --base-status-info: #3c6afa;
  --base-status-good-foreground: #ffffff;
  --base-status-warning-foreground: #ffffff;
  --base-status-critical-foreground: #ffffff;
  --base-status-info-foreground: #ffffff;
  --base-status-good-soft: #e8f4f2;
  --base-status-warning-soft: #fcf0e6;
  --base-status-critical-soft: #ffe8e5;
  --base-status-info-soft: #e6eeff;
  --base-status-good-text: #097c73;
  --base-status-warning-text: #a55c07;
  --base-status-critical-text: #d41a1e;
  --base-status-info-text: #335eed;
  --shadow-xs: 0 1px 2px 0 #0000000d;
  --shadow-sm: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;
  --shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;
}
[data-theme="dark"] {
  --base-background: #0a0a0a;
  --base-foreground: #fafafa;
  --base-card: #171717;
  --base-card-foreground: #fafafa;
  --base-muted: #262626;
  --base-muted-foreground: #a3a3a3;
  --base-primary: #fbbf24;
  --base-primary-foreground: #171717;
  --base-secondary: #262626;
  --base-secondary-foreground: #fafafa;
  --base-accent: #404040;
  --base-accent-foreground: #fafafa;
  --base-popover: #262626;
  --base-popover-foreground: #fafafa;
  --base-destructive: #fca5a5;
  --base-destructive-foreground: #fef2f2;
  --base-border: #ffffff38;
  --base-input: #ffffff45;
  --base-ring: #737373;
  --base-sidebar: #171717;
  --base-sidebar-foreground: #fafafa;
  --base-sidebar-primary: #1d4ed8;
  --base-sidebar-primary-foreground: #fafafa;
  --base-sidebar-accent: #262626;
  --base-sidebar-accent-foreground: #fafafa;
  --base-sidebar-border: #ffffff38;
  --base-sidebar-ring: #525252;
  --base-chart-1: #818bdf;
  --base-chart-2: #00a59a;
  --base-chart-3: #ea6f59;
  --base-chart-4: #3e9fb8;
  --base-chart-5: #e8668d;
  --base-chart-other: #67625c;
  --base-status-good: #00a59a;
  --base-status-warning: #e8b33c;
  --base-status-critical: #d33a3c;
  --base-status-info: #3c6afa;
  --base-status-good-foreground: #ffffff;
  --base-status-warning-foreground: #451a03;
  --base-status-critical-foreground: #ffffff;
  --base-status-info-foreground: #ffffff;
  --base-status-good-soft: #121f1d;
  --base-status-warning-soft: #272015;
  --base-status-critical-soft: #261412;
  --base-status-info-soft: #12192a;
  --base-status-good-text: #10a59a;
  --base-status-warning-text: #e9b43d;
  --base-status-critical-text: #e44b4a;
  --base-status-info-text: #4a78fd;
  --shadow-xs: 0 1px 2px 0 #0000000d;
  --shadow-sm: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;
  --shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;
}
:root {
  --spacing-0-5: 2px;
  --spacing-1: 4px;
  --spacing-1-5: 6px;
  --spacing-2: 8px;
  --spacing-2-5: 10px;
  --spacing-3: 12px;
  --spacing-4: 16px;
  --spacing-5: 20px;
  --spacing-6: 24px;
  --spacing-7: 28px;
  --spacing-8: 32px;
  --spacing-12: 48px;
  --spacing-20: 80px;
  --spacing-32: 128px;
  --border-radius-rounded-md: 8px;
  --border-radius-rounded-lg: 10px;
  --border-radius-rounded-xl: 14px;
  --border-radius-rounded-2xl: 16px;
  --border-radius-rounded-4xl: 32px;
  --border-radius-rounded-full: 9999px;
  --border-width-border: 1px;
  --border-width-border-2: 2px;
  --font-sans: "Noto Sans", system-ui, -apple-system, sans-serif;
  --font-mono: "Noto Sans Mono", ui-monospace, SFMono-Regular, monospace;
  --font-serif: "Noto Serif", Georgia, serif;
}
.heading-xl { font-family: var(--font-sans); font-size: 60px; line-height: 60px; font-weight: 600; letter-spacing: -1.5px; }
.heading-lg { font-family: var(--font-sans); font-size: 48px; line-height: 48px; font-weight: 600; letter-spacing: -1.2px; }
.heading-md { font-family: var(--font-sans); font-size: 36px; line-height: 40px; font-weight: 600; letter-spacing: -0.9px; }
.heading-sm { font-family: var(--font-sans); font-size: 24px; line-height: 32px; font-weight: 600; letter-spacing: -0.6px; }
.text-xs-leading-normal-normal { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 400; }
.text-xs-leading-normal-medium { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 500; }
.text-xs-leading-normal-semibold { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 600; }
.text-sm-leading-normal-normal { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 400; }
.text-sm-leading-normal-medium { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 500; }
.text-sm-leading-normal-semibold { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 600; }
.text-sm-leading-none-normal { font-family: var(--font-sans); font-size: 14px; line-height: 1; font-weight: 400; }
.text-sm-leading-none-medium { font-family: var(--font-sans); font-size: 14px; line-height: 1; font-weight: 500; }
.text-sm-leading-normal-underlined-medium { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 600; }
.text-base-leading-normal-normal { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 400; }
.text-base-leading-normal-medium { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 500; }
.text-base-leading-normal-semibold { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 600; }
.text-lg-leading-normal-normal { font-family: var(--font-sans); font-size: 18px; line-height: 28px; font-weight: 400; }
.text-lg-leading-normal-semibold { font-family: var(--font-sans); font-size: 18px; line-height: 28px; font-weight: 600; }
.text-xl-leading-normal-normal { font-family: var(--font-sans); font-size: 20px; line-height: 28px; font-weight: 400; }
.text-xl-leading-normal-semibold { font-family: var(--font-sans); font-size: 20px; line-height: 28px; font-weight: 600; }
.text-2xl-leading-normal-light { font-family: var(--font-sans); font-size: 24px; line-height: 32px; font-weight: 300; }
.text-2xl-leading-normal-semibold { font-family: var(--font-sans); font-size: 24px; line-height: 32px; font-weight: 600; }
.text-3xl-leading-normal-semibold { font-family: var(--font-sans); font-size: 30px; line-height: 36px; font-weight: 600; }
.text-4xl-leading-normal-semibold { font-family: var(--font-sans); font-size: 36px; line-height: 40px; font-weight: 600; }
.text-5xl-leading-none-semibold { font-family: var(--font-sans); font-size: 48px; line-height: 1; font-weight: 600; }

/* ---- Hand-set from the Honeycomb Figma library, "4. Custom" collection and custom/ui-* text styles.
   The artifact does not generate these yet. Figma is the source; keep these values in step with it. ---- */
:root {
  --ui-card-padding: 24px;
  --ui-card-gap: 24px;
  --ui-section-gap: 40px;
  --ui-heading-gap: 16px;
  --ui-kpi-padding: 20px;
  --ui-kpi-gap: 16px;
  --ui-kpi-height: 120px;
  --ui-table-row-height: 48px;
}
.ui-kpi-value { font-family: var(--font-sans); font-size: 30px; line-height: 36px; font-weight: 500; }
.ui-section-heading { font-family: var(--font-sans); font-size: 24px; line-height: 32px; font-weight: 400; }
.ui-body { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 400; }
.ui-meta { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 500; }