/* LEGAL — fills viewport, comfy measure, robust against globals */
html, body { height: 100%; margin: 0; }

.app-main.narrow.prose {
  min-height: calc(100vh - var(--header-h, 70px));
  padding: 24px clamp(12px, 3vw, 32px) 48px;
  background: var(--color-bg, #fff);
  color: var(--color-fg, #111827);
  line-height: 1.65;
}

/* Limit standalone blocks (e.g., the "Last updated" line) */
.app-main.narrow.prose > :not(.card) {
  max-width: 72ch !important;
  margin-inline: auto;
}

/* Cards hold most content on this page — keep them centered and capped */
.app-main.narrow.prose .card {
  background: var(--color-surface, #fff);
  border: 1px solid var(--color-border, #e5e7eb);
  border-radius: 14px;
  padding: 18px 18px 16px;
  margin: 16px auto 20px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.03);

  width: 100%;
  max-width: 84ch !important; /* <- beat any global wider rules */
}
.app-main.narrow.prose .card > h2:first-child { margin-top: 0.1rem; }

/* Headings */
.app-main.narrow.prose h1 {
  font-size: clamp(1.8rem, 1.25rem + 1.8vw, 2.4rem);
  line-height: 1.2; margin: 0 0 0.75em; letter-spacing: -0.01em;
}
.app-main.narrow.prose h2 {
  font-size: clamp(1.25rem, 1rem + 0.8vw, 1.5rem);
  line-height: 1.3; margin: 0 0 0.6em;
}
.app-main.narrow.prose p, .app-main.narrow.prose ul, .app-main.narrow.prose ol { margin: 0 0 1em; }
.app-main.narrow.prose .muted { color: var(--color-fg-muted, #6b7280); }

/* Links + focus */
.app-main.narrow.prose a { color: var(--color-link, #1d4ed8); text-decoration: underline; text-underline-offset: 2px; }
.app-main.narrow.prose a:hover, .app-main.narrow.prose a:focus-visible { color: var(--color-accent, #e67e00); text-decoration-thickness: 2px; }
.app-main.narrow.prose :where(a,button,[tabindex],input,select,textarea):focus-visible {
  outline: 2px solid var(--color-accent, #e67e00); outline-offset: 2px; border-radius: 6px;
}

/* Inline code */
.app-main.narrow.prose code {
  background: var(--color-code-bg, #f5f7fb);
  padding: 0.1em 0.35em; border-radius: 6px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; font-size: 0.95em;
}

/* Tables: scroll horizontally when needed */
.app-main.narrow.prose table {
  width: 100%; border-collapse: collapse; border: 1px solid var(--color-border, #e5e7eb);
  border-radius: 12px; overflow: hidden; display: block; overflow-x: auto; -webkit-overflow-scrolling: touch;
}
.app-main.narrow.prose thead th {
  text-align: left; font-weight: 600; background: var(--color-surface-2, #fafafa);
  border-bottom: 1px solid var(--color-border, #e5e7eb); padding: 10px 12px; white-space: nowrap;
}
.app-main.narrow.prose tbody td {
  padding: 10px 12px; border-bottom: 1px solid var(--color-border, #e5e7eb); vertical-align: top;
}
.app-main.narrow.prose tbody tr:nth-child(even) td {
  background: color-mix(in srgb, var(--color-surface-2, #fafafa) 70%, transparent);
}

/* ≤ 1300px */
@media (max-width: 1300px) {
  .app-main.narrow.prose { padding: 20px clamp(10px, 3vw, 22px) 36px; }
  .app-main.narrow.prose .card { max-width: 95ch !important; }
}

/* Print */
@media print {
  .app-main.narrow.prose { padding: 0; background: #fff; color: #000; min-height: auto; }
  .app-main.narrow.prose .card { box-shadow: none; page-break-inside: avoid; max-width: none !important; }
  .app-main.narrow.prose a { color: #000; text-decoration: underline; }
}