:root {
  color-scheme: dark;
  --ground: #131118;
  --ink: #f0eef4;
  --body: #dcd8e4;
  --muted: #a79fb6;
  --edge: #36303f;
  --link: #7fb6ee;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--ground); color: var(--body); font: 1rem/1.65 ui-sans-serif, system-ui, sans-serif; }
main { width: min(100% - 3rem, 45rem); margin: 0 auto; padding: clamp(3rem, 10vw, 7rem) 0 2rem; }
h1 { margin: 0; color: var(--ink); font: 400 clamp(3rem, 9vw, 5.5rem)/1.1 Georgia, ui-serif, serif; overflow-wrap: anywhere; }
h2 { margin: 0 0 .8rem; color: var(--ink); font-size: 1.25rem; font-weight: 500; }
p { margin: 0 0 1rem; }
.intro { margin-top: 1.4rem; max-width: 33rem; font-size: 1.3rem; line-height: 1.5; }
.admission { max-width: 38rem; color: var(--muted); }
nav { display: flex; flex-wrap: wrap; gap: 1rem 2rem; margin-top: 2rem; }
a { color: var(--link); text-underline-offset: .2em; }
a:hover { color: var(--ink); }
:focus-visible { outline: 2px solid var(--link); outline-offset: 5px; }
section { margin-top: 3rem; }
ol { padding-left: 1.4rem; margin: 0 0 1.25rem; }
li { padding-left: .35rem; margin: .65rem 0; }
code { font-size: .9em; overflow-wrap: anywhere; }
.intent { white-space: pre-wrap; }
details { margin-top: 2.5rem; }
summary { cursor: pointer; color: var(--muted); }
details p { margin-top: 1rem; }
footer { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid var(--edge); color: var(--muted); font-size: .8rem; }
