/* Generated from ../../../DesignSystem.html. */
:root {
    --ck-font-sans: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --ck-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;

    /* Primitive spacing, shape, typography, motion, and layout tokens. */
    --ck-space-1: 4px;
    --ck-space-2: 8px;
    --ck-space-3: 12px;
    --ck-space-4: 16px;
    --ck-space-5: 20px;
    --ck-space-6: 24px;
    --ck-space-8: 32px;
    --ck-space-10: 40px;
    --ck-space-12: 48px;
    --ck-space-16: 64px;
    --ck-space-20: 80px;

    --ck-radius-chip: 6px;
    --ck-radius-control: 8px;
    --ck-radius-card: 10px;
    --ck-radius-panel: 12px;
    --ck-radius-modal: 14px;
    --ck-radius-sheet: 18px;
    --ck-radius-pill: 999px;

    --ck-type-display: 2.25rem;
    --ck-type-page: 1.75rem;
    --ck-type-section: 1.375rem;
    --ck-type-card: 1.0625rem;
    --ck-type-body: 1rem;
    --ck-type-compact: .875rem;
    --ck-type-label: .875rem;
    --ck-type-meta: .8125rem;
    --ck-type-button: .9375rem;
    --ck-type-kpi: 2.25rem;
    --ck-type-plate: 1.625rem;

    --ck-leading-display: 1.15;
    --ck-leading-page: 1.2;
    --ck-leading-section: 1.3;
    --ck-leading-card: 1.35;
    --ck-leading-body: 1.5;
    --ck-leading-compact: 1.45;
    --ck-leading-label: 1.35;
    --ck-leading-meta: 1.4;

    --ck-weight-regular: 400;
    --ck-weight-meta: 450;
    --ck-weight-medium: 550;
    --ck-weight-card: 600;
    --ck-weight-semibold: 620;
    --ck-weight-title: 650;
    --ck-weight-bold: 700;

    --ck-icon-xs: 16px;
    --ck-icon-sm: 20px;
    --ck-icon-md: 24px;
    --ck-icon-lg: 32px;
    --ck-target-pointer: 36px;
    --ck-target-compact: 44px;
    --ck-target-touch: 48px;
    --ck-target-workshop: 56px;
    --ck-control-min: 44px;
    --ck-control-comfortable: 48px;
    --ck-focus-width: 2px;
    --ck-focus-offset: 2px;
    --ck-border-width: 1px;
    --ck-duration-instant: 80ms;
    --ck-duration-fast: 120ms;
    --ck-duration-standard: 180ms;
    --ck-duration-deliberate: 320ms;
    --ck-ease-enter: cubic-bezier(.2, .8, .2, 1);
    --ck-ease-exit: cubic-bezier(.4, 0, 1, 1);
    --ck-ease-standard: cubic-bezier(.2, 0, 0, 1);

    --ck-layout-reading: 75ch;
    --ck-layout-guidance: 65ch;
    --ck-layout-form: 720px;
    --ck-layout-content: 1440px;
    --ck-layout-wide: 1760px;
    --ck-layout-gutter: clamp(16px, 3vw, 48px);

    --ck-z-base: 0;
    --ck-z-dropdown: 10;
    --ck-z-sticky: 20;
    --ck-z-nav: 30;
    --ck-z-sheet: 60;
    --ck-z-modal: 80;
    --ck-z-toast: 100;

    /* Component tokens. Shared components consume these aliases, never theme values. */
    --ck-button-primary-bg: var(--ck-action-primary);
    --ck-button-primary-bg-hover: var(--ck-action-primary-hover);
    --ck-button-primary-bg-pressed: var(--ck-action-primary-pressed);
    --ck-button-primary-text: var(--ck-action-primary-text);
    --ck-button-secondary-bg: var(--ck-surface-2);
    --ck-button-secondary-bg-hover: var(--ck-surface-hover);
    --ck-button-secondary-text: var(--ck-text-primary);
    --ck-button-secondary-border: var(--ck-border-control);
    --ck-button-danger-bg: var(--ck-danger-solid);
    --ck-button-danger-text: var(--ck-danger-solid-text);
    --ck-button-ghost-bg-hover: var(--ck-surface-hover);
    --ck-button-disabled-bg: var(--ck-action-disabled);
    --ck-button-disabled-text: var(--ck-action-disabled-text);
    --ck-field-bg: var(--ck-surface-1);
    --ck-field-bg-readonly: var(--ck-surface-inset);
    --ck-field-bg-disabled: var(--ck-surface-disabled);
    --ck-field-text: var(--ck-text-primary);
    --ck-field-placeholder: var(--ck-text-secondary);
    --ck-field-border: var(--ck-border-control);
    --ck-field-border-focus: var(--ck-action-primary);
    --ck-field-border-error: var(--ck-danger-border);
    --ck-field-error-bg: var(--ck-danger-bg);
    --ck-choice-selected-bg: var(--ck-surface-selected);
    --ck-choice-selected-border: var(--ck-action-primary);
    --ck-choice-mark: var(--ck-action-primary);
    --ck-status-bg: var(--ck-surface-2);
    --ck-status-text: var(--ck-text-secondary);
    --ck-status-border: var(--ck-border-default);
    --ck-kpi-bg: var(--ck-surface-1);
    --ck-kpi-border: var(--ck-border-subtle);
    --ck-progress-track: var(--ck-surface-inset);
    --ck-progress-value: var(--ck-action-primary);
    --ck-alert-info-bg: var(--ck-info-bg);
    --ck-alert-info-border: var(--ck-info-border);
    --ck-alert-info-text: var(--ck-info-text);
    --ck-empty-bg: var(--ck-surface-inset);
    --ck-empty-border: var(--ck-border-default);
    --ck-dialog-bg: var(--ck-surface-3);
    --ck-dialog-border: var(--ck-border-default);
    --ck-dialog-backdrop: var(--ck-backdrop);
    --ck-sheet-bg: var(--ck-surface-3);
    --ck-tooltip-bg: var(--ck-surface-3);
    --ck-tooltip-text: var(--ck-text-primary);
    --ck-table-header-bg: var(--ck-surface-2);
    --ck-table-row-bg: var(--ck-surface-1);
    --ck-table-row-hover-bg: var(--ck-surface-hover);
    --ck-table-row-selected-bg: var(--ck-surface-selected);
    --ck-table-row-error-bg: var(--ck-danger-bg);
    --ck-table-row-expanded-bg: var(--ck-surface-inset);
    --ck-table-divider: var(--ck-border-subtle);
    --ck-upload-bg: var(--ck-surface-inset);
    --ck-upload-border: var(--ck-border-control);
    --ck-upload-active-bg: var(--ck-surface-selected);
    --ck-thumbnail-bg: var(--ck-surface-inset);
    --ck-skeleton-start: var(--ck-surface-2);
    --ck-skeleton-end: var(--ck-surface-3);
    --ck-modal-bg: var(--ck-dialog-bg);
    --ck-toast-bg: var(--ck-surface-3);
    --ck-toast-text: var(--ck-text-primary);
  }

  :root,
  html[data-theme="obsidian"],
  [data-theme="obsidian"] {
    color-scheme: dark;
    --ck-bg-app: #080d12;
    --ck-bg-grid: #14202a;
    --ck-canvas: #0d141b;
    --ck-nav: #0a1117;
    --ck-header: #0e171f;
    --ck-surface-1: #111a22;
    --ck-surface-2: #16212b;
    --ck-surface-3: #1c2934;
    --ck-surface-inset: #0a1118;
    --ck-surface-hover: #1b2a36;
    --ck-surface-selected: #102d4a;
    --ck-surface-disabled: #151b20;
    --ck-border-subtle: #22313c;
    --ck-border-default: #334553;
    --ck-border-control: #506878;
    --ck-divider-strong: #5e7787;
    --ck-text-primary: #f2f6f8;
    --ck-text-secondary: #c2cdd4;
    --ck-text-muted: #8ea0ac;
    --ck-text-disabled: #66727a;
    --ck-text-inverse: #071018;
    --ck-link: #78b7ff;
    --ck-focus: #8cc7ff;
    --ck-selection: #174b78;
    --ck-backdrop: rgba(2, 6, 10, .72);

    --ck-action-primary: #2f89ff;
    --ck-action-primary-hover: #5aa3ff;
    --ck-action-primary-pressed: #1975e6;
    --ck-action-primary-text: #071018;
    --ck-action-disabled: #233544;
    --ck-action-disabled-text: #72818c;
    --ck-product-buyerfinder-accent: #a993ff;

    --ck-success-solid: #18a86b;
    --ck-success-solid-text: #04140e;
    --ck-success-bg: #0e2a20;
    --ck-success-border: #2d8a63;
    --ck-success-text: #70e1b2;
    --ck-warning-solid: #f2b84b;
    --ck-warning-solid-text: #211500;
    --ck-warning-bg: #2d2411;
    --ck-warning-border: #a57927;
    --ck-warning-text: #ffd782;
    --ck-danger-solid: #e05863;
    --ck-danger-solid-text: #18070a;
    --ck-danger-bg: #32171b;
    --ck-danger-border: #a94b53;
    --ck-danger-text: #ff9da5;
    --ck-info-solid: #398bff;
    --ck-info-solid-text: #051426;
    --ck-info-bg: #102a49;
    --ck-info-border: #347acc;
    --ck-info-text: #8ec1ff;
    --ck-offline-solid: #718592;
    --ck-offline-solid-text: #071015;
    --ck-offline-bg: #1c252b;
    --ck-offline-border: #61747f;
    --ck-offline-text: #c3ced4;
    --ck-pending-solid: #9b7bff;
    --ck-pending-solid-text: #120b24;
    --ck-pending-bg: #241d3d;
    --ck-pending-border: #7259c7;
    --ck-pending-text: #c3b1ff;
    --ck-accepted-solid: #22b8a7;
    --ck-accepted-solid-text: #041613;
    --ck-accepted-bg: #0c2b28;
    --ck-accepted-border: #238b80;
    --ck-accepted-text: #74e4d5;
    --ck-retake-solid: #f28a36;
    --ck-retake-solid-text: #201004;
    --ck-retake-bg: #352012;
    --ck-retake-border: #b96223;
    --ck-retake-text: #ffc18a;

    --ck-shadow-raised: 0 8px 24px rgba(0, 0, 0, .24);
    --ck-shadow-floating: 0 18px 48px rgba(0, 0, 0, .32);
    --ck-dialog-bg: var(--ck-surface-3);
    --ck-dialog-border: var(--ck-border-control);
    --ck-sheet-bg: var(--ck-surface-3);
  }

  html[data-theme="arctic"],
  [data-theme="arctic"] {
    color-scheme: light;
    --ck-bg-app: #f3f7fa;
    --ck-bg-grid: #dce6ed;
    --ck-canvas: #fcfdfe;
    --ck-nav: #eef3f6;
    --ck-header: #f8fafc;
    --ck-surface-1: #ffffff;
    --ck-surface-2: #f4f8fa;
    --ck-surface-3: #eaf1f5;
    --ck-surface-inset: #e8eef2;
    --ck-surface-hover: #e8f2fb;
    --ck-surface-selected: #ddeeff;
    --ck-surface-disabled: #eef1f3;
    --ck-border-subtle: #d7e1e7;
    --ck-border-default: #aebec9;
    --ck-border-control: #7c919f;
    --ck-divider-strong: #627988;
    --ck-text-primary: #11212d;
    --ck-text-secondary: #3b4f5d;
    --ck-text-muted: #607481;
    --ck-text-disabled: #8998a2;
    --ck-text-inverse: #f7fbfd;
    --ck-link: #005fcc;
    --ck-focus: #005fcc;
    --ck-selection: #c9e2ff;
    --ck-backdrop: rgba(18, 32, 42, .48);

    --ck-action-primary: #0067d9;
    --ck-action-primary-hover: #0057bb;
    --ck-action-primary-pressed: #00499d;
    --ck-action-primary-text: #ffffff;
    --ck-action-disabled: #d4dde3;
    --ck-action-disabled-text: #71818c;
    --ck-product-buyerfinder-accent: #6548c8;

    --ck-success-solid: #0a7a4b;
    --ck-success-solid-text: #ffffff;
    --ck-success-bg: #e3f6ed;
    --ck-success-border: #68af8d;
    --ck-success-text: #075c39;
    --ck-warning-solid: #f0b429;
    --ck-warning-solid-text: #211500;
    --ck-warning-bg: #fff2d5;
    --ck-warning-border: #d19b30;
    --ck-warning-text: #6f3e00;
    --ck-danger-solid: #c93643;
    --ck-danger-solid-text: #ffffff;
    --ck-danger-bg: #fce8ea;
    --ck-danger-border: #d78088;
    --ck-danger-text: #9d202e;
    --ck-info-solid: #006bd6;
    --ck-info-solid-text: #ffffff;
    --ck-info-bg: #e5f1ff;
    --ck-info-border: #6aa5e4;
    --ck-info-text: #004f9e;
    --ck-offline-solid: #536674;
    --ck-offline-solid-text: #ffffff;
    --ck-offline-bg: #e8edf0;
    --ck-offline-border: #94a3ac;
    --ck-offline-text: #40515d;
    --ck-pending-solid: #6e52c7;
    --ck-pending-solid-text: #ffffff;
    --ck-pending-bg: #efeaff;
    --ck-pending-border: #9b8ad8;
    --ck-pending-text: #5037a3;
    --ck-accepted-solid: #00796f;
    --ck-accepted-solid-text: #ffffff;
    --ck-accepted-bg: #e0f6f3;
    --ck-accepted-border: #72b8b0;
    --ck-accepted-text: #005e57;
    --ck-retake-solid: #c76517;
    --ck-retake-solid-text: #ffffff;
    --ck-retake-bg: #fff0e2;
    --ck-retake-border: #d99962;
    --ck-retake-text: #7a3d00;

    --ck-shadow-raised: 0 8px 24px rgba(15, 23, 42, .08);
    --ck-shadow-floating: 0 18px 48px rgba(15, 23, 42, .14);
    --ck-dialog-bg: var(--ck-surface-1);
    --ck-dialog-border: var(--ck-border-default);
    --ck-sheet-bg: var(--ck-surface-1);
  }

  /* Rebind component aliases at scoped theme boundaries used by the gallery. */
  :where(:root, [data-theme]) {
    --ck-button-primary-bg: var(--ck-action-primary);
    --ck-button-primary-bg-hover: var(--ck-action-primary-hover);
    --ck-button-primary-bg-pressed: var(--ck-action-primary-pressed);
    --ck-button-primary-text: var(--ck-action-primary-text);
    --ck-button-secondary-bg: var(--ck-surface-2);
    --ck-button-secondary-bg-hover: var(--ck-surface-hover);
    --ck-button-secondary-text: var(--ck-text-primary);
    --ck-button-secondary-border: var(--ck-border-control);
    --ck-button-danger-bg: var(--ck-danger-solid);
    --ck-button-danger-text: var(--ck-danger-solid-text);
    --ck-button-ghost-bg-hover: var(--ck-surface-hover);
    --ck-button-disabled-bg: var(--ck-action-disabled);
    --ck-button-disabled-text: var(--ck-action-disabled-text);
    --ck-field-bg: var(--ck-surface-1);
    --ck-field-bg-readonly: var(--ck-surface-inset);
    --ck-field-bg-disabled: var(--ck-surface-disabled);
    --ck-field-text: var(--ck-text-primary);
    --ck-field-placeholder: var(--ck-text-secondary);
    --ck-field-border: var(--ck-border-control);
    --ck-field-border-focus: var(--ck-action-primary);
    --ck-field-border-error: var(--ck-danger-border);
    --ck-field-error-bg: var(--ck-danger-bg);
    --ck-choice-selected-bg: var(--ck-surface-selected);
    --ck-choice-selected-border: var(--ck-action-primary);
    --ck-choice-mark: var(--ck-action-primary);
    --ck-status-bg: var(--ck-surface-2);
    --ck-status-text: var(--ck-text-secondary);
    --ck-status-border: var(--ck-border-default);
    --ck-kpi-bg: var(--ck-surface-1);
    --ck-kpi-border: var(--ck-border-subtle);
    --ck-progress-track: var(--ck-surface-inset);
    --ck-progress-value: var(--ck-action-primary);
    --ck-alert-info-bg: var(--ck-info-bg);
    --ck-alert-info-border: var(--ck-info-border);
    --ck-alert-info-text: var(--ck-info-text);
    --ck-empty-bg: var(--ck-surface-inset);
    --ck-empty-border: var(--ck-border-default);
    --ck-tooltip-bg: var(--ck-surface-3);
    --ck-tooltip-text: var(--ck-text-primary);
    --ck-table-header-bg: var(--ck-surface-2);
    --ck-table-row-bg: var(--ck-surface-1);
    --ck-table-row-hover-bg: var(--ck-surface-hover);
    --ck-table-row-selected-bg: var(--ck-surface-selected);
    --ck-table-row-error-bg: var(--ck-danger-bg);
    --ck-table-row-expanded-bg: var(--ck-surface-inset);
    --ck-table-divider: var(--ck-border-subtle);
    --ck-upload-bg: var(--ck-surface-inset);
    --ck-upload-border: var(--ck-border-control);
    --ck-upload-active-bg: var(--ck-surface-selected);
    --ck-thumbnail-bg: var(--ck-surface-inset);
    --ck-skeleton-start: var(--ck-surface-2);
    --ck-skeleton-end: var(--ck-surface-3);
    --ck-modal-bg: var(--ck-dialog-bg);
    --ck-toast-bg: var(--ck-surface-3);
    --ck-toast-text: var(--ck-text-primary);
  }

  html[data-contrast="workshop"] {
    --ck-control-min: 52px;
    --ck-control-comfortable: 56px;
    --ck-border-width: 2px;
    --ck-focus-width: 3px;
    --ck-type-body: 1.0625rem;
    --ck-type-compact: 1rem;
    --ck-type-label: 1rem;
    --ck-type-meta: .875rem;
    --ck-bg-grid: transparent;
    --ck-border-subtle: var(--ck-border-default);
    --ck-field-border: var(--ck-divider-strong);
    --ck-upload-border: var(--ck-divider-strong);
    --ck-duration-instant: 40ms;
    --ck-duration-fast: 80ms;
    --ck-duration-standard: 100ms;
    --ck-duration-deliberate: 100ms;
  }

  ::selection {
    color: var(--ck-text-primary);
    background: var(--ck-selection);
  }

  :where(button, a, input, select, textarea, [tabindex]):focus-visible {
    outline: var(--ck-focus-width) solid var(--ck-focus);
    outline-offset: var(--ck-focus-offset);
  }

  :where(button, input, select, textarea) {
    min-height: var(--ck-control-min);
  }

  :where(.kpi-value, .metric-value, .summary-tile strong, .qa-kpi strong, .ops-kpi strong) {
    font-variant-numeric: tabular-nums;
  }

  @media (max-width: 599px) {
    :root {
      --ck-type-display: 1.75rem;
      --ck-type-page: 1.5rem;
      --ck-type-section: 1.25rem;
      --ck-type-kpi: 2rem;
      --ck-type-plate: 1.5rem;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    :root {
      --ck-duration-instant: 0ms;
      --ck-duration-fast: 80ms;
      --ck-duration-standard: 100ms;
      --ck-duration-deliberate: 100ms;
    }

    *,
    *::before,
    *::after {
      scroll-behavior: auto !important;
      animation-duration: .01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: .01ms !important;
    }
  }