:root {
    --max-width: 1100px;
    --border-radius: 12px;
    --font-mono: ui-monospace,Menlo,Monaco,"Cascadia Mono","Segoe UI Mono","Roboto Mono","Oxygen Mono","Ubuntu Monospace","Source Code Pro","Fira Mono","Droid Sans Mono","Courier New",monospace;
    --foreground-rgb: 45,45,45;
    --foreground-headings-rgb: 45,45,45;
    --background-solid-rgb: 250,250,250;
    --background-start-rgb: 244,249,255;
    --background-end-rgb: 250,250,250;
    --primary-glow: conic-gradient(from 180deg at 50% 50%,#16abff33 0deg,#0885ff33 55deg,#54d6ff33 120deg,#0071ff33 160deg,transparent 360deg);
    --secondary-glow: radial-gradient(#fff,hsla(0,0%,100%,0));
    --tile-start-rgb: 239,245,249;
    --tile-end-rgb: 228,232,233;
    --tile-border: conic-gradient(#00000080,#00000040,#00000030,#00000020,#00000010,#00000010,#00000080);
    --callout-rgb: 238,240,241;
    --callout-border-rgb: 172,175,176;
    --card-rgb: 180,185,188;
    --card-border-rgb: 131,134,135;

    
}

@media (prefers-color-scheme: dark) {
    :root {
        --foreground-headings-rgb:220,220,220;
        --foreground-rgb: 200,200,200;
        --background-solid-rgb: 23,32,51
    }
}

* {
    box-sizing: border-box;
    padding: 0;
    margin: 0
}

body,html{
    max-width: 100vw;
    overflow-x: hidden;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
    -webkit-scroll-behavior: smooth;
}

body {
    background: rgb(var(--background-solid-rgb))
}

a,body {
    color: rgb(var(--foreground-rgb))
}

a {
    text-decoration: underline;
    transition: all .15s linear;
    text-underline-offset: 2px
}

a:hover {
    opacity: .75
}

p {
    font-family: Inter, sans-serif;
    font-feature-settings: 'liga' 1, 'calt' 1; /* fix for Chrome */
}

@media (max-width: 750px) {
    p {
        -webkit-hyphens:auto;
        hyphens: auto
    }
}