.animation-editor{width:100%;display:flex;align-items:center;flex-wrap:wrap;gap:7px;padding:9px 0 0;border-top:1px solid rgba(65,228,255,.18);margin-top:8px}
.animation-editor label{display:flex;align-items:center;gap:4px;color:var(--muted);font-size:10px;white-space:nowrap}
.animation-editor input{width:58px;padding:6px 4px;background:#06111e;color:var(--text);border:1px solid var(--line);border-radius:7px;font:inherit;text-align:center}
.animation-editor select{max-width:235px}.animation-editor small{flex-basis:100%;color:var(--muted);font-size:9px}
.animation-editor [hidden]{display:none}
.animation-editor[hidden],.hero-toolbar .layout-actions[hidden]{display:none}
.animation-modes{display:flex;gap:6px;margin-left:auto}.animation-modes [aria-pressed=true]{border-color:var(--cyan);color:var(--cyan)}
.animation-editor input:disabled,.animation-editor button:disabled{opacity:.45;cursor:default}
.animation-editor .invalid{border-color:var(--red)}
.animation-overlay{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;overflow:hidden}
.animation-overlay[hidden]{display:none}.animation-overlay .animation-hit{fill:transparent;stroke:transparent;pointer-events:all;cursor:grab;touch-action:none}
.animation-overlay polyline.animation-hit{fill:none;pointer-events:stroke}.animation-overlay .animation-hit:hover,.animation-overlay .animation-hit:focus{stroke:rgba(65,228,255,.35);outline:none}
.animation-overlay .animation-outline{fill:rgba(65,228,255,.025);stroke:var(--cyan);stroke-width:1.5;stroke-dasharray:5 3;vector-effect:non-scaling-stroke;pointer-events:none}
.animation-overlay text{fill:var(--cyan);font:12px sans-serif;paint-order:stroke;stroke:#04121d;stroke-width:3px;pointer-events:none}
#view-geral .hero-ai.editing{pointer-events:none}#view-geral .hero-ai.editing .indicator-card{pointer-events:auto}
#view-geral .hero-toolbar{flex-wrap:wrap}#view-geral .hero-toolbar .layout-actions{width:100%}
/* Indicadores continuam recebendo cliques acima das áreas das animações. */
#view-geral .hero:has(.hero-ai.editing) .hero-ai{z-index:4}
#view-geral .hero:has(.hero-ai.editing) .hero-grid{z-index:5}
#view-geral .hero.animation-selected .animation-overlay{z-index:4}
#view-geral .hero.animation-selected .hero-ai{z-index:3}