/* Editorial remake: material, typographic, and deliberately non-digital. */


:root {
  --ink: #211c17 !important;
  --dark: #f4efe6 !important;
  --mid: #c9bdaa !important;
  --bone: #211c17 !important;
  --taupe: #6f665c !important;
  --wine: #a9442a !important;
  --wine-h: #7f321f !important;
  --green: #596747 !important;
  --yellow: #b37a24 !important;
  --paper: #f4efe6;
  --paper-deep: #e9e0d2;
  --rule: #c9bdaa;
  --display: "EB Garamond", Georgia, serif;
  --reading: "Manrope", "Segoe UI", sans-serif;
  --notation: "DM Mono", ui-monospace, monospace;
}

html { background: var(--paper); }
body { background: var(--paper) !important; color: var(--ink) !important; font-family: var(--reading) !important; }
body::before, body::after { content: none !important; }
body * { border-radius: 0 !important; }
nav { background: rgba(244,239,230,.94) !important; border-bottom: 1px solid var(--rule) !important; backdrop-filter: blur(10px); }
nav .wrap { max-width: 1400px; }
.brand { color: var(--wine) !important; font-family: var(--notation) !important; font-size: 10px !important; letter-spacing: .18em !important; }
.navlinks a, .back { color: var(--ink) !important; font-family: var(--notation) !important; font-size: 10px !important; }
.navlinks a:hover, .back:hover { color: var(--wine) !important; }

.hero { min-height: auto !important; padding: clamp(8rem,15vw,13rem) 0 5rem !important; border-bottom: 1px solid var(--rule); }
.hero-grid { align-items: end !important; gap: clamp(3rem,8vw,10rem) !important; }
.hero h1, .track h2, .feat h2, .paper-record h2, .section h2, h1, h2 { color: var(--ink) !important; font-family: var(--display) !important; font-weight: 500 !important; letter-spacing: -.055em !important; }
.hero h1 { max-width: 9ch !important; font-size: clamp(5rem,12vw,11rem) !important; line-height: .77 !important; }
.hero .statement { color: var(--wine) !important; font-family: var(--display) !important; font-size: clamp(1.85rem,3.2vw,3rem) !important; line-height: 1 !important; }
.hero .lede, .intro, .lede, .case p, .paper-record p, .section p, .evidence-caption { color: var(--taupe) !important; }
.hero-evidence { min-height: 0 !important; padding: 0 0 1.35rem !important; background: transparent !important; border: 0 !important; border-top: 3px solid var(--ink) !important; border-bottom: 1px solid var(--rule) !important; box-shadow: none !important; }
.hero-evidence::after, .hero-evidence .atlas-layer { display: none !important; }
.evidence-head { padding-top: .9rem; }
.filter-diagram { margin: 2rem 0 !important; }
.filter-box { background: transparent !important; border: 1px solid var(--rule) !important; color: var(--ink) !important; }
.filter-box.filtered { border-color: var(--wine) !important; }
.filter-arrow { color: var(--wine) !important; }
.hero-stats { margin-top: 4rem !important; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.stat { padding: 1.1rem .6rem !important; }
.stat + .stat { border-left-color: var(--rule) !important; }
.stat .num { color: var(--ink) !important; font-family: var(--display) !important; font-size: 2rem !important; }

.index { background: var(--paper-deep) !important; border-bottom: 1px solid var(--rule) !important; }
.index-item { border-color: var(--rule) !important; color: var(--ink) !important; }
.index-item:hover { background: var(--ink) !important; color: var(--paper) !important; transform: none !important; }
.idx, .kicker, .label, .meta, .small { color: var(--wine) !important; font-family: var(--notation) !important; font-size: 10px !important; letter-spacing: .1em !important; }
.track, .feat, .paper-record, .section, .blk { background: transparent !important; border-color: var(--rule) !important; }
.track:nth-of-type(even) { background: var(--paper-deep) !important; }
.track { padding-top: clamp(5rem,10vw,9rem) !important; padding-bottom: clamp(5rem,10vw,9rem) !important; }
.track-main > h2 { max-width: 12ch; font-size: clamp(3.4rem,6.5vw,7rem) !important; line-height: .87 !important; }

.evidence-panel, .workflow, .daylight-graphic, .stage, .paper-figure, .media-slot, .case, .tool-link, .paper-fact, .system { background: transparent !important; border-color: var(--rule) !important; box-shadow: none !important; }
.evidence-panel, .workflow { border-top: 2px solid var(--ink) !important; }
.evidence-panel::before, .workflow::before, .daylight-graphic::before { display:none !important; }
.case:hover, .tool-link:hover, .paper-fact:hover, .system:hover { background: var(--paper-deep) !important; border-color: var(--ink) !important; transform: none !important; }
.daylight-graphic { background: var(--paper-deep) !important; }
.daylight-graphic svg [fill="#201F26"] { fill: var(--paper-deep) !important; }
.daylight-graphic svg [fill="#2E2D36"] { fill: var(--rule) !important; }
.daylight-graphic svg [stroke="#2E2D36"] { stroke: var(--rule) !important; }
.daylight-graphic svg [fill="#BE4669"] { fill: var(--wine) !important; }
.daylight-graphic svg [fill="#D2B45A"] { fill: var(--yellow) !important; }
.daylight-graphic svg [stroke="#D2B45A"] { stroke: var(--yellow) !important; }
.daylight-graphic figcaption { color: var(--taupe) !important; border-color: var(--rule) !important; font-family: var(--notation) !important; }

.link { color: var(--ink) !important; border-color: var(--ink) !important; font-family: var(--notation) !important; font-size: 11px !important; letter-spacing: .04em; }
.link:hover { color: var(--wine) !important; border-color: var(--wine) !important; }
.link::after { background: var(--wine) !important; }
footer { background: var(--ink) !important; color: var(--paper) !important; border: 0 !important; }
footer h2 { color: var(--paper) !important; }
footer p, footer a { color: #d7cdbf !important; }

.scroll-signal { height: 2px !important; background: var(--wine) !important; }
.pointer-halo { background: radial-gradient(circle, rgba(169,68,42,.10), transparent 65%) !important; mix-blend-mode: multiply !important; }
.motion-ready .track, .motion-ready .feat, .motion-ready .solver-backend, .motion-ready .tool-index, .motion-ready .blk, .motion-ready .paper-record, .motion-ready .section { transition-duration: 480ms !important; }
.daylight-graphic svg .udi-rays { animation-duration: 11s !important; }
@media (max-width:700px) { .hero h1 { font-size: clamp(4.4rem,20vw,6.8rem) !important; } .hero-grid { gap: 3rem !important; } }
@media (prefers-reduced-motion: reduce) { .pointer-halo { display:none !important; } }

/* v4 compact editorial system: more information per viewport, less ornamental air. */
.hero { min-height: auto !important; padding: clamp(4rem, 7vw, 6.5rem) 0 3rem !important; }
.hero h1 { max-width: 18ch !important; font-size: clamp(3.4rem, 6vw, 6.4rem) !important; line-height: .86 !important; }
.hero .statement { font-size: clamp(1.35rem, 2.15vw, 2rem) !important; max-width: 34ch !important; }
.hero .lede { max-width: 58ch !important; font-size: .95rem !important; line-height: 1.55 !important; }
.feat { padding: clamp(3.8rem, 7vw, 6rem) 0 !important; gap: clamp(2rem, 5vw, 4.5rem) !important; }
.feat h2, .section h2, .paper-record h2, .evidence h2 { font-size: clamp(2.4rem, 4.4vw, 4.8rem) !important; line-height: .92 !important; }
.feat p, .section .intro, .paper-record p, .evidence p { font-size: .92rem !important; line-height: 1.55 !important; }
.stage { min-height: 240px !important; padding: 16px !important; }
.paper-record, .section, .evidence { padding-top: clamp(3.5rem, 6vw, 5.5rem) !important; padding-bottom: clamp(3.5rem, 6vw, 5.5rem) !important; }
.ref-graph { margin-top: 2rem !important; }
.ref-flow { padding: 16px !important; }
.ref-node { padding: 11px !important; }
.media-slot { min-height: 0 !important; }
.link:active, .btn:active, button:active { transform: scale(.97); transition-duration: 100ms !important; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 2px solid var(--wine) !important; outline-offset: 4px !important; }
@media (prefers-reduced-transparency: reduce) { nav { background: var(--paper) !important; backdrop-filter: none !important; } }
@media (max-width: 760px) {
  .hero { padding-top: 3.2rem !important; padding-bottom: 2rem !important; }
  .hero h1 { max-width: 15ch !important; font-size: clamp(3rem, 12vw, 5rem) !important; }
  .feat { padding: 3.2rem 0 !important; }
  .stage { min-height: 190px !important; }
}

/* v5 oxide increase: a visible red thread, still restrained against paper and bone. */
nav .navlinks a[aria-current="page"], nav .navlinks a.active { color: var(--oxide-signal) !important; border-bottom: 2px solid var(--oxide-signal) !important; }
.hero .kicker, .hero .label, .track .idx, .feat .kicker, .paper-record .kicker { color: var(--oxide-signal) !important; }
.hero-stats { border-top: 2px solid var(--oxide-signal) !important; }
.hero-stats .stat:nth-child(odd) { box-shadow: inset 3px 0 0 var(--oxide-signal); }
.track:nth-of-type(3n+1)::before, .track:nth-of-type(3n)::before { background: var(--oxide-signal) !important; width: 38% !important; }
.evidence-panel, .workflow, .paper-figure, .media-slot { border-top-color: var(--oxide-signal) !important; }
.evidence-panel .label, .workflow .label, .tool-link .label, .system .label { color: var(--oxide-signal) !important; }
.link.primary-action, footer .link { border-color: var(--oxide-signal) !important; color: var(--oxide-signal) !important; }
.link.primary-action:hover, footer .link:hover { background: var(--oxide-signal) !important; color: var(--paper) !important; }
.video-embed { display:block; width:100%; aspect-ratio:16/9; object-fit:cover; background:var(--bone-surface); border:1px solid var(--rule); }
.video-embed:focus-visible { outline:2px solid var(--oxide-signal); outline-offset:4px; }
.video-embed { height:auto !important; aspect-ratio:auto !important; object-fit:fill !important; }
.tool-index { background:var(--bone-surface) !important; color:var(--paper) !important; }
.tool-index h2 { color:var(--paper) !important; }
.tool-index > p { color:#d7cdbf !important; }
.tool-index-grid > div { background:var(--paper) !important; color:var(--ink) !important; }
.tool-index-grid > div b { color:var(--ink) !important; }
.tool-index-grid > div span { color:var(--taupe) !important; }
.solver-backend h3, .solver-backend .backend-copy { color:var(--paper) !important; }
.solver-backend .backend-label { color:#d47758 !important; }
.solver-backend .backend-title { color:var(--paper) !important; }
.solver-backend .backend-detail { color:#d7cdbf !important; }
.solver-backend .backend-detail span { color:#d7cdbf !important; background:transparent !important; }
.feature-reveal > div > div[style*="background"] { background:var(--paper) !important; color:var(--ink) !important; border-color:var(--rule) !important; box-shadow:none !important; }
.feature-reveal > div > div[style*="background"] h4 { color:var(--vine-signal) !important; }
.feature-reveal > div > div[style*="background"] p { color:var(--taupe) !important; }
.backend-detail { background:var(--paper) !important; border:0 !important; box-shadow:none !important; }

/* v4 homepage: the proposition and proof belong in the opening screen. */
.folio-v2 .hero { display: block !important; padding-top: clamp(3.5rem, 6vw, 5.5rem) !important; padding-bottom: 2.4rem !important; }
.folio-v2 .hero-stats { margin-top: 2.8rem !important; }
.folio-v2 .track { padding-top: clamp(4.5rem, 8vw, 7rem) !important; padding-bottom: clamp(4.5rem, 8vw, 7rem) !important; }
.folio-v2 .track-main > .intro { margin-bottom: 2.5rem !important; }

/* v2 scale correction: keep the editorial voice, reduce display volume across every page. */
.hero h1 { font-size: clamp(4rem, 8.5vw, 8.5rem) !important; line-height: .82 !important; }
.hero .statement { font-size: clamp(1.45rem, 2.4vw, 2.2rem) !important; }
.track h2, .feat h2, .paper-record h2, .section h2 { font-size: clamp(2.8rem, 5vw, 5.6rem) !important; line-height: .92 !important; }
.track-main > h2 { font-size: clamp(3rem, 5.5vw, 6rem) !important; }
.process-intro h2, .research-method h2, .figure-section h2 { font-size: clamp(2.4rem, 4.5vw, 4.6rem) !important; }
.paper-record h2 { max-width: 18ch; }
@media (max-width: 700px) {
  .hero h1 { font-size: clamp(3.4rem, 15vw, 5.6rem) !important; }
  .track h2, .feat h2, .paper-record h2, .section h2, .track-main > h2 { font-size: clamp(2.6rem, 11vw, 4.2rem) !important; }
}

/* Diagram recolor pass: preserve geometry, move every authored SVG into the paper system. */
.solver-backend, .stage, .process-card, .standalone-card,
.feature-reveal > div > div > div,
div[style*="background:linear-gradient"], div[style*="background:#191820"], div[style*="background:#18171c"] {
  background: var(--paper-deep) !important;
  border-color: var(--rule) !important;
  box-shadow: none !important;
  color: var(--ink) !important;
}
.solver-backend .backend-step, .process-node, .workflow div, .backend-detail span,
.gh-canvas-wrap, .gh-canvas, .tool-index-grid div {
  background: var(--paper) !important;
  border-color: var(--rule) !important;
  color: var(--ink) !important;
}
.solver-backend .backend-copy, .solver-backend .backend-title, .process-card > p,
.feature-reveal p, .standalone-card p, .backend-detail span, .tool-index-grid span { color: var(--taupe) !important; }
.feature-reveal h4, .process-card h3, .standalone-card h3, .tool-index-grid b { color: var(--ink) !important; }
.feature-reveal svg { background: transparent !important; }
.feature-reveal svg [stroke], .feature-reveal svg [stroke*="90,180,130"], .feature-reveal svg [stroke="#5AB482"] { stroke: var(--green) !important; }
.feature-reveal svg [stroke="#BE4669"], .feature-reveal svg [stroke*="190,70,105"] { stroke: var(--wine) !important; }
.feature-reveal svg [fill="#5AB482"], .feature-reveal svg [fill*="90,180,130"] { fill: var(--green) !important; }
.feature-reveal svg [fill="#BE4669"], .feature-reveal svg [fill*="190,70,105"] { fill: color-mix(in srgb, var(--wine) 22%, transparent) !important; }
.feature-reveal svg [fill="#D2B45A"], .feature-reveal svg [fill*="210,180,90"] { fill: var(--yellow) !important; }
.feature-reveal svg [stroke="#6eb4b4"], .feature-reveal svg [fill="#6eb4b4"] { stroke: var(--green) !important; fill: var(--green) !important; }
.feature-reveal svg stop[stop-color="#1a5a8f"], .feature-reveal svg stop[stop-color="#6eb4b4"], .feature-reveal svg stop[stop-color="#fff5a8"] { stop-color: var(--paper-deep) !important; }
.feature-reveal svg stop:first-child { stop-color: var(--wine) !important; }
.gh-wires { background: transparent !important; }
.gh-wires path { stroke: var(--rule) !important; }
.gh-node { background: var(--paper) !important; color: var(--ink) !important; border-color: var(--rule) !important; box-shadow: none !important; }
.gh-node.gh-process { border-color: var(--wine) !important; }
.gh-node.gh-output { border-color: var(--green) !important; }
.gh-caption, .gh-legend { color: var(--taupe) !important; }

/* Theme cleanup for inherited legacy surfaces and diagrams. */
.caveat, .metric-box.caveat, .tool-proof, .video-caption, .ref-flow, .ref-node,
.m2d-stage svg, .boq-stage, .gh-canvas-wrap, .gh-canvas, .stage, .workflow,
.solver-backend, .placeholder, .paper, .process-card, .standalone-card {
  background: var(--paper-deep) !important;
  color: var(--ink) !important;
  border-color: var(--rule) !important;
  box-shadow: none !important;
}
.caveat, .metric-box.caveat { color: var(--taupe) !important; }
.ref-node b, .ref-node span, .gh-node, .gh-node small, .workflow-note { color: var(--ink) !important; }
.ref-node.input { border-color: var(--yellow) !important; }
.ref-node.process, .gh-node.gh-process { border-color: var(--wine) !important; }
.ref-node.output, .gh-node.gh-output { border-color: var(--green) !important; }
svg [fill="#18171C"], svg [fill="#18171c"], svg [fill="#201F26"], svg [fill="#201f26"] { fill: var(--paper-deep) !important; }
svg [fill="#ECE9E6"], svg [fill="#ECE9e6"], svg [fill="#96949C"] { fill: var(--ink) !important; }
svg [stroke="#ECE9E6"], svg [stroke="#ECE9e6"], svg [stroke="#2E2D36"] { stroke: var(--ink) !important; }

/* Heavy Object Finder: two-column rows prevent a long, broken chart. */
.feat:has(#heavy) { align-items: start !important; }
.feat:has(#heavy) .stage { min-height: 0 !important; padding: 18px !important; }
.feat:has(#heavy) #hRows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 14px; }
.feat:has(#heavy) .hrow { min-width: 0; padding: 5px 2px !important; gap: 7px !important; }
.feat:has(#heavy) .hrow .lab { width: 76px; font-size: 10px; }
.feat:has(#heavy) .hrow .track { height: 10px; }
.feat:has(#heavy) .hrow .mono { width: 54px; font-size: 9px; }
@media (max-width: 760px) { .feat:has(#heavy) #hRows { grid-template-columns: 1fr; } }

/* Homepage first viewport: show proposition and proof sooner. */
.folio-v2 .hero { min-height: auto !important; padding-top: clamp(4rem, 7vw, 7rem) !important; }

/* v4 finishing pass: compact viewport rhythm and calm, responsive interaction. */
nav .wrap { min-height: 52px !important; }
body:not(.folio-v2) .hero { display: block !important; }
body:not(.folio-v2) .hero-grid { align-items: start !important; gap: clamp(2rem, 5vw, 5rem) !important; }
body:not(.folio-v2) .hero h1 { max-width: 16ch !important; }
body:not(.folio-v2) .hero .lede { margin-top: 1.25rem !important; }
.hero .wrap, .feat .wrap, .section .wrap, .paper-record .wrap { max-width: 1280px !important; }
.research-method, .figure-section, .systems, .sequence, .evidence-grid { gap: clamp(1.5rem, 3vw, 3rem) !important; }
.research-method, .figure-section, .systems, .sequence { margin-top: 0 !important; margin-bottom: 0 !important; }
.pointer-halo { opacity: .45 !important; }
::selection { background: var(--wine) !important; color: var(--paper) !important; }
* { text-wrap: pretty; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .motion-ready .track, .motion-ready .feat, .motion-ready .solver-backend, .motion-ready .tool-index, .motion-ready .blk, .motion-ready .paper-record, .motion-ready .section { opacity: 1 !important; transform: none !important; }
}

/* v5 critique pass: make the technical story legible at a glance. */
:root { --bone-surface: #25231f; --vine-signal: #71845d; --oxide-signal: #a9442a; --ochre-signal: #b37a24; }
.evidence-panel, .workflow, .solver-backend, .tool-index, .paper-figure { position: relative; }
.evidence-panel::before, .workflow::before, .solver-backend::before {
  content: "INPUT → PROCESS → OUTPUT"; display: block; margin-bottom: 1rem;
  color: var(--oxide-signal) !important; font: 10px/1 var(--notation); letter-spacing: .12em;
}
.solver-backend, .tool-index { background: var(--bone-surface) !important; color: var(--paper) !important; border-color: var(--bone-surface) !important; }
.solver-backend .backend-title, .solver-backend .backend-copy, .tool-index h3, .tool-index p { color: var(--paper) !important; }
.solver-backend .backend-step, .tool-index-grid div { border-color: rgba(244,239,230,.25) !important; }
.solver-backend .backend-step:nth-child(3n) { border-left-color: var(--vine-signal) !important; }
.solver-backend .backend-step:nth-child(3n+2) { border-left-color: var(--oxide-signal) !important; }
.solver-backend .backend-step:nth-child(3n+1) { border-left-color: var(--ochre-signal) !important; }
.paper-record .kicker, .section .kicker { color: var(--oxide-signal) !important; }
.paper-record .meta, .section .meta, .evidence-caption { color: var(--vine-signal) !important; }
.tool-link:hover, .system:hover, .paper-fact:hover { border-color: var(--vine-signal) !important; }
.hero-stats { margin-top: 2.4rem !important; }
@media (max-width: 760px) {
  .hero-stats { margin-top: 1.8rem !important; }
  .evidence-panel::before, .workflow::before, .solver-backend::before { margin-bottom: .75rem; }
}
