:root {
    color-scheme: light dark;
    color: CanvasText;
    background: Canvas;
    font: 16px/1.5 system-ui;
}

header menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 1lh;
}

header menu li.selected {
    background-color: SelectedItem;
    a { color: SelectedItemText; }
}

body {
    max-width: 80ch;
    margin: 0 auto;
    padding: 1rem;
}

h2:target {
    border-bottom: dashed 2px ActiveText;
}

img, svg, video, canvas {
    display: block;
    max-width: 100%;
    height: auto;
}

pre:has(> code) {
    margin: 0;
    padding: 0 .5lh;
    outline: dashed 1px GrayText;
}

code {
    color: GrayText;
}

:target {
    &::before {
        content: '👉 ';
    }
}