/* Made by scripts/build_tokens.py from replica/design/tokens.json and tokens.dark.json. Do not edit. */

:root {
  --color-bg: #fbf5ec;
  --color-bg-neutral: #e9ebec;
  --color-bg-mint: #eff5f1;
  --color-bg-lavender: #ebe9f8;
  --color-bg-cream: #fbf5ec;
  --color-surface-neutral: #ffffff;
  --color-surface-2-neutral: #f3f4f5;
  --color-surface-3-neutral: #e4e7e9;
  --color-border-neutral: #dde0e3;
  --color-surface-mint: #ffffff;
  --color-surface-2-mint: #f4f8f5;
  --color-surface-3-mint: #e2ece6;
  --color-border-mint: #d7e3db;
  --color-surface-lavender: #ffffff;
  --color-surface-2-lavender: #f4f3fb;
  --color-surface-3-lavender: #e9e7f7;
  --color-border-lavender: #dcd8ee;
  --color-surface-cream: #ffffff;
  --color-surface-2-cream: #f8f2ea;
  --color-surface-3-cream: #efe5d8;
  --color-border-cream: #eadfd1;
  --color-surface: #ffffff;
  --color-surface-2: #f8f2ea;
  --color-surface-3: #efe5d8;
  --color-border: #eadfd1;
  --color-border-input: #8a7a6c;
  --color-text: #2b211b;
  --color-text-muted: #6a5a4e;
  --color-accent: #b93d0b;
  --color-accent-hover: #9a3412;
  --color-accent-soft: #feede0;
  --color-on-accent: #ffffff;
  --color-link: #1a5fb4;
  --color-info-soft: #e7f0fb;
  --color-danger: #b3261e;
  --color-danger-hover: #8f1d17;
  --color-danger-soft: #fde8e6;
  --color-on-danger: #ffffff;
  --color-success: #15803d;
  --color-warning: #7a4a00;
  --color-warning-soft: #fbe9b0;
  --color-star: #b26a00;
  --color-unread: #c62828;
  --color-on-unread: #ffffff;
  --color-role-owner: #9c2a7a;
  --color-role-admin: #0b6b74;
  --color-on-role: #ffffff;
  --color-avatar-1: #cdeccf;
  --color-avatar-2: #d5e4fc;
  --color-avatar-3: #e6dcfb;
  --color-avatar-4: #fae3c6;
  --color-avatar-5: #fbd8de;
  --color-avatar-6: #c9ebe5;
  --color-avatar-7: #dcdefb;
  --color-avatar-8: #f5d6f3;
  --color-on-avatar-1: #14532d;
  --color-on-avatar-2: #1e3a8a;
  --color-on-avatar-3: #4c1d95;
  --color-on-avatar-4: #78350f;
  --color-on-avatar-5: #881337;
  --color-on-avatar-6: #134e4a;
  --color-on-avatar-7: #312e81;
  --color-on-avatar-8: #701a75;
  --color-overlay-backdrop: rgba(43, 33, 27, 0.45);
  --color-highlight: #e9a514;
  --color-brand-ez: #a85a00;
  --color-brand-camp: #2b211b;
  --color-file-doc: #1f5fbf;
  --color-file-sheet: #1c7a3a;
  --color-file-slides: #b04a0a;
  --color-file-pdf: #c0281d;
  --color-file-image: #7442b8;
  --color-file-media: #0e6f78;
  --color-file-archive: #5c6670;
  --color-file-other: #5c6670;
  --color-on-file: #ffffff;
  --color-brand-googledrive: #1a73e8;
  --color-brand-googledocs: #1a73e8;
  --color-brand-dropbox: #0061ff;
  --color-brand-icloud: #1d7fd6;
  --color-brand-box: #0061d5;
  --color-brand-notion: #111111;
  --color-brand-figma: #d9431a;
  --color-brand-airtable: #0b8fc7;
  --color-brand-miro: #050038;
  --color-brand-zoho: #d0262b;
  --color-brand-other: #5c6670;
  --shadow-button: 0 1px 0 rgba(29, 45, 53, 0.08);
  --shadow-sheet: 0 1px 3px rgba(29, 45, 53, 0.10), 0 0 1px rgba(29, 45, 53, 0.12);
  --shadow-raised: 0 6px 18px -4px rgba(29, 45, 53, 0.16), 0 2px 5px -1px rgba(29, 45, 53, 0.08);
  --shadow-menu: 0 14px 40px -8px rgba(29, 45, 53, 0.30), 0 2px 8px -2px rgba(29, 45, 53, 0.12);
  --font-sans: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --text-xs: 0.75rem;
  --line-xs: 1.333;
  --text-sm: 0.875rem;
  --line-sm: 1.429;
  --text-base: 1rem;
  --line-base: 1.500;
  --text-md: 1.0625rem;
  --line-md: 1.412;
  --text-lg: 1.375rem;
  --line-lg: 1.273;
  --text-xl: 2.25rem;
  --line-xl: 1.111;
  --text-display: 2.75rem;
  --line-display: 1.045;
  --space-0: 0rem;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --radius-chip: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-card: 12px;
  --radius-pill: 999px;
  --motion-fast: 120ms;
  --motion-smooth: 200ms;
  --motion-ease: cubic-bezier(.16, 1, .3, 1);
  --size-sheet: 71.25rem;
  --size-narrow: 47.5rem;
  --size-gateway: 27.75rem;
  --size-topbar: 3.5rem;
  --size-bottombar: 3rem;
  --size-tap: 2.75rem;
  --size-jump: 35rem;
  --size-tool-card: 20rem;
  --size-home: 67.5rem;
  --size-home-wide: 77.5rem;
  color-scheme: light;
}

:root[data-theme="dark"] {
  --color-bg: #17120e;
  --color-bg-neutral: #1c1e21;
  --color-bg-mint: #12181b;
  --color-bg-lavender: #1e1b2d;
  --color-bg-cream: #17120e;
  --color-surface-neutral: #222428;
  --color-surface-2-neutral: #2a2d31;
  --color-surface-3-neutral: #33373c;
  --color-border-neutral: #3d4248;
  --color-surface-mint: #182023;
  --color-surface-2-mint: #1f292c;
  --color-surface-3-mint: #283336;
  --color-border-mint: #323e42;
  --color-surface-lavender: #242036;
  --color-surface-2-lavender: #2b2740;
  --color-surface-3-lavender: #35304c;
  --color-border-lavender: #403a58;
  --color-surface-cream: #211a15;
  --color-surface-2-cream: #2a221c;
  --color-surface-3-cream: #352b23;
  --color-border-cream: #3f342a;
  --color-surface: #211a15;
  --color-surface-2: #2a221c;
  --color-surface-3: #352b23;
  --color-border: #3f342a;
  --color-border-input: #9c8b7c;
  --color-text: #f5ece2;
  --color-text-muted: #bfae9f;
  --color-accent: #ff8a4c;
  --color-accent-hover: #ffa26f;
  --color-accent-soft: #3a2216;
  --color-on-accent: #2a1206;
  --color-link: #8ab8f5;
  --color-info-soft: #1a2b40;
  --color-danger: #f38b85;
  --color-danger-hover: #f7a6a1;
  --color-danger-soft: #3d201e;
  --color-on-danger: #2a0b09;
  --color-success: #6fd396;
  --color-warning: #f2c45a;
  --color-warning-soft: #3b3013;
  --color-star: #f2b33d;
  --color-unread: #e5534b;
  --color-on-unread: #1b0504;
  --color-role-owner: #9c2a7a;
  --color-role-admin: #0b6b74;
  --color-on-role: #ffffff;
  --color-avatar-1: #1f4d2e;
  --color-avatar-2: #1f3a6b;
  --color-avatar-3: #3d2a72;
  --color-avatar-4: #5a3a14;
  --color-avatar-5: #682035;
  --color-avatar-6: #164c46;
  --color-avatar-7: #2f3078;
  --color-avatar-8: #5b1d5c;
  --color-on-avatar-1: #cbf1d4;
  --color-on-avatar-2: #d8e5ff;
  --color-on-avatar-3: #e8ddff;
  --color-on-avatar-4: #fde6c8;
  --color-on-avatar-5: #ffdae2;
  --color-on-avatar-6: #caf2eb;
  --color-on-avatar-7: #e0e1ff;
  --color-on-avatar-8: #f8d8f7;
  --color-overlay-backdrop: rgba(0, 0, 0, 0.6);
  --color-highlight: #ffc83d;
  --color-brand-ez: #ffd43f;
  --color-brand-camp: #fff0d6;
  --color-file-doc: #1f5fbf;
  --color-file-sheet: #1c7a3a;
  --color-file-slides: #b04a0a;
  --color-file-pdf: #c0281d;
  --color-file-image: #7442b8;
  --color-file-media: #0e6f78;
  --color-file-archive: #5c6670;
  --color-file-other: #5c6670;
  --color-on-file: #ffffff;
  --color-brand-googledrive: #6ea8fe;
  --color-brand-googledocs: #6ea8fe;
  --color-brand-dropbox: #5b9bff;
  --color-brand-icloud: #5fb0f5;
  --color-brand-box: #5b9bff;
  --color-brand-notion: #f1f1f1;
  --color-brand-figma: #ff7a50;
  --color-brand-airtable: #3fc1ff;
  --color-brand-miro: #ffd02f;
  --color-brand-zoho: #ff6b6f;
  --color-brand-other: #b3bcc6;
  --shadow-button: 0 1px 0 rgba(0, 0, 0, 0.35);
  --shadow-sheet: 0 1px 3px rgba(0, 0, 0, 0.5), 0 0 1px rgba(0, 0, 0, 0.6);
  --shadow-raised: 0 6px 18px -4px rgba(0, 0, 0, 0.6), 0 2px 5px -1px rgba(0, 0, 0, 0.45);
  --shadow-menu: 0 14px 40px -8px rgba(0, 0, 0, 0.75), 0 2px 8px -2px rgba(0, 0, 0, 0.5);
  color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
  :root[data-theme="auto"] {
    --color-bg: #17120e;
    --color-bg-neutral: #1c1e21;
    --color-bg-mint: #12181b;
    --color-bg-lavender: #1e1b2d;
    --color-bg-cream: #17120e;
    --color-surface-neutral: #222428;
    --color-surface-2-neutral: #2a2d31;
    --color-surface-3-neutral: #33373c;
    --color-border-neutral: #3d4248;
    --color-surface-mint: #182023;
    --color-surface-2-mint: #1f292c;
    --color-surface-3-mint: #283336;
    --color-border-mint: #323e42;
    --color-surface-lavender: #242036;
    --color-surface-2-lavender: #2b2740;
    --color-surface-3-lavender: #35304c;
    --color-border-lavender: #403a58;
    --color-surface-cream: #211a15;
    --color-surface-2-cream: #2a221c;
    --color-surface-3-cream: #352b23;
    --color-border-cream: #3f342a;
    --color-surface: #211a15;
    --color-surface-2: #2a221c;
    --color-surface-3: #352b23;
    --color-border: #3f342a;
    --color-border-input: #9c8b7c;
    --color-text: #f5ece2;
    --color-text-muted: #bfae9f;
    --color-accent: #ff8a4c;
    --color-accent-hover: #ffa26f;
    --color-accent-soft: #3a2216;
    --color-on-accent: #2a1206;
    --color-link: #8ab8f5;
    --color-info-soft: #1a2b40;
    --color-danger: #f38b85;
    --color-danger-hover: #f7a6a1;
    --color-danger-soft: #3d201e;
    --color-on-danger: #2a0b09;
    --color-success: #6fd396;
    --color-warning: #f2c45a;
    --color-warning-soft: #3b3013;
    --color-star: #f2b33d;
    --color-unread: #e5534b;
    --color-on-unread: #1b0504;
    --color-role-owner: #9c2a7a;
    --color-role-admin: #0b6b74;
    --color-on-role: #ffffff;
    --color-avatar-1: #1f4d2e;
    --color-avatar-2: #1f3a6b;
    --color-avatar-3: #3d2a72;
    --color-avatar-4: #5a3a14;
    --color-avatar-5: #682035;
    --color-avatar-6: #164c46;
    --color-avatar-7: #2f3078;
    --color-avatar-8: #5b1d5c;
    --color-on-avatar-1: #cbf1d4;
    --color-on-avatar-2: #d8e5ff;
    --color-on-avatar-3: #e8ddff;
    --color-on-avatar-4: #fde6c8;
    --color-on-avatar-5: #ffdae2;
    --color-on-avatar-6: #caf2eb;
    --color-on-avatar-7: #e0e1ff;
    --color-on-avatar-8: #f8d8f7;
    --color-overlay-backdrop: rgba(0, 0, 0, 0.6);
    --color-highlight: #ffc83d;
    --color-brand-ez: #ffd43f;
    --color-brand-camp: #fff0d6;
    --color-file-doc: #1f5fbf;
    --color-file-sheet: #1c7a3a;
    --color-file-slides: #b04a0a;
    --color-file-pdf: #c0281d;
    --color-file-image: #7442b8;
    --color-file-media: #0e6f78;
    --color-file-archive: #5c6670;
    --color-file-other: #5c6670;
    --color-on-file: #ffffff;
    --color-brand-googledrive: #6ea8fe;
    --color-brand-googledocs: #6ea8fe;
    --color-brand-dropbox: #5b9bff;
    --color-brand-icloud: #5fb0f5;
    --color-brand-box: #5b9bff;
    --color-brand-notion: #f1f1f1;
    --color-brand-figma: #ff7a50;
    --color-brand-airtable: #3fc1ff;
    --color-brand-miro: #ffd02f;
    --color-brand-zoho: #ff6b6f;
    --color-brand-other: #b3bcc6;
    --shadow-button: 0 1px 0 rgba(0, 0, 0, 0.35);
    --shadow-sheet: 0 1px 3px rgba(0, 0, 0, 0.5), 0 0 1px rgba(0, 0, 0, 0.6);
    --shadow-raised: 0 6px 18px -4px rgba(0, 0, 0, 0.6), 0 2px 5px -1px rgba(0, 0, 0, 0.45);
    --shadow-menu: 0 14px 40px -8px rgba(0, 0, 0, 0.75), 0 2px 8px -2px rgba(0, 0, 0, 0.5);
    color-scheme: dark;
  }
}