/* ThermoDraw's site: the palette, the faces and the furniture every page
   shares. The dictionary keeps its own copy of these rules on purpose: it
   is one file at the repository root, opened from a checkout, and a
   stylesheet beside it would not be there. */
:root{
  --paper:#fcfcfd; --panel:#fff; --ink:#16181d; --ink-2:#565b66; --ink-3:#8b909b;
  --rule:#e2e4e9; --accent:#b4442c; --tint:#f4f5f8;
  --serif:"IBM Plex Serif",Georgia,serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --sans:"IBM Plex Sans","ThermoDraw Sans","Helvetica Neue",Arial,sans-serif;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:#0f1115; --panel:#171a1f; --ink:#e9e7e2; --ink-2:#a2a7b2; --ink-3:#727884;
    --rule:#2a2e36; --accent:#e8996b; --tint:#1b1f26;
  }
}
:root[data-theme="dark"]{
  --paper:#0f1115; --panel:#171a1f; --ink:#e9e7e2; --ink-2:#a2a7b2; --ink-3:#727884;
  --rule:#2a2e36; --accent:#e8996b; --tint:#1b1f26;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);
     font-family:var(--serif);font-size:17px;line-height:1.62;
     -webkit-font-smoothing:antialiased}
h1{font-size:clamp(27px,3.6vw,38px);font-weight:600;margin:0 0 6px;line-height:1.14}
h2{font-family:var(--sans);font-size:15px;font-weight:600;letter-spacing:.02em;
   margin:40px 0 6px;color:var(--ink)}
.sub{font-family:var(--sans);font-size:15px;color:var(--ink-2);margin:0 0 28px;max-width:62ch}
.crumb{font-family:var(--sans);font-size:14px;color:var(--ink-3);margin:0 0 18px}
p{margin:0 0 14px;max-width:68ch;color:var(--ink-2)}
a{color:var(--accent);text-decoration-thickness:1px;text-underline-offset:2px}
code{font-family:var(--mono);font-size:.85em;background:var(--tint);
     padding:1px 5px;border-radius:3px;color:var(--ink)}
pre{font-family:var(--mono);font-size:14px;background:var(--tint);padding:12px 16px;
    border-radius:6px;overflow-x:auto;color:var(--ink);margin:0 0 14px}
button,.btn{font-family:var(--sans);font-size:14px;font-weight:500;background:var(--panel);
       color:var(--ink);border:1px solid var(--rule);border-radius:999px;
       padding:8px 16px;cursor:pointer;white-space:nowrap;line-height:1.2}
button:hover,.btn:hover{border-color:var(--accent);color:var(--accent)}
button:focus-visible,.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
button[aria-pressed="true"]{border-color:var(--accent);color:var(--accent)}
.card{background:var(--panel);border:1px solid var(--rule);border-radius:8px}
footer{font-family:var(--sans);font-size:13.5px;color:var(--ink-3);margin-top:56px;
       padding-top:18px;border-top:1px solid var(--rule)}
