/* Searchary design tokens — shared across all pages */

:root {
  /* Grayscale palette: #FFFFFF · #F7F7F7 · #EFEFEF · #D4D4D4 · #BDBDBD · #727272 · #636363 · #252525 */
  --bg: #F7F7F7;
  --surface: #FFFFFF;
  --ink: #252525;
  --ink-2: #636363;
  --muted: #727272;
  --line: #D4D4D4;
  --line-2: #BDBDBD;
  --tint: #EFEFEF;
  --error: #C5392E;
  --success: #4CAF50;
  --focus-ring: 0 0 0 3px color-mix(in srgb, var(--ink) 20%, transparent);
  --focus-ring-tight: 0 0 0 2px color-mix(in srgb, var(--ink) 28%, transparent);
  --shadow-card: none;
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-display: var(--font-sans);
  --font-logo: var(--font-sans);
  --type-hero-size: clamp(36px, 5vw, 48px);
  --type-title-size: clamp(32px, 4.5vw, 44px);
  --type-card-title-size: 24px;
  --type-display-weight: 600;
  --type-card-weight: 400;
  --type-tight-tracking: -0.025em;
  --type-card-tracking: -0.015em;

  /* 8px spacing scale */
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-5: 48px;
  --space-6: 64px;

  --site-header-height: 72px;

  /* Shop grid — overridden at breakpoints in shop.css */
  --shop-grid-cols: 4;
  --shop-grid-gap: var(--space-3);
  --shop-font-ui: var(--font-sans);

  /* Motion */
  --motion-fast: 120ms;
  --motion-medium: 150ms;
  --motion-normal: 200ms;
  --motion-slow: 320ms;
  --motion-ease: cubic-bezier(0.22, 1, 0.36, 1);

  /* Status badges */
  --badge-neutral-bg: #EFEFEF;
  --badge-neutral-border: #D4D4D4;
  --badge-neutral-text: #727272;
  --badge-neutral-dot: #727272;
  --badge-live-bg: #EDFCF3;
  --badge-live-border: #BBF7D0;
  --badge-live-text: #166534;
  --badge-live-dot: #22C55E;
  --badge-flagged-bg: #FFF8ED;
  --badge-flagged-border: #FCD9A6;
  --badge-flagged-text: #9A4A08;
  --badge-flagged-dot: #F59E0B;
  --badge-hidden-bg: #FFF1F2;
  --badge-hidden-border: #FECDD3;
  --badge-hidden-text: #BE123C;
  --badge-hidden-dot: #F43F5E;
  --badge-info-bg: #EFF6FF;
  --badge-info-border: #BFDBFE;
  --badge-info-text: #1D4ED8;
  --badge-info-dot: #3B82F6;
}
