/* ag-record · "Named record" · 06 Audit (white band, no container). Scoped under .aa-record. Uses v4.css tokens (--ink-*, --ok, --blue-ink, --hold, --deny, --t1…--t7, --ease, --ease-draw).
   Wide stage (700px and up): one-line records at a 52px pitch, the collector fork on the right (rail 28px past the records, outlets to 49px, labels at 56px).
   Compact stage (below 700px): two-line records at a 60px pitch, the rail on the right edge bending into a bus along the bottom. Container queries, so the
   layout follows the column it sits in. The markup is the final frame: six records, the REJECTED one open. */
.aa-record{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:start}
.aa-record .aa-rc-copy{grid-column:1/span 5;min-width:0}
.aa-record .aa-rc-copy .body{margin-top:24px;max-width:440px}
.aa-record .aa-rc-copy .tlink{margin-top:20px}
.aa-record .aa-rc-stage{grid-column:6/span 7;min-width:0;margin:0;container-type:inline-size}
.aa-record .aa-rc-box{position:relative;height:500px}

/* records: a real list of buttons, hairline-separated, no boxes */
.aa-record .aa-rc-list{position:relative;width:calc(100% - 133px);margin:0;padding:0;list-style:none}
.aa-record .aa-rc-rec{position:relative;border-bottom:1px solid var(--ink-08)}
.aa-record .aa-rc-row{display:grid;grid-template-columns:64px 138px 30px 132px minmax(0,1fr) 68px;align-items:center;width:100%;height:52px;padding:0 8px 0 0;text-align:left;color:var(--ink);cursor:pointer;border-radius:0}
.aa-record .aa-rc-row:focus-visible{outline-offset:-2px;border-radius:2px}
.aa-record .aa-rc-time{font:400 11px/16px var(--mono);color:var(--ink-40);white-space:nowrap}
.aa-record .aa-rc-ag{font:500 12.5px/18px var(--mono);color:var(--ink);white-space:nowrap}
.aa-record .aa-rc-root{display:block;overflow:visible}
.aa-record .aa-rc-root circle{fill:var(--ink-40)}
.aa-record .aa-rc-root path{fill:none;stroke:var(--ink-40);stroke-width:1}
.aa-record .aa-rc-root .aa-rc-rl{stroke-dasharray:1;stroke-dashoffset:0}
.aa-record .aa-rc-root .aa-rc-rd{stroke-dasharray:2 1.5}
.aa-record .is-anon .aa-rc-re{fill:#fff;stroke:var(--ink-40);stroke-width:1}
.aa-record .aa-rc-who{font:400 13px/18px var(--sans);color:var(--ink-80);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.aa-record .is-anon .aa-rc-who{color:var(--ink-40)}
.aa-record .aa-rc-tool{font:400 12px/16px var(--mono);color:var(--ink-60);min-width:0;padding:0 10px 0 8px}
.aa-record .aa-rc-note{display:block;font-size:11px;color:var(--ink-40)}
.aa-record .aa-rc-dot{display:none}
.aa-record .aa-rc-out{font:500 11px/16px var(--mono);letter-spacing:.06em;text-align:right;white-space:nowrap}
.aa-record [data-o=allow] .aa-rc-out,.aa-record [data-o=allow] dd.o{color:var(--ok)}
.aa-record [data-o=held] .aa-rc-out,.aa-record [data-o=held] dd.o{color:var(--blue-ink)}
.aa-record [data-o=reject] .aa-rc-out,.aa-record [data-o=reject] dd.o{color:var(--hold)}
.aa-record [data-o=deny] .aa-rc-out,.aa-record [data-o=deny] dd.o{color:var(--deny)}
.aa-record .aa-rc-row:hover .aa-rc-time{color:var(--ink-60)}

/* an open record: its fields in plain words, hung from a hairline under the agent name */
.aa-record .aa-rc-more{position:relative;padding:4px 0 20px 80px}
.aa-record .aa-rc-more[hidden]{display:none}
.aa-record .aa-rc-rule{position:absolute;left:64px;top:0;bottom:16px;width:1px;background:var(--ink-15);transform-origin:50% 0}
.aa-record .aa-rc-dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;max-width:600px;margin:0}
.aa-record .aa-rc-dl>div{display:grid;grid-template-columns:92px minmax(0,1fr);align-items:baseline;padding:3px 0;min-width:0}
.aa-record .aa-rc-dl>.w{grid-column:1/-1}
.aa-record .aa-rc-dl dt{font:400 11px/18px var(--mono);color:var(--ink-40)}
.aa-record .aa-rc-dl dd{margin:0;font:400 14px/18px var(--sans);color:var(--ink);min-width:0}
.aa-record .aa-rc-dl dd.m{font:400 13px/18px var(--mono)}

/* the stub from each record to the collector rail */
.aa-record .aa-rc-stub{position:absolute;left:100%;top:26px;overflow:visible;pointer-events:none}
.aa-record .aa-rc-stub path{fill:none;stroke:var(--ink-15);stroke-width:1;stroke-dasharray:1;stroke-dashoffset:0}
.aa-record .aa-rc-stub .c{display:none}

/* collector */
.aa-record .aa-rc-col{position:absolute;right:0;top:0;overflow:visible;pointer-events:none}
.aa-record .aa-rc-col path{fill:none;stroke-width:1}
.aa-record .aa-rc-rail{stroke-dasharray:1;stroke-dashoffset:0}
.aa-record .aa-rc-out1,.aa-record .aa-rc-out2{stroke:var(--ink-15);stroke-dasharray:1;stroke-dashoffset:0}
.aa-record .aa-rc-p1,.aa-record .aa-rc-p2{display:none}
.aa-record .aa-rc-col .aa-rc-pulse{stroke:rgba(10,10,10,.45);stroke-width:1.4;stroke-linecap:round}
.aa-record .aa-rc-col-c{display:none}
.aa-record .aa-rc-outs{margin:0}
.aa-record .aa-rc-lbl{position:absolute;left:calc(100% - 77px);font:400 11px/16px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-60);white-space:nowrap}
.aa-record .aa-rc-l1{top:448px}
.aa-record .aa-rc-l2{top:476px}
.aa-record .aa-rc-demo{position:absolute;left:0;top:452px;margin:0;font:400 11px/16px var(--mono);color:var(--ink-40)}

/* compact stage: two-line records, rail on the right edge, a bus along the bottom */
@container (max-width:699px){
  .aa-record .aa-rc-box{height:572px}
  .aa-record .aa-rc-list{width:calc(100% - 20px)}
  .aa-record .aa-rc-row{grid-template-columns:max-content 30px minmax(0,1fr) max-content;grid-template-areas:"ag rt wh wh" "l2 l2 l2 out";align-content:center;row-gap:5px;height:60px;padding:0}
  .aa-record .aa-rc-ag{grid-area:ag}
  .aa-record .aa-rc-root{grid-area:rt;justify-self:center}
  .aa-record .aa-rc-who{grid-area:wh}
  .aa-record .aa-rc-time{grid-area:l2;font-size:10.5px}
  .aa-record .aa-rc-tool{grid-area:l2;margin-left:58px;padding:0 8px 0 0;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .aa-record .aa-rc-note{display:inline;font-size:11px}
  .aa-record .aa-rc-dot{display:inline}
  .aa-record .aa-rc-out{grid-area:out;font-size:10.5px}
  .aa-record .aa-rc-more{padding:2px 0 18px 16px}
  .aa-record .aa-rc-rule{left:0}
  .aa-record .aa-rc-dl{grid-template-columns:minmax(0,1fr)}
  .aa-record .aa-rc-dl>div{grid-template-columns:88px minmax(0,1fr);padding:1px 0}
  .aa-record .aa-rc-dl dd{font-size:13px}
  .aa-record .aa-rc-dl dd.m{font-size:12px}
  .aa-record .aa-rc-stub{top:42px}
  .aa-record .aa-rc-stub .d{display:none}
  .aa-record .aa-rc-stub .c{display:inline}
  .aa-record .aa-rc-col-d{display:none}
  .aa-record .aa-rc-col-c{display:block}
  .aa-record .aa-rc-l1{left:calc(100% - 220px);top:546px}
  .aa-record .aa-rc-l2{left:calc(100% - 100px);top:546px}
  .aa-record .aa-rc-demo{top:546px}
}
@container (max-width:380px){
  .aa-record .aa-rc-demo{top:auto;bottom:-24px}
}

/* page layout: the split stacks below 1100px (copy above, stream full width) */
@media (max-width:1100px){
  .aa-record{grid-template-columns:minmax(0,1fr);row-gap:48px}
  .aa-record .aa-rc-copy,.aa-record .aa-rc-stage{grid-column:1}
  .aa-record .aa-rc-copy .body{max-width:560px}
}
@media (max-width:760px){
  .aa-record{row-gap:36px}
  .aa-record .aa-rc-copy .body{margin-top:18px}
}

@media (prefers-reduced-motion:reduce){
  .aa-record .aa-rc-pulse{display:none}
}
@media (forced-colors:active){
  .aa-record .aa-rc-pulse{display:none!important}
  .aa-record .aa-rc-col path,.aa-record .aa-rc-stub path,.aa-record .aa-rc-root path{stroke:CanvasText!important}
  .aa-record .aa-rc-root circle{fill:CanvasText}
  .aa-record .aa-rc-rule{background:CanvasText}
}
@media print{
  .aa-record .aa-rc-pulse{display:none!important}
  .aa-record .aa-rc-rec,.aa-record .aa-rc-row,.aa-record .aa-rc-row *,.aa-record .aa-rc-more,.aa-record .aa-rc-more *,.aa-record .aa-rc-lbl{opacity:1!important;transform:none!important;visibility:visible!important;height:auto!important}
  .aa-record .aa-rc-col path,.aa-record .aa-rc-stub path,.aa-record .aa-rc-root path{stroke-dashoffset:0!important}
}