/* Neutral foundations. Theme values belong to each site. */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 6rem; -webkit-text-size-adjust: 100%; }
body { margin: 0; line-height: 1.6; font-family: system-ui, sans-serif; }
h1, h2, h3, h4, p, figure { margin: 0; }
h1, h2, h3 { line-height: 1.1; text-wrap: balance; }
p { text-wrap: pretty; }
img, video { display: block; max-width: 100%; height: auto; }
button, input, textarea, select { font: inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; }
a { color: inherit; text-underline-offset: .2em; }
:focus-visible { outline: 3px solid currentColor; outline-offset: 5px; }
[hidden] { display: none !important; }
.skip-link { position: fixed; z-index: 1000; left: 1rem; top: 1rem; padding: .8rem 1.2rem; background: Canvas; color: CanvasText; transform: translateY(-200%); }
.skip-link:focus { transform: none; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
dialog { max-width: calc(100% - 2rem); color: inherit; }
dialog::backdrop { background: rgb(0 0 0 / .55); }
.demo-dialog { width: 30rem; padding: 2rem; border: 1px solid currentColor; background: Canvas; color: CanvasText; border-radius: .5rem; }
.demo-dialog h2 { font: 600 1.5rem/1.2 system-ui, sans-serif; }
.demo-dialog p { margin: 1rem 0; }
.demo-dialog button { padding: .6rem 1.1rem; background: CanvasText; color: Canvas; border: 1px solid; border-radius: .25rem; }
.motion-toggle { font: inherit; color: inherit; background: transparent; border: 1px solid currentColor; padding: .45rem .8rem; border-radius: .2rem; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }