@charset "utf-8";
/* ═══════════════════════════════════════════════════════════════════════════
   LEGAL PAGES — privacy notice, terms of service

   These are the two pages on the site most likely to be read carefully and
   least likely to be read willingly, so the whole treatment is aimed at making
   a long document navigable: one narrow measure, generous leading, headings
   that are genuinely scannable, and a boxed summary at the top that says the
   important part before anyone has to earn it.

   Every value below is an existing token from styles.css. Nothing new.
   ═══════════════════════════════════════════════════════════════════════════ */

.legal{padding-block:var(--gap-md) var(--gap-lg)}
.legal .shell{max-width:820px}          /* narrower than the marketing measure */

.legal__head{
  padding-bottom:var(--s5,24px);
  margin-bottom:var(--gap-sm);
  border-bottom:1px solid var(--line);
}
.legal__head h1{
  font-size:var(--fs-3xl);letter-spacing:var(--tr-xl);
  line-height:1.06;margin:8px 0 0;
}
.legal__lede{
  font-size:var(--fs-lg);color:var(--slate);
  margin:16px 0 0;max-width:56ch;
}
.legal__meta{
  font-family:var(--mono,ui-monospace,monospace);
  font-size:var(--fs-2xs);color:var(--slate-300);
  letter-spacing:var(--tr-xs);margin:20px 0 0;
}

/* ── running text ───────────────────────────────────────────────────────── */
.legal__body{font-size:var(--fs-md);color:var(--slate);line-height:1.72}
.legal__body h2{
  font-size:var(--fs-xl);letter-spacing:var(--tr-lg);color:var(--ink);
  margin:var(--gap-sm) 0 12px;scroll-margin-top:96px;
}
.legal__body h2:first-child{margin-top:0}
.legal__body h3{
  font-size:var(--fs-lg);letter-spacing:var(--tr-md);color:var(--ink);
  margin:28px 0 8px;
}
.legal__body p{margin:0 0 14px;max-width:68ch}
.legal__body b{color:var(--ink);font-weight:600}
.legal__body a{color:var(--brand);text-underline-offset:2px}

.legal__body ul{margin:0 0 18px;padding-left:20px;max-width:68ch}
.legal__body li{margin-bottom:8px}
.legal__body li::marker{color:var(--brand-200)}

/* ── the summary box ────────────────────────────────────────────────────────
   Deliberately first and deliberately loud. Someone who reads only this should
   still come away with an accurate picture; that is the test it has to pass. */
.legal__box{
  background:var(--bg-subdued);
  border:1px solid var(--line);
  border-radius:var(--r-md);
  padding:var(--s5,24px);
  margin:0 0 var(--gap-sm);
}
.legal__box h2{margin-top:0}
.legal__box p:last-child{margin-bottom:0}

/* Honesty note about review status. Marked with the brand rule rather than a
   warning colour — it is a disclosure, not an error. */
.legal__note{
  border-left:2px solid var(--brand);
  background:var(--brand-25);
  border-radius:0 var(--r-sm) var(--r-sm) 0;
  padding:16px 20px;
  margin:var(--gap-sm) 0 0;
  font-size:var(--fs-sm);
}
.legal__note p:last-child{margin-bottom:0}

/* ── the processor table ────────────────────────────────────────────────── */
.legal .scroll{
  overflow-x:auto;
  border:1px solid var(--line);
  border-radius:var(--r-md);
  margin:0 0 18px;
}
.legal table{border-collapse:collapse;width:100%;font-size:var(--fs-sm);min-width:460px}
.legal th,.legal td{
  text-align:left;padding:10px 16px;
  border-bottom:1px solid var(--line-soft);vertical-align:top;
}
.legal th{
  background:var(--sunk,var(--bg-subdued));
  font-size:var(--fs-3xs);letter-spacing:var(--tr-caps);text-transform:uppercase;
  color:var(--slate-300);font-weight:600;white-space:nowrap;
}
.legal tr:last-child td{border-bottom:0}

@media (max-width:720px){
  .legal__head h1{font-size:var(--fs-2xl)}
  .legal__body{font-size:var(--fs-sm)}
}