/* Flagship publications (hidden review copies under the Library). Loaded after site.css + insights.css;
   reuses the essay design (.ep-*) and the site tokens only. No inline styles anywhere. */

/* ---------- review banner ---------- */
.review-banner { background: var(--amber-soft); color: var(--t1); border-block-end: 1px solid var(--b1); }
.review-banner p { margin: 0; padding: 10px var(--gutter); max-width: var(--maxw); margin-inline: auto; font-size: .9rem; line-height: 1.5; }
.review-banner strong { color: var(--warn); margin-inline-end: 8px; }
.review-banner .rb-n { color: var(--t2); }
@media print { .review-banner { border: 1px solid #000; } }

/* ---------- hero extras ---------- */
.fs-epigraph { margin: 12px 0 20px; padding-inline-start: 14px; border-inline-start: 3px solid var(--acc); color: var(--t2); font-style: italic; max-width: 60ch; }
.ep-kicker .lib-code { font-family: var(--font); font-size: .8em; letter-spacing: .02em; color: var(--t3); }
.ep-meta .dot { display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: var(--t3); margin-inline: 8px; vertical-align: middle; }

/* ---------- body ---------- */
.fs-front h2 { font-size: 1.2rem; }
.fs-aside { color: var(--t2); }
.fs-calc { margin: 20px 0; padding: 14px 16px; border: 1px solid var(--b1); border-radius: var(--r-md); background: var(--s2); }
.fs-calc p { margin: 0; }
.fs-pre { margin: 20px 0; padding: 14px 16px; overflow-x: auto; border: 1px solid var(--b1); border-radius: var(--r-md); background: var(--s2);
  font: .8rem/1.45 ui-monospace, "Cascadia Mono", Consolas, "SF Mono", Menlo, monospace; white-space: pre; text-align: start; }
html[lang="ar"] .fs-pre { font-family: var(--font-ar), ui-monospace, monospace; }
.ep-body h4 { font-size: 1rem; margin: 22px 0 6px; }
.ep-body blockquote { margin: 20px 0; padding-inline-start: 16px; border-inline-start: 3px solid var(--acc); color: var(--t2); }
.ep-body blockquote p { margin: 0; }
.ep-body code { font: .9em ui-monospace, Consolas, monospace; background: var(--s2); padding: 1px 5px; border-radius: 4px; }
.ep-body .sar { fill: currentColor; }

/* ---------- cite ---------- */
/* the Cite this block is styled by cite.css (shared with the volumes and essays) */

/* ---------- figures: charts, slots, apps (self-contained; not viz.css) ---------- */
.viz { margin: 28px 0; padding: 18px; border: 1px solid var(--b1); border-radius: var(--r-lg); background: var(--s1); }
.viz-h { margin-block-end: 10px; }
.viz-k { margin: 0 0 4px; font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; color: var(--t3); display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
html[lang="ar"] .viz-k { letter-spacing: 0; }
.viz-badge { font-size: .74rem; text-transform: none; letter-spacing: 0; padding: 2px 8px; border-radius: 999px; background: var(--amber-soft); color: var(--warn); }
.viz-t { margin: 0; font-weight: 700; font-size: 1.1rem; line-height: 1.35; color: var(--t1); }
.viz-p { margin: 6px 0 0; color: var(--t2); font-size: .95rem; }
.viz-stage { margin: 12px 0; }
.viz-src { margin: 10px 0 0; font-size: .85rem; color: var(--t3); }
.viz-notice { margin: 10px 0 0; font-size: .9rem; color: var(--t2); border-block-start: 1px solid var(--b1); padding-block-start: 10px; }
.viz-table { margin: 12px 0 0; }
.viz-table > summary { cursor: pointer; font-size: .9rem; color: var(--t2); }
.viz-tw { overflow-x: auto; margin: 8px 0 0; }
.viz-tbl { width: 100%; border-collapse: collapse; font-size: .875rem; }
.viz-tbl th, .viz-tbl td { padding: 6px 8px; border-block-end: 1px solid var(--b1); text-align: start; vertical-align: top; }
.viz-tbl th[scope="col"] { color: var(--t3); font-weight: 600; }
.viz-tbl caption { text-align: start; color: var(--t3); padding: 4px 0; }
.fs-outs { margin: 8px 0 0; padding-inline-start: 18px; font-size: .9rem; color: var(--t2); }
.fs-outs li { list-style: disc; }
.fs-buildnote { margin: 10px 0 0; font-size: .82rem; color: var(--t3); }
.viz--slot { border-style: dashed; }
.fs-slot { margin: 12px 0; padding: 12px 14px; border-radius: var(--r-md); background: var(--amber-soft); color: var(--t1); font-size: .9rem; }
.fs-slot p { margin: 0; }
.fs-slot-k { font-weight: 700; color: var(--warn); margin-block-end: 4px !important; }

/* fallback SVGs */
.fs-svg { display: block; width: 100%; height: auto; max-height: 360px; font-family: var(--font); }
html[lang="ar"] .fs-svg { font-family: var(--font-ar); }
.fs-svg text { fill: var(--t1); font-size: 11px; }
.fs-svg .fs-small { font-size: 9px; }
.fs-svg .fs-val { fill: var(--t2); font-size: 10px; }
.fs-svg .fs-axis { stroke: var(--b2); stroke-width: 1; }
.fs-svg .fs-line { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.fs-svg .fs-line-0 { stroke: var(--acc); }
.fs-svg .fs-line-1 { stroke: var(--amber); }
.fs-svg .fs-line-2 { stroke: var(--bad); }
.fs-svg .fs-bar-acc { fill: var(--acc-fill); }
.fs-svg .fs-bar-muted { fill: var(--bar-muted); }
.fs-svg .fs-bar-bad { fill: var(--bad); fill-opacity: .7; }
.fs-svg .fs-bar-dash { fill: none; stroke: var(--acc); stroke-dasharray: 3 2; }
.fs-svg .fs-cell { fill: var(--b1); }
.fs-svg .fs-cell-1 { fill: var(--amber-soft); stroke: var(--amber); stroke-width: .5; }
.fs-svg .fs-cell-2 { fill: var(--acc-soft); stroke: var(--acc); stroke-width: .5; }

/* ---------- embedded apps ---------- */
.gt-app, .cbc-app, .ai-app, .cg-app, .md-app { margin: 28px 0; }
.ai-app > figure.viz, .cg-app > figure.viz, .md-app > figure.viz { margin-inline: 0; }
.fs-app-head { margin-block-end: 8px; }
.fs-app-privacy { margin: 4px 0 0; font-size: .85rem; color: var(--t3); }
.fs-app-nojs { margin: 8px 0 0; padding: 10px 12px; border-radius: var(--r-md); background: var(--amber-soft); font-size: .9rem; }
.gt-app .gt-h1 { font-size: var(--fs-h2); line-height: 1.2; margin: 0 0 6px; }
.gt-app .brand, .gt-app .top { display: none; }
/* insights.css styles .dot as a 3px separator; the app's .dot is a 36px leaf button */
.gt-app .dot { opacity: 1; margin-inline: 0; }
/* the app was laid out for a 1200px main; inside the 720px essay column its two-column layouts squeeze inputs to 26px */
.gt-app .gform, .gt-app .fld, .gt-app .hero, .gt-app .tree-wrap, .gt-app .verdict-grid { grid-template-columns: 1fr !important; }
.cbc-app > figure.viz { margin-inline: 0; }
.cbc-app .viz-t { font-size: 1.1rem; }


/* --- appendices (companion sub-pages of a flagship) ------------------------------------------------ */
.fs-appendices { margin: 32px 0 0; padding: 16px 18px; border: 1px dashed var(--b2); border-radius: var(--r-md); }
.fs-appendices h2 { font-size: 1.0625rem; margin: 0 0 6px; }
.fs-appx-n { margin: 0 0 10px; font-size: .9rem; color: var(--t3); }
.fs-appendices ul { margin: 0; padding-inline-start: 1.2em; }
.fs-appendices li + li { margin-block-start: 4px; }
.ep-layout--single { grid-template-columns: minmax(0, 760px); justify-content: center; }
.fs-appx-meta { margin: 0 0 24px; padding: 12px 16px; border-inline-start: 3px solid var(--acc-line); background: var(--s1); border-radius: var(--r-sm); list-style: none; font-size: .9375rem; }
.fs-appx-meta li + li { margin-block-start: 4px; }
.fs-appx-en { text-align: start; }
.fs-appx .tbl-wrap { overflow-x: auto; }
.fs-appx .ep-table tbody th { white-space: normal; overflow-wrap: anywhere; }
.fs-appx .ep-table td { overflow-wrap: anywhere; }
.fs-appx-back { margin-block-start: 40px; }
.fs-print-row { margin: 0 0 24px; }
.fs-print-row .btn .i { width: 16px; height: 16px; margin-inline-end: 6px; transform: rotate(90deg); }
.fs-pre-line { font-family: var(--font); font-variant-numeric: tabular-nums; }
/* the Growth Tree as text */
.prose .gt-tree, .prose .gt-tree ol { list-style: none; margin: 0; padding: 0; counter-reset: none; }
.prose .gt-tree > li, .prose .gt-tree ol > li { padding-inline-start: 0; }
.prose .gt-tree > li::before, .prose .gt-tree ol > li::before { content: none; }
.prose .gt-tree ol { margin-inline-start: 18px; padding-inline-start: 14px; border-inline-start: 1px solid var(--b1); }
.gt-node { margin: 14px 0; break-inside: avoid; }
.gt-n { margin: 0 0 4px; font-size: 1rem; }
.gt-sym { display: inline-block; min-width: 2.6em; font-family: var(--font); font-weight: 700; color: var(--acc); font-variant-numeric: tabular-nums; }
.gt-lvl { margin-inline-start: 8px; font-size: .75rem; color: var(--t3); text-transform: uppercase; letter-spacing: .06em; }
:lang(ar) .gt-lvl { text-transform: none; letter-spacing: 0; }
.gt-root > .gt-n, .gt-branch > .gt-n { font-size: 1.125rem; }
.gt-dl { margin: 0 0 6px; font-size: .9rem; display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 2px 12px; }
.gt-f { display: contents; }
.gt-dl dt { color: var(--t3); font-weight: 600; }
.gt-dl dd { margin: 0; color: var(--t2); }
.gt-dl dd ul { margin: 0; padding-inline-start: 1.1em; }
.gt-verdict dd { font-weight: 600; color: var(--t1); }
.gt-verdict[data-mkt="1"] dd { color: var(--acc); }
@media (max-width: 560px) { .gt-dl { grid-template-columns: minmax(0, 1fr); } .gt-dl dt { margin-block-start: 6px; } .prose .gt-tree ol { margin-inline-start: 8px; padding-inline-start: 10px; } }
@media print {
  .fs-appx .ep-hero { padding-block: 0; }
  .fs-print-row, .fs-appx-back, .crumbs, .ep-meta, .site-header, .site-footer, header.header, footer.footer { display: none !important; }
  .ep-layout--single { display: block; }
  .prose .gt-tree ol { border-inline-start-color: #999; }
  .gt-node { margin: 8px 0; }
  .gt-dl { font-size: 9.5pt; }
  .gt-root > .gt-n, .gt-branch > .gt-n { break-after: avoid; }
  .gt-branch { break-before: auto; }
  .gt-sym { color: #000; }
  .gt-verdict[data-mkt="1"] dd { color: #000; text-decoration: underline; }
  @page { size: A4; margin: 14mm; }
}
