/* Shared visual language for the two research narratives. No external fonts. */
:root { --paper:#fbfbf8; --ink:#202b2c; --muted:#596667; --line:#dfe3de; --accent:#185e60; --accent-light:#e8f0ec; --soft:#f2f4ef; --warm:#a55e39; --white:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:100px; }
body { margin:0; background:var(--paper); color:var(--ink); font:19px/1.7 "Segoe UI",Arial,sans-serif; -webkit-font-smoothing:antialiased; }
body.theme-tabular { --accent:#89552e; --accent-light:#f2ece2; --soft:#f6f2eb; --ink:#322e26; --muted:#6b655a; }
button,input,select { font:inherit; }
button,a,input,select,summary { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
a { color:var(--accent); text-decoration-thickness:1px; text-underline-offset:4px; }
a:hover { text-decoration:underline; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible { outline:3px solid var(--accent); outline-offset:5px; }
button:disabled { cursor:default; }
[hidden] { display:none!important; }
img { max-width:100%; }
h1,h2,h3,p,figure { margin:0; }
h1,h2 { font-family:Georgia,"Times New Roman",serif; font-weight:400; }
h1 { font-size:clamp(44px,4.8vw,76px); line-height:1.05; letter-spacing:-.045em; max-width:620px; }
h2 { font-size:clamp(32px,3vw,44px); line-height:1.16; letter-spacing:-.03em; }
h3 { font-size:27px; line-height:1.3; letter-spacing:-.025em; }
.section-width { width:min(1320px,calc(100% - 96px)); margin-inline:auto; }
.eyebrow { color:var(--accent); font:600 16px/1.6 "Segoe UI",Arial,sans-serif; text-transform:uppercase; letter-spacing:.08em; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; left:12px; top:-70px; z-index:200; background:var(--white); padding:12px 20px; }
.skip-link:focus { top:10px; }
.site-header { min-height:84px; padding:15px 40px; display:flex; align-items:center; gap:32px; position:sticky; top:0; z-index:40; border-bottom:1px solid var(--line); background:var(--paper); }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--ink); font-size:18px; font-weight:650; line-height:1.4; margin-right:auto; }
.brand small { display:block; color:var(--muted); font-size:16px; font-weight:400; }
.brand:hover { text-decoration:none; color:var(--accent); }
.site-header nav { display:flex; gap:27px; }
.site-header nav a { font-size:16px; text-decoration:none; color:var(--muted); white-space:nowrap; }
.site-header nav a[aria-current] { color:var(--accent); border-bottom:1px solid var(--accent); }
.site-header nav a:hover { color:var(--accent); }
.site-header nav a { font-size:16px; }
.motion-toggle { border:1px solid var(--line); background:none; color:var(--muted); font-size:16px; padding:6px 10px; white-space:nowrap; }
.hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.14fr); align-items:stretch; gap:56px; padding-top:50px; padding-bottom:50px; }
.hero-copy { display:flex; flex-direction:column; align-items:flex-start; min-width:0; }
.hero-copy>.eyebrow { margin-bottom:20px; }
.hero-subtitle { margin-top:26px; font:27px/1.4 Georgia,serif; letter-spacing:-.015em; max-width:510px; }
.hero-intro { color:var(--muted); max-width:560px; font-size:19px; line-height:1.75; margin-top:18px; }
.hero-actions { display:flex; gap:22px; align-items:center; flex-wrap:wrap; margin-top:26px; }
.button-link { display:inline-flex; align-items:center; justify-content:center; gap:14px; border:1px solid var(--accent); border-radius:6px; padding:12px 18px; color:var(--accent); font-size:16px; font-weight:600; text-decoration:none; transition:background .2s,color .2s; }
.button-link.primary { color:var(--white); background:var(--accent); }
.button-link:hover { text-decoration:none; background:var(--accent-light); color:var(--accent); }
.quiet-link { display:inline-flex; align-items:center; gap:9px; font-size:16px; text-decoration:none; }
.link-arrow { display:inline-block; width:18px; height:18px; flex:none; vertical-align:-.15em; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
a[target="_blank"]>.link-arrow,.figure-button .link-arrow { width:14px; height:14px; margin-left:3px; }
.hero-roadmap { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 22px; width:100%; margin-top:auto; padding-top:27px; }
.hero-roadmap>.small-label { grid-column:1/-1; margin-bottom:8px; font-size:16px; }
.hero-roadmap>a { display:flex; align-items:center; gap:9px; min-height:43px; border-top:1px solid var(--line); padding-block:9px; font-size:16px; line-height:1.5; text-decoration:none; }
.hero-roadmap>a>span { color:var(--muted); font:16px/1.4 Georgia,serif; }
.hero-roadmap>a>.link-arrow { width:15px; height:15px; margin-left:auto; opacity:.6; }
.hero-roadmap>a:hover { color:var(--ink); }
.hero-roadmap>a:hover>.link-arrow { opacity:1; }
.thesis-band { border-block:1px solid var(--line); background:var(--accent-light); padding-block:23px; }
.thesis-band p { font:20px/1.6 Georgia,serif; color:var(--accent); }
.explainer { border:1px solid var(--line); border-radius:16px; background:var(--white); padding:25px 26px 22px; min-width:0; }
.explainer-top { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:9px; border-bottom:1px solid var(--line); padding-bottom:16px; margin-bottom:20px; }
.diagram-tag { color:var(--muted); font-size:16px; }
.diagram-note { margin-top:15px; color:var(--muted); font-size:16px; line-height:1.7; }
.text-button { border:0; padding:3px 0; background:none; font-size:16px; color:var(--accent); text-align:left; }
.text-button:hover { text-decoration:underline; text-underline-offset:4px; }
.text-button span { margin-left:6px; }
.explainer-controls { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:14px; }
.story-caption { min-height:105px; border-top:1px solid var(--line); padding-top:16px; }
.story-caption strong { font-size:18px; font-weight:650; }
.story-caption p { color:var(--muted); font-size:16px; line-height:1.8; margin-top:7px; max-width:490px; }
.mode-controls { display:flex; gap:5px; margin-bottom:21px; }
.mode-controls button { flex:1; padding:8px 5px; border:1px solid var(--line); background:none; font-size:16px; line-height:1.5; color:var(--muted); }
.mode-controls button[aria-pressed=true] { background:var(--accent); color:var(--white); border-color:var(--accent); }
.table-scene { display:grid; grid-template-columns:minmax(0,1fr); gap:18px; align-items:center; }
.small-label { font-size:16px; color:var(--muted); margin-bottom:8px; }
.demo-table { border-collapse:collapse; width:100%; table-layout:fixed; font-size:16px; text-align:left; }
.demo-table th { color:var(--accent); font-weight:600; padding:7px 3px; border-bottom:1px solid var(--accent); }
.demo-table td { padding:11px 4px; border-bottom:1px solid var(--line); transition:background .4s,color .4s; }
.demo-table th:nth-child(3) { width:29%; }
.query-row { color:var(--muted); }
.target-cell { font:22px/1 Georgia,serif; color:var(--accent); }
.table-footnote { font-size:16px; line-height:1.65; color:var(--muted); margin-top:12px; }
.table-output { padding:16px 0 0; border-top:1px solid var(--line); min-width:0; }
.table-output>[data-table-output] { display:grid; grid-template-columns:minmax(140px,.8fr) minmax(0,1fr); grid-template-rows:auto 1fr; column-gap:20px; min-height:125px; align-items:center; }
.table-output>[data-table-output="structure"] { grid-template-columns:minmax(210px,1fr) minmax(0,1fr); }
.output-label { grid-column:1; align-self:end; font-size:16px; display:block; color:var(--accent); line-height:1.5; text-align:center; }
.retrieved-value,.prediction-value { grid-column:1; font:44px/1.3 Georgia,serif; color:var(--accent); text-align:center; }
.prediction-value { display:flex; align-items:center; gap:7px; justify-content:center; }
.context-dots { font-size:32px; letter-spacing:.08em; opacity:.5; }
.table-output p { grid-column:2; grid-row:1/3; font-size:16px; color:var(--muted); line-height:1.7; padding-left:20px; border-left:1px solid var(--line); }
.table-output>[data-table-output] { animation:output-reveal .5s ease both; }
@keyframes output-reveal { from{opacity:.2;transform:translateY(6px)}to{opacity:1;transform:none} }
.table-demo[data-mode="retrieve"] .retrieval-row { background:var(--accent-light); color:var(--accent); }
.table-demo[data-mode="predict"] .target-cell { background:var(--accent-light); }
.table-demo[data-mode="structure"] .demo-table th { background:var(--accent-light); }
.table-demo .story-caption { margin-top:18px; min-height:0; }
.table-demo .story-caption p { line-height:1.65; }
.table-demo .diagram-note { font-size:16px; line-height:1.65; }
.causal-graph { grid-column:1; display:block; width:100%; max-width:250px; margin-inline:auto; margin-top:4px; color:var(--accent); overflow:visible; }
.causal-graph rect { fill:var(--accent-light); stroke:var(--accent); stroke-width:1; }
.causal-graph text { fill:var(--accent); font:18px "Segoe UI",sans-serif; text-anchor:middle; }
.graph-edge { stroke:currentColor; fill:none; stroke-width:2.8; marker-end:url(#causal-arrow); stroke-dasharray:100; animation:draw-line 1.1s ease both; }
@keyframes draw-line { from{stroke-dashoffset:100;opacity:.2}to{stroke-dashoffset:0;opacity:1} }
.reading-layout { display:grid; grid-template-columns:205px minmax(0,1fr); gap:45px; padding-top:30px; }
.reading-nav { position:sticky; top:116px; align-self:start; padding-top:35px; padding-bottom:35px; min-width:0; }
.reading-nav nav { display:grid; margin-top:18px; gap:1px; }
.reading-nav nav>a { padding:10px 8px 10px 0; text-decoration:none; color:var(--muted); font-size:16px; line-height:1.5; display:flex; align-items:center; gap:10px; border-right:2px solid transparent; }
.reading-nav nav>a>span { width:18px; font-size:16px; color:var(--accent); }
.reading-nav nav>a.is-current { color:var(--accent); font-weight:650; border-right-color:var(--accent); }
.reading-nav nav>a:hover { color:var(--accent); }
.other-direction { margin-top:36px; padding-top:20px; border-top:1px solid var(--line); display:block; text-decoration:none; color:var(--muted); font-size:16px; }
.other-direction strong { color:var(--accent); font-weight:500; display:block; margin-top:5px; }
.chapters { min-width:0; }
.chapter { padding-block:40px 52px; border-bottom:1px solid var(--line); }
.chapter-heading { display:flex; gap:22px; margin-bottom:30px; }
.chapter-number { font:40px/1.05 Georgia,serif; color:var(--accent); opacity:.55; width:40px; flex:none; }
.chapter-heading .eyebrow { margin-bottom:12px; font-size:16px; }
.chapter-heading h2 { max-width:720px; }
.chapter-intro { color:var(--muted); font-size:19px; line-height:1.9; max-width:740px; margin-top:20px; }
.work { display:grid; grid-template-columns:minmax(0,1fr); gap:25px; padding-block:27px; border-top:1px solid var(--line); }
.work.has-figure { grid-template-columns:minmax(0,1fr) 220px; align-items:center; }
.work-copy { min-width:0; }
.method-cluster { min-width:0; margin-block:32px; border:1px solid var(--line); border-radius:18px; background:var(--white); overflow:hidden; }
.method-cluster>.tmv-scene,.method-cluster>.rmv-scene,.method-cluster>.rpv-deployment { margin:0; border:0; border-radius:0; background:linear-gradient(145deg,var(--white) 55%,var(--soft)); }
.method-cluster>.work { margin:0; padding:27px 28px; }
.method-cluster>.work h3 { font-size:25px; }
.method-cluster>.causal-worlds { padding:27px 28px; margin:0; background:var(--soft); }
.publication-type { color:var(--muted); font-size:16px; letter-spacing:.07em; text-transform:uppercase; margin-bottom:9px; }
.work h3 { color:var(--accent); margin-bottom:8px; }
.work-role { font-size:16px; font-weight:650; color:var(--ink); margin-bottom:12px; }
.work-copy>p:not([class]) { color:var(--muted); font-size:19px; line-height:1.85; }
.foundation-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-bottom:30px; }
.foundation-grid .work { display:block; min-width:0; padding:24px; background:var(--white); border:1px solid var(--line); border-radius:10px; }
.foundation-grid .work-copy { display:flex; flex-direction:column; height:100%; }
.foundation-grid .work h3 { font:25px/1.3 Georgia,serif; letter-spacing:-.02em; overflow-wrap:break-word; }
.foundation-grid .work-copy>p:not([class]) { font-size:16px; line-height:1.75; }
.foundation-grid .work-role { font-size:16px; margin-bottom:10px; }
.foundation-grid .takeaway { font-size:17px; }
.foundation-grid .paper-links { padding-top:16px; margin-top:auto; }
.foundation-grid .citation { margin-bottom:4px; }
.result-note { color:var(--muted); background:var(--soft); border-left:2px solid var(--accent); padding:12px 15px; margin-top:17px; font-size:16px; line-height:1.75; }
.result-note strong { display:block; color:var(--accent); font-size:16px; font-weight:650; margin-bottom:3px; }
.task-brief { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin:0 0 30px; padding:23px 26px; border-block:1px solid var(--line); background:var(--soft); }
.task-brief>div { min-width:0; }
.task-brief dt { color:var(--accent); font-size:16px; font-weight:650; margin-bottom:8px; }
.task-brief dd { margin:0; color:var(--muted); font-size:16px; line-height:1.75; }
.future-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.future-grid article { min-width:0; padding:25px; background:var(--soft); border:1px solid var(--line); border-radius:10px; }
.future-grid h3 { font:28px/1.3 Georgia,serif; color:var(--accent); margin-top:13px; }
.future-grid article>p:not([class]) { font-size:18px; line-height:1.8; color:var(--muted); margin-top:18px; }
.future-question { font:19px/1.6 Georgia,serif; color:var(--accent); margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }
.takeaway { margin-top:14px; font:18px/1.6 Georgia,serif; color:var(--ink); }
.paper-links { display:flex; gap:16px; flex-wrap:wrap; margin-top:15px; }
.paper-links a { font-size:16px; font-weight:600; text-decoration:none; }
.paper-links a:hover { text-decoration:underline; }
.paper-links a>span { opacity:.6; }
.figure-button { padding:0; border:1px solid var(--line); border-radius:10px; overflow:hidden; background:var(--white); width:100%; text-align:left; }
.figure-button img { display:block; width:100%; height:154px; object-fit:contain; padding:7px; }
.figure-button>span { display:block; font-size:16px; color:var(--muted); padding:8px 10px; border-top:1px solid var(--line); }
.figure-button:hover>span { color:var(--accent); }
.work.has-figure.work-evidence { grid-template-columns:minmax(0,1fr); gap:24px; }
.paper-evidence { min-width:0; padding:20px; border:1px solid var(--line); border-radius:14px; background:var(--white); }
.paper-evidence .figure-button { display:block; max-width:var(--paper-figure-width,760px); margin-inline:auto; border-radius:8px; }
.paper-evidence .figure-button img { height:auto; min-height:0; max-height:none; padding:12px; }
.paper-evidence .figure-button>span { text-align:right; padding:9px 13px; }
.paper-evidence figcaption { padding-top:18px; color:var(--muted); font-size:17px; line-height:1.75; }
.paper-evidence figcaption strong { display:block; color:var(--ink); font-size:19px; font-weight:650; }
.paper-evidence figcaption p { margin-top:7px; }
.paper-evidence figcaption a { display:inline-flex; align-items:center; margin-top:10px; color:var(--accent); font-size:16px; text-underline-offset:4px; }
.evidence-links { display:flex; flex-wrap:wrap; gap:0 22px; }
@media(max-width:600px) { .paper-evidence { padding:12px; border-radius:10px; }.paper-evidence .figure-button img { padding:5px; }.paper-evidence figcaption { font-size:16px; }.paper-evidence figcaption strong { font-size:18px; } }
.citation { margin-top:12px; font-size:16px; color:var(--muted); }
.citation summary { cursor:pointer; width:fit-content; }
.citation p { line-height:1.7; font-size:16px; margin-top:8px; }
.related { border-left:2px solid var(--accent); padding:1px 0 1px 18px; margin:14px 0 24px; font-size:16px; color:var(--muted); }
.related-links { display:flex; gap:12px 18px; flex-wrap:wrap; margin-top:10px; }
.related-links a { font-size:16px; text-decoration:none; }
.transition { display:flex; align-items:flex-start; gap:13px; margin-top:25px; font:20px/1.65 Georgia,serif; color:var(--accent); }
.transition-icon { display:grid; place-items:center; width:34px; height:34px; flex:none; color:var(--accent); background:var(--accent-light); border-radius:8px; }
.transition-icon svg { width:27px; height:27px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.causal-worlds { padding:25px 0 5px; margin-bottom:18px; }
.world-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:15px; }
.world-grid>div { padding-top:14px; border-top:2px solid var(--accent); }
.world-grid span { font-size:16px; color:var(--muted); }
.world-grid h3 { font:22px/1.4 Georgia,serif; margin-block:5px; color:var(--accent); }
.world-grid p { font-size:16px; color:var(--muted); line-height:1.8; }
.world-caption { font-size:16px; color:var(--accent); margin-top:20px; }
.programme-bridge { display:flex; gap:35px; justify-content:space-between; align-items:center; padding:38px 42px; margin-block:65px; background:var(--accent-light); }
.programme-bridge h2 { font-size:34px; margin-top:10px; max-width:630px; }
.programme-bridge p:not([class]) { color:var(--muted); max-width:630px; font-size:16px; margin-top:14px; }
.programme-bridge .button-link { flex:none; }
.resource-section { padding-top:10px; padding-bottom:65px; }
.resource-section>header { display:grid; gap:11px; }
.resource-section>header>p:last-child { color:var(--muted); font-size:16px; }
.resource-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:40px; margin-top:35px; }
.resource-grid article { border-top:2px solid var(--accent); padding-top:18px; }
.resource-grid h3 { margin-block:8px; font:29px/1.3 Georgia,serif; }
.resource-grid article>p:not([class]) { font-size:16px; color:var(--muted); min-height:47px; }
.resource-grid a { display:inline-block; font-size:16px; margin-top:17px; text-decoration:none; }
.resource-directory { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:35px 48px; margin-top:35px; }
.resource-directory article { min-width:0; border-top:2px solid var(--accent); padding-top:20px; }
.resource-directory h3 { font:27px/1.3 Georgia,serif; color:var(--accent); }
.resource-directory ul { padding:0; margin:17px 0 0; list-style:none; }
.resource-directory li { padding-block:14px; border-bottom:1px solid var(--line); }
.resource-directory li>strong { display:block; font-size:16px; font-weight:600; line-height:1.6; }
.directory-links { display:flex; flex-wrap:wrap; gap:6px 18px; margin-top:7px; }
.directory-links a { font-size:16px; text-decoration:none; }
.directory-links a:hover { text-decoration:underline; }
.further-reading { margin-top:45px; border-top:1px solid var(--line); padding-top:22px; display:grid; grid-template-columns:230px 1fr; gap:30px; }
.further-reading h3 { font-size:16px; letter-spacing:0; }
.reading-links { display:flex; flex-wrap:wrap; gap:12px 26px; }
.reading-links a { font-size:16px; text-decoration:none; }
.site-footer { padding-block:35px 45px; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:30px; }
.site-footer strong { font:24px Georgia,serif; }
.site-footer p { color:var(--muted); font-size:16px; margin-top:10px; line-height:1.8; }
.site-footer>div:last-child { display:grid; align-content:start; justify-items:end; gap:10px; }
.site-footer a { font-size:16px; text-decoration:none; }
.site-footer small { color:var(--muted); font-size:16px; }
.editorial-note { color:var(--muted); font-size:16px; line-height:1.7; border-top:1px solid var(--line); padding-block:18px 28px; }
.figure-dialog { max-width:1100px; width:calc(100% - 50px); max-height:90vh; padding:25px; border:1px solid var(--line); color:var(--ink); background:var(--paper); }
.figure-dialog::backdrop { background:rgba(18,30,30,.7); }
.dialog-header { display:flex; justify-content:space-between; gap:25px; align-items:flex-start; margin-bottom:20px; font-size:16px; }
.dialog-header button { border:0; background:none; font-size:16px; color:var(--accent); white-space:nowrap; }
.figure-dialog>img { display:block; max-height:65vh; width:100%; object-fit:contain; background:var(--white); }
.figure-dialog.evidence-dialog { overflow:auto; }
.figure-dialog.evidence-dialog>img { max-height:none; height:auto; }
.figure-dialog.evidence-dialog .dialog-header { position:sticky; top:0; z-index:1; background:var(--paper); }
.figure-dialog>p { font-size:16px; color:var(--muted); margin-top:15px; }
.motion-off { scroll-behavior:auto!important; }
.motion-off *, .motion-off *::before, .motion-off *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
@media(min-width:1550px) { .hero { gap:75px; } .hero-intro { font-size:18px; } .explainer { padding:28px; } }
@media(max-width:1150px) {
  .section-width { width:calc(100% - 64px); }
  .hero { gap:30px; padding-top:55px; }
  .hero-subtitle { font-size:24px; }
  .explainer { padding:18px; }
  .reading-layout { grid-template-columns:175px minmax(0,1fr); gap:30px; }
  .work.has-figure { grid-template-columns:minmax(0,1fr) 190px; gap:20px; }
  .figure-button img { height:130px; }
  .programme-bridge { padding:30px; }
  .programme-bridge h2 { font-size:29px; }
  .programme-bridge .button-link { max-width:235px; }
  .foundation-grid { gap:16px; }
  .foundation-grid .work { padding:20px; }
  .task-brief { gap:18px; padding-inline:20px; }
  .future-grid { gap:18px; }
  .future-grid article { padding:21px; }
}
@media(max-width:1000px) {
  html { scroll-padding-top:145px; }
  .site-header { flex-wrap:wrap; min-height:118px; gap:10px 22px; }
  .site-header nav { order:3; width:100%; justify-content:flex-start; gap:28px; }
}
@media(max-width:900px) {
  .site-header { padding:13px 24px; gap:20px; }
  .site-header nav { gap:17px; }
  .hero { grid-template-columns:1fr; gap:36px; padding-block:45px; }
  .hero-copy { max-width:640px; }
  .hero-roadmap { max-width:640px; margin-top:0; padding-top:25px; }
  h1 { font-size:62px; max-width:760px; }
  .hero-intro { max-width:650px; }
  .hero-subtitle { max-width:640px; }
  .explainer { max-width:720px; width:100%; padding:26px; }
  .story-caption p { font-size:16px; }
  .story-caption strong { font-size:18px; }
  .story-caption { min-height:95px; }
  .table-scene { gap:30px; min-height:240px; }
  .demo-table { font-size:16px; }
  .table-output p,.output-label { font-size:16px; }
  .reading-layout { grid-template-columns:minmax(0,1fr); gap:10px; padding-top:0; }
  .reading-nav { position:sticky; top:118px; z-index:30; display:block; padding:10px 0; background:var(--paper); border-bottom:1px solid var(--line); }
  .reading-nav>.eyebrow,.other-direction { display:none; }
  .reading-nav nav { display:flex; justify-content:space-between; gap:15px; margin:0; overflow-x:auto; scrollbar-width:none; }
  .reading-nav nav::-webkit-scrollbar { display:none; }
  .reading-nav nav>a { white-space:nowrap; border-right:0; border-bottom:2px solid transparent; font-size:16px; padding:7px 0; }
  .reading-nav nav>a.is-current { border-bottom-color:var(--accent); }
  .work.has-figure { grid-template-columns:minmax(0,1fr) 235px; }
  .figure-button img { height:160px; }
  .chapter { scroll-margin-top:65px; }
  .programme-bridge { margin-block:45px; }
  .further-reading { grid-template-columns:1fr; gap:17px; }
  .resource-directory { gap:30px; }
}
@media(max-width:600px) {
  .section-width { width:calc(100% - 36px); }
  .site-header { padding:10px 18px; min-height:112px; gap:9px 15px; flex-wrap:wrap; }
  .brand { font-size:16px; gap:8px; }
  .brand small { font-size:16px; }
  .site-header nav { order:3; width:100%; gap:22px; justify-content:flex-start; }
  .site-header nav a { font-size:16px; }
  .motion-toggle { font-size:16px; padding:5px 7px; }
  .hero { padding-block:34px; gap:30px; }
  h1 { font-size:48px; }
  .hero-copy>.eyebrow { font-size:16px; margin-bottom:18px; }
  .hero-subtitle { margin-top:20px; font-size:24px; }
  .hero-intro { font-size:18px; }
  .hero-actions { gap:20px; margin-top:23px; }
  .button-link { font-size:16px; padding:10px 13px; }
  .quiet-link { font-size:16px; }
  .explainer { padding:15px 13px; }
  .explainer-top .eyebrow { font-size:16px; }
  .diagram-tag { font-size:16px; }
  .story-caption { min-height:114px; }
  .story-caption p { font-size:16px; }
  .story-caption strong { font-size:16px; }
  .text-button { font-size:16px; }
  .diagram-note { font-size:16px; }
  .table-scene { gap:18px; grid-template-columns:minmax(0,1fr); min-height:0; }
  .demo-table { font-size:16px; }
  .demo-table td { padding:11px 4px; }
  .demo-table th { padding-inline:4px; font-size:16px; }
  .small-label { font-size:16px; }
  .table-output { padding:16px 0 0; border-left:0; border-top:1px solid var(--line); }
  .table-output p,.output-label { font-size:16px; }
  .causal-graph { max-width:250px; margin-inline:auto; }
  .mode-controls button { font-size:16px; padding:9px 3px; min-height:44px; }
  .prediction-value,.retrieved-value { font-size:38px; }
  .table-footnote { font-size:16px; }
  .table-demo .story-caption { min-height:0; margin-top:16px; }
  .table-output>[data-table-output] { grid-template-columns:minmax(115px,.8fr) minmax(0,1fr); column-gap:12px; min-height:125px; }
  .table-output>[data-table-output="structure"] { grid-template-columns:minmax(0,1fr); grid-template-rows:auto auto auto; row-gap:8px; }
  [data-table-output="structure"] .output-label { grid-column:1; grid-row:1; }
  [data-table-output="structure"] .causal-graph { grid-column:1; grid-row:2; }
  .table-output>[data-table-output="structure"]>p { grid-column:1; grid-row:3; text-align:center; padding:0; border:0; }
  .table-output p { padding-left:12px; font-size:16px; }
  .table-demo .story-caption p { font-size:16px; }
  .hero-roadmap { gap:0 18px; }
  .hero-roadmap>a { font-size:16px; }
  .hero-roadmap>a>.link-arrow { width:13px; height:13px; }
  .thesis-band { padding-block:18px; }
  .thesis-band p { font-size:18px; }
  .reading-nav { top:112px; }
  .reading-nav nav { gap:18px; }
  .reading-nav nav>a { font-size:16px; gap:5px; }
  .reading-nav nav>a>span { font-size:16px; width:auto; }
  .chapter { padding-block:32px 35px; scroll-margin-top:80px; }
  .chapter-heading { gap:13px; margin-bottom:20px; }
  .chapter-number { font-size:34px; width:30px; }
  .chapter-heading h2 { font-size:32px; }
  .chapter-heading .eyebrow { font-size:16px; margin-bottom:10px; }
  .chapter-intro { font-size:18px; margin-top:15px; line-height:1.85; }
  .work,.work.has-figure { grid-template-columns:1fr; gap:20px; padding-block:23px; }
  .method-cluster { margin-block:24px; border-radius:13px; }
  .method-cluster>.work,.method-cluster>.causal-worlds { padding:23px 18px; }
  .work-copy>p:not([class]) { font-size:18px; }
  .work h3 { font-size:27px; }
  .foundation-grid { grid-template-columns:minmax(0,1fr); gap:17px; margin-bottom:23px; }
  .foundation-grid .work { padding:22px; }
  .foundation-grid .work h3 { font-size:25px; }
  .task-brief { grid-template-columns:minmax(0,1fr); gap:18px; padding:22px; }
  .task-brief dt { margin-bottom:5px; }
  .future-grid { grid-template-columns:minmax(0,1fr); }
  .future-grid article { padding:22px; }
  .future-grid h3 { font-size:27px; }
  .work-role { font-size:16px; }
  .takeaway { font-size:18px; }
  .figure-button { max-width:420px; }
  .figure-button img { height:auto; max-height:220px; min-height:120px; }
  .transition { font-size:20px; }
  .world-grid { grid-template-columns:repeat(2,1fr); gap:22px; }
  .world-grid h3 { font-size:22px; }
  .programme-bridge { padding:25px 23px; display:block; margin-block:35px; }
  .programme-bridge h2 { font-size:32px; }
  .programme-bridge .button-link { margin-top:23px; max-width:none; }
  .resource-section { padding-bottom:40px; }
  .resource-grid { grid-template-columns:1fr; gap:25px; margin-top:25px; }
  .resource-grid h3 { font-size:27px; }
  .resource-grid article>p:not([class]) { min-height:0; }
  .resource-grid a { margin-top:11px; }
  .resource-directory { grid-template-columns:minmax(0,1fr); gap:27px; margin-top:27px; }
  .resource-directory h3 { font-size:25px; }
  .resource-section h2 { font-size:34px; }
  .further-reading { margin-top:30px; }
  .reading-links { display:grid; gap:14px; }
  .site-footer { display:block; padding-top:27px; }
  .site-footer>div:last-child { justify-items:start; margin-top:25px; }
  .figure-dialog { width:calc(100% - 20px); padding:16px; }
}
@media(max-width:380px) {
  .brand { font-size:16px; }
  .brand small { font-size:16px; }
  .hero-roadmap { grid-template-columns:minmax(0,1fr); }
  .hero-roadmap>a { min-height:41px; font-size:16px; }
  .table-output>[data-table-output]:not([data-table-output="structure"]) { grid-template-columns:minmax(105px,.75fr) minmax(0,1fr); gap:8px; }
  .table-output p { padding-left:8px; }
  .mode-controls button { font-size:16px; }
  .demo-table { font-size:16px; }
}
@media(prefers-reduced-motion:reduce) {
  html:not(.motion-on) { scroll-behavior:auto; }
  html:not(.motion-on) *,html:not(.motion-on) *::before,html:not(.motion-on) *::after { animation-duration:.01ms!important; transition-duration:.01ms!important; }
}
@media print {
  body { background:white; font-size:16px; }
  .site-header,.reading-nav,.motion-toggle,.hero-actions,.hero-roadmap,.explainer-controls,.figure-dialog { display:none; }
  .section-width { width:100%; }
  .hero { padding-top:15px; gap:30px; }
  .reading-layout { display:block; }
  .chapter { break-inside:avoid; }
  .work { break-inside:avoid; }
  .foundation-grid,.task-brief,.future-grid,.resource-directory { break-inside:avoid; }
  a { color:inherit; }
  .figure-button img { max-height:120px; }
}

/* A focused research narrative: background, meta-representations, and modality examples. */
.research-scope { margin-block:46px 18px; padding:30px 34px; border-left:3px solid var(--accent); background:var(--soft); }
.research-scope h2 { font-size:29px; margin-top:10px; }
.research-scope>p:not([class]) { max-width:1000px; font-size:18px; color:var(--muted); margin-top:15px; }
.scope-links { display:flex; flex-wrap:wrap; gap:12px 24px; margin-top:19px; }
.scope-links a { display:inline-flex; align-items:center; gap:8px; font-size:16px; text-decoration:none; }
.meta-representation-key { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-block:26px; }
.meta-representation-key>div { padding:18px 21px; border:1px solid var(--line); border-radius:9px; }
.meta-representation-key>div:last-child { border-color:var(--accent); background:var(--accent-light); }
.meta-representation-key span { color:var(--accent); font-size:16px; }
.meta-representation-key strong { display:block; font-size:20px; margin-top:7px; }
.meta-representation-key p { font-size:16px; color:var(--muted); margin-top:6px; }
.modality-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.modality-card { border:1px solid var(--line); border-radius:12px; padding:25px; background:var(--white); min-width:0; }
.modality-card h3 { font-size:27px; margin:12px 0 9px; color:var(--accent); }
.modality-card>p:not([class]) { font-size:18px; line-height:1.8; color:var(--muted); }
.modality-card .paper-links { margin-top:17px; }
@media(max-width:650px) { .modality-grid,.meta-representation-key { grid-template-columns:minmax(0,1fr); gap:17px; }.modality-card { padding:23px 20px; }.research-scope { padding:25px 22px; margin-block:30px 8px; }.research-scope h2 { font-size:28px; } }

.transition-icon svg .connector-head { fill:currentColor; stroke:none; }

.demo-table th { overflow-wrap:anywhere; }
.brand { min-width:0; }
@media(max-width:600px) { .brand { max-width:calc(100% - 108px); }.site-header nav { gap:18px; }.site-header nav a { font-size:16px; } }

/* Semantic pictograms clarify the research objects and resource types. */
.research-icon { display:block; width:28px; height:28px; flex:none; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; }
.research-icon path,.research-icon circle,.research-icon rect { vector-effect:non-scaling-stroke; }
.semantic-icon { display:grid; place-items:center; width:52px; height:52px; flex:none; color:var(--accent); border:1px solid var(--line); border-radius:13px; background:var(--accent-light); }
.chapter-marker { display:flex; flex-direction:column; align-items:center; gap:10px; width:50px; flex:none; color:var(--accent); }
.chapter-marker>.research-icon { width:30px; height:30px; padding:9px; box-sizing:content-box; border-radius:12px; background:var(--accent-light); }
.chapter-marker>span { font:18px/1.4 Georgia,serif; }
.modality-heading,.card-context { display:flex; align-items:center; gap:15px; }
.modality-heading>.eyebrow,.card-context>.eyebrow { margin:0; line-height:1.6; letter-spacing:.045em; }
.modality-card { border-top:3px solid var(--accent); }
.modality-language { --accent:#3d647e; --accent-light:#edf2f5; }
.modality-generation { --accent:#956345; --accent-light:#f6eee7; }
.modality-timeseries { --accent:#6c5a87; --accent-light:#f1edf5; }
.modality-card h3 { margin-top:21px; }
.resource-icon { margin-bottom:20px; width:56px; height:56px; }
.resource-grid article { padding:25px; border:1px solid var(--line); border-radius:15px; background:var(--white); }
.resource-grid { gap:24px; }
@media(max-width:600px) { .chapter-marker { width:40px; }.chapter-marker>.research-icon { width:26px; height:26px; padding:7px; }.modality-heading { gap:12px; }.semantic-icon { width:46px; height:46px; border-radius:11px; }.resource-grid article { padding:24px 22px; } }