@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400..700&family=Hanken+Grotesk:wght@300;400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&family=Jost:wght@400;500;600;700&family=Montserrat:wght@400;500;600&display=swap');
  :root{
    /* SUPERFÍCIES NEUTRAS. Elas eram verde-petróleo saturado (#041F22,
       #082F32...), e o resultado era verde sobre verde sobre verde: o fundo,
       o cartão, a lista e a bolha do chat na mesma família, sem separação
       entre o que é moldura e o que é conteúdo. O dono comparou lado a lado
       com o WhatsApp (06/08), onde as superfícies são neutras e a cor só
       aparece na bolha.
       O verde da marca não sai: fica no MENU LATERAL (--sidebg), nos botões,
       nos selos e nos destaques, que é onde ele identifica. Uma cor que está
       em tudo não identifica nada. */
    --canvas:#0C1416; --paper:#141D1F; --paper2:#1B2527; --colbg:#101819; --sidebg:#0A1F21;
    --ink:#F2F4F3; --muted:#A9B9B8; --faint:#8CA09F;
    --line:#283537; --line-soft:#1E2A2C;
    --petroleo:#087A80; --petroleo-700:#06686D; --petroleo-900:#054B4F; --petroleo-tint:rgba(8,122,128,.16);
    /* O petroleo COMO TEXTO. Ele foi escolhido para fundo claro: sobre o
       cartao escuro (#082F32) fica em 2.8:1, abaixo do minimo legivel de
       4.5:1 — a aba ATIVA ficava mais dificil de ler que as inativas. Aqui
       ele clareia; no tema claro continua o mesmo valor, entao nada muda la. */
    --petroleo-txt:#4FC3C9;
    /* O vermelho de FUNDO, quando o texto por cima é branco. O --danger do
       tema escuro é claro de proposito (ele precisa ser lido SOBRE o escuro),
       e branco sobre ele fica em 3:1 — o badge de notificacao e o botao de
       excluir ficavam em cima do limite. Aqui o fundo escurece; a cor de
       TEXTO continua sendo --danger. */
    --danger-solido:#C0392B; --danger-selo:#F79389;
    --gold:#C7A052; --gold-soft:#D8BD80; --gold-tint:rgba(199,160,82,.14); --gold-line:rgba(199,160,82,.36);
    --accent:#16BED0; --on-gold:#1C292B;
    --wv-dock-bg:#101819;
    --neutral:#2A3739;
    --ok:#3ecf7a; --ok-bg:rgba(62,207,122,.13); --warn:#e6b455; --warn-bg:rgba(230,180,85,.13); --danger:#ef6b5e; --danger-bg:rgba(239,107,94,.13); --info:#5ab3d6; --info-bg:rgba(90,179,214,.13);
    --sans:'Hanken Grotesk','Montserrat',system-ui,sans-serif; --serif:'Fraunces','Jost',Georgia,serif; --head:var(--sans); --mono:'JetBrains Mono',ui-monospace,monospace;
    /* Fonte dos NÚMEROS dos dashboards (redesenho BI/Financeiro 13/09):
       mono tabular alinha colunas e o valor para de "dançar" ao atualizar. */
    --num:'IBM Plex Mono','JetBrains Mono',ui-monospace,monospace;
    --r:14px; --shadow:0 1px 2px rgba(0,0,0,.25),0 6px 18px -10px rgba(0,0,0,.5);
  }
  body.light{
    --canvas:#F2F4F3; --paper:#FFFFFF; --paper2:#F7F9F8; --colbg:#E9EDEC; --sidebg:#062E31;
    --ink:#1C292B; --muted:#667675; --faint:#6E7D7C;
    --line:#D7E0DF; --line-soft:#EAEFEE;
    --petroleo:#087A80; --petroleo-700:#06686D; --petroleo-900:#054B4F; --petroleo-tint:rgba(8,122,128,.10);
    --petroleo-txt:#087A80;
    --danger-solido:#C0392B; --danger-selo:#C0392B;
    --gold:#C7A052; --gold-soft:#D8BD80; --gold-tint:rgba(199,160,82,.12); --gold-line:rgba(199,160,82,.34);
    --accent:#16BED0; --on-gold:#1C292B;
    --wv-dock-bg:#EFF3F2;
    --neutral:#D0D6D6;
    --ok:#1f9d57; --ok-bg:#e6f4ec; --warn:#b8811f; --warn-bg:#f7efdd; --danger:#c0392b; --danger-bg:#fbeceb; --info:#2b6f8f; --info-bg:#e6f0f5;
    --shadow:0 1px 2px rgba(0,40,40,.05),0 4px 14px -8px rgba(0,40,40,.12);
  }
    *{box-sizing:border-box;margin:0;padding:0}
  body{font-family:var(--sans);background:var(--canvas);color:var(--ink);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
  .app{display:flex;min-height:100vh}
  button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
  a{color:inherit;text-decoration:none}

  /* sidebar */
  .side{width:238px;flex:0 0 238px;background:var(--sidebg);color:#cdd6d4;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
  .brand{padding:22px 20px 8px}
  .brand-logo{display:block;width:100%;max-width:192px;height:auto;margin:0 auto}
  .wv-emb{background:#fff;border-radius:11px;display:grid;place-items:center;box-shadow:0 1px 3px rgba(0,0,0,.18)}
  .brand-tag{text-align:center;font-size:9.5px;letter-spacing:3px;text-transform:uppercase;color:var(--gold-soft);margin-top:8px}
  .nav{padding:10px 14px;display:flex;flex-direction:column;gap:2px;flex:1;overflow-y:auto}
  .nav-label{font-size:9.5px;letter-spacing:2.2px;text-transform:uppercase;color:#7fa3a0;padding:15px 10px 6px}
  .nav-item{display:flex;align-items:center;gap:11px;padding:6px 11px;border-radius:9px;color:#bccbc9;font-size:13.5px;font-weight:500;transition:background .16s,color .16s;text-align:left;width:100%}
  .nav-item svg{width:18px;height:18px;opacity:.85}
  .nav-item:hover{background:rgba(255,255,255,.06);color:#fff}
  .nav-item.active{background:rgba(255,255,255,.1);color:#fff}
  .nav-item.active svg{opacity:1;color:var(--gold-soft)}
  /* Item que mora dentro de outro (Mural interno dentro de Pessoas). Recuo
     e ícone menor dizem a hierarquia sem precisar de rótulo explicando. */
  .nav-filho{padding-left:30px;font-size:12.8px;color:#a9bcba}
  .nav-filho svg{width:15px;height:15px;opacity:.7}
  .nav-badge{margin-left:auto;background:var(--gold);color:var(--on-gold);font-size:10.5px;font-weight:700;border-radius:9px;padding:1px 7px;font-family:var(--sans)}
  .side-foot{padding:14px;border-top:1px solid rgba(255,255,255,.08)}
  .me{display:flex;align-items:center;gap:10px}
  .me-av{width:34px;height:34px;border-radius:9px;background:var(--gold);color:var(--on-gold);display:grid;place-items:center;font-family:var(--head);font-weight:600;font-size:13px}
  .me-n{font-size:12.5px;font-weight:600;color:#fff}
  .me-r{font-size:11px;color:#8fb0ad}

  /* main */
  .main{flex:1;min-width:0;display:flex;flex-direction:column}
  /* Topbar compacta: menos altura, título menor (não compete com o título do
     modal aberto). Pedido do Wadson. */
  .top{position:sticky;top:0;z-index:20;background:color-mix(in srgb, var(--canvas) 88%, transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;padding:8px 26px}
  .burger{display:none}
  .top-title{font-family:var(--head);font-size:15px;font-weight:600;white-space:nowrap;
    min-width:0;overflow:hidden;text-overflow:ellipsis;flex:0 1 auto}
  /* Os itens da direita têm largura fixa; quem cede espaço é a busca. Sem o
     flex:0 0 auto aqui e o min-width:0 na busca, a topbar estourava a janela e
     criava rolagem lateral em TODAS as telas (o conteúdo aparecia cortado). */
  .top-actions{margin-left:auto;display:flex;align-items:center;gap:10px;flex:0 0 auto}
  .search{display:flex;align-items:center;gap:8px;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:7px 13px;color:var(--faint);font-size:13px;min-width:0}
  .top > .searchwrap{flex:1 1 auto;min-width:0;max-width:620px;margin:0 auto}
  .search svg{width:15px;height:15px}
  .search input{border:none;outline:none;font-family:inherit;font-size:13px;color:var(--ink);width:100%;background:none}
  .content{padding:24px 28px 60px;max-width:none;width:100%}
  .page{display:none;animation:fade .25s ease}
  .page.active{display:block}
  @keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

  .eyebrow{font-size:10.5px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);font-weight:700}
  .h1{font-family:var(--head);font-size:23px;font-weight:600;margin:4px 0 2px}
  .lead{color:var(--muted);font-size:13.5px;margin-bottom:20px}
  .sec-title{font-family:var(--head);font-size:16px;font-weight:600;margin:26px 0 12px;display:flex;align-items:center;justify-content:space-between;gap:12px}

  /* kpis */
  .kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
  .kpi{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:16px 17px;box-shadow:var(--shadow)}
  .kpi-k{font-size:11.5px;color:var(--faint);text-transform:uppercase;letter-spacing:.4px;font-weight:600}
  .kpi-v{font-family:var(--head);font-size:26px;font-weight:600;margin-top:8px;line-height:1}
  .kpi-sub{font-size:12px;color:var(--muted);margin-top:6px}
  .bar{height:6px;border-radius:6px;background:var(--line);margin-top:10px;overflow:hidden}
  .bar > i{display:block;height:100%;background:linear-gradient(90deg,var(--gold-soft),var(--gold));border-radius:6px}

  .grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
  .card-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px 18px;border-bottom:1px solid var(--line-soft)}
  .card-t{font-family:var(--head);font-size:15px;font-weight:600}
  .card-b{padding:6px 0}

  /* rows / list */
  .row{display:flex;align-items:center;gap:13px;padding:13px 18px;border-bottom:1px solid var(--line-soft)}
  .row:last-child{border-bottom:none}
  .row-ic{width:38px;height:38px;flex:0 0 38px;border-radius:10px;display:grid;place-items:center;background:var(--petroleo-tint);color:var(--petroleo-txt)}
  .row-ic svg{width:18px;height:18px}
  .row-main{flex:1;min-width:0}
  .row-t{font-weight:600;font-size:13.5px}
  .row-s{font-size:12px;color:var(--faint);margin-top:2px}
  /* Link dentro de comentário (15/09): clicável e visível; URL comprida
     quebra sem estourar a janela. */
  .row-s a{color:var(--info);font-weight:600;word-break:break-all}
  .row-r{text-align:right;white-space:nowrap}
  .mono{font-family:var(--mono)}

  /* table */
  /* Tabela padrão do sistema: espaçamento entre linhas COMPACTO e uniforme,
     no mesmo ritmo das tabelas do Financeiro (linha única ~34px; linhas com
     subtítulo crescem só o necessário). Números vão à direita (.num). */
  .tbl{width:100%;border-collapse:collapse}
  .tbl th{text-align:left;font-size:11px;letter-spacing:.4px;text-transform:uppercase;color:var(--faint);font-weight:700;padding:9px 14px;border-bottom:1px solid var(--line)}
  .tbl td{padding:8px 14px;border-bottom:1px solid var(--line-soft);font-size:13px;vertical-align:middle}
  .tbl tr:last-child td{border-bottom:none}
  .tbl tr:hover td{background:var(--paper2)}
  /* Cabeçalho de coluna numérica acompanha o valor (à direita). */
  .tbl th.num{text-align:right}
  .t-name{font-weight:600}
  .t-sub{font-size:11.5px;color:var(--faint)}

  /* badges */
  .badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;letter-spacing:.3px;border-radius:7px;padding:3px 9px;text-transform:uppercase;white-space:nowrap}
  .b-fixo{background:var(--petroleo-tint);color:var(--petroleo-txt)}
  .b-avulso{background:var(--gold-tint);color:var(--gold)}
  .b-ok{background:var(--ok-bg);color:var(--ok)}
  .b-warn{background:var(--warn-bg);color:var(--warn)}
  /* O texto do selo é mais claro que o --danger geral: sobre o proprio tint
     ele ficava em 4.1:1, logo abaixo do minimo legivel. O --danger continua
     o mesmo para texto solto sobre o fundo da pagina, onde ja se le bem. */
  .b-danger{background:var(--danger-bg);color:var(--danger-selo)}
  .b-info{background:var(--info-bg);color:var(--info)}
  .b-mut{background:var(--line-soft);color:var(--muted)}

  /* buttons */
  .btn{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;border-radius:10px;padding:9px 14px;transition:filter .15s,background .15s,border-color .15s}
  .btn svg{width:15px;height:15px}
  .btn-solid{background:var(--petroleo);color:#fff}
  .btn-solid:hover{background:var(--petroleo-700)}
  .btn-gold{background:var(--gold);color:var(--on-gold)}
  .btn-gold:hover{filter:brightness(.97)}
  .btn-ghost{background:var(--paper);border:1px solid var(--line);color:var(--ink)}
  .btn-ghost:hover{border-color:var(--petroleo-txt)}
  .btn-sm{padding:6px 10px;font-size:12px;border-radius:8px}

  /* kanban */
  .kanban{display:grid;grid-template-columns:repeat(5,minmax(200px,1fr));gap:12px;overflow-x:auto;padding-bottom:8px}
  .col{background:var(--colbg);border-radius:12px;padding:10px;min-width:200px}
  .col-h{display:flex;align-items:center;justify-content:space-between;padding:4px 6px 10px;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
  .col-h .n{background:var(--paper);border-radius:7px;padding:1px 7px;color:var(--petroleo-txt);font-size:11px}
  .col-sum{font-family:var(--mono);font-size:11px;color:var(--faint);padding:0 6px 8px;font-weight:400}
  .lead-card{background:var(--paper);border:1px solid var(--line);border-radius:11px;padding:12px;margin-bottom:9px;box-shadow:var(--shadow)}
  .lead-t{font-weight:600;font-size:13px}
  .lead-svc{font-size:11.5px;color:var(--muted);margin-top:3px}
  .lead-foot{display:flex;align-items:center;justify-content:space-between;margin-top:10px}
  .lead-val{font-family:var(--mono);font-size:12.5px;font-weight:600;color:var(--petroleo-txt)}
  .lead-adv{display:flex;align-items:center;gap:8px}
  .lead-av{width:22px;height:22px;border-radius:6px;background:var(--petroleo-tint);color:var(--petroleo-txt);display:grid;place-items:center;font-size:10px;font-weight:700}
  .lead-next{width:26px;height:26px;border-radius:7px;border:1px solid var(--line);display:grid;place-items:center;color:var(--petroleo-txt)}
  .lead-next:hover{background:var(--petroleo);color:#fff;border-color:var(--petroleo-txt)}
  .lead-next svg{width:14px;height:14px}
  .lead-origin{font-size:10px;color:var(--faint);margin-top:8px;text-transform:uppercase;letter-spacing:.3px}

  /* segmented */
  /* max-width + overflow: com muitas abas a barra empurrava a PÁGINA inteira
     para o lado e nascia rolagem horizontal no conteúdo. Agora quem rola é a
     própria barra. */
  .seg{display:inline-flex;background:var(--colbg);border-radius:10px;padding:3px;gap:2px;margin-bottom:16px;
       max-width:100%;overflow-x:auto;scrollbar-width:none}
  .seg::-webkit-scrollbar{display:none}
  .seg>*{flex:0 0 auto}
  .seg button{font-size:12.5px;font-weight:600;color:var(--muted);border-radius:8px;padding:7px 14px}
  .seg button.on{background:var(--paper);color:var(--petroleo-txt);box-shadow:var(--shadow)}

  /* modal */
  .overlay{position:fixed;inset:0;background:rgba(0,25,26,.5);backdrop-filter:blur(2px);display:none;align-items:flex-start;justify-content:center;padding:40px 16px;z-index:80;overflow-y:auto}
  .overlay.show{display:flex}
  .modal{background:var(--paper);border-radius:16px;width:100%;max-width:600px;box-shadow:0 30px 70px -20px rgba(0,30,30,.5);animation:pop .2s ease}
  @keyframes pop{from{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}
  .modal-h{display:flex;align-items:flex-start;gap:13px;padding:20px 22px 14px;border-bottom:1px solid var(--line-soft)}
  .modal-ico{width:40px;height:40px;flex:0 0 40px;border-radius:11px;background:var(--petroleo-tint);color:var(--petroleo-txt);display:grid;place-items:center}
  .modal-ico svg{width:20px;height:20px}
  .modal-h h3{font-family:var(--head);font-size:20px;font-weight:600}
  .modal-h p{font-size:12.5px;color:var(--muted);margin-top:2px}
  .modal-h .x{margin-left:auto;width:32px;height:32px;border-radius:8px;color:var(--faint);display:grid;place-items:center}
  .modal-h .x:hover{background:var(--line-soft)}
  .modal-h .x svg{width:18px;height:18px}
  .modal-b{padding:18px 22px 22px}
  .field{margin-bottom:14px}
  .field label{display:block;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:6px}
  .field input,.field select,.field textarea{width:100%;font-family:inherit;font-size:13.5px;color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:11px 12px;background:var(--paper);outline:none}
  .field input:focus,.field select:focus,.field textarea:focus{border-color:var(--petroleo-txt)}
  .field textarea{min-height:80px;resize:vertical}
  .field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .modal-foot{display:flex;justify-content:flex-end;gap:10px;margin-top:6px}
  .mh-ic{width:32px;height:32px;border-radius:8px;color:var(--faint);display:grid;place-items:center}
  .mh-ic:hover{background:var(--line-soft);color:var(--ink)}
  .mh-ic svg{width:17px;height:17px}
  .dl{display:flex;flex-direction:column;gap:0}
  /* Alinhamento padrão: todo bloco label/valor dentro de card ganha respiro lateral. */
  .card-b > .dl{padding:0 16px}
  .dl-row{display:flex;gap:14px;padding:9px 2px;border-bottom:1px solid var(--line-soft)}
  .dl-row:last-child{border-bottom:none}
  .dl-k{flex:0 0 132px;color:var(--muted);font-size:13px}
  .dl-v{flex:1;min-width:0}
  .dl-lg .dl-row{padding:12px 2px}
  .kpi-band{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:12px}
  .kpi-card{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:11px 14px;display:flex;flex-direction:column;justify-content:center;min-height:74px}
  .kpi-card .kpi-lbl{font-size:11.5px;color:var(--muted);font-weight:500}
  .kpi-card .kpi-v{font-size:23px;font-family:var(--head);font-weight:600;line-height:1.05;margin-top:1px}
  .kpi-card .kpi-x{font-size:11px;color:var(--faint);margin-top:2px}
  @media(max-width:900px){.kpi-band{grid-template-columns:repeat(2,1fr)}}
  /* Meu Painel: densidade estilo ADVBOX */
  #dashBody .card{box-shadow:none;border-radius:12px}
  #dashBody .sec-title{margin:16px 0 8px;font-size:14.5px}
  #dashBody .card-h{padding:12px 15px}
  #dashBody .card-b{padding:3px 0}
  #dashBody .row{padding:10px 15px}
  #dashBody .cptool{margin:4px 0 10px}
  #dashBody .mp-top{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:stretch}
  #dashBody .mp-top > .card{display:flex;flex-direction:column}
  #dashBody .mp-top > .card > .card-b{flex:1;min-height:0;display:flex;flex-direction:column;overflow:auto}
  @media(max-width:1180px){#dashBody .mp-top{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:640px){#dashBody .mp-top{grid-template-columns:1fr}}
  .nav-group{font-size:9.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--gold-soft);opacity:.72;padding:11px 15px 4px;font-weight:700}
  body.snav .nav-group{display:none}
  .chk-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:5px 14px;margin-top:5px;max-height:156px;overflow:auto;border:1px solid var(--line);border-radius:10px;padding:9px 11px}
  .chk{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink);cursor:pointer}
  .chk input{width:15px;height:15px;accent-color:var(--petroleo-txt);flex:0 0 15px}
  .preview{background:var(--canvas);border:1px solid var(--line);border-radius:12px;padding:16px;margin-top:6px;font-size:12.5px;line-height:1.6;max-height:280px;overflow-y:auto}
  .preview h4{font-family:var(--head);font-size:14px;margin-bottom:8px;color:var(--petroleo-txt)}
  .preview .cl{margin:8px 0}
  .preview b{color:var(--ink)}

  /* toast */
  .toast-wrap{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:200;display:flex;flex-direction:column;gap:8px;align-items:center}
  .toast{background:var(--petroleo);color:#fff;font-size:13px;padding:11px 18px;border-radius:11px;box-shadow:0 12px 30px -10px rgba(0,30,30,.6);animation:tin .25s ease}
  @keyframes tin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

  .empty{padding:26px 18px;text-align:center;color:var(--faint);font-size:13px}

  /* RH */
  .rh-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
  .rh-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:16px;cursor:pointer;transition:transform .18s,box-shadow .18s,border-color .18s}
  .rh-card:hover{transform:translateY(-2px);border-color:var(--petroleo-txt)}
  .rh-top{display:flex;align-items:center;gap:11px}
  .rh-av{width:42px;height:42px;border-radius:11px;background:var(--gold-tint);color:var(--gold);display:grid;place-items:center;font-family:var(--head);font-weight:600;font-size:15px}
  .rh-n{font-weight:600;font-size:14px}
  .rh-p{font-size:11.5px;color:var(--faint)}
  .rh-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:13px}
  .rh-kpi{background:var(--canvas);border-radius:9px;padding:8px 6px;text-align:center}
  .rh-kpi b{display:block;font-family:var(--head);font-size:15px;color:var(--petroleo-txt)}
  .rh-kpi span{font-size:9.5px;color:var(--faint);text-transform:uppercase;letter-spacing:.3px}
  .rh-car{margin-top:12px}
  .rh-car-l{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-bottom:5px}
  .track{display:flex;gap:5px;margin:14px 0 4px}
  .track .stp{flex:1;text-align:center;font-size:10px;color:var(--faint);position:relative;padding-top:14px}
  .track .stp::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:9px;height:9px;border-radius:50%;background:var(--line)}
  .track .stp.done::before{background:var(--gold)}
  .track .stp.curr::before{background:var(--petroleo);box-shadow:0 0 0 3px var(--petroleo-tint)}
  .track .stp.curr{color:var(--petroleo-txt);font-weight:700}
  .aval-note{background:var(--gold-tint);border:1px solid var(--gold-line);border-radius:11px;padding:11px 13px;font-size:12.5px;margin-top:12px}
  .aval-note b{font-family:var(--head)}
  .metas{margin-top:10px}
  .metas li{font-size:12.5px;color:var(--muted);margin:5px 0 5px 18px}
  .cli-dem{max-height:180px;overflow-y:auto}

  /* links / chips */
  .chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
  .chip{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;border-radius:7px;padding:3px 8px;border:1px solid var(--line);color:var(--muted);background:var(--paper)}
  .chip svg{width:11px;height:11px}
  .chip.on{border-color:var(--petroleo-txt);color:var(--petroleo-txt);background:var(--petroleo-tint)}
  .chip.sp{border-color:#bcd3e8;color:#2b6f8f;background:#eaf2f8}
  .tri-card{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:10px;box-shadow:var(--shadow)}
  .tri-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
  .tri-proto{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--petroleo-txt);background:var(--petroleo-tint);border-radius:7px;padding:3px 9px}
  .tri-t{font-weight:600;font-size:14px;margin-top:8px}
  .tri-s{font-size:12px;color:var(--faint);margin-top:2px}
  .tri-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;flex-wrap:wrap}

  /* RH competências e PDI */
  .comp{margin:7px 0}
  .comp-l{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:4px}
  .comp-l b{color:var(--ink)}
  .pdi{list-style:none;margin-top:6px}
  .pdi li{display:flex;align-items:center;gap:9px;font-size:12.5px;padding:8px 0;border-bottom:1px solid var(--line-soft)}
  .pdi li:last-child{border-bottom:none}
  .pdi .st{margin-left:auto}

  /* coletivo */
  .col-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  @media (max-width:820px){.col-grid{grid-template-columns:1fr}}

  /* produtos */
  .prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
  @media (max-width:1080px){.prod-grid{grid-template-columns:1fr 1fr}}
  @media (max-width:640px){.prod-grid{grid-template-columns:1fr}}
  .prod{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:16px;display:flex;flex-direction:column}
  .prod-t{font-family:var(--head);font-size:14.5px;font-weight:600}
  .prod-d{font-size:12px;color:var(--muted);margin-top:5px;flex:1}
  .prod-meta{display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-size:12px}
  .prod-tk{font-family:var(--mono);font-weight:600;color:var(--petroleo-txt)}

  /* manuais */
  .man-read{font-size:11px;color:var(--faint)}
  .man-bar{width:90px;height:5px;border-radius:5px;background:var(--line);overflow:hidden;margin-top:4px}
  .man-bar i{display:block;height:100%;background:var(--gold)}
  @media (max-width:1080px){.rh-grid{grid-template-columns:1fr 1fr}}
  @media (max-width:640px){.rh-grid{grid-template-columns:1fr}}

  @media (max-width:1080px){.kpi-grid{grid-template-columns:1fr 1fr}}
  @media (max-width:920px){
    .side{position:fixed;left:0;top:0;z-index:60;transform:translateX(-100%);transition:transform .28s ease}
    .side.open{transform:none}
    .grid2{grid-template-columns:1fr}
    .burger{display:grid;place-items:center;width:38px;height:38px;border-radius:9px;border:1px solid var(--line);background:var(--paper)}
    .burger svg{width:18px;height:18px}
    .search{display:none}
    .scrim{position:fixed;inset:0;background:rgba(0,20,20,.4);z-index:55;display:none}
    .scrim.show{display:block}
  }
  @media (max-width:560px){.kpi-grid{grid-template-columns:1fr}.content{padding:18px 16px 60px}.top{padding:12px 16px}}
  @media (max-width:1000px){.dash2col{grid-template-columns:1fr !important}}
  /* Escada de prioridade da topbar. O que é decorativo sai primeiro; busca e
     "+ Adicionar" ficam até o fim. Medido: abaixo de ~1200px o conjunto não
     cabia mais e vazava para fora da janela. */
  @media (max-width:1200px){.avs,.score-chip{display:none}.top-actions{gap:8px}}
  @media (max-width:1000px){.top-title{display:none}}

  /* ADVBOX-inspired */
  .score-chip{display:inline-flex;align-items:center;gap:7px;background:var(--petroleo);color:#fff;border-radius:10px;padding:8px 13px;font-size:12.5px;font-weight:700}
  .score-chip svg{width:14px;height:14px;color:var(--gold-soft)}
  .qadd{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(135deg,var(--gold-soft),var(--gold));color:var(--on-gold);border-radius:10px;padding:9px 13px;font-size:13px;font-weight:700;box-shadow:0 6px 16px -10px rgba(168,132,47,.8)}
  .qadd svg{width:15px;height:15px}
  .pts{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--gold);background:var(--gold-tint);border-radius:7px;padding:2px 7px}
  .rank-pos{width:26px;height:26px;border-radius:8px;background:var(--petroleo-tint);color:var(--petroleo-txt);display:grid;place-items:center;font-family:var(--head);font-weight:700;font-size:12px}
  .rank-pos.g1{background:var(--gold);color:var(--on-gold)}
  .sug{display:flex;align-items:center;gap:10px;background:var(--gold-tint);border:1px solid var(--gold-line);border-radius:12px;padding:11px 14px;font-size:13px;margin-bottom:14px}
  .sug svg{width:16px;height:16px;color:var(--gold)}
  .int-row{display:flex;align-items:flex-start;gap:11px;padding:13px 16px;border-bottom:1px solid var(--line-soft)}
  .int-row:last-child{border-bottom:none}
  .int-row input[type=checkbox]{margin-top:4px;accent-color:#00393D;width:16px;height:16px}
  .prazo-sug{display:flex;gap:6px;margin-top:7px;flex-wrap:wrap}
  .fila-card{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:15px 16px;margin-bottom:10px;box-shadow:var(--shadow)}
  .fila-orig{font-family:var(--mono);font-size:11.5px;color:var(--faint);background:var(--canvas);border-radius:9px;padding:9px 11px;margin:9px 0}
  .fila-trad{font-size:13px;line-height:1.55;background:var(--petroleo-tint);border-radius:9px;padding:10px 12px}
  .ag-day{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:var(--gold);font-weight:700;margin:16px 0 8px}
  .ia-pre{background:var(--canvas);border:1px solid var(--line);border-radius:12px;padding:14px;margin-top:10px}
  .ia-pre .field{margin-bottom:10px}
  .ia-task{display:flex;gap:8px;align-items:center;margin-bottom:8px}
  .ia-task input{flex:1}
  .ia-task .dt{width:110px;flex:0 0 110px}

  /* toolbar / tags / mini kanban */
  .toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
  .tool-in{display:flex;align-items:center;gap:7px;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:8px 11px;font-size:12.5px;color:var(--faint);min-width:200px;flex:1;max-width:280px}
  .tool-in svg{width:14px;height:14px}
  .tool-in input{border:none;outline:none;font-family:inherit;font-size:12.5px;width:100%;background:none;color:var(--ink)}
  .tag{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;border-radius:7px;padding:3px 9px;background:var(--paper);border:1px solid var(--line);color:var(--muted);cursor:pointer}
  .tag::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--neutral)}
  .tag.t1::before{background:var(--gold)} .tag.t2::before{background:var(--petroleo)} .tag.t3::before{background:#2b6f8f} .tag.t4::before{background:#c0392b}
  .tag.on{border-color:var(--petroleo-txt);color:var(--petroleo-txt);background:var(--petroleo-tint)}
  .kanban.mini{grid-template-columns:repeat(3,1fr)}
  .kanban.mini .lead-card{padding:9px 11px;margin-bottom:7px}
  .kanban.mini .lead-t{font-size:12px}
  .btn-claude{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;color:#fff;background:var(--petroleo);border-radius:10px;padding:8px 13px}
  .btn-claude svg{width:14px;height:14px;color:var(--gold-soft)}
  .btn-claude:hover{background:var(--petroleo-700)}

  /* ADVBOX v2 */
  .avs{display:flex;align-items:center}
  .avs .av{width:28px;height:28px;border-radius:50%;background:var(--petroleo-tint);color:var(--ink);border:2px solid var(--canvas);display:grid;place-items:center;font-size:10px;font-weight:700;margin-left:-7px;font-family:var(--head)}
  .avs .av:first-child{margin-left:0}
  .avs .av.more{background:var(--gold);color:var(--on-gold)}
  .tgl{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:var(--paper);display:grid;place-items:center;color:var(--muted)}
  .tgl svg{width:17px;height:17px}
  .bellb{position:relative;width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:var(--paper);display:grid;place-items:center;color:var(--muted)}
  .bellb svg{width:17px;height:17px}
  .bellb .bb{position:absolute;top:-5px;right:-5px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--danger-solido);color:#fff;font-size:10px;font-weight:700;display:grid;place-items:center;border:2px solid var(--canvas)}
  .addwrap{position:relative}
  .addmenu{position:absolute;right:0;top:46px;background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);min-width:220px;padding:6px;display:none;z-index:90}
  .addmenu.show{display:block}
  /* Abre para CIMA quando a linha está no rodapé da lista (senão o menu de
     papel, com 6 itens, estoura o cartão e fica cortado). */
  .addmenu.up{top:auto;bottom:calc(100% + 6px)}
  .addmenu button{display:flex;align-items:center;gap:10px;width:100%;text-align:left;font-size:13px;padding:10px 11px;border-radius:9px;color:var(--ink)}
  .addmenu button:hover{background:var(--paper2)}
  .addmenu svg{width:15px;height:15px;color:var(--gold);flex:0 0 15px}
  .addsep{height:1px;background:var(--line-soft);margin:6px 4px}
  .add-nota{margin-left:auto;font-size:10px;color:var(--faint);letter-spacing:.4px;text-transform:uppercase}
  .ev-cancel{text-decoration:line-through;opacity:.55}
  .drop-anexo{border:1.5px dashed var(--line);border-radius:10px;padding:13px;text-align:center;color:var(--faint);font-size:12.5px;margin-top:6px;transition:border-color .15s,background .15s}
  .drop-anexo.dragover{border-color:var(--gold);background:var(--gold-tint);color:var(--gold)}
  .tc-sug{position:absolute;left:0;top:100%;margin-top:4px;background:var(--paper);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);min-width:180px;padding:5px;display:none;z-index:96}
  .tc-sug.show{display:block}
  .tc-sug button{display:block;width:100%;text-align:left;font-size:13px;padding:8px 10px;border-radius:8px}
  .tc-sug button:hover{background:var(--paper2)}
  .tc-com{display:flex;gap:11px;padding:11px 0;border-bottom:1px solid var(--line-soft);align-items:flex-start}
  .tc-com:last-child{border-bottom:none}
  .tc-av{width:30px;height:30px;flex:0 0 30px;border-radius:8px;background:var(--petroleo-tint);color:var(--petroleo-txt);display:grid;place-items:center;font-family:var(--head);font-weight:600;font-size:11.5px}
  .delta{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:700;border-radius:6px;padding:2px 7px}
  .delta.up{color:var(--ok);background:var(--ok-bg)}
  .delta.dn{color:var(--danger);background:var(--danger-bg)}
  .ts-row{display:flex;align-items:center;gap:12px;padding:9px 0}
  .ts-av{width:32px;height:32px;border-radius:50%;background:var(--gold-tint);color:var(--gold);display:grid;place-items:center;font-family:var(--head);font-weight:700;font-size:11px;flex:0 0 32px}
  .ts-name{width:88px;flex:0 0 88px;font-size:12.5px;font-weight:600}
  .ts-track{flex:1;position:relative;height:16px;background:var(--paper2);border-radius:8px;overflow:hidden}
  .ts-prev{position:absolute;inset:0;background:var(--neutral);opacity:.45;border-radius:8px}
  .ts-cur{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,var(--gold-soft),var(--gold));border-radius:8px}
  .ts-meta{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--ink);opacity:.7}
  .ts-val{width:64px;flex:0 0 64px;text-align:right;font-family:var(--mono);font-size:11.5px;color:var(--muted)}
  .calw{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:16px}
  .cal-h{display:flex;align-items:center;justify-content:space-between;font-family:var(--head);font-weight:600;font-size:15px;margin-bottom:10px}
  .cal-h .nvg{display:flex;gap:4px}
  .cal-h button{width:26px;height:26px;border-radius:7px;border:1px solid var(--line);color:var(--muted)}
  .cal-g{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}
  .cal-g .wd{font-size:10px;font-weight:700;color:var(--faint);padding:5px 0;text-transform:uppercase}
  .cal-d{position:relative;font-size:12px;padding:8px 0;border-radius:8px;color:var(--muted);cursor:pointer}
  .cal-d:hover{background:var(--paper2)}
  .cal-d.out{opacity:.28}
  .cal-d.today{background:var(--petroleo);color:#fff;font-weight:700}
  .cal-d .cb{position:absolute;top:2px;right:4px;min-width:13px;height:13px;border-radius:7px;background:var(--gold);color:var(--on-gold);font-size:8.5px;font-weight:700;display:grid;place-items:center;padding:0 3px}
  .cal-link{display:block;text-align:right;font-size:12px;font-weight:600;color:var(--petroleo-txt);margin-top:10px;cursor:pointer}
  .cptool{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 0 12px}
  .cptool .tb{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--muted);border:1px solid var(--line);background:var(--paper);border-radius:9px;padding:8px 11px}
  .cptool .tb svg{width:14px;height:14px}
  .cptool .tb:hover{color:var(--ink);border-color:var(--petroleo-txt)}
  .clps{cursor:pointer;user-select:none}
  .clps svg{width:15px;height:15px;transition:transform .2s}
  .clps.closed svg{transform:rotate(-90deg)}
  .bch{display:flex;gap:22px;align-items:flex-end;height:190px;padding:10px 6px 0}
  .bp{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px}
  .bp .bars{display:flex;gap:5px;align-items:flex-end;height:150px;width:100%;justify-content:center}
  .bp i{display:block;width:22px;border-radius:6px 6px 0 0}
  .bp i.r{background:linear-gradient(180deg,var(--petroleo),var(--petroleo-700))}
  .bp i.d{background:linear-gradient(180deg,var(--gold-soft),var(--gold))}
  .bp span{font-size:11px;color:var(--faint)}
  .legend{display:flex;gap:16px;font-size:11.5px;color:var(--muted);padding:0 6px 6px}
  .legend b{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px;vertical-align:middle}

  /* lista + pasta do caso */
  .vsw{display:inline-flex;background:var(--colbg);border-radius:9px;padding:3px;gap:2px}
  .vsw button{width:32px;height:28px;border-radius:7px;display:grid;place-items:center;color:var(--muted)}
  .vsw button.on{background:var(--paper);color:var(--petroleo-txt);box-shadow:var(--shadow)}
  .vsw svg{width:15px;height:15px}
  .fsel{font-family:inherit;font-size:12px;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:8px 10px;outline:none;max-width:170px}
  .fsel:focus{border-color:var(--petroleo-txt)}
  .caso-tabs{margin:2px 0 14px}
  .tl{position:relative;padding-left:20px}
  .tl::before{content:"";position:absolute;left:6px;top:6px;bottom:6px;width:2px;background:var(--line)}
  .tl-i{position:relative;padding:0 0 16px 14px}
  .tl-i::before{content:"";position:absolute;left:-18px;top:5px;width:10px;height:10px;border-radius:50%;background:var(--paper);border:2.5px solid var(--petroleo)}
  .tl-i:first-child::before{background:var(--gold);border-color:var(--gold)}
  .tl-d{font-family:var(--mono);font-size:11px;color:var(--faint)}
  .tl-x{font-size:13px;margin-top:2px;line-height:1.5}
  .and-add{display:flex;gap:8px;margin-top:12px}
  .and-add input{flex:1;font-family:inherit;font-size:13px;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:10px 12px;outline:none}
  .and-add input:focus{border-color:var(--petroleo-txt)}
  .meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .mg-i{background:var(--paper2);border:1px solid var(--line);border-radius:11px;padding:12px 14px}
  .mg-k{font-size:10.5px;letter-spacing:.4px;text-transform:uppercase;color:var(--faint);font-weight:700}
  .mg-v{font-size:13px;font-weight:600;margin-top:4px}
  .mg-v.mono{font-family:var(--mono);font-weight:500}
  @media (max-width:560px){.meta-grid{grid-template-columns:1fr}}

  /* sidebar recolhível */
  .scol{position:absolute;top:12px;right:10px;width:26px;height:26px;border-radius:8px;color:#8fb0ad;display:grid;place-items:center;z-index:5}
  .scol:hover{background:rgba(255,255,255,.08);color:#fff}
  .scol svg{width:15px;height:15px;transition:transform .25s}
  .side{position:sticky;transition:width .25s}
  .brand-mini{display:none;font-family:var(--head);font-weight:700;font-size:17px;color:var(--gold-soft);text-align:center;padding:6px 0 2px;letter-spacing:1px}
  @media (min-width:921px){
    body.snav .side{width:72px;flex:0 0 72px}
    body.snav .brand-logo, body.snav .brand-tag, body.snav .nav-label, body.snav .nav-item span, body.snav .me > div:last-child{display:none}
    body.snav .brand-mini{display:block}
    body.snav .nav-item{justify-content:center;padding:11px 0}
    body.snav .nav-badge{position:absolute;transform:translate(14px,-10px);font-size:9px;padding:0 5px}
    body.snav .nav-item{position:relative}
    body.snav .me{justify-content:center}
    body.snav .scol svg{transform:rotate(180deg)}
    body.snav .side-foot{padding:14px 8px}
  }

  .agc-g{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
  .agc-g .wd{font-size:10px;font-weight:700;color:var(--faint);padding:5px 0;text-transform:uppercase;text-align:center}
  .agc{min-height:86px;background:var(--paper2);border-radius:10px;padding:6px;position:relative}
  .agc.out{background:transparent}
  .agc.today{outline:2px solid var(--petroleo)}
  .agc-d{font-size:11px;font-weight:700;color:var(--muted)}
  .agc{min-width:0;overflow:hidden}
  .agc-ev{font-size:11px;line-height:1.3;max-width:100%;background:var(--ok-bg);color:var(--ink);border-left:2px solid var(--ok);border-radius:5px;padding:3px 6px;margin-top:4px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .agc-ev.aud{background:var(--gold-tint);border-left-color:var(--gold)}

  .lead-card[draggable=true],.tri-card[draggable=true]{cursor:grab}
  .lead-card.dragging{opacity:.45}
  .col.dragover{outline:2px dashed var(--gold);outline-offset:-4px}
  .seg button.dragover{background:var(--gold-tint);color:var(--gold)}
  .wkg{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
  .wkc{background:var(--paper2);border-radius:10px;padding:8px;min-width:0;
       min-height:230px;max-height:52vh;overflow-y:auto;overflow-x:hidden}
  .wkc::-webkit-scrollbar{width:5px}
  .wkc::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
  .wkh{font-size:10px;font-weight:700;color:var(--faint);text-transform:uppercase;text-align:center;margin-bottom:4px}
  .wkh b{display:block;font-size:15px;color:var(--ink);font-family:var(--head)}
  .wkc.today{outline:2px solid var(--petroleo)}
  .agc{cursor:pointer}
  .agc.sel{outline:2px solid var(--gold);background:var(--gold-tint)}
  .wkc{cursor:pointer}
  .wkc.sel{outline:2px solid var(--gold)}
  .agc-ev{cursor:pointer}
  .agc-ev.arrasta{cursor:grab}
  .agc-ev.movendo{opacity:.5}
  .ag-solta.alvo{outline:2px dashed var(--gold);outline-offset:-2px;background:var(--gold-tint)}

  /* Agenda: calendário e lista do dia LADO A LADO (padrão Astrea). A lista
     embaixo empurrava o calendário para fora da tela e obrigava a rolar para
     ver o que havia no dia que a pessoa acabou de clicar. */
  .ag-split{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:14px;align-items:start}
  .ag-split > .card{min-width:0}
  @media (max-width:1180px){.ag-split{grid-template-columns:1fr}}
  .ag-lado{position:sticky;top:12px;max-height:calc(100vh - 24px);overflow-y:auto}
  .ag-lado-h{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:8px}
  .ag-lado .ag-day{margin:0}
  /* Semana como agenda de verdade (padrão Astrea): régua de horas à esquerda,
     faixa "Dia todo" fixa no topo e blocos com a altura da duração. */
  .wkgrade{--hora-col:62px;--cols:7}
  .wkg-h,.wkg-todo{display:grid;grid-template-columns:var(--hora-col) repeat(var(--cols),minmax(0,1fr))}
  .wkg-h{border-bottom:1px solid var(--line);padding-bottom:6px}
  .wkg-dia{text-align:center;cursor:pointer;border-radius:8px;padding:4px 2px;min-width:0}
  .wkg-dia:hover{background:var(--paper2)}
  .wkg-sig{display:block;font-size:12.5px;font-weight:700;color:var(--faint);text-transform:uppercase;letter-spacing:.04em}
  .wkg-dia b{font-size:24px;font-family:var(--head);color:var(--ink);line-height:1.3;
             display:inline-block;min-width:28px;height:28px;border-radius:50%}
  .wkg-dia.today b{background:var(--petroleo);color:#fff}
  .wkg-dia.sel{background:var(--gold-tint);outline:1px solid var(--gold)}

  /* Dia todo: prazo, protocolo e tarefa. Fica de fora da rolagem porque é o
     que não pode escapar da vista. */
  .wkg-todo{background:var(--paper2);border-bottom:1px solid var(--line);min-height:34px;padding:3px 0}
  .wkg-todo .wkg-cel{border-left:1px solid var(--line-soft);padding:0 3px;min-width:0}
  .wkg-todo .agc-ev{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12.5px;
                    padding:2px 5px;margin-top:2px}

  /* Corpo rolável: 24h de altura real, aberto nas 00h como pediu o Astrea. */
  .wkg-corpo{display:grid;grid-template-columns:var(--hora-col) repeat(var(--cols),minmax(0,1fr));
             max-height:60vh;overflow-y:auto;position:relative}
  .wkg-corpo::-webkit-scrollbar{width:6px}
  .wkg-corpo::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
  .wkg-regua,.wkg-col{position:relative;min-width:0}
  .wkg-col{border-left:1px solid var(--line-soft)}
  .wkg-hl{height:var(--h);border-top:1px solid var(--line-soft);position:relative}
  .wkg-hl:first-child{border-top:0}
  .wkg-regua .wkg-hl span{position:absolute;top:-9px;right:8px;font-size:13px;color:var(--faint);
                          background:var(--paper);padding:0 2px}
  .wkg-regua .wkg-hl:first-child span{top:2px}

  /* Bloco do compromisso: começa no minuto e ocupa a duração. */
    /* Cores por tipo (20/08, gabarito Astrea): compromisso VERDE, tarefa AZUL,
     audiência AMARELA, prazo VERMELHO — no bloco da semana e no chip. */
  .wkg-bloco{position:absolute;left:2px;right:2px;overflow:hidden;text-decoration:none;
             font-size:13.5px;line-height:1.4;padding:5px 8px;border-radius:7px;
             background:var(--ok-bg);color:var(--ink);
             border-left:3px solid var(--ok);cursor:pointer}
  .wkg-bloco:hover{filter:brightness(.97);box-shadow:0 1px 4px rgba(0,0,0,.12)}
  .wkg-bloco b{font-weight:700}
  /* Arrastar/redimensionar (20/08): alça no pé do bloco muda o fim; o corpo
     do bloco arrasta entre dias e horários (grade de 15 em 15 minutos). */
  .wkg-bloco.arrasta{cursor:grab}
  .wkg-bloco.movendo{cursor:grabbing;opacity:.85;z-index:20;box-shadow:0 6px 18px rgba(0,0,0,.25)}
  .wkg-rs{position:absolute;left:0;right:0;bottom:0;height:8px;cursor:ns-resize}
  .wkg-rs::after{content:'';position:absolute;left:50%;bottom:2px;width:22px;height:3px;margin-left:-11px;border-radius:2px;background:currentColor;opacity:0;transition:opacity .15s}
  .wkg-bloco.arrasta:hover .wkg-rs::after{opacity:.35}
  .wkg-bloco.aud{background:var(--gold-tint);border-left-color:var(--gold)}
  .wkg-bloco.prz{background:var(--danger-bg);border-left-color:var(--danger)}
  .wkg-bloco.tar{background:var(--info-bg);border-left-color:var(--info)}
  .wkg-bloco.tar{background:var(--paper);border-left-style:dashed;border-left-color:var(--gold)}
  .wkg-bloco.ev-done{opacity:.55}
  .wkg-bloco.ev-cancel{opacity:.5;text-decoration:line-through}
  /* Particular de outra pessoa: horário ocupado, assunto fechado. Hachura em
     vez de cor cheia para se ler de longe como "reservado", não como evento. */
  .wkg-bloco.reserv,.agc-ev.reserv{color:var(--muted);border-left-color:var(--line);cursor:default;
    background:repeating-linear-gradient(45deg,var(--paper2),var(--paper2) 5px,var(--paper) 5px,var(--paper) 10px)}
  .wkg-bloco.reserv:hover{filter:none;box-shadow:none}
  .agc-ev.tar{background:var(--info-bg);border-left:2px solid var(--info)}
  .agc-ev.prz{background:var(--danger-bg);border-left-color:var(--danger)}
  .ev-done{text-decoration:line-through;opacity:.62}

  /* botão de perigo */
  .btn-danger{background:var(--danger-solido);color:#fff}
  .agc-ev.crm{border-left-color:var(--gold)}
  .b-crm{background:var(--gold-tint);color:var(--gold)}
  .btn-danger:hover{filter:brightness(1.08)}

  /* alerta de conflito / prescrição */
  /* Faixa de aviso das telas (.alert). Existiam 21 usos no sistema sem
     nenhuma regra: as mensagens de erro do Financeiro, do 2FA, do teto de IA e
     do on/offboarding saíam como texto solto, sem caixa nem cor, justamente
     onde o usuário mais precisa enxergar. Cores semânticas: amarelo avisa,
     vermelho barra, verde confirma. */
  .alert{display:flex;gap:10px;align-items:flex-start;border-radius:12px;padding:11px 14px;font-size:13px;line-height:1.5;color:var(--ink);background:var(--paper2);border:1px solid var(--line)}
  .alert svg{width:18px;height:18px;flex:0 0 18px;margin-top:1px}
  .alert a{color:var(--petroleo-txt);text-decoration:underline}
  .alert-warn{background:var(--warn-bg);border-color:var(--warn)}
  .alert-warn svg{color:var(--warn)}
  .alert-danger{background:var(--danger-bg);border-color:var(--danger)}
  .alert-danger svg{color:var(--danger)}
  .alert-ok{background:var(--ok-bg);border-color:var(--ok)}
  .alert-ok svg{color:var(--ok)}
  .alert-info{background:var(--info-bg);border-color:var(--info)}
  .alert-info svg{color:var(--info)}
  .confl-alert{display:flex;gap:10px;align-items:flex-start;background:var(--danger-bg);border:1px solid var(--danger);border-radius:12px;padding:11px 14px;font-size:13px;color:var(--ink)}
  .confl-alert svg{width:18px;height:18px;flex:0 0 18px;color:var(--danger);margin-top:1px}
  .chip.ok-soft{border-color:var(--line);color:var(--faint);background:var(--paper2)}
  .chip.confl{border-color:var(--danger);color:var(--danger);background:var(--danger-bg)}
  .chip.frio{border-color:var(--warn);color:var(--warn);background:var(--warn-bg)}

  /* zona de perdido no CRM */
  .lost-zone{display:none;align-items:center;justify-content:center;gap:8px;margin:10px 0 4px;padding:14px;border:2px dashed var(--danger);border-radius:12px;color:var(--danger);font-weight:700;font-size:13px;background:var(--danger-bg)}
  .lost-zone.show{display:flex}
  .lost-zone.dragover{filter:brightness(1.12);outline:2px solid var(--danger)}
  .lead-lost{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;color:var(--faint);opacity:0;transition:opacity .15s,background .15s,color .15s}
  .lead-lost:hover{background:var(--danger-bg);color:var(--danger)}
  .lead-card:hover .lead-lost{opacity:1}
  .lead-lost svg{width:13px;height:13px}

  /* central de notificações */
  .notifwrap{position:relative}
  .notifpanel{display:none;position:absolute;right:0;top:calc(100% + 10px);width:360px;max-height:420px;overflow-y:auto;background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);z-index:60}
  .notifpanel.show{display:block}
  .notif-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line-soft);font-family:var(--head);font-weight:600;font-size:14px}
  .notif-h button{font-size:11.5px;font-weight:600;color:var(--petroleo-txt)}
  .notif-i{display:flex;gap:10px;padding:11px 14px;border-bottom:1px solid var(--line-soft);cursor:pointer;align-items:flex-start}
  a.notif-i{text-decoration:none;color:inherit}
  a.notif-i:hover{background:var(--paper2)}
  .notif-i:hover{background:var(--paper2)}
  .notif-i:last-child{border-bottom:none}
  .notif-i.nao-lida{background:var(--petroleo-tint)}
  .notif-i.nao-lida:hover{filter:brightness(1.05)}
  .notif-dot{width:7px;height:7px;border-radius:50%;background:var(--gold);margin-top:6px;flex:0 0 7px}
  .notif-dot.lida{background:var(--line)}
  .notif-t{font-size:12.5px;font-weight:600;line-height:1.35}
  .notif-s{font-size:11.5px;color:var(--faint);margin-top:2px}
  .linkswrap{position:relative}
  .linkspanel{display:none;position:absolute;right:0;top:calc(100% + 10px);width:290px;max-height:440px;overflow-y:auto;background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);z-index:60;padding:8px}
  .linkspanel.show{display:block}
  .lk-h{font-family:var(--head);font-weight:600;font-size:13px;padding:6px 8px 10px;color:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:8px}
  .lk-h button{font-size:11px;font-weight:600;color:var(--petroleo-txt)}
  a.lk{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;font-size:12.7px;color:var(--ink);text-decoration:none}
  a.lk:hover{background:var(--paper2)}
  .lk-ic{width:26px;height:26px;border-radius:7px;background:var(--petroleo-tint);color:var(--petroleo-txt);display:grid;place-items:center;font-size:10.5px;font-weight:700;font-family:var(--head);flex:0 0 26px}
  .lk-ex{margin-left:auto;color:var(--faint);opacity:.7}

  /* busca global */
  .searchwrap{position:relative}
  .search-drop{display:none;position:absolute;left:0;top:calc(100% + 8px);width:420px;max-height:440px;overflow-y:auto;background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);z-index:60}
  .search-drop.show{display:block}
  .sd-grp{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold);font-weight:700;padding:10px 14px 4px}
  .sd-i{display:flex;align-items:center;gap:10px;padding:9px 14px;cursor:pointer}
  .sd-i:hover{background:var(--paper2)}
  .sd-t{font-size:12.5px;font-weight:600}
  .sd-s{font-size:11px;color:var(--faint)}
  .sd-empty{padding:16px 14px;color:var(--faint);font-size:12.5px;text-align:center}
  /* Metas por produto (CRM) */
  .mp-item{margin-top:7px}
  .mp-l{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:11px;color:var(--muted)}
  .mp-l span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mp-l b{color:var(--ink);font-family:var(--mono);font-size:11.5px;flex-shrink:0}
  .mp-edit{border:none;background:none;color:var(--muted);cursor:pointer;padding:2px;border-radius:6px;display:inline-flex;align-items:center}
  .mp-edit:hover{color:var(--petroleo-txt);background:var(--petroleo-tint)}
  .mp-edit svg{width:13px;height:13px}
  /* Produtos clicáveis / playbook */
  .prod.clk{cursor:pointer;transition:box-shadow .15s ease,transform .15s ease,border-color .15s ease}
  .prod.clk:hover{transform:translateY(-2px);border-color:var(--gold);box-shadow:0 8px 22px rgba(0,0,0,.14)}
  .pb-hint{font-size:11px;color:var(--gold);font-weight:600;margin-top:10px}
  .pb-obj{background:var(--paper2);border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:8px;font-size:12.5px}
  .pb-obj b{color:var(--petroleo-txt)}
  .pb-obj .rr{margin-top:4px;color:var(--muted)}

/* ===== Ajustes do build WV (server-rendered) ===== */
/* Abas .seg com links <a> (navegação) além de <button> */
.seg a{font-size:12.5px;font-weight:600;color:var(--muted);border-radius:8px;padding:7px 14px;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.seg a.on{background:var(--paper);color:var(--petroleo-txt);box-shadow:var(--shadow)}
.seg a:hover{color:var(--ink)}
.seg-cnt{background:var(--colbg);color:var(--muted);font-size:10px;font-weight:700;border-radius:20px;padding:1px 7px;line-height:1.5}
.seg a.on .seg-cnt{background:var(--petroleo-tint,rgba(0,57,61,.1));color:var(--petroleo-txt)}
.seg-cnt-gold{background:var(--gold-tint);color:var(--gold)}
.seg-cnt-amber{background:rgba(183,129,39,.16);color:#b78127}
/* Radar de clientes / Domicílio eletrônico (Intimações) */
.kpi-s{font-size:10px;color:var(--muted-2);margin-top:3px}
.rd-step{display:flex;gap:9px;align-items:flex-start;padding:5px 0;font-size:12px;color:var(--ink);line-height:1.4}
.rd-n{width:18px;height:18px;border-radius:50%;background:var(--gold-tint);color:var(--gold);font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:0 0 auto;margin-top:1px}
.rd-src{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--line-2);font-size:12px;color:var(--ink)}
.rd-src:last-of-type{border-bottom:none}
.rd-dot{width:7px;height:7px;border-radius:50%;background:var(--ok);flex:0 0 auto}
.rd-nm{flex:1;font-weight:600}
.rd-mon{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--ink);padding:6px 0;border-bottom:1px solid var(--line-2)}
.rd-mon:last-of-type{border-bottom:none}
.rd-mon b{font-weight:700}
.cd{display:inline-flex;align-items:center;gap:5px;font-weight:700;font-size:11px;padding:3px 8px;border-radius:7px}
.cd svg{width:11px;height:11px}
.cd-g{background:var(--ok-tint,rgba(63,125,79,.12));color:var(--ok)}
.cd-a{background:rgba(183,129,39,.14);color:#b78127}
.cd-r{background:var(--danger-tint,rgba(184,68,46,.1));color:var(--danger)}
.cd-done{background:var(--petroleo-tint,rgba(0,57,61,.1));color:var(--petroleo-txt)}
.rd-serv-dot{width:7px;height:7px;border-radius:50%;display:inline-block;margin-right:6px}
.rd-serv-dot.on{background:var(--ok)}.rd-serv-dot.pend{background:#b78127}
/* Playbook de Produtos (lista + detalhe) */
.pb-grid{display:grid;grid-template-columns:270px 1fr;gap:16px;align-items:start;margin-top:14px}
@media (max-width:900px){.pb-grid{grid-template-columns:1fr}}
.pb-list{padding:8px;align-self:start;position:sticky;top:70px}
.pb-grp{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);font-weight:700;padding:10px 8px 4px}
.pb-li{display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:9px;border:1px solid transparent;text-decoration:none;margin-bottom:2px}
.pb-li:hover{background:var(--paper2)}
.pb-li.on{background:var(--gold-tint);border-color:var(--gold-line)}
.pb-ic{width:26px;height:26px;border-radius:7px;background:var(--colbg);color:var(--petroleo-txt);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.pb-li.on .pb-ic{background:var(--paper);color:var(--gold)}
.pb-ic svg{width:14px;height:14px}
.pb-mid{flex:1;min-width:0;display:flex;flex-direction:column}
.pb-nm{font-size:11.5px;color:var(--ink);font-weight:600;line-height:1.2}
.pb-tk{font-size:9.5px;font-weight:400;color:var(--muted-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pb-fl{font-size:8px;font-weight:700;color:var(--gold);background:var(--gold-tint);border-radius:20px;padding:1px 6px;flex:0 0 auto}
.pb-detail{padding:16px}
.pb-head{display:flex;align-items:flex-start;gap:13px;margin-bottom:4px}
.pb-pic{width:44px;height:44px;border-radius:11px;background:linear-gradient(135deg,#083c44,var(--petroleo));color:var(--gold-soft,#e7d3a8);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.pb-pic svg{width:22px;height:22px}
.pb-tt{font-family:var(--head);font-size:18px;color:var(--ink);font-weight:600;line-height:1.2}
.pb-tags{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}
.pb-ed{margin-left:auto;font-size:11px;color:var(--gold);font-weight:700;flex:0 0 auto;text-decoration:none}
.pb-sec{margin-top:15px}
.pb-sl{font-size:9px;letter-spacing:.09em;text-transform:uppercase;color:var(--faint);font-weight:700;margin-bottom:6px}
.pb-sec p{margin:0;font-size:12.5px;color:var(--txt);line-height:1.6}.pb-sec p b{color:var(--ink)}
.pb-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:700px){.pb-two{grid-template-columns:1fr}}
.pb-price{display:flex;gap:8px;flex-wrap:wrap}
.pb-chip{border:1px solid var(--line);border-radius:9px;padding:7px 12px;background:var(--paper2);text-align:center}
.pb-chip .q{font-size:10px;color:var(--muted);font-weight:600}
.pb-chip .v{font-family:var(--head);font-size:15px;color:var(--ink);font-weight:600;margin-top:2px}
.pb-modelp{font-size:12.5px;color:var(--txt);line-height:1.55}
.pb-pitch{background:var(--gold-tint);border:1px solid var(--gold-line);border-radius:11px;padding:12px 14px;font-size:12.5px;color:var(--txt);line-height:1.6;font-style:italic}
.pb-pitch b{color:var(--ink);font-style:normal}
.pb-mat{display:flex;align-items:center;gap:9px;padding:7px 0;border-bottom:1px solid var(--line-soft);font-size:12px;color:var(--txt)}
.pb-mat:last-child{border-bottom:none}
.pb-mat>svg{width:15px;height:15px;color:var(--gold);flex:0 0 auto}.pb-mat .nm{flex:1;font-weight:600;color:var(--ink)}
.pb-metrics{display:flex;gap:9px}
.pb-metric{flex:1;background:var(--paper2);border:1px solid var(--line-soft);border-radius:10px;padding:9px 11px}
.pb-metric .k{font-size:9px;color:var(--muted);font-weight:600}
.pb-metric .v{font-family:var(--head);font-size:15px;color:var(--ink);font-weight:600;margin-top:2px}
/* Central de Configurações: navegação lateral agrupada + painel de conteúdo */
.set-shell{display:grid;grid-template-columns:240px 1fr;background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:0 1px 2px rgba(0,0,0,.05),0 8px 22px -16px rgba(0,0,0,.22);overflow:hidden;margin-top:14px;min-height:560px}
@media (max-width:900px){.set-shell{grid-template-columns:1fr}.set-nav{border-right:none;border-bottom:1px solid var(--line)}}
.set-nav{border-right:1px solid var(--line);background:var(--paper2);padding:12px 10px;overflow:auto}
.snav-busca{display:flex;align-items:center;gap:7px;background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:7px 10px;margin:2px 4px 10px;color:var(--faint)}
.snav-busca svg{width:13px;height:13px;flex:0 0 auto}
.snav-busca input{border:none;background:none;outline:none;font-family:inherit;font-size:11.5px;color:var(--ink);width:100%}
.snav-sec{font-size:8px;letter-spacing:.13em;text-transform:uppercase;color:var(--faint);font-weight:700;padding:11px 12px 4px}
.snav-item{display:flex;align-items:center;gap:10px;padding:7px 9px;border-radius:9px;color:var(--txt);font-size:12px;font-weight:500;text-decoration:none;margin:0 2px 1px}
.snav-item:hover{background:var(--colbg)}
.snav-item.on{background:var(--gold-tint);color:var(--ink);font-weight:600}
.snav-item .ic{width:25px;height:25px;border-radius:7px;background:var(--colbg);color:var(--petroleo-txt);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.snav-item.on .ic{background:var(--paper);color:var(--gold)}
.snav-item .ic svg{width:14px;height:14px}
.set-body{padding:20px 22px;min-width:0}
/* Identidade visual: duas colunas DENTRO do shell de Configurações. Não usa o
   .ficha da página cheia porque aqui a navegação já consome 240px; por isso as
   colunas são iguais e empilham antes (senão a pré-visualização transborda). */
.ident-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start}
@media(max-width:1240px){.ident-grid{grid-template-columns:1fr}}
.ident-grid > div{min-width:0}
.ident-logo{border-radius:10px;padding:34px 22px;margin-bottom:12px;
  display:flex;align-items:center;justify-content:center;min-height:150px}
.ident-logo img{max-height:96px;max-width:100%;display:block}
/* E-mail tem 600px fixos (padrão de caixa de entrada) e não cabe na coluna.
   Renderizamos em tamanho real e reduzimos proporcionalmente, para ver a peça
   inteira em vez de um pedaço. O JS da tela calcula a escala. */
.ident-prevwrap{overflow:hidden;background:#f1efe9;border-radius:0 0 12px 12px}
.ident-prev{width:640px;height:980px;border:0;display:block;transform-origin:top left;background:#f1efe9}
.set-body .eyebrow{font-size:9px}
.set-body .h1{font-size:18px}
.set-body .lead{font-size:11.5px;max-width:680px}
/* Enquadramento denso das abas Radar/Domicílio (escopo próprio) */
.rd-scope .kpi{padding:12px 14px}
.rd-scope .kpi-k{font-size:10px;letter-spacing:.3px}
.rd-scope .kpi-v{font-size:20px;margin-top:4px}
.rd-scope .kpi-grid{gap:11px;margin-bottom:14px}
.rd-scope .card-b{padding:13px 15px}
.rd-scope .tbl th{padding:8px 12px;font-size:10px}
.rd-scope .tbl td{padding:8px 12px;font-size:12.5px}
.rd-scope .grid2{gap:14px}
.rd-scope .sec-title{margin:0 0 9px;font-size:13.5px}
/* Menu + Adicionar com links <a> (navegação server-side) */
.addmenu a{display:flex;align-items:center;gap:10px;width:100%;text-align:left;font-size:13px;padding:10px 11px;border-radius:9px;color:var(--ink);text-decoration:none}
.addmenu a:hover{background:var(--paper2)}
/* Cards de kanban usados como <a>: no protótipo são <div> (block) */
a.lead-card{display:block;text-decoration:none;color:inherit}
/* Ficha em duas colunas (páginas de detalhe do build) */
/* Circulares e manuais: leitura + ciência da equipe. O texto precisa de largura
   confortável para ler, então a coluna lateral tem teto e empilha ANTES do
   .ficha padrão (que a 950px ainda espremia as duas). */
.doc-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:14px;align-items:start}
@media(max-width:1150px){.doc-grid{grid-template-columns:1fr}}
.doc-grid > div{min-width:0}

.ficha{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:14px;align-items:start}
.ficha > div > .card{margin-bottom:14px}
@media(max-width:900px){.ficha{grid-template-columns:1fr}}
/* Overlay estático (ficha como janela grande, server-rendered) */
.overlay.static{display:flex;position:fixed}
/* Campos de formulário: traço fino em todo o sistema (inputs fora de .field incluídos) */
input,select,textarea{font-family:inherit;font-size:13px;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:9px 11px;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--petroleo-txt)}
input[type=checkbox],input[type=radio]{width:auto;padding:0;accent-color:var(--petroleo-txt)}
input[type=date],input[type=time],input[type=datetime-local]{color-scheme:dark}
body.light input[type=date],body.light input[type=time],body.light input[type=datetime-local]{color-scheme:light}
/* Menu suspenso no cabeçalho do modal (quick-add e 3 pontos) */
.modal-h .addwrap .addmenu{top:40px}

/* ===== Botões: padrão mais singelo (menos verde escuro cheio) ===== */
.btn-soft{background:var(--petroleo-tint);color:var(--petroleo-txt);border:1px solid transparent}
.btn-soft:hover{background:var(--petroleo);color:#fff}
.btn-solid{box-shadow:none;font-weight:600}
.btn-sm.btn-solid,.btn-sm.btn-gold{font-weight:600}
/* Fileira de ícones do cabeçalho do modal, mais discreta */
.mh-ic{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;color:var(--muted);border:1px solid transparent}
.mh-ic:hover{background:var(--paper2);color:var(--ink)}

/* ===== Seletor de envolvidos em chips (checkbox multiple do Django) ===== */
.people-pick > div,.people-pick > ul{display:flex;flex-wrap:wrap;gap:7px;list-style:none;padding:0;margin:0}
.people-pick > div > div,.people-pick li{display:inline-flex}
.people-pick label{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border:1px solid var(--line);border-radius:999px;font-size:12.5px;cursor:pointer;background:var(--paper);user-select:none;white-space:nowrap}
.people-pick label:hover{border-color:var(--petroleo-txt)}
.people-pick label:has(input:checked){border-color:var(--petroleo-txt);background:var(--petroleo-tint);color:var(--petroleo-txt);font-weight:600}
.people-pick input[type=checkbox]{width:14px;height:14px;accent-color:var(--petroleo-txt)}

/* Avatares compactos (responsável + envolvidos na identificação) */
.mini-people{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.mini-av{width:24px;height:24px;border-radius:50%;background:var(--petroleo-tint);color:var(--petroleo-txt);display:grid;place-items:center;font-size:9.5px;font-weight:700;border:1.5px solid var(--paper);flex:0 0 auto}
.mini-av.gold{background:var(--gold-tint);color:var(--gold)}

/* Card de prazos/audiências com destaque (borda dourada à esquerda) */
.card.hi-prazo{border-left:3px solid var(--gold)}
/* Timeline de andamentos: input de data mais fino */
.tl-d input{max-width:100px;font-family:var(--mono);font-size:11px}

/* Título das janelas de AÇÃO (Padrão B, `.modal-t`): mesmo peso visual do
   título das fichas (Fraunces) e empurra o botão de fechar para a direita,
   como o `.x` do Padrão A. Vale para as 5 janelas que usam `.modal-t`. */
.modal-h .modal-t{font-family:var(--head);font-size:16px;font-weight:600;
  color:var(--ink);line-height:1.3;margin-right:auto}

/* ===== Ficha (modal) maior e com mais respiro ===== */
.modal-xl{max-width:1440px;width:97vw}

/* Escala de largura das janelas, por volume de conteúdo.
   A largura é da FUNÇÃO, não da tela: "Nova tarefa" tem a mesma largura
   aberta do Adicionar, do painel ou da ficha do caso.
     .modal-sm    470px  confirmação (uma pergunta)
     .modal       600px  padrão
     .modal-mini  620px  janela de lançamento
     .modal-form  720px  formulário de duas colunas   <- Adicionar
     .modal-form.curto   560px  formulário de uma coluna
     .modal-xl   1440px  ficha/painel (só quem tem cards e abas)
   Vem depois do .modal-xl e usa dois seletores de classe de propósito:
   os formulários mantêm a classe modal-xl porque .ficha-edit depende dela. */
.modal-xl.modal-form{max-width:720px;width:100%}
.modal-xl.modal-form.curto{max-width:560px}
.overlay:has(.modal-form){padding:22px 16px}
.overlay:has(.modal-xl){padding:22px 16px}
.modal-xl .modal-b{padding:22px 26px 26px}
.modal-xl .card-t{font-size:15.5px}
.modal-xl .dl-lg .dl-row{padding:9px 0}
.modal-b .ficha,.modal-b > div > div[style*="grid-template-columns"]{gap:18px}
.modal-b .card{margin-bottom:16px}
/* Títulos dos quadros internos com destaque (fundo + letra) */
.modal-b .card-h{background:var(--paper2)}
.modal-b .card-t{color:var(--petroleo-txt)}
/* Quadro unificado: ícone por tipo de item (prazo/audiência/tarefa/compromisso) */
.itype{width:30px;height:30px;flex:0 0 30px;border-radius:9px;display:grid;place-items:center}
.itype svg{width:16px;height:16px}
.itype.prazo{background:var(--danger-bg);color:var(--danger)}
.itype.audiencia{background:var(--warn-bg);color:var(--warn)}
.itype.tarefa{background:var(--petroleo-tint);color:var(--petroleo-txt)}
.itype.compromisso{background:var(--gold-tint);color:var(--gold)}

/* ===== Dropdown de menção @ nos comentários ===== */
.mention-drop{display:none;position:absolute;left:0;bottom:calc(100% + 6px);width:280px;max-height:220px;overflow-y:auto;background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);z-index:90;padding:5px}
.mention-drop.show{display:block}
.mention-drop button{display:flex;align-items:center;gap:9px;width:100%;text-align:left;font-size:13px;padding:8px 10px;border-radius:8px;color:var(--ink)}
.mention-drop button:hover{background:var(--paper2)}

/* ===== Formulários mais legíveis: rótulo destacado x campo ===== */
.field label{font-size:10.5px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--faint);display:block;margin-bottom:5px}
.field input,.field select,.field textarea{background:var(--paper2)}
.field input:focus,.field select:focus,.field textarea:focus{background:var(--paper);border-color:var(--petroleo-txt)}
.form-sec{background:var(--paper2);border:1px solid var(--line-soft);border-radius:12px;padding:12px 14px}
.form-sec .field input,.form-sec .field select,.form-sec .field textarea{background:var(--paper)}
.form-sec-title,.modal-b .sec-title{border-bottom:1px solid var(--line-soft);padding-bottom:8px}

/* ===== Stepper do fluxo de assinatura (Fechamento) ===== */
.steps{display:flex;align-items:flex-start;gap:0;margin:6px 0 4px}
.step{flex:1;text-align:center;position:relative;padding-top:4px}
.step::before{content:"";position:absolute;top:15px;left:-50%;width:100%;height:2px;background:var(--line)}
.step:first-child::before{display:none}
.step.done::before{background:var(--petroleo)}
.step-dot{width:24px;height:24px;border-radius:50%;background:var(--paper2);border:2px solid var(--line);color:var(--faint);display:inline-grid;place-items:center;font-size:10.5px;font-weight:700;position:relative;z-index:1}
.step.done .step-dot{background:var(--petroleo);border-color:var(--petroleo-txt);color:#fff}
.step.now .step-dot{border-color:var(--gold);color:var(--gold);background:var(--gold-tint)}
.step-lbl{font-size:11px;font-weight:600;color:var(--faint);margin-top:5px}
.step.done .step-lbl,.step.now .step-lbl{color:var(--ink)}

/* ===== Espiada rápida de contato (wvCPop): nome clicável + popover ===== */
.wv-cx{cursor:pointer;border-bottom:1px dashed color-mix(in srgb, currentColor 45%, transparent)}
.wv-cx:hover{color:var(--gold)}
.wv-cpop{position:fixed;z-index:1300;width:360px;max-width:92vw;border-color:var(--petroleo-txt);
  box-shadow:0 18px 50px rgba(0,0,0,.35)}
/* Dentro do popover o rotulo encolhe (84px) para o VALOR ter espaco: com os
   132px herdados do .dl-k, o e-mail quebrava a cada meia palavra (18/08). */
.wv-cpop .dl-k{flex:0 0 84px;font-size:12.5px}
.wv-cpop .dl-v{font-size:13.5px;line-height:1.45;overflow-wrap:anywhere}
.wv-cpop .card-t{font-size:14.5px;line-height:1.3}
.wv-abrir{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;
  border-radius:6px;color:var(--muted);vertical-align:-4px;margin-left:2px}
.wv-abrir:hover{background:var(--petroleo-tint);color:var(--petroleo-txt)}
.wv-abrir svg{width:12px;height:12px}

/* ===== Padrão Astrea: "+" que aparece no hover do card e abre modal de cadastro ===== */
.add-hover{opacity:.25;transition:opacity .15s}
.card-h:hover .add-hover, .toolbar:hover .add-hover{opacity:1}
.modal-mini{max-width:620px;width:100%}
/* Atividades: barra colorida por tipo (prazo/audiência/tarefa/compromisso) */
.ativ-row{border-left:3px solid transparent}
.ativ-row.prazo{border-left-color:#e5484d}
.ativ-row.audiencia{border-left-color:var(--gold)}
.ativ-row.tarefa{border-left-color:#3b82f6}
.ativ-row.compromisso{border-left-color:#22a06b}
.ativ-tipo{font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;min-width:86px}
.ativ-row.prazo .ativ-tipo{color:#e5484d}
.ativ-row.audiencia .ativ-tipo{color:var(--gold)}
.ativ-row.tarefa .ativ-tipo{color:#3b82f6}
.ativ-row.compromisso .ativ-tipo{color:#22a06b}
.ativ-vencida{color:#e5484d;font-weight:600}
.row-min{padding:7px 16px;font-size:12.5px}
/* Card compacto: cabeçalho e linhas com menos espaçamento interno (padrão dos
   quadros de Documentos nas fichas). */
.card-compact > .card-h{padding:10px 15px}
.card-compact > .card-b{padding:2px 0}
.card-compact .card-t{font-size:13.5px}
.card-compact .card-b > .row,.card-compact .card-b > a.row{padding:7px 15px}
.card-compact .card-b > .empty{padding:9px 15px;font-size:12px}
.card-compact .drowg{display:flex;align-items:center;gap:10px;padding:7px 15px;border-bottom:1px solid var(--line-soft);font-size:12.5px}
.card-compact .drowg:last-child{border-bottom:none}
.card-compact .drowg .di{width:14px;height:14px;color:var(--faint);flex:0 0 auto}
.card-compact .drowg .dt{flex:1;color:var(--ink);font-weight:600;line-height:1.3}
.card-compact .drowg .dm{font-size:10.5px;color:var(--faint);white-space:nowrap}
.card-compact .drowg .da{font-size:11px;color:var(--petroleo-txt);font-weight:600}
/* Fechamento (CRM): comandos organizados em seções rotuladas, leves. */
.fech-sec{display:flex;align-items:center;gap:9px;flex-wrap:wrap;padding:11px 0;border-top:1px solid var(--line-soft)}
.fech-sec .fech-lbl{font-size:9px;letter-spacing:.09em;text-transform:uppercase;color:var(--faint);font-weight:700;min-width:74px;align-self:center}
.fech-sec .sp{flex:1}
.fech-sel{border:1px solid var(--line);border-radius:8px;padding:7px 9px;font-family:inherit;font-size:12px;color:var(--ink);background:var(--paper);cursor:pointer;max-width:240px}
.fech-hint{margin:10px 0 0;padding:9px 13px;border:1px solid var(--gold-line);background:var(--gold-tint);border-radius:10px;font-size:12px;color:var(--ink)}
.fech-doc{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:12px}
.fech-doc input[type=checkbox]{accent-color:var(--gold);flex:0 0 auto}
.fech-doc .fd-t{flex:1;color:var(--ink);font-weight:600;line-height:1.3}
.fech-doc .fd-a{font-size:11px;color:var(--petroleo-txt);font-weight:600}
.fech-mods{display:flex;gap:6px;flex-wrap:wrap;flex:1}
.fech-info{color:var(--faint);cursor:help;display:inline-flex;vertical-align:middle}
.fech-info svg{width:13px;height:13px}.fech-info:hover{color:var(--gold)}
/* Seletor de documentos com busca (typeahead) no Fechamento. */
.docpick{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.docpick-in{position:relative;min-width:220px}
.docpick-in input{width:100%;border:1px solid var(--line);border-radius:8px;padding:7px 10px;font-family:inherit;font-size:12px;color:var(--ink);background:var(--paper);outline:none}
.docpick-drop{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--paper);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);max-height:220px;overflow:auto;z-index:30;display:none;padding:4px}
.docpick-drop.show{display:block}
.docpick-drop button{display:block;width:100%;text-align:left;border:none;background:none;font-family:inherit;font-size:12px;color:var(--ink);padding:7px 9px;border-radius:7px;cursor:pointer}
.docpick-drop button:hover{background:var(--petroleo-tint)}
.docpick-drop .none{padding:8px 9px;color:var(--faint);font-size:11.5px}
.docpick-chips{display:flex;gap:5px;flex-wrap:wrap}
.docpick-chip{display:inline-flex;align-items:center;gap:4px;background:var(--gold-tint);border:1px solid var(--gold-line);border-radius:7px;padding:3px 4px 3px 9px;font-size:11px;color:var(--ink);font-weight:600}
.docpick-chip .rm{cursor:pointer;color:var(--faint);width:15px;height:15px;display:grid;place-items:center;border-radius:4px;font-size:12px}
.docpick-chip .rm:hover{background:var(--danger-bg);color:var(--danger)}
/* Ficha da Negociação (modal-xl) em escala compacta, mais agradável de ler. */
/* Tipografia padrao das fichas: uma unica familia (a sans). Redefinir a
   variavel --head para --sans faz TODO titulo/serifado da ficha usar a mesma
   fonte (so variam tamanho, peso e italico). Vale para detalhe e edicao. */
.modal-xl.ficha-compact,.modal-xl.ficha-edit{--head:var(--sans)}
.modal-xl.ficha-compact .modal-h{padding:14px 20px 11px}
.modal-xl.ficha-compact .modal-h .modal-t{font-size:15px}
.modal-xl.ficha-compact .modal-b{padding:15px 20px 18px}
.modal-xl.ficha-compact .modal-b .card{margin-bottom:11px}
.modal-xl.ficha-compact .card-h{padding:11px 15px 5px;border-bottom:none;background:var(--paper)}
.modal-xl.ficha-compact .card-b{padding:2px 0 8px}
.modal-xl.ficha-compact .card-t{font-size:13px;line-height:1.1;display:inline-flex;align-items:center;gap:7px}
.ct-ic{width:15px;height:15px;color:var(--faint);flex:0 0 auto;stroke-width:1.9}
.sec-title .st-lead{display:inline-flex;align-items:center;gap:7px}
.modal-xl.ficha-compact .dl-lg .dl-row,.modal-xl.ficha-compact .dl-row{padding:6px 2px}
.modal-xl.ficha-compact .dl-k{flex-basis:118px;font-size:11.5px}
.modal-xl.ficha-compact .dl-v{font-size:12.5px}
.modal-xl.ficha-compact .sec-title{font-size:13px;margin:14px 0 8px;padding-bottom:6px}
.modal-xl.ficha-compact .row{padding:9px 15px}
.modal-xl.ficha-compact .row-ic{width:32px;height:32px;flex-basis:32px;border-radius:9px}
.modal-xl.ficha-compact .row-ic svg{width:15px;height:15px}
.modal-xl.ficha-compact .row-t{font-size:12.5px}.modal-xl.ficha-compact .row-s{font-size:11px}
.modal-xl.ficha-compact .empty{padding:10px;font-size:11.5px}
.modal-xl.ficha-compact .fech-sec{padding:9px 0}
.modal-xl.ficha-compact .steps{margin:2px 0}
.modal-xl.ficha-compact .step-dot{width:22px;height:22px;font-size:10px}
.modal-xl.ficha-compact .step::before{top:14px}
.modal-xl.ficha-compact .step-lbl{font-size:10.5px;margin-top:4px}
.modal-xl.ficha-compact .field{margin-bottom:10px}
.modal-xl.ficha-compact .field label{font-size:9px;margin-bottom:4px}
.modal-xl.ficha-compact .field input,.modal-xl.ficha-compact .field select,.modal-xl.ficha-compact .field textarea{font-size:12.5px;padding:8px 10px;border-radius:8px}
.modal-xl.ficha-compact .field textarea{min-height:56px}
.modal-xl.ficha-compact .field-row{gap:11px}
.modal-xl.ficha-compact .form-sec-title,.modal-xl.ficha-compact .modal-b .sec-title{padding-bottom:6px}
.modal-xl.ficha-compact .sug{padding:9px 13px;font-size:11.5px;margin-bottom:12px !important}
/* O quadro do Fechamento precisa deixar o dropdown de busca de documentos
   "vazar" para fora (o .card padrão tem overflow:hidden e o recortava). */
.modal-xl.ficha-compact .card.hi-prazo{overflow:visible}
.docpick-drop{z-index:50}
/* Mini janela compacta (Nova atividade): grade de 2 colunas enxuta. */
.modal-sm{max-width:470px}
.modal-sm .modal-h{padding:15px 18px 12px}
.modal-sm .modal-h h3{font-size:16px}
.modal-sm .modal-b{padding:15px 18px 18px}
.act-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.act-grid .ffull{grid-column:1 / -1}
.act-grid .field{margin:0}
.act-grid .field label{font-size:9px;letter-spacing:.09em;text-transform:uppercase;color:var(--faint);font-weight:700;margin-bottom:4px;display:block}

/* Modais de cadastro rápido centralizados na tela */
.overlay.center{align-items:center;padding:20px 16px}
/* Histórico: leitura mais confortável */
.tl-x{font-size:14px;line-height:1.6}
.tl-d{font-size:12px}

/* Editar andamento: lápis discreto no canto, só no hover do registro */
  /* Largura AUTOMATICA: a caixa nasceu com 26px fixos para um icone so, e
     ao ganhar o envelope do relatorio passou a apertar tres de 32px num
     espaco de um. Largura fixa em barra de acoes e divida: ela vence
     enquanto ninguem acrescenta nada. */
  .tl-edit{position:absolute;right:2px;top:-2px;display:flex;align-items:center;gap:2px;
           padding:2px 4px;height:30px;opacity:0;transition:opacity .15s;z-index:3;
           background:var(--paper);border-radius:9px;box-shadow:0 1px 6px -3px rgba(0,0,0,.25)}
  .tl-edit .mh-ic{width:26px;height:26px}
  .tl-edit .mh-ic svg{width:15px;height:15px}
.tl-i:hover .tl-edit{opacity:1}

/* ===== Janela de atividade (padrão Astrea adaptado ao WV) ===== */
.at-topo{display:flex;align-items:flex-start;gap:11px;margin-bottom:12px}
.at-check{flex:0 0 auto;width:19px;height:19px;border:2px solid var(--line);border-radius:5px;
  background:var(--paper);cursor:pointer;display:grid;place-items:center;margin-top:2px;padding:0;color:transparent}
.at-check:hover{border-color:var(--petroleo-txt)}
.at-check svg{width:12px;height:12px}
.at-check.on{background:var(--petroleo);border-color:var(--petroleo-txt);color:#fff}
/* Refinamento da janela (03/09, protótipo do Wadson): título mais leve e
   maior, grade de rótulos alinhada em coluna fixa, contagem de dias ao lado
   da data, fatal em selo, avatares, lista de atividades enxuta e rodapé com a
   ação primária. Tudo com os tokens de sempre; sem fonte nova. */
.at-titulo{font-size:19px;font-weight:500;color:var(--ink);line-height:1.35;letter-spacing:-.01em;text-wrap:pretty}
.at-titulo.feito{text-decoration:line-through;color:var(--faint);font-weight:500}
.at-meta{display:grid;grid-template-columns:132px minmax(0,1fr);gap:8px 12px;font-size:14px;align-items:baseline}
.at-meta dt{color:var(--faint);font-weight:500;white-space:nowrap}
.at-meta dd{margin:0;color:var(--ink);min-width:0}
.at-data{font-weight:600;color:var(--ink)}
.at-fatal{display:inline-flex;align-items:center;background:var(--danger-bg);color:var(--danger);border:1px solid color-mix(in srgb,var(--danger) 30%,transparent);padding:1px 8px;border-radius:5px;font-size:11.5px;font-weight:700;letter-spacing:.04em;margin-left:8px;vertical-align:1px}
.at-dias{font-size:13px;font-weight:600;margin-left:10px}
.at-dias.ok{color:var(--ok)}.at-dias.warn{color:var(--warn)}.at-dias.danger{color:var(--danger)}.at-dias.mut{color:var(--faint)}
.at-av{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--petroleo);color:#fff;font-size:10px;font-weight:700;letter-spacing:.02em;vertical-align:middle;background-size:cover;background-position:center;flex:0 0 auto}
.at-av.gold{background-color:var(--gold)}
.at-avs{display:inline-flex;vertical-align:middle;margin-right:6px}
.at-avs .at-av{border:1.5px solid var(--paper);margin-left:-7px}
.at-avs .at-av:first-child{margin-left:0}
.at-pessoa{display:inline-flex;align-items:center;gap:8px}
.tabs-u a small{font-size:12px;font-weight:500;color:var(--faint);margin-left:4px}
.ativ-list{border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-bottom:12px}
.ativ-it{display:flex;align-items:center;gap:12px;padding:11px 14px;border-top:1px solid var(--line-soft);text-decoration:none;color:inherit;background:var(--paper)}
.ativ-it:first-child{border-top:0}
/* Linha de tarefa solta dentro da janela do prazo: link + botão "vincular a este prazo". */
.ativ-wrap{display:flex;align-items:stretch;border-top:1px solid var(--line-soft)}
.ativ-wrap:first-child{border-top:0}
.ativ-wrap .ativ-it{flex:1;min-width:0;border-top:0}
.ativ-it:hover{background:var(--paper2)}
.ativ-it.ativa{background:var(--gold-tint)}
.ativ-dot{flex:0 0 auto;width:18px;height:18px;border-radius:50%;border:1.5px solid var(--line);background:var(--paper);display:grid;place-items:center;color:#fff;font-size:11px;font-weight:700}
.ativ-it.ativa .ativ-dot{border-color:var(--gold)}
.ativ-it.feita .ativ-dot{background:var(--ok);border-color:var(--ok)}
.ativ-it.cancelada .ativ-dot{border-color:var(--danger);background:var(--danger-bg)}
.ativ-tt{font-size:14px;font-weight:500;color:var(--ink);line-height:1.35}
.ativ-it.feita .ativ-tt{text-decoration:line-through;color:var(--faint)}
.ativ-mt{margin-top:3px;font-size:12.5px;color:var(--faint)}
.ativ-mt b{font-weight:600}
.ativ-mt b.ok{color:var(--ok)}.ativ-mt b.warn{color:var(--warn)}.ativ-mt b.danger{color:var(--danger)}
/* Marcador de atraso (04/09): círculo vermelho com "!" ao lado do "há N dias". */
.ativ-late{display:inline-grid;place-items:center;width:13px;height:13px;border-radius:50%;background:var(--danger);color:#fff;font:700 9px/1 var(--sans);vertical-align:1px;margin-left:1px;cursor:default}
.ativ-late::before{content:"!"}
/* Lista de envolvidos nas janelas de edição (caso e tarefa): o rótulo do
   checkbox é um nome de pessoa, não um título de campo. */
.ficha-edit #envLista label{text-transform:none;letter-spacing:0;font-size:12.5px;font-weight:500;color:var(--ink);display:flex;align-items:center;gap:7px;padding:3px 0;margin:0;cursor:pointer}
.ficha-edit #envLista input[type="checkbox"]{width:auto;margin:0}
/* × dentro do chip (contrato e envolvidos): tira o item sem abrir a lista. */
.chip .chip-x{border:0;background:none;color:inherit;font:inherit;font-size:13px;line-height:1;padding:0 0 0 2px;margin:0;cursor:pointer;opacity:.7}
.chip .chip-x:hover{opacity:1;color:var(--danger)}
.ativ-kind{font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;flex:0 0 78px;color:var(--faint)}
.ativ-it.prazo .ativ-kind{color:#e5484d}.ativ-it.audiencia .ativ-kind{color:var(--gold)}.ativ-it.tarefa .ativ-kind{color:#3b82f6}.ativ-it.compromisso .ativ-kind{color:#22a06b}
.at-foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:20px;padding-top:12px}
.at-foot .t-sub{font-size:12.5px}
.at-meta a{color:var(--petroleo-txt)}
.at-meta .num{border-bottom:1px dotted var(--faint);cursor:pointer;font-family:var(--mono);font-size:14px}
/* Legenda ao passar o mouse (03/09, pedido do Wadson): "Copiar", e "Copiado" depois do clique. */
.at-meta .num{position:relative}
.at-meta .num[data-tip]:hover::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 6px);transform:translateX(-50%);background:var(--ink);color:var(--paper);font:600 11px/1 var(--sans);padding:5px 8px;border-radius:5px;white-space:nowrap;pointer-events:none;z-index:5}
.at-data.warn{color:var(--warn)}.at-data.danger{color:var(--danger)}
.at-feito{background:var(--ok-bg,rgba(34,160,107,.1));border-radius:8px;padding:7px 11px;font-size:12.5px;
  color:var(--ok,#22a06b);margin:10px 0 0;display:inline-block}
/* Abas sublinhadas da janela */
.tabs-u{display:flex;gap:22px;align-items:flex-end;border-bottom:1px solid var(--line);margin:14px 0 10px}
.tabs-u .tabs-fer{margin-left:auto;padding-bottom:6px}
.tabs-u .tabs-fer .fsel{font-size:12px;padding:3px 8px}
.tabs-u a{font-size:13px;font-weight:600;color:var(--faint);padding:0 0 9px;text-decoration:none;
  border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs-u a:hover{color:var(--ink)}
.tabs-u a.on{color:var(--petroleo-txt);border-bottom-color:var(--gold)}
body.light .at-feito{background:rgba(34,160,107,.1)}
/* Janela da mãe (16/09, como no Astrea): trilha "Prazo / Tarefa" no topo,
   seção das tarefas-filhas em cartões e a sequência do fluxo em chips. */
/* Ficha do caso: tarefa agrupada sob o prazo (16/09), recuada por nível. */
.row.nivel1,.ativ-row.nivel1{padding-left:40px;background:color-mix(in srgb,var(--paper2) 55%,transparent)}
.row.nivel2,.ativ-row.nivel2{padding-left:66px;background:color-mix(in srgb,var(--paper2) 55%,transparent)}
.at-trilha{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12.5px;color:var(--faint);margin:0 0 10px}
.at-trilha a{color:var(--petroleo-txt);text-decoration:none;font-weight:600}
.at-trilha a:hover{text-decoration:underline}
.at-trilha .sep{color:var(--line)}
.at-trilha .kind{font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase}
.at-trilha .kind.prazo{color:#e5484d}.at-trilha .kind.audiencia{color:var(--gold)}.at-trilha .kind.tarefa{color:#3b82f6}.at-trilha .kind.compromisso{color:#22a06b}
.tf-sec{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--faint);margin:18px 0 8px}
.tf-sec .tf-n{background:var(--paper2);border-radius:10px;padding:0 7px;font-size:11px;color:var(--ink)}
.tf-sec .tf-ln{flex:1;border-top:1px solid var(--line)}
.tf-sec .tf-res{text-transform:none;letter-spacing:0;font-weight:500}
.tf-card{border:1px solid var(--line);border-left:3px solid #3b82f6;border-radius:0 8px 8px 0;padding:9px 12px;margin-bottom:8px;background:var(--paper)}
.tf-card.feita{border-left-color:var(--ok)}
.tf-card.cancelada{border-left-color:var(--danger)}
.tf-card.fila{opacity:.6}
.tf-r1{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tf-r1 .at-check{margin-top:0}
.tf-tt{font-size:14px;font-weight:500;color:var(--ink);text-decoration:none;flex:1;min-width:0}
.tf-tt:hover{text-decoration:underline}
.tf-card.feita .tf-tt{text-decoration:line-through;color:var(--faint)}
.tf-r2{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--faint);margin-top:5px;padding-left:27px}
.tf-r2 b{font-weight:600}.tf-r2 b.ok{color:var(--ok)}.tf-r2 b.warn{color:var(--warn)}.tf-r2 b.danger{color:var(--danger)}
.tf-r2 .tf-open{margin-left:auto;color:var(--petroleo-txt);text-decoration:none}
.tf-r2 .tf-open:hover{text-decoration:underline}
.seq{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12px}
.seq .seq-chip{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:10px;border:1px solid var(--line);background:var(--paper2);color:var(--ink);text-decoration:none;font-weight:500}
.seq .seq-chip:hover{border-color:var(--petroleo-txt)}
.seq .seq-chip.feita{background:var(--ok-bg,rgba(34,160,107,.12));color:var(--ok);border-color:transparent}
.seq .seq-chip.atual{outline:2px solid #3b82f6;outline-offset:1px;background:var(--petroleo-tint);color:var(--petroleo-txt)}
.seq .seq-chip.fila{color:var(--faint)}
.seq .seq-arrow{color:var(--faint);font-size:12px}
.btn-lnk{background:none;border:none;padding:0;font:inherit;color:var(--ink);cursor:pointer;
  border-bottom:1px dashed var(--line);line-height:1.3}
.btn-lnk:hover{color:var(--petroleo-txt);border-bottom-color:var(--petroleo-txt)}
/* Seletores com setinha dentro da janela de atividade (inline, não ícone) */
.at-meta .addmenu{top:24px;left:0;right:auto;min-width:170px}

/* ===== Sinais da triagem: urgente (call em 2h) e parada há +12h ===== */
.at-dot{width:8px;height:8px;border-radius:50%;flex:none;margin-right:6px}
.at-dot.urgente{background:#e5484d;box-shadow:0 0 0 3px rgba(229,72,77,.18)}
.at-dot.atrasada{background:#e8a33d;box-shadow:0 0 0 3px rgba(232,163,61,.18)}
.lead-card.at-urgente{border-left:3px solid #e5484d}
.lead-card.at-atrasada{border-left:3px solid #e8a33d}
tr.at-urgente td:first-child{box-shadow:inset 3px 0 0 #e5484d}
tr.at-atrasada td:first-child{box-shadow:inset 3px 0 0 #e8a33d}

/* ---------------- Intimações: linha rica (inspirada nas Publicações do Astrea) */
.int-kpi{display:flex;flex-direction:column;gap:1px;text-decoration:none}
.int-kpi b{font-family:var(--head);font-size:22px;font-weight:600;color:var(--ink);line-height:1}
.int-kpi span{font-size:10.5px;letter-spacing:.6px;text-transform:uppercase;color:var(--faint);font-weight:700}
.int-sep{width:1px;height:30px;background:var(--line)}
.int-bar{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:3px;height:100%}
.int-bar > span{width:11px;min-height:2px;border-radius:2px;background:var(--petroleo);display:block}
.int-bar i{font-size:8.5px;color:var(--faint);text-transform:uppercase;font-style:normal;font-weight:700}
.int-row{display:flex;gap:16px;padding:14px 18px;border-bottom:1px solid var(--line-soft);align-items:flex-start}
.int-row:last-child{border-bottom:none}
.int-row:hover{background:var(--paper2)}
.int-datas{flex:0 0 96px}
.int-d1{font-size:12.5px;font-weight:700}
.int-main{flex:1;min-width:0}
.int-caso{display:block;margin-top:4px;font-size:14px;font-weight:600;color:var(--petroleo-txt);text-decoration:none;line-height:1.35}
.int-caso:hover{text-decoration:underline}
.int-quem{flex:0 0 150px}
.int-acoes{flex:0 0 auto;display:flex;align-items:center;gap:4px}
.int-teor{margin-top:7px;font-size:13px;color:var(--muted);line-height:1.6;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:pre-wrap}
.int-teor.aberto{display:block;-webkit-line-clamp:unset;max-height:420px;overflow:auto;background:var(--paper2);border-radius:8px;padding:10px 12px;font-size:13.5px;line-height:1.7;color:var(--ink)}
.addmenu-btn{display:block;width:100%;text-align:left;background:none;border:none;padding:8px 12px;cursor:pointer;color:inherit;font:inherit}
.addmenu-btn:hover{background:var(--paper2)}
/* Termo encontrado destacado no teor (o Astrea marca em amarelo) */
.int-hl{background:var(--gold-tint);color:var(--gold);font-weight:700;border-radius:3px;padding:0 2px}
/* Intimações rodada 2: linha clicável, lote, ler mais */
.int-row{cursor:pointer}
.int-ck{flex:0 0 22px;padding-top:3px}
.int-ck input{width:15px;height:15px;cursor:pointer;accent-color:var(--petroleo-txt)}
.lermais{display:inline-block;margin-top:4px;font-size:11px;font-weight:700;color:var(--petroleo-txt);text-decoration:none}
.lermais:hover{text-decoration:underline}
/* Autocomplete do timesheet (digita e busca a demanda) */
.ts-sug{position:absolute;left:0;right:0;top:100%;z-index:60;background:var(--paper);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);max-height:280px;overflow:auto;margin-top:4px}
.ts-op{padding:9px 12px;font-size:12.5px;cursor:pointer;border-bottom:1px solid var(--line-soft)}
.ts-op:last-child{border-bottom:none}
.ts-op:hover{background:var(--paper2)}

/* ===== Filtro multi-seleção pesquisável (quadros/listas) ===== */
.fm-btn{cursor:pointer;display:inline-flex;align-items:center;gap:2px;white-space:nowrap}
.fm-menu{min-width:240px;max-width:300px;text-align:left;padding:10px 12px}
.fm-busca{width:100%;margin-bottom:8px;font-size:12.5px}
.fm-lista{max-height:230px;overflow-y:auto;padding-right:4px}
.fm-op{display:flex;gap:7px;align-items:center;font-size:12.5px;padding:3px 0;cursor:pointer}
.fm-op span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.badge.b-gold{background:var(--gold-tint);color:var(--gold)}

/* ===== Toolbar de ações estilo Astrea (impressora, excel, atualizar, +) ===== */
.tbar-ic{width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:var(--paper);display:inline-flex;align-items:center;justify-content:center;color:var(--faint);cursor:pointer;text-decoration:none;flex:0 0 auto}
.tbar-ic:hover{color:var(--gold);border-color:var(--gold-line)}
.tbar-ic svg{width:16px;height:16px}
.tbar-add{width:34px;height:34px;border-radius:9px;background:var(--gold);display:inline-flex;align-items:center;justify-content:center;color:var(--on-gold);text-decoration:none;flex:0 0 auto}
.tbar-add:hover{background:var(--gold-soft)}
.tbar-add svg{width:17px;height:17px}

/* ===== Banner de avisos do Meu Painel (Conteúdo do Portal) ===== */
.wv-banner{display:flex;align-items:center;gap:10px;background:var(--paper);border:1px solid var(--gold-line);border-radius:12px;padding:10px 14px;margin-bottom:12px;font-size:13px;color:var(--ink)}
/* Avisos do escritório em destaque (pedido 20/08): faixa dourada com barra
   de acento e tipografia maior; o mural continua na faixa discreta. */
.wv-banner-alto{background:linear-gradient(90deg,var(--gold-tint),var(--paper) 70%);border:1px solid var(--gold-line);border-left:4px solid var(--gold);padding:13px 16px;font-size:14px;box-shadow:0 8px 22px -16px rgba(193,152,71,.55)}
.wv-banner-alto .wv-banner-ic{width:30px;height:30px;flex:0 0 30px;border-radius:9px;background:var(--gold);color:#fff;display:grid;place-items:center}
.wv-banner-alto strong{font-size:14.5px}

/* Card de GESTÃO na ficha (regra da casa, 20/08): utilitário administrativo
   dentro de ficha usa sempre esta anatomia: título no card-h com a dica curta
   em t-sub à direita; corpo compacto; lista de pessoas em .gpick (grade);
   rodapé .gfoot com a explicação discreta (.ghint) à esquerda e a ação
   btn-sm à direita. Nada de texto longo solto nem botão largo no meio. */
.gpick{display:grid;grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:5px 14px;margin:6px 18px 2px}
.gpick label{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink);cursor:pointer;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gpick input{accent-color:var(--gold);flex:0 0 auto}
.gfoot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:10px 18px 13px}
.gfoot .btn,.grow .btn{flex:0 0 auto}
.ghint{font-size:11.5px;color:var(--faint);line-height:1.45;flex:1;min-width:180px}
/* Card "Consumo do pacote" do contrato (18/09): tabela por nível, barra,
   aviso, histórico de 6 meses em mini-barras e a hora técnica do contrato. */
.cp-wrap{padding:6px 16px 4px}
.cp-tbl td,.cp-tbl th{padding:7px 8px}
.cp-tbl tfoot td{border-top:1px solid var(--line);padding-top:9px}
.cp-barra{height:8px;border-radius:6px;background:var(--line-soft);overflow:hidden;margin-top:10px}
.cp-barra i{display:block;height:100%;background:var(--petroleo);border-radius:6px}
.cp-barra i.amber{background:var(--warn)}.cp-barra i.red{background:var(--danger)}
.cp-aviso{margin-top:10px;padding:10px 12px;border-radius:9px;background:var(--danger-bg);display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap}
.cp-aviso p{margin:0;font-size:12.5px;line-height:1.45;flex:1;min-width:200px}
.cp-hist{display:flex;gap:6px;padding:0 16px;align-items:flex-end}
.cp-h{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;text-decoration:none;color:var(--muted);font-size:11px;padding:6px 2px;border-radius:8px}
.cp-h:hover{background:var(--paper2)}
.cp-h.on{background:var(--gold-tint);color:var(--ink)}
.cp-h-b{width:100%;height:46px;background:var(--line-soft);border-radius:5px;display:flex;align-items:flex-end;overflow:hidden}
.cp-h-b i{display:block;width:100%;background:var(--petroleo);min-height:2px}
.cp-h-b i.amber{background:var(--warn)}.cp-h-b i.red{background:var(--danger)}
.cp-h-p.red{color:var(--danger);font-weight:700}
.cp-ht{display:grid;grid-template-columns:repeat(5,1fr) auto;gap:8px;align-items:end;margin:0 16px 8px}
.cp-ht .field{margin:0;min-width:0}.cp-ht input{width:100%;padding:5px 8px;font-size:12.5px}
@media (max-width:900px){.cp-ht{grid-template-columns:1fr 1fr 1fr}}
/* Card "Reajustes do plano" do contrato (18/09): linha alinhada e form em grade. */
.rj-marco{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:4px 16px 8px;padding-bottom:10px;border-bottom:1px solid var(--line-soft);font-size:13px}
.rj-marco-k{color:var(--muted);flex:0 0 auto}
.rj-marco-v{flex:1;min-width:140px}
.rj-marco input{width:auto;padding:5px 8px;font-size:12.5px}
.rj-row{align-items:baseline}
.rj-per{flex:0 0 150px;white-space:nowrap}
.rj-val{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.rj-val .rj-meta{flex-basis:100%;font-size:12px}
/* O card ocupa meia página: duas linhas (valor · de · até / motivo · botão). */
.rj-form{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px 12px;align-items:end;margin:12px 16px 4px}
.rj-form .field{margin:0;min-width:0}
.rj-form input{width:100%}
.rj-form .rj-motivo{grid-column:1/3}
.rj-form .btn{justify-self:start}
.card-b > .ghint{display:block;margin:6px 18px 0}
.grow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 18px 0}
.grow input[type=email],.grow input[type=text]{flex:1;min-width:0}
/* Card de gestão RETRÁTIL (regra 20/08): usa <details class="card gcard">
   com <summary class="card-h">; nasce fechado (discrição), o chevron gira
   ao abrir. Sem JS. */
details.gcard > summary{cursor:pointer;list-style:none}
details.gcard > summary::-webkit-details-marker{display:none}
details.gcard .gchev{flex:0 0 auto;color:var(--faint);transition:transform .2s;margin-left:4px}
details.gcard[open] > summary .gchev{transform:rotate(180deg)}
details.gcard:not([open]) > summary{border-bottom:none}

.wv-banner .wv-banner-item{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}


/* ===== Barra integrada de filtros (seta + busca + etiqueta + status), como no Astrea ===== */
.fbar{display:inline-flex;align-items:stretch;border:1px solid var(--line);border-radius:12px;background:var(--paper);overflow:visible;flex:1;min-width:300px;max-width:760px}
.fbar>*{border:none !important;border-radius:0 !important;background:transparent !important}
.fbar>*+*{border-left:1px solid var(--line) !important}
.fbar .fbar-seta{width:40px;display:inline-flex;align-items:center;justify-content:center;color:var(--faint);cursor:pointer;position:relative;flex:0 0 auto}
.fbar .fbar-seta:hover{color:var(--gold)}
/* Campo de busca: flexível, SEM o max-width do .tool-in; lupa no fim (Astrea). */
.fbar .fbar-q{flex:1 1 auto;display:flex;align-items:center;min-width:0;padding:0 0 0 14px}
.fbar .fbar-q input{border:none;outline:none;background:transparent;font-family:inherit;font-size:12.5px;color:var(--ink);width:100%;min-width:0;padding:9px 0}
.fbar .fbar-lupa{width:40px;display:inline-flex;align-items:center;justify-content:center;color:var(--faint);cursor:pointer;border-left:none !important;flex:0 0 auto}
.fbar .fbar-lupa:hover{color:var(--gold)}
.fbar .fbar-lupa svg{width:15px;height:15px}
.fbar .addwrap{display:inline-flex !important;align-items:center;flex:0 0 auto}
.fbar .tbar-ic{width:40px;height:auto;align-self:stretch}
.fbar select{width:auto;max-width:150px;font-size:12.5px;font-weight:600;letter-spacing:.3px;padding:8px 26px 8px 12px;flex:0 0 auto;cursor:pointer}

/* ===== Filtro Avançado (Todas as demandas): grade alinhada ===== */
.fav{width:100%;padding:16px 18px;overflow:visible;margin-bottom:12px}
.fav-topo{display:flex;gap:12px;flex-wrap:wrap;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--line-soft);margin-bottom:16px}
.fav-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px 28px;align-items:start}
.fav-col{display:flex;flex-direction:column;gap:8px;min-width:0}
.fav-t{font-size:11.5px;color:var(--faint);text-transform:uppercase;letter-spacing:.4px}
.fav-col select,.fav-col .fsel{width:100%;max-width:250px}
.fav-col .addwrap{display:block !important;max-width:250px}
.fav-col .fm-btn{width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left}
.fav-op{display:flex;gap:7px;align-items:center;font-size:12.5px;padding:3px 0;cursor:pointer}

/* ============ Aba Desempenho (cockpit) ============ */
.dp-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.dp-who{display:flex;align-items:center;gap:10px;margin-top:5px;flex-wrap:wrap}
.dp-lvl{background:var(--gold-tint);color:var(--gold);font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px;letter-spacing:.02em}
.dp-tools{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.dp-seg{display:flex;background:var(--paper2);border:1px solid var(--line);border-radius:10px;padding:3px}
.dp-seg a{font-size:11.5px;font-weight:600;color:var(--muted);padding:6px 12px;border-radius:8px;text-decoration:none}
.dp-seg a.on{background:var(--paper);color:var(--ink);box-shadow:var(--shadow)}
.dp-tag{font-size:10px;font-weight:700;letter-spacing:.03em;padding:3px 9px;border-radius:20px;text-transform:uppercase}
.dp-tag.gold{background:var(--gold-tint);color:var(--gold)} .dp-tag.teal{background:var(--petroleo-tint);color:var(--petroleo-txt)}
.dp-tag.ok{background:var(--ok-bg);color:var(--ok)} .dp-tag.warn{background:var(--warn-bg);color:var(--warn)}
.dp-tag.mut{background:var(--paper2);color:var(--muted)}
.dp-lbl{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);font-weight:700}

/* KPI gauge + dimensões */
.dp-kpihero{display:grid;grid-template-columns:210px 1fr;gap:26px;align-items:center}
@media(max-width:720px){.dp-kpihero{grid-template-columns:1fr}}
.dp-gauge{position:relative;width:200px;height:122px;margin:0 auto}
.dp-gauge .v{position:absolute;left:0;right:0;bottom:6px;text-align:center}
.dp-gauge .v .n{font-family:var(--head);font-size:34px;color:var(--ink);font-weight:600;line-height:1}
.dp-gauge .v .n small{font-size:15px;color:var(--faint)}
.dp-gauge .v .c{font-size:10.5px;color:var(--muted);margin-top:2px}
.dp-dims{display:grid;grid-template-columns:1fr 1fr;gap:12px 26px}
@media(max-width:560px){.dp-dims{grid-template-columns:1fr}}
.dp-dim .t{display:flex;justify-content:space-between;font-size:12px;margin-bottom:5px}
.dp-dim .t b{color:var(--ink);font-weight:600} .dp-dim .t span{color:var(--muted);font-variant-numeric:tabular-nums}

/* Plano de Carreira: trilha */
.dp-bands{display:flex;margin-bottom:8px}
.dp-band{font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);font-weight:700;text-align:center}
.dp-track{position:relative;display:flex;align-items:flex-start;padding-top:2px}
.dp-track::before{content:"";position:absolute;left:3%;right:3%;top:11px;height:3px;background:var(--line);border-radius:3px}
.dp-fill{position:absolute;left:3%;top:11px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--petroleo),var(--gold));transition:width 1s ease}
.dp-node{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;position:relative;z-index:2;min-width:0}
.dp-node .dot{width:20px;height:20px;border-radius:50%;background:var(--paper);border:2.5px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:8px;font-weight:700;color:var(--faint)}
.dp-node.done .dot{background:var(--petroleo);border-color:var(--petroleo-txt);color:#fff}
.dp-node.cur .dot{width:30px;height:30px;margin-top:-5px;background:linear-gradient(135deg,var(--gold),var(--gold-soft));border-color:var(--paper);box-shadow:0 0 0 4px var(--gold-tint);color:#0b3b39;font-size:10px}
.dp-node .cap{font-size:9px;color:var(--faint);text-align:center;line-height:1.15;max-width:64px}
.dp-node.cur .cap{color:var(--gold);font-weight:700} .dp-node.done .cap{color:var(--muted)}
.dp-youtag{position:absolute;top:-23px;background:var(--ink);color:var(--canvas);font-size:9px;font-weight:700;padding:3px 7px;border-radius:6px;white-space:nowrap}
.dp-nextrow{display:grid;grid-template-columns:1.5fr 1fr;gap:16px;margin-top:22px}
@media(max-width:720px){.dp-nextrow{grid-template-columns:1fr}}
.dp-crit{display:flex;flex-direction:column;gap:9px}
.dp-crit .it{display:flex;align-items:center;gap:9px;font-size:12px}
.dp-crit .ck{width:16px;height:16px;border-radius:5px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;background:var(--paper2);color:var(--faint)}
.dp-crit .it.ok .ck{background:var(--ok-bg);color:var(--ok)}
.dp-crit .ck svg{width:11px;height:11px}
.dp-crit .txt{color:var(--muted)} .dp-crit .txt b{color:var(--ink);font-weight:600}
.dp-crit .pc{margin-left:auto;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
.dp-sc{display:flex;align-items:center;gap:11px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--paper2);text-decoration:none;margin-bottom:10px}
.dp-sc:hover{border-color:var(--gold-line)}
.dp-sc .ic{width:34px;height:34px;border-radius:9px;background:var(--gold-tint);color:var(--gold);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.dp-sc .ic svg{width:17px;height:17px} .dp-sc .tt{font-size:12.5px;font-weight:600;color:var(--ink)} .dp-sc .ss{font-size:10.5px;color:var(--muted)}
.dp-sc .go{margin-left:auto;color:var(--faint)}

/* PDI / PDC linhas + ring */
.dp-pline{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line-soft)}
.dp-pline:last-child{border-bottom:none}
.dp-pico{width:32px;height:32px;border-radius:9px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;background:var(--petroleo-tint);color:var(--petroleo-txt)}
.dp-pico.video{background:var(--danger-bg);color:var(--danger)} .dp-pico.leitura{background:var(--gold-tint);color:var(--gold)}
.dp-pico svg{width:16px;height:16px}
.dp-pline .mid{flex:1;min-width:0}
.dp-pline .mid .tt{font-size:12.5px;color:var(--ink);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dp-pline .mid .mt{font-size:10.5px;color:var(--muted)}
.dp-pline .pr{width:120px;flex:0 0 auto} .dp-pline .pr .pc{font-size:10px;color:var(--muted);text-align:right;margin-top:3px}
.dp-pline .st{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;flex:0 0 auto;width:78px;text-align:right}
.dp-pline .st.ok{color:var(--ok)} .dp-pline .st.prog{color:var(--gold)} .dp-pline .st.todo{color:var(--faint)}
.dp-ring{--p:0;position:relative;width:52px;height:52px;border-radius:50%;flex:0 0 auto;background:conic-gradient(var(--petroleo) calc(var(--p)*1%),var(--paper2) 0)}
.dp-ring::before{content:"";position:absolute;inset:5px;background:var(--paper);border-radius:50%}
.dp-ring b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--ink)}

/* Cards de metas */
.dp-metas{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:760px){.dp-metas{grid-template-columns:1fr}}
.dp-meta{border:1px solid var(--line);border-radius:13px;padding:15px}
.dp-meta .mh{display:flex;justify-content:space-between;gap:8px;margin-bottom:9px}
.dp-meta .tp{font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gold)}
.dp-meta .tt{font-size:12.5px;color:var(--ink);font-weight:600;line-height:1.3;margin-bottom:12px;min-height:32px}
.dp-meta .ft{display:flex;justify-content:space-between;align-items:center;font-size:10.5px;color:var(--muted);margin-top:9px}

/* Visão gestor */
.dp-tcards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}
@media(max-width:900px){.dp-tcards{grid-template-columns:repeat(2,1fr)}}
.dp-person{display:flex;align-items:center;gap:10px}
.dp-person .av{width:30px;height:30px;border-radius:8px;background:var(--petroleo);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.dp-person .nm{font-weight:600;color:var(--ink);font-size:12px} .dp-person .rl{font-size:10px;color:var(--muted)}
.dp-kpibadge{font-family:var(--head);font-weight:600;font-size:15px}
.dp-mini{width:96px;height:6px;border-radius:6px;background:var(--paper2);display:inline-block;vertical-align:middle;overflow:hidden}
.dp-mini > i{display:block;height:100%;background:linear-gradient(90deg,var(--petroleo),var(--petroleo-700))}

/* Desempenho: barras em petróleo (as .gold ficam douradas). */
#dashBody .dp-dims .bar:not(.gold) > i,
#dashBody .dp-pline .bar > i,
#dashBody .card.stat .bar > i,
#dashBody .dp-meta .bar:not(.gold) > i{background:linear-gradient(90deg,var(--petroleo),var(--petroleo-700))}

/* Desempenho: corpo de texto maior (2 ajustes do Wadson). */
#dashBody .dp-lbl{font-size:11.5px}
#dashBody .dp-dim .t{font-size:14px}
#dashBody .dp-dim .t b{font-weight:600}
#dashBody .dp-crit .it{font-size:14px}
#dashBody .dp-pline .mid .tt{font-size:14.5px}
#dashBody .dp-pline .mid .mt{font-size:12.5px}
#dashBody .dp-pline .st{font-size:11px}
#dashBody .dp-meta .tt{font-size:14.5px}
#dashBody .dp-meta .tp{font-size:11px}
#dashBody .dp-seg a{font-size:13.5px}
#dashBody .dp-who .t-sub{font-size:13.5px}
#dashBody .dp-lvl{font-size:12px}
#dashBody .dp-person .nm{font-size:14px}
#dashBody .dp-person .rl{font-size:11.5px}
#dashBody .dp-sc .tt{font-size:14.5px}
#dashBody .dp-sc .ss{font-size:12.5px}
#dashBody .dp-node .cap{font-size:10px}
#dashBody .card.stat .t-sub{font-size:13.5px}
#dashBody table.tbl td{font-size:14px}
#dashBody table.tbl th{font-size:11.5px}
#dashBody .dp-tag{font-size:11px}

/* Plano de Carreira: sem barra de rolagem, responsivo, com respiro acima. */
#dashBody .dp-ladder{margin-top:16px;overflow:visible}
#dashBody .dp-bands{margin-bottom:10px}
#dashBody .dp-track{overflow:visible}
#dashBody .dp-node{min-width:0;padding:0 1px}
#dashBody .dp-node .cap{max-width:100%;font-size:9.5px;line-height:1.2;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
#dashBody .dp-node .dot{flex:0 0 auto}

/* Faixa comercial da Visão Geral (quem tem CRM): linhas compactas no card */
.kpi-line{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;margin-top:5px}
.kpi-line span{color:var(--muted)}
.kpi-line b{font-weight:600;color:var(--ink)}
.kpi-line b.ok{color:var(--ok)}

/* Financeiro: grade alinhada da Visão geral */
.fin-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:14px;align-items:start}
@media(max-width:1100px){.fin-grid{grid-template-columns:1fr}}

/* Financeiro · dashboard da Visão geral (protótipo financeiro.html) */
.fin-grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;align-items:start}
@media(max-width:1200px){.fin-grid3{grid-template-columns:1fr}}
.fx-chart{display:flex;gap:18px;align-items:flex-end;height:180px;padding:0 6px}
.fx-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%}
.fx-bars{display:flex;gap:5px;align-items:flex-end;flex:1;width:100%;justify-content:center;border-bottom:1px solid var(--line);padding-bottom:2px}
.fx-bars i{display:block;width:22%;max-width:26px;min-height:2px;border-radius:4px 4px 0 0}
.fx-lbl{font-size:11px;color:var(--muted)}
.fx-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin:0 3px 0 8px;vertical-align:middle}
.dre-row{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:13px;align-items:center}
.dre-row b{font-weight:600}
.dre-row.dre-total{border-bottom:0;border-top:2px solid var(--line);font-size:14px}
.rc-item{margin:10px 0}
.rc-top{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;margin-bottom:4px}
.rc-bar{height:7px;border-radius:4px;background:var(--paper2);overflow:hidden}
.rc-bar i{display:block;height:100%;border-radius:4px;background:var(--petroleo)}
.rc-bar.hot i{background:var(--danger)}
.ag-pills{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:8px}
.ag-pill{border:1px solid var(--line);border-radius:10px;padding:8px 6px;text-align:center;background:var(--paper2)}
.ag-pill span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.ag-pill b{font-size:13px;font-weight:600}
.ag-pill.warn{border-color:color-mix(in srgb, var(--gold) 45%, transparent)}
.ag-pill.warn b{color:var(--gold)}
.ag-pill.hot{border-color:color-mix(in srgb, var(--danger) 45%, transparent)}
.ag-pill.hot b{color:var(--danger)}
.donut{width:104px;height:104px;border-radius:50%;flex:0 0 104px;display:flex;align-items:center;justify-content:center;position:relative}
.donut::before{content:'';position:absolute;inset:16px;border-radius:50%;background:var(--paper)}
.donut span{position:relative;font-weight:700;font-size:16px;text-align:center;line-height:1.1}
.donut span small{display:block;font-size:9.5px;color:var(--muted);font-weight:500;text-transform:uppercase}
.pend4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:1100px){.pend4{grid-template-columns:1fr 1fr}}
.pend-card{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;padding:12px;background:var(--paper2);text-decoration:none;color:inherit;transition:border-color .15s}
.pend-card:hover{border-color:var(--gold)}
.pend-ic{width:32px;height:32px;border-radius:9px;background:color-mix(in srgb, var(--gold) 18%, transparent);color:var(--gold);display:flex;align-items:center;justify-content:center;flex:0 0 32px}
.pend-ic svg{width:16px;height:16px}
.pend-card b{display:block;font-size:15px}
.pend-card span{display:block;font-size:11.5px;color:var(--muted)}
.pend-card em{display:block;font-style:normal;font-size:11.5px;color:var(--gold);margin-top:3px}
.kpi-band{align-items:stretch}

/* Financeiro · abas do módulo e barras (protótipo financeiro.html) */
.fin-tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin:14px 0 16px;flex-wrap:wrap}
.fin-tab{padding:9px 16px;font-size:13.5px;color:var(--muted);text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;transition:color .12s}
.fin-tab:hover{color:var(--ink)}
.fin-tab.on{color:var(--ink);font-weight:600;border-bottom-color:var(--gold)}
.fin-tabs.sub{border-bottom:0;margin:0;gap:6px}
.fin-tabs.sub .fin-tab{border:1px solid var(--line);border-radius:8px;padding:6px 12px;font-size:12.5px}
.fin-tabs.sub .fin-tab.on{border-color:var(--gold);background:var(--gold-tint);color:var(--ink)}
.fin-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.fin-actions{display:flex;gap:6px;flex-wrap:wrap}
.fin-actions .btn{white-space:nowrap}
.fin-filtros{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;background:var(--paper2);border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:12px}
.fin-filtros .mesnav{display:flex;align-items:center;gap:8px}
.fin-filtros .mesnav b{min-width:110px;text-align:center;font-size:13px}
.fin-f{display:flex;flex-direction:column;gap:3px;font-size:11px}
.fin-f>span{text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:500}
.fin-f input,.fin-f select{min-width:150px}

/* Financeiro · Fluxo de caixa colorido (matriz Astrea) */
.fx-matrix td,.fx-matrix th{padding:7px 12px;font-size:12.5px}
.fx-matrix thead th{border-bottom:2px solid var(--line);vertical-align:top}
.fx-atual{background:var(--gold-tint)}
.fx-matrix td.fx-atual,.fx-matrix .fx-atual{background:var(--gold-tint)}
.fx-matrix tbody tr td:nth-child(3){background:color-mix(in srgb, var(--gold) 8%, transparent)}
.fx-sq{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:8px;vertical-align:-1px}
.fx-saldoant td{font-weight:600;background:var(--paper2)}
.fx-sec td{font-weight:700;letter-spacing:.04em;font-size:11.5px;padding:6px 12px}
.fx-ent td{background:color-mix(in srgb, var(--ok) 14%, transparent);color:var(--ok)}
.fx-sai td{background:color-mix(in srgb, var(--danger) 12%, transparent);color:var(--danger)}
.fx-grp td:first-child{font-weight:500}
.fx-sub td{font-size:11.5px}
.fx-total td{font-weight:600;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.fx-saldo td{font-weight:700;border-top:2px solid var(--line);background:var(--paper2)}
.fx-saldofim td{font-weight:800;border-top:1px solid var(--line);background:var(--gold-tint)}
/* Fluxo de caixa: leitura confortável (números maiores que o padrão da .tbl). */
.fx-matrix th{font-size:11px}
.fx-matrix td{font-size:13.5px;padding:9px 12px}

/* ============================================================
   PADRÃO DO SISTEMA · ícone "i" com tooltip no hover.
   Orientações e notas ficam só no ícone; o texto abre ao passar
   o mouse, maior e legível. Uso: <span class="wv-info">i
   <span class="wv-info-tip">texto...</span></span>
   ============================================================ */
.wv-info{position:relative;display:inline-flex;width:15px;height:15px;border-radius:50%;
  background:transparent;color:var(--muted);border:1px solid var(--line);font-size:9.5px;font-style:italic;font-weight:700;
  align-items:center;justify-content:center;cursor:help;vertical-align:middle;flex:0 0 auto;
  text-transform:none;letter-spacing:normal;transition:color .15s,border-color .15s}
.wv-info:hover{color:var(--gold);border-color:var(--gold-line)}
/* A caixa é position:fixed e quem posiciona é o JS global do base.html
   (wvInfoPos): mede o ícone e trava o texto DENTRO da janela, abrindo para
   cima ou para baixo conforme o espaço. As classes .baixo/.dir de telas
   antigas são ignoradas sem quebrar nada. */
/* .wv-tip: SÓ o comportamento do tooltip, sem estilo visual próprio. Serve
   para pendurar o texto em qualquer elemento que já tenha aparência (ex.: o
   badge "Cliente notificado" no Histórico do caso). O mesmo posicionador
   global do base.html atende .wv-info e .wv-tip.
   ATENÇÃO: nada de filter/opacity/transform aqui nem em quem contém o
   elemento. Qualquer um dos três cria um stacking context novo e faz o
   position:fixed da caixa passar a se posicionar pelo elemento em vez da
   janela, jogando o texto para fora do lugar. */
.wv-tip{position:relative;cursor:help}
.badge.wv-tip{padding:3px 6px;gap:0}
.badge.wv-tip svg{width:13px;height:13px;flex:0 0 auto}
.wv-tip-h{font-weight:700;color:var(--ink);margin-bottom:6px;font-size:12px}
.wv-tip-m{border-left:2px solid var(--gold-line);padding-left:10px;margin:6px 0}
.wv-tip-f{color:var(--muted);font-size:11.5px;margin-top:7px}

.wv-info .wv-info-tip,
.wv-tip .wv-info-tip{display:none;position:fixed;left:0;top:0;background:var(--paper);
  color:var(--ink);border:1px solid var(--line);border-radius:11px;
  box-shadow:0 14px 40px -14px rgba(0,0,0,.35);padding:13px 15px;
  font-size:13.5px;font-style:normal;font-weight:500;line-height:1.6;
  --tip-w:360px;width:var(--tip-w);
  z-index:120;text-align:left;white-space:normal;text-transform:none;letter-spacing:normal;
  /* teor de publicação é longo: trava a altura e rola dentro da caixa */
  max-height:min(58vh,420px);overflow:auto}
/* Caixa larga, para textos longos (o JS lê --tip-w para calcular a posição). */
.wv-info-tip.wide{--tip-w:600px}

/* ============================================================
   Financeiro · port fiel do protótipo docs/financeiro_3.html.
   Cores mapeadas para as variáveis de tema do WV (claro/escuro).
   ============================================================ */
/* menu "+ Adicionar lançamento" (dropdown da topbar) */
.fin-dd{position:relative;display:inline-block}
.fin-dd-menu{position:absolute;right:0;top:calc(100% + 7px);min-width:220px;background:var(--paper);
  border:1px solid var(--line);border-radius:11px;box-shadow:0 18px 44px -18px rgba(0,0,0,.35);
  padding:6px;z-index:60;display:none}
.fin-dd-menu.on{display:block}
.fin-dd-menu a{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:8px;
  font-size:12.5px;color:var(--ink);cursor:pointer;text-decoration:none}
.fin-dd-menu a:hover{background:var(--paper2)}
.fin-dd-sep{height:1px;background:var(--line-soft);margin:5px 6px}

/* sub-abas segmentadas (Todos / A pagar·A receber / …) */
.fsub{display:inline-flex;gap:2px;background:var(--paper2);border-radius:9px;padding:3px;margin-bottom:14px;flex-wrap:wrap}
.fsub a{font-size:12px;font-weight:600;color:var(--muted);padding:6px 13px;border-radius:6px;cursor:pointer;text-decoration:none}
.fsub a.on{background:var(--paper);color:var(--ink);box-shadow:var(--shadow)}

/* toolbar de chips (contas, mês, filtros, incluir internos) */
.ftoolbar{display:flex;gap:8px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.chipbtn{display:inline-flex;align-items:center;gap:7px;background:var(--paper);border:1px solid var(--line);
  border-radius:9px;padding:8px 12px;font-size:12px;color:var(--ink);cursor:pointer;font-weight:600;text-decoration:none}
.chipbtn:hover{border-color:var(--gold)}
.chipbtn svg{width:13px;height:13px;color:var(--muted)}
.chipbtn.teal{border-color:var(--info);color:var(--info)}
.chipbtn.teal:hover{border-color:var(--info)}
.iib{display:inline-flex;width:15px;height:15px;border-radius:50%;background:var(--info);color:#fff;
  font-size:9px;font-style:italic;font-weight:700;align-items:center;justify-content:center}

/* painel de filtro avançado */
.filterpanel{background:var(--paper);border:1px solid var(--line);border-radius:13px;box-shadow:var(--shadow);padding:16px 18px;margin-bottom:14px}
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 22px}
.fgrid .fl{font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:5px}
.finp{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-family:inherit;font-size:12px;color:var(--ink);background:var(--paper2)}
.fradios{display:flex;gap:14px;font-size:12px;color:var(--ink);align-items:center;flex-wrap:wrap}
.fradios label{display:inline-flex;align-items:center;gap:5px}
.filter-foot{display:flex;justify-content:flex-end;gap:9px;margin-top:14px}

/* tabela de lançamentos: dia, seta, parcela, chip de categoria, boleto, pago */
.dayrow td{background:var(--paper2);font-size:11px;color:var(--muted);text-align:right;font-weight:600;padding:6px 12px}
.dayrow td b{color:var(--ink)}
.arr{display:inline-flex;font-weight:700;font-size:12px}.arr.in{color:var(--ok)}.arr.out{color:var(--danger)}
.parcel{font-size:9.5px;background:var(--paper2);color:var(--muted);border-radius:5px;padding:1px 6px;margin-left:6px;font-weight:600}
.cchip{font-size:9.5px;font-weight:700;padding:2px 8px;border-radius:5px;text-transform:uppercase;letter-spacing:.02em;display:inline-block;white-space:nowrap}
/* Check de pagamento: círculo com o traço do "certo" desenhado em CSS
   (fica nítido em qualquer zoom). Vazio esboça o check no hover; pago fica
   verde cheio com leve sombra e clarece no hover (dica de que desfaz). */
button.ck{width:21px;height:21px;border-radius:50%;border:1.6px solid var(--line);
  display:inline-block;vertical-align:middle;cursor:pointer;background:var(--paper);
  padding:0;position:relative;transition:border-color .15s,background .15s,box-shadow .15s}
button.ck::after{content:"";position:absolute;left:6px;top:3.5px;width:5.5px;height:9.5px;
  border:solid transparent;border-width:0 2px 2px 0;transform:rotate(42deg);
  transition:border-color .15s}
button.ck:hover{border-color:var(--ok);background:color-mix(in srgb, var(--ok) 10%, var(--paper))}
button.ck:hover::after{border-color:color-mix(in srgb, var(--ok) 65%, transparent)}
button.ck.on{background:var(--ok);border-color:var(--ok);
  box-shadow:0 3px 9px -3px color-mix(in srgb, var(--ok) 60%, transparent)}
button.ck.on::after{border-color:#fff}
button.ck.on:hover{filter:brightness(1.1)}
/* Mini código de barras (estilo Astrea) do lançamento com boleto/cobrança. */
.boleto-i{width:22px;height:11px;fill:var(--gold);display:inline-block;vertical-align:middle;opacity:.9}
.tfoot{display:flex;gap:22px;padding:12px 10px 0;font-size:11.5px;flex-wrap:wrap}
.tfoot b{font-weight:700}.tfoot span.lb{color:var(--muted)}
.fatbtn{background:var(--info-bg);border:1px solid var(--info);color:var(--info);font-weight:700;font-size:10.5px;border-radius:7px;padding:5px 10px;cursor:pointer;text-decoration:none;display:inline-block}
.fnote{font-size:11px;color:var(--muted);margin-top:14px;display:flex;gap:7px;align-items:flex-start;line-height:1.5}
.fnote .i-i{display:inline-flex;width:15px;height:15px;border-radius:50%;background:var(--info);color:#fff;font-size:9px;font-style:italic;font-weight:700;align-items:center;justify-content:center;flex:0 0 auto;margin-top:1px}

/* modelos de fatura (A faturar) + grupos */
.modelos{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}
.modelo{border:1.5px solid var(--line);border-radius:13px;padding:15px;cursor:pointer;background:var(--paper);display:block;text-align:left}
.modelo:hover{border-color:var(--gold)}
.modelo.on{border-color:var(--gold);background:var(--gold-tint);box-shadow:0 0 0 3px var(--gold-tint)}
.modelo .mic{width:34px;height:34px;border-radius:9px;background:var(--gold-tint);color:var(--gold);display:flex;align-items:center;justify-content:center;margin-bottom:9px}
.modelo .mic svg{width:18px;height:18px}
.modelo .mt{font-family:var(--serif,Georgia,serif);font-size:14px;color:var(--ink);font-weight:600}
.modelo .md{font-size:11px;color:var(--muted);margin-top:4px;line-height:1.4}
.grp{border:1px solid var(--line);border-radius:11px;margin-bottom:10px;overflow:hidden}
.grp-h{display:flex;align-items:center;gap:10px;padding:11px 14px;background:var(--paper2);font-size:12px;font-weight:700;color:var(--ink)}
.grp-h .cnt{color:var(--muted);font-weight:500}.grp-h .tot{margin-left:auto;font-variant-numeric:tabular-nums}
/* Cabeçalho e valores com o MESMO recuo lateral (10px): sem isso o título da
   coluna numérica fica deslocado dos números (th padrão usa 18px). */
.fin-lanc th{padding-left:10px;padding-right:10px}
.fin-lanc th.num-h{text-align:right}
/* Coluna numérica: valor alinhado à DIREITA, embaixo do título (a classe era
   usada nas tabelas mas nunca teve alinhamento global definido). */
.tbl td.num{text-align:right;font-variant-numeric:tabular-nums}
/* Linhas no padrão compacto dos Lançamentos (Pagos e recebidos). */
.grp .git{display:flex;align-items:center;gap:10px;padding:4px 14px;min-height:35px;border-top:1px solid var(--line-soft);font-size:12px}
.grp .git .nm{flex:1;color:var(--ink);line-height:1.3}.grp .git .nm small{display:block;color:var(--muted);font-size:10px;margin-top:1px}
.grp .git .val{font-variant-numeric:tabular-nums;font-weight:600;color:var(--ink)}
/* A faturar: listas de solicitações e de clientes também compactas. */
.af-compact .row{padding:4px 16px;min-height:35px;gap:11px}
.af-compact .row-t{font-size:12.5px;line-height:1.35}
.af-compact .row-s{margin-top:0;font-size:11px;line-height:1.35}

/* Configurações · sub-abas (chips outline) e painéis */
.confchips{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.cfg-chip{border:1px solid var(--line);background:var(--paper);border-radius:9px;padding:8px 14px;
  font-family:inherit;font-size:12px;font-weight:600;color:var(--muted);cursor:pointer}
.cfg-chip.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.confpanel{display:none}
.confpanel.on{display:block}
.catlist{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.catrow{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:11px;padding:11px 14px}
.catrow .cnm{font-size:12.5px;color:var(--ink);font-weight:600}.catrow .cty{font-size:10px;color:var(--muted)}
/* Categorias em ITEM (grupo) e SUBITENS: compactas, letra maior. */
.cat-item{border:1px solid var(--line);border-radius:11px;padding:10px 14px 6px;margin-bottom:10px}
.cat-item-t{font-size:12px;font-weight:700;color:var(--ink);text-transform:uppercase;letter-spacing:.04em;margin-bottom:4px}
.cat-sub{display:flex;align-items:center;gap:9px;padding:5px 0;border-top:1px solid var(--line-soft)}
.cat-sub:first-of-type{border-top:0}
.cat-sub-n{font-size:13.5px;color:var(--ink);flex:1;min-width:0}
.cat-acoes{display:flex;gap:2px;opacity:0;transition:opacity .12s}
.cat-sub:hover .cat-acoes{opacity:1}
.cat-acoes .mh-ic{width:22px;height:22px}
.chiplist{display:flex;flex-wrap:wrap;gap:8px}
.chiplist .cc{border:1px solid var(--line);border-radius:20px;padding:6px 13px;font-size:12px;color:var(--ink);display:inline-flex;align-items:center;gap:7px}
.int-card{border:1px solid var(--line);border-radius:13px;padding:15px;display:flex;gap:12px;align-items:flex-start}
.int-lg{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;flex:0 0 auto}
.dot-s{width:9px;height:9px;border-radius:50%;flex-shrink:0}

/* tags coloridas (faturas emitidas, participações) */
.ftag{font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px;white-space:nowrap;display:inline-block}
.ftag.teal{background:var(--info-bg);color:var(--info)}.ftag.gold{background:var(--gold-tint);color:var(--gold)}
.ftag.green{background:var(--ok-bg);color:var(--ok)}.ftag.red{background:var(--danger-bg);color:var(--danger)}
.ftag.amber{background:var(--warn-bg);color:var(--warn)}.ftag.gray{background:var(--paper2);color:var(--muted)}
.ftag.purple{background:rgba(109,91,208,.14);color:#7b6bd8}.ftag.blue{background:var(--info-bg);color:var(--info)}

/* Financeiro · nav de mês na toolbar dos Lançamentos */
.mesnav{display:flex;align-items:center;gap:6px}
.mesnav b{min-width:70px;text-align:center}

/* Financeiro · rodapé de ações do filtro avançado */
.fav-acoes{display:flex;justify-content:flex-end;gap:8px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line)}

/* Financeiro · lista de lançamentos estilo protótipo. Linhas COMPACTAS e de
   altura uniforme (modelo: sub-aba Pagos e recebidos): os botões de ação não
   esticam a linha. */
.fin-lanc td{vertical-align:middle;padding:6px 10px;height:39px;white-space:nowrap;font-size:14px}
/* Leitura (18/08, vide Astrea): data com ano, descricao e id do contrato
   maiores, e linha grossa abrindo cada dia para o olho separar os blocos. */
.fin-lanc td.t-sub{font-size:13px}
.fin-lanc .parcel{font-size:11px}
.fin-lanc tr.day-first td{border-top:2px solid var(--line)}
.fin-lanc .dayrow td{height:auto;padding:6px 12px}
.fin-lanc .fin-acoes .mh-ic{width:22px;height:22px}
.fin-lanc .fatbtn{padding:3px 9px}
/* Menu ⋮ da linha: posição fixa (via JS) para não ser cortado pelo overflow
   da tabela; a linha fica "ativa" enquanto o menu está aberto. */
.fin-rowdd{position:relative;display:inline-block}
.fin-rowdd .fin-dd-menu{position:fixed;right:auto;top:auto;min-width:185px}
.fin-acoes.menu-open{opacity:1}
.fin-cat{display:inline-block;padding:2px 9px;border-radius:20px;font-size:10.5px;font-weight:600;border:1px solid;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap}
.fin-i{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;background:var(--petroleo);color:#fff;font-size:9px;font-style:italic;font-weight:700;vertical-align:1px}
.fin-interno{background:color-mix(in srgb, var(--petroleo) 4%, transparent)}
.fin-cancel{opacity:.45}
.fin-pago{width:20px;height:20px;border:1.6px solid var(--line);border-radius:5px;background:var(--paper);cursor:pointer;font-size:11px;line-height:1;color:var(--gold);transition:border-color .12s}
.fin-pago:hover{border-color:var(--ok)}
.fin-pago.on{background:var(--ok);border-color:var(--ok);color:#fff;cursor:default}
/* Sempre visivel, discreto: 100% invisivel fazia parecer que as acoes da
   linha tinham sumido (pergunta do Wadson, 19/08). */
.fin-acoes{opacity:.4;transition:opacity .12s}
.fin-lanc tr:hover .fin-acoes{opacity:1}
/* A letra maior alargou a tabela e a coluna de acoes caiu para fora da area
   visivel (print do Wadson, 19/08). Dois remedios: a ultima coluna fica
   COLADA na borda direita (sempre visivel, mesmo com rolagem lateral) e as
   colunas de texto ganham teto com reticencias para a tabela caber. */
.fin-lanc td:last-child, .fin-lanc th:last-child{position:sticky;right:0;background:var(--paper);z-index:2}
.fin-lanc tr:hover td:last-child{background:var(--paper2)}
.fin-lanc td.t-name{max-width:300px;overflow:hidden;text-overflow:ellipsis}
.fin-lanc td:nth-child(4){max-width:400px;overflow:hidden;text-overflow:ellipsis}
/* A linha de saldo do dia mantem o fundo proprio (a regra do sticky acima
   pintava o ultimo td dela de paper). */
.fin-lanc tr.dayrow td{background:var(--paper2)}
.fin-toggle{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--muted);border:1px solid var(--line);border-radius:8px;padding:6px 10px;cursor:pointer;white-space:nowrap}
.fin-toggle.on{color:var(--petroleo-txt);border-color:var(--petroleo-txt);background:color-mix(in srgb, var(--petroleo) 8%, transparent)}

  /* Pessoas/RH: linhas expansíveis (detalhes de remuneração, PDI, PDC) */
  .wv-det{border-bottom:1px solid var(--line-soft)}
  .wv-det>summary{display:flex;align-items:center;gap:8px;padding:11px 2px;cursor:pointer;list-style:none;font-size:13px}
  .wv-det>summary::-webkit-details-marker{display:none}
  .wv-det>summary::before{content:'';width:0;height:0;border-left:5px solid var(--muted);border-top:4px solid transparent;border-bottom:4px solid transparent;transition:transform .15s;flex:0 0 auto}
  .wv-det[open]>summary::before{transform:rotate(90deg)}
  .wv-det>summary:hover{color:var(--gold)}

  /* ===== Pessoas/RH: layout do protótipo (Equipe/Pessoas + drawer) ===== */
  .rh-roster{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:14px}
  .rh-pcard{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:15px;box-shadow:var(--shadow);cursor:pointer;text-align:left;font-family:inherit;width:100%}
  .rh-pcard:hover{border-color:var(--gold)}
  .rh-pc-top{display:flex;gap:11px;align-items:center;margin-bottom:12px}
  .rh-pc-top .nm{font-size:13px;color:var(--ink);font-weight:700;line-height:1.2}
  .rh-pc-top .rl{font-size:11px;color:var(--muted)}
  .rh-mets{display:flex;gap:10px;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);padding:10px 0;margin-bottom:10px}
  .rh-met{flex:1;text-align:center}
  .rh-met .n{font-family:var(--head);font-size:16px;color:var(--ink);font-weight:600}
  .rh-met .n.gold{color:var(--gold)}
  .rh-met .l{font-size:9px;color:var(--faint);text-transform:uppercase;letter-spacing:.03em;margin-top:2px}
  .rh-prog{font-size:11px;color:var(--muted)}.rh-prog b{color:var(--gold)}
  .rh-bar{height:6px;border-radius:6px;background:var(--line-soft);overflow:hidden;margin-top:6px}
  .rh-bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--petroleo),var(--gold))}
  .rh-pgrid{display:grid;grid-template-columns:1fr 300px;gap:16px;align-items:start}
  .rh-rail{display:flex;flex-direction:column;gap:14px}
  .rh-wline{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line-soft);font-size:12px}
  .rh-wline:last-child{border-bottom:none}
  .rh-wline .nm{flex:1;color:var(--ink)}.rh-wline .nm small{display:block;color:var(--muted);font-size:10px}
  .rh-wline .rt{font-size:11px;color:var(--muted);font-weight:600;text-align:right;white-space:nowrap}
  .rh-wline .rt.amber{color:var(--warn)}
  .rh-minibtn{background:var(--gold-tint);color:var(--gold);border:none;border-radius:7px;padding:4px 9px;font-size:10.5px;font-weight:700;cursor:pointer;font-family:inherit}
  .rh-minibtn:hover{background:var(--gold);color:var(--on-gold)}
  /* drawer lateral */
  .rh-ovl{position:fixed;inset:0;background:rgba(4,16,16,.5);display:none;z-index:80}
  .rh-ovl.on{display:block}
  .rh-drawer{position:fixed;top:0;right:-100vw;height:100vh;width:640px;max-width:96vw;background:var(--canvas);box-shadow:-20px 0 60px -20px rgba(0,0,0,.5);transition:right .26s ease;z-index:81;display:flex;flex-direction:column}
  /* sem transform: transform criaria containing block e quebraria os tooltips
     position:fixed (.wv-info-tip) dentro do drawer */
  .rh-drawer.on{right:0}
  .rh-pdh{padding:16px 20px;background:var(--paper);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:13px}
  .rh-pdh .nm{font-family:var(--head);font-size:17px;color:var(--ink);font-weight:600}
  .rh-pdh .rl{font-size:12px;color:var(--muted);margin-top:2px}
  .rh-pdh .x{margin-left:auto;cursor:pointer;color:var(--muted);font-size:17px;background:none;border:none}
  .rh-pdtabs{display:flex;gap:2px;background:var(--paper);padding:0 16px;border-bottom:1px solid var(--line);overflow-x:auto}
  .rh-pdtabs button{border:none;background:none;font-family:inherit;font-size:12.5px;font-weight:600;color:var(--muted);padding:11px 12px;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
  .rh-pdtabs button.on{color:var(--ink);border-bottom-color:var(--gold)}
  .rh-pdbody{padding:18px 20px;overflow:auto;flex:1}
  .rh-pdpanel{display:none}.rh-pdpanel.on{display:block}
  .rh-pdfoot{padding:12px 20px;border-top:1px solid var(--line);background:var(--paper);display:flex;gap:9px;justify-content:flex-end}
  .rh-form2{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px}
  .rh-subh{font-family:var(--head);font-size:14px;color:var(--ink);font-weight:600;margin:2px 0 10px}
  .rh-crumbs{display:flex;gap:12px;flex-wrap:wrap}
  .rh-crumb{flex:1;min-width:120px;background:var(--paper);border:1px solid var(--line);border-radius:11px;padding:11px 13px}
  .rh-crumb .k{font-size:10px;color:var(--muted)}
  .rh-crumb .v{font-family:var(--head);font-size:18px;color:var(--ink);font-weight:600;margin-top:3px}
  .rh-crumb .v.gold{color:var(--gold)}
  .rh-htab{width:100%;border-collapse:collapse;font-size:12px}
  .rh-htab th{font-size:9px;text-transform:uppercase;color:var(--faint);font-weight:700;text-align:left;padding:7px 8px;border-bottom:1px solid var(--line)}
  .rh-htab td{padding:8px;border-bottom:1px solid var(--line-soft);color:var(--muted)}
  .rh-htab td.num{text-align:right;font-variant-numeric:tabular-nums;font-weight:600;color:var(--ink)}
  .rh-linkcard{display:flex;align-items:center;gap:12px;background:linear-gradient(100deg,var(--petroleo-900),var(--petroleo));color:#fff;border-radius:12px;padding:15px;margin-top:14px;cursor:pointer;text-decoration:none}
  .rh-linkcard .tt{font-weight:700;font-size:13px}.rh-linkcard .ss{font-size:11px;color:var(--gold-soft)}.rh-linkcard .go{margin-left:auto}
  /* capacitação */
  .rh-mat{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line-soft)}
  .rh-mat .ic{width:32px;height:32px;border-radius:9px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;background:var(--gold-tint);color:var(--gold)}
  .rh-mat .ic svg{width:16px;height:16px;stroke-width:1.8}
  .rh-mat .ic.curso{background:var(--petroleo-tint);color:var(--petroleo-txt)}
  .rh-mat .ic.video{background:var(--danger-bg);color:var(--danger)}
  .rh-mat .mid{flex:1;min-width:0}.rh-mat .mid .tt{font-size:12.5px;color:var(--ink);font-weight:600}.rh-mat .mid .mt{font-size:10.5px;color:var(--muted)}
  .rh-trilha-h{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);font-weight:700;margin:16px 0 4px}
  /* Olhinho do RH: valores financeiros ocultáveis na tabela de pessoas */
  .rh-fin.oculto{filter:blur(6px);user-select:none;pointer-events:none}
  /* fm-menu dentro de .field: o label global (uppercase/block) esmagava as
     opções; restaura o layout do item do dropdown. */
  .fm-menu .fm-op{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:400;
    letter-spacing:0;text-transform:none;color:var(--ink);margin:0;padding:4px 0}
  .fm-menu .fm-op input{flex:0 0 auto;accent-color:var(--gold)}
  /* Olhinho global de valores financeiros (Financeiro, ficha da demanda) */
  body.vals-ocultos .kpi-v, body.vals-ocultos .bignum, body.vals-ocultos td.num,
  body.vals-ocultos td.mono, body.vals-ocultos .mg-v.mono, body.vals-ocultos .crumb .v,
  body.vals-ocultos .dre-row b, body.vals-ocultos .fx-matrix td + td,
  body.vals-ocultos .rc-bar, body.vals-ocultos .ag-pill, body.vals-ocultos .kpi-x,
  body.vals-ocultos .rc-top .mono, body.vals-ocultos .vfin,
  body.vals-ocultos .lead-val, body.vals-ocultos .col-sum,
  /* BI: números-herói, tiles, tabelas e alertas carregam dinheiro. O olhinho
     tem que cobrir o painel inteiro, senão a aba mais financeira do sistema
     fica exposta com o olho "fechado". */
  body.vals-ocultos #biPanel .hv, body.vals-ocultos #biPanel .big,
  body.vals-ocultos #biPanel .tile .v, body.vals-ocultos #biPanel .kv b,
  body.vals-ocultos #biPanel .metric-h b, body.vals-ocultos #biPanel .vtop,
  body.vals-ocultos #biPanel .icp .v, body.vals-ocultos #biPanel .hmeta,
  body.vals-ocultos #biPanel .meta-leg,
  body.vals-ocultos #biPanel .fun2-et .faixa,
  body.vals-ocultos #biPanel .pilha-leg .q,
  body.vals-ocultos #biPanel .hproj,
  body.vals-ocultos #biPanel .alert .tx{filter:blur(6px);user-select:none;pointer-events:none}

  /* ===================== BI / Indicadores (protótipo bi-indicadores_4) ===================== */
  #biPanel{--bi-green:var(--ok);--bi-amber:var(--warn);--bi-red:var(--danger);--bi-teal:var(--petroleo);
    --bi-green-tint:var(--ok-bg);--bi-amber-tint:var(--warn-bg);--bi-red-tint:var(--danger-bg)}
  #biPanel .filters{display:flex;align-items:center;gap:8px;margin:16px 0 4px;flex-wrap:wrap}
  #biPanel .spacer{flex:1}
  #biPanel .rbac{font-size:9.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--bi-teal);background:var(--petroleo-tint);border-radius:20px;padding:3px 9px}
  #biPanel .wv-search{display:inline-flex;align-items:center;gap:7px;background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:6px 11px;color:var(--faint)}
  #biPanel .wv-search input{border:none;background:none;font-family:inherit;font-size:12px;color:var(--ink);outline:none;width:150px}
  #biPanel .wv-search input::placeholder{color:var(--faint)}
  #biPanel .lbl{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);font-weight:700}
  /* ícone de informação mais discreto (contorno, sem preenchimento) */
  #biPanel .wv-info{width:15px;height:15px;font-size:9.5px;background:transparent;color:var(--muted);border:1px solid var(--line);font-weight:700}
  #biPanel .wv-info:hover{color:var(--gold);border-color:var(--gold)}
  /* letras pequenas um pouco maiores para leitura */
  #biPanel .tile .k{font-size:11.5px}
  #biPanel .tile .s{font-size:11px}
  #biPanel .subm{font-size:11.5px}
  #biPanel .hero .hs{font-size:11px}
  #biPanel .hero .ht{font-size:11.5px}
  #biPanel .hmeta{font-size:11.5px}
  #biPanel .note{font-size:12px}
  #biPanel .tbl th{font-size:10.5px}
  #biPanel .card-h .t small,#biPanel .card-h .card-t small,#biPanel .secttl .ss{font-size:12px}
  #biPanel .metric-h .mm,#biPanel .mm{font-size:11.5px}
  /* --- primitivos autossuficientes (sobrescrevem as classes globais dentro do BI) --- */
  #biPanel .card{background:var(--paper);border:1px solid var(--line);border-radius:15px;box-shadow:var(--shadow)}
  #biPanel .card.pad{padding:17px}
  #biPanel .card-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
  #biPanel .card-h .t,#biPanel .card-h .card-t{font-family:var(--head);font-size:15px;color:var(--ink);font-weight:600;display:flex;align-items:center;gap:8px}
  #biPanel .card-h .t small,#biPanel .card-h .card-t small{font-family:var(--body);font-weight:500;color:var(--muted);font-size:11px}
  #biPanel .card-h .t svg{width:15px;height:15px;color:var(--gold);flex:0 0 auto}
  #biPanel .seg{display:inline-flex;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:3px;gap:0;margin:0}
  #biPanel .seg button,#biPanel .seg a{border:none;background:none;font-family:inherit;font-size:11.5px;font-weight:600;color:var(--muted);padding:6px 11px;border-radius:7px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;box-shadow:none}
  #biPanel .seg button.on,#biPanel .seg a.on{background:var(--petroleo-900);color:#fff}
  #biPanel .chip{display:inline-flex;align-items:center;gap:7px;background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:7px 11px;font-size:12px;color:var(--ink);cursor:pointer;font-weight:600}
  #biPanel .chip::before{content:none}
  #biPanel .tbl{width:100%;border-collapse:collapse;font-size:12px}
  #biPanel .tbl th{font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--faint);font-weight:700;text-align:left;padding:9px 10px;border-bottom:1px solid var(--line);white-space:nowrap;background:none}
  #biPanel .tbl td{padding:9px 10px;border-bottom:1px solid var(--line-soft);color:var(--muted);vertical-align:middle}
  #biPanel .tbl td.num,#biPanel .tbl th.num{text-align:right;font-variant-numeric:tabular-nums}
  #biPanel .tbl tr:last-child td{border-bottom:none}
  #biPanel .tag{display:inline-block;font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px;white-space:nowrap;background:var(--paper2);color:var(--muted);border:none;cursor:default}
  #biPanel .tag::before{content:none;display:none}
  #biPanel .tag.green{background:var(--bi-green-tint);color:var(--bi-green)}
  #biPanel .tag.red{background:var(--bi-red-tint);color:var(--bi-red)}
  #biPanel .tag.amber{background:var(--bi-amber-tint);color:var(--bi-amber)}
  #biPanel .tag.gray{background:var(--paper2);color:var(--muted)}
  #biPanel .tag.teal{background:var(--petroleo-tint);color:var(--bi-teal)}
  #biPanel .note{font-size:11px;color:var(--muted);margin-top:12px;display:flex;gap:7px;align-items:flex-start}
  #biPanel .note svg{width:13px;height:13px;color:var(--gold);flex:0 0 auto;margin-top:1px}
  #biPanel .empty{font-size:12px;color:var(--faint);padding:8px 0}
  /* cockpit */
  /* Cockpit na horizontal, largura inteira. A tentativa de duas colunas
     (indicadores a esquerda, alertas a direita) desalinhou os cards e nao
     compensou: os cards foram para as abas tematicas, e o topo ficou so com
     o filtro e o que exige acao. */
  #biPanel .cockpit{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:14px 0 12px}
  /* Mini-cockpit dentro de cada aba: os indicadores daquele tema. */
  /* Cards de LARGURA CONSTANTE, alinhados a esquerda. Grade de N colunas
     esticava os cartoes quando a aba tinha menos cards que colunas (dois
     cards numa grade de tres viravam dois cartoes gigantes). Assim o cartao
     tem sempre o mesmo tamanho, em qualquer aba e em qualquer quantidade. */
  #biPanel .cockpit-aba{grid-template-columns:repeat(auto-fill,minmax(230px,250px));
    justify-content:start;margin:0 0 14px}
  /* Seg compacto no cabecalho de um card (abas internas do Top 10). */
  #biPanel .seg-sm button{padding:4px 10px;font-size:11.5px}
  /* Minigráfico do cartão: a area dá a leitura de nivel num relance e o
     ponto final marca onde a serie esta HOJE, que e o dado que importa. */
  #biPanel .sparkwrap{position:relative;margin:8px 0 2px}
  #biPanel .sparkwrap .spark{display:block;width:100%;height:26px}
  #biPanel .sparkdot{position:absolute;width:5px;height:5px;border-radius:50%;
    transform:translate(-50%,-50%);box-shadow:0 0 0 2px var(--paper)}
  #biPanel .ti-pane .tb td{padding:7px 8px}
  /* overflow visível (14/09): o tooltip do i explicativo do título vazava
     do card e era cortado pelo hidden; a faixa lateral ganhou o próprio
     raio para não vazar dos cantos arredondados. */
  #biPanel .hero{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:13px 14px;box-shadow:var(--shadow);position:relative}
  #biPanel .hero::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:14px 0 0 14px;background:var(--line)}
  #biPanel .hero.g::before{background:var(--bi-green)}#biPanel .hero.a::before{background:var(--bi-amber)}#biPanel .hero.r::before{background:var(--bi-red)}
  #biPanel .hero .ht{font-size:10.5px;color:var(--muted);font-weight:600;display:flex;align-items:center;gap:5px}
  #biPanel .hero .ht .lk{margin-left:auto;color:var(--faint)}#biPanel .hero .ht .lk svg{width:12px;height:12px}
  /* Número em mono tabular (redesenho 13/09): colunas alinham e o valor não
     "dança" ao atualizar. Vale para todos os cards-herói do BI. */
  #biPanel .hero .hv{font-family:var(--num);font-variant-numeric:tabular-nums;letter-spacing:-.03em;font-size:21px;color:var(--ink);font-weight:600;line-height:1.05;margin:6px 0 2px;display:flex;align-items:baseline;gap:7px;flex-wrap:wrap}
  #biPanel .delta{font-size:11px;font-weight:700;padding:1px 6px;border-radius:6px;white-space:nowrap}
  #biPanel .delta.up{color:var(--bi-green);background:var(--bi-green-tint)}#biPanel .delta.down{color:var(--bi-red);background:var(--bi-red-tint)}#biPanel .delta.flat{color:var(--muted);background:var(--paper2)}
  #biPanel .hmeta{display:flex;align-items:center;gap:6px;font-size:10.5px;color:var(--muted);font-weight:600;margin-top:3px}
  #biPanel .dot{width:8px;height:8px;border-radius:50%;flex:0 0 auto;background:var(--muted)}#biPanel .dot.green{background:var(--bi-green)}#biPanel .dot.amber{background:var(--bi-amber)}#biPanel .dot.red{background:var(--bi-red)}
  #biPanel .spark{display:block;width:100%;height:26px;margin-top:8px}
  #biPanel .hero .hs{font-size:10px;color:var(--faint);margin-top:6px}
  /* KPI com anel de meta (aba Resultados e Previsões): número à esquerda,
     anel à direita. O anel some quando o indicador não tem meta e o texto
     ocupa o cartão inteiro, por isso a linha é flex e não uma grade fixa. */
  #biPanel .kpirow{display:flex;align-items:center;gap:10px}
  #biPanel .kpirow .kpitx{flex:1;min-width:0}
  #biPanel .donut{width:44px;height:44px;flex:0 0 auto;transform:rotate(-90deg)}
  /* Trilho de meta com marcador de ritmo (redesenho 13/09): o anel virou
     barra fina, e o traço vertical diz quanto o CALENDÁRIO esperava hoje.
     É o que transforma o card de informativo em aviso. */
  #biPanel .meta-trilho{position:relative;height:4px;border-radius:20px;background:var(--line-soft);margin:10px 0 0}
  #biPanel .meta-trilho i{position:absolute;left:0;top:0;bottom:0;border-radius:20px;background:var(--petroleo)}
  #biPanel .meta-trilho i.our{background:var(--gold)}
  #biPanel .meta-trilho i.vm{background:var(--bi-red)}
  /* Trecho PROJETADO do trilho (14/09): realizado + lançado a vencer, em
     tinta esmaecida por baixo da barra sólida do realizado. */
  #biPanel .meta-trilho i.proj{background:var(--petroleo-tint)}
  #biPanel .meta-trilho i.proj.our{background:var(--gold-tint)}
  /* Linha "previsto" dentro do card realizado. */
  #biPanel .hproj{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-family:var(--num);font-size:10.5px;color:var(--muted);margin-top:5px;line-height:1.5}
  #biPanel .meta-marca{position:absolute;top:-3px;width:2px;height:10px;border-radius:2px;background:var(--muted);opacity:.75}
  /* Legenda do trilho SEM quebra (refino 14/09): "esperado hoje 47%"
     quebrado em duas linhas virava sopa de percentuais. */
  #biPanel .meta-leg{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:5px;font-family:var(--num);font-size:9.5px;color:var(--faint);letter-spacing:.04em}
  #biPanel .meta-leg span{white-space:nowrap}
  #biPanel .meta-leg .dot{width:7px;height:7px;display:inline-block;vertical-align:0;margin-right:4px}
  /* Cartão sem dado: a borda tracejada avisa que o vazio é falta de
     preenchimento, e não um resultado zerado. */
  #biPanel .hero.vazio{border-style:dashed}
  #biPanel .hero.vazio .hv{color:var(--faint)}
  /* Prejuízo em vermelho: no meio de dez cards, um número negativo em preto
     passa batido. */
  #biPanel .hero .hv.neg{color:var(--bi-red)}
  /* Cartão de PREVISÃO: o que ainda não aconteceu não pode ter o mesmo peso
     visual do realizado, senão a projeção é lida como caixa. */
  #biPanel .hero.previsto{background:var(--paper2)}
  #biPanel .hero.previsto::before{background:repeating-linear-gradient(
    180deg,var(--gold) 0 4px,transparent 4px 8px)}
  #biPanel .tagprev{font-size:8.5px;font-weight:700;letter-spacing:.06em;
    text-transform:uppercase;color:var(--gold);background:var(--gold-tint);
    border-radius:20px;padding:2px 7px;margin-left:auto}
  /* alertas: O que exige ação. Banner FINO, uma linha, fechado por padrão:
     a versão em card aberto ocupava um terço da tela antes de qualquer
     número. */
  #biPanel .bi-alertbar{background:var(--paper);border:1px solid var(--line);border-radius:11px;margin:14px 0 12px;overflow:hidden}
  #biPanel .bi-alertbar-h{display:flex;align-items:center;gap:8px;width:100%;border:none;background:none;font-family:inherit;cursor:pointer;padding:8px 14px;font-size:12px;font-weight:600;color:var(--muted)}
  #biPanel .bi-alertbar-h:hover{color:var(--ink)}
  #biPanel .bi-alertbar-h svg:first-child{color:var(--gold)}
  #biPanel .bi-alertbar-h small{font-weight:700;font-size:10px;color:var(--gold);background:var(--gold-tint);border-radius:20px;padding:2px 8px}
  #biPanel .alert{display:flex;align-items:flex-start;gap:11px;padding:9px 0;border-bottom:1px solid var(--line-soft)}
  #biPanel .alert:last-child{border-bottom:none}
  #biPanel .alert .sv{width:9px;height:9px;border-radius:50%;margin-top:4px;flex:0 0 auto;background:var(--muted)}
  #biPanel .alert.r .sv{background:var(--bi-red)}#biPanel .alert.a .sv{background:var(--bi-amber)}#biPanel .alert.g .sv{background:var(--bi-green)}#biPanel .alert.i .sv{background:var(--bi-teal)}
  #biPanel .alert .tx{flex:1;font-size:12px;color:var(--muted);line-height:1.4}#biPanel .alert .tx b{color:var(--ink)}
  #biPanel .alert .go{font-size:11px;font-weight:700;color:var(--gold);cursor:pointer;white-space:nowrap;border:none;background:none;font-family:inherit}
  /* tabs internas do BI */
  #biPanel .bitabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:20px 0 16px;flex-wrap:wrap}
  #biPanel .bitabs a{font-size:13.5px;font-weight:600;color:var(--muted);padding:10px 15px;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;display:flex;align-items:center;gap:7px;text-decoration:none}
  #biPanel .bitabs a.on{color:var(--ink);border-bottom-color:var(--gold)}#biPanel .bitabs a:hover{color:var(--ink)}
  #biPanel .bitabs a svg{width:15px;height:15px;stroke-width:1.8}
  #biPanel .bipane{display:none}#biPanel .bipane.on{display:block}
  #biPanel .grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  #biPanel .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
  #biPanel .mb14{margin-bottom:14px}
  /* tiles */
  #biPanel .tiles{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:14px}
  #biPanel .tile{background:var(--paper);border:1px solid var(--line);border-radius:13px;padding:13px 14px;box-shadow:var(--shadow)}
  #biPanel .tile .k{font-size:10.5px;color:var(--muted);font-weight:600}#biPanel .tile .v{font-family:var(--head);font-size:21px;color:var(--ink);font-weight:600;margin-top:4px;line-height:1}#biPanel .tile .v small{font-size:12px;color:var(--faint)}#biPanel .tile .s{font-size:10px;color:var(--faint);margin-top:4px}
  /* metric bars */
  #biPanel .metric{padding:8px 0}
  #biPanel .metric-h{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;color:var(--muted);margin-bottom:5px}
  #biPanel .metric-h b{font-family:var(--head);color:var(--ink);font-size:13px}
  #biPanel .metric-h .mm{color:var(--muted);font-size:11px;font-weight:500}
  #biPanel .track{height:7px;border-radius:7px;background:var(--line-soft);overflow:hidden}
  #biPanel .track>i{display:block;height:100%;border-radius:7px;background:linear-gradient(90deg,var(--gold-soft),var(--gold))}
  #biPanel .track>i.teal{background:linear-gradient(90deg,var(--petroleo),var(--petroleo-700))}
  #biPanel .track>i.red{background:linear-gradient(90deg,#9a3826,var(--bi-red))}
  #biPanel .track>i.green{background:linear-gradient(90deg,#2f6b40,var(--bi-green))}
  /* vchart. Altura fecha a conta: valor (13) + barra (ate 130) + mes (25) +
     folga; antes o valor transbordava por cima da legenda. */
  #biPanel .vchart{display:flex;align-items:flex-end;gap:26px;height:196px;padding:8px 6px 0}
  #biPanel .vgroup{display:flex;flex-direction:column;align-items:center;flex:1}
  #biPanel .vbars{display:flex;align-items:flex-end;gap:5px;height:145px}
  #biPanel .vbar{width:20px;border-radius:5px 5px 0 0}#biPanel .vbar.teal{background:var(--petroleo)}#biPanel .vbar.gold{background:var(--gold)}
  /* Mês corrente ainda aberto (redesenho 13/09): barra esmaecida + * no
     rótulo, para o tombo do mês parcial não ser lido como queda. */
  #biPanel .vbar.parc{opacity:.55}
  #biPanel .vlab{font-size:11px;color:var(--muted);margin-top:7px;font-weight:600}
  #biPanel .vtop{font-size:9.5px;color:var(--faint);font-weight:600;margin-bottom:3px}
  #biPanel .legend{display:flex;gap:16px;margin-bottom:8px}
  #biPanel .legend span{font-size:11px;color:var(--muted);display:flex;align-items:center;gap:6px}
  #biPanel .legend i{width:10px;height:10px;border-radius:3px;display:inline-block}#biPanel .legend i.teal{background:var(--petroleo)}#biPanel .legend i.gold{background:var(--gold)}
  /* funnel + icp + secttl + big/kv/pill */
  #biPanel .funnel{display:flex;flex-direction:column;gap:9px;margin-top:4px}
  #biPanel .fstep .fh{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:5px}#biPanel .fstep .fh b{font-family:var(--head);color:var(--ink)}
  #biPanel .fbar{height:30px;border-radius:8px;background:linear-gradient(90deg,var(--petroleo-900),var(--petroleo));display:flex;align-items:center;padding-left:11px;color:#fff;font-size:11px;font-weight:600;min-width:60px}
  /* Funil proporcional (redesenho 13/09): largura = volume absoluto da
     etapa; a perda entre etapas é linha própria em vermelho discreto. */
  #biPanel .fun2{display:flex;flex-direction:column;gap:3px;margin-top:4px}
  #biPanel .fun2-et{display:flex;align-items:center;gap:11px}
  #biPanel .fun2-et .nm{width:128px;flex:0 0 auto;font-size:11.5px;font-weight:600;color:var(--muted);text-align:right}
  #biPanel .fun2-et .resto{flex:1;min-width:0;display:flex}
  #biPanel .fun2-et .faixa{height:30px;border-radius:7px;background:var(--petroleo);display:flex;align-items:center;padding:0 10px;color:#fff;font-family:var(--num);font-size:11px;font-weight:600;white-space:nowrap;overflow:hidden}
  #biPanel .fun2-et .faixa.soft{background:var(--petroleo-tint);color:var(--ink)}
  #biPanel .fun2-et .faixa.gold{background:var(--gold);color:var(--on-gold)}
  #biPanel .fun2-et .zero{font-family:var(--num);font-size:11px;color:var(--faint);align-self:center}
  #biPanel .fun2-et .taxa{width:44px;flex:0 0 auto;font-family:var(--num);font-size:11.5px;font-weight:600;color:var(--muted);text-align:right}
  #biPanel .fun2-gap{display:flex;align-items:center;height:15px;padding-left:139px;font-family:var(--num);font-size:9px;letter-spacing:.07em;text-transform:uppercase;color:var(--danger-selo)}
  /* Barra empilhada de 100% (redesenho 13/09): a composição inteira numa
     faixa de 26px - aging do vencido, receita fixo x avulso etc. */
  #biPanel .pilha{display:flex;height:26px;border-radius:8px;overflow:hidden;background:var(--line-soft)}
  #biPanel .pilha i{display:block;height:100%}
  #biPanel .pilha i.vm,#biPanel .pilha .pt.vm{background:var(--danger-solido)}
  #biPanel .pilha i.our,#biPanel .pilha .pt.our{background:var(--gold)}
  #biPanel .pilha i.oul,#biPanel .pilha .pt.oul{background:var(--gold-line)}
  #biPanel .pilha-leg{display:grid;gap:8px;margin-top:12px;grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}
  #biPanel .pilha-leg>div{display:flex;flex-direction:column;gap:3px;padding-left:9px;border-left:2px solid var(--line)}
  #biPanel .pilha-leg .n{font-size:10.5px;color:var(--muted)}
  #biPanel .pilha-leg .q{font-family:var(--num);font-size:13px;font-weight:600;color:var(--ink)}
  #biPanel .pilha-leg .q.neg{color:var(--bi-red)}
  #biPanel .pilha-leg .pt{width:6px;height:6px;border-radius:20px;display:inline-block;margin-right:5px;background:var(--gold-line)}
  /* Estado vazio útil (redesenho 13/09): diz POR QUE está vazio e o caminho. */
  #biPanel .vazio{display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding:10px 2px 4px}
  #biPanel .vazio .vz-tit{font-size:13.5px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
  #biPanel .vazio p{font-size:12px;color:var(--muted);line-height:1.55;max-width:52ch;margin:0}
  /* Destaque de outlier no ranking (redesenho 13/09): o cliente que
     concentra a carteira sai da régua e vira bloco próprio; os demais
     ganham escala própria logo abaixo. */
  #biPanel .destaque{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:11px;background:var(--warn-bg);margin:2px 0 4px}
  #biPanel .destaque .d-tt{font-size:12.5px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
  #biPanel .destaque .d-ss{font-size:11px;color:var(--muted);margin-top:2px}
  #biPanel .destaque .d-num{font-family:var(--num);font-size:21px;font-weight:600;color:var(--warn)}
  #biPanel .icp{background:var(--paper);border:1px solid var(--line);border-radius:13px;padding:15px;box-shadow:var(--shadow)}
  #biPanel .icp .k{font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);font-weight:700}
  #biPanel .icp .v{font-family:var(--head);font-size:17px;color:var(--ink);font-weight:600;margin-top:6px;line-height:1.2}
  #biPanel .icp .s{font-size:11px;color:var(--muted);margin-top:4px}
  #biPanel .secttl{display:flex;align-items:baseline;gap:7px;margin:2px 0 12px}
  #biPanel .secttl .st{font-family:var(--head);font-size:17px;color:var(--ink);font-weight:600}
  #biPanel .secttl .ss{font-size:12px;color:var(--muted)}
  #biPanel .big{font-family:var(--head);font-size:22px;color:var(--ink);font-weight:600;line-height:1.05;margin-top:3px}
  #biPanel .big.gold{color:var(--gold)}#biPanel .big.green{color:var(--bi-green)}#biPanel .big.red{color:var(--bi-red)}
  #biPanel .subm{font-size:10.5px;color:var(--faint);margin-top:3px}
  #biPanel .kv{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--line-soft);font-size:12px;color:var(--muted)}
  #biPanel .kv:last-child{border-bottom:none}#biPanel .kv b{font-family:var(--head);color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
  #biPanel .kv b.neg{color:var(--bi-red)}#biPanel .kv b.pos{color:var(--bi-green)}
  #biPanel .pill{font-size:10px;font-weight:700;padding:3px 9px;border-radius:20px;background:var(--gold-tint);color:var(--gold)}
  #biPanel .pos{color:var(--bi-green);font-weight:700}#biPanel .neg{color:var(--bi-red);font-weight:700}
  #biPanel .lbl{font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);font-weight:700}
  #biPanel .tbl tr.total td{border-top:1.5px solid var(--line);font-weight:700;color:var(--ink);background:var(--paper2)}
  #biPanel .tbl td.strong{font-weight:600;color:var(--ink)}
  /* Alinhamento vertical dentro do card: a primeira coluna da tabela começa
     no MESMO x dos blocos de número e das barras acima dela (o padding do td
     empurrava "Esteira" 10px à direita de "Demandas ativas"), e a última
     termina rente à borda, como os números das barras. */
  #biPanel .tbl th:first-child,#biPanel .tbl td:first-child{padding-left:0}
  #biPanel .tbl th:last-child,#biPanel .tbl td:last-child{padding-right:0}
  /* Cabeçalho de card com altura estável: com selects num card e nada no
     vizinho, os miolos começavam em alturas diferentes. */
  #biPanel .card-h{min-height:36px}
  #biPanel .mm{color:var(--muted);font-size:11px;font-weight:500}
  #biPanel .linkcard{display:flex;align-items:center;gap:13px;background:linear-gradient(100deg,var(--petroleo-900),var(--petroleo));color:#fff;border-radius:13px;padding:16px 18px;cursor:pointer;margin-top:14px;text-decoration:none}
  #biPanel .linkcard .ic{width:38px;height:38px;border-radius:10px;background:var(--gold-tint);display:flex;align-items:center;justify-content:center;flex:0 0 auto}#biPanel .linkcard .ic svg{width:19px;height:19px;color:var(--gold-soft)}
  #biPanel .linkcard .tt{font-weight:700;font-size:13.5px}#biPanel .linkcard .ss{font-size:11px;color:var(--gold-soft);margin-top:2px}#biPanel .linkcard .go{margin-left:auto}
  .bi-toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--petroleo-900);color:#fff;font-size:12.5px;font-weight:600;padding:11px 18px;border-radius:11px;box-shadow:0 12px 30px -10px rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:.25s;z-index:120;display:flex;gap:9px;align-items:center}
  .bi-toast.on{opacity:1;transform:translateX(-50%) translateY(0)}.bi-toast svg{width:16px;height:16px;color:var(--gold-soft)}
  @media(max-width:1100px){#biPanel .cockpit{grid-template-columns:repeat(3,1fr)}#biPanel .exec{grid-template-columns:1fr}#biPanel .tiles{grid-template-columns:repeat(2,1fr)}#biPanel .grid2,#biPanel .grid3{grid-template-columns:1fr}}

  /* ===================== Financeiro: redesenho 13/09 =====================
     Tipografia dos NÚMEROS do painel financeiro em mono tabular (--num):
     colunas alinham e o valor não "dança" ao atualizar. Escopado no
     #finPanel para não tocar os outros módulos que usam kpi-card. */
  #finPanel .kpi-v,#finPanel .bignum,#finPanel td.num,#finPanel .mg-v,
  #finPanel .vfin,#finPanel .wv-moeda,#finPanel .kv b{
    font-family:var(--num);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
  #finPanel .mono,#finPanel .fx-val{font-family:var(--num);font-variant-numeric:tabular-nums}
  #finPanel .kpi-card .kpi-v{font-size:21px}

  /* ===================== Controladoria (protótipo controladoria_3) ===================== */
  #ctrlPanel{--c-green:var(--ok);--c-amber:var(--warn);--c-red:var(--danger);--c-teal:var(--petroleo)}
  #ctrlPanel .rbac{font-size:9.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--petroleo-txt);background:var(--petroleo-tint);border-radius:20px;padding:3px 9px}
  #ctrlPanel .lockchip{font-size:9.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--gold);background:var(--gold-tint);border-radius:20px;padding:3px 10px;cursor:pointer;display:inline-flex;align-items:center;gap:5px;border:none;font-family:inherit}
  #ctrlPanel .lockchip svg{width:11px;height:11px}
  #ctrlPanel .filters{display:flex;align-items:center;gap:8px;margin:16px 0 0;flex-wrap:wrap}
  #ctrlPanel .spacer{flex:1}
  #ctrlPanel .chip{display:inline-flex;align-items:center;gap:7px;background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:7px 11px;font-size:12px;color:var(--ink);cursor:pointer;font-weight:600}
  #ctrlPanel .chip::before{content:none}
  #ctrlPanel .chip svg{width:12px;height:12px;color:var(--faint)}
  #ctrlPanel select.chip{-webkit-appearance:none;appearance:none;padding-right:26px}
  #ctrlPanel .datenav{display:inline-flex;align-items:center;gap:4px;background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:4px}
  #ctrlPanel .datenav button{border:none;background:none;width:26px;height:26px;border-radius:6px;color:var(--muted);cursor:pointer;font-size:15px;display:flex;align-items:center;justify-content:center;font-family:inherit}
  #ctrlPanel .datenav button:hover{background:var(--line-soft);color:var(--ink)}
  #ctrlPanel .datenav .today{font-weight:700;color:var(--ink);font-size:12px;padding:0 8px}
  #ctrlPanel .seg{display:inline-flex;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:3px;margin:0}
  #ctrlPanel .seg button{border:none;background:none;font-family:inherit;font-size:11.5px;font-weight:600;color:var(--muted);padding:6px 12px;border-radius:7px;cursor:pointer}
  #ctrlPanel .seg button.on{background:var(--petroleo-900);color:#fff}
  #ctrlPanel .lbl{align-self:center}
  /* tabs */
  #ctrlPanel .tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:16px 0 16px}
  #ctrlPanel .tabs a{font-family:inherit;font-size:13.5px;font-weight:600;color:var(--muted);padding:10px 15px;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;display:flex;align-items:center;gap:7px;text-decoration:none}
  #ctrlPanel .tabs a.on{color:var(--ink);border-bottom-color:var(--gold)}#ctrlPanel .tabs a:hover{color:var(--ink)}
  #ctrlPanel .tabs a svg{width:15px;height:15px;stroke-width:1.8}
  #ctrlPanel .tabs .cnt{background:var(--danger-solido);color:#fff;font-size:9px;font-weight:700;border-radius:9px;padding:1px 5px}
  #ctrlPanel .ctpane{display:none}#ctrlPanel .ctpane.on{display:block}
  /* tiles */
  #ctrlPanel .tiles{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:0 0 14px}
  #ctrlPanel .tile{background:var(--paper);border:1px solid var(--line);border-radius:13px;padding:13px 14px;box-shadow:var(--shadow);position:relative;overflow:hidden}
  #ctrlPanel .tile::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:transparent}
  #ctrlPanel .tile.g::before{background:var(--ok)}#ctrlPanel .tile.a::before{background:var(--warn)}#ctrlPanel .tile.r::before{background:var(--danger)}
  #ctrlPanel .tile .k{font-size:11px;color:var(--muted);font-weight:600}
  #ctrlPanel .tile .v{font-family:var(--head);font-size:21px;color:var(--ink);font-weight:600;margin-top:4px;line-height:1}#ctrlPanel .tile .v small{font-size:12px;color:var(--faint)}
  #ctrlPanel .tile .s{font-size:11px;color:var(--faint);margin-top:4px}
  /* cards + grid */
  #ctrlPanel .card{background:var(--paper);border:1px solid var(--line);border-radius:15px;box-shadow:var(--shadow)}#ctrlPanel .card.pad{padding:17px}
  #ctrlPanel .card-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
  #ctrlPanel .card-h .t{font-family:var(--head);font-size:15px;color:var(--ink);font-weight:600;display:flex;align-items:center;gap:8px}
  #ctrlPanel .card-h .t small{font-family:var(--body);font-weight:500;color:var(--muted);font-size:12px}
  #ctrlPanel .card-h .t svg{width:15px;height:15px;color:var(--gold);flex:0 0 auto}
  #ctrlPanel .grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}#ctrlPanel .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}#ctrlPanel .gridL{display:grid;grid-template-columns:1.4fr 1fr;gap:14px}#ctrlPanel .mb14{margin-bottom:14px}
  #ctrlPanel .lbl{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--faint);font-weight:700}
  /* metric bars */
  #ctrlPanel .metric{padding:8px 0}
  #ctrlPanel .metric-h{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;color:var(--muted);margin-bottom:5px}
  #ctrlPanel .metric-h b{font-family:var(--head);color:var(--ink);font-size:13px}
  #ctrlPanel .metric-h .mm{color:var(--muted);font-size:11px;font-weight:500}
  #ctrlPanel .track{height:7px;border-radius:7px;background:var(--line-soft);overflow:hidden}
  #ctrlPanel .track>i{display:block;height:100%;border-radius:7px;background:linear-gradient(90deg,var(--gold-soft),var(--gold))}
  #ctrlPanel .track>i.teal{background:linear-gradient(90deg,var(--petroleo),var(--petroleo-700))}
  #ctrlPanel .track>i.red{background:linear-gradient(90deg,#9a3826,var(--danger))}
  #ctrlPanel .track>i.green{background:linear-gradient(90deg,#2f6b40,var(--ok))}
  #ctrlPanel .track>i.amber{background:linear-gradient(90deg,#946318,var(--warn))}
  /* table */
  #ctrlPanel .tbl{width:100%;border-collapse:collapse;font-size:12px}
  #ctrlPanel .tbl th{font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--faint);font-weight:700;text-align:left;padding:9px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
  #ctrlPanel .tbl td{padding:9px 10px;border-bottom:1px solid var(--line-soft);color:var(--muted);vertical-align:middle}
  #ctrlPanel .tbl td.num,#ctrlPanel .tbl th.num{text-align:right;font-variant-numeric:tabular-nums}
  #ctrlPanel .tbl td.strong{font-weight:600;color:var(--ink)}
  #ctrlPanel .tbl tr:last-child td{border-bottom:none}
  #ctrlPanel .tbl tr.grp td{background:var(--paper2);font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--faint);font-weight:700;padding:6px 10px}
  #ctrlPanel .tbl tr.grp td .rc{color:var(--danger)}#ctrlPanel .tbl tr.grp td .ac{color:var(--warn)}
  /* tags */
  #ctrlPanel .tag{font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px;white-space:nowrap;display:inline-block;border:none}
  #ctrlPanel .tag.green{background:var(--ok-bg);color:var(--ok)}#ctrlPanel .tag.red{background:var(--danger-bg);color:var(--danger)}
  #ctrlPanel .tag.amber{background:var(--warn-bg);color:var(--warn)}#ctrlPanel .tag.gray{background:var(--paper2);color:var(--muted)}#ctrlPanel .tag.teal{background:var(--petroleo-tint);color:var(--petroleo-txt)}
  /* avatar + person + mini buttons */
  #ctrlPanel .av{border-radius:50%;background:var(--gold-tint);color:var(--gold);font-weight:700;display:flex;align-items:center;justify-content:center;flex:0 0 auto;font-size:10px;width:28px;height:28px}
  #ctrlPanel .trp{display:flex;align-items:center;gap:9px}#ctrlPanel .trp .nm{font-weight:600;color:var(--ink);font-size:12px}
  #ctrlPanel .mini{border:none;border-radius:7px;padding:4px 9px;font-size:10.5px;font-weight:700;cursor:pointer;font-family:inherit;text-decoration:none;display:inline-block}
  #ctrlPanel .mini.gold{background:var(--gold-tint);color:var(--gold)}#ctrlPanel .mini.ghost{background:var(--paper);border:1px solid var(--line);color:var(--ink)}
  #ctrlPanel .note{font-size:12px;color:var(--muted);margin-top:12px;display:flex;gap:7px;align-items:flex-start}#ctrlPanel .note svg{width:13px;height:13px;color:var(--gold);flex:0 0 auto;margin-top:1px}
  /* focus lists */
  #ctrlPanel .lrow{display:flex;align-items:flex-start;gap:11px;padding:9px 0;border-bottom:1px solid var(--line-soft)}#ctrlPanel .lrow:last-child{border-bottom:none}
  #ctrlPanel .lrow .tm{font-family:var(--head);font-size:13px;color:var(--ink);font-weight:600;width:52px;flex:0 0 auto;text-align:center;line-height:1.15}
  #ctrlPanel .lrow .tm small{display:block;font-family:var(--body);font-size:8.5px;color:var(--faint);text-transform:uppercase;font-weight:700}
  #ctrlPanel .lrow .mk{width:8px;height:8px;border-radius:50%;margin-top:5px;flex:0 0 auto}
  #ctrlPanel .lrow .bd{flex:1;min-width:0}#ctrlPanel .lrow .bd .tt{font-size:12.5px;color:var(--ink);font-weight:600;line-height:1.25}#ctrlPanel .lrow .bd .mt{font-size:11px;color:var(--muted);margin-top:1px}
  #ctrlPanel .foco-h{display:flex;align-items:center;gap:8px;margin-bottom:8px}
  #ctrlPanel .foco-h .ic{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
  #ctrlPanel .foco-h .ic svg{width:15px;height:15px;stroke-width:1.8}
  #ctrlPanel .foco-h .ic.p{background:var(--petroleo-tint);color:var(--petroleo-txt)}#ctrlPanel .foco-h .ic.d{background:var(--warn-bg);color:var(--warn)}#ctrlPanel .foco-h .ic.a{background:var(--gold-tint);color:var(--gold)}
  #ctrlPanel .foco-h .tt{font-family:var(--head);font-size:14px;color:var(--ink);font-weight:600}#ctrlPanel .foco-h .cn{margin-left:auto;font-size:11px;color:var(--muted);font-weight:600}
  /* agenda day list */
  #ctrlPanel .dl{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--line-soft)}#ctrlPanel .dl:last-child{border-bottom:none}
  #ctrlPanel .dl .d{width:50px;flex:0 0 auto;text-align:center}#ctrlPanel .dl .d .dd{font-family:var(--head);font-size:16px;color:var(--ink);font-weight:600;line-height:1}#ctrlPanel .dl .d .mo{font-size:8.5px;text-transform:uppercase;color:var(--faint);font-weight:700}
  #ctrlPanel .dl .info{flex:1}#ctrlPanel .dl .info .tt{font-size:12.5px;color:var(--ink);font-weight:600}#ctrlPanel .dl .info .mt{font-size:11px;color:var(--muted)}
  /* carga load */
  #ctrlPanel .load{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--line-soft)}#ctrlPanel .load:last-child{border-bottom:none}
  #ctrlPanel .load .who{display:flex;align-items:center;gap:9px;width:200px;flex:0 0 auto}#ctrlPanel .load .who .nm{font-weight:600;color:var(--ink);font-size:12px;line-height:1.15}#ctrlPanel .load .who .rl{font-size:10px;color:var(--muted)}
  #ctrlPanel .load .bar{flex:1;height:9px;border-radius:7px;background:var(--line-soft);overflow:hidden;display:flex}
  #ctrlPanel .load .bar i{display:block;height:100%}#ctrlPanel .load .bar .ok{background:linear-gradient(90deg,var(--petroleo),var(--petroleo-700))}#ctrlPanel .load .bar .late{background:var(--danger)}
  #ctrlPanel .load .n{width:180px;flex:0 0 auto;text-align:right;font-size:11px;color:var(--muted)}#ctrlPanel .load .n b{font-family:var(--head);color:var(--ink);font-size:13px}
  #ctrlPanel .load .st{width:96px;flex:0 0 auto;text-align:right}
  /* vchart */
  #ctrlPanel .vchart{display:flex;align-items:flex-end;gap:14px;height:130px;padding:6px 4px 0}
  #ctrlPanel .vgroup{display:flex;flex-direction:column;align-items:center;flex:1}
  #ctrlPanel .vbar{width:60%;max-width:26px;border-radius:5px 5px 0 0;background:var(--petroleo-900)}
  #ctrlPanel .vlab{font-size:10px;color:var(--muted);margin-top:7px;font-weight:600}
  #ctrlPanel .empty{font-size:12px;color:var(--faint);padding:10px 0}
  /* access modal (switches) */
  #ctrlPanel .acount{font-size:12px;color:var(--muted);margin-bottom:8px}#ctrlPanel .acount b{font-family:var(--head);color:var(--ink);font-size:14px}
  #ctrlPanel .alist{border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:12px;max-height:300px;overflow-y:auto}
  #ctrlPanel .arow{display:flex;align-items:center;gap:11px;padding:10px 13px;border-bottom:1px solid var(--line-soft)}#ctrlPanel .arow:last-child{border-bottom:none}
  #ctrlPanel .arow .who{flex:1}#ctrlPanel .arow .who .nm{font-weight:600;color:var(--ink);font-size:12.5px}#ctrlPanel .arow .who .rl{font-size:10.5px;color:var(--muted)}
  #ctrlPanel .sw{width:38px;height:22px;border-radius:20px;background:var(--line);position:relative;cursor:pointer;transition:.2s;border:none;flex:0 0 auto;padding:0;display:inline-block}
  #ctrlPanel .sw::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
  #ctrlPanel .sw.on{background:var(--petroleo)}#ctrlPanel .sw.on::after{left:18px}
  #ctrlPanel .swfix{font-size:9.5px;font-weight:700;color:var(--petroleo-txt);background:var(--petroleo-tint);padding:4px 10px;border-radius:20px}
  #ctrlPanel .ctrl-kebab{width:28px;height:28px;border-radius:7px;border:1px solid transparent;background:none;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0}
  #ctrlPanel .ctrl-kebab:hover{background:var(--line-soft);border-color:var(--line);color:var(--ink)}
  #ctrlPanel .ctrl-kebab svg{width:16px;height:16px}
  .ctrl-menu{position:fixed;display:none;flex-direction:column;min-width:185px;background:var(--paper);border:1px solid var(--line);border-radius:11px;box-shadow:0 14px 40px -14px rgba(0,0,0,.35);padding:5px;z-index:130}
  .ctrl-menu.on{display:flex}
  .ctrl-menu a,.ctrl-menu button{display:flex;align-items:center;gap:9px;padding:8px 10px;border:none;background:none;font-family:inherit;font-size:12.5px;font-weight:600;color:var(--ink);cursor:pointer;border-radius:8px;text-decoration:none;text-align:left;width:100%}
  .ctrl-menu a:hover,.ctrl-menu button:hover{background:var(--line-soft)}
  .ctrl-menu svg{width:15px;height:15px;color:var(--muted);flex:0 0 auto}
  .ctrl-toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--petroleo-900);color:#fff;font-size:12.5px;font-weight:600;padding:11px 18px;border-radius:11px;box-shadow:0 12px 30px -10px rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:.25s;z-index:120;display:flex;gap:9px;align-items:center}
  .ctrl-toast.on{opacity:1;transform:translateX(-50%) translateY(0)}.ctrl-toast svg{width:16px;height:16px;color:var(--gold-soft)}
  @media(max-width:1100px){#ctrlPanel .tiles{grid-template-columns:repeat(2,1fr)}#ctrlPanel .grid2,#ctrlPanel .grid3,#ctrlPanel .gridL{grid-template-columns:1fr}}


  /* ===== Assistentes de IA e Docs (#iaPanel) — protótipo v3 (3 abas, limpo) ===== */
  #iaPanel .ia-head{display:flex;align-items:center;gap:6px;margin-top:3px}
  #iaPanel .ih{color:var(--faint);cursor:help;display:inline-flex;vertical-align:middle}
  #iaPanel .ih svg{width:13px;height:13px}#iaPanel .ih:hover{color:var(--gold)}
  #iaPanel .ia-tabs{display:flex;gap:3px;border-bottom:1px solid var(--line);margin:14px 0}
  #iaPanel .ia-tabs button{border:none;background:none;font-family:inherit;font-size:13px;font-weight:600;color:var(--muted);padding:9px 13px;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;display:flex;align-items:center;gap:6px}
  #iaPanel .ia-tabs button.on{color:var(--ink);border-bottom-color:var(--gold)}#iaPanel .ia-tabs button:hover{color:var(--ink)}
  #iaPanel .ia-tabs button svg{width:14px;height:14px;stroke-width:1.8}
  #iaPanel .ia-tabs .new{font-size:8px;font-weight:700;letter-spacing:.05em;color:#0b2a2c;background:var(--gold-soft);padding:1px 6px;border-radius:20px}
  #iaPanel .ia-pane{display:none}#iaPanel .ia-pane.on{display:block}
  #iaPanel .ia-flash{background:var(--gold-tint);border:1px solid var(--gold-line);color:var(--ink);font-size:12px;font-weight:600;border-radius:10px;padding:9px 13px;margin:0 0 12px}
  #iaPanel .ia-card{background:var(--paper);border:1px solid var(--line);border-radius:13px;box-shadow:var(--shadow);padding:14px}
  #iaPanel .card-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:11px}
  #iaPanel .card-h .t{font-family:var(--head);font-size:14.5px;color:var(--ink);font-weight:600;display:flex;align-items:center;gap:2px}
  #iaPanel .card-h .a{font-size:11px;color:var(--gold);font-weight:700;cursor:pointer}
  #iaPanel .ia-connect,#iaPanel .ia-empty{display:flex;gap:11px;align-items:flex-start;border-radius:12px;padding:12px 14px;margin-bottom:12px;font-size:12px;line-height:1.5}
  #iaPanel .ia-connect{background:var(--warn-bg);border:1px solid var(--gold-line);color:var(--ink)}
  #iaPanel .ia-empty{background:var(--paper);border:1px dashed var(--line);color:var(--muted)}
  #iaPanel .ia-connect svg,#iaPanel .ia-empty svg{width:17px;height:17px;flex:0 0 auto;color:var(--gold);margin-top:1px}
  #iaPanel code{font-family:var(--mono);font-size:11px;background:var(--paper2);border:1px solid var(--line);border-radius:5px;padding:1px 5px}
  /* PESQUISA */
  #iaPanel .qtool{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px}
  #iaPanel .composer{flex:1;min-width:300px;display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:11px;padding:8px 11px;background:var(--paper);box-shadow:var(--shadow)}
  #iaPanel .composer>svg{width:16px;height:16px;color:var(--gold);flex:0 0 auto}
  #iaPanel .composer input{flex:1;min-width:0;border:none;background:none;font-family:inherit;font-size:13px;color:var(--ink);outline:none}
  #iaPanel .composer input::placeholder{color:var(--faint)}
  #iaPanel .composer .iamodel{border:1px solid var(--line);background:var(--paper2);border-radius:7px;padding:6px 7px;font-family:inherit;font-size:11px;color:var(--muted);font-weight:600;cursor:pointer}
  #iaPanel .composer .go{background:linear-gradient(135deg,var(--gold),var(--gold-soft));color:#0b2a2c;font-weight:700;font-size:11.5px;border-radius:7px;padding:7px 13px;border:none;cursor:pointer;font-family:inherit}
  #iaPanel .composer .go:disabled,#iaPanel .composer input:disabled,#iaPanel .composer .iamodel:disabled{cursor:not-allowed;opacity:.6}
  #iaPanel .fchip{display:flex;align-items:center;gap:6px;background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:7px 10px;font-size:11.5px;color:var(--muted);cursor:pointer;font-weight:600}
  #iaPanel .fchip svg{width:12px;height:12px;color:var(--faint)}#iaPanel .fchip b{color:var(--ink)}
  #iaPanel .srcpanel{display:flex;flex-wrap:wrap;gap:6px;width:100%;margin-top:2px}#iaPanel .srcpanel.hide{display:none}
  #iaPanel .srcchip{display:flex;align-items:center;gap:5px;background:var(--paper2);border:1px solid var(--line);border-radius:7px;padding:4px 9px;font-size:11px;color:var(--ink);font-weight:600}
  #iaPanel .srcchip .d{width:6px;height:6px;border-radius:50%;background:var(--ok)}#iaPanel .srcchip.pub .d{background:var(--warn)}
  #iaPanel .exs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
  #iaPanel .exchip{font-size:10.5px;color:var(--muted);background:var(--paper2);border:1px solid var(--line);border-radius:20px;padding:4px 10px;cursor:pointer;font-weight:600}
  #iaPanel .exchip:hover{border-color:var(--gold);color:var(--ink)}
  #iaPanel .agrid{display:grid;grid-template-columns:1fr 290px;gap:14px;align-items:start}
  #iaPanel .qbubble{display:flex;gap:9px;align-items:center;margin-bottom:10px}
  #iaPanel .qbubble .av{width:26px;height:26px;border-radius:8px;background:linear-gradient(135deg,var(--gold),var(--gold-soft));color:#0b2a2c;font-weight:700;font-size:10px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
  #iaPanel .qbubble .qt{font-size:12.5px;color:var(--ink);font-weight:600}
  #iaPanel .answer{background:var(--paper);border:1px solid var(--line);border-radius:13px;box-shadow:var(--shadow);padding:15px 16px}
  #iaPanel .answer .ah{display:flex;align-items:center;gap:7px;margin-bottom:9px}
  #iaPanel .answer .ah .b{display:inline-flex;align-items:center;gap:6px;font-size:9.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--petroleo-txt);background:var(--petroleo-tint);border-radius:20px;padding:3px 9px}
  #iaPanel .answer .ah .b.err{color:var(--danger);background:var(--danger-bg)}
  #iaPanel .answer .ah .b svg{width:11px;height:11px}#iaPanel .answer .ah .sp{flex:1}
  #iaPanel .answer p{font-size:12.5px;line-height:1.6;color:var(--ink);margin:0 0 10px}
  #iaPanel .fsec{font-size:9px;letter-spacing:.09em;text-transform:uppercase;color:var(--faint);font-weight:700;margin:12px 0 7px;display:flex;align-items:center}
  #iaPanel .fli{display:flex;gap:8px;align-items:flex-start;font-size:12px;color:var(--ink);line-height:1.5;margin:0 0 7px}
  #iaPanel .fli .dot{width:5px;height:5px;border-radius:50%;background:var(--gold);flex:0 0 auto;margin-top:6px}
  #iaPanel .fund{list-style:none;padding:0;margin:0}
  #iaPanel .fund li{display:flex;gap:8px;align-items:baseline;padding:5px 0;border-bottom:1px solid var(--line-soft);font-size:12px;color:var(--ink)}
  #iaPanel .fund li:last-child{border-bottom:none}#iaPanel .fund li .n{font-family:var(--head);color:var(--gold);font-weight:700;flex:0 0 auto}
  #iaPanel .fund li a{color:var(--petroleo-txt);font-weight:600;text-decoration:underline;text-underline-offset:2px;word-break:break-word}
  #iaPanel .aacts{display:flex;gap:7px;flex-wrap:wrap;margin-top:13px;padding-top:11px;border-top:1px solid var(--line-soft)}
  #iaPanel .aacts button,#iaPanel .aacts a{font-size:11px;font-weight:700;border-radius:7px;padding:6px 11px;cursor:pointer;font-family:inherit;display:inline-flex;gap:5px;align-items:center;border:1px solid var(--line);background:var(--paper);color:var(--muted)}
  #iaPanel .aacts .pri{background:linear-gradient(135deg,var(--gold),var(--gold-soft));color:#0b2a2c;border:none}
  #iaPanel .aacts svg{width:12px;height:12px}
  #iaPanel .eline{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted);margin-top:11px}
  #iaPanel .eline svg{width:14px;height:14px;color:var(--gold);flex:0 0 auto}
  #iaPanel .arail{display:flex;flex-direction:column;gap:12px}
  #iaPanel .rt{font-family:var(--head);font-size:13px;color:var(--ink);font-weight:600;margin-bottom:9px;display:flex;align-items:center}
  #iaPanel .cost{display:flex;gap:8px;margin-bottom:8px}
  #iaPanel .cost .cc{flex:1;background:var(--paper2);border:1px solid var(--line-soft);border-radius:9px;padding:8px 9px}
  #iaPanel .cost .cc .k{font-size:9px;color:var(--muted);font-weight:600}#iaPanel .cost .cc .v{font-family:var(--head);font-size:15px;color:var(--ink);font-weight:600;margin-top:2px}
  #iaPanel .costbig{background:linear-gradient(100deg,var(--petroleo-900),var(--petroleo-700));color:#fff;border-radius:10px;padding:11px 13px}
  #iaPanel .costbig .k{font-size:9px;color:var(--gold-soft);font-weight:600;text-transform:uppercase;letter-spacing:.05em}
  #iaPanel .costbig .v{font-family:var(--head);font-size:20px;font-weight:600;margin-top:1px}#iaPanel .costbig .s{font-size:10px;color:#cfe0dd;margin-top:2px}
  #iaPanel .rec{display:flex;gap:8px;align-items:center;padding:7px 0;border-bottom:1px solid var(--line-soft);cursor:pointer}#iaPanel .rec:last-child{border-bottom:none}
  #iaPanel .rec svg{width:12px;height:12px;color:var(--faint);flex:0 0 auto}
  #iaPanel .rec .rq{font-size:11.5px;color:var(--ink);line-height:1.3;font-weight:600}#iaPanel .rec .rm{font-size:9.5px;color:var(--faint)}
  #iaPanel .rm{font-size:10.5px;color:var(--faint)}
  /* DOCUMENTOS */
  #iaPanel .wgen{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:12px}
  #iaPanel .wgen .lb{font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);font-weight:700}
  #iaPanel .wgen .ep{display:flex;align-items:center;gap:6px;background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:5px 11px;font-size:11px;color:var(--muted);font-weight:600;box-shadow:var(--shadow)}
  #iaPanel .wgen .ep svg{width:12px;height:12px;color:var(--gold)}
  #iaPanel .wgen-note{font-size:11.5px;color:var(--muted);line-height:1.5;flex:1;min-width:260px}
  #iaPanel .dgrid{display:grid;grid-template-columns:1.55fr 1fr;gap:14px;align-items:start}
  #iaPanel .dcol{display:flex;flex-direction:column;gap:12px}
  #iaPanel .gform{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:9px;align-items:end}
  #iaPanel .qform{display:grid;grid-template-columns:1fr auto;gap:9px;align-items:end}
  #iaPanel .fld .fl{font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);font-weight:700;margin-bottom:5px}
  #iaPanel .sel{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-family:inherit;font-size:12px;color:var(--ink);background:var(--paper)}
  #iaPanel select.sel{cursor:pointer}
  #iaPanel .docbtn{background:var(--petroleo);color:#fff;font-weight:700;font-size:11.5px;border-radius:8px;padding:9px 15px;border:none;cursor:pointer;font-family:inherit;white-space:nowrap}
  #iaPanel .qualif{margin-top:12px;background:var(--paper2);border:1px solid var(--line);border-radius:10px;padding:13px 15px;font-size:12.5px;line-height:1.7;color:var(--ink)}
  #iaPanel .drow{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--line-soft)}#iaPanel .drow:last-child{border-bottom:none}
  #iaPanel .drow .di{width:15px;height:15px;color:var(--faint);flex:0 0 auto}#iaPanel .drow .dt{font-size:12px;color:var(--ink);font-weight:600;flex:1}#iaPanel .drow .dm{font-size:10px;color:var(--faint);white-space:nowrap}
  #iaPanel .mgrp{font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);font-weight:700;padding:11px 0 3px;border-top:1px solid var(--line-soft);margin-top:3px}
  #iaPanel .mgrp:first-of-type{border-top:none;margin-top:0;padding-top:0}
  #iaPanel .mitem{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:12px}
  #iaPanel .mitem .mstat{width:15px;height:15px;flex:0 0 auto;color:var(--faint)}#iaPanel .mitem .mstat.rdy{color:var(--petroleo-txt)}#iaPanel .mitem .mstat svg{width:15px;height:15px}
  #iaPanel .mitem .mt{color:var(--ink);font-weight:600;flex:1}
  #iaPanel .mitem .u{font-size:8.5px;font-weight:700;color:var(--gold);background:var(--gold-tint);border-radius:5px;padding:1px 6px}
  #iaPanel .mitem .u.sp{color:var(--petroleo-txt);background:var(--petroleo-tint)}#iaPanel .mitem .u.cl{color:var(--muted);background:var(--line-soft)}
  /* CÁLCULOS */
  #iaPanel .calchead{display:flex;align-items:center;gap:8px;margin-bottom:12px;flex-wrap:wrap}
  #iaPanel .calchead .ct{font-family:var(--head);font-size:15px;color:var(--ink);font-weight:600;margin-right:2px}
  #iaPanel .entrybtn{background:var(--paper);border:1px solid var(--line);color:var(--muted);font-weight:600;font-size:11px;border-radius:8px;padding:7px 11px;cursor:pointer;font-family:inherit;display:inline-flex;gap:5px;align-items:center}
  #iaPanel .entrybtn.on{background:var(--petroleo);color:#fff;border-color:var(--petroleo-txt)}#iaPanel .entrybtn svg{width:13px;height:13px}
  #iaPanel .pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px 12px}
  #iaPanel .pgrid input.sel,#iaPanel .pgrid select.sel{padding:8px 10px}
  #iaPanel .swrow{display:flex;align-items:center;gap:8px;background:var(--paper2);border:1px solid var(--line-soft);border-radius:8px;padding:8px 10px;margin-top:10px;cursor:pointer}
  #iaPanel .swrow.lei{background:var(--warn-bg);border-color:var(--gold-line)}
  #iaPanel .swrow .swl{flex:1;font-size:11.5px;color:var(--ink);font-weight:600;display:flex;align-items:center;gap:3px}
  #iaPanel .swchk{position:absolute;opacity:0;pointer-events:none}
  #iaPanel .sw{width:34px;height:19px;border-radius:20px;background:var(--line);position:relative;flex:0 0 auto}
  #iaPanel .sw::after{content:"";position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
  #iaPanel .swchk:checked+.sw{background:var(--petroleo)}#iaPanel .swchk:checked+.sw::after{left:17px}
  #iaPanel .tbl{width:100%;border-collapse:collapse;font-size:11.5px}
  #iaPanel .tbl th{font-size:9px;letter-spacing:.04em;text-transform:uppercase;color:var(--faint);font-weight:700;text-align:left;padding:6px 8px;border-bottom:1px solid var(--line)}
  #iaPanel .tbl th.num{text-align:right}
  #iaPanel .tbl td{padding:5px 8px;border-bottom:1px solid var(--line-soft)}#iaPanel .tbl tr:last-child td{border-bottom:none}
  #iaPanel .tbl td input{width:100%;border:1px solid var(--line);border-radius:7px;padding:6px 8px;font-family:inherit;font-size:11.5px;color:var(--ink);background:var(--paper);outline:none}
  #iaPanel .tbl td input.num{text-align:right;font-variant-numeric:tabular-nums}
  #iaPanel .tbl td.x{text-align:right;color:var(--faint);cursor:pointer;width:24px}
  #iaPanel .addrow{font-size:11px;color:var(--gold);font-weight:700;cursor:pointer}
  #iaPanel .memrow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--line-soft);font-size:12px;color:var(--muted)}
  #iaPanel .memrow:last-of-type{border-bottom:none}#iaPanel .memrow b{font-family:var(--head);color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
  #iaPanel .memrow .sub{font-size:10px;color:var(--faint);font-weight:500}#iaPanel .memrow.plus b{color:var(--ok)}#iaPanel .memrow.st b{font-size:13px}
  #iaPanel .memrow .pend{font-size:10px;font-weight:700;color:var(--warn)}
  #iaPanel .memtotal{display:flex;align-items:center;justify-content:space-between;background:linear-gradient(100deg,var(--petroleo-900),var(--petroleo-700));color:#fff;border-radius:11px;padding:12px 15px;margin-top:9px}
  #iaPanel .memtotal .k{font-size:11.5px;color:var(--gold-soft);font-weight:600}#iaPanel .memtotal .v{font-family:var(--head);font-size:21px;font-weight:600}
  #iaPanel .fsrc{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--line-soft);font-size:11.5px;color:var(--muted)}#iaPanel .fsrc:last-child{border-bottom:none}
  #iaPanel .fsrc .d{width:6px;height:6px;border-radius:50%;background:var(--ok);flex:0 0 auto}#iaPanel .fsrc .d.off{background:var(--faint)}
  #iaPanel .fsrc .nm{flex:1;font-weight:600;color:var(--ink)}#iaPanel .fsrc .tg{font-size:9px;font-weight:700;color:var(--faint)}
  @media(max-width:1100px){#iaPanel .agrid,#iaPanel .dgrid{grid-template-columns:1fr}#iaPanel .gform,#iaPanel .pgrid{grid-template-columns:1fr 1fr}}

  /* ===== Painel lateral acoplado (iframe) ===== */
  #wvDock{position:fixed;top:0;right:0;height:100vh;width:var(--wvdockw,min(1080px,70vw));background:var(--paper);border-left:1px solid var(--line);box-shadow:-26px 0 60px -42px rgba(0,30,30,.5);transform:translateX(100%);transition:transform .28s ease,width .2s ease;z-index:130;display:flex}
  #wvDock.open{transform:none}
  #wvDock iframe{flex:1;border:none;width:100%;height:100%;background:var(--canvas)}
  #wvDockGrip{position:absolute;left:-4px;top:0;bottom:0;width:9px;cursor:col-resize;z-index:1}
  #wvDockGrip::after{content:"";position:absolute;left:3px;top:50%;transform:translateY(-50%);width:3px;height:36px;border-radius:3px;background:var(--line)}
  #wvDockGrip:hover::after{background:var(--gold)}
  body.dock-open .app{margin-right:var(--wvdockw,min(1080px,70vw));transition:margin-right .28s ease}
  body.dock-encaixando .app{transition:none}
  /* Dentro do iframe do painel (html.dock): coluna flex (cabecalho fixo, corpo
     rola sozinho, rodape fixo), chrome oculto e fundo dourado bem claro para
     diferenciar o painel do sistema por tras. */
  html.dock .side,html.dock .main > .top{display:none}
  /* Travar a rolagem do body vale SO para a ficha em modal, que tem
     rolagem propria no .modal-b. Pagina comum aberta no painel (o
     comunicado, por exemplo) nao tem rolagem interna nenhuma: com o
     overflow escondido, ela fica estatica e o conteudo de baixo some. */
  html.dock,html.dock body{height:100%}
  html.dock body{overflow-y:auto}
  html.dock body:has(.overlay.static){overflow:hidden}
  html.dock body{background:var(--canvas)}
  html.dock .overlay.static{padding:0;height:100vh;overflow:hidden;background:transparent;align-items:stretch}
  html.dock .overlay.static > .modal.modal-xl{width:100%;max-width:none;height:100vh;min-height:0;border-radius:0;margin:0;box-shadow:none;display:flex;flex-direction:column;background:var(--wv-dock-bg)}
  /* Fichas de edicao (formulario, sem cards): fundo branco no painel. */
  html.dock .overlay.static > .modal.modal-xl.ficha-edit{background:var(--paper)}
  html.dock .overlay.static > .modal.modal-xl > .modal-h{flex:0 0 auto;background:var(--paper)}
  html.dock .overlay.static > .modal.modal-xl > .modal-b{flex:1 1 auto;min-height:0;overflow-y:auto}
  html.dock .overlay.static > .modal.modal-xl > .modal-foot.ficha-foot{flex:0 0 auto;margin:0;background:var(--paper);box-shadow:0 -1px 0 var(--line)}
  /* Fichas com abas (Juridico): a barra de abas fica fixa ao rolar o corpo.
     Zera o padding-top do corpo (so quando ha abas) para nao sobrar um vao
     onde o conteudo aparecia acima das abas ao rolar. */
  html.dock .overlay.static > .modal.modal-xl > .modal-b:has(> .seg){padding-top:0}
  html.dock .overlay.static > .modal.modal-xl > .modal-b > .seg{position:sticky;top:0;z-index:6;display:flex;background:var(--wv-dock-bg);margin-bottom:14px;padding-top:16px;padding-bottom:11px;box-shadow:0 1px 0 var(--line-soft)}
  @media(max-width:900px){#wvDock{width:100vw}body.dock-open .app{margin-right:0}}
  /* Rodape da ficha (vale nas duas visualizacoes: pagina cheia e painel). */
  .modal-xl .modal-foot.ficha-foot{align-items:center;gap:9px;margin-top:0;padding:12px 26px;border-top:1px solid var(--line-soft)}
  .modal-xl.ficha-compact .modal-foot.ficha-foot{padding:11px 20px}

/* Alternador de tema: sol no escuro (clicar clareia), lua no claro. */
/* O ícone é o ESTADO, não a ação: lua enquanto está escuro, sol enquanto
   está claro. Ao contrário disso, quem via a lua entendia "estou no escuro" e
   clicava para conferir — indo parar no claro. O que o clique faz está no
   title, que é onde se procura a ação. */
.tgl .tgl-sol{display:none}
.tgl .tgl-lua{display:inline}
body.light .tgl .tgl-lua{display:none}
body.light .tgl .tgl-sol{display:inline}

/* Mural interno (página do módulo): cartões do que está valendo agora. Grade
   em vez de lista porque recado se lê de relance. No cockpit o mural vai como
   card com linhas, para não destoar dos demais blocos do painel. */
/* auto-FIT, não auto-fill: com dois avisos o auto-fill deixava trilhas vazias
   à direita e os cartões ficavam encolhidos num canto. */
.mural{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.mural-c{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);
         border-radius:12px;padding:12px 14px;text-decoration:none;color:inherit;min-height:118px}
.mural-c:hover{border-color:var(--gold);box-shadow:0 2px 10px rgba(0,0,0,.06)}
.mural-c.fix{border-left:3px solid var(--gold)}
.mural-h{display:flex;align-items:center;gap:6px;margin-bottom:7px;flex-wrap:wrap}
.mural-pin{font-size:11px;line-height:1}
.mural-t{font-weight:700;font-size:13.5px;line-height:1.35;color:var(--ink)}
.mural-r{font-size:12px;color:var(--muted);line-height:1.45;margin-top:4px}

/* ============ "Escritório hoje" (Meu Painel do gestor, 21/08) ============ */
/* Azulejos clicáveis do overview, compactos de propósito (pedido de 21/08):
   número discreto + rótulo + atalho, mais colunas por linha. */
.esc-tile{display:flex;flex-direction:column;gap:1px;padding:7px 10px;border:1px solid var(--line);border-radius:9px;background:var(--paper2);text-decoration:none;transition:border-color .15s}
.esc-tile:hover{border-color:var(--gold)}
.esc-n{font-size:15.5px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;line-height:1.25}
.esc-t{font-size:11px;color:var(--muted);line-height:1.3}
.esc-s{font-size:10.5px;color:var(--gold);margin-top:1px}

/* Cards e listas (03/09, pedido do Wadson): responsável em foto ou sigla, não em nome. */
.lead-av.foto{background-size:cover;background-position:center;color:transparent}
/* Cartão do quadro (17/09, pedido do Wadson): título maior, play/pause no
   canto de cima, demanda legível, atraso/fila encostado à direita. */
.k-dem{font-size:12.5px;line-height:1.35;margin:2px 0 7px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kanban .lead-t{font-size:14px;line-height:1.3;min-width:0}
.k-top{display:flex;align-items:flex-start;gap:8px}
.k-top .lead-t{flex:1}
.k-play{width:24px;height:24px;border-radius:7px;border:1px solid var(--line);background:var(--paper);color:var(--faint);display:grid;place-items:center;cursor:pointer;padding:0;flex:0 0 24px;margin-top:-2px}
.k-play:hover{color:var(--petroleo-txt);border-color:var(--petroleo-txt)}
.k-play.on{background:var(--petroleo-tint);border-color:transparent;color:var(--petroleo-txt)}
.k-linha{display:flex;align-items:center;gap:5px;flex-wrap:nowrap;min-width:0}
.k-linha .k-st{flex:0 0 auto;white-space:nowrap;max-width:60%;overflow:hidden;text-overflow:ellipsis;margin-left:auto}
.k-vermais{font-size:12px}
/* Quadro do protótipo (17/09, print do Wadson): linha "tipo · prazo" com o
   chip do contrato, avatares com respiro embaixo, e as abas por membro em
   .seg - soltar um card na aba TRANSFERE a tarefa (o alvo acende dourado). */
.kanban .lead-svc{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:4px}
.kanban .lead-svc .tag{cursor:default}
.kanban .lead-svc.k-linha{margin-top:9px;flex-wrap:nowrap}
.seg a.dragover{background:var(--gold-tint);color:var(--gold)}

/* Sigla/foto do responsável nos cards do Hoje (11/09) */
.av-resp{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:6px;background:var(--petroleo-tint,#e6eeed);color:var(--petroleo,#00393D);font-size:9px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;vertical-align:middle}

/* Valor sobre a barra do fluxo (12/09): o número mora em cima da coluna */
.fx-bars i{position:relative;overflow:visible}
.fx-val{position:absolute;top:-16px;left:50%;transform:translateX(-50%);font-size:9.5px;font-weight:600;color:var(--muted);font-family:var(--mono);white-space:nowrap}

/* BI Resultados e Previsões, redesenho 13/09: entradas e saídas em duas
   colunas pareadas; a NATUREZA colore a borda (petróleo/dourado) e a
   seta do título; o semáforo de meta fica só no anel e no dot. */
#biPanel .bi-previsg{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:0 18px;align-items:start;margin-bottom:14px}
#biPanel .bi-ind{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;gap:12px;align-content:start;margin-top:6px}
#biPanel .bi-duascol{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:stretch}
#biPanel .bi-duascol .bi-col-t{margin-top:0}
/* fio refinado separando Entradas/Saídas dos Indicadores */
#biPanel .bi-indwrap{border-left:1px solid var(--line);padding-left:18px;height:100%}
#biPanel .bi-col{display:grid;gap:12px;align-content:start}
#biPanel .bi-col-t{font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:5px;margin:2px 0 0}
#biPanel .bi-col-t.ent .nat-arr,#biPanel .nat-arr.ent{color:var(--bi-teal)}
#biPanel .bi-col-t.sai .nat-arr,#biPanel .nat-arr.sai{color:var(--gold)}
#biPanel .nat-arr{font-weight:800;font-size:12px;line-height:1}
#biPanel .hero .nat-arr{margin-right:4px}
#biPanel .hero.ent::before{background:var(--bi-teal)}
#biPanel .hero.sai::before{background:var(--gold)}
@media(max-width:1250px){#biPanel .bi-previsg{grid-template-columns:1fr;gap:14px}#biPanel .bi-indwrap{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:14px}}
@media(max-width:900px){#biPanel .bi-duascol{grid-template-columns:1fr}#biPanel .bi-ind{grid-template-columns:1fr}}

/* Sugestões da busca global (19/09, como no Astrea): lista sob o campo da
   topbar; Enter segue abrindo a página completa de resultados. */
.searchwrap{position:relative}
.busca-drop{position:absolute;top:calc(100% + 6px);left:0;right:0;background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 40px -14px rgba(0,0,0,.55);z-index:140;max-height:340px;overflow-y:auto;display:none}
.busca-drop.show{display:block}
.busca-drop a{display:block;padding:8px 12px;font-size:12.5px;border-bottom:1px solid var(--line-soft);text-decoration:none}
.busca-drop a:last-child{border-bottom:0}
.busca-drop a:hover{background:var(--paper2)}
.busca-drop .bd-g{font-size:9.5px;letter-spacing:1px;text-transform:uppercase;color:var(--gold);font-weight:700;margin-right:6px}
.busca-drop .bd-t{color:var(--ink)}
.busca-drop .bd-mais{color:var(--petroleo-txt);font-weight:600;text-align:center}