:root {
    --qlx-green: #2ed36a;
    --qlx-mint: #21eec9;
    --qlx-ink: #4d4c5a;
    --qlx-muted: #f8f9fa;
    --qlx-line: #dbe8ff;
    font-size: max(66px, 5.208333333vw);
    color-scheme: light;
    scrollbar-gutter: stable;
}
* { box-sizing: border-box; }
body, h1, h2, h3, p, figure, dl, dd { margin: 0; }
body { font: 12px serif; color: var(--qlx-ink); background: white; }
#qlx-main { overflow-x: clip; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
img { max-width: 100%; }
button, a { -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid #157e43; outline-offset: 5px; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
em { color: var(--qlx-green); font-style: normal; }
mark { color: inherit; background: var(--qlx-mint); border-radius: .3rem; }
[class~="qlx-skip"] { position: fixed; z-index: 500; top: 4px; left: 8px; transform: translateY(-150%); background: white; font: 16px sans-serif; padding: 12px; }
[class~="qlx-skip"]:focus, [class~="qlx-skip"]:hover, [class~="qlx-skip"]:active { transform: none; }
[class~="qlx-sr"] { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
@media (max-width: 768px) { :root { font-size: 13.333333333vw; } }

ul { margin: 0; padding: 0; list-style: none; }
:root {
    --qlx-text: 16px; --qlx-reader: 1200px;
    --qlx-radius-card: 20px; --qlx-radius-panel: 12px; --qlx-radius-dialog: 24px;
    --qlx-space-unit: 8px; --qlx-space-panel: 24px; --qlx-space-section: 72px;
    --qlx-type-title: 30px; --qlx-type-copy: 16px; --qlx-type-caption: 14px;
    --qlx-paper: #fff; --qlx-body: #333; --qlx-heading: #161c2d; --qlx-quiet: #888;
    --qlx-gold: #dfb05e; --qlx-premium: #332625;
}