/* QED Cloud: one stylesheet for every page. System fonts only, so no page makes a third-party request. */
:root {
  --paper: #140504; --ink: #F4E9DA; --quiet: #B09A8A; --rule: #3A1712; --red: #E0442F; --wash: #1D0907;
  --serif: Charter, "Bitstream Charter", "Sitka Text", Cambria, Georgia, serif;
  --sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --gutter: clamp(16px, 4vw, 40px);
  color-scheme: dark;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0; min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column;
  background: var(--paper); color: var(--ink); font: 400 1.0625rem/1.65 var(--serif);
  border-top: 4px solid var(--red); -webkit-font-smoothing: antialiased;
}
::selection { background: var(--red); color: var(--paper); }
a { color: var(--red); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--red); outline-offset: 3px; border-radius: 2px; }
code { font: .88em var(--mono); overflow-wrap: anywhere; }
abbr[title] { text-decoration: none; }

/* Letterhead and footer */
.top, .foot, main { width: 100%; max-width: 68rem; margin: 0 auto; padding-left: var(--gutter); padding-right: var(--gutter); }
.top { padding-top: 22px; padding-bottom: 22px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none; font: 650 1.02rem/1 var(--sans); letter-spacing: -.01em; }
.logo { width: 28px; height: 28px; flex: none; }
.logo-q { fill: var(--ink); } .logo-seal { fill: var(--red); }
main { flex: 1; display: flex; flex-direction: column; }
.foot {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px;
  padding-top: 18px; padding-bottom: 28px; font: 400 .8rem/1.6 var(--mono); color: var(--quiet);
  background: linear-gradient(var(--rule), var(--rule)) center top / calc(100% - 2 * var(--gutter)) 1px no-repeat;
}
.foot nav { display: flex; flex-wrap: wrap; gap: 4px 20px; }
.foot a { color: var(--quiet); text-decoration: none; }
.foot a:hover { color: var(--red); }

/* Home */
.hero { margin: auto 0; padding: 6vh 0 8vh; }
.hero h1 {
  font: 700 clamp(3rem, 11.5vw, 8rem)/.94 var(--sans); letter-spacing: -.05em; margin: 0 0 .28em;
  max-width: 11ch; text-wrap: balance;
}
.stop { display: inline-block; width: .17em; height: .17em; margin-left: .05em; background: var(--red); color: transparent; overflow: hidden; vertical-align: baseline; }
.sub { font: italic 400 clamp(1.3rem, 2.8vw, 1.85rem)/1.35 var(--serif); color: var(--quiet); margin: 0 0 1.6em; }
.lede { max-width: 33rem; font-size: clamp(1.08rem, 1.6vw, 1.22rem); margin: 0 0 1.1em; }
.reach { margin: 0; font: 500 .95rem/1.4 var(--mono); }
.gloss { border-top: 1px solid var(--rule); padding: 14px 0 0; margin-bottom: 8px; }
.gloss p { margin: 0; font: 400 .8rem/1.6 var(--mono); color: var(--quiet); }
.gloss abbr { color: var(--red); font-weight: 600; margin-right: .6em; }
.gloss i { font: italic .95rem var(--serif); }

/* Documents: privacy, security policy, 404, predicate types */
.doc { max-width: 40rem; padding: 4vh 0 7vh; }
.doc h1 { font: 700 clamp(2.1rem, 6vw, 3.1rem)/1.05 var(--sans); letter-spacing: -.035em; margin: 0 0 .35em; text-wrap: balance; }
.doc h2 { font: 650 1.08rem/1.3 var(--sans); letter-spacing: -.005em; margin: 2.2em 0 .5em; }
.doc p, .doc ul { margin: 0 0 .9em; }
.doc ul { padding-left: 1.2rem; }
.doc li + li { margin-top: .45em; }
.doc li::marker { color: var(--red); }
.meta, .eyebrow, .crumb { font: 500 .78rem/1.4 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--quiet); margin: 0 0 1.6em; }
.eyebrow, .crumb { margin-bottom: .9em; }
.crumb a { color: var(--quiet); text-decoration: none; }
.crumb a::before { content: "\2190\00a0"; }
.crumb a:hover { color: var(--red); }
.summary { background: var(--wash); border-left: 3px solid var(--red); padding: 14px 18px; margin: 0 0 1.6em !important; }
.q { color: var(--quiet); font: .85rem/1.5 var(--mono); overflow-wrap: anywhere; }
.notfound { margin: auto 0; }

@media (max-width: 480px) {
  .hero { padding: 4vh 0 6vh; }
  .foot { flex-direction: column; }
}
@media print {
  body { border: 0; } .foot nav, .reach { display: none; }
}