.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cabecalho{padding-top:var(--space-6);padding-bottom:var(--space-6)}.cabecalho h1{margin:0 0 var(--space-2);font-size:var(--text-headline);font-weight:800}.subtitulo{margin:0;color:var(--text-secondary)}.workspace{display:grid;max-width:760px;margin:0 auto}.cartao{min-width:0;padding:var(--space-6);border-radius:var(--radius-lg);background:var(--bg-surface);box-shadow:var(--shadow-card)}.cartao-titulo{margin:0 0 var(--space-4);color:var(--text-secondary);font-size:var(--text-label);font-weight:600;letter-spacing:.02em;text-transform:uppercase}.zona{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-8) var(--space-4);border:2px dashed var(--border-subtle);border-radius:var(--radius-lg);background:var(--bg-canvas);text-align:center;cursor:pointer;transition:border-color var(--duration-fast) ease,background var(--duration-fast) ease}.zona:hover,.zona.arrastando{border-color:var(--accent-purple);background:var(--accent-purple-soft)}.zona-arte{width:140px;height:auto;margin-bottom:var(--space-2)}.zona-titulo{font-size:var(--text-title);font-weight:700}.zona-acao{color:var(--text-secondary)}.zona-acao u{color:var(--accent-purple)}.zona-dica{margin-top:var(--space-2);color:var(--text-secondary);font-size:var(--text-caption)}.zona,.configurando,.processando,.resultado,#erro{display:none}#app[data-estado=LOADING] .zona,#app[data-estado=IDLE] .zona{display:flex}#app[data-estado=CONFIGURANDO] .configurando{display:grid;gap:var(--space-4)}#app[data-estado=PROCESSANDO] .processando{display:flex}#app[data-estado=DONE] .resultado{display:block}#app[data-estado=ERRO] #erro{display:flex}.previa-video{width:100%;max-height:360px;border-radius:var(--radius-md);background:#000;display:block}.duracao-total{margin:var(--space-3) 0 0;color:var(--text-secondary);font-size:var(--text-caption)}.campo-duplo{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);margin-bottom:var(--space-4)}.campo{display:grid;gap:var(--space-2)}.campo label{font-size:var(--text-label);font-weight:600}.entrada{min-height:44px;padding:0 var(--space-3);border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--bg-canvas);color:var(--text-primary);font-size:var(--text-body)}.entrada:focus-visible{outline:3px solid var(--accent-purple);outline-offset:2px}.resumo-quadros{margin:var(--space-2) 0 var(--space-4);color:var(--text-secondary);font-size:var(--text-label)}.aviso-limite{margin:0 0 var(--space-4);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:var(--danger-soft);color:var(--danger);font-size:var(--text-label);font-weight:600}.aviso-limite[hidden]{display:none}#gerar{width:100%}.processando{flex-direction:column;align-items:center;gap:var(--space-3);padding:var(--space-8) 0;text-align:center}.processando .ilustracao{width:120px;height:auto}.status-progresso{margin:0;font-weight:700}.il-engrenagem{transform-origin:60px 40px;animation:girar 1.4s linear infinite}@keyframes girar{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.il-engrenagem{animation:none}}.barra-progresso{width:100%;max-width:320px;height:8px;border-radius:var(--radius-pill);background:var(--bg-elevated);overflow:hidden}.barra-progresso span{display:block;height:100%;width:0%;background:var(--accent-purple);transition:width var(--duration-fast) ease}.previa-gif-moldura{margin:0 0 var(--space-4);border-radius:var(--radius-lg);background:repeating-conic-gradient(var(--bg-elevated) 0% 25%,transparent 0% 50%) 50% / 24px 24px;text-align:center;overflow:hidden;box-shadow:var(--shadow-card)}#previa-gif{max-width:100%;max-height:360px;object-fit:contain;vertical-align:middle}.comparacao{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-2) var(--space-4);margin:0 0 var(--space-4)}.comparacao>div{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3);padding-bottom:var(--space-2);border-bottom:1px solid var(--border-subtle)}.comparacao dt{color:var(--text-secondary);font-size:var(--text-label)}.comparacao dd{margin:0;font-weight:700}.campo-dica{margin:0 0 var(--space-4);color:var(--text-secondary);font-size:var(--text-caption)}.acoes{display:flex;flex-wrap:wrap;gap:var(--space-3)}.acoes .botao-primario{flex:1;min-width:180px;justify-content:center}.alerta-erro{flex-direction:column;align-items:flex-start;gap:var(--space-3);padding:var(--space-5);border-radius:var(--radius-md);background:var(--danger-soft);color:var(--danger)}.alerta-erro svg{width:28px;height:28px}.alerta-erro p{margin:0;font-weight:600}.secao{padding-top:var(--space-8)}.secao h2{margin:0 0 var(--space-4);font-size:var(--text-headline)}.passos{display:grid;gap:var(--space-4);margin:0;padding:0;list-style:none;counter-reset:passo}.passo{display:flex;gap:var(--space-4);padding:var(--space-6);border-radius:var(--radius-lg);background:var(--bg-surface);box-shadow:var(--shadow-card);counter-increment:passo}.passo:before{content:counter(passo);display:grid;flex:none;place-items:center;width:32px;height:32px;border-radius:var(--radius-pill);background:var(--accent-purple-soft);color:var(--accent-purple);font-family:var(--font-mono);font-weight:700}.passo h3{margin:0 0 var(--space-1);font-size:var(--text-body)}.passo p{margin:0;color:var(--text-secondary);font-size:var(--text-label)}.faq{display:grid;gap:var(--space-2);max-width:48rem}.faq details{border-radius:var(--radius-md);background:var(--bg-surface);box-shadow:var(--shadow-card)}.faq summary{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);min-height:56px;padding:var(--space-3) var(--space-4);font-weight:600;list-style:none;cursor:pointer}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"+";color:var(--accent-purple);font-size:1.25rem}.faq details[open] summary:after{content:"–"}.faq details p{margin:0;padding:0 var(--space-4) var(--space-4);color:var(--text-secondary)}@media(min-width:768px){.passos{grid-template-columns:repeat(3,1fr)}}@media(max-width:767px){.cartao{padding:var(--space-4)}.comparacao,.campo-duplo{grid-template-columns:1fr}}
