/* Long-form pages (handbook, reports). Loads after site.css and reuses its tokens. */
.doc-head { padding: var(--space-3xl) 0 var(--space-2xl); border-bottom: var(--rule-hair) solid var(--color-rule); }
.kicker { font-family: var(--font-mono); font-size: var(--text-sm); color: var(--color-accent); }
.doc-head h1 { margin-top: var(--space-sm); font-size: var(--text-3xl); max-width: 22ch; }
.doc-head .lede { margin-top: var(--space-lg); font-size: var(--text-lg); color: var(--color-ink-2); max-width: var(--measure); }
.doc-head .byline { margin-top: var(--space-lg); font-size: var(--text-sm); color: var(--color-ink-3); }

.doc .wrap { display: grid; grid-template-columns: minmax(0, 14rem) minmax(0, 1fr); gap: var(--space-3xl); padding-top: var(--space-2xl); padding-bottom: var(--space-3xl); }
.toc { position: sticky; top: 5rem; align-self: start; font-size: var(--text-sm); }
.toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-xs); }
.toc a { color: var(--color-ink-2); text-decoration: none; }
.toc a:hover { color: var(--color-accent); }

.prose { max-width: var(--measure); }
.prose section + section { margin-top: var(--space-3xl); padding-top: var(--space-2xl); border-top: var(--rule-hair) solid var(--color-rule); }
.prose h2 { font-size: var(--text-2xl); scroll-margin-top: 5rem; }
.prose h3 { font-size: var(--text-lg); margin-top: var(--space-xl); }
.prose p, .prose ul, .prose ol, .prose table { margin-top: var(--space-md); color: var(--color-ink-2); }
.prose ul, .prose ol { padding-left: 1.25rem; display: grid; gap: var(--space-xs); }
.prose strong { color: var(--color-ink); font-weight: 600; }
.prose a { color: var(--color-accent); text-underline-offset: 3px; }
.prose blockquote { margin: var(--space-lg) 0 0; padding-left: var(--space-lg); border-left: 2px solid var(--color-accent); font-family: var(--font-display); font-size: var(--text-lg); color: var(--color-ink); }
.prose .note { font-size: var(--text-sm); color: var(--color-ink-3); }
.prose .num { font-family: var(--font-mono); font-size: var(--text-sm); color: var(--color-accent); }

.ladder { width: 100%; border-collapse: collapse; font-size: var(--text-sm); }
.ladder th, .ladder td { text-align: left; vertical-align: top; padding: var(--space-sm) var(--space-sm) var(--space-sm) 0; border-bottom: var(--rule-hair) solid var(--color-rule); }
.ladder th { color: var(--color-ink); font-weight: 600; border-bottom-color: var(--color-ink); }

.checklist { list-style: none; padding-left: 0 !important; }
.checklist li { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr); }
.checklist li::before { content: "☐"; color: var(--color-accent); }

.takeaway { margin-top: var(--space-md); padding: var(--space-md) var(--space-lg); background: var(--color-paper-2); border-radius: var(--radius-md); color: var(--color-ink-2); }
.takeaway strong { display: block; font-size: var(--text-sm); color: var(--color-accent); }
.sources { font-size: var(--text-sm); }

.doc-cta { padding: var(--space-3xl) 0; background: var(--color-accent-soft); }
.doc-cta .wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-lg); }
.doc-cta h2 { font-size: var(--text-2xl); max-width: 28ch; }
.doc-cta p { margin-top: var(--space-xs); color: var(--color-ink-2); max-width: 48ch; }

.report-list { list-style: none; margin: 0; padding: 0; border-top: var(--rule-hair) solid var(--color-ink); }
.report-list li { padding: var(--space-lg) 0; border-bottom: var(--rule-hair) solid var(--color-rule); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-2xs) var(--space-lg); }
.report-list h3 { font-size: var(--text-xl); margin: 0; }
.report-list h3 a { color: var(--color-ink); text-decoration-color: var(--color-rule); }
.report-list h3 a:hover { text-decoration-color: var(--color-accent); }
.report-list .meta { font-family: var(--font-mono); font-size: var(--text-sm); color: var(--color-accent); white-space: nowrap; }
.report-list p { grid-column: 1 / -1; margin: 0; }

@media (max-width: 960px) {
  .doc .wrap { grid-template-columns: minmax(0, 1fr); gap: var(--space-xl); }
  .toc { position: static; }
}
@media (max-width: 720px) {
  .ladder th:nth-child(3), .ladder td:nth-child(3) { display: none; }
  .report-list li { grid-template-columns: minmax(0, 1fr); }
}
@media print {
  .nav, .toc, .doc-cta, .footer { display: none; }
  .doc .wrap { display: block; }
}

/* Content gate: hook stays public, the rest loads after sign-in (js/gate.js) */
.prose [data-gated] > section { margin-top: var(--space-3xl); padding-top: var(--space-2xl); border-top: var(--rule-hair) solid var(--color-rule); }
.gate { margin-top: var(--space-3xl); padding: var(--space-xl); border: var(--rule-hair) solid var(--color-rule); border-radius: var(--radius-md); background: var(--color-accent-soft); }
.gate[hidden] { display: none; }
.gate h2 { font-size: var(--text-2xl); }
.gate p { margin-top: var(--space-sm); color: var(--color-ink-2); }
.gate-actions { margin-top: var(--space-lg); display: flex; flex-wrap: wrap; gap: var(--space-sm); }
.split .gate { margin-top: 0; }