/* Codex narrative pass: active green infrastructure, human authority in metal. */
.narrative-route { position:absolute; inset:0; width:100%; height:100%; z-index:1; pointer-events:none; overflow:visible; }
.narrative-route path { fill:none; stroke-linecap:round; stroke-linejoin:round; }
.narrative-route .route-bed { stroke:rgba(130,113,78,.2); stroke-width:9; }
.narrative-route .route-energy { stroke:var(--signal); stroke-width:5; filter:drop-shadow(0 3px 3px rgba(4,0,30,.22)); }
.narrative-route[data-mode="human"] .route-energy { stroke:var(--champagne); }
.narrative-route[data-mode="held"] .route-energy { stroke:var(--satin); stroke-dasharray:3 6 !important; }
.has-motion .scene-asym .gate.is-processing i { background:var(--signal); }
.has-motion .scene-asym .gate:nth-child(2).is-processing i { background:var(--champagne); }
.has-motion .scene-asym .asym-checks .is-resolved { border-color:#82714e; background:rgba(200,255,124,.28); }
.has-motion .scene-asym .asym-checks > .is-processing { background:rgba(200,255,124,.48); border-color:#82714e; }
.has-motion .scene-asym .asym-checks > .is-processing:nth-child(2) { background:rgba(227,199,122,.4); }
.has-motion .asym-slips li.is-active { background:var(--bone); }
.has-motion .asym-slips li.is-permitted { background:var(--signal); box-shadow:0 14px 28px -16px rgba(4,0,30,.5); }
.loop-metal-body { fill:none; stroke:url(#loop-metal); stroke-width:13; filter:drop-shadow(0 7px 6px rgba(0,0,0,.65)); }
.loop-metal-bevel { fill:none; stroke:rgba(245,244,239,.65); stroke-width:2; transform:translateY(-4px); }
.loop-path { stroke:rgba(4,0,30,.55); stroke-width:5; }
.loop-path-run { stroke:var(--signal); stroke-width:5; }
.loop-art.is-closed .loop-path-run { stroke:var(--signal); }
.loop-phase { stroke:var(--signal); stroke-width:13; opacity:.2; }
.loop-art.is-deciding .loop-phase { stroke:var(--champagne); opacity:.5; }
.loop-art.is-deciding .loop-path-run { stroke:var(--champagne); }
.loop-node.is-past circle { fill:var(--signal); stroke:var(--ink); }
.loop-art.is-deciding .loop-signal { stroke:var(--champagne); }
.loop-token { background:linear-gradient(145deg,rgba(130,113,78,.28),rgba(4,0,30,.96) 38%,rgba(201,179,106,.12)); box-shadow:inset 0 1px rgba(245,244,239,.22),0 20px 38px -18px rgba(0,0,0,.8); }
.loop-focus { display:none; }
.has-motion .person.is-supported .burden.is-carried { background:rgba(200,255,124,.22) !important; border-color:#82714e !important; color:var(--ink) !important; }
.has-motion .person.is-supported .burdens { border-bottom:3px solid var(--signal); padding-bottom:8px; }
.has-motion .person.is-supported .person-ring { box-shadow:inset 0 2px 3px rgba(245,244,239,.7),0 7px 12px -8px rgba(4,0,30,.5); }
@media(max-width:960px) {
 .has-motion .scene-loop .loop-art { aspect-ratio:auto; display:grid; gap:18px; }
 .has-motion .scene-loop .loop-art > svg { display:none; }
 .has-motion .loop-focus { display:grid; gap:18px; }
 .loop-focus-track { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
 .loop-focus-track span { padding-top:10px; border-top:4px solid rgba(227,199,122,.22); font-size:12px; color:var(--bone); }
 .loop-focus-track .is-complete { border-color:var(--signal); }
 .loop-focus-track .is-current { border-color:var(--signal); color:var(--signal); }
 .loop-art.is-deciding .loop-focus-track .is-current { border-color:var(--champagne); color:var(--champagne); }
 .loop-focus-stage { display:grid; gap:7px; padding:18px 0 20px; border-bottom:1px solid rgba(227,199,122,.3); }
 .focus-number { font-size:12px; color:var(--satin); font-variant-numeric:tabular-nums; }
 .loop-focus-stage strong { font:400 clamp(1.7rem,7vw,2.4rem)/1.08 var(--f-display); color:var(--signal); }
 .loop-art.is-deciding .loop-focus-stage strong { color:var(--champagne); }
 .loop-focus-stage p { font-size:14px; line-height:1.4; color:var(--bone); }
 .has-motion .scene-loop .loop-token { position:relative; inset:auto; width:100%; max-width:none; transform:none !important; padding:16px; }
 .has-motion .scene-loop .loop-token q { font-size:1.05rem; }
 .has-motion .scene-loop .token-ledger li.is-in:not(.is-newest) { display:none; }
 .has-motion .scene-loop .loop-caption { position:static; }
 .has-motion .scene-loop .loop-now { border-bottom:0; padding-bottom:0; }
 .has-motion .scene-loop .loop-now p { display:none; }
 .has-motion .scene-loop .loop-now strong { font-size:1.1rem; }
 .has-motion .scene-loop .build-status { margin-top:10px; }
}
.is-static .narrative-route,.is-static .loop-focus { display:none; }
@media(prefers-reduced-motion:reduce) { .loop-focus * { transition:none; animation:none; } }

@media(max-width:600px) and (max-height:740px){.has-motion .scene-loop .build-status{margin-top:38px}}

@media(max-width:600px){.has-motion .scene-asym .scene-stage{padding-top:112px}}
@media(min-width:601px) and (max-width:960px){.has-motion .scene-asym .scene-stage{padding-top:148px}}