:root{
    --active:#4b9cd6;
    --active-t:#4b9cd61A;
    --accent-1:#448aff;
    --accent-2:#00bfa5;
    --primary:black;


    /* Action states */
    --success-bg: #e8f5e9;
    --success-text: #2e7d32;
    --success-border: #a5d6a7;
    --error-bg: #ffebee;
    --error-text: #c62828;
    --error-border: #ef9a9a;


   /* font sizes */
   --fs-0000:.5rem;
   --fs-000:.7rem;
   --fs-00:.8rem;
   --fs-0:.9rem;
   --fs-1:1rem;
   --fs-2:1.2rem;
   --fs-3:1.5rem;
   --fs-4:2rem;
   --fs-5:2.5rem;
   --fs-6:3rem;
    



    --text: #1b303a;
    --text-1: #2d3e4a;
    --text-2: #3f4d5a;
    --text-3: #515c6a;
    --text-4: #636b7a;
    --text-5: #757a8a;
    --text-6: #87899a;
    --text-7: #9998aa;
    --text-8: #aba7ba;

    --t-5:#8080800D;
    --t-10:#80808010;
    --t-20:#80808033;
    --t-50:#80808080;
    --t-80:#808080CC;
    --t-90:#808080E6;
    --t-w-5:#ffffff0D;
    --t-w-10:#ffffff10;
    --t-w-20:#ffffff33;
    --t-w-50:#ffffff80;
    --t-w-80:#ffffffCC;
    --t-w-90:#ffffffE6;
    --t-b-5:#0000000D;
    --t-b-10:#00000010;
    --t-b-20:#00000033;
    --t-b-50:#00000080;
    --t-b-80:#000000CC;
    --t-b-90:#000000E6;


    /* shadows */
    --shadow-color:#00000033;
    --bxs-00:0px 1px 3px var(--shadow-color);
    --bxs-0:0px 2px 3px var(--shadow-color);
    --bxs:0px 1px 2px var(--shadow-color);
    --bxs-1:0px 2px 4px var(--shadow-color);
    --bxs-2:0px 4px 8px var(--shadow-color);
    --bxs-3:0px 8px 16px var(--shadow-color);

    --bxs-4: 0 12px 32px 0 #00000040, 0 4px 16px 0 #00000026;
    --bxs-5: 0 20px 48px 0 #00000055, 0 8px 32px 0 #00000033;
    --bxs-6: 0 32px 64px 0 #00000066, 0 12px 48px 0 #00000040;
    --bxs-7: 0 48px 96px 0 #00000080, 0 20px 64px 0 #0000004d;
    --bxs-8: 0 64px 128px 0 #000000a0, 0 32px 96px 0 #00000066;


    /* Spacing */
    --sp-000:.25rem;
    --sp-00:.5rem;
    --sp-0:.8rem;
    --sp-1:1rem;
    --sp-2:2rem;
    --sp-3:4rem;
    --sp-4:8rem;


    /* border radius */
    --br-0:0.5em;
    --br-1:1em;
    --br-2:2em;
    --br-3:4em;
    --br-4:8rem;

    --bg: #ffffff;
    --bg-1: #fcfcfc;
    --bg-2: #f9f9f9;
    --bg-3: #f6f6f6;
    --bg-4: #f3f3f3;
    --bg-5: #f0f0f0;
    --bg-6: #ededed;
    --bg-7: #eaeaea;
}