/* Design Tokens - Auto-generated */
/* Do not edit directly - modify tokens.json instead */

/* === PRIMITIVES === */
:root {
  --primitive-color-brand-yellow: #FED719;
  --primitive-color-brand-yellow-soft: #FFF6AD;
  --primitive-color-brand-graphite: #363233;
  --primitive-color-brand-ink: #201E1F;
  --primitive-color-brand-white: #FFFFFF;
  --primitive-color-neutral-surface: #F6F4F1;
  --primitive-color-neutral-muted: #736D6F;
  --primitive-color-neutral-line: #E7E2E3;
  --primitive-color-neutral-line-strong: #CFC9CA;
  --primitive-color-neutral-deep: #242122;
  --primitive-color-status-success: #237A3B;
  --primitive-color-status-success-surface: #E8F5EC;
  --primitive-color-status-error: #B42334;
  --primitive-color-status-error-surface: #FCEBEC;
  --primitive-color-status-info: #1D5F91;
  --primitive-color-status-info-surface: #EAF3FA;
  --primitive-color-status-warning: #5F4700;
  --primitive-color-status-warning-surface: #FFF1B8;
  --primitive-color-utility-focus: #735F00;
  --primitive-color-utility-white-92: rgb(255 255 255 / 92%);
  --primitive-color-utility-white-70: rgb(255 255 255 / 70%);
  --primitive-color-utility-white-60: rgb(255 255 255 / 60%);
  --primitive-color-utility-white-35: rgb(255 255 255 / 35%);
  --primitive-color-utility-graphite-25: rgb(54 50 51 / 25%);
  --primitive-color-utility-graphite-14: rgb(54 50 51 / 14%);
  --primitive-color-utility-graphite-10: rgb(54 50 51 / 10%);
  --primitive-color-utility-graphite-08: rgb(54 50 51 / 8%);
  --primitive-color-utility-yellow-20: rgb(254 215 25 / 20%);
  --primitive-color-illustration-violet: #6E19FF;
  --primitive-color-illustration-magenta: #CA27D6;
  --primitive-color-illustration-coral: #FF5E89;
  --primitive-font-family-sans: Onest, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --primitive-font-size-xs: 0.875rem;
  --primitive-font-size-sm: 0.9375rem;
  --primitive-font-size-base: 1rem;
  --primitive-font-size-lg: 1.125rem;
  --primitive-font-size-xl: 1.25rem;
  --primitive-font-size-2xl: 1.5rem;
  --primitive-font-size-3xl: 1.875rem;
  --primitive-font-size-4xl: 2.25rem;
  --primitive-font-size-5xl: 2.75rem;
  --primitive-font-size-6xl: 3.25rem;
  --primitive-font-size-7xl: 4rem;
  --primitive-font-size-display: 5.5rem;
  --primitive-font-weight-regular: 400;
  --primitive-font-weight-medium: 500;
  --primitive-font-weight-semibold: 600;
  --primitive-font-weight-bold: 700;
  --primitive-font-weight-extrabold: 800;
  --primitive-font-weight-black: 900;
  --primitive-font-line-height-display: 0.96;
  --primitive-font-line-height-heading: 1.08;
  --primitive-font-line-height-compact: 1.25;
  --primitive-font-line-height-body: 1.6;
  --primitive-font-line-height-longform: 1.7;
  --primitive-font-tracking-display: -0.04em;
  --primitive-font-tracking-heading: -0.025em;
  --primitive-font-tracking-normal: 0;
  --primitive-font-tracking-label: 0.06em;
  --primitive-font-tracking-eyebrow: 0.1em;
  --primitive-space-0: 0;
  --primitive-space-1: 0.25rem;
  --primitive-space-2: 0.5rem;
  --primitive-space-3: 0.75rem;
  --primitive-space-4: 1rem;
  --primitive-space-5: 1.25rem;
  --primitive-space-6: 1.5rem;
  --primitive-space-7: 1.75rem;
  --primitive-space-8: 2rem;
  --primitive-space-10: 2.5rem;
  --primitive-space-12: 3rem;
  --primitive-space-14: 3.5rem;
  --primitive-space-16: 4rem;
  --primitive-space-18: 4.5rem;
  --primitive-space-20: 5rem;
  --primitive-space-24: 6rem;
  --primitive-space-30: 7.5rem;
  --primitive-space-0-5: 0.125rem;
  --primitive-space-1-5: 0.375rem;
  --primitive-space-2-5: 0.625rem;
  --primitive-space-3-5: 0.875rem;
  --primitive-size-control-min: 2.75rem;
  --primitive-size-control-comfortable: 3.375rem;
  --primitive-size-control-checkout: 3.625rem;
  --primitive-size-icon-sm: 1rem;
  --primitive-size-icon-md: 1.25rem;
  --primitive-size-icon-lg: 1.5rem;
  --primitive-size-product-thumb: 4.5rem;
  --primitive-radius-none: 0;
  --primitive-radius-sm: 0.5rem;
  --primitive-radius-control: 0.625rem;
  --primitive-radius-card: 0.875rem;
  --primitive-radius-panel: 1.375rem;
  --primitive-radius-full: 9999px;
  --primitive-border-width-thin: 1px;
  --primitive-border-width-strong: 2px;
  --primitive-border-width-focus: 3px;
  --primitive-shadow-none: none;
  --primitive-shadow-low: 0 12px 28px rgb(54 50 51 / 14%);
  --primitive-shadow-high: 0 24px 65px rgb(54 50 51 / 10%);
  --primitive-shadow-selected: 0 0 0 7px rgb(254 215 25 / 20%);
  --primitive-duration-instant: 1ms;
  --primitive-duration-fast: 180ms;
  --primitive-duration-normal: 200ms;
  --primitive-duration-slow: 300ms;
  --primitive-easing-standard: ease-in-out;
  --primitive-easing-enter: ease-out;
  --primitive-easing-exit: ease-in;
  --primitive-z-base: 0;
  --primitive-z-content: 2;
  --primitive-z-raised: 3;
  --primitive-z-sticky: 10;
  --primitive-z-header: 40;
  --primitive-z-announcement: 50;
  --primitive-z-overlay: 100;
  --primitive-z-modal: 200;
  --primitive-z-a11y: 1000;
  --primitive-breakpoint-sm: 37.5rem;
  --primitive-breakpoint-md: 48rem;
  --primitive-breakpoint-lg: 56.25rem;
  --primitive-breakpoint-xl: 64rem;
  --primitive-breakpoint-wide: 90rem;
  --primitive-container-site: 82.5rem;
  --primitive-container-content: 47.5rem;
  --primitive-container-prose: 65ch;
  --primitive-container-form: 43.75rem;
  --primitive-container-summary: 24.375rem;
}

/* === SEMANTIC === */
:root {
  --color-background: #FFFFFF;
  --color-surface: #F6F4F1;
  --color-surface-strong: #FFFFFF;
  --color-surface-inverse: #363233;
  --color-surface-inverse-deep: #242122;
  --color-text: #363233;
  --color-text-strong: #201E1F;
  --color-text-muted: #736D6F;
  --color-text-inverse: #FFFFFF;
  --color-text-inverse-muted: rgb(255 255 255 / 70%);
  --color-border: #E7E2E3;
  --color-border-strong: #CFC9CA;
  --color-action: #FED719;
  --color-action-foreground: #201E1F;
  --color-action-secondary: #363233;
  --color-action-secondary-foreground: #FFFFFF;
  --color-selected: #FED719;
  --color-focus: #735F00;
  --color-focus-inverse: #FED719;
  --color-disabled-background: #F6F4F1;
  --color-disabled-foreground: #736D6F;
  --color-success: #237A3B;
  --color-success-surface: #E8F5EC;
  --color-error: #B42334;
  --color-error-surface: #FCEBEC;
  --color-info: #1D5F91;
  --color-info-surface: #EAF3FA;
  --color-warning: #5F4700;
  --color-warning-surface: #FFF1B8;
  --font-family: Onest, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-size-display: clamp(2.625rem, 7vw, 5.5rem);
  --font-size-page-title: clamp(2.25rem, 4.5vw, 4rem);
  --font-size-section-title: clamp(1.875rem, 3.5vw, 3.25rem);
  --font-size-card-title: 1.125rem;
  --font-size-lead: clamp(1.125rem, 1.4vw, 1.375rem);
  --font-size-body: 1rem;
  --font-size-body-lg: 1.125rem;
  --font-size-label: 0.9375rem;
  --font-size-caption: 0.875rem;
  --font-weight-body: 400;
  --font-weight-label: 600;
  --font-weight-heading: 700;
  --font-weight-display: 800;
  --font-line-height-display: 0.96;
  --font-line-height-heading: 1.08;
  --font-line-height-body: 1.6;
  --font-tracking-display: -0.04em;
  --font-tracking-heading: -0.025em;
  --font-tracking-label: 0.06em;
  --space-page-x-mobile: 1rem;
  --space-page-x-tablet: 1.5rem;
  --space-page-x-desktop: 2rem;
  --space-section-mobile: 4.5rem;
  --space-section-desktop: 7.5rem;
  --space-component: 1rem;
  --space-component-compact: 0.75rem;
  --space-cluster: 0.5rem;
  --layout-container: 82.5rem;
  --layout-content: 47.5rem;
  --layout-prose: 65ch;
  --layout-form: 43.75rem;
  --layout-summary: 24.375rem;
  --layout-grid-columns-mobile: 4;
  --layout-grid-columns-tablet: 6;
  --layout-grid-columns-desktop: 12;
  --layout-grid-gap-mobile: 0.75rem;
  --layout-grid-gap-tablet: 1.25rem;
  --layout-grid-gap-desktop: 1.5rem;
  --focus-width: 3px;
  --focus-offset: 0.25rem;
  --focus-color: #735F00;
  --focus-color-inverse: #FED719;
  --motion-duration-fast: 180ms;
  --motion-duration-normal: 200ms;
  --motion-duration-slow: 300ms;
  --motion-duration-reduced: 1ms;
  --motion-easing-standard: ease-in-out;
  --motion-easing-enter: ease-out;
  --interactive-min-size: 2.75rem;
  --interactive-comfortable-size: 3.375rem;
  --interactive-disabled-opacity: 0.6;
}

/* === COMPONENTS === */
:root {
  --announcement-background: #201E1F;
  --announcement-foreground: #FFFFFF;
  --announcement-padding-x: 1rem;
  --announcement-padding-y: 0.375rem;
  --announcement-font-size: 0.875rem;
  --announcement-z: 50;
  --header-background: rgb(255 255 255 / 92%);
  --header-border: rgb(54 50 51 / 8%);
  --header-height-mobile: 4.375rem;
  --header-height-desktop: 5.125rem;
  --header-z: 40;
  --hero-background: #FED719;
  --hero-foreground: #363233;
  --hero-padding-top-mobile: 3.5rem;
  --hero-padding-bottom-mobile: 1.75rem;
  --hero-padding-block-desktop: 4rem;
  --button-height-compact: 2.75rem;
  --button-height-default: 3.375rem;
  --button-height-checkout: 3.625rem;
  --button-padding-x: 1.5rem;
  --button-gap: 0.5rem;
  --button-radius: 9999px;
  --button-primary-background: #FED719;
  --button-primary-foreground: #201E1F;
  --button-secondary-background: #363233;
  --button-secondary-foreground: #FFFFFF;
  --button-shadow-hover: 0 12px 28px rgb(54 50 51 / 14%);
  --filter-control-height: 2.75rem;
  --filter-radius: 0.625rem;
  --filter-gap: 0.75rem;
  --filter-border: #CFC9CA;
  --product-grid-gap-mobile: 0.75rem;
  --product-grid-gap-tablet: 1.25rem;
  --product-grid-gap-desktop: 1.5rem;
  --product-grid-columns-mobile: 2;
  --product-grid-columns-tablet: 3;
  --product-grid-columns-desktop: 4;
  --product-card-background: #FFFFFF;
  --product-card-image-background: #F6F4F1;
  --product-card-image-radius: 0.875rem;
  --product-card-gap: 0.75rem;
  --product-card-title-size: 1.125rem;
  --product-card-border: #E7E2E3;
  --swatch-target-size: 2.75rem;
  --swatch-visual-size: 1.75rem;
  --swatch-radius: 9999px;
  --swatch-border: #CFC9CA;
  --swatch-selected-shadow: 0 0 0 7px rgb(254 215 25 / 20%);
  --variation-min-height: 2.75rem;
  --variation-gap: 0.5rem;
  --variation-radius: 0.875rem;
  --variation-selected-border: #FED719;
  --price-primary-size: 1.875rem;
  --price-secondary-size: 0.9375rem;
  --price-weight: 900;
  --price-personal-background: #FFF6AD;
  --stock-padding-x: 0.625rem;
  --stock-padding-y: 0.25rem;
  --stock-radius: 9999px;
  --stock-font-size: 0.875rem;
  --quantity-target-size: 2.75rem;
  --quantity-radius: 0.625rem;
  --quantity-border: #CFC9CA;
  --cart-item-image-size: 4.5rem;
  --cart-item-image-radius: 0.5rem;
  --cart-item-gap: 1rem;
  --cart-item-border: #E7E2E3;
  --delivery-control-height: 2.875rem;
  --delivery-gap: 0.5rem;
  --delivery-radius: 9999px;
  --delivery-panel-radius: 1.375rem;
  --delivery-panel-background: #F6F4F1;
  --notice-padding-x: 1.25rem;
  --notice-padding-y: 1rem;
  --notice-radius: 0.875rem;
  --notice-accent-width: 3px;
  --heavy-order-background: #FFF1B8;
  --heavy-order-foreground: #5F4700;
  --heavy-order-radius: 1.375rem;
  --heavy-order-padding: 1.25rem;
  --loyalty-background: #363233;
  --loyalty-foreground: #FFFFFF;
  --loyalty-accent: #FED719;
  --loyalty-radius: 1.375rem;
  --loyalty-gap: 0.5rem;
  --input-min-height: 2.75rem;
  --input-background: #FFFFFF;
  --input-foreground: #363233;
  --input-border: #CFC9CA;
  --input-radius: 0.625rem;
  --input-padding-x: 0.75rem;
  --input-padding-y: 0.5rem;
  --checkout-summary-background: #FFFFFF;
  --checkout-summary-radius: 1.375rem;
  --checkout-summary-padding: 1.25rem;
  --checkout-summary-shadow: 0 24px 65px rgb(54 50 51 / 10%);
  --checkout-summary-max-width: 24.375rem;
  --empty-state-background: #F6F4F1;
  --empty-state-border: #CFC9CA;
  --empty-state-radius: 1.375rem;
  --empty-state-padding: 2.5rem;
  --empty-state-min-height: 22.5rem;
  --state-disabled-opacity: 0.6;
  --state-loading-background: #F6F4F1;
  --state-error-background: #FCEBEC;
  --state-error-foreground: #B42334;
  --state-success-background: #E8F5EC;
  --state-success-foreground: #237A3B;
  --state-unavailable-background: #F6F4F1;
  --state-unavailable-foreground: #736D6F;
}
