/**
 * GreySheet Design System — design tokens (:root custom properties).
 *
 * DO NOT EDIT BY HAND. Auto-generated by Style Dictionary from the token repo
 * "GreySheet Design System" (source of truth: DTCG JSON under /tokens).
 * To regenerate: extract the token repo, `npm install && npm run build`,
 * then copy dist/css/variables.css over this file.
 *
 * Consumed by the GSID ViewItem redesign and its component partials. Product
 * CSS must reference the semantic tokens here via var(--...), never raw hex/px.
 */

:root {
  --color-indigo-50: #eeedf3;
  --color-indigo-100: #dddbe6;
  --color-indigo-200: #b7b3cb;
  --color-indigo-300: #8d86ac;
  --color-indigo-400: #5a5087;
  --color-indigo-500: #2b1e65;
  --color-indigo-600: #261b54;
  --color-indigo-700: #211945;
  --color-indigo-800: #1c1736;
  --color-indigo-900: #181529;
  --color-teal-50: #f1fbfb;
  --color-teal-100: #e3f7f7;
  --color-teal-200: #c4eeef;
  --color-teal-300: #a1e4e6;
  --color-teal-400: #77d8da;
  --color-teal-500: #50cdd0;
  --color-teal-600: #43a7aa;
  --color-teal-700: #388687;
  --color-teal-800: #2d6465;
  --color-teal-900: #234646;
  --color-grey-0: #ffffff;
  --color-grey-50: #f7f8fa;
  --color-grey-100: #edeff3;
  --color-grey-200: #dde1e8;
  --color-grey-300: #c2c8d2;
  --color-grey-400: #9aa2b1;
  --color-grey-500: #6b7280;
  --color-grey-600: #4b5360;
  --color-grey-700: #363c46;
  --color-grey-800: #23272e;
  --color-grey-900: #14171c;
  --color-grey-950: #0b0d10;
  --color-green-50: #ecfbf1;
  --color-green-100: #d2f4df;
  --color-green-200: #a6e8bf;
  --color-green-300: #6fd79a;
  --color-green-400: #37be71;
  --color-green-500: #1fa45b;
  --color-green-600: #198449;
  --color-green-700: #156a3c;
  --color-green-800: #114f2d;
  --color-green-900: #0c381f;
  --color-amber-50: #fef6e7;
  --color-amber-100: #fce7bf;
  --color-amber-200: #f8cd7e;
  --color-amber-300: #f2b23e;
  --color-amber-400: #e59916;
  --color-amber-500: #c47e0e;
  --color-amber-600: #9c640b;
  --color-amber-700: #7a4e08;
  --color-amber-800: #583906;
  --color-amber-900: #3c2604;
  --color-red-50: #fdecec;
  --color-red-100: #fad2d2;
  --color-red-200: #f2a3a3;
  --color-red-300: #e86f6f;
  --color-red-400: #dc4444;
  --color-red-500: #c5302f;
  --color-red-600: #9f2625;
  --color-red-700: #7c1e1d;
  --color-red-800: #591615;
  --color-red-900: #3d0f0e;
  --color-white: #ffffff;
  --color-black: #14171c; /** Brand black = grey/900 (synced from Figma palette/black). */
  --shadow-low-color: rgba(35, 39, 46, 0.05); /** Resting cards, table rows, inputs (on light surfaces). */
  --shadow-low-offset-x: 0; /** Resting cards, table rows, inputs (on light surfaces). */
  --shadow-low-offset-y: 2px; /** Resting cards, table rows, inputs (on light surfaces). */
  --shadow-low-blur: 4px; /** Resting cards, table rows, inputs (on light surfaces). */
  --shadow-low-spread: 0; /** Resting cards, table rows, inputs (on light surfaces). */
  --shadow-low-dark-color: rgba(35, 39, 46, 0.15); /** Resting elevation on dark surfaces. */
  --shadow-low-dark-offset-x: 0; /** Resting elevation on dark surfaces. */
  --shadow-low-dark-offset-y: 2px; /** Resting elevation on dark surfaces. */
  --shadow-low-dark-blur: 4px; /** Resting elevation on dark surfaces. */
  --shadow-low-dark-spread: 0; /** Resting elevation on dark surfaces. */
  --shadow-high-color: rgba(35, 39, 46, 0.05); /** Dropdowns, popovers, modals, overlays (on light surfaces). */
  --shadow-high-offset-x: 0; /** Dropdowns, popovers, modals, overlays (on light surfaces). */
  --shadow-high-offset-y: 4px; /** Dropdowns, popovers, modals, overlays (on light surfaces). */
  --shadow-high-blur: 8px; /** Dropdowns, popovers, modals, overlays (on light surfaces). */
  --shadow-high-spread: 0; /** Dropdowns, popovers, modals, overlays (on light surfaces). */
  --shadow-high-dark-color: rgba(35, 39, 46, 0.15); /** High elevation on dark surfaces. */
  --shadow-high-dark-offset-x: 0; /** High elevation on dark surfaces. */
  --shadow-high-dark-offset-y: 4px; /** High elevation on dark surfaces. */
  --shadow-high-dark-blur: 8px; /** High elevation on dark surfaces. */
  --shadow-high-dark-spread: 0; /** High elevation on dark surfaces. */
  --blur-uniform: 16px; /** Uniform layer blur. */
  --blur-progressive-start: 0px; /** Progressive blur — start radius. */
  --blur-progressive-end: 16px; /** Progressive blur — end radius. */
  --opacity-state-default: 1; /** Default look for all components. */
  --opacity-state-hover: 0.8; /** Hover state for interactive elements (buttons, etc.). */
  --opacity-state-pressed: 0.6; /** Pressed/active state. */
  --opacity-state-disabled: 0.4; /** Disabled state. */
  --spacing-padding-none: 0rem; /** 0px — content that needs no padding. */
  --spacing-padding-mini: 0.0625rem; /** 1px — boolean/grouped menu inner padding, avatar selection rings. */
  --spacing-padding-mini-card: 0.125rem; /** 2px — card padding. */
  --spacing-padding-xs: 0.25rem; /** 4px — chips, badges, micro elements. */
  --spacing-padding-sm: 0.5rem; /** 8px — inputs, small buttons, dense list cells. */
  --spacing-padding-md-button: 0.625rem; /** 10px — medium buttons. */
  --spacing-padding-md: 0.75rem; /** 12px — standard buttons and list rows. */
  --spacing-padding-lg: 0.875rem; /** 14px — large buttons. */
  --spacing-padding-xl: 1rem; /** 16px — cards, sheets, prominent containers. */
  --spacing-gap-none: 0rem; /** 0px — no spacing between items. */
  --spacing-gap-mini: 0.25rem; /** 4px — bare minimum stack spacing (small text + caption). */
  --spacing-gap-xs: 0.5rem; /** 8px — label↔field, icon↔text. */
  --spacing-gap-sm: 1rem; /** 16px — related siblings inside a group or card. */
  --spacing-gap-md: 1.5rem; /** 24px — distinct content blocks within a section. */
  --spacing-gap-lg: 2rem; /** 32px — major sections on a screen. */
  --spacing-gap-xl: 3rem; /** 48px — hero-level breathing room above feature blocks. */
  --spacing-gap-2xl: 4rem; /** 64px — top-of-screen / hero separation. */
  --radius-xs: 0.375rem; /** 6px — tags, chips, micro elements. */
  --radius-sm: 0.5rem; /** 8px — inputs, small buttons, tight components. */
  --radius-md-button: 0.625rem; /** 10px — medium buttons. */
  --radius-md: 0.75rem; /** 12px — cards, primary buttons, most surfaces. */
  --radius-lg: 1rem; /** 16px — hero cards, prominent tiles, grouped containers. */
  --radius-xl: 1.5rem; /** 24px — really large cards. */
  --radius-full: 9999px; /** Pills, avatars, circular buttons. */
  --stroke-weight-stroke-default: 1px; /** Default UI stroke — container outlines, dividers, input borders. */
  --stroke-weight-stroke-emphasis: 2px; /** Emphasized stroke for selected, focused, or active states. */
  --stroke-weight-icon-stroke: 1.5px; /** Default icon stroke (Phosphor-aligned). Use at all standard icon sizes. */
  --stroke-weight-icon-bold: 2px; /** Bold icon stroke for emphasis or icons on high-contrast surfaces. */
  --font-family-sans: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; /** Primary UI typeface — Geist (Google Fonts). Everything except tabular data. */
  --font-family-mono: 'Geist Mono', SFMono-Regular, Menlo, Consolas, monospace; /** Geist Mono (Google Fonts) — tabular pricing data, codes, grades. Use with tabular-nums. */
  --font-weight-regular: 400; /** Body copy, data, buttons. */
  --font-weight-medium: 500; /** Available for emphasized labels/table values. */
  --font-weight-semibold: 600; /** Headings and emphasized body. */
  --font-weight-bold: 700; /** Available for display / strong emphasis. */
  --font-size-2xs: 0.625rem; /** 10px — node numbers */
  --font-size-xs: 0.75rem; /** 12px — captions, small buttons, small data */
  --font-size-sm: 0.8125rem; /** 13px — small body, medium buttons */
  --font-size-md: 0.875rem; /** 14px — body (base), large buttons */
  --font-size-lg: 1rem; /** 16px — large body, h3 */
  --font-size-xl: 1.125rem; /** 18px — h2 */
  --font-size-2xl: 1.5rem; /** 24px — h1 */
  --font-size-3xl: 1.75rem; /** 28px — titling (largest) */
  --font-letter-spacing-normal: 0em; /** Default tracking — all current Figma text styles use 0. */
  --font-line-height-16: 1rem; /** 16px — captions, small-data. */
  --font-line-height-18: 1.125rem; /** 18px — small-body. */
  --font-line-height-20: 1.25rem; /** 20px — medium-body. */
  --font-line-height-24: 1.5rem; /** 24px — h3, large-body. */
  --font-line-height-26: 1.625rem; /** 26px — h2. */
  --font-line-height-32: 2rem; /** 32px — h1. */
  --font-line-height-40: 2.5rem; /** 40px — titling. */
  --font-line-height-auto: normal; /** Auto — used by buttons and node-number. */
  --color-text-primary: var(--color-grey-900); /** Default body and heading text. */
  --color-text-secondary: var(--color-grey-600); /** Supporting text, descriptions, metadata. */
  --color-text-tertiary: var(--color-grey-400); /** Muted / supporting text. */
  --color-text-disabled: var(--color-grey-300); /** Disabled labels and placeholder text. */
  --color-text-inverse: var(--color-grey-0); /** Text on dark surfaces. */
  --color-text-link: var(--color-indigo-300); /** Hyperlinks and interactive text. */
  --color-text-brand: var(--color-indigo-500); /** Brand-colored text accents. */
  --color-surface-page: var(--color-grey-50); /** Website background. */
  --color-surface-raised: var(--color-grey-0); /** Cards, panels, tables. */
  --color-surface-sunken: var(--color-grey-100); /** Wells, inset areas. */
  --color-surface-inverse: var(--color-grey-800); /** Dark surfaces (inverse panels, tooltips). */
  --color-surface-overlay: var(--color-grey-800); /** Scrims/modals (apply opacity in component). */
  --color-surface-button-teal: var(--color-teal-600); /** Fill for teal buttons. */
  --color-surface-button-indigo: var(--color-indigo-600); /** Fill for indigo buttons. */
  --color-surface-button-light-indigo: var(--color-indigo-50); /** Fill for light-indigo / ghost buttons. */
  --color-border-default: var(--color-grey-100); /** Default borders for cards, inputs, dividers. */
  --color-border-strong: var(--color-grey-200); /** Emphasized borders and stronger dividers. */
  --color-border-button-teal: var(--color-teal-500); /** Border and focus ring for teal buttons. */
  --color-border-button-indigo: var(--color-indigo-400); /** Border and focus ring for indigo buttons. */
  --color-border-button-light-indigo-ghost: var(--color-indigo-100); /** Border and focus ring for light-indigo and ghost buttons. */
  --color-feedback-success: var(--color-green-700); /** Success text and icons. */
  --color-feedback-success-bg: var(--color-green-50); /** Success banner / surface background. */
  --color-feedback-success-stroke: var(--color-green-100); /** Success banner / surface stroke. */
  --color-feedback-error: var(--color-red-600); /** Error text and icons. */
  --color-feedback-error-bg: var(--color-red-50); /** Error banner / surface background. */
  --color-feedback-error-stroke: var(--color-red-100); /** Error banner / surface stroke. */
  --color-feedback-warning: var(--color-amber-600); /** Warning text and icons. */
  --color-feedback-warning-bg: var(--color-amber-100); /** Warning banner / surface background. */
  --color-feedback-warning-stroke: var(--color-amber-200); /** Warning banner / surface stroke. */
  --color-feedback-info: var(--color-indigo-600); /** Informational text and icons. */
  --color-feedback-info-bg: var(--color-indigo-50); /** Info banner / surface background. */
  --color-feedback-info-stroke: var(--color-indigo-100); /** Info banner / surface stroke. */
  --color-market-up-light-bg: var(--color-green-600); /** Positive movement — foreground on light backgrounds. */
  --color-market-up-dark-bg: var(--color-green-400); /** Positive movement — foreground on dark backgrounds. */
  --color-market-up-bg: var(--color-green-50); /** Background tint behind a positive price. */
  --color-market-up-stroke: var(--color-green-100); /** Stroke around a positive price surface. */
  --color-market-down-light-bg: var(--color-red-600); /** Negative movement — foreground on light backgrounds. */
  --color-market-down-dark-bg: var(--color-red-400); /** Negative movement — foreground on dark backgrounds. */
  --color-market-down-bg: var(--color-red-50); /** Background tint behind a negative price. */
  --color-market-down-stroke: var(--color-red-100); /** Stroke around a negative price surface. */
  --color-market-unchanged-light-bg: var(--color-grey-600); /** No change — foreground on light backgrounds. */
  --color-market-unchanged-dark-bg: var(--color-grey-400); /** No change — foreground on dark backgrounds. */
  --color-market-unchanged-bg: var(--color-grey-100); /** Background tint behind an unchanged price. */
  --color-market-unchanged-stroke: var(--color-grey-200); /** Stroke around an unchanged price surface. */
  --color-market-cac: var(--color-green-700); /** CAC-designated / premium indicator. */
  --color-promo-text: var(--color-amber-600); /** Promotional text and icons. */
  --color-promo-bg: var(--color-amber-100); /** Promotional banner / surface background. */
  --color-promo-stroke: var(--color-amber-200); /** Promotional banner / surface stroke. */
  --color-indicator-bg: var(--color-indigo-600); /** Node indicator background. */
  --color-indicator-stroke: var(--color-indigo-400); /** Node indicator stroke. */
  --text-titling-font-family: var(--font-family-sans); /** Largest title — 28/40 Geist SemiBold. */
  --text-titling-font-weight: var(--font-weight-semibold); /** Largest title — 28/40 Geist SemiBold. */
  --text-titling-font-size: var(--font-size-3xl); /** Largest title — 28/40 Geist SemiBold. */
  --text-titling-line-height: var(--font-line-height-40); /** Largest title — 28/40 Geist SemiBold. */
  --text-titling-letter-spacing: var(--font-letter-spacing-normal); /** Largest title — 28/40 Geist SemiBold. */
  --text-h1-font-family: var(--font-family-sans); /** 24/32 Geist SemiBold. */
  --text-h1-font-weight: var(--font-weight-semibold); /** 24/32 Geist SemiBold. */
  --text-h1-font-size: var(--font-size-2xl); /** 24/32 Geist SemiBold. */
  --text-h1-line-height: var(--font-line-height-32); /** 24/32 Geist SemiBold. */
  --text-h1-letter-spacing: var(--font-letter-spacing-normal); /** 24/32 Geist SemiBold. */
  --text-h2-font-family: var(--font-family-sans); /** 18/26 Geist SemiBold. */
  --text-h2-font-weight: var(--font-weight-semibold); /** 18/26 Geist SemiBold. */
  --text-h2-font-size: var(--font-size-xl); /** 18/26 Geist SemiBold. */
  --text-h2-line-height: var(--font-line-height-26); /** 18/26 Geist SemiBold. */
  --text-h2-letter-spacing: var(--font-letter-spacing-normal); /** 18/26 Geist SemiBold. */
  --text-h3-font-family: var(--font-family-sans); /** 16/24 Geist SemiBold. */
  --text-h3-font-weight: var(--font-weight-semibold); /** 16/24 Geist SemiBold. */
  --text-h3-font-size: var(--font-size-lg); /** 16/24 Geist SemiBold. */
  --text-h3-line-height: var(--font-line-height-24); /** 16/24 Geist SemiBold. */
  --text-h3-letter-spacing: var(--font-letter-spacing-normal); /** 16/24 Geist SemiBold. */
  --text-large-body-regular-font-family: var(--font-family-sans); /** 16/24 Geist Regular. */
  --text-large-body-regular-font-weight: var(--font-weight-regular); /** 16/24 Geist Regular. */
  --text-large-body-regular-font-size: var(--font-size-lg); /** 16/24 Geist Regular. */
  --text-large-body-regular-line-height: var(--font-line-height-24); /** 16/24 Geist Regular. */
  --text-large-body-regular-letter-spacing: var(--font-letter-spacing-normal); /** 16/24 Geist Regular. */
  --text-large-body-emphasis-font-family: var(--font-family-sans); /** 16/24 Geist SemiBold. */
  --text-large-body-emphasis-font-weight: var(--font-weight-semibold); /** 16/24 Geist SemiBold. */
  --text-large-body-emphasis-font-size: var(--font-size-lg); /** 16/24 Geist SemiBold. */
  --text-large-body-emphasis-line-height: var(--font-line-height-24); /** 16/24 Geist SemiBold. */
  --text-large-body-emphasis-letter-spacing: var(--font-letter-spacing-normal); /** 16/24 Geist SemiBold. */
  --text-medium-body-regular-font-family: var(--font-family-sans); /** Base body — 14/20 Geist Regular. */
  --text-medium-body-regular-font-weight: var(--font-weight-regular); /** Base body — 14/20 Geist Regular. */
  --text-medium-body-regular-font-size: var(--font-size-md); /** Base body — 14/20 Geist Regular. */
  --text-medium-body-regular-line-height: var(--font-line-height-20); /** Base body — 14/20 Geist Regular. */
  --text-medium-body-regular-letter-spacing: var(--font-letter-spacing-normal); /** Base body — 14/20 Geist Regular. */
  --text-medium-body-emphasis-font-family: var(--font-family-sans); /** 14/20 Geist SemiBold. */
  --text-medium-body-emphasis-font-weight: var(--font-weight-semibold); /** 14/20 Geist SemiBold. */
  --text-medium-body-emphasis-font-size: var(--font-size-md); /** 14/20 Geist SemiBold. */
  --text-medium-body-emphasis-line-height: var(--font-line-height-20); /** 14/20 Geist SemiBold. */
  --text-medium-body-emphasis-letter-spacing: var(--font-letter-spacing-normal); /** 14/20 Geist SemiBold. */
  --text-small-body-regular-font-family: var(--font-family-sans); /** 13/18 Geist Regular. */
  --text-small-body-regular-font-weight: var(--font-weight-regular); /** 13/18 Geist Regular. */
  --text-small-body-regular-font-size: var(--font-size-sm); /** 13/18 Geist Regular. */
  --text-small-body-regular-line-height: var(--font-line-height-18); /** 13/18 Geist Regular. */
  --text-small-body-regular-letter-spacing: var(--font-letter-spacing-normal); /** 13/18 Geist Regular. */
  --text-small-body-emphasis-font-family: var(--font-family-sans); /** 13/18 Geist SemiBold. */
  --text-small-body-emphasis-font-weight: var(--font-weight-semibold); /** 13/18 Geist SemiBold. */
  --text-small-body-emphasis-font-size: var(--font-size-sm); /** 13/18 Geist SemiBold. */
  --text-small-body-emphasis-line-height: var(--font-line-height-18); /** 13/18 Geist SemiBold. */
  --text-small-body-emphasis-letter-spacing: var(--font-letter-spacing-normal); /** 13/18 Geist SemiBold. */
  --text-large-button-font-family: var(--font-family-sans); /** 14/Auto Geist Regular. */
  --text-large-button-font-weight: var(--font-weight-regular); /** 14/Auto Geist Regular. */
  --text-large-button-font-size: var(--font-size-md); /** 14/Auto Geist Regular. */
  --text-large-button-line-height: var(--font-line-height-auto); /** 14/Auto Geist Regular. */
  --text-large-button-letter-spacing: var(--font-letter-spacing-normal); /** 14/Auto Geist Regular. */
  --text-medium-button-font-family: var(--font-family-sans); /** 13/Auto Geist Regular. */
  --text-medium-button-font-weight: var(--font-weight-regular); /** 13/Auto Geist Regular. */
  --text-medium-button-font-size: var(--font-size-sm); /** 13/Auto Geist Regular. */
  --text-medium-button-line-height: var(--font-line-height-auto); /** 13/Auto Geist Regular. */
  --text-medium-button-letter-spacing: var(--font-letter-spacing-normal); /** 13/Auto Geist Regular. */
  --text-small-button-font-family: var(--font-family-sans); /** 12/Auto Geist Regular. */
  --text-small-button-font-weight: var(--font-weight-regular); /** 12/Auto Geist Regular. */
  --text-small-button-font-size: var(--font-size-xs); /** 12/Auto Geist Regular. */
  --text-small-button-line-height: var(--font-line-height-auto); /** 12/Auto Geist Regular. */
  --text-small-button-letter-spacing: var(--font-letter-spacing-normal); /** 12/Auto Geist Regular. */
  --text-captions-font-family: var(--font-family-sans); /** 12/16 Geist Regular. */
  --text-captions-font-weight: var(--font-weight-regular); /** 12/16 Geist Regular. */
  --text-captions-font-size: var(--font-size-xs); /** 12/16 Geist Regular. */
  --text-captions-line-height: var(--font-line-height-16); /** 12/16 Geist Regular. */
  --text-captions-letter-spacing: var(--font-letter-spacing-normal); /** 12/16 Geist Regular. */
  --text-small-data-font-family: var(--font-family-mono); /** Tabular pricing / numeric data — 12/16 Geist Mono. Pair with font-variant-numeric: tabular-nums. */
  --text-small-data-font-weight: var(--font-weight-regular); /** Tabular pricing / numeric data — 12/16 Geist Mono. Pair with font-variant-numeric: tabular-nums. */
  --text-small-data-font-size: var(--font-size-xs); /** Tabular pricing / numeric data — 12/16 Geist Mono. Pair with font-variant-numeric: tabular-nums. */
  --text-small-data-line-height: var(--font-line-height-16); /** Tabular pricing / numeric data — 12/16 Geist Mono. Pair with font-variant-numeric: tabular-nums. */
  --text-small-data-letter-spacing: var(--font-letter-spacing-normal); /** Tabular pricing / numeric data — 12/16 Geist Mono. Pair with font-variant-numeric: tabular-nums. */
  --text-node-number-font-family: var(--font-family-sans); /** Node indicator numerals — 10/Auto Geist Regular. */
  --text-node-number-font-weight: var(--font-weight-regular); /** Node indicator numerals — 10/Auto Geist Regular. */
  --text-node-number-font-size: var(--font-size-2xs); /** Node indicator numerals — 10/Auto Geist Regular. */
  --text-node-number-line-height: var(--font-line-height-auto); /** Node indicator numerals — 10/Auto Geist Regular. */
  --text-node-number-letter-spacing: var(--font-letter-spacing-normal); /** Node indicator numerals — 10/Auto Geist Regular. */
  --color-indicator-info: var(--color-text-inverse); /** Node indicator text/icon. */
}