/* ======================================================================
   FERRAMENTAS — a aba das ferramentas que a pessoa criou com o MENTRE.
   Mesma linguagem dos paineis (lamina, fio dourado, titulo em serifa).
   ====================================================================== */
#ferramentas{max-width:880px;margin:0 auto}
#ferramentas h3{margin:0}
.ferr-cab{display:flex;align-items:flex-end;justify-content:space-between;gap:12px 16px;flex-wrap:wrap;margin-bottom:6px}
.ferr-cab h3,.ferr-titulo{font-family:var(--f-titulo);font-weight:400;letter-spacing:-.015em;
    font-size:clamp(2rem,3.4vw,2.7rem);line-height:1.05;
    background:linear-gradient(180deg,#fbf7ee 25%,#d6c29c 120%);-webkit-background-clip:text;background-clip:text;color:transparent}
.ferr-cab .dica,#ferramentas > .dica{max-width:62ch}

.ferr-lista{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-top:8px}
.ferr-cartao,.ferr-cartao-chat{display:flex;align-items:center;gap:14px;text-align:left;width:100%;min-width:0;
    background:var(--lamina);border:1px solid var(--vidro-borda,var(--fio));border-radius:20px;padding:16px 18px;
    color:var(--pergaminho);font-family:var(--f-ui);cursor:pointer;
    box-shadow:var(--vidro-brilho,none),0 24px 60px -40px rgba(0,0,0,.9);
    transition:border-color .3s var(--suave),transform .3s var(--suave)}
.ferr-cartao:hover{border-color:var(--fio-ouro)}
.ferr-cartao:active{transform:scale(.99)}
.ferr-cartao:focus-visible,.ferr-chip:focus-visible,.ferr-x:focus-visible,.ferr-apagar:focus-visible{
    outline:2px solid var(--ouro-claro);outline-offset:2px}
.ferr-icone{flex-shrink:0;display:grid;place-items:center;width:42px;height:42px;border-radius:14px;font-size:1.25rem;
    background:linear-gradient(180deg,rgba(209,171,116,.18),rgba(176,141,87,.05));border:1px solid var(--fio-ouro);
    color:var(--ouro-luz);-webkit-text-fill-color:initial}
.ferr-cartao-txt{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.ferr-cartao-txt b{font-weight:550;font-size:.95rem;overflow-wrap:anywhere}
.ferr-cartao-txt small{color:var(--texto-3);font-size:.8rem;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}

.ferr-vazio{background:var(--lamina);border:1px dashed var(--fio-forte,var(--fio));border-radius:22px;padding:22px}
.ferr-vazio p{margin:0 0 12px;color:var(--texto-2)}
.ferr-ideias{display:flex;flex-wrap:wrap;gap:8px}

/* uma ferramenta aberta */
.ferr-topo{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:6px}
.ferr-titulo{display:flex;align-items:center;gap:12px}
.ferr-titulo .ferr-icone{font-size:1.4rem}
.ferr-voltar{height:34px}

.ferr-resumos{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:12px}
.ferr-resumo{display:flex;flex-direction:column;gap:4px;margin:0;padding:14px 16px}
.ferr-resumo-rot{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--texto-3)}
.ferr-resumo small{color:var(--texto-3);font-size:.76rem}
.ferr-resumo .fin-valor{white-space:normal;overflow-wrap:anywhere}

.ferr-meta{display:flex;flex-direction:column;gap:6px}
.ferr-meta b{font-weight:550;font-variant-numeric:tabular-nums}
.ferr-barra{height:8px;border-radius:99px;background:rgba(236,231,218,.07);overflow:hidden}
.ferr-barra i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#b08d57,#ecca95);
    transition:width .8s var(--suave)}
.ferr-barra.perto i{background:linear-gradient(90deg,#c98a3c,#e8b25e)}
.ferr-barra.estourou i{background:linear-gradient(90deg,#b4533f,#e07a5f)}

.ferr-grafico svg{display:block;width:100%;height:auto}
.ferr-barra-svg{fill:var(--ouro-claro);opacity:.85}
.ferr-linha{fill:none;stroke:var(--ouro-claro);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.ferr-eixo{fill:var(--texto-3);font-size:9px;font-family:var(--f-ui)}

.ferr-form{display:flex;flex-direction:column;gap:12px}
.ferr-form h4,.ferr-registros h4{margin:0;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--texto-3);font-weight:600}
.ferr-campo{display:flex;flex-direction:column;gap:6px;margin:0;text-transform:none;letter-spacing:0}
.ferr-campo > span{font-size:.84rem;color:var(--texto-2)}
.ferr-campo input{width:100%;box-sizing:border-box;min-height:44px;border-radius:12px;padding:10px 12px;font-size:1rem;
    background:rgba(5,8,11,.42);border:1px solid var(--fio-forte,var(--fio));color:var(--pergaminho);font-family:inherit;
    color-scheme:dark}
.ferr-campo input:focus{outline:none;border-color:var(--fio-ouro)}
.ferr-escolhas{display:flex;flex-wrap:wrap;gap:8px}
.ferr-chip{min-height:40px;padding:8px 16px;border-radius:99px;border:1px solid var(--fio-forte,var(--fio));
    background:rgba(236,231,218,.03);color:var(--texto-2);font:inherit;font-size:.88rem;cursor:pointer}
.ferr-chip.marcado{color:var(--pergaminho);border-color:rgba(209,171,116,.5);
    background:linear-gradient(180deg,rgba(209,171,116,.24),rgba(176,141,87,.1))}
.ferr-form .fin-primario{align-self:flex-start;min-width:140px;justify-content:center}

.ferr-registros{display:flex;flex-direction:column;gap:2px}
.ferr-registro{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:10px 0;
    border-top:1px solid var(--fio);font-size:.86rem}
.ferr-registro:first-of-type{border-top:0}
.ferr-registro time{color:var(--texto-3);font-variant-numeric:tabular-nums;font-size:.78rem;white-space:nowrap}
.ferr-registro span{color:var(--texto-2);overflow-wrap:anywhere;min-width:0}
.ferr-x{background:transparent;border:0;color:var(--texto-3);font:inherit;font-size:1.1rem;cursor:pointer;
    min-width:36px;min-height:36px;border-radius:10px}
.ferr-x.confirmar{font-size:.76rem;color:#e07a5f;border:1px solid rgba(224,122,95,.4);padding:0 10px}

.ferr-caixa{display:block;width:100%;height:min(72vh,720px);border:1px solid var(--fio);border-radius:20px;
    background:#0b1016;margin:4px 0 12px}

.ferr-apagar{display:block;margin:18px auto 8px;background:transparent;border:0;color:var(--texto-3);font:inherit;
    font-size:.82rem;cursor:pointer;padding:10px 14px;border-radius:12px;text-decoration:underline;text-underline-offset:3px}
.ferr-apagar.confirmar{color:#e07a5f;text-decoration:none;border:1px solid rgba(224,122,95,.4)}

/* rotinas: o que o MENTRE faz sozinho */
.rot-bloco{margin-top:28px}
.rot-bloco:empty{display:none}
.rot-titulo{margin:0 0 4px;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--texto-3);font-weight:600}
.rot-bloco > .dica{max-width:62ch}
.rot-lista{display:flex;flex-direction:column;background:var(--lamina);border:1px solid var(--vidro-borda,var(--fio));
    border-radius:20px;padding:4px 16px}
.rot-linha{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px;padding:12px 0;border-top:1px solid var(--fio)}
.rot-linha:first-child{border-top:0}
.rot-linha.pausada .rot-txt b{color:var(--texto-3)}
.rot-txt{display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0}
.rot-txt b{font-weight:550;font-size:.92rem;color:var(--pergaminho);overflow-wrap:anywhere}
.rot-txt small{color:var(--texto-3);font-size:.78rem;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.rot-ver{background:transparent;border:0;padding:4px 0;color:var(--ouro-claro);font:inherit;font-size:.78rem;cursor:pointer;
    text-decoration:underline;text-underline-offset:3px}
.rot-switch{background:transparent !important;border:0 !important;padding:0;margin:0}

/* cartao na resposta do chat */
.ferr-cartao-chat{cursor:default;max-width:min(460px,100%);margin:2px 0 14px;padding:12px 14px}
.ferr-cartao-chat .fin-btn{flex-shrink:0}


/* configuracoes: as chaves finas da iniciativa */
.proativo-detalhes{display:flex;flex-direction:column;gap:6px;padding-left:14px;border-left:1px solid var(--fio);margin:4px 0 6px}
.proativo-detalhes.desligado{opacity:.45;pointer-events:none}

@media (max-width:560px){
  .ferr-lista{grid-template-columns:1fr}
  .ferr-caixa{height:70vh;border-radius:16px}
}
@media (prefers-reduced-motion:reduce){
  .ferr-barra i,.ferr-cartao{transition:none}
}
html.sem-animacao .ferr-barra i{transition:none}

/* configuracoes: agenda externa */
.agenda-externa{display:flex;flex-direction:column;gap:8px;margin:4px 0 6px}
.ae-linha{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-radius:14px;
    background:rgba(4,7,10,.35);border:1px solid var(--fio)}
.ae-linha.com-erro{border-color:rgba(224,122,95,.35)}
.ae-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.ae-txt b{font-weight:550;font-size:.88rem;color:var(--pergaminho)}
.ae-txt small{font-size:.76rem;color:var(--texto-3);overflow-wrap:anywhere}
.ae-txt .ae-erro{color:#e07a5f}
.ae-sair{flex-shrink:0;background:transparent;border:1px solid var(--fio-forte,var(--fio));color:var(--texto-2);
    border-radius:10px;padding:7px 12px;font:inherit;font-size:.8rem;cursor:pointer}
.ae-sair.confirmar{color:#e07a5f;border-color:rgba(224,122,95,.45)}
.ae-google{display:flex;align-items:center;justify-content:center;min-height:44px;border-radius:14px;text-decoration:none;
    background:rgba(236,231,218,.04);border:1px solid var(--fio-ouro);color:var(--pergaminho);font-size:.88rem;font-weight:550}
.ae-google:hover{background:rgba(209,171,116,.08)}
.ae-ics{display:flex;gap:8px}
.ae-ics input{flex:1;min-width:0;min-height:44px;border-radius:12px;padding:0 12px;font:inherit;font-size:.86rem;
    background:rgba(5,8,11,.42);border:1px solid var(--fio-forte,var(--fio));color:var(--pergaminho)}
.ae-ics button{flex-shrink:0;min-height:44px;border-radius:12px;padding:0 14px;font:inherit;font-size:.86rem;cursor:pointer;
    background:rgba(236,231,218,.04);border:1px solid var(--fio-forte,var(--fio));color:var(--pergaminho)}
.ae-dica{font-size:.74rem;color:var(--texto-3);line-height:1.4}

/* ------------------------------------------------------------ biblioteca */
.bib-bloco{margin-top:32px}
.bib-busca{display:flex;flex-direction:column;gap:8px;margin:10px 0 12px}
.bib-busca input{background:rgba(4,7,10,.5);border:1px solid var(--fio-forte,rgba(236,231,218,.14));border-radius:12px;color:var(--pergaminho,var(--text));
    font:inherit;font-size:.9rem;padding:10px 14px;width:100%;box-sizing:border-box}
.bib-busca input:focus{outline:none;border-color:var(--ouro,#b08d57);box-shadow:0 0 0 3px rgba(176,141,87,.18)}
.bib-chips{display:flex;flex-wrap:wrap;gap:6px}
.bib-chips .ferr-chip.ativo{border-color:var(--fio-ouro,rgba(209,171,116,.32));color:var(--ouro-luz,#efd6a6);background:rgba(209,171,116,.1)}
.bib-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:12px}
.bib-cartao{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border-radius:18px;background:var(--lamina);border:1px solid var(--vidro-borda,var(--fio));
    box-shadow:var(--relevo-placa,none)}
.bib-cartao.destaque{border-color:var(--fio-ouro,rgba(209,171,116,.32));box-shadow:0 0 0 1px rgba(209,171,116,.25),0 20px 40px -24px rgba(0,0,0,.9)}
.bib-pendente{grid-column:1/-1;display:flex;flex-direction:column;gap:8px}
.bib-pendente > b{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ouro-luz,#efd6a6)}
.bib-cab{display:flex;align-items:center;gap:10px}
.bib-desc{margin:0;font-size:.86rem;line-height:1.5;color:var(--texto-2,var(--text));overflow-wrap:anywhere}
.bib-acoes{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:2px}
.bib-acoes a.fin-btn{text-decoration:none}
.bib-denunciar{margin-left:auto;font-size:.72rem;opacity:.7}
.bib-publicar{margin:14px 0 6px;display:flex;flex-direction:column;gap:8px}
.bib-form{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:14px;background:rgba(4,7,10,.45);border:1px solid var(--fio)}
.bib-form input,.bib-form textarea,.bib-form select{background:rgba(4,7,10,.5);border:1px solid var(--fio-forte,rgba(236,231,218,.14));border-radius:10px;
    color:var(--pergaminho,var(--text));font:inherit;font-size:.88rem;padding:9px 12px;width:100%;box-sizing:border-box}
.bib-form textarea{resize:vertical;line-height:1.5}
.bib-check{display:flex;align-items:center;gap:8px;font-size:.86rem;text-transform:none;letter-spacing:0;color:var(--text)}
.bib-link{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:.84rem}
.bib-link code{font-size:.74rem;background:rgba(4,7,10,.6);border:1px solid var(--fio);border-radius:8px;padding:6px 8px;overflow-wrap:anywhere;-webkit-user-select:all;user-select:all}

/* ------------------------------------------------------------ apps nativos */
.nat-bloco{margin:6px 0 26px}
.nat-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:14px;margin-top:10px}
.nat-cartao{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:left;cursor:pointer;
    padding:18px 18px 20px;border-radius:22px;font:inherit;color:var(--pergaminho,var(--text));min-height:168px;overflow:hidden;
    background:linear-gradient(150deg,rgba(209,171,116,.14),rgba(209,171,116,0) 46%),var(--lamina);
    border:1px solid var(--fio-ouro,rgba(209,171,116,.32));
    box-shadow:var(--relevo-placa,none),0 0 40px -22px rgba(209,171,116,.55);
    transition:transform .45s var(--mola,ease),border-color .3s var(--suave,ease),box-shadow .35s var(--suave,ease)}
.nat-cartao::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;
    background:radial-gradient(120% 80% at 100% 0,rgba(239,214,166,.10),transparent 55%)}
.nat-cartao:hover{transform:translateY(-3px);border-color:rgba(239,214,166,.55);
    box-shadow:var(--relevo-placa,none),0 0 54px -18px rgba(209,171,116,.75)}
.nat-cartao:active{transform:translateY(0) scale(.985)}
.nat-topo{display:flex;align-items:center;justify-content:space-between;width:100%}
.nat-icone{width:46px;height:46px;font-size:1.5rem}
.nat-selo{font-size:.58rem;letter-spacing:.22em;font-weight:600;color:var(--ouro-luz,#efd6a6);
    border:1px solid var(--fio-ouro,rgba(209,171,116,.32));border-radius:999px;padding:4px 9px 3px}
.nat-cartao b{font-family:var(--f-titulo,Georgia,serif);font-weight:400;font-size:1.28rem;letter-spacing:-.01em;line-height:1.15}
.nat-cartao small{font-size:.8rem;line-height:1.5;color:var(--texto-2,#a9b4ae)}
.nat-suas{margin-top:4px}
.ferr-caixa-barra{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.ferr-caixa-barra .dica{margin:0;flex:1 1 240px}
/* Tela cheia do mini-app: a caixa ocupa o app inteiro; so a barra com o botao de sair fica por cima. */
html.ferr-tela-cheia #ferramentas .ferr-caixa{position:fixed;inset:0;z-index:200;width:100vw;height:100dvh;border-radius:0;border:0}
html.ferr-tela-cheia #ferramentas .ferr-cheia{position:fixed;z-index:201;right:calc(12px + env(safe-area-inset-right));
    bottom:calc(14px + env(safe-area-inset-bottom));background:rgba(8,12,17,.86);border-color:var(--fio-ouro,rgba(209,171,116,.32));
    box-shadow:0 12px 30px -10px rgba(0,0,0,.9)}
html.ferr-tela-cheia header,html.ferr-tela-cheia footer{visibility:hidden}
@media (max-width:640px){ .nat-grade{grid-template-columns:1fr 1fr;gap:10px} .nat-cartao{min-height:150px;padding:14px} .nat-cartao b{font-size:1.05rem} .nat-cartao small{font-size:.72rem} }
@media (max-width:380px){ .nat-grade{grid-template-columns:1fr} }

/* Faixa de defeito: o mini-app deu erro de verdade enquanto era usado. */
.ferr-defeito{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 8px;padding:9px 12px;border-radius:12px;
  background:rgba(201,164,92,.10);border:1px solid rgba(201,164,92,.35);color:var(--texto,#ece7da);font-size:.86rem;line-height:1.35}
.ferr-defeito span{flex:1 1 180px}
.ferr-defeito .ferr-defeito-x{min-width:36px;padding-inline:0}
/* Em tela cheia a caixa cobre tudo (z-index 200): a faixa sobe por cima, no rodape. */
html.ferr-tela-cheia .ferr-defeito{position:fixed;z-index:202;left:10px;right:10px;margin:0;
  bottom:calc(12px + env(safe-area-inset-bottom));background:#151c25}

/* Usados recentemente: a primeira fileira da aba, um toque para voltar ao app. */
.ferr-recentes{margin:0 0 18px}
.ferr-recentes-fila{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 6px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.ferr-recentes-fila::-webkit-scrollbar{display:none}
.ferr-recente{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 14px 8px 10px;border-radius:999px;
  background:var(--lamina);border:1px solid var(--vidro-borda,var(--fio));color:var(--pergaminho);font:inherit;font-size:.9rem;font-weight:550;
  cursor:pointer;max-width:70vw}
.ferr-recente .ferr-icone{width:26px;height:26px;font-size:1rem}
.ferr-recente-nome{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ferr-recente:hover{border-color:rgba(201,164,92,.5)}