@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/brand/fonts/archivo-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/brand/fonts/archivo-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/brand/fonts/archivo-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/brand/fonts/archivo-700.woff2') format('woff2');
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('/brand/fonts/archivo-900.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/brand/fonts/inter-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/brand/fonts/inter-500.woff2') format('woff2');
}

:root {
  /* Brand defaults — generated by bundle.js from brands/realagent-code/brand.json */
  --visitor-bubble: #EEF8C8;
  --bg: #FAFAF8;
  --maxy-bubble: #ECECE8;
  --font-display: 'Archivo', system-ui, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}


/* Brand chrome tokens — generated by bundle.js from brands/realagent-code/tokens.json */
:root {
  /* color */
  --color-global-neutral-0: #FFFFFF;
  --color-global-neutral-50: #F4F4F1; /* Surface / chrome background (cool neutral, not warm cream) */
  --color-global-neutral-100: #ECECE8; /* Selected row pill */
  --color-global-neutral-200: #E2E2DD; /* Hairlines, dividers */
  --color-global-neutral-400: #ABABA6; /* Disabled / strikethrough — cool neutral, not warm putty */
  --color-global-neutral-500: #767672; /* Muted / secondary text — cool neutral, matches the carbon identity */
  --color-global-neutral-700: #33332F; /* Body text */
  --color-global-neutral-900: #0F0F0F; /* Ink. */
  --color-global-brand-claudeOrange: #262626; /* Activity / copper accent — carbon-dark on the lime brand */
  --color-global-brand-ink: #0F0F0F; /* Swatch 2. Neutral black; replaces the blue-cast #12141A. */
  --color-global-brand-lime: #CDFF00; /* Swatch 1. Accent. */
  --color-global-brand-graphite: #2C2C2C; /* Swatch 3. */
  --color-global-brand-silver: #C7C7C7; /* Swatch 4. Borders; 1.69:1 on white, a hairline, never text. */
  --color-global-brand-white: #FFFFFF; /* Swatch 5. */
  --color-global-brand-slate: #6B6B6B; /* DERIVED. Muted text at 5.33:1 on white. The swatch set has no passing mid grey: Silver is 1.69:1 and Graphite 13.97:1 reads as black. */
  --color-global-brand-mist: #F4F4F4; /* DERIVED. Surface tint, a 1.10:1 step under a white card. The swatch set has nothing between White and Silver. */
  --color-global-accent-blue-100: #CDFF00; /* Lime signature fill. */
  --color-global-accent-blue-500: #0F0F0F; /* Ink. Links, primary action foreground. */
  --color-global-semantic-danger-100: #FEE2E2; /* Destructive action hover wash */
  --color-global-semantic-danger-500: #B91C1C; /* Destructive action background (End / Purge confirm). Added 2026-05-16; DESIGN.md v1 did not define a danger family. */
  --color-alias-surface-canvas: #FFFFFF;
  --color-alias-surface-chrome: #F4F4F1;
  --color-alias-surface-raisedSubtle: #ECECE8;
  --color-alias-surface-accentWash: rgba(14,14,14,.05); /* Task 1856: carbon hover/active/selection tint */
  --color-alias-surface-page: #F4F4F4; /* Mist. Gives the white card a value step to rise off. */
  --color-alias-surface-raised: #FFFFFF; /* White. The card plane. */
  --color-alias-surface-inset: #F4F4F4; /* Mist. Recedes from the card. */
  --color-alias-surface-inverse: #0F0F0F; /* Ink. The one inverted band per page. */
  --color-alias-text-primary: #0F0F0F; /* Ink. 19.17:1 on white. */
  --color-alias-text-body: #33332F;
  --color-alias-text-muted: #6B6B6B; /* Slate. 5.33:1 on white. */
  --color-alias-text-disabled: #ABABA6;
  --color-alias-text-link: #0F0F0F;
  --color-alias-text-onAccent: #0F0F0F;
  --color-alias-text-onInverse: #FFFFFF; /* White on Ink; the ramp is neutral, so no warm tint. */
  --color-alias-border-subtle: #C7C7C7; /* Silver. */
  --color-alias-border-strong: #ABABA6; /* Second border tier: secondary-button and checkbox borders. Separate from `subtle` so the two-tier system survives a brand override; every brand supplies neutral.400 in its own ramp. */
  --color-alias-border-card: #C7C7C7; /* Silver. */
  --color-alias-action-primaryBg: #CDFF00;
  --color-alias-action-primaryFg: #0F0F0F;
  --color-alias-action-ctaBg: #CDFF00; /* Lime. */
  --color-alias-action-ctaFg: #0F0F0F; /* Ink on Lime, 16.34:1. Never white on lime. */
  --color-alias-action-dangerBg: #B91C1C; /* Destructive confirm button background */
  --color-alias-action-dangerFg: #FFFFFF; /* Destructive confirm button text */
  --color-alias-action-dangerWash: #FEE2E2; /* Destructive hover background */
  --color-alias-status-activity: #262626; /* Agent-running indicator */
  --color-alias-status-success-solid: #0E7A4B; /* Task 2002: success solid fill. Carries white text. */
  --color-alias-status-success-tint: #E7F4ED; /* Task 2002: success pale tint. Carries textOnTint, never white. */
  --color-alias-status-success-textOnTint: #0A5836; /* Task 2002: success text on its own tint. */
  --color-alias-status-warning-solid: #B45309; /* Task 2002: warning solid fill. Carries white text. */
  --color-alias-status-warning-tint: #FCF0E0; /* Task 2002: warning pale tint. Carries textOnTint, never white. */
  --color-alias-status-warning-textOnTint: #843D07; /* Task 2002: warning text on its own tint. */
  --color-alias-status-error-solid: #B42318; /* Task 2002: error solid fill. Carries white text. */
  --color-alias-status-error-tint: #FBEAE8; /* Task 2002: error pale tint. Carries textOnTint, never white. */
  --color-alias-status-error-textOnTint: #851A12; /* Task 2002: error text on its own tint. */
  --color-alias-status-info-solid: #1D4ED8; /* Task 2002: info solid fill. Carries white text. */
  --color-alias-status-info-tint: #E8EDFC; /* Task 2002: info pale tint. Carries textOnTint, never white. */
  --color-alias-status-info-textOnTint: #16389E; /* Task 2002: info text on its own tint. */
  --color-component-sidebar-background: #F4F4F1;
  --color-component-sidebar-itemRest: transparent;
  --color-component-sidebar-itemSelected: #ECECE8;
  --color-component-sidebar-itemText: #33332F;
  --color-component-sidebar-sectionLabel: #6B6B6B;
  --color-component-tab-rest: transparent;
  --color-component-tab-active: #ECECE8;
  --color-component-codeInline-text: #0F0F0F;
  --color-component-taskItem-completedText: #ABABA6;
  --color-component-taskItem-pendingText: #33332F;
  --color-component-input-background: #FFFFFF;
  --color-component-input-border: #C7C7C7;
  --color-component-input-placeholder: #6B6B6B;

  /* typography */
  --typography-fontFamily-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; /* Body, UI */
  --typography-fontFamily-mono: 'JetBrains Mono', 'SF Mono', ui-monospace, monospace; /* Code refs, inline code */
  --typography-fontSize-xs: 11px; /* Section labels (Recents), bottom-bar meta */
  --typography-fontSize-sm: 13px; /* Sidebar items */
  --typography-fontSize-base: 15px; /* Body content / task list */
  --typography-fontSize-lg: 17px;
  --typography-fontSize-xl: 20px; /* Task 2002: card counts, tabular numerals. */
  --typography-fontSize-metric: clamp(1.4rem, 0.55vw + 1.23rem, 1.75rem); /* Task 2002: 22.4px floor, 28px at >=1513w. */
  --typography-fontSize-display: clamp(1.6rem, 0.62vw + 1.41rem, 2rem); /* Task 2002: 25.6px floor, 32px at >=1523w. Page titles. */
  --typography-fontWeight-regular: 400;
  --typography-fontWeight-medium: 500;
  --typography-fontWeight-semibold: 600;
  --typography-fontWeight-display: 600; /* Archivo semibold admin headings */
  --typography-fontWeight-displayTier: 900; /* Task 2005: raised 800 to 900, the top display tier on the live Real Agent site (h1, .mega, the wordmark). Backed by archivo-900.woff2. */
  --typography-lineHeight-tight: 1.3;
  --typography-lineHeight-normal: 1.5;
  --typography-lineHeight-relaxed: 1.7; /* Task list rows */
  --typography-lineHeight-display: 0.92;
  --typography-letterSpacing-display: -0.045em;
  --typography-letterSpacing-eyebrow: 0.22em;

  /* space */
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;

  /* radius */
  --radius-sm: 4px;
  --radius-md: 6px; /* Sidebar selected pill, input field */
  --radius-lg: 10px; /* Action buttons ('commit and merge') */
  --radius-pill: 9999px;
  --radius-brand: 4px; /* Task 1856: RealAgent control radius */
  --radius-card: 16px;
  --radius-control: 9999px;

  /* borderWidth */
  --borderWidth-hairline: 1px;

  /* layout */
  --layout-sidebarWidth: 240px; /* Approx — measure live */

  /* elevation */
  --elevation-0: none; /* Flat UI — no shadows visible in source */
  --elevation-raised: 0 22px 44px -20px rgba(20,20,20,.32);
  --elevation-floating: 0 40px 80px -30px rgba(14,14,14,.55), 0 12px 30px -14px rgba(14,14,14,.4);

  /* icon */
  --icon-size-sm: 14px; /* Inline w/ body text */
  --icon-size-md: 16px; /* Sidebar items, buttons */
  --icon-size-lg: 20px; /* Tab headers */
  --icon-strokeWidth-default: 1.75;

  /* motion */
  --motion-lift: -3px;
}