:root {
  color-scheme: light;

  --cm-font-ui: "Instrument Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --cm-font-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, ui-monospace, monospace;

  --cm-bg: #f6f7f9;
  --cm-surface: #ffffff;
  --cm-ink: #1a1d23;
  --cm-text-2: #5a6272;
  --cm-text-3: #667080;
  --cm-placeholder: #667080;
  --cm-line: #e7eaf0;
  --cm-line-soft: #eff2f6;
  --cm-field-border: #d7dce5;
  --cm-chip-bg: #eef1f5;

  --cm-brand: #0f766e;
  --cm-brand-strong: #115e59;
  --cm-brand-soft: rgba(15, 118, 110, 0.14);
  --cm-brand-border: rgba(15, 118, 110, 0.46);
  --cm-brand-ring: rgba(15, 118, 110, 0.14);
  --cm-brand-rail: rgba(15, 118, 110, 0.65);
  --cm-on-brand: #ffffff;
  --cm-on-brand-muted: rgba(255, 255, 255, 0.82);
  --cm-logo-start: #2DD4BF;
  --cm-logo-mid: #1FC8B6;
  --cm-logo-end: #14B8A6;

  --cm-ok: #067647;
  --cm-ok-soft: #eaf4ef;
  --cm-ok-mark: rgba(6, 118, 71, 0.12);
  --cm-ok-tint: rgba(6, 118, 71, 0.06);
  --cm-ok-state: rgba(6, 118, 71, 0.035);
  --cm-ok-border: rgba(6, 118, 71, 0.24);
  --cm-ok-border-strong: rgba(6, 118, 71, 0.32);

  --cm-warn: #b54708;
  --cm-warn-soft: rgba(181, 71, 8, 0.13);
  --cm-warn-tint: rgba(181, 71, 8, 0.045);
  --cm-warn-border: rgba(181, 71, 8, 0.28);

  --cm-err: #b42318;
  --cm-err-soft: rgba(180, 35, 24, 0.12);

  --cm-usdc: #2775ca;
  --cm-usdc-soft: rgba(39, 117, 202, 0.14);
  --cm-usdc-tint: rgba(39, 117, 202, 0.10);
  --cm-usdc-border: rgba(39, 117, 202, 0.45);
  --cm-usdc-border-soft: rgba(39, 117, 202, 0.26);
  --cm-usdc-border-strong: rgba(39, 117, 202, 0.72);

  --cm-route-gradient: linear-gradient(135deg, var(--cm-usdc-soft), var(--cm-brand-soft));
  --cm-route-gradient-soft: linear-gradient(135deg, var(--cm-usdc-tint), var(--cm-brand-soft));
  --cm-route-inset: inset 0 0 0 6px var(--cm-usdc-tint);
  --cm-route-rail: linear-gradient(90deg, var(--cm-line), var(--cm-brand-rail));

  --cm-visa: #1434cb;
  --cm-mc-red: #eb001b;
  --cm-mc-orange: #f79e1b;
  --cm-row-hover-border: #b9c0cc;
  --cm-pay-black: #000000;

  --cm-r-s: 4px;
  --cm-r-m: 8px;
  --cm-r-l: 12px;
  --cm-radius-chip: var(--cm-r-s);
  --cm-radius-control: var(--cm-r-m);
  --cm-radius-card: var(--cm-r-l);

  --cm-space-1: 4px;
  --cm-space-2: 8px;
  --cm-space-3: 12px;
  --cm-space-4: 16px;
  --cm-space-5: 20px;
  --cm-space-6: 24px;
  --cm-space-8: 32px;
  --cm-space-12: 48px;

  --cm-shadow-card: 0 1px 2px rgba(16, 24, 40, 0.05), 0 4px 12px rgba(16, 24, 40, 0.05);
  --cm-focus: 0 0 0 3px var(--cm-brand-soft);

  --cm-type-amount-xl: 600 46px/1.05 var(--cm-font-ui);
  --cm-type-amount: 600 34px/1.1 var(--cm-font-ui);
  --cm-type-title: 700 22px/1.15 var(--cm-font-ui);
  --cm-type-body: 400 14px/1.6 var(--cm-font-ui);
  --cm-type-sub: 400 13px/1.55 var(--cm-font-ui);
  --cm-type-meta: 400 12px/1.5 var(--cm-font-ui);
  --cm-type-mono: 500 11px/1.9 var(--cm-font-mono);
}