/* page styles: advisory stream (loaded after site.css; no inline styles, CSP) */

/* ---------- the diagram: a structural figure, not a plate (DESIGN_REVIEW fix 4) ----------
   <figure class="diagram"><svg class="diag" viewBox="0 0 300 N">…</svg><figcaption>…</figcaption></figure>
   No exhibit id, no reading, no source line, no STRATURE mark: those belong to plates that carry a figure.
   The SVG is drawn in a 300-unit-wide viewBox so its type is never below 10px on a 375px phone; it is
   capped at 440px so the type does not outgrow the page's own apparatus. */
.diagram{border-top:1px solid var(--ink);padding-top:16px;margin:0}
.diagram figcaption{font-family:var(--sans);font-size:12.5px;line-height:1.45;color:var(--graphite);margin-top:12px;max-width:62ch}
.diag{display:block;width:100%;max-width:440px;height:auto;overflow:visible}
.diag text{font-family:var(--sans);font-size:11.5px;fill:var(--ink);font-weight:400}
.diag .t-lbl{font-size:10px;font-weight:600;letter-spacing:.12em;fill:var(--graphite)}
.diag .t-lbl.tight{letter-spacing:.06em}
.diag .t-ttl{font-family:var(--serif);font-weight:600;font-size:14px;fill:var(--ink)}
.diag .t-mono{font-family:var(--mono);font-size:11px;fill:var(--graphite)}
.diag .t-acc{fill:var(--verm)}
.diag .box{fill:var(--white);stroke:var(--ink);stroke-width:1.25}
.diag .box.tint{fill:var(--tint)}
.diag .box.accent{stroke:var(--verm);stroke-width:1.5}
.diag .ln{stroke:var(--ink);stroke-width:1.25;fill:none}
.diag .dash{stroke:var(--ink);stroke-width:1.5;stroke-dasharray:4 3;fill:none}
.diag .open{fill:url(#hatch);stroke:var(--graphite);stroke-width:1;stroke-dasharray:3 3}
.diag .hatch-line{stroke:var(--hair);stroke-width:1}
.diag .dot{fill:var(--ink)}
.diag .cell{fill:var(--white);stroke:var(--hair);stroke-width:1}
/* the diagram on a navy field */
.on-navy .diagram{border-top-color:var(--paper)}
.on-navy .diagram figcaption{color:rgba(251,249,245,.8)}
.on-navy .diag text{fill:var(--white)}
.on-navy .diag .t-lbl,.on-navy .diag .t-mono{fill:rgba(251,249,245,.8)}
.on-navy .diag .t-acc{fill:var(--coral)}
.on-navy .diag .box{fill:var(--navy);stroke:var(--paper)}
.on-navy .diag .box.tint{fill:rgba(251,249,245,.1)}
.on-navy .diag .box.accent{stroke:var(--coral)}
.on-navy .diag .ln,.on-navy .diag .dash{stroke:var(--paper)}
.on-navy .diag .dot{fill:var(--paper)}
.on-navy .diag .hatch-line{stroke:rgba(251,249,245,.35)}
.on-navy .diag .open{stroke:rgba(251,249,245,.6)}

/* ---------- shared advisory blocks ---------- */
.adv-intro .prose p:first-child{font-size:19px;line-height:1.45}
@media (min-width:900px){.adv-intro .prose p:first-child{font-size:21px}}
.adv-fig{display:grid;gap:24px}
@media (min-width:900px){.adv-fig{grid-template-columns:4fr 8fr;gap:64px;align-items:start}.adv-fig .opener{margin-bottom:0}}
.tiles.three{grid-template-columns:1fr}
@media (min-width:600px){.tiles.three{grid-template-columns:repeat(3,1fr);column-gap:32px}}
@media (min-width:900px){.tiles.three{column-gap:48px}}
.tiles + .opener{margin-top:48px}
.prose .fine.related{margin-top:24px}

/* ---------- geo-business: the two-column "what we read / what it changes" list ---------- */
.adv-cols{display:grid;gap:32px;border-top:1px solid var(--ink)}
.adv-col h3{font-family:var(--serif);font-weight:600;font-size:20px;line-height:1.25;padding-top:16px}
.adv-col ol{list-style:none;counter-reset:c;margin-top:8px}
.adv-col li{counter-increment:c;display:grid;grid-template-columns:32px 1fr;gap:12px;padding:14px 0;border-top:1px solid var(--hair);font-size:16px;text-wrap:pretty}
.adv-col li::before{content:counter(c,decimal-leading-zero);font-family:var(--mono);font-size:12px;color:var(--graphite);padding-top:3px}
.adv-col li b{font-weight:600}
@media (min-width:900px){.adv-cols{grid-template-columns:1fr 1fr;gap:64px}}

/* ---------- geopolitics: the three domains as one row, on navy ---------- */
.domains{display:grid;gap:0;border-top:1px solid rgba(251,249,245,.35)}
.domain{padding:24px 0;border-bottom:1px solid rgba(251,249,245,.22)}
.domain h3{font-family:var(--serif);font-weight:600;font-size:24px;line-height:1.2;margin:8px 0 12px}
.domain p{font-size:16px;max-width:38ch;text-wrap:pretty}
.domain .lvl{margin-top:12px;font-family:var(--mono);font-size:12px;color:rgba(251,249,245,.8)}
@media (min-width:900px){.domains{grid-template-columns:repeat(3,1fr);column-gap:48px}.domain{padding:32px 0;border-bottom:0}.domain + .domain{border-left:1px solid rgba(251,249,245,.22);padding-left:32px}}

/* ---------- forecasting: the register line as the page's own band ---------- */
.register{border-top:2px solid var(--ink);padding-top:20px}
.register .line{font-family:var(--serif);font-size:clamp(22px,2.6vw,30px);line-height:1.3;max-width:34ch;text-wrap:pretty}
.register .fine{margin-top:16px}

/* ---------- presentations: the room, one column, the three lengths ---------- */
.room{max-width:66ch}
.room .diagram{margin-top:24px}
.lengths{list-style:none;border-top:1px solid var(--ink);margin-top:32px}
.lengths li{display:grid;grid-template-columns:1fr;gap:4px;padding:16px 0;border-bottom:1px solid var(--hair)}
.lengths .l{font-family:var(--serif);font-weight:600;font-size:20px;line-height:1.25}
.lengths .d{font-size:16px;max-width:60ch;text-wrap:pretty}
@media (min-width:600px){.lengths li{grid-template-columns:200px 1fr;gap:4px 24px;align-items:start}}