html {
    background: var(--page-bg);
}

:root:root body {
    font-family: var(--font-body);
    font-size: .875rem;
    color: var(--stone-800);
    background: transparent;
}

:root:root body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(ellipse 90% 55% at 50% -14%, rgba(201, 162, 74, .09), transparent 70%),
        radial-gradient(ellipse 130% 80% at 50% 125%, rgba(0, 0, 0, .75), transparent 62%),
        var(--l2-noise);
}

:root:root ::selection {
    background: rgba(201, 162, 74, .38);
    color: #fff7e0;
}

:root:root :focus-visible {
    outline: .125rem solid rgba(230, 201, 120, .75);
    outline-offset: .125rem;
}

:root:root h1,
:root:root h2,
:root:root h3,
:root:root h4 {
    font-family: var(--font-heading);
    letter-spacing: .02em;
}

:root:root a:hover {
    color: var(--gold-soft);
}

:root:root hr {
    border: 0;
    height: .0625rem;
    background: linear-gradient(90deg, transparent, rgba(201, 162, 74, .55), transparent);
}

:root:root * {
    scrollbar-width: auto;
    scrollbar-color: auto;
}

@supports not selector(::-webkit-scrollbar) {
    :root:root * {
        scrollbar-width: thin;
        scrollbar-color: #3b4350 #07090c;
    }
}

:root:root ::-webkit-scrollbar {
    width: .625rem;
    height: .625rem;
}

:root:root ::-webkit-scrollbar-track {
    background: #07090c;
    box-shadow: inset 0 0 0 .0625rem #000;
}

:root:root ::-webkit-scrollbar-thumb {
    background: linear-gradient(90deg, #444c5a, #2b313b);
    border: .0625rem solid #000;
    box-shadow: inset 0 0 0 .0625rem rgba(255, 255, 255, .09);
}

:root:root ::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(90deg, #a98430, #6b5220);
}

:root:root ::-webkit-scrollbar-corner {
    background: #07090c;
}

:root:root .has-border {
    border: 0;
    box-shadow:
        inset 0 0 0 .0625rem var(--has-border-inset),
        0 0 0 .0625rem #000,
        0 0 0 .125rem var(--l2-steel),
        0 .25rem .75rem rgba(0, 0, 0, .45);
}

:root:root .has-border::before {
    border-color: var(--has-border-inner);
    border-radius: 0;
}

:root:root .has-border-shadow {
    box-shadow:
        inset 0 .0625rem 0 rgba(255, 255, 255, .06),
        0 0 0 .0625rem #000,
        0 0 0 .125rem var(--l2-steel),
        0 0 0 .1875rem #000,
        0 .5rem 1.25rem rgba(0, 0, 0, .55);
}

:root:root .c-divider {
    margin-block: 1rem;
}

:root:root .c-divider__line {
    height: .0625rem;
    background: linear-gradient(90deg, transparent, rgba(201, 162, 74, .7) 55%, rgba(201, 162, 74, .25));
}

:root:root .c-divider__line:last-child {
    background: linear-gradient(270deg, transparent, rgba(201, 162, 74, .7) 55%, rgba(201, 162, 74, .25));
}

:root:root .c-divider__diamond {
    background: var(--gold);
    box-shadow: 0 0 .5rem rgba(201, 162, 74, .6);
    border-radius: 0;
}

:root:root .c-divider__diamond--lg {
    background: var(--gold-soft);
}

:root:root code,
:root:root kbd,
:root:root .mono {
    font-family: var(--font-mono);
}

:root:root img {
    image-rendering: auto;
}
