/* ==========================================================================
   TeamTally : legal page prose styles (terms.html / privacy.html)
   Built on the shared design system tokens. Readable long-form layout.
   ========================================================================== */
.legal { max-width: var(--container-narrow); }

.legal h1 { margin-bottom: var(--space-2); }
.legal h2 {
  margin-top: var(--space-7);
  margin-bottom: var(--space-2);
  color: var(--accent-strong);
}
.legal p { margin-bottom: var(--space-4); line-height: var(--lh-relaxed); }
.legal ul { margin: 0 0 var(--space-4); padding-left: 1.4em; }
.legal ul li { margin-bottom: var(--space-2); line-height: var(--lh-normal); }
.legal aside.a4t-card { margin: var(--space-5) 0; }
.legal aside.a4t-card ul { margin-top: var(--space-2); margin-bottom: 0; }
.legal aside.a4t-card li { color: var(--text-muted); }

.legal-meta { margin-bottom: var(--space-5); line-height: var(--lh-relaxed); }
.legal-sig { color: var(--text-muted); }

.legal code {
  background: var(--bg-sunken);
  padding: 0.1em 0.4em;
  border-radius: var(--radius-xs);
}

/* Legal banner — sticky-note styled, full width, always legible. */
.draft-banner {
  display: block;
  max-width: none;
  margin: var(--space-5) 0;
  rotate: 0deg;
}
.draft-banner::after { display: none; }