/* ==========================================================================
   SOCIALUP DESIGN SYSTEM - CORE TOKENS
   /css/tokens.css
   Change colors, typography, spacing, and system variables here only.
   ========================================================================== */

/* San Francisco (SF Pro & SF Mono) Typeface Engine */
@import url('fonts.css?v=1.0');

:root {
  /* ------------------------------------------------------------------------
     1. Surface & Ink (Warm Paper & Editorial Contrast)
     ------------------------------------------------------------------------ */
  --paper: #F3F1EC;        /* Warm off-white page background */
  --ink: #101114;          /* Main body text & high-contrast elements */
  --ink-soft: #3F3F3C;     /* Big headlines & muted editorial copy */
  --line: #D9D6CE;         /* Dot grid, borders & dividers */
  --frame: #0B0B0B;        /* Screen bezel & dark container chrome */

  /* ------------------------------------------------------------------------
     2. Brand Color Palette (SocialUp Royal Blue)
     ------------------------------------------------------------------------ */
  --blue: #2563eb;         /* Core SocialUp royal blue */
  --blue-deep: #1d4ed8;    /* Deep hover state */
  --blue-light: #3b82f6;   /* Soft glow & secondary highlights */
  --blue-glow: rgba(37, 99, 235, 0.25);

  /* ------------------------------------------------------------------------
     3. Typography - Apple San Francisco Typeface System
     ------------------------------------------------------------------------ */
  --font-headline: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text', 'SF Pro', 'San Francisco', -apple-system-font, 'Helvetica Neue', Arial, sans-serif;
  --font-sans: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text', 'SF Pro', 'San Francisco', -apple-system-font, 'Helvetica Neue', Arial, sans-serif;
  --font-display: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text', 'SF Pro', 'San Francisco', -apple-system-font, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: 'SF Mono', -apple-system-font, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  /* ------------------------------------------------------------------------
     4. Backward Compatibility Bridges
     Maps existing site tokens to our new core tokens so existing pages remain
     visually intact while being completely recolorable via --blue.
     ------------------------------------------------------------------------ */
  --primary: var(--blue);
  --primary-hover: var(--blue-deep);
  --primary-light: var(--blue-light);
  --primary-dark: #1e40af;
  --primary-soft: #eff6ff;
  --primary-glow: var(--blue-glow);
  --accent: var(--blue);
  --electric-blue: var(--blue);
  --sky-blue: #0284c7;
}