/* ============================================================
   Vibensway Design Tokens
   Dark glassmorphism design language — extracted from the
   original per-page inline styles (2026-06 refactor).
   ============================================================ */

:root {
    /* ---------- Background ---------- */
    --bg-gradient: linear-gradient(135deg, #0f0f1a 0%, #1a1a2e 50%, #16213e 100%);
    --bg-gradient-radial: radial-gradient(circle at center, #0e0e1a 0%, #06060c 100%);
    --bg-deep: #0e1117;
    --bg-overlay: rgba(20, 26, 38, 0.85);

    /* ---------- Glass surfaces ---------- */
    --glass-bg: rgba(255, 255, 255, 0.05);
    --glass-bg-soft: rgba(255, 255, 255, 0.03);
    --glass-bg-strong: rgba(255, 255, 255, 0.1);
    --glass-border: rgba(255, 255, 255, 0.1);
    --glass-border-soft: rgba(255, 255, 255, 0.08);
    --glass-border-strong: rgba(255, 255, 255, 0.2);
    --glass-blur: blur(20px);
    --glass-blur-soft: blur(10px);

    /* ---------- Text ---------- */
    --text-primary: #ffffff;
    --text-secondary: rgba(255, 255, 255, 0.6);
    --text-muted: rgba(255, 255, 255, 0.4);
    --text-faint: rgba(255, 255, 255, 0.5);

    /* ---------- Accents ---------- */
    --accent-indigo: #667eea;
    --accent-purple: #764ba2;
    --accent-cyan: #4facfe;
    --accent-cyan-2: #00f2fe;
    --accent-pink: #f093fb;
    --accent-pink-2: #f5576c;
    --accent-gold: #fbbf24;
    --accent-gold-2: #f3ba2f;
    --accent-green: #10b981;
    --accent-green-soft: #34d399;
    --accent-green-bright: #22c55e;
    --accent-red: #ef4444;
    --accent-red-soft: #f87171;
    --accent-blue: #60a5fa;

    /* ---------- Gradients ---------- */
    --gradient-brand: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --gradient-cyan: linear-gradient(135deg, #4facfe, #00f2fe);
    --gradient-pink: linear-gradient(135deg, #f093fb, #f5576c);
    --gradient-fire: linear-gradient(135deg, #FF512F, #DD2476);

    /* ---------- Spacing scale ---------- */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;
    --space-12: 48px;

    /* ---------- Radii ---------- */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 20px;
    --radius-2xl: 24px;
    --radius-pill: 999px;

    /* ---------- Shadows ---------- */
    --shadow-card: 0 8px 32px rgba(0, 0, 0, 0.3);
    --shadow-card-hover: 0 30px 60px rgba(0, 0, 0, 0.3), 0 0 40px rgba(102, 126, 234, 0.2);
    --shadow-glow-indigo: 0 4px 15px rgba(102, 126, 234, 0.4);
    --shadow-glow-pink: 0 10px 25px rgba(221, 36, 118, 0.4);

    /* ---------- Transitions ---------- */
    --transition-fast: all 0.2s ease;
    --transition-base: all 0.3s ease;
    --transition-spring: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    --transition-smooth: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);

    /* ---------- Typography ---------- */
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-mono: 'Monaco', 'Consolas', monospace;
}