
:root { color-scheme: light; }
* { box-sizing: border-box; }
html { font-size: 100%; }
body { margin: 0; background: #f9f7f2; color: #352f29; font-family: "Segoe UI", system-ui, sans-serif; line-height: 1.8; }
a { color: #87462f; text-underline-offset: .22em; text-decoration-thickness: .08em; }
a:hover { text-decoration-thickness: .14em; }
a:focus-visible, summary:focus-visible, [tabindex]:focus-visible { outline: 3px solid #87462f; outline-offset: 5px; }
.skip-link { position: fixed; top: .5rem; left: .5rem; z-index: 10; background: #fffaf2; padding: .7rem 1rem; transform: translateY(-200%); }
.skip-link:focus { transform: none; }
.comparison { background: #eeefe9; color: #333e3b; font-size: .8rem; }
.comparison-inner { max-width: 76rem; margin: auto; padding: .8rem 1.5rem; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .75rem 2rem; }
.comparison p { margin: 0; }
.comparison p span { display: block; font-size: .75rem; }
.comparison nav { display: flex; flex-wrap: wrap; gap: .2rem 1.1rem; }
.comparison a { color: #334b3e; display: inline-block; padding: .4rem 0; }
.comparison a[aria-current="page"] { font-weight: 750; text-decoration-thickness: .15em; }
.site-shell { width: min(calc(100% - 4rem), 65rem); margin: 2.5rem auto 3rem; }
.site-header { margin-bottom: 3.4rem; }
.identity { display: inline-flex; align-items: center; gap: .85rem; width: fit-content; color: #352f29; text-decoration: none; font-size: 1.75rem; font-weight: 750; letter-spacing: -.025em; line-height: 1.35; }
.identity-icon { display: flex; flex-shrink: 0; color: #355641; }
.identity svg { display: block; width: auto; height: 48px; }
.identity-note { display: block; font-size: .75rem; font-weight: 400; color: #68584c; letter-spacing: 0; margin-top: .2rem; }
.site-nav { margin-top: 1.6rem; font-size: .875rem; display: flex; flex-wrap: wrap; align-items: flex-start; gap: .85rem 2.5rem; }
.site-nav ul { padding: 0; margin: 0; list-style: none; display: flex; flex-wrap: wrap; gap: .1rem 1.25rem; }
.site-nav a { padding: .35rem 0; display: inline-flex; align-items: center; gap: .4em; color: #63412f; }
.nav-icon { display: flex; flex-shrink: 0; }
.nav-icon svg { display: block; width: 1.6em; height: 1.6em; }
.site-nav a[aria-current="page"] { font-weight: 750; }
.built-group > span { display: block; font-size: .75rem; color: #68584c; font-weight: 650; margin-bottom: .1rem; }
.reading-area { max-width: 43rem; margin: auto; }
.draft-note { padding-left: .85rem; border-left: 3px solid #ad6040; margin-bottom: 1.8rem; font-size: .75rem; line-height: 1.6; color: #68584c; }
.draft-note strong { display: block; color: #78412d; font-size: .72rem; letter-spacing: .055em; }
.draft-note span { display: block; margin-top: .2rem; }
.prose { font-size: 1.125rem; overflow-wrap: anywhere; }
.page h1 { font-size: 2.125rem; font-weight: 750; line-height: 1.3; letter-spacing: -.03em; text-wrap: balance; margin: 0 0 1.7rem; }
.page h2 { font-size: 1.55rem; font-weight: 750; line-height: 1.35; margin: 3.3rem 0 1.4rem; letter-spacing: -.02em; }
.prose p { margin: 0 0 1.2rem; }
.prose strong { font-weight: 700; }
.home-page .prose > ul { display: grid; grid-template-columns: 1fr 1fr; gap: 1.8rem 2.5rem; list-style: none; padding: 0; margin: 0; }
.home-page .prose > ul > li { margin: 0; min-width: 0; }
.home-page .prose > ul > li > a { display: block; height: 100%; padding: .4rem 0; text-decoration: none; color: #51463d; font-size: 1rem; line-height: 1.75; }
.home-page .prose > ul strong { display: block; color: #87462f; font-size: 1.125rem; font-weight: 750; text-decoration: underline; text-underline-offset: .2em; margin-bottom: .45rem; }
.site-footer { margin-top: 3.5rem; color: #68584c; font-size: .75rem; line-height: 1.65; }
.site-footer p { margin: .4rem 0; }
.experiment-notes { max-width: 65rem; margin: 2rem auto; padding: 0 2rem; color: #68584c; font-size: .8rem; }
.experiment-notes summary { cursor: pointer; width: fit-content; padding: .6rem 0; }
.experiment-notes p { max-width: 44rem; }
.specimen { padding: .25rem 0 .25rem .9rem; border-left: 3px solid #ad6040; margin-top: 1.5rem; }
.specimen-label { font-size: .75rem; }
.construction { display: inline-block; max-width: 100%; color: #71452c; background: #f0d8a3; padding: .3rem .65rem; border-radius: 2px; font-size: .8rem; font-weight: 750; letter-spacing: .07em; overflow-wrap: anywhere; }
@media (max-width: 48rem) {
  .site-shell { width: calc(100% - 2.5rem); margin-top: 1.7rem; }
  .site-header { margin-bottom: 2.6rem; }
  .identity { font-size: 1.5rem; }
  .site-nav { display: block; margin-top: 1.2rem; }
  .built-group { margin-top: .8rem; }
  .home-page .prose > ul { grid-template-columns: 1fr; gap: 1.35rem; }
  .page h1 { font-size: 1.875rem; }
  .experiment-notes { padding-inline: 1.25rem; }
}
@media (max-width: 24rem) {
  .comparison-inner { padding-inline: 1rem; }
  .site-shell { width: calc(100% - 2rem); }
  .identity { font-size: 1.35rem; gap: .65rem; }
  .identity svg { width: auto; height: 40px; }
  .page h1 { font-size: 1.7rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}


.page { font-size: 1.125rem; overflow-wrap: anywhere; }
.page h3 { font-size: 1.2rem; line-height: 1.35; margin: 1.8rem 0 .8rem; }
.eyebrow { font-size: .85rem; color: #68584c; margin: 0 0 .5rem; }
.page-heading { margin-bottom: 1.7rem; }
.page p { margin: 0 0 1.2rem; }
.page ul, .page ol { padding-left: 1.25rem; }
.page li { margin-bottom: .35rem; }
.status { border-left: 3px solid #ad6040; padding: .1rem .9rem; margin: 1.6rem 0 2rem; background: #f2eee4; font-size: .95rem; }
.status dl { margin: .75rem 0; }
.status dl > div + div { margin-top: .9rem; }
.status dt { font-weight: 650; }
.status dd { margin: .2rem 0 0; }
.status-note { font-size: .8rem; color: #68584c; }
.status .construction { margin: .85rem 0 0; }
.availability, .connections { margin-top: 2.5rem; border-top: 1px solid #d8d2c4; }
img, video, iframe { max-width: 100%; }
img { height: auto; }
blockquote { margin: 1.5rem 0; padding-left: 1rem; border-left: 3px solid #d8d2c4; }
pre { overflow: auto; }
.jump-list { display: block; }
.jump-list ul { display: block; padding-left: 1.25rem; list-style: disc; }

.product-heading h1 { display: flex; align-items: center; gap: .45em; }
.product-icon { display: flex; flex-shrink: 0; color: #63412f; }
.product-icon svg { width: 1.3em; height: 1.3em; }
.product-opening { font-size: 1.55rem; font-weight: 750; line-height: 1.35; letter-spacing: -.02em; }
.product-description { font-size: 1.125rem; line-height: 1.8; }

.download-action { display: inline-block; padding: .65rem .9rem; border: 1px solid #87462f; border-radius: .2rem; font-weight: 650; }
