.longform {
  --diagram-line: #536271;
  --diagram-blue: #79c0ff;
  --diagram-amber: #f7c873;
}

.longform .article-hero { padding: 1rem 0 2.5rem; }
.longform h1 { max-width: 22ch; font-size: clamp(2.4rem, 1.35rem + 3.6vw, 4.7rem); letter-spacing: -.035em; }
.longform .dek { max-width: 52ch; }
.article-contents { margin: 2rem 0; padding: 1rem 1.25rem; border: 1px solid var(--border); border-radius: 8px; }
.article-contents summary { cursor: pointer; font-weight: 650; }
.article-contents summary span { color: var(--muted); font-weight: 400; margin-left: .5rem; font-size: .85rem; }
.article-contents ol { padding-left: 1.4rem; margin-bottom: .25rem; }
.article-contents li { padding: .25rem 0; font-size: .94rem; }
.essay-body { font-size: 1.0625rem; line-height: 1.8; }
.essay-body > p, .essay-body > ul, .essay-body > blockquote, .essay-body > h2, .essay-body > h3, .essay-body > .math-display { max-width: 760px; margin-left: auto; margin-right: auto; }
.essay-body > p { margin-top: 0; margin-bottom: 1.15rem; }
.essay-body > h2 { margin-top: 4rem; margin-bottom: 1.65rem; padding-top: 2.5rem; border-top: 1px solid var(--border); font-size: clamp(1.7rem, 1.35rem + 1.1vw, 2.3rem); line-height: 1.23; letter-spacing: -.025em; text-wrap: balance; scroll-margin-top: 1.5rem; }
.essay-body > h3 { margin-top: 2.5rem; margin-bottom: 1rem; font-size: 1.25rem; line-height: 1.4; scroll-margin-top: 1.5rem; }
.essay-body blockquote { padding: .3rem 1.2rem; border-left: 3px solid var(--green); background: var(--card-soft); color: var(--fg); }
.essay-body blockquote p { margin: .5rem 0; }
.essay-body li { margin-bottom: .5rem; }
.essay-body a { text-decoration: underline; text-underline-offset: .18em; }
.section-share-row { max-width: 760px; margin: -1rem auto 1.2rem; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.essay-body .section-share { display: inline-flex; align-items: center; gap: .45rem; min-height: 44px; font-size: .78rem; line-height: 1.4; text-decoration: none; color: var(--muted); }
.essay-body .section-share:hover { color: var(--link); text-decoration: underline; }
.section-share svg { flex: none; }
.section-share-row input { width: 100%; min-width: 0; padding: .7rem; border: 1px solid var(--border); border-radius: 5px; background: var(--card); color: var(--fg); font: inherit; font-size: .85rem; }
.section-share-row input:focus-visible { outline: 2px solid var(--link); outline-offset: 3px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media print { .section-share-row { display: none; } }
.essay-body hr { max-width: 760px; border: 0; border-top: 1px solid var(--border); margin: 3rem auto; }
.math-display { overflow-x: auto; padding: .75rem 1rem; margin-top: 1.5rem; margin-bottom: 1.5rem; border: 1px solid var(--border); border-radius: 8px; background: var(--card-soft); line-height: 1.5; }
.math-display mjx-container[display="true"] { margin: .5rem 0 !important; }
.math-display:focus-visible, .article-contents summary:focus-visible, .longform a:focus-visible { outline: 2px solid var(--link); outline-offset: 4px; }
.math-fallback { max-width: 760px; margin: 1rem auto; color: var(--amber); }
.diagram { margin: 3rem 0; padding: clamp(1rem, 2.6vw, 2rem); border: 1px solid var(--border); border-radius: 12px; background: var(--card); font-size: .94rem; line-height: 1.5; }
.diagram-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: .4rem 1rem; margin-bottom: 1.65rem; }
.diagram h3 { font-size: clamp(1.12rem, .95rem + .45vw, 1.4rem); margin: 0; line-height: 1.35; }
.figure-number { color: var(--green); font: 600 .72rem ui-monospace, monospace; letter-spacing: .1em; text-transform: uppercase; }
.diagram figcaption { color: var(--muted); margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid var(--border); font-size: .88rem; }
.diagram figcaption strong { color: var(--fg); }
.diagram p { margin: .4rem 0; }
.diagram .diagram-label { color: var(--muted); font-size: .75rem; letter-spacing: .07em; text-transform: uppercase; }
.flow-row { display: grid; grid-template-columns: 1fr auto 1fr auto 1.25fr auto 1fr; align-items: center; gap: .7rem; }
.flow-node { min-width: 0; padding: 1rem .75rem; border: 1px solid var(--border); background: var(--card-soft); border-radius: 8px; text-align: center; }
.flow-node strong { display: block; font-size: .94rem; }
.flow-node small { display: block; color: var(--muted); margin-top: .3rem; font-size: .8rem; }
.flow-arrow { color: var(--muted); text-align: center; font-size: 1.3rem; }
.finch-scene { display: block; width: 100%; height: auto; max-width: 300px; margin: .3rem auto .5rem; stroke-linejoin: round; stroke-linecap: round; }
.finch-body { fill: var(--fg); fill-opacity: .15; stroke: var(--muted); stroke-width: 1.5; }
.finch-wing { fill: var(--fg); fill-opacity: .07; stroke: var(--muted); stroke-width: 1.5; }
.finch-feathers { fill: none; stroke: var(--muted); stroke-width: 1.5; }
.finch-eye { fill: var(--fg); }
.finch-beak { fill: currentColor; fill-opacity: .35; stroke: currentColor; stroke-width: 2; }
.finch-food { fill: currentColor; fill-opacity: .25; stroke: currentColor; stroke-width: 1.5; }
.finch-insect ellipse:not(:first-child) { fill: var(--card-soft); fill-opacity: 1; }
.finch-leaf, .finch-cactus { fill: none; stroke: var(--green); stroke-width: 2; }
.finch-flower { fill: var(--diagram-amber); fill-opacity: .2; stroke: var(--diagram-amber); stroke-width: 1.5; }
.deception-flow { max-width: 720px; margin: auto; }
.deception-flow > .flow-node { max-width: 470px; margin: auto; }
.deception-flow > .flow-arrow { padding: .3rem; }
.flow-node.belief { border-color: var(--amber); }
.flow-node.goal { border-color: var(--rose); }
.belief-note { margin: .6rem auto 0 !important; max-width: 450px; color: var(--amber); text-align: center; font-size: .82rem; }
.branch-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; position: relative; padding-top: 1rem; border-top: 1px solid var(--diagram-line); }
.branch-row .flow-node { position: relative; }
.branch-row .flow-node::before { content: ''; position: absolute; height: 1rem; border-left: 1px solid var(--diagram-line); left: 50%; bottom: 100%; }
.branch-stem { height: 1rem; border-left: 1px solid var(--diagram-line); margin-left: 50%; }
.local-actions { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .7rem; list-style: none; padding: 0; margin: 0; }
.local-actions li { position: relative; margin: 0; padding: .9rem .55rem; border: 1px solid var(--border); border-radius: 8px; background: var(--card-soft); text-align: center; }
.local-actions li::after { content: ''; height: 1.5rem; position: absolute; top: 100%; left: 50%; border-left: 1px solid var(--diagram-line); }
.agent-name { display: block; color: var(--muted); font-size: .72rem; margin-bottom: .5rem; }
.local-actions strong { display: block; font-size: .88rem; }
.monitor-ok { display: inline-block; margin-top: .85rem; color: var(--green); border: 1px solid var(--green); border-radius: 99px; font-size: .7rem; padding: .08rem .45rem; }
.merge-line { height: 1.5rem; border-bottom: 1px solid var(--diagram-line); margin: 0 10%; }
.global-output { max-width: 350px; padding: 1rem; border: 1px solid var(--rose); border-radius: 8px; text-align: center; margin: 0 auto; }
.global-output strong { color: var(--rose); }
.global-output small { display: block; color: var(--muted); margin-top: .3rem; }
.diagram .math-display { border: 0; background: transparent; margin: .5rem 0 0; padding: .25rem 0; }
.article-reference { max-width: 760px; margin: 4rem auto 0; }
.article-reference p { font-size: .94rem; }
.reference-list { padding-left: 1.5rem; margin: 1.75rem 0 2rem; }
.reference-list li { max-width: none; padding: 0 0 1.25rem .35rem; margin-bottom: 1.25rem; border-bottom: 1px solid var(--border); scroll-margin-top: 1.5rem; }
.reference-list li::marker { color: var(--green); font-weight: 650; }
.reference-list li:target { border-bottom-color: var(--green); }
.reference-topic { color: var(--green); font-size: .75rem; font-weight: 650; letter-spacing: .045em; text-transform: uppercase; }
.reference-list p { margin: .4rem 0; overflow-wrap: anywhere; }
.reference-list .reference-context { color: var(--muted); font-size: .85rem; }

.policy-overlaps { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 1.5rem; align-items: center; margin: 1.25rem 0; }
.overlap-examples { list-style: none; padding: 0; margin: 0; display: grid; gap: 1.15rem; }
.overlap-examples li { display: grid; grid-template-columns: 1.6rem minmax(0, 1fr); gap: .7rem; margin: 0; }
.overlap-number { display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border: 1px solid var(--fg); border-radius: 50%; font-size: .8rem; font-weight: 650; }
.overlap-combination { display: block; color: var(--muted); font-size: .73rem; }
.overlap-examples strong { display: block; font-size: .94rem; margin-top: .2rem; }
.overlap-examples p { color: var(--muted); font-size: .82rem; margin-bottom: 0; }
.memory-stages { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .9rem; list-style: none; padding: 0; margin: 0; }
.memory-stages li { position: relative; padding: .9rem .5rem; margin: 0; text-align: center; border: 1px solid var(--border); border-radius: 8px; background: var(--card-soft); }
.memory-stages li:not(:last-child)::after { content: '→'; position: absolute; left: calc(100% + .1rem); top: 47%; color: var(--muted); }
.memory-stages strong { display: block; font-size: .92rem; }
.memory-stages small { display: block; margin-top: .35rem; font-size: .78rem; color: var(--muted); }
.notebook-icon { display: block; width: 42px; height: 44px; margin: .6rem auto; color: var(--diagram-blue); }
.shared-notebook { display: flex; gap: 1rem; justify-content: space-between; align-items: center; padding: 1rem 1.2rem; border: 1px solid var(--green); border-radius: 8px; margin-top: 1.25rem; background: var(--card-soft); }
.shared-notebook strong { color: var(--green); }
.shared-notebook p { font-size: .82rem; color: var(--muted); margin: 0; }
.notebook-connection { color: var(--green); text-align: center; font-size: .82rem; margin: .7rem 0 0 !important; }
.safety-layers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .9rem; }
.safety-layer { min-width: 0; padding: 1rem; border: 1px solid var(--border); border-radius: 8px; background: var(--card-soft); }
.layer-number { display: inline-flex; justify-content: center; align-items: center; width: 2rem; height: 2rem; margin-bottom: 1rem; border: 1px solid currentColor; border-radius: 50%; color: var(--diagram-blue); font-size: .82rem; }
.safety-layer:nth-child(2) .layer-number { color: var(--amber); }
.safety-layer:nth-child(3) .layer-number { color: var(--green); }
.safety-layer h4 { font-size: 1.2rem; margin: 0 0 .2rem; }
.safety-layer .layer-location { display: block; color: var(--muted); font-size: .75rem; margin: 0 0 .75rem; }
.safety-layer p { font-size: .88rem; }
.permission-example { margin-top: 1.75rem; border-top: 1px solid var(--border); padding-top: 1.25rem; }
.permission-flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: .8rem; align-items: center; margin-top: .75rem; }
.permission-flow .flow-node:last-child { border-style: dashed; color: var(--muted); }
.permission-denied { border-color: var(--rose); }
.permission-denied strong { color: var(--rose); }
.permission-stop { color: var(--rose); font-size: 1.6rem; text-align: center; }

.bee-comparison { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.bee-panel { min-width: 0; padding: 1.1rem; border: 1px solid var(--border); border-radius: 9px; background: var(--card-soft); }
.bee-panel h4 { font-size: 1.15rem; margin: .3rem 0 .5rem; }
.bee-panel .diagram-label { color: var(--amber); }
.bee-scene { display: block; width: 100%; height: auto; margin: .5rem 0 .75rem; }
.bee-scene text { font-family: inherit; fill: var(--muted); }
.bee-steps { list-style: none; display: grid; gap: .6rem; margin: 0; padding: 0; counter-reset: bee-step; }
.bee-steps li { counter-increment: bee-step; display: grid; grid-template-columns: 1.4rem 1fr; gap: .5rem; margin: 0; font-size: .86rem; }
.bee-steps li::before { content: counter(bee-step); color: var(--amber); border: 1px solid var(--border); border-radius: 50%; width: 1.3rem; height: 1.3rem; display: grid; place-items: center; font-size: .7rem; }
.bee-steps strong { font-weight: 650; }
.bee-composition { display: flex; flex-wrap: wrap; gap: .5rem .75rem; justify-content: center; align-items: center; padding: 1.1rem .5rem; margin: 1rem 0 0; border: 1px solid var(--border); border-radius: 8px; font-size: .88rem; text-align: center; }
.bee-composition b { color: var(--amber); font-size: 1.1rem; }
.bee-composition strong { color: var(--green); }
.bee-analogy-note { font-size: .8rem; color: var(--muted); margin-top: 1rem !important; }

@media (prefers-color-scheme: light) {
  .longform { --diagram-line: #91a1b4; --diagram-blue: #0b84c6; --diagram-amber: #9f6412; }
}

@media (max-width: 700px) {
  .essay-body { font-size: 1rem; }
  .essay-body > h2 { margin-top: 3rem; padding-top: 2rem; }
  .flow-row { grid-template-columns: 1fr; gap: .3rem; }
  .flow-row > .flow-arrow { transform: rotate(90deg); }
  .flow-row .flow-node { padding: .7rem; }
  .branch-row { gap: .4rem; }
  .branch-row .flow-node { padding: .6rem .25rem; }
  .branch-row strong { font-size: .76rem; }
 .bee-comparison { grid-template-columns: 1fr; }
  .local-actions { grid-template-columns: 1fr; gap: .65rem; padding-left: 1.2rem; border-left: 1px solid var(--diagram-line); margin-left: .5rem; }
  .local-actions li { display: grid; grid-template-columns: 1fr auto; text-align: left; align-items: center; padding: .65rem .8rem; gap: .1rem .5rem; }
  .local-actions li::after { width: 1.2rem; height: 0; border-left: 0; border-top: 1px solid var(--diagram-line); top: 50%; left: -1.2rem; }
  .agent-name { margin: 0; }
  .local-actions strong { grid-column: 1; }
  .monitor-ok { grid-column: 2; grid-row: 1/3; margin: 0; }
  .merge-line { margin: 0 50% 0 .5rem; border-left: 1px solid var(--diagram-line); border-radius: 0 0 0 8px; }
  .math-display { padding: .65rem .5rem; font-size: .88rem; }
 .safety-layers { grid-template-columns: 1fr; }
  .policy-overlaps { grid-template-columns: 1fr; gap: 1rem; }
  .memory-stages { grid-template-columns: 1fr; gap: 1.2rem; }
  .memory-stages li { display: grid; grid-template-columns: 45px 1fr; column-gap: .9rem; text-align: left; padding: .75rem 1rem; }
  .memory-stages .agent-name { grid-column: 2; }
  .memory-stages .notebook-icon { grid-row: 1/4; grid-column: 1; margin: 0; align-self: center; }
  .memory-stages strong, .memory-stages small { grid-column: 2; }
  .memory-stages li:not(:last-child)::after { content: '↓'; left: 50%; top: 100%; }
  .shared-notebook { display: block; }
  .shared-notebook p { margin-top: .5rem; }
  .safety-layer { display: grid; grid-template-columns: auto 1fr; column-gap: .8rem; }
  .layer-number { grid-row: 1/4; margin: 0; }
  .safety-layer p { grid-column: 2; }
  .permission-flow { grid-template-columns: 1fr; gap: .35rem; }
  .permission-flow > .flow-arrow, .permission-stop { transform: rotate(90deg); }
}

/* One conceptual map, reused across shaping, evaluation and deployment. */
.behavior-map { display: block; width: 100%; height: auto; max-width: 440px; margin: .5rem auto; }
.behavior-map .map-outline { fill: var(--card-soft); stroke: var(--muted); stroke-width: 1.4; }
.map-shade { fill: var(--diagram-blue); fill-opacity: .1; }
.map-contour { fill: none; stroke: var(--diagram-blue); stroke-width: 1.8; opacity: .8; }
.behavior-map.after .map-contour { stroke-dasharray: 6 4; }
.map-point circle { fill: var(--card); stroke: var(--fg); stroke-width: 1.5; }
.map-point text { fill: var(--fg); font: 650 15px system-ui, sans-serif; }
.map-point.tested circle { stroke-width: 2; }
.situation-path { fill: none; stroke: var(--fg); stroke-width: 3; }
.path-arrow { fill: none; stroke: var(--fg); stroke-width: 3; stroke-linejoin: round; }
.authority-line { fill: none; stroke: var(--diagram-amber); stroke-width: 3; stroke-dasharray: 10 4 2 4; }
.diagram .map-note { max-width: none; color: var(--muted); font-size: .82rem; line-height: 1.6; margin: 1rem 0; }
.training-process { grid-template-columns: 1fr auto .95fr auto 1fr auto 1.2fr; }
.training-process .flow-node { min-width: 0; }
.training-process .behavior-map { max-width: 230px; }
.training-process .diagram-label { display: block; margin-bottom: .65rem; }
.parameter-chain { list-style: none; padding: 1rem 0; margin: 1rem 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; border-block: 1px solid var(--border); }
.parameter-chain li { position: relative; margin: 0; }
.parameter-chain li:not(:last-child)::after { content: '→'; position: absolute; right: -1.5rem; top: .4rem; color: var(--muted); }
.parameter-chain strong { display: block; font-size: .87rem; }
.parameter-chain span { display: block; color: var(--muted); font-size: .78rem; }
.finch-inset { display: grid; grid-template-columns: 1fr 1.35fr; gap: 1.2rem; align-items: center; padding: 1rem; border: 1px solid var(--border); border-radius: 8px; }
.finch-inset strong { font-size: .88rem; }
.finch-inset p, .finch-inset a { font-size: .78rem; line-height: 1.6; }
.finch-inset p { color: var(--muted); }
.finch-miniatures { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .35rem; }
.finch-miniatures > div { text-align: center; color: var(--diagram-amber); }
.finch-miniatures > div:nth-child(2) { color: var(--diagram-blue); }
.finch-miniatures > div:nth-child(3) { color: var(--green); }
.finch-miniatures span { display: block; color: var(--muted); font-size: .7rem; line-height: 1.45; }
.habit-zoom { scroll-margin-top: 1.5rem; }
.habit-zoom > h4 { font-size: 1.1rem; margin: .5rem 0 1rem; }
.habit-tags { display: flex; flex-wrap: wrap; gap: .4rem .65rem; padding-bottom: .5rem; color: var(--muted); font-size: .78rem; }
.habit-tags span:not(:last-child)::after { content: ' ·'; padding-left: .65rem; }
.authority-example { border: 1px solid var(--diagram-amber); border-radius: 8px; padding: 1rem; }
.connected-system + .authority-example { margin-top: 1.25rem; }
.authority-context { display: grid; grid-template-columns: minmax(160px, .8fr) minmax(0, 2fr); gap: 1rem; align-items: center; }
.authority-context .behavior-map { width: 100%; max-width: 240px; margin: .6rem auto; }
.authority-context .authority-pair { margin-top: 0; }
.boundary-inset { max-width: 760px; margin: 1.5rem auto; padding: 1rem; border: 1px solid var(--diagram-amber); border-radius: 8px; background: var(--card); font-size: .9rem; line-height: 1.55; scroll-margin-top: 1.5rem; }
.boundary-inset .diagram-head { margin-bottom: .75rem; }
.boundary-inset h3 { margin: 0; font-size: 1.05rem; line-height: 1.4; }
.boundary-inset .diagram-label { margin: 0; color: var(--muted); font-size: .7rem; letter-spacing: .04em; text-transform: uppercase; }
.boundary-inset .boundary-context { font-size: .83rem; color: var(--fg); }
.primed-map { min-width: 0; }
.boundary-inset .priming-label { margin: .75rem 0 0; text-align: center; font-size: .76rem; color: var(--muted); }
.priming-label strong, .priming-label span { display: block; }
.priming-label strong { color: var(--diagram-amber); }
.priming-label::after { content: '↓'; display: block; color: var(--diagram-amber); font-size: 1.15rem; }
.priming-region { fill: var(--diagram-amber); fill-opacity: .14; stroke: var(--diagram-amber); stroke-width: 1.5; stroke-dasharray: 2 5; }
.boundary-inset .map-note { margin-bottom: 0; }
.essay-body > p[id] { scroll-margin-top: 1.5rem; }
.closing-questions li { scroll-margin-top: 1.5rem; }
.authority-example > p { font-size: .9rem; max-width: none; }
.authority-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: .85rem; }
.authority-pair > div { padding-left: .85rem; border-left: 2px solid var(--muted); }
.authority-pair b { display: block; font-size: .86rem; }
.authority-pair p { font-size: .83rem; color: var(--muted); }
.authority-key { display: inline-block; width: 35px; height: 3px; vertical-align: middle; margin-right: .4rem; background: repeating-linear-gradient(to right, var(--diagram-amber) 0 13px, transparent 13px 17px, var(--diagram-amber) 17px 20px, transparent 20px 24px); }
.map-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.map-panel { min-width: 0; padding: 1rem; border: 1px solid var(--border); border-radius: 8px; }
.map-panel h4 { margin: 0 0 .6rem; font-size: .97rem; }
.map-panel p { font-size: .83rem; color: var(--muted); }
.map-panel p b { color: var(--fg); }
.map-legend { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; margin-top: 1rem; color: var(--muted); font-size: .78rem; }
.map-legend span { display: inline-flex; align-items: center; gap: .4rem; }
.contour-key { width: 26px; border-top: 2px solid var(--diagram-blue); }
.contour-key.changed { border-top-style: dashed; }
.connected-system { border: 1px dashed var(--muted); border-radius: 9px; padding: 1rem; }
.connected-row { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: .3rem; }
.connected-agent { min-width: 0; text-align: center; }
.connected-agent h4 { margin: 0; font-size: 1rem; }
.connected-agent > span { display: block; font-size: .75rem; color: var(--muted); }
.communication-arrow { text-align: center; color: var(--fg); }
.communication-arrow span { display: block; font-size: .66rem; white-space: nowrap; }
.communication-arrow b { display: block; font-size: 1.5rem; }
.shared-context { text-align: center; padding: .75rem; margin: 1rem 0; border: 1px solid var(--border); border-radius: 7px; }
.shared-context > span { display: block; font-size: 1.5rem; }
.shared-context strong { font-size: .87rem; }
.shared-context p { max-width: none; font-size: .8rem; color: var(--muted); }
.diagram .joint-label { max-width: none; text-align: center; color: var(--muted); font-size: .8rem; }
.joint-label strong { color: var(--fg); }
.enforced-gate { border: 5px double var(--rose); border-radius: 0; }
.enforced-gate .diagram-label { display: block; margin-bottom: .5rem; }
.permission-flow .behavior-map { max-width: 190px; }

@media (max-width: 700px) {
  .training-process, .parameter-chain, .finch-inset, .authority-context, .authority-pair, .map-pair, .connected-row { grid-template-columns: 1fr; }
  .training-process > .flow-arrow { transform: rotate(90deg); }
  .parameter-chain { gap: 1.6rem; }
  .parameter-chain li:not(:last-child)::after { content: '↓'; left: 0; right: auto; top: 100%; }
  .finch-inset { gap: .75rem; padding: .85rem; }
  .finch-miniatures .finch-scene { margin: 0; }
  .policy-overlaps { gap: .6rem; }
  .habit-tags { gap: .25rem .4rem; }
  .habit-tags span:not(:last-child)::after { padding-left: .4rem; }
  .authority-example { padding: .85rem; }
  .connected-agent .behavior-map { max-width: 260px; }
  .communication-arrow { padding: .5rem; }
  .communication-arrow b { transform: rotate(90deg); line-height: 1.3; }
  .connected-system { padding: .75rem; }
}

/* Figure 5: comparable realities, records, and judgments. */
.diagram .evidence-lede { max-width: none; margin: 0 0 1.3rem; font-size: .92rem; }
.evidence-case { padding: 1.15rem; border: 1px solid var(--border); border-radius: 9px; background: var(--card-soft); }
.evidence-case + .evidence-case { margin-top: 1rem; }
.evidence-case h4 { display: flex; align-items: center; gap: .65rem; margin: 0 0 1.25rem; font-size: 1.06rem; line-height: 1.4; }
.evidence-case-letter { display: inline-grid; flex: 0 0 1.8rem; height: 1.8rem; place-items: center; border: 1px solid var(--fg); border-radius: 50%; font-size: .85rem; }
.evidence-case-flow { display: grid; grid-template-columns: minmax(0, 1.8fr) 20px minmax(0, 1fr) 20px minmax(100px, .7fr); align-items: center; gap: .5rem; }
.evidence-case-flow > div { min-width: 0; }
.evidence-case h5 { margin: 0 0 .45rem; font-size: .85rem; line-height: 1.4; }
.evidence-case h5 > span { font-size: .8rem; font-weight: 400; }
.trajectory-stage { text-align: center; }
.trajectory-pair { display: grid; grid-template-columns: minmax(0, 1fr) 46px minmax(0, 1fr); align-items: center; gap: .2rem; }
.trajectory-time { display: block; font-size: .72rem; color: var(--muted); }
.trajectory-state .behavior-map { margin: .1rem auto; }
.trajectory-state > strong { display: block; font-size: .77rem; line-height: 1.4; }
.trajectory-change { text-align: center; }
.trajectory-change > span { display: block; color: var(--muted); font-size: .67rem; line-height: 1.35; }
.trajectory-change > b { display: block; color: var(--fg); font-size: 1.5rem; }
.trajectory-end { fill: var(--fg); }
.trajectory-event circle { fill: var(--card); stroke: currentColor; stroke-width: 3; }
.trajectory-event text { fill: currentColor; font: 650 36px system-ui, sans-serif; }
.evidence-case .violation { color: var(--rose); }
.evidence-case .compliant { color: var(--green); }
.diagram .reality-result { max-width: none; margin: .7rem 0 0; font-size: .78rem; font-weight: 650; }
.diagram .actual-property { max-width: none; margin: .35rem 0 0; color: var(--muted); font-size: .72rem; }
.evidence-step-arrow { text-align: center; font-size: 1.35rem; color: var(--muted); }
.evidence-record-stage { padding-left: .75rem; border-left: 1px dashed var(--muted); text-align: center; }
.observation-boundary { display: block; margin-bottom: .5rem; color: var(--muted); font-size: .64rem; letter-spacing: .025em; text-transform: uppercase; }
.observation-notation { display: block; font-size: .8rem; }
.diagram .record-sources { font-size: .67rem; color: var(--muted); line-height: 1.5; margin: .4rem 0 .65rem; }
.evidence-intervention, .faithful-label { display: block; font-size: .75rem; font-weight: 650; line-height: 1.4; }
.evidence-intervention { color: var(--diagram-amber); border: 1px dashed var(--diagram-amber); border-radius: 4px; padding: .3rem .15rem; }
.faithful-label { color: var(--green); padding: .3rem .15rem; }
.evidence-record { display: block; width: 100%; max-width: 200px; height: auto; margin: .35rem auto; }
.record-paper { fill: var(--card); stroke: var(--muted); stroke-width: 1.5; }
.record-line { fill: none; stroke: var(--muted); stroke-width: 1.5; }
.record-dot { fill: var(--muted); }
.record-check { fill: none; stroke: var(--green); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.altered-entry { fill: var(--card); stroke: var(--diagram-amber); stroke-width: 1.5; stroke-dasharray: 4 3; }
.record-verdict { display: block; font-size: .75rem; line-height: 1.4; }
.evaluator-stage { text-align: center; }
.positive-judgment { padding: .65rem .45rem; border: 2px solid var(--green); border-radius: 6px; color: var(--green); font-size: 1.05rem; font-weight: 750; white-space: nowrap; }
.diagram .evaluator-stage p { font-size: .72rem; color: var(--muted); margin: .55rem 0 0; }
.diagram .exploitgym-annotation { max-width: none; margin: 1rem 0 0; padding-top: .75rem; border-top: 1px solid var(--border); font-size: .79rem; color: var(--muted); }
.diagram .observation-note { max-width: none; margin: 1rem 0 0; padding-left: .9rem; border-left: 1px dashed var(--muted); color: var(--muted); font-size: .8rem; }
@media (max-width: 820px) {
  .evidence-case { padding: 1rem; }
  .evidence-case-flow { grid-template-columns: 1fr; gap: .65rem; }
  .evidence-step-arrow { transform: rotate(90deg); line-height: 1; }
  .trajectory-pair { max-width: 440px; margin: auto; }
  .evidence-record-stage { border-left: 0; border-top: 1px dashed var(--muted); padding: .85rem 0 0; }
  .evidence-case .record-sources { font-size: .73rem; }
  .observation-boundary { font-size: .7rem; }
  .evidence-record { max-width: 180px; }
  .evidence-intervention { width: fit-content; margin: auto; padding: .3rem .6rem; }
  .evaluator-stage { width: 100%; max-width: 240px; margin: auto; }
  .trajectory-state > strong { font-size: .8rem; }
}