/* ph_tokens.css — Policy Hub design tokens. Every color/spacing/type
   decision elsewhere in the app should reference one of these variables,
   never a raw hex value or px size. */

:root {
  /* Brand */
  --ph-ink: #1C2430;
  --ph-ink-2: #2A3444;
  --ph-gold: #A8823D;
  --ph-gold-tint: #F3ECDC;
  --ph-gold-text: #6B4F1D;

  /* Surfaces */
  --ph-bg: #F2F2EE;
  --ph-card: #FFFFFF;
  --ph-line: #E4E3DC;
  --ph-line-strong: #CFCEC5;

  /* Text */
  --ph-text: #1C2430;
  --ph-text-2: #6B7280;
  --ph-text-muted: #9CA3AF;
  --ph-text-inverse: #FFFFFF;

  /* Status (the signature status-stripe colors) */
  --ph-green: #2F7D52;
  --ph-green-tint: #E7F3EC;
  --ph-amber: #9A6B00;
  --ph-amber-tint: #FBF0DA;
  --ph-red: #B23B3B;
  --ph-red-tint: #FBEAEA;
  --ph-blue: #2F5D9A;
  --ph-blue-tint: #E8EEF7;

  /* Typography */
  --ph-font-display: 'Fraunces', Georgia, serif;
  --ph-font-sans: 'IBM Plex Sans', -apple-system, Segoe UI, sans-serif;
  --ph-font-mono: 'IBM Plex Mono', 'SFMono-Regular', Consolas, monospace;

  --ph-fs-xs: 11px;
  --ph-fs-sm: 12px;
  --ph-fs-base: 14px;
  --ph-fs-md: 16px;
  --ph-fs-lg: 20px;
  --ph-fs-xl: 26px;

  /* Layout */
  --ph-radius-sm: 6px;
  --ph-radius: 10px;
  --ph-radius-lg: 14px;
  --ph-sidebar-width: 220px;
  --ph-header-height: 60px;

  --ph-space-1: 4px;
  --ph-space-2: 8px;
  --ph-space-3: 12px;
  --ph-space-4: 16px;
  --ph-space-5: 20px;
  --ph-space-6: 24px;
  --ph-space-8: 32px;
}
