/* Shared layout for the About & Credits and Privacy Policy pages. Colours come from
   shared/site.css variables, so light and dark mode both work. */
.legal-page {
  max-width: 760px;
  margin: 0 auto;
  padding: 8px 16px 48px;
}
.legal-page article {
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  padding: 24px clamp(16px, 4vw, 36px);
  line-height: 1.75;
  font-size: 15px;
}
.legal-page h1 { color: var(--text-strong); font-size: 26px; margin: 0 0 12px; }
.legal-page h2 { color: var(--text-strong); font-size: 18px; margin: 28px 0 8px; }
.legal-page ul { padding-left: 1.3em; margin: 8px 0; }
.legal-page li { margin: 4px 0; }
.legal-page a { color: var(--accent-ink); text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; }
.legal-page .legal-date { font-size: 13px; opacity: 0.75; margin-top: -4px; }