/* apv-meanwhile · /ai-agents/approvals #meanwhile · "the name on the wire", held and never released. Every selector is scoped under .apv-meanwhile.
   Final frame by default (no JS, reduced motion, print). .is-live rewinds to t0; the cumulative phase classes .apv-mw-p0….apv-mw-p7 (set by
   asset.js from one clock) restore it in order, so each later phase rule sits below the earlier one. .is-sim kills transitions. */
.apv-meanwhile{
  --apv-mw-ly:12px;                      /* wire top inside the 22px row: the x-height centre of the name line (checked at 4x, Geist loaded) */
  --apv-mw-lead:232px;                   /* where the name gate starts on the upper wire: just past the call label */
  --apv-mw-tl:40px;                      /* call token length */
  --apv-mw-sp:8px;                       /* space between the two parked read_contract tokens (asset.js reads this) */
  --apv-mw-pad:12px;                     /* the stop: a held call waits this far before HELD; also the gap's run-out after the name */
  --apv-mw-hb:#92ADCD;                   /* HELD at rest: 45% blue-lt + 55% w-60, about 7.4:1 on --dk */
  --apv-mw-ok:#97BFA0;                   /* ALLOWED at rest: 60% ok-d + 40% w-60, about 9:1 */
  --apv-mw-tb:rgba(125,185,255,.6);      /* held token at rest */
  --apv-mw-tg:rgba(143,209,158,.6);      /* parked allowed tokens */
  --apv-mw-bg:var(--dk,#1c1c1c);         /* the mask colour = the band */
  position:relative;margin:0;width:100%;min-width:0;text-align:left;color:#fff;
}
.apv-meanwhile .apv-mw-stage{position:relative}
.apv-meanwhile .apv-mw-call{position:relative;min-width:0}
.apv-meanwhile .apv-mw-run-call{margin-top:44px}
.apv-meanwhile .apv-mw-lbl{margin:0;font:400 13px/20px var(--mono);color:var(--w-85,rgba(255,255,255,.85));white-space:nowrap}
.apv-meanwhile .apv-mw-dot{color:var(--w-45,rgba(255,255,255,.45))}

/* the wire (0) → tokens (1) → the name gate (2), which masks the wire with the band colour */
.apv-meanwhile .apv-mw-wire{position:relative;margin-top:20px;height:22px;display:flex;align-items:flex-start}
.apv-meanwhile .apv-mw-line{position:absolute;left:0;right:0;top:var(--apv-mw-ly);height:1px;background:rgba(255,255,255,.2);z-index:0}
.apv-meanwhile .apv-mw-tok{position:absolute;top:calc(var(--apv-mw-ly) - .25px);width:var(--apv-mw-tl);height:1.5px;z-index:1}
.apv-meanwhile .apv-mw-tok-1{right:0;background:var(--apv-mw-tg)}
.apv-meanwhile .apv-mw-tok-2{right:calc(var(--apv-mw-tl) + var(--apv-mw-sp));background:var(--apv-mw-tg)}

/* line 2: HELD · waiting for alex, printed in the upper wire. One box with the band background, so there are no seams. */
.apv-meanwhile .apv-mw-gap{position:relative;z-index:2;display:flex;align-items:baseline;flex:none;height:22px;margin-left:var(--apv-mw-lead);padding:0 var(--apv-mw-pad);background:var(--apv-mw-bg);white-space:nowrap}
/* the held call: parked at the gap's left edge at every width, with no JS. It never moves. */
.apv-meanwhile .apv-mw-tok-h{right:100%;background:var(--apv-mw-tb)}
.apv-meanwhile .apv-mw-held{font:500 11px/22px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--apv-mw-hb)}
.apv-meanwhile .apv-mw-sep{font:400 13px/22px var(--mono);color:var(--w-45,rgba(255,255,255,.45));margin:0 8px 0 7px}
.apv-meanwhile .apv-mw-who{display:flex;align-items:baseline}
.apv-meanwhile .apv-mw-verb{font:400 13px/22px var(--mono);color:var(--w-60,rgba(255,255,255,.6));margin-right:8px}
.apv-meanwhile .apv-mw-name{font:450 17px/22px var(--sans);letter-spacing:-.005em;color:var(--w-60,rgba(255,255,255,.6))}

/* line 4 and the caption */
.apv-meanwhile .apv-mw-out{margin:12px -.08em 0 0;text-align:right;font:500 11px/16px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--apv-mw-ok)}
.apv-meanwhile .apv-mw-cap{margin:28px 0 0;font:400 11px/16px var(--mono);color:var(--w-60,rgba(255,255,255,.6))}

/* ---- live: rewind to t0 (upper line already set at rest; lower calls not yet made), then the phases restore the final frame ---- */
.apv-meanwhile.is-live .apv-mw-held{transition:color var(--t2,200ms) var(--ease)}
.apv-meanwhile.is-live .apv-mw-tok-h{transition:background-color var(--t2,200ms) var(--ease)}
.apv-meanwhile.is-live .apv-mw-tok-1,.apv-meanwhile.is-live .apv-mw-tok-2{left:0;right:auto;opacity:0;background:var(--w-85,rgba(255,255,255,.85));
  transition:opacity var(--t2,200ms) var(--ease),background-color var(--t2,200ms) var(--ease)}
.apv-meanwhile.is-live .apv-mw-out{opacity:0;color:var(--ok-d,#8FD19E);transition:opacity var(--t2,200ms) var(--ease),color var(--t2,200ms) var(--ease)}
/* p0 · 0 ms: the held colour event. HELD and its call at full blue-lt (≤600 ms) */
.apv-meanwhile.is-live.apv-mw-p0 .apv-mw-held{color:var(--blue-lt,#7DB9FF)}
.apv-meanwhile.is-live.apv-mw-p0 .apv-mw-tok-h{background:var(--blue-lt,#7DB9FF)}
/* p1 · 600 ms: relax to rest. From here the upper line never changes */
.apv-meanwhile.is-live.apv-mw-p1 .apv-mw-held{color:var(--apv-mw-hb);transition-duration:var(--t4,560ms)}
.apv-meanwhile.is-live.apv-mw-p1 .apv-mw-tok-h{background:var(--apv-mw-tb);transition-duration:var(--t4,560ms)}
/* p2 · 1400 ms: read_contract #1 appears at the wire's start · p3 · 2600 ms: #2 */
.apv-meanwhile.is-live.apv-mw-p2 .apv-mw-tok-1{opacity:1}
.apv-meanwhile.is-live.apv-mw-p3 .apv-mw-tok-2{opacity:1}
/* p4 · #1 lands: ALLOWED sets at full ok-d (≤600 ms) */
.apv-meanwhile.is-live.apv-mw-p4 .apv-mw-out{opacity:1}
.apv-meanwhile.is-live.apv-mw-p4 .apv-mw-tok-1{background:var(--ok-d,#8FD19E)}
/* p5 · +600 ms: relax */
.apv-meanwhile.is-live.apv-mw-p5 .apv-mw-out{color:var(--apv-mw-ok);transition-duration:var(--t2,200ms),var(--t4,560ms)}
.apv-meanwhile.is-live.apv-mw-p5 .apv-mw-tok-1{background:var(--apv-mw-tg);transition-duration:var(--t2,200ms),var(--t4,560ms)}
/* p6 · #2 lands: ALLOWED rises again (≤600 ms) */
.apv-meanwhile.is-live.apv-mw-p6 .apv-mw-out{color:var(--ok-d,#8FD19E);transition-duration:var(--t2,200ms),var(--t2,200ms)}
.apv-meanwhile.is-live.apv-mw-p6 .apv-mw-tok-2{background:var(--ok-d,#8FD19E)}
/* p7 · +600 ms: relax; this equals the markup's final frame */
.apv-meanwhile.is-live.apv-mw-p7 .apv-mw-out{color:var(--apv-mw-ok);transition-duration:var(--t2,200ms),var(--t4,560ms)}
.apv-meanwhile.is-live.apv-mw-p7 .apv-mw-tok-2{background:var(--apv-mw-tg);transition-duration:var(--t2,200ms),var(--t4,560ms)}
.apv-meanwhile.is-sim *,.apv-meanwhile.is-sim *::before,.apv-meanwhile.is-sim *::after{transition:none!important}

/* ≤1100: the .shead stacks (shared rule); W is 712–1052. The lead turns fluid so the gate's centre stays at ≤40% of the wire and never
   sits mid-line like a form divider ("—— or ——"): 228px at W≥985, about 119px at W=713. (166px ≈ half the gate's width.) */
@media (max-width:1100px){
  .apv-meanwhile{--apv-mw-lead:clamp(96px,calc(40% - 166px),228px)}
  @supports (width:round(down,10.5px,1px)){.apv-meanwhile{--apv-mw-lead:clamp(96px,round(down,40% - 166px,1px),228px)}}   /* whole-pixel token ends */
}

/* ≤760: recomposed. The gate moves to the upper wire's END and ends flush with it (a short stub after the name read as a stray dash), so the
   name lines up with the lower wire's terminus and ALLOWED, the held call waits near the finish, and the long run is the lower wire. */
@media (max-width:760px){
  .apv-meanwhile{--apv-mw-tl:24px;--apv-mw-sp:6px;--apv-mw-pad:10px;--apv-mw-ly:11px}
  .apv-meanwhile .apv-mw-lbl{font-size:12px;line-height:18px}
  .apv-meanwhile .apv-mw-wire{margin-top:14px;height:20px}
  .apv-meanwhile .apv-mw-run-call{margin-top:32px}
  .apv-meanwhile .apv-mw-gap{height:20px;margin-left:auto;margin-right:0;padding-right:0}
  .apv-meanwhile .apv-mw-held{line-height:20px}
  .apv-meanwhile .apv-mw-sep{margin:0 6px;line-height:20px}
  .apv-meanwhile .apv-mw-verb{font-size:11px;line-height:20px;margin-right:6px}
  .apv-meanwhile .apv-mw-name{font-size:14px;line-height:20px}
  .apv-meanwhile .apv-mw-out{margin-top:10px}
  .apv-meanwhile .apv-mw-cap{margin-top:24px}
}
/* ≤360 (the 320 check): a tighter gate and shorter tokens, so about 26px of wire still runs up to the held call at W = 288 */
@media (max-width:360px){
  .apv-meanwhile{--apv-mw-tl:18px;--apv-mw-sp:4px;--apv-mw-pad:8px}
  .apv-meanwhile .apv-mw-sep{margin:0 4px;font-size:11px}
  .apv-meanwhile .apv-mw-verb{margin-right:5px}
  .apv-meanwhile .apv-mw-name{font-size:12px}
}

@media (prefers-reduced-motion:reduce){
  .apv-meanwhile *,.apv-meanwhile *::before,.apv-meanwhile *::after{transition:none!important}
}
@media (forced-colors:active){
  .apv-meanwhile .apv-mw-line{background:GrayText!important}
  .apv-meanwhile .apv-mw-tok{background:CanvasText!important;height:3px;top:calc(var(--apv-mw-ly) - 1px)}
  .apv-meanwhile .apv-mw-gap{background:Canvas}
}
@media print{
  .apv-meanwhile *{transition:none!important}
}