:root{
  --ash:#eceee9; --paper:#f7f8f5; --ink:#1f2529; --soft:#58636a; --kiln:#2d4b63; --kiln-d:#1f3649;
  --glaze:#a8431f; --line:#c9cec8;
}
@media (prefers-color-scheme: dark){
  :root{--ash:#171b1e; --paper:#1f2428; --ink:#e7eae6; --soft:#a2adb3; --kiln:#8fb4d0; --kiln-d:#b7d1e4; --glaze:#e08a63; --line:#38414a}
}
*{box-sizing:border-box}
html{font-size:100%}
body{margin:0;background:var(--ash);color:var(--ink);font:1.0625rem/1.6 "Source Sans 3",system-ui,sans-serif}
.wrap{max-width:68rem;margin:0 auto;padding:0 1rem}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:var(--paper);padding:.5rem;z-index:9}
a{color:var(--kiln);text-underline-offset:.15em}
a:focus-visible,select:focus-visible{outline:3px solid var(--glaze);outline-offset:2px}
.top{background:var(--ink);color:var(--ash)}
@media (prefers-color-scheme: dark){.top{background:#0f1214}}
.bar{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem 2rem;padding-top:.8rem;padding-bottom:.8rem}
.brand{font:800 1.6rem/1 Bitter,Georgia,serif;color:#eceee9;text-decoration:none;letter-spacing:.01em}
nav{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem}
nav a{color:#c9d3da;text-decoration:none;font-weight:600;padding:.2rem 0;border-bottom:2px solid transparent}
nav a:hover,nav a[aria-current]{color:#fff;border-bottom-color:var(--glaze)}
.disclose{margin:0;background:var(--paper);border-bottom:1px solid var(--line);font-size:.9rem;color:var(--soft);padding:.5rem 0}
h1,h2,h3,h4{font-family:Bitter,Georgia,serif;line-height:1.2;color:var(--ink)}
h1{font-size:clamp(1.9rem,4.5vw,2.9rem);font-weight:800;margin:0 0 .6rem;max-width:22ch}
h2{font-size:1.55rem;font-weight:700;margin:2.2rem 0 .5rem}
h3{font-size:1.35rem;margin:0 0 .25rem}
h4{font-size:1.05rem;margin:0 0 .3rem}
.lead{font-size:1.2rem;max-width:44rem;color:var(--ink)}
.hero{padding:2.5rem 0 1.5rem}
.picker{margin-top:1.4rem;display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:center}
.picker label{font-weight:600}
select{font:inherit;padding:.65rem .9rem;min-width:min(100%,20rem);border:2px solid var(--ink);background:var(--paper);color:var(--ink);border-radius:2px}
.prose{padding-top:2rem;padding-bottom:2.5rem}
.prose > *{max-width:44rem}
.prose table,.prose .src,.prose .buy{max-width:none}
.plain{padding-left:1.2rem}.plain li{margin:.45rem 0}
ol li{margin:.5rem 0}
table{border-collapse:collapse;width:100%;background:var(--paper);margin:1rem 0;font-size:1rem}
th,td{text-align:left;padding:.65rem .8rem;border-bottom:1px solid var(--line);vertical-align:top}
th{background:var(--ink);color:var(--ash);font-weight:600}
@media (max-width:640px){table{display:block;overflow-x:auto}}
.results{padding-bottom:1rem}
.result{background:var(--paper);border:1px solid var(--line);border-left:6px solid var(--kiln);padding:1.2rem 1.3rem;margin:0 0 1.2rem;max-width:56rem}
.spec{color:var(--soft);margin:.1rem 0 .8rem}
.item{display:grid;grid-template-columns:minmax(0,15rem) 1fr;gap:1.2rem;align-items:start;margin:1rem 0}
@media (max-width:640px){.item{grid-template-columns:1fr}}
.dim{width:100%;height:auto;color:var(--ink)}
.dl{font:600 11px "Source Sans 3",sans-serif;fill:var(--kiln-d)}
.open{border-left:4px solid var(--glaze);padding:.1rem .9rem;color:var(--ink);background:transparent;margin:1rem 0 0}
.buy a{display:inline-block;background:var(--kiln);color:#fff;padding:.55rem 1rem;text-decoration:none;font-weight:600;border-radius:2px}
.buy a:hover{background:var(--kiln-d)}
@media (prefers-color-scheme: dark){.buy a{color:#10202c}}
.src{font-size:.92rem;color:var(--soft);border-top:1px solid var(--line);padding-top:1rem;margin-top:2rem}
.foot{background:var(--ink);color:#c9d3da;padding:1.6rem 0;margin-top:2rem;font-size:.95rem}
@media (prefers-color-scheme: dark){.foot{background:#0f1214}}
.foot a{color:#dfe8ee}.foot .links a{margin-right:1.2rem}
.js .result{display:none}.js .result.show{display:block}
.empty{display:none;color:var(--soft)}.js .empty{display:block}.js.picked .empty{display:none}
@media (prefers-reduced-motion: reduce){*{scroll-behavior:auto!important}}