/* ============================================================
   Meu Video IA — design system
   Identidade: dark vibrante (gradiente violeta→rosa→laranja)
   Geometria: quadrada, estilo ElevenLabs (cantos retos, layout limpo)
   ============================================================ */
:root {
  --bg:#08080d;
  --bg2:#0c0c13;
  --card:rgba(255,255,255,.035);
  --stroke:rgba(255,255,255,.09);
  --txt:#f2f3f8;
  --mut:#9aa0b4;
  --deep:#101018;
  --g1:#8b5cf6; --g2:#ec4899; --g3:#f97316; --cy:#22d3ee;
  --grad:linear-gradient(100deg,var(--g1),var(--g2) 55%,var(--g3));
  --r-card:8px;   /* cantos quase retos */
  --r-el:4px;     /* botoes e campos: quadrados */
}
* { box-sizing:border-box; margin:0; }
html { scroll-behavior:smooth; }
body {
  background:var(--bg); color:var(--txt);
  font-family:'Inter',system-ui,'Segoe UI',sans-serif;
  min-height:100vh; overflow-x:hidden;
}
.orb { position:fixed; border-radius:50%; filter:blur(90px); opacity:.30; z-index:0; pointer-events:none; }
.orb1 { width:480px; height:480px; background:radial-gradient(circle,#8b5cf6,transparent 70%);
        top:-160px; left:-120px; animation:flutua 14s ease-in-out infinite alternate; }
.orb2 { width:420px; height:420px; background:radial-gradient(circle,#ec4899,transparent 70%);
        bottom:-140px; right:-100px; animation:flutua 18s ease-in-out infinite alternate-reverse; }
@keyframes flutua { from{transform:translate(0,0) scale(1)} to{transform:translate(40px,30px) scale(1.15)} }

/* ---------- topo / navegacao ---------- */
.topo {
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 28px; background:rgba(8,8,13,.75); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--stroke);
}
.marca { display:flex; align-items:center; gap:10px; text-decoration:none; }
.marca svg { display:block; }
.logotipo { display:block; filter:drop-shadow(0 0 10px rgba(37,140,255,.55)); }
.ico { vertical-align:-3px; flex:none; }
.ic-tile { width:42px; height:42px; border-radius:var(--r-el); display:inline-flex; flex:none;
  align-items:center; justify-content:center; background:rgba(139,92,246,.14);
  border:1px solid rgba(139,92,246,.28); color:#c4b5fd; }
.selo .ico { color:var(--g3); }
.menu a .ico { opacity:.85; }
.acao .ico { vertical-align:-2px; }
.marca .nome { font-family:'Sora',sans-serif; font-weight:800; font-size:1.05rem; letter-spacing:-.3px;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.marca .by { font-size:.56rem; color:var(--mut); letter-spacing:.24em; text-transform:uppercase; display:block; margin-top:1px; }
nav.links { display:flex; gap:24px; align-items:center; }
nav.links a { color:var(--mut); text-decoration:none; font-size:.9rem; font-weight:500; transition:color .2s; }
nav.links a:hover { color:var(--txt); }
.userbar { display:flex; align-items:center; gap:16px; font-size:.85rem; color:var(--mut); }

/* ---------- botoes ---------- */
.btn {
  display:inline-block; background:var(--grad); color:#fff; border:0;
  border-radius:var(--r-el); padding:12px 22px; font-size:.95rem; font-weight:700;
  cursor:pointer; font-family:'Sora',sans-serif; text-decoration:none; text-align:center;
  box-shadow:0 8px 26px rgba(236,72,153,.30);
  transition:transform .15s, box-shadow .2s, filter .2s;
}
.btn:hover { transform:translateY(-1px); filter:brightness(1.08); box-shadow:0 10px 32px rgba(236,72,153,.42); }
.btn:active { transform:translateY(0) scale(.99); }
.btn:disabled { opacity:.5; cursor:wait; transform:none; }
.btn.cheio { width:100%; padding:15px; font-size:1rem; }
.btn.borda {
  background:transparent; color:var(--txt); box-shadow:none;
  border:1px solid var(--stroke);
}
.btn.borda:hover { border-color:var(--g1); filter:none; }
.btn.mini { padding:7px 14px; font-size:.8rem; box-shadow:none; }

/* ---------- cards / formularios ---------- */
.card { background:var(--card); border:1px solid var(--stroke); border-radius:var(--r-card);
        padding:26px 24px; backdrop-filter:blur(14px); }
.card + .card { margin-top:18px; }
h2.secao { font-family:'Sora',sans-serif; font-size:1.05rem; font-weight:700;
  display:flex; align-items:center; gap:10px; margin-bottom:6px; }
.num { background:var(--grad); color:#fff; width:28px; height:28px; border-radius:var(--r-el); flex:none;
  display:inline-flex; align-items:center; justify-content:center; font-size:.9rem;
  box-shadow:0 4px 14px rgba(236,72,153,.35); }
.tag { font-size:.72rem; color:var(--mut); font-weight:500; }
label { display:block; font-size:.83rem; color:var(--mut); margin:16px 0 7px; font-weight:500; }
input[type=text], input[type=email], input[type=password], select, textarea {
  width:100%; background:var(--deep); color:var(--txt); border:1px solid var(--stroke);
  border-radius:var(--r-el); padding:12px 14px; font-size:.95rem; font-family:inherit;
  transition:border-color .2s, box-shadow .2s;
}
input:focus, select:focus, textarea:focus {
  outline:0; border-color:var(--g1); box-shadow:0 0 0 3px rgba(139,92,246,.18);
}
textarea { min-height:84px; resize:vertical; }
.row { display:flex; gap:12px; } .row > div { flex:1; }
.drop { display:flex; align-items:center; gap:12px; background:var(--deep);
  border:1.5px dashed rgba(255,255,255,.16); border-radius:var(--r-el); padding:14px;
  cursor:pointer; transition:border-color .2s; font-size:.9rem; color:var(--mut); }
.drop:hover { border-color:var(--g1); }
.drop.temarq { border-style:solid; border-color:rgba(34,211,238,.5); color:var(--txt); }
.drop .ic { display:inline-flex; color:#c4b5fd; }
.drop input { display:none; }
.seg { display:flex; background:var(--deep); border:1px solid var(--stroke); border-radius:var(--r-el);
  padding:4px; gap:4px; }
.seg label { flex:1; margin:0; text-align:center; padding:9px 6px; border-radius:var(--r-el);
  cursor:pointer; font-size:.85rem; color:var(--mut); transition:all .2s; }
.seg input { display:none; }
.seg label:has(input:checked) { background:rgba(139,92,246,.22); color:var(--txt);
  box-shadow:inset 0 0 0 1px rgba(139,92,246,.45); }
details { margin-top:14px; background:var(--deep); border:1px solid var(--stroke);
  border-radius:var(--r-el); padding:12px 14px; }
summary { color:var(--mut); font-size:.9rem; cursor:pointer; }
input[type=range] { width:100%; accent-color:var(--g2); }

/* ---------- utilidades ---------- */
.step { color:var(--mut); font-size:.9rem; margin-bottom:8px; }
.bar { height:7px; background:var(--deep); border-radius:var(--r-el); overflow:hidden; }
.bar > div { height:100%; width:34%; background:var(--grad); animation:slide 1.2s infinite; }
@keyframes slide { 0%{margin-left:-34%} 100%{margin-left:100%} }
video { width:100%; border-radius:var(--r-card); margin-top:16px; border:1px solid var(--stroke); }
.script { background:var(--deep); border:1px solid var(--stroke); border-radius:var(--r-el);
  padding:13px; font-size:.9rem; margin-top:12px; color:var(--mut); }
.err { color:#ff7a8a; font-size:.9rem; margin-top:12px; white-space:pre-wrap; }
.ok { color:#4ade9a; font-size:.92rem; margin-top:10px; }
a.dl { display:inline-block; margin-top:14px; color:var(--cy); font-weight:600; text-decoration:none; }
.acao { color:var(--cy); font-size:.85rem; margin-left:10px; text-decoration:none; }
.acao:hover { text-decoration:underline; }
.delvoz { color:var(--mut); }
.vozitem { margin-top:12px; font-size:.95rem; }
.ajuste { margin-top:12px; } .ajuste label { margin:0 0 4px; }
.dica { font-size:.74rem; color:#697086; }
.gradtxt { background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.sobe { animation:sobe .5s ease both; }
@keyframes sobe { from{opacity:0; transform:translateY(14px)} to{opacity:1; transform:none} }
footer.rodape { text-align:center; color:#565d72; font-size:.78rem; padding:36px 20px;
  border-top:1px solid var(--stroke); margin-top:60px; }
footer.rodape a { color:var(--mut); }

/* ---------- landing ---------- */
.hero { text-align:center; max-width:820px; margin:0 auto; padding:110px 24px 90px; position:relative; z-index:1; }
.hero-video {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-52%);
  width:min(1000px,120vw); aspect-ratio:16/9; object-fit:cover;
  z-index:0; opacity:.6; mix-blend-mode:screen;
  filter:hue-rotate(22deg) saturate(1.15);
  -webkit-mask-image:radial-gradient(ellipse closest-side, #000 42%, transparent 76%);
  mask-image:radial-gradient(ellipse closest-side, #000 42%, transparent 76%);
  pointer-events:none;
}
.hero > :not(.hero-video) { position:relative; z-index:1; }
.hero h1 { font-family:'Sora',sans-serif; font-size:clamp(2.1rem,5.5vw,3.4rem); font-weight:800;
  letter-spacing:-1px; line-height:1.12; }
.hero p.chamada { color:var(--mut); font-size:1.1rem; margin:20px auto 34px; max-width:560px; line-height:1.6; }
.hero .ctas { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.selo { display:inline-flex; align-items:center; gap:8px; border:1px solid var(--stroke);
  border-radius:var(--r-el); padding:6px 14px; font-size:.78rem; color:var(--mut); margin-bottom:26px;
  background:var(--card); }
.secao-l { max-width:1020px; margin:0 auto; padding:60px 24px; position:relative; z-index:1; }
.secao-l > h2 { font-family:'Sora',sans-serif; font-size:1.9rem; font-weight:800; letter-spacing:-.5px;
  text-align:center; margin-bottom:10px; }
.secao-l > p.desc { text-align:center; color:var(--mut); max-width:560px; margin:0 auto 40px; line-height:1.6; }
.grade { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; }
.bloco { background:var(--card); border:1px solid var(--stroke); border-radius:var(--r-card); padding:24px; }
.bloco .ic { font-size:1.6rem; }
.bloco h3 { font-family:'Sora',sans-serif; font-size:1rem; margin:12px 0 8px; }
.bloco p { color:var(--mut); font-size:.9rem; line-height:1.55; }
.passonum { font-family:'Sora',sans-serif; font-size:.78rem; color:var(--cy); letter-spacing:.14em; }

/* planos */
.planos { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:18px; align-items:stretch; }
.plano { background:var(--card); border:1px solid var(--stroke); border-radius:var(--r-card);
  padding:28px 24px; display:flex; flex-direction:column; position:relative; }
.plano.destaque { border:1.5px solid transparent;
  background:linear-gradient(var(--bg2),var(--bg2)) padding-box, var(--grad) border-box; }
.plano .popular { position:absolute; top:-11px; left:50%; transform:translateX(-50%);
  background:var(--grad); color:#fff; font-size:.68rem; font-weight:700; letter-spacing:.08em;
  padding:4px 12px; border-radius:var(--r-el); text-transform:uppercase; }
.plano h3 { font-family:'Sora',sans-serif; font-size:1.05rem; }
.plano .preco { font-family:'Sora',sans-serif; font-size:2.2rem; font-weight:800; margin:14px 0 2px; }
.plano .preco small { font-size:.85rem; color:var(--mut); font-weight:500; }
.plano ul { list-style:none; padding:0; margin:18px 0 24px; flex:1; }
.plano li { color:var(--mut); font-size:.9rem; padding:7px 0; border-bottom:1px dashed rgba(255,255,255,.06); }
.plano li b { color:var(--txt); }

/* FAQ */
.faq details { margin-top:10px; padding:16px 18px; }
.faq summary { color:var(--txt); font-weight:600; font-size:.95rem; }
.faq p { color:var(--mut); font-size:.9rem; margin-top:10px; line-height:1.6; }

/* ---------- paginas de app (login/painel/admin) ---------- */
.wrap { width:100%; max-width:560px; margin:0 auto; padding:36px 20px 60px; position:relative; z-index:1; }
.wrap-l { max-width:900px; }
.central { min-height:calc(100vh - 62px); display:flex; align-items:center; justify-content:center; padding:24px; }

/* tabela do admin */
table.lista { width:100%; border-collapse:collapse; font-size:.88rem; }
table.lista th { text-align:left; color:var(--mut); font-weight:600; font-size:.78rem;
  text-transform:uppercase; letter-spacing:.06em; padding:10px 8px; border-bottom:1px solid var(--stroke); }
table.lista td { padding:12px 8px; border-bottom:1px solid rgba(255,255,255,.05); }
.pill { display:inline-block; padding:3px 10px; border-radius:var(--r-el); font-size:.75rem; font-weight:600; }
.pill.on { background:rgba(74,222,154,.12); color:#4ade9a; }
.pill.off { background:rgba(255,122,138,.12); color:#ff7a8a; }
.pill.plano { background:rgba(139,92,246,.16); color:#c4b5fd; }

/* uso do plano */
.uso { background:var(--deep); border:1px solid var(--stroke); border-radius:var(--r-el);
  padding:10px 14px; font-size:.85rem; color:var(--mut); display:flex; justify-content:space-between;
  align-items:center; gap:10px; margin-bottom:18px; }
.uso .barra-uso { flex:1; height:6px; background:rgba(255,255,255,.07); border-radius:var(--r-el);
  overflow:hidden; margin:0 6px; }
.uso .barra-uso > div { height:100%; background:var(--grad); }

/* ---------- painel com barra lateral ---------- */
.dash { display:flex; min-height:100vh; }
.lateral {
  width:240px; flex:none; display:flex; flex-direction:column;
  background:rgba(10,10,16,.85); backdrop-filter:blur(14px);
  border-right:1px solid var(--stroke);
  position:sticky; top:0; height:100vh; padding:20px 14px;
  z-index:10;
}
.lateral .marca { padding:4px 10px 18px; border-bottom:1px solid var(--stroke); margin-bottom:14px; }
.menu { display:flex; flex-direction:column; gap:4px; flex:1; }
.menu a {
  display:flex; align-items:center; gap:10px;
  color:var(--mut); text-decoration:none; font-size:.92rem; font-weight:500;
  padding:11px 12px; border-radius:var(--r-el); border-left:2px solid transparent;
  transition:background .15s, color .15s;
}
.menu a:hover { background:rgba(255,255,255,.05); color:var(--txt); }
.menu a.ativo {
  background:rgba(139,92,246,.16); color:var(--txt);
  border-left:2px solid var(--g2);
}
.menu .breve { opacity:.45; cursor:default; }
.menu .breve:hover { background:none; color:var(--mut); }
.menu .breve small { font-size:.62rem; border:1px solid var(--stroke); padding:1px 6px;
  border-radius:var(--r-el); margin-left:auto; letter-spacing:.06em; }
.rodape-lateral { border-top:1px solid var(--stroke); padding-top:14px; font-size:.85rem; color:var(--mut); }
.rodape-lateral .quem { margin-bottom:10px; }
.rodape-lateral .quem b { color:var(--txt); }
.conteudo { flex:1; padding:40px 48px 70px; position:relative; z-index:1; min-width:0; }
.conteudo .miolo { max-width:720px; margin:0 auto; }
.conteudo .miolo-l { max-width:1060px; margin:0 auto; }
.titulo-pag { font-family:'Sora',sans-serif; font-size:1.5rem; font-weight:800;
  letter-spacing:-.4px; margin-bottom:4px; }
.sub-pag { color:var(--mut); font-size:.92rem; margin-bottom:26px; }
.uso-lateral { margin-bottom:14px; }
.uso-lateral .rotulo { display:flex; justify-content:space-between; font-size:.75rem; margin-bottom:6px; }
.uso-lateral .barra-uso { height:5px; background:rgba(255,255,255,.07); border-radius:var(--r-el); overflow:hidden; }
.uso-lateral .barra-uso > div { height:100%; background:var(--grad); }

/* dashboard: estatisticas e acoes rapidas */
.grade-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px;
  margin-bottom:26px; }
.stat { background:var(--card); border:1px solid var(--stroke); border-radius:var(--r-card);
  padding:20px 22px; }
.stat .rotulo { font-size:.72rem; color:var(--mut); text-transform:uppercase; letter-spacing:.08em;
  font-weight:600; }
.stat .valor { font-family:'Sora',sans-serif; font-size:1.9rem; font-weight:800; margin-top:8px;
  letter-spacing:-.5px; }
.stat .extra { font-size:.78rem; color:var(--mut); margin-top:6px; }
.stat .mini-barra { height:5px; background:rgba(255,255,255,.07); border-radius:var(--r-el);
  overflow:hidden; margin-top:12px; }
.stat .mini-barra > div { height:100%; background:var(--grad); }
.acoes-rapidas { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px;
  margin-bottom:10px; }
.acao-rapida { display:flex; align-items:center; gap:16px; background:var(--card);
  border:1px solid var(--stroke); border-radius:var(--r-card); padding:20px 22px;
  text-decoration:none; color:var(--txt); transition:border-color .2s, transform .15s; }
.acao-rapida:hover { border-color:var(--g1); transform:translateY(-1px); }
.acao-rapida .ic { font-size:1.7rem; }
.acao-rapida h3 { font-family:'Sora',sans-serif; font-size:.98rem; }
.acao-rapida p { color:var(--mut); font-size:.82rem; margin-top:3px; }
.acao-rapida .seta { margin-left:auto; color:var(--mut); font-size:1.1rem; }
.linha-secao { display:flex; justify-content:space-between; align-items:baseline;
  margin:34px 0 16px; }
.linha-secao h3 { font-family:'Sora',sans-serif; font-size:1.05rem; }
.barra-grande { height:10px; background:rgba(255,255,255,.07); border-radius:var(--r-el);
  overflow:hidden; margin:14px 0 10px; }
.barra-grande > div { height:100%; background:var(--grad); }
.info-linha { display:flex; justify-content:space-between; padding:11px 0; font-size:.92rem;
  border-bottom:1px dashed rgba(255,255,255,.07); }
.info-linha .chave { color:var(--mut); }

/* perguntas da IA durante a edicao */
.pergunta { background:var(--deep); border:1px solid var(--stroke); border-radius:var(--r-el);
  padding:18px; margin-top:14px; }
.pergunta .texto { font-weight:600; font-size:.98rem; }
.pergunta .porque { color:var(--mut); font-size:.82rem; margin-top:5px; font-style:italic; }
.opcoes { display:flex; flex-direction:column; gap:8px; margin-top:14px; }
.opcao { text-align:left; background:rgba(255,255,255,.03); border:1px solid var(--stroke);
  color:var(--txt); border-radius:var(--r-el); padding:11px 14px; font-size:.9rem;
  cursor:pointer; font-family:inherit; transition:border-color .15s, background .15s; }
.opcao:hover { border-color:var(--g1); background:rgba(139,92,246,.08); }
.opcao.marcada { background:rgba(139,92,246,.20); border-color:var(--g2); font-weight:600; }
.pergunta input[type=text] { margin-top:8px; }

/* grade de videos */
.grade-videos { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px; }
.cartao-video { background:var(--card); border:1px solid var(--stroke); border-radius:var(--r-card);
  padding:12px; }
.cartao-video video { margin:0; border-radius:var(--r-el); aspect-ratio:9/16; object-fit:cover;
  background:#000; }
.cartao-video .info { display:flex; justify-content:space-between; align-items:center;
  margin-top:10px; font-size:.8rem; color:var(--mut); }
.vazio { text-align:center; color:var(--mut); padding:60px 20px; border:1.5px dashed var(--stroke);
  border-radius:var(--r-card); }
.vazio .ic { font-size:2.4rem; display:block; margin-bottom:12px; }

@media (max-width:760px) {
  .dash { flex-direction:column; }
  .lateral { width:100%; height:auto; position:static; flex-direction:column; padding:14px; }
  .menu { flex-direction:row; overflow-x:auto; }
  .menu a { white-space:nowrap; border-left:0; }
  .rodape-lateral { display:flex; justify-content:space-between; align-items:center; padding-top:12px; }
  .rodape-lateral .quem { margin:0; }
  .uso-lateral { display:none; }
  .conteudo { padding:24px 18px 50px; }
}

@media (max-width:640px) {
  nav.links { display:none; }
  .hero { padding:60px 20px 50px; }
}

/* catalogo de estilos de edicao */
.grade-estilos { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:12px; margin-top:16px; }
.cartao-estilo { display:flex; flex-direction:column; gap:6px; text-align:left;
  background:var(--deep); border:1px solid var(--stroke); border-radius:var(--r-el);
  padding:16px; cursor:pointer; font-family:inherit; color:var(--txt);
  transition:border-color .15s, background .15s, transform .15s; width:auto; margin:0;
  box-shadow:none; }
.cartao-estilo:hover { border-color:var(--g1); transform:translateY(-1px); filter:none; }
.cartao-estilo.marcado { background:rgba(139,92,246,.16); border-color:var(--g2); }
.topo-estilo { display:flex; justify-content:space-between; align-items:center; gap:8px;
  font-size:.96rem; }
.cartao-estilo .creditos { font-size:.68rem; color:#c4b5fd; background:rgba(139,92,246,.18);
  border-radius:var(--r-el); padding:3px 8px; white-space:nowrap; font-weight:600; }
.cartao-estilo .resumo { font-size:.84rem; color:var(--mut); line-height:1.45; }
.cartao-estilo .para { font-size:.75rem; color:#697086; font-style:italic; }
.selo-motion { align-self:flex-start; font-size:.62rem; font-weight:700; letter-spacing:.06em;
  text-transform:uppercase; padding:3px 7px; border-radius:var(--r-el); }
.selo-motion.com { color:#f0abfc; background:rgba(217,70,239,.16); }
.selo-motion.sem { color:#9aa3b5; background:rgba(148,163,184,.12); }
.cartao-estilo .recursos { list-style:none; margin:4px 0 0; padding:8px 0 0;
  border-top:1px solid var(--stroke); display:flex; flex-direction:column; gap:4px; }
.cartao-estilo .recursos li { display:flex; gap:6px; align-items:flex-start;
  font-size:.74rem; line-height:1.35; color:var(--mut); }
.cartao-estilo .recursos li svg { flex:0 0 auto; margin-top:2px; }
.cartao-estilo .recursos li.faz svg { color:#4ade9a; }
.cartao-estilo .recursos li.nao { color:#697086; }
.cartao-estilo .recursos li.nao svg { color:#697086; }

/* ---------- direcao de motion (editor) ---------- */
.motion-item { background:var(--deep); border:1px solid var(--stroke); border-radius:var(--r-el);
  padding:14px 16px; margin-top:10px; }
.motion-item .cab { display:flex; justify-content:space-between; gap:10px; align-items:center; flex-wrap:wrap; }
.motion-item .cab b { font-size:.95rem; }
.motion-item .porque { color:var(--mut); font-size:.82rem; margin-top:6px; }
.motion-item .conteudo { margin-top:6px; font-size:.88rem; }
.int { font-size:.66rem; font-weight:700; letter-spacing:.06em; padding:3px 8px; border-radius:var(--r-el); }
.int.low { background:rgba(34,211,238,.12); color:var(--cy); }
.int.medium { background:rgba(139,92,246,.18); color:#c4b5fd; }
.int.high { background:rgba(249,115,22,.18); color:#fdba74; }
.int.limpo { background:rgba(255,255,255,.06); color:var(--mut); }
.notas { display:flex; gap:10px; flex-wrap:wrap; margin-top:10px; }
.nota { font-size:.7rem; color:var(--mut); min-width:86px; }
.nota .trilho { height:4px; background:rgba(255,255,255,.08); border-radius:2px; margin-top:4px; overflow:hidden; }
.nota .trilho div { height:100%; background:var(--grad); }
.checagem { display:flex; gap:10px; align-items:flex-start; padding:9px 0; border-bottom:1px solid var(--stroke); font-size:.88rem; }
.checagem:last-child { border-bottom:0; }
.checagem .st { flex:none; width:86px; }
.checagem .det { color:var(--mut); font-size:.78rem; margin-top:3px; }
.trecho-linha { display:grid; grid-template-columns:52px 1fr auto; gap:10px; padding:8px 0;
  border-bottom:1px solid var(--stroke); font-size:.82rem; align-items:start; }
.trecho-linha .t { color:var(--mut); font-variant-numeric:tabular-nums; }
.trecho-linha .d { font-size:.72rem; color:var(--mut); text-align:right; max-width:180px; }

/* ---------- brand kit ---------- */
.kit-cores { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:12px; margin-top:8px; }
.kit-cor label { margin-top:0; }
.kit-cor input[type=color] { width:100%; height:42px; padding:2px; background:var(--deep);
  border:1px solid var(--stroke); border-radius:var(--r-el); cursor:pointer; }
.chave-liga { display:flex; align-items:center; gap:10px; margin-top:14px; font-size:.9rem; cursor:pointer; }
.chave-liga input { width:18px; height:18px; accent-color:var(--g2); }
.kit-previa { margin-top:18px; border-radius:var(--r-el); border:1px solid var(--stroke); overflow:hidden;
  background:linear-gradient(160deg,#3a3f52,#151824); padding:28px 18px; }
.kit-previa .painel-demo { display:flex; align-items:center; gap:14px; padding:14px 18px; }
.kit-previa .tile { width:46px; height:46px; display:flex; align-items:center; justify-content:center; flex:none; }
.kit-previa .valor { font-size:2rem; line-height:1; letter-spacing:.01em; }
.kit-previa .rot { font-size:.9rem; letter-spacing:.12em; margin-top:4px; }
.logo-atual { max-height:60px; margin-top:10px; background:repeating-conic-gradient(#222 0 25%, #2c2c2c 0 50%) 0 0/16px 16px; padding:6px; }
@font-face { font-family:'Anton'; src:url('/static/fontes/Anton-Regular.ttf'); }
@font-face { font-family:'Bebas Neue'; src:url('/static/fontes/BebasNeue-Regular.ttf'); }

/* ---------- minhas edicoes ---------- */
.edicao-item { display:block; text-decoration:none; color:var(--txt); background:var(--deep);
  border:1px solid var(--stroke); border-radius:var(--r-el); padding:14px 16px; margin-top:10px; }
.edicao-item:hover { border-color:var(--g1); }
.edicao-item .cab { display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:4px; }
.edicao-item .passo { margin-top:6px; font-size:.82rem; }
.selo-status { font-size:.72rem; font-weight:600; padding:3px 9px; border-radius:var(--r-el); background:rgba(255,255,255,.06); color:var(--mut); }
.selo-status.st-previa { background:rgba(139,92,246,.18); color:#c4b5fd; }
.selo-status.st-done { background:rgba(74,222,154,.12); color:#4ade9a; }
.selo-status.st-error { background:rgba(255,122,138,.12); color:#ff7a8a; }
.selo-status.st-running, .selo-status.st-renderizando, .selo-status.st-na_fila { background:rgba(34,211,238,.12); color:var(--cy); }

/* ---- Cerebro da pessoa ---- */
.cb-pessoas { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:10px; }
.cb-pessoa { display:flex; flex-direction:column; gap:3px; padding:12px 14px; border:1px solid var(--stroke);
  border-radius:var(--r-el); color:var(--txt); text-decoration:none; background:rgba(255,255,255,.02); }
.cb-pessoa small { color:var(--mut); font-size:.75rem; }
.cb-pessoa.sel { border-color:var(--g2); background:rgba(255,255,255,.05); }
.cb-ativo { align-self:flex-start; margin-top:4px; font-size:.68rem; font-weight:600; letter-spacing:.04em;
  color:#4ade9a; border:1px solid rgba(74,222,154,.35); border-radius:var(--r-el); padding:1px 7px; }
.cb-estado { margin-top:12px; }
.cb-manual { font-size:.66rem; font-weight:600; color:var(--g3); border:1px solid currentColor;
  border-radius:var(--r-el); padding:0 6px; margin-left:4px; }
.cb-fontes { margin-top:16px; display:flex; flex-direction:column; gap:8px; }
.cb-fonte { display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border:1px solid var(--stroke);
  border-radius:var(--r-el); }
.cb-fonte-txt { flex:1; min-width:0; font-size:.86rem; }
.cb-fonte-txt small { color:var(--mut); font-size:.72rem; }
.cb-fonte-txt .dica { overflow-wrap:anywhere; margin-top:3px; }
.cb-tipo { flex:none; font-size:.66rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em;
  color:var(--mut); border:1px solid var(--stroke); border-radius:var(--r-el); padding:2px 6px; margin-top:2px; }
.cb-x { flex:none; background:none; border:0; color:var(--mut); cursor:pointer; padding:2px; }
.cb-x:hover { color:#ff7a8a; }