/* GENERATED FILE — DO NOT EDIT.
 * Source:    packages/design-tokens/src/pluckit.tokens.v2-1.json
 * Generator: packages/design-tokens/scripts/build-tokens.mjs
 * Tokens:    PluckIt Design System v2.1.0 (2026-08-31)
 *
 * Theming contract (docs/03-design-system §3.1): light is the base definition on
 * :root. Dark overrides only the semantic layer, under both an explicit
 * [data-theme="dark"] and the prefers-color-scheme default. Every color has a
 * definition on bare :root so no token is only defined inside a media query.
 *
 * The explicit theme scopes are NOT anchored to :root. A theme attribute on any
 * element re-declares the semantic layer for that subtree, so a Storybook story
 * or a docs page can render light and dark side by side on one screen. Anchoring
 * these to :root made every nested "dark" example silently render light.
 */

[data-ds='v2-1'] {
  /* --- theme-independent primitives and component tokens --- */
  --pk-space-0: 0px;
  --pk-space-1: 4px;
  --pk-space-2: 8px;
  --pk-space-3: 12px;
  --pk-space-4: 16px;
  --pk-space-5: 20px;
  --pk-space-6: 24px;
  --pk-space-8: 32px;
  --pk-space-10: 40px;
  --pk-space-12: 48px;
  --pk-space-16: 64px;
  --pk-space-20: 80px;
  --pk-space-half: 2px;
  --pk-radius-none: 0px;
  --pk-radius-xs: 4px;
  --pk-radius-sm: 8px;
  --pk-radius-md: 12px;
  --pk-radius-lg: 16px;
  --pk-radius-xl: 20px;
  --pk-radius-2xl: 24px;
  --pk-radius-full: 999px;
  --pk-radius-3xl: 28px;
  --pk-duration-instant: 80ms;
  --pk-duration-fast: 120ms;
  --pk-duration-standard: 180ms;
  --pk-duration-moderate: 240ms;
  --pk-duration-sheet: 280ms;
  --pk-duration-slow: 320ms;
  --pk-duration-celebration: 420ms;
  --pk-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --pk-easing-enter: cubic-bezier(0, 0, 0, 1);
  --pk-easing-exit: cubic-bezier(0.3, 0, 1, 1);
  --pk-easing-emphasized: cubic-bezier(0.2, 0.8, 0.2, 1);
  --pk-font-family-display: Bricolage Grotesque, Inter, system-ui, sans-serif;
  --pk-font-family-body: Inter, system-ui, sans-serif;
  --pk-font-family-native: system-ui, sans-serif;
  --pk-font-family-mono: JetBrains Mono, Menlo, ui-monospace, SFMono-Regular, Monaco, Consolas, monospace;
  --pk-font-weight-regular: 400;
  --pk-font-weight-medium: 500;
  --pk-font-weight-semibold: 600;
  --pk-font-weight-bold: 700;
  --pk-blur-regular: 24px;
  --pk-blur-heavy: 40px;
  --pk-opacity-disabled: 0.5;
  --pk-opacity-dim: 0.65;
  --pk-opacity-muted: 0.85;
  --pk-opacity-texture: 0.1;
  --pk-opacity-texture-quiet: 0.08;
  --pk-z-content: 1;
  --pk-z-chrome: 2;
  --pk-z-floating: 3;
  --pk-z-overlay: 4;
  --pk-z-toast: 5;
  --pk-z-modal: 6;
  --pk-border-width-control: 1.5px;
  --pk-border-width-hairline: 1px;
  --pk-border-width-icon: 1.8px;
  --pk-size-icon-sm: 16px;
  --pk-size-icon-md: 20px;
  --pk-size-icon-lg: 24px;
  --pk-component-button-height-small: 32px;
  --pk-component-button-height-medium: 40px;
  --pk-component-button-height-large: 48px;
  --pk-component-button-height-pluck: 52px;
  --pk-component-button-radius: 12px;
  --pk-component-button-primary-light-background: #EC562E;
  --pk-component-button-primary-light-foreground: #13181B;
  --pk-component-button-primary-dark-background: #EC562E;
  --pk-component-button-primary-dark-foreground: #13181B;
  --pk-component-card-radius: 24px;
  --pk-component-card-padding: 16px;
  --pk-component-card-gap: 12px;
  --pk-component-item-row-min-height: 72px;
  --pk-component-item-row-padding-inline: 16px;
  --pk-component-item-row-padding-block: 12px;
  --pk-component-item-row-thumbnail: 48px;
  --pk-component-item-row-gap: 12px;
  --pk-component-item-tile-min-width: 156px;
  --pk-component-item-tile-gutter: 16px;
  --pk-component-item-tile-padding: 8px;
  --pk-component-item-tile-gap: 4px;
  --pk-component-navigation-mobile-bar-height: 64px;
  --pk-component-navigation-desktop-toolbar-height: 52px;
  --pk-component-navigation-desktop-sidebar-width: 240px;
  --pk-component-focus-ring-width: 2px;
  --pk-component-focus-ring-offset: 2px;
  --pk-component-focus-ring-light: #104A65;
  --pk-component-focus-ring-dark: #F4D47C;

  /* --- semantic: light (base) --- */
  --pk-color-bg-canvas: #FDF6E3;
  --pk-color-bg-surface: #FFFFFF;
  --pk-color-bg-subtle: #F1EFE6;
  --pk-color-bg-raised: #FFFFFF;
  --pk-color-bg-inverse: #13181B;
  --pk-color-text-primary: #13181B;
  --pk-color-text-secondary: #46565E;
  --pk-color-text-tertiary: #5B6A70;
  --pk-color-text-danger: #8D2F1D;
  --pk-color-text-inverse: #FDF6E3;
  --pk-color-text-brand: #9F351D;
  --pk-color-text-link: #104A65;
  --pk-color-border-subtle: #DED7C6;
  --pk-color-border-strong: #808F95;
  --pk-color-border-default: #B7C2C5;
  --pk-color-border-interactive: #104A65;
  --pk-color-border-focus: #104A65;
  --pk-color-action-primary-bg: #EC562E;
  --pk-color-action-primary-fg: #13181B;
  --pk-color-action-primary-hover: #F7663F;
  --pk-color-action-primary-pressed: #C94423;
  --pk-color-action-secondary-bg: #075056;
  --pk-color-action-secondary-fg: #FDF6E3;
  --pk-color-action-secondary-border: #075056;
  --pk-color-action-ghost-hover: #F9F8EF;
  --pk-color-selection-bg: #D7E8EB;
  --pk-color-selection-border: #075056;
  --pk-color-highlight-bg: #F4D47C;
  --pk-color-highlight-fg: #13181B;
  --pk-color-highlight-accent: #A3C0BD;
  --pk-color-status-success-bg: #DDEEE5;
  --pk-color-status-success-fg: #0B5F58;
  --pk-color-status-success-border: #8CBCA6;
  --pk-color-status-warning-bg: #FFF2C8;
  --pk-color-status-warning-fg: #78461A;
  --pk-color-status-warning-border: #F4D47C;
  --pk-color-status-error-bg: #F9DFD9;
  --pk-color-status-error-fg: #8D2F1D;
  --pk-color-status-error-border: #E9907D;
  --pk-color-status-info-bg: #D7E8EB;
  --pk-color-status-info-fg: #104A65;
  --pk-color-status-info-border: #8EB9C6;
  --pk-color-status-offline-bg: #F1EFE6;
  --pk-color-status-offline-fg: #233038;
  --pk-color-status-offline-border: #B7C2C5;
  --pk-color-glass-tint: #FDF6E3B3;
  --pk-color-glass-tint-strong: #FDF6E3D9;
  --pk-color-glass-stroke: #FFFFFFB3;
  --pk-color-glass-highlight: #FFFFFFE6;
  --pk-color-glass-scrim: #13181B66;
  --pk-color-ai-gradient-start: #EC562E;
  --pk-color-ai-gradient-end: #F4D47C;
  --pk-elevation-1: 0px 1px 2px 0px #0D0B1214;
  --pk-elevation-2: 0px 8px 24px 0px #0D0B1224;
  --pk-elevation-3: 0px 18px 48px 0px #0D0B1233;
}

@media (prefers-color-scheme: dark) {
  [data-ds='v2-1']:not([data-theme='light']) {
    --pk-color-bg-canvas: #13181B;
    --pk-color-bg-surface: #233038;
    --pk-color-bg-subtle: #1B292F;
    --pk-color-bg-raised: #233038;
    --pk-color-bg-inverse: #FDF6E3;
    --pk-color-text-primary: #FDF6E3;
    --pk-color-text-secondary: #B7C2C5;
    --pk-color-text-tertiary: #8D9BA0;
    --pk-color-text-danger: #E9907D;
    --pk-color-text-inverse: #13181B;
    --pk-color-text-brand: #FF7A54;
    --pk-color-text-link: #A3C0BD;
    --pk-color-border-subtle: #344149;
    --pk-color-border-strong: #66767D;
    --pk-color-border-default: #66767D;
    --pk-color-border-interactive: #A3C0BD;
    --pk-color-border-focus: #F4D47C;
    --pk-color-action-primary-bg: #EC562E;
    --pk-color-action-primary-fg: #13181B;
    --pk-color-action-primary-hover: #F7663F;
    --pk-color-action-primary-pressed: #FF7A54;
    --pk-color-action-secondary-bg: #075056;
    --pk-color-action-secondary-fg: #FDF6E3;
    --pk-color-action-secondary-border: #A3C0BD;
    --pk-color-action-ghost-hover: #233038;
    --pk-color-selection-bg: #075056;
    --pk-color-selection-border: #A3C0BD;
    --pk-color-highlight-bg: #F4D47C;
    --pk-color-highlight-fg: #13181B;
    --pk-color-highlight-accent: #A3C0BD;
    --pk-color-status-success-bg: #0A4D48;
    --pk-color-status-success-fg: #DDEEE5;
    --pk-color-status-success-border: #8CBCA6;
    --pk-color-status-warning-bg: #653B1B;
    --pk-color-status-warning-fg: #FFF2C8;
    --pk-color-status-warning-border: #F4D47C;
    --pk-color-status-error-bg: #61271E;
    --pk-color-status-error-fg: #F9DFD9;
    --pk-color-status-error-border: #E9907D;
    --pk-color-status-info-bg: #113342;
    --pk-color-status-info-fg: #D7E8EB;
    --pk-color-status-info-border: #A3C0BD;
    --pk-color-status-offline-bg: #233038;
    --pk-color-status-offline-fg: #D3DBDD;
    --pk-color-status-offline-border: #66767D;
    --pk-color-glass-tint: #1B292FB3;
    --pk-color-glass-tint-strong: #13181BB3;
    --pk-color-glass-stroke: #FFFFFF1F;
    --pk-color-glass-highlight: #FFFFFF40;
    --pk-color-glass-scrim: #13181B8C;
    --pk-color-ai-gradient-start: #EC562E;
    --pk-color-ai-gradient-end: #F4D47C;
    --pk-elevation-1: 0px 1px 2px 0px #00000059;
    --pk-elevation-2: 0px 8px 24px 0px #00000073;
    --pk-elevation-3: 0px 18px 48px 0px #0000008C;
  }
}

/* An explicit light scope must be able to win back from a dark root or a dark
 * system preference, so light is re-declared here rather than relying on :root. */
[data-ds='v2-1'][data-theme='light'], [data-ds='v2-1'] [data-theme='light'] {
  --pk-color-bg-canvas: #FDF6E3;
  --pk-color-bg-surface: #FFFFFF;
  --pk-color-bg-subtle: #F1EFE6;
  --pk-color-bg-raised: #FFFFFF;
  --pk-color-bg-inverse: #13181B;
  --pk-color-text-primary: #13181B;
  --pk-color-text-secondary: #46565E;
  --pk-color-text-tertiary: #5B6A70;
  --pk-color-text-danger: #8D2F1D;
  --pk-color-text-inverse: #FDF6E3;
  --pk-color-text-brand: #9F351D;
  --pk-color-text-link: #104A65;
  --pk-color-border-subtle: #DED7C6;
  --pk-color-border-strong: #808F95;
  --pk-color-border-default: #B7C2C5;
  --pk-color-border-interactive: #104A65;
  --pk-color-border-focus: #104A65;
  --pk-color-action-primary-bg: #EC562E;
  --pk-color-action-primary-fg: #13181B;
  --pk-color-action-primary-hover: #F7663F;
  --pk-color-action-primary-pressed: #C94423;
  --pk-color-action-secondary-bg: #075056;
  --pk-color-action-secondary-fg: #FDF6E3;
  --pk-color-action-secondary-border: #075056;
  --pk-color-action-ghost-hover: #F9F8EF;
  --pk-color-selection-bg: #D7E8EB;
  --pk-color-selection-border: #075056;
  --pk-color-highlight-bg: #F4D47C;
  --pk-color-highlight-fg: #13181B;
  --pk-color-highlight-accent: #A3C0BD;
  --pk-color-status-success-bg: #DDEEE5;
  --pk-color-status-success-fg: #0B5F58;
  --pk-color-status-success-border: #8CBCA6;
  --pk-color-status-warning-bg: #FFF2C8;
  --pk-color-status-warning-fg: #78461A;
  --pk-color-status-warning-border: #F4D47C;
  --pk-color-status-error-bg: #F9DFD9;
  --pk-color-status-error-fg: #8D2F1D;
  --pk-color-status-error-border: #E9907D;
  --pk-color-status-info-bg: #D7E8EB;
  --pk-color-status-info-fg: #104A65;
  --pk-color-status-info-border: #8EB9C6;
  --pk-color-status-offline-bg: #F1EFE6;
  --pk-color-status-offline-fg: #233038;
  --pk-color-status-offline-border: #B7C2C5;
  --pk-color-glass-tint: #FDF6E3B3;
  --pk-color-glass-tint-strong: #FDF6E3D9;
  --pk-color-glass-stroke: #FFFFFFB3;
  --pk-color-glass-highlight: #FFFFFFE6;
  --pk-color-glass-scrim: #13181B66;
  --pk-color-ai-gradient-start: #EC562E;
  --pk-color-ai-gradient-end: #F4D47C;
  --pk-elevation-1: 0px 1px 2px 0px #0D0B1214;
  --pk-elevation-2: 0px 8px 24px 0px #0D0B1224;
  --pk-elevation-3: 0px 18px 48px 0px #0D0B1233;
}

[data-ds='v2-1'][data-theme='dark'], [data-ds='v2-1'] [data-theme='dark'] {
  --pk-color-bg-canvas: #13181B;
  --pk-color-bg-surface: #233038;
  --pk-color-bg-subtle: #1B292F;
  --pk-color-bg-raised: #233038;
  --pk-color-bg-inverse: #FDF6E3;
  --pk-color-text-primary: #FDF6E3;
  --pk-color-text-secondary: #B7C2C5;
  --pk-color-text-tertiary: #8D9BA0;
  --pk-color-text-danger: #E9907D;
  --pk-color-text-inverse: #13181B;
  --pk-color-text-brand: #FF7A54;
  --pk-color-text-link: #A3C0BD;
  --pk-color-border-subtle: #344149;
  --pk-color-border-strong: #66767D;
  --pk-color-border-default: #66767D;
  --pk-color-border-interactive: #A3C0BD;
  --pk-color-border-focus: #F4D47C;
  --pk-color-action-primary-bg: #EC562E;
  --pk-color-action-primary-fg: #13181B;
  --pk-color-action-primary-hover: #F7663F;
  --pk-color-action-primary-pressed: #FF7A54;
  --pk-color-action-secondary-bg: #075056;
  --pk-color-action-secondary-fg: #FDF6E3;
  --pk-color-action-secondary-border: #A3C0BD;
  --pk-color-action-ghost-hover: #233038;
  --pk-color-selection-bg: #075056;
  --pk-color-selection-border: #A3C0BD;
  --pk-color-highlight-bg: #F4D47C;
  --pk-color-highlight-fg: #13181B;
  --pk-color-highlight-accent: #A3C0BD;
  --pk-color-status-success-bg: #0A4D48;
  --pk-color-status-success-fg: #DDEEE5;
  --pk-color-status-success-border: #8CBCA6;
  --pk-color-status-warning-bg: #653B1B;
  --pk-color-status-warning-fg: #FFF2C8;
  --pk-color-status-warning-border: #F4D47C;
  --pk-color-status-error-bg: #61271E;
  --pk-color-status-error-fg: #F9DFD9;
  --pk-color-status-error-border: #E9907D;
  --pk-color-status-info-bg: #113342;
  --pk-color-status-info-fg: #D7E8EB;
  --pk-color-status-info-border: #A3C0BD;
  --pk-color-status-offline-bg: #233038;
  --pk-color-status-offline-fg: #D3DBDD;
  --pk-color-status-offline-border: #66767D;
  --pk-color-glass-tint: #1B292FB3;
  --pk-color-glass-tint-strong: #13181BB3;
  --pk-color-glass-stroke: #FFFFFF1F;
  --pk-color-glass-highlight: #FFFFFF40;
  --pk-color-glass-scrim: #13181B8C;
  --pk-color-ai-gradient-start: #EC562E;
  --pk-color-ai-gradient-end: #F4D47C;
  --pk-elevation-1: 0px 1px 2px 0px #00000059;
  --pk-elevation-2: 0px 8px 24px 0px #00000073;
  --pk-elevation-3: 0px 18px 48px 0px #0000008C;
}