/* Fontes reais dos templates de vídeo (servidas da pasta fontes/) */
@font-face { font-family: "KF Montserrat"; src: url("/fontes/Montserrat-Black.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "KF Bebas"; src: url("/fontes/BebasNeue-Regular.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "KF Playfair"; src: url("/fontes/PlayfairDisplay-Bold.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "KF Courier"; src: url("/fontes/CourierPrime-Bold.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "KF Inter"; src: url("/fontes/Inter-Bold.ttf") format("truetype"); font-display: swap; }

:root { color-scheme: dark; }
html { scroll-behavior: smooth; }
body { background: #07070b; }

.brilho { background: radial-gradient(60% 50% at 50% 0%, rgba(139, 92, 246, .28), transparent 70%),
                      radial-gradient(40% 40% at 90% 10%, rgba(34, 211, 238, .14), transparent 70%); }
.texto-gradiente { background: linear-gradient(90deg, #c4b5fd, #67e8f9); -webkit-background-clip: text;
                   background-clip: text; color: transparent; }
.cartao { background: rgba(16, 16, 24, .85); border: 1px solid #1f1f2e; border-radius: 1rem; }
.grade-fundo { background-image: linear-gradient(#ffffff08 1px, transparent 1px),
                                 linear-gradient(90deg, #ffffff08 1px, transparent 1px);
               background-size: 48px 48px; }

/* Cards de template */
.tpl-vinheta { background: radial-gradient(ellipse at center, transparent 45%, rgba(0, 0, 0, .75) 100%); }
.tpl-card[aria-pressed="true"] { border-color: #8b5cf6; box-shadow: 0 0 0 2px #8b5cf6, 0 10px 30px -10px rgba(139, 92, 246, .6); }
.tpl-card:disabled { cursor: not-allowed; opacity: .55; }

/* Botões de opção (duração, idioma, voz) */
.opcao[aria-pressed="true"] { border-color: #8b5cf6; background: rgba(139, 92, 246, .16); color: #fff; }

/* Barra de progresso animada */
.barra-viva { background-image: linear-gradient(90deg, #8b5cf6, #22d3ee, #8b5cf6); background-size: 200% 100%;
              animation: correr 2.2s linear infinite; transition: width .6s ease; }
@keyframes correr { from { background-position: 0 0; } to { background-position: -200% 0; } }

.rolagem-fina::-webkit-scrollbar { width: 8px; height: 8px; }
.rolagem-fina::-webkit-scrollbar-thumb { background: #2a2a3a; border-radius: 8px; }

/* Menu lateral e filtros */
.item-menu[aria-current="page"] { background: rgba(139, 92, 246, .14); color: #fff; }
.item-menu[aria-current="page"] svg { color: #a78bfa; }
[data-filtro][aria-pressed="true"] { background: rgba(255, 255, 255, .1); color: #fff; }
[data-filtro] { color: #a1a1aa; }
.tpl-card[aria-pressed="true"] .tpl-check { display: grid; }