:root {
    /* Background */
    --bg-gradient-top: #040a1f;
    --bg-gradient-bottom: #04040a;

    /* Text */
    --text-color: whitesmoke;

    /* Accent / main neon */
    --accent: #515ada;

    /* Dark UI surfaces */
    --surface-dark: #18181856;
    --surface-button-dark: #2e2e3679;

    --surface-opaque: #080b11;

    /* Glow / cursor ring */
    --cursor_mode: lighten;
    --cursor-hover: rgb(255, 255, 255);
    --cursor-ring: rgba(81, 90, 218, 0.5);
    --cursor-ring-hover: rgba(255, 255, 255, 0.3);

    /* Glitch effect colors */
    --glitch-red: red;
    --glitch-cyan: cyan;

    /* Pure white (used in hover states) */
    --white: #ffffff;


    /* Animated Background */
    --glow1: rgba(81,90,218,0.07);
    --glow2: rgba(0,0,0,0);

    --dots: rgb(142, 146, 211);
    --dot_fallof: 0.6;

    --wrong: red;
    --right: rgb(26, 192, 26);


    --surface-strong: rgba(10, 12, 18, 0.92);
    --surface-hover: rgba(255, 255, 255, 0.06);
    --border-soft: rgba(255, 255, 255, 0.08);

    --accent-text: #0b0d12;

    --shadow: rgba(0, 0, 0, 0.4);

    --danger: #ff4d4d;
}


[data-theme="light"] {
    /* Background */
    --bg-gradient-top: #ffffff;
    --bg-gradient-bottom: #a2a2b1;

    /* Text */
    --text-color: rgb(0, 0, 0);

    /* Accent / main neon */
    --accent: #bd5f29;

    /* Light UI surfaces */
    --surface-dark: #afa79556;
    --surface-button-dark: #b89e9979;
    --surface-opaque: #dac7b8;

    /* Glow / cursor ring */
    --cursor_mode: darken;
    --cursor-hover: rgba(0, 0, 0, 1);
    --cursor-ring: rgba(70, 54, 33, 0.568);
    --cursor-ring-hover: rgba(165, 165, 165, 0.3);

    /* Glitch effect colors */
    --glitch-red: rgb(255, 217, 0);
    --glitch-cyan: rgb(255, 60, 0);

    /* Pure white (used in hover states) */
    --white: #000000;

    /* Animated Background */
    --glow1: rgba(31, 24, 21, 0.105);
    --glow2: rgba(0, 0, 0, 0);

    --dots: rgb(32, 26, 24);
    --dot_fallof: 1.1;






    --surface-strong: rgba(255, 245, 240, 0.95);
    --surface-hover: rgba(0, 0, 0, 0.05);
    --border-soft: rgba(0, 0, 0, 0.08);

    --accent-text: #ffffff;

    --shadow: rgba(0, 0, 0, 0.15);

    --danger: #d93030;

}