/* ===========================================================
   ADVIZE · Inteligência Jurídica
   Folha da APLICAÇÃO. Os tokens da marca vivem em
   design-system.css, que é carregado antes desta.

   Aqui os nomes antigos (--bg, --panel, --txt…) permanecem,
   mas apontam para os tokens do design system. Isso foi
   deliberado na consolidação: as ~800 linhas de layout abaixo
   continuam válidas, e a superfície inteira passou de escura
   para clara trocando o significado dos nomes, não reescrevendo
   cada regra. Uma fonte de verdade para a cor; uma folha para
   o layout.

   Proporção perseguida: ~80% branco/neutro, ~15% navy,
   ~5% azul da marca. Cor cria hierarquia; não decora.
   =========================================================== */

:root{
  --bg:        var(--surface);          /* #fafafc — fundo geral */
  --panel:     var(--surface-elevated); /* #ffffff — cartões, sidebar */
  --panel-2:   var(--surface-sunken);   /* #f8f9fc — rebaixado */
  --line:      var(--border-strong);
  --line-soft: var(--border);

  --txt:       var(--foreground);       /* #151A2E — navy da ADVIZE */
  --txt-dim:   var(--muted);            /* #667085 */
  --txt-mute:  var(--muted-soft);       /* #98a2b3 */

  --accent:    var(--brand-accent);     /* #2B3FD4 — azul da ADVIZE */
  --accent-2:  var(--brand-accent-2);
  --ink:       var(--on-accent);        /* branco, sobre o azul */

  /* Existia porque o accent anterior era um ciano claro, ilegível como
     texto sobre branco. O azul da ADVIZE tem 8:1 sobre branco e serve aos
     dois usos — o token continua, apontando para a marca, para não obrigar
     a reescrever as ~20 regras que já o consomem. */
  --accent-ink: var(--brand-accent);

  --ok:        var(--success);
  --warn:      var(--warning);
  --err:       var(--danger);

  /* No tema escuro a borda separava. No claro, quem separa é a sombra —
     borda forte demais deixa a tela riscada. */
  --sh-sm: 0 1px 2px rgba(21,23,67,.06);
  --sh-md: 0 2px 8px rgba(21,23,67,.06), 0 1px 2px rgba(21,23,67,.04);
  --sh-lg: 0 12px 32px rgba(21,23,67,.10), 0 2px 8px rgba(21,23,67,.05);

  --radius:    14px;
  --sidebar-w: 272px;

  --font-ui:   'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-head: 'Sora', var(--font-ui);
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  display:flex;
  background:var(--bg);
  color:var(--txt);
  font-family:var(--font-ui);
  font-size:15px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.hidden{ display:none !important; }

::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-thumb{ background:rgba(21,23,67,.16); border-radius:8px; border:3px solid transparent; background-clip:content-box; }
::-webkit-scrollbar-thumb:hover{ background:rgba(21,23,67,.28); background-clip:content-box; }
::-webkit-scrollbar-track{ background:transparent; }

:focus-visible{ outline:2px solid var(--accent-ink); outline-offset:2px; border-radius:6px; }

/* ===================== SIDEBAR ===================== */
.sidebar{
  width:var(--sidebar-w);
  flex:0 0 var(--sidebar-w);
  height:100vh;
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:20px 14px 14px;
  background:var(--panel);
  border-right:1px solid var(--line-soft);
}

/* Só o empilhamento; a marca em si é o componente BrandLogo, estilizado em
   design-system.css. Aqui não há regra de cor de marca — é o que impede a
   logo voltar a divergir entre telas. */
.sidebar-brand{ display:flex; flex-direction:column; gap:5px; padding:2px 4px; }
.brand-sub{ font-size:10.5px; color:var(--txt-mute); letter-spacing:.7px; text-transform:uppercase; }

.new-btn{
  display:flex; align-items:center; justify-content:center; gap:8px;
  width:100%; padding:11px 14px;
  border:0; border-radius:11px; cursor:pointer;
  background:linear-gradient(140deg,var(--accent-2),var(--accent));
  color:var(--ink);
  font-family:var(--font-head); font-size:14px; font-weight:600;
  transition:transform .12s ease, box-shadow .18s ease, filter .18s ease;
}
.new-btn svg{ width:17px; height:17px; }
.new-btn:hover{ transform:translateY(-1px); box-shadow:0 8px 20px rgba(43,63,212,.22); filter:brightness(1.04); }
.new-btn:active{ transform:translateY(0); }

.side-label{
  font-size:11px; font-weight:600; letter-spacing:.9px;
  text-transform:uppercase; color:var(--txt-mute);
  padding:2px 4px; margin-top:2px;
}

/* ---- dropzone ---- */
.dropzone{
  display:block; text-align:center; cursor:pointer;
  padding:20px 14px;
  border:1.5px dashed var(--line); border-radius:var(--radius);
  background:var(--panel);
  transition:border-color .18s ease, background .18s ease, transform .12s ease;
}
.dropzone:hover, .dropzone.is-over{
  border-color:var(--accent);
  background:var(--panel-2);
}
.dropzone .ic{
  width:38px; height:38px; margin:0 auto 9px;
  display:grid; place-items:center;
  border-radius:10px; background:var(--panel-2); color:var(--accent-ink);
}
.dropzone .ic svg{ width:20px; height:20px; }
.dropzone p{ margin:0; font-size:13.5px; color:var(--txt-dim); }
.dropzone p b{ color:var(--txt); font-weight:600; }
.dropzone small{ display:block; margin-top:6px; font-size:11px; color:var(--txt-mute); }

/* ---- lista de documentos ---- */
.doc-list{ flex:1; overflow-y:auto; display:flex; flex-direction:column; gap:7px; padding-right:2px; }
.empty-docs{
  font-size:12.5px; color:var(--txt-mute); text-align:center;
  padding:22px 10px; line-height:1.7;
  border:1px dashed var(--line); border-radius:12px;
}

.doc-item{
  display:flex; align-items:center; gap:10px;
  padding:9px 10px;
  border:1px solid var(--line-soft); border-radius:11px;
  background:var(--panel);
  transition:border-color .16s ease, background .16s ease;
}
.doc-item:hover{ border-color:var(--line); background:var(--panel-2); }
.doc-item.is-sel{ border-color:var(--accent); background:rgba(43,63,212,.08); }
.doc-item .file-ic{
  width:30px; height:30px; flex:0 0 30px;
  display:grid; place-items:center;
  border-radius:8px; background:rgba(220,38,38,.08); color:var(--err);
  font-size:9px; font-weight:700; letter-spacing:.3px;
}
.doc-item .meta{ min-width:0; flex:1; }
.doc-item .name{
  font-size:12.8px; font-weight:500; color:var(--txt);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.doc-item .info{ font-size:11px; color:var(--txt-mute); display:flex; align-items:center; gap:5px; }
.doc-item .info .st{ display:inline-flex; align-items:center; gap:4px; }
.doc-item .info .st.processing{ color:var(--warn); }
.doc-item .info .st.ready{ color:var(--ok); }
.doc-item .info .st.error{ color:var(--err); }
.doc-item .del{
  border:0; background:transparent; cursor:pointer;
  color:var(--txt-mute); padding:4px; border-radius:7px; line-height:0;
  opacity:0; transition:opacity .16s ease, color .16s ease, background .16s ease;
}
.doc-item:hover .del{ opacity:1; }
.doc-item .del:hover{ color:var(--err); background:rgba(220,38,38,.09); }
.doc-item .del svg{ width:15px; height:15px; }

.spin{
  width:9px; height:9px; border-radius:50%;
  border:1.5px solid currentColor; border-top-color:transparent;
  animation:spin .7s linear infinite; display:inline-block;
}
@keyframes spin{ to{ transform:rotate(360deg); } }

.side-foot{
  display:flex; align-items:center; gap:8px;
  padding:11px 6px 2px; border-top:1px solid var(--line-soft);
  font-size:11.5px; color:var(--txt-mute);
}
.stat{ display:inline-flex; align-items:center; gap:6px; }
.dot{ width:6px; height:6px; border-radius:50%; background:var(--ok); box-shadow:0 0 8px var(--ok); }

/* ===================== MAIN ===================== */
.main{ flex:1; min-width:0; height:100vh; display:flex; flex-direction:column; }

.topbar{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:16px 30px;
  border-bottom:1px solid var(--line-soft);
  background:rgba(255,255,255,.86); backdrop-filter:blur(10px);
}
.topbar h1{ margin:0; font-family:var(--font-head); font-size:17px; font-weight:600; letter-spacing:.2px; }
.topbar .sub{ font-size:12.5px; color:var(--txt-mute); margin-top:1px; }
.badge{
  display:inline-flex; align-items:center; gap:7px;
  padding:6px 12px; border-radius:999px;
  border:1px solid rgba(22,163,74,.24); background:rgba(22,163,74,.08);
  font-size:12px; color:#15803d; white-space:nowrap;
}
.pulse{ width:6px; height:6px; border-radius:50%; background:var(--ok); animation:pulse 2s ease-in-out infinite; }
@keyframes pulse{ 0%,100%{ opacity:1; box-shadow:0 0 0 0 rgba(74,222,128,.45); } 50%{ opacity:.65; box-shadow:0 0 0 5px rgba(74,222,128,0); } }

/* ---- stream ---- */
.stream{ flex:1; overflow-y:auto; scroll-behavior:smooth; }
.stream-inner{ max-width:820px; margin:0 auto; padding:34px 26px 20px; }

.welcome{ margin-bottom:30px; }
.welcome h2{
  margin:0 0 10px; font-family:var(--font-head);
  font-size:29px; font-weight:600; letter-spacing:-.4px; line-height:1.25;
}
.welcome h2 span{
  background:linear-gradient(100deg,var(--accent-2),var(--accent));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.welcome p{ margin:0; max-width:62ch; color:var(--txt-dim); font-size:14.5px; }

.qa-label{
  font-size:11px; font-weight:600; letter-spacing:.9px;
  text-transform:uppercase; color:var(--txt-mute); margin-bottom:11px;
}
.qa-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(232px,1fr)); gap:10px; }
.qa-card{
  display:flex; align-items:flex-start; gap:10px; text-align:left;
  padding:13px 14px; cursor:pointer;
  border:1px solid var(--line-soft); border-radius:12px;
  background:var(--panel); color:var(--txt);
  font-family:var(--font-ui); font-size:13px;
  transition:border-color .16s ease, background .16s ease, transform .12s ease;
}
.qa-card:hover{ border-color:var(--accent); background:var(--panel-2); transform:translateY(-1px); }
.qa-card .qa-ic{
  width:28px; height:28px; flex:0 0 28px; display:grid; place-items:center;
  border-radius:8px; background:var(--panel-2); color:var(--accent-ink);
}
.qa-card .qa-ic svg{ width:15px; height:15px; }
.qa-card .qa-t{ font-weight:600; font-size:13px; margin-bottom:2px; }
.qa-card .qa-d{ font-size:11.5px; color:var(--txt-mute); line-height:1.45; }

/* ---- mensagens ---- */
.msg{ display:flex; gap:13px; margin-bottom:26px; animation:rise .28s ease both; }
@keyframes rise{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }

.msg .avatar{
  width:31px; height:31px; flex:0 0 31px;
  border-radius:9px; display:grid; place-items:center;
  font-size:11.5px; font-weight:700; font-family:var(--font-head);
}
.msg.user .avatar{ background:var(--panel-2); color:var(--txt-dim); }
.msg.ai .avatar{ background:linear-gradient(140deg,var(--accent-2),var(--accent)); color:var(--ink); }
.msg .body{ min-width:0; flex:1; padding-top:3px; }
.msg .who{ font-size:12px; font-weight:600; color:var(--txt-mute); margin-bottom:4px; }
.msg .bubble{ font-size:14.6px; color:var(--txt); }
.msg .bubble p{ margin:0 0 10px; }
.msg .bubble p:last-child{ margin-bottom:0; }
.msg .bubble strong{ color:var(--txt); font-weight:600; }
.msg .bubble ul,.msg .bubble ol{ margin:0 0 10px; padding-left:20px; }
.msg .bubble li{ margin-bottom:5px; }
.msg .bubble table{ width:100%; border-collapse:collapse; margin:4px 0 12px; font-size:13.4px; }
.msg .bubble th,.msg .bubble td{ border:1px solid var(--line); padding:7px 10px; text-align:left; }
.msg .bubble th{ background:var(--panel-2); font-weight:600; color:var(--txt-dim); }
.msg .bubble code{ background:var(--panel-2); padding:1px 5px; border-radius:5px; font-size:12.8px; }

.sources{ display:flex; flex-wrap:wrap; gap:6px; margin-top:11px; }
.src-chip{
  display:inline-flex; align-items:center; gap:5px;
  padding:4px 9px; border-radius:999px;
  border:1px solid var(--line); background:var(--panel);
  font-size:11.3px; color:var(--txt-dim);
}
.src-chip b{ color:var(--accent-ink); font-weight:600; }

.typing{ display:inline-flex; gap:4px; padding:6px 0; }
.typing i{ width:6px; height:6px; border-radius:50%; background:var(--txt-mute); animation:blink 1.3s infinite; }
.typing i:nth-child(2){ animation-delay:.18s; }
.typing i:nth-child(3){ animation-delay:.36s; }
@keyframes blink{ 0%,60%,100%{ opacity:.25; transform:translateY(0); } 30%{ opacity:1; transform:translateY(-3px); } }

/* ---- composer ---- */
.composer{
  border-top:1px solid var(--line-soft);
  background:linear-gradient(180deg,rgba(250,250,252,0),var(--bg) 45%);
  padding:14px 26px 16px;
}
.composer-inner{ max-width:820px; margin:0 auto; }

.attach-row{ display:flex; flex-wrap:wrap; gap:6px; }
.attach-row:not(:empty){ margin-bottom:9px; }
.chip{
  display:inline-flex; align-items:center; gap:7px;
  padding:5px 8px 5px 10px; border-radius:9px;
  border:1px solid var(--line); background:var(--panel);
  font-size:12px; color:var(--txt-dim); max-width:230px;
}
.chip span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chip button{ border:0; background:transparent; color:var(--txt-mute); cursor:pointer; line-height:0; padding:2px; border-radius:5px; }
.chip button:hover{ color:var(--err); }
.chip button svg{ width:13px; height:13px; }

.input-box{
  display:flex; align-items:flex-end; gap:8px;
  padding:8px 8px 8px 6px;
  border:1px solid var(--line); border-radius:16px;
  background:var(--panel);
  transition:border-color .18s ease, box-shadow .18s ease;
}
.input-box:focus-within{ border-color:var(--accent); box-shadow:0 0 0 3px rgba(43,63,212,.16); }

.attach-btn,.send-btn{
  flex:0 0 auto; width:36px; height:36px;
  display:grid; place-items:center;
  border:0; border-radius:10px; cursor:pointer;
  transition:background .16s ease, color .16s ease, opacity .16s ease;
}
.attach-btn{ background:transparent; color:var(--txt-mute); }
.attach-btn:hover{ background:var(--panel-2); color:var(--accent-ink); }
.attach-btn svg,.send-btn svg{ width:18px; height:18px; }
.send-btn{ background:linear-gradient(140deg,var(--accent-2),var(--accent)); color:var(--ink); }
.send-btn:disabled{ background:var(--line); color:var(--txt-mute); cursor:not-allowed; }
.send-btn:not(:disabled):hover{ filter:brightness(1.06); }

#input{
  flex:1; min-width:0;
  border:0; outline:0; resize:none;
  background:transparent; color:var(--txt);
  font-family:var(--font-ui); font-size:14.6px; line-height:1.5;
  padding:8px 2px; max-height:190px;
}
#input::placeholder{ color:var(--txt-mute); }

.composer-hint{ text-align:center; font-size:11.3px; color:var(--txt-mute); margin-top:9px; }

/* ---- overlay de drop ---- */
.drop-overlay{
  position:fixed; inset:0; z-index:60;
  display:none; place-items:center;
  background:rgba(255,255,255,.88); backdrop-filter:blur(5px);
}
.drop-overlay.is-on{ display:grid; }
.drop-overlay .card{
  text-align:center; padding:44px 60px;
  border:2px dashed var(--accent); border-radius:20px;
  background:var(--panel); color:var(--accent-ink);
}
.drop-overlay .card svg{ width:42px; height:42px; margin-bottom:12px; }
.drop-overlay .card h3{ margin:0 0 5px; font-family:var(--font-head); font-size:19px; color:var(--txt); }
.drop-overlay .card p{ margin:0; font-size:13px; color:var(--txt-mute); }

/* ---- toast ---- */
.toast-wrap{ position:fixed; right:20px; bottom:20px; z-index:80; display:flex; flex-direction:column; gap:8px; }
.toast{
  padding:11px 15px; border-radius:11px;
  border:1px solid var(--line); background:var(--panel-2);
  font-size:13px; color:var(--txt); max-width:330px;
  box-shadow:var(--sh-lg);
  animation:rise .22s ease both;
}
.toast.err{ border-color:rgba(220,38,38,.30); color:var(--err); }

/* ===================== NAVEGAÇÃO ENTRE ABAS ===================== */
.nav{ display:flex; flex-direction:column; gap:3px; margin-bottom:4px; }
.nav-item{
  display:flex; align-items:center; gap:10px; width:100%;
  padding:9px 11px; border:0; border-radius:10px; cursor:pointer;
  background:transparent; color:var(--txt-dim);
  font-family:var(--font-ui); font-size:13.2px; font-weight:500; text-align:left;
  transition:background .15s, color .15s;
}
.nav-item svg{ width:17px; height:17px; flex:0 0 auto; }
.nav-item:hover{ background:rgba(21,24,63,.06); color:var(--txt); }
/* §50: item ativo em navy sólido com texto branco. É o único bloco de cor
   cheia da navegação — a hierarquia fica óbvia sem pintar a tela. */
.nav-item.is-on{
  background:var(--brand-primary); color:#fff; font-weight:600;
  box-shadow:var(--sh-sm);
}
.nav-item.is-on:hover{ background:var(--brand-primary-2); color:#fff; }

/* Separador antes do bloco administrativo (§50). */
.nav-sep{
  height:1px; background:var(--line-soft); margin:8px 4px 6px; border:0;
}

.side-docs{ display:flex; flex-direction:column; gap:12px; flex:1; min-height:0; }

/* ===================== BASE DE CONHECIMENTO ===================== */
.kb{ flex:1; overflow-y:auto; }
.kb-inner{ max-width:960px; margin:0 auto; padding:26px 26px 40px; }

.kb-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:11px; margin-bottom:20px; }
.kb-card{
  background:var(--panel); border:1px solid var(--line-soft);
  border-radius:var(--radius); padding:15px 17px;
}
.kb-card .v{ font-family:var(--font-head); font-size:25px; font-weight:600; color:var(--accent-ink); line-height:1.1; }
.kb-card .k{ font-size:12px; color:var(--txt-mute); margin-top:3px; }

.kb-drop{
  display:flex; align-items:center; gap:15px; cursor:pointer;
  background:var(--panel); border:1.5px dashed var(--line);
  border-radius:var(--radius); padding:20px 22px; margin-bottom:16px;
  transition:border-color .18s, background .18s;
}
.kb-drop:hover, .kb-drop.is-over{ border-color:var(--accent); background:var(--panel-2); }
.kb-drop .ic{
  width:44px; height:44px; flex:0 0 auto; border-radius:11px;
  display:grid; place-items:center; background:var(--panel-2);
  border:1px solid var(--line); color:var(--accent-ink);
}
.kb-drop .ic svg{ width:22px; height:22px; }
.kb-drop .tx b{ display:block; font-size:14.5px; font-weight:600; margin-bottom:3px; }
.kb-drop .tx span{ font-size:12.5px; color:var(--txt-mute); }

.kb-uploads{
  background:var(--panel); border:1px solid var(--line-soft);
  border-radius:var(--radius); padding:12px 15px; margin-bottom:16px;
}
.kb-uploads-head{
  display:flex; align-items:center; justify-content:space-between;
  font-size:12px; color:var(--txt-mute); margin-bottom:8px;
  text-transform:uppercase; letter-spacing:.5px;
}
.link-btn{
  background:none; border:0; cursor:pointer; color:var(--txt-mute);
  font-family:var(--font-ui); font-size:11.5px; text-decoration:underline; padding:0;
}
.link-btn:hover{ color:var(--txt); }
.up-row{
  display:flex; align-items:flex-start; gap:9px;
  padding:6px 0; font-size:13px; border-top:1px solid var(--line-soft);
}
.up-row:first-child{ border-top:0; }
.up-row .nm{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.up-row .rs{ font-size:11.5px; color:var(--txt-mute); flex:0 0 auto; max-width:52%; text-align:right; }
.up-row.ok .rs{ color:var(--ok); }
.up-row.err .rs{ color:var(--err); text-align:right; white-space:normal; }

.kb-toolbar{ display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.kb-search{
  flex:1; display:flex; align-items:center; gap:8px;
  background:var(--panel); border:1px solid var(--line);
  border-radius:10px; padding:0 12px;
}
.kb-search svg{ width:16px; height:16px; color:var(--txt-mute); flex:0 0 auto; }
.kb-search input{
  flex:1; background:none; border:0; outline:none; padding:10px 0;
  color:var(--txt); font-family:var(--font-ui); font-size:13.5px;
}
.kb-search input::placeholder{ color:var(--txt-mute); }
.kb-shown{ font-size:12px; color:var(--txt-mute); flex:0 0 auto; }

.kb-table{
  background:var(--panel); border:1px solid var(--line-soft);
  border-radius:var(--radius); overflow:hidden;
}
.kb-row{
  display:grid; grid-template-columns:1.3fr 1fr 118px 76px 96px 40px;
  align-items:center; gap:10px; padding:11px 15px;
  border-top:1px solid var(--line-soft); font-size:13px;
}
.kb-row:first-child{ border-top:0; }
.kb-row.head{
  font-size:11px; text-transform:uppercase; letter-spacing:.5px;
  color:var(--txt-mute); background:var(--panel-2);
}
.kb-row .nm{ display:flex; align-items:center; gap:9px; min-width:0; }
.kb-row .nm .file-ic{
  width:26px; height:26px; flex:0 0 auto; border-radius:7px;
  display:grid; place-items:center; background:var(--panel-2);
  border:1px solid var(--line); color:var(--accent-ink);
  font-size:8.5px; font-weight:700; letter-spacing:.4px;
}
.kb-row .nm span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kb-row .num{ color:var(--txt-dim); font-variant-numeric:tabular-nums; }
.kb-row .st{ display:inline-flex; align-items:center; gap:5px; font-size:12px; }
.kb-row .st.ready{ color:var(--ok); }
.kb-row .st.processing{ color:var(--warn); }
.kb-row .st.error{ color:var(--err); }
.kb-row .del{
  background:none; border:0; cursor:pointer; color:var(--txt-mute);
  border-radius:7px; padding:5px; display:grid; place-items:center;
}
.kb-row .del:hover{ color:var(--err); background:rgba(220,38,38,.09); }
.kb-row .del svg{ width:16px; height:16px; }
.kb-empty{ padding:38px 20px; text-align:center; color:var(--txt-mute); font-size:13px; line-height:1.7; }

.kb-access{
  margin-top:18px; background:var(--panel); border:1px solid var(--line-soft);
  border-radius:var(--radius); padding:13px 16px;
}
.kb-access summary{ cursor:pointer; font-size:13px; color:var(--txt-dim); }
.kb-access p{ margin:10px 0; font-size:12.5px; color:var(--txt-mute); max-width:64ch; }
.kb-access .row{ display:flex; gap:8px; }
.kb-access input{
  flex:1; max-width:340px; background:var(--panel-2); border:1px solid var(--line);
  border-radius:9px; padding:9px 11px; color:var(--txt);
  font-family:var(--font-ui); font-size:13px; outline:none;
}
.kb-access .hint{ font-size:11.5px; color:var(--txt-mute); margin-top:7px; min-height:15px; }
.btn{
  background:var(--accent); color:var(--ink); border:0; border-radius:9px;
  padding:9px 15px; cursor:pointer; font-family:var(--font-ui);
  font-size:13px; font-weight:600;
}
.btn:hover{ background:var(--accent-2); }

.badge.off{ color:var(--err); border-color:rgba(220,38,38,.30); }
.badge.off .pulse{ background:var(--err); box-shadow:0 0 8px var(--err); animation:none; }
.badge.warn{ color:var(--warn); border-color:rgba(245,158,11,.35); }
.badge.warn .pulse{ background:var(--warn); box-shadow:0 0 8px var(--warn); animation:none; }

/* ===================== LOGIN ===================== */
.app{ display:flex; flex:1; min-width:0; height:100vh; }

.auth{
  position:fixed; inset:0; z-index:60; display:grid; place-items:center;
  background:radial-gradient(1200px 600px at 50% -10%, rgba(43,63,212,.06) 0%, var(--bg) 60%);
  padding:24px;
}
.auth-card{
  width:100%; max-width:388px; background:var(--panel);
  border:1px solid var(--line); border-radius:18px; padding:26px;
  box-shadow:var(--sh-lg);
}
.auth-brand{ display:flex; flex-direction:column; gap:5px; margin-bottom:24px; }
.auth-form h2{
  margin:0 0 4px; font-family:var(--font-head); font-size:19px; font-weight:600;
}
.auth-sub{ margin:0 0 18px; font-size:13px; color:var(--txt-mute); line-height:1.5; }
/* sem subtítulo (tela de entrar), o título respira o mesmo tanto */
.auth-form h2 + label{ margin-top:18px; }
.auth-form label, .adm-form label, .modal-card label{
  display:block; font-size:12.5px; color:var(--txt-dim); margin-bottom:12px;
}
.auth-form input, .adm-form input, .adm-form select,
.modal-card input, .modal-card select, .modal-card textarea, .adm-newuser input,
.adm-newuser select{
  display:block; width:100%; margin-top:5px; background:var(--panel-2);
  border:1px solid var(--line); border-radius:10px; padding:10px 12px;
  color:var(--txt); font-family:var(--font-ui); font-size:14px; outline:none;
  transition:border-color .15s;
}
.auth-form input:focus, .adm-form input:focus, .modal-card input:focus,
.modal-card textarea:focus, .modal-card select:focus, .adm-newuser input:focus{
  border-color:var(--accent);
}
.adm-form small{ display:block; margin-top:5px; font-size:11px; color:var(--txt-mute); }
.auth-err{ font-size:12.5px; color:var(--err); min-height:17px; margin-bottom:8px; }
.btn-block{ width:100%; padding:11px; font-size:14px; }
.btn.ghost{ background:transparent; color:var(--txt-dim); box-shadow:inset 0 0 0 1px var(--line); }
.btn.ghost:hover{ background:var(--panel-2); color:var(--txt); }
.btn:disabled{ opacity:.5; cursor:not-allowed; }
.auth-foot{ margin-top:18px; font-size:11.5px; color:var(--txt-mute); text-align:center; }

/* ===================== USUÁRIO NA SIDEBAR ===================== */
.side-user{
  display:flex; align-items:center; gap:8px; padding:9px 4px 0;
  border-top:1px solid var(--line-soft); margin-top:4px;
}
.side-user .who{ display:flex; align-items:center; gap:9px; min-width:0; flex:1; }
.side-user .av{
  width:31px; height:31px; flex:0 0 auto; border-radius:9px; display:grid;
  place-items:center; background:var(--accent); color:var(--ink);
  font-size:11.5px; font-weight:700;
}
.side-user .txt{ min-width:0; }
.side-user .nm{
  font-size:12.8px; font-weight:500; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap;
}
.side-user .rl{ font-size:11px; color:var(--txt-mute); }
.side-user .del{
  background:none; border:0; cursor:pointer; color:var(--txt-mute);
  border-radius:8px; padding:6px; display:grid; place-items:center;
}
.side-user .del:hover{ color:var(--accent-ink); background:var(--panel-2); }
.side-user .del svg{ width:16px; height:16px; }

.nav-pill{
  margin-left:auto; background:var(--accent); color:var(--ink);
  font-size:10.5px; font-weight:700; border-radius:20px; padding:1px 7px;
}

/* ===================== LEMBRETES ===================== */
.rem-head{
  display:flex; align-items:center; justify-content:space-between;
  gap:14px; margin-bottom:16px;
}
.rem-hint{ font-size:12.5px; color:var(--txt-mute); max-width:60ch; }
.rem-group{
  font-size:11px; text-transform:uppercase; letter-spacing:.5px;
  color:var(--txt-mute); margin:20px 0 8px;
}
.rem-item{
  display:flex; align-items:flex-start; gap:12px; background:var(--panel);
  border:1px solid var(--line-soft); border-radius:var(--radius);
  padding:13px 15px; margin-bottom:8px;
}
.rem-item.soon{ border-color:rgba(245,158,11,.35); }
.rem-item.late{ border-color:rgba(220,38,38,.30); }
.rem-item.done{ opacity:.55; }
.rem-item .kind{
  flex:0 0 auto; font-size:10.5px; font-weight:700; letter-spacing:.4px;
  text-transform:uppercase; padding:4px 8px; border-radius:7px;
  background:var(--panel-2); border:1px solid var(--line); color:var(--accent-ink);
}
.rem-item .body{ flex:1; min-width:0; }
.rem-item .ttl{ font-size:14px; font-weight:600; margin-bottom:3px; }
.rem-item .meta{ font-size:12px; color:var(--txt-mute); line-height:1.6; }
.rem-item .when{ font-weight:600; color:var(--txt-dim); }
.rem-item .when.soon{ color:var(--warn); }
.rem-item .when.late{ color:var(--err); }
.rem-item .acts{ display:flex; gap:4px; flex:0 0 auto; }
.rem-item .acts button{
  background:none; border:0; cursor:pointer; color:var(--txt-mute);
  border-radius:8px; padding:6px; display:grid; place-items:center;
}
.rem-item .acts button:hover{ color:var(--accent-ink); background:var(--panel-2); }
.rem-item .acts button.danger:hover{ color:var(--err); background:rgba(220,38,38,.09); }
.rem-item .acts svg{ width:16px; height:16px; }

/* ===================== ADMINISTRAÇÃO ===================== */
.sec-title{
  font-family:var(--font-head); font-size:14px; font-weight:600;
  margin:26px 0 12px; color:var(--txt);
}
.adm-form{
  display:grid; grid-template-columns:repeat(2,1fr); gap:0 14px;
  background:var(--panel); border:1px solid var(--line-soft);
  border-radius:var(--radius); padding:17px 18px 8px;
}
.adm-form label.wide{ grid-column:1 / -1; }
.adm-actions{
  grid-column:1 / -1; display:flex; align-items:center; gap:12px;
  padding:6px 0 10px;
}
.adm-actions .hint{ font-size:12px; color:var(--txt-mute); }
.adm-newuser{
  display:grid; grid-template-columns:1.2fr 1.4fr .7fr auto; gap:9px;
  margin-bottom:12px;
}
.adm-newuser input, .adm-newuser select{ margin-top:0; }
.adm-newpass{
  background:rgba(22,163,74,.07); border:1px solid rgba(22,163,74,.22); border-radius:11px;
  padding:12px 14px; margin-bottom:12px; font-size:13px; line-height:1.6;
}
.adm-newpass code{
  background:var(--panel-2); border:1px solid var(--line); border-radius:6px;
  padding:2px 8px; font-size:13.5px; color:var(--accent-ink); user-select:all;
}
.adm-row{ display:grid; grid-template-columns:1.5fr 1fr 128px 100px 40px; align-items:center; }
.badge-role{
  display:inline-block; white-space:nowrap;
  font-size:10.5px; font-weight:700; letter-spacing:.4px; text-transform:uppercase;
  padding:3px 7px; border-radius:6px; background:var(--panel-2);
  border:1px solid var(--line); color:var(--txt-dim);
}
.badge-role.ti{ color:var(--accent-ink); border-color:rgba(11,126,168,.30); }
.badge-role.advogado_admin{
  color:var(--brand-primary); border-color:rgba(21,23,67,.22);
  background:rgba(21,23,67,.05);
}

/* ===================== MODAL ===================== */
.modal{
  position:fixed; inset:0; z-index:70; display:grid; place-items:center;
  background:rgba(21,23,67,.28); padding:22px; backdrop-filter:blur(3px);
}
.modal-card{
  width:100%; max-width:520px; background:var(--panel);
  border:1px solid var(--line); border-radius:18px; padding:22px;
  box-shadow:var(--sh-lg); max-height:92vh; overflow-y:auto;
}
.modal-card h3{ margin:0 0 4px; font-family:var(--font-head); font-size:17px; font-weight:600; }
.modal-sub{ margin:0 0 18px; font-size:12.5px; color:var(--txt-mute); line-height:1.5; }
.modal-card textarea{ resize:vertical; }
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:0 12px; }
.modal-actions{ display:flex; justify-content:flex-end; gap:9px; margin-top:6px; }

/* ===================== POP-UPS DE LEMBRETE ===================== */
.popups{
  position:fixed; right:18px; bottom:18px; z-index:80;
  display:flex; flex-direction:column; gap:9px; max-width:340px;
}
.popup{
  background:var(--panel); border:1px solid var(--accent);
  border-radius:13px; padding:14px 15px;
  box-shadow:var(--sh-lg); animation:rise .3s ease both;
}
.popup.late{ border-color:var(--err); }
.popup .top{
  display:flex; align-items:center; gap:7px; font-size:11px;
  text-transform:uppercase; letter-spacing:.5px; color:var(--accent-ink);
  margin-bottom:5px; font-weight:600;
}
.popup.late .top{ color:var(--err); }
.popup .ttl{ font-size:14px; font-weight:600; margin-bottom:3px; }
.popup .meta{ font-size:12px; color:var(--txt-mute); line-height:1.5; }
.popup .acts{ display:flex; gap:8px; margin-top:11px; }
.popup .acts button{
  flex:1; padding:7px; border-radius:8px; cursor:pointer;
  font-family:var(--font-ui); font-size:12.5px; font-weight:500;
  background:var(--panel-2); border:1px solid var(--line); color:var(--txt-dim);
}
.popup .acts button.primary{ background:var(--accent); border-color:var(--accent); color:var(--ink); font-weight:600; }
.popup .acts button:hover{ color:var(--txt); }
.popup .acts button.primary:hover{ background:var(--accent-2); color:var(--ink); }

/* ===================== RESPONSIVO ===================== */
@media (max-width:900px){
  body{ flex-direction:column; }
  .sidebar{
    width:100%; flex:0 0 auto; height:auto; max-height:46vh;
    border-right:0; border-bottom:1px solid var(--line-soft);
  }
  .main{ height:auto; flex:1; min-height:54vh; }
  .topbar{ padding:14px 18px; }
  .stream-inner{ padding:24px 16px 16px; }
  .composer{ padding:12px 16px 14px; }
  .welcome h2{ font-size:23px; }
  .qa-grid{ grid-template-columns:1fr; }
  .kb-inner{ padding:20px 16px 30px; }
  .kb-cards{ grid-template-columns:1fr; }
  .kb-row{ grid-template-columns:1fr 70px 90px 40px; }
  .kb-row .col-client, .kb-row .col-value{ display:none; }
  .app{ display:block; height:auto; }
  .adm-form, .grid2{ grid-template-columns:1fr; }
  .adm-newuser{ grid-template-columns:1fr; }
  .adm-row{ grid-template-columns:1.4fr 80px 40px; }
  .adm-row .col-email, .adm-row .col-last{ display:none; }
  .popups{ left:12px; right:12px; max-width:none; }
}

@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* ===================== KANBAN PROCESSUAL =====================
   Construído no tema vigente da aplicação. Quando as telas internas
   migrarem para a superfície clara do design system (assets/
   design-system.css), este bloco acompanha trocando os tokens. */

.kbn-actions{ display:flex; gap:8px; align-items:center; }

.kbn-aviso{
  margin:0 0 14px; padding:10px 14px;
  background:var(--panel); border:1px solid var(--line-soft);
  border-left:3px solid var(--accent);
  border-radius:10px;
  font-size:12.5px; color:var(--txt-dim); line-height:1.5;
}

.kbn-board{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(198px, 1fr);
  gap:12px;
  /* Rola dentro do board: a página nunca ganha barra horizontal. */
  overflow-x:auto;
  padding-bottom:10px;
  align-items:start;
}

.kbn-col{
  background:var(--bg);
  border:1px solid var(--line-soft);
  border-radius:14px;
  padding:10px;
  display:flex; flex-direction:column; gap:8px;
  min-height:180px;
  transition:border-color .15s, background .15s;
}
.kbn-col.is-over{ border-color:var(--accent); background:var(--panel); }

.kbn-col-head{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:2px 4px 8px; border-bottom:1px solid var(--line-soft);
}
.kbn-col-nome{
  font-family:var(--font-head); font-size:12px; font-weight:600;
  color:var(--txt); line-height:1.25;
}
.kbn-col-n{
  flex:none; min-width:22px; text-align:center;
  padding:2px 7px; border-radius:999px;
  background:var(--panel-2); color:var(--txt-dim);
  font-size:11px; font-weight:600;
}
.kbn-col-lista{ display:flex; flex-direction:column; gap:8px; }
.kbn-col-vazia{ padding:14px 4px; text-align:center; color:var(--txt-mute); font-size:12px; }

.kbn-card{
  background:var(--panel);
  border:1px solid var(--line-soft);
  border-radius:12px;
  padding:10px 11px;
  display:flex; flex-direction:column; gap:6px;
  cursor:grab;
  transition:border-color .15s, transform .12s, box-shadow .15s;
}
.kbn-card:hover{ border-color:var(--line); transform:translateY(-1px); box-shadow:var(--sh-md); }
.kbn-card.is-dragging{ opacity:.45; cursor:grabbing; }
.kbn-card.is-manual{ border-left:3px solid var(--accent); }

.kbn-card-num{ font-family:var(--font-head); font-size:12.5px; font-weight:600; color:var(--txt); }
.kbn-card-cli{ font-size:12px; color:var(--txt-dim); }
.kbn-card-meta{ display:flex; flex-wrap:wrap; gap:8px; font-size:11px; color:var(--txt-mute); }
.kbn-card-valor{ color:var(--accent-ink); font-weight:600; }
.kbn-card-mov{
  font-size:11px; color:var(--txt-mute);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.kbn-card-selos{ display:flex; flex-wrap:wrap; gap:5px; }
.kbn-selo{
  padding:2px 7px; border-radius:999px;
  background:var(--panel-2); border:1px solid var(--line-soft);
  font-size:10.5px; color:var(--txt-mute);
}
.kbn-selo-manual{ background:rgba(43,63,212,.10); border-color:rgba(43,63,212,.28); color:var(--accent-ink); }
.kbn-selo-fraco{ background:rgba(251,191,36,.12); border-color:rgba(251,191,36,.3); color:var(--warn); }

.kbn-card-pe{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding-top:6px; border-top:1px solid var(--line-soft);
  font-size:11px; color:var(--txt-mute);
}
.kbn-card-resp{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kbn-card-resp em{ color:var(--txt-mute); opacity:.75; }

/* Caminho acessível de mover, sem depender de arrastar. */
.kbn-mover{
  width:100%; margin-top:2px;
  background:var(--panel-2); color:var(--txt-dim);
  border:1px solid var(--line-soft); border-radius:8px;
  padding:5px 7px; font-family:var(--font-ui); font-size:11px;
  cursor:pointer;
}
.kbn-mover:focus{ outline:none; border-color:var(--accent); }

/* histórico de fases */
.kbn-hist{ list-style:none; margin:14px 0 0; padding:0; display:flex; flex-direction:column; gap:10px; max-height:52vh; overflow-y:auto; }
.kbn-hist li{ padding:10px 12px; background:var(--panel-2); border:1px solid var(--line-soft); border-radius:10px; }
.kbn-hist-topo{ display:flex; justify-content:space-between; gap:10px; font-size:12.5px; color:var(--txt); }
.kbn-hist-topo span{ color:var(--txt-mute); font-size:11px; white-space:nowrap; }
.kbn-hist-de{ margin-top:3px; font-size:11px; color:var(--txt-mute); }
.kbn-hist-motivo{ margin-top:4px; font-size:11.5px; color:var(--txt-dim); }

@media (max-width: 900px){
  .kbn-board{ grid-auto-columns:minmax(215px, 78vw); }
}

/* Ação secundária: dois botões sólidos em ciano lado a lado brigam por
   atenção numa barra de ferramentas. O ciano fica para a ação principal. */
.btn-ghost{
  background:transparent; color:var(--txt-dim);
  border:1px solid var(--line); font-weight:500;
}
.btn-ghost:hover{ background:var(--panel-2); color:var(--txt); border-color:var(--accent); }
.btn-ghost:disabled{ opacity:.5; cursor:not-allowed; }

/* =====================================================================
   TELAS DA CONSOLIDAÇÃO
   Dashboard, Processos, detalhe do processo, tarefas e configuração de
   fases. Reaproveitam os primitivos que já existiam (.kb-card, .kb-row,
   .modal, .btn) — a consolidação não pediu componentes novos, pediu que
   não houvesse dois de cada.
   ===================================================================== */

/* ---------------------------- dashboard ---------------------------- */
.dash-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:14px; margin-bottom:14px;
}
.dash-box{
  background:var(--panel); border:1px solid var(--line-soft);
  border-radius:var(--radius); padding:16px 18px; box-shadow:var(--sh-sm);
  min-width:0;
}
.dash-box .sec-title{ margin:0 0 12px; }
.dash-vazio{ color:var(--txt-mute); font-size:13px; margin:6px 0 0; line-height:1.6; }
.dash-alerta{ margin:10px 0 0; font-size:12.5px; font-weight:600; color:var(--warn); }

.dash-fases{ display:flex; flex-direction:column; gap:8px; }
.dash-fase{
  display:grid; grid-template-columns:minmax(90px,1.1fr) 2fr auto;
  align-items:center; gap:10px; width:100%;
  background:transparent; border:0; padding:5px 6px; border-radius:9px;
  cursor:pointer; font:inherit; color:var(--txt); text-align:left;
}
.dash-fase:hover{ background:var(--panel-2); }
.dash-fase-nome{
  font-size:12.6px; color:var(--txt-dim);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.dash-fase-n{ font-size:12.6px; font-weight:600; min-width:22px; text-align:right; }
.dash-bar{ height:8px; background:var(--panel-2); border-radius:99px; overflow:hidden; }
.dash-bar i{ display:block; height:100%; background:var(--accent); border-radius:99px; }

.dash-lista{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; }
.dash-lista li{
  padding:9px 10px; border-radius:10px; cursor:pointer;
  display:flex; flex-direction:column; gap:2px; transition:background .14s ease;
}
.dash-lista li:hover{ background:var(--panel-2); }
.dash-lista li b{ font-size:13.2px; font-weight:600; color:var(--txt); }
.dash-lista li span{ font-size:11.6px; color:var(--txt-mute); }
.pd-body .dash-lista li{ cursor:default; }

/* ---------------------------- processos ---------------------------- */
.kb-filtro{
  padding:8px 11px; border-radius:10px; font:inherit; font-size:13px;
  border:1px solid var(--line); background:var(--panel); color:var(--txt);
  cursor:pointer; max-width:220px;
}
.kb-filtro:focus{ outline:none; border-color:var(--accent); }

.proc-row{ cursor:pointer; grid-template-columns:1.5fr .9fr .9fr .8fr 1fr 1.2fr; align-items:center; }
.proc-row:hover{ background:var(--panel-2); }
.proc-head{ cursor:default; }
.proc-head:hover{ background:transparent; }
.proc-row small{ display:block; font-size:11px; color:var(--txt-mute); font-weight:400; }
.pill-fase{
  display:inline-block; padding:2.5px 9px; border-radius:999px;
  background:var(--panel-2); border:1px solid var(--line-soft);
  font-size:11.4px; font-weight:600; color:var(--txt-dim); white-space:nowrap;
}

/* ------------------- detalhe do processo (§40) ------------------- */
.pd-head{
  background:var(--panel); border:1px solid var(--line-soft);
  border-radius:var(--radius); padding:18px 20px; margin:10px 0 14px;
  box-shadow:var(--sh-sm);
}
.pd-num{ font-family:var(--font-head); font-size:21px; font-weight:600; }
.pd-meta{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:12px 18px; margin-top:14px;
}
.pd-meta div{ display:flex; flex-direction:column; gap:1px; min-width:0; }
.pd-meta b{ font-size:13.4px; font-weight:600; overflow-wrap:anywhere; }
.pd-meta span{
  font-size:10.6px; text-transform:uppercase; letter-spacing:.6px; color:var(--txt-mute);
}
.pd-sync{
  margin-top:14px; padding-top:12px; border-top:1px solid var(--line-soft);
  font-size:12.2px; color:var(--txt-mute);
}

.pd-tabs{
  display:flex; gap:4px; overflow-x:auto; padding-bottom:2px;
  border-bottom:1px solid var(--line-soft); margin-bottom:14px;
}
.pd-tab{
  border:0; background:transparent; cursor:pointer; font:inherit; font-size:13.2px;
  padding:9px 13px; border-radius:9px 9px 0 0; color:var(--txt-dim);
  border-bottom:2px solid transparent; white-space:nowrap;
}
.pd-tab:hover{ background:var(--panel-2); color:var(--txt); }
.pd-tab.is-on{ color:var(--txt); font-weight:600; border-bottom-color:var(--accent); }
.pd-body .btn{ margin-top:12px; }
.pd-resumo p{ margin:0 0 8px; font-size:13.6px; }

/* --------------------- tarefas no board (§34) --------------------- */
/* A tarefa é visualmente outra coisa: traço lateral e etiqueta. Um cartão
   igual ao do processo faria a operação confundir as duas entidades. */
.kbn-task{ border-left:3px solid var(--accent); }
.kbn-task.is-late{ border-left-color:var(--err); }
.kbn-task.is-done{ opacity:.62; }
.kbn-task.is-done .kbn-card-num{ text-decoration:line-through; }
.kbn-task-topo{
  display:flex; align-items:center; justify-content:space-between;
  gap:6px; margin-bottom:5px;
}
.kbn-task-tag{
  font-size:9.6px; font-weight:700; letter-spacing:.7px; text-transform:uppercase;
  color:var(--accent-ink);
}
.kbn-prio-alta{ color:#b45309; background:rgba(245,158,11,.12); border-color:rgba(245,158,11,.32); }
.kbn-prio-urgente{ color:var(--err); background:rgba(220,38,38,.10); border-color:rgba(220,38,38,.30); }

/* Cor da coluna, quando o escritório definir uma. */
.kbn-col{ border-top:3px solid var(--col-cor, transparent); }
.kbn-col-cfg{
  border:0; background:transparent; cursor:pointer; color:var(--txt-mute);
  font-size:13px; line-height:1; padding:3px 5px; border-radius:7px; margin-left:auto;
}
.kbn-col-cfg:hover{ background:var(--panel-2); color:var(--txt); }

/* ---------------------------- modais ---------------------------- */
.modal-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:14px 0 4px; }
.modal-grid .wide{ grid-column:1 / -1; }
.modal-grid label{
  display:flex; flex-direction:column; gap:5px;
  font-size:11.6px; font-weight:600; color:var(--txt-dim);
  text-transform:uppercase; letter-spacing:.5px;
}
.modal-grid label.check{
  flex-direction:row; align-items:center; gap:8px;
  text-transform:none; letter-spacing:0; font-size:13px; font-weight:500; color:var(--txt);
}
.modal-grid input:not([type=checkbox]),
.modal-grid select, .modal-grid textarea{
  padding:9px 11px; border-radius:10px; font:inherit; font-size:13.6px;
  border:1px solid var(--line); background:var(--panel); color:var(--txt);
  text-transform:none; letter-spacing:0; font-weight:400; width:100%;
}
.modal-grid input[type=color]{ padding:3px; height:38px; cursor:pointer; }
.modal-grid textarea{ resize:vertical; min-height:52px; }
.modal-grid input:focus, .modal-grid select:focus, .modal-grid textarea:focus{
  outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(43,63,212,.16);
}
.modal-grid small{
  font-size:11px; font-weight:400; text-transform:none; letter-spacing:0; color:var(--txt-mute);
}
.modal-nota{
  grid-column:1 / -1; margin:2px 0 0; font-size:12.2px; line-height:1.55;
  color:var(--txt-dim); background:var(--panel-2);
  border:1px solid var(--line-soft); border-radius:10px; padding:10px 12px;
}
.btn.danger, .btn-ghost.danger{ color:var(--err); border-color:rgba(220,38,38,.30); }
.btn-ghost.danger:hover{ background:rgba(220,38,38,.07); border-color:var(--err); }
.modal-acoes{ display:flex; gap:8px; justify-content:flex-end; flex-wrap:wrap; }

/* ------------------ monitor de atividade (§31-§37) ------------------
   Controle interno, não prazo processual. A cor sobe com o tempo parado,
   mas nunca chega ao vermelho de erro para nível intermediário: vermelho
   comunica falha, e estar sem atividade não é falha — é algo a olhar. */
.nv{
  display:inline-block; padding:2px 8px; border-radius:999px;
  font-size:11px; font-weight:600; white-space:nowrap;
  border:1px solid var(--line-soft); background:var(--panel-2); color:var(--txt-dim);
}
.nv-NORMAL{ color:#15803d; background:rgba(22,163,74,.08); border-color:rgba(22,163,74,.22); }
.nv-ATENCAO{ color:#b45309; background:rgba(245,158,11,.10); border-color:rgba(245,158,11,.28); }
.nv-URGENTE{ color:#c2410c; background:rgba(234,88,12,.10); border-color:rgba(234,88,12,.30); }
.nv-CRITICO{ color:var(--err); background:rgba(220,38,38,.09); border-color:rgba(220,38,38,.28); }

.proc-row .nv + small{ display:block; margin-top:3px; font-size:10.5px; color:var(--txt-mute); }
.dash-lista .nv{ padding:1px 6px; font-size:10.4px; font-style:normal; }

/* A ressalva de que isto não é prazo. Discreta, mas sempre presente. */
.dash-nota{
  margin:12px 0 0; padding-top:10px; border-top:1px solid var(--line-soft);
  font-size:11.4px; line-height:1.55; color:var(--txt-mute);
}

/* --- cartões clicáveis do Dashboard --- */
.kb-card-btn{
  border:1px solid var(--line-soft); cursor:pointer; text-align:left;
  font:inherit; transition:border-color .15s ease, box-shadow .15s ease, transform .12s ease;
}
.kb-card-btn:hover{
  border-color:var(--accent); box-shadow:var(--sh-md); transform:translateY(-1px);
}
.kb-card-btn.tom-warn .v{ color:#b45309; }
.kb-card-btn.tom-err .v{ color:var(--err); }

/* --- visão da equipe --- */
.eq-lista{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; }
.eq-topo{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.eq-topo b{ font-size:13.4px; font-weight:600; }
.eq-n{ font-size:11.6px; color:var(--txt-mute); white-space:nowrap; }
.eq-lista .dash-bar{ margin:6px 0 7px; }
.eq-tags{ display:flex; flex-wrap:wrap; gap:5px; }
.eq-tag{
  font-size:10.8px; padding:2px 8px; border-radius:999px;
  background:var(--panel-2); border:1px solid var(--line-soft); color:var(--txt-dim);
}
.eq-tag.tom-warn{ color:#b45309; background:rgba(245,158,11,.10); border-color:rgba(245,158,11,.28); }
.eq-tag.tom-err{ color:var(--err); background:rgba(220,38,38,.09); border-color:rgba(220,38,38,.28); }
.eq-tag.tom-ok{ color:#15803d; background:rgba(22,163,74,.08); border-color:rgba(22,163,74,.22); }

/* --- popup de inatividade --- */
.pop-atividade{ border-color:rgba(245,158,11,.35); }
.pop-atividade.is-grave{ border-color:rgba(220,38,38,.35); }
.pop-topo{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; }
.pop-nivel{
  font-size:10px; font-weight:700; letter-spacing:.6px; text-transform:uppercase;
  color:#b45309;
}
.pop-atividade.is-grave .pop-nivel{ color:var(--err); }
.pop-esc{ font-size:10px; color:var(--txt-mute); }
.pop-num{ font-size:12.6px; color:var(--txt-dim); margin:2px 0 8px; }
.pop-nota{
  margin-top:10px; padding-top:9px; border-top:1px solid var(--line-soft);
  font-size:11px; line-height:1.5; color:var(--txt-mute);
}
.popup .acts button.secundario{
  background:transparent; border:1px solid var(--line); color:var(--txt-dim);
}
.popup .acts button.secundario:hover{ background:var(--panel-2); color:var(--txt); }

/* --------------------- trilha de auditoria (§55) --------------------- */
.aud-row{ grid-template-columns:1.1fr 1.2fr 1.1fr 2.2fr; align-items:start; font-size:12.8px; }
.aud-head{ cursor:default; }
.aud-det{ color:var(--txt-mute); font-size:11.8px; overflow-wrap:anywhere; }

/* Motor de IA: leitura, não edição. Numa SaaS quem paga a inferência é o
   provedor — mostrar os parâmetros informa; deixá-los editáveis mentiria. */
.adm-motor{
  display:flex; flex-direction:column; gap:12px;
  background:var(--panel); border:1px solid var(--line-soft);
  border-radius:var(--radius); padding:16px 18px; box-shadow:var(--sh-sm);
}
.cfg-motor{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:12px;
}
.cfg-motor li{ display:flex; flex-direction:column; gap:1px; min-width:0; }
.cfg-motor b{ font-size:14px; font-weight:600; overflow-wrap:anywhere; }
.cfg-motor span{
  font-size:10.6px; text-transform:uppercase; letter-spacing:.6px; color:var(--txt-mute);
}

/* credenciais fora da interface (§9) */
.adm-cred{
  display:flex; flex-direction:column; gap:4px;
  background:var(--panel-2); border:1px solid var(--line-soft);
  border-radius:10px; padding:12px 14px;
}
.adm-cred strong{ font-size:12.4px; color:var(--txt); }
.adm-cred small{ font-size:12px; color:var(--txt-dim); line-height:1.5; }

@media (max-width:760px){
  .modal-grid{ grid-template-columns:1fr; }
  .dash-grid{ grid-template-columns:1fr; }
  .kb-filtro{ max-width:none; width:100%; }

  /* Tabela de seis colunas em 360px vira seis colunas ilegíveis. Empilhar é
     o que mantém a informação utilizável — e o cabeçalho perde o sentido. */
  .proc-row, .aud-row{ grid-template-columns:1fr; gap:3px; }
  .proc-head, .aud-head{ display:none; }
  .proc-row span:empty{ display:none; }
  .aud-row span:first-child{ font-size:11.4px; color:var(--txt-mute); }

  .adm-row{ grid-template-columns:1fr auto; gap:6px 10px; }
  .adm-row .col-email, .adm-row .col-last{ display:none; }

  .pd-meta{ grid-template-columns:1fr 1fr; }
  .modal-acoes{ justify-content:stretch; }
  .modal-acoes .btn{ flex:1; }
}
