/* Brand tokens only. Product layout lives in max-document-ui / style.css. */
@import url("./fonts.css");

:root {
  color-scheme: dark;

  --i100: #E5EAFF;
  --i200: #C8D2FD;
  --i300: #A3B2FE;
  --i400: #7685F8;
  --i500: #545AEB;
  --i600: #4142CA;
  --i700: #3130A0;
  --i800: #212172;
  --i900: #14154D;
  --i950: #08092D;

  --canvas: #0C0D12;
  --surface: #16181F;
  --raised: #22242C;
  --border: #353741;
  --muted: #83868F;
  --text: #E9EBF2;

  --paper: #F4F5FA;
  --ink: #1F2937;
  --ink-muted: #374151;

  --signal: #F2A33A;
  --danger: #FA8072;
  --danger-fill: #991B1B;
  --danger-fill-hover: #A61B1B;
  --success: #7FD8BE;
  --success-fill: #14532D;
  --success-fill-hover: #166534;
  --grad: linear-gradient(135deg, #4142CA 0%, #212172 100%);

  --ff-display: "Manrope", system-ui, sans-serif;
  --fw-display: 600;
  --ls-display: -0.03em;
  --ff-ui: "Inter", system-ui, sans-serif;
  --ff-mono: "JetBrains Mono", "Fira Code", monospace;

  --r: 14px;
  --r-sm: 8px;
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 120ms;
  --dur-pulse: 1.1s;

  --font-display: var(--ff-display);
  --font-sans: var(--ff-ui);
  --font-mono: var(--ff-mono);
  --bg: var(--canvas);
  --panel: var(--surface);
  --panel-2: var(--raised);
  --mist: #16181F;
  --hairline: #353741;
  --accent: #4142CA;
  --accent-2: #A3B2FE;
  --accent-hover: #545AEB;
  --ok: #7FD8BE;
  --coral: #4142CA;
  --coral-ink: #3130A0;
  --cobalt: #545AEB;
  --cobalt-bright: #7685F8;
  --dark-paper: #0C0D12;
  --dark-surface: #16181F;
  --dark-surface-2: #22242C;
  --surface-2: #22242C;
  --fg: var(--text);
  --fg-muted: var(--muted);
  --max-ui-sans-font: var(--font-sans);
  --max-ui-display-font: var(--font-display);
  --max-ui-mono-font: var(--font-mono);
  --max-brand-wordmark-gradient: none;
  --max-brand-wordmark-gradient-light: none;

  --max-mark-chat-width: 16px;
  --max-mark-chat-height: 14px;
  --max-write-chat-width: 32px;
  --max-write-chat-height: 28px;
  --max-write-stroke: var(--success);
}

html[data-theme="light"],
[data-theme="light"] {
  color-scheme: light;
  --bg: #F4F5FA;
  --panel: #ffffff;
  --panel-2: #E8EAF3;
  --mist: #E8EAF3;
  --text: #1F2937;
  --muted: #374151;
  --border: #D1D5DB;
  --hairline: #D1D5DB;
  --surface: #ffffff;
  --surface-2: #EEF0F7;
  --fg: #1F2937;
  --fg-muted: #374151;
  --accent: #4142CA;
  --accent-2: #3130A0;
  --accent-hover: #545AEB;
  --paper: #F4F5FA;
  --ink: #1F2937;
}