/* Generated from feo-storybook (scss/tokens + scss/themes) @ 6ec478b9 - DO NOT EDIT BY HAND.
   Regenerate: sass --load-path=scss "@use 'tokens'; @use 'themes';" 
   Source: https://gitlab.feo.cz/project/feo/feo-storybook */
@charset "UTF-8";
/**
 * @tokens Colors
 * @presenter Color
 *
 * Light = výchozí motiv. Dark override viz themes/_dark.scss.
 * Zdroj: feo/newage/vystup-v6/feo-a.css :root
 */
/** RAW brand feolilac = crimson-magenta (NE lila) */
/** RAW brand nightlilac = navy (NE fialová) */
/** Ink — základní text (navy-black) */
/** Muted — vedlejší text (navy-gray) */
/** Subtle — labels, slabý text (navy-gray, ≈5,4:1 na bg, WCAG AA) */
/** Line — separátory (navy-gray) */
/** Line Soft — jemné linie (navy-gray) */
/** Surface — karty (čistá bílá) */
/** Background — chladné off-white pozadí sekcí */
/** Akcent — odkazy, aktivní stavy, zvýraznění, tlačítka */
/** Text/ikona na akcentu */
/** Tmavá plocha — inverzní pozadí (nav, cta, shrnutí) */
/** Chyba — červená (odlišná od accent růžové); 5,9:1 na bílé */
/** Úspěch — chladnější pine zelená; 5,4:1 na bílé */
/** Varování — burnt ochre (hlubší); 5,3:1 na bílé */
/** Info — brand navy-blue (ne generická); 8,3:1 na bílé */
/** Text/ikona na plné stavové výplni (solid badge/tlačítko) */
/** Ztmavení pod modaly a za textem na fotce */
/** Ink 5% (navy-black, sladěno s neutrály) */
/** IG plocha karty — neutrální šedá (odliší od bílého listu) */
/** IG linka karty — jemný brand modrý nádech (FEO identita) */
/** Odznak (kolečko čísla) — brand navy; bílý text */
/** Text v odznaku (light) */
/** IG varování — sémantická barva (icon+text, ne jen barva); bílý text 4,8:1 */
/** Vnější plocha kolem A4 listu (dark override viz themes/_dark) */
/** Neutrální výplň sloupce v grafu — 3,8:1 vůči tracku #ececec (WCAG 1.4.11 ≥3:1) */
/** Světlá linka warn calloutu (dekorativní; význam nese ikona+text) */
/** Bílý text/ikona na accentu i na navy shrnutí (accenty garantují ≥4,5:1) */
/** Okraj prázdného stavu — ≥3:1 na bílé (ne světlá line!) */
/** Přetížený střední stav „k ověření" — navy-blue z info rodiny (ne generická modrá) */
/** IG akcent amber — nejsvětlejší (L* ~80) */
/** IG akcent tyrkys (L* ~68) */
/** IG akcent zelená (L* ~58) */
/** IG akcent lilac (brand primární, L* ~48) */
/** IG akcent modrá (L* ~40) */
/** IG akcent fialová — nejtmavší (L* ~32) */
/**
 * @tokens Typography
 * @presenter Typography
 *
 * Fluid typografie přes clamp() — žádné media queries.
 * Škála převzata z feo/newage/vystup-v6/feo-a.css (hero-h1, section-h2, dialog h3, lead).
 */
/** Sans */
/** Mono — DM Mono lokálně (eyebrow labely, tabulární čísla, kód) */
/** Mono label (base) */
/** Mono label (small) */
/** Mono label (extra small — cat/figcaption) */
/** Small */
/** Base (body) */
/** Lead — intro odstavec */
/** Title — malý titulek (card, tip; v6 block h3 21px) */
/** H3 — prominentní (v6 dialog) */
/** H2 — section */
/** H1 — hero */
/** Hero sub / section sub */
/** Prose H1 */
/** Prose H2 */
/** Prose H3 */
/** Prose H4 */
/** Regular */
/** Medium */
/** SemiBold */
/** Bold */
/** ExtraBold */
/** Black */
/** Body */
/** Prose — souvislý čtený text (volnější leading) */
/** Small / sub */
/** Lead */
/** Title (malý titulek) */
/** H3 */
/** H2 */
/** H1 */
/** Mono labels (uppercase) */
/** H1 tight */
/** H2 tight */
/** H3 tight (v6 dialog) */
/**
 * @tokens Spacing & Layout
 * @presenter Spacing
 *
 * 4px modulární škála (vzor brainready-ui) + radius/shadow/z-index/transitions.
 */
/** 4px  */
/** 6px  */
/** 8px  */
/** 10px */
/** 12px */
/** 16px */
/** 20px */
/** 24px */
/** 32px */
/** 48px */
/** 36px (editorial rytmus v6) */
/** 64px */
/** 44px (editorial rytmus v6) */
/** 96px */
/** Section vertical */
/** Hero top */
/** Border Width */
/** Border Width Thin */
/** Border Width Thick */
/** Radius (4px — editorial swiss, hranatý) */
/** Radius Small */
/** Radius Large (14px — panely) */
/** Radius Pill (chips) */
/** Radius Full (kruh) */
/** Shadow XS — jemné nadzvednutí (hover, řádky) */
/** Shadow Small */
/** Shadow Medium (nav) */
/** Shadow Large (dropdown/popover) */
/** Shadow XL — overlaye/modaly */
/** Inset — sunken plochy (wells, tracky) */
/** Sticky prvky v obsahu (thead tabulky, lišty) */
/** Mobilní sheet */
/** Sticky nav */
/** Dropdown / menu / select popover */
/** Popover */
/** Overlay / backdrop */
/** Modal / dialog */
/** Toast / notifikace (nad modalem) */
/** Tooltip (nad vším) */
/** Transition Duration — rychlé (hover/focus) */
/** Transition Duration — základní (většina stavů) */
/** Transition Duration — pomalé (bary/progres) */
/** Transition Duration — overlaye, větší přesuny */
/** Easing — standardní (drobné stavy) */
/** Easing — expressive out (vjezd, akcent) */
/** Easing — emphasized in-out (přesuny) */
/** FEO spring settle (jen transform/opacity) */
/** Disabled Opacity */
/** 480px — úzký (dialog obsah, jeden formulář) */
/** 640px — článek s okraji (cta, section) */
/** 768px — širší obsah, dvousloupcový text */
/** 1024px — dashboard, mřížky */
/** 1200px — plná stránka (= content-max) */
/** Základní měřítko odstavce */
/** Úzké — lead, citace, popisky */
/** Široké — hutnější obsah, delší řádky */
/** H1 (hero) — drží 2 řádky */
/** H2 (section) — drží 2 řádky */
/** Nav height (offset) */
/** Pole svisle — comfortable */
/** Pole vodorovně — comfortable */
/** Pole svisle — compact */
/** Pole vodorovně — compact */
/** Max content width (= container-xl, jeden zdroj) */
/** Horizontal page padding */
/**
 * Export SCSS tokenů do CSS custom properties.
 * Komponenty používají VÝHRADNĚ var(--feo-*), aby dark-mode override fungoval runtime.
 */
:root {
  --feo-font-sans: Archivo, -apple-system, Segoe UI, system-ui, sans-serif;
  --feo-font-mono: DM Mono, ui-monospace, SFMono-Regular, Menlo, monospace;
  --feo-font-size-mono: 12px;
  --feo-font-size-mono-sm: 11px;
  --feo-font-size-mono-xs: 10px;
  --feo-font-size-small: clamp(0.8rem, 1.2vw + 0.3rem, 0.95rem);
  --feo-font-size: 1rem;
  --feo-font-size-lead: clamp(22px, 2.4vw, 30px);
  --feo-font-size-title: clamp(19px, 1.6vw, 22px);
  --feo-font-size-h3: clamp(27px, 3.4vw, 43px);
  --feo-font-size-h2: clamp(38px, 4.3vw, 54px);
  --feo-font-size-h1: clamp(50px, 7.2vw, 104px);
  --feo-font-size-sub: clamp(19px, 2vw, 23px);
  --feo-font-size-prose-h1: clamp(28px, 3.4vw, 38px);
  --feo-font-size-prose-h2: clamp(24px, 2.6vw, 30px);
  --feo-font-size-prose-h3: clamp(20px, 2vw, 23px);
  --feo-font-size-prose-h4: clamp(17px, 1.4vw, 18px);
  --feo-font-weight: 400;
  --feo-font-weight-medium: 500;
  --feo-font-weight-semibold: 600;
  --feo-font-weight-bold: 700;
  --feo-font-weight-extrabold: 800;
  --feo-font-weight-black: 900;
  --feo-line-height: 1.5;
  --feo-line-height-prose: 1.65;
  --feo-line-height-small: 1.45;
  --feo-line-height-lead: 1.35;
  --feo-line-height-title: 1.2;
  --feo-line-height-h3: 1.12;
  --feo-line-height-h2: 1.12;
  --feo-line-height-h1: 1.06;
  --feo-tracking-mono: 0.06em;
  --feo-tracking-h1: -0.04em;
  --feo-tracking-h2: -0.03em;
  --feo-tracking-h3: -0.025em;
  --feo-c-brand: #db0b5b;
  --feo-c-brand-night: #1b2b4b;
  --feo-c-white: #fff;
  --feo-c-ink: #181920;
  --feo-c-ink-soft: #42454f;
  --feo-c-line: #c8ccd6;
  --feo-c-surface: #fff;
  --feo-c-bg: #f6f7fb;
  --feo-ink: var(--feo-c-ink);
  --feo-muted: var(--feo-c-ink-soft);
  --feo-subtle: #63656f;
  --feo-line: var(--feo-c-line);
  --feo-line-soft: #e8eaf0;
  --feo-surface: var(--feo-c-surface);
  --feo-bg: var(--feo-c-bg);
  --feo-accent: var(--feo-c-brand);
  --feo-accent-text: #cc0a55;
  --feo-on-accent: var(--feo-c-white);
  --feo-focus: var(--feo-accent);
  --feo-focus-inverse: color-mix(in srgb, var(--feo-accent) 55%, white);
  --feo-surface-inverse: var(--feo-c-brand-night);
  --feo-canvas: var(--feo-ig-canvas);
  --feo-lilac: var(--feo-c-brand);
  --feo-nightlilac: var(--feo-c-brand-night);
  --feo-danger: #c8102e;
  --feo-success: #157a4a;
  --feo-warning: #a3590a;
  --feo-info: #224a9e;
  --feo-on-status: #fff;
  --feo-danger-bg: color-mix(in srgb, var(--feo-danger) 12%, white);
  --feo-success-bg: color-mix(in srgb, var(--feo-success) 12%, white);
  --feo-warning-bg: color-mix(in srgb, var(--feo-warning) 12%, white);
  --feo-info-bg: color-mix(in srgb, var(--feo-info) 12%, white);
  --feo-danger-text: var(--feo-danger);
  --feo-state-hover: color-mix(in srgb, var(--feo-ink) 6%, transparent);
  --feo-state-active: color-mix(in srgb, var(--feo-ink) 11%, transparent);
  --feo-tint-anchor: var(--feo-surface-inverse);
  --feo-tint-soft: color-mix(in srgb, var(--feo-tint-anchor) 8%, transparent);
  --feo-state-selected: color-mix(in srgb, var(--feo-tint-anchor) 14%, transparent);
  --feo-state-selected-ink: var(--feo-accent);
  --feo-accent-hover: color-mix(in srgb, var(--feo-accent) 88%, black);
  --feo-accent-active: color-mix(in srgb, var(--feo-accent) 78%, black);
  --feo-ink-alpha-05: rgba(24, 25, 32, 0.05);
  --feo-ig-line: #d3dcec;
  --feo-ig-badge-bg: #1b2b4b;
  --feo-ig-badge-ink: #fff;
  --feo-ig-warn: #d92d20;
  --feo-ig-canvas: #e7e7e9;
  --feo-ig-bar: #767676;
  --feo-ig-warn-line: #eea19b;
  --feo-ig-on-accent: var(--feo-c-white);
  --feo-check-border: #767676;
  --feo-check-question: #224a9e;
  --feo-ig-lilac: #db0b5b;
  --feo-ig-blue: #1d4ed8;
  --feo-ig-teal: #14b8a6;
  --feo-ig-green: #16a34a;
  --feo-ig-amber: #fbbf24;
  --feo-ig-violet: #5b21b6;
  --feo-viz-1: #db0b5b;
  --feo-viz-2: #c77f00;
  --feo-viz-3: #0072b2;
  --feo-viz-4: #009e73;
  --feo-viz-5: #9059c9;
  --feo-viz-6: #2e8fd0;
  --feo-viz-7: #d55e00;
  --feo-viz-8: #767676;
  --feo-viz-seq-1: oklch(0.95 0.02 255);
  --feo-viz-seq-2: oklch(0.82 0.06 253);
  --feo-viz-seq-3: oklch(0.65 0.1 253);
  --feo-viz-seq-4: oklch(0.48 0.12 255);
  --feo-viz-seq-5: oklch(0.33 0.09 258);
  --feo-viz-div-1: oklch(0.48 0.16 255);
  --feo-viz-div-2: oklch(0.72 0.09 250);
  --feo-viz-div-3: oklch(0.92 0.015 300);
  --feo-viz-div-4: oklch(0.72 0.11 24);
  --feo-viz-div-5: oklch(0.55 0.18 20);
  --feo-space-1: 0.25rem;
  --feo-space-1-5: 0.375rem;
  --feo-space-2: 0.5rem;
  --feo-space-2-5: 0.625rem;
  --feo-space-3: 0.75rem;
  --feo-space-4: 1rem;
  --feo-space-5: 1.25rem;
  --feo-space-6: 1.5rem;
  --feo-space-7: 2rem;
  --feo-space-8: 3rem;
  --feo-space-9: 2.25rem;
  --feo-space-10: 4rem;
  --feo-space-11: 2.75rem;
  --feo-space-12: 6rem;
  --feo-section-y: clamp(4rem, 8vw, 7.25rem);
  --feo-hero-y-top: clamp(5rem, 9vw, 8.25rem);
  --feo-border-width: 1.5px;
  --feo-border-width-thin: 1px;
  --feo-border-width-thick: 3px;
  --feo-radius: 0.25rem;
  --feo-radius-sm: 0.125rem;
  --feo-radius-lg: 0.875rem;
  --feo-radius-pill: 999px;
  --feo-radius-full: 50%;
  --feo-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.06);
  --feo-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
  --feo-shadow-md: 0 6px 24px -16px rgba(0, 0, 0, 0.5);
  --feo-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.16);
  --feo-shadow-xl: 0 24px 60px -12px rgba(0, 0, 0, 0.28);
  --feo-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.07);
  --feo-surface-sunken: color-mix(in srgb, var(--feo-c-bg) 94%, black);
  --feo-surface-raised: var(--feo-c-surface);
  --feo-surface-overlay: var(--feo-c-surface);
  --feo-scrim: rgba(27, 43, 75, 0.6);
  --feo-overlay-blur: 6px;
  --feo-selection-bg: var(--feo-accent);
  --feo-selection-text: var(--feo-on-accent);
  --feo-code-bg: color-mix(in srgb, var(--feo-ink) 6%, transparent);
  --feo-gradient-glow: radial-gradient(
    900px 520px at 86% 0%,
    color-mix(in srgb, var(--feo-accent) 16%, transparent),
    transparent 60%
  );
  --feo-z-sticky: 10;
  --feo-z-sheet: 39;
  --feo-z-nav: 40;
  --feo-z-dropdown: 50;
  --feo-z-popover: 100;
  --feo-z-overlay: 200;
  --feo-z-modal: 300;
  --feo-z-toast: 400;
  --feo-z-tooltip: 500;
  --feo-duration-fast: 0.15s;
  --feo-duration: 0.2s;
  --feo-duration-slow: 0.25s;
  --feo-duration-slower: 0.4s;
  --feo-easing: ease;
  --feo-easing-out: cubic-bezier(0.16, 1, 0.3, 1);
  --feo-easing-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --feo-easing-spring: linear(0, 0.248 6.7%, 0.625 13.3%, 0.897 20%, 1.026 26.7%, 1.057 33.3%, 1.045 40%, 1.023 46.7%, 1.007 53.3%, 0.999 60%, 0.997 66.7%, 0.997 73.3%, 0.999 80%, 1 86.7%, 1 93.3%, 1 100%);
  --feo-opacity-disabled: 0.45;
  --feo-content-max: 75rem;
  --feo-pad-x: clamp(1.25rem, 4vw, 2.5rem);
  --feo-nav-h: 4.5rem;
  --feo-container-xs: 30rem;
  --feo-container-sm: 40rem;
  --feo-container-md: 48rem;
  --feo-container-lg: 64rem;
  --feo-container-xl: 75rem;
  --feo-measure: 65ch;
  --feo-measure-narrow: 48ch;
  --feo-measure-wide: 72ch;
  --feo-measure-h1: 20ch;
  --feo-measure-h2: 28ch;
  --feo-field-pad-y: 0.7em;
  --feo-field-pad-x: 0.85em;
  --feo-btn-pad-y: 0.625rem;
  --feo-btn-pad-x: 1.25rem;
}

[data-feo-density=comfortable] {
  --feo-field-pad-y: 0.7em;
  --feo-field-pad-x: 0.85em;
  --feo-btn-pad-y: 0.625rem;
  --feo-btn-pad-x: 1.25rem;
}

[data-feo-density=compact] {
  --feo-field-pad-y: 0.4em;
  --feo-field-pad-x: 0.65em;
  --feo-btn-pad-y: 0.375rem;
  --feo-btn-pad-x: 1rem;
}

.feo-light {
  --feo-c-ink: #181920;
  --feo-c-ink-soft: #42454f;
  --feo-c-line: #c8ccd6;
  --feo-c-surface: #fff;
  --feo-c-bg: #f6f7fb;
  --feo-ink: var(--feo-c-ink);
  --feo-muted: var(--feo-c-ink-soft);
  --feo-line: var(--feo-c-line);
  --feo-surface: var(--feo-c-surface);
  --feo-bg: var(--feo-c-bg);
  --feo-subtle: #63656f;
  --feo-line-soft: #e8eaf0;
  --feo-focus: var(--feo-accent);
  --feo-surface-sunken: color-mix(in srgb, var(--feo-c-bg) 94%, black);
  --feo-surface-raised: var(--feo-c-surface);
  --feo-surface-overlay: var(--feo-c-surface);
  --feo-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.06);
  --feo-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
  --feo-shadow-md: 0 6px 24px -16px rgba(0, 0, 0, 0.5);
  --feo-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.16);
  --feo-shadow-xl: 0 24px 60px -12px rgba(0, 0, 0, 0.28);
  --feo-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.07);
  --feo-ig-canvas: #e7e7e9;
  --feo-danger: #c8102e;
  --feo-success: #157a4a;
  --feo-warning: #a3590a;
  --feo-info: #224a9e;
  --feo-danger-bg: color-mix(in srgb, var(--feo-danger) 12%, white);
  --feo-success-bg: color-mix(in srgb, var(--feo-success) 12%, white);
  --feo-warning-bg: color-mix(in srgb, var(--feo-warning) 12%, white);
  --feo-info-bg: color-mix(in srgb, var(--feo-info) 12%, white);
  --feo-on-status: #fff;
  --feo-accent-text: #cc0a55;
  --feo-danger-text: var(--feo-danger);
  --feo-state-selected-ink: var(--feo-accent);
  --feo-state-selected: color-mix(in srgb, var(--feo-tint-anchor) 14%, transparent);
  --feo-tint-soft: color-mix(in srgb, var(--feo-tint-anchor) 8%, transparent);
  --feo-viz-1: #db0b5b;
  --feo-viz-2: #c77f00;
  --feo-viz-3: #0072b2;
  --feo-viz-4: #009e73;
  --feo-viz-5: #9059c9;
  --feo-viz-6: #2e8fd0;
  --feo-viz-7: #d55e00;
  --feo-viz-8: #767676;
  --feo-viz-seq-1: oklch(0.95 0.02 255);
  --feo-viz-seq-2: oklch(0.82 0.06 253);
  --feo-viz-seq-3: oklch(0.65 0.1 253);
  --feo-viz-seq-4: oklch(0.48 0.12 255);
  --feo-viz-seq-5: oklch(0.33 0.09 258);
  --feo-viz-div-1: oklch(0.48 0.16 255);
  --feo-viz-div-2: oklch(0.72 0.09 250);
  --feo-viz-div-3: oklch(0.92 0.015 300);
  --feo-viz-div-4: oklch(0.72 0.11 24);
  --feo-viz-div-5: oklch(0.55 0.18 20);
}

/**
 * Dark mode — override tokenů pod html[data-theme="dark"] (a .feo-dark wrapperu).
 * Light je výchozí (tokeny v :root). Tmavé barvy se odvozují z --feo-nightlilac
 * přes color-mix() — přesně dle feo/newage/vystup-v6/feo-a.css.
 */
html[data-theme=dark],
.feo-dark {
  --feo-c-ink: #ececec;
  --feo-c-ink-soft: #cfcfcf;
  --feo-subtle: #a8a8a8;
  --feo-line-soft: color-mix(in srgb, var(--feo-c-brand-night) 82%, white);
  --feo-c-line: color-mix(in srgb, var(--feo-c-brand-night) 72%, white);
  --feo-c-surface: var(--feo-c-brand-night);
  --feo-c-bg: color-mix(in srgb, var(--feo-c-brand-night) 78%, black);
  --feo-ink: var(--feo-c-ink);
  --feo-muted: var(--feo-c-ink-soft);
  --feo-line: var(--feo-c-line);
  --feo-surface: var(--feo-c-surface);
  --feo-bg: var(--feo-c-bg);
  --feo-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.4);
  --feo-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.5);
  --feo-shadow-md: 0 6px 24px -12px rgba(0, 0, 0, 0.7);
  --feo-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.6);
  --feo-shadow-xl: 0 24px 60px -12px rgba(0, 0, 0, 0.72);
  --feo-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.5);
  --feo-surface-sunken: color-mix(in srgb, var(--feo-c-brand-night) 82%, black);
  --feo-surface-raised: color-mix(in srgb, var(--feo-c-brand-night) 90%, white);
  --feo-surface-overlay: color-mix(in srgb, var(--feo-c-brand-night) 84%, white);
  --feo-ig-canvas: color-mix(in srgb, var(--feo-c-brand-night) 60%, black);
  --feo-ig-line: color-mix(in srgb, var(--feo-c-brand-night) 68%, white);
  --feo-ig-badge-bg: #9db4dd;
  --feo-ig-badge-ink: var(--feo-c-brand-night);
  --feo-ig-bar: #a3aec2;
  --feo-ig-warn: #f87171;
  --feo-ig-warn-line: color-mix(in srgb, var(--feo-ig-warn) 55%, var(--feo-c-brand-night));
  --feo-ig-amber: #fcd34d;
  --feo-ig-teal: #2dd4bf;
  --feo-ig-green: #4ade80;
  --feo-ig-lilac: var(--feo-accent);
  --feo-ig-blue: #60a5fa;
  --feo-ig-violet: #a78bfa;
  --feo-check-border: #8b93a3;
  --feo-check-question: #5f8ee0;
  --feo-focus: var(--feo-focus-inverse);
  --feo-danger: #f26861;
  --feo-danger-bg: color-mix(in srgb, var(--feo-danger) 15%, var(--feo-c-brand-night));
  --feo-success: #48c78a;
  --feo-success-bg: color-mix(in srgb, var(--feo-success) 15%, var(--feo-c-brand-night));
  --feo-warning: #e0b657;
  --feo-warning-bg: color-mix(in srgb, var(--feo-warning) 15%, var(--feo-c-brand-night));
  --feo-info: #5f8ee0;
  --feo-info-bg: color-mix(in srgb, var(--feo-info) 15%, var(--feo-c-brand-night));
  --feo-on-status: var(--feo-c-brand-night);
  --feo-viz-1: #ee4a5e;
  --feo-viz-2: #f0b840;
  --feo-viz-3: #4ea3d9;
  --feo-viz-4: #3cc79b;
  --feo-viz-5: #b48ae0;
  --feo-viz-6: #8fd0f5;
  --feo-viz-7: #f0824a;
  --feo-viz-8: #a8a8a8;
  --feo-viz-seq-1: oklch(0.45 0.12 256);
  --feo-viz-seq-2: oklch(0.57 0.13 254);
  --feo-viz-seq-3: oklch(0.68 0.1 253);
  --feo-viz-seq-4: oklch(0.8 0.06 254);
  --feo-viz-seq-5: oklch(0.91 0.03 255);
  --feo-viz-div-1: oklch(0.66 0.16 255);
  --feo-viz-div-2: oklch(0.78 0.1 250);
  --feo-viz-div-3: oklch(0.5 0.02 300);
  --feo-viz-div-4: oklch(0.72 0.11 24);
  --feo-viz-div-5: oklch(0.66 0.18 20);
  --feo-accent-text: var(--feo-ink);
  --feo-danger-text: color-mix(in srgb, var(--feo-danger) 55%, white);
  --feo-state-selected-ink: var(--feo-ink);
  --feo-state-selected: color-mix(in srgb, var(--feo-c-white) 9%, transparent);
  --feo-tint-soft: color-mix(in srgb, var(--feo-c-white) 5%, transparent);
}