/* Field Guide reading surface. Inherits Locate Marks tokens and shared chrome. */
.blog-index{max-width:1100px}.blog-index>p{max-width:68ch}.blog-index h1{max-width:15ch}
.blog-index>.lede{font-size:21px;line-height:1.5;margin-top:24px}
.guide-list{list-style:none;padding:0;margin:48px 0 0;counter-reset:guide}
.guide-list>li{display:grid;grid-template-columns:72px minmax(0,1fr);gap:24px;padding:28px 0 32px;border-top:2px dashed var(--faded)}
.guide-number{font:600 28px var(--mono);color:var(--faded)}
.guide-list h2{font-size:clamp(26px,4vw,36px);line-height:1.15;margin:0 0 12px}.guide-list h2 a{text-decoration:none}
.guide-list p{max-width:65ch}.guide-meta{color:var(--faded);font-size:15px;margin:12px 0}
.reading-note{font-size:14px;color:var(--faded);margin-top:32px}
.blog-back{font-size:14px;margin:0 0 28px}.article-head{max-width:960px;margin-bottom:36px}
.article-head h1{max-width:19ch;text-wrap:balance}.article-head .lede{font-size:20px;line-height:1.55;max-width:65ch}
.reading-layout{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:64px;align-items:start}
.guide-prose{grid-column:1;grid-row:1;min-width:0;max-width:70ch;font-size:18px;line-height:1.7;overflow-wrap:break-word}
.guide-prose>p:first-child{font-size:22px;line-height:1.55;margin-top:0}
.guide-prose h2{font-size:26px;line-height:1.25;margin:52px 0 16px;scroll-margin-top:24px}
.guide-prose h3{font-size:21px;line-height:1.35;margin:32px 0 12px;scroll-margin-top:24px}
.guide-prose p{margin:0 0 20px}.guide-prose li{margin-bottom:10px}.guide-prose ul,.guide-prose ol{padding-left:26px}
.guide-prose blockquote{margin:24px 0;padding:20px 24px;background:var(--patch)}.guide-prose blockquote p:last-child{margin-bottom:0}
.starter-prompt{margin:28px 0;padding:20px 24px;background:var(--patch);border-left:6px solid var(--go)}
.starter-prompt h3{margin:0 0 8px}.starter-prompt p{margin:0 0 14px}.prompt-actions{display:flex;flex-wrap:wrap;gap:8px}
.guide-toc{grid-column:2;grid-row:1;position:sticky;top:24px;font-size:14px;border-top:2px dashed var(--faded);padding-top:16px}
.guide-toc summary{font-weight:700;cursor:pointer;padding:8px 0}.guide-toc details[open] summary{margin-bottom:12px}
.guide-toc ul{list-style:none;padding-left:0;margin:0}.guide-toc ul ul{padding-left:14px;margin:4px 0 8px}
.guide-toc a{display:block;padding:5px 0;line-height:1.4}.guide-toc li{margin:0}
.citation{font:600 12px var(--body);line-height:0}.citation a{padding:4px 2px;text-decoration:none}
.table-scroll{max-width:100%;overflow-x:auto;margin:24px 0;scrollbar-color:var(--faded) var(--asphalt)}
.guide-prose table{border-collapse:collapse;width:100%;font-size:16px;line-height:1.5;text-align:left;min-width:460px}
.guide-prose th{background:var(--patch);font-weight:700}.guide-prose td,.guide-prose th{padding:12px;vertical-align:top;border-bottom:1px solid var(--faded)}
.guide-prose pre{max-width:100%;overflow:auto;padding:20px;background:var(--patch);font:13px/1.6 var(--mono);scrollbar-color:var(--faded) var(--asphalt)}
.guide-diagram{margin:28px 0 16px;background:var(--patch);padding:16px}.guide-diagram svg{display:block;width:100%;height:auto}
.guide-diagram .geometry{fill:none;stroke:var(--line);stroke-width:3}.guide-diagram .dash{stroke-dasharray:6 6}
.guide-diagram text{fill:var(--line);text-anchor:middle;font:16px var(--body)}
.guide-diagram figcaption{font-size:14px;line-height:1.5;margin-top:12px;color:var(--line)}
.text-plan{font-size:15px;margin-bottom:20px}.text-plan summary{cursor:pointer;padding:8px 0}
.guide-prose .diagram-alt{font-size:15px;line-height:1.6;color:var(--faded)}
.guide-prose .sources{margin-top:52px}.sources ul{list-style:none;padding:0}.sources li{padding:12px 0;border-bottom:1px solid var(--patch);font-size:16px;line-height:1.6;scroll-margin-top:24px}
.sources li:target{background:var(--patch)}.sources span{font-family:var(--mono)}
.blog-article .pn{max-width:960px}.blog-article .pn a{max-width:45%}
.skip-link{position:fixed;left:16px;top:8px;transform:translateY(-200%);padding:12px 20px;background:var(--line);color:var(--asphalt);z-index:100}
.skip-link:focus{transform:none;color:var(--asphalt)}
.blog-index ::selection,.blog-article ::selection{background:var(--line);color:var(--asphalt)}
.field-guide a:not(.btn):hover{color:#FF8540}.field-guide .site nav a[aria-current="page"]:hover{color:var(--asphalt)}
/* Reading pages keep feedback in flow so it never covers a sentence or diagram. */
.field-guide .p1-feedback-launch{position:static;display:block;margin:0 auto 32px}
.guide-toc summary{background:var(--patch);padding:12px;font-size:16px}
@media(min-width:1050px){.guide-toc details:not([open]) nav{display:none}}
@media(max-width:1049px){.reading-layout{display:flex;flex-direction:column;gap:32px}.guide-toc{position:static;width:100%;max-width:70ch}.guide-prose{width:100%}.guide-toc nav{max-width:70ch}.article-head{margin-bottom:24px}}
@media(max-width:540px){.blog-index,.blog-article{padding:28px 18px 0}.guide-list>li{grid-template-columns:38px minmax(0,1fr);gap:14px}.guide-number{font-size:22px}.guide-list{margin-top:32px}.guide-prose{font-size:17px;line-height:1.7}.guide-prose>p:first-child{font-size:20px}.guide-prose h2{font-size:24px}.article-head .lede{font-size:18px}.guide-diagram{padding:8px;margin-left:0;margin-right:0}.guide-diagram text{font-size:18px}.blog-article .pn a{max-width:100%;width:100%}}
@media print{.site,.foot,.guide-toc,.pn,.skip-link,.blog-back{display:none}.reading-layout{display:block}.guide-prose{max-width:none}body{background:white;color:black}.guide-prose pre,.guide-diagram{break-inside:avoid}.guide-diagram text{fill:black}.guide-diagram .geometry{stroke:black}}
