:root{
  --paper:#F3F2EB; --ink:#31302F; --ink-2:#61615E; --muted:#92918D; --rule:#C2C2BC;
  --green:#007A5E; --green-deep:#325746; --green-ink:#1B2F27; --blue:#B4CCE0; --lilac:#ADA4FF;
  --measure:68ch;
  --sans:"Helvetica Neue",Helvetica,Montserrat,Arial,sans-serif;
}
*{box-sizing:border-box}
html{font-family:var(--sans);color:var(--ink);background:var(--paper);font-size:18px;line-height:1.5;-webkit-font-smoothing:antialiased}
body{margin:0}
a{color:var(--green);text-decoration-thickness:1px;text-underline-offset:.15em}
a:hover{color:var(--green-deep)}
a:focus-visible{outline:2px solid var(--green);outline-offset:3px}
.masthead{display:flex;flex-wrap:wrap;gap:.8rem 2rem;align-items:center;padding:1.2rem clamp(1rem,4vw,3rem);border-bottom:1px solid var(--rule)}
.wordmark{display:block;line-height:0}
.wordmark img{height:44px;width:auto}
.masthead nav{display:flex;gap:1.4rem;flex-wrap:wrap;margin-left:auto}
.masthead nav a{color:var(--ink);text-decoration:none;font-weight:700;font-size:.95rem}
.masthead nav a:hover{color:var(--green)}
main{padding:2.4rem clamp(1rem,4vw,3rem) 4rem}
article.page,.home{max-width:var(--measure)}
h1{font-size:clamp(1.9rem,4.2vw,3rem);line-height:1.05;font-weight:700;letter-spacing:-.015em;margin:.3em 0 .6em;text-wrap:balance}
h2{font-size:1.35rem;font-weight:700;letter-spacing:-.01em;margin:2.2em 0 .5em}
h3{font-size:1.05rem;font-weight:700;margin:1.6em 0 .3em}
/* The answer block: the one element allowed to be loud. */
.answer{font-size:1.2rem;line-height:1.45;font-weight:300;border-left:4px solid var(--green);padding:.15em 0 .15em 1rem;margin:0 0 2em}
p{margin:0 0 1em}
table{border-collapse:collapse;width:100%;font-size:.9rem;margin:1em 0}
caption{text-align:left;caption-side:top;color:var(--ink-2);font-size:.9rem;padding:.4em 0}
th,td{text-align:left;padding:.5em .6em;border-bottom:1px solid var(--rule);vertical-align:top}
th{font-weight:700;border-bottom:2px solid var(--ink)}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
.vintage{color:var(--ink-2);font-size:.85em}
.null{color:var(--muted)}
.sources ul,.limits ul,.machine ul{padding-left:1.2em}
.limits{border-top:1px solid var(--rule);padding-top:.6em}
/* About block on work pages: set off from the body, same register as the answer block. */
.about-cs{margin-top:2.6em;padding:1em 1.2em;background:rgba(0,122,94,.07);border-left:4px solid var(--green)}
.about-cs h2{margin:0 0 .4em;font-size:1.05rem}
.about-cs p{margin:0;font-size:.95rem;line-height:1.5}
.updated{color:var(--ink-2);font-size:.9rem;margin-top:3em}
.home .lede{font-size:1.3rem;line-height:1.4;font-weight:300;max-width:var(--measure)}
.services{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1.6rem 2.4rem;margin:1em 0 2em;padding:0;list-style:none}
.services h3{margin:0 0 .3em}
.services p{margin:0;color:var(--ink-2);font-size:.95rem}
.worklist{list-style:none;padding:0;margin:0}
.worklist li{padding:1em 0;border-top:1px solid var(--rule)}
.worklist a{font-weight:700;color:var(--ink);text-decoration:none}
.worklist a:hover{color:var(--green);text-decoration:underline}
.worklist p{margin:.3em 0 0;color:var(--ink-2)}
.bio{display:grid;grid-template-columns:minmax(0,1fr);gap:1.2rem 2rem;align-items:start}
.bio img{width:100%;max-width:220px;height:auto;display:block}
@media(min-width:640px){.bio{grid-template-columns:220px minmax(0,1fr)}}
pre,code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.9em}
pre{background:#fff;padding:1em;overflow-x:auto;border:1px solid var(--rule)}
footer{padding:2rem clamp(1rem,4vw,3rem);border-top:1px solid var(--rule);color:var(--ink-2);font-size:.85rem}
footer p{margin:0 0 .5em;max-width:var(--measure)}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}