/* /value-chain/fabric/ only (lane rev-value-chain__fabric). Every selector, variable and keyframe is prefixed vc-a-fb-.
   The motif is one illustrative roll, RL-0417, carried through seven blocks. HTML is the composed end state: pre-states
   live only under :root[data-m-go][data-fb-arm] (the page's own trigger, set by its client), scroll-linked moves are
   longhands under @supports and :root[data-m-go], and reduced motion and Calm show every still state. */
body[data-page='value-chain-fabric'] main { overflow-x: clip; }
body[data-page='value-chain-fabric'] .gft-cite { font-size: 13px; }
.vc-a-fb-sec {
  --fb-amber: #e3a640; --fb-amber-t: #f6dcae; --fb-coral: #ff9a86; --fb-ink: #072d2b; --fb-txt: #e2ebe6; --fb-mut: #c3d6cb;
  position: relative; isolation: isolate; padding-block: 0 clamp(72px, 7vw, 112px); font-size: 17px;
}
.vc-a-fb-sec .gft-eyebrow { font-size: 13px; letter-spacing: 0.1em; margin-bottom: 14px; }
.vc-a-fb-sec h2 { font-size: clamp(28px, 2.75vw, 42px); line-height: 1.08; letter-spacing: -0.04em; max-width: 26ch; }
.vc-a-fb-head { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 48px; align-items: end; margin-bottom: 28px; }
.vc-a-fb-lede { font-size: 18px; line-height: 1.6; max-width: 46ch; }
.gft-section--dark .vc-a-fb-lede { color: var(--fb-txt); }
.vc-a-fb-k { font: 600 13px/1.4 var(--gft-font-mono); letter-spacing: 0.06em; text-transform: uppercase; margin: 0; }
.vc-a-fb-note { font: 14px/1.6 var(--gft-font-mono); color: var(--fb-mut); margin-top: 22px; max-width: none; }
.vc-a-fb-note--paper { color: #3d554c; }
.vc-a-fb-sp input[type='radio'], .vc-a-fb-sec input[type='radio'] { position: absolute; opacity: 0; width: 1px; height: 1px; }

/* roll ruler: the thin top rule of each block, marked at the motif's state */
.vc-a-fb-ruler { position: relative; height: 44px; display: flex; align-items: center; padding-inline: max(48px, calc((100vw - 1440px) / 2)); margin-bottom: 36px; overflow: hidden;
  font: 600 13px var(--gft-font-mono); letter-spacing: 0.06em; color: var(--fb-mut); border-bottom: 1px solid #6bb68f40;
  background: repeating-linear-gradient(90deg, #6bb68f55 0 1px, transparent 1px 48px) bottom / 100% 9px no-repeat; }
.vc-a-fb-ruler span { position: relative; z-index: 1; background: inherit; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.vc-a-fb-ruler i { position: absolute; left: 0; bottom: 0; width: 120px; height: 3px; background: var(--fb-amber); }
.vc-a-fb-ruler--paper { color: #3d554c; border-bottom-color: #0e4d4a40; background-image: repeating-linear-gradient(90deg, #0e4d4a55 0 1px, transparent 1px 48px); }
.vc-a-fb-ruler--paper i { background: #8a5a12; }

/* ---------- headings: one split fx per block, set off by the page trigger ---------- */
:root[data-m-go][data-fb-arm] [data-fb-e]:not([data-fb-in]) :is(.vc-a-fb-fx, .gft-eyebrow, .vc-a-fb-lede) { opacity: 0; }
:root[data-m-go][data-fb-arm] [data-fb-e][data-fb-in=''] :is(.vc-a-fb-fx, .gft-eyebrow, .vc-a-fb-lede) {
  animation-duration: 700ms; animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
:root[data-m-go][data-fb-arm] [data-fb-e][data-fb-in=''] .gft-eyebrow { animation-name: vc-a-fb-fade; animation-duration: 420ms; }
:root[data-m-go][data-fb-arm] [data-fb-e][data-fb-in=''] .vc-a-fb-lede { animation-name: vc-a-fb-rise; animation-delay: 220ms; animation-duration: 620ms; }
:root[data-m-go][data-fb-arm] [data-fb-e][data-fb-in=''] .vc-a-fb-fx--track { animation-name: vc-a-fb-track; }
:root[data-m-go][data-fb-arm] [data-fb-e][data-fb-in=''] .vc-a-fb-fx--skew { animation-name: vc-a-fb-skew; transform-origin: 0 100%; }
:root[data-m-go][data-fb-arm] [data-fb-e][data-fb-in=''] .vc-a-fb-fx--drop { animation-name: vc-a-fb-drop; }
:root[data-m-go][data-fb-arm] [data-fb-e][data-fb-in=''] .vc-a-fb-fx--blur { animation-name: vc-a-fb-blur; }
:root[data-m-go][data-fb-arm] [data-fb-e][data-fb-in=''] .vc-a-fb-fx--wdth { animation-name: vc-a-fb-wdth; transform-origin: 0 50%; }
:root[data-m-go][data-fb-arm] [data-fb-e][data-fb-in=''] .vc-a-fb-fx--swing { animation-name: vc-a-fb-swing; transform-origin: 0 0; }
@keyframes vc-a-fb-fade { from { opacity: 0; } }
@keyframes vc-a-fb-rise { from { opacity: 0; transform: translateY(22px); } }
@keyframes vc-a-fb-track { from { opacity: 0; transform: translateX(-44px); } }
@keyframes vc-a-fb-skew { from { opacity: 0; transform: skewX(-12deg) translateX(-24px); } }
@keyframes vc-a-fb-drop { from { opacity: 0; transform: translateY(-34px); } }
@keyframes vc-a-fb-blur { from { opacity: 0; filter: blur(12px); } }
@keyframes vc-a-fb-wdth { from { opacity: 0; transform: scaleX(0.84); } }
@keyframes vc-a-fb-swing { from { opacity: 0; transform: rotate(-3.5deg) translateY(18px); } }
@keyframes vc-a-fb-clipx { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes vc-a-fb-deal { from { opacity: 0; transform: translateY(20px); } }
@keyframes vc-a-fb-pop { from { opacity: 0; transform: scale(1.7); } }

/* ================= 1 · splash: the weaving fell under a camera bar ================= */
.gft-splash[data-splash='vc-a-fabric'] .gft-splash__structure { inset: 0; display: block; }
.gft-splash[data-splash='vc-a-fabric'] .gft-splash__structure::after { background: linear-gradient(90deg, #072d2bf0 0%, #072d2bd6 27%, #072d2b70 42%, #072d2b00 50%); }
.gft-splash[data-splash='vc-a-fabric'] :is(.gft-splash__data, .gft-splash__position) { display: none; }
.gft-splash[data-splash='vc-a-fabric'] .gft-splash__caption { font-size: 13px; color: #c3d6cb; }
.gft-splash[data-splash='vc-a-fabric'] .gft-splash__cue { font-size: 15px; font-weight: 600; color: #f6f4ef; }
.gft-splash[data-splash='vc-a-fabric'] .gft-eyebrow { font-size: 13px; }
.gft-splash[data-splash='vc-a-fabric'] h1 { font-size: clamp(3.4rem, min(5.2vw, 8.4svh), 6rem); max-width: 11ch; margin-top: 20px; }
.gft-splash[data-splash='vc-a-fabric'] .gft-splash__lede { font-size: 17px; max-width: 40ch; margin-top: 16px; color: #e2ebe6; }
.gft-splash[data-splash='vc-a-fabric'] .gft-splash__actions { margin-top: 18px; max-width: 640px; }
.gft-splash[data-splash='vc-a-fabric'] .gft-button { min-height: 50px; font-size: 14px; }
.vc-a-fb-sp-svg { width: 100%; height: 100%; min-height: 0; }
.vc-a-fb-sp { display: grid; gap: 8px; margin-bottom: 14px; }
.vc-a-fb-sp__modes { display: flex; gap: 6px; border: 0; padding: 0; margin: 0; }
.vc-a-fb-sp__modes label { position: relative; cursor: pointer; }
.vc-a-fb-sp__modes span { display: grid; min-height: 52px; min-width: 170px; padding: 6px 14px; border: 1px solid #6bb68f80; background: #072d2bcc; }
.vc-a-fb-sp__modes i { font: normal 600 13px var(--gft-font-mono); letter-spacing: 0.06em; color: #c3d6cb; }
.vc-a-fb-sp__modes b { font-size: 16px; color: #f6f4ef; }
.vc-a-fb-sp__modes input:checked + span { border-color: #e3a640; background: #0e4d4a; box-shadow: inset 0 -3px 0 #e3a640; }
.vc-a-fb-sp__modes input:focus-visible + span { outline: 3px solid #e3a640; outline-offset: 3px; }
.vc-a-fb-sp__read { margin: 0; max-width: none; }
.vc-a-fb-sp__r { display: none; }
.vc-a-fb-sp__r b { display: block; font-size: 28px; line-height: 1.15; letter-spacing: -0.02em; color: #f6f4ef; }
.vc-a-fb-sp__r small { font: 14px var(--gft-font-mono); color: #c3d6cb; }
.vc-a-fb-sp__r--v { display: block; }
.gft-splash:has(.vc-a-fb-sp input[value='manual']:checked) .vc-a-fb-sp__r--m { display: block; }
.gft-splash:has(.vc-a-fb-sp input[value='manual']:checked) .vc-a-fb-sp__r--v { display: none; }
.vc-a-fb-sp__go { gap: 10px; }
.vc-a-fb-sp__pills { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 0; margin: 14px 0 0; font-size: 14px; color: #e2ebe6; }
.vc-a-fb-sp__pills li { display: inline-flex; gap: 6px; align-items: baseline; }
.vc-a-fb-sp__pills strong { color: #f6dcae; font-weight: 750; }
.vc-a-fb-sp__cite .gft-cite { color: #e2ebe6; }
/* splash drawing */
.vc-a-fb-sp-svg :is(.vc-a-fb-sd__in, .vc-a-fb-sd__box, .vc-a-fb-sd__glow, .vc-a-fb-sp-exit, .vc-a-fb-sp-bar, .vc-a-fb-sp-take, .vc-a-fb-sp-reed, .vc-a-fb-sp-cloth, .vc-a-fb-sp-warp) { transform-box: fill-box; transform-origin: center; }
.vc-a-fb-sp-id { font: 700 15px var(--gft-font-mono); letter-spacing: 0.08em; fill: #f6f4ef; }
.vc-a-fb-sp-lbl { font: 700 15px var(--gft-font-mono); letter-spacing: 0.06em; fill: #f6dcae; }
.vc-a-fb-sd__box { fill: #e3a6402e; stroke: #e3a640; stroke-width: 2.5; opacity: 0; }
.vc-a-fb-sd__glow { fill: none; stroke: #f6dcae; stroke-width: 2; opacity: 0; }
.vc-a-fb-sd__tick { stroke: #9fb0c4; stroke-width: 3; stroke-linecap: round; opacity: 0; }
.vc-a-fb-sd__dot { fill: #6bb68f; opacity: 0.75; }
.vc-a-fb-sd[data-past] .vc-a-fb-sd__box { opacity: 1; }
.vc-a-fb-sd[data-past] .vc-a-fb-sd__dot { fill: #e3a640; opacity: 1; }
.gft-splash:not(:has(.vc-a-fb-sp input[value='manual']:checked)) .vc-a-fb-sd[data-past][data-vm] .vc-a-fb-sd__box,
.gft-splash:has(.vc-a-fb-sp input[value='manual']:checked) .vc-a-fb-sd[data-past][data-mm] .vc-a-fb-sd__box { opacity: 0; }
.gft-splash:not(:has(.vc-a-fb-sp input[value='manual']:checked)) .vc-a-fb-sd[data-past][data-vm] .vc-a-fb-sd__tick,
.gft-splash:has(.vc-a-fb-sp input[value='manual']:checked) .vc-a-fb-sd[data-past][data-mm] .vc-a-fb-sd__tick { opacity: 1; }
.gft-splash:not(:has(.vc-a-fb-sp input[value='manual']:checked)) .vc-a-fb-sd[data-past][data-vm] :is(.vc-a-fb-sd__dot),
.gft-splash:has(.vc-a-fb-sp input[value='manual']:checked) .vc-a-fb-sd[data-past][data-mm] :is(.vc-a-fb-sd__dot) { fill: #9fb0c4; }
.gft-splash:not(:has(.vc-a-fb-sp input[value='manual']:checked)) .vc-a-fb-sd[data-past][data-vm] .vc-a-fb-sd__glow,
.gft-splash:has(.vc-a-fb-sp input[value='manual']:checked) .vc-a-fb-sd[data-past][data-mm] .vc-a-fb-sd__glow { stroke: #9fb0c4; }
.vc-a-fb-sd__tag rect { fill: #072d2bf0; stroke: #e3a640; }
.vc-a-fb-sd__tag text { font: 700 15px var(--gft-font-mono); fill: #f6f4ef; }
.gft-splash:not(:has(.vc-a-fb-sp input[value='manual']:checked)) .vc-a-fb-sd[data-vm] .vc-a-fb-sd__tag rect,
.gft-splash:has(.vc-a-fb-sp input[value='manual']:checked) .vc-a-fb-sd[data-mm] .vc-a-fb-sd__tag rect { stroke: #9fb0c4; }
/* splash entrance, three beats inside 900 ms: warp draws, reed beats and cloth reveals, bar drops and boxes */
:root[data-m-go] :is(.vc-a-fb-sp-warp, .vc-a-fb-sp-reed, .vc-a-fb-sp-cloth, .vc-a-fb-sp-take, .vc-a-fb-sp-bar, .vc-a-fb-sd__in, .vc-a-fb-sd[data-past] .vc-a-fb-sd__box) {
  animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
:root[data-m-go] .vc-a-fb-sp-warp { animation-name: vc-a-fb-clipx; animation-duration: 450ms; }
:root[data-m-go] .vc-a-fb-sp-reed { animation-name: vc-a-fb-sp-beat; animation-duration: 300ms; animation-delay: 300ms; }
:root[data-m-go] .vc-a-fb-sp-cloth { animation-name: vc-a-fb-clipx; animation-duration: 450ms; animation-delay: 300ms; }
:root[data-m-go] .vc-a-fb-sp-take { animation-name: vc-a-fb-sp-in; animation-duration: 380ms; animation-delay: 420ms; }
:root[data-m-go] .vc-a-fb-sd__in { animation-name: vc-a-fb-sp-born; animation-duration: 320ms; animation-delay: 360ms; }
:root[data-m-go] .vc-a-fb-sp-bar { animation-name: vc-a-fb-sp-bar; animation-duration: 300ms; animation-delay: 600ms; }
:root[data-m-go] .vc-a-fb-sd[data-past] .vc-a-fb-sd__box { animation-name: vc-a-fb-pop; animation-duration: 220ms; animation-delay: calc(640ms + var(--k, 0) * 10ms); }
@keyframes vc-a-fb-sp-beat { from { transform: translateX(-30px); } 60% { transform: translateX(8px); } }
@keyframes vc-a-fb-sp-in { from { opacity: 0; transform: translateX(46px); } }
@keyframes vc-a-fb-sp-born { from { opacity: 0; transform: scale(0.2); } }
@keyframes vc-a-fb-sp-bar { from { opacity: 0; transform: translateY(-110px); } }

/* ================= 2 · the roll scanner ================= */
.vc-a-fb-b2 { background: #041f1d; color: #f6f4ef; }
.vc-a-fb-b2__ctl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 24px; align-items: center; }
.vc-a-fb-modes { display: flex; gap: 8px; border: 0; margin: 0; padding: 0; }
.vc-a-fb-modes label { position: relative; cursor: pointer; }
.vc-a-fb-modes span { display: grid; min-width: 210px; min-height: 64px; padding: 8px 16px; border: 1px solid #6bb68f70; background: #072d2b; }
.vc-a-fb-modes i { font: normal 600 13px var(--gft-font-mono); letter-spacing: 0.06em; color: var(--fb-mut); }
.vc-a-fb-modes b { font-size: 17px; }
.vc-a-fb-modes small { font-size: 13px; color: var(--fb-mut); }
.vc-a-fb-modes input:checked + span { border-color: var(--fb-amber); background: #0e4d4a; box-shadow: inset 0 -3px 0 var(--fb-amber); }
.vc-a-fb-modes input:focus-visible + span { outline: 3px solid var(--fb-amber); outline-offset: 3px; }
.vc-a-fb-scrub { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: 'play lbl out' 'play rng out'; gap: 0 18px; align-items: center; }
.vc-a-fb-scrub label { grid-area: lbl; font: 600 13px var(--gft-font-mono); letter-spacing: 0.06em; color: var(--fb-mut); text-transform: uppercase; }
.vc-a-fb-scrub input { grid-area: rng; width: 100%; accent-color: var(--fb-amber); }
.vc-a-fb-scrub output { grid-area: out; font: 700 28px var(--gft-font-mono); min-width: 4.4ch; text-align: right; }
.vc-a-fb-play { grid-area: play; min-height: 52px; padding: 10px 20px; border: 1px solid var(--fb-amber); background: var(--fb-amber); color: #072d2b; font-weight: 700; font-size: 15px; }
.vc-a-fb-play[aria-pressed='true'] { background: transparent; color: var(--fb-amber); }
.vc-a-fb-b2__plot { margin-top: 18px; }
.vc-a-fb-b2__plot:focus-visible { outline: 3px solid var(--fb-amber); outline-offset: 4px; }
.vc-a-fb-roll-svg { width: 100%; height: auto; overflow: visible; }
.vc-a-fb-roll-svg text { font-family: var(--gft-font-mono); font-size: 16px; fill: #cfe0d6; }
.vc-a-fb-roll-svg .vc-a-fb-roll-svg__title { font-size: 15px; font-weight: 700; letter-spacing: 0.06em; transition: opacity 0.35s; }
.vc-a-fb-taxis text { fill: var(--fb-amber-t); font-weight: 700; font-size: 15px; }
.vc-a-fb-taxis { opacity: 0; transition: opacity 0.35s; }
.vc-a-fb-gate text { fill: #e2ebe6; font-weight: 700; }
.vc-a-fb-scanned { transform: scaleX(var(--fb-p, 0)); transform-origin: 40px 0; transition: transform 0.18s linear; }
.vc-a-fb-bar { transform: translateX(calc(var(--fb-p, 0) * 1120px)); transition: transform 0.18s linear; }
.vc-a-fb-def { outline: none; }
.vc-a-fb-def__box { fill: none; stroke: transparent; stroke-width: 2.5; transform-box: fill-box; transform-origin: center; transition: stroke 0.3s, fill 0.3s, stroke-width 0.3s; }
.vc-a-fb-def__dot { fill: #b9cfc2; opacity: 0.6; }
.vc-a-fb-def__n { fill: transparent; font-weight: 700; }
.vc-a-fb-def__ring { opacity: 0; transition: opacity 0.4s; }
.vc-a-fb-def__arrow { opacity: 0; transition: opacity 0.4s; }
.vc-a-fb-def[data-state='found'] .vc-a-fb-def__box { stroke: var(--fb-amber); fill: #c98a2b40; }
.vc-a-fb-def[data-state='found'] .vc-a-fb-def__dot { fill: var(--fb-amber); opacity: 1; }
.vc-a-fb-def[data-state='found'] .vc-a-fb-def__n { fill: #f6f4ef; }
.vc-a-fb-def[data-state='missed'] .vc-a-fb-def__box { stroke: var(--fb-coral); stroke-dasharray: 5 4; fill: #ff9a8620; }
.vc-a-fb-def[data-state='missed'] .vc-a-fb-def__dot { fill: var(--fb-coral); opacity: 1; }
.vc-a-fb-def[data-state='missed'] .vc-a-fb-def__n { fill: #ffc6bb; }
.vc-a-fb-def[data-i='6']:not([data-state='ahead']) .vc-a-fb-def__ring { opacity: 1; }
.vc-a-fb-def:is(:hover, :focus-visible) .vc-a-fb-def__box { stroke: #f6f4ef; stroke-width: 4; }
.vc-a-fb-def:is(:hover, :focus-visible) .vc-a-fb-def__n { fill: #f6f4ef; }
.vc-a-fb-b2[data-reading='vision'] .vc-a-fb-def[data-state='found'] .vc-a-fb-def__box { fill: #e3a64066; stroke-width: 4; }
.vc-a-fb-b2[data-reading='manual'] .vc-a-fb-def[data-state='missed'] .vc-a-fb-def__arrow { opacity: 1; }
.vc-a-fb-b2[data-reading='speed'] .vc-a-fb-taxis { opacity: 1; }
.vc-a-fb-b2[data-reading='speed'] .vc-a-fb-roll-svg__title { opacity: 0; }
.vc-a-fb-b2[data-reading='market'] .vc-a-fb-bar line { stroke: #9fb1ec; }
.vc-a-fb-b2[data-reading='market'] .vc-a-fb-bar rect:first-child { fill: #9fb1ec33; }
.vc-a-fb-b2__hover { margin: 10px 0 0; font-size: 15px; color: var(--fb-txt); min-height: 3.2em; max-width: none; }
.vc-a-fb-b2__low { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: 40px; margin-top: 18px; align-items: start; }
.vc-a-fb-read { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 18px 32px; border-top: 1px solid #6bb68f55; padding-top: 18px; }
.vc-a-fb-read .vc-a-fb-k { color: var(--fb-mut); }
.vc-a-fb-read__big { font-size: 64px; font-weight: 850; line-height: 1; letter-spacing: -0.04em; margin: 6px 0; }
.vc-a-fb-read__big small { font-size: 28px; color: var(--fb-mut); font-weight: 700; }
.vc-a-fb-read__sub { font-size: 15px; color: var(--fb-txt); margin: 0; }
.vc-a-fb-read__dl { display: grid; gap: 12px; margin: 0; }
.vc-a-fb-read__dl dt { font: 600 13px var(--gft-font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--fb-mut); }
.vc-a-fb-read__dl dd { margin: 0; font-size: 30px; font-weight: 800; }
.vc-a-fb-read__c { grid-column: 1 / -1; display: grid; }
.vc-a-fb-read__c > div { grid-area: 1 / 1; transition: opacity 0.35s, visibility 0s 0.35s; }
.vc-a-fb-log { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 2px; }
.vc-a-fb-log li { display: grid; grid-template-columns: 3ch minmax(0, 1fr) auto; gap: 14px; font-size: 15px; padding: 3px 0 3px 10px; border-left: 3px solid #6bb68f; }
.vc-a-fb-log li[data-state='found'] { border-left-color: var(--fb-amber); }
.vc-a-fb-log li[data-state='missed'] { border-left-color: var(--fb-coral); }
.vc-a-fb-log b { font-family: var(--gft-font-mono); }
.vc-a-fb-log em { font: normal 15px var(--gft-font-mono); color: var(--fb-mut); }
.vc-a-fb-mkt { opacity: 0; visibility: hidden; }
.vc-a-fb-b2[data-reading='market'] .vc-a-fb-mkt { opacity: 1; visibility: visible; transition-delay: 0s; }
.vc-a-fb-b2[data-reading='market'] .vc-a-fb-logwrap { opacity: 0; visibility: hidden; }
.vc-a-fb-mkt .vc-a-fb-k { color: var(--fb-mut); display: flex; align-items: center; gap: 10px; }
.vc-a-fb-mkt__row { display: grid; grid-template-columns: 5ch minmax(0, 1fr) auto; gap: 14px; align-items: center; margin: 6px 0 0; max-width: none; font-size: 16px; }
.vc-a-fb-mkt__row i { height: 18px; background: #ffffff14; }
.vc-a-fb-mkt__row u { display: block; height: 100%; background: #9fb1ec; transform: scaleX(var(--w)); transform-origin: left; }
.vc-a-fb-mkt__row b { font-family: var(--gft-font-mono); }
.vc-a-fb-mkt__note { font-size: 15px; color: var(--fb-txt); margin: 8px 0 0; }
.vc-a-fb-rd__btns { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.vc-a-fb-rd__b { display: grid; align-content: start; gap: 4px; min-height: 108px; padding: 12px 16px; text-align: left; border: 1px solid #6bb68f60; background: #072d2b; color: #f6f4ef; }
.vc-a-fb-rd__fig { font-size: 40px; font-weight: 850; letter-spacing: -0.04em; line-height: 1; }
.vc-a-fb-rd__lbl { font-size: 14px; color: var(--fb-txt); line-height: 1.35; }
.vc-a-fb-rd__b[aria-pressed='true'] { border-color: var(--fb-amber); background: #0e4d4a; box-shadow: inset 4px 0 0 var(--fb-amber); }
.vc-a-fb-rd__b[aria-pressed='true'] .vc-a-fb-rd__fig { color: var(--fb-amber-t); }
.vc-a-fb-rd__panel { display: grid; margin-top: 14px; }
.vc-a-fb-rd__panel > * { grid-area: 1 / 1; opacity: 0; visibility: hidden; transition: opacity 0.35s, visibility 0s 0.35s; }
.vc-a-fb-b2[data-reading='vision'] .vc-a-fb-rd__panel [data-p='vision'], .vc-a-fb-b2[data-reading='manual'] .vc-a-fb-rd__panel [data-p='manual'],
.vc-a-fb-b2[data-reading='speed'] .vc-a-fb-rd__panel [data-p='speed'], .vc-a-fb-b2[data-reading='market'] .vc-a-fb-rd__panel [data-p='market'] { opacity: 1; visibility: visible; transition-delay: 0s; }
.vc-a-fb-gauge__track { position: relative; height: 22px; background: linear-gradient(90deg, #ffffff12, #ffffff26); border: 1px solid #6bb68f55; cursor: crosshair; }
.vc-a-fb-gauge__band { position: absolute; inset-block: 0; background: #c98a2bcc; }
.vc-a-fb-gauge__band--v { background: #6bb68fcc; }
.vc-a-fb-gauge__roll { position: absolute; top: -6px; bottom: -6px; width: 4px; margin-left: -2px; background: #f6f4ef; }
.vc-a-fb-gauge__mark { position: absolute; top: -8px; bottom: -8px; left: 0; width: 2px; background: var(--fb-amber); opacity: 0; pointer-events: none; }
.vc-a-fb-gauge__read { font-size: 15px; color: var(--fb-txt); margin: 10px 0 0; }
.vc-a-fb-speed__eq { font-size: 24px; font-weight: 800; letter-spacing: -0.02em; margin: 0; color: var(--fb-amber-t); }
/* scanner entrance: unspool (the plot unrolls left to right), then the readings deal in */
:root[data-m-go][data-fb-arm] .vc-a-fb-b2__plot[data-fb-in=''] .vc-a-fb-roll-svg { animation-name: vc-a-fb-clipx; animation-duration: 600ms; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b2__plot:not([data-fb-in]) .vc-a-fb-roll-svg { clip-path: inset(0 100% 0 0); }
:root[data-m-go][data-fb-arm] .vc-a-fb-b2__plot[data-fb-in=''] .vc-a-fb-def[data-state='found'] .vc-a-fb-def__box { animation-name: vc-a-fb-pop; animation-duration: 260ms; animation-delay: 560ms; animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b2__ctl:not([data-fb-in]) > * { opacity: 0; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b2__ctl[data-fb-in=''] > * { animation-name: vc-a-fb-drop; animation-duration: 520ms; animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b2__ctl[data-fb-in=''] > :nth-child(2) { animation-delay: 120ms; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b2__low:not([data-fb-in]) :is(.vc-a-fb-rd__b, .vc-a-fb-read, .vc-a-fb-rd__panel) { opacity: 0; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b2__low[data-fb-in=''] :is(.vc-a-fb-rd__b, .vc-a-fb-read, .vc-a-fb-rd__panel) { animation-name: vc-a-fb-deal; animation-duration: 460ms; animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b2__low[data-fb-in=''] .vc-a-fb-read { animation-name: vc-a-fb-track; animation-duration: 640ms; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b2__low[data-fb-in=''] .vc-a-fb-rd__b:nth-child(2) { animation-delay: 80ms; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b2__low[data-fb-in=''] .vc-a-fb-rd__b:nth-child(3) { animation-delay: 160ms; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b2__low[data-fb-in=''] .vc-a-fb-rd__b:nth-child(4) { animation-delay: 240ms; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b2__low[data-fb-in=''] .vc-a-fb-rd__panel { animation-delay: 360ms; }

/* ================= 3 · the construction loupe (paper) ================= */
.vc-a-fb-b3 { background: #f6f4ef; color: #072d2b; }
.vc-a-fb-loupe { position: absolute; z-index: 3; top: -92px; width: 160px; left: calc((100% - min(1440px, 100% - 96px)) / 2 + min(1440px, 100% - 96px) * 0.3 - 80px); display: grid; justify-items: center; gap: 4px; pointer-events: none; }
.vc-a-fb-loupe svg { width: 160px; height: 160px; filter: drop-shadow(0 8px 24px #072d2b55); }
.vc-a-fb-loupe span { font: 700 13px var(--gft-font-mono); letter-spacing: 0.06em; color: #072d2b; background: #f6f4ef; padding: 2px 8px; }
.vc-a-fb-b3 > .vc-a-fb-ruler { margin-bottom: 64px; padding-left: calc((100% - min(1440px, 100% - 96px)) / 2 + min(1440px, 100% - 96px) * 0.3 + 110px); }
.vc-a-fb-b3__grid { display: grid; grid-template-columns: minmax(0, 62fr) minmax(0, 38fr); gap: 40px; align-items: start; }
.vc-a-fb-rib svg { width: 100%; height: auto; overflow: visible; }
.vc-a-fb-rib text { font: 600 17px var(--gft-font-mono); fill: #2c463d; }
.vc-a-fb-rib__mk text { fill: #6b4508; font-weight: 700; }
.vc-a-fb-lens { margin-top: 8px; }
.vc-a-fb-lens__clip { background: #072d2b; border-radius: 28px; overflow: hidden; padding: 16px 16px 18px; }
.vc-a-fb-lens__plot svg { width: 100%; height: auto; border-radius: 16px; touch-action: manipulation; }
.vc-a-fb-lens__read { padding: 12px 8px 0; color: #e2ebe6; }
.vc-a-fb-lens__fault { display: grid; margin: 0; max-width: none; }
.vc-a-fb-lens__fault span { grid-area: 1 / 1; font-size: 16px; font-weight: 650; color: #f6dcae; }
.vc-a-fb-lens__hover { font: 14px var(--gft-font-mono); margin: 6px 0 0; color: #e2ebe6; max-width: none; }
.vc-a-fb-ring { opacity: 0; transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.25s; }
.vc-a-fb-wl, .vc-a-fb-wf, .vc-a-fb-rib__mk, .vc-a-fb-lens__fault span, .vc-a-fb-dem__p { opacity: 0; visibility: hidden; transition: opacity 0.45s, visibility 0s 0.45s; }
.vc-a-fb-b3:has(input[name='vc-a-fb-c'][value='0']:checked) :is([data-l='0'], [data-c='0'], [data-d='bars']),
.vc-a-fb-b3:has(input[name='vc-a-fb-c'][value='1']:checked) :is([data-l='1'], [data-c='1'], [data-d='r26']),
.vc-a-fb-b3:has(input[name='vc-a-fb-c'][value='2']:checked) :is([data-l='2'], [data-c='2'], [data-d='r26']),
.vc-a-fb-b3:has(input[name='vc-a-fb-c'][value='3']:checked) :is([data-l='3'], [data-c='3'], [data-d='bars']) { opacity: 1; visibility: visible; transition-delay: 0s; }
.vc-a-fb-tabs { border: 0; margin: 0; padding: 0; display: grid; gap: 8px; }
.vc-a-fb-tab { position: relative; display: grid; gap: 2px; padding: 12px 16px 12px 18px; border: 1px solid #0e4d4a40; border-left: 5px solid #0e4d4a40; background: #fff; cursor: pointer; transition: background 0.3s, border-color 0.3s; }
.vc-a-fb-tab__code { font: 600 13px var(--gft-font-mono); letter-spacing: 0.06em; color: #3d554c; }
.vc-a-fb-tab b { font-size: 18px; line-height: 1.25; }
.vc-a-fb-tab__use { font-size: 15px; color: #33473f; }
.vc-a-fb-tab:has(input:checked) { background: #0e4d4a; border-color: #0e4d4a; border-left-color: #e3a640; color: #f6f4ef; }
.vc-a-fb-tab:has(input:checked) :is(.vc-a-fb-tab__code, .vc-a-fb-tab__use) { color: #e2ebe6; }
.vc-a-fb-tab:has(input:focus-visible) { outline: 3px solid #c98a2b; outline-offset: 3px; }
.vc-a-fb-b3__rule { font-size: 16px; margin: 12px 0 0; color: #33473f; }
.vc-a-fb-dem { display: grid; margin-top: 14px; padding-top: 14px; border-top: 1px solid #0e4d4a33; }
.vc-a-fb-dem__p { grid-area: 1 / 1; }
.vc-a-fb-dem .vc-a-fb-k { color: #3d554c; display: flex; align-items: center; gap: 10px; }
.vc-a-fb-bars { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 6px; }
.vc-a-fb-bars li { display: grid; grid-template-columns: 5ch minmax(0, 1fr) 9ch; gap: 12px; align-items: center; font-size: 15px; }
.vc-a-fb-bars i { height: 16px; background: #0e4d4a1a; }
.vc-a-fb-bars u { display: block; height: 100%; background: #0e4d4a; transform: scaleX(var(--w)); transform-origin: left; }
.vc-a-fb-bars b { font-family: var(--gft-font-mono); }
.vc-a-fb-dem__big { font-size: 40px; font-weight: 850; letter-spacing: -0.04em; line-height: 1.1; margin: 8px 0 0; }
.vc-a-fb-dem__big small { font-size: 17px; font-weight: 600; letter-spacing: 0; }
/* loupe entrance: warp columns draw first, then wefts slide in from alternate sides */
.vc-a-fb-wl__row, .vc-a-fb-wl__warp { transform-box: view-box; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b3__stage:not([data-fb-in]) :is(.vc-a-fb-wl__row, .vc-a-fb-rib) { opacity: 0; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b3__stage[data-fb-in=''] :is(.vc-a-fb-wl__row, .vc-a-fb-wl__warp, .vc-a-fb-rib) { animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b3__stage[data-fb-in=''] .vc-a-fb-wl__warp { animation-name: vc-a-fb-clipy; animation-duration: 380ms; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b3__stage[data-fb-in=''] .vc-a-fb-wl__row { animation-name: vc-a-fb-weftl; animation-duration: 330ms; animation-delay: calc(280ms + var(--j) * 30ms); }
:root[data-m-go][data-fb-arm] .vc-a-fb-b3__stage[data-fb-in=''] .vc-a-fb-wl__row:nth-of-type(odd) { animation-name: vc-a-fb-weftr; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b3__stage[data-fb-in=''] .vc-a-fb-rib { animation-name: vc-a-fb-clipx; animation-duration: 420ms; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b3__side:not([data-fb-in]) :is(.vc-a-fb-tab, .vc-a-fb-dem) { opacity: 0; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b3__side[data-fb-in=''] :is(.vc-a-fb-tab, .vc-a-fb-dem) { animation-name: vc-a-fb-from-r; animation-duration: 460ms; animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b3__side[data-fb-in=''] .vc-a-fb-tab:nth-child(3) { animation-delay: 70ms; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b3__side[data-fb-in=''] .vc-a-fb-tab:nth-child(4) { animation-delay: 140ms; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b3__side[data-fb-in=''] .vc-a-fb-tab:nth-child(5) { animation-delay: 210ms; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b3__side[data-fb-in=''] .vc-a-fb-dem { animation-delay: 300ms; }
@keyframes vc-a-fb-clipy { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes vc-a-fb-weftl { from { opacity: 0; transform: translateX(-96px); } }
@keyframes vc-a-fb-weftr { from { opacity: 0; transform: translateX(96px); } }
@keyframes vc-a-fb-from-r { from { opacity: 0; transform: translateX(32px); } }

/* ================= 4 · the loom film (sticky scene A) ================= */
.vc-a-fb-b4 { background: #e2ebe6; color: #072d2b; padding-bottom: 0; }
.vc-a-fb-b4 > .vc-a-fb-ruler { margin-bottom: 0; }
.vc-a-fb-b4__scene { position: relative; }
.vc-a-fb-b4__head { position: absolute; inset: 0 0 auto 0; z-index: 3; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 36px; align-items: start; padding: calc(5svh + 24px) calc(11vw + 32px) 0; color: #f6f4ef; pointer-events: none; }
.vc-a-fb-b4__head .gft-eyebrow { color: #e2ebe6; }
.vc-a-fb-b4__head h2 { font-size: clamp(24px, 2.1vw, 32px); max-width: none; }
.vc-a-fb-b4__head .vc-a-fb-lede { font-size: 17px; color: #e2ebe6; margin-top: 30px; }
.vc-a-fb-b4__pin { position: sticky; top: 0; height: 100svh; display: grid; place-items: center; }
.vc-a-fb-stage { width: 78vw; height: 90svh; background: #0e4d4a; color: #f6f4ef; display: grid; grid-template-rows: 232px minmax(0, 1fr) auto; padding: 0 32px 22px; box-shadow: 0 30px 80px #072d2b40; }
.vc-a-fb-rail { align-self: end; display: flex; gap: 6px; padding-bottom: 10px; border-bottom: 1px solid #6bb68f55; }
.vc-a-fb-rail__b, .vc-a-fb-rail__k { min-height: 44px; display: inline-flex; align-items: center; gap: 10px; padding: 4px 14px; border: 1px solid #6bb68f70; background: #072d2b; color: #e2ebe6; font-size: 15px; }
.vc-a-fb-rail__b i { font: normal 700 13px var(--gft-font-mono); letter-spacing: 0.06em; }
.vc-a-fb-rail__b[aria-current='step'] { background: #f6f4ef; color: #072d2b; border-color: #f6f4ef; }
.vc-a-fb-rail__k { margin-left: auto; font-size: 18px; min-width: 44px; justify-content: center; }
.vc-a-fb-rail__k + .vc-a-fb-rail__k { margin-left: 0; }
.vc-a-fb-stage__view { min-height: 0; display: grid; place-items: center; padding-block: 10px; }
.vc-a-fb-stage__view svg { width: 100%; height: 100%; max-height: 100%; }
.vc-a-fb-stage .vc-a-fb-lbl text, .vc-a-fb-lbl__t { font: 600 17px var(--gft-font-mono); letter-spacing: 0.04em; fill: #e2ebe6; }
.vc-a-fb-stage__foot { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px; align-items: end; border-top: 1px solid #6bb68f55; padding-top: 14px; }
.vc-a-fb-cap { display: grid; }
.vc-a-fb-cap__i { grid-area: 1 / 1; opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity 0.45s, transform 0.5s cubic-bezier(0.16, 1, 0.3, 1); }
.vc-a-fb-cap__code { font: 700 13px var(--gft-font-mono); letter-spacing: 0.06em; color: var(--fb-amber-t); margin: 0; }
.vc-a-fb-cap__h { font-size: 20px; font-weight: 800; letter-spacing: -0.02em; margin: 4px 0; color: #fff; }
.vc-a-fb-cap__p { font-size: 17px; line-height: 1.5; color: #e2ebe6; margin: 0; max-width: 70ch; }
.vc-a-fb-cap__f { font: 600 14px/1.5 var(--gft-font-mono); color: var(--fb-amber-t); margin: 6px 0 0; max-width: none; }
.vc-a-fb-cyc { text-align: right; }
.vc-a-fb-cyc .vc-a-fb-k { color: #e2ebe6; }
.vc-a-fb-cyc__v { font-size: 44px; font-weight: 850; line-height: 1; margin: 4px 0 0; }
.vc-a-fb-b4__track { position: relative; margin-top: -100svh; pointer-events: none; display: block; }
.vc-a-fb-b4__track > .vc-a-fb-step { position: relative; min-height: 0; height: 90svh; padding: 0; display: block; }
.vc-a-fb-b4__track > .vc-a-fb-step:last-child { height: 110svh; }
.vc-a-fb-b4__track > .vc-a-fb-step::before, .vc-a-fb-b4__track > .vc-a-fb-step::after, .vc-a-fb-b5__track > .vc-a-fb-era::before, .vc-a-fb-b5__track > .vc-a-fb-era::after { display: none; }
.vc-a-fb-step > * { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; margin: 0; }
.vc-a-fb-b4__exit { height: 0; }
/* one SVG, four states */
.vc-a-fb-stage svg :is(.vc-a-fb-sheet, .vc-a-fb-heald, .vc-a-fb-loom, .vc-a-fb-knit, .vc-a-fb-take, .vc-a-fb-gap, .vc-a-fb-lane, .vc-a-fb-box06, .vc-a-fb-pickw, .vc-a-fb-tens, .vc-a-fb-take__r, .vc-a-fb-brk, .vc-a-fb-brk__end, .vc-a-fb-nline, .vc-a-fb-box07) { transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.5s, clip-path 0.7s cubic-bezier(0.6, 0, 0.2, 1), stroke 0.4s; }
.vc-a-fb-sheet--up { transform-origin: 172px 252px; }
.vc-a-fb-sheet--lo { transform-origin: 172px 276px; }
.vc-a-fb-take { transform-box: fill-box; transform-origin: center; }
.vc-a-fb-loom { clip-path: inset(0 0 0 0); }
.vc-a-fb-knit { clip-path: inset(0 0 0 100%); }
/* Annotation sets switch whole, outside the geometry wipe. */
.vc-a-fb-lbl--knit { visibility: hidden; }
.vc-a-fb-b4__scene[data-step='3'] .vc-a-fb-lbl--loom { visibility: hidden; }
.vc-a-fb-b4__scene[data-step='3'] .vc-a-fb-lbl--knit { visibility: visible; }
.vc-a-fb-gap, .vc-a-fb-lane, .vc-a-fb-box06, .vc-a-fb-pickw, .vc-a-fb-take__r, .vc-a-fb-nline, .vc-a-fb-box07 { opacity: 0; }
.vc-a-fb-brk { stroke: #e3a640; stroke-dasharray: 8 5; }
.vc-a-fb-b4__scene:not([data-step='0']) .vc-a-fb-brk { stroke: #e9e4d8; stroke-dasharray: none; }
.vc-a-fb-b4__scene:not([data-step='0']) .vc-a-fb-tens { opacity: 0.25; }
.vc-a-fb-b4__scene[data-step='1'] .vc-a-fb-sheet--up { transform: rotate(-3.2deg); }
.vc-a-fb-b4__scene[data-step='1'] .vc-a-fb-sheet--lo { transform: rotate(3.2deg); }
.vc-a-fb-b4__scene[data-step='1'] .vc-a-fb-heald--up { transform: translateY(-16px); }
.vc-a-fb-b4__scene[data-step='1'] .vc-a-fb-heald--lo { transform: translateY(16px); }
.vc-a-fb-b4__scene[data-step='1'] :is(.vc-a-fb-gap, .vc-a-fb-pickw) { opacity: 1; }
.vc-a-fb-b4__scene[data-step='2'] :is(.vc-a-fb-lane, .vc-a-fb-box06) { opacity: 1; }
.vc-a-fb-b4__scene[data-step='3'] .vc-a-fb-loom { clip-path: inset(0 100% 0 0); }
.vc-a-fb-b4__scene[data-step='3'] .vc-a-fb-knit { clip-path: inset(0 0 0 0); }
.vc-a-fb-b4__scene[data-step='3'] :is(.vc-a-fb-nline, .vc-a-fb-box07) { opacity: 1; }
.vc-a-fb-b4__scene[data-step='3'] .vc-a-fb-take { transform: scaleY(0.55); }
.vc-a-fb-take__r[data-k='0'], .vc-a-fb-b4__scene:not([data-step='0']) .vc-a-fb-take__r[data-k='1'],
.vc-a-fb-b4__scene:is([data-step='2'], [data-step='3']) .vc-a-fb-take__r[data-k='2'], .vc-a-fb-b4__scene[data-step='3'] .vc-a-fb-take__r[data-k='3'] { opacity: 1; }
.vc-a-fb-b4__scene[data-step='0'] .vc-a-fb-cap__i[data-i='0'], .vc-a-fb-b4__scene[data-step='1'] .vc-a-fb-cap__i[data-i='1'],
.vc-a-fb-b4__scene[data-step='2'] .vc-a-fb-cap__i[data-i='2'], .vc-a-fb-b4__scene[data-step='3'] .vc-a-fb-cap__i[data-i='3'] { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
/* loom entrance: shed (the stage opens from its centre line), then the rail and caption */
:root[data-m-go][data-fb-arm] .vc-a-fb-stage:not([data-fb-in]) { clip-path: inset(50% 0 50% 0); }
:root[data-m-go][data-fb-arm] .vc-a-fb-stage[data-fb-in=''] { animation-name: vc-a-fb-shed; animation-duration: 620ms; animation-timing-function: cubic-bezier(0.6, 0, 0.2, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
:root[data-m-go][data-fb-arm] .vc-a-fb-stage[data-fb-in=''] :is(.vc-a-fb-rail, .vc-a-fb-stage__foot) { animation-name: vc-a-fb-deal; animation-duration: 420ms; animation-delay: 420ms; animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
@keyframes vc-a-fb-shed { from { clip-path: inset(50% 0 50% 0); } to { clip-path: inset(0 0 0 0); } }

/* ================= 5 · the dark interlude (sticky scene B) ================= */
.vc-a-fb-b5 { background: #0c1636; color: #e2ebe6; padding: 0; z-index: 2; }
.vc-a-fb-b5__scene { position: relative; timeline-scope: --vcfb-b5, --vcfb-e3; }
.vc-a-fb-b5__head { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.vc-a-fb-b5__headin { position: absolute; top: 26px; left: max(48px, calc((100vw - 1440px) / 2)); width: min(48vw, 680px); pointer-events: auto; }
.vc-a-fb-b5 .vc-a-fb-ruler { padding: 0; margin: 0 0 10px; height: 34px; border: 0; background: none; color: #c3d6cb; }
.vc-a-fb-b5 .vc-a-fb-ruler i { display: none; }
.vc-a-fb-b5 .gft-eyebrow { color: #c3d6cb; }
.vc-a-fb-b5 h2 { color: #f6f4ef; font-size: clamp(28px, 2.6vw, 40px); max-width: 22ch; }
.vc-a-fb-chips { display: flex; gap: 6px; margin-bottom: 16px; }
.vc-a-fb-chip { min-height: 44px; display: inline-flex; align-items: baseline; gap: 8px; padding: 6px 14px; border: 1px solid #9fb1ec80; background: #0c1636; color: #e2ebe6; font-size: 15px; }
.vc-a-fb-chip span { font: 600 13px var(--gft-font-mono); color: #c3d6cb; }
.vc-a-fb-chip[aria-current='step'] { background: #e2ebe6; color: #0c1636; }
.vc-a-fb-chip[aria-current='step'] span { color: #0c1636; }
.vc-a-fb-b5__pin { position: sticky; top: 0; height: 100svh; overflow: visible; background: radial-gradient(ellipse at 40% 62%, #18275a 0%, #0c1636 70%); view-timeline-name: --vcfb-b5; view-timeline-axis: block; }
.vc-a-fb-b5__vis { position: absolute; inset: 0; }
.vc-a-fb-nw { width: 100%; height: 100%; overflow: visible; }
.vc-a-fb-b5__cap { position: absolute; left: max(48px, calc((100vw - 1440px) / 2)); bottom: 18px; font: 13px var(--gft-font-mono); color: #c3d6cb; margin: 0; }
.vc-a-fb-b5__track { position: relative; margin-top: -100svh; pointer-events: none; display: block; }
.vc-a-fb-b5__track > .vc-a-fb-era { position: relative; min-height: 0; height: 95svh; padding: 0 max(48px, calc((100vw - 1440px) / 2)); display: grid; align-content: center; justify-items: end; }
.vc-a-fb-b5__track > .vc-a-fb-era--last { height: 110svh; view-timeline-name: --vcfb-e3; view-timeline-axis: block; }
.vc-a-fb-era__card { pointer-events: auto; width: min(380px, 27vw); padding: 22px 24px; background: #0c1636f2; border: 1px solid #9fb1ec66; box-shadow: 0 20px 60px #00000055; }
.vc-a-fb-era__k { font: 700 13px var(--gft-font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: #f6dcae; margin: 0; }
.vc-a-fb-era__card h3 { font-size: 21px; color: #f6f4ef; margin: 6px 0 10px; letter-spacing: -0.02em; }
.vc-a-fb-era__card p { font-size: 16px; line-height: 1.55; color: #e2ebe6; margin: 0; }
.vc-a-fb-era__card .gft-cite { color: #e2ebe6; }
.vc-a-fb-era__link { display: inline-flex; min-height: 44px; align-items: center; gap: 8px; margin-top: 10px; color: #f6dcae; font-weight: 650; font-size: 16px; }
.vc-a-fb-era__read { margin-top: 10px !important; font: 14px/1.5 var(--gft-font-mono) !important; color: #f6dcae !important; }
/* interlude drawing */
.vc-a-fb-nw :is(.vc-a-fb-nw__graph, .vc-a-fb-nw__threads, .vc-a-fb-nw__frame, .vc-a-fb-nw__w, .vc-a-fb-nw__gate rect, .vc-a-fb-nw__ghost, .vc-a-fb-nw__stamp, .vc-a-fb-nw__track, .vc-a-fb-nw__band, .vc-a-fb-nw__bl) { transition: opacity 0.6s, transform 0.8s cubic-bezier(0.6, 0, 0.2, 1), clip-path 0.8s cubic-bezier(0.6, 0, 0.2, 1), fill 0.5s, stroke 0.5s; }
.vc-a-fb-nw__edges line { stroke: #9fb1ec; stroke-opacity: 0.22; stroke-width: 1.2; }
.vc-a-fb-nw__n { fill: #9fb1ec; transform-box: fill-box; transform-origin: center; }
.vc-a-fb-nw__lbl { font: 700 15px var(--gft-font-mono); letter-spacing: 0.08em; fill: #c3d6cb; }
.vc-a-fb-nw__threads path { stroke: #6bb68f; stroke-width: 2; stroke-dasharray: 6 8; }
.vc-a-fb-nw__threads { clip-path: inset(0 0 0 0); }
.vc-a-fb-nw__gate rect { fill: #9fb1ec22; stroke: #9fb1ec66; }
.vc-a-fb-nw__ghost { fill: #0c1636; stroke: #9fb1ec; stroke-width: 2; stroke-dasharray: 10 8; }
.vc-a-fb-nw__warp line { stroke: #6bb68f; stroke-width: 7; stroke-opacity: 0.85; }
.vc-a-fb-nw__w rect { fill: #e9e4d8; }
.vc-a-fb-nw__w:nth-child(odd) rect { fill: #f6dcae; }
.vc-a-fb-nw__w { transform-box: view-box; }
.vc-a-fb-nw__grid line { stroke: #f6f4ef; stroke-width: 2; }
.vc-a-fb-nw__grid { opacity: 0; }
.vc-a-fb-nw__stamp { font: 800 22px var(--gft-font-mono); letter-spacing: 0.08em; fill: #f6dcae; }
.vc-a-fb-nw__spec { font: 700 16px var(--gft-font-mono); letter-spacing: 0.04em; fill: #f6dcae; opacity: 0; visibility: hidden; transition: none; }
.vc-a-fb-nw__frame { transform-box: view-box; }
.vc-a-fb-nw__bars { pointer-events: none; }
.vc-a-fb-nw__bar { outline: none; }
.vc-a-fb-nw__track { fill: #ffffff1c; transform-box: fill-box; transform-origin: left center; transform: scaleX(0); }
.vc-a-fb-nw__band { fill: #e3a640; opacity: 0; }
.vc-a-fb-nw__bl { font: 600 17px var(--gft-font-mono); fill: #e2ebe6; opacity: 0; }
.vc-a-fb-nw__bar:is(:hover, :focus-visible) .vc-a-fb-nw__band { fill: #f6dcae; }
/* era 1: threads stop short of a dashed ghost frame stamped NO LOOM SPECIFICATION */
.vc-a-fb-b5__scene[data-step='0'] .vc-a-fb-nw__threads { clip-path: inset(0 52% 0 0); }
.vc-a-fb-b5__scene[data-step='0'] .vc-a-fb-nw__w { opacity: 0; transform: translateX(-380px); }
.vc-a-fb-b5__scene[data-step='0'] .vc-a-fb-nw__w:nth-child(even) { transform: translateX(380px); }
.vc-a-fb-b5__scene[data-step='0'] .vc-a-fb-nw__warp { opacity: 0.35; }
.vc-a-fb-b5__scene:not([data-step='0']) .vc-a-fb-nw__stamp { opacity: 0; }
.vc-a-fb-b5__scene:not([data-step='0']) .vc-a-fb-nw__ghost { stroke-dasharray: none; stroke: #6bb68f; }
.vc-a-fb-nw__w { transition-delay: calc(var(--j) * 40ms); }
/* era 2: the simulation gate lights and the frame is woven */
.vc-a-fb-b5__scene[data-step='1'] .vc-a-fb-nw__gate rect { fill: #e3a64088; stroke: #e3a640; }
.vc-a-fb-b5__scene[data-step='1'] .vc-a-fb-nw__spec { opacity: 1; visibility: visible; transition: opacity 0.45s 0.1s; }
/* era 3: the frame steps left and six wefts run on as the R27 bars */
.vc-a-fb-b5__scene[data-step='2'] .vc-a-fb-nw__frame { transform: translateX(-590px); }
.vc-a-fb-b5__scene[data-step='2'] :is(.vc-a-fb-nw__graph, .vc-a-fb-nw__threads, .vc-a-fb-nw__gate) { opacity: 0.16; }
.vc-a-fb-b5__scene[data-step='2'] .vc-a-fb-nw__gatelbl { opacity: 0; visibility: hidden; transition: none; }
.vc-a-fb-b5__scene[data-step='2'] .vc-a-fb-nw__bars { pointer-events: auto; }
.vc-a-fb-b5__scene[data-step='2'] .vc-a-fb-nw__track { transform: none; transition-delay: calc(300ms + var(--k) * 70ms); }
.vc-a-fb-b5__scene[data-step='2'] :is(.vc-a-fb-nw__band, .vc-a-fb-nw__bl) { opacity: 1; transition-delay: calc(600ms + var(--k) * 70ms); }
/* interlude entrance: thread (the twelve threads draw from the last graph layer to the frame) */
:root[data-m-go][data-fb-arm] .vc-a-fb-b5__vis:not([data-fb-in]) .vc-a-fb-nw__tin { clip-path: inset(0 100% 0 0); }
:root[data-m-go][data-fb-arm] .vc-a-fb-b5__vis[data-fb-in=''] .vc-a-fb-nw__tin { animation-name: vc-a-fb-clipx; animation-duration: 600ms; animation-delay: 220ms; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b5__vis[data-fb-in=''] .vc-a-fb-nw__n { animation-name: vc-a-fb-sp-born; animation-duration: 300ms; animation-delay: calc(var(--i) * 25ms); animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
.vc-a-fb-nw__tin { transform-box: view-box; }

/* ================= 6 · the roll map (forest) ================= */
.vc-a-fb-b6 { background: #0e4d4a; color: #f6f4ef; overflow: hidden; }
.vc-a-fb-b6 > .vc-a-fb-ruler { color: #e2ebe6; }
.vc-a-fb-b6 .vc-a-fb-lede, .vc-a-fb-b6 .gft-eyebrow { color: #e2ebe6; }
.vc-a-fb-xy { position: absolute; inset: 0; z-index: -1; opacity: 0.35; pointer-events: none; }
.vc-a-fb-xy svg { width: 100%; height: 100%; }
.vc-a-fb-xy__grid line { stroke: #6bb68f; stroke-opacity: 0.35; }
.vc-a-fb-xy__f circle { fill: #6bb68f; }
.vc-a-fb-xy__f rect { fill: none; stroke: #6bb68f; stroke-opacity: 0.4; }
.vc-a-fb-xy__cross line { stroke: #e3a640; stroke-opacity: 0.6; stroke-width: 2; }
.vc-a-fb-cmp { margin: 0; }
.vc-a-fb-cmp .mw-compare__stage { border: 1px solid #6bb68f80; background: #072d2b; outline-offset: 4px; }
.vc-a-fb-cmp .mw-compare__stage:focus-visible { outline: 3px solid #e3a640; }
.vc-a-fb-cmp svg { width: 100%; height: auto; display: block; }
.vc-a-fb-cell rect { fill: #ffffff08; stroke: #6bb68f60; stroke-width: 1.5; }
.vc-a-fb-cell path { stroke: #ff9a86; stroke-width: 3; }
.vc-a-fb-cell text { font: 700 15px var(--gft-font-mono); fill: #f6dcae; }
/* Keep SKIP clear of the seeded fault dots, including the larger phone labels.
   Separate translate preserves each label's existing twill entrance transform. */
.vc-a-fb-cell[data-s='skip']:is(:nth-child(5), :nth-child(15), :nth-child(24), :nth-child(31), :nth-child(34)) text { translate: 0 -28px; }
.vc-a-fb-cell[data-s='skip']:is(:nth-child(3), :nth-child(9), :nth-child(18), :nth-child(19), :nth-child(26)) text { translate: 0 24px; }
.vc-a-fb-cell[data-s='bad'] rect { fill: #ff9a8630; stroke: #ff9a86; }
.vc-a-fb-cell[data-s='skip'] rect { fill: #e3a6401e; stroke: #e3a640; stroke-dasharray: 7 5; }
.vc-a-fb-cell > * { transform-box: fill-box; transform-origin: center; }
.vc-a-fb-cdot { fill: #f6f4ef; }
.vc-a-fb-cdot[data-unseen='1'] { fill: #ff9a86; }
.vc-a-fb-cmp__cur { fill: none; stroke: #f6f4ef; stroke-width: 3; opacity: 0; transition: transform 0.2s, opacity 0.2s; }
.vc-a-fb-cmp__axis { font: 600 15px var(--gft-font-mono); fill: #e2ebe6; }
.vc-a-fb-cmp__badge { position: absolute; top: 10px; padding: 4px 10px; font: 700 13px var(--gft-font-mono); letter-spacing: 0.06em; background: #072d2bf0; color: #f6f4ef; border: 1px solid #6bb68f80; }
.vc-a-fb-cmp__badge--l { left: 10px; }
.vc-a-fb-cmp__badge--r { right: 10px; }
.mw-compare__a, .mw-compare__b { position: relative; }
.vc-a-fb-cmp__scan { position: absolute; inset: 0 auto 0 0; width: 100%; pointer-events: none; }
.vc-a-fb-cmp__scan::before { content: ''; position: absolute; inset-block: 0; left: 0; width: 3px; background: linear-gradient(#e3a64000, #e3a640cc, #e3a64000); }
.vc-a-fb-cmp__key { font-size: 15px; color: #e2ebe6; margin: 8px 0 0; max-width: none; min-height: 3em; }
.vc-a-fb-b6__low { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr) minmax(0, 1fr); gap: 20px; margin-top: 18px; align-items: start; }
.vc-a-fb-np { padding: 16px 18px; border: 1px solid #6bb68f60; background: #072d2b; transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s, box-shadow 0.3s; }
.vc-a-fb-np--b { text-align: right; }
.vc-a-fb-np__k { font: 700 13px var(--gft-font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: #e2ebe6; margin: 0; display: flex; gap: 8px; align-items: center; }
.vc-a-fb-np--b .vc-a-fb-np__k { justify-content: flex-end; }
.vc-a-fb-np__big { margin: 6px 0; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; max-width: none; }
.vc-a-fb-np--b .vc-a-fb-np__big { justify-content: flex-end; }
.vc-a-fb-np__big > b { font-size: 64px; font-weight: 850; line-height: 1; letter-spacing: -0.04em; }
.vc-a-fb-np__big span { font-size: 17px; font-weight: 650; }
.vc-a-fb-np__big span b { font-size: 22px; }
.vc-a-fb-np__claim { font-size: 16px; color: #e2ebe6; margin: 0; max-width: none; }
.vc-a-fb-why summary { min-height: 44px; display: inline-flex; align-items: center; cursor: pointer; font-weight: 700; color: #f6dcae; }
.vc-a-fb-why p { font-size: 15px; color: #e2ebe6; text-align: left; }
.vc-a-fb-cmpwrap[data-side='a'] .vc-a-fb-np--a, .vc-a-fb-cmpwrap[data-side='b'] .vc-a-fb-np--b { transform: translateY(-10px); border-color: #e3a640; box-shadow: 0 16px 40px #00000040; }
.vc-a-fb-seg { text-align: center; }
.vc-a-fb-seg__b { display: inline-flex; border: 1px solid #6bb68f80; }
.vc-a-fb-seg__b button { min-height: 56px; min-width: 92px; display: grid; padding: 6px 12px; background: #072d2b; color: #e2ebe6; border: 0; border-right: 1px solid #6bb68f55; }
.vc-a-fb-seg__b button:last-child { border-right: 0; }
.vc-a-fb-seg__b i { font: normal 600 13px var(--gft-font-mono); }
.vc-a-fb-seg__b b { font-size: 16px; }
.vc-a-fb-seg__b button[aria-pressed='true'] { background: #f6f4ef; color: #072d2b; }
.vc-a-fb-seg__read { font-size: 15px; color: #e2ebe6; margin: 10px auto 0; max-width: 34ch; }
.vc-a-fb-b6__link { margin: 18px 0 0; display: flex; flex-wrap: wrap; gap: 8px 24px; align-items: center; max-width: none; font-size: 15px; color: #e2ebe6; }
.vc-a-fb-b6__link a { min-height: 44px; display: inline-flex; align-items: center; font-weight: 700; font-size: 17px; color: #f6f4ef; }
/* roll-map entrance: twill-shift, the cells deal in along the twill diagonal */
:root[data-m-go][data-fb-arm] .vc-a-fb-cmp .mw-compare__stage:not([data-fb-in]) .vc-a-fb-cell > * { opacity: 0; }
:root[data-m-go][data-fb-arm] .vc-a-fb-cmp .mw-compare__stage[data-fb-in=''] .vc-a-fb-cell > * { animation-name: vc-a-fb-twill; animation-duration: 300ms; animation-delay: calc(var(--d) * 40ms); animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
@keyframes vc-a-fb-twill { from { opacity: 0; transform: translate(-16px, 12px) scale(0.6); } }

/* ================= 7 · the doffing gate (closing) ================= */
.vc-a-fb-b7 { background: #072d2b; color: #f6f4ef; min-height: 100svh; padding-bottom: 40px; overflow: clip; }
.vc-a-fb-b7 > .vc-a-fb-ruler { margin-bottom: 22px; }
.vc-a-fb-b7__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: end; margin-bottom: 20px; }
.vc-a-fb-quote { margin: 0; font-size: clamp(20px, 1.8vw, 26px); line-height: 1.4; color: #f6f4ef; }
.vc-a-fb-quote span { opacity: clamp(0.55, calc((var(--fb-p, 1) * 3 - var(--k)) * 8 + 1), 1); transition: opacity 0.3s; }
.vc-a-fb-b7__gate { display: grid; grid-template-columns: minmax(0, 68fr) minmax(0, 32fr); gap: 28px; align-items: center; }
.vc-a-fb-b7 .vc-a-fb-roll-svg text { font-size: 20px; }
.vc-a-fb-b7 .vc-a-fb-roll-svg .vc-a-fb-roll-svg__title { font-size: 19px; }
.vc-a-fb-b7__plot:focus-visible { outline: 3px solid var(--fb-amber); outline-offset: 4px; }
.vc-a-fb-doff { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; align-items: start; position: relative; }
.vc-a-fb-doff__beam { width: 150px; height: 150px; }
.vc-a-fb-doff__rot { transform-box: view-box; transform-origin: 110px 110px; transform: rotate(calc(var(--fb-p, 1) * 720deg)); }
.vc-a-fb-doff__ring { opacity: clamp(0.15, calc(var(--fb-p, 1) * 5 - var(--k)), 1); }
.vc-a-fb-ticket { position: relative; margin-top: 40px; padding: 12px 14px; border: 2px dashed #e3a640; background: #0e4d4a; }
.vc-a-fb-ticket::before { content: ''; position: absolute; left: -16px; top: -36px; width: 40px; height: 2px; background: #e3a640; transform: rotate(50deg); transform-origin: left; }
.vc-a-fb-ticket__id { font: 700 13px var(--gft-font-mono); letter-spacing: 0.06em; color: #f6dcae; margin: 0; }
.vc-a-fb-ticket dl { margin: 6px 0 0; display: grid; gap: 6px; }
.vc-a-fb-ticket dt { font: 600 13px var(--gft-font-mono); color: #e2ebe6; }
.vc-a-fb-ticket dd { margin: 0; font-size: 22px; font-weight: 800; line-height: 1.15; }
.vc-a-fb-ticket__mode { font-size: 14px; color: #e2ebe6; margin: 6px 0 0; }
.vc-a-fb-b7__ctl .vc-a-fb-play { grid-area: auto; }
.vc-a-fb-b7__ctl { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 24px; align-items: center; margin-top: 14px; }
.vc-a-fb-b7__range { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: center; }
.vc-a-fb-b7__range label { font: 600 13px var(--gft-font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: #e2ebe6; }
.vc-a-fb-b7__range input { accent-color: var(--fb-amber); }
.vc-a-fb-b7__range output { font: 700 24px var(--gft-font-mono); min-width: 5ch; text-align: right; }
.vc-a-fb-modes--mini span { min-width: 104px; min-height: 48px; place-items: center; }
.vc-a-fb-thread { position: relative; margin-top: 22px; }
.vc-a-fb-thread__rail { position: relative; height: 54px; }
.vc-a-fb-thread__line { position: absolute; left: 0; right: 0; top: 26px; height: 2px; background: #ffffff40; }
.vc-a-fb-thread__lit { position: absolute; left: 15%; width: 70%; top: 25px; height: 4px; background: #e3a640; transform: scaleX(var(--fb-p, 1)); transform-origin: left; }
.vc-a-fb-thread__node { position: absolute; top: 0; transform: translateX(-50%); display: grid; justify-items: center; }
.vc-a-fb-thread__node b { display: grid; place-items: center; width: 34px; height: 34px; margin-top: 10px; border-radius: 50%; background: #072d2b; border: 2px solid #ffffff70; font: 700 13px var(--gft-font-mono); color: #e2ebe6; }
.vc-a-fb-thread__node.is-here b { border-color: #e3a640; color: #f6dcae; }
.vc-a-fb-thread__node.is-next b { width: 46px; height: 46px; margin-top: 4px; border: 3px solid #6bb68f; background: #0e4d4a; color: #fff; font-size: 15px; }
.vc-a-fb-thread__seg { position: absolute; left: 15%; width: 70%; top: 15px; height: 24px; container-type: inline-size; pointer-events: none; }
.vc-a-fb-thread__bead { position: absolute; left: -12px; top: 0; width: 24px; height: 24px; border-radius: 4px; background: #e3a640; box-shadow: 0 0 0 4px #072d2b; translate: calc(var(--fb-p, 1) * 100cqw) 0; }
.vc-a-fb-thread__drop { position: absolute; left: 85%; top: 50px; width: 3px; height: 600px; margin-left: -1px; background: linear-gradient(#6bb68f, #e3a640); }
.vc-a-fb-thread__st { list-style: none; position: relative; margin: 6px 0 0; padding: 0; height: 104px; }
.vc-a-fb-thread__st li { position: absolute; left: var(--x); top: 0; width: 250px; transform: translateX(-50%); }
.vc-a-fb-thread__st li:last-child { transform: translateX(calc(-100% - 14px)); }
.vc-a-fb-thread__st li::before { content: ''; position: absolute; top: -34px; left: 50%; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: #e3a640; opacity: clamp(0.25, calc((var(--fb-p, 1) * 3 - var(--k)) * 8 + 1), 1); }
.vc-a-fb-thread__st li:last-child::before { display: none; }
.vc-a-fb-thread__st a { display: grid; gap: 2px; padding: 8px 12px; min-height: 44px; border: 1px solid #6bb68f60; background: #0e4d4a; text-decoration: none; color: #f6f4ef; }
.vc-a-fb-thread__st li:last-child a { border-color: #6bb68f; text-align: right; }
.vc-a-fb-thread__st a:hover b, .vc-a-fb-thread__st a:focus-visible b { text-decoration: underline; }
.vc-a-fb-thread__st i { font: normal 700 13px var(--gft-font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: #f6dcae; }
.vc-a-fb-thread__st b { font-size: 16px; line-height: 1.25; }
.vc-a-fb-thread__st span { font-size: 13px; color: #e2ebe6; line-height: 1.35; max-height: 0; overflow: hidden; opacity: 0; transition: opacity 0.3s; }
.vc-a-fb-thread__st a:is(:hover, :focus-visible) span { max-height: none; opacity: 1; }
.vc-a-fb-src { margin-top: 14px; font-size: 14px; color: #c3d6cb; max-width: 80%; }
.vc-a-fb-src p { max-width: none; margin: 0; }
.vc-a-fb-src .gft-cite { color: #e2ebe6; min-height: 32px; padding: 2px 6px; }
.vc-a-fb-src summary { min-height: 44px; display: inline-flex; align-items: center; cursor: pointer; color: #e2ebe6; font-weight: 650; }
@media (min-width: 901px) {
  /* Independent tracks reserve room for complete titles and expanded descriptions. */
  .vc-a-fb-thread__st { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-inline: 28% 16%; height: auto; min-height: 152px; align-items: start; }
  .vc-a-fb-thread__st li, .vc-a-fb-thread__st li:last-child { position: relative; left: auto; width: auto; transform: none; }
}
/* closing entrance: wind (the beam turns a quarter, the layers wind on, the ticket swings into place) */
:root[data-m-go][data-fb-arm] .vc-a-fb-doff:not([data-fb-in]) :is(.vc-a-fb-doff__beam, .vc-a-fb-ticket) { opacity: 0; }
:root[data-m-go][data-fb-arm] .vc-a-fb-doff[data-fb-in=''] :is(.vc-a-fb-doff__beam, .vc-a-fb-ticket) { animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
:root[data-m-go][data-fb-arm] .vc-a-fb-doff[data-fb-in=''] .vc-a-fb-doff__beam { animation-name: vc-a-fb-wind; animation-duration: 560ms; }
:root[data-m-go][data-fb-arm] .vc-a-fb-doff[data-fb-in=''] .vc-a-fb-ticket { animation-name: vc-a-fb-tswing; animation-duration: 440ms; animation-delay: 360ms; transform-origin: 20px 0; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b7__plot:not([data-fb-in]) .vc-a-fb-roll-svg { opacity: 0; }
:root[data-m-go][data-fb-arm] .vc-a-fb-b7__plot[data-fb-in=''] .vc-a-fb-roll-svg { animation-name: vc-a-fb-from-r; animation-duration: 520ms; animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: backwards; }
@keyframes vc-a-fb-wind { from { opacity: 0; transform: rotate(-90deg) scale(0.8); } }
@keyframes vc-a-fb-tswing { from { opacity: 0; transform: rotate(-14deg) translateY(-14px); } }

/* ================= lives (on screen only: the kit sets data-m-on) ================= */
:root[data-m-go] [data-m-on]:is([data-m-live~='vcfbbar'], [data-m-live~='vcfbcloth'], [data-m-live~='vcfbshuttle'], [data-m-live~='vcfbled'], [data-m-live~='vcfbturn'], [data-m-live~='vcfbtens'], [data-m-live~='vcfbneedle'], [data-m-live~='vcfbnode'], [data-m-live~='vcfbxy'], [data-m-live~='vcfbscan'], [data-m-live~='vcfbbead'], [data-m-live~='vcfbsweepw']) {
  animation-iteration-count: infinite; animation-direction: alternate; animation-timing-function: ease-in-out; }
[data-m-live~='vcfbturn'], [data-m-live~='vcfbreed'], [data-m-live~='vcfbneedle'], [data-m-live~='vcfbnode'], [data-m-live~='vcfbled'] { transform-box: fill-box; transform-origin: center; }
[data-m-live~='vcfbbar'], [data-m-live~='vcfbscan'], [data-m-live~='vcfbbead'] { overflow-anchor: none; }
:root[data-m-go] [data-m-live~='vcfbbar'][data-m-on] { animation-name: vc-a-fb-bar; animation-duration: 16s; }
:root[data-m-go] [data-m-live~='vcfbcloth'][data-m-on] { animation-name: vc-a-fb-pick; animation-duration: 1.1s; animation-timing-function: linear; animation-direction: normal; }
:root[data-m-go] [data-m-live~='vcfbshuttle'][data-m-on] { animation-name: vc-a-fb-shuttle; animation-duration: 1.7s; }
:root[data-m-go] [data-m-live~='vcfbled'][data-m-on] { animation-name: vc-a-fb-led; animation-duration: 1.3s; }
:root[data-m-go] [data-m-live~='vcfbturn'][data-m-on] { animation-name: vc-a-fb-turn; animation-duration: 6s; animation-timing-function: linear; animation-direction: normal; }
:root[data-m-go] [data-m-live~='vcfbtens'][data-m-on] { animation-name: vc-a-fb-led; animation-duration: 0.9s; }
:root[data-m-go] [data-m-live~='vcfbneedle'][data-m-on] { animation-name: vc-a-fb-needle; animation-duration: 0.7s; animation-delay: calc(var(--i) * 70ms); }
:root[data-m-go] [data-m-live~='vcfbnode'][data-m-on] { animation-name: vc-a-fb-node; animation-duration: 2.2s; animation-delay: calc(var(--i) * -0.25s); }
:root[data-m-go] [data-m-live~='vcfbxy'][data-m-on] { animation-name: vc-a-fb-xy; animation-duration: 12s; }
:root[data-m-go] [data-m-live~='vcfbscan'][data-m-on] { animation-name: vc-a-fb-scan; animation-duration: 7s; }
:root[data-m-go] [data-m-live~='vcfbbead'][data-m-on] { animation-name: vc-a-fb-bead; animation-duration: 1.4s; }
:root[data-m-go] [data-m-live~='vcfbsweepw'][data-m-on] { animation-name: vc-a-fb-sweepw; animation-duration: 6s; animation-direction: normal; }
:root[data-m-go] .vc-a-fb-b4__scene[data-step='1'] [data-m-live~='vcfbpick'][data-m-on] { animation-name: vc-a-fb-pickfly; animation-duration: 0.8s; animation-iteration-count: infinite; animation-direction: alternate; animation-timing-function: ease-in-out; }
:root[data-m-go] .vc-a-fb-b4__scene[data-step='2'] [data-m-live~='vcfbreed'][data-m-on] { animation-name: vc-a-fb-reed; animation-duration: 0.7s; animation-iteration-count: infinite; animation-direction: alternate; animation-timing-function: ease-in-out; transform-origin: 50% 100%; }
:root[data-m-go] [data-m-live~='vcfbglow'][data-m-on] .vc-a-fb-sd__glow { animation-name: vc-a-fb-glow; animation-duration: 11s; animation-delay: calc(1.2s + var(--k, 0) * 0.9s); animation-iteration-count: infinite; animation-direction: normal; animation-timing-function: linear; }
:root[data-m-go] [data-m-live~='vcfbflow'][data-m-on] path { animation-name: vc-a-fb-flow; animation-duration: 1.6s; animation-iteration-count: infinite; animation-direction: normal; animation-timing-function: linear; }
@keyframes vc-a-fb-bar { from { transform: translateX(0); } to { transform: translateX(calc(100vw - 160px)); } }
@keyframes vc-a-fb-pick { from { transform: translateX(0); } to { transform: translateX(14px); } }
@keyframes vc-a-fb-shuttle { from { transform: translateY(0); } to { transform: translateY(468px); } }
@keyframes vc-a-fb-led { from { opacity: 0.4; } to { opacity: 1; } }
@keyframes vc-a-fb-turn { to { transform: rotate(360deg); } }
@keyframes vc-a-fb-needle { from { transform: translateY(0); } to { transform: translateY(-20px); } }
@keyframes vc-a-fb-node { from { opacity: 0.55; transform: scale(0.85); } to { opacity: 1; transform: scale(1.15); } }
@keyframes vc-a-fb-xy { from { transform: translateX(40px); } to { transform: translateX(1160px); } }
@keyframes vc-a-fb-scan { from { transform: translateX(0); } to { transform: translateX(100%); } }
@keyframes vc-a-fb-bead { from { scale: 0.86; } to { scale: 1.14; } }
@keyframes vc-a-fb-sweepw { from { transform: translateX(0); } 60%, to { transform: translateX(820px); } }
@keyframes vc-a-fb-pickfly { from { transform: translateX(-70px); } to { transform: translateX(60px); } }
@keyframes vc-a-fb-reed { from { transform: rotate(-5deg); } to { transform: rotate(2deg); } }
@keyframes vc-a-fb-glow { 0%, 6%, 100% { opacity: 0; } 2% { opacity: 1; } }
@keyframes vc-a-fb-flow { to { stroke-dashoffset: -28; } }

/* ================= hand-overs carried by the roll (scroll-linked, transform and opacity, clip-path on two) ================= */
@supports (animation-timeline: view()) {
  @media (min-width: 901px) {
    :root[data-m-go] .vc-a-fb-sp-exit { transform-box: view-box; transform-origin: 1000px 400px; animation-name: vc-a-fb-sp-exit; animation-duration: 1ms; animation-timing-function: linear; animation-fill-mode: both; animation-timeline: --gft-splash; animation-range-start: exit 0%; animation-range-end: exit 60%; }
    :root[data-m-go] .vc-a-fb-lens__clip { animation-name: vc-a-fb-iris; animation-duration: 1ms; animation-timing-function: linear; animation-fill-mode: both; animation-timeline: view(); animation-range-start: entry 0%; animation-range-end: entry 70%; }
    :root[data-m-go] .vc-a-fb-lens { transform-origin: 70% 100%; animation-name: vc-a-fb-shrink; animation-duration: 1ms; animation-timing-function: linear; animation-fill-mode: both; animation-timeline: view(); animation-range-start: exit 0%; animation-range-end: exit 100%; }
    :root[data-m-go] .vc-a-fb-nw__lay { transform-box: view-box; transform-origin: 80px 400px; animation-name: vc-a-fb-laydown; animation-duration: 1ms; animation-timing-function: linear; animation-fill-mode: both; animation-timeline: --vcfb-e3; animation-range-start: exit 0%; animation-range-end: exit 100%; }
    :root[data-m-go] .vc-a-fb-nw__grid { animation-name: vc-a-fb-show; animation-duration: 1ms; animation-timing-function: linear; animation-fill-mode: both; animation-timeline: --vcfb-e3; animation-range-start: exit 0%; animation-range-end: exit 40%; }
    :root[data-m-go] :is(.vc-a-fb-nw__bars, .vc-a-fb-nw__graph, .vc-a-fb-nw__threads, .vc-a-fb-nw__gate) { animation-name: vc-a-fb-out; animation-duration: 1ms; animation-timing-function: linear; animation-fill-mode: both; animation-timeline: --vcfb-e3; animation-range-start: exit 0%; animation-range-end: exit 30%; }
    :root[data-m-go] .vc-a-fb-cmp .mw-compare__stage { view-timeline-name: --vcfb-cmp; view-timeline-axis: block; }
    :root[data-m-go] .vc-a-fb-cmp__cells { animation-name: vc-a-fb-dissolve; animation-duration: 1ms; animation-timing-function: linear; animation-fill-mode: both; animation-timeline: --vcfb-cmp; animation-range-start: exit 10%; animation-range-end: exit 70%; }
  }
}
@keyframes vc-a-fb-sp-exit { to { transform: translate(-150px, 170px) scale(0.86); } }
@keyframes vc-a-fb-iris { from { clip-path: circle(0% at 66% 48%); } to { clip-path: circle(110% at 66% 48%); } }
@keyframes vc-a-fb-shrink { to { transform: translate(6%, 14%) scale(0.72); } }
@keyframes vc-a-fb-laydown { 0% { transform: none; } 70%, 100% { transform: translate(-32px, 316px) scale(3.95, 0.28); } }
@keyframes vc-a-fb-out { to { opacity: 0; } }
@keyframes vc-a-fb-show { to { opacity: 1; } }
@keyframes vc-a-fb-dissolve { to { opacity: 0.12; } }
@media (prefers-reduced-motion: reduce) {
  .vc-a-fb-sec *, .vc-a-fb-sec, .gft-splash[data-splash='vc-a-fabric'] * { animation-timeline: auto !important; animation-name: none !important; }
}

/* ================= narrower desktops and tablets ================= */
@media (max-width: 1180px) {
  .vc-a-fb-stage { width: 88vw; }
  .vc-a-fb-b4__head { padding-inline: calc(6vw + 32px); }
  .vc-a-fb-b2__ctl { grid-template-columns: 1fr; }
}

/* ================= phone and narrow tablet (scenes unpinned to bands) ================= */
@media (max-width: 900px) {
  .vc-a-fb-head, .vc-a-fb-b7__head { grid-template-columns: 1fr; gap: 14px; }
  .vc-a-fb-sec { font-size: 17px; }
  .vc-a-fb-ruler { padding-inline: 20px; margin-bottom: 24px; }
  /* block 2 */
  .vc-a-fb-modes { display: grid; grid-template-columns: 1fr 1fr; }
  .vc-a-fb-modes span { min-width: 0; }
  .vc-a-fb-scrub { grid-template-columns: auto minmax(0, 1fr) auto; }
  .vc-a-fb-b2__plot, .vc-a-fb-b7__plot { overflow-x: auto; overscroll-behavior-x: contain; }
  .vc-a-fb-b2__plot .vc-a-fb-roll-svg, .vc-a-fb-b7__plot .vc-a-fb-roll-svg { width: 760px; max-width: none; }
  .vc-a-fb-roll-svg text, .vc-a-fb-roll-svg .vc-a-fb-roll-svg__title, .vc-a-fb-taxis text { font-size: 22px; }
  .vc-a-fb-roll-svg .vc-a-fb-roll-svg__title { font-size: 20px; }
  .vc-a-fb-b2__low { grid-template-columns: 1fr; }
  .vc-a-fb-read { grid-template-columns: 1fr; }
  .vc-a-fb-read__big { font-size: 48px; }
  .vc-a-fb-read__dl { grid-template-columns: 1fr 1fr; }
  .vc-a-fb-read__dl dd { font-size: 22px; }
  .vc-a-fb-rd__fig { font-size: 22px; }
  .vc-a-fb-rd__b { min-height: 92px; }
  /* block 3 */
  .vc-a-fb-loupe { width: 120px; top: -70px; }
  .vc-a-fb-loupe svg { width: 120px; height: 120px; }
  .vc-a-fb-b3 > .vc-a-fb-ruler { margin-bottom: 64px; padding-left: 20px; padding-top: 40px; height: auto; }
  .vc-a-fb-b3 > .vc-a-fb-ruler span { visibility: hidden; }
  .vc-a-fb-b3__grid { grid-template-columns: 1fr; }
  .vc-a-fb-lens__clip { border-radius: 20px; padding: 10px; }
  .vc-a-fb-rib text { font-size: 30px; }
  .vc-a-fb-tabs { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 8px; padding-bottom: 6px; }
  .vc-a-fb-tab { flex: 0 0 72%; scroll-snap-align: start; }
  .vc-a-fb-dem__big { font-size: 32px; }
  /* block 4: an opaque pinned band, the captions scroll beneath as cards */
  .vc-a-fb-b4__head { position: static; display: block; padding: 0 20px 18px; color: #072d2b; pointer-events: auto; }
  .vc-a-fb-b4__head .gft-eyebrow, .vc-a-fb-b4__head .vc-a-fb-lede { color: #33473f; }
  .vc-a-fb-b4__head .vc-a-fb-lede { margin-top: 10px; }
  .vc-a-fb-b4__pin { display: contents; }
  .vc-a-fb-stage { position: sticky; top: 0; z-index: 2; width: 100%; height: 40svh; grid-template-rows: auto minmax(0, 1fr) auto; padding: 8px 12px; box-shadow: none; }
  .vc-a-fb-rail { padding-bottom: 6px; gap: 4px; flex-wrap: nowrap; }
  .vc-a-fb-rail__b { padding: 2px 8px; font-size: 13px; min-width: 44px; }
  .vc-a-fb-rail__b span, .vc-a-fb-rail__k { display: none; }
  .vc-a-fb-stage .vc-a-fb-lbl, .vc-a-fb-lbl__t { display: none; }
  .vc-a-fb-stage__foot { padding-top: 4px; border: 0; }
  .vc-a-fb-cap { display: none; }
  .vc-a-fb-cyc { display: flex; gap: 10px; align-items: baseline; justify-content: flex-end; }
  .vc-a-fb-cyc__v { font-size: 22px; }
  .vc-a-fb-b4__track { margin-top: 0; pointer-events: auto; padding: 0 20px; }
  .vc-a-fb-b4__track > .vc-a-fb-step, .vc-a-fb-b4__track > .vc-a-fb-step:last-child { height: auto; min-height: 46svh; padding: 22px 0; }
  .vc-a-fb-step > * { position: static; width: auto; height: auto; overflow: visible; clip-path: none; white-space: normal; }
  .vc-a-fb-step { background: none; }
  .vc-a-fb-step h3 { font-size: 22px; margin: 6px 0 8px; }
  .vc-a-fb-step p { font-size: 17px; line-height: 1.55; }
  .vc-a-fb-step__code { font: 700 13px var(--gft-font-mono) !important; letter-spacing: 0.06em; color: #33473f; }
  .vc-a-fb-step__f { font: 600 15px/1.5 var(--gft-font-mono) !important; color: #6b4508; margin-top: 8px; }
  .vc-a-fb-b4__exit { height: 10svh; }
  /* block 5: a 42 svh pinned band, era cards beneath */
  .vc-a-fb-b5__head { position: static; pointer-events: auto; }
  .vc-a-fb-b5__headin { position: static; width: auto; padding: 0 20px 16px; }
  .vc-a-fb-b5__pin { display: contents; }
  .vc-a-fb-b5__vis { position: sticky; top: 0; z-index: 2; height: 42svh; background: radial-gradient(ellipse at 40% 62%, #18275a 0%, #0c1636 70%); }
  .vc-a-fb-b5__cap { position: static; padding: 6px 20px 0; }
  .vc-a-fb-nw__lbl, .vc-a-fb-nw__stamp, .vc-a-fb-nw__spec, .vc-a-fb-nw__bl { display: none; }
  .vc-a-fb-b5__cap { left: 20px; bottom: 8px; }
  .vc-a-fb-b5__track { margin-top: 0; pointer-events: auto; }
  .vc-a-fb-b5__track > .vc-a-fb-era, .vc-a-fb-b5__track > .vc-a-fb-era--last { height: auto; min-height: 52svh; padding: 24px 20px; justify-items: stretch; align-content: start; }
  .vc-a-fb-era__card { width: auto; }
  /* block 6 */
  .vc-a-fb-cmp { overflow-x: auto; overscroll-behavior-x: contain; }
  .vc-a-fb-cmp .mw-compare__stage { width: 760px; }
  .vc-a-fb-cmp .mw-compare__range, .vc-a-fb-cmp__key { position: sticky; left: 0; width: calc(100vw - 40px); }
  .vc-a-fb-b6__low { grid-template-columns: 1fr; }
  .vc-a-fb-np--b, .vc-a-fb-np--b .vc-a-fb-np__big { text-align: left; justify-content: flex-start; }
  .vc-a-fb-np--b .vc-a-fb-np__k { justify-content: flex-start; }
  .vc-a-fb-np__big > b { font-size: 48px; }
  .vc-a-fb-seg__b { display: flex; width: 100%; }
  .vc-a-fb-seg__b button { flex: 1; min-width: 0; }
  .vc-a-fb-cell text { font-size: 22px; }
  .vc-a-fb-cmp__axis { font-size: 26px; }
  /* block 7 */
  .vc-a-fb-b7__gate { grid-template-columns: 1fr; }
  .vc-a-fb-doff { order: -1; grid-template-columns: 110px minmax(0, 1fr); }
  .vc-a-fb-doff__beam { width: 110px; height: 110px; }
  .vc-a-fb-ticket { margin-top: 0; }
  .vc-a-fb-ticket::before { display: none; }
  .vc-a-fb-b7__ctl { grid-template-columns: 1fr; }
  .vc-a-fb-play--release { width: 100%; }
  .vc-a-fb-thread__rail, .vc-a-fb-thread__drop { display: none; }
  .vc-a-fb-thread__st { height: auto; display: grid; gap: 8px; }
  .vc-a-fb-thread__st li, .vc-a-fb-thread__st li:last-child { position: static; transform: none; width: auto; }
  .vc-a-fb-thread__st li::before { display: none; }
  .vc-a-fb-thread__st li:last-child a { text-align: left; border-width: 2px; }
  .vc-a-fb-thread__st span { max-height: none; opacity: 1; }
  .vc-a-fb-thread::before { content: '04 Knitting and weaving → 05 Dyeing and finishing'; display: block; font: 700 13px var(--gft-font-mono); letter-spacing: 0.06em; color: #f6dcae; margin-bottom: 8px; }
  .vc-a-fb-src { max-width: none; font-size: 13px; }
}
@media (max-width: 640px) {
  .vc-a-fb-sec h2 { font-size: 26px; }
  .vc-a-fb-lede { font-size: 17px; }
  /* splash: the headline in a measured top band, the stage below it, then the controls */
  .gft-splash[data-splash='vc-a-fabric'] { display: flex; flex-direction: column; }
  .gft-splash[data-splash='vc-a-fabric'] .gft-splash__content { display: contents; }
  .gft-splash[data-splash='vc-a-fabric'] .gft-splash__content > * { margin-inline: 20px; position: relative; }
  .gft-splash[data-splash='vc-a-fabric'] .gft-splash__content > .gft-eyebrow { order: 1; margin-top: 22px; }
  .gft-splash[data-splash='vc-a-fabric'] h1 { order: 2; font-size: clamp(2.6rem, 11.4vw, 3.4rem); margin-top: 8px; }
  .gft-splash[data-splash='vc-a-fabric'] .gft-splash__lede { order: 3; font-size: 15px; margin-top: 10px; }
  .gft-splash[data-splash='vc-a-fabric'] .gft-splash__structure { order: 4; position: relative; inset: auto; height: 46svh; margin-top: 12px; z-index: 0; overflow: hidden; }
  .gft-splash[data-splash='vc-a-fabric'] .gft-splash__structure::after { background: linear-gradient(180deg, #072d2b 0%, #072d2b00 14%, #072d2b00 88%, #072d2b 100%); }
  .gft-splash[data-splash='vc-a-fabric'] .vc-a-fb-sp-svg { width: 92svh; max-width: none; margin-left: -39.7svh; height: 100%; }
  .gft-splash[data-splash='vc-a-fabric'] .gft-splash__actions { order: 5; margin-top: 14px; }
  .gft-splash[data-splash='vc-a-fabric'] .gft-splash__bottom { order: 6; }
  .vc-a-fb-sp-id, .vc-a-fb-sp-lbl, .vc-a-fb-sd__tag { display: none; }
  .vc-a-fb-sp__modes span { min-width: 0; }
  .vc-a-fb-sp__modes { display: grid; grid-template-columns: 1fr 1fr; }
  .vc-a-fb-sp__r b { font-size: 22px; }
  .vc-a-fb-sp__go .gft-button--ghost { display: none; }
  .vc-a-fb-sp__go .gft-button { width: 100%; }
  .vc-a-fb-sp__pills { display: grid; grid-template-columns: 1fr 1fr; font-size: 13px; }
}