/* Legal pages: same brand (sky, gold pixel wordmark), but body copy set for
   long-form reading. Ink on a light sky-tinted card, not pixel type. */
:root {
  --sky-0: rgb(82 165 188);
  --sky-4: rgb(160 212 218);
  --paper: #f7fbfc;
  --ink: #12323d;          /* 13.6:1 on --paper */
  --muted: #3d5f69;        /* 6.6:1 on --paper */
  --link: #0e5f7a;         /* 7.1:1 on --paper */
  --gold: #ffcb05;
  --mark-outline: #ce7028;
  --ink-stroke: #0c3442;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: linear-gradient(to bottom, var(--sky-0), var(--sky-4)) fixed;
  color: var(--ink);
  font: 400 17px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  padding: 0 16px 48px;
}
.top { max-width: 760px; margin: 0 auto; padding: 28px 0 20px; }
.mark {
  font: 700 40px/1 "Pixelify Sans", ui-monospace, monospace;
  letter-spacing: .09em; color: var(--gold); text-decoration: none;
  --o: 2px; --o2: 4px;
  text-shadow:
    calc(-1 * var(--o)) 0 0 var(--mark-outline), var(--o) 0 0 var(--mark-outline),
    0 calc(-1 * var(--o)) 0 var(--mark-outline), 0 var(--o) 0 var(--mark-outline),
    calc(-1 * var(--o2)) 0 0 var(--ink-stroke), var(--o2) 0 0 var(--ink-stroke),
    0 calc(-1 * var(--o2)) 0 var(--ink-stroke), 0 var(--o2) 0 var(--ink-stroke),
    0 6px 0 #1a3470;
}
.mark:focus-visible { outline: 3px solid #fff; outline-offset: 6px; }
.doc {
  max-width: 760px; margin: 0 auto;
  background: var(--paper);
  padding: clamp(24px, 5vw, 48px);
  box-shadow: 0 -4px 0 var(--paper), 0 4px 0 var(--paper), -4px 0 0 var(--paper), 4px 0 0 var(--paper), 0 12px 0 rgb(12 52 66 / .18);
}
h1 { font: 600 clamp(28px, 5vw, 40px)/1.15 "Pixelify Sans", ui-monospace, monospace; margin: 0 0 6px; letter-spacing: .01em; }
h2 { font: 600 21px/1.3 "Pixelify Sans", ui-monospace, monospace; margin: 32px 0 8px; letter-spacing: .01em; }
.meta { color: var(--muted); margin: 0 0 24px; font-size: 15px; }
p, li { max-width: 68ch; }
ul { padding-left: 1.2em; }
li { margin: 4px 0; }
a { color: var(--link); text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible { outline: 2px solid var(--link); outline-offset: 2px; }
.back { margin-top: 36px; padding-top: 16px; border-top: 1px solid #d5e6ea; color: var(--muted); }