:root {
    /* Primary Purple — introspective, depressed, supernatural */
    --vapor:  #EDE6F2;
    --haze:   #D9CEED;
    --specter:#C4B2E0;
    --shade:  #B09BD6;
    --hollow: #9070BB;
    --iris:   #7B4FA6;
    --dusk:   #5B3A7A;
    --deep:   #3D2060;
    --abyss:  #2A1548;

    /* Holy Yellow — divine light, sacred gold */
    --gleam:  #FFFFF0;
    --halo:   #FFFDE7;
    --gilt:   #FFE566;
    --gold:   #FFD700;
    --icon:   #B8860B;
    --relic:  #705000;

    /* Unholy Red — corrupted, blood, void */
    --sin:    #FFE8E8;
    --wound:  #D45C5C;
    --blood:  #9B1B1B;
    --ichor:  #6B0F1A;
    --void:   #2D0008;

    --linen: #EFD9CE;

    /* Fonts */
    --font-display: 'Sofia', cursive, sans-serif;
    --font-body:    'Shantell Sans', cursive, sans-serif;

}

/*Body*/
body {
    padding-left: 20px;
    padding-right: 20px;
    background-color: var(--deep);
    color: var(--haze);
    font-family: var(--font-body);
}

h1 {
    color: var(--haze);
}

/*Link Colors*/
a:link    { color: var(--dusk); }
a:visited { color: var(--iris); }
a:hover   { color: var(--haze); }
a:active  { color: var(--haze); }

/*Box*/
.box {
    margin-bottom:15px;
    background-color: var(--iris);
    border-color: #957FEF;
    border-radius: 10px;
    padding: 10px;
    font-family: var(--font-body);
}