/* Shared styling for legal/compliance pages.
   EXTERNAL on purpose: server.mjs sets `style-src 'self'` with no 'unsafe-inline',
   so an inline <style> block is silently BLOCKED and the page renders unstyled.
   That is the same failure that killed styling across the brand SPAs on 2026-06-03
   (a CSP-blocked stylesheet swap behind an all-green HTTP-200 audit). Keep CSS in
   this file; do not move it inline. */

:root {
  --maroon: #531C29;
  --gold: #DFA21F;
  --ink: #1a1a1a;
  --paper: #ffffff;
  --rule: #e5e5e5;
  --muted: #666666;
}

body {
  margin: 0;
  padding: 2rem 1.25rem;
  font: 16px/1.65 -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--ink);
  background: var(--paper);
}

main { max-width: 42rem; margin: 0 auto; }

h1 {
  color: var(--maroon);
  border-bottom: 3px solid var(--gold);
  padding-bottom: 0.4rem;
}

h2 { color: var(--maroon); margin-top: 2rem; font-size: 1.15rem; }

li { margin: 0.3rem 0; }

hr { border: 0; border-top: 1px solid var(--rule); margin: 2rem 0; }

table { border-collapse: collapse; width: 100%; margin: 1rem 0; }
th, td { text-align: left; padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--rule); }
th { color: var(--muted); font-weight: 600; font-size: 0.85rem; text-transform: uppercase; }

footer {
  margin-top: 3rem;
  padding-top: 1rem;
  border-top: 1px solid var(--rule);
  color: var(--muted);
  font-size: 0.9rem;
}

@media (prefers-color-scheme: dark) {
  :root {
    --ink: #e8e8e8;
    --paper: #141414;
    --rule: #333333;
    --muted: #9a9a9a;
  }
  h1, h2 { color: var(--gold); }
}