/* AppOS Design Tokens — the single token vocabulary for every micro-app.
 * The Theme Engine (appos-frontend.js) overrides the primary/status/shape
 * tokens at :root from the active Flock/Activity branding before first paint.
 * Components MUST reference these variables — never hardcode hex values.
 * Owner: AppsOS Platform Team (docs/apps/process/design-system.md)
 */
:root {
  /* Primary palette (theme-driven) */
  --primary: #EF7F23;
  --primary-accent: #F79009;
  --primary-gradient: linear-gradient(135deg, #EF7F23 0%, #F79009 100%);
  --primary-light: rgba(239, 127, 35, 0.12);
  --primary-dark: #D4691A;
  --text-on-primary: #FFFFFF;

  /* Surface palette (fixed) */
  --bg: #F8FAFC;
  --bg-accent: #FFF8F3;
  --surface: #FFFFFF;
  --border: #E2E8F0;

  /* Text palette (fixed) */
  --text: #1E293B;
  --text-secondary: #475569;
  --text-muted: #94A3B8;

  /* Status palette (fixed) */
  --success: #059669;
  --success-bg: #ECFDF5;
  --warning: #D97706;
  --warning-bg: #FFFBEB;
  --danger: #DC2626;
  --danger-bg: #FEF2F2;

  /* Shape */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-full: 9999px;

  /* Elevation */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);

  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;

  /* Typography */
  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-xs: 11px;
  --font-sm: 13px;
  --font-md: 14px;
  --font-lg: 16px;
  --font-xl: 20px;

  /* Layout zones (design-system §3) */
  --header-height: 56px;
  --footer-height: 60px;
  --content-max-width: 480px;
}