/* =========================================================
   CORE TOKENS & RESET
========================================================= */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html,
body {
    width: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

:root {
    /* Z-Index Layering Architecture */
    --z-negative: -1;
    --z-low: 10;
    --z-medium: 100;
    --z-high: 1000;
    --z-header: 9999;
    --z-overlay: 99999;
    --z-modal: 999999;
    --z-max: 9999999;

    /* Brand Colors */
    --brand-blue: #052699;
    --brand-blue-dark: #031a70;
    --brand-blue-soft: #0a39c4;
    --brand-cyan: #16bff3;
    --brand-cyan-dark: #0b92c7;
    --brand-white: #FFFFFF;
    --brand-light: #EDEDED;

    /* Semantic Mappings */
    --primary: var(--brand-blue);
    --primary-hover: var(--brand-blue-dark);
    --accent: var(--brand-cyan);
    --accent-hover: var(--brand-cyan-dark);

    /* Alpha-Channel Reflections & Lighting Layers */
    --primary-glow: rgba(5, 38, 153, 0.42);
    --primary-glow-strong: rgba(5, 38, 153, 0.62);
    --primary-light: rgba(22, 191, 243, 0.13);

    /* Dark Mode Defaults */
    --bg-main: #061126;
    --bg-secondary: #071936;
    --bg-tertiary: #030b1a;
    --card-bg: #0b1d3b;
    --card-bg-hover: #102a54;
    --text-white: #ffffff;
    --text-light: #c5d1ec;
    --text-muted: #94a3b8;
    --border-color: rgba(22, 191, 243, 0.12);
    --border-color-strong: rgba(22, 191, 243, 0.22);

    /* Animation */
    --transition-fast: 0.25s ease;
    --transition-smooth: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --transition-bounce: 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
    --transition-slow: 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);

    /* Layout */
    --header-height: 80px;
    --container-max: 1480px;
    --container-padding: 50px;
}

/* Light mode overrides */
body.light-mode {
    --bg-main: #ffffff;
    --bg-secondary: #f5f7fb;
    --bg-tertiary: #eef1f6;
    --card-bg: #ffffff;
    --card-bg-hover: #f8f9fc;
    --text-white: #111827;
    --text-light: #374151;
    --text-muted: #4b5563;
    --border-color: rgba(0, 0, 0, 0.08);
    --border-color-strong: rgba(0, 0, 0, 0.12);
    --primary-glow: rgba(5, 38, 153, 0.08);
    --primary-glow-strong: rgba(5, 38, 153, 0.15);
    --primary-light: rgba(22, 191, 243, 0.06);
    background: #f4f7fb;
}

body.system-theme.light-mode {
    --bg-main: #ffffff;
    --bg-secondary: #f5f7fb;
    --bg-tertiary: #eef1f6;
    --card-bg: #ffffff;
    --card-bg-hover: #f8f9fc;
    --text-white: #111827;
    --text-light: #374151;
    --text-muted: #4b5563;
    --border-color: rgba(0, 0, 0, 0.08);
    --border-color-strong: rgba(0, 0, 0, 0.12);
    --primary-glow: rgba(5, 38, 153, 0.08);
    --primary-glow-strong: rgba(5, 38, 153, 0.15);
    --primary-light: rgba(22, 191, 243, 0.06);
    background: #f4f7fb;
}