:root {
  --fg: #1b1b1b; --muted: #666; --bg: #fff; --line: #d8d8d8; --head: #f3f5f8;
  --link: #1a4f9c; --knowl: #7a4a00; --pop: #fffbea;
}
@media (prefers-color-scheme: dark) {
  :root { --fg: #e4e4e4; --muted: #999; --bg: #16181b; --line: #3a3d42; --head: #22262b;
          --link: #8ab4f8; --knowl: #e8b35a; --pop: #2a2618; }
}
* { box-sizing: border-box; }
body { margin: 0; font: 16px/1.5 system-ui, sans-serif; color: var(--fg); background: var(--bg); }
header { display: flex; gap: 2em; align-items: baseline; padding: .6em 16px; border-bottom: 1px solid var(--line); background: var(--head); }
header nav a { margin-right: 1.2em; }
.brand { font-weight: 600; color: var(--fg); text-decoration: none; }
main { max-width: 1100px; margin: 0 auto; padding: 0 16px 4em; }
footer { max-width: 1100px; margin: 0 auto; padding: 1em 16px 2em; border-top: 1px solid var(--line);
  color: var(--muted); font-size: .85em; clear: both; }
footer p { margin: .5em 0 0; }
.nowrap { white-space: nowrap; }
a { color: var(--link); }
h1 { font-size: 1.6em; font-weight: 600; }
h2 { font-size: 1.2em; font-weight: 600; margin-top: 1.8em; border-bottom: 1px solid var(--line); display: flow-root; } /* flow-root: keep the rule from running under floated pictures */
code { font-size: .9em; }
code.id { word-break: break-all; }
table { border-collapse: collapse; }
th, td { border: 1px solid var(--line); padding: .25em .6em; text-align: left; vertical-align: top; }
th { background: var(--head); font-weight: 500; }
table.inv th { width: 18em; }
table.results td { font-variant-numeric: tabular-nums; }
table.small { font-size: .85em; }
table.grid td { text-align: right; white-space: nowrap; }
/* Complete enumerations: download-only, not in the searchable database. */
table.grid td.enum, a.enum { color: var(--muted); }
form.lookup { display: flex; gap: .5em; flex-wrap: wrap; }
form.lookup input { font-family: ui-monospace, monospace; max-width: 100%; }
.scroll { overflow-x: auto; }
.unknown, .na, .note { color: var(--muted); }
.note { font-size: .9em; }
.method { font-size: .85em; color: var(--muted); }
a.knowl { color: var(--knowl); text-decoration: none; border-bottom: 1px dotted var(--knowl); }
a.sort { text-decoration: none; font-size: .8em; }
.knowl-pop { position: absolute; z-index: 10; max-width: 34em; background: var(--pop); border: 1px solid var(--line);
  border-radius: 4px; padding: .5em 1em; box-shadow: 0 2px 8px rgba(0,0,0,.2); font-size: .92em; }
.knowl-title { font-weight: 600; margin-top: .3em; }
form.search fieldset { border: 1px solid var(--line); margin: 0 0 .6em; display: flex; flex-wrap: wrap; gap: .4em 1.4em; }
form.search label { white-space: nowrap; }
details { margin: .3em 0; }
.sets { font-family: ui-monospace, monospace; font-size: .85em; word-spacing: .3em; }
.picwrap { float: right; margin: 0 0 1em 1em; text-align: center; width: 362px; max-width: 100%; }
svg.picture { max-width: 100%; height: auto; border: 1px solid var(--line); }
svg .pt { fill: var(--fg); }
svg .ptlabel { font-size: 12px; fill: var(--fg); }
svg .edge { fill: none; stroke: var(--muted); stroke-width: 2; }
svg .elabel { font-size: 12px; fill: var(--fg); text-anchor: middle; dominant-baseline: central;
  stroke: var(--bg); stroke-width: 4px; paint-order: stroke; }
.picwrap + .picwrap { clear: right; }
button.copy { font-size: .8em; }
@media (max-width: 700px) { .picwrap { float: none; margin: 0; } table.inv th { width: auto; } }