:root { color-scheme: light dark; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #292725; background: #faf9f6; }
* { box-sizing: border-box; }
body { margin: 0; }
main { max-width: 850px; margin: 0 auto; padding: 44px 24px 64px; }
header { padding-bottom: 28px; border-bottom: 1px solid #dedbd3; }
.app-name { margin: 0 0 12px; color: #62605a; font-size: 15px; }
h1 { margin: 0; font-size: clamp(26px, 5vw, 36px); line-height: 1.3; }
h1 span { display: block; margin-top: 8px; font-size: 0.68em; font-weight: 500; }
nav { display: flex; gap: 24px; margin-top: 24px; }
a { color: #77501b; text-underline-offset: 4px; }
a:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; border-radius: 2px; }
article { scroll-margin-top: 24px; }
section { margin-top: 32px; }
h2 { margin: 0 0 10px; font-size: 20px; line-height: 1.4; }
p { margin: 0; font-size: 17px; line-height: 1.85; overflow-wrap: anywhere; }
#english { margin-top: 52px; padding-top: 32px; border-top: 1px solid #dedbd3; }
.language-heading { margin: 0; font-size: 28px; }
@media (prefers-color-scheme: dark) {
  :root { color: #eeeae2; background: #191817; }
  header, #english { border-color: #48443f; }
  .app-name { color: #c1bbb1; }
  a { color: #f0c887; }
}
@media (max-width: 480px) { main { padding: 30px 20px 48px; } p { font-size: 16px; } }