:root {
    /* Cursor */
    /*--cursor-default: url("data:image/svg+xml;base64,") 4 4, auto;
    --cursor-pointer: url("data:image/svg+xml;base64,") 12 6, pointer;
    --cursor-text: url("data:image/svg+xml;base64,") 14 14, text;*/
    --cursor-default: auto;
    --cursor-pointer: pointer;
    --cursor-text: text;
    
    
    /* Font */
    --font: 'jetBrainsMono', sans-serif;
    --font-light: 'jetBrainsMono-light', sans-serif;
    --font-light-italic: 'jetBrainsMono-lightItalic', sans-serif;
    --font-medium: 'jetBrainsMono-medium', sans-serif;
    --font-medium-italic: 'jetBrainsMono-mediumItalic', sans-serif;
    --font-bold: 'jetBrainsMono-bold', sans-serif;
    --font-extra-bold: 'jetBrainsMono-extraBold', sans-serif;


    --bg-light: #ffffff;
    --bg: #faf8f7;
    --bg-dark: #efedf9;

    --text: #252829;
    --text-muted: #6e6a69;

    --border: #cfcad9;
    --border-muted: #e3dff0;
    --highlight: #d9c8f9;

    --primary: #b892fe;
    --secondary: #ae6c94;

    --danger: #ed8072;
    --warning: #f7ca80;
    --success: #7bcca0;
    --info: #8ab8e3;


    --shadow-s: 0 1px 2px rgba(30, 25, 25, 0.052);
    --shadow-m: 0 1px 1px rgba(30, 25, 25, 0.06), 0 2px 4px rgba(30, 25, 25, 0.04);
    --shadow-l: 0 10px 15px rgba(30, 25, 25, 0.1), 0 4px 6px rgba(30, 25, 25, 0.05);
    --shadow-xl: 0 20px 25px rgba(30, 25, 25, 0.15), 0 10px 10px rgba(30, 25, 25, 0.05);

    --drop-shadow-s: 2px 2px 4px rgba(30, 25, 25, 0.052);
    --drop-shadow-m: 3px 3px 6px rgba(30, 25, 25, 0.06), 5px 5px 10px rgba(30, 25, 25, 0.04);
    --drop-shadow-l: 6px 6px 12px rgba(30, 25, 25, 0.1), 10px 10px 20px rgba(30, 25, 25, 0.05);
    --drop-shadow-xl: 10px 10px 20px rgba(30, 25, 25, 0.15), 15px 15px 30px rgba(30, 25, 25, 0.05);

    --radius-s: 3px;
    --radius-m: 7px;
    --radius-l: 12px;
    --radius-full: 50%;
}

:root[data-theme="dark"] {
    --bg-light: #2a2625;
    --bg: #1a1716;
    --bg-dark: #0f0d0d;

    --text: #ebe8e5;
    --text-muted: #b4aeac;

    --border: #4a445b;
    --border-muted: #332f44;
    --highlight: #5a4f72;

    --primary: #b892fe;
    --secondary: #6b5b9a;

    --danger: #e07466;
    --warning: #e4b571;
    --success: #6db492;
    --info: #7da9d6;

    --shadow-s: 0 1px 2px rgba(255, 255, 255, 0.052);
    --shadow-m: 0 1px 2px rgba(255, 255, 255, 0.06), 0 2px 4px rgba(255, 255, 255, 0.04);
    --shadow-l: 0 10px 15px rgba(0, 0, 0, 0.4), 0 4px 6px rgba(255, 255, 255, 0.05);
    --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.5), 0 10px 10px rgba(255, 255, 255, 0.06);

    --drop-shadow-s: 2px 2px 4px rgba(0, 0, 0, 0.42);
    --drop-shadow-m: 3px 3px 6px rgba(0, 0, 0, 0.45), 5px 5px 10px rgba(255, 255, 255, 0.04);
    --drop-shadow-l: 6px 6px 12px rgba(0, 0, 0, 0.6), 10px 10px 20px rgba(255, 255, 255, 0.05);
    --drop-shadow-xl: 10px 10px 20px rgba(0, 0, 0, 0.7), 15px 15px 30px rgba(255, 255, 255, 0.06);

    --radius-s: 3px;
    --radius-m: 7px;
    --radius-l: 12px;
    --radius-full: 50%;
}

:root {
    scrollbar-width: thin;
    scrollbar-color: var(--secondary) transparent;
}

:root::-webkit-scrollbar {
    width: 6px;
}

:root::-webkit-scrollbar-track {
    background: transparent;
}

:root::-webkit-scrollbar-thumb {
    background-color: var(--secondary);
    border-radius: 4px;
}

html {
    font-size: 16px;
}

body {
    background-color: var(--bg);
    color: var(--text);
    font-family: var(--font), Tahoma, Geneva, Verdana, sans-serif;
    font-size: 16px;
    cursor: var(--cursor-default);
}