/* Design Tokens - the ONLY place where raw values live. */
:root {
    /* Colors */
    --bg: #f8fafc;
    --surface: #ffffff;
    --text: #0f172a;
    --muted: #64748b;
    --accent: #0ea5e9;
    --live: #dc2626;
    --border: #e2e8f0;
    --featured: #fbbf24;

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

    /* Typography */
    --font-family: 'Tajawal', 'IBM Plex Sans Arabic', system-ui, sans-serif;
    --fs-sm: 0.8rem;
    --fs-base: 0.95rem;
    --fs-lg: 1.15rem;
    --fs-xl: 1.5rem;

    /* Shape & elevation */
    --radius: 12px;
    --shadow: 0 1px 3px rgb(0 0 0 / 8%);
}