/* ===========================================================================
   Sparrows infographic system · final visual layer
   ========================================================================== */

:root {
  --viz-blue: #2848f5;
  --viz-blue-2: #6d87ff;
  --viz-blue-pale: #dfe7ff;
  --viz-ink: #090c13;
  --viz-muted: #6b7482;
  --viz-line: #dce3ee;
  --viz-dark: #06080d;
  --viz-warm: #db6a17;
}

body[data-page="home"] .records-figure,
body[data-page="home"] .vida-card,
body[data-page="home"] .missing-edge-card,
body[data-page="home"] .dealy-flow-card,
body[data-page="home"] .decay-card,
body[data-page="home"] .evening-card,
body[data-page="home"] .operations-card,
body[data-page="home"] .occupancy-feature {
  min-height: 0;
  padding: 32px !important;
  border: 1px solid #dfe5ee;
  border-radius: 16px;
  box-shadow: 0 28px 80px rgba(24, 43, 84, .11), 0 3px 12px rgba(24, 43, 84, .05);
  overflow: hidden;
  scroll-margin-top: 84px;
}

body[data-page="home"] .records-figure,
body[data-page="home"] .decay-card,
body[data-page="home"] .operations-card,
body[data-page="home"] .occupancy-feature {
  background:
    radial-gradient(circle at 88% 7%, rgba(80, 112, 255, .1), transparent 35%),
    #fff;
}

body[data-page="home"] .feature-card-head {
  position: relative;
  z-index: 4;
  margin-bottom: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(128, 143, 170, .2);
}

body[data-page="home"] .feature-card-head h3 {
  max-width: 24ch;
  font-size: clamp(23px, 2.1vw, 34px);
  font-weight: 680;
  letter-spacing: -.035em;
}

body[data-page="home"] .infographic-host {
  position: relative;
  z-index: 2;
  width: 100%;
  color: var(--viz-blue);
  overflow: hidden;
  isolation: isolate;
}

body[data-page="home"] .viz-meta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 34px;
  padding: 0 2px;
  font: 600 10px/1.2 "IBM Plex Mono", monospace;
  letter-spacing: .09em;
  color: #677284;
}

body[data-page="home"] .viz-meta-row b {
  font: inherit;
  color: var(--viz-blue);
}

body[data-page="home"] .viz-svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
  font-family: "Instrument Sans", Arial, sans-serif;
  text-rendering: geometricPrecision;
}
body[data-page="home"] .viz-mobile-svg { display: none; }

body[data-page="home"] .viz-svg text { fill: var(--viz-ink); }
body[data-page="home"] .viz-dot-field { color: #4769ea; }
body[data-page="home"] .viz-axis-title {
  font: 600 11px/1 "IBM Plex Mono", monospace;
  letter-spacing: .08em;
  fill: #717b8d;
}

body[data-page="home"] .infographic-host:not(.is-visible) .viz-signal-dot,
body[data-page="home"] .infographic-host:not(.is-visible) .prediction-pulse,
body[data-page="home"] .infographic-host:not(.is-visible) .ops-route-pulse,
body[data-page="home"] .infographic-host:not(.is-visible) .camp-orbit-pulse,
body[data-page="home"] .infographic-host:not(.is-visible) .evening-pulse { visibility: hidden; }

/* Fig. 01 · relationships -------------------------------------------------- */
body[data-page="home"] .relationship-svg .rel-spine {
  stroke: #b4c1d9;
  stroke-width: 1;
  stroke-dasharray: 3 7;
}

body[data-page="home"] .relationship-svg .rel-spine-label {
  font: 600 9px/1 "IBM Plex Mono", monospace;
  letter-spacing: .13em;
  fill: #7d8898;
}

body[data-page="home"] .relationship-svg .rel-ambient path {
  fill: none;
  stroke: #6e86d9;
  stroke-width: 1;
  opacity: .17;
}

body[data-page="home"] .relationship-svg .rel-primary path {
  fill: none;
  stroke: var(--viz-blue);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-dasharray: 760;
  stroke-dashoffset: 760;
}

body[data-page="home"] .relationship-svg .rel-primary .is-dashed {
  stroke-dasharray: 7 8;
  stroke-dashoffset: 0;
}

body[data-page="home"] .relationship-svg .rel-node rect {
  fill: rgba(255, 255, 255, .96);
  stroke: #d7deea;
  stroke-width: 1;
}

body[data-page="home"] .relationship-svg .rel-node circle {
  fill: #fff;
  stroke: var(--viz-blue);
  stroke-width: 2.5;
}

body[data-page="home"] .relationship-svg .rel-node.predicted rect {
  fill: #edf1ff;
  stroke: var(--viz-blue);
}

body[data-page="home"] .relationship-svg .node-id {
  font: 600 11px/1 "IBM Plex Mono", monospace;
  fill: var(--viz-blue);
}

body[data-page="home"] .relationship-svg .node-main { font-size: 13px; font-weight: 650; }
body[data-page="home"] .relationship-svg .node-sub { font-size: 10.5px; fill: #758091; }
body[data-page="home"] .relationship-svg .rel-hub circle { fill: var(--viz-blue); stroke: #fff; stroke-width: 4; }
body[data-page="home"] .relationship-svg .rel-edge-copy text {
  font: 600 9px/1 "IBM Plex Mono", monospace;
  letter-spacing: .08em;
  fill: #64728b;
}

body[data-page="home"] .relationship-svg .viz-signal-dot { fill: #fff; stroke: var(--viz-blue); stroke-width: 2; }

body[data-page="home"] .infographic-host.is-visible .relationship-svg .rel-primary path {
  animation: vizDraw 1.4s cubic-bezier(.2,.76,.2,1) forwards;
}

body[data-page="home"] .infographic-host.is-visible .relationship-svg .rel-primary path:nth-child(2) { animation-delay: .12s; }
body[data-page="home"] .infographic-host.is-visible .relationship-svg .rel-primary path:nth-child(3) { animation: predictedFlow 1.6s linear infinite; }
body[data-page="home"] .infographic-host.is-visible .relationship-svg .rel-primary path:nth-child(4) { animation-delay: .3s; }

/* Fig. 02 · Vida ---------------------------------------------------------- */
body[data-page="home"] .vida-card {
  background: radial-gradient(circle at 50% 45%, rgba(110, 138, 255, .52), transparent 33%), rgba(7, 27, 123, .18) !important;
  border-color: rgba(255, 255, 255, .28) !important;
  box-shadow: 0 35px 100px rgba(3, 10, 74, .28) !important;
}

body[data-page="home"] .vida-card .feature-card-head { border-color: rgba(255,255,255,.18); }
body[data-page="home"] .vida-card .viz-meta-row,
body[data-page="home"] .vida-card .viz-meta-row b { color: rgba(255,255,255,.72); }
body[data-page="home"] .vida-orbit-svg text { fill: #fff; }
body[data-page="home"] .vida-rings circle { fill:none; stroke:rgba(255,255,255,.13); stroke-width:1; stroke-dasharray:3 8; }
body[data-page="home"] .vida-orbit-spinner { transform-origin:480px 244px; }
body[data-page="home"] .vida-orbit-spinner circle { fill:#fff; opacity:.66; filter:drop-shadow(0 0 6px rgba(255,255,255,.7)); }
body[data-page="home"] .vida-corner { font:600 12px/1 var(--mono); letter-spacing:.14em; fill:rgba(255,255,255,.82) !important; }
body[data-page="home"] .vida-in path { fill:none; stroke:rgba(255,255,255,.35); stroke-width:1.4; }
body[data-page="home"] .vida-sig circle { fill:#fff; }
body[data-page="home"] .vida-sig text { font:500 14px/1 var(--mono); fill:rgba(255,255,255,.96) !important; }
body[data-page="home"] .vida-sig-m text { font-size:12px; }
body[data-page="home"] .vida-disc { fill:#f4f1e6; }
body[data-page="home"] .vida-disc-ring { fill:none; stroke:#6178ec; stroke-width:1.2; stroke-dasharray:2.5 6; }
body[data-page="home"] .vida-name { text-anchor:middle; font-family:var(--serif); font-weight:500; font-size:44px; letter-spacing:-.03em; fill:#1934bb !important; }
body[data-page="home"] .vida-name-m { font-size:30px !important; }
body[data-page="home"] .vida-small { text-anchor:middle; font:600 11px/1 var(--mono); letter-spacing:.14em; fill:#8194bd !important; }
body[data-page="home"] .vida-out path { fill:none; stroke:#fff; stroke-width:3.5; stroke-linecap:round; }
body[data-page="home"] .vida-actions rect { fill:rgba(3,13,82,.22); stroke:rgba(255,255,255,.4); }
body[data-page="home"] .vida-actions text { text-anchor:middle; font:600 11px/1 var(--mono); letter-spacing:.06em; fill:#fff !important; }
body[data-page="home"] .vida-actions-m text { font-size:9px; }
body[data-page="home"] .vida-pulse-dot { fill:#fff; filter:drop-shadow(0 0 6px rgba(255,255,255,.95)); }
body[data-page="home"] .vida-cap { fill:rgba(255,255,255,.5) !important; }
body[data-page="home"] .infographic-host.is-visible .vida-orbit-spinner { animation:orbitRotate 30s linear infinite; }
body[data-page="home"] .infographic-host.is-visible .vida-pulse-dot { animation:vidaTravel 2.6s ease-in-out infinite; }
body[data-page="home"] .infographic-host.is-visible .vida-in path { animation:vidaInDim 2.6s ease-in-out infinite; }
body[data-page="home"] .action-chips { display: none !important; }

/* Dealy Flowline ---------------------------------------------------------- */
body[data-page="home"] .dealy-flow-card {
  color: #f3f8ff;
  border-color: #142b40 !important;
  background:
    linear-gradient(rgba(70,196,181,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(70,196,181,.04) 1px, transparent 1px),
    #06111f !important;
  background-size: 30px 30px, 30px 30px, auto !important;
  box-shadow: 0 34px 90px rgba(6,17,31,.24) !important;
}
body[data-page="home"] .dealy-flow-card .feature-card-head { border-color: rgba(101,213,199,.12); }
body[data-page="home"] .dealy-flow-card .feature-card-head h3 { color: #fff; }
body[data-page="home"] .dealy-flow-svg text { font-family: var(--sans); }
body[data-page="home"] .dealy-flow-bed { fill: none; stroke: #163349; stroke-width: 14; stroke-linecap: round; }
body[data-page="home"] .dealy-flow-path { fill: none; stroke: url(#home-dealy-flow); stroke-width: 3; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; filter: drop-shadow(0 0 5px rgba(32,184,166,.2)); }
body[data-page="home"] .dealy-flow-stage > rect { fill: #0d1d2e; stroke: #205268; stroke-width: 1; }
body[data-page="home"] .dealy-action-stage > rect { fill: #101a39; stroke: #5969d1; }
body[data-page="home"] .dealy-verified-stage > rect { fill: #0c2425; stroke: #2cab73; }
body[data-page="home"] .dealy-flow-meta { fill: #65d5c7 !important; font: 500 9px/1 var(--mono); letter-spacing: .09em; }
body[data-page="home"] .dealy-flow-meta.action { fill: #a9b2ff !important; }
body[data-page="home"] .dealy-flow-meta.verified { fill: #79d7a6 !important; }
body[data-page="home"] .dealy-flow-title { fill: #f4f8ff !important; font-size: 15px; font-weight: 600; }
body[data-page="home"] .dealy-flow-note { fill: #8da2b5 !important; font-size: 10px; }
body[data-page="home"] .dealy-flow-note.verified { fill: #8fb4a3 !important; }
body[data-page="home"] .dealy-flow-icon.teal { fill: #17384c; stroke: #20b8a6; }
body[data-page="home"] .dealy-flow-icon.verified { fill: #2cab73; }
body[data-page="home"] .dealy-message-mark { fill: none; stroke: #baf6ee; stroke-width: 1.5; stroke-linecap: round; }
body[data-page="home"] .dealy-context-rail { fill: #17384c; }
body[data-page="home"] .dealy-context-fill { fill: #20b8a6; }
body[data-page="home"] .dealy-product-tile { fill: #e8eaff; }
body[data-page="home"] .dealy-product-mark { fill: #7d89ff; opacity: .55; }
body[data-page="home"] .dealy-action-pill { fill: #1c2854; }
body[data-page="home"] .dealy-action-pill-label { fill: #b8c0ff !important; font: 500 7px/1 var(--mono); text-anchor: middle; }
body[data-page="home"] .dealy-check { fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
body[data-page="home"] .dealy-learning-rule { stroke: #24394f; }
body[data-page="home"] .dealy-learning-dot { fill: #7d89ff; }
body[data-page="home"] .dealy-flow-signal { fill: #fff; stroke: #20b8a6; stroke-width: 3; }
body[data-page="home"] .infographic-host:not(.is-visible) .dealy-flow-signal { visibility: hidden; }
body[data-page="home"] .dealy-mobile-stage .dealy-mobile-port { stroke: #20b8a6; stroke-width: 2; }
body[data-page="home"] .dealy-mobile-stage .dealy-mobile-node { fill: #06111f; stroke: #20b8a6; stroke-width: 2; }
body[data-page="home"] .dealy-mobile-stage.action .dealy-mobile-port,
body[data-page="home"] .dealy-mobile-stage.action .dealy-mobile-node { stroke: #7d89ff; }
body[data-page="home"] .dealy-mobile-stage.verified .dealy-mobile-port,
body[data-page="home"] .dealy-mobile-stage.verified .dealy-mobile-node { stroke: #2cab73; }
body[data-page="home"] .dealy-mobile-stage.action > rect { fill: #101a39; stroke: #5969d1; }
body[data-page="home"] .dealy-mobile-stage.verified > rect { fill: #0c2425; stroke: #2cab73; }

/* Legacy fingerprint ----------------------------------------------------- */
body[data-page="home"] .missing-edge-card {
  color: #f3f5ff;
  background:
    radial-gradient(circle at 28% 44%, rgba(46, 77, 242, .18), transparent 36%),
    #06080d !important;
  border-color: #202633 !important;
  box-shadow: 0 34px 90px rgba(4, 7, 16, .25) !important;
}

body[data-page="home"] .missing-edge-card .feature-card-head { border-color: rgba(255,255,255,.12); }
body[data-page="home"] .missing-edge-card .feature-card-head h3,
body[data-page="home"] .missing-edge-card .ui-eyebrow { color: #fff; }
body[data-page="home"] .missing-edge-card .legend-pill { color: rgba(255,255,255,.7); background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.14); }
body[data-page="home"] .missing-edge-card .fig-copy { color: #fff; border-color: rgba(255,255,255,.16); background: rgba(255,255,255,.07); }
body[data-page="home"] .missing-edge-card .viz-meta-row,
body[data-page="home"] .missing-edge-card .viz-meta-row b { color: #9fa9bd; }
body[data-page="home"] .fingerprint-svg text { fill: #ecf0ff; }
body[data-page="home"] .f3-col-head { font:600 13px/1 var(--mono); letter-spacing:.14em; fill:#aab5d8 !important; }
body[data-page="home"] .f3-thumb { clip-path:inset(0 round 8px); filter:url(#duotone-dark); }
body[data-page="home"] .f3-thumb-frame { fill:none; stroke:rgba(120,144,255,.3); stroke-width:1; }
body[data-page="home"] .f3-name { font:600 15px/1 var(--sans); fill:#f2f5ff !important; }
body[data-page="home"] .f3-status { font:500 13px/1 var(--mono); fill:#c3ccdf !important; }
body[data-page="home"] .f3-dim { opacity:.45; }
body[data-page="home"] .f3-empty-box { fill:none; stroke:#3b435c; stroke-width:1.4; stroke-dasharray:4 5; }
body[data-page="home"] .f3-empty-name { fill:#8b94a9 !important; }
body[data-page="home"] .f3-hero-card { fill:#0d1120; stroke:#2b3450; stroke-width:1.2; }
body[data-page="home"] .f3-bleed { opacity:.35; filter:url(#duotone-ledger); }
body[data-page="home"] .f3-hero-num { font-family:var(--serif); font-weight:400; font-size:100px; letter-spacing:-.065em; fill:#fff !important; }
body[data-page="home"] .f3-hero-num-m { font-size:66px; }
body[data-page="home"] .f3-hero-match { font:500 22px/1 var(--sans); fill:#aab4cd !important; }
body[data-page="home"] .f3-hero-rule { stroke:#2a3350; stroke-width:1; }
body[data-page="home"] .f3-hero-line { font:500 13px/1 var(--mono); letter-spacing:.04em; fill:#c3ccdf !important; }
body[data-page="home"] .f3-edge { fill:none; stroke:#3f61ff; stroke-width:3; stroke-dasharray:9 8; }
body[data-page="home"] .f3-pulse { fill:#fff; }
body[data-page="home"] .f3-cap { fill:rgba(236,240,255,.4) !important; }
body[data-page="home"] .infographic-host.is-visible .f3-edge { animation: predictedFlow 1.6s linear infinite; }

/* Fig. 03b · interactive learner ----------------------------------------- */
body[data-page="home"] .fig-learn .play {
  position: relative;
  min-height: 410px;
  padding: 32px;
  border: 1px solid #1635cb;
  border-radius: 14px;
  color: #fff;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.14), transparent 26%),
    radial-gradient(circle, rgba(255,255,255,.17) 1.5px, transparent 1.7px) 0 0 / 24px 24px,
    #2448f0;
  box-shadow: 0 30px 80px rgba(23, 53, 190, .22);
  overflow: hidden;
}

body[data-page="home"] .fig-learn .play::before {
  content: "LIVE INFERENCE";
  position: absolute;
  right: 26px;
  top: 26px;
  font: 600 9px/1 "IBM Plex Mono", monospace;
  letter-spacing: .1em;
  color: rgba(255,255,255,.7);
}

body[data-page="home"] .fig-learn .play-lead { max-width: 52ch; color: rgba(255,255,255,.78); }
body[data-page="home"] .fig-learn .play-lead b { color: #fff; }
body[data-page="home"] .fig-learn .chip-strip { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin-top: 54px; }
body[data-page="home"] .fig-learn .pchip {
  min-height: 64px;
  justify-content: flex-start;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 8px;
  color: #fff;
  background: rgba(4,16,100,.22);
  box-shadow: none;
  transition: transform .25s ease, background .25s ease, border-color .25s ease;
}
body[data-page="home"] .fig-learn .pchip:hover { transform: translateY(-3px); border-color: rgba(255,255,255,.65); }
body[data-page="home"] .fig-learn .pchip.on,
body[data-page="home"] .fig-learn .pchip.ghost { background: #fff; color: #1d3ed6; border-color: #fff; }
body[data-page="home"] .fig-learn .play-out { margin-top: 22px; }
body[data-page="home"] .fig-learn .pred-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 8px; padding: 16px 18px; border: 1px solid rgba(255,255,255,.24); border-radius: 8px; background: rgba(4,13,85,.25); }
body[data-page="home"] .fig-learn .pred-row .edge { color: #fff; }
body[data-page="home"] .fig-learn .pred-row .why,
body[data-page="home"] .fig-learn .play-hint { color: rgba(255,255,255,.7); }
body[data-page="home"] .fig-learn .btn-mono.reset { color: #fff; background: transparent; border-color: rgba(255,255,255,.3); }

/* Fig. 04 · signal decay -------------------------------------------------- */
body[data-page="home"] .decay-svg .decay-guide { fill: none; stroke: #ccd6e8; stroke-width: 1; }
body[data-page="home"] .decay-sample { fill: var(--viz-blue); transform-box: fill-box; transform-origin: center; }
body[data-page="home"] .pulse-line { stroke: #8297d3; stroke-width: 1; stroke-dasharray: 4 6; }
body[data-page="home"] .pulse-ring { fill: rgba(40,72,245,.09); stroke: #7089e9; stroke-width: 1.5; }
body[data-page="home"] .pulse-core { fill: var(--viz-blue); }
body[data-page="home"] .decay-event rect { fill: #0a0d14; stroke: #0a0d14; }
body[data-page="home"] .decay-event text { font: 500 9px/1 "IBM Plex Mono", monospace; letter-spacing: .06em; fill: #9da8bd; }
body[data-page="home"] .decay-event .event-main { font: 600 15px/1 "Instrument Sans", sans-serif; letter-spacing: 0; fill: #fff; }
body[data-page="home"] .decay-start text { font: 600 9px/1 "IBM Plex Mono", monospace; letter-spacing: .06em; fill: #778296; }
body[data-page="home"] .decay-start .event-main { font: 650 16px/1 "Instrument Sans", sans-serif; fill: #111722; }
body[data-page="home"] .decay-axis text { font: 500 9px/1 "IBM Plex Mono", monospace; fill: #7a8494; }
body[data-page="home"] .infographic-host.is-visible .pulse-ring { animation: pulseBeacon 2s ease-in-out infinite; }
body[data-page="home"] .infographic-host.is-visible .decay-sample { animation: dotBreathe 2.8s ease-in-out infinite; animation-delay: calc(var(--i) * 45ms); }

body[data-page="home"] .decay-svg .pulse-ring {
  transform-box: fill-box;
  transform-origin: center;
}
body[data-page="home"] .infographic-host.is-visible .decay-svg .pulse-ring { animation: decayPulse 2s ease-in-out infinite; }

/* Vida's live controls belong to the figure, not to the viewport. */
body[data-page="home"] #engine .vida-card .feature-tags {
  position: static;
  inset: auto;
  z-index: 2;
  width: 100%;
  margin: 14px 0 0;
}
body[data-page="home"] #engine .vida-card .ftags {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 12px 20px 0;
  border: 0;
  border-top: 1px solid rgba(255,255,255,.16);
  background: transparent;
  box-shadow: none;
}
body[data-page="home"] #engine .vida-card .ftag-out { margin-left: 4px; }

/* Fig. 05 · service orbit ------------------------------------------------- */
body[data-page="home"] .evening-card {
  background:
    radial-gradient(circle at 50% 43%, rgba(255, 180, 102, .22), transparent 35%),
    #fffaf4 !important;
  border-color: #ead8c6 !important;
}
body[data-page="home"] .evening-card .viz-meta-row { color: #997355; }
body[data-page="home"] .evening-card .viz-meta-row b { color: var(--viz-warm); }
body[data-page="home"] .r5-paper { fill:#fbf8f2; stroke:#eadecf; stroke-width:1; filter:drop-shadow(0 18px 42px rgba(112,67,27,.13)); }
body[data-page="home"] .r5-head { font:700 14px/1 var(--mono); letter-spacing:.03em; fill:#20160f !important; }
body[data-page="home"] .r5-t { font:600 14px/1 var(--mono); fill:#20160f !important; }
body[data-page="home"] .r5-r { text-anchor:end; font:600 14px/1 var(--mono); fill:#20160f !important; }
body[data-page="home"] .r5-muted { font:600 13px/1 var(--mono); fill:#574535 !important; }
body[data-page="home"] .r5-note { font:500 12px/1 var(--mono); fill:#675645 !important; }
body[data-page="home"] .r5-rule { stroke:#d9c9b7; stroke-width:1; stroke-dasharray:2 4; }
body[data-page="home"] .r5-band { fill:rgba(255,122,41,.09); stroke:rgba(255,122,41,.24); stroke-width:1; }
body[data-page="home"] .r5-eng { font:700 14px/1 var(--mono); fill:#b0490a !important; }
body[data-page="home"] .r5-r-pct { text-anchor:end; }
body[data-page="home"] .r5-stamp { text-anchor:end; font:700 13px/1 var(--mono); letter-spacing:.05em; fill:#a8470a !important; }
body[data-page="home"] .r5-ring-bg { fill:none; stroke:#f0dcc9; stroke-width:2; stroke-dasharray:3 6; }
body[data-page="home"] .r5-ring-arc { fill:none; stroke:#ff7a29; stroke-width:6; stroke-linecap:round; stroke-dasharray:58 100; }
body[data-page="home"] .r5-ring-num { text-anchor:middle; font:500 44px/1 var(--serif); fill:#b34d06 !important; }
body[data-page="home"] .r5-ring-label { text-anchor:middle; font:600 12px/1 var(--mono); letter-spacing:.05em; fill:#574535 !important; }
body[data-page="home"] .r5-ring-cap { text-anchor:middle; font:500 12px/1 var(--mono); fill:#675645 !important; }
body[data-page="home"] .r5-cap { fill:#a98d76 !important; }
body[data-page="home"] .r5-m { font-size:11.5px !important; }
body[data-page="home"] .r5-ring-num-m { font-size:36px !important; }
body[data-page="home"] .bestshot-home-badge rect { fill:#fff; stroke:#edc8aa; }
body[data-page="home"] .bestshot-home-badge text { text-anchor:middle; font:600 9px/1 var(--mono); letter-spacing:.04em; fill:#c45813 !important; }
body[data-page="home"] .bestshot-orbit-bed { fill:none; stroke:#f3dccb; stroke-width:12; }
body[data-page="home"] .bestshot-orbit-progress { fill:none; stroke:url(#warm-orbit); stroke-width:12; stroke-linecap:round; stroke-dasharray:58 100; }
body[data-page="home"] .bestshot-orbit-progress.is-mobile { stroke:url(#warm-orbit-mobile); }
body[data-page="home"] .bestshot-home-core circle { fill:#fff; stroke:#efd9c9; }
body[data-page="home"] .bestshot-home-meta { text-anchor:middle; font:600 9px/1 var(--mono); letter-spacing:.05em; fill:#96725b !important; }
body[data-page="home"] .bestshot-home-number { text-anchor:middle; font:500 58px/1 var(--serif); letter-spacing:-.04em; fill:#17120f !important; }
body[data-page="home"] .bestshot-home-number.is-mobile { font-size:42px; }
body[data-page="home"] .bestshot-home-node circle { fill:#fff; stroke:#dfc2ad; stroke-width:1.5; }
body[data-page="home"] .bestshot-home-node text { text-anchor:middle; font:600 9px/1 var(--sans); fill:#8f725f !important; }
body[data-page="home"] .bestshot-home-node.is-mobile text { font-size:7px; }
body[data-page="home"] .bestshot-home-node.is-current > circle:first-child { fill:#db6a17; stroke:#fff; stroke-width:5; filter:drop-shadow(0 9px 16px rgba(219,106,23,.24)); }
body[data-page="home"] .bestshot-home-node.is-current text { fill:#a55a29 !important; }
body[data-page="home"] .bestshot-home-pulse { fill:none !important; stroke:#db6a17 !important; transform-box:fill-box; transform-origin:center; }
body[data-page="home"] .infographic-host.is-visible .bestshot-home-pulse { animation:pulseBeacon 2.3s ease-out infinite; }
body[data-page="home"] .bestshot-action-card > rect:first-child { fill:#fff; stroke:#ecd5c4; }
body[data-page="home"] .bestshot-action-card.is-active > rect:first-child { fill:#fff8f2; stroke:#db6a17; }
body[data-page="home"] .bestshot-action-meta { font:600 9px/1 var(--mono); letter-spacing:.06em; fill:#a98268 !important; }
body[data-page="home"] .bestshot-action-card.is-active .bestshot-action-meta { fill:#c45813 !important; }
body[data-page="home"] .bestshot-action-number { font:500 34px/1 var(--serif); letter-spacing:-.03em; fill:#17120f !important; }
body[data-page="home"] .bestshot-action-number.is-mobile { text-anchor:end; font-size:24px; }
body[data-page="home"] .bestshot-action-note { font:500 9px/1 var(--sans); fill:#987c69 !important; }
body[data-page="home"] .bestshot-action-button { fill:#db6a17 !important; stroke:none !important; }
body[data-page="home"] .bestshot-action-button-label { text-anchor:middle; font:600 9px/1 var(--sans); fill:#fff !important; }
body[data-page="home"] .evening-pulse { fill:#fff; stroke:#db6a17; stroke-width:3; filter:drop-shadow(0 0 7px rgba(219,106,23,.65)); }

/* Fig. 05b · simulation --------------------------------------------------- */
body[data-page="home"] .fig-backtest .sim {
  padding: 26px;
  border: 1px solid #ead6c4;
  border-radius: 14px;
  background:
    radial-gradient(circle at 70% 30%, rgba(219,106,23,.1), transparent 30%),
    #fffaf5;
  box-shadow: 0 24px 65px rgba(111, 63, 25, .09);
}
body[data-page="home"] .fig-backtest .sim-grid { gap: 12px; margin-top: 24px; }
body[data-page="home"] .fig-backtest .sim-col { min-height: 170px; border: 1px solid #eadfd3; border-radius: 9px; background: rgba(255,255,255,.82); }
body[data-page="home"] .fig-backtest .sim-col.engine { border-color: #dca36f; background: #fff; }
body[data-page="home"] .fig-backtest .sim-num { font-family: var(--serif); font-size: clamp(58px,8vw,96px); letter-spacing: -.05em; }
body[data-page="home"] .fig-backtest .sim-bar {
  height: 86px;
  margin-top: 14px;
  border: 0;
  border-radius: 0;
  background: radial-gradient(circle, #e4d5c8 2px, transparent 2.4px) 0 0 / 18px 18px;
  overflow: hidden;
}
body[data-page="home"] .fig-backtest .sim-bar span {
  display: block;
  height: 100%;
  border-radius: 0;
  background: radial-gradient(circle, var(--viz-warm) 2px, transparent 2.4px) 0 0 / 18px 18px;
  transition: width .15s linear;
}
body[data-page="home"] .fig-backtest .sim-lift { min-height: 42px; font-size: 15px; }
body[data-page="home"] .fig-backtest .sim-lift b { font-family: var(--serif); font-size: 28px; }

/* Fig. 06 · operations map ----------------------------------------------- */
body[data-page="home"] .bp-grid-thin { stroke:rgba(35,55,236,.07); stroke-width:1; fill:none; }
body[data-page="home"] .bp-grid-bold { stroke:rgba(35,55,236,.13); stroke-width:1; fill:none; }
body[data-page="home"] .bp-route { fill:none; stroke:#2337ec; stroke-width:3; stroke-linecap:round; }
body[data-page="home"] .bp-rental { fill:none; stroke:#2337ec; stroke-width:2.4; stroke-dasharray:8 7; stroke-linecap:round; }
body[data-page="home"] .bp-pulse { fill:#fff; stroke:#2337ec; stroke-width:3; }
body[data-page="home"] .bp-node { fill:#2337ec; stroke:#fff; stroke-width:3; }
body[data-page="home"] .bp-label { text-anchor:middle; font:700 13px/1 var(--mono); letter-spacing:.1em; fill:#0f1830 !important; }
body[data-page="home"] .bp-sub { text-anchor:middle; font:600 12px/1 var(--mono); fill:#2b3550 !important; }
body[data-page="home"] .bp-route-label { font:700 12px/1 var(--mono); letter-spacing:.1em; fill:#1c2740 !important; }
body[data-page="home"] .bp-stamp circle { fill:none; stroke:#2337ec; stroke-width:1.6; opacity:.72; }
body[data-page="home"] .bp-stamp-main { text-anchor:middle; font:700 16px/1 var(--mono); letter-spacing:.08em; fill:#2337ec !important; }
body[data-page="home"] .bp-stamp-sub { text-anchor:middle; font:600 8px/1 var(--mono); letter-spacing:.12em; fill:#2337ec !important; opacity:.82; }
body[data-page="home"] .bp-due rect { fill:#fff; stroke:#2337ec; stroke-width:2; }
body[data-page="home"] .bp-barcode rect { fill:#16203c; }
body[data-page="home"] .bp-due-k { font:700 11px/1 var(--mono); letter-spacing:.1em; fill:#1c2740 !important; }
body[data-page="home"] .bp-due-v { font:700 16px/1 var(--mono); fill:#0e1a35 !important; }
body[data-page="home"] .bp-node2 rect { fill:#fff; stroke:#c3ccdd; stroke-width:1.2; }
body[data-page="home"] .bp-node2 text { text-anchor:middle; font:600 12px/1 var(--mono); letter-spacing:.06em; fill:#26303f !important; }
body[data-page="home"] .bp-docket rect { fill:rgba(255,255,255,.72); stroke:#c3ccdd; stroke-width:1; }
body[data-page="home"] .bp-docket-label { font:600 11px/1 var(--mono); letter-spacing:.05em; fill:#2b3550 !important; }
body[data-page="home"] .bp-docket-line { fill:none; stroke:#2337ec; stroke-width:2; }
body[data-page="home"] .bp-docket-fc { stroke-dasharray:6 6; opacity:.55; }
body[data-page="home"] .bp-docket-div { stroke:#aab8d1; stroke-width:1; stroke-dasharray:3 4; }
body[data-page="home"] .bp-l { text-anchor:start !important; }
body[data-page="home"] .infographic-host.is-visible .bp-rental { animation: predictedFlow 1.8s linear infinite; }

/* Fig. 07 · camp orbit ---------------------------------------------------- */
body[data-page="home"] .camp-season-bg { fill: none; stroke: #e2e7f0; stroke-width: 24; stroke-linecap: round; }
body[data-page="home"] .camp-season-line { fill: none; stroke: url(#camp-arc); stroke-width: 24; stroke-linecap: round; stroke-dasharray: 82 100; }
body[data-page="home"] .camp-forecast-line { fill: none; stroke: #8ca1dc; stroke-width: 2; stroke-dasharray: 7 8; }
body[data-page="home"] .month-node { fill: #fff; stroke: #b8c3d8; stroke-width: 1.5; }
body[data-page="home"] .month-node.peak { fill: var(--viz-blue); stroke: #fff; stroke-width: 4; filter: drop-shadow(0 0 8px rgba(40,72,245,.45)); }
body[data-page="home"] .month-node.forecast { fill: #edf1fa; stroke-dasharray: 2 2; }
body[data-page="home"] .month-labels text,
body[data-page="home"] .camp-axis text { font: 700 11px/1 "IBM Plex Mono", monospace; fill: #141922; text-anchor: middle; letter-spacing: .06em; }
body[data-page="home"] .camp-peak text { text-anchor: middle; font: 700 11px/1 "IBM Plex Mono", monospace; fill: #26303f; letter-spacing: .07em; }
body[data-page="home"] .camp-peak .peak-value { font: 500 54px/1 var(--serif); letter-spacing: -.04em; fill: #101521; }
body[data-page="home"] .booking-orbit > path { fill: none; stroke: #aebce1; stroke-width: 1.3; stroke-dasharray: 4 7; }
body[data-page="home"] .booking-orbit circle { fill: #fff; stroke: #bcc7da; stroke-width: 1.2; }
body[data-page="home"] .booking-orbit text { text-anchor: middle; font: 700 10px/1 "IBM Plex Mono", monospace; fill: #26303f; }
body[data-page="home"] .booking-orbit .active circle { fill: var(--viz-blue); stroke: #fff; stroke-width: 4; filter: drop-shadow(0 8px 12px rgba(40,72,245,.24)); }
body[data-page="home"] .booking-orbit .active text { fill: var(--viz-blue); }
body[data-page="home"] .camp-ger-image { opacity: .9; filter: saturate(.8) contrast(1.06); }
body[data-page="home"] .camp-center-label { text-anchor: middle; font: 700 11px/1 "IBM Plex Mono", monospace; letter-spacing: .07em; fill: #26303f; }
body[data-page="home"] .camp-demand-wave { fill: none; stroke: var(--viz-blue); stroke-width: 2.2; }
body[data-page="home"] .camp-demand-forecast { fill: none; stroke: #8298da; stroke-width: 2; stroke-dasharray: 7 8; }
body[data-page="home"] .camp-orbit-pulse { fill: #fff; stroke: var(--viz-blue); stroke-width: 3; }
body[data-page="home"] .infographic-host.is-visible .camp-forecast-line,
body[data-page="home"] .infographic-host.is-visible .camp-demand-forecast { animation: predictedFlow 1.8s linear infinite; }

/* Supporting figures ------------------------------------------------------ */
body[data-page="home"] .compact-flow {
  border-radius: 12px;
  color: #fff;
  background: #080b12;
  border-color: #080b12;
  box-shadow: 0 25px 70px rgba(5,8,15,.16);
}
body[data-page="home"] .compact-flow .ui-eyebrow { color: #9ea8bc; }
body[data-page="home"] .compact-flow .soft-stepper > span,
body[data-page="home"] .compact-flow .soft-stepper > b { color: #fff; background: #111723; border-color: #2f3746; }
body[data-page="home"] .compact-flow .soft-stepper > b { background: var(--viz-blue); border-color: var(--viz-blue); }

body[data-page="home"] .bridge-steps {
  position: absolute;
  z-index: 5;
  left: max(32px, calc((100vw - var(--content-max))/2));
  bottom: 34px;
  display: flex;
  gap: 8px;
  opacity: var(--bridge-cap, 0);
  transform: translateY(calc((1 - var(--bridge-cap, 0)) * 12px));
}
body[data-page="home"] .bridge-steps span {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 9px 12px;
  border: 1px solid rgba(40,72,245,.22);
  border-radius: 999px;
  color: #33415d;
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(12px);
  font: 500 10px/1 "IBM Plex Mono", monospace;
}
body[data-page="home"] .bridge-steps b { color: var(--viz-blue); }

body[data-page="home"] .muy-filmstrip {
  flex: 0 0 min(35vw, 480px);
  width: min(35vw, 480px);
  margin: 0 4vw 0 0;
  display: grid;
  grid-template-columns: repeat(12,1fr);
  gap: 5px;
}
body[data-page="home"] .muy.scene-interstitial .muy-stage { flex: 1 1 auto; min-width: 0; }
body[data-page="home"] .muy-filmstrip i { position: relative; height: 28px; border: 1px solid #dce3ee; background: #f7f9fc; transition: .25s ease; }
body[data-page="home"] .muy-filmstrip i::after { content: ""; position: absolute; inset: 6px; background: radial-gradient(circle, #a9b7d4 1.5px, transparent 1.7px) 0 0 / 7px 7px; opacity: .45; }
body[data-page="home"] .muy-filmstrip i span { position: absolute; z-index: 2; left: 4px; top: 3px; font: 600 7px/1 "IBM Plex Mono", monospace; color: #8994a6; }
body[data-page="home"] .muy-filmstrip i.on { border-color: var(--viz-blue); background: var(--viz-blue); transform: translateY(-3px); box-shadow: 0 7px 15px rgba(40,72,245,.2); }
body[data-page="home"] .muy-filmstrip i.on::after { background-image: radial-gradient(circle,#fff 1.5px,transparent 1.7px); opacity: .8; }
body[data-page="home"] .muy-filmstrip i.on span { color: #fff; }

body[data-page="home"] .merge-stats {
  position: absolute;
  z-index: 3;
  left: 50%;
  bottom: 7%;
  display: flex;
  gap: 8px;
  transform: translateX(-50%);
  opacity: var(--finale-map, 1);
}
body[data-page="home"] .merge-stats span { min-width: 126px; padding: 10px 14px; border: 1px solid rgba(159,180,255,.24); color: #aebcf2; background: rgba(5,10,30,.5); backdrop-filter: blur(12px); font: 500 9px/1 "IBM Plex Mono", monospace; letter-spacing: .05em; text-align: center; }
body[data-page="home"] .merge-stats b { margin-right: 7px; color: #fff; font-size: 13px; }

@keyframes vizDraw { to { stroke-dashoffset: 0; } }
@keyframes predictedFlow { to { stroke-dashoffset: -30; } }
@keyframes orbitRotate { to { transform: rotate(360deg); } }
@keyframes vidaActionPulse { 0%,100% { opacity:.45; transform:scale(.75); transform-origin:center; } 50% { opacity:1; transform:scale(1.35); } }
@keyframes vidaTravel { 0% { transform:translateY(0); opacity:0; } 10% { opacity:1; } 82% { opacity:1; } 100% { transform:translateY(var(--travel,104px)); opacity:0; } }
@keyframes vidaInDim { 0%,100% { opacity:1; } 46%,58% { opacity:.55; } }
@keyframes radarReveal { from { opacity:0; transform:scale(.25) rotate(-8deg); } to { opacity:1; transform:scale(1) rotate(0); } }
@keyframes dotBreathe { 0%,100% { transform:scale(.82); } 50% { transform:scale(1.18); } }
@keyframes decayPulse { 0%,100% { opacity:.32; transform:scale(.72); } 50% { opacity:1; transform:scale(1.3); } }

@media (max-width: 760px) {
  body[data-page="home"] .records-figure,
  body[data-page="home"] .vida-card,
  body[data-page="home"] .missing-edge-card,
  body[data-page="home"] .dealy-flow-card,
  body[data-page="home"] .decay-card,
  body[data-page="home"] .evening-card,
  body[data-page="home"] .operations-card,
  body[data-page="home"] .occupancy-feature { padding: 22px 16px !important; border-radius: 12px; }

  body[data-page="home"] .feature-card-head { display: block; }
  body[data-page="home"] .feature-card-head > * + * { margin-top: 12px; }
  body[data-page="home"] .infographic-host { overflow: hidden; }
  body[data-page="home"] .viz-meta-row { width: 100%; align-items: flex-start; font-size: 8px; }
  body[data-page="home"] .viz-meta-row b { max-width: 20ch; text-align: right; }
  body[data-page="home"] .viz-svg:not(.viz-mobile-svg) { display: none; }
  body[data-page="home"] .viz-mobile-svg { display: block; width: 100%; max-width: none; }
  body[data-page="home"] .viz-mobile-svg .rel-node .node-main { font-size: 10px; }
  body[data-page="home"] .viz-mobile-svg .rel-node .node-sub { font-size: 8px; }
  body[data-page="home"] .vida-card .viz-mobile-svg { margin-top: 4px; }
  body[data-page="home"] #engine .vida-card .feature-tags { padding-bottom: 12px; }
  body[data-page="home"] #engine .vida-card .ftags {
    flex-wrap: wrap;
    min-height: 96px;
    padding: 14px 0 0;
  }
  body[data-page="home"] #engine .vida-card .ftag-out {
    flex: 0 0 100%;
    justify-content: center;
    margin: 0;
  }
  body[data-page="home"] .evening-card .viz-mobile-svg,
  body[data-page="home"] .occupancy-feature .viz-mobile-svg { margin-top: 8px; }
  body[data-page="home"] .fig-learn .play { min-height: 0; padding: 24px 18px; }
  body[data-page="home"] .fig-learn .chip-strip { grid-template-columns: repeat(2,1fr); margin-top: 48px; }
  body[data-page="home"] .fig-learn .pred-row { grid-template-columns: 1fr; }
  body[data-page="home"] .fig-backtest .sim-grid { grid-template-columns: 1fr; }
  body[data-page="home"] .bridge-steps { left: 20px; right: 20px; bottom: 20px; overflow-x: auto; }
  body[data-page="home"] .bridge-steps span { flex: 0 0 auto; }
  body[data-page="home"] .muy.scene-interstitial .muy-filmstrip {
    position: absolute;
    z-index: 4;
    left: 20px;
    right: 20px;
    bottom: 82px;
    width: auto;
    margin: 0;
    grid-template-columns: repeat(12,1fr);
  }
  body[data-page="home"] .muy-filmstrip i { height: 22px; }
  body[data-page="home"] .merge-stats { bottom: 10%; width: calc(100% - 40px); overflow-x: auto; justify-content: flex-start; }
  body[data-page="home"] .merge-stats span { flex: 0 0 auto; min-width: 112px; }
}

@media (prefers-reduced-motion: reduce) {
  body[data-page="home"] .infographic-host *,
  body[data-page="home"] .infographic-host *::before,
  body[data-page="home"] .infographic-host *::after { animation: none !important; transition: none !important; }
  body[data-page="home"] .relationship-svg .rel-primary path,
  body[data-page="home"] .sold-route { stroke-dashoffset: 0 !important; }
  body[data-page="home"] .viz-signal-dot,
  body[data-page="home"] .vida-pulse-dot,
  body[data-page="home"] .prediction-pulse,
  body[data-page="home"] .ops-route-pulse,
  body[data-page="home"] .camp-orbit-pulse,
  body[data-page="home"] .evening-pulse,
  body[data-page="home"] .dealy-flow-signal { display: none; }
  body[data-page="home"] .merge-stats { display: none; }
}

html.static-mode body[data-page="home"] .dealy-flow-path,
html.static-mode body[data-page="home"] .dealy-flow-stage { opacity: 1 !important; transform: none !important; stroke-dashoffset: 0 !important; }

html.static-mode body[data-page="home"] .infographic-host *,
html.static-mode body[data-page="home"] .infographic-host *::before,
html.static-mode body[data-page="home"] .infographic-host *::after { animation: none !important; transition: none !important; }
html.static-mode body[data-page="home"] .relationship-svg .rel-primary path,
html.static-mode body[data-page="home"] .sold-route { stroke-dashoffset: 0 !important; }
html.static-mode body[data-page="home"] .viz-signal-dot,
html.static-mode body[data-page="home"] .vida-pulse-dot,
html.static-mode body[data-page="home"] .prediction-pulse,
html.static-mode body[data-page="home"] .ops-route-pulse,
html.static-mode body[data-page="home"] .camp-orbit-pulse,
html.static-mode body[data-page="home"] .evening-pulse,
html.static-mode body[data-page="home"] .dealy-flow-signal { display: none; }

/* ============================================================
   FIGURE OVERHAUL — shared grammar + FIG 01 LEDGER
   ============================================================ */
body[data-page="home"] .fig-grain { mix-blend-mode: multiply; opacity: .06; pointer-events: none; }
body[data-page="home"] .fig-caption { fill: rgba(16,16,20,.42); font-family: var(--mono); font-size: 12px; letter-spacing: .01em; }
body[data-page="home"] .fig-axis { fill: var(--cobalt); font-family: var(--mono); font-size: 12px; letter-spacing: .16em; }
body[data-page="home"] .fig-stamp circle { fill: none; stroke: var(--cobalt); stroke-width: 1.3; opacity: .45; }
body[data-page="home"] .fig-stamp text { fill: var(--cobalt); font-family: var(--mono); font-size: 8px; letter-spacing: .12em; text-anchor: middle; opacity: .6; }

/* FIG 01 · LEDGER */
body[data-page="home"] .led-rules line { stroke: rgba(16,16,20,.14); stroke-width: 1; }
body[data-page="home"] .led-wash { fill: rgba(35,55,236,.06); }
body[data-page="home"] .led-id { fill: var(--cobalt); font-family: var(--mono); font-size: 12px; }
body[data-page="home"] .led-handle { fill: var(--ink); font-family: var(--sans); font-size: 16px; font-weight: 500; }
body[data-page="home"] .led-activity { fill: rgba(16,16,20,.5); font-family: var(--mono); font-size: 11px; }
body[data-page="home"] .led-edge { fill: none; }
body[data-page="home"] .led-edge.bought { stroke: var(--cobalt); stroke-width: 3; }
body[data-page="home"] .led-edge.viewed { stroke: rgba(16,16,20,.25); stroke-width: 1.6; }
body[data-page="home"] .led-edge.dormant { stroke: var(--cobalt); stroke-width: 2.4; stroke-dasharray: 3 7; }
body[data-page="home"] .led-thumb { filter: url(#duotone-ledger); clip-path: inset(0 round 11px); }
body[data-page="home"] .led-thumb-frame { fill: none; stroke: rgba(35,55,236,.3); stroke-width: 1; }
body[data-page="home"] .led-thumb-label { fill: var(--ink); font-family: var(--mono); font-size: 12px; text-anchor: middle; }
body[data-page="home"] .led-winback rect { fill: #fff; stroke: var(--cobalt); stroke-width: 1.4; }
body[data-page="home"] .led-winback text { fill: var(--cobalt); font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-anchor: middle; }
body[data-page="home"] .fig01-signal { fill: var(--cobalt); stroke: none; }
body[data-page="home"] .led-row:not(.is-hero),
body[data-page="home"] .led-endpoint,
body[data-page="home"] .fig01-svg .led-edge.bought,
body[data-page="home"] .fig01-svg .led-edge.viewed { opacity: .45; }
body[data-page="home"] .led-row.is-hero .led-handle { fill: var(--cobalt); font-weight: 600; }

/* ============================================================
   FIG 01 · THE LIVING LEDGER
   ============================================================ */
body[data-page="home"] .ll { display:grid; grid-template-columns:37% 1fr; gap:40px; align-items:start; }
body[data-page="home"] .ll-rail { max-height:404px; overflow-y:auto; scroll-snap-type:y proximity; padding-right:4px; scrollbar-width:none; }
body[data-page="home"] .ll-rail::-webkit-scrollbar { width:0; height:0; }
body[data-page="home"] .ll-row { position:relative; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:14px; width:100%; height:64px; padding:0 12px; border:0; border-top:1px solid rgba(16,16,20,.14); background:transparent; text-align:left; cursor:pointer; scroll-snap-align:start; transition:background .3s ease; }
body[data-page="home"] .ll-row:last-child { border-bottom:1px solid rgba(16,16,20,.14); }
body[data-page="home"] .ll-row-id { font-family:var(--mono); font-size:12px; color:var(--cobalt); }
body[data-page="home"] .ll-row-body { display:flex; flex-direction:column; min-width:0; }
body[data-page="home"] .ll-row-body b { font-family:var(--sans); font-size:16px; font-weight:500; color:var(--ink); line-height:1.15; }
body[data-page="home"] .ll-row-body span { font-family:var(--mono); font-size:12px; color:rgba(16,16,20,.66); }
body[data-page="home"] .ll-row-thumb { width:34px; height:34px; opacity:.38; transition:opacity .3s ease; }
body[data-page="home"] .ll-rt-e { stroke:rgba(35,55,236,.5); stroke-width:.7; }
body[data-page="home"] .ll-rt-n, body[data-page="home"] .ll-rt-c { fill:var(--cobalt); }
body[data-page="home"] .ll-row:focus-visible { outline:2px solid var(--cobalt); outline-offset:-2px; border-radius:6px; }
body[data-page="home"] .ll-row.is-active { background:rgba(35,55,236,.06); box-shadow:inset 2px 0 0 var(--cobalt); }
body[data-page="home"] .ll-row.is-active .ll-row-thumb { opacity:1; }
body[data-page="home"] .ll-row.is-active .ll-row-body b { color:var(--cobalt); }

body[data-page="home"] .ll-stage { position:relative; }
/* FIG 01 · behavioral mesh — canvas + floating tooltip */
body[data-page="home"] .bg-stage { position:relative; width:100%; aspect-ratio:1.16 / 1; border-radius:16px; overflow:hidden; background:radial-gradient(120% 120% at 50% 30%, rgba(35,55,236,.028), rgba(35,55,236,0) 60%); }
body[data-page="home"] .bg-canvas { position:absolute; inset:0; width:100%; height:100%; display:block; cursor:grab; touch-action:pan-y; -webkit-user-select:none; user-select:none; }
body[data-page="home"] .bg-canvas:active { cursor:grabbing; }
body[data-page="home"] .bg-tip { position:absolute; top:0; left:0; z-index:4; max-width:220px; padding:10px 12px; border-radius:12px; background:rgba(255,255,255,.94); backdrop-filter:blur(6px); box-shadow:0 12px 34px rgba(25,39,75,.16); border:1px solid rgba(35,55,236,.14); pointer-events:none; opacity:0; transition:opacity .14s ease; will-change:transform; }
body[data-page="home"] .bg-tip.is-on { opacity:1; }
body[data-page="home"] .bg-tip img { display:block; width:44px; height:44px; object-fit:contain; margin-bottom:7px; filter:url(#duotone-ledger); }
body[data-page="home"] .bg-tip b { display:block; font-family:var(--serif); font-size:16px; line-height:1.15; color:var(--ink); }
body[data-page="home"] .bg-tip-type { display:block; margin-top:2px; font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--cobalt); }
body[data-page="home"] .bg-tip p { margin:6px 0 0; font-family:var(--mono); font-size:12.5px; line-height:1.45; color:rgba(16,16,20,.82); }
body[data-page="home"] .bg-tip small { display:block; margin-top:6px; font-family:var(--mono); font-size:11.5px; color:rgba(16,16,20,.62); }
body[data-page="home"] .ll-reading { position:absolute; z-index:3; left:14px; bottom:40px; max-width:56%; padding:8px 12px; border-radius:12px; background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.86)); backdrop-filter:blur(3px); pointer-events:none; }
body[data-page="home"] .ll-read-line { margin:0; font-family:var(--mono); font-size:14px; line-height:1.5; color:var(--ink); min-height:1.5em; }
body[data-page="home"] .ll-caption { position:absolute; z-index:3; left:16px; bottom:12px; margin:0; font-family:var(--mono); font-size:12px; color:rgba(16,16,20,.5); pointer-events:none; }

@media (max-width:760px) {
  body[data-page="home"] .ll { grid-template-columns:1fr; gap:14px; }
  body[data-page="home"] .ll-rail { display:flex; max-height:none; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x proximity; gap:8px; padding:0 0 6px; }
  body[data-page="home"] .ll-row { width:auto; flex:0 0 auto; height:auto; border:1px solid rgba(16,16,20,.14); border-radius:12px; padding:9px 12px; }
  body[data-page="home"] .ll-row:last-child { border-bottom:1px solid rgba(16,16,20,.14); }
  body[data-page="home"] .ll-row-thumb, body[data-page="home"] .ll-row-body span { display:none; }
  body[data-page="home"] .ll-row.is-active { box-shadow:none; border-color:var(--cobalt); }
  body[data-page="home"] .bg-stage { aspect-ratio:1 / 1; }
  body[data-page="home"] .ll-reading { position:static; max-width:none; margin-top:12px; padding:0; background:none; backdrop-filter:none; }
  body[data-page="home"] .ll-read-line:nth-child(n+3) { display:none; }
  body[data-page="home"] .ll-caption { position:static; left:auto; bottom:auto; margin-top:10px; }
  body[data-page="home"] .bg-tip { max-width:170px; }
}
