/* kortez: uma folha só.
   Base neutra e escura (é ferramenta de vídeo: a imagem precisa de fundo que
   não brigue com ela), a marca só no acento, e status com cor de FUNÇÃO. */

:root{
  color-scheme:dark;
  --bg:#0f1013;
  --bg-2:#15171b;
  --bg-3:#1b1e23;
  --bg-4:#23272e;
  --bg-5:#2c313a;
  --campo:#101215;
  --linha:#262a31;
  --linha-2:#343943;
  --fg:#eceef1;
  --fg-2:#b9bec6;
  --fg-3:#8b929c;
  --fg-4:#6b727c;

  --acento:#ff7a2f;
  --acento-2:#ff9152;
  --acento-fg:#1a0d04;
  --acento-fraco:rgba(255,122,47,.14);
  --acento-linha:rgba(255,122,47,.45);

  --ok:#3fb950;     --ok-fraco:rgba(63,185,80,.14);
  --aviso:#e3a31d;  --aviso-fraco:rgba(227,163,29,.15);
  --erro:#f8514f;   --erro-fraco:rgba(248,81,79,.14);
  --info:#58a6ff;   --info-fraco:rgba(88,166,255,.14);

  --r1:6px; --r2:8px; --r3:12px;
  --sombra:0 12px 32px rgba(0,0,0,.45),0 2px 6px rgba(0,0,0,.3);
  --ui:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --lado:236px;
  --topo-trab:92px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:400 14px/1.45 var(--ui);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--acento-2);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4,p{margin:0}
[hidden]{display:none!important}
.tab{font-variant-numeric:tabular-nums}
.mono{font-family:var(--mono);font-size:12.5px}
.meta{color:var(--fg-3);font-size:13px}
.fraco{color:var(--fg-3)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--acento);outline-offset:2px}
::selection{background:rgba(255,122,47,.35)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--bg-5);border-radius:10px;border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-track{background:transparent}

/* ------------------------------------------------------------ botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
  height:36px;padding:0 14px;border-radius:var(--r2);border:1px solid var(--linha-2);
  background:var(--bg-4);color:var(--fg);font-weight:550;font-size:14px;cursor:pointer;
  white-space:nowrap;transition:background .12s,border-color .12s,color .12s;text-decoration:none}
.btn:hover{background:var(--bg-5);text-decoration:none}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn svg{width:16px;height:16px;flex:none}
.btn-primario{background:var(--acento);border-color:var(--acento);color:var(--acento-fg)}
.btn-primario:hover{background:var(--acento-2);border-color:var(--acento-2)}
.btn-fantasma{background:transparent;border-color:transparent;color:var(--fg-2)}
.btn-fantasma:hover{background:var(--bg-4);color:var(--fg)}
.btn-perigo{background:transparent;border-color:rgba(248,81,79,.5);color:#ff8a88}
.btn-perigo:hover{background:var(--erro-fraco)}
.btn-sm{height:30px;padding:0 10px;font-size:13px;border-radius:var(--r1)}
.btn-xs{height:26px;padding:0 8px;font-size:12.5px;border-radius:var(--r1);font-weight:500}
.btn-icone{width:36px;padding:0}
.btn.quebra{height:auto;min-height:30px;padding-block:5px;white-space:normal;text-align:left;overflow-wrap:anywhere;max-width:100%}
.btn-sm.btn-icone{width:30px}
.btn-bloco{width:100%}
.btn[data-ocupado]{position:relative;color:transparent!important}
.btn[data-ocupado]::after{content:"";position:absolute;width:16px;height:16px;border-radius:50%;
  border:2px solid currentColor;border-color:var(--fg) transparent var(--fg) transparent;animation:gira .8s linear infinite}
.btn-primario[data-ocupado]::after{border-color:var(--acento-fg) transparent var(--acento-fg) transparent}
.link{background:none;border:0;padding:0;color:var(--acento-2);cursor:pointer;font-weight:500}
.link:hover{text-decoration:underline}
.link-neutro{background:none;border:0;padding:0;color:var(--fg-2);cursor:pointer}
.link-neutro:hover{color:var(--fg);text-decoration:underline}
@keyframes gira{to{transform:rotate(360deg)}}
.gira{display:inline-block;width:14px;height:14px;border-radius:50%;border:2px solid currentColor;
  border-right-color:transparent;animation:gira .8s linear infinite;flex:none;vertical-align:-2px}

/* ------------------------------------------------------------ campos */
.campo{display:flex;flex-direction:column;gap:6px;min-width:0}
.campo>label,.rotulo{font-size:13px;font-weight:550;color:var(--fg-2)}
.dica{font-size:12.5px;color:var(--fg-3);line-height:1.4}
.dica.erro{color:#ff8a88}
input[type=text],input[type=email],input[type=password],input[type=url],input[type=number],input[type=search],select,textarea{
  width:100%;min-height:36px;padding:7px 10px;border-radius:var(--r2);border:1px solid var(--linha-2);
  background:var(--campo);color:var(--fg);outline:none;transition:border-color .12s,box-shadow .12s}
textarea{resize:vertical;min-height:80px;line-height:1.5}
textarea.cresce{field-sizing:content;max-height:60vh}
input:hover,select:hover,textarea:hover{border-color:#454b56}
input:focus,select:focus,textarea:focus{border-color:var(--acento);box-shadow:0 0 0 3px var(--acento-fraco)}
input:disabled,select:disabled,textarea:disabled{opacity:.6;cursor:not-allowed}
input::placeholder,textarea::placeholder{color:var(--fg-4)}
select{appearance:none;padding-right:30px;background-image:linear-gradient(45deg,transparent 50%,var(--fg-3) 50%),linear-gradient(135deg,var(--fg-3) 50%,transparent 50%);
  background-position:calc(100% - 15px) 55%,calc(100% - 10px) 55%;background-size:5px 5px;background-repeat:no-repeat}
input[type=checkbox]{accent-color:var(--acento);width:16px;height:16px;margin:0;cursor:pointer}
input[type=radio]{accent-color:var(--acento);margin:0}
input[type=range]{width:100%;accent-color:var(--acento);cursor:pointer}
input[type=color]{width:36px;height:36px;padding:2px;border-radius:var(--r2);border:1px solid var(--linha-2);background:var(--campo);cursor:pointer}
.linha-campos{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.form-termo{grid-template-columns:1fr 1.4fr auto;align-items:end}
@media (max-width:600px){.form-termo{grid-template-columns:1fr}}
.com-botao{display:flex;gap:8px}
.com-botao>input,.com-botao>select{flex:1;min-width:0}

/* segmentado */
.seg{display:inline-flex;flex-wrap:wrap;gap:2px;padding:2px;border-radius:var(--r2);background:var(--campo);border:1px solid var(--linha-2)}
.seg>button{height:30px;padding:0 11px;border:0;border-radius:6px;background:transparent;color:var(--fg-2);font-size:13px;font-weight:500;cursor:pointer;white-space:nowrap}
.seg>button:hover{color:var(--fg);background:var(--bg-4)}
.seg>button[aria-pressed=true]{background:var(--bg-5);color:var(--fg);box-shadow:inset 0 0 0 1px var(--linha-2)}
.seg>button:disabled{opacity:.45;cursor:not-allowed}
/* .cheio e não .bloco: .bloco é a seção empilhada da Legenda, e herdar a coluna
   deixava os botões com 19 px de altura (23/09/2026) */
.seg.cheio{display:flex}.seg.cheio>button{flex:1}

/* interruptor */
.switch{position:relative;display:inline-flex;align-items:center;gap:10px;cursor:pointer;user-select:none;font-weight:500}
/* o checkbox fica DENTRO do rótulo (position:relative acima): solto, ele se
   posicionava pela área de conteúdo, escapava do recorte do inspetor e dava
   204 px de rolagem vazia na etapa Legenda (23/09/2026) */
.switch input{position:absolute;left:0;top:0;opacity:0;width:1px;height:1px}
.switch .trilho{width:34px;height:20px;border-radius:20px;background:var(--bg-5);position:relative;transition:background .15s;flex:none}
.switch .trilho::after{content:"";position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:#fff;transition:transform .15s}
.switch input:checked+.trilho{background:var(--acento)}
.switch input:checked+.trilho::after{transform:translateX(14px)}
.switch input:focus-visible+.trilho{outline:2px solid var(--acento);outline-offset:2px}
.switch input:disabled+.trilho{opacity:.5}

/* opções em cartão (radio) */
.opcoes{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.opcao{display:flex;gap:10px;align-items:flex-start;padding:11px 12px;border-radius:var(--r2);border:1px solid var(--linha-2);background:var(--campo);cursor:pointer}
.opcao:hover{border-color:#4a505b}
.opcao:has(input:checked){border-color:var(--acento);background:var(--acento-fraco)}
.opcao input{margin-top:3px}
.opcao b{display:block;font-weight:600}
.opcao span{font-size:12.5px;color:var(--fg-3)}

/* ------------------------------------------------------------ selos */
.selo{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:999px;font-size:12px;font-weight:550;white-space:nowrap;
  background:var(--bg-4);color:var(--fg-2)}
.selo::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.9}
.selo.sem-ponto::before{display:none}
.selo.ok{background:var(--ok-fraco);color:#56d364}
.selo.aviso{background:var(--aviso-fraco);color:#f2b84b}
.selo.erro{background:var(--erro-fraco);color:#ff8a88}
.selo.info{background:var(--info-fraco);color:#79b8ff}
.selo.acento{background:var(--acento-fraco);color:var(--acento-2)}
.selo.rodando::before{width:8px;height:8px;border:1.5px solid currentColor;border-right-color:transparent;background:none;animation:gira .8s linear infinite}
.contador{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:18px;padding:0 6px;border-radius:9px;font-size:11.5px;font-weight:600;background:var(--bg-5);color:var(--fg-2)}
.contador.acento{background:var(--acento);color:var(--acento-fg)}

/* ------------------------------------------------------------ cartões */
.cartao{background:var(--bg-2);border:1px solid var(--linha);border-radius:var(--r3);padding:18px}
.cartao-cab{display:flex;align-items:center;gap:10px;margin-bottom:14px;min-height:24px}
.cartao-cab h2,.cartao-cab h3{font-size:15px;font-weight:600}
.cartao-cab .dir{margin-left:auto;display:flex;gap:8px;align-items:center}
.cartao>p+p{margin-top:8px}
.pilha{display:flex;flex-direction:column;gap:16px}
.pilha-sm{display:flex;flex-direction:column;gap:10px}
.grade-2{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.vazio{padding:36px 20px;text-align:center;color:var(--fg-3);border:1px dashed var(--linha-2);border-radius:var(--r3)}
.vazio b{display:block;color:var(--fg);font-size:15px;margin-bottom:4px}
.vazio .btn{margin-top:14px}
.aviso-caixa{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:var(--r2);background:var(--aviso-fraco);color:#f5d08a;font-size:13px}
.aviso-caixa.erro{background:var(--erro-fraco);color:#ffb1b0}
.aviso-caixa.info{background:var(--info-fraco);color:#a9d0ff}
.aviso-caixa .btn{margin-left:auto}
.dl{display:grid;grid-template-columns:auto 1fr;gap:8px 18px;margin:0}
.dl dt{color:var(--fg-3)}
.dl dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}

/* tabela */
.tabela{width:100%;border-collapse:collapse;font-size:13.5px}
.tabela th{text-align:left;font-weight:550;font-size:12.5px;color:var(--fg-3);padding:0 10px 8px;border-bottom:1px solid var(--linha)}
.tabela td{padding:9px 10px;border-bottom:1px solid var(--linha);vertical-align:middle}
.tabela tr:last-child td{border-bottom:0}
.tabela .num{text-align:right;font-variant-numeric:tabular-nums}
.tabela .acao{text-align:right;width:1%;white-space:nowrap}
.tabela .quem{overflow-wrap:anywhere}
.rolagem-x{overflow-x:auto}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:8px;padding:5px 6px 5px 10px;border-radius:var(--r2);background:var(--bg-4);border:1px solid var(--linha-2);font-size:13px;max-width:100%}
.chip b{font-weight:600}
.chip .sub{color:var(--fg-3);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chip button{display:inline-grid;place-items:center;width:22px;height:22px;border:0;border-radius:5px;background:transparent;color:var(--fg-3);cursor:pointer;font-size:13px}
.chip button:hover{background:var(--bg-5);color:var(--fg)}
.chip.risco{border-color:rgba(248,81,79,.4);background:var(--erro-fraco)}
.chip.sugerido{border-style:dashed}

/* ------------------------------------------------------------ app */
.app{display:grid;grid-template-columns:var(--lado) minmax(0,1fr);height:100dvh}
body[data-lado=estreito]{--lado:64px}

.lado{display:flex;flex-direction:column;gap:6px;padding:12px 10px;background:var(--bg-2);border-right:1px solid var(--linha);min-height:0;overflow:hidden auto}
.marca{display:flex;align-items:center;gap:9px;height:40px;padding:0 6px;margin-bottom:6px;border:0;background:none;cursor:pointer;color:var(--fg);text-align:left}
.marca img{width:26px;height:26px;flex:none}
.marca b{font-size:17px;font-weight:700;letter-spacing:-.01em}
.lado .novo{margin-bottom:10px}
.nav{display:flex;flex-direction:column;gap:2px}
.nav-item{display:flex;align-items:center;gap:11px;height:36px;padding:0 10px;border-radius:var(--r2);border:0;background:none;color:var(--fg-2);font-weight:500;cursor:pointer;text-align:left;width:100%}
.nav-item svg{width:18px;height:18px;flex:none;color:var(--fg-3)}
.nav-item:hover{background:var(--bg-4);color:var(--fg)}
.nav-item[aria-current=page]{background:var(--bg-4);color:var(--fg)}
.nav-item[aria-current=page] svg{color:var(--acento)}
.nav-item .contador{margin-left:auto}
.lado .pe{margin-top:auto;display:flex;flex-direction:column;gap:8px;padding-top:12px}
.saldo{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:var(--r2);background:var(--bg-3);border:1px solid var(--linha);cursor:pointer;text-align:left;color:var(--fg)}
.saldo:hover{border-color:var(--linha-2)}
.saldo b{font-size:15px;font-variant-numeric:tabular-nums}
.saldo span{font-size:12px;color:var(--fg-3)}
.saldo.zerado b{color:#ff8a88}
.conta-btn{display:flex;align-items:center;gap:10px;padding:6px;border-radius:var(--r2);border:0;background:none;cursor:pointer;text-align:left;color:var(--fg);width:100%}
.conta-btn:hover{background:var(--bg-4)}
.avatar{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#ffb36b,#e8590c);color:#1a0d04;font-weight:700;font-size:12px;flex:none}
.conta-btn .quem{min-width:0;display:flex;flex-direction:column}
.conta-btn .quem b{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.conta-btn .quem span{font-size:12px;color:var(--fg-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recolher{align-self:flex-start;margin-left:2px}
body[data-lado=estreito] .lado{align-items:center;padding:12px 8px}
body[data-lado=estreito] .marca b,
body[data-lado=estreito] .nav-item span,
body[data-lado=estreito] .nav-item .contador,
body[data-lado=estreito] .lado .novo span,
body[data-lado=estreito] .saldo,
body[data-lado=estreito] .conta-btn .quem{display:none}
body[data-lado=estreito] .nav-item{justify-content:center;padding:0;width:40px}
body[data-lado=estreito] .lado .novo{width:40px;padding:0}
body[data-lado=estreito] .conta-btn{justify-content:center;width:40px;padding:5px}
body[data-lado=estreito] .recolher{align-self:center;margin:0}

.principal{display:flex;flex-direction:column;min-width:0;min-height:0}
.faixa-espiar{display:flex;align-items:center;gap:12px;padding:8px 16px;background:#6b3408;color:#ffe3c7;font-size:13px}
.faixa-espiar .btn{margin-left:auto;height:28px;background:transparent;border-color:#ffe3c77a;color:#ffe3c7}
.conteudo{flex:1;min-height:0;overflow:auto;position:relative}
.pagina{max-width:1180px;margin:0 auto;padding:24px 28px 48px}
.pagina.estreita{max-width:820px}
.pagina-cab{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:20px;min-height:36px}
.pagina-cab h1{font-size:21px;font-weight:650;letter-spacing:-.01em}
.pagina-cab .dir{margin-left:auto;display:flex;gap:8px;align-items:center}

/* topo do celular */
.topo-movel{display:none}

/* ------------------------------------------------------------ trabalhos */
.filtros{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.filtros .busca{width:260px;margin-left:auto}
.abas{display:flex;gap:2px;flex-wrap:wrap}
.abas>button{height:32px;padding:0 12px;border-radius:var(--r2);border:0;background:none;color:var(--fg-3);font-weight:500;cursor:pointer;display:inline-flex;align-items:center;gap:7px}
.abas>button:hover{color:var(--fg);background:var(--bg-3)}
.abas>button[aria-pressed=true]{color:var(--fg);background:var(--bg-4)}
.abas .n{font-size:12px;color:var(--fg-3);font-variant-numeric:tabular-nums}
.lista-trab{border:1px solid var(--linha);border-radius:var(--r3);background:var(--bg-2);overflow:hidden}
.trab{display:grid;grid-template-columns:36px minmax(0,1fr) 190px 88px 70px 36px;align-items:center;gap:14px;padding:12px 14px;border-bottom:1px solid var(--linha);cursor:pointer}
.trab:last-child{border-bottom:0}
.trab:hover{background:var(--bg-3)}
.trab .ic{width:36px;height:36px;border-radius:var(--r2);display:grid;place-items:center;background:var(--bg-4);color:var(--fg-3)}
.trab .ic svg{width:18px;height:18px}
.trab .nome{min-width:0}
.trab .nome b{display:block;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trab .nome span{font-size:12.5px;color:var(--fg-3)}
.trab .col{font-size:13px;color:var(--fg-2);font-variant-numeric:tabular-nums}
.trab .col.dir{text-align:right}
.trab-cab{display:grid;grid-template-columns:36px minmax(0,1fr) 190px 88px 70px 36px;gap:14px;padding:9px 14px;border-bottom:1px solid var(--linha);font-size:12px;color:var(--fg-3);font-weight:550;background:var(--bg-2)}

/* ------------------------------------------------------------ trabalho aberto */
.trab-topo{border-bottom:1px solid var(--linha);background:var(--bg-2);flex:none}
.trab-linha{display:flex;align-items:center;gap:10px;height:52px;padding:0 14px 0 10px}
.trab-titulo{display:flex;align-items:baseline;gap:10px;min-width:0;flex:1}
.trab-titulo h1{font-size:16px;font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.trab-titulo .id{font-size:12.5px;color:var(--fg-3);font-variant-numeric:tabular-nums;flex:none}
.salvo{font-size:12.5px;color:var(--fg-3);white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.salvo[data-tipo=salvando]{color:var(--fg-2)}
.salvo[data-tipo=erro]{color:#ff8a88}
.salvo[data-tipo=pendente]{color:#f2b84b}
.acoes-topo{display:flex;align-items:center;gap:8px;flex:none}
.passos{display:flex;align-items:center;gap:2px;height:40px;padding:0 10px;overflow-x:auto;scrollbar-width:none}
.passos::-webkit-scrollbar{display:none}
.passo{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 10px 0 6px;border-radius:var(--r2);border:0;background:none;color:var(--fg-3);font-size:13px;font-weight:500;cursor:pointer;white-space:nowrap;flex:none}
.passo .n{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:11.5px;font-weight:650;background:var(--bg-4);color:var(--fg-3);flex:none}
.passo .n svg{width:12px;height:12px}
.passo:hover:not(:disabled){background:var(--bg-3);color:var(--fg)}
.passo[data-e=feito]{color:var(--fg-2)}
.passo[data-e=feito] .n{background:var(--ok-fraco);color:#56d364}
.passo[data-e=atual] .n{background:var(--acento);color:var(--acento-fg)}
.passo[data-e=atual]{color:var(--fg)}
.passo[data-e=rodando] .n{background:var(--info-fraco);color:#79b8ff}
.passo[data-e=falhou] .n{background:var(--erro-fraco);color:#ff8a88}
.passo[aria-current=step]{background:var(--bg-4);color:var(--fg)}
.passo:disabled{cursor:default;opacity:.55}
.passo-sep{width:14px;height:1px;background:var(--linha-2);flex:none}
.faixa{display:flex;align-items:center;gap:10px;padding:8px 16px;font-size:13px;border-bottom:1px solid var(--linha);flex:none}
.faixa.info{background:rgba(88,166,255,.08);color:#a9d0ff}
.faixa.erro{background:rgba(248,81,79,.09);color:#ffb1b0}
.faixa.aviso{background:rgba(227,163,29,.09);color:#f5d08a}
.faixa .btn{margin-left:auto}
.faixa b{color:inherit;font-weight:650}

/* processando (a tela inteira de espera) */
.esperando{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;min-height:60vh;padding:40px 20px}
.esperando .gira{width:28px;height:28px;border-width:3px;color:var(--info);margin-bottom:6px}
.esperando h2{font-size:18px;font-weight:650}
.esperando p{color:var(--fg-3);max-width:460px}

/* ------------------------------------------------------------ formulário de trabalho */
.form-trab{max-width:760px;margin:0 auto;padding:28px 28px 60px;display:flex;flex-direction:column;gap:22px}
.form-trab h2{font-size:15px;font-weight:600;margin-bottom:10px}
.secao{display:flex;flex-direction:column;gap:14px}
.secao+.secao{padding-top:22px;border-top:1px solid var(--linha)}
.duas-colunas{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px;max-width:1180px;margin:0 auto;padding:24px 28px 48px;align-items:start}
.duas-colunas.largo{grid-template-columns:minmax(0,1fr) 420px}
.duas-colunas>.fixa{position:sticky;top:0}

/* ------------------------------------------------------------ transcrição */
.transcricao{display:flex;flex-direction:column}
.par{display:grid;grid-template-columns:64px minmax(0,1fr);gap:14px;padding:10px 8px;border-radius:var(--r2)}
.par:hover{background:var(--bg-3)}
.par .tc{font-size:12.5px;color:var(--fg-3);padding-top:2px;font-variant-numeric:tabular-nums}
.par .tx{outline:none;border-radius:6px;padding:2px 6px;margin:-2px -6px;line-height:1.6;color:var(--fg);white-space:pre-wrap}
.par .tx:focus{background:var(--campo);box-shadow:0 0 0 1px var(--acento)}
.par.editado .tx{box-shadow:inset 3px 0 0 var(--acento);padding-left:10px}
.par .rodape-par{display:flex;gap:10px;align-items:center;margin-top:6px;font-size:12.5px;color:var(--acento-2)}
.medidas{display:flex;gap:28px;flex-wrap:wrap;margin-bottom:18px}
.medida b{display:block;font-size:20px;font-weight:650;font-variant-numeric:tabular-nums}
.medida span{font-size:12.5px;color:var(--fg-3)}

/* ------------------------------------------------------------ sala de edição (cortes e legenda) */
.sala{display:grid;grid-template-columns:300px minmax(0,1fr) 360px;height:100%;min-height:0}
.sala>*{min-height:0;position:relative}
.clipes,.inspetor-corpo,.palco-corpo{position:relative}
.sala-lista{display:flex;flex-direction:column;border-right:1px solid var(--linha);background:var(--bg-2)}
.sala-lista-cab{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--linha);min-height:48px}
.sala-lista-cab b{font-size:13.5px}
.sala-lista-cab .dir{margin-left:auto;display:flex;gap:4px}
.clipes{flex:1;overflow:auto;padding:6px}
.clipe{display:grid;grid-template-columns:auto 64px minmax(0,1fr);gap:10px;align-items:center;padding:7px 8px;border-radius:var(--r2);cursor:pointer;border:1px solid transparent}
.clipe:hover{background:var(--bg-3)}
.clipe[aria-selected=true]{background:var(--bg-4);border-color:var(--linha-2)}
.clipe .mini{width:64px;height:36px;border-radius:5px;background:var(--bg-4);position:relative;overflow:hidden;display:block}
.clipe .mini img{width:100%;height:100%;object-fit:cover;display:block}
.clipe .mini .quadro{border:0;border-radius:0;max-width:none;width:100%}
.clipe.vert{grid-template-columns:48px minmax(0,1fr)}
.clipe .mini.vertical{width:48px;height:auto;aspect-ratio:9/16}
.clipe .mini .dur{position:absolute;right:3px;bottom:2px;font-size:11px;padding:0 4px;border-radius:3px;background:rgba(0,0,0,.72);color:#fff;font-variant-numeric:tabular-nums}
.clipe .txt{min-width:0}
.clipe .txt b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13px;font-weight:550;line-height:1.35}
.clipe .txt span{font-size:12px;color:var(--fg-3);font-variant-numeric:tabular-nums}
.clipe.fora .mini,.clipe.fora .txt{opacity:.45}
.clipe .alertas-n{font-size:11.5px;color:#f2b84b;font-weight:600}
.sala-lista-pe{padding:10px 12px;border-top:1px solid var(--linha);font-size:12.5px;color:var(--fg-3)}

.palco{display:flex;flex-direction:column;min-width:0;background:var(--bg);overflow:auto}
.palco-cab{display:flex;align-items:center;gap:10px;padding:10px 16px;min-height:48px;border-bottom:1px solid var(--linha)}
.palco-cab h2{font-size:14px;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.palco-cab .dir{margin-left:auto;display:flex;gap:6px;align-items:center}
.palco-corpo{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:16px;min-height:0}
.video-caixa{position:relative;width:100%;max-width:880px;aspect-ratio:16/9;background:#000;border-radius:var(--r2);overflow:hidden}
.video-caixa video{width:100%;height:100%;object-fit:contain;display:block;background:#000}
.video-caixa .sobre{position:absolute;inset:0;display:grid;place-items:center;color:var(--fg-2);font-size:13px;text-align:center;padding:20px;background:rgba(0,0,0,.35)}
.controles-video{display:flex;align-items:center;gap:10px;width:100%;max-width:880px}
.controles-video .tempo{font-size:12.5px;color:var(--fg-2);font-variant-numeric:tabular-nums;white-space:nowrap}

/* linha do tempo do corte */
.tl{width:100%;max-width:880px;display:flex;flex-direction:column;gap:10px;padding:14px 16px;border:1px solid var(--linha);border-radius:var(--r3);background:var(--bg-2)}
.tl-cab{display:flex;align-items:center;gap:10px;font-size:13px}
.tl-cab b{font-weight:600}
.tl-cab .dir{margin-left:auto;display:flex;gap:6px;align-items:center}
.tl-trilho{position:relative;height:44px;border-radius:6px;background:var(--campo);border:1px solid var(--linha-2);cursor:pointer;touch-action:none;user-select:none}
.tl-fala{position:absolute;top:14px;height:16px;background:rgba(255,255,255,.09);border-radius:2px;pointer-events:none}
.tl-sel{position:absolute;top:-1px;bottom:-1px;background:var(--acento-fraco);border:1px solid var(--acento);border-radius:6px;pointer-events:none}
.tl-trecho{position:absolute;top:10px;height:24px;background:rgba(255,122,47,.28);border-radius:3px;pointer-events:none}
.tl-alca{position:absolute;top:-4px;bottom:-4px;width:14px;margin-left:-7px;border-radius:5px;background:var(--acento);border:0;cursor:ew-resize;padding:0;display:grid;place-items:center;box-shadow:0 1px 4px rgba(0,0,0,.5)}
.tl-alca::after{content:"";width:2px;height:16px;border-radius:2px;background:rgba(0,0,0,.4)}
.tl-cabeca{position:absolute;top:-6px;bottom:-6px;width:2px;margin-left:-1px;background:#fff;pointer-events:none;box-shadow:0 0 0 1px rgba(0,0,0,.5)}
.tl-regua{display:flex;justify-content:space-between;font-size:11.5px;color:var(--fg-4);font-variant-numeric:tabular-nums;margin-top:-4px}
.tl-bordas{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tl-borda{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.tl-borda label{font-size:12.5px;color:var(--fg-3);width:40px}
.tl-borda input{width:108px;min-height:32px;height:32px;text-align:center;font-variant-numeric:tabular-nums;font-family:var(--mono);font-size:13px}

.inspetor{display:flex;flex-direction:column;border-left:1px solid var(--linha);background:var(--bg-2);min-width:0}
.inspetor-abas{display:flex;border-bottom:1px solid var(--linha);flex:none}
.inspetor-abas button{flex:1;height:48px;border:0;background:none;color:var(--fg-3);font-weight:550;cursor:pointer;border-bottom:2px solid transparent}
.inspetor-abas button:hover{color:var(--fg)}
.inspetor-abas button[aria-selected=true]{color:var(--fg);border-bottom-color:var(--acento)}
.inspetor-corpo{flex:1;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:18px}
.inspetor h3{font-size:13px;font-weight:600;color:var(--fg-2);text-transform:none}
.bloco{display:flex;flex-direction:column;gap:10px}
.bloco+.bloco{padding-top:18px;border-top:1px solid var(--linha)}
.bloco-cab{display:flex;align-items:center;gap:8px}
.bloco-cab .dir{margin-left:auto}
.porque{font-size:13px;color:var(--fg-2);line-height:1.5}
.diag{font-size:12.5px;display:flex;gap:6px;align-items:flex-start}
.diag.bom{color:#56d364}
.diag.mau{color:#f2b84b}
.alerta{display:flex;flex-direction:column;gap:8px;padding:10px 12px;border-radius:var(--r2);background:var(--aviso-fraco);border:1px solid rgba(227,163,29,.28);font-size:13px;color:#f5d08a}
.alerta.grave{background:var(--erro-fraco);border-color:rgba(248,81,79,.32);color:#ffb1b0}
.alerta .acoes{display:flex;gap:6px;flex-wrap:wrap}
.alerta .acoes .btn{background:rgba(0,0,0,.25)}
.valor-rotulo{display:flex;justify-content:space-between;font-size:13px;color:var(--fg-2)}
.valor-rotulo output,.valor-rotulo span{color:var(--fg-3);font-variant-numeric:tabular-nums}

/* palco vertical (9:16) */
.palco-vertical{display:flex;gap:18px;align-items:center;justify-content:center;flex-wrap:wrap}
.palco-vertical .quadro{width:min(330px,calc((100dvh - 290px) * 9 / 16));max-width:none;border-radius:12px}
.previas-borda{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.previas-borda figure{margin:0;display:flex;flex-direction:column;gap:6px;align-items:center;font-size:12.5px;color:var(--fg-3)}
.previas-borda video{width:180px;aspect-ratio:9/16;background:#000;border-radius:var(--r2)}

/* predefinidos / estilos */
.predefs{display:grid;grid-template-columns:repeat(auto-fill,minmax(68px,1fr));gap:6px}
.predef{display:flex;flex-direction:column;gap:6px;padding:6px;border-radius:var(--r2);border:1px solid var(--linha);background:var(--campo);cursor:pointer;text-align:left;position:relative;color:var(--fg)}
.predef:hover{border-color:#4a505b}
.predef[aria-pressed=true]{border-color:var(--acento);box-shadow:0 0 0 1px var(--acento)}
.predef .quadro{max-width:none;border-radius:6px;border:0}
.predef .nm{font-size:12px;font-weight:550;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.predef .x{position:absolute;top:3px;right:3px;width:22px;height:22px;border-radius:5px;border:0;background:rgba(0,0,0,.6);color:#fff;cursor:pointer;display:none;place-items:center}
.predef:hover .x{display:grid}
.estilos-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:14px}
.estilo-cartao{display:flex;flex-direction:column;border:1px solid var(--linha);border-radius:var(--r3);background:var(--bg-2);overflow:hidden}
.estilo-cartao .quadro{max-width:none;border-radius:0;border:0}
.estilo-cartao .corpo{padding:10px 12px;display:flex;flex-direction:column;gap:6px}
.estilo-cartao .corpo b{font-size:13.5px;font-weight:600}
.estilo-cartao .corpo span{font-size:12px;color:var(--fg-3)}
.estilo-cartao .pe{display:flex;flex-wrap:wrap;gap:6px;padding:0 12px 12px}
.estilo-cartao .pe .btn{flex:1 1 auto}
.estilo-cartao.padrao{border-color:var(--acento-linha)}

/* cores */
.cores{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.cores>button{width:28px;height:28px;border-radius:50%;border:2px solid var(--bg-2);box-shadow:0 0 0 1px var(--linha-2);cursor:pointer}
.cores>button[aria-pressed=true]{box-shadow:0 0 0 2px var(--fg)}
.cor-livre{display:flex;gap:6px;align-items:center}
.cor-livre input[type=text]{width:92px;font-family:var(--mono);text-transform:uppercase}

/* movimento */
.edicoes{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px}
.edicao{display:flex;flex-direction:column;border:1px solid var(--linha-2);border-radius:var(--r2);background:var(--campo);overflow:hidden;cursor:pointer;padding:0;text-align:left;color:var(--fg)}
.edicao:hover{border-color:#4a505b}
.edicao[aria-pressed=true]{border-color:var(--acento);box-shadow:0 0 0 1px var(--acento)}
.edicao video{width:100%;aspect-ratio:3/4;object-fit:cover;background:#000;display:block}
.edicao span{padding:8px 10px;display:flex;flex-direction:column;gap:2px}
.edicao b{font-size:13px;font-weight:600}
.edicao small{font-size:12px;color:var(--fg-3);line-height:1.35}
.tracking-viewer{display:flex;gap:14px;align-items:flex-start;justify-content:center;flex-wrap:wrap}
.tracking-viewer figure{margin:0;display:flex;flex-direction:column;gap:6px;font-size:12.5px;color:var(--fg-3);align-items:center}
.tracking-viewer canvas{max-width:100%;border-radius:var(--r2);background:#000}
.tracking-viewer canvas.fonte{width:min(480px,100%)}
.tracking-viewer canvas.saida{width:200px}
.tracking-ctrl{display:flex;gap:10px;align-items:center;width:100%;max-width:700px}

/* ------------------------------------------------------------ entregas */
.resumo-entregas{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.resumo-entregas .n{font-size:14px;color:var(--fg-2)}
.resumo-entregas .n b{color:var(--fg);font-size:16px}
.resumo-entregas .dir{margin-left:auto;display:flex;gap:8px}
.entregas{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}
.entrega{display:flex;flex-direction:column;border:1px solid var(--linha);border-radius:var(--r3);background:var(--bg-2);overflow:hidden}
.entrega video{width:100%;aspect-ratio:9/16;background:#000;display:block}
.entrega .corpo{padding:10px 12px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;flex:1}
.entrega .corpo b{font-size:13.5px;font-weight:600;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.entrega .falhas{margin:0;padding-left:16px;font-size:12.5px;color:#f5d08a}
.entrega .pe{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:0 12px 12px}
.entrega.ruim{border-color:rgba(227,163,29,.4)}
/* aula e episódio: o vídeo inteiro é 16:9, e cabem menos por linha */
.entregas.deitadas{grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr))}
.entregas.deitadas .entrega video{aspect-ratio:16/9}
/* a unidade de aula: no inspetor, uma borda por linha e o campo do tamanho
   de 1:20:53 -- lado a lado, o tempo cabia em três caracteres */
.tl-bordas.empilhadas{grid-template-columns:1fr}
.tl-bordas.empilhadas .tl-borda input{flex:1 1 auto;width:auto}

/* ------------------------------------------------------------ créditos */
.saldo-grande{font-size:40px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.02em;line-height:1}
.saldo-grande small{font-size:15px;font-weight:500;color:var(--fg-3);margin-left:6px;letter-spacing:0}
.pacotes{display:grid;gap:10px}
.pacote{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:14px;align-items:center;padding:12px 14px;border-radius:var(--r2);border:1px solid var(--linha-2);background:var(--campo)}
.pacote b{font-size:15px}
.pacote .preco{font-weight:600;font-variant-numeric:tabular-nums}
.valor-pos{color:#56d364}
.valor-estornado{color:var(--fg-4);text-decoration:line-through}

/* ------------------------------------------------------------ entrada */
.entrada{position:fixed;inset:0;z-index:40;display:grid;grid-template-columns:1fr 1fr;background:var(--bg)}
.entrada .palco-demo{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:radial-gradient(ellipse at 50% 40%,#1d1a18 0,var(--bg) 70%);border-right:1px solid var(--linha)}
.entrada .lado-form{display:flex;align-items:center;justify-content:center;padding:32px 20px;overflow:auto}
.caixa-entrada{width:100%;max-width:380px;display:flex;flex-direction:column;gap:16px}
.caixa-entrada .marca{padding:0;margin:0 0 6px}
.caixa-entrada h1{font-size:24px;font-weight:700;letter-spacing:-.01em}
.caixa-entrada .sub{color:var(--fg-3)}
.caixa-entrada .btn{height:40px}
.ou{display:flex;align-items:center;gap:12px;color:var(--fg-4);font-size:12.5px}
.ou::before,.ou::after{content:"";flex:1;height:1px;background:var(--linha)}
.troca{text-align:center;font-size:13.5px;color:var(--fg-3)}
.demo{position:relative;width:min(300px,56vh);aspect-ratio:9/16;border-radius:16px;overflow:hidden;background:linear-gradient(170deg,#23262c,#121417);border:1px solid var(--linha-2);box-shadow:var(--sombra);--acento-demo:#ff7a2f}
.demo .luz{position:absolute;inset:-40%;background:radial-gradient(circle at 40% 35%,rgba(255,150,80,.18),transparent 45%);animation:luz 9s ease-in-out infinite alternate}
@keyframes luz{to{transform:translate(8%,6%)}}
.demo .vulto{position:absolute;left:50%;bottom:26%;width:46%;aspect-ratio:1;border-radius:50%;translate:-50% 0;background:#3a3d44}
.demo .vulto::after{content:"";position:absolute;left:50%;top:92%;width:190%;aspect-ratio:1.7;translate:-50% 0;border-radius:50% 50% 0 0;background:#34373e}
.demo .gancho{position:absolute;left:9%;right:9%;top:8%;padding:10px 12px;border-radius:6px;background:rgba(10,12,14,.86);color:#fff;font:800 15px/1.25 KortezTipo-montserrat,var(--ui);text-align:center;text-transform:uppercase;letter-spacing:.02em}
.demo .gancho::before{content:"";position:absolute;left:12px;top:-5px;width:34px;height:4px;border-radius:2px;background:var(--acento-demo)}
.demo .legenda{position:absolute;left:7%;right:7%;bottom:13%;color:#fff;font:800 19px/1.3 KortezTipo-montserrat,var(--ui);text-align:center;text-shadow:0 2px 0 rgba(0,0,0,.5)}
.demo .legenda i{font-style:normal;color:var(--acento-demo)}
.demo .barra{position:absolute;left:0;bottom:0;height:4px;background:var(--acento-demo);transition:width .25s linear}
.demo-nota{font-size:13px;color:var(--fg-3)}
.demo-nota b{color:var(--fg-2);font-weight:600}

/* ------------------------------------------------------------ camadas: menu, modal, toast */
.menu{position:fixed;z-index:60;min-width:220px;padding:6px;border-radius:var(--r2);background:var(--bg-3);border:1px solid var(--linha-2);box-shadow:var(--sombra);display:flex;flex-direction:column}
.menu button,.menu a{display:flex;align-items:center;gap:10px;height:34px;padding:0 10px;border:0;border-radius:6px;background:none;color:var(--fg);font-size:13.5px;cursor:pointer;text-align:left;text-decoration:none;white-space:nowrap}
.menu button:hover,.menu a:hover{background:var(--bg-5);text-decoration:none}
.menu svg{width:16px;height:16px;flex:none;color:var(--fg-3)}
.menu .perigo svg{color:inherit}
.menu button:disabled{opacity:.45;cursor:not-allowed}
.menu .perigo{color:#ff8a88}
.menu hr{border:0;border-top:1px solid var(--linha-2);margin:5px 2px}
.menu .rot{padding:6px 10px 4px;font-size:12px;color:var(--fg-3)}
.menu select{margin:2px 4px 6px;width:calc(100% - 8px)}

dialog.modal{border:1px solid var(--linha-2);border-radius:14px;background:var(--bg-3);color:var(--fg);padding:0;width:min(460px,calc(100vw - 32px));box-shadow:var(--sombra)}
dialog.modal::backdrop{background:rgba(0,0,0,.6)}
.modal-corpo{padding:22px 22px 8px;display:flex;flex-direction:column;gap:10px}
.modal-corpo h2{font-size:17px;font-weight:650}
.modal-corpo p{color:var(--fg-2)}
.modal-pe{display:flex;justify-content:flex-end;gap:8px;padding:16px 22px 20px}
.modal-preco{display:flex;align-items:baseline;gap:8px;padding:12px 14px;border-radius:var(--r2);background:var(--campo);border:1px solid var(--linha-2)}
.modal-preco b{font-size:24px;font-variant-numeric:tabular-nums}
.modal-preco span{color:var(--fg-3)}
dialog.lightbox{border:0;background:transparent;padding:0;max-width:92vw;max-height:92vh}
dialog.lightbox::backdrop{background:rgba(0,0,0,.85)}
dialog.lightbox img{max-width:92vw;max-height:88vh;border-radius:var(--r2);display:block}

.toasts{position:fixed;left:50%;bottom:20px;translate:-50% 0;z-index:80;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none;width:min(560px,calc(100vw - 24px))}
.toast{pointer-events:auto;display:flex;align-items:flex-start;gap:10px;padding:10px 12px 10px 14px;border-radius:var(--r2);background:var(--bg-4);border:1px solid var(--linha-2);box-shadow:var(--sombra);font-size:13.5px;animation:sobe .18s ease-out;max-width:100%}
.toast.erro{border-color:rgba(248,81,79,.5)}
.toast.ok{border-color:rgba(63,185,80,.45)}
.toast .x{margin-left:auto;border:0;background:none;color:var(--fg-3);cursor:pointer;font-size:15px;line-height:1;padding:2px 4px}
@keyframes sobe{from{opacity:0;transform:translateY(6px)}}
.carregando{position:fixed;inset:0;display:grid;place-items:center;background:var(--bg);z-index:30;color:var(--fg-3)}
.carregando .caixa{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;padding:20px}

/* ------------------------------------------------------------ largura média */
@media (max-width:1320px){
  .sala{grid-template-columns:260px minmax(0,1fr) 330px}
  .passo-sep{width:8px}
  .trab,.trab-cab{grid-template-columns:36px minmax(0,1fr) 170px 80px 36px}
  .trab .col.data,.trab-cab .col.data{display:none}
}
@media (max-width:1100px){
  .sala{grid-template-columns:230px minmax(0,1fr) 300px}
  .duas-colunas,.duas-colunas.largo{grid-template-columns:minmax(0,1fr)}
  .duas-colunas>.fixa{position:static}
}

/* ------------------------------------------------------------ celular */
@media (max-width:900px){
  body{--topo-movel:52px}
  .app{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
  .topo-movel{display:flex;align-items:center;gap:8px;height:52px;padding:0 10px;border-bottom:1px solid var(--linha);background:var(--bg-2)}
  .topo-movel .marca{margin:0;height:36px}
  .topo-movel .dir{margin-left:auto;display:flex;gap:6px;align-items:center}
  .topo-movel .saldo-chip{font-size:12.5px;color:var(--fg-2);padding:4px 10px;border-radius:999px;background:var(--bg-4);border:0;font-variant-numeric:tabular-nums}
  .lado{position:fixed;z-index:50;inset:0 auto 0 0;width:min(300px,86vw);transform:translateX(-102%);transition:transform .2s ease;box-shadow:var(--sombra)}
  body[data-menu=aberto] .lado{transform:none}
  body[data-lado=estreito]{--lado:236px}
  body[data-lado=estreito] .lado{align-items:stretch}
  body[data-lado=estreito] .marca b,body[data-lado=estreito] .nav-item span,body[data-lado=estreito] .lado .novo span,
  body[data-lado=estreito] .conta-btn .quem{display:revert}
  body[data-lado=estreito] .saldo{display:flex}
  body[data-lado=estreito] .nav-item{justify-content:flex-start;padding:0 10px;width:100%}
  body[data-lado=estreito] .lado .novo{width:100%;padding:0 14px}
  body[data-lado=estreito] .conta-btn{justify-content:flex-start;width:100%}
  .recolher{display:none}
  .fundo-menu{position:fixed;inset:0;z-index:45;background:rgba(0,0,0,.55)}
  .pagina{padding:18px 14px 28px}
  .pagina-cab h1{font-size:19px}
  .filtros .busca{width:100%;margin-left:0}
  .trab{grid-template-columns:36px minmax(0,1fr) 30px;row-gap:6px}
  .trab .ic{grid-row:span 2}
  .trab .col{display:none}
  .trab .col.estado{display:block;grid-column:2;grid-row:2}
  .trab [data-menu]{grid-column:3;grid-row:1/span 2}
  .trab-cab{display:none}
  .trab-linha{height:48px;padding:0 6px}
  .trab-titulo .id{display:none}
  .acoes-topo #b-acao,.acoes-topo .salvo{display:none}
  .palco-cab{display:none}
  .barra-acao{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;align-items:center;gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:var(--bg-2);border-top:1px solid var(--linha)}
  .barra-acao .btn-primario{flex:1;height:42px}
  .conteudo.com-barra{padding-bottom:70px}
  .sala{display:flex;flex-direction:column;height:auto;min-height:100%}
  .sala-lista{border-right:0;border-bottom:1px solid var(--linha)}
  .sala-lista .clipes{display:flex;gap:6px;overflow-x:auto;padding:8px}
  .sala-lista .clipe{grid-template-columns:auto;min-width:118px;max-width:118px;padding:6px}
  .sala-lista .clipe .mini{width:104px;height:58px}
  .sala-lista .clipe .mini.vertical{width:56px;height:auto;margin-inline:auto}
  .sala-lista .clipe.vert{grid-template-columns:auto;min-width:92px;max-width:92px}
  .sala-lista .clipe .txt b{font-size:12px}
  .sala-lista .clipe input{position:absolute;top:10px;left:10px;margin:0;z-index:2}
  .sala-lista .clipe{position:relative}
  .sala-lista-pe{display:none}
  .palco{overflow:visible}
  .palco-corpo{padding:12px}
  .palco-vertical .quadro{width:min(260px,62vw)}
  .inspetor{border-left:0;border-top:1px solid var(--linha)}
  .inspetor-corpo{overflow:visible}
  .tl-bordas{grid-template-columns:1fr}
  .entrada{grid-template-columns:1fr}
  .entrada .palco-demo{display:none}
  .form-trab{padding:18px 14px 28px}
  .duas-colunas{padding:18px 14px 28px}
  .entregas{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
  .resumo-entregas .dir{margin-left:0;width:100%}
  .pacote{grid-template-columns:1fr auto}
  .pacote .btn{grid-column:1/-1}
}
@media (min-width:901px){.barra-acao{display:none}.so-movel{display:none!important}}
@media (max-width:900px){
  .toasts{bottom:84px}
  .btn-xs{height:32px}
  .topo-movel .saldo-chip{padding:7px 12px}
  .chip button{width:30px;height:30px}
}
@media (hover:none){.predef .x{display:grid}}
.estado-topo{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 12px;border-radius:var(--r2);background:var(--info-fraco);color:#a9d0ff;font-size:13px;font-weight:550;white-space:nowrap}
.barra-acao .estado-topo{flex:1;justify-content:center;height:42px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---- moldura (smoke 23/09) ---- */
/* a fita esconde os nomes só quando não cabe: a casca mede e põe .compacta */
.passos.compacta .passo .rot{display:none}
.passos.compacta .passo[aria-current=step] .rot,.passos.compacta .passo[data-e=atual] .rot,
.passos.compacta .passo[data-e=rodando] .rot,.passos.compacta .passo[data-e=falhou] .rot{display:inline}
.passo[data-e=falhou]{color:#ff8a88}
/* o portão espera a máquina: neutro, porque laranja é a vez da pessoa */
.passo[data-e=espera] .n{background:var(--bg-5);color:var(--fg-2)}
.faixa>.txt{min-width:0;overflow-wrap:anywhere}
.trab-titulo .selo{flex:none;align-self:center}
.barra-acao .btn{flex:1;height:42px}
/* entregas: MP4 e SRT cabem no cartão de 150 px sem cortar a borda */
.entrega .pe{grid-template-columns:repeat(2,minmax(0,1fr))}
.entrega .pe .btn{min-width:0;padding:0 6px}
.resumo-entregas .seg{flex-wrap:nowrap;max-width:100%}
.resumo-entregas .seg .conta{margin-left:6px;font-variant-numeric:tabular-nums;color:var(--fg-3)}
.resumo-entregas .seg .conta.ok{color:#56d364}
.resumo-entregas .seg .conta.aviso{color:#f2b84b}
.resumo-entregas .baixar{margin-left:auto}
@media (max-width:900px){
  body[data-rota=trabalho] .topo-movel{display:none}
  body[data-rota=trabalho] .app{grid-template-rows:minmax(0,1fr)}
  .trab-linha{gap:4px}
  .resumo-entregas{gap:10px}
  .resumo-entregas .seg>button{padding:0 9px}
  .entrega .pe .btn svg{display:none}
}

/* ---- conta (smoke 23/09) ---- */
/* Perfil e Créditos: a coluna mínima de 320 px estourava a tela de 320 */
.grade-2{grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr))}
.dl dd{min-width:0;overflow-wrap:anywhere}
/* Vocabulário: no celular a origem desce para baixo do termo e a lixeira fica na tela */
.tabela-termos td.termo,.tabela-termos td.variacoes{overflow-wrap:anywhere}
.tabela-termos .origem-sob{display:none}
.selo.sugerido{background:transparent;border:1px dashed var(--linha-2);color:var(--fg-3)}
@media (max-width:600px){
  .tabela-termos .origem{display:none}
  .tabela-termos .origem-sob{display:block;margin-top:4px}
}
/* Equipe: convite pendente é uma linha com o e-mail, não um campo com a URL */
.convites{margin-top:14px;border-top:1px solid var(--linha)}
.convite{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:10px 0;border-bottom:1px solid var(--linha)}
.convite:last-child{border-bottom:0;padding-bottom:0}
.convite .quem{flex:1 1 200px;min-width:0;display:flex;flex-direction:column;gap:2px;overflow-wrap:anywhere}
.convite .acoes{display:flex;flex-wrap:wrap;gap:6px}
/* Estilos: botões alinhados no pé do cartão, selo Padrão do tamanho do texto, duas colunas no celular pequeno */
.estilo-cartao .corpo{flex:1;align-items:flex-start}
@media (max-width:400px){
  .estilos-grade{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .estilo-cartao .pe .btn{height:auto;min-height:32px;padding-block:5px;white-space:normal}
}
/* Trabalhos: título das colunas à direita como os valores; Criado só some abaixo de 1100 px */
.trab-cab .col.dir{text-align:right}
@media (min-width:1101px) and (max-width:1320px){
  .trab,.trab-cab{grid-template-columns:36px minmax(0,1fr) 170px 80px 70px 36px}
  .trab .col.data,.trab-cab .col.data{display:block}
}
@media (min-width:901px) and (max-width:1320px){
  .filtros .busca{width:auto;flex:1 1 180px;max-width:260px}
}
@media (max-width:1100px){
  .trab .nome b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
}
@media (max-width:900px){
  .abas{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;max-width:100%}
  .abas>button{flex:none}
}

/* ---- inicio (smoke 23/09) ---- */
/* fato parado: nem máquina trabalhando (azul) nem alerta (âmbar) */
.aviso-caixa.neutro{background:var(--bg-3);color:var(--fg-2)}
.alinha-topo{align-items:start}
.campos-base{align-items:end}
/* Arquivos: com duas câmeras, empilha antes de espremer o cartão do áudio */
.grade-arquivos{grid-template-columns:repeat(auto-fit,minmax(min(460px,100%),1fr));align-items:start}
.arq-lista{list-style:none;margin:0;padding:0}
.arq-lista li{display:flex;flex-direction:column;gap:2px;min-width:0;padding:9px 10px;border-top:1px solid var(--linha)}
.arq-lista .nome{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tabela .som{text-align:right;white-space:nowrap}
@media (max-width:900px){
  .arq-tabela{display:none}
  .par{grid-template-columns:minmax(0,1fr);gap:2px}
  .medidas{gap:16px}
  .medida b{font-size:16px}
}

/* ---- legenda (smoke 23/09) ---- */
.inspetor-abas button{white-space:nowrap}
/* nome do estilo em até 2 linhas; em 11 px a palavra mais longa (Documental) cabe inteira nas 4 colunas */
.predefs{grid-template-columns:repeat(auto-fill,minmax(74px,1fr));gap:4px}
.predef{padding:3px}
.predef .nm{font-size:11px;font-weight:500;white-space:normal;text-overflow:clip;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
.previa-vazia{aspect-ratio:16/9;display:grid;place-items:center;padding:16px;text-align:center;border:1px dashed var(--linha-2);border-radius:var(--r2);background:var(--campo)}
.previa-acab{align-self:flex-start}
@media (max-width:1100px){.sala-legenda .palco-cab h2{display:none}}
@media (max-width:900px){
  /* os botões da prévia ficam acima do quadro; as abas sobem para antes dele e grudam no topo */
  .sala-legenda .palco-cab{display:flex;justify-content:center;min-height:0;padding:10px 12px 0;border-bottom:0}
  .sala-legenda .palco-cab .dir{display:flex;flex-wrap:wrap;justify-content:center;margin-left:0}
  .sala-legenda .inspetor{display:contents}
  .sala-legenda .inspetor-abas{order:1;position:sticky;top:0;z-index:3;background:var(--bg-2)}
  .sala-legenda .palco{order:2}
  .sala-legenda .inspetor-corpo{order:3;background:var(--bg-2);border-top:1px solid var(--linha);scroll-margin-top:49px}
  .sala-legenda .palco-vertical .quadro{width:min(200px,50vw)}
}

/* ---- cortes (smoke 23/09) ---- */
/* em 1024 e 1280 a lista de Cortes cabe o título, e Início e Fim cabem no palco */
@media (max-width:1320px){.sala-cortes{grid-template-columns:280px minmax(0,1fr) 320px}}
@media (max-width:1100px){.sala-cortes{grid-template-columns:280px minmax(0,1fr) 280px}}
.sala-lista-cab b{white-space:nowrap}
/* o contador de alertas é âmbar (revisar), e "1 alerta" não se parte */
.clipe .txt .alertas-n{color:#f2b84b;white-space:nowrap}
/* a vaga da miniatura aparece até na linha escolhida; sem quadro, o ícone */
.clipe .mini{background:var(--bg-3);box-shadow:inset 0 0 0 1px var(--linha-2)}
.clipe .mini .sem-quadro{position:absolute;inset:0;display:grid;place-items:center;color:var(--fg-4)}
.clipe .mini .sem-quadro svg{width:18px;height:18px}
.clipe .mini>img{position:relative;z-index:1}
.clipe .mini>.dur{z-index:2}
/* tocar sobre o vídeo é neutro: o laranja fica para a ação principal da etapa */
.tocar-sobre{height:44px;padding:0 18px;border-radius:999px;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.7);color:#fff}
.tocar-sobre:hover{background:rgba(0,0,0,.72)}
/* Início e Fim numa linha só; quando o palco estreita, um embaixo do outro */
.palco-cortes .tl{container-type:inline-size}
.tl-borda{flex-wrap:nowrap}
.tl-borda input{flex:0 1 108px;min-width:0}
@container (max-width:540px){.tl-bordas{grid-template-columns:1fr}}
/* a linha inteira pede uns 263 px: abaixo disso volta a quebrar, e a coluna
   nunca passa da largura do cartão */
.tl-bordas>.tl-borda{min-width:0}
@container (max-width:270px){.tl-borda{flex-wrap:wrap}}
@media (max-width:900px){
  /* cartões do carrossel alinhados pelo topo, qualquer que seja a altura do vizinho */
  .sala-lista .clipe{align-content:start;align-items:start}
  /* o título do corte escolhido segue acima do vídeo; anterior e próximo, o carrossel já faz */
  .palco-cortes .palco-cab{display:flex}
  .palco-cortes .palco-cab .dir{display:none}
  .palco-corpo.vertical .video-caixa{aspect-ratio:9/16;width:auto;max-width:100%;height:min(50dvh,420px)}
}
/* fonte em pé: o vídeo em pé à esquerda, controles e linha do tempo à direita.
   Só quando o palco tem largura para os dois; senão, a caixa segue 16:9. */
.palco-cortes{container:palco / inline-size}
@container palco (min-width:540px){
  .palco-corpo.vertical{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto 1fr;align-items:start;align-content:start;column-gap:16px}
  .palco-corpo.vertical .video-caixa{grid-row:1/span 2;aspect-ratio:9/16;width:auto;max-width:none;height:min(640px,calc(100dvh - 190px),calc((100cqw - 348px) * 16 / 9))}
}