.outside-bar { max-width: var(--shell); margin: var(--s4) auto var(--s2); display: flex; justify-content: space-between; align-items: center; gap: var(--s4); color: var(--muted); font-size: var(--meta); }
.outside-bar a { display: inline-flex; align-items: center; min-height: var(--target); }
.paper { max-width: var(--shell); margin: 0 auto; padding: var(--s6) var(--gutter) var(--s8); background: var(--paper); }
.masthead-top { display: flex; justify-content: space-between; border-bottom: 1px solid var(--ink); padding-bottom: var(--s3); font: var(--meta)/1.6 var(--mono); letter-spacing: .04em; }
.brand-row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: var(--s6); padding: var(--s4) 0; }
.brand-row > p { font: var(--action)/1.9 var(--serif); }
.brand { text-align: center; }
.brand h1 { font: 700 var(--mast)/1.25 var(--serif); letter-spacing: .06em; }
.brand > p { font: var(--meta)/1.6 var(--mono); letter-spacing: .14em; margin-top: var(--s2); }
.issue-mark { justify-self: end; display: flex; align-items: center; gap: var(--s3); }
.issue-mark > span { color: var(--accent); font: var(--action)/1.5 var(--serif); border: 1px solid var(--accent); padding: var(--s1); }
.issue-mark strong { font: italic var(--stat)/1.4 Georgia, serif; }
.edition-line { display: flex; justify-content: space-between; gap: var(--s4); border-top: 4px double var(--ink); border-bottom: 1px solid var(--ink); padding: var(--s3) 0; font: var(--meta)/1.8 var(--sans); }
.contents { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-bottom: 1px solid var(--rule); }
.contents a { display: flex; align-items: center; justify-content: center; gap: var(--s3); min-height: var(--target); padding: var(--s2); font: var(--action)/1.6 var(--sans); text-decoration: none; }
.contents a:hover { text-decoration: underline; }
.contents a > span { color: var(--accent); font-family: var(--mono); }
.issue-index { border-bottom: 1px solid var(--rule); }
.issue-index summary, .article-sources summary { display: flex; justify-content: space-between; align-items: center; gap: var(--s4); cursor: pointer; min-height: var(--target); font: var(--action)/1.7 var(--sans); list-style: none; }
summary::-webkit-details-marker { display: none; }
.issue-index summary > span, .article-sources summary > span { color: var(--muted); font-size: var(--meta); }
.issue-index[open] > summary { border-bottom: 1px solid var(--faint); }
.issue-index ol { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: var(--s8); list-style: none; padding: var(--s3) 0 var(--s4); margin: 0; }
.issue-index li { border-bottom: 1px solid var(--faint); }
.issue-index a { display: grid; grid-template-columns: var(--s6) minmax(0,1fr); align-items: baseline; gap: var(--s3); min-height: var(--target); padding: var(--s3) 0; font: var(--action)/1.8 var(--sans); text-decoration: none; }
.issue-index a:hover { text-decoration: underline; }
.index-number { color: var(--accent); font-family: var(--mono); }
.chapter { margin-top: var(--s6); }
.chapter-heading { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--s3) var(--s4); border-top: 4px double var(--ink); border-bottom: 1px solid var(--rule); padding: var(--s3) 0; }
.folio { color: var(--accent); font: italic var(--section)/1.4 Georgia, serif; }
.chapter-heading h2 { font: 700 var(--deck)/1.7 var(--serif); }
.chapter-heading p, .chapter-count { color: var(--muted); font: var(--meta)/1.8 var(--sans); }
.chapter-count { margin-left: auto; }
.column-article { padding: var(--s8) 0 var(--s6); scroll-margin-top: var(--s4); }
.column-article + .column-article { border-top: 1px solid var(--ink); }
.article-opening { margin-bottom: var(--s6); }
.illustrated-opening { display: grid; grid-template-columns: minmax(0,1.8fr) minmax(0,1fr); gap: var(--s8); align-items: center; }
.article-meta { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--s3); color: var(--muted); font: var(--meta)/1.8 var(--sans); }
.article-meta time { margin-left: var(--s1); }
.article-number { color: var(--accent); font: var(--deck)/1.5 var(--mono); }
.column-article h3 { font: 700 var(--section)/1.55 var(--serif); margin: var(--s3) 0; text-wrap: wrap; }
.feature-article h3 { font-size: var(--stat); }
.feature-article .title-phrase { display: block; }
.title-phrase { display: inline-block; max-width: 100%; text-wrap: wrap; }
.article-dek { max-width: 54em; font: var(--deck)/1.85 var(--serif); color: var(--muted); }
.bear-figure img { mix-blend-mode: multiply; }
.bear-figure figcaption { text-align: right; padding-top: var(--s2); color: var(--muted); font: var(--meta)/1.6 var(--sans); }
.column-body { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--s6) var(--s8); }
.sections-4 { grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--s6) var(--s8); }
.column-section { min-width: 0; }
.column-section h4 { font: 700 var(--deck)/1.7 var(--serif); color: var(--forest); margin: 0 0 var(--s3); text-wrap: pretty; }
.column-section p { font: var(--body)/1.9 var(--serif); text-align: justify; overflow-wrap: break-word; }
.column-section p + p { margin-top: var(--s3); }
.column-section a { text-decoration-color: var(--rule); text-decoration-thickness: 1px; }
.column-section a:hover { text-decoration-color: var(--accent); }
.column-section code { font: .9em/1.7 var(--mono); padding: 0 var(--s1); background: var(--inset); overflow-wrap: anywhere; }
.article-bottom { display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--s3); border-top: 1px solid var(--faint); margin-top: var(--s6); padding-top: var(--s2); }
.article-bottom a { font-size: var(--meta); }
.return-index { color: var(--muted); }
.article-sources { border-top: 1px solid var(--faint); }
.article-sources > div { padding: var(--s3) 0; }
.original-title { font: var(--action)/1.9 var(--sans); color: var(--muted); text-wrap: pretty; }
.article-sources ul { padding-left: var(--s5); margin: var(--s3) 0 0; }
.article-sources li { font: var(--action)/1.9 var(--sans); margin: var(--s2) 0; text-wrap: pretty; overflow-wrap: anywhere; }
.article-sources a { display: inline-block; min-height: var(--target); padding: var(--s2) 0; }
.table-wrap { margin-top: var(--s5); }
table { width: 100%; table-layout: fixed; border-collapse: collapse; font: var(--action)/1.9 var(--sans); }
th, td { padding: var(--s3); border: 1px solid var(--rule); text-align: left; overflow-wrap: anywhere; vertical-align: top; }
th { background: var(--inset); font-weight: 600; }
.editorial-note { border-top: 4px double var(--ink); padding-top: var(--s5); margin-top: var(--s5); }
.editorial-note h2 { font: 700 var(--deck)/1.8 var(--serif); margin-bottom: var(--s3); }
.editorial-note p { color: var(--muted); font: var(--action)/1.9 var(--sans); margin-top: var(--s3); }
.colophon { display: flex; align-items: center; flex-wrap: wrap; gap: var(--s3) var(--s6); border-top: 1px solid var(--ink); margin-top: var(--s6); padding-top: var(--s3); font: var(--meta)/1.8 var(--sans); }
.colophon .action { margin-left: auto; font-size: var(--meta); }
.colophon p { flex-basis: 100%; color: var(--muted); }
.outside-footer { padding: var(--s5); text-align: center; font: var(--action)/1.8 var(--serif); color: var(--muted); }
@media (max-width:1230px) { .outside-bar,.paper { margin-left: var(--s8); margin-right: var(--s8); } }
@media (max-width:1000px) {
 .illustrated-opening { grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); gap: var(--s5); }
 .feature-article h3 { font-size: var(--section); }
 .column-body { grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--s5); }
 .sections-3 > .column-section:last-child { grid-column: 1/-1; }
 .chapter-heading p { order: 4; flex-basis: 100%; }
 .contents a { font-size: var(--meta); gap: var(--s2); }
}
@media (max-width:680px) {
 .outside-bar,.paper { margin-left: var(--s3); margin-right: var(--s3); }
 .outside-bar { margin-top: var(--s2); }
 .outside-bar > span,.brand-row > p,.issue-mark,.masthead-top > span:first-child { display: none; }
 .paper { padding-top: var(--s4); }
 .masthead-top { justify-content: center; }
 .brand-row { display: block; padding: var(--s3) 0 var(--s4); }
 .brand > p { letter-spacing: .08em; }
 .edition-line { display: grid; grid-template-columns: 1fr; gap: var(--s1); text-align: center; }
 .edition-line > span:nth-child(2) { color: var(--accent); }
 .contents { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .contents a { justify-content: flex-start; padding-left: 0; }
 .issue-index ol { grid-template-columns: 1fr; }
 .chapter { margin-top: var(--s6); }
 .chapter-heading { column-gap: var(--s3); }
 .chapter-heading p { font-size: var(--meta); }
 .column-article { padding-top: var(--s6); }
 .illustrated-opening { grid-template-columns: 1fr; gap: var(--s4); }
 .column-article h3 { font-size: var(--minor); line-height: 1.65; }
 .feature-article h3 { font-size: var(--section); }
 .article-dek { font-size: var(--body); }
 .bear-figure { max-width: 100%; }
 .column-body { grid-template-columns: 1fr; gap: var(--s5); }
 .column-section p { text-align: left; }
 .article-bottom { gap: 0 var(--s3); }
 .article-sources summary { gap: var(--s2); }
 .colophon { gap: 0 var(--s4); }
 .colophon .action { margin-left: 0; }
 table,tbody,tr,td { display: block; }
 thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
 tr + tr { margin-top: var(--s3); }
 td + td { border-top: 0; }
 td::before { content: attr(data-label); display: block; color: var(--forest); font-weight: 600; }
}
@media print { body { background: white; } .outside-bar,.outside-footer,.contents,.issue-index,.skip,.return-index { display: none; } .paper { max-width: none; margin: 0; padding: 0; } .chapter { break-before: page; } .chapter:first-of-type { break-before: auto; } .article-opening,.column-section { break-inside: avoid; } a { text-decoration: none; } }
.mechanism,.research-funnel { margin-top: var(--s6); padding: var(--s5); background: var(--inset); }
.exhibit-label { font: 600 var(--action)/1.8 var(--sans); color: var(--forest); margin-bottom: var(--s4); }
.mechanism-state { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--s3); padding-bottom: var(--s4); margin-bottom: var(--s4); border-bottom: 1px solid var(--rule); font: var(--action)/1.8 var(--sans); }
.mechanism-state strong { font: var(--deck)/1.6 var(--mono); }
.mechanism-questions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--s5); }
.mechanism-questions > div { display: flex; flex-direction: column; gap: var(--s2); }
.mechanism-questions b { font: var(--meta)/1.8 var(--mono); color: var(--accent); }
.mechanism-questions strong { font: 700 var(--body)/1.8 var(--serif); }
.mechanism-questions span { font: var(--meta)/1.8 var(--sans); color: var(--muted); }
.mechanism figcaption,.comparison figcaption,.research-funnel figcaption { padding-top: var(--s4); font: var(--meta)/1.9 var(--sans); color: var(--muted); }
.research-funnel ol { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--s4); list-style: none; padding: 0; margin: 0; }
.research-funnel li { display: flex; flex-direction: column; gap: var(--s2); }
.research-funnel strong { color: var(--forest); font: var(--section)/1.6 var(--mono); }
.research-funnel li > span { font: var(--action)/1.8 var(--sans); }
@media (max-width:680px) {
 .mechanism-questions,.research-funnel ol { grid-template-columns: 1fr; }
 .mechanism-questions > div + div,.research-funnel li + li { border-top: 1px solid var(--rule); padding-top: var(--s4); }
 .research-funnel li { flex-direction: row; align-items: center; gap: var(--s4); }
 .research-funnel strong { min-width: var(--s20); font-size: var(--minor); }
}
.column-section mark.editorial-mark { color: inherit; background-color: var(--highlight) !important; padding: 0 .08em; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.column-section strong { color: var(--forest); }
.column-body + .column-body { margin-top: var(--s6); }
.single-section { grid-template-columns: minmax(0,1fr); max-width: 76ch; margin-left: auto; margin-right: auto; }
.source-stamp { border: 1px solid var(--forest); color: var(--forest); font-size: var(--meta); padding: 0 var(--s1); white-space: nowrap; }
.source-credit { color: var(--muted); font-size: var(--meta); min-height: var(--target); display: flex; align-items: center; overflow-wrap: anywhere; }
.editorial-visual { margin: var(--s6) 0; padding: var(--s6) var(--s8); background: var(--inset); }
.visual-label { color: var(--forest); font: 600 var(--meta)/1.8 var(--sans); letter-spacing: .06em; margin-bottom: var(--s3); }
.editorial-visual h4 { margin: 0 0 var(--s4); font: 700 var(--section)/1.65 var(--serif); }
.editorial-visual h4 > span { display: inline-block; margin-right: .2em; }
.visual-explanation { max-width: 76ch; color: var(--muted); font: var(--action)/1.85 var(--sans); }
.visual-pull { border-left: 4px solid var(--forest); background: none; padding-top: var(--s3); padding-bottom: var(--s3); }
.visual-pull h4 { color: var(--forest); }
.visual-caution { background: var(--warning-paper); border-left: 4px solid var(--accent); }
.visual-caution .visual-label { color: var(--accent); }
.visual-caution h4 { font-size: var(--minor); }
.metric-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--s6); margin: var(--s5) 0; }
.metric-pair > div + div { border-left: 1px solid var(--rule); padding-left: var(--s6); }
.metric-pair strong { font: var(--stat)/1.3 var(--mono); color: var(--forest); }
.metric-pair > div > span { font: var(--action)/1.6 var(--sans); margin-left: var(--s2); }
.metric-pair p { margin-top: var(--s2); font: var(--action)/1.8 var(--sans); }
.workflow-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--s5); margin: var(--s5) 0; padding: 0; list-style: none; }
.workflow-steps li { display: flex; flex-direction: column; border-top: 1px solid var(--rule); padding-top: var(--s3); }
.step-order { font: var(--minor)/1.6 var(--mono); color: var(--accent); }
.workflow-steps strong { font: 700 var(--deck)/1.8 var(--serif); }
.workflow-steps li > span:not(.step-order), .workflow-steps p { font: var(--action)/1.8 var(--sans); }
.workflow-steps li > span:not(.step-order) { color: var(--muted); margin: var(--s1) 0; }
.equation { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s4); margin: var(--s5) 0; font: var(--stat)/1.5 var(--mono); }
.equation span:last-child { color: var(--accent); border-bottom: 3px solid var(--accent); }
.ledger-label { color: var(--accent); font: 600 var(--meta)/1.8 var(--sans); }
.cost-items { display: flex; flex-wrap: wrap; gap: var(--s2) var(--s4); padding: 0; list-style: none; font: var(--action)/1.8 var(--sans); }
.cost-items li + li::before { content: '+'; color: var(--accent); margin-right: var(--s4); }
.voice-script { background: var(--ink); color: var(--paper); margin: var(--s5) 0; padding: var(--s5); font: var(--body)/2 var(--mono); white-space: pre-wrap; overflow-wrap: anywhere; }
.voice-script code { font: inherit; }
.evidence-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--s6); margin: var(--s5) 0; }
.evidence-pair strong { color: var(--forest); font: 700 var(--deck)/1.8 var(--serif); }
.evidence-pair > div + div { border-left: 1px solid var(--rule); padding-left: var(--s6); }
.evidence-pair > div + div > strong { color: var(--accent); }
.evidence-pair ul { padding-left: var(--s5); margin: var(--s2) 0 0; font: var(--action)/1.9 var(--sans); }
.visual-interlude { margin: var(--s6) 0; }
.figure-open { display: block; width: 100%; padding: 0; font: inherit; text-align: left; cursor: zoom-in; }
.figure-open:hover .image-open-label { color: var(--accent); text-decoration: underline; }
.image-open-label { display: flex; align-items: center; justify-content: flex-end; min-height: var(--target); padding: 0 var(--s3); color: var(--forest); background: var(--paper); border-top: 1px solid var(--faint); font: var(--meta)/1.8 var(--sans); }
.reading-image { overflow: hidden; }
#image-viewer { width: min(var(--shell),calc(100% - 2 * var(--s4))); height: calc(100dvh - 2 * var(--s4)); max-width: none; max-height: none; padding: var(--s4); border: 1px solid var(--rule); background: var(--paper); color: var(--ink); }
#image-viewer[open] { display: grid; grid-template-rows: auto auto minmax(0,1fr) auto; gap: var(--s3); }
#image-viewer::backdrop { background: color-mix(in srgb,var(--ink) 75%,transparent); }
.viewer-toolbar { display: flex; align-items: center; gap: var(--s3); }
.viewer-toolbar h2 { margin-right: auto; font: 700 var(--deck)/1.8 var(--serif); }
.viewer-toolbar button { min-height: var(--target); padding: 0 var(--s3); border: 1px solid var(--rule); background: var(--paper); color: var(--ink); font: var(--action)/1.8 var(--sans); cursor: pointer; }
.viewer-toolbar button:hover { border-color: var(--accent); color: var(--accent); }
#viewer-hint { color: var(--muted); font: var(--meta)/1.8 var(--sans); }
.viewer-scroll { min-height: 0; overflow: auto; border: 1px solid var(--faint); background: var(--inset); overscroll-behavior: contain; }
.viewer-scroll img { width: auto; height: auto; max-width: 100%; max-height: 100%; margin: 0 auto; }
.is-natural .viewer-scroll img { width: var(--image-width); max-width: none; max-height: none; margin: 0; }
.viewer-foot { font: var(--action)/1.8 var(--sans); }
.viewer-foot p { max-height: 20dvh; overflow: auto; }
.viewer-foot a { display: inline-flex; align-items: center; min-height: var(--target); color: var(--forest); }
@media (max-width:680px) {
 .editorial-visual { padding: var(--s5); }
 .editorial-visual h4 { font-size: var(--minor); line-height: 1.7; }
 .visual-label { letter-spacing: 0; }
 .metric-pair { gap: var(--s3); }
 .metric-pair > div + div { padding-left: var(--s3); }
 .metric-pair strong { display: block; font-size: var(--section); }
 .metric-pair > div > span { margin-left: 0; }
 .workflow-steps, .evidence-pair { grid-template-columns: 1fr; }
 .workflow-steps { gap: var(--s3); }
 .workflow-steps li { display: grid; grid-template-columns: var(--s10) minmax(0,1fr); column-gap: var(--s3); }
 .step-order { grid-row: 1 / 4; }
 .workflow-steps li > span:not(.step-order), .workflow-steps p { grid-column: 2; }
 .evidence-pair > div + div { border-left: 0; border-top: 1px solid var(--rule); padding: var(--s4) 0 0; }
 .equation { font-size: var(--minor); gap: var(--s2); }
 .voice-script { padding: var(--s3); font-size: var(--action); }
 .single-section { max-width: none; }
 #image-viewer { padding: var(--s3); }
 .viewer-toolbar { gap: var(--s2); }
 .viewer-toolbar h2 { font-size: var(--body); }
 .viewer-toolbar button { padding: 0 var(--s2); }
}
