/* ==========================================================================
   Legal pages — readable long-form prose + cookie table (doc 05 §4).
   ========================================================================== */

.legal__container { max-width: 52rem; }
.legal__header { margin-bottom: var(--sp-7); padding-bottom: var(--sp-5); border-bottom: 1px solid var(--border); }
.legal__header h1 { margin: var(--sp-3) 0 var(--sp-3); }
.legal__meta { margin: 0; }
.legal__draft { color: var(--error); font-weight: 600; }

/* Prose (self-contained so this template doesn't depend on article.css) */
.legal__body { max-width: none; font-size: var(--fs-body); line-height: 1.7; color: var(--text); }
.legal__body p { max-width: none; margin: 0 0 1.15em; }
.legal__body h2 {
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-h3);
  line-height: 1.3; margin: 1.8em 0 0.5em; letter-spacing: -0.01em;
}
.legal__body h2:first-child { margin-top: 0; }
.legal__body ul { margin: 0 0 1.2em; padding-left: 1.4em; }
.legal__body li { margin-bottom: 0.5em; }
.legal__body li::marker { color: var(--accent-deep); }
.legal__body a { color: var(--accent-deep); text-decoration: underline; text-underline-offset: 3px; }
.legal__body a:hover { color: var(--accent-deep-hover); }
.legal__body strong { font-weight: 700; }
.legal__body code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.9em; background: var(--surface); padding: 0.1em 0.35em; border-radius: 4px; }

/* Cookie table */
.legal__table-wrap { overflow-x: auto; margin: 0 0 1.4em; -webkit-overflow-scrolling: touch; }
.legal__table {
  width: 100%; border-collapse: collapse; font-size: var(--fs-small);
  min-width: 640px; font-feature-settings: "tnum";
}
.legal__table th, .legal__table td {
  text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--border); vertical-align: top;
}
.legal__table thead th {
  background: var(--surface); font-weight: 700; color: var(--text);
  border-bottom: 2px solid var(--border);
}
.legal__table tbody tr:hover { background: var(--surface); }
