/* Styling for the static legal pages. These live outside the SPA bundle, so
   they carry their own copy of the design tokens rather than importing the
   app's hashed stylesheet. Kept deliberately small and dependency-free. */

:root {
  --bg: #ffffff;
  --fg: #1a1a1a;
  --muted: #6b7280;
  --border: #e5e7eb;
  --link: #c1272d;
  color-scheme: light dark;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0f1115;
    --fg: #f3f4f6;
    --muted: #9ca3af;
    --border: #262b36;
    --link: #ff6b6b;
  }
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  padding: 1.5rem 1rem 4rem;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  line-height: 1.65;
  background: var(--bg);
  color: var(--fg);
}

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

a {
  color: var(--link);
}

:focus-visible {
  outline: 2px solid var(--link);
  outline-offset: 2px;
  border-radius: 4px;
}

.masthead {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: baseline;
  justify-content: space-between;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--border);
}

.wordmark {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--link);
  text-decoration: none;
}

h1 {
  font-size: 1.75rem;
  margin: 2rem 0 0.25rem;
}

h2 {
  font-size: 1.15rem;
  margin: 2.25rem 0 0.5rem;
}

h3 {
  font-size: 1rem;
  margin: 1.5rem 0 0.35rem;
}

.effective {
  color: var(--muted);
  font-size: 0.9rem;
  margin: 0 0 1.5rem;
}

.summary {
  border: 1px solid var(--border);
  border-left: 3px solid var(--link);
  border-radius: 8px;
  padding: 0.85rem 1rem;
  margin: 1.5rem 0;
}

.summary p {
  margin: 0;
}

dl {
  margin: 0.5rem 0;
}

dt {
  font-weight: 600;
  margin-top: 0.85rem;
}

dd {
  margin: 0.15rem 0 0;
  color: var(--muted);
}

table {
  width: 100%;
  border-collapse: collapse;
  margin: 1rem 0;
  font-size: 0.95rem;
}

th,
td {
  text-align: left;
  vertical-align: top;
  padding: 0.5rem 0.6rem;
  border-bottom: 1px solid var(--border);
}

th {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}

/* Wide content must scroll inside itself, never the page. */
.table-wrap {
  overflow-x: auto;
}

address {
  font-style: normal;
  color: var(--muted);
}

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