/* GENERATED by AutoBuild/design/gen-tokens.py from design/tokens.json. Do not edit. */
/* Breadstick's tokens for the site: colours, the type scale, radii, spacing and kit sizes. */

:root {
  --bsl-bg: #F5F5F7;
  --bsl-surface: #FAFAFB;
  --bsl-field: #FFFFFF;
  --bsl-surface-raised: #FFFFFF;
  --bsl-card: #FFFFFF;
  --bsl-title: #FAFAFB;
  --bsl-title-inactive: #F0F0F3;
  --bsl-text: #1F1F24;
  --bsl-text-dim: #5E5E66;
  --bsl-text-faint: #6F6F7B;
  --bsl-switch-off: #8A8A93;
  --bsl-switch-thumb: #FFFFFF;
  --bsl-border: #E2E2E7;
  --bsl-hover: #ECECF0;
  --bsl-press: #E4E4E9;
  --bsl-glyph: #5E5E66;
  --bsl-glyph-faint: #B4B4BC;
  --bsl-accent: #5A4FC4;
  --bsl-on-accent: #FFFFFF;
  --bsl-accent-soft: #E8E6FA;
  --bsl-accent-text: #2C246E;
  --bsl-container: #E4E1F8;
  --bsl-on-container: #2C246E;
  --bsl-tooltip-bg: #2E2E33;
  --bsl-tooltip-fg: #EDEDF0;
  --bsl-shelf: #F0F0F3;
  --bsl-appbar: #FAFAFB;
  --bsl-on-appbar: #1F1F24;
  --bsl-wall-a: #E8E9EF;
  --bsl-wall-b: #F5F5F8;
  --bsl-wall-c: #E1E3EC;
  --bsl-wall-d: #E6E4F2;
  --bsl-neutral-container: #E9E9EE;
  --bsl-on-neutral-container: #33333A;
  --bsl-error: #B42318;
  --bsl-on-error: #FFFFFF;
  --bsl-error-container: #FBE3E0;
  --bsl-on-error-container: #4A0F0A;
  --bsl-scrim: #000000;
  --bsl-a-row: rgba(31, 31, 36, 0.05);
  --bsl-a-panel-row: rgba(31, 31, 36, 0.05);
  --bsl-a-row-strong: rgba(31, 31, 36, 0.07);
  --bsl-a-state: rgba(31, 31, 36, 0.08);
  --bsl-a-state-strong: rgba(31, 31, 36, 0.14);
  --bsl-a-shelf-hover: rgba(31, 31, 36, 0.08);
  --bsl-a-shelf-active: rgba(90, 79, 196, 0.18);
  --bsl-a-scroll: rgba(94, 94, 102, 0.40);
  --bsl-a-scroll-hover: rgba(94, 94, 102, 0.65);
  --bsl-a-dim: rgba(31, 31, 36, 0.62);
  --bsl-a-dim-soft: rgba(94, 94, 102, 0.55);
  --bsl-a-dim-strong: rgba(94, 94, 102, 0.75);
  --bsl-a-appbar-dim: rgba(31, 31, 36, 0.62);
  --bsl-a-on-appbar-state: rgba(31, 31, 36, 0.08);
  --bsl-a-launcher-scrim: rgba(31, 31, 36, 0.35);
  --bsl-a-launcher-hover: rgba(31, 31, 36, 0.06);
  --bsl-a-launcher-sel: rgba(90, 79, 196, 0.18);
  --bsl-brand-launcher-from: #B4714C;
  --bsl-brand-launcher-to: #9A6480;
  --bsl-brand-icon-ink: #FAF8F5;
  --bsl-brand-log-bg: #1B1B1E;
  --bsl-brand-log-fg: #E6E6EA;
  --bsl-brand-log-accent: #ADA4F5;
  --bsl-brand-disc-files: #4F72A0;
  --bsl-brand-disc-terminal: #4A5260;
  --bsl-brand-disc-about: #5E6074;
  --bsl-brand-disc-update: #4F64B0;
  --bsl-brand-disc-camera: #73598F;
  --bsl-brand-disc-monitor: #367A82;
  --bsl-brand-disc-screenshot: #615B9A;
  --bsl-font-ui: "IBM Plex Sans", system-ui, sans-serif;
  --bsl-font-mono: "IBM Plex Mono", ui-monospace, monospace;
  --bsl-letter-spacing: 0px;
  --bsl-type-large-title-size: 28px;
  --bsl-type-large-title-line: 34px;
  --bsl-type-large-title-weight: 600;
  --bsl-type-title-size: 20px;
  --bsl-type-title-line: 26px;
  --bsl-type-title-weight: 600;
  --bsl-type-heading-size: 15px;
  --bsl-type-heading-line: 20px;
  --bsl-type-heading-weight: 600;
  --bsl-type-body-size: 15px;
  --bsl-type-body-line: 20px;
  --bsl-type-body-weight: 400;
  --bsl-type-caption-size: 13px;
  --bsl-type-caption-line: 18px;
  --bsl-type-caption-weight: 400;
  --bsl-type-small-size: 12px;
  --bsl-type-small-line: 16px;
  --bsl-type-small-weight: 500;
  --bsl-radius-small: 6px;
  --bsl-radius-list: 12px;
  --bsl-radius-window: 16px;
  --bsl-radius-pill: 999px;
  --bsl-space-xs: 4px;
  --bsl-space-s: 8px;
  --bsl-space-m: 12px;
  --bsl-space-l: 16px;
  --bsl-space-xl: 24px;
  --bsl-space-xxl: 32px;
  --bsl-layout-hit-min: 48px;
  --bsl-layout-row-min: 56px;
  --bsl-layout-row-compact: 48px;
  --bsl-layout-row-side: 16px;
  --bsl-layout-list-max: 720px;
  --bsl-layout-wide-from: 600px;
  --bsl-layout-gutter-phone: 16px;
  --bsl-layout-gutter-wide: 24px;
  --bsl-layout-group-gap: 24px;
  --bsl-layout-heading-gap: 8px;
  --bsl-layout-header-height: 56px;
  --bsl-layout-sidebar-width: 280px;
  --bsl-layout-sidebar-row: 48px;
  --bsl-layout-sidebar-row-pointer: 36px;
  --bsl-layout-rail-width: 80px;
  --bsl-layout-rail-logo: 40px;
  --bsl-layout-bottom-bar-height: 64px;
  --bsl-layout-nav-indicator-width: 56px;
  --bsl-layout-nav-indicator-height: 32px;
  --bsl-layout-icon: 24px;
  --bsl-layout-icon-small: 20px;
  --bsl-layout-switch-width: 48px;
  --bsl-layout-switch-height: 28px;
  --bsl-layout-switch-thumb: 22px;
  --bsl-layout-button-height: 40px;
  --bsl-layout-button-small-height: 32px;
  --bsl-layout-button-block-height: 48px;
  --bsl-layout-segment-height: 32px;
  --bsl-layout-segment-pad: 4px;
  --bsl-layout-badge-pad-x: 8px;
  --bsl-layout-badge-pad-y: 2px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bsl-bg: #1E1E21;
    --bsl-surface: #252528;
    --bsl-field: #1B1B1E;
    --bsl-surface-raised: #2C2C30;
    --bsl-card: #2A2A2E;
    --bsl-title: #252528;
    --bsl-title-inactive: #1E1E21;
    --bsl-text: #EDEDF0;
    --bsl-text-dim: #A3A3AC;
    --bsl-text-faint: #95959F;
    --bsl-switch-off: #75757E;
    --bsl-switch-thumb: #EDEDF0;
    --bsl-border: #38383D;
    --bsl-hover: #303035;
    --bsl-press: #3A3A40;
    --bsl-glyph: #D3D3DA;
    --bsl-glyph-faint: #66666E;
    --bsl-accent: #ADA4F5;
    --bsl-on-accent: #16161A;
    --bsl-accent-soft: #36325A;
    --bsl-accent-text: #E3E0FB;
    --bsl-container: #312D52;
    --bsl-on-container: #E3E0FB;
    --bsl-tooltip-bg: #EDEDF0;
    --bsl-tooltip-fg: #1F1F24;
    --bsl-shelf: #18181B;
    --bsl-appbar: #26262A;
    --bsl-on-appbar: #EDEDF0;
    --bsl-wall-a: #232327;
    --bsl-wall-b: #1A1A1D;
    --bsl-wall-c: #262433;
    --bsl-wall-d: #1C1C24;
    --bsl-neutral-container: #2F2F34;
    --bsl-on-neutral-container: #D8D8DE;
    --bsl-error: #F08A7E;
    --bsl-on-error: #3D0C07;
    --bsl-error-container: #5C1E17;
    --bsl-on-error-container: #FBD9D4;
    --bsl-scrim: #000000;
    --bsl-a-row: rgba(237, 237, 240, 0.06);
    --bsl-a-panel-row: rgba(237, 237, 240, 0.07);
    --bsl-a-row-strong: rgba(237, 237, 240, 0.07);
    --bsl-a-state: rgba(237, 237, 240, 0.08);
    --bsl-a-state-strong: rgba(237, 237, 240, 0.14);
    --bsl-a-shelf-hover: rgba(237, 237, 240, 0.10);
    --bsl-a-shelf-active: rgba(173, 164, 245, 0.18);
    --bsl-a-scroll: rgba(237, 237, 240, 0.30);
    --bsl-a-scroll-hover: rgba(237, 237, 240, 0.55);
    --bsl-a-dim: rgba(237, 237, 240, 0.58);
    --bsl-a-dim-soft: rgba(237, 237, 240, 0.45);
    --bsl-a-dim-strong: rgba(237, 237, 240, 0.60);
    --bsl-a-appbar-dim: rgba(237, 237, 240, 0.58);
    --bsl-a-on-appbar-state: rgba(237, 237, 240, 0.10);
    --bsl-a-launcher-scrim: rgba(0, 0, 0, 0.55);
    --bsl-a-launcher-hover: rgba(237, 237, 240, 0.08);
    --bsl-a-launcher-sel: rgba(173, 164, 245, 0.20);
  }
}

[data-theme="dark"] {
  --bsl-bg: #1E1E21;
  --bsl-surface: #252528;
  --bsl-field: #1B1B1E;
  --bsl-surface-raised: #2C2C30;
  --bsl-card: #2A2A2E;
  --bsl-title: #252528;
  --bsl-title-inactive: #1E1E21;
  --bsl-text: #EDEDF0;
  --bsl-text-dim: #A3A3AC;
  --bsl-text-faint: #95959F;
  --bsl-switch-off: #75757E;
  --bsl-switch-thumb: #EDEDF0;
  --bsl-border: #38383D;
  --bsl-hover: #303035;
  --bsl-press: #3A3A40;
  --bsl-glyph: #D3D3DA;
  --bsl-glyph-faint: #66666E;
  --bsl-accent: #ADA4F5;
  --bsl-on-accent: #16161A;
  --bsl-accent-soft: #36325A;
  --bsl-accent-text: #E3E0FB;
  --bsl-container: #312D52;
  --bsl-on-container: #E3E0FB;
  --bsl-tooltip-bg: #EDEDF0;
  --bsl-tooltip-fg: #1F1F24;
  --bsl-shelf: #18181B;
  --bsl-appbar: #26262A;
  --bsl-on-appbar: #EDEDF0;
  --bsl-wall-a: #232327;
  --bsl-wall-b: #1A1A1D;
  --bsl-wall-c: #262433;
  --bsl-wall-d: #1C1C24;
  --bsl-neutral-container: #2F2F34;
  --bsl-on-neutral-container: #D8D8DE;
  --bsl-error: #F08A7E;
  --bsl-on-error: #3D0C07;
  --bsl-error-container: #5C1E17;
  --bsl-on-error-container: #FBD9D4;
  --bsl-scrim: #000000;
  --bsl-a-row: rgba(237, 237, 240, 0.06);
  --bsl-a-panel-row: rgba(237, 237, 240, 0.07);
  --bsl-a-row-strong: rgba(237, 237, 240, 0.07);
  --bsl-a-state: rgba(237, 237, 240, 0.08);
  --bsl-a-state-strong: rgba(237, 237, 240, 0.14);
  --bsl-a-shelf-hover: rgba(237, 237, 240, 0.10);
  --bsl-a-shelf-active: rgba(173, 164, 245, 0.18);
  --bsl-a-scroll: rgba(237, 237, 240, 0.30);
  --bsl-a-scroll-hover: rgba(237, 237, 240, 0.55);
  --bsl-a-dim: rgba(237, 237, 240, 0.58);
  --bsl-a-dim-soft: rgba(237, 237, 240, 0.45);
  --bsl-a-dim-strong: rgba(237, 237, 240, 0.60);
  --bsl-a-appbar-dim: rgba(237, 237, 240, 0.58);
  --bsl-a-on-appbar-state: rgba(237, 237, 240, 0.10);
  --bsl-a-launcher-scrim: rgba(0, 0, 0, 0.55);
  --bsl-a-launcher-hover: rgba(237, 237, 240, 0.08);
  --bsl-a-launcher-sel: rgba(173, 164, 245, 0.20);
}