/* Kuchnia Rodzinna Design System v1.0 — tokeny (kopia z /design-system/kuchnia-rodzinna-v1.0/code/css/tokens.css).
   Źródło prawdy: tokens.json. Nie edytować ręcznie — patrz docs/DESIGN-SYSTEM-MIGRATION-PLAN.md.
   UWAGA: celowo pominięto końcowe, nieprzedrostkowane klasy demo (.h1, .h2, .body, .card-title, .label, .button, ...)
   z oryginalnego pliku DS — kolidowałyby globalnie z klasami narzędziowymi Bootstrapa (.h1–.h6 itd.). */
:root, [data-theme="light"] {
  color-scheme: light;
  --color-primary-50: #fef5f1;
  --color-primary-100: #ffe8e0;
  --color-primary-200: #fed1c0;
  --color-primary-300: #fbb197;
  --color-primary-400: #ea8e6d;
  --color-primary-500: #d16e4a;
  --color-primary-600: #b45431;
  --color-primary-700: #943e1f;
  --color-primary-800: #752d13;
  --color-primary-900: #571e0b;
  --color-primary-950: #321a13;
  --color-secondary-50: #f6f8f1;
  --color-secondary-100: #edf0e3;
  --color-secondary-200: #dbdfc9;
  --color-secondary-300: #c4caa9;
  --color-secondary-400: #a7ae84;
  --color-secondary-500: #8c9365;
  --color-secondary-600: #73794c;
  --color-secondary-700: #5c6038;
  --color-secondary-800: #464928;
  --color-secondary-900: #33351b;
  --color-secondary-950: #222318;
  --color-neutral-50: #fcf8f5;
  --color-neutral-100: #f4efea;
  --color-neutral-200: #e4dfd8;
  --color-neutral-300: #d0c9c2;
  --color-neutral-400: #aba39b;
  --color-neutral-500: #867f78;
  --color-neutral-600: #6a635c;
  --color-neutral-700: #534c45;
  --color-neutral-800: #3d3731;
  --color-neutral-850: #332d27;
  --color-neutral-900: #29241f;
  --color-neutral-925: #211c17;
  --color-neutral-950: #191410;
  --color-success-50: #f1faf2;
  --color-success-100: #e2f3e4;
  --color-success-200: #c7e6cb;
  --color-success-300: #a5d4ac;
  --color-success-400: #7fba88;
  --color-success-500: #5e9f69;
  --color-success-600: #458550;
  --color-success-700: #326b3b;
  --color-success-800: #23522a;
  --color-success-900: #173c1c;
  --color-success-950: #182618;
  --color-warning-50: #fef7ef;
  --color-warning-100: #ffedd9;
  --color-warning-200: #fbdbb9;
  --color-warning-300: #f7c592;
  --color-warning-400: #f0ae6d;
  --color-warning-500: #e49a52;
  --color-warning-600: #c27831;
  --color-warning-700: #9b5917;
  --color-warning-800: #7a420b;
  --color-warning-900: #5d3007;
  --color-warning-950: #301c10;
  --color-error-50: #fef5f4;
  --color-error-100: #ffe8e6;
  --color-error-200: #fecfcd;
  --color-error-300: #feadab;
  --color-error-400: #f68182;
  --color-error-500: #de5e64;
  --color-error-600: #c0434d;
  --color-error-700: #9e2e39;
  --color-error-800: #7d1e2a;
  --color-error-900: #5d131d;
  --color-error-950: #351719;
  --color-info-50: #f1f8ff;
  --color-info-100: #e2f0fc;
  --color-info-200: #c8e0f5;
  --color-info-300: #a7caeb;
  --color-info-400: #82aed7;
  --color-info-500: #6293bf;
  --color-info-600: #4979a4;
  --color-info-700: #366086;
  --color-info-800: #264969;
  --color-info-900: #1a354e;
  --color-info-950: #18232d;
  --surface-page: var(--color-neutral-50);
  --surface-subtle: var(--color-neutral-100);
  --surface-card: #ffffff;
  --surface-elevated: #ffffff;
  --surface-sunken: var(--color-neutral-100);
  --surface-brand: var(--color-primary-50);
  --surface-tonal: var(--color-secondary-100);
  --surface-note: var(--color-warning-100);
  --surface-inverse: var(--color-neutral-900);
  --surface-overlay: rgba(25, 20, 16, 0.5);
  --text-primary: var(--color-neutral-900);
  --text-secondary: var(--color-neutral-700);
  --text-muted: var(--color-neutral-600);
  --text-disabled: var(--color-neutral-400);
  --text-inverse: var(--color-neutral-50);
  --text-brand: var(--color-primary-700);
  --text-tonal: var(--color-secondary-800);
  --text-on-action: #ffffff;
  --border-subtle: var(--color-neutral-100);
  --border-default: var(--color-neutral-200);
  --border-strong: var(--color-neutral-500);
  --border-brand: var(--color-primary-600);
  --focus-ring: var(--color-primary-700);
  --action-primary: var(--color-primary-600);
  --action-primary-hover: var(--color-primary-700);
  --action-primary-active: var(--color-primary-800);
  --action-neutral-hover: var(--color-neutral-100);
  --action-neutral-active: var(--color-neutral-200);
  --action-tonal: var(--color-secondary-100);
  --action-tonal-hover: var(--color-secondary-200);
  --action-danger: var(--color-error-600);
  --action-danger-hover: var(--color-error-700);
  --action-disabled: var(--color-neutral-100);
  --success-fg: var(--color-success-700);
  --success-bg: var(--color-success-50);
  --success-border: var(--color-success-600);
  --warning-fg: var(--color-warning-800);
  --warning-bg: var(--color-warning-50);
  --warning-border: var(--color-warning-600);
  --error-fg: var(--color-error-700);
  --error-bg: var(--color-error-50);
  --error-border: var(--color-error-600);
  --info-fg: var(--color-info-700);
  --info-bg: var(--color-info-50);
  --info-border: var(--color-info-600);
  --accent-clay: var(--color-primary-100);
  --accent-olive: var(--color-secondary-100);
  --accent-honey: var(--color-warning-100);
  --accent-sky: var(--color-info-100);
  --accent-ink: var(--color-neutral-900);
  --shadow-xs: 0 1px 2px rgba(41, 36, 31, 0.06);
  --shadow-sm: 0 1px 2px rgba(41, 36, 31, 0.05), 0 2px 8px rgba(41, 36, 31, 0.06);
  --shadow-md: 0 2px 4px rgba(41, 36, 31, 0.04), 0 8px 24px rgba(41, 36, 31, 0.09);
  --shadow-lg: 0 4px 8px rgba(41, 36, 31, 0.04), 0 24px 48px rgba(41, 36, 31, 0.14);
}
[data-theme="dark"] {
  color-scheme: dark;
  --surface-page: var(--color-neutral-950);
  --surface-subtle: var(--color-neutral-925);
  --surface-card: var(--color-neutral-900);
  --surface-elevated: var(--color-neutral-850);
  --surface-sunken: var(--color-neutral-925);
  --surface-brand: var(--color-primary-950);
  --surface-tonal: var(--color-secondary-950);
  --surface-note: var(--color-warning-950);
  --surface-inverse: var(--color-neutral-50);
  --surface-overlay: rgba(12, 9, 7, 0.72);
  --text-primary: var(--color-neutral-100);
  --text-secondary: var(--color-neutral-300);
  --text-muted: var(--color-neutral-400);
  --text-disabled: var(--color-neutral-600);
  --text-inverse: var(--color-neutral-900);
  --text-brand: var(--color-primary-300);
  --text-tonal: var(--color-secondary-200);
  --text-on-action: var(--color-neutral-950);
  --border-subtle: var(--color-neutral-850);
  --border-default: var(--color-neutral-800);
  --border-strong: var(--color-neutral-500);
  --border-brand: var(--color-primary-300);
  --focus-ring: var(--color-primary-300);
  --action-primary: var(--color-primary-400);
  --action-primary-hover: var(--color-primary-300);
  --action-primary-active: var(--color-primary-200);
  --action-neutral-hover: var(--color-neutral-850);
  --action-neutral-active: var(--color-neutral-800);
  --action-tonal: var(--color-secondary-900);
  --action-tonal-hover: var(--color-secondary-800);
  --action-danger: var(--color-error-400);
  --action-danger-hover: var(--color-error-300);
  --action-disabled: var(--color-neutral-850);
  --success-fg: var(--color-success-300);
  --success-bg: var(--color-success-950);
  --success-border: var(--color-success-400);
  --warning-fg: var(--color-warning-300);
  --warning-bg: var(--color-warning-950);
  --warning-border: var(--color-warning-400);
  --error-fg: var(--color-error-300);
  --error-bg: var(--color-error-950);
  --error-border: var(--color-error-400);
  --info-fg: var(--color-info-300);
  --info-bg: var(--color-info-950);
  --info-border: var(--color-info-400);
  --accent-clay: var(--color-primary-950);
  --accent-olive: var(--color-secondary-950);
  --accent-honey: var(--color-warning-950);
  --accent-sky: var(--color-info-950);
  --accent-ink: var(--color-neutral-100);
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35), 0 2px 8px rgba(0, 0, 0, 0.25);
  --shadow-md: 0 2px 4px rgba(0, 0, 0, 0.35), 0 8px 24px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 4px 8px rgba(0, 0, 0, 0.45), 0 24px 48px rgba(0, 0, 0, 0.45);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --surface-page: var(--color-neutral-950);
    --surface-subtle: var(--color-neutral-925);
    --surface-card: var(--color-neutral-900);
    --surface-elevated: var(--color-neutral-850);
    --surface-sunken: var(--color-neutral-925);
    --surface-brand: var(--color-primary-950);
    --surface-tonal: var(--color-secondary-950);
    --surface-note: var(--color-warning-950);
    --surface-inverse: var(--color-neutral-50);
    --surface-overlay: rgba(12, 9, 7, 0.72);
    --text-primary: var(--color-neutral-100);
    --text-secondary: var(--color-neutral-300);
    --text-muted: var(--color-neutral-400);
    --text-disabled: var(--color-neutral-600);
    --text-inverse: var(--color-neutral-900);
    --text-brand: var(--color-primary-300);
    --text-tonal: var(--color-secondary-200);
    --text-on-action: var(--color-neutral-950);
    --border-subtle: var(--color-neutral-850);
    --border-default: var(--color-neutral-800);
    --border-strong: var(--color-neutral-500);
    --border-brand: var(--color-primary-300);
    --focus-ring: var(--color-primary-300);
    --action-primary: var(--color-primary-400);
    --action-primary-hover: var(--color-primary-300);
    --action-primary-active: var(--color-primary-200);
    --action-neutral-hover: var(--color-neutral-850);
    --action-neutral-active: var(--color-neutral-800);
    --action-tonal: var(--color-secondary-900);
    --action-tonal-hover: var(--color-secondary-800);
    --action-danger: var(--color-error-400);
    --action-danger-hover: var(--color-error-300);
    --action-disabled: var(--color-neutral-850);
    --success-fg: var(--color-success-300);
    --success-bg: var(--color-success-950);
    --success-border: var(--color-success-400);
    --warning-fg: var(--color-warning-300);
    --warning-bg: var(--color-warning-950);
    --warning-border: var(--color-warning-400);
    --error-fg: var(--color-error-300);
    --error-bg: var(--color-error-950);
    --error-border: var(--color-error-400);
    --info-fg: var(--color-info-300);
    --info-bg: var(--color-info-950);
    --info-border: var(--color-info-400);
    --accent-clay: var(--color-primary-950);
    --accent-olive: var(--color-secondary-950);
    --accent-honey: var(--color-warning-950);
    --accent-sky: var(--color-info-950);
    --accent-ink: var(--color-neutral-100);
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.35);
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35), 0 2px 8px rgba(0, 0, 0, 0.25);
    --shadow-md: 0 2px 4px rgba(0, 0, 0, 0.35), 0 8px 24px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 4px 8px rgba(0, 0, 0, 0.45), 0 24px 48px rgba(0, 0, 0, 0.45);
  }
}
:root {
  --font-size-2xs: 13px;
  --font-size-xs: 14px;
  --font-size-sm: 15px;
  --font-size-base: 16px;
  --font-size-md: 17px;
  --font-size-lg: 18px;
  --font-size-xl: 20px;
  --font-size-2xl: 22px;
  --font-size-3xl: 24px;
  --font-size-4xl: 28px;
  --font-size-5xl: 32px;
  --font-size-6xl: 36px;
  --font-size-7xl: 40px;
  --font-size-8xl: 44px;
  --font-size-9xl: 56px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-full: 9999px;
  --border-width-1: 1px;
  --border-width-2: 1.5px;
  --border-width-3: 2px;
  --focus-width: 3px;
  --focus-offset: 2px;
  --bp-sm: 600px;
  --bp-md: 840px;
  --bp-lg: 1080px;
  --bp-xl: 1360px;
  --size-touch-min: 44px;
  --size-touch: 48px;
  --size-control-sm: 40px;
  --size-control-md: 48px;
  --size-control-lg: 56px;
  --size-control-xl: 64px;
  --size-icon-xs: 16px;
  --size-icon-sm: 20px;
  --size-icon-md: 24px;
  --size-nav-top: 72px;
  --size-nav-bottom: 68px;
  --size-container: 1200px;
  --size-reading: 720px;
  --z-sticky: 10;
  --z-nav: 100;
  --z-overlay: 200;
  --z-toast: 300;
  --duration-fast: 150ms;
  --duration-base: 200ms;
  --duration-slow: 250ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-emphasis: cubic-bezier(0.3, 1.4, 0.5, 1);
  --font-serif: Lora, Georgia, "Times New Roman", serif;
  --font-sans: "Atkinson Hyperlegible Next", "Atkinson Hyperlegible", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-hand: Caveat, "Segoe Print", "Bradley Hand", cursive;
}