:root{
    --c-body-bg: #291623;
    --c-feed-bg: #110918;
    --c-acc-01: #eaa6ae;
    --c-acc-02: #d884bf;
    --c-acc-03: #ac85a4;
    --c-acc-04: #9b3d8d;
    --c-text-main: #f2e7da;
    --c-text-sub: #b1a3b2;
    --c-feed-sub: #f3d7fa;
}

body{
    color: var(--c-text-main);
    background-color: var(--c-body-bg);
    font-family: system-ui, serif;
    font-size: 18px;
    min-height: 98vh;
    background-color: var(--c-body-bg);
    background-image:
        linear-gradient(to bottom, #000012 0%, 45%, #0e010109 100%),
        linear-gradient(28deg, rgb(158, 31, 118, 0.28) 0%, rgb(78, 143, 173, 0.09) 50%, rgba(125, 168, 33, 0.09) 100%),
        repeating-conic-gradient(from 3deg at 25%, rgba(208, 30, 30, 0.09) 0deg, rgba(40, 0, 0, 0.09) 1deg, rgba(23, 23, 193, 0.09) 2deg),
        repeating-radial-gradient(circle at center, rgba(208, 30, 30, 0.09) 3px, rgba(40, 0, 0, 0.09) 5px, rgba(23, 23, 193, 0.09) 7px),
        repeating-conic-gradient(from 45deg at center, rgba(208, 30, 30, 0.09) 0deg, rgba(40, 0, 0, 0.09) 1deg, rgba(23, 23, 193, 0.09) 2deg),
        repeating-radial-gradient(circle at 0px, rgba(208, 30, 30, 0.09) 3px, rgba(40, 0, 0, 0.09) 5px, rgba(23, 23, 193, 0.09) 7px);
}

.theme-panel{
    background-color: var(--c-feed-bg);
    border-radius: 5px;
    box-shadow:var(--c-body-bg) -2px 0px 0px,
    var(--c-feed-bg) -5px 0px 0px,
    var(--c-acc-04) -5px 0px 1px;
}

article{
    border-bottom: 5px solid var(--c-feed-bg);
}

h1{
    font-family: 'BIZ UDMincho', serif, system-ui;
    font-size: 26px;
    font-weight: 100;
    letter-spacing: 5px;
    color: var(--c-acc-01);
    border-bottom: 1px solid;
}
h1::first-letter{
    font-weight: bolder;
    font-size: 39px;
    background-color: var(--c-acc-01);
    color: var(--c-body-bg);
}
h2{
    font-family: 'BIZ UDMincho', serif, system-ui;
    font-size: 18px;
    letter-spacing: 5px;
    color: var(--c-acc-03);
    border-bottom: 1px solid;
}

p{
    color: var(--c-text-main);
}

small{
    font-family: 'BIZ UDMincho', serif, system-ui;
    font-style: italic;
    font-size: 14px;
    font-weight: 100;
    letter-spacing: 1px;
    color: var(--c-acc-03);
}

a{
    font-family: Quaver, serif;
    color: var(--c-acc-03);
    transition:
        color 250ms,
        background-color 250ms,
        border-color 250ms,
        text-shadow 250ms;

}
a:hover{
    background-color: var(--c-acc-04);
    color: var(--c-feed-sub);
    border-color: var(--c-acc-04);
    text-shadow: 0px 0px 5px var(--c-acc-01);
}

.hov-link{
    font-family: 'BIZ UDMincho', serif, system-ui;
    background-color: var(--c-feed-bg);
    color: var(--c-text-main);
}
.hov-link:hover{
    background-color: var(--c-acc-03);
    color: var(--c-body-bg);
}
.side-anchor{
    font-family: 'BIZ UDMincho', serif, system-ui;
    background-color: transparent; 
    font-size: 40px;
}
.side-anchor:hover{
    background-color: transparent;
}
.anchor{
    font-family: 'BIZ UDMincho', sans-serif, system-ui;
    font-size: large;
    font-weight: bold;
    font-style: italic;
}


#right{
    font-family: 'BIZ UDMincho', serif, system-ui;
    font-style: italic;
    font-size: 40px;
}
#right ul{
    text-shadow: var(--c-acc-01) 0px 0px 3px;
    list-style: none;
    padding-left: 0;
}
#right a{
    color: var(--c-acc-01);
    text-shadow: 0px 0px 5px var(--c-acc-01);
    transition:
        color 250ms,
        text-shadow 250ms;
}
#right a:hover{
    color: var(--c-feed-sub);
    text-shadow: 0px 0px 9px var(--c-acc-01);
    border-color: var(--c-acc-04);
}
