.cvZEZo {
    color: var(--greytext);
    gap: var(--space8);
    text-decoration: none;
    border-bottom: none;
    transition: 0.2s;
}

.cvZEZo:hover {
    color: var(--text-color);
}

.gQBIGb {
    color: var(--text-color);
    font-weight: 600;
    gap: var(--space8);
    text-decoration: none;
    border-bottom: none;
    transition: 0.2s;
}

.gQBIGb:hover {
    color: var(--text-color);
}

.dMXDhG {
    display: flex;
    flex-direction: column;
    max-width: 800px;
    border-top: 1px solid var(--outline);
    padding: var(--space16) 0px;
    margin: var(--space32) 0px;
}

@media (min-width: 480px) {
    .dMXDhG {
        flex-direction: row;
        padding: var(--space12) 0px;
    }
}

.dIRUjv {
    max-width: 800px;
    display: grid;
    grid-template-columns: 1fr;
    margin-top: var(--space40);
}

.ismKTx {
    display: flex;
    flex-direction: column;
}

.ismKTx h5 {
    margin: 0px;
}

.ismKTx p {
    margin: 0px 0px var(--space16) 0px;
}

.ismKTx a {
    transition: 0.3s;
    font-family: var(--accent-font);
    font-size: var(--type12);
}

.ismKTx a:hover {
    border-bottom: 1px solid;
}

.ebePfi {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    gap: var(--space20);
    margin-top: var(--space8);
}

.ebePfi img {
    width: inherit;
    border-radius: var(--spacing-unit);
}

.eVmrHJ {
    display: flex;
    flex-direction: column;
}

.eVmrHJ h5 {
    margin: 0px;
}

.cUGhZr {
    font-family: var(--accent-font);
    color: var(--greytext);
}

.eSyyvI {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(4px);
    z-index: 999;
}

.gMUEHm {
    display: flex;
    flex-direction: column;
    background: var(--background-card);
    border-radius: var(--space12);
}

.gHcyJh {
    display: block;
    background: var(--background);
    border-radius: var(--space12);
    text-align: left;
    width: 90%;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
}

@media (min-width: 480px) {
    .gHcyJh {
        max-width: 400px;
    }
}

.kkbvhf {
    display: flex;
    flex-direction: column;
    padding: var(--space20) var(--space20) 0px var(--space20);
}

.hpUyzM {
    width: 100%;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    justify-content: space-between;
    margin-bottom: var(--space20);
}

.ynsgH {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: var(--space12);
}

.ynsgH a {
    font-size: var(--type16);
    margin: 0px -12px;
    padding: var(--space8) var(--space12);
    border-radius: var(--space8);
    background: rgba(0, 0, 0, 0);
}

.ynsgH a:hover {
    background: var(--outline);
}

.eBHTrO {
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    gap: 8px;
}

.gLMXqO {
    display: flex;
    flex-direction: column;
    padding: var(--space12) var(--space24);
    background-color: var(--card-hover);
    border-radius: 0px 0px 12px 12px;
}

@media (min-width: 360px) {
    .gLMXqO {
        flex-direction: row;
        -webkit-box-pack: justify;
        justify-content: space-between;
    }
}

.eNjPUC {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    gap: var(--spacing-unit);
}

.hxCBvQ {
    background: var(--background-card);
    border-radius: var(--spacing-unit);
    padding: 2px var(--space8);
    font: 400 var(--type10) / 1.4 var(--accent-font), monospace;
}

.btIlSR {
    width: fit-content;
    border: none;
    border-radius: var(--space80);
    padding: var(--space8) var(--space16);
    font: 400 var(--type14) / 1.4 var(--accent-font), monospace;
    transition: 0.3s;
    margin: 0px -16px;
    cursor: pointer;
    background: rgba(0, 0, 0, 0);
    color: var(--text-color);
}

.btIlSR:hover {
    color: var(--text-color);
    background-color: var(--button-hover);
    cursor: pointer;
}

.gThUyu {
    padding: var(--space40) var(--space20);
    min-height: 100vh;
    max-width: 650px;
    margin: 0px auto;
    color: var(--text-color);
}

.iPToDM {
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    align-items: center;
}

@media (min-width: 600px) {
    .iPToDM {
        padding: var(--space24) 0px 0px 0px;
        margin-bottom: var(--space20);
    }
}

.hoRfrI {
    position: fixed;
    left: 20px;
    bottom: 20px;
    width: 40px;
    height: 40px;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    background: var(--background-card);
    color: var(--text-color);
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 15px -3px;
    border: none;
    border-radius: var(--space8);
    cursor: pointer;
    font-size: var(--type16);
}

.hoRfrI:focus {
    border: 2px solid var(--text-color);
}

@media (min-width: 660px) {
    .hoRfrI {
        box-shadow: none;
        bottom: auto;
        top: 40px;
        left: 40px;
    }
}

.bQqzJC {
    display: flex;
    flex-direction: column;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}

.bQqzJC.fade-in {
    opacity: 1;
}

.bQqzJC.fade-out {
    opacity: 0;
}

.bsuYdI {
    background-color: var(--background-card);
    border-radius: var(--space12);
    padding: var(--space16);
    margin: var(--space20) 0px;
}

@media (min-width: 660px) {
    .bsuYdI {
        padding: var(--space16) var(--space20) var(--space20) var(--space20);
    }
}

.bsuYdI a:hover {
    border-bottom: 1px solid;
}

.bsuYdI span:last-child {
    display: none;
}

.iMwgAC {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    margin-bottom: var(--space12);
}

.gPetZg {
    background-color: var(--background-card);
    font-size: var(--space12);
    padding: 5px 5px 2px 6px;
    border-radius: var(--spacing-unit);
    margin-right: var(--space8);
}

.gPetZg.checked svg path {
    stroke: var(--greytext);
}

.gPetZg.unchecked svg path {
    stroke: var(--background-card);
}

.khNOK {
    margin-left: var(--spacing-unit);
    color: var(--greytext);
    text-decoration: line-through;
}

.dfNWNN {
    margin-left: var(--spacing-unit);
    color: var(--text-color);
}

.owfBB {
    max-width: 800px;
    display: grid;
    grid-template-columns: 1fr;
    margin: var(--space20) 0px;
}

@media (min-width: 660px) {
    .owfBB {
        margin: var(--space12) 0px;
    }
}

.bhQaHN {
    display: block;
}

@media (min-width: 800px) {
    .bhQaHN p {
        margin: 0px 0px var(--space12) 0px;
    }
}

.bhQaHN a:hover {
    border-bottom: 1px solid;
}

.iEkwqj {
    max-width: 800px;
    display: grid;
    grid-template-columns: 1fr;
    margin: var(--space20) 0px;
    -webkit-box-align: center;
    align-items: center;
}

.iEkwqj h2 {
    margin-bottom: var(--space16);
}

.iEkwqj button {
    border: none;
    color: var(--greytext);
    font: 400 var(--type14) / 1.4 var(--accent-font), monospace;
    transition: 0.3s;
    background: rgba(0, 0, 0, 0);
    border-radius: var(--space8);
    padding: var(--spacing-unit) 0px 0px 0px;
    width: var(--space40);
    height: var(--space40);
}

.iEkwqj button:hover {
    color: var(--text-color);
    background-color: var(--button-hover);
    cursor: pointer;
}

@media (min-width: 660px) {
    .iEkwqj {
        margin: var(--space32) 0px var(--space32) 0px;
    }
}

.cyLVHb {
    display: inline-flex;
    flex-wrap: wrap;
    -webkit-box-align: center;
    align-items: center;
    row-gap: var(--space8);
    margin-left: -8px;
    column-gap: var(--space12);
}

.cyLVHb a:hover {
    border-bottom: 1px solid rgba(0, 0, 0, 0);
}

.dJyulf {
    background-color: var(--background) !important;
    border-radius: var(--space12);
    padding: var(--space16);
    display: flex;
    flex-direction: column;
    margin-bottom: var(--space8);
}

@media (min-width: 660px) {
    .dJyulf {
        padding: var(--space16) var(--space20) var(--space20) var(--space20);
    }
}

.dJyulf h5 {
    margin: var(--space8) 0px;
}

.fssbOX {
    display: block;
    margin-top: var(--space32);
}

.fssbOX p {
    margin: 0px 0px var(--space16) 0px;
}

.fssbOX p:last-child {
    margin: 0px;
}

@font-face {
    font-family: "Geist Mono";
    src: url("/GeistMono-Light.woff2");
}

@font-face {
    font-family: "Geist Regular";
    src: url("/Geist-Regular.woff2");
}

:root {
    --light-base: #F9F9F9;
    --dark-base: #151618;
    --shade100: #EFEFEF;
    --shade200: #E8E8E8;
    --shade300: #CFD1D6;
    --shade400: #A1A3AA;
    --shade500: #858892;
    --shade600: #60646F;
    --shade700: #2E3036;
    --shade800: #212224;
    --accent: #C0F27F;
    --spacing-unit: 4px;
    --space8: calc(2 * var(--spacing-unit));
    --space12: calc(3 * var(--spacing-unit));
    --space16: calc(4 * var(--spacing-unit));
    --space20: calc(5 * var(--spacing-unit));
    --space24: calc(6 * var(--spacing-unit));
    --space32: calc(8 * var(--spacing-unit));
    --space40: calc(10 * var(--spacing-unit));
    --space48: calc(12 * var(--spacing-unit));
    --space64: calc(16 * var(--spacing-unit));
    --space72: calc(18 * var(--spacing-unit));
    --space80: calc(20 * var(--spacing-unit));
    --primary-font: Geist Regular;
    --accent-font: Geist Mono;
    --type10: calc(2.5 * var(--spacing-unit));
    --type12: calc(3 * var(--spacing-unit));
    --type14: calc(3.5 * var(--spacing-unit));
    --type16: calc(4 * var(--spacing-unit));
}

@media (prefers-color-scheme: dark) {
    :root {
        --background: var(--dark-base);
        --text-color: var(--shade100);
        --outline: var(--shade700);
        --card-hover: var(--shade700);
        --button-hover: var(--shade700);
        --background-card: var(--shade800);
        --greytext: var(--shade300);
        --highlight: var(--accent);
    }
}

[data-theme="dark"] {

    --outline: var(--shade700);
    --card-hover: var(--shade700);
    --button-hover: var(--shade700);
    --background-card: var(--shade800);
    --greytext: var(--shade300);
    --highlight: var(--accent);
}

[data-theme="light"] {
    --outline: var(--shade200);
    --card-hover: var(--shade200);
    --button-hover: var(--shade200);
    --background-card: var(--shade100);
    --greytext: var(--shade600);
    --highlight: var(--accent);
}

body {
    color: var(--text-color);
    margin: 0px auto;
    width: 100%;
    text-rendering: optimizelegibility;
    transition: 0.3s;
}

::selection {
    background: var(--highlight);
    color: var(--dark-base);
}

h1 {
    font: 400 var(--type14)/1.4 var(--primary-font), sans-serif;
    margin: 0px;
}

h2 {
    font: 400 var(--type14)/1.4 var(--accent-font), monospace;
    margin: 0px 0px var(--space16) 0px;
    color: var(--greytext);
}

h3 {
    font: 400 var(--type16)/1.4 var(--primary-font), monospace;
    margin: 0px 0px var(--space8) 0px;
    color: var(--greytext);
}

h4 {
    font: 400 var(--type14)/1.4 var(--primary-font), sans-serif;
    margin: var(--space8) 0px var(--space8) 0px;
    color: var(--greytext);
}

h5 {
    font: 400 var(--type12)/1.4 var(--accent-font), monospace;
    margin: var(--space8) 0px var(--space8) 0px;
    color: var(--greytext);
}

p,
label {
    font: 400 var(--type14)/1.4 var(--primary-font), sans-serif;
    margin: 0px;
}

a {
    font: 400 var(--type14)/1.4 var(--primary-font), sans-serif;
    text-decoration: none;
    display: inline;
    color: var(--text-color);
    border-bottom: 1px solid rgba(0, 0, 0, 0);
    transition: 0.2s;
}

a:hover {
    color: var(--greytext);
    cursor: pointer;
}

img {
    border-radius: var(--space8);
}

span {
    margin: 0px var(--spacing-unit);
}

li {
    font: 400 var(--type14)/1.4 var(--primary-font), sans-serif;
    margin: 0px 0px var(--spacing-unit) 0px;
}

blockquote {
    background-color: var(--background-card);
    border-radius: var(--space12);
    padding: var(--space16);
    margin: var(--space32) 0px;
}

@media (min-width: 660px) {
    blockquote {
        padding: var(--space16) var(--space20) var(--space20) var(--space20);
    }
}

blockquote p {
    font: 400 var(--type12)/1.4 var(--accent-font), sans-serif;
    margin: 0px;
}

blockquote h4 {
    margin-bottom: 0px;
}

blockquote #id {
    width: 100%;
}

blockquote img {
    width: 100%;
    object-fit: contain;
    border-radius: var(--space8);
}

blockquote table {
    display: table;
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
}