.animation-library-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3);margin-bottom:var(--space-8)}
@media(min-width:1200px){.animation-library-picker{grid-template-columns:repeat(4,minmax(0,1fr))}}
.animation-choice{display:flex;gap:var(--space-3);align-items:center;min-width:0;min-height:72px;padding:var(--space-4);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);background:var(--surface-primary);color:var(--text-primary);text-align:left;font-family:var(--font-family-brand)}
.animation-choice>svg{width:28px;height:28px;flex:none;color:var(--action-text)}
.animation-choice strong{display:block;font-size:var(--font-body-size);line-height:var(--font-body-line);font-weight:600}
.animation-choice small{display:block;font-size:var(--font-caption-size);line-height:var(--font-caption-line);color:var(--text-secondary);margin-top:var(--space-1)}
.animation-choice[aria-pressed="true"]{border-color:var(--action-text);background:var(--action-soft)}
.animation-choice:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.animation-library-toolbar,.animation-library-controls{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap;margin-block:var(--space-4)}
.animation-library-toolbar>.muted,.animation-library-controls>p,.animation-reduced-note{font-size:var(--font-body-sm-size);line-height:var(--font-body-sm-line);color:var(--text-secondary)}
.animation-library-stage{display:grid;place-items:center;min-width:0;padding:var(--space-8);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);overflow:hidden;background:#0b0911}
.animation-library-stage[data-animation="nuvem"]{background:#091626}
.animation-library-stage[data-animation="sol"]{background:#171009}
.animation-library-stage[data-animation="escudo-saude"]{background:#09191f}
.animation-library-stage[data-animation="folha"]{background:#09190e}
.animation-library-stage[data-animation="coracao"]{background:#1b090e}
.animation-library-stage[data-animation="foguete"]{background:#10091d}
.animation-library-stage[data-animation-appearance="light"]{background:#faf9fc}
.animation-library-stage[data-animation="nuvem"][data-animation-appearance="light"]{background:#f4f9ff}
.animation-library-stage[data-animation="sol"][data-animation-appearance="light"]{background:#fffaf0}
.animation-library-stage[data-animation="escudo-saude"][data-animation-appearance="light"]{background:#f3faf9}
.animation-library-stage[data-animation="folha"][data-animation-appearance="light"]{background:#f5faf3}
.animation-library-stage[data-animation="coracao"][data-animation-appearance="light"]{background:#fff6f7}
.animation-library-stage[data-animation="foguete"][data-animation-appearance="light"]{background:#f8f5ff}
.animation-library-stage .animation-canvas{display:block;width:min(360px,100%);max-width:100%;aspect-ratio:1;contain:layout style}
.animation-library-stage .animation-canvas>svg{display:block;width:100%;height:100%;overflow:visible}
.animation-reduced-note{margin-block:var(--space-4)}
.animation-integration{margin-top:var(--space-6)}
.animation-integration>p{margin-block:var(--space-4)}
#background-animation-detail .section-heading{align-items:flex-start;gap:var(--space-4);flex-wrap:wrap}
#background-animation-detail .section-heading p{max-width:760px}
@media(max-width:599px){.animation-library-picker{grid-template-columns:1fr}.animation-choice{min-height:64px;padding:var(--space-3) var(--space-4)}.animation-library-stage{padding:var(--space-4)}}
@media(forced-colors:active){.animation-choice[aria-pressed="true"]{outline:2px solid Highlight;outline-offset:-3px}}