/* GENERATED from Tiptree design-system v0.5.0 — DO NOT EDIT. */
:root {
  --tt-brand-black: #1b1b1b;
  --tt-brand-teal-dark: #47696b;
  --tt-brand-teal-light: #638b8d;
  --tt-brand-yellow: #e3e6a6;
  --tt-brand-white: #ffffff;
  --tt-brand-grey: #edede9;
  --tt-brand-grey-medium: #adada8;
  --tt-stone-000: #ffffff;
  --tt-stone-050: #fcfcfa;
  --tt-stone-100: #f8f8f6;
  --tt-stone-150: #f1f1ec;
  --tt-stone-200: var(--tt-brand-grey);
  --tt-stone-250: #e6e6e0;
  --tt-stone-300: #dcdcd4;
  --tt-stone-350: #cfcfc6;
  --tt-stone-400: #bebeb3;
  --tt-stone-450: #a6a69b;
  --tt-stone-500: #909088;
  --tt-stone-550: #7e7c73;
  --tt-stone-600: #6f6f67;
  --tt-stone-650: #5c5c55;
  --tt-stone-700: #4d4d47;
  --tt-stone-750: #3b3b38;
  --tt-stone-800: #33332f;
  --tt-stone-850: #2c2c2a;
  --tt-stone-875: #262624;
  --tt-stone-900: #1f1f1e;
  --tt-stone-950: #1a1a19;
  --tt-stone-1000: #141413;
  --tt-teal-100: #e4eeee;
  --tt-teal-200: #c8dcdc;
  --tt-teal-300: #a3c3c4;
  --tt-teal-400: #82a7a9;
  --tt-teal-500: var(--tt-brand-teal-light);
  --tt-teal-600: var(--tt-brand-teal-dark);
  --tt-teal-700: #3a5759;
  --tt-teal-800: #2d4345;
  --tt-teal-900: #1f3031;
  --tt-citron-100: #f4f5db;
  --tt-citron-200: var(--tt-brand-yellow);
  --tt-citron-300: #cfd478;
  --tt-citron-400: #b7be54;
  --tt-citron-500: #9ba23c;
  --tt-citron-600: #7d842e;
  --tt-citron-700: #616724;
  --tt-citron-800: #474b1b;
  --tt-citron-900: #2f3212;
  --tt-color-red: #eb5757;
  --tt-color-green: #27a644;
  --tt-color-orange: #fc7840;
  --tt-color-yellow: #f0bf00;
  --tt-color-blue: #0a84ff;
  --tt-font-sans: 'Inter', 'SF Pro Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --tt-font-serif: 'Literata', Georgia, serif;
  --tt-font-mono: ui-monospace, 'SF Mono', Menlo, monospace;
  --tt-radius-4: 4px;
  --tt-radius-6: 6px;
  --tt-radius-8: 8px;
  --tt-radius-12: 12px;
  --tt-radius-16: 16px;
  --tt-radius-24: 24px;
  --tt-radius-full: 9999px;
  --tt-speed-quick: 0.1s;
  --tt-speed-regular: 0.25s;
  --tt-ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --tt-ease-in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1);
  --tt-z-header: 100;
  --tt-z-overlay: 500;
  --tt-z-popover: 600;
  --tt-z-dialog: 700;
  --tt-z-toast: 800;
  --tt-z-tooltip: 1100;
  --tt-focus-ring-width: 2px;
  --tt-focus-ring-offset: 2px;
}
/* GENERATED from Tiptree design-system v0.5.0 — DO NOT EDIT. */
:root {
  color-scheme: dark;
  --tt-color-bg-primary: var(--tt-stone-950);
  --tt-color-bg-secondary: var(--tt-stone-875);
  --tt-color-bg-tertiary: var(--tt-stone-850);
  --tt-color-surface-card: var(--tt-stone-875);
  --tt-color-surface-code: var(--tt-stone-950);
  --tt-color-surface-hover: #ffffff0f;
  --tt-color-text-primary: var(--tt-stone-100);
  --tt-color-text-quaternary: var(--tt-stone-550);
  --tt-color-text-secondary: #ccc9c0;
  --tt-color-text-tertiary: var(--tt-stone-450);
  --tt-color-border-interactive: #464641;
  --tt-color-border-primary: var(--tt-stone-750);
  --tt-color-border-translucent: #ffffff12;
  --tt-color-accent: var(--tt-teal-400);
  --tt-color-accent-hover: var(--tt-teal-300);
  --tt-color-accent-on-surface: var(--tt-color-accent);
  --tt-color-accent-on-surface-hover: var(--tt-color-accent-hover);
  --tt-color-accent-tint: #1f2928;
  --tt-color-action-danger-bg: var(--tt-color-red);
  --tt-color-action-danger-bg-hover: #d64c4c;
  --tt-color-action-danger-bg-pressed: #c24444;
  --tt-color-action-danger-fg: var(--tt-brand-black);
  --tt-color-action-disabled-bg: #ffffff14;
  --tt-color-link: var(--tt-teal-300);
  --tt-color-highlight: #d6dc85;
  --tt-color-button-invert-bg: var(--tt-stone-200);
  --tt-color-button-invert-fg: var(--tt-brand-black);
  --tt-color-button-secondary-bg: var(--tt-stone-875);
  --tt-color-button-secondary-border: var(--tt-stone-550);
  --tt-color-focus-ring: var(--tt-teal-400);
  --tt-color-surface-inverse: var(--tt-color-button-invert-bg);
  --tt-color-surface-sunken: var(--tt-stone-1000);
  --tt-color-surface-tooltip: var(--tt-stone-200);
  --tt-color-scrollbar-thumb: #ffffff1a;
  --tt-color-status-success-fg: #6ee7b7;
  --tt-color-status-success-bg: #0f2e1f;
  --tt-color-status-success-bg-emphasis: var(--tt-color-status-success-bg);
  --tt-color-status-success-border: #166534;
  --tt-color-status-danger-fg: #fca5a5;
  --tt-color-status-danger-bg: #2e1414;
  --tt-color-status-danger-border: #7f1d1d;
  --tt-color-status-warning-fg: #fcd34d;
  --tt-color-status-warning-bg: #2a2510;
  --tt-color-status-warning-bg-emphasis: var(--tt-color-status-warning-bg);
  --tt-color-status-warning-border: #78350f;
  --tt-color-status-info-fg: #93c5fd;
  --tt-color-status-info-bg: #152040;
  --tt-color-status-info-border: #1e3a8a;
  --tt-color-text-on-inverse: var(--tt-color-button-invert-fg);
  --tt-shadow-low: 0px 2px 6px -2px #0000002b, 0px 1px 2px #00000022;
  --tt-shadow-medium: 0px 4px 14px -3px #00000036, 0px 1px 3px #00000026;
  --tt-shadow-high: 0px 20px 60px -8px #00000066, 0px 4px 12px #00000038;
}

[data-theme='light'] {
  color-scheme: only light;
  --tt-color-bg-primary: var(--tt-stone-050);
  --tt-color-bg-secondary: var(--tt-stone-150);
  --tt-color-bg-tertiary: var(--tt-stone-200);
  --tt-color-surface-card: var(--tt-stone-000);
  --tt-color-surface-code: var(--tt-stone-150);
  --tt-color-surface-hover: #1b1b1b0d;
  --tt-color-text-primary: var(--tt-brand-black);
  --tt-color-text-quaternary: var(--tt-stone-500);
  --tt-color-text-secondary: var(--tt-stone-700);
  --tt-color-text-tertiary: var(--tt-stone-600);
  --tt-color-border-interactive: var(--tt-stone-350);
  --tt-color-border-primary: var(--tt-stone-300);
  --tt-color-border-translucent: #0000000f;
  --tt-color-accent: var(--tt-teal-600);
  --tt-color-accent-hover: var(--tt-teal-700);
  --tt-color-accent-on-surface: var(--tt-color-accent);
  --tt-color-accent-on-surface-hover: var(--tt-color-accent-hover);
  --tt-color-accent-tint: var(--tt-teal-100);
  --tt-color-action-danger-bg: #b04a3f;
  --tt-color-action-danger-bg-hover: #963f36;
  --tt-color-action-danger-bg-pressed: #7f352e;
  --tt-color-action-danger-fg: var(--tt-stone-000);
  --tt-color-action-disabled-bg: #1b1b1b0f;
  --tt-color-link: var(--tt-teal-600);
  --tt-color-highlight: #8a9132;
  --tt-color-button-invert-bg: var(--tt-brand-black);
  --tt-color-button-invert-fg: var(--tt-brand-white);
  --tt-color-button-secondary-bg: var(--tt-stone-000);
  --tt-color-button-secondary-border: var(--tt-stone-550);
  --tt-color-focus-ring: #5e9cff;
  --tt-color-surface-inverse: var(--tt-color-button-invert-bg);
  --tt-color-surface-sunken: var(--tt-stone-150);
  --tt-color-surface-tooltip: #000000cc;
  --tt-color-scrollbar-thumb: #0000001a;
  --tt-color-status-success-fg: #047857;
  --tt-color-status-success-bg: #ecfdf5;
  --tt-color-status-success-bg-emphasis: #d1fae5;
  --tt-color-status-success-border: #bbf7d0;
  --tt-color-status-danger-fg: #dc2626;
  --tt-color-status-danger-bg: #fef2f2;
  --tt-color-status-danger-border: #fecaca;
  --tt-color-status-warning-fg: #92400e;
  --tt-color-status-warning-bg: #fffbeb;
  --tt-color-status-warning-bg-emphasis: #fef3c7;
  --tt-color-status-warning-border: #fde68a;
  --tt-color-status-info-fg: #4f46e5;
  --tt-color-status-info-bg: #eef2ff;
  --tt-color-status-info-border: #e2e8f0;
  --tt-color-text-on-inverse: var(--tt-color-button-invert-fg);
  --tt-shadow-low: 0px 2px 6px -2px #0000000d, 0px 1px 2px #00000008;
  --tt-shadow-medium: 0px 4px 14px -3px #00000012, 0px 1px 3px #0000000a;
  --tt-shadow-high: 0px 20px 60px -8px #0000001f, 0px 4px 12px #0000000d;
}
