/* ═══ Theme Variables ═══ */

    :root, [data-theme="dark"] {

      --bg: #0a0f1e;

      --bg-glass: rgba(10, 15, 30, 0.88);

      --surface: rgba(17, 24, 39, 0.72);

      --surface-solid: #111827;

      --surface-hover: rgba(26, 35, 50, 0.9);

      --text: #e2e8f0;

      --text-secondary: #94a3b8;

      --text-muted: #64748b;

      --accent: #3b82f6;

      --accent-light: #60a5fa;

      --accent-bg: rgba(59, 130, 246, 0.12);

      --accent-bg-hover: rgba(59, 130, 246, 0.18);

      --line: rgba(255, 255, 255, 0.06);

      --line-strong: rgba(255, 255, 255, 0.1);

      --shadow: 0 8px 32px rgba(0, 0, 0, 0.4);

      --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);

      --glass-blur: 16px;

      --code-bg: #0d1321;

      --code-border: rgba(255, 255, 255, 0.06);

      --heading-color: #f1f5f9;

      --heading-sub: #e2e8f0;

    }



    [data-theme="light"] {

      --bg: #f4f8ff;

      --bg-glass: rgba(244, 248, 255, 0.88);

      --surface: rgba(255, 255, 255, 0.75);

      --surface-solid: #ffffff;

      --surface-hover: rgba(241, 245, 249, 0.95);

      --text: #07132f;

      --text-secondary: #475569;

      --text-muted: #94a3b8;

      --accent: #0068ff;

      --accent-light: #3b82f6;

      --accent-bg: rgba(0, 104, 255, 0.08);

      --accent-bg-hover: rgba(0, 104, 255, 0.14);

      --line: rgba(7, 19, 47, 0.08);

      --line-strong: rgba(7, 19, 47, 0.12);

      --shadow: 0 8px 32px rgba(7, 19, 47, 0.1);

      --shadow-sm: 0 1px 4px rgba(7, 19, 47, 0.06);

      --glass-blur: 20px;

      --code-bg: #f1f5f9;

      --code-border: rgba(7, 19, 47, 0.1);

      --heading-color: #07132f;

      --heading-sub: #1e293b;

    }



    [data-theme="white"] {

      --bg: #ffffff;

      --bg-glass: rgba(255, 255, 255, 0.94);

      --surface: #ffffff;

      --surface-solid: #ffffff;

      --surface-hover: #f8f9fa;

      --text: #1a1a2e;

      --text-secondary: #4a5568;

      --text-muted: #a0aec0;

      --accent: #1a56db;

      --accent-light: #2563eb;

      --accent-bg: rgba(26, 86, 219, 0.06);

      --accent-bg-hover: rgba(26, 86, 219, 0.1);

      --line: #e2e8f0;

      --line-strong: #cbd5e1;

      --shadow: 0 4px 16px rgba(0, 0, 0, 0.06);

      --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.04);

      --glass-blur: 0px;

      --code-bg: #f7fafc;

      --code-border: #e2e8f0;

      --heading-color: #1a1a2e;

      --heading-sub: #2d3748;

    }