:root { color-scheme: dark; background: #09090b; color: #e4e4e7; }
.reader { font: 100%/1.65 system-ui,sans-serif; }
.reader main { max-width: 72ch; margin: auto; padding: 2rem 1rem 4rem; }
.reader h1 { font-size: clamp(2rem, 6vw, 3.5rem); line-height: 1.1; }
.reader h2 { margin-block-start: 2rem; }
.reader a,.reader .eyebrow { color: #fdba74; }
.reader pre,.reader details { background: #18181b; border: 1px solid #3f3f46; border-radius: .6rem; padding: .8rem; }
.reader pre { overflow: auto; }
.reader details { margin-block: .65rem; }
.reader summary { cursor: pointer; }
.reader dt { font-weight: bold; }
.reader dd { margin-inline-start: 0; }
.reader button { padding: .45rem .75rem; font: inherit; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid #fdba74; outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
[data-filter][aria-pressed="true"] { background: #ff6b00; color: #09090b; }