/* Privacy and Terms. Same tokens as the home page - including the deeper
   --teal-ink for small teal text, since the brand teal is 2.99:1 on white. */
:root{
  --teal:#00A79D; --teal-ink:#006B64; --teal-wash:rgba(0,167,157,.10);
  --bg:#FFFFFF; --surface:#F7F9F9; --line:rgba(10,20,20,.11);
  --ink:#0B1414; --muted:#55615F; --faint:#687472; --maxw:760px;
  --serif:'Newsreader', Georgia, 'Times New Roman', serif;
  --sans:'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono:'DM Mono', ui-monospace, 'Cascadia Mono', Consolas, monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#050808; --surface:#0D1313; --line:rgba(255,255,255,.11);
    --ink:#EEF3F2; --muted:#9AA8A6; --faint:#71807E; --teal-ink:#00A79D; --teal-wash:rgba(0,167,157,.14);
  }
}
:root[data-theme="dark"]{
  --bg:#050808; --surface:#0D1313; --line:rgba(255,255,255,.11);
  --ink:#EEF3F2; --muted:#9AA8A6; --faint:#71807E; --teal-ink:#00A79D; --teal-wash:rgba(0,167,157,.14);
}

*{ box-sizing:border-box; }
body{ margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans);
      font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased; }
img{ display:block; }
a{ color:var(--teal-ink); }
.wrap{ max-width:var(--maxw); margin:0 auto; padding-left:20px; padding-right:20px; }

.mark-night{ display:none; }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .mark-day{ display:none; }
  :root:not([data-theme="light"]) .mark-night{ display:block; }
}
:root[data-theme="dark"] .mark-day{ display:none; }
:root[data-theme="dark"] .mark-night{ display:block; }

header{ border-bottom:1px solid var(--line); }
.bar{ display:flex; align-items:center; justify-content:space-between; height:64px; }
.brand img{ height:26px; width:auto; }
.back{ font-size:14px; font-weight:600; color:var(--ink); text-decoration:none; }
.back:hover{ color:var(--teal-ink); }

.doc{ padding-top:40px; padding-bottom:64px; }
.draft{ font-size:13px; color:var(--ink); background:var(--teal-wash); border-left:3px solid var(--teal);
        padding:10px 14px; margin:0 0 32px; }
.eyebrow{ font-family:var(--mono); font-size:12px; font-weight:500; letter-spacing:.16em;
          text-transform:uppercase; color:var(--teal-ink); margin:0; }
h1{ font-family:var(--serif); font-weight:600; letter-spacing:-.02em; font-size:clamp(32px,5vw,44px);
    line-height:1.12; margin:12px 0 6px; }
.updated{ font-size:13px; color:var(--faint); margin:0 0 28px; }
h2{ font-family:var(--sans); font-weight:600; font-size:19px; margin:34px 0 8px; }
.doc p, .doc li{ color:var(--muted); }
/* ".doc p" outranks a bare class, so these three restate their colour at the
   same weight - without this the teal label and the draft banner came out grey */
.doc .draft{ color:var(--ink); }
.doc .eyebrow{ color:var(--teal-ink); }
.doc .updated{ color:var(--faint); }
.doc b{ color:var(--ink); }
.doc ul{ padding-left:20px; }
.doc li{ margin-bottom:10px; }

footer{ border-top:1px solid var(--line); }
.foot{ display:flex; flex-wrap:wrap; gap:12px 24px; align-items:center; justify-content:space-between;
       padding-top:24px; padding-bottom:32px; font-size:13px; color:var(--faint); }
.foot nav{ display:flex; gap:20px; }
.foot a{ color:var(--faint); text-decoration:none; }
.foot a:hover, .foot a[aria-current]{ color:var(--teal-ink); }