/* The Privacy Policy and Terms of Service (app/privacy/, app/terms/). Load after tokens.css and site.css. */
.legal .lede { font-size: 19px; max-width: 62ch; margin: 0 0 var(--s5); }

.legal .contents { border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); padding: var(--s3) 0; margin-bottom: var(--s5); }
.legal .contents .label { margin: 0 0 var(--s2); }
.legal .contents ol, .legal .contents ul { columns: 2; column-gap: var(--s6); margin: 0; padding-left: var(--s5); }
.legal .contents ul { list-style: none; padding-left: 0; }  /* the Terms' headings carry their own numbers */
.legal .contents li { break-inside: avoid; margin-bottom: var(--s1); }

.legal section { padding-top: var(--s4); }
.legal section h2 { margin-top: var(--s3); }
.legal ul, .legal ol { max-width: 70ch; }
.legal li { margin-bottom: var(--s2); }
.legal address { font-style: normal; }

/* Tables of facts: Source Sans, top-aligned. On a phone each row stacks, with its column heading above each value. */
.legal table { font-size: 14px; margin: var(--s3) 0 var(--s4); }
.legal td { height: auto; vertical-align: top; padding: var(--s2); }
.legal th { vertical-align: bottom; }
@media (max-width: 640px) {
  .legal .contents ol, .legal .contents ul { columns: 1; }
  .legal thead { display: none; }
  .legal table, .legal tbody, .legal tr, .legal td { display: block; }
  .legal tr { border-top: 1px solid var(--forest); padding: var(--s2) 0; }
  .legal td { border: 0; padding: var(--s1) 0; }
  .legal td::before { content: attr(data-label); display: block; font-variant: small-caps; letter-spacing: 0.04em; color: var(--text-muted); }
}
