@import "/fonts/index.css";

:root {
    --tx: #cdd6f4;
    --bg: #1e1e2e;
    --bl: #1e1e2e99;
    --a1: #a6e3a1;
    --a2: #fab387;
    --a3: #89dceb;
    --bu: #313244;
    --bb: #45475a;
    --hl: #a6e3a133;
    @media (prefers-color-scheme:light) {
        --tx: #4c4f69;
        --bg: #eff1f5;
        --bl: #eff1f599;
        --a1: #40a02b;
        --a2: #fe640b;
        --a3: #04a5e5;
        --bu: #ccd0da;
        --bb: #bcc0cc;
        --hl: #40a02b4d;
    }
}

* {
    box-sizing: border-box;
}

html, body {
    font-family: Iosevka, Consolas, Menlo, Monaco, 'Courier New', monospace;
    background: var(--bg);
    color: var(--tx);
}

body {
    max-width: 730px;
    margin: auto;
}

::selection {
    background: var(--a1);
    color: var(--bg);
}

p {
    line-height: 1.6;
}

b, strong {
    font-weight: 700;
}

i, em {
    color: var(--a1);
}

a {
    color: var(--tx);
    text-decoration: underline solid 1px var(--a2);
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-color: var(--a2);
    text-decoration-thickness: 1px;
}

a:hover {
    text-decoration: underline solid 1px var(--a1);
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-color: var(--a1);
    text-decoration-thickness: 1px;
    background: var(--hl);
    font-weight: bold;
    border-radius: 0.26rem;
}

h1, h2, h3, h4, h5, h6 {
    line-height: 1.5;
    letter-spacing: -1px;
}

h1 {
    font-size: 2.027rem;
    color: var(--a1);
    font-weight: 900;
    font-family: 'Unbounded', 'Apfel Grotezk', Inter, 'IBM Plex Sans', 'Helvetica Neue', Arial, system-ui, sans-serif;
}

h2 {
    font-size: 1.802rem;
    color: var(--a2);
    font-weight: 900;
    font-family: 'Unbounded', 'Apfel Grotezk', Inter, 'IBM Plex Sans', 'Helvetica Neue', Arial, system-ui, sans-serif;
}

h3 {
    font-size: 1.602rem;
    color: var(--a3);
    font-family: 'Unbounded', 'Apfel Grotezk', Inter, 'IBM Plex Sans', 'Helvetica Neue', Arial, system-ui, sans-serif;
}

h4 {
    font-size: 1.424rem;
}

h5 {
    font-size: 1.266rem;
}

h6 {
    font-size: 1.125rem;
}

small, footer {
    font-size: 0.889rem;
}

code {
    font-family: 'Victor Mono', monospace;
    font-style: italic;
}

button {
    font-family: inherit;
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
    padding: 0.6rem;
    border-radius: 0.26rem;
}

ul {
    list-style-type: square;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.outgoing::after {
    content: '↗';
    font-weight: normal !important;
    font-size: 70%;
    color: var(--a1);
    vertical-align: super;
}