/*
  CityBites Market tokens. GENERATED FILE: do not edit by hand.
  Source: docs/design-tokens/market-figma-variables.json (Figma file nTr8ddY2Kv2frwZ5bBWxiB, exported 2026-10-30).
  Rebuild: node tools/design-tokens/build-market-tokens.mjs
  Modes: data-cb-mk-theme="light|dark|auto" and data-cb-mk-density="roomy|compact" on any ancestor.
*/

:root {
    /* Primitives */
    --cb-mk-palette-forest-950: #0f1c14;
    --cb-mk-palette-forest-900: #13261b;
    --cb-mk-palette-forest-850: #16281d;
    --cb-mk-palette-forest-800: #1d3325;
    --cb-mk-palette-forest-750: #2b4233;
    --cb-mk-palette-forest-700: #1f5135;
    --cb-mk-palette-forest-650: #3c5545;
    --cb-mk-palette-leaf-100: #e3eeda;
    --cb-mk-palette-leaf-200: #cfe6c1;
    --cb-mk-palette-leaf-800: #21402c;
    --cb-mk-palette-lime-100: #eef6c4;
    --cb-mk-palette-lime-200: #e3efa8;
    --cb-mk-palette-lime-400: #d9ea6e;
    --cb-mk-palette-lime-500: #c8db55;
    --cb-mk-palette-lime-800: #34401a;
    --cb-mk-palette-lime-900: #3a4a08;
    --cb-mk-palette-neutral-white: #ffffff;
    --cb-mk-palette-sage-100: #f5f6f4;
    --cb-mk-palette-sage-200: #e9ece8;
    --cb-mk-palette-sage-300: #e3e6e2;
    --cb-mk-palette-sage-400: #c9cec8;
    --cb-mk-palette-sage-500: #c3c8c2;
    --cb-mk-palette-sage-600: #879088;
    --cb-mk-palette-moss-400: #6f7a70;
    --cb-mk-palette-moss-500: #626c64;
    --cb-mk-palette-moss-600: #4a5a4f;
    --cb-mk-palette-mist-100: #edf1e6;
    --cb-mk-palette-mist-400: #a8b6a9;
    --cb-mk-palette-tomato-100: #fbe3d6;
    --cb-mk-palette-tomato-300: #f4b39c;
    --cb-mk-palette-tomato-500: #e0603a;
    --cb-mk-palette-tomato-700: #9c3515;
    --cb-mk-palette-tomato-900: #42231a;
    --cb-mk-palette-red-100: #fde4e1;
    --cb-mk-palette-red-300: #f5a49b;
    --cb-mk-palette-red-600: #b42318;
    --cb-mk-palette-red-900: #3f1a17;
    --cb-mk-palette-blue-100: #e3ecf7;
    --cb-mk-palette-blue-300: #a9c7ee;
    --cb-mk-palette-blue-700: #1e4e8c;
    --cb-mk-palette-blue-900: #1b2d45;
    --cb-mk-palette-honey-100: #fdf0cc;
    --cb-mk-palette-honey-300: #f3cd63;
    --cb-mk-palette-honey-700: #7c5300;
    --cb-mk-palette-honey-900: #3d2f0d;
    --cb-mk-palette-overlay-white-6: #ffffff0f;
    --cb-mk-palette-overlay-white-10: #ffffff1a;
    --cb-mk-palette-overlay-white-14: #ffffff24;
    --cb-mk-palette-overlay-white-16: #ffffff29;
    --cb-mk-palette-overlay-forest-8: #1f513514;
    --cb-mk-palette-overlay-lime-12: #d9ea6e1f;
    --cb-mk-space-0: 0;
    --cb-mk-space-1: 0.125rem;
    --cb-mk-space-2: 0.25rem;
    --cb-mk-space-3: 0.5rem;
    --cb-mk-space-4: 0.75rem;
    --cb-mk-space-5: 1rem;
    --cb-mk-space-6: 1.25rem;
    --cb-mk-space-7: 1.5rem;
    --cb-mk-space-8: 2rem;
    --cb-mk-space-9: 2.5rem;
    --cb-mk-space-10: 3rem;
    --cb-mk-space-11: 4rem;
    --cb-mk-size-30: 1.875rem;
    --cb-mk-size-36: 2.25rem;
    --cb-mk-size-40: 2.5rem;
    --cb-mk-size-44: 2.75rem;
    --cb-mk-size-48: 3rem;
    --cb-mk-size-56: 3.5rem;
    --cb-mk-radius-sm: 0.5rem;
    --cb-mk-radius-md: 0.75rem;
    --cb-mk-radius-lg: 1rem;
    --cb-mk-radius-xl: 1.5rem;
    --cb-mk-radius-2xl: 2rem;
    --cb-mk-radius-full: 999px;
    --cb-mk-font-size-12: 0.75rem;
    --cb-mk-font-size-13: 0.8125rem;
    --cb-mk-font-size-14: 0.875rem;
    --cb-mk-font-size-15: 0.9375rem;
    --cb-mk-font-size-16: 1rem;
    --cb-mk-font-size-18: 1.125rem;
    
    /* Type */
    --cb-mk-font-family-display: "Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
    --cb-mk-font-family-body: Inter, "Segoe UI", system-ui, -apple-system, sans-serif;
    --cb-mk-text-display-xl: 700 4.5rem/0.98 var(--cb-mk-font-family-display);
    --cb-mk-tracking-display-xl: -0.035em;
    --cb-mk-text-display-l: 700 3.5rem/1 var(--cb-mk-font-family-display);
    --cb-mk-tracking-display-l: -0.03em;
    --cb-mk-text-heading-1: 700 2.5rem/1.08 var(--cb-mk-font-family-display);
    --cb-mk-tracking-heading-1: -0.025em;
    --cb-mk-text-heading-2: 700 1.875rem/1.12 var(--cb-mk-font-family-display);
    --cb-mk-tracking-heading-2: -0.02em;
    --cb-mk-text-heading-3: 600 1.375rem/1.2 var(--cb-mk-font-family-display);
    --cb-mk-tracking-heading-3: -0.01em;
    --cb-mk-text-heading-4: 600 1.125rem/1.25 var(--cb-mk-font-family-display);
    --cb-mk-tracking-heading-4: -0.005em;
    --cb-mk-text-body-l: 400 1.125rem/1.55 var(--cb-mk-font-family-body);
    --cb-mk-tracking-body-l: 0;
    --cb-mk-tracking-body-m: 0;
    --cb-mk-tracking-body-m-strong: 0;
    --cb-mk-text-body-s: 400 0.875rem/1.5 var(--cb-mk-font-family-body);
    --cb-mk-tracking-body-s: 0;
    --cb-mk-tracking-label-m: 0;
    --cb-mk-tracking-label-s: 0;
    --cb-mk-tracking-caption: 0;
    --cb-mk-text-overline: 700 0.75rem/1.3 var(--cb-mk-font-family-body);
    --cb-mk-tracking-overline: 0.12em;
    --cb-mk-text-number-xl: 700 2.25rem/1.05 var(--cb-mk-font-family-display);
    --cb-mk-tracking-number-xl: -0.02em;
    --cb-mk-text-number-l: 700 1.625rem/1.1 var(--cb-mk-font-family-display);
    --cb-mk-tracking-number-l: -0.01em;
    --cb-mk-text-price-l: 700 1.25rem/1.2 var(--cb-mk-font-family-display);
    --cb-mk-tracking-price-l: 0;
    --cb-mk-text-price-m: 700 1rem/1.2 var(--cb-mk-font-family-display);
    --cb-mk-tracking-price-m: 0;
    
    /* Elevation, focus and motion */
    --cb-mk-shadow-raised: 0px 1px 2px 0px rgb(19 38 27 / 0.051), 0px 10px 30px 0px rgb(19 38 27 / 0.078);
    --cb-mk-shadow-overlay: 0px 20px 44px 0px rgb(19 38 27 / 0.161);
    --cb-mk-shadow-sheet: 0px -12px 30px 0px rgb(19 38 27 / 0.122);
    --cb-mk-focus-ring-width: 0.25rem;
    --cb-mk-motion-fast: 120ms;
    --cb-mk-motion-base: 200ms;
    --cb-mk-motion-ease: cubic-bezier(0.2, 0, 0, 1);
}

:root,
[data-cb-mk-theme="light"] {
    color-scheme: light;
    --cb-mk-color-bg-page: var(--cb-mk-palette-sage-100);
    --cb-mk-color-bg-surface: var(--cb-mk-palette-neutral-white);
    --cb-mk-color-bg-raised: var(--cb-mk-palette-neutral-white);
    --cb-mk-color-bg-sunken: var(--cb-mk-palette-sage-200);
    --cb-mk-color-bg-inverse: var(--cb-mk-palette-forest-900);
    --cb-mk-color-bg-brand: var(--cb-mk-palette-forest-700);
    --cb-mk-color-bg-brand-hover: var(--cb-mk-palette-forest-900);
    --cb-mk-color-bg-brand-pressed: var(--cb-mk-palette-forest-950);
    --cb-mk-color-bg-accent: var(--cb-mk-palette-lime-400);
    --cb-mk-color-bg-accent-hover: var(--cb-mk-palette-lime-500);
    --cb-mk-color-bg-accent-soft: var(--cb-mk-palette-lime-100);
    --cb-mk-color-bg-success-soft: var(--cb-mk-palette-leaf-100);
    --cb-mk-color-bg-warning: var(--cb-mk-palette-tomato-500);
    --cb-mk-color-bg-warning-soft: var(--cb-mk-palette-tomato-100);
    --cb-mk-color-bg-attention-soft: var(--cb-mk-palette-honey-100);
    --cb-mk-color-bg-danger: var(--cb-mk-palette-red-600);
    --cb-mk-color-bg-danger-soft: var(--cb-mk-palette-red-100);
    --cb-mk-color-bg-info-soft: var(--cb-mk-palette-overlay-forest-8);
    --cb-mk-color-bg-disabled: var(--cb-mk-palette-sage-200);
    --cb-mk-color-bg-scrim: var(--cb-mk-palette-forest-950);
    --cb-mk-color-bg-overlay-subtle: var(--cb-mk-palette-overlay-white-6);
    --cb-mk-color-bg-overlay-hover: var(--cb-mk-palette-overlay-white-10);
    --cb-mk-color-bg-overlay-strong: var(--cb-mk-palette-overlay-white-16);
    --cb-mk-color-text-primary: var(--cb-mk-palette-forest-900);
    --cb-mk-color-text-secondary: var(--cb-mk-palette-moss-600);
    --cb-mk-color-text-disabled: var(--cb-mk-palette-moss-500);
    --cb-mk-color-text-on-brand: var(--cb-mk-palette-neutral-white);
    --cb-mk-color-text-on-accent: var(--cb-mk-palette-forest-900);
    --cb-mk-color-text-on-inverse: var(--cb-mk-palette-neutral-white);
    --cb-mk-color-text-on-danger: var(--cb-mk-palette-neutral-white);
    --cb-mk-color-text-brand: var(--cb-mk-palette-forest-700);
    --cb-mk-color-text-success: var(--cb-mk-palette-forest-700);
    --cb-mk-color-text-warning: var(--cb-mk-palette-tomato-700);
    --cb-mk-color-text-attention: var(--cb-mk-palette-honey-700);
    --cb-mk-color-text-danger: var(--cb-mk-palette-red-600);
    --cb-mk-color-text-info: var(--cb-mk-palette-forest-700);
    --cb-mk-color-text-accent: var(--cb-mk-palette-lime-900);
    --cb-mk-color-border-default: var(--cb-mk-palette-sage-300);
    --cb-mk-color-border-strong: var(--cb-mk-palette-sage-500);
    --cb-mk-color-border-control: var(--cb-mk-palette-sage-600);
    --cb-mk-color-border-focus: var(--cb-mk-palette-forest-700);
    --cb-mk-color-border-brand: var(--cb-mk-palette-forest-700);
    --cb-mk-color-border-danger: var(--cb-mk-palette-red-600);
    --cb-mk-color-border-inverse: var(--cb-mk-palette-neutral-white);
    --cb-mk-color-border-overlay: var(--cb-mk-palette-overlay-white-14);
    --cb-mk-focus-ring: 0 0 0 var(--cb-mk-focus-ring-width) color-mix(in srgb, var(--cb-mk-color-border-focus) 24%, transparent);
}

[data-cb-mk-theme="dark"] {
    color-scheme: dark;
    --cb-mk-color-bg-page: var(--cb-mk-palette-forest-950);
    --cb-mk-color-bg-surface: var(--cb-mk-palette-forest-850);
    --cb-mk-color-bg-raised: var(--cb-mk-palette-forest-800);
    --cb-mk-color-bg-sunken: var(--cb-mk-palette-forest-800);
    --cb-mk-color-bg-inverse: var(--cb-mk-palette-forest-750);
    --cb-mk-color-bg-brand: var(--cb-mk-palette-lime-400);
    --cb-mk-color-bg-brand-hover: var(--cb-mk-palette-lime-500);
    --cb-mk-color-bg-brand-pressed: var(--cb-mk-palette-lime-500);
    --cb-mk-color-bg-accent: var(--cb-mk-palette-lime-400);
    --cb-mk-color-bg-accent-hover: var(--cb-mk-palette-lime-500);
    --cb-mk-color-bg-accent-soft: var(--cb-mk-palette-lime-800);
    --cb-mk-color-bg-success-soft: var(--cb-mk-palette-leaf-800);
    --cb-mk-color-bg-warning: var(--cb-mk-palette-tomato-500);
    --cb-mk-color-bg-warning-soft: var(--cb-mk-palette-tomato-900);
    --cb-mk-color-bg-attention-soft: var(--cb-mk-palette-honey-900);
    --cb-mk-color-bg-danger: var(--cb-mk-palette-red-300);
    --cb-mk-color-bg-danger-soft: var(--cb-mk-palette-red-900);
    --cb-mk-color-bg-info-soft: var(--cb-mk-palette-overlay-lime-12);
    --cb-mk-color-bg-disabled: var(--cb-mk-palette-forest-800);
    --cb-mk-color-bg-scrim: var(--cb-mk-palette-forest-950);
    --cb-mk-color-bg-overlay-subtle: var(--cb-mk-palette-overlay-white-6);
    --cb-mk-color-bg-overlay-hover: var(--cb-mk-palette-overlay-white-10);
    --cb-mk-color-bg-overlay-strong: var(--cb-mk-palette-overlay-white-16);
    --cb-mk-color-text-primary: var(--cb-mk-palette-mist-100);
    --cb-mk-color-text-secondary: var(--cb-mk-palette-mist-400);
    --cb-mk-color-text-disabled: var(--cb-mk-palette-moss-400);
    --cb-mk-color-text-on-brand: var(--cb-mk-palette-forest-900);
    --cb-mk-color-text-on-accent: var(--cb-mk-palette-forest-900);
    --cb-mk-color-text-on-inverse: var(--cb-mk-palette-mist-100);
    --cb-mk-color-text-on-danger: var(--cb-mk-palette-forest-950);
    --cb-mk-color-text-brand: var(--cb-mk-palette-lime-400);
    --cb-mk-color-text-success: var(--cb-mk-palette-leaf-200);
    --cb-mk-color-text-warning: var(--cb-mk-palette-tomato-300);
    --cb-mk-color-text-attention: var(--cb-mk-palette-honey-300);
    --cb-mk-color-text-danger: var(--cb-mk-palette-red-300);
    --cb-mk-color-text-info: var(--cb-mk-palette-lime-200);
    --cb-mk-color-text-accent: var(--cb-mk-palette-lime-200);
    --cb-mk-color-border-default: var(--cb-mk-palette-forest-750);
    --cb-mk-color-border-strong: var(--cb-mk-palette-forest-650);
    --cb-mk-color-border-control: var(--cb-mk-palette-forest-650);
    --cb-mk-color-border-focus: var(--cb-mk-palette-lime-400);
    --cb-mk-color-border-brand: var(--cb-mk-palette-lime-400);
    --cb-mk-color-border-danger: var(--cb-mk-palette-red-300);
    --cb-mk-color-border-inverse: var(--cb-mk-palette-forest-950);
    --cb-mk-color-border-overlay: var(--cb-mk-palette-overlay-white-14);
    --cb-mk-focus-ring: 0 0 0 var(--cb-mk-focus-ring-width) color-mix(in srgb, var(--cb-mk-color-border-focus) 24%, transparent);
}

@media (prefers-color-scheme: dark) {
    [data-cb-mk-theme="auto"] {
        color-scheme: dark;
        --cb-mk-color-bg-page: var(--cb-mk-palette-forest-950);
        --cb-mk-color-bg-surface: var(--cb-mk-palette-forest-850);
        --cb-mk-color-bg-raised: var(--cb-mk-palette-forest-800);
        --cb-mk-color-bg-sunken: var(--cb-mk-palette-forest-800);
        --cb-mk-color-bg-inverse: var(--cb-mk-palette-forest-750);
        --cb-mk-color-bg-brand: var(--cb-mk-palette-lime-400);
        --cb-mk-color-bg-brand-hover: var(--cb-mk-palette-lime-500);
        --cb-mk-color-bg-brand-pressed: var(--cb-mk-palette-lime-500);
        --cb-mk-color-bg-accent: var(--cb-mk-palette-lime-400);
        --cb-mk-color-bg-accent-hover: var(--cb-mk-palette-lime-500);
        --cb-mk-color-bg-accent-soft: var(--cb-mk-palette-lime-800);
        --cb-mk-color-bg-success-soft: var(--cb-mk-palette-leaf-800);
        --cb-mk-color-bg-warning: var(--cb-mk-palette-tomato-500);
        --cb-mk-color-bg-warning-soft: var(--cb-mk-palette-tomato-900);
        --cb-mk-color-bg-attention-soft: var(--cb-mk-palette-honey-900);
        --cb-mk-color-bg-danger: var(--cb-mk-palette-red-300);
        --cb-mk-color-bg-danger-soft: var(--cb-mk-palette-red-900);
        --cb-mk-color-bg-info-soft: var(--cb-mk-palette-overlay-lime-12);
        --cb-mk-color-bg-disabled: var(--cb-mk-palette-forest-800);
        --cb-mk-color-bg-scrim: var(--cb-mk-palette-forest-950);
        --cb-mk-color-bg-overlay-subtle: var(--cb-mk-palette-overlay-white-6);
        --cb-mk-color-bg-overlay-hover: var(--cb-mk-palette-overlay-white-10);
        --cb-mk-color-bg-overlay-strong: var(--cb-mk-palette-overlay-white-16);
        --cb-mk-color-text-primary: var(--cb-mk-palette-mist-100);
        --cb-mk-color-text-secondary: var(--cb-mk-palette-mist-400);
        --cb-mk-color-text-disabled: var(--cb-mk-palette-moss-400);
        --cb-mk-color-text-on-brand: var(--cb-mk-palette-forest-900);
        --cb-mk-color-text-on-accent: var(--cb-mk-palette-forest-900);
        --cb-mk-color-text-on-inverse: var(--cb-mk-palette-mist-100);
        --cb-mk-color-text-on-danger: var(--cb-mk-palette-forest-950);
        --cb-mk-color-text-brand: var(--cb-mk-palette-lime-400);
        --cb-mk-color-text-success: var(--cb-mk-palette-leaf-200);
        --cb-mk-color-text-warning: var(--cb-mk-palette-tomato-300);
        --cb-mk-color-text-attention: var(--cb-mk-palette-honey-300);
        --cb-mk-color-text-danger: var(--cb-mk-palette-red-300);
        --cb-mk-color-text-info: var(--cb-mk-palette-lime-200);
        --cb-mk-color-text-accent: var(--cb-mk-palette-lime-200);
        --cb-mk-color-border-default: var(--cb-mk-palette-forest-750);
        --cb-mk-color-border-strong: var(--cb-mk-palette-forest-650);
        --cb-mk-color-border-control: var(--cb-mk-palette-forest-650);
        --cb-mk-color-border-focus: var(--cb-mk-palette-lime-400);
        --cb-mk-color-border-brand: var(--cb-mk-palette-lime-400);
        --cb-mk-color-border-danger: var(--cb-mk-palette-red-300);
        --cb-mk-color-border-inverse: var(--cb-mk-palette-forest-950);
        --cb-mk-color-border-overlay: var(--cb-mk-palette-overlay-white-14);
        --cb-mk-focus-ring: 0 0 0 var(--cb-mk-focus-ring-width) color-mix(in srgb, var(--cb-mk-color-border-focus) 24%, transparent);
    }
}

:root,
[data-cb-mk-density="roomy"] {
    --cb-mk-control-height-lg: var(--cb-mk-size-56);
    --cb-mk-control-height: var(--cb-mk-size-48);
    --cb-mk-control-height-sm: var(--cb-mk-size-40);
    --cb-mk-space-inset-card: var(--cb-mk-space-7);
    --cb-mk-space-inset-control: var(--cb-mk-space-6);
    --cb-mk-space-inset-field: var(--cb-mk-space-5);
    --cb-mk-space-gap-lg: var(--cb-mk-space-7);
    --cb-mk-space-gap: var(--cb-mk-space-5);
    --cb-mk-space-gap-sm: var(--cb-mk-space-3);
    --cb-mk-space-gap-xs: var(--cb-mk-space-2);
    --cb-mk-space-section: var(--cb-mk-space-8);
    --cb-mk-radius-card: var(--cb-mk-radius-xl);
    --cb-mk-radius-field: var(--cb-mk-radius-lg);
    --cb-mk-radius-control: var(--cb-mk-radius-full);
    --cb-mk-radius-media: var(--cb-mk-radius-lg);
    --cb-mk-font-size-body: var(--cb-mk-font-size-16);
    --cb-mk-font-size-label: var(--cb-mk-font-size-15);
    --cb-mk-font-size-small: var(--cb-mk-font-size-13);
    --cb-mk-text-body-m: 400 var(--cb-mk-font-size-body)/1.55 var(--cb-mk-font-family-body);
    --cb-mk-text-body-m-strong: 600 var(--cb-mk-font-size-body)/1.5 var(--cb-mk-font-family-body);
    --cb-mk-text-label-m: 600 var(--cb-mk-font-size-label)/1.3 var(--cb-mk-font-family-body);
    --cb-mk-text-label-s: 600 var(--cb-mk-font-size-small)/1.3 var(--cb-mk-font-family-body);
    --cb-mk-text-caption: 400 var(--cb-mk-font-size-small)/1.4 var(--cb-mk-font-family-body);
}

[data-cb-mk-density="compact"] {
    --cb-mk-control-height-lg: var(--cb-mk-size-44);
    --cb-mk-control-height: var(--cb-mk-size-36);
    --cb-mk-control-height-sm: var(--cb-mk-size-30);
    --cb-mk-space-inset-card: var(--cb-mk-space-5);
    --cb-mk-space-inset-control: var(--cb-mk-space-4);
    --cb-mk-space-inset-field: var(--cb-mk-space-4);
    --cb-mk-space-gap-lg: var(--cb-mk-space-5);
    --cb-mk-space-gap: var(--cb-mk-space-4);
    --cb-mk-space-gap-sm: var(--cb-mk-space-2);
    --cb-mk-space-gap-xs: var(--cb-mk-space-1);
    --cb-mk-space-section: var(--cb-mk-space-6);
    --cb-mk-radius-card: var(--cb-mk-radius-lg);
    --cb-mk-radius-field: var(--cb-mk-radius-md);
    --cb-mk-radius-control: var(--cb-mk-radius-full);
    --cb-mk-radius-media: var(--cb-mk-radius-md);
    --cb-mk-font-size-body: var(--cb-mk-font-size-14);
    --cb-mk-font-size-label: var(--cb-mk-font-size-13);
    --cb-mk-font-size-small: var(--cb-mk-font-size-12);
    --cb-mk-text-body-m: 400 var(--cb-mk-font-size-body)/1.55 var(--cb-mk-font-family-body);
    --cb-mk-text-body-m-strong: 600 var(--cb-mk-font-size-body)/1.5 var(--cb-mk-font-family-body);
    --cb-mk-text-label-m: 600 var(--cb-mk-font-size-label)/1.3 var(--cb-mk-font-family-body);
    --cb-mk-text-label-s: 600 var(--cb-mk-font-size-small)/1.3 var(--cb-mk-font-family-body);
    --cb-mk-text-caption: 400 var(--cb-mk-font-size-small)/1.4 var(--cb-mk-font-family-body);
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --cb-mk-motion-fast: 0ms;
        --cb-mk-motion-base: 0ms;
    }
}