/* Quiet animated representation view, inspired by TensorFlow Playground. */
#policy-figure .ag-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid var(--rule);padding-bottom:12px;margin-bottom:14px}
#policy-figure .ag-tabs{display:flex;gap:18px;flex-wrap:wrap}
#policy-figure .ag-tabs button,#policy-figure .ag-reset,#policy-figure .ag-pause{font:500 0.75rem/1.4 var(--label);color:var(--muted);border:0;border-radius:0;background:none;cursor:pointer;padding:6px 0}
#policy-figure .ag-tabs button[aria-selected=true]{color:var(--green);box-shadow:0 1px var(--green)}
#policy-figure .ag-pause{color:var(--green);white-space:nowrap}
#policy-figure .ag-controls{display:flex;align-items:center;gap:18px}
#policy-figure .ag-reset{font-size:0.6875rem}
#policy-figure .ag-reset:disabled{opacity:.45;cursor:default}
#policy-figure .ag-status{font:0.6875rem/1.4 var(--label);color:var(--green);margin:0 0 8px;min-height:16px}
#policy-figure .ag-host{width:100%;max-width:100%;margin:auto}
#policy-figure .av-svg{display:block;width:100%;height:auto;overflow:visible;fill:none;stroke:none}
#policy-figure .av-svg text{font-family:var(--label);fill:var(--ink);stroke:none;font-size:0.8125rem;font-weight:400;letter-spacing:0}
#policy-figure .av-svg .av-stage{font-size:0.6875rem;fill:var(--muted);letter-spacing:.65px;font-weight:500}
#policy-figure .av-svg .av-input-title,#policy-figure .av-svg .av-node-title{font-size:0.875rem;font-weight:500}
#policy-figure .av-svg .av-small{font-size:0.75rem;fill:var(--muted)}
#policy-figure .av-svg .av-core-title{font:500 1.3125rem var(--heading);fill:var(--green)}
#policy-figure .av-svg .av-dimension{font-size:0.75rem;fill:var(--green)}
#policy-figure .av-svg .av-port{font-size:0.75rem;fill:var(--green)}
#policy-figure .av-svg .av-quote{font:2.125rem var(--serif);fill:var(--green)}
#policy-figure .av-svg .av-timestep{font:italic 1.75rem var(--serif);fill:var(--green)}
#policy-figure .av-matrix rect{stroke:none}
#policy-figure .av-input-video{width:100%;height:100%;object-fit:contain;display:block;background:#f8f5ee;border-radius:0;pointer-events:none}
#policy-figure .av-media-border{stroke:#c4c7ba;stroke-width:.7;fill:#f7f4ed}
#policy-figure .av-wire{stroke:#b2c1b4;stroke-width:.85;fill:none}
#policy-figure .av-memory-wire{stroke:#c2ad90}
#policy-figure .av-packet{fill:#345d48;stroke:none;pointer-events:none}
#policy-figure .av-packet.av-memory-wire{fill:#a18865;stroke:none}
#policy-figure .av-language-line{stroke:#9da890;stroke-width:1.1}
#policy-figure .av-bracket{stroke:#9aab95;stroke-width:1;fill:none}
#policy-figure .av-core-hit{fill:#748d6510;stroke:none}
#policy-figure .av-port-dot{stroke:#4b7155;fill:var(--paper);stroke-width:1}
#policy-figure .av-port-dot.av-gold{stroke:#ad906a}
#policy-figure [data-pick]{cursor:pointer;outline:none}
#policy-figure [data-pick]:hover text,#policy-figure [data-pick][aria-pressed=true] text{fill:var(--green)}
#policy-figure [data-pick]:focus-visible{outline:1px dashed var(--green);outline-offset:5px}
#policy-figure [data-pick][aria-pressed=true] .av-media-border{stroke:var(--green);stroke-width:1.5}
#policy-figure .av-wire.av-selected-route{stroke:#375d46;stroke-width:1.7}
#policy-figure .ag-detail{display:grid;gap:3px;min-height:56px;padding-top:11px;border-top:1px solid var(--rule);font:0.75rem/1.5 var(--label);color:var(--muted)}
#policy-figure .ag-detail strong{font-weight:500;color:var(--green);font-size:0.8125rem}
#policy-figure .ag-note{font:0.6875rem/1.5 var(--label);color:var(--muted);margin:3px 0 14px}
#policy-figure .av-sampling-hit{fill:var(--paper);stroke:none}
#policy-figure .av-node-rule{fill:none;stroke:#9eaf99;stroke-width:1}
#policy-figure .av-sampling-node .av-node-title{font-size:1rem}
#policy-figure .av-sampling-node .av-small{font-size:0.875rem}
#policy-figure .av-svg .av-edge-label{font-size:0.75rem;fill:var(--green);paint-order:stroke;stroke:var(--paper);stroke-width:4}
/* Keep the laptop diagram horizontal; narrow tablets can pan the full network. */
#policy-figure .ag-host[data-view=model] {overflow-x:auto;}
#policy-figure .ag-host[data-view=model] .av-svg {min-width:820px;}
@media(max-width:550px){#policy-figure .ag-toolbar{flex-wrap:wrap;gap:9px}#policy-figure .ag-controls{justify-content:space-between;width:100%}#policy-figure .ag-reset{order:2}#policy-figure .ag-tabs{gap:18px}}

/* Phone-only reading flow. Tablet and desktop retain the original SVG network. */
@media(max-width:600px){
 body #policy-figure[data-phone=true] :is(.ag-detail,.ag-reset,.ag-status){display:none;}
 body #policy-figure .ag-phone-flow {list-style:none; margin:0; padding:0; display:grid; gap:40px;}
 .ag-phone-stage {position:relative; margin:0; padding:0;}
 .ag-phone-stage + .ag-phone-stage::before {content:'↓'; position:absolute; top:-35px; left:0; color:#78916e;}
 body #policy-figure .ag-phone-stage h4 {margin:0 0 16px;}
 .ag-phone-inputs {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 12px;}
 .ag-phone-input {min-width:0;}
 .ag-phone-input video,.ag-phone-language {display:block; width:100%; height:72px; object-fit:contain; background:#eeeae280; margin-bottom:8px;}
 .ag-phone-language {text-align:center; color:var(--green);}
 .ag-phone-encoder {display:block; color:var(--muted);}
 body #policy-figure .ag-phone-stage p {margin:8px 0 0;}
 .ag-phone-conditioning {color:var(--green);}
 .ag-phone-stage[data-active=true] h4 {color:var(--ink);}
}

#policy-figure .ag-scroll-hint {margin:8px 0 0; color:var(--muted); font:400 var(--type-label)/1.5 var(--serif);}
#policy-figure .ag-host[tabindex]:focus-visible {outline:2px solid var(--green); outline-offset:0;}