*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;color-scheme:light dark}
body{margin:0;font-family:var(--font-sans);color:var(--color-text);line-height:1.5;
  background:linear-gradient(135deg,var(--color-bg-1),var(--color-bg-2)) fixed;min-height:100vh}
h1,h2,h3{line-height:1.2;margin:0 0 var(--space-3)}h1{font-size:1.6rem}h2{font-size:1.1rem}
p{margin:0 0 var(--space-3)}a{color:var(--color-primary)}
code{font-size:.85em;background:var(--color-border);padding:.1em .4em;border-radius:6px}
img,svg{max-width:100%}
.icon{width:1.15em;height:1.15em;flex:none;vertical-align:-.2em}
.muted{color:var(--color-muted)}
.sr-only,.skip-link:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link:focus{position:fixed;inset-block-start:8px;inset-inline-start:8px;z-index:100;background:var(--color-surface-strong);padding:.5rem 1rem;border-radius:var(--radius-sm)}
:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}
[hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}