:root {
    --bg-color: #000219;
    --bg-color2: #f3f3f3;
    --text-color: #202327;
    --text-color2: #A7AEB4;

    /* Surface */
    --surface-50: #FFFFFF;
    --surface-100: #F7F9FD;
    --surface-200: #ECEDEE;
    --surface-300: #CBCFD2;
    --surface-400: #A7AEB4;
    --surface-500: #8E979F;
    --surface-600: #6B767F;
    --surface-700: #4F575E;
    --surface-800: #33383D;
    --surface-900: #202327;

    /* Primary */
    --primary-50: #FF6666;
    --primary-100: #FF3333;
    --primary-200: #FF0000; /* color base */
    --primary-300: #CC0000;
    --primary-400: #990000;

    /* Secondary */
    --secondary-50: #FBDE9D;
    --secondary-100: #F9CE6C;
    --secondary-200: #F8C44E; /* color base */
    --secondary-300: #F5AD0A;
    --secondary-400: #C48B08;

    /* Danger */
    --danger-50: #FBEAEA;
    --danger-100: #E16B6B;
    --danger-200: #C92929; /* color base */
    --danger-300: #A92323;
    --danger-400: #6E1717;

    /* Success */
    --success-50: #F6FEFB;
    --success-100: #1BC590;
    --success-200: #12825F; /* color base */
    --success-300: #0E674B;
    --success-400: #0A4834;

    /* Warning */
    --warning-50: #FFFDFA;
    --warning-100: #F9DBB5;
    --warning-200: #F2AB53; /* color base */
    --warning-300: #EE9322;
    --warning-400: #A6620D;

    /* Dark */
    --dark-50: #1D2033;
    --dark-100: #1C1E30;
    --dark-200: #000219; /* color base */
    --dark-300: #080824;
    --dark-400: #00031E;

    /* Opacity */
    --opacity-primary: rgba(26, 71, 186, 0.15);   /* #1A47BA, 15% */
    --opacity-secondary: rgba(236, 150, 64, 0.15); /* #EC9640, 15% */
    --opacity-danger: rgba(201, 41, 41, 0.15);     /* #C92929, 15% */
    --opacity-success: rgba(18, 130, 95, 0.15);    /* #12825F, 15% */
    --opacity-warning: rgba(242, 171, 83, 0.15);   /* #F2AB53, 15% */
    --opacity-modal: rgba(18, 18, 18, 0.15);       /* #121212, 15% */
}

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

@font-face {
    font-family: 'Kamikaze';
    src: url('/fonts/kamikaze/Kamikaze.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

body {
    background-color: #fcfcfc;
    font-family: 'Inter', sans-serif;
}

a {text-decoration: none;}