/* GENERATED from design-system/tokens.json by design-system/build-tokens.mjs. Do not edit by hand. */

:root,
[data-theme="light"] {
  --bg-grouped: #f4f1ee;
  --surface: #fcfaf7;
  --surface-glass: #fcfaf7;
  --fill-search: #e4e2df;
  --fill-selected: #ebe9e6;
  --fill-raised: var(--surface);
  --ink: #14222b;
  --ink-tab: var(--ink);
  --ink-secondary: #5a6368;
  --ink-placeholder: #5a6368;
  --accent: #0050f0;
  --accent-pressed: #003fc0;
  --on-accent: #ffffff;
  --focus-ring: var(--accent);
  --success: #337628;
  --danger: #be0808;
  --separator: #b6b9ba;
  --grabber: #cecfce;
  --scrim: rgba(20, 34, 43, 0.25);
  --highlight: #c6dae5;
  --shadow-float: 0 8px 24px rgba(20, 34, 43, 0.07), 0 1px 3px rgba(20, 34, 43, 0.05);
  --shadow-row-expanded: 0 6px 10px -6px rgba(20, 34, 43, 0.2);
  --shadow-sheet: 0 -1px 12px rgba(20, 34, 43, 0.08);
}

[data-theme="dark"] {
  --bg-grouped: #0c1317;
  --surface: #172229;
  --surface-glass: #1f2c34;
  --fill-search: #1f2c34;
  --fill-selected: #2c3a43;
  --fill-raised: #34444e;
  --ink: #fcfaf7;
  --ink-tab: var(--ink);
  --ink-secondary: #a3adb2;
  --ink-placeholder: #9aa4a9;
  --accent: #5aa9ff;
  --accent-pressed: #8ac2ff;
  --on-accent: #14222b;
  --focus-ring: var(--accent);
  --success: #30d158;
  --danger: #ff8078;
  --separator: #44545d;
  --grabber: #52636c;
  --scrim: rgba(0, 0, 0, 0.55);
  --highlight: #274554;
  --shadow-float: 0 8px 24px rgba(0, 0, 0, 0.5), 0 0 0 0.5px rgba(252, 250, 247, 0.08);
  --shadow-row-expanded: 0 6px 10px -6px rgba(0, 0, 0, 0.7);
  --shadow-sheet: 0 -1px 0 rgba(252, 250, 247, 0.08);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --bg-grouped: #0c1317;
    --surface: #172229;
    --surface-glass: #1f2c34;
    --fill-search: #1f2c34;
    --fill-selected: #2c3a43;
    --fill-raised: #34444e;
    --ink: #fcfaf7;
    --ink-tab: var(--ink);
    --ink-secondary: #a3adb2;
    --ink-placeholder: #9aa4a9;
    --accent: #5aa9ff;
    --accent-pressed: #8ac2ff;
    --on-accent: #14222b;
    --focus-ring: var(--accent);
    --success: #30d158;
    --danger: #ff8078;
    --separator: #44545d;
    --grabber: #52636c;
    --scrim: rgba(0, 0, 0, 0.55);
    --highlight: #274554;
    --shadow-float: 0 8px 24px rgba(0, 0, 0, 0.5), 0 0 0 0.5px rgba(252, 250, 247, 0.08);
    --shadow-row-expanded: 0 6px 10px -6px rgba(0, 0, 0, 0.7);
    --shadow-sheet: 0 -1px 0 rgba(252, 250, 247, 0.08);
  }
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --radius-card: 26px;
  --radius-sheet: 38px;
  --radius-full: 999px;
  --size-control: 44px;
  --size-cell: 52px;
  --size-button: 50px;
  --size-tab-bar: 62px;
  --size-icon: 22px;
  --size-glyph: 14px;
  --size-key: 72px;
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", system-ui, sans-serif;
}

/* Type styles: add the class, or copy the declarations into a component rule. */
.fims-text-large-title { font-family: var(--font-sans); font-size: 34px; line-height: 41px; font-weight: 700; }
.fims-text-title-3 { font-family: var(--font-sans); font-size: 20px; line-height: 25px; font-weight: 600; }
.fims-text-headline { font-family: var(--font-sans); font-size: 17px; line-height: 22px; font-weight: 600; }
.fims-text-body { font-family: var(--font-sans); font-size: 17px; line-height: 22px; font-weight: 400; }
.fims-text-subheadline { font-family: var(--font-sans); font-size: 15px; line-height: 20px; font-weight: 400; }
.fims-text-footnote { font-family: var(--font-sans); font-size: 13px; line-height: 18px; font-weight: 400; }
.fims-text-keypad { font-family: var(--font-sans); font-size: 30px; line-height: 36px; font-weight: 400; }
.fims-text-tab-label { font-family: var(--font-sans); font-size: 10px; line-height: 12px; font-weight: 600; }