.agav { position: relative; display: inline-block; flex: none; overflow: hidden; border-radius: 4px; vertical-align: middle; background: var(--surface-2); line-height: 0; }
.agav.sm { width: 22px; height: 22px; }
.agav.md { width: 28px; height: 28px; }
.agav.lg { width: 72px; height: 72px; border-radius: 8px; }
.agav > svg, .agav > img { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.agav-img { box-sizing: border-box; padding: 2px; object-fit: contain; background: light-dark(#f2f2f0, #e4e2de); opacity: 0; transition: opacity var(--sk-fade, 150ms) ease-out; }
.agav[data-state="ready"] > .agav-img { opacity: 1; }
.agav[data-state="error"] > .agav-img { display: none; }
html:not(.js) .agav-img { opacity: 1; }
.agav[data-state="loading"]::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, var(--sk-hi), transparent); transform: translateX(-100%); animation: sk-sweep var(--sk-dur, 1.8s) ease-in-out infinite; }
.agav.sk { background: var(--sk-base); }
@media (prefers-reduced-motion: reduce) { .agav[data-state="loading"]::after { animation: none; transform: none; background: var(--sk-base); } }
.ar-h .agav { align-self: center; }
.dag .agav, .kv .agav { margin-right: 6px; }
.avp { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.avp-t { margin: 0; color: var(--ink-2); font-size: 13px; }
.avp-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.avp-up { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
.avp-sample { display: flex; align-items: center; gap: 10px; margin: 8px 0; }
.ph-av { display: inline-flex; vertical-align: middle; margin-right: 10px; }
.agpx { display: block; width: 100%; height: 100%; }
.agpx.h0 .bg { fill: light-dark(hsl(0 30% 92%), hsl(0 18% 20%)); }
.agpx.h0.t0 .fg { fill: light-dark(hsl(0 30% 34%), hsl(0 28% 72%)); }
.agpx.h0.t1 .fg { fill: light-dark(hsl(0 36% 34%), hsl(0 34% 72%)); }
.agpx.h0.t2 .fg { fill: light-dark(hsl(0 42% 34%), hsl(0 40% 72%)); }
.agpx.h1 .bg { fill: light-dark(hsl(15 30% 92%), hsl(15 18% 20%)); }
.agpx.h1.t0 .fg { fill: light-dark(hsl(15 30% 34%), hsl(15 28% 72%)); }
.agpx.h1.t1 .fg { fill: light-dark(hsl(15 36% 34%), hsl(15 34% 72%)); }
.agpx.h1.t2 .fg { fill: light-dark(hsl(15 42% 34%), hsl(15 40% 72%)); }
.agpx.h2 .bg { fill: light-dark(hsl(30 30% 92%), hsl(30 18% 20%)); }
.agpx.h2.t0 .fg { fill: light-dark(hsl(30 30% 34%), hsl(30 28% 72%)); }
.agpx.h2.t1 .fg { fill: light-dark(hsl(30 36% 34%), hsl(30 34% 72%)); }
.agpx.h2.t2 .fg { fill: light-dark(hsl(30 42% 34%), hsl(30 40% 72%)); }
.agpx.h3 .bg { fill: light-dark(hsl(45 30% 92%), hsl(45 18% 20%)); }
.agpx.h3.t0 .fg { fill: light-dark(hsl(45 30% 34%), hsl(45 28% 72%)); }
.agpx.h3.t1 .fg { fill: light-dark(hsl(45 36% 34%), hsl(45 34% 72%)); }
.agpx.h3.t2 .fg { fill: light-dark(hsl(45 42% 34%), hsl(45 40% 72%)); }
.agpx.h4 .bg { fill: light-dark(hsl(60 30% 92%), hsl(60 18% 20%)); }
.agpx.h4.t0 .fg { fill: light-dark(hsl(60 30% 34%), hsl(60 28% 72%)); }
.agpx.h4.t1 .fg { fill: light-dark(hsl(60 36% 34%), hsl(60 34% 72%)); }
.agpx.h4.t2 .fg { fill: light-dark(hsl(60 42% 34%), hsl(60 40% 72%)); }
.agpx.h5 .bg { fill: light-dark(hsl(75 30% 92%), hsl(75 18% 20%)); }
.agpx.h5.t0 .fg { fill: light-dark(hsl(75 30% 34%), hsl(75 28% 72%)); }
.agpx.h5.t1 .fg { fill: light-dark(hsl(75 36% 34%), hsl(75 34% 72%)); }
.agpx.h5.t2 .fg { fill: light-dark(hsl(75 42% 34%), hsl(75 40% 72%)); }
.agpx.h6 .bg { fill: light-dark(hsl(90 30% 92%), hsl(90 18% 20%)); }
.agpx.h6.t0 .fg { fill: light-dark(hsl(90 30% 34%), hsl(90 28% 72%)); }
.agpx.h6.t1 .fg { fill: light-dark(hsl(90 36% 34%), hsl(90 34% 72%)); }
.agpx.h6.t2 .fg { fill: light-dark(hsl(90 42% 34%), hsl(90 40% 72%)); }
.agpx.h7 .bg { fill: light-dark(hsl(105 30% 92%), hsl(105 18% 20%)); }
.agpx.h7.t0 .fg { fill: light-dark(hsl(105 30% 34%), hsl(105 28% 72%)); }
.agpx.h7.t1 .fg { fill: light-dark(hsl(105 36% 34%), hsl(105 34% 72%)); }
.agpx.h7.t2 .fg { fill: light-dark(hsl(105 42% 34%), hsl(105 40% 72%)); }
.agpx.h8 .bg { fill: light-dark(hsl(120 30% 92%), hsl(120 18% 20%)); }
.agpx.h8.t0 .fg { fill: light-dark(hsl(120 30% 34%), hsl(120 28% 72%)); }
.agpx.h8.t1 .fg { fill: light-dark(hsl(120 36% 34%), hsl(120 34% 72%)); }
.agpx.h8.t2 .fg { fill: light-dark(hsl(120 42% 34%), hsl(120 40% 72%)); }
.agpx.h9 .bg { fill: light-dark(hsl(135 30% 92%), hsl(135 18% 20%)); }
.agpx.h9.t0 .fg { fill: light-dark(hsl(135 30% 34%), hsl(135 28% 72%)); }
.agpx.h9.t1 .fg { fill: light-dark(hsl(135 36% 34%), hsl(135 34% 72%)); }
.agpx.h9.t2 .fg { fill: light-dark(hsl(135 42% 34%), hsl(135 40% 72%)); }
.agpx.h10 .bg { fill: light-dark(hsl(150 30% 92%), hsl(150 18% 20%)); }
.agpx.h10.t0 .fg { fill: light-dark(hsl(150 30% 34%), hsl(150 28% 72%)); }
.agpx.h10.t1 .fg { fill: light-dark(hsl(150 36% 34%), hsl(150 34% 72%)); }
.agpx.h10.t2 .fg { fill: light-dark(hsl(150 42% 34%), hsl(150 40% 72%)); }
.agpx.h11 .bg { fill: light-dark(hsl(165 30% 92%), hsl(165 18% 20%)); }
.agpx.h11.t0 .fg { fill: light-dark(hsl(165 30% 34%), hsl(165 28% 72%)); }
.agpx.h11.t1 .fg { fill: light-dark(hsl(165 36% 34%), hsl(165 34% 72%)); }
.agpx.h11.t2 .fg { fill: light-dark(hsl(165 42% 34%), hsl(165 40% 72%)); }
.agpx.h12 .bg { fill: light-dark(hsl(180 30% 92%), hsl(180 18% 20%)); }
.agpx.h12.t0 .fg { fill: light-dark(hsl(180 30% 34%), hsl(180 28% 72%)); }
.agpx.h12.t1 .fg { fill: light-dark(hsl(180 36% 34%), hsl(180 34% 72%)); }
.agpx.h12.t2 .fg { fill: light-dark(hsl(180 42% 34%), hsl(180 40% 72%)); }
.agpx.h13 .bg { fill: light-dark(hsl(195 30% 92%), hsl(195 18% 20%)); }
.agpx.h13.t0 .fg { fill: light-dark(hsl(195 30% 34%), hsl(195 28% 72%)); }
.agpx.h13.t1 .fg { fill: light-dark(hsl(195 36% 34%), hsl(195 34% 72%)); }
.agpx.h13.t2 .fg { fill: light-dark(hsl(195 42% 34%), hsl(195 40% 72%)); }
.agpx.h14 .bg { fill: light-dark(hsl(210 30% 92%), hsl(210 18% 20%)); }
.agpx.h14.t0 .fg { fill: light-dark(hsl(210 30% 34%), hsl(210 28% 72%)); }
.agpx.h14.t1 .fg { fill: light-dark(hsl(210 36% 34%), hsl(210 34% 72%)); }
.agpx.h14.t2 .fg { fill: light-dark(hsl(210 42% 34%), hsl(210 40% 72%)); }
.agpx.h15 .bg { fill: light-dark(hsl(225 30% 92%), hsl(225 18% 20%)); }
.agpx.h15.t0 .fg { fill: light-dark(hsl(225 30% 34%), hsl(225 28% 72%)); }
.agpx.h15.t1 .fg { fill: light-dark(hsl(225 36% 34%), hsl(225 34% 72%)); }
.agpx.h15.t2 .fg { fill: light-dark(hsl(225 42% 34%), hsl(225 40% 72%)); }
.agpx.h16 .bg { fill: light-dark(hsl(240 30% 92%), hsl(240 18% 20%)); }
.agpx.h16.t0 .fg { fill: light-dark(hsl(240 30% 34%), hsl(240 28% 72%)); }
.agpx.h16.t1 .fg { fill: light-dark(hsl(240 36% 34%), hsl(240 34% 72%)); }
.agpx.h16.t2 .fg { fill: light-dark(hsl(240 42% 34%), hsl(240 40% 72%)); }
.agpx.h17 .bg { fill: light-dark(hsl(255 30% 92%), hsl(255 18% 20%)); }
.agpx.h17.t0 .fg { fill: light-dark(hsl(255 30% 34%), hsl(255 28% 72%)); }
.agpx.h17.t1 .fg { fill: light-dark(hsl(255 36% 34%), hsl(255 34% 72%)); }
.agpx.h17.t2 .fg { fill: light-dark(hsl(255 42% 34%), hsl(255 40% 72%)); }
.agpx.h18 .bg { fill: light-dark(hsl(270 30% 92%), hsl(270 18% 20%)); }
.agpx.h18.t0 .fg { fill: light-dark(hsl(270 30% 34%), hsl(270 28% 72%)); }
.agpx.h18.t1 .fg { fill: light-dark(hsl(270 36% 34%), hsl(270 34% 72%)); }
.agpx.h18.t2 .fg { fill: light-dark(hsl(270 42% 34%), hsl(270 40% 72%)); }
.agpx.h19 .bg { fill: light-dark(hsl(285 30% 92%), hsl(285 18% 20%)); }
.agpx.h19.t0 .fg { fill: light-dark(hsl(285 30% 34%), hsl(285 28% 72%)); }
.agpx.h19.t1 .fg { fill: light-dark(hsl(285 36% 34%), hsl(285 34% 72%)); }
.agpx.h19.t2 .fg { fill: light-dark(hsl(285 42% 34%), hsl(285 40% 72%)); }
.agpx.h20 .bg { fill: light-dark(hsl(300 30% 92%), hsl(300 18% 20%)); }
.agpx.h20.t0 .fg { fill: light-dark(hsl(300 30% 34%), hsl(300 28% 72%)); }
.agpx.h20.t1 .fg { fill: light-dark(hsl(300 36% 34%), hsl(300 34% 72%)); }
.agpx.h20.t2 .fg { fill: light-dark(hsl(300 42% 34%), hsl(300 40% 72%)); }
.agpx.h21 .bg { fill: light-dark(hsl(315 30% 92%), hsl(315 18% 20%)); }
.agpx.h21.t0 .fg { fill: light-dark(hsl(315 30% 34%), hsl(315 28% 72%)); }
.agpx.h21.t1 .fg { fill: light-dark(hsl(315 36% 34%), hsl(315 34% 72%)); }
.agpx.h21.t2 .fg { fill: light-dark(hsl(315 42% 34%), hsl(315 40% 72%)); }
.agpx.h22 .bg { fill: light-dark(hsl(330 30% 92%), hsl(330 18% 20%)); }
.agpx.h22.t0 .fg { fill: light-dark(hsl(330 30% 34%), hsl(330 28% 72%)); }
.agpx.h22.t1 .fg { fill: light-dark(hsl(330 36% 34%), hsl(330 34% 72%)); }
.agpx.h22.t2 .fg { fill: light-dark(hsl(330 42% 34%), hsl(330 40% 72%)); }
.agpx.h23 .bg { fill: light-dark(hsl(345 30% 92%), hsl(345 18% 20%)); }
.agpx.h23.t0 .fg { fill: light-dark(hsl(345 30% 34%), hsl(345 28% 72%)); }
.agpx.h23.t1 .fg { fill: light-dark(hsl(345 36% 34%), hsl(345 34% 72%)); }
.agpx.h23.t2 .fg { fill: light-dark(hsl(345 42% 34%), hsl(345 40% 72%)); }