
/* === vm.css === */
/* =============================================================================
   VERO MANGO - assets/vm.css - a folha única da casca nova.

   Regras do visual (ESPECIFICACAO §4; DECISOES D2 = escuro BI padrão):
     - tema ESCURO no :root, derivado do chrome VERO (#08262A); tema CLARO em
       html[data-tema="claro"] com os tokens do vero_gestao (vg.css) sem alteração;
     - cor só com significado: estado (pos/amb/neg/inf), série (s1..s7), ação
       (neon). Fundo e bordas são neutros. "Manga" (#E8A33A) marca o tempo
       presente - no máximo 1 elemento por tela;
     - neumorfismo suave: cartão em relevo, campo afundado; :active inverte;
     - raios 18 (cartão) / 12 (campo, botão) / 26 (herói); gradiente só no herói;
     - Inter no corpo (14 px PC / 16 px celular), Poppins nos títulos, IBM Plex
       Mono tabular em todo número;
     - >=1024 px: sidebar 240 (72 recolhida) + topo 56 + grade de 12 colunas;
       <1024 px: coluna única + barra inferior de 5 itens;
     - zero rolagem horizontal a partir de 320 px; tabela larga rola DENTRO do
       cartão; foco visível; contraste >= 4,5:1 (medido, não suposto).

   Ordem das seções: tokens -> base -> casca -> cabeçalho de tela -> componentes
   base -> formulário -> sobreposições (toast, sheet) -> login -> perfil ->
   utilitários -> impressão. Os componentes BI (tile, anel, medidor, âncora,
   gráfico, tabela inteligente, filtros) entram no PROMPT-02, nesta mesma folha.
   Servida SÓ por assets/pacote.php?t=css - o legado nunca a carrega.
   ============================================================================= */

/* ===== 1. Tokens - tema escuro (padrão) ===================================== */
:root{
  /* superfícies */
  --fundo:#061A1D; --menu:#041416; --card:#0B2A2F; --card-alto:#0F363D; --campo:#051619;
  --linha:rgba(255,255,255,.08); --linha-forte:rgba(255,255,255,.14);
  /* tinta */
  --tinta:#ECF3F2; --tinta-2:#C9D6D4; --mut:#8FA5A2; --fraco:#5E7472; /* --fraco: só decoração, nunca texto */
  /* marca */
  --teal:#005059; --teal-escuro:#00363D; --teal-2:#2A767C; --teal-3:#4E9CA1; --neon:#5FD3C4; --chrome:#08262A;
  /* ação = neon com texto escuro por cima */
  --acao:var(--neon); --sobre-acao:#04191B;
  /* estados (texto + fundo tintado 14 %) */
  --pos:#43C59E; --pos-bg:rgba(67,197,158,.14);
  --amb:#E8B84B; --amb-bg:rgba(232,184,75,.14);
  --neg:#F08080; --neg-bg:rgba(240,128,128,.14);
  --inf:#7DA9F5; --inf-bg:rgba(125,169,245,.14);
  /* manga = tempo presente (fase atual, hoje, safra ativa) - máx. 1 elemento por tela */
  --manga:#E8A33A;
  /* séries de gráfico, nesta ordem */
  /* --s3: teal-2 clareado (#2A767C dava 2,87:1 sobre o cartão; série exige >= 3:1 - C-33) */
  --s1:#5FD3C4; --s2:#4E9CA1; --s3:#338A90; --s4:#E8B84B; --s5:#E8A33A; --s6:#7DA9F5; --s7:#B8C7C5;
  --grad-heroi:linear-gradient(135deg,#0F4A52 0%,#1C7C80 55%,#5FD3C4 100%);
  /* profundidade (neumorfismo sobre escuro = suave) */
  --relevo:-4px -4px 10px rgba(255,255,255,.035), 6px 6px 16px rgba(0,0,0,.45);
  --relevo-p:-2px -2px 6px rgba(255,255,255,.03), 3px 3px 9px rgba(0,0,0,.4);
  --afundado:inset 3px 3px 7px rgba(0,0,0,.5), inset -2px -2px 6px rgba(255,255,255,.04);
  --raio:18px; --raio-p:12px; --raio-g:26px; --raio-pill:999px;

  /* sidebar (sempre sobre --menu, nos dois temas) */
  --menu-tinta:#C9D8D5; --menu-mut:#7E979A; --menu-hover:rgba(255,255,255,.05);
  --sobre-marca:#FFFFFF;
  /* vidro do topo */
  --topo-fundo:rgba(6,26,29,.86);
  /* sobreposições */
  --scrim:rgba(2,10,12,.62); --toast-fundo:#0F363D;
  --sobre-heroi:#FFFFFF; --sobre-heroi-2:#CFEDE8;
  /* texto escuro sobre os fundos de estado sólidos (ícone do alerta, botão perigo) */
  --sobre-pos:#062A20; --sobre-amb:#2E2000; --sobre-neg:#2A0D0D; --sobre-inf:#0B1F4A;
  --branco:#FFFFFF; --menu-tinta-forte:#EAF3F1;
  --manga-bg:rgba(232,163,58,.16);
  --sombra-acao:rgba(95,211,196,.22); --sombra-neg:rgba(240,128,128,.22); --sombra-heroi:rgba(0,0,0,.35);
  --foco:rgba(95,211,196,.45); --foco-neg:rgba(240,128,128,.5);
  /* login: SEMPRE claro, nos dois temas (ESPECIFICACAO §5) */
  --login-bg-teal:#04262B; --login-bg-arte:url('img/vero_login_bg.svg');
  --login-fundo:#FFFFFF; --login-tinta:#17232B; --login-tinta-2:#243542; --login-mut:#5A6B74;
  --login-linha:#D3DCE0; --login-placeholder:#9AAAB2; --login-hover:#EEF1F3;
  --login-erro-bg:#FAE6E3; --login-erro:#8F2A20; --login-neg:#C0392B; --login-painel:#08262A;
  --login-sobre:#FFFFFF; --login-sobre-2:#CFE0DC; --login-sombra:rgba(0,0,0,.45);

  /* tipografia */
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --disp:'Poppins',var(--sans);
  --num:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  /* ergonomia e medidas da casca */
  --tap:46px; --tap-g:54px;
  --sidebar:240px; --sidebar-recolhida:72px; --topo:56px; --respiro:20px;
  --rodape:calc(env(safe-area-inset-bottom,0px) + 66px);
  color-scheme:dark;
}

/* ===== 1b. Tokens - tema claro (vg.css sem alteração) ======================= */
html[data-tema="claro"]{
  --fundo:#EEF1F3; --menu:#08262A; --card:#F4F7F8; --card-alto:#FBFDFD; --campo:#E9EEF0;
  --linha:rgba(23,35,43,.08); --linha-forte:rgba(23,35,43,.14);
  --tinta:#17232B; --tinta-2:#243542; --mut:#5A6B74; --fraco:#A9B6BC;
  --acao:#005059; --sobre-acao:#FFFFFF;
  --pos:#0A6E63; --pos-bg:#DCEFEB;   /* 5,7:1 sobre o cartão (o #0E7E72 ficava em 4,59) */
  --amb:#7A5410; --amb-bg:#F7EEDA;   /* texto âmbar: o #B57C1A do vg.css dá 3,3:1 sobre o cartão; #7A5410 (amb-esc do vg) dá 6,3:1 */
  --neg:#C0392B; --neg-bg:#FAE6E3;
  --inf:#1D4ED8; --inf-bg:#E4EBFB;
  --manga:#8F5F1A;   /* manga como texto no claro: 5,1:1 (o #E8A33A fica só no escuro) */
  /* --s3 e --s5 medidos (C-33): #4E9CA1 dava 2,96:1 e #E8A33A 2,00:1 sobre o cartão claro */
  --s1:#005059; --s2:#2A767C; --s3:#3A8A90; --s4:#B57C1A; --s5:#BE5E1C; --s6:#1D4ED8; --s7:#7C8B93;
  --grad-heroi:linear-gradient(135deg,#0A6E75 0%,#005059 55%,#00363D 100%);
  --relevo:-6px -6px 14px rgba(255,255,255,.92), 6px 6px 16px rgba(23,35,43,.13);
  --relevo-p:-3px -3px 8px rgba(255,255,255,.92), 3px 3px 9px rgba(23,35,43,.13);
  --afundado:inset 3px 3px 7px rgba(23,35,43,.13), inset -3px -3px 7px rgba(255,255,255,.92);
  --topo-fundo:rgba(238,241,243,.88);
  --scrim:rgba(12,22,28,.5); --toast-fundo:#08262A;
  --sobre-pos:#FFFFFF; --sobre-amb:#FFFFFF; --sobre-neg:#FFFFFF; --sobre-inf:#FFFFFF;
  --sombra-acao:rgba(0,80,89,.26); --sombra-neg:rgba(192,57,43,.26); --sombra-heroi:rgba(0,54,61,.30);
  --foco:rgba(0,80,89,.28); --foco-neg:rgba(192,57,43,.4); --login-sombra:rgba(23,35,43,.22);
  color-scheme:light;
}

/* ===== 2. Base ============================================================== */
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%;height:100%}
body{
  font-family:var(--sans);font-size:14px;line-height:1.5;color:var(--tinta);
  background:var(--fundo);-webkit-font-smoothing:antialiased;overscroll-behavior-y:none;
  min-height:100%;
}
@media(max-width:1023px){body{font-size:16px}}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
a{color:var(--neon);text-decoration:none}
html[data-tema="claro"] a{color:var(--teal)}
svg{flex:none}
img{max-width:100%;display:block}
:focus-visible{outline:2.5px solid var(--neon);outline-offset:2px;border-radius:8px}
html[data-tema="claro"] :focus-visible{outline-color:var(--teal-2)}
.num{font-family:var(--num);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
[hidden]{display:none!important}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--fraco);border-radius:6px;border:2px solid var(--fundo)}
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ===== 3. Casca ============================================================= */
#app{min-height:100dvh;display:flex;flex-direction:column}
.casca{display:flex;min-height:100dvh}

/* --- sidebar (PC) --- */
.sidebar{
  width:var(--sidebar);flex:none;background:var(--menu);color:var(--menu-tinta);
  display:flex;flex-direction:column;position:sticky;top:0;height:100dvh;
  transition:width .2s cubic-bezier(.32,.72,0,1);
}
.sidebar__marca{
  display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:18px 20px 14px;
  border-bottom:1px solid var(--linha);min-height:82px;
}
.sidebar__marca img{width:118px;height:auto}
.sidebar__marca .descritor{
  font:600 11px/1 var(--disp);letter-spacing:.22em;text-transform:uppercase;color:var(--neon);
}
.sidebar__nav{flex:1;overflow-y:auto;overflow-x:hidden;padding:10px 10px 14px}
.sidebar__grupo{font:700 9.5px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--menu-mut);margin:14px 12px 6px}
.nav-item{
  display:flex;align-items:center;gap:11px;width:100%;text-align:left;position:relative;
  padding:10px 12px 10px 14px;border-radius:12px;color:var(--menu-tinta);font:500 13.5px/1.2 var(--sans);
  margin-bottom:2px;transition:background .15s,color .15s;min-height:42px;
}
.nav-item svg{width:20px;height:20px;flex:none}
.nav-item span:not(.seta){flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-item:hover{background:var(--menu-hover);color:var(--branco)}
.nav-item--on{background:var(--card-alto);color:var(--branco);font-weight:600}
html[data-tema="claro"] .nav-item--on{background:rgba(255,255,255,.1)}
.nav-item--on::before{
  content:'';position:absolute;left:0;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:var(--neon);
}
.nav-item--on svg{color:var(--neon)}
.nav-item .seta{width:16px;height:16px;flex:none;display:grid;place-items:center;color:var(--menu-mut);transition:transform .2s}
.nav-item[aria-expanded="true"] .seta{transform:rotate(90deg)}
.nav-sub{display:flex;flex-direction:column;gap:1px;padding:2px 0 6px 22px}
.nav-sub__item{
  display:block;width:100%;text-align:left;padding:8px 12px 8px 24px;border-radius:10px;position:relative;
  color:var(--menu-mut);font:500 13px/1.25 var(--sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.nav-sub__item::before{content:'';position:absolute;left:11px;top:50%;width:5px;height:5px;border-radius:50%;background:currentColor;transform:translateY(-50%);opacity:.6}
.nav-sub__item:hover{color:var(--branco);background:var(--menu-hover)}
.nav-sub__item--on{color:var(--neon)}
.sidebar__pe{padding:10px 12px calc(env(safe-area-inset-bottom,0px) + 10px);border-top:1px solid var(--linha);display:flex;align-items:center;gap:10px}
.sidebar__pe .nome{flex:1;min-width:0}
.sidebar__pe .nome b{display:block;font:600 13px/1.2 var(--sans);color:var(--menu-tinta-forte);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sidebar__pe .nome span{font-size:11px;color:var(--menu-mut)}
.sidebar__recolher{
  width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:none;color:var(--menu-mut);
}
.sidebar__recolher:hover{background:var(--menu-hover);color:var(--branco)}
.sidebar__recolher svg{width:18px;height:18px;transition:transform .2s}

/* sidebar recolhida: só ícones (preferência lembrada) */
.casca--recolhida .sidebar{width:var(--sidebar-recolhida)}
.casca--recolhida .sidebar__marca{align-items:center;padding:16px 8px 12px}
.casca--recolhida .sidebar__marca img{width:34px}
.casca--recolhida .sidebar__marca .descritor,.casca--recolhida .sidebar__grupo,
.casca--recolhida .nav-item span,.casca--recolhida .nav-item .seta,.casca--recolhida .nav-sub,
.casca--recolhida .sidebar__pe .nome{display:none}
.casca--recolhida .nav-item{justify-content:center;padding:11px 0}
.casca--recolhida .sidebar__pe{flex-direction:column;gap:8px}
.casca--recolhida .sidebar__recolher svg{transform:rotate(180deg)}

/* --- conteúdo e topo --- */
.conteudo{flex:1;min-width:0;display:flex;flex-direction:column}
.topo{
  position:sticky;top:0;z-index:30;background:var(--topo-fundo);backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid var(--linha);display:flex;align-items:center;gap:10px;
  padding:0 var(--respiro);min-height:var(--topo);
}
.topo__fazenda{display:flex;align-items:center;gap:9px;min-width:0;flex:none;max-width:38vw}
.topo__fazenda svg{width:18px;height:18px;color:var(--neon);flex:none}
.topo__fazenda b{font:500 15px/1.2 var(--disp);color:var(--tinta);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topo__safra{
  display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:0 12px;border-radius:var(--raio-pill);
  background:var(--card);box-shadow:var(--relevo-p);font:600 12.5px/1 var(--sans);color:var(--tinta-2);flex:none;
}
.topo__safra svg{width:15px;height:15px;color:var(--mut)}
.topo__safra .ponto{width:7px;height:7px;border-radius:50%;background:var(--manga);flex:none}
.topo__busca{flex:1;min-width:0;display:flex;justify-content:center}
.topo__busca .busca{max-width:420px;width:100%}
.topo__direita{display:flex;align-items:center;gap:8px;flex:none;margin-left:auto}
.busca{position:relative;flex:1;min-width:0}
.busca>svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:17px;height:17px;color:var(--mut);pointer-events:none}
.busca .ctrl{padding-left:40px;padding-right:44px;min-height:38px;font-size:13.5px}
.busca>kbd{
  position:absolute;right:11px;top:50%;transform:translateY(-50%);font:600 10.5px/1 var(--num);
  color:var(--mut);border:1px solid var(--linha-forte);border-radius:6px;padding:3px 6px;pointer-events:none;transition:opacity .15s;
}
/* com o campo em uso, o atalho some e o "x" nativo do type=search não briga com ele */
.busca .ctrl:focus~kbd{opacity:0}
.busca .ctrl::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.corpo{
  flex:1;padding:var(--respiro) var(--respiro) 40px;display:flex;flex-direction:column;gap:16px;
  max-width:1600px;width:100%;margin:0 auto;min-width:0;
}

/* --- menu do avatar --- */
.menu-avatar{position:relative}
.menu-avatar__lista{
  position:absolute;right:0;top:calc(100% + 8px);min-width:220px;z-index:40;background:var(--card-alto);
  border-radius:14px;box-shadow:var(--relevo);border:1px solid var(--linha);padding:8px;
}
.menu-avatar__cab{padding:8px 10px 10px;border-bottom:1px solid var(--linha);margin-bottom:6px}
.menu-avatar__cab b{display:block;font:600 13.5px/1.2 var(--sans);color:var(--tinta)}
.menu-avatar__cab span{font-size:12px;color:var(--mut)}
.menu-avatar__item{
  display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:9px 10px;border-radius:10px;
  font:500 13.5px/1.2 var(--sans);color:var(--tinta-2);min-height:40px;
}
.menu-avatar__item svg{width:17px;height:17px;color:var(--mut)}
.menu-avatar__item:hover{background:var(--card);color:var(--tinta)}
.menu-avatar__item--perigo{color:var(--neg)}

/* --- barra inferior (celular) --- */
.barra-inferior{display:none}
@media(max-width:1023px){
  .sidebar{display:none}
  .topo{padding:0 14px;min-height:calc(env(safe-area-inset-top,0px) + 56px);padding-top:env(safe-area-inset-top,0px);gap:8px}
  .topo__fazenda{max-width:52vw}
  .topo__busca{display:none}
  .topo__safra{display:none}
  .corpo{padding:14px 16px calc(var(--rodape) + 24px);gap:14px}
  .barra-inferior{
    display:grid;position:fixed;bottom:0;left:0;right:0;z-index:45;
    grid-template-columns:repeat(5,1fr);align-items:end;
    background:var(--menu);padding:8px 6px calc(env(safe-area-inset-bottom,0px) + 8px);
    border-top:1px solid var(--linha);
  }
  .aba{
    display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 2px;border-radius:12px;
    color:var(--menu-mut);font:600 10px/1.1 var(--sans);min-height:48px;justify-content:center;min-width:0;
  }
  .aba svg{width:22px;height:22px;flex:none}
  .aba span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .aba--on{color:var(--branco)}
  .aba--on svg{color:var(--neon)}
  /* botão central elevado (+ Lançar) */
  .aba--centro{
    background:var(--neon);color:var(--sobre-acao);border-radius:20px;margin:-22px 6px 0;min-height:58px;
    box-shadow:0 6px 20px var(--sombra-acao);
  }
  .aba--centro svg{width:26px;height:26px;color:var(--sobre-acao)}
  .aba--centro span{font-size:9.5px}
}
@media(max-width:360px){
  .barra-inferior{padding-left:3px;padding-right:3px}
  .aba{font-size:9px;padding-left:1px;padding-right:1px;gap:3px}
  .aba svg{width:20px;height:20px}
  .aba--centro{margin-left:3px;margin-right:3px}
}

/* ===== 4. Cabeçalho de tela ================================================ */
.tela__cab{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap}
.tela__cab > div:first-child{flex:1;min-width:200px}
.tela__migalha{font-size:12px;color:var(--mut);margin-bottom:3px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.tela__migalha svg{width:12px;height:12px;color:var(--fraco)}
.tela__titulo{font:600 20px/1.2 var(--disp);color:var(--tinta);letter-spacing:-.2px}
.tela__sub{font-size:13px;color:var(--mut);margin-top:3px}
.tela__acoes{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ===== 5. Componentes base ================================================= */
/* --- cartão --- */
.card{background:var(--card);border-radius:var(--raio);padding:18px;box-shadow:var(--relevo);min-width:0}
.card--plano{box-shadow:var(--relevo-p)}
.card--fundo{background:var(--fundo);box-shadow:var(--afundado)}
.card__cab{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.card__titulo{font:600 13px/1.3 var(--disp);color:var(--tinta);flex:1;min-width:0}
.card__sub{font:400 12px/1.4 var(--sans);color:var(--mut);margin-top:2px;overflow-wrap:anywhere}
.card__cab .ic{
  width:34px;height:34px;border-radius:11px;display:grid;place-items:center;flex:none;
  background:var(--card-alto);color:var(--neon);box-shadow:var(--relevo-p);
}
html[data-tema="claro"] .card__cab .ic{color:var(--teal)}
.card__cab .ic svg{width:17px;height:17px}
.card__acoes{display:flex;gap:6px;flex:none;align-items:center;flex-wrap:wrap;justify-content:flex-end}
/* celular estreito: as ações do cabeçalho descem para a linha de baixo quando não cabem ao lado do título */
@media(max-width:479px){.card__cab{flex-wrap:wrap}.card__acoes{max-width:100%;justify-content:flex-start}}
/* Cartão-herói: o número principal da tela, único lugar do gradiente. */
.card--heroi{
  border-radius:var(--raio-g);padding:22px;color:var(--sobre-heroi);position:relative;overflow:hidden;
  background:var(--grad-heroi);box-shadow:0 12px 30px var(--sombra-heroi);
}
.card--heroi::after{content:'';position:absolute;right:-40px;top:-60px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.07);pointer-events:none}
.heroi__rotulo{font:700 10.5px/1 var(--sans);letter-spacing:.13em;text-transform:uppercase;color:var(--sobre-heroi-2)}
.heroi__valor{font-family:var(--num);font-size:36px;font-weight:600;letter-spacing:-.035em;margin:8px 0 4px;font-variant-numeric:tabular-nums}
.heroi__sub{font-size:13px;color:var(--sobre-heroi-2)}
@media(max-width:1023px){.heroi__valor{font-size:30px}}

/* --- botão de texto pequeno no cabeçalho --- */
.acao{font:600 12.5px/1 var(--sans);color:var(--neon);flex:none;display:inline-flex;align-items:center;padding:14px 0;margin:-14px 0;gap:5px}
html[data-tema="claro"] .acao{color:var(--teal)}

/* --- botões --- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--tap);padding:0 18px;
  border-radius:var(--raio-p);font:600 14px/1 var(--sans);background:var(--acao);color:var(--sobre-acao);
  box-shadow:0 4px 14px var(--sombra-acao);transition:transform .12s,box-shadow .14s,filter .14s;white-space:nowrap;
}
.btn svg{width:18px;height:18px}
.btn:hover{filter:brightness(1.06)}
.btn:active{transform:translateY(1px);box-shadow:none}
.btn[disabled]{opacity:.45;box-shadow:none;pointer-events:none}
.btn--acao{background:var(--acao);color:var(--sobre-acao)}
.btn--2{background:var(--card-alto);color:var(--tinta);box-shadow:var(--relevo-p)}
.btn--2:active{box-shadow:var(--afundado)}
.btn--fantasma{background:transparent;color:var(--mut);box-shadow:none}
.btn--fantasma:hover{background:var(--card-alto);color:var(--tinta)}
.btn--perigo{background:var(--neg);color:var(--sobre-neg);box-shadow:0 4px 14px var(--sombra-neg)}
.btn--pq{min-height:36px;font-size:12.5px;padding:0 12px;border-radius:10px}
.btn--pq svg{width:15px;height:15px}
.btn--g{min-height:var(--tap-g);font-size:15px;border-radius:14px}
.btn--bloco{width:100%}
.btn--heroi{background:var(--sobre-heroi);color:var(--teal-escuro);box-shadow:none}
.btns{display:flex;gap:10px;flex-wrap:wrap}
.btns--bloco .btn{flex:1}

.ic-btn{
  width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:none;position:relative;
  background:var(--card);color:var(--mut);box-shadow:var(--relevo-p);
}
.ic-btn svg{width:19px;height:19px}
.ic-btn:hover{color:var(--tinta);box-shadow:var(--relevo)}
.ic-btn:active{box-shadow:var(--afundado)}
.ic-btn .bolha{
  position:absolute;top:-4px;right:-4px;background:var(--neg);color:var(--sobre-neg);font:700 9.5px/1 var(--num);
  min-width:17px;height:17px;border-radius:9px;display:grid;place-items:center;padding:0 4px;border:2px solid var(--fundo);
}

/* --- avatar --- */
.avatar{
  width:36px;height:36px;border-radius:12px;flex:none;display:grid;place-items:center;overflow:hidden;
  color:var(--branco);font:600 13px var(--sans);background:var(--teal);box-shadow:var(--relevo-p);letter-spacing:.02em;
}
.avatar img{width:100%;height:100%;object-fit:cover}
.avatar--g{width:52px;height:52px;border-radius:17px;font-size:18px}
.avatar--gg{width:112px;height:112px;border-radius:32px;font-size:36px}
.avatar--p{width:28px;height:28px;border-radius:9px;font-size:11px}
button.avatar{cursor:pointer}

/* --- tag --- */
.tag{
  display:inline-flex;align-items:center;gap:4px;font:700 10px/1 var(--sans);letter-spacing:.05em;text-transform:uppercase;
  padding:5px 9px;border-radius:7px;background:var(--campo);color:var(--tinta-2);white-space:nowrap;
}
.tag svg{width:11px;height:11px}
.tag--pos{background:var(--pos-bg);color:var(--pos)}
.tag--amb{background:var(--amb-bg);color:var(--amb)}
.tag--neg{background:var(--neg-bg);color:var(--neg)}
.tag--inf{background:var(--inf-bg);color:var(--inf)}
.tag--manga{background:var(--manga-bg);color:var(--manga)}

/* --- linha de lançamento / item --- */
.itens{display:flex;flex-direction:column;gap:9px}
.item{
  display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:var(--card);border-radius:14px;
  padding:12px 14px;box-shadow:var(--relevo-p);min-height:var(--tap);transition:transform .12s,box-shadow .14s;color:var(--tinta);
}
button.item:hover{transform:translateY(-1px);box-shadow:var(--relevo)}
button.item:active{box-shadow:var(--afundado);transform:none}
.item__ic{width:38px;height:38px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--campo);color:var(--neon);box-shadow:var(--relevo-p)}
html[data-tema="claro"] .item__ic{color:var(--teal)}
.item__ic svg{width:18px;height:18px}
.item__c{flex:1;min-width:0}
.item__t{font:600 14px/1.3 var(--sans);color:var(--tinta);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.item__s{font-size:12px;color:var(--mut);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.item__d{text-align:right;flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.item__v{font-family:var(--num);font-size:14.5px;font-weight:600;color:var(--tinta);white-space:nowrap;font-variant-numeric:tabular-nums}
.item__v--neg{color:var(--neg)}
.item__v--pos{color:var(--pos)}
.item__seta{color:var(--fraco);flex:none}
.item__seta svg{width:17px;height:17px}

/* --- alerta / aviso --- */
.alerta{
  display:flex;gap:12px;align-items:flex-start;width:100%;text-align:left;border-radius:var(--raio);padding:13px 15px;
  min-height:var(--tap);box-shadow:var(--relevo-p);background:var(--card);color:var(--tinta);
}
.alerta__ic{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;flex:none}
.alerta__ic svg{width:17px;height:17px}
.alerta__t{font:600 14px/1.3 var(--sans)}
.alerta__s{font-size:12.5px;margin-top:3px;line-height:1.4;color:var(--tinta-2)}
.alerta--pos{background:var(--pos-bg)}   .alerta--pos .alerta__ic{background:var(--pos);color:var(--sobre-pos)}
.alerta--amb{background:var(--amb-bg)}   .alerta--amb .alerta__ic{background:var(--amb);color:var(--sobre-amb)}
.alerta--neg{background:var(--neg-bg)}   .alerta--neg .alerta__ic{background:var(--neg);color:var(--sobre-neg)}
.alerta--inf{background:var(--inf-bg)}   .alerta--inf .alerta__ic{background:var(--inf);color:var(--sobre-inf)}
.faixa-erro{
  display:flex;gap:10px;align-items:flex-start;background:var(--neg-bg);color:var(--neg);border-radius:12px;
  padding:11px 13px;font:500 13px/1.45 var(--sans);
}
.faixa-erro svg{width:18px;height:18px;flex:none;margin-top:1px}

/* --- segmento (1D/1S/1M) --- */
.segmento{
  display:flex;gap:3px;background:var(--campo);border-radius:var(--raio-pill);padding:4px;box-shadow:var(--afundado);
  max-width:100%;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.segmento::-webkit-scrollbar{display:none}
.segmento button{
  min-height:32px;padding:0 14px;border-radius:var(--raio-pill);flex:none;font:600 12.5px/1 var(--sans);color:var(--mut);
  transition:all .16s;white-space:nowrap;
}
.segmento button.on{background:var(--acao);color:var(--sobre-acao);box-shadow:0 2px 8px rgba(0,0,0,.25)}

/* --- texto --- */
.h1{font:600 22px/1.2 var(--disp);color:var(--tinta);letter-spacing:-.25px}
.h2{font:600 17px/1.25 var(--disp);color:var(--tinta)}
.secao{font:700 10.5px/1 var(--sans);letter-spacing:.11em;text-transform:uppercase;color:var(--mut);display:flex;align-items:center;gap:10px;margin:6px 0 -2px}
.secao::after{content:'';flex:1;height:1px;background:var(--linha)}
.sub{font-size:13.5px;color:var(--mut);line-height:1.5;overflow-wrap:anywhere}
.mini{font-size:12px;color:var(--mut);overflow-wrap:anywhere}
.saudacao{font:600 21px/1.25 var(--disp);color:var(--tinta)}
.saudacao span{display:block;font:400 13.5px/1.4 var(--sans);color:var(--mut);margin-top:4px}

/* --- vazio / erro / esqueleto (estados obrigatórios de toda tela) --- */
.vazio{text-align:center;padding:42px 22px;display:flex;flex-direction:column;align-items:center;gap:12px}
.vazio__ic{width:68px;height:68px;border-radius:22px;background:var(--fundo);display:grid;place-items:center;color:var(--mut);box-shadow:var(--afundado)}
.vazio__ic svg{width:30px;height:30px}
.vazio__t{font:600 16px/1.3 var(--disp);color:var(--tinta)}
.vazio__s{font-size:13.5px;color:var(--mut);max-width:340px;line-height:1.55}
@keyframes vmPulso{0%,100%{opacity:.45}50%{opacity:.8}}
.esqueleto{background:var(--campo);border-radius:var(--raio);animation:vmPulso 1.3s ease-in-out infinite;box-shadow:var(--afundado)}
.esqueleto--kpi{height:104px}
.esqueleto--linha{height:60px;border-radius:14px}
.esqueleto--card{height:220px}

/* --- grades --- */
.grade{display:grid;gap:16px;grid-template-columns:repeat(12,1fr)}
.g-3{grid-column:span 3}.g-4{grid-column:span 4}.g-6{grid-column:span 6}.g-8{grid-column:span 8}.g-12{grid-column:span 12}
@media(max-width:1279px){.g-3{grid-column:span 6}.g-4{grid-column:span 6}}
@media(max-width:900px){.g-3,.g-4,.g-6,.g-8{grid-column:span 12}}
.blocos{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr))}
.pilha{display:flex;flex-direction:column;gap:16px;min-width:0}
.atalhos{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(200px,100%),1fr))}
.atalho{
  background:var(--card);border-radius:var(--raio);padding:14px 16px;box-shadow:var(--relevo);display:flex;align-items:center;gap:12px;
  min-height:64px;text-align:left;color:var(--tinta);transition:transform .14s,box-shadow .2s;
}
.atalho:hover{transform:translateY(-2px)}
.atalho:active{transform:none;box-shadow:var(--afundado)}
.atalho__ic{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--campo);color:var(--neon);flex:none}
html[data-tema="claro"] .atalho__ic{color:var(--teal)}
.atalho__ic svg{width:18px;height:18px}
.atalho__t{font:600 13.5px/1.3 var(--sans);min-width:0;overflow-wrap:anywhere}
.atalho__s{font-size:11.5px;color:var(--mut);margin-top:2px}

/* (a tabela é a inteligente do §12 - .tabela-bi; a base do PROMPT-01 foi removida no PROMPT-02) */

/* ===== 6. Formulário ======================================================== */
.campo{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.campo > label{font:600 12.5px/1.2 var(--sans);color:var(--tinta-2);display:flex;align-items:center;gap:5px}
.campo > label .req{color:var(--neg);font-weight:700}
.campo .ajuda{font-size:12px;color:var(--mut);line-height:1.4}
.ctrl{
  width:100%;min-height:var(--tap);padding:11px 14px;background:var(--campo);border:0;border-radius:var(--raio-p);
  color:var(--tinta);font-size:14px;box-shadow:var(--afundado);transition:box-shadow .16s;
}
@media(max-width:1023px){.ctrl{font-size:16px;min-height:52px}}
.ctrl:focus{outline:none;box-shadow:var(--afundado), 0 0 0 2.5px var(--foco)}
.ctrl::placeholder{color:var(--mut)}
textarea.ctrl{min-height:96px;resize:vertical;line-height:1.5}
select.ctrl{
  appearance:none;padding-right:40px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238FA5A2' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;background-size:18px;
}
.ctrl--num{font-family:var(--num);font-size:15px;font-weight:600;letter-spacing:-.02em}
.campo--erro .ctrl{box-shadow:var(--afundado), 0 0 0 2.5px var(--foco-neg)}
.campo__erro{font-size:12px;color:var(--neg);font-weight:600}
.comun{position:relative}
.comun .ctrl{padding-right:60px}
.comun span{position:absolute;right:14px;top:50%;transform:translateY(-50%);font:600 12.5px var(--sans);color:var(--mut);pointer-events:none}
.grade2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.grade2{grid-template-columns:1fr}}
.interruptor{
  display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:var(--tap);padding:10px 14px;
  background:var(--card);border-radius:var(--raio-p);box-shadow:var(--relevo-p);cursor:pointer;
}
.interruptor > span:first-child{font:600 14px/1.35 var(--sans);flex:1}
.interruptor input{position:absolute;opacity:0;pointer-events:none}
.interruptor .cx{width:48px;height:28px;border-radius:15px;background:var(--campo);flex:none;position:relative;box-shadow:var(--afundado);transition:background .2s}
.interruptor .cx::after{content:'';position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--card-alto);box-shadow:var(--relevo-p);transition:transform .22s cubic-bezier(.32,.72,0,1)}
.interruptor input:checked + .cx{background:var(--acao)}
.interruptor input:checked + .cx::after{transform:translateX(20px)}
.interruptor input:focus-visible + .cx{outline:2.5px solid var(--neon);outline-offset:2px}

/* ===== 7. Sobreposições ==================================================== */
.scrim{position:fixed;inset:0;z-index:60;background:var(--scrim);opacity:0;transition:opacity .22s}
.scrim.on{opacity:1}
.sheet{position:fixed;z-index:61;background:var(--fundo);display:flex;flex-direction:column;box-shadow:0 -10px 50px rgba(0,0,0,.45);transition:transform .3s cubic-bezier(.32,.72,0,1)}
@media(max-width:1023px){
  .sheet{left:0;right:0;bottom:0;border-radius:24px 24px 0 0;max-height:93dvh;transform:translateY(100%)}
  .sheet.on{transform:translateY(0)}
}
@media(min-width:1024px){
  .sheet{top:0;right:0;bottom:0;width:min(560px,92vw);transform:translateX(100%)}
  .sheet.on{transform:translateX(0)}
  .sheet--modal{top:50%;left:50%;right:auto;bottom:auto;width:min(520px,92vw);max-height:90dvh;border-radius:var(--raio-g);transform:translate(-50%,-46%);opacity:0;transition:transform .25s,opacity .2s}
  .sheet--modal.on{transform:translate(-50%,-50%);opacity:1}
}
.sheet__pega{width:40px;height:5px;border-radius:3px;background:var(--fraco);margin:9px auto 2px;flex:none}
@media(min-width:1024px){.sheet__pega{display:none}}
.sheet__cab{display:flex;align-items:center;gap:12px;padding:16px 18px;flex:none;border-bottom:1px solid var(--linha)}
.sheet__cab .t{font:600 16px/1.2 var(--disp);flex:1;min-width:0;color:var(--tinta)}
.sheet__corpo{flex:1;overflow-y:auto;padding:18px}
.sheet__pe{flex:none;padding:14px 18px calc(env(safe-area-inset-bottom,0px) + 16px);border-top:1px solid var(--linha);background:var(--card)}

.toast{
  position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(18px);z-index:80;max-width:460px;width:calc(100% - 32px);
  background:var(--toast-fundo);color:var(--menu-tinta-forte);border-radius:14px;padding:13px 16px;font:500 14px/1.4 var(--sans);
  box-shadow:0 12px 34px rgba(0,0,0,.45);opacity:0;transition:opacity .2s,transform .2s;display:flex;align-items:center;gap:10px;
  border:1px solid var(--linha-forte);
}
@media(max-width:1023px){.toast{bottom:calc(var(--rodape) + 18px)}}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
.toast svg{width:19px;height:19px;flex:none;color:var(--neon)}
.toast--erro{border-color:var(--neg)}
.toast--erro svg{color:var(--neg)}
.toast--ok svg{color:var(--pos)}

/* ===== 8. Login — a MESMA tela do ERP (lab.verobyorigo.agr.br), 16/09/2026 ==
   Cartao dividido: formulario objetivo a esquerda, arte/marca a direita, sobre
   o fundo teal profundo com os contornos do vale e a grade em vinheta. Os
   valores vieram do index.php do ERP; aqui ficam nos tokens do MANGO.
   ========================================================================== */
.login{
  position:relative;min-height:100dvh;display:grid;place-items:center;padding:24px;
  background:var(--login-bg-teal);color-scheme:light;overflow-x:hidden;isolation:isolate;
}
/* atmosfera do fundo: gradiente + contornos do vale */
.login::before{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    linear-gradient(160deg,rgba(5,47,53,.82) 0%,rgba(4,38,43,.88) 55%,rgba(3,32,36,.94) 100%),
    var(--login-bg-arte) center/cover no-repeat,
    var(--login-bg-teal);
}
/* grade tenue, esmaecida nas bordas */
.login::after{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.35;
  background-image:linear-gradient(rgba(78,156,161,.07) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(78,156,161,.07) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(70% 60% at 50% 45%,#000,transparent 100%);
          mask-image:radial-gradient(70% 60% at 50% 45%,#000,transparent 100%);
}
.login__cartao{
  width:min(980px,100%);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  background:var(--login-fundo);border-radius:18px;overflow:hidden;
  box-shadow:0 30px 90px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.07);
  opacity:0;transform:translateY(16px);animation:login-entra .55s var(--ease,cubic-bezier(.22,.61,.36,1)) .08s forwards;
}
@keyframes login-entra{to{opacity:1;transform:none}}
.login__cartao--treme{animation:login-treme .42s cubic-bezier(.22,.61,.36,1)}
@keyframes login-treme{10%,90%{transform:translateX(-2px)}30%,70%{transform:translateX(4px)}50%{transform:translateX(-4px)}}

/* ---- formulario ---- */
.login__form{padding:40px 42px 24px;display:flex;flex-direction:column;position:relative;min-width:0;color:var(--login-tinta)}
.login__lockup{position:absolute;top:26px;right:30px;height:26px;width:auto;opacity:.9}
.login__titulo{font:700 27px/1.1 var(--sans);letter-spacing:-.02em;color:var(--login-tinta);margin:0}
.login__sub{margin:6px 0 24px;font:400 13px/1.4 var(--sans);color:var(--login-mut)}
.login__campo{margin-bottom:18px}
.login__campo label{display:block;font:700 12px/1.2 var(--sans);letter-spacing:.01em;color:var(--login-tinta);margin-bottom:4px}
.login__campo .linha{display:flex;align-items:center;gap:10px;border-bottom:1.5px solid var(--login-linha);padding:4px 2px;transition:border-color .16s}
.login__campo .linha:focus-within{border-color:var(--teal)}
.login__campo input{
  flex:1;min-width:0;background:transparent;border:0;outline:0;padding:8px 0;
  font:400 15px/1.4 var(--sans);color:var(--login-tinta);min-height:auto;
}
.login__campo input::placeholder{color:#A7B3B8}
.login__campo--erro .linha{border-color:var(--login-neg)}
.login__mostrar{
  position:static;transform:none;display:grid;place-items:center;width:32px;height:32px;
  border-radius:8px;background:none;color:var(--login-mut);flex:none;
}
.login__mostrar:hover{background:#F1F4F5;color:var(--teal)}
.login__mostrar svg{width:19px;height:19px}
.login__esqueci{display:flex;justify-content:flex-end;margin:-6px 0 4px;text-align:right}
.login__esqueci button{font:500 12.5px/1 var(--sans);color:var(--teal);padding:4px 2px;min-height:auto}
.login__esqueci button:hover{color:var(--teal-escuro)}
.login__erro{margin:8px 0 0;background:var(--login-erro-bg);color:var(--login-erro);border-radius:10px;padding:10px 12px;font-size:13px}

/* botao unico, largo, em caixa alta — como no ERP */
.login__botoes{display:block;margin-top:14px}
.login__painel-btn.btn{
  width:100%;min-height:50px;border-radius:11px;background:var(--teal);color:#fff;
  font:700 13px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;
  display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:none;
}
.login__painel-btn.btn:hover{background:var(--teal-escuro);filter:none}
.login__painel-btn.btn svg{width:17px;height:17px}
/* o acesso pelo celular vira link discreto (o ERP nao tem esse botao) */
.login__app{display:flex;justify-content:center;margin-top:12px}
.login__app button{
  display:inline-flex;align-items:center;gap:7px;background:none;color:var(--login-mut);
  font:500 12.5px/1 var(--sans);padding:6px 4px;min-height:auto;
}
.login__app button:hover{color:var(--teal)}
.login__app svg{width:15px;height:15px}

.login__pe{
  margin-top:auto;padding-top:26px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font:400 11px/1.4 var(--sans);color:#8FA0A6;text-align:left;
}
.login__pe-ponto{width:5px;height:5px;border-radius:50%;background:var(--pos,#0E7E72);flex:none;box-shadow:0 0 0 3px rgba(14,126,114,.14)}
.login__pe-mono{font-family:var(--mono,'IBM Plex Mono',ui-monospace,monospace);letter-spacing:.04em}
.login__pe-sep{color:#C7D2D6}

/* ---- arte / marca ---- */
.login__painel{
  position:relative;min-height:440px;display:grid;place-items:center;padding:30px;gap:0;
  background-color:#00363D;background-position:center;background-size:cover;background-repeat:no-repeat;isolation:isolate;
  color:var(--login-sobre);text-align:center;
}
.login__painel::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(155deg,rgba(0,54,61,.38) 0%,rgba(0,80,89,.34) 45%,rgba(3,32,36,.72) 100%);
}
.login__conteudo{
  position:relative;display:grid;justify-items:center;padding:26px 18px;border-radius:26px;
  background:radial-gradient(64% 62% at 50% 46%, rgba(0,22,26,.42), rgba(0,22,26,0) 72%);
}
/* o simbolo em "squircle" escuro, como no ERP (era um circulo branco) */
.login__simbolo{
  width:min(158px,44%);aspect-ratio:1;height:auto;border-radius:28px;display:grid;place-items:center;padding:20px;
  background:rgba(4,28,32,.90);backdrop-filter:blur(2px);
  box-shadow:0 18px 50px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.07);
}
.login__simbolo svg,.login__simbolo img{width:100%;max-height:100%;height:auto;object-fit:contain;color:#fff}
.login__textos{margin-top:18px;text-shadow:0 1px 14px rgba(0,0,0,.4)}
.login__marca{font:700 19px/1.2 var(--sans);letter-spacing:.06em;color:#EFF6F6}
.login__fazenda{margin-top:4px;font:400 12.5px/1.4 var(--sans);letter-spacing:.02em;color:rgba(239,246,246,.76)}

@media(max-width:880px){
  .login{padding:0;place-items:stretch}
  .login__cartao{grid-template-columns:1fr;grid-template-rows:auto 1fr;border-radius:0;min-height:100dvh;max-width:none}
  .login__painel{order:-1;min-height:0;height:190px;padding:18px}
  .login__conteudo{padding:10px 14px}
  .login__simbolo{width:88px;border-radius:20px;padding:12px}
  .login__textos{margin-top:10px}
  .login__marca{font-size:16px}
  .login__fazenda{display:none}
  .login__form{padding:28px 22px 22px}
  .login__lockup{display:none}
  .login__pe{padding-top:20px}
}
@media(prefers-reduced-motion:reduce){
  .login__cartao{animation:none!important;opacity:1;transform:none}
}

/* QR do "Acessar APP" (D5) */
.qr{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.qr__cx{width:220px;height:220px;background:var(--branco);border-radius:18px;padding:10px;box-shadow:var(--relevo-p)}
.qr__cx svg{width:100%;height:100%;display:block}
.qr__url{font:600 13px/1.4 var(--num);color:var(--tinta);overflow-wrap:anywhere}

/* ===== 9. Perfil (§6) ======================================================= */
.perfil__topo{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.perfil__foto{position:relative;flex:none}
.perfil__foto .avatar--gg{box-shadow:var(--relevo)}
.perfil__foto-acoes{display:flex;gap:8px;flex-wrap:wrap}
.recorte{display:flex;flex-direction:column;align-items:center;gap:12px}
.recorte__area{width:min(280px,100%);aspect-ratio:1;border-radius:18px;overflow:hidden;background:var(--campo);box-shadow:var(--afundado);position:relative;touch-action:none;cursor:grab}
.recorte__area canvas{width:100%;height:100%;display:block}
.recorte__area::after{content:'';position:absolute;inset:0;border:2px dashed var(--linha-forte);border-radius:18px;pointer-events:none}
.recorte input[type=range]{width:min(280px,100%);accent-color:var(--neon)}
.perfil__tema{display:flex;gap:10px;flex-wrap:wrap}
.perfil__tema .escolha{
  flex:1;min-width:140px;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:var(--raio-p);
  background:var(--card);box-shadow:var(--relevo-p);font:600 13.5px/1.2 var(--sans);color:var(--tinta);text-align:left;min-height:var(--tap);
}
.perfil__tema .escolha svg{width:18px;height:18px;color:var(--mut)}
.perfil__tema .escolha--on{box-shadow:var(--afundado);color:var(--neon)}
.perfil__tema .escolha--on svg{color:var(--neon)}
html[data-tema="claro"] .perfil__tema .escolha--on,html[data-tema="claro"] .perfil__tema .escolha--on svg{color:var(--teal)}

/* ===== 10. Utilitários e acessibilidade ===================================== */
.oculto-pc{display:none}
@media(max-width:1023px){.oculto-pc{display:initial}.oculto-cel,.corpo .oculto-cel,.topo .oculto-cel{display:none}}
@keyframes vmEntra{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.corpo > *{animation:vmEntra .24s cubic-bezier(.23,1,.32,1) both}
@media(prefers-reduced-motion:reduce){
  .corpo > *{animation:none}
}

/* ===== 11. Impressão (sempre claro) ======================================== */
@media print{
  .sidebar,.barra-inferior,.topo,.btn,.ic-btn,.segmento,.toast,.scrim,.sheet,.casca .barra-inferior{display:none}
  body{background:var(--login-fundo);color:var(--login-tinta)}
  .corpo{padding:0;gap:12px;max-width:none}
  .card,.item{box-shadow:none;border:1px solid var(--login-linha);break-inside:avoid;background:var(--login-fundo);color:var(--login-tinta)}
  .casca .card--heroi{background:var(--login-fundo);color:var(--login-tinta);border:1px solid var(--login-linha)}
  .casca .heroi__rotulo,.casca .heroi__sub{color:var(--login-mut)}
}

/* ===== 12. Componentes BI (PROMPT-02, ESPECIFICACAO §4.4) ================== */
/* --- filtros globais --- */
.filtros{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:flex-end;background:var(--card);border-radius:var(--raio);padding:10px 14px;box-shadow:var(--relevo-p)}
.filtros__grupo{display:flex;flex-direction:column;gap:4px;min-width:0}
.filtros__grupo > label{font:700 9.5px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
.filtros .ctrl{min-height:36px;padding:6px 32px 6px 10px;font-size:13px;width:auto;min-width:140px;max-width:100%}
.filtros__periodo{margin-left:auto;display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.filtros__datas{display:flex;gap:6px;flex-wrap:wrap}
.filtros__datas .ctrl{min-width:0;width:138px;padding-right:10px}
@media(max-width:640px){.filtros__grupo,.filtros__periodo{width:100%}.filtros .ctrl{width:100%}.filtros__periodo{margin-left:0}.filtros .segmento{width:100%}.filtros .segmento button{flex:1}}

/* --- tile KPI --- */
.tiles{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr))}
.tile{background:var(--card);border-radius:var(--raio);padding:14px 16px;box-shadow:var(--relevo);display:flex;gap:12px;align-items:center;min-width:0;text-align:left;color:var(--tinta);width:100%;transition:transform .14s,box-shadow .14s;container-type:inline-size}
button.tile:hover{transform:translateY(-2px)}
button.tile:active{box-shadow:var(--afundado);transform:none}
.tile__ic{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;flex:none;background:var(--campo);color:var(--neon);box-shadow:var(--afundado)}
html[data-tema="claro"] .tile__ic{color:var(--teal)}
.tile__ic svg{width:22px;height:22px}
.tile__c{flex:1;min-width:0}
.tile__v{font-family:var(--num);font-size:24px;font-weight:600;line-height:1.1;letter-spacing:-.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
.tile__v small{font-size:12px;font-weight:500;color:var(--mut);letter-spacing:0}
.tile__v--texto{font-family:var(--disp);font-size:17px;font-weight:600;letter-spacing:-.01em;white-space:normal;line-height:1.15;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;text-overflow:clip;hyphens:auto;overflow-wrap:anywhere}
/* Tile estreito (5 por linha em 1280): número menor e ícone menor, em vez de reticências. */
@container (max-width:230px){.tile{padding:12px 14px;gap:10px}.tile__v{font-size:19px}.tile__ic{width:36px;height:36px;border-radius:11px}.tile__ic svg{width:18px;height:18px}.tile__v--texto{font-size:14.5px}}
.tile__r{font:700 10px/1.2 var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--mut);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile__s{font-size:11.5px;color:var(--mut);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile__d{display:inline-flex;align-items:center;gap:3px;font:600 11.5px/1 var(--num);margin-top:6px;padding:3px 7px;border-radius:7px;font-variant-numeric:tabular-nums}
.tile__d svg{width:12px;height:12px}
.tile__d--pos{color:var(--pos);background:var(--pos-bg)}
.tile__d--neg{color:var(--neg);background:var(--neg-bg)}
.tile__d--neutro{color:var(--mut);background:var(--campo)}
.tile--manga .tile__ic,.tile--manga .tile__v{color:var(--manga)}
.tile--pos .tile__ic{color:var(--pos)}
.tile--neg .tile__ic{color:var(--neg)}
.tile--amb .tile__ic{color:var(--amb)}

/* --- anel --- */
.anel{position:relative;flex:none;display:grid;place-items:center}
.anel svg{transform:rotate(-90deg)}
.anel__trilha{stroke:var(--campo)}
.anel__valor{stroke:var(--s1);stroke-linecap:round;transition:stroke-dashoffset .7s cubic-bezier(.23,1,.32,1)}
.anel--pos .anel__valor{stroke:var(--pos)}
.anel--amb .anel__valor{stroke:var(--amb)}
.anel--neg .anel__valor{stroke:var(--neg)}
.anel--manga .anel__valor{stroke:var(--manga)}
.anel__txt{position:absolute;inset:0;display:grid;place-items:center;text-align:center;font-family:var(--num);font-weight:600;color:var(--tinta);font-variant-numeric:tabular-nums;line-height:1.1}
.anel__txt small{display:block;font:500 10px/1.2 var(--sans);color:var(--mut);margin-top:2px}
.anel-item{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0}
.anel-item__r{font:700 10px/1.2 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--mut);text-align:center}
.anel-item__d{font:600 11.5px/1 var(--num);display:inline-flex;align-items:center;gap:3px}
.anel-item__d svg{width:12px;height:12px}
.anel-item__d--pos{color:var(--pos)}
.anel-item__d--neg{color:var(--neg)}
.aneis{display:flex;gap:18px;justify-content:space-around;flex-wrap:wrap}

/* --- medidor semicircular --- */
.medidor{position:relative;width:100%;max-width:300px;margin:0 auto}
.medidor svg{width:100%;height:auto;display:block;overflow:visible}
.medidor__trilha{stroke:var(--campo)}
.medidor__faixa{opacity:.9}
.medidor__valor{stroke-linecap:round;transition:stroke-dashoffset .8s cubic-bezier(.23,1,.32,1)}
.medidor__marcador{fill:var(--card);stroke:var(--tinta);stroke-width:3}
.medidor__c{position:absolute;left:0;right:0;bottom:8%;text-align:center}
.medidor__r{font:700 10px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.medidor__v{font-family:var(--num);font-size:30px;font-weight:600;letter-spacing:-.035em;color:var(--tinta);margin-top:5px;font-variant-numeric:tabular-nums}
.medidor__s{font-size:12px;color:var(--mut);margin-top:2px}
.medidor__minmax{display:flex;justify-content:space-between;font:600 10.5px var(--num);color:var(--mut);padding:0 6%;margin-top:-4px}

/* --- número-âncora + sparkline --- */
.ancora{display:flex;flex-direction:column;gap:4px;min-width:0}
.ancora__r{font:700 10.5px/1 var(--sans);letter-spacing:.11em;text-transform:uppercase;color:var(--mut)}
.ancora__v{font-family:var(--num);font-size:36px;font-weight:600;letter-spacing:-.035em;line-height:1.1;color:var(--tinta);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
@media(max-width:1023px){.ancora__v{font-size:30px}}
.ancora__v--texto{font-family:var(--disp);font-size:24px;letter-spacing:-.01em}
.ancora__s{font-size:13px;color:var(--mut)}
.ancora__spark{margin-top:8px}
.card--heroi .ancora__r,.card--heroi .ancora__s{color:var(--sobre-heroi-2)}
.card--heroi .ancora__v{color:var(--sobre-heroi)}
.spark{width:100%;height:auto;display:block;overflow:visible}
.spark__linha{fill:none;stroke:var(--s1);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.spark__area{fill:var(--s1);opacity:.14}
.spark__ponto{fill:var(--card);stroke:var(--s1);stroke-width:3}
.card--heroi .spark__linha,.card--heroi .spark__ponto{stroke:var(--sobre-heroi)}
.card--heroi .spark__area{fill:var(--sobre-heroi)}
.card--heroi .spark__ponto{fill:var(--teal-escuro)}
.spark__rotulos{display:flex;justify-content:space-between;margin-top:4px;font-size:10px;color:var(--mut)}
.card--heroi .spark__rotulos{color:var(--sobre-heroi-2)}

/* --- gráfico (ECharts) --- */
.grafico{position:relative;width:100%;min-height:240px;min-width:0}
.grafico__area{width:100%;height:100%;min-height:240px}
.grafico--pequeno,.grafico--pequeno .grafico__area{min-height:170px}
.grafico--alto,.grafico--alto .grafico__area{min-height:320px}
.grafico--maior,.grafico--maior .grafico__area{min-height:420px}
.grafico__estado{position:absolute;inset:0;display:grid;place-items:center;color:var(--mut);font-size:13px;text-align:center;padding:16px}

/* --- tabela inteligente --- */
.tabela-bi{display:flex;flex-direction:column;gap:10px;min-width:0}
.tabela-bi__ferramentas{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.tabela-bi__ferramentas .busca{max-width:320px}
.tabela-bi__ferramentas .busca .ctrl{min-height:36px;font-size:13px}
.tabela-bi__rolagem{overflow:auto;max-height:var(--tabela-altura,440px);border-radius:var(--raio-p);background:var(--fundo);box-shadow:var(--afundado);overscroll-behavior:contain}
table.tabela-bi__t{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}
table.tabela-bi__t th{position:sticky;top:0;z-index:2;background:var(--card-alto);font:700 10px/1.2 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--mut);text-align:left;padding:0;border-bottom:1px solid var(--linha-forte);white-space:nowrap}
table.tabela-bi__t th > span,table.tabela-bi__t th > button{display:flex;align-items:center;gap:5px;width:100%;padding:11px 12px;font:inherit;color:inherit;text-transform:inherit;letter-spacing:inherit;text-align:left;min-height:40px}
table.tabela-bi__t th > button{cursor:pointer}
table.tabela-bi__t th > button:hover{color:var(--tinta)}
table.tabela-bi__t th > button svg{width:13px;height:13px;color:var(--fraco);flex:none}
table.tabela-bi__t th > button[aria-sort="ascending"] svg,table.tabela-bi__t th > button[aria-sort="descending"] svg{color:var(--neon)}
html[data-tema="claro"] table.tabela-bi__t th > button[aria-sort="ascending"] svg,html[data-tema="claro"] table.tabela-bi__t th > button[aria-sort="descending"] svg{color:var(--teal)}
table.tabela-bi__t th > button[aria-sort="descending"] svg{transform:rotate(180deg)}
table.tabela-bi__t th.n > button,table.tabela-bi__t th.n > span{justify-content:flex-end;text-align:right}
table.tabela-bi__t td{padding:10px 12px;border-bottom:1px solid var(--linha);vertical-align:middle;white-space:nowrap;color:var(--tinta)}
table.tabela-bi__t tbody tr:last-child td{border-bottom:0}
table.tabela-bi__t tbody tr:hover td,table.tabela-bi__t tbody tr:focus-within td{background:var(--card-alto)}
table.tabela-bi__t tr.clicavel{cursor:pointer}
table.tabela-bi__t .n{text-align:right;font-family:var(--num);font-variant-numeric:tabular-nums}
table.tabela-bi__t tr.tabela-bi__filtros th{top:40px;z-index:1;background:var(--card);padding:4px 6px;border-bottom:1px solid var(--linha)}
table.tabela-bi__t tr.tabela-bi__filtros .ctrl{min-height:30px;padding:4px 8px;font-size:12px;border-radius:8px;width:100%;min-width:80px}
.tabela-bi__pe{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--mut);gap:8px;flex-wrap:wrap}

/* --- progresso --- */
.progressos{display:flex;flex-direction:column;gap:12px}
.progresso{display:flex;flex-direction:column;gap:6px;min-width:0}
.progresso__cab{display:flex;justify-content:space-between;gap:10px;font-size:13px;color:var(--tinta-2)}
.progresso__cab span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.progresso__pct{font-family:var(--num);font-weight:600;color:var(--tinta);font-variant-numeric:tabular-nums;flex:none}
.progresso__barra{height:8px;border-radius:5px;background:var(--campo);overflow:hidden;box-shadow:var(--afundado)}
.progresso__barra i{display:block;height:100%;border-radius:5px;background:var(--s1);transition:width .55s cubic-bezier(.23,1,.32,1)}
.progresso--pos .progresso__barra i{background:var(--pos)}
.progresso--amb .progresso__barra i{background:var(--amb)}
.progresso--neg .progresso__barra i{background:var(--neg)}

/* --- lista de situação --- */
.situacao{display:flex;flex-direction:column}
.situacao__i{display:flex;align-items:center;gap:12px;padding:10px 2px;border-bottom:1px solid var(--linha);width:100%;text-align:left;color:var(--tinta);min-height:50px}
.situacao__i:last-child{border-bottom:0}
button.situacao__i:hover{background:var(--card-alto);border-radius:10px}
.situacao__ic{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--campo);color:var(--mut);box-shadow:var(--afundado)}
.situacao__ic svg{width:15px;height:15px}
.situacao__ic--pos{background:var(--pos-bg);color:var(--pos);box-shadow:none}
.situacao__ic--amb{background:var(--amb-bg);color:var(--amb);box-shadow:none}
.situacao__ic--neg{background:var(--neg-bg);color:var(--neg);box-shadow:none}
.situacao__ic--inf{background:var(--inf-bg);color:var(--inf);box-shadow:none}
.situacao__ic--manga{background:var(--manga-bg);color:var(--manga);box-shadow:none}
.situacao__c{flex:1;min-width:0}
.situacao__t{font:500 13.5px/1.3 var(--sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.situacao__s{font-size:12px;color:var(--mut);margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.situacao--quebra .situacao__t,.situacao--quebra .situacao__s{white-space:normal}
.situacao__m{font:600 12px/1 var(--num);color:var(--mut);flex:none;display:flex;align-items:center;gap:4px;white-space:nowrap;font-variant-numeric:tabular-nums}
.situacao__m svg{width:13px;height:13px}

/* --- mapa (Leaflet) --- */
.mapa{width:100%;min-height:320px;border-radius:var(--raio-p);overflow:hidden;background:var(--campo);box-shadow:var(--afundado);position:relative;z-index:0}
.mapa--alto{min-height:460px}
.mapa .leaflet-container{width:100%;height:100%;min-height:inherit;background:var(--campo);font-family:var(--sans)}
.mapa__estado{position:absolute;inset:0;display:grid;place-items:center;color:var(--mut);font-size:13px;z-index:1;text-align:center;padding:16px}
.mapa .leaflet-control-attribution{font-size:9px;background:var(--card);color:var(--mut)}
.mapa .leaflet-control-attribution a{color:var(--mut)}
.mapa .leaflet-bar a{background:var(--card);color:var(--tinta);border-color:var(--linha-forte)}
.mapa .leaflet-control-layers{background:var(--card);color:var(--tinta);border:1px solid var(--linha-forte);border-radius:10px}

/* --- linha do tempo das fases --- */
.tempo{display:flex;gap:6px;overflow-x:auto;padding:4px 2px 8px;scrollbar-width:thin}
.tempo__f{flex:1;min-width:128px;background:var(--campo);border-radius:var(--raio-p);padding:10px 12px;box-shadow:var(--afundado);position:relative}
.tempo__f--passada{opacity:.6}
.tempo__f--atual{background:var(--manga-bg);box-shadow:none;outline:1.5px solid var(--manga)}
.tempo__n{font:700 9.5px/1 var(--num);color:var(--mut);letter-spacing:.08em}
.tempo__t{font:600 12.5px/1.3 var(--sans);color:var(--tinta);margin-top:4px}
.tempo__f--atual .tempo__t{color:var(--manga)}
.tempo__d{font-size:11px;color:var(--mut);margin-top:3px;white-space:nowrap}

/* --- catálogo de componentes --- */
.catalogo__ex{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.catalogo__nota{font:500 11px/1.3 var(--num);color:var(--mut);letter-spacing:.04em}

/* ===== 13. Cadastro (PROMPT-03): formulário em seções/passos, multi, ficha, extração ===== */
/* --- lista --- */
.cad__topo{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.cad__resumo{font-size:12.5px;color:var(--mut)}

/* --- formulário em seções (PC) --- */
.cad__form{display:flex;flex-direction:column;gap:4px;min-width:0}
.cad__secoes{display:flex;flex-direction:column;gap:18px}
.cad__secao{display:flex;flex-direction:column;gap:10px}
.cad__secao-t{font:600 11px/1.2 var(--sans);letter-spacing:.11em;text-transform:uppercase;color:var(--mut);margin:0;padding-bottom:6px;border-bottom:1px solid var(--linha)}
.cad__grupo{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr))}
.cad__grupo .campo[data-campo="observacao"],.cad__grupo .campo[data-campo="observacoes"],.cad__grupo .campo[data-campo="descricao"],.cad__grupo .campo[data-campo="observacao_tecnica"],.cad__grupo .campo:has(.multi){grid-column:1 / -1}
.cad__rodape{justify-content:flex-end}
.cad__estimativa{color:var(--pos)}
.sheet__corpo .cad__form{padding-bottom:6px}
.campo--acao{align-self:end}

/* --- passo a passo (§4.7: uma decisão por tela no celular) --- */
.passos{display:flex;flex-direction:column;gap:14px;min-height:60dvh}
.passos__cab{display:flex;flex-direction:column;gap:6px}
.passos__n{font:600 10.5px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
.passos__t{font:600 18px/1.2 var(--disp);color:var(--tinta)}
.passos__pontos{display:flex;gap:5px;margin-top:4px}
.passos__pontos i{flex:1;height:4px;border-radius:2px;background:var(--campo)}
.passos__pontos i.on{background:var(--neon)}
html[data-tema="claro"] .passos__pontos i.on{background:var(--teal)}
.passos__corpo{flex:1}
.passos__passo{display:flex;flex-direction:column;gap:12px}
.passos__passo .cad__grupo{grid-template-columns:1fr}
.passos__passo .ctrl{min-height:52px;font-size:16px}
.passos__pe{position:sticky;bottom:0;display:flex;gap:10px;padding:12px 0 4px;background:var(--fundo);border-top:1px solid var(--linha)}
.passos__pe .btn{flex:1;min-height:var(--tap-g,54px)}

/* --- campo multi (lista de marcação com busca) --- */
.multi{background:var(--campo);border-radius:var(--raio-p);box-shadow:var(--afundado);padding:8px}
.multi__topo{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.multi__topo .ctrl{min-height:34px;font-size:13px;flex:1;box-shadow:none;background:var(--card)}
.multi__n{font-size:11.5px;color:var(--mut);white-space:nowrap}
.multi__lista{max-height:220px;overflow:auto;display:grid;gap:2px;grid-template-columns:repeat(auto-fill,minmax(min(180px,100%),1fr))}
.multi__item{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:8px;font-size:13.5px;color:var(--tinta);cursor:pointer;min-height:36px}
.multi__item:hover{background:var(--card-alto)}
.multi__item input{width:18px;height:18px;accent-color:var(--neon);flex:none}
html[data-tema="claro"] .multi__item input{accent-color:var(--teal)}

/* --- ficha viva (válvula / safra) no topo do formulário --- */
.ficha{display:flex;flex-direction:column;gap:12px;margin-bottom:6px}
.ficha-detalhe{margin-bottom:8px}
.ficha-detalhe summary{cursor:pointer;font:600 12.5px/1.3 var(--sans);color:var(--tinta-2);padding:8px 0;list-style:none;display:flex;align-items:center;gap:6px;min-height:36px}
.ficha-detalhe summary::-webkit-details-marker{display:none}
.ficha-detalhe summary::before{content:'';width:7px;height:7px;border-right:2px solid var(--mut);border-bottom:2px solid var(--mut);transform:rotate(-45deg);transition:transform .15s;flex:none}
.ficha-detalhe[open] summary::before{transform:rotate(45deg)}
.ficha-detalhe[open] summary{margin-bottom:6px}
.tiles--compacto{gap:10px}
.tiles--compacto .tile{padding:10px 12px}
.ficha__linha{display:flex;gap:14px;flex-wrap:wrap;font-size:12.5px;color:var(--mut)}
.ficha__linha span{display:inline-flex;align-items:center;gap:5px}
.ficha__linha svg{width:14px;height:14px}
.safra-valvulas{display:flex;flex-direction:column;gap:8px}
.safra-valvula{background:var(--campo);border-radius:var(--raio-p);box-shadow:var(--afundado);padding:4px 12px}
.safra-valvula summary{display:flex;align-items:center;gap:8px;cursor:pointer;min-height:44px;list-style:none;font-size:13.5px}
.safra-valvula summary::-webkit-details-marker{display:none}
.safra-valvula summary .mut{color:var(--mut);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.safra-valvula__fase{font:600 11px/1 var(--sans);color:var(--manga);background:var(--manga-bg);padding:5px 8px;border-radius:7px;white-space:nowrap}
.safra-valvula__edicao{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(160px,100%),1fr));padding:8px 0 12px}
.safra-valvula .tempo{padding-bottom:12px}

/* --- extração (§16) --- */
.extrair__zona{display:flex;flex-direction:column;align-items:center;gap:6px;padding:26px 16px;border:2px dashed var(--linha-forte);border-radius:var(--raio);background:var(--campo);cursor:pointer;text-align:center;color:var(--tinta);transition:border-color .15s,background .15s}
.extrair__zona:hover,.extrair__zona.on{border-color:var(--neon);background:var(--card-alto)}
html[data-tema="claro"] .extrair__zona:hover,html[data-tema="claro"] .extrair__zona.on{border-color:var(--teal)}
.extrair__zona.ocupado{opacity:.6;pointer-events:none}
.extrair__zona svg{width:28px;height:28px;color:var(--mut)}
.extrair__zona input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.extrair__t{font:600 14px/1.3 var(--disp)}
.extrair__s{font-size:12px;color:var(--mut)}
.extrair__estado{font-size:13px;color:var(--tinta-2);min-height:18px}
.extrair__resultado{display:flex;flex-direction:column;gap:10px}
.campo--conf-alta .ctrl{box-shadow:var(--afundado),0 0 0 2px var(--pos-bg);background:var(--pos-bg)}
.campo--conf-baixa .ctrl{box-shadow:var(--afundado),0 0 0 2px var(--amb-bg);background:var(--amb-bg)}
.campo__conf{font-size:11px;margin-top:4px;color:var(--mut)}
.campo--conf-alta .campo__conf{color:var(--pos)}
.campo--conf-baixa .campo__conf{color:var(--amb)}

/* ===== 14. Mapa da Fazenda e dashboard da válvula (PROMPT-04, §11) ===== */
.g-5{grid-column:span 5}.g-7{grid-column:span 7}
@media(max-width:1279px){.g-5{grid-column:span 6}.g-7{grid-column:span 6}}
@media(max-width:900px){.g-5,.g-7{grid-column:span 12}}
.mapa-topo{margin-bottom:10px;overflow-x:auto;padding-bottom:2px}
.mapa-topo .segmento{white-space:nowrap}
.mapa-quadro{position:relative;min-width:0}
.mapa-quadro .mapa{min-height:440px}
@media(max-width:640px){.mapa-quadro .mapa{min-height:320px}}
.mapa__tooltip{background:var(--card);color:var(--tinta);border:1px solid var(--linha-forte);border-radius:8px;font:600 11.5px var(--sans);padding:4px 8px;box-shadow:0 4px 14px rgba(0,0,0,.35)}
.mapa-painel{position:absolute;z-index:500;top:10px;left:10px;width:min(300px,calc(100% - 20px));background:var(--card);border-radius:var(--raio);box-shadow:var(--relevo);padding:12px 14px;display:flex;flex-direction:column;gap:10px}
@media(max-width:640px){.mapa-painel{position:static;width:100%;margin-top:10px;box-shadow:var(--afundado);background:var(--campo)}}
.mapa-painel__cab{display:flex;align-items:flex-start;gap:8px}
.mapa-painel__cab > div{flex:1;min-width:0}
.mapa-painel__t{font:600 15px/1.2 var(--disp);color:var(--tinta)}
.mapa-painel__s{font-size:12px;color:var(--mut);margin-top:2px}
.mapa-painel__lista{display:flex;flex-direction:column;gap:5px}
.mapa-painel__linha{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;color:var(--mut)}
.mapa-painel__linha b{color:var(--tinta);font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.mapa-painel__linha b.manga{color:var(--manga)}
.mapa-legenda{margin-top:10px}
.legenda{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--mut)}
.legenda__i{display:inline-flex;align-items:center;gap:6px}
.legenda__i i{width:12px;height:12px;border-radius:3px;display:inline-block;flex:none}
.mapa-desenho{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;background:var(--manga-bg);color:var(--tinta);border-radius:var(--raio-p);padding:10px 12px;margin-bottom:10px;font-size:13px}
.leaflet-draw-tooltip{background:var(--card);color:var(--tinta);border:1px solid var(--linha-forte);border-radius:8px;font-family:var(--sans)}

/* --- clima --- */
.clima__hoje{display:flex;align-items:center;gap:14px;margin-bottom:10px}
.clima__temp{font-family:var(--num);font-size:42px;font-weight:600;letter-spacing:-.04em;line-height:1;color:var(--tinta)}
.clima__txt{font:600 14px/1.2 var(--disp);color:var(--tinta)}
.clima__sub{font-size:12px;color:var(--mut);margin-top:3px}
.clima__dias{display:grid;grid-template-columns:repeat(8,1fr);gap:4px;margin-top:10px}
.clima__dia{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px;border-radius:10px;background:var(--campo);box-shadow:var(--afundado);font-size:11px;color:var(--mut);min-width:0}
.clima__dia--hoje{background:var(--manga-bg);box-shadow:none;outline:1px solid var(--manga)}
.clima__d{font-weight:600;text-transform:uppercase;font-size:9.5px;letter-spacing:.06em}
.clima__mx{font-family:var(--num);font-weight:600;color:var(--tinta);font-size:13px}
.clima__mn{font-family:var(--num);font-size:11px}
.clima__ch{font-family:var(--num);font-size:10px}
.clima__ch.on{color:var(--inf);font-weight:600}
@media(max-width:480px){.clima__dias{grid-template-columns:repeat(4,1fr)}}
.clima__rodape{font-size:11px;color:var(--mut);margin-top:8px}

/* --- DRE --- */
.dre__total{font-weight:700;color:var(--tinta)}
.dre__sub{color:var(--mut);padding-left:12px}
.dre__pos{color:var(--pos)}
.dre__neg{color:var(--neg)}

/* ===== 15. Caderno de Campo (PROMPT-05-A, §9): pulverização, apontamentos, Hoje ===== */
/* --- selo "preenchido automaticamente" (§9.1) e ficha viva da válvula --- */
.selo-auto{display:inline-block;margin-left:6px;padding:2px 7px;border-radius:var(--raio-pill);font:600 9.5px/1.3 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--neon);background:var(--card-alto);vertical-align:middle;white-space:nowrap}
html[data-tema="claro"] .selo-auto{color:var(--teal);background:var(--campo)}
.ficha-auto{background:var(--campo);border-radius:var(--raio-p);box-shadow:var(--afundado);padding:10px 12px;display:flex;flex-direction:column;gap:8px}
.ficha-auto:empty{display:none}
.ficha-auto__cab{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13.5px;color:var(--tinta)}
/* --- semáforo da janela de pulverização: cor + motivo escrito --- */
.semaforo{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--raio-p);background:var(--card-alto);color:var(--tinta)}
.semaforo__ic{width:36px;height:36px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--campo);box-shadow:var(--relevo-p)}
.semaforo__ic svg{width:18px;height:18px}
.semaforo--ok .semaforo__ic{color:var(--pos)}.semaforo--ok{background:var(--pos-bg)}
.semaforo--amb .semaforo__ic{color:var(--amb)}.semaforo--amb{background:var(--amb-bg)}
.semaforo--vazio .semaforo__ic{color:var(--mut)}
.semaforo__t{font:600 14px/1.3 var(--sans)}
.semaforo__s{font-size:12.5px;color:var(--tinta-2);margin-top:2px;line-height:1.4}
.clima-auto:empty{display:none}
/* --- painéis laterais: recomendações da fase, sugestões por alvo --- */
.painel-lateral{display:flex;flex-direction:column;gap:8px;background:var(--campo);border-radius:var(--raio-p);box-shadow:var(--afundado);padding:12px}
.painel-lateral:empty{display:none}
.painel-lateral__t{display:flex;align-items:center;gap:8px;font:600 12.5px/1.3 var(--sans);color:var(--tinta-2)}
.painel-lateral__t svg{width:16px;height:16px;color:var(--manga)}
.rec{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:var(--card);box-shadow:var(--relevo-p)}
.rec--falta{outline:1px solid var(--neg-bg)}
.rec__c{flex:1;min-width:0}
.rec__t{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font:600 13.5px/1.3 var(--sans);color:var(--tinta)}
.rec__s{font-size:12.5px;color:var(--mut);margin-top:2px;line-height:1.4}
.rec__o{font-size:12px;color:var(--tinta-2);margin-top:3px;line-height:1.4}
.rec__o--ok{color:var(--pos)}.rec__o--falta{color:var(--neg)}
.rec .btn{flex:none}
/* --- linhas de produto da calda --- */
.calda{display:flex;flex-direction:column;gap:10px}
.calda__linhas{display:flex;flex-direction:column;gap:8px}
.calda__linhas:empty::before{content:'Nenhum produto ainda, use "usar" numa recomendação ou "Adicionar produto".';font-size:12.5px;color:var(--mut)}
.calda__linha{background:var(--campo);border-radius:var(--raio-p);box-shadow:var(--afundado);padding:10px 12px;display:flex;flex-direction:column;gap:8px}
.calda__linha--auto{outline:1px solid var(--linha-forte)}
.calda__campos{display:grid;gap:8px;grid-template-columns:minmax(0,2.2fr) minmax(88px,.8fr) minmax(110px,.9fr) minmax(110px,1fr)}
@media(max-width:640px){.calda__campos{grid-template-columns:1fr 1fr}.calda__campos select:first-child{grid-column:1/-1}}
.calda__rodape{display:flex;align-items:center;justify-content:space-between;gap:8px}
.calda__info{font-size:12px;color:var(--mut);line-height:1.4;min-width:0}
.calda__info .pos{color:var(--pos)}.calda__info .neg{color:var(--neg)}
.calda__estoque:empty{display:none}
.calda__total{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 12px;align-items:center;padding:10px 12px;border-radius:12px;background:var(--pos-bg);color:var(--tinta);font-size:13px}
.calda__total--falta{background:var(--neg-bg)}
.calda__total span{display:inline-flex;align-items:center;gap:6px}
.calda__total svg{width:16px;height:16px;flex:none}
.calda__total b{font-family:var(--num);min-width:0;overflow-wrap:anywhere}
/* --- formulário: resumo em linhas, rodapé --- */
.pulv{display:flex;flex-direction:column;gap:14px}
.pulv__grade{display:grid;gap:18px;grid-template-columns:minmax(0,1fr)}
@media(min-width:1024px){.pulv__grade{grid-template-columns:minmax(0,1fr) 340px;align-items:start}.pulv__lado{position:sticky;top:76px}}
.pulv__lado{display:flex;flex-direction:column;gap:12px;min-width:0}
.pulv__lado:empty{display:none}
.pulv__lado .card{box-shadow:var(--relevo-p)}
.pulv__rodape{justify-content:flex-end;padding-top:4px}
.pulv__avisos:empty,.pulv__resumo:empty{display:none}
/* par rótulo - valor (".linha" já é do login - colisão evitada) */
.duplas{display:flex;flex-direction:column}
.dupla{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--linha);font-size:13.5px}
.dupla:last-child{border-bottom:0}
.dupla__r{color:var(--mut);flex:none;max-width:45%}
.dupla__v{color:var(--tinta);text-align:right;min-width:0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.dupla__v--forte{font-weight:700;font-family:var(--num)}
.detalhe__cab{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.detalhe__cab .h2{display:flex;align-items:center;gap:8px}
.detalhe__cab .h2 svg{width:20px;height:20px;color:var(--manga)}
.mut{color:var(--mut);font-size:12.5px}
/* --- agenda das OS emitidas --- */
.agenda{display:flex;flex-direction:column;gap:10px}
.agenda__dia{display:grid;grid-template-columns:78px 1fr;gap:10px;align-items:start}
.agenda__data{display:flex;flex-direction:column;font-family:var(--num);font-size:13px;color:var(--tinta)}
.agenda__data span{font-family:var(--sans);font-size:11px;color:var(--mut)}
.agenda__dia--atrasado .agenda__data b{color:var(--amb)}
.agenda__itens{display:flex;flex-direction:column;gap:6px;min-width:0}
.agenda__item{display:flex;flex-direction:column;gap:2px;text-align:left;width:100%;padding:8px 10px;border-radius:10px;background:var(--campo);box-shadow:var(--afundado);color:var(--tinta);font-size:12.5px;min-height:var(--tap)}
.agenda__item b{font-weight:600}
.agenda__item span{color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.agenda__item:hover{background:var(--card-alto)}
/* --- os 13 tratos --- */
.tratos{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(min(150px,100%),1fr))}
.tratos--escolha{grid-template-columns:repeat(auto-fill,minmax(min(200px,100%),1fr))}
.trato{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;padding:12px;border-radius:14px;background:var(--card);box-shadow:var(--relevo-p);color:var(--tinta);min-height:var(--tap-g,54px);transition:transform .12s,box-shadow .14s}
.trato:hover{transform:translateY(-1px);box-shadow:var(--relevo)}
.trato:active{box-shadow:var(--afundado);transform:none}
.trato--vazio{opacity:.75}
.trato__ic{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--campo);color:var(--neon);box-shadow:var(--relevo-p);flex:none}
html[data-tema="claro"] .trato__ic{color:var(--teal)}
.trato__ic svg{width:17px;height:17px}
.trato__t{font:600 13px/1.25 var(--sans)}
.trato__v{font-family:var(--num);font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}
.trato__s{font-size:11.5px;color:var(--mut);line-height:1.35}
.apont__trato{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--raio-p);background:var(--campo);box-shadow:var(--afundado);font-size:13.5px}
.apont__trato > div{flex:1;min-width:0}
.apont__total{background:var(--card-alto);border-radius:var(--raio-p);padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.apont__total:empty{display:none}
.apont__total-v{display:flex;flex-direction:column;gap:2px}
.apont__total-v small{font:700 9.5px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
.apont__total-v b{font-family:var(--num);font-size:26px;font-weight:600;letter-spacing:-.02em;color:var(--tinta)}
.apont__total .neg{color:var(--neg);font-size:12.5px}
/* --- Hoje --- */
.clima__agora{display:flex;align-items:center;gap:14px;margin-bottom:10px}
.pilha--fina{gap:8px}
.ficha-dia{display:flex;flex-direction:column;gap:12px;margin-top:12px;padding-top:12px;border-top:1px solid var(--linha)}
.card--ancora .ancora{padding:4px 2px}

/* ===== 16. Caderno de Campo (PROMPT-05-B, §9.5-9.7): monitoramento, laudos, irrigação ===== */
/* --- linhas de alvo do monitoramento (mesma base das linhas da calda) --- */
.alvos__linhas{display:flex;flex-direction:column;gap:8px}
.alvos__linhas:empty::before{content:'Nenhum alvo ainda, use "Adicionar alvo".';font-size:12.5px;color:var(--mut)}
.alvos__campos{display:grid;gap:8px;grid-template-columns:minmax(0,2.4fr) minmax(96px,.8fr) minmax(96px,.8fr) minmax(110px,.9fr) minmax(110px,.9fr)}
@media(max-width:720px){.alvos__campos{grid-template-columns:1fr 1fr}.alvos__campos select:first-child{grid-column:1/-1}}
.alvos__linha--acima{outline:1px solid var(--neg)}
.ctrl--auto{color:var(--tinta-2)}
/* --- radar de nutrientes: etiquetas por nutriente sob o gráfico --- */
.radar{display:flex;flex-direction:column;gap:10px}
.radar__tags{display:flex;flex-wrap:wrap;gap:6px}
/* --- formulário do laudo: um campo por nutriente --- */
.laudo__cab{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.laudo__cab .cad__secao-t{margin:0}
.laudo__grade{display:grid;gap:10px 14px;grid-template-columns:repeat(auto-fill,minmax(min(180px,100%),1fr))}
.laudo__grade .campo{min-width:0}
/* --- horas por bomba: a maior em manga (mesma leitura dos tratos) --- */
.progresso--manga .progresso__barra i{background:var(--manga)}

/* ===== 17. Calculadora Vero (PROMPT-06, §10): perguntas por trato, saídas com fórmula ===== */
.calc__perguntas{display:flex;flex-direction:column;gap:12px}
.calc__perguntas:empty::before{content:'Escolha o trato cultural para ver as perguntas.';font-size:12.5px;color:var(--mut)}
.calc__saidas{display:flex;flex-direction:column;gap:12px;min-width:0}
.calc__ancora{background:var(--card-alto);border-radius:var(--raio-p);padding:12px 14px}
.calc__ancora .ancora__s{white-space:normal;line-height:1.4}
.calc__tiles{grid-template-columns:repeat(auto-fit,minmax(min(128px,100%),1fr))}
.calc__saida{display:flex;flex-direction:column;gap:4px;min-width:0}
.calc__saida .tile{cursor:pointer}
.calc__duas{display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
@media(min-width:1024px){.pulv__grade .calc__duas{grid-template-columns:minmax(0,1fr)}}
@media(min-width:768px) and (max-width:1023px){.calc__duas{grid-template-columns:1fr 1fr}}
/* memória de cálculo: sempre em texto (nunca só um número), monoespaçada e quebrável */
.formula{font:12px/1.4 var(--num);color:var(--tinta-2);background:var(--campo);border-radius:8px;padding:6px 8px;overflow-wrap:anywhere;text-align:left}
.dupla__v .formula{margin-top:4px}
.calc__acoes{flex-wrap:wrap}
.trato--on{outline:2px solid var(--neon);outline-offset:-2px}
html[data-tema="claro"] .trato--on{outline-color:var(--teal)}

/* ===== 18. Gestão Agrícola (PROMPT-07, §12): inventário, itens do pedido, recebimento ===== */
/* --- quatro tiles ao lado da âncora (2 x 2 em vez de 3 + 1 órfão); lista de alertas com rolagem própria --- */
.tiles--duas{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:480px){.tiles--duas{grid-template-columns:minmax(0,1fr)}}
.rolagem{max-height:min(62vh,640px);overflow:auto;overscroll-behavior:contain}
/* --- inventário: uma linha por produto, contagem ao lado do saldo do sistema --- */
.inv__linhas{display:flex;flex-direction:column;gap:6px;max-height:min(52vh,480px);overflow:auto;padding-right:2px}
.inv__linha{display:grid;gap:8px;align-items:center;grid-template-columns:minmax(0,1fr) minmax(96px,120px) minmax(72px,auto);background:var(--campo);border-radius:var(--raio-p);padding:8px 10px}
.inv__prod{display:flex;flex-direction:column;min-width:0}
.inv__prod b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.inv__prod .mut{font-size:12px}
.inv__dif{font:12px var(--num);text-align:right;color:var(--mut)}
.inv__dif.pos{color:var(--pos)}.inv__dif.neg{color:var(--neg)}
/* celular: o nome ocupa a linha inteira; contagem e diferença na linha de baixo */
@media(max-width:480px){.inv__linha{grid-template-columns:minmax(0,1fr) minmax(96px,120px)}.inv__prod{grid-column:1/-1}.inv__linha input{grid-column:2;grid-row:2}.inv__dif{grid-column:1;grid-row:2;text-align:left}}
/* --- itens do pedido e do recebimento (mesma base das linhas da calda) --- */
.compra__campos{display:grid;gap:8px;grid-template-columns:minmax(0,2fr) minmax(0,1.4fr) minmax(90px,.7fr) minmax(100px,.8fr)}
.receb__campos{display:grid;gap:8px;grid-template-columns:minmax(90px,1fr) minmax(100px,1fr) minmax(130px,1fr)}
@media(max-width:640px){.compra__campos{grid-template-columns:1fr 1fr}.compra__campos select:first-child,.compra__campos input:nth-child(2){grid-column:1/-1}.receb__campos{grid-template-columns:1fr 1fr}.receb__campos input:last-child{grid-column:1/-1}}

/* ===== 19. Financeiro e Packhouse (PROMPT-08, §13): linhas da venda/expedição e da classificação ===== */
.venda__campos{display:grid;gap:8px;grid-template-columns:minmax(0,1.4fr) minmax(90px,.8fr) minmax(100px,.8fr)}
.venda__itens{display:grid;gap:8px;grid-template-columns:minmax(0,2fr) minmax(90px,.7fr)}
.recep__campos{display:grid;gap:8px;grid-template-columns:minmax(0,1.2fr) minmax(90px,.8fr) minmax(100px,.8fr) minmax(0,1.4fr)}
.recep__campos [hidden]{display:none}
@media(max-width:640px){.venda__campos,.recep__campos{grid-template-columns:1fr 1fr}.venda__campos select:first-child,.recep__campos select:first-child,.recep__campos input:last-child{grid-column:1/-1}}

/* ===== 20. Relatórios (PROMPT-09, §14): lista por categoria, cabeçalho do relatório, totais e paginação ===== */
/* --- lista de relatórios dentro do cartão da categoria: um botão por relatório (pergunta como chamada) --- */
.rel__lista{display:flex;flex-direction:column;gap:8px}
.rel__item{
  display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;padding:10px 12px;border-radius:12px;background:var(--campo);color:var(--tinta);
  border:1px solid transparent;transition:transform .14s,border-color .2s;
}
.rel__item:hover{transform:translateY(-1px);border-color:var(--neon)}
html[data-tema="claro"] .rel__item:hover{border-color:var(--teal)}
.rel__item--bloq{opacity:.6;cursor:not-allowed}
.rel__nome{display:flex;align-items:center;gap:6px;font:600 13.5px/1.3 var(--sans)}
.rel__nome svg{width:16px;height:16px;color:var(--neon);flex:none}
html[data-tema="claro"] .rel__nome svg{color:var(--teal)}
.rel__pergunta{font-size:12.5px;color:var(--mut);line-height:1.4}
.rel__bloq{font-size:11.5px;color:var(--amb)}
/* --- cabeçalho do relatório aberto: filtros aplicados + descrição --- */
.rel__cab{display:flex;flex-direction:column;gap:4px}
.rel__desc{font-size:12.5px;color:var(--mut);line-height:1.5;max-width:960px}
/* --- totais sob a tabela e paginação --- */
.rel__totais{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;color:var(--tinta);padding:4px 2px}
.rel__totais b{font-family:var(--num)}
.rel__totais-r{color:var(--mut)}
.rel__pager{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}
.rel__pager-t{font-size:12.5px;color:var(--mut)}

/* ===== 21. Busca global, sino e Configurações (PROMPT-10, §15 e §17) ===== */
/* --- painel da busca: ancorado sob o campo do topo (PC) ou dentro do sheet (celular) --- */
.busca__painel{
  position:absolute;left:0;top:calc(100% + 8px);z-index:40;width:min(640px,calc(100vw - 32px));max-height:min(70vh,640px);overflow:auto;overscroll-behavior:contain;
  background:var(--card-alto);border:1px solid var(--linha);border-radius:14px;box-shadow:var(--relevo);padding:8px;display:flex;flex-direction:column;gap:4px;
}
.busca__painel--sheet{position:static;width:100%;max-height:none;overflow:visible;box-shadow:none;border:0;padding:0;background:transparent}
.busca__cab{font:700 10px/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--mut);padding:8px 10px 4px}
.busca__grupo{display:flex;flex-direction:column;gap:2px}
.busca__item{
  display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:8px 10px;border-radius:10px;color:var(--tinta);min-height:44px;
  border:1px solid transparent;
}
.busca__item:hover,.busca__item--sel{background:var(--card);border-color:var(--linha)}
.busca__item--sel{outline:2px solid var(--neon);outline-offset:-2px}
html[data-tema="claro"] .busca__item--sel{outline-color:var(--teal)}
.busca__ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:none;background:var(--campo);color:var(--mut)}
.busca__ic svg{width:15px;height:15px}
.busca__t{display:flex;flex-direction:column;min-width:0;gap:1px}
.busca__t b{font:500 13.5px/1.3 var(--sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.busca__t span{font-size:12px;color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.busca__pe{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:8px 10px 4px;border-top:1px solid var(--linha);font-size:11.5px;color:var(--mut);margin-top:4px}
.busca__pe kbd{font:600 10px/1 var(--num);border:1px solid var(--linha-forte);border-radius:5px;padding:3px 5px;color:var(--tinta-2)}
.busca__painel .vazio{padding:20px 10px}
/* a lupa do topo só existe onde o campo de busca não cabe (celular/tablet) */
#vmLupa{display:none}
@media(max-width:1023px){#vmLupa{display:grid}}
/* no celular estreito o tema fica só no "Mais" - sobra lugar para a lupa e o sino */
@media(max-width:479px){#vmTema{display:none}}

/* --- sino: painel sob o botão, alinhado à direita --- */
.topo__direita{position:relative}
.sino__painel{
  position:absolute;right:0;top:calc(100% + 8px);z-index:40;width:min(440px,calc(100vw - 28px));max-height:min(72vh,640px);overflow:auto;overscroll-behavior:contain;
  background:var(--card-alto);border:1px solid var(--linha);border-radius:14px;box-shadow:var(--relevo);padding:10px;display:flex;flex-direction:column;gap:8px;
}
.sino__cab{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:2px 4px}
.sino__cab b{font:600 13.5px/1.2 var(--sans);color:var(--tinta)}
.sino__pe{display:flex;justify-content:flex-end;padding-top:6px;border-top:1px solid var(--linha)}

/* --- itens de alerta (tela #/alertas e sino): ícone por gravidade, tags, ações --- */
.alerta-lista{display:flex;flex-direction:column;gap:8px}
.alerta-item{
  display:grid;gap:10px;grid-template-columns:auto minmax(0,1fr);align-items:start;padding:10px 12px;border-radius:12px;background:var(--campo);
  border-left:3px solid var(--linha-forte);
}
.alerta-item--neg{border-left-color:var(--neg)}.alerta-item--amb{border-left-color:var(--amb)}.alerta-item--inf{border-left-color:var(--inf)}
.alerta-item--novo{background:var(--card)}
.alerta-item__ic{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--card-alto);color:var(--mut);flex:none;margin-top:2px}
.alerta-item__ic svg{width:15px;height:15px}
.alerta-item--neg .alerta-item__ic{background:var(--neg-bg);color:var(--neg)}.alerta-item--amb .alerta-item__ic{background:var(--amb-bg);color:var(--amb)}.alerta-item--inf .alerta-item__ic{background:var(--inf-bg);color:var(--inf)}
.alerta-item__c{min-width:0;display:flex;flex-direction:column;gap:3px}
.alerta-item__t{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.alerta-item__t b{font:500 13.5px/1.3 var(--sans);color:var(--tinta)}
.alerta-item--novo .alerta-item__t b{font-weight:600}
.alerta-item__m{font-size:12.5px;color:var(--tinta-2);line-height:1.45;overflow-wrap:anywhere}
.alerta-item__s{font:12px/1.3 var(--num);color:var(--mut)}
.alerta-item__acoes{grid-column:2;display:flex;flex-wrap:wrap;gap:6px}
.alerta-lista--sino .alerta-item{padding:8px 10px;gap:8px}
.alerta-lista--sino .alerta-item__m{display:none}
@media(min-width:768px){.alerta-item{grid-template-columns:auto minmax(0,1fr) auto}.alerta-item__acoes{grid-column:auto;justify-content:flex-end;max-width:280px}.alerta-lista--sino .alerta-item{grid-template-columns:auto minmax(0,1fr)}.alerta-lista--sino .alerta-item__acoes{grid-column:2;justify-content:flex-start}}

/* --- Configurações: matriz de permissões - um grupo (módulo do legado) por <details>, uma linha por tela, 3 colunas de ação --- */
.perm__matriz{display:flex;flex-direction:column;gap:10px}
.perm__grupo{border:1px solid var(--linha);border-radius:12px;background:var(--campo);min-width:0}
.perm__grupo summary{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;cursor:pointer;list-style:none;min-height:44px}
.perm__grupo summary::-webkit-details-marker{display:none}
.perm__grupo summary::before{content:"";width:8px;height:8px;border-right:1.75px solid var(--mut);border-bottom:1.75px solid var(--mut);transform:rotate(-45deg);margin:0 4px 0 2px;transition:transform .16s}
.perm__grupo[open] summary::before{transform:rotate(45deg)}
.perm__grupo summary b{font:600 13px/1.2 var(--sans);color:var(--tinta)}
.perm__modulo{margin-left:auto}
.perm__todos{display:inline-flex;align-items:center;gap:5px;font:500 11.5px/1 var(--sans);color:var(--mut);cursor:pointer;justify-content:center}
.perm__tabela{display:flex;flex-direction:column;padding:0 8px 8px}
.perm__linha{display:grid;grid-template-columns:minmax(0,1fr) 84px 84px 84px;align-items:center;gap:4px;min-height:32px;padding:0 4px;border-top:1px solid var(--linha)}
.perm__linha--cab{border-top:0;font:700 10px/1.2 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--mut);min-height:28px}
.perm__linha input,.perm__todos input{accent-color:var(--neon);width:16px;height:16px;flex:none;margin:0;justify-self:center}
html[data-tema="claro"] .perm__linha input,html[data-tema="claro"] .perm__todos input{accent-color:var(--teal)}
.perm__tela{font-size:12.5px;color:var(--tinta-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.perm__sem{color:var(--mut);text-align:center;font-size:12px}
.perm__n{font:600 12px/1 var(--num);color:var(--mut);white-space:nowrap}
@media(max-width:480px){.perm__linha{grid-template-columns:minmax(0,1fr) 44px 44px 44px}.perm__todos span{font-size:10.5px}}
/* --- marca: prévia do topo da sidebar --- */
.marca__previa{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:18px 20px 14px;background:var(--menu);border-radius:12px}
.marca__previa img{width:118px;height:auto}
.marca__previa .descritor{font:600 11px/1 var(--disp);letter-spacing:.22em;text-transform:uppercase;color:var(--neon)}
/* --- regras de alerta, exportação, auditoria --- */
.regra__cab{display:flex;flex-wrap:wrap;gap:6px}
.exp__lista{margin:0;padding-left:18px;font-size:13px;color:var(--tinta-2);line-height:1.6}
.cfg__log{margin:0;font:11.5px/1.5 var(--num);color:var(--tinta-2);background:var(--campo);border-radius:10px;padding:10px 12px;max-height:320px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere}

