/* az-day · "a day of tool calls" · /ai-agents/authorization definition (white band, no container). Scoped under .az-day.
   Fact: a token is decided once; Hawcx decides every call. Spec: build/pages/ai-agents-authorization/assets.md §1 and §4.
   Uses v4.css tokens (--ink-*, --hold, --mono, --t1…--t7, --ease, --ease-draw) with fallbacks so preview.html works standalone.
   The composition follows the column through a named container: wide at >= 640px, compact below it. The markup is the final frame;
   .is-live (added by asset.js) rewinds it, and asset.js writes each frame inline, then clears its inline styles at the end. */
.az-day{
  --az-t1:var(--t1,120ms);--az-t2:var(--t2,200ms);--az-t3:var(--t3,320ms);--az-t4:var(--t4,560ms);--az-t5:var(--t5,900ms);--az-t7:var(--t7,2400ms);
  --az-hold-l:var(--hold,#B45309);
  --az-rj-rest-l:#703609;   /* REJECTED at rest on white: 60% --hold mixed with 40% --ink (assets.md §1.2). 9:1 on #fff; opacity would fail A6 */
  container:az-day / inline-size;position:relative;margin:0;color:var(--ink)
}
.az-day p{margin:0}
.az-day .az-dy-stage{position:relative;height:160px}

/* row labels: quiet mono, real text */
.az-day .az-dy-lab{position:absolute;left:0;font:400 12px/16px var(--mono);color:var(--ink-60);white-space:nowrap}
.az-day .az-dy-lab.is-tok{top:0}
.az-day .az-dy-lab.is-hx{top:80px}

/* the two wires: 1px ink-15, snapped; marks are HTML <i> so verticals stay crisp */
.az-day .az-dy-w{position:absolute;left:0;right:0;height:1px}
.az-day .az-dy-w.is-tok{top:40px}
.az-day .az-dy-w.is-hx{top:120px}
.az-day .az-dy-ln{position:absolute;inset:0;background:var(--ink-15);transform-origin:0 50%}
.az-day .az-dy-dec,.az-day .az-dy-tk{position:absolute;left:calc(var(--x,0) * 100%)}
@supports (left:round(down,1.5px,1px)){
  .az-day .az-dy-dec,.az-day .az-dy-tk{left:round(down,calc(var(--x,0) * 100%),1px)}
}
/* token wire: light pass ticks (1 x 7, ink-60), plus the one heavy decision at 09:00 */
.az-day .is-tok .az-dy-tk{top:-3px;width:1px;height:7px;background:var(--ink-60)}
.az-day .az-dy-dec{left:0;top:-7px;width:1.5px;height:15px;background:var(--ink-80);transform-origin:50% 50%}
/* hawcx wire: every call is the same heavy mark as the token's single decision (1.5 x 15, ink-80) */
.az-day .is-hx .az-dy-tk{top:-7px;width:1.5px;height:15px;background:var(--ink-80);transform-origin:50% 50%}
.az-day .is-hx .az-dy-tk.is-ev{background:var(--az-rj-rest-l)}

/* the one labelled event: its name in the gap above the Hawcx tick, its outcome under the wire, both centred on x(14:07) */
.az-day .az-dy-ev,.az-day .az-dy-out{position:absolute;left:calc(var(--x,0) * 100%);transform:translateX(-50%);white-space:nowrap}
.az-day .az-dy-ev{top:80px;font:400 12px/16px var(--mono);color:var(--ink-80)}
.az-day .az-dy-out{top:144px;display:flex;align-items:center;gap:6px;font:500 11px/16px var(--mono);letter-spacing:.06em;color:var(--az-rj-rest-l)}
.az-day .az-dy-g{flex:none;width:10px;height:10px;overflow:visible}
.az-day .az-dy-g path{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}

/* the day's ends */
.az-day .az-dy-end{position:absolute;top:144px;font:400 11px/16px var(--mono);color:var(--ink-60);white-space:nowrap}
.az-day .az-dy-end.is-a{left:0}
.az-day .az-dy-end.is-b{right:0}

/* caption, outside the moment */
.az-day .az-dy-demo{margin-top:24px;font:400 11px/16px var(--mono);color:var(--ink-60);text-align:right}

/* live: asset.js rewinds to an empty day and plays it once */
.az-day.is-live .az-dy-ln{transform:scaleX(0)}
.az-day.is-live .az-dy-dec{transform:scaleY(0)}
.az-day.is-live .az-dy-tk,.az-day.is-live .az-dy-ev,.az-day.is-live .az-dy-out{opacity:0}
.az-day.is-live .az-dy-g path{stroke-dashoffset:1}

/* compact (a column under 640px: 358px at 390, 288px at 320): recompose, don't shrink.
   Half the calls (the 18 .is-h ticks), mono 11 labels, and the event label moves under the Hawcx wire, beside the day's ends,
   because "hawcx · each call decided" would otherwise meet it in the gap. Mark sizes stay the same. */
@container az-day (max-width:639.98px){
  .az-day .az-dy-stage{height:166px}
  .az-day .az-dy-tk:not(.is-h){display:none}
  .az-day .az-dy-lab{font-size:11px}
  .az-day .az-dy-w.is-tok{top:34px}
  .az-day .az-dy-lab.is-hx{top:64px}
  .az-day .az-dy-w.is-hx{top:104px}
  .az-day .az-dy-ev{top:128px;font-size:11px}
  .az-day .az-dy-end{top:128px}
  .az-day .az-dy-out{top:150px}
}
/* <= 1100 (1052px column): the same wide composition, by the container rule above */
@media (max-width:760px){
  .az-day .az-dy-demo{margin-top:16px}
}

@media (prefers-reduced-motion:reduce){
  .az-day *{transition:none!important;animation:none!important}   /* asset.js also never starts: the markup is the final frame */
}
@media (forced-colors:active){
  .az-day .az-dy-ln,.az-day .az-dy-tk,.az-day .az-dy-dec{forced-color-adjust:none;background:CanvasText}
  .az-day .is-hx .az-dy-tk.is-ev{background:Highlight}
  .az-day .az-dy-out{color:CanvasText}
}
@media print{
  .az-day .az-dy-ln,.az-day .az-dy-dec,.az-day .az-dy-tk{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}