:root {
    --link-color: #5856D7;
    --link-color-visited: #5856D7;
    --link-color-hover: #302EA9;
    --link-color-active: #5856D7;
    
    --background-color: #fff;
    --background-color-1: #f5f5f5;
    --background-color-2: #efefef;
    --background-color-3: #e0e0e0;
    --background-color-4: #afafaf;
    
    --text-color: #333;
    --text-color-1: #000;
    --text-color-2: #666;
    --text-color-3: #999;

    --white-color: #ffffff;
    --black-color: #000000;
    --blue-color: #006fff;
    --green-color: #2ec04f;
    --indigo-color: #4e4cd0;
    --orange-color: #ff8a00;
    --pink-color: #ff284b;
    --purple-color: #a648d9;
    --red-color: #ff342a;
    --teal-color: #50c1f9;
    --yellow-color: #ffc500;
    --brown-color: #987953;
    --gray-color: #838388;
}
@media (prefers-color-scheme: dark) {
    :root {
        --link-color: #7D7AFF;
        --link-color-visited: #7D7AFF;
        --link-color-hover: #ABA9FF;
        --link-color-active: #7D7AFF;

        --text-color: #c9c9c9;
        --text-color-1: #f0f0f0;
        --text-color-2: #999;
        --text-color-3: #ccc;

        --background-color: #000;
        --background-color-1: #1a1a1a;
        --background-color-2: #262626;
        --background-color-3: #333333;
        --background-color-4: #606060;

        --white-color: #ffffff;
        --black-color: #000000;
        --blue-color: #0d79ff;
        --green-color: #2acb4e;
        --indigo-color: #5352e2;
        --orange-color: #ff950d;
        --pink-color: #ff3054;
        --purple-color: #b750f0;
        --red-color: #ff3c33;
        --teal-color: #59ccff;
        --yellow-color: #ffd00d;
        --brown-color: #a2835d;
        --gray-color: #8d8d92;
    }
}