/*
 * Heirloom design tokens. Generated by @heirloom/design.
 * Do not edit by hand: edit the token sources and regenerate.
 *
 * Dark is the base. Light is the override. Chrome stays dark in both.
 * Generated surfaces reference these semantic custom properties only,
 * never a raw color value (DM-19).
 */

/* Tier 1 scales. Theme-invariant and mode-invariant. */
:root {
  --hl-space-0: 0;
  --hl-space-1: 0.25rem;
  --hl-space-2: 0.5rem;
  --hl-space-3: 0.75rem;
  --hl-space-4: 1rem;
  --hl-space-5: 1.25rem;
  --hl-space-6: 1.5rem;
  --hl-space-8: 2rem;
  --hl-space-10: 2.5rem;
  --hl-space-12: 3rem;
  --hl-space-16: 4rem;
  --hl-space-px: 1px;
  --hl-radius-none: 0;
  --hl-radius-sm: 0.25rem;
  --hl-radius-md: 0.375rem;
  --hl-radius-base: 0.5rem;
  --hl-radius-lg: 0.75rem;
  --hl-radius-xl: 1rem;
  --hl-radius-full: 9999px;
  --hl-font-serif: 'Source Serif 4 Variable', 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --hl-font-sans: 'Inter Variable', Inter, system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
  --hl-font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --hl-text-xs: 0.75rem;
  --hl-text-sm: 0.8125rem;
  --hl-text-base: 0.875rem;
  --hl-text-md: 1rem;
  --hl-text-lg: 1.125rem;
  --hl-text-xl: 1.375rem;
  --hl-text-2xl: 1.75rem;
  --hl-text-3xl: 2.25rem;
  --hl-weight-regular: 400;
  --hl-weight-medium: 500;
  --hl-weight-semibold: 600;
  --hl-weight-bold: 700;
  --hl-leading-tight: 1.2;
  --hl-leading-snug: 1.35;
  --hl-leading-normal: 1.5;
  --hl-leading-relaxed: 1.65;
  --hl-tracking-tight: -0.011em;
  --hl-tracking-normal: 0;
  --hl-tracking-wide: 0.02em;
  --hl-tracking-label: 0.06em;
  --hl-duration-instant: 80ms;
  --hl-duration-fast: 120ms;
  --hl-duration-base: 160ms;
  --hl-duration-settle: 240ms;
  --hl-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --hl-ease-enter: cubic-bezier(0, 0, 0, 1);
  --hl-ease-exit: cubic-bezier(0.3, 0, 1, 1);
  --hl-layout-rail-expanded: 212px;
  --hl-layout-rail-collapsed: 52px;
  --hl-layout-top-bar-height: 48px;
  --hl-layout-second-panel-width: 260px;
  --hl-layout-thread-panel-width: 360px;
  --hl-layout-control-height: 36px;
  --hl-layout-control-height-sm: 28px;
  --hl-layout-icon-size: 16px;
  --hl-layout-touch-target: 44px;
  --hl-layout-bubble-radius: 8px;
  --hl-layout-content-max: 72rem;
  --hl-layout-prose-max: 38rem;
  --hl-border-hairline: 1px;
  --hl-border-strong: 2px;
  --hl-border-focus: 2px;
  --hl-border-indicator: 3px;
  --hl-elevation-none: none;
  --hl-elevation-raised: 0 1px 2px rgba(10, 4, 14, 0.28);
  --hl-elevation-panel: 0 2px 8px rgba(10, 4, 14, 0.32);
  --hl-elevation-popover: 0 8px 24px rgba(10, 4, 14, 0.40);
  --hl-elevation-modal: 0 24px 64px rgba(10, 4, 14, 0.52);
  --hl-z-base: 0;
  --hl-z-raised: 10;
  --hl-z-rail: 20;
  --hl-z-panel: 30;
  --hl-z-popover: 40;
  --hl-z-scrim: 50;
  --hl-z-modal: 60;
  --hl-z-toast: 70;
  --hl-opacity-disabled: 0.45;
  --hl-opacity-scrim: 0.62;
  --hl-opacity-hairline: 0.6;
}

/* Document roles. Invariant: rendered correspondence is paper on any canvas. */
:root {
  --hl-paper: #FCFBF9;
  --hl-paper-raised: #FFFFFF;
  --hl-paper-ink: #191418;
  --hl-paper-ink-muted: #55505A;
  --hl-paper-line: #E4E0E2;
}

/* Heirloom: The default world. Aubergine frame, quiet violet neutrals and deliberate gold value. The only theme the counterparty and public shells may load. */

:root, [data-theme="heirloom"] {
  color-scheme: dark;
  --hl-surface-sunken: #18161D;
  --hl-surface: #222028;
  --hl-surface-raised: #2C2832;
  --hl-ink: #F3F0F5;
  --hl-ink-muted: #C1B8C8;
  --hl-ink-subtle: #C1B8C8;
  --hl-line: #4B4453;
  --hl-line-strong: #897F94;
  --hl-accent: #C5ADD9;
  --hl-accent-ink: #C5ADD9;
  --hl-accent-surface: #342B40;
  --hl-on-accent: #18161D;
  --hl-value: #D7AE4A;
  --hl-value-ink: #D7AE4A;
  --hl-value-surface: #33240F;
  --hl-on-value: #1A1206;
  --hl-agent: #44A793;
  --hl-agent-ink: #95DACC;
  --hl-agent-surface: #0E201C;
  --hl-on-agent: #061411;
  --hl-selected-surface: #342B40;
  --hl-selected-ink: #F3F0F5;
  --hl-selected-edge: #C5ADD9;
  --hl-focus-ring: #D7AE4A;
  --hl-link-ink: #C5ADD9;
  --hl-info: #5B8FC7;
  --hl-info-ink: #9CC2E6;
  --hl-info-surface: #10202E;
  --hl-info-on-fill: #05121E;
  --hl-success: #4E9A6B;
  --hl-success-ink: #84C7A0;
  --hl-success-surface: #0F2419;
  --hl-success-on-fill: #04140B;
  --hl-warning: #C97B3A;
  --hl-warning-ink: #E3A870;
  --hl-warning-surface: #2B1E0C;
  --hl-warning-on-fill: #1A0E03;
  --hl-danger: #CE6B65;
  --hl-danger-ink: #E5928D;
  --hl-danger-surface: #2C1211;
  --hl-danger-on-fill: #1B0605;
  --hl-email-header-surface: #16071E;
  --hl-email-header-ink: #F1EBF6;
  --hl-email-rule: #3B2649;
  --hl-email-body-surface: #1D0B29;
  --hl-email-footer-ink: #C6BAD1;
  /* chrome is mode-invariant: the frame stays dark in light mode */
  --hl-chrome-surface: #1B1421;
  --hl-chrome-surface-raised: #241C2A;
  --hl-chrome-ink: #F3EDF7;
  --hl-chrome-ink-muted: #C4B8CD;
  --hl-chrome-line: #493B52;
  --hl-chrome-line-strong: #95849F;
  --hl-chrome-accent: #C5ADD9;
  --hl-chrome-selected-surface: #382643;
  --hl-chrome-selected-ink: #F3EDF7;
  --hl-chrome-selected-edge: #C5ADD9;
}

@media (prefers-color-scheme: light) {
  :root:not([data-mode="dark"]), [data-theme="heirloom"]:not([data-mode="dark"]) {
    color-scheme: light;
    --hl-surface-sunken: #EEEAF1;
    --hl-surface: #F7F4F9;
    --hl-surface-raised: #FFFFFF;
    --hl-ink: #2B2431;
    --hl-ink-muted: #62566C;
    --hl-ink-subtle: #62566C;
    --hl-line: #DDD5E3;
    --hl-line-strong: #796984;
    --hl-accent: #614572;
    --hl-accent-ink: #614572;
    --hl-accent-surface: #E9DFEF;
    --hl-on-accent: #FFFFFF;
    --hl-value: #8F6B24;
    --hl-value-ink: #7A5A1E;
    --hl-value-surface: #F6EEDC;
    --hl-on-value: #FFFFFF;
    --hl-agent: #1B6556;
    --hl-agent-ink: #124E42;
    --hl-agent-surface: #E1EFEC;
    --hl-on-agent: #FFFFFF;
    --hl-selected-surface: #E9DFEF;
    --hl-selected-ink: #2B2431;
    --hl-selected-edge: #614572;
    --hl-focus-ring: #8F6B24;
    --hl-link-ink: #614572;
    --hl-info: #2E6BA8;
    --hl-info-ink: #1F5182;
    --hl-info-surface: #E6EEF7;
    --hl-info-on-fill: #FFFFFF;
    --hl-success: #2F7A50;
    --hl-success-ink: #22603D;
    --hl-success-surface: #E4F1E9;
    --hl-success-on-fill: #FFFFFF;
    --hl-warning: #A35F1C;
    --hl-warning-ink: #7E4913;
    --hl-warning-surface: #F8EEDF;
    --hl-warning-on-fill: #FFFFFF;
    --hl-danger: #B23A34;
    --hl-danger-ink: #8E2B27;
    --hl-danger-surface: #F9E8E7;
    --hl-danger-on-fill: #FFFFFF;
    --hl-email-header-surface: #16071E;
    --hl-email-header-ink: #F1EBF6;
    --hl-email-rule: #E4E0E2;
    --hl-email-body-surface: #FCFBF9;
    --hl-email-footer-ink: #55505A;
  }
}

:root[data-mode="light"], [data-theme="heirloom"][data-mode="light"] {
  color-scheme: light;
  --hl-surface-sunken: #EEEAF1;
  --hl-surface: #F7F4F9;
  --hl-surface-raised: #FFFFFF;
  --hl-ink: #2B2431;
  --hl-ink-muted: #62566C;
  --hl-ink-subtle: #62566C;
  --hl-line: #DDD5E3;
  --hl-line-strong: #796984;
  --hl-accent: #614572;
  --hl-accent-ink: #614572;
  --hl-accent-surface: #E9DFEF;
  --hl-on-accent: #FFFFFF;
  --hl-value: #8F6B24;
  --hl-value-ink: #7A5A1E;
  --hl-value-surface: #F6EEDC;
  --hl-on-value: #FFFFFF;
  --hl-agent: #1B6556;
  --hl-agent-ink: #124E42;
  --hl-agent-surface: #E1EFEC;
  --hl-on-agent: #FFFFFF;
  --hl-selected-surface: #E9DFEF;
  --hl-selected-ink: #2B2431;
  --hl-selected-edge: #614572;
  --hl-focus-ring: #8F6B24;
  --hl-link-ink: #614572;
  --hl-info: #2E6BA8;
  --hl-info-ink: #1F5182;
  --hl-info-surface: #E6EEF7;
  --hl-info-on-fill: #FFFFFF;
  --hl-success: #2F7A50;
  --hl-success-ink: #22603D;
  --hl-success-surface: #E4F1E9;
  --hl-success-on-fill: #FFFFFF;
  --hl-warning: #A35F1C;
  --hl-warning-ink: #7E4913;
  --hl-warning-surface: #F8EEDF;
  --hl-warning-on-fill: #FFFFFF;
  --hl-danger: #B23A34;
  --hl-danger-ink: #8E2B27;
  --hl-danger-surface: #F9E8E7;
  --hl-danger-on-fill: #FFFFFF;
  --hl-email-header-surface: #16071E;
  --hl-email-header-ink: #F1EBF6;
  --hl-email-rule: #E4E0E2;
  --hl-email-body-surface: #FCFBF9;
  --hl-email-footer-ink: #55505A;
}

/* Tier 3 component tokens. References only: never a value, never a hex. */
:root {
  /* rail */
  --hl-c-rail-background: var(--hl-chrome-surface);
  --hl-c-rail-ink: var(--hl-chrome-ink-muted);
  --hl-c-rail-ink-active: var(--hl-chrome-ink);
  --hl-c-rail-edge: var(--hl-chrome-line);
  --hl-c-rail-item-selected-background: var(--hl-chrome-selected-surface);
  --hl-c-rail-item-selected-ink: var(--hl-chrome-selected-ink);
  --hl-c-rail-item-selected-indicator: var(--hl-chrome-selected-edge);
  --hl-c-rail-badge-background: var(--hl-danger);
  --hl-c-rail-badge-ink: var(--hl-danger-on-fill);
  --hl-c-rail-width-expanded: var(--hl-layout-rail-expanded);
  --hl-c-rail-width-collapsed: var(--hl-layout-rail-collapsed);
  --hl-c-rail-item-height: var(--hl-layout-control-height);
  --hl-c-rail-icon-size: var(--hl-layout-icon-size);
  --hl-c-rail-indicator-width: var(--hl-border-indicator);
  --hl-c-rail-transition: var(--hl-duration-fast);
  /* topBar */
  --hl-c-top-bar-background: var(--hl-chrome-surface);
  --hl-c-top-bar-ink: var(--hl-chrome-ink-muted);
  --hl-c-top-bar-ink-active: var(--hl-chrome-ink);
  --hl-c-top-bar-edge: var(--hl-chrome-line);
  --hl-c-top-bar-item-selected-background: var(--hl-chrome-selected-surface);
  --hl-c-top-bar-item-selected-indicator: var(--hl-chrome-selected-edge);
  --hl-c-top-bar-height: var(--hl-layout-top-bar-height);
  --hl-c-top-bar-icon-size: var(--hl-layout-icon-size);
  /* secondPanel */
  --hl-c-second-panel-background: var(--hl-surface-sunken);
  --hl-c-second-panel-ink: var(--hl-ink);
  --hl-c-second-panel-ink-muted: var(--hl-ink-muted);
  --hl-c-second-panel-edge: var(--hl-line);
  --hl-c-second-panel-width: var(--hl-layout-second-panel-width);
  --hl-c-second-panel-padding: var(--hl-space-3);
  /* workSurface */
  --hl-c-work-surface-background: var(--hl-surface);
  --hl-c-work-surface-ink: var(--hl-ink);
  --hl-c-work-surface-padding: var(--hl-space-6);
  --hl-c-work-surface-content-max: var(--hl-layout-content-max);
  /* listRow */
  --hl-c-list-row-background: var(--hl-surface);
  --hl-c-list-row-background-hover: var(--hl-surface-raised);
  --hl-c-list-row-background-selected: var(--hl-selected-surface);
  --hl-c-list-row-ink: var(--hl-ink);
  --hl-c-list-row-ink-secondary: var(--hl-ink-muted);
  --hl-c-list-row-ink-tertiary: var(--hl-ink-subtle);
  --hl-c-list-row-divider: var(--hl-line);
  --hl-c-list-row-selected-indicator: var(--hl-selected-edge);
  --hl-c-list-row-ink-selected: var(--hl-selected-ink);
  --hl-c-list-row-min-height: var(--hl-layout-control-height);
  --hl-c-list-row-padding-x: var(--hl-space-3);
  --hl-c-list-row-font-size: var(--hl-text-sm);
  /* card */
  --hl-c-card-background: var(--hl-surface-raised);
  --hl-c-card-ink: var(--hl-ink);
  --hl-c-card-edge: var(--hl-line-strong);
  --hl-c-card-radius: var(--hl-radius-base);
  --hl-c-card-padding: var(--hl-space-4);
  --hl-c-card-shadow: var(--hl-elevation-raised);
  /* documentCard */
  --hl-c-document-card-background: var(--hl-paper-raised);
  --hl-c-document-card-background-sunken: var(--hl-paper);
  --hl-c-document-card-ink: var(--hl-paper-ink);
  --hl-c-document-card-ink-muted: var(--hl-paper-ink-muted);
  --hl-c-document-card-rule: var(--hl-paper-line);
  --hl-c-document-card-radius: var(--hl-radius-base);
  --hl-c-document-card-padding: var(--hl-space-6);
  --hl-c-document-card-font: var(--hl-font-serif);
  --hl-c-document-card-measure: var(--hl-layout-prose-max);
  --hl-c-document-card-shadow: var(--hl-elevation-panel);
  /* buttonPrimary */
  --hl-c-button-primary-background: var(--hl-accent);
  --hl-c-button-primary-ink: var(--hl-on-accent);
  --hl-c-button-primary-edge: var(--hl-accent);
  --hl-c-button-primary-focus-ring: var(--hl-focus-ring);
  --hl-c-button-primary-height: var(--hl-layout-control-height);
  --hl-c-button-primary-radius: var(--hl-radius-md);
  --hl-c-button-primary-padding-x: var(--hl-space-3);
  --hl-c-button-primary-font-size: var(--hl-text-sm);
  --hl-c-button-primary-font-weight: var(--hl-weight-medium);
  --hl-c-button-primary-focus-width: var(--hl-border-focus);
  /* buttonSecondary */
  --hl-c-button-secondary-background: var(--hl-surface-raised);
  --hl-c-button-secondary-ink: var(--hl-ink);
  --hl-c-button-secondary-edge: var(--hl-line-strong);
  --hl-c-button-secondary-focus-ring: var(--hl-focus-ring);
  --hl-c-button-secondary-height: var(--hl-layout-control-height);
  --hl-c-button-secondary-radius: var(--hl-radius-md);
  --hl-c-button-secondary-padding-x: var(--hl-space-3);
  --hl-c-button-secondary-font-size: var(--hl-text-sm);
  /* buttonDanger */
  --hl-c-button-danger-background: var(--hl-danger);
  --hl-c-button-danger-ink: var(--hl-danger-on-fill);
  --hl-c-button-danger-focus-ring: var(--hl-focus-ring);
  --hl-c-button-danger-height: var(--hl-layout-control-height);
  --hl-c-button-danger-radius: var(--hl-radius-md);
  /* input */
  --hl-c-input-background: var(--hl-surface-sunken);
  --hl-c-input-ink: var(--hl-ink);
  --hl-c-input-placeholder: var(--hl-ink-subtle);
  --hl-c-input-edge: var(--hl-line-strong);
  --hl-c-input-edge-focus: var(--hl-focus-ring);
  --hl-c-input-height: var(--hl-layout-control-height);
  --hl-c-input-radius: var(--hl-radius-md);
  --hl-c-input-padding-x: var(--hl-space-2);
  --hl-c-input-font-size: var(--hl-text-sm);
  /* badge */
  --hl-c-badge-background: var(--hl-accent-surface);
  --hl-c-badge-ink: var(--hl-accent-ink);
  --hl-c-badge-radius: var(--hl-radius-full);
  --hl-c-badge-padding-x: var(--hl-space-2);
  --hl-c-badge-font-size: var(--hl-text-xs);
  --hl-c-badge-font-weight: var(--hl-weight-medium);
  --hl-c-badge-letter-spacing: var(--hl-tracking-wide);
  /* evidence */
  --hl-c-evidence-background: var(--hl-value-surface);
  --hl-c-evidence-ink: var(--hl-value-ink);
  --hl-c-evidence-edge: var(--hl-line-strong);
  --hl-c-evidence-font: var(--hl-font-mono);
  --hl-c-evidence-font-size: var(--hl-text-xs);
  --hl-c-evidence-radius: var(--hl-radius-sm);
  --hl-c-evidence-padding-x: var(--hl-space-2);
  /* agentPresence */
  --hl-c-agent-presence-background: var(--hl-agent-surface);
  --hl-c-agent-presence-ink: var(--hl-agent-ink);
  --hl-c-agent-presence-edge: var(--hl-agent);
  --hl-c-agent-presence-indicator: var(--hl-agent);
  --hl-c-agent-presence-radius: var(--hl-radius-base);
  --hl-c-agent-presence-padding-x: var(--hl-space-3);
  --hl-c-agent-presence-font-size: var(--hl-text-sm);
  /* commandPalette */
  --hl-c-command-palette-background: var(--hl-surface-raised);
  --hl-c-command-palette-ink: var(--hl-ink);
  --hl-c-command-palette-edge: var(--hl-line-strong);
  --hl-c-command-palette-scrim: var(--hl-surface-sunken);
  --hl-c-command-palette-scrim-opacity: var(--hl-opacity-scrim);
  --hl-c-command-palette-radius: var(--hl-radius-lg);
  --hl-c-command-palette-shadow: var(--hl-elevation-modal);
  --hl-c-command-palette-z-index: var(--hl-z-modal);
  --hl-c-command-palette-transition: var(--hl-duration-fast);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --hl-duration-instant: 1ms;
    --hl-duration-fast: 1ms;
    --hl-duration-base: 1ms;
    --hl-duration-settle: 1ms;
  }
}