/* ============================================================
   Iluria — Gondim UI
   Tokens e componentes do Gondim UI sobre o Bootstrap.
   Tema escuro: classe .dark no <html> (ver site.js).
   ============================================================ */

/* ---------- Tokens — tema claro ---------- */
:root{
  color-scheme:light;
  --bg:#fafaf7; --surface:#fff; --sunken:#f5f5f5;
  --border:#ededed; --border-strong:#d4d4d4;
  --text:#262626; --text-2:#525252; --text-3:#737373;
  --accent:#ffcd00; --accent-hover:#f5c400; --on-accent:#161616;
  --accent-text:#8a6a00; --accent-soft:rgba(255,205,0,.16);
  --success:#22c55e; --warning:#f59e0b; --danger:#ef4444; --info:#3b82f6;
  --success-text:#15803d; --warning-text:#b45309; --danger-text:#b91c1c; --info-text:#1d4ed8;
  /* secundário: grafite, invertido no escuro (mesma escolha do Apolo; a documentação não define) */
  --secondary:#262626; --secondary-hover:#161616; --on-secondary:#fafaf7;
  /* cores por falante */
  --fal-0:var(--info-text); --fal-1:var(--success-text); --fal-2:#6d28d9;
  --fal-3:var(--warning-text); --fal-4:#be185d; --fal-5:#0e7490;
  --radius:4px; --radius-card:6px; --radius-max:8px; --radius-pill:999px;
  --control-h:44px; --control-h-dense:36px;
  --shadow:0 1px 3px rgba(0,0,0,.05);
  --shadow-lg:0 1px 3px rgba(0,0,0,.05),0 12px 28px -8px rgba(22,22,22,.14);
  --sans:"Geist",system-ui,sans-serif;
  --mono:"Geist Mono",ui-monospace,monospace;
  --ease-out:cubic-bezier(.22,1,.36,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --sidebar-w:248px; --topbar-h:60px;

  /* Pontes para o Bootstrap */
  --bs-body-font-family:var(--sans);
  --bs-body-bg:var(--bg); --bs-body-color:var(--text);
  --bs-border-color:var(--border);
  --bs-primary:#ffcd00; --bs-primary-rgb:255,205,0;
  --bs-link-color:var(--accent-text); --bs-link-hover-color:var(--text);
}

/* ---------- Tokens — tema escuro ---------- */
.dark{
  color-scheme:dark;
  --bg:#0a0a0a; --surface:#161616; --sunken:#1a1a1a;
  --border:#2a2a2a; --border-strong:#3a3a3a;
  --text:#fafaf7; --text-2:#a8a8a8; --text-3:#8b8b8b;
  --accent-hover:#ffd633; --accent-text:#ffcd00;
  --accent-soft:rgba(255,205,0,.14);
  --success-text:#4ade80; --warning-text:#fbbf24; --danger-text:#f87171; --info-text:#93c5fd;
  --secondary:#fafaf7; --secondary-hover:#fff; --on-secondary:#161616;
  --fal-2:#c4b5fd; --fal-4:#f9a8d4; --fal-5:#67e8f9;
  --shadow:0 1px 0 rgba(255,255,255,.03) inset;
  --shadow-lg:0 0 0 1px rgba(0,0,0,.4),0 18px 40px -16px rgba(0,0,0,.8);
}

/* ---------- Base ---------- */
html{ font-size:16px; }
body{ margin:0; font-family:var(--sans); background:var(--bg); color:var(--text); -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4,h5,h6{ color:var(--text); font-weight:600; letter-spacing:-.02em; }
code{ font-family:var(--mono); color:var(--accent-text); }
hr{ border-color:var(--border); opacity:1; }
::selection{ background:rgba(255,205,0,.35); }
:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; }

.text-muted{ color:var(--text-3)!important; }
.text-secondary{ color:var(--text-2)!important; }
.text-primary{ color:var(--accent-text)!important; }
.text-success{ color:var(--success-text)!important; }
.text-warning{ color:var(--warning-text)!important; }
.text-danger{ color:var(--danger-text)!important; }
.border-warning{ border-color:color-mix(in srgb,var(--warning) 28%,transparent)!important; }
.border-danger{ border-color:color-mix(in srgb,var(--danger) 28%,transparent)!important; }

::-webkit-scrollbar{ width:8px; height:8px; }
::-webkit-scrollbar-track{ background:var(--sunken); }
::-webkit-scrollbar-thumb{ background:var(--border-strong); border-radius:var(--radius); }
::-webkit-scrollbar-thumb:hover{ background:var(--text-3); }

/* Eyebrow: título pequeno de seção */
.pontos-sec, .cu-sec, .opt-pop-tit{
  display:flex; align-items:center; gap:8px;
  font-family:var(--mono); font-size:11.5px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--text-3);
}
.pontos-sec::before, .cu-sec::before, .opt-pop-tit::before{
  content:""; flex:0 0 auto; width:16px; height:2px; background:var(--accent);
}

/* ---------- Moldura do app ---------- */
.shell{ display:flex; min-height:100vh; }
.shell-main{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; }
.shell-content{ flex:1 1 auto; padding:28px 32px; }

.sidebar{
  position:sticky; top:0; flex:0 0 var(--sidebar-w); width:var(--sidebar-w); height:100vh;
  display:flex; flex-direction:column; background:#161616; color:#fafaf7; z-index:1030;
}
.sb-brand{ display:flex; align-items:center; gap:10px; height:var(--topbar-h); flex:0 0 auto; padding:0 16px; color:#fafaf7; font-weight:600; font-size:14.5px; letter-spacing:-.02em; text-decoration:none; border-bottom:1px solid #2a2a2a; }
.sb-brand:hover{ color:#fafaf7; }
.sb-brand img{ width:26px; height:26px; object-fit:contain; }
.sb-nav{ flex:1 1 auto; overflow-y:auto; padding:16px 12px; }
.sb-grupo{ font-family:var(--mono); font-size:10.5px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:#8b8b8b; padding:0 8px; margin-bottom:8px; }
.sb-item{ display:flex; align-items:center; gap:10px; height:var(--control-h-dense); padding:0 10px; margin-bottom:4px; border-radius:var(--radius); color:#a8a8a8; font-size:13.5px; font-weight:500; text-decoration:none; transition:background .15s, color .15s; }
.sb-item .hi{ width:16px; height:16px; vertical-align:0; }
.sb-item:hover{ background:#1f1f1f; color:#fafaf7; }
.sb-item.ativo, .sb-item.ativo:hover{ background:#ffcd00; color:#161616; font-weight:600; }
.sb-rodape{ flex:0 0 auto; margin-top:auto; display:flex; align-items:center; gap:10px; padding:12px; border-top:1px solid #2a2a2a; }
.sb-avatar{ flex:0 0 auto; width:32px; height:32px; border-radius:var(--radius); background:#ffcd00; color:#161616; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:600; }
.sb-usuario{ flex:1 1 auto; min-width:0; }
.sb-nome{ font-size:13px; font-weight:600; color:#fafaf7; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sb-email{ font-family:var(--mono); font-size:11px; color:#8b8b8b; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sb-sair{ flex:0 0 auto; width:var(--control-h-dense); height:var(--control-h-dense); display:inline-flex; align-items:center; justify-content:center; border-radius:var(--radius); color:#a8a8a8; text-decoration:none; transition:background .15s, color .15s; }
.sb-sair:hover{ background:#1f1f1f; color:#fafaf7; }
/* Logout é POST com antiforgery: o formulário não pode alterar o layout e o botão imita o link antigo */
.sb-sair-form{ flex:0 0 auto; margin:0; display:inline-flex; }
button.sb-sair{ padding:0; border:0; background:transparent; font:inherit; cursor:pointer; }
button.sb-sair:focus-visible{ outline:2px solid #ffcd00; outline-offset:2px; }

.topbar{ position:sticky; top:0; z-index:1020; display:flex; align-items:center; gap:12px; height:var(--topbar-h); padding:0 32px; background:var(--surface); border-bottom:1px solid var(--border); }
.topbar-trilha{ min-width:0; font-size:13.5px; color:var(--text-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.topbar-trilha b{ color:var(--text); font-weight:600; }
.topbar-trilha .sep{ margin:0 8px; color:var(--border-strong); }
.topbar-acoes{ margin-left:auto; display:flex; align-items:center; gap:8px; }

.icon-btn, .theme-toggle{
  width:var(--control-h-dense); height:var(--control-h-dense); flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
  background:transparent; color:var(--text-2); border:1px solid var(--border-strong); border-radius:var(--radius); cursor:pointer;
  transition:background .15s, color .15s, transform .25s var(--ease-spring);
}
.icon-btn:hover, .theme-toggle:hover{ background:var(--sunken); color:var(--text); transform:translateY(-1px); }
.sb-abrir, .sb-veu{ display:none; }

.footer{ padding:16px 32px; border-top:1px solid var(--border); font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-3); }
.footer{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 24px; }
.footer a{ color:inherit; text-decoration:underline; text-underline-offset:3px; }
.footer a:hover{ color:var(--text); }

@media (max-width:991.98px){
  .sidebar{ position:fixed; left:0; top:0; transform:translateX(-100%); transition:transform .3s var(--ease-out); }
  .shell.menu-aberto .sidebar{ transform:none; }
  .shell.menu-aberto .sb-veu{ display:block; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:1025; }
  .sb-abrir{ display:inline-flex; }
  .topbar, .shell-content, .footer{ padding-left:16px; padding-right:16px; }
}

/* ---------- Cartões ---------- */
.card, .card.shadow-sm{ position:relative; background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow)!important; scroll-margin-top:calc(var(--topbar-h) + 16px); }
.card-title{ color:var(--text); font-weight:600; letter-spacing:-.02em; font-size:18px; margin-bottom:20px; }
.card-title i{ color:var(--accent-text); }

/* ---------- Botões ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; min-height:var(--control-h); padding:0 18px;
  font-weight:600; font-size:14px; text-transform:none; border-radius:var(--radius); border:1px solid transparent; box-shadow:none;
  transition:background .15s, border-color .15s, color .15s, transform .25s var(--ease-spring);
}
.btn-lg{ min-height:var(--control-h); font-size:15px; border-radius:var(--radius); }
.btn-sm{ min-height:var(--control-h-dense); padding:0 12px; font-size:13px; border-radius:var(--radius); }
.btn:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; box-shadow:none; }

.btn-primary, .btn-primary:focus{ background:var(--accent); border-color:var(--accent); color:var(--on-accent); }
.btn-primary:hover, .btn-primary:active, .btn-primary.active{ background:var(--accent-hover)!important; border-color:var(--accent-hover)!important; color:var(--on-accent)!important; transform:translateY(-1px); }
.btn-primary:disabled, .btn-primary.disabled{ background:var(--sunken); border-color:var(--border); color:var(--text-3); opacity:1; transform:none; }

.btn-secondary, .btn-secondary:focus{ background:var(--secondary); border-color:var(--secondary); color:var(--on-secondary); }
.btn-secondary:hover, .btn-secondary:active{ background:var(--secondary-hover)!important; border-color:var(--secondary-hover)!important; color:var(--on-secondary)!important; transform:translateY(-1px); }

.btn-ghost, .btn-ghost:focus{ background:transparent; border-color:var(--border-strong); color:var(--text); }
.btn-ghost:hover, .btn-ghost:active{ background:var(--sunken)!important; border-color:var(--border-strong)!important; color:var(--text)!important; }

.btn-danger, .btn-danger:focus{ background:var(--danger); border-color:var(--danger); color:#fff; }

/* Link de ação: sublinhado amarelo que cresce no hover */
.btn-link{ position:relative; min-height:0; padding:0 0 4px; border:none; border-radius:0; font-size:12.5px; color:var(--text-2); text-decoration:none; }
.btn-link::after{ content:""; position:absolute; left:0; bottom:0; width:40%; height:2px; background:var(--accent); transition:width .3s var(--ease-out); }
.btn-link:hover{ color:var(--text); }
.btn-link:hover::after{ width:100%; }

/* ---------- Campos ---------- */
.form-control{ min-height:var(--control-h); border-radius:var(--radius); border-color:var(--border-strong); background:var(--surface); color:var(--text); }
.form-control:focus{ border-color:var(--border-strong); box-shadow:none; background:var(--surface); color:var(--text); outline:2px solid var(--accent); outline-offset:3px; }

/* ---------- Selos ---------- */
.pill-local{
  display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:var(--radius-pill); font-size:11.5px; font-weight:600;
  color:var(--success-text); background:color-mix(in srgb,var(--success) 11%,transparent); border:1px solid color-mix(in srgb,var(--success) 28%,transparent);
}
.pill-local::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; }

/* ---------- Modais ---------- */
.modal-content{ background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius:var(--radius-max); box-shadow:var(--shadow-lg); }
.dark .btn-close{ filter:invert(1) grayscale(1) brightness(2); }
.aviso-modal{ padding:28px; text-align:center; }
.aviso-ico{ width:56px; height:56px; margin:0 auto 14px; border-radius:var(--radius-max); background:var(--accent-soft); color:var(--accent-text); display:flex; align-items:center; justify-content:center; font-size:22px; }
.aviso-tit{ font-size:19px; margin-bottom:8px; }
.aviso-txt{ color:var(--text-2); font-size:14px; line-height:1.55; margin-bottom:20px; }

/* ---------- Cabeçalho da página ---------- */
.trans-wrap{ max-width:1320px; margin:0 auto; }
.trans-wrap .card .card-body{ padding:24px; }
.trans-wrap h1.h2{ font-size:30px; margin-bottom:4px; }
.page-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:24px; }
.page-head .ph-acoes{ display:flex; gap:12px; flex-wrap:wrap; }

/* ---------- Área de trabalho ---------- */
.workspace{ display:block; }
.ws-col > .card{ margin-bottom:24px; }
.resultado-vazio{ display:none; }
#resultadoCard:not(.d-none) ~ .resultado-vazio{ display:none!important; }
.resultado-vazio .card-body{ display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; min-height:420px; }
.rv-ico{ width:56px; height:56px; border-radius:var(--radius-max); background:var(--accent-soft); color:var(--accent-text); display:flex; align-items:center; justify-content:center; font-size:22px; margin-bottom:16px; }
.rv-tit{ font-size:18px; color:var(--text); }
.rv-txt{ color:var(--text-3); font-size:14px; max-width:340px; margin:6px 0 0; }
.rv-proc{ display:none; }
.workspace:has(#progressoCard:not(.d-none)) .rv-proc{ display:block; }
.workspace:has(#progressoCard:not(.d-none)) .rv-padrao{ display:none; }
.workspace:has(#progressoCard:not(.d-none)) .rv-ico{ animation:rvPulso 1.4s ease-in-out infinite; }
@keyframes rvPulso{ 0%,100%{ opacity:1; } 50%{ opacity:.45; } }
@media (min-width:992px){
  .workspace{ display:grid; grid-template-columns:minmax(340px,5fr) 7fr; gap:24px; align-items:start; }
  .resultado-vazio{ display:block; }
  .resultado-vazio .card-body{ min-height:calc(100vh - 300px); }
  .ws-direita .transcript-sync, .ws-direita .result-text{ max-height:calc(100vh - 420px); min-height:320px; }
  .ws-esquerda .upload-area{ padding:28px 16px; }
}
@media (min-width:992px) and (min-height:820px){ .ws-esquerda{ position:sticky; top:calc(var(--topbar-h) + 16px); } }

/* ---------- Upload ---------- */
.upload-area{ padding:36px 24px; border:2px dashed var(--border-strong); border-radius:var(--radius-card); background:var(--sunken); cursor:pointer; transition:background .15s, border-color .15s; }
.upload-area:hover, .upload-area.dragover{ border-color:var(--accent); background:var(--accent-soft); }
.up-ico-wrap{ width:56px; height:56px; margin:0 auto; border-radius:var(--radius-max); background:var(--accent-soft); display:flex; align-items:center; justify-content:center; }
.up-ico-wrap .up-ico{ font-size:26px; color:var(--accent-text); vertical-align:0; }
.formatos-tag{ margin-top:12px; font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-3); }

.file-preview{ margin-top:4px; }
.file-appear{ animation:entrada .6s var(--ease-out) backwards; }
.fp-head{ display:flex; align-items:center; gap:12px; }
.fp-ico-wrap{ width:44px; height:44px; flex:0 0 auto; border-radius:var(--radius-card); background:var(--accent-soft); color:var(--accent-text); display:flex; align-items:center; justify-content:center; font-size:18px; }
.fp-ico-wrap.vid{ background:color-mix(in srgb,var(--info) 12%,transparent); color:var(--info-text); }
.fp-info{ min-width:0; }
.fp-name{ font-weight:600; font-size:15px; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fp-meta{ font-family:var(--mono); font-size:11.5px; color:var(--text-3); margin-top:2px; }
.fp-remove{ margin-left:auto; flex:0 0 auto; width:var(--control-h-dense); height:var(--control-h-dense); border-radius:var(--radius); border:1px solid var(--border-strong); background:transparent; color:var(--text-2); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; transition:background .15s, color .15s; }
.fp-remove:hover{ background:var(--sunken); color:var(--text); }
.fp-loading{ height:4px; border-radius:var(--radius); background:var(--sunken); overflow:hidden; margin-top:14px; }
.fp-loading span{ display:block; height:100%; width:40%; background:var(--accent); animation:carregaBar 1s ease-in-out infinite; }
@keyframes carregaBar{ 0%{ margin-left:-40%; } 100%{ margin-left:100%; } }
#previewAudio{ width:100%; margin-top:14px; }
#previewVideo{ width:100%; margin-top:14px; border-radius:var(--radius-card); max-height:260px; background:#000; }
.media-video{ width:100%; border-radius:var(--radius-card); max-height:300px; background:#000; margin-bottom:14px; display:block; }
.workspace:has(#resultadoCard:not(.d-none)) #previewAudio,
.workspace:has(#resultadoCard:not(.d-none)) #previewVideo{ display:none!important; }

/* ---------- Opções ---------- */
.gear-corner{ position:absolute; top:16px; right:16px; width:var(--control-h-dense); height:var(--control-h-dense); border-radius:var(--radius); border:1px solid var(--border-strong); background:var(--surface); color:var(--text-2); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; z-index:3; transition:background .15s, color .15s, border-color .15s; }
.gear-corner:hover{ background:var(--sunken); color:var(--text); }
.gear-corner.ativo{ border-color:var(--accent); color:var(--accent-text); background:var(--accent-soft); }
.opt-pop{ position:absolute; top:60px; right:16px; width:300px; max-width:calc(100% - 32px); background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow-lg); padding:16px; z-index:5; }
.opt-pop-tit{ margin-bottom:12px; }
.opt{ display:flex; align-items:flex-start; gap:12px; background:var(--sunken); border:1px solid var(--border); border-radius:var(--radius); padding:12px; margin-bottom:8px; }
.opt:last-child{ margin-bottom:0; }
.opt .lbl{ font-weight:600; font-size:14px; display:flex; align-items:center; gap:6px; }
.opt .lbl i{ color:var(--text-2); }
.opt .hint{ color:var(--text-3); font-size:12.5px; margin-top:2px; }
.sw{ position:relative; width:44px; height:24px; flex:0 0 auto; margin:2px 0 0; display:inline-block; }
.sw input{ opacity:0; width:0; height:0; position:absolute; }
.sw .track{ position:absolute; inset:0; background:var(--border-strong); border-radius:var(--radius-pill); transition:background .2s; cursor:pointer; }
.sw .track::before{ content:""; position:absolute; height:18px; width:18px; left:3px; top:3px; background:#fff; border-radius:50%; transition:transform .25s var(--ease-spring); box-shadow:var(--shadow); }
.sw input:checked ~ .track{ background:var(--accent); }
.sw input:checked ~ .track::before{ transform:translateX(20px); }
.sw input:focus-visible ~ .track{ outline:2px solid var(--accent); outline-offset:3px; }

/* ---------- Progresso ---------- */
.progress-log{ background:var(--sunken); border:1px solid var(--border); border-radius:var(--radius); padding:16px; height:220px; overflow:auto; font-family:var(--mono); font-size:12.5px; color:var(--text-2); }
.spinner-border{ vertical-align:middle; }

/* ---------- Player ---------- */
.player-sync{ margin-bottom:16px; }
.player{ display:flex; align-items:center; gap:16px; background:#161616; border:1px solid #2a2a2a; border-radius:var(--radius-card); padding:12px 16px; color:#fafaf7; }
.dark .player{ background:var(--sunken); }
.play-btn{ width:var(--control-h); height:var(--control-h); flex:0 0 auto; border-radius:var(--radius); border:none; background:var(--accent); color:var(--on-accent); font-size:18px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .15s, transform .25s var(--ease-spring); }
.play-btn:hover{ background:var(--accent-hover); transform:translateY(-1px); }
.player .track{ flex:1; }
.player .bar{ position:relative; height:6px; background:rgba(255,255,255,.18); border-radius:var(--radius-pill); cursor:pointer; }
.player .bar .fill{ position:absolute; left:0; top:0; bottom:0; width:0; background:var(--accent); border-radius:var(--radius-pill); }
.player .bar .dot{ position:absolute; top:50%; left:0; width:12px; height:12px; border-radius:50%; background:#fff; transform:translate(-50%,-50%); }
.player .time{ display:flex; justify-content:space-between; font-family:var(--mono); font-size:11.5px; color:#a8a8a8; margin-top:6px; }
.player .speed{ height:var(--control-h-dense); background:rgba(255,255,255,.12); border:none; color:#fafaf7; border-radius:var(--radius); font-family:var(--mono); font-size:11.5px; padding:0 10px; cursor:pointer; }

/* ---------- Resultado ---------- */
.result-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:20px; }
.result-actions{ display:flex; gap:8px; justify-content:flex-end; flex-wrap:wrap; }
.result-tabs{ display:flex; gap:4px; border-bottom:1px solid var(--border); margin:16px 0; flex-wrap:wrap; }
.result-tabs .rtab{ padding:8px 12px; font-size:13.5px; font-weight:600; color:var(--text-2); background:transparent; border:none; border-bottom:2px solid transparent; cursor:pointer; display:inline-flex; align-items:center; gap:6px; transition:color .15s; }
.result-tabs .rtab:hover{ color:var(--text); }
.result-tabs .rtab.active{ color:var(--text); border-bottom-color:var(--accent); }
.result-pane{ display:none; }
.result-pane.active{ display:block; }
.result-text{ background:var(--sunken); border:1px solid var(--border); border-radius:var(--radius); padding:16px; max-height:440px; overflow:auto; white-space:pre-wrap; color:var(--text); }

.transcript-sync{ max-height:440px; }
.transcript-sync .seg{ display:flex; gap:12px; padding:8px 12px; border-radius:var(--radius); cursor:pointer; transition:background .15s; border:1px solid transparent; border-left:3px solid var(--border-strong); }
.transcript-sync .seg:hover{ background:var(--sunken); }
.transcript-sync .seg.active{ background:var(--accent-soft); border-color:var(--accent); }
.transcript-sync .seg.active .txt{ font-weight:500; }
.transcript-sync .seg .ts{ font-family:var(--mono); font-size:11.5px; color:var(--text-3); flex:0 0 54px; padding-top:3px; }
.transcript-sync .seg .who{ font-weight:600; }
.transcript-sync .seg.falante-0{ border-left-color:var(--fal-0); } .transcript-sync .seg.falante-0 .who{ color:var(--fal-0); }
.transcript-sync .seg.falante-1{ border-left-color:var(--fal-1); } .transcript-sync .seg.falante-1 .who{ color:var(--fal-1); }
.transcript-sync .seg.falante-2{ border-left-color:var(--fal-2); } .transcript-sync .seg.falante-2 .who{ color:var(--fal-2); }
.transcript-sync .seg.falante-3{ border-left-color:var(--fal-3); } .transcript-sync .seg.falante-3 .who{ color:var(--fal-3); }
.transcript-sync .seg.falante-4{ border-left-color:var(--fal-4); } .transcript-sync .seg.falante-4 .who{ color:var(--fal-4); }
.transcript-sync .seg.falante-5{ border-left-color:var(--fal-5); } .transcript-sync .seg.falante-5 .who{ color:var(--fal-5); }

.extrair-dica{ font-size:12.5px; color:var(--text-3); margin-bottom:10px; display:flex; align-items:center; gap:8px; }
.extrair-dica i{ color:var(--accent-text); }
.extrair-bar{ display:flex; align-items:center; gap:12px; background:var(--accent-soft); border:1px solid var(--accent); border-radius:var(--radius); padding:8px 12px; margin-bottom:12px; }
.extrair-bar b{ font-family:var(--mono); font-size:12px; color:var(--text); }
.extrair-bar > span{ color:var(--text-2); font-size:13.5px; display:inline-flex; align-items:center; gap:8px; }

.pontos-sec{ margin:20px 0 10px; }
.pontos-sec:first-child{ margin-top:0; }
.ponto-item{ background:var(--sunken); border:1px solid var(--border); border-radius:var(--radius); padding:10px 12px; margin-bottom:8px; font-size:13.5px; color:var(--text); line-height:1.5; }
.ponto-time{ background:var(--accent-soft); color:var(--accent-text); border:1px solid var(--accent); border-radius:var(--radius); font-family:var(--mono); font-size:11.5px; padding:1px 6px; margin-right:8px; cursor:pointer; vertical-align:middle; }
.ponto-time:hover{ background:var(--accent); color:var(--on-accent); }
.atend-info{ display:flex; flex-wrap:wrap; gap:6px 24px; }

/* ---------- Janela "Como usar" ---------- */
.como-usar .modal-header{ border-bottom:1px solid var(--border); padding:16px 24px; }
.como-usar .modal-title{ font-weight:600; display:flex; align-items:center; }
.como-usar .modal-title i{ color:var(--accent-text); }
.como-usar .modal-body{ padding:24px 24px 8px; }
.como-usar .modal-footer{ border-top:1px solid var(--border); padding:12px 24px; }
.cu-sec{ margin:24px 0 12px; padding-top:20px; border-top:1px solid var(--border); }
.cu-passos{ counter-reset:passo; list-style:none; padding:0; margin:0; display:grid; gap:8px; }
.cu-passos li{ counter-increment:passo; position:relative; padding:10px 12px 10px 48px; background:var(--sunken); border:1px solid var(--border); border-radius:var(--radius); font-size:14px; color:var(--text-2); line-height:1.5; }
.cu-passos li::before{ content:counter(passo); position:absolute; left:12px; top:10px; width:24px; height:24px; border-radius:var(--radius); background:var(--accent-soft); color:var(--accent-text); font-family:var(--mono); font-weight:500; font-size:12px; display:flex; align-items:center; justify-content:center; }
.cu-passos li b{ color:var(--text); }
.cu-aviso{ margin:12px 0 0; font-size:13px; color:var(--warning-text); background:color-mix(in srgb,var(--warning) 11%,transparent); border:1px solid color-mix(in srgb,var(--warning) 28%,transparent); border-radius:var(--radius); padding:8px 12px; }
.faq-cols{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.qa{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow); padding:16px; }
.qa h4{ font-size:14px; display:flex; align-items:center; gap:8px; }
.qa-ico{ background:var(--accent-soft); color:var(--accent-text); width:30px; height:30px; border-radius:var(--radius); display:inline-flex; align-items:center; justify-content:center; font-size:14px; flex:0 0 auto; }
.qa p{ color:var(--text-2); font-size:13px; margin:6px 0 0; }
@media (max-width:760px){ .faq-cols{ grid-template-columns:1fr; } }

/* ---------- Vídeo-demonstração ---------- */
.demo-video{ max-width:720px; margin:0 auto; }
.dv-frame{ border:1px solid var(--border); border-radius:var(--radius-card); overflow:hidden; box-shadow:var(--shadow-lg); background:var(--surface); }
.dv-bar{ display:flex; align-items:center; gap:6px; padding:8px 12px; background:#161616; position:relative; z-index:2; }
.dv-bar .dot{ width:10px; height:10px; border-radius:50%; display:inline-block; background:#3a3a3a; }
.dv-url{ margin-left:10px; font-size:11.5px; color:#a8a8a8; font-family:var(--mono); }
.dv-screen{ position:relative; z-index:1; height:300px; background:var(--bg); overflow:hidden; }
.dv-scene{ position:absolute; inset:0; padding:24px; opacity:0; transition:opacity .4s var(--ease-out); display:flex; flex-direction:column; gap:12px; align-items:center; justify-content:center; }
.dv-scene.active{ opacity:1; }
.dv-upload{ width:84%; border:2px dashed var(--border-strong); border-radius:var(--radius-card); background:var(--sunken); padding:24px; text-align:center; color:var(--text-2); font-size:14px; }
.dv-upload i{ font-size:26px; color:var(--accent-text); display:block; margin:0 auto 8px; }
.dv-btn{ background:var(--accent); color:var(--on-accent); font-weight:600; border-radius:var(--radius); padding:10px 18px; font-size:14px; }
.dv-chip{ display:none; align-items:center; gap:8px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:6px 12px; font-size:12.5px; color:var(--text); }
.dv-chip.show{ display:inline-flex; }
.dv-chip i{ color:var(--success-text); } .dv-chip span{ color:var(--text-3); font-family:var(--mono); font-size:11.5px; }
.dv-steps2{ width:82%; display:flex; flex-direction:column; gap:12px; }
.dv-st{ display:flex; align-items:center; gap:10px; background:var(--sunken); border:1px solid var(--border); border-radius:var(--radius); padding:12px; font-size:13.5px; color:var(--text-3); transition:background .25s, color .25s, border-color .25s; }
.dv-st .ck{ width:22px; height:22px; border-radius:50%; border:2px solid var(--border-strong); display:inline-flex; align-items:center; justify-content:center; color:transparent; font-size:12px; flex:0 0 auto; }
.dv-st .ck i{ vertical-align:0; }
.dv-st.done{ color:var(--text); border-color:color-mix(in srgb,var(--success) 28%,transparent); background:color-mix(in srgb,var(--success) 11%,transparent); }
.dv-st.done .ck{ background:var(--success); border-color:var(--success); color:#161616; }
.dv-player{ width:88%; display:flex; align-items:center; gap:12px; background:#161616; border-radius:var(--radius-card); padding:8px 12px; }
.dv-play{ width:36px; height:36px; border-radius:var(--radius); background:var(--accent); color:var(--on-accent); display:flex; align-items:center; justify-content:center; }
.dv-wave{ flex:1; height:22px; background:repeating-linear-gradient(90deg,var(--accent) 0 3px,transparent 3px 7px); opacity:.5; }
.dv-time{ color:#a8a8a8; font-family:var(--mono); font-size:11.5px; }
.dv-lines{ width:88%; display:flex; flex-direction:column; gap:8px; }
.dv-line{ background:var(--sunken); border:1px solid var(--border); border-radius:var(--radius); padding:8px 12px; font-size:12.5px; color:var(--text-2); transition:background .2s, border-color .2s, color .2s; }
.dv-line b{ color:var(--text); }
.dv-line.on, .dv-line.sel{ background:var(--accent-soft); color:var(--text); }
.dv-line.on{ border-color:var(--accent); }
.dv-line.fal0{ border-left:3px solid var(--fal-0); } .dv-line.fal0 b{ color:var(--fal-0); }
.dv-line.fal1{ border-left:3px solid var(--fal-1); } .dv-line.fal1 b{ color:var(--fal-1); }
.dv-line.fal2{ border-left:3px solid var(--fal-2); } .dv-line.fal2 b{ color:var(--fal-2); }
.dv-cutbar{ display:flex; align-items:center; gap:8px; width:88%; margin:0 auto 6px; background:var(--accent-soft); border:1px solid var(--accent); border-radius:var(--radius); padding:8px 12px; font-size:12.5px; color:var(--text-2); }
.dv-cutbtn{ margin-left:auto; background:var(--accent); color:var(--on-accent); border-radius:var(--radius); padding:3px 10px; font-weight:600; display:inline-flex; align-items:center; gap:4px; }
.dv-pontos{ width:88%; display:flex; flex-direction:column; gap:6px; text-align:left; }
.dv-pt-sec{ font-family:var(--mono); font-size:11px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--text-3); margin-top:6px; }
.dv-pt-sec:first-child{ margin-top:0; }
.dv-pt-item{ background:var(--sunken); border:1px solid var(--border); border-radius:var(--radius); padding:6px 10px; font-size:12px; color:var(--text-2); }
.dv-pt-t{ background:var(--accent-soft); color:var(--accent-text); border:1px solid var(--accent); border-radius:var(--radius); font-family:var(--mono); font-size:11px; padding:0 4px; margin-right:4px; }
.dv-done{ text-align:center; color:var(--success-text); }
.dv-done i{ font-size:32px; display:block; margin:0 auto 8px; }
.dv-done div{ color:var(--text); font-weight:600; font-size:16px; }
.dv-benes{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin-top:4px; }
.dv-benes span{ display:inline-flex; align-items:center; gap:6px; background:var(--sunken); border:1px solid var(--border); border-radius:var(--radius-pill); padding:4px 10px; font-size:11.5px; font-weight:600; color:var(--text-2); }
.dv-benes span i{ color:var(--accent-text); }
.dv-cursor{ position:absolute; left:360px; top:150px; z-index:5; color:#161616; filter:drop-shadow(0 1px 2px rgba(0,0,0,.4)); transition:left .9s var(--ease-out), top .9s var(--ease-out); }
.dark .dv-cursor{ color:#fafaf7; }
.dv-cursor i{ font-size:20px; }
.dv-cursor.click::after{ content:""; position:absolute; left:-7px; top:-7px; width:30px; height:30px; border:2px solid var(--accent); border-radius:50%; animation:dvripple .4s ease-out; }
@keyframes dvripple{ from{ transform:scale(.3); opacity:.85; } to{ transform:scale(1.3); opacity:0; } }
.dv-caption{ text-align:center; margin-top:16px; font-weight:600; font-size:15px; color:var(--text); }

/* ---------- Movimento ---------- */
@keyframes entrada{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }
.page-head, .ws-esquerda, .ws-direita, #progressoCard, #resultadoCard, .dv-caption.show{ animation:entrada .6s var(--ease-out) backwards; }
.ws-esquerda{ animation-delay:.06s; }
.ws-direita{ animation-delay:.12s; }

/* ---------- Progresso: animação, fases e detalhes ---------- */
.proc-topo{ display:flex; align-items:center; gap:14px; margin-bottom:20px; }
.proc-anim{ width:52px; height:52px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; gap:3px; border-radius:var(--radius-card); background:#161616; }
.dark .proc-anim{ background:var(--sunken); border:1px solid var(--border); }
.proc-anim span{ width:4px; height:26px; border-radius:2px; background:#ffcd00; transform:scaleY(.4); animation:procBarra 1.1s ease-in-out infinite; }
.proc-anim span:nth-child(1){ animation-delay:-.95s; }
.proc-anim span:nth-child(2){ animation-delay:-.7s; }
.proc-anim span:nth-child(3){ animation-delay:-.45s; }
.proc-anim span:nth-child(4){ animation-delay:-.8s; }
.proc-anim span:nth-child(5){ animation-delay:-.2s; }
.proc-anim .hi{ display:none; }
@keyframes procBarra{ 0%,100%{ transform:scaleY(.3); } 50%{ transform:scaleY(1); } }
.proc-info{ flex:1 1 auto; min-width:0; }
.proc-titulo{ font-size:17px; line-height:1.3; margin:0; }
.proc-det{ font-size:13px; color:var(--text-3); margin-top:2px; }
.proc-tempo{ flex:0 0 auto; align-self:flex-start; font-family:var(--mono); font-size:11.5px; color:var(--text-3); }

.falhou .proc-anim, .dark .falhou .proc-anim{ background:color-mix(in srgb,var(--danger) 12%,transparent); border:1px solid color-mix(in srgb,var(--danger) 28%,transparent); }
.falhou .proc-anim span{ display:none; }
.falhou .proc-anim .hi{ display:block; color:var(--danger-text); font-size:20px; }
.workspace:has(#progressoCard.falhou) .rv-ico{ animation:none; }

.fases{ list-style:none; margin:0; padding:0; }
.fase{ position:relative; display:flex; gap:12px; padding-bottom:14px; color:var(--text-3); font-size:14px; }
.fase:last-child{ padding-bottom:0; }
.fase:not(:last-child)::before{ content:""; position:absolute; left:10px; top:24px; bottom:2px; width:2px; background:var(--border); transition:background .3s var(--ease-out); }
.fase.feita::before{ background:var(--success); }
.fase-marca{ position:relative; width:22px; height:22px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; border:2px solid var(--border-strong); border-radius:50%; font-size:11px; transition:background .2s, border-color .2s; }
.fase-marca .hi{ display:none; vertical-align:0; }
.fase.ativa .fase-marca{ border-color:var(--border); border-top-color:var(--accent); animation:procGiro .9s linear infinite; }
.fase.feita .fase-marca{ background:var(--success); border-color:var(--success); color:#161616; }
.fase.feita .hi-tick-02{ display:block; }
.fase.erro .fase-marca{ background:var(--danger); border-color:var(--danger); color:#fff; }
.fase.erro .hi-alert-02{ display:block; }
@keyframes procGiro{ to{ transform:rotate(360deg); } }
.fase-corpo{ min-width:0; padding-top:1px; }
.fase-nome{ font-weight:500; }
.fase.ativa .fase-nome{ color:var(--text); font-weight:600; }
.fase.feita .fase-nome{ color:var(--text-2); }
.fase.erro .fase-nome{ color:var(--danger-text); font-weight:600; }
.fase-det{ font-family:var(--mono); font-size:11.5px; color:var(--text-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fase-det:empty{ display:none; }

.proc-log{ margin-top:18px; padding-top:14px; border-top:1px solid var(--border); }
.proc-log summary{ display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-3); cursor:pointer; list-style:none; }
.proc-log summary::-webkit-details-marker{ display:none; }
.proc-log summary::before{ content:""; border-left:5px solid currentColor; border-top:4px solid transparent; border-bottom:4px solid transparent; transition:transform .25s var(--ease-out); }
.proc-log[open] summary::before{ transform:rotate(90deg); }
.proc-log summary:hover{ color:var(--text); }
.proc-log .progress-log{ margin-top:10px; height:160px; }

@media (prefers-reduced-motion:reduce){
  *:not(.cena *), *:not(.cena *)::before, *:not(.cena *)::after{ animation-duration:.01ms!important; animation-delay:0s!important; animation-iteration-count:1!important; transition-duration:.01ms!important; scroll-behavior:auto!important; }
}

/* Política de Privacidade (Views/Home/Privacy.cshtml) */
.politica{ max-width:760px; color:var(--text-2); font-size:15px; line-height:1.65; }
.politica-cab{ margin-bottom:28px; }
.politica-selo{ display:inline-block; margin-bottom:12px; padding:2px 10px; border:1px solid var(--accent); border-radius:var(--radius); background:var(--accent-soft); color:var(--accent-text); font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; }
.politica h1{ font-size:28px; margin:0 0 8px; }
.politica-lead{ font-size:16px; color:var(--text); margin:0 0 6px; }
.politica-meta{ font-family:var(--mono); font-size:11.5px; color:var(--text-3); margin:0; }
.politica section{ padding:20px 0; border-top:1px solid var(--border); }
.politica h2{ font-size:18px; margin:0 0 10px; }
.politica ul{ padding-left:20px; margin:0 0 10px; }
.politica li{ margin-bottom:6px; }
.politica p{ margin:0 0 10px; }
.politica b{ color:var(--text); font-weight:600; }