/* values copied from frontend monorepo packages/spark/src/theme/tokens/*.ts (Spark 2.0) via recharge-auth spark_tokens.html; no build link, so drift is silent */
@font-face {
  font-family: "Mackinac Pro";
  font-weight: 350;
  font-style: normal;
  font-display: swap;
  src: url("fonts/mackinac-book.woff2") format("woff2");
}
:root {
  --fonts-heading: "Mackinac Pro", Georgia, serif;
  --fonts-body: Inter, system-ui, -apple-system, sans-serif;
  --fonts-mono: "Space Mono", monospace;
  --fonts-code: Inconsolata, "Space Mono", monospace;
  --radii-xs: 4px;
  --radii-s: 8px;
  --radii-m: 12px;
  --radii-l: 16px;
  --radii-pill: 999px;
  --shadows-button-lift: 0 0 2px 0 rgba(0, 0, 0, 0) inset, 0 2px 4px 0 rgba(0, 0, 0, 0.04), 0 0 2px 0 rgba(0, 0, 0, 0.32), 0 1px 1px 0 rgba(0, 0, 0, 0) inset, 0 1px 2px 0 rgba(0, 0, 0, 0) inset;
  --shadows-button-hover: 0 0 2px 0 rgba(0, 0, 0, 0.16) inset, 0 0 1px 0 rgba(255, 255, 255, 0.6), 0 1px 3px 0 rgba(0, 0, 0, 0.08), 0 1px 1px 0 rgba(0, 0, 0, 0.12) inset, 0 1px 2px 0 rgba(0, 0, 0, 0.06) inset;
  --shadows-button-pressed: 0 0 3px 0 rgba(0, 0, 0, 0.3) inset, 0 -1px 2px 0 rgba(255, 255, 255, 0.8), 0 -2px 2px 0 rgba(0, 0, 0, 0.04), 0 -1px 4px 0 rgba(255, 255, 255, 0.54) inset, 0 2px 6px 0 rgba(0, 0, 0, 0.4) inset;
  --shadows-button-pressed-subtle: 0 0 2px 0 rgba(0, 0, 0, 0) inset, 0 -1px 2px 0 rgba(255, 255, 255, 0.2), 0 -2px 2px 0 rgba(0, 0, 0, 0.04), 0 1px 1px 0 rgba(0, 0, 0, 0) inset, 0 1px 2px 0 rgba(0, 0, 0, 0.16) inset;
}
:root, .light {
  color-scheme: light;
  --colors-fg: #000000;
  --colors-fg-secondary: #666666;
  --colors-fg-tertiary: #808080;
  --colors-fg-inactive: #999999;
  --colors-fg-inverse: #ffffff;
  --colors-fg-inverse-subtle: #b2b2b2;
  --colors-bg: #ffffff;
  --colors-bg-subtle: #fcfaf9;
  --colors-bg-medium: #f8f4f1;
  --colors-bg-strong: #ede9e6;
  --colors-bg-inactive: #ede9e6;
  --colors-bg-hover: #dbe5fb;
  --colors-bg-selected: #e7edfc;
  --colors-bg-inverse: #000000;
  --colors-border: #d8d4d1;
  --colors-border-subtle: #ede9e6;
  --colors-border-strong: #c4c0bd;
  --colors-border-hover: #808080;
  --colors-border-elevation: #ede9e6;
  --colors-border-elevation-hover: #808080;
  --colors-focus: #dcec5a;
  --colors-focus-destructive: #ffbda5;
  --colors-ghost: rgba(126, 42, 19, 0.08);
  --colors-ghost-hover: rgba(106, 38, 20, 0.1);
  --colors-ghost-active: rgba(55, 38, 34, 0.5);
  --colors-ghost-overlay: rgba(36, 23, 19, 0.8);
  --colors-ghost-contrast: #000000;
  --colors-primary: #0129f1;
  --colors-primary-hover: #0000bb;
  --colors-primary-inactive: #b3bffb;
  --colors-primary-contrast: #ffffff;
  --colors-secondary: #ffffff;
  --colors-secondary-hover: #fbf9f7;
  --colors-secondary-inactive: #ede9e6;
  --colors-secondary-contrast: #000000;
  --colors-destructive: #cc2800;
  --colors-destructive-hover: #b20e00;
  --colors-destructive-subtle: #ffded2;
  --colors-destructive-inactive: #ffbda5;
  --colors-destructive-contrast: #ffffff;
  --colors-admin: #b92d40;
  --colors-admin-hover: #960a1d;
  --colors-admin-subtle: #fce0e4;
  --colors-admin-inactive: #f7b1ba;
  --colors-admin-contrast: #ffffff;
  --colors-success: #098671;
  --colors-success-strong: #006d58;
  --colors-success-subtle: #bde3dc;
  --colors-success-contrast: #ffffff;
  --colors-warning: #ffb81f;
  --colors-warning-subtle: #ffe3a5;
  --colors-warning-strong: #cc8500;
  --colors-warning-contrast: #000000;
  --colors-info: #cfdcf9;
  --colors-info-contrast: #000000;
  --colors-accent: #dcec5a;
  --colors-accent-contrast: #000000;
  --colors-data-1: #677ff7;
  --colors-data-in-progress-1: #ccd4fc;
  --colors-status-active: #22a08b;
  --colors-status-error: #ff5b1f;
  --colors-status-queued: #4d69f5;
  --colors-status-inactive: #999999;
  --shadows-elevation-lg: 0 0 72px 0 rgba(0, 0, 0, 0.04), 0 2px 4px 0 rgba(25, 29, 72, 0.12), 0 0 24px 0 rgba(0, 0, 0, 0.16);
  --shadows-elevation-sm: 0 0 6px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.12);
  --shadows-elevation-md: 0 2px 4px 0 rgba(0, 0, 0, 0.08), 0 0 4px 0 rgba(0, 0, 0, 0.12), 0 4px 16px 0 rgba(0, 0, 0, 0.1);
  --shadows-sink: 0 0 2px 2px white, 0 1px 4px 0 rgba(0, 0, 0, 0.08), inset 0 1px 1px 0 rgba(0, 0, 0, 0.04), inset 0 1px 3px 0 rgba(0, 0, 0, 0.08);
  --shadows-field-focus: 0 0 0 4px #dcec5a, 0 4px 12px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.15);
}
.dark {
  color-scheme: dark;
  --colors-fg: #f7f3f0;
  --colors-fg-secondary: #cecac7;
  --colors-fg-tertiary: #b0aca9;
  --colors-fg-inactive: #808080;
  --colors-fg-inverse: #000000;
  --colors-fg-inverse-subtle: #666666;
  --colors-bg: #242424;
  --colors-bg-subtle: #1a1a1a;
  --colors-bg-medium: #333333;
  --colors-bg-strong: #333333;
  --colors-bg-inactive: #4d4d4d;
  --colors-bg-hover: rgba(255, 255, 255, 0.08);
  --colors-bg-selected: rgba(255, 255, 255, 0.15);
  --colors-bg-inverse: #f7f3f0;
  --colors-border: #4d4d4d;
  --colors-border-subtle: #333333;
  --colors-border-strong: #999999;
  --colors-border-hover: #cccccc;
  --colors-border-elevation: #4d4d4d;
  --colors-border-elevation-hover: #999999;
  --colors-focus: #718100;
  --colors-focus-destructive: #ffbda5;
  --colors-ghost: rgba(255, 255, 255, 0.08);
  --colors-ghost-hover: rgba(255, 255, 255, 0.15);
  --colors-ghost-active: rgba(255, 255, 255, 0.5);
  --colors-ghost-overlay: rgba(255, 255, 255, 0.8);
  --colors-ghost-contrast: #ffffff;
  --colors-primary: #ffffff;
  --colors-primary-hover: #f8f4f1;
  --colors-primary-inactive: #a5a19e;
  --colors-primary-contrast: #000000;
  --colors-secondary: #333333;
  --colors-secondary-hover: #4d4d4d;
  --colors-secondary-inactive: #bab6b3;
  --colors-secondary-contrast: #f7f3f0;
  --colors-destructive: #ff6b36;
  --colors-destructive-hover: #e54106;
  --colors-destructive-subtle: #660000;
  --colors-destructive-inactive: #ffad8f;
  --colors-destructive-contrast: #ffffff;
  --colors-admin: #cb3f52;
  --colors-admin-hover: #f17384;
  --colors-admin-subtle: #f9c1c8;
  --colors-admin-inactive: #666666;
  --colors-admin-contrast: #ffffff;
  --colors-success: #22a08b;
  --colors-success-strong: #22a08b;
  --colors-success-subtle: #7ac6ba;
  --colors-success-contrast: #ffffff;
  --colors-warning: #ffb81f;
  --colors-warning-subtle: #ffd479;
  --colors-warning-strong: #cc8500;
  --colors-warning-contrast: #000000;
  --colors-info: #5271bb;
  --colors-info-contrast: #ffffff;
  --colors-accent: #a6b624;
  --colors-accent-contrast: #000000;
  --colors-data-1: #677ff7;
  --colors-data-in-progress-1: #ccd4fc;
  --shadows-elevation-lg: 0 0 0 1px var(--colors-border-elevation), 0 8px 32px 0 rgba(0, 0, 0, 0.6);
  --shadows-elevation-sm: 0 0 0 1px var(--colors-border-elevation);
  --shadows-elevation-md: 0 0 0 1px var(--colors-border-elevation);
  --shadows-sink: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 1px 4px 0 rgba(0, 0, 0, 0.5), inset 0 1px 2px 0 rgba(0, 0, 0, 0.4), inset 0 -1px 0 0 rgba(255, 255, 255, 0.04);
  --shadows-field-focus: 0 0 0 4px #718100, 0 4px 12px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.15);
}
