/* Shared review-package theme. Local system fonts and protected assets only. */
:root {
  --black: #000;
  --white: #fff;
  --ink: #1d1d1f;
  --muted: #64646a;
  --hairline: #dedee3;
  --smoke: #f5f5f7;
  --accent: #0a5cff;
  --blue-tint: #f4f7ff;
  --sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 98px; }
body { margin: 0; background: var(--white); color: var(--ink); font-family: var(--sans); font-size: 18px; line-height: 1.7; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
::selection { background: #dce7ff; color: var(--black); }
a { color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: 4px; }
a:hover { text-decoration-thickness: 2px; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: default; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; border-radius: 2px; }
img, video, svg { max-width: 100%; }
video { display: block; width: 100%; height: auto; background: #111; border-radius: 8px; }
button, a, summary { -webkit-tap-highlight-color: rgba(10, 92, 255, .12); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: -100px; left: 20px; z-index: 100; background: var(--white); color: var(--black); padding: 12px 18px; border: 2px solid var(--accent); border-radius: 4px; }
.skip-link:focus { top: 12px; }

/* Familiar black wordmark bar, with no newsletter or analytics widgets. */
.site-header { position: sticky; top: 0; z-index: 20; color: var(--white); background: #000; }
.site-header-inner { max-width: 1184px; min-height: 64px; margin: 0 auto; padding: 12px 32px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.site-brand { font-size: 16px; line-height: 1.3; font-weight: 700; letter-spacing: -.02em; color: var(--white); text-decoration: none; }
.brand-dot { color: #6fa2ff; }
.site-header-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px 16px; }
.site-advertise { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 16px; flex: none; border: 1px solid #fff; border-radius: 999px; color: #000; background: #fff; font-size: 12px; line-height: 1.4; font-weight: 600; text-decoration: none; white-space: nowrap; }
.site-advertise:hover { background: #ededf0; border-color: #ededf0; color: #000; }
.site-advertise:focus-visible { outline: 2px solid #8eb8ff; outline-offset: 3px; border-radius: 999px; }
.private-badge { flex: none; color: #c0c0c6; font-size: 11px; font-weight: 500; letter-spacing: .02em; white-space: nowrap; }
.private-badge span { color: #82aaff; padding-right: 6px; font-size: 8px; vertical-align: 1px; }
.reading-progress { appearance: none; -webkit-appearance: none; position: absolute; bottom: 0; display: block; width: 100%; height: 2px; border: 0; background: transparent; color: #74a1ff; }
.reading-progress::-webkit-progress-bar { background: transparent; }
.reading-progress::-webkit-progress-value { background: #74a1ff; }
.reading-progress::-moz-progress-bar { background: #74a1ff; }
.series-bar { border-bottom: 1px solid #ececf0; }
.series-nav { max-width: 1184px; margin: 0 auto; padding: 0 32px; display: flex; align-items: stretch; gap: 30px; overflow-x: auto; overscroll-behavior-inline: contain; }
.series-nav a { flex: none; display: flex; align-items: center; min-height: 49px; color: var(--muted); font-size: 12px; font-weight: 550; text-decoration: none; border-bottom: 2px solid transparent; padding: 2px 0 0; white-space: nowrap; }
.series-nav a:hover { color: var(--black); }
.series-nav a[aria-current="page"] { color: var(--black); border-bottom-color: var(--accent); }
.series-nav a:focus-visible { outline-offset: -5px; }

/* A deliberate long-form reading measure, with navigation off the text column. */
.page-shell { max-width: 1184px; margin: 0 auto; padding: 0 32px; }
.article-header { max-width: 784px; padding: 59px 0 39px; }
.eyebrow { display: block; margin: 0; color: var(--muted); font-size: 11px; font-weight: 650; letter-spacing: .11em; line-height: 1.5; text-transform: uppercase; }
.article-header > .eyebrow { margin-bottom: 17px; color: var(--accent); }
h1 { color: var(--black); font-size: clamp(2.65rem, 6.5vw, 4.85rem); letter-spacing: -.055em; line-height: 1.04; font-weight: 700; margin: 0; text-wrap: balance; }
.dek { max-width: 650px; margin: 22px 0 0; font-size: clamp(1.125rem, 2vw, 1.35rem); line-height: 1.5; letter-spacing: -.015em; color: var(--muted); text-wrap: pretty; }
.byline { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 22px; margin-top: 25px; font-size: 12px; color: var(--muted); line-height: 1.6; font-variant-numeric: tabular-nums; }
.byline-author { font-weight: 650; color: var(--black); }
.byline time:empty { display: none; }
.reading-layout { display: grid; grid-template-columns: minmax(0, 752px) minmax(180px, 1fr); gap: 66px; align-items: start; }
.reading-column { min-width: 0; }
.prose { font-size: 19px; line-height: 1.79; letter-spacing: -.012em; overflow-wrap: break-word; }
.prose p { margin: 0 0 26px; }
.prose h2 { color: var(--black); margin: 65px 0 25px; font-size: clamp(1.85rem, 3vw, 2.25rem); letter-spacing: -.035em; line-height: 1.16; font-weight: 700; text-wrap: balance; scroll-margin-top: 98px; }
.prose h3 { color: var(--black); margin: 43px 0 19px; font-size: 25px; letter-spacing: -.028em; line-height: 1.25; font-weight: 650; text-wrap: balance; scroll-margin-top: 98px; }
.prose h4 { color: var(--black); margin: 26px 0 12px; font-size: 19px; letter-spacing: -.02em; line-height: 1.35; }
.prose strong { color: var(--black); font-weight: 650; }
.prose ul, .prose ol { margin: 0 0 28px; padding-left: 25px; }
.prose li { padding-left: 3px; margin: 9px 0; }
.prose li::marker { color: var(--muted); }
.prose li > p { margin-bottom: 12px; }
.prose blockquote { margin: 33px 0; padding: 1px 0 1px 22px; border-left: 3px solid var(--accent); }
.prose blockquote p:last-child { margin-bottom: 0; }
.prose hr { margin: 44px 0; height: 1px; border: 0; background: var(--hairline); }
.prose > p:last-child { margin-bottom: 0; }
.prose figure { margin: 33px 0; }
.prose figcaption { font-size: 12px; line-height: 1.6; color: var(--muted); margin-top: 12px; letter-spacing: 0; }
.prose code { font-family: var(--mono); font-size: .83em; background: var(--smoke); border-radius: 4px; padding: .12em .28em; overflow-wrap: anywhere; }
.prose pre { max-width: 100%; overflow-x: auto; padding: 22px; background: var(--smoke); border: 1px solid var(--hairline); border-radius: 10px; font-family: var(--mono); font-size: 13px; line-height: 1.75; white-space: pre-wrap; word-wrap: break-word; letter-spacing: 0; }
.prose pre code { padding: 0; font-size: inherit; border: 0; }
.prose table { width: 100%; border-collapse: collapse; text-align: left; font-size: 14px; line-height: 1.6; margin: 24px 0; }
.prose th { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 600; border-bottom: 1px solid var(--black); padding: 12px 14px; }
.prose td { border-bottom: 1px solid var(--hairline); vertical-align: top; padding: 16px 14px; }
.prose th:first-child, .prose td:first-child { padding-left: 0; }
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; margin: 28px 0; }
.table-wrap table { min-width: 470px; margin: 0; }
.intro { padding-top: 34px; scroll-margin-top: 100px; }
.intro p:first-child { font-size: 22px; line-height: 1.65; letter-spacing: -.019em; color: var(--black); }
.prose > p.intro { padding-top: 0; font-size: 22px; line-height: 1.65; letter-spacing: -.019em; color: var(--black); }
.intro p:last-child { margin-bottom: 0; }
.tldr { padding: 29px 32px 31px; background: var(--blue-tint); border-top: 2px solid var(--accent); border-radius: 0 0 10px 10px; }
.prose .tldr h2 { margin: 0 0 17px; color: var(--accent); font-size: 12px; font-weight: 700; line-height: 1.4; letter-spacing: .075em; }
.prose .tldr p { font-size: 17px; line-height: 1.75; margin-bottom: 19px; }
.prose .tldr p:last-child { margin-bottom: 0; }

/* The review follows the centered reading column and TL;DR of earlier reviews. */
.review-page .page-shell, .centered-page .page-shell { max-width: 816px; }
.review-page .article-header, .centered-page .article-header { max-width: none; }
.review-page .reading-layout, .centered-page .reading-layout { display: block; }
.review-page .tldr { padding: 26px 28px; border: 1px solid var(--hairline); border-radius: 16px; background: var(--smoke); }
.review-page .tldr h2 { margin: 0 0 14px; font-size: 18px; line-height: 1.4; letter-spacing: -.014em; color: var(--black); }
.review-page .tldr ul { margin: 0; padding-left: 20px; }
.review-page .tldr li { margin: 0 0 10px; padding-left: 0; font-size: 15px; line-height: 1.65; letter-spacing: -.006em; }
.review-page .tldr li:last-child { margin-bottom: 0; }
.review-page .tldr > ul + ul { margin-top: 10px; }
.review-page .tldr-divider { height: 1px; margin: 22px 0; border: 0; background: var(--hairline); }
.review-page .tldr-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.review-page .tldr-grid h3 { margin: 0 0 10px; font-size: 12px; font-weight: 700; line-height: 1.5; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }

/* Coming-soon signup; the optional profile uses the shared homepage UI. */
.manager-loop-waitlist { max-width: 640px; margin: 34px 0 0; }
.waitlist-form { margin: 0; }
.waitlist-form label { display: block; margin-bottom: 9px; color: var(--ink); font-size: 14px; font-weight: 600; line-height: 1.5; }
.waitlist-fields { display: flex; align-items: stretch; gap: 10px; }
.waitlist-fields input { display: block; min-width: 0; width: 100%; flex: 1; min-height: 54px; padding: 12px 15px; border: 1px solid #a8a8b1; border-radius: 7px; color: var(--ink); background: var(--white); font-size: 16px; line-height: 1.5; }
.waitlist-fields button { flex: none; min-height: 54px; padding: 12px 20px; border: 1px solid var(--black); border-radius: 7px; background: var(--black); color: var(--white); font-size: 14px; line-height: 1.5; font-weight: 600; }
.waitlist-fields button:hover:not(:disabled) { background: #29292d; border-color: #29292d; }
.waitlist-fields :disabled { opacity: .6; }
.prose .waitlist-message, .prose .manager-loop-waitlist .sub-msg { margin: 15px 0 0; font-size: 15px; line-height: 1.6; letter-spacing: 0; }
.waitlist-message:empty, .manager-loop-waitlist .sub-msg:empty { display: none; }
.manager-loop-waitlist .sub-msg { color: #a11b20; }
.waitlist-message.is-error { color: #a11b20; }
.waitlist-message.is-success { padding: 13px 16px; border-left: 3px solid #237449; border-radius: 0 5px 5px 0; color: #195434; background: #f0f8f3; }
.prose .waitlist-privacy { margin: 15px 0 0; font-size: 12px; line-height: 1.7; letter-spacing: 0; color: var(--muted); }
@media (max-width: 560px) {
  .waitlist-page .article-header h1 { font-size: clamp(2.3rem, 9vw, 3rem); letter-spacing: -.045em; line-height: 1.08; }
  .waitlist-fields { flex-direction: column; gap: 12px; }
  .waitlist-fields button { width: 100%; }
}

/* Inline media stays on our protected origin; comparison pairs share a row. */
.review-media { margin: 34px 0; }
.review-media.is-comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; align-items: start; }
.prose .review-media > figure { margin: 0; min-width: 0; }
.review-media > figure:only-child { grid-column: 1 / -1; }
.prose .media-label { margin: 0 0 10px; font-size: 15px; line-height: 1.4; font-weight: 650; color: var(--black); }
.review-media img, .review-media video { display: block; width: 100%; height: auto; border-radius: 9px; background: #111; }
.review-media.is-comparison img, .review-media.is-comparison video { aspect-ratio: 16 / 9; object-fit: contain; }
.prose .review-media figcaption { font-size: 12px; line-height: 1.65; margin: 11px 0 0; }
.media-pending-frame { display: flex; align-items: center; justify-content: center; aspect-ratio: 16 / 9; padding: 24px; border: 1px dashed var(--hairline); border-radius: 9px; background: var(--smoke); color: var(--muted); text-align: center; font-size: 13px; line-height: 1.6; }
@media (min-width: 1100px) {
  .review-page .review-media.is-comparison { margin-left: -128px; margin-right: -128px; }
}
@media (max-width: 640px) {
  .review-page .tldr { padding: 22px 20px; }
  .review-page .tldr-grid, .review-media.is-comparison { grid-template-columns: 1fr; gap: 24px; }
}

/* Private notes are deliberately distinct from the author's article. */
.editorial-note { padding: 20px 23px 21px; margin-bottom: 29px; border: 1px solid #d9e3fc; border-radius: 9px; background: #fff; letter-spacing: 0; }
.status-label { display: flex; align-items: center; gap: 7px; color: var(--accent); font-size: 10px; letter-spacing: .065em; text-transform: uppercase; font-weight: 650; line-height: 1.5; }
.status-dot { width: 5px; height: 5px; border-radius: 100%; background: currentColor; }
.editorial-note h2 { font-size: 17px; line-height: 1.4; font-weight: 650; letter-spacing: -.014em; margin: 8px 0; color: var(--black); }
.editorial-note p { color: var(--muted); font-size: 13px; line-height: 1.65; margin: 8px 0 0; }
.editorial-checks { list-style: none; padding: 13px 0 0; margin: 13px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 17px; border-top: 1px solid #e8edf8; }
.editorial-checks li { padding: 0; margin: 0; font-size: 11px; line-height: 1.6; color: var(--muted); }
.evidence-card { padding: 22px 25px 20px; margin: 32px 0; border: 1px solid var(--hairline); border-left: 3px solid #8aacfa; border-radius: 0 9px 9px 0; background: #fff; letter-spacing: 0; }
.evidence-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; justify-content: space-between; color: var(--muted); font-size: 9px; font-weight: 600; line-height: 1.5; text-transform: uppercase; letter-spacing: .075em; }
.evidence-status { color: #4c628e; }
.prose .evidence-card h3 { font-size: 20px; line-height: 1.3; margin: 12px 0 8px; letter-spacing: -.025em; }
.prose .evidence-card p { font-size: 14px; line-height: 1.7; color: var(--muted); margin: 0 0 13px; }
.evidence-link { display: inline-flex; align-items: center; gap: 8px; min-height: 34px; font-size: 12px; font-weight: 600; line-height: 1.5; text-decoration: none; }
.evidence-link:hover { text-decoration: underline; }
.source-details { margin-top: 13px; padding-top: 12px; border-top: 1px solid #e9e9ee; }
.source-details summary { font-size: 11px; line-height: 1.6; color: var(--muted); cursor: pointer; padding: 4px 0; }
.prose .source-details ul { list-style: none; padding: 0; margin: 11px 0 0; }
.prose .source-details li { margin: 8px 0 0; padding: 0; font-size: 11px; line-height: 1.6; color: var(--muted); }
.source-details code { font-size: 10px; display: block; background: none; padding: 0; margin-bottom: 3px; }
.source-details q { display: block; quotes: none; overflow-wrap: anywhere; }
.inline-source-note { margin: -12px 0 30px; }
.inline-source-note .source-details { border-top: 0; padding-top: 0; margin-top: 0; }
.inline-resource { display: inline; font-weight: 550; }

/* Optional reading aids remain useful with JavaScript disabled. */
.note-details { margin: -8px 0 26px; font-size: 13px; line-height: 1.55; letter-spacing: 0; color: var(--muted); }
.note-details summary { display: flex; align-items: center; gap: 9px; min-height: 38px; width: fit-content; padding: 7px 0; list-style: none; cursor: pointer; font-weight: 500; }
.note-details summary::-webkit-details-marker { display: none; }
.note-details summary:hover, .note-details[open] summary { color: var(--accent); }
.question-mark { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 18px; height: 18px; border: 1px solid #b8c5e4; color: var(--accent); border-radius: 50%; font-size: 11px; font-weight: 600; }
.note-body { margin: 3px 0 4px 8px; padding: 7px 16px 8px 18px; border-left: 1px solid #cfdaf2; }
.prose .note-body p { margin: 0; font-size: 14px; line-height: 1.7; letter-spacing: 0; }
.callout-link { margin: -4px 0 29px; }
.callout-link a { display: inline-flex; align-items: center; padding: 11px 15px; min-height: 44px; border: 1px solid #d5e0fc; border-radius: 6px; background: #f8faff; font-size: 13px; font-weight: 550; line-height: 1.6; letter-spacing: -.008em; text-decoration: none; }
.callout-link a:hover { background: #edf3ff; border-color: #a8c1fa; }
.briefing { background: var(--smoke); border: 1px solid var(--hairline); border-radius: 9px; margin: 30px 0; scroll-margin-top: 100px; }
.briefing > summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; list-style: none; cursor: pointer; padding: 18px 22px; min-height: 65px; color: var(--black); font-size: 16px; line-height: 1.5; font-weight: 600; letter-spacing: -.01em; }
.briefing > summary::-webkit-details-marker { display: none; }
.disclosure-chevron { display: inline-block; color: var(--muted); font-size: 15px; transition: transform .15s; }
.briefing[open] .disclosure-chevron { transform: rotate(180deg); }
.briefing-body { padding: 22px; border-top: 1px solid var(--hairline); }
.prose .briefing-body > p { font-size: 16px; line-height: 1.75; margin-bottom: 19px; }
.prose .briefing-body > p:last-child { margin-bottom: 0; }
.briefing-body .evidence-card { margin: 24px 0 0; padding: 18px 20px; }

/* This is an explanatory diagram, not simulated result media. */
.manager-diagram { border: 1px solid var(--hairline); border-radius: 10px; padding: 26px; background: #fafafb; letter-spacing: 0; }
.diagram-head { margin-bottom: 23px; }
.prose .diagram-head h3 { margin: 8px 0 0; font-size: 24px; line-height: 1.2; letter-spacing: -.035em; }
.session-grid { display: grid; grid-template-columns: minmax(0, 1fr) 141px minmax(0, 1fr); align-items: stretch; }
.session-card { padding: 19px 17px 17px; border: 1px solid #d0d0d8; background: var(--white); border-radius: 6px; }
.session-label { display: block; color: var(--muted); font-size: 9px; font-weight: 600; letter-spacing: .055em; text-transform: uppercase; line-height: 1.55; }
.prose .session-card h4 { font-size: 18px; letter-spacing: -.03em; margin: 8px 0 10px; line-height: 1.3; }
.prose .session-card p { font-size: 12px; line-height: 1.85; color: var(--muted); margin: 0; letter-spacing: 0; }
.session-card.implementer { border-top: 2px solid var(--accent); padding-top: 18px; }
.session-exchange { display: flex; flex-direction: column; gap: 18px; justify-content: center; text-align: center; color: var(--muted); font-size: 9px; line-height: 1.6; padding: 15px 4px; }
.session-exchange span:first-child { color: var(--accent); }
.session-exchange b { font-size: 18px; line-height: .9; font-weight: 400; display: inline-block; vertical-align: -1px; padding: 0 2px; }
.helper-branch { grid-column: 3; }
.helper-connector { display: block; height: 23px; border-left: 1px dashed #b6bdd0; width: 1px; margin: 0 auto; }
.helper-group { border: 1px dashed #bec8dd; border-radius: 6px; padding: 13px 15px; background: var(--blue-tint); }
.helper-group strong { display: block; font-size: 14px; margin: 5px 0 3px; letter-spacing: -.012em; }
.prose .helper-group p { margin: 0; font-size: 11px; line-height: 1.6; color: var(--muted); }
.prose .manager-diagram figcaption { margin-top: 20px; padding-top: 16px; border-top: 1px solid #e3e3e9; font-size: 11px; line-height: 1.75; }
.manager-diagram figcaption strong { font-weight: 550; }

/* Companion-page components share the same reading surface. */
.callout { padding: 25px 27px; margin: 29px 0; background: var(--smoke); border: 1px solid var(--hairline); border-radius: 10px; }
.prose .callout h2, .prose .callout h3 { margin-top: 0; font-size: 23px; }
.prose .callout p { font-size: 16px; line-height: 1.7; }
.prose .callout p:last-child { margin-bottom: 0; }
.card-grid, .resource-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; margin: 30px 0; }
.resource-card { min-width: 0; border: 1px solid var(--hairline); border-radius: 9px; padding: 22px; background: var(--white); }
a.resource-card { display: block; text-decoration: none; color: var(--ink); }
a.resource-card:hover { border-color: #91b3ff; background: #fbfcff; }
.prose .resource-card h3 { font-size: 20px; line-height: 1.3; margin: 9px 0 12px; }
.prose .resource-card p { font-size: 14px; color: var(--muted); line-height: 1.7; margin-bottom: 15px; }
.prose .resource-card p:last-child { margin-bottom: 0; }
.prose .resource-card ul, .prose .resource-card ol { font-size: 14px; padding-left: 18px; }
.resource-card .eyebrow { color: var(--accent); }
.download-link { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; padding: 10px 18px; border: 1px solid var(--accent); border-radius: 6px; text-decoration: none; font-weight: 600; font-size: 13px; line-height: 1.6; color: var(--white); background: var(--accent); }
.download-link:hover { background: #074bcf; border-color: #074bcf; }
.download-link.secondary { color: var(--accent); background: var(--white); }
.status-pill { display: inline-flex; align-items: center; padding: 3px 8px; border: 1px solid #d2dcf5; border-radius: 5px; color: #425d94; background: var(--blue-tint); font-size: 10px; font-weight: 600; line-height: 1.5; letter-spacing: .025em; }
.code-block, .codewrap { border: 1px solid var(--hairline); border-radius: 9px; background: var(--smoke); margin: 27px 0; overflow: hidden; }
.code-bar, .codebar { display: flex; align-items: center; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--hairline); padding: 10px 17px; font-size: 11px; font-weight: 600; line-height: 1.5; }
.prose .code-block pre, .prose .codewrap pre { border: 0; border-radius: 0; margin: 0; padding: 19px; }
.copy, [data-copy-target], button[data-copy] { min-height: 36px; padding: 6px 12px; border: 1px solid #ccccd5; background: var(--white); color: var(--ink); border-radius: 5px; font-size: 11px; line-height: 1.5; font-weight: 600; }
.copy:hover, [data-copy-target]:hover, button[data-copy]:hover { border-color: #8d8d9c; }
.copy-fallback { margin: 14px 18px 18px; padding: 14px; background: var(--white); border: 1px solid #bfd1f8; border-radius: 6px; }
.copy-fallback label { display: block; font-size: 12px; color: var(--muted); margin-bottom: 8px; }
.copy-fallback textarea { display: block; width: 100%; min-height: 130px; padding: 10px; border: 1px solid var(--hairline); border-radius: 4px; font: 13px/1.6 var(--mono); resize: vertical; }
.metadata-list { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 10px 22px; font-size: 14px; line-height: 1.6; margin: 24px 0; }
.metadata-list dt { color: var(--muted); }
.metadata-list dd { margin: 0; }

/* Navigation stays out of the author's text, with a native mobile fallback. */
.toc-rail { align-self: stretch; padding-top: 5px; }
.toc-rail nav { position: sticky; top: 106px; max-height: calc(100vh - 135px); overflow-y: auto; padding: 0 2px 20px 0; }
.toc-rail .eyebrow { font-size: 10px; margin-bottom: 20px; }
.toc-list { margin: 0; padding: 0; list-style: none; counter-reset: sections; }
.toc-list li { margin: 0; padding: 0; counter-increment: sections; }
.toc-list a { display: flex; gap: 11px; align-items: baseline; font-size: 12px; line-height: 1.6; color: var(--muted); text-decoration: none; padding: 8px 3px 8px 0; min-height: 35px; }
.toc-list a::before { content: counter(sections, decimal-leading-zero); font-size: 9px; color: #8a8a94; font-variant-numeric: tabular-nums; flex: none; letter-spacing: .01em; }
.toc-list a:hover, .toc-list a[aria-current="location"] { color: var(--accent); }
.toc-list a[aria-current="location"]::before { color: var(--accent); }
.toc-top { display: inline-block; margin-top: 26px; font-size: 11px; color: var(--muted); text-decoration: none; min-height: 32px; }
.toc-top span { padding-left: 4px; }
.toc-mobile { display: none; }
.site-footer { margin-top: 92px; border-top: 1px solid var(--hairline); }
.site-footer > div { max-width: 1184px; padding: 30px 32px 38px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.site-footer a { color: var(--muted); font-size: 11px; line-height: 1.6; text-decoration: none; }
.site-footer a:first-child { font-size: 12px; color: var(--black); font-weight: 600; letter-spacing: -.01em; }

@media (max-width: 1040px) {
  .reading-layout { grid-template-columns: minmax(0, 1fr) 180px; gap: 39px; }
  .session-grid { grid-template-columns: minmax(0, 1fr) 116px minmax(0, 1fr); }
  .session-exchange { font-size: 8px; }
  .session-card { padding-left: 13px; padding-right: 13px; }
  .session-label { font-size: 8px; }
}
@media (max-width: 899px) {
  .page-shell { max-width: 800px; }
  .article-header { padding-top: 44px; }
  .reading-layout { display: block; }
  .toc-rail { display: none; }
  .toc-mobile { display: block; border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); margin: 0 0 26px; }
  .toc-mobile > summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; cursor: pointer; font-size: 12px; line-height: 1.6; font-weight: 550; list-style: none; padding: 14px 0; min-height: 48px; }
  .toc-mobile > summary::-webkit-details-marker { display: none; }
  .toc-mobile > summary span { font-size: 19px; font-weight: 400; color: var(--muted); }
  .toc-mobile[open] > summary span { transform: rotate(45deg); }
  .toc-mobile nav { padding: 0 0 15px; }
  .toc-mobile .toc-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 20px; }
  .toc-mobile .toc-list a { padding: 9px 0; }
  .session-grid { grid-template-columns: minmax(0, 1fr) 141px minmax(0, 1fr); }
  .session-exchange { font-size: 9px; }
  .session-label { font-size: 9px; }
}
@media (max-width: 579px) {
  html { scroll-padding-top: 83px; }
  .site-header-inner { padding: 12px 21px; min-height: 58px; }
  .site-brand { font-size: 15px; }
  .private-badge { display: none; }
  .series-nav { padding: 0 21px; gap: 25px; }
  .series-nav a { font-size: 11px; min-height: 44px; }
  .page-shell { padding: 0 22px; }
  .article-header { padding: 34px 0 29px; }
  .article-header > .eyebrow { font-size: 10px; margin-bottom: 15px; }
  h1 { font-size: clamp(2.7rem, 12.7vw, 4rem); letter-spacing: -.055em; line-height: 1.04; }
  .dek { margin-top: 18px; font-size: 17px; line-height: 1.55; }
  .byline { gap: 7px 17px; margin-top: 21px; font-size: 11px; }
  .prose { font-size: 17px; line-height: 1.8; letter-spacing: -.007em; }
  .prose p { margin-bottom: 24px; }
  .prose h2 { font-size: 29px; line-height: 1.16; margin: 49px 0 24px; scroll-margin-top: 84px; }
  .prose h3 { font-size: 23px; line-height: 1.25; margin: 35px 0 20px; scroll-margin-top: 84px; }
  .intro { padding-top: 29px; }
  .intro p:first-child { font-size: 20px; line-height: 1.7; }
  .prose > p.intro { font-size: 20px; line-height: 1.7; }
  .tldr { padding: 23px 21px; }
  .prose .tldr p { font-size: 15px; line-height: 1.8; margin-bottom: 18px; }
  .editorial-note { padding: 17px 18px; margin-bottom: 22px; }
  .editorial-note h2 { font-size: 16px; }
  .editorial-note p { font-size: 12px; }
  .editorial-checks { grid-template-columns: 1fr; gap: 5px; margin-top: 12px; padding-top: 11px; }
  .editorial-checks li { font-size: 10px; }
  .toc-mobile { margin-bottom: 23px; }
  .toc-mobile .toc-list { grid-template-columns: 1fr; gap: 0; }
  .toc-mobile .toc-list a { min-height: 40px; font-size: 12px; }
  .evidence-card { padding: 18px 18px 17px; margin: 28px 0; }
  .evidence-meta { gap: 6px 14px; font-size: 8px; justify-content: flex-start; }
  .prose .evidence-card h3 { font-size: 19px; margin-top: 12px; }
  .prose .evidence-card p { font-size: 13px; }
  .evidence-link { min-height: 40px; font-size: 12px; }
  .source-details summary { min-height: 34px; display: list-item; padding: 8px 0; }
  .note-details summary { min-height: 44px; font-size: 12px; gap: 8px; }
  .note-body { margin-left: 8px; padding-left: 17px; }
  .prose .note-body p { font-size: 13px; }
  .callout-link a { font-size: 12px; padding: 12px 14px; }
  .briefing { margin: 26px 0; }
  .briefing > summary { padding: 17px 18px; min-height: 61px; font-size: 15px; }
  .briefing-body { padding: 20px 18px; }
  .prose .briefing-body > p { font-size: 15px; }
  .briefing-body .evidence-card { padding: 16px; }
  .manager-diagram { padding: 21px; margin: 29px 0; }
  .prose .diagram-head h3 { font-size: 24px; }
  .session-grid { grid-template-columns: minmax(0, 1fr); }
  .session-card { padding: 17px 18px; }
  .prose .session-card h4 { font-size: 19px; margin: 6px 0 8px; }
  .prose .session-card p { font-size: 12px; line-height: 1.8; }
  .session-card.implementer { padding-top: 16px; }
  .session-exchange { flex-direction: row; padding: 15px 0; gap: 16px; justify-content: space-between; font-size: 9px; }
  .session-exchange b { transform: rotate(90deg); padding: 0; }
  .helper-branch { grid-column: 1; }
  .helper-group { margin-left: 28px; }
  .helper-connector { margin-left: calc(50% + 14px); }
  .prose .manager-diagram figcaption { font-size: 10px; line-height: 1.75; }
  .card-grid, .resource-grid { grid-template-columns: 1fr; gap: 14px; }
  .resource-card { padding: 21px; }
  .callout { padding: 21px; }
  .prose .callout p { font-size: 15px; }
  .metadata-list { grid-template-columns: 1fr; gap: 3px; }
  .metadata-list dd { margin-bottom: 13px; }
  .copy, [data-copy-target], button[data-copy] { min-height: 42px; padding: 8px 13px; }
  .code-bar, .codebar { padding: 9px 13px; }
  .prose .code-block pre, .prose .codewrap pre { padding: 16px; font-size: 12px; }
  .download-link { min-height: 46px; }
  .site-footer { margin-top: 65px; }
  .site-footer > div { padding: 26px 22px 32px; gap: 24px; align-items: flex-start; }
  .site-footer a:first-child { max-width: 165px; }
  .site-footer a:last-child { white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
@media print {
  .site-header, .series-bar, .toc-rail, .toc-mobile, .site-footer, .skip-link, .reading-progress { display: none; }
  .page-shell { max-width: none; padding: 0; }
  .article-header { padding-top: 0; }
  .reading-layout { display: block; }
  .prose { font-size: 11pt; line-height: 1.6; }
  .prose h2 { break-after: avoid; font-size: 20pt; }
  .prose h3 { break-after: avoid; font-size: 15pt; }
  .evidence-card, .manager-diagram, .resource-card { break-inside: avoid; }
  .editorial-note { border: 2px solid #555; }
  .tldr { border: 1px solid #aaa; background: white; }
  a { color: #000; }
}
