/* ==========================================================================
   BRINDEFLY — Painel /adminweb
   ========================================================================== */
:root{
  --bg:#0a0f22;
  --surface:#111831;
  --surface-2:#161f3d;
  --line:#222d52;
  --ink:#eef1ff;
  --ink-2:#aeb8de;
  --muted:#7d88b3;
  --blue:#3f6bff;
  --blue-2:#083fc9;
  --yellow:#fcbe2c;
  --ok:#2fbf71;
  --err:#ff5c7a;
  --s-qual:#5b86ff;   /* série: qualificado (validado p/ daltonismo) */
  --s-nutr:#b98208;   /* série: nutrição */
  --corte:#fcbe2c;    /* linha da nota de corte */
  --radius:16px;
}
*,*::before,*::after{ box-sizing:border-box; }
html,body{ margin:0; }
body{
  background:var(--bg);
  color:var(--ink);
  font:15px/1.5 "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; }
button,input,select,textarea{ font:inherit; color:inherit; }
[hidden]{ display:none !important; }
/* <img> têm width/height no HTML; o tamanho real continua vindo do CSS */
img{ width:auto; height:auto; }

/* ==========================================================================
   LOGIN
   ========================================================================== */
.lg{
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px 16px;
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.lg__bg{ position:fixed; inset:0; z-index:-1; overflow:hidden; }
.lg__blob{
  position:absolute;
  border-radius:50%;
  filter:blur(70px);
  opacity:.55;
  animation:lg-float 18s ease-in-out infinite alternate;
}
.lg__blob--1{ width:520px; height:520px; background:#083fc9; top:-160px; left:-120px; }
.lg__blob--2{ width:380px; height:380px; background:#fcbe2c; bottom:-140px; right:-80px; opacity:.28; animation-duration:22s; animation-delay:-6s; }
.lg__blob--3{ width:300px; height:300px; background:#5b3cff; top:40%; left:55%; opacity:.3; animation-duration:26s; animation-delay:-12s; }
@keyframes lg-float{
  0%{ transform:translate(0,0) scale(1); }
  50%{ transform:translate(60px,40px) scale(1.12); }
  100%{ transform:translate(-40px,80px) scale(.95); }
}
.lg__grid{
  position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
                   linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size:48px 48px;
  mask-image:radial-gradient(ellipse at center, #000 20%, transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse at center, #000 20%, transparent 75%);
}
.lg__spark{
  position:absolute;
  width:6px; height:6px;
  border-radius:50%;
  background:var(--yellow);
  opacity:0;
  animation:lg-spark 7s linear infinite;
}
@keyframes lg-spark{
  0%{ opacity:0; transform:translateY(0) scale(.6); }
  15%{ opacity:.9; }
  100%{ opacity:0; transform:translateY(-60vh) scale(1.2); }
}

.lg__card{
  width:100%;
  max-width:420px;
  padding:40px 36px 32px;
  border-radius:24px;
  background:rgba(17,24,49,.72);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 30px 80px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  animation:lg-card-in .8s cubic-bezier(.2,.9,.25,1) both;
  transition:transform .6s cubic-bezier(.6,0,.4,1), opacity .5s;
}
@keyframes lg-card-in{
  from{ opacity:0; transform:translateY(40px) scale(.96); }
  to{ opacity:1; transform:none; }
}
.lg__card > *{ animation:lg-item-in .6s cubic-bezier(.2,.9,.25,1) both; }
.lg__card > *:nth-child(1){ animation-delay:.15s; }
.lg__card > *:nth-child(2){ animation-delay:.22s; }
.lg__card > *:nth-child(3){ animation-delay:.29s; }
.lg__card > *:nth-child(4){ animation-delay:.36s; }
.lg__card > *:nth-child(5){ animation-delay:.43s; }
.lg__card > *:nth-child(6){ animation-delay:.50s; }
@keyframes lg-item-in{
  from{ opacity:0; transform:translateY(14px); }
  to{ opacity:1; transform:none; }
}
.lg__logo{ display:block; height:40px; margin:0 auto 22px; }
.lg__title{ margin:0; text-align:center; font-size:22px; font-weight:700; }
.lg__sub{ margin:4px 0 26px; text-align:center; color:var(--muted); font-size:14px; }

.lg__field{ position:relative; margin-bottom:16px; }
.lg__field input{
  width:100%;
  height:56px;
  padding:22px 16px 6px 46px;
  border-radius:14px;
  border:1px solid var(--line);
  background:rgba(10,15,34,.6);
  outline:none;
  transition:border-color .25s, box-shadow .25s, background .25s;
}
.lg__field input:focus{
  border-color:var(--blue);
  box-shadow:0 0 0 4px rgba(63,107,255,.18);
  background:rgba(10,15,34,.85);
}
.lg__field label{
  position:absolute;
  left:46px; top:17px;
  color:var(--muted);
  pointer-events:none;
  transition:transform .2s, font-size .2s, top .2s, color .2s;
}
.lg__field input:focus + label,
.lg__field input:not(:placeholder-shown) + label{
  top:8px;
  font-size:11.5px;
  color:var(--ink-2);
  letter-spacing:.02em;
}
.lg__field svg{
  position:absolute; left:15px; top:18px;
  width:20px; height:20px;
  stroke:var(--muted);
  transition:stroke .25s;
}
.lg__field input:focus ~ svg{ stroke:var(--yellow); }
.lg__eye{
  position:absolute; right:10px; top:10px;
  width:36px; height:36px;
  border:0; background:none; cursor:pointer;
  color:var(--muted); border-radius:10px;
}
.lg__eye:hover{ color:var(--ink); background:rgba(255,255,255,.05); }
.lg__eye svg{ position:static; width:20px; height:20px; stroke:currentColor; }

.lg__msg{
  margin:0 0 14px;
  padding:10px 14px;
  border-radius:12px;
  background:rgba(255,92,122,.12);
  color:#ff9fb1;
  font-size:13.5px;
  text-align:center;
}
.lg__msg.is-in{ animation:lg-item-in .35s both; }

.lg__btn{
  position:relative;
  width:100%;
  height:54px;
  margin-top:6px;
  border:0;
  border-radius:14px;
  background:linear-gradient(135deg, #3f6bff, #083fc9);
  color:#fff;
  font-weight:600;
  font-size:15.5px;
  cursor:pointer;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(8,63,201,.45);
  transition:transform .15s, box-shadow .25s, width .45s cubic-bezier(.6,0,.4,1), border-radius .45s, background .3s;
}
.lg__btn::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(110deg, transparent 30%, rgba(255,255,255,.28) 50%, transparent 70%);
  transform:translateX(-100%);
  transition:transform .8s;
}
.lg__btn:hover::after{ transform:translateX(100%); }
.lg__btn:hover{ box-shadow:0 14px 36px rgba(8,63,201,.6); }
.lg__btn:active{ transform:scale(.98); }
.lg__btn-spin, .lg__btn-check{ display:none; }
.lg__btn.is-loading .lg__btn-txt{ display:none; }
.lg__btn.is-loading .lg__btn-spin{
  display:inline-block;
  width:22px; height:22px;
  border:2.5px solid rgba(255,255,255,.35);
  border-top-color:#fff;
  border-radius:50%;
  animation:lg-spin .7s linear infinite;
  vertical-align:middle;
}
@keyframes lg-spin{ to{ transform:rotate(360deg); } }
.lg__btn.is-ok{
  width:54px;
  margin-left:calc(50% - 27px);
  border-radius:50%;
  background:var(--ok);
  box-shadow:0 0 0 10px rgba(47,191,113,.15);
}
.lg__btn.is-ok .lg__btn-txt, .lg__btn.is-ok .lg__btn-spin{ display:none; }
.lg__btn.is-ok .lg__btn-check{ display:inline-block; vertical-align:middle; }
.lg__btn-check path{
  stroke-dasharray:30;
  stroke-dashoffset:30;
  animation:lg-draw .4s .25s ease forwards;
}
@keyframes lg-draw{ to{ stroke-dashoffset:0; } }

.lg__card.is-shake{ animation:lg-shake .45s; }
@keyframes lg-shake{
  15%,55%{ transform:translateX(-10px); }
  35%,75%{ transform:translateX(10px); }
}
.lg__card.is-leaving{ transform:scale(1.06); opacity:0; }
.lg__wipe{
  position:fixed; inset:0;
  background:var(--bg);
  opacity:0;
  pointer-events:none;
  transition:opacity .45s .35s;
  z-index:10;
}
.lg__wipe.is-on{ opacity:1; }
.lg__foot{ margin:22px 0 0; text-align:center; color:var(--muted); font-size:12.5px; }
.lg__foot a{ color:var(--ink-2); text-decoration:none; }
.lg__foot a:hover{ color:var(--yellow); }

@media (prefers-reduced-motion: reduce){
  .lg__blob, .lg__spark, .lg__card, .lg__card > *{ animation:none !important; }
}

/* ==========================================================================
   LAYOUT DO PAINEL
   ========================================================================== */
.ad{
  display:grid;
  grid-template-columns:248px minmax(0,1fr);
  min-height:100vh;
  animation:ad-in .5s ease both;
}
@keyframes ad-in{ from{ opacity:0; } to{ opacity:1; } }
.ad__side{
  position:sticky; top:0;
  height:100vh;
  display:flex;
  flex-direction:column;
  padding:24px 16px;
  border-right:1px solid var(--line);
  background:#0c1229;
}
.ad__logo{ height:34px; margin:4px 10px 28px; align-self:flex-start; }
.ad__nav{ display:flex; flex-direction:column; gap:4px; }
.ad__nav a{
  display:flex; align-items:center; gap:12px;
  padding:11px 12px;
  border-radius:12px;
  color:var(--ink-2);
  text-decoration:none;
  font-weight:500;
  transition:background .2s, color .2s;
}
.ad__nav a svg{ width:20px; height:20px; stroke:currentColor; flex:none; }
.ad__nav a:hover{ background:var(--surface-2); color:var(--ink); }
.ad__nav a.is-on{ background:rgba(252,190,44,.1); color:var(--yellow); }
.ad__nav-sep{ height:1px; background:var(--line); margin:12px 8px; }
.ad__badge{
  margin-left:auto;
  min-width:22px; padding:1px 7px;
  border-radius:20px;
  background:var(--yellow); color:#061e4c;
  font-size:11.5px; font-weight:700; text-align:center;
}
.ad__user{
  margin-top:auto;
  display:flex; align-items:center; gap:10px;
  padding:12px;
  border-radius:12px;
  background:var(--surface);
  font-size:13px;
}
.ad__avatar{
  width:34px; height:34px; flex:none;
  display:grid; place-items:center;
  border-radius:50%;
  background:linear-gradient(135deg, var(--yellow), #ff9d2c);
  color:#061e4c; font-weight:700;
}
.ad__user small{ display:block; color:var(--muted); }

.ad__main{ padding:28px 32px 48px; min-width:0; }
.ad__top{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  flex-wrap:wrap;
  margin-bottom:24px;
}
.ad__h1{ margin:0; font-size:26px; font-weight:700; letter-spacing:-.01em; }
.ad__lead{ margin:2px 0 0; color:var(--muted); font-size:14px; }
.ad__menu-btn{ display:none; }

/* Blocos */
.card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:22px;
  min-width:0;
}
.card__title{
  display:flex; align-items:center; gap:10px;
  margin:0 0 4px;
  font-size:16px; font-weight:600;
}
.card__title::before{
  content:""; width:10px; height:10px; border-radius:3px; background:var(--yellow); flex:none;
}
.card__sub{ margin:0 0 18px; color:var(--muted); font-size:13px; }
.grid{ display:grid; gap:18px; }
.grid--kpi{ grid-template-columns:repeat(4, minmax(0,1fr)); }
.grid--2{ grid-template-columns:repeat(2, minmax(0,1fr)); }
.grid--3-1{ grid-template-columns:minmax(0,2fr) minmax(0,1fr); }
.mt{ margin-top:18px; }

.kpi__label{ color:var(--muted); font-size:13px; font-weight:500; }
.kpi__value{ margin-top:6px; font-size:32px; font-weight:700; line-height:1.1; letter-spacing:-.02em; }
.kpi__foot{ margin-top:6px; color:var(--ink-2); font-size:12.5px; }
.kpi__value small{ font-size:15px; color:var(--muted); font-weight:500; }

.chart{ position:relative; height:280px; }
.chart--sm{ height:220px; }
.legend{ display:flex; flex-wrap:wrap; gap:16px; margin:-6px 0 12px; color:var(--ink-2); font-size:13px; }
.legend i{ display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:7px; vertical-align:0; }

/* Filtros / botões */
.seg{ display:inline-flex; padding:4px; border-radius:12px; background:var(--surface); border:1px solid var(--line); }
.seg a{
  padding:7px 14px; border-radius:9px;
  color:var(--ink-2); text-decoration:none; font-size:13.5px; font-weight:500;
}
.seg a.is-on{ background:var(--surface-2); color:var(--ink); box-shadow:inset 0 0 0 1px var(--line); }
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  height:42px; padding:0 18px;
  border:1px solid transparent; border-radius:12px;
  background:var(--blue); color:#fff;
  font-weight:600; font-size:14px;
  text-decoration:none; cursor:pointer;
  transition:filter .2s, background .2s;
}
.btn:hover{ filter:brightness(1.1); }
.btn--ghost{ background:transparent; border-color:var(--line); color:var(--ink-2); }
.btn--ghost:hover{ color:var(--ink); border-color:var(--muted); }
.btn--yellow{ background:var(--yellow); color:#061e4c; }
.btn--danger{ background:transparent; border-color:rgba(255,92,122,.4); color:#ff8ea3; }
.btn--danger:hover{ background:rgba(255,92,122,.1); }
.btn svg{ width:18px; height:18px; stroke:currentColor; }

/* Tabelas */
.tbl-wrap{ overflow-x:auto; margin:0 -22px -22px; }
.tbl{ width:100%; border-collapse:collapse; font-size:14px; }
.tbl th{
  padding:12px 22px;
  text-align:left;
  color:var(--muted);
  font-size:11.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  border-bottom:1px solid var(--line);
  white-space:nowrap;
}
.tbl td{ padding:13px 22px; border-bottom:1px solid var(--line); vertical-align:middle; }
.tbl tr:last-child td{ border-bottom:0; }
.tbl tbody tr{ transition:background .15s; }
.tbl tbody tr[data-href]{ cursor:pointer; }
.tbl tbody tr:hover{ background:rgba(255,255,255,.025); }
.tbl .num{ text-align:right; font-variant-numeric:tabular-nums; }
.tbl__who strong{ display:block; font-weight:600; }
.tbl__who span{ color:var(--muted); font-size:12.5px; }
.tbl-empty{ padding:40px 22px; text-align:center; color:var(--muted); }

/* Selos */
.tag{
  display:inline-flex; align-items:center; gap:6px;
  padding:3px 10px;
  border-radius:20px;
  font-size:12px; font-weight:600;
  white-space:nowrap;
}
.tag::before{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; }
.tag--q{ background:rgba(91,134,255,.14); color:#9db6ff; }
.tag--n{ background:rgba(185,130,8,.16); color:#e2b04d; }
.tag--st{ background:var(--surface-2); color:var(--ink-2); }
.tag--st::before{ display:none; }
.score{
  display:inline-flex; align-items:center; gap:8px;
  font-weight:700; font-variant-numeric:tabular-nums;
}
.score__bar{ width:56px; height:6px; border-radius:6px; background:var(--surface-2); overflow:hidden; }
.score__bar i{ display:block; height:100%; border-radius:6px; }

/* Formulários */
.fld{ display:flex; flex-direction:column; gap:7px; margin-bottom:18px; }
.fld label{ font-weight:500; font-size:14px; }
.fld small{ color:var(--muted); font-size:12.5px; }
.inp{
  width:100%;
  min-height:46px;
  padding:11px 14px;
  border-radius:12px;
  border:1px solid var(--line);
  background:var(--bg);
  outline:none;
  transition:border-color .2s, box-shadow .2s;
}
.inp:focus{ border-color:var(--blue); box-shadow:0 0 0 3px rgba(63,107,255,.2); }
textarea.inp{ resize:vertical; min-height:110px; line-height:1.55; }
select.inp{ appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%237d88b3' stroke-width='2'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; padding-right:36px; }
.counter{ align-self:flex-end; color:var(--muted); font-size:12px; margin-top:-2px; }
.counter.is-over{ color:#ffb35c; }
.form-actions{ display:flex; gap:10px; flex-wrap:wrap; }

.alert{
  display:flex; gap:10px; align-items:flex-start;
  padding:12px 16px; margin-bottom:18px;
  border-radius:12px; font-size:14px;
  animation:lg-item-in .35s both;
}
.alert--ok{ background:rgba(47,191,113,.12); color:#7fe0aa; }
.alert--err{ background:rgba(255,92,122,.12); color:#ff9fb1; }
.alert--info{ background:rgba(252,190,44,.1); color:#ffd77a; }

/* Tabs */
.tabs{ display:flex; gap:4px; border-bottom:1px solid var(--line); margin-bottom:22px; overflow-x:auto; }
.tabs a{
  padding:10px 16px;
  color:var(--muted); text-decoration:none; font-weight:500; white-space:nowrap;
  border-bottom:2px solid transparent; margin-bottom:-1px;
}
.tabs a.is-on{ color:var(--ink); border-bottom-color:var(--yellow); }

/* Upload / previews de compartilhamento */
.drop{
  position:relative;
  display:block;
  border:1.5px dashed var(--line);
  border-radius:14px;
  overflow:hidden;
  cursor:pointer;
  transition:border-color .2s;
}
.drop:hover, .drop.is-over{ border-color:var(--yellow); }
.drop img{ display:block; width:100%; aspect-ratio:1200/630; object-fit:cover; }
.drop__hint{
  position:absolute; inset:auto 0 0 0;
  padding:10px 14px;
  background:linear-gradient(transparent, rgba(0,0,0,.75));
  color:#fff; font-size:13px;
}
.drop input{ position:absolute; opacity:0; inset:0; cursor:pointer; }

.pv-label{ margin:0 0 8px; color:var(--muted); font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.pv-wa{
  max-width:420px;
  padding:6px;
  border-radius:10px;
  background:#005c4b;
  margin-bottom:22px;
}
.pv-wa__box{ border-radius:8px; overflow:hidden; background:#025144; }
.pv-wa img{ display:block; width:100%; aspect-ratio:1200/630; object-fit:cover; }
.pv-wa__txt{ padding:8px 10px; }
.pv-wa__t{ color:#e9edef; font-size:14px; font-weight:600; line-height:1.3; }
.pv-wa__d{ color:#aebac1; font-size:12.5px; line-height:1.35; margin-top:2px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.pv-wa__u{ color:#8696a0; font-size:12px; margin-top:4px; }
.pv-wa__link{ color:#53bdeb; font-size:14px; padding:6px 6px 2px; word-break:break-all; }

.pv-fb{ max-width:500px; border:1px solid #3e4042; border-radius:8px; overflow:hidden; background:#242526; margin-bottom:22px; }
.pv-fb img{ display:block; width:100%; aspect-ratio:1200/630; object-fit:cover; }
.pv-fb__txt{ padding:10px 12px; background:#3a3b3c; }
.pv-fb__u{ color:#b0b3b8; font-size:12px; text-transform:uppercase; }
.pv-fb__t{ color:#e4e6eb; font-size:16px; font-weight:600; line-height:1.3; margin-top:3px; }
.pv-fb__d{ color:#b0b3b8; font-size:14px; line-height:1.35; margin-top:3px; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }

.pv-g{ max-width:600px; padding:16px 18px; border-radius:12px; background:#fff; font-family:Arial, sans-serif; }
.pv-g__u{ color:#202124; font-size:13px; }
.pv-g__t{ color:#1a0dab; font-size:19px; line-height:1.3; margin-top:4px; }
.pv-g__d{ color:#4d5156; font-size:14px; line-height:1.5; margin-top:3px; }

/* Detalhe do lead */
.dl{ display:grid; grid-template-columns:150px minmax(0,1fr); gap:10px 16px; margin:0; font-size:14px; }
.dl dt{ color:var(--muted); }
.dl dd{ margin:0; word-break:break-word; }
.crit{ display:flex; flex-direction:column; gap:14px; }
.crit__row{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 12px; align-items:center; font-size:14px; }
.crit__row span{ color:var(--muted); font-size:12.5px; }
.crit__bar{ grid-column:1 / -1; height:8px; border-radius:8px; background:var(--surface-2); overflow:hidden; }
.crit__bar i{ display:block; height:100%; border-radius:8px; background:var(--s-qual); transform-origin:left; animation:bar-grow .8s cubic-bezier(.2,.9,.25,1) both; }
@keyframes bar-grow{ from{ transform:scaleX(0); } }
.big-score{ display:flex; align-items:baseline; gap:8px; }
.big-score b{ font-size:46px; line-height:1; letter-spacing:-.03em; }
.big-score span{ color:var(--muted); }

.toolbar{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:18px; }
.toolbar .inp{ width:auto; min-height:42px; }
.toolbar .search{ flex:1; min-width:200px; }
.pager{ display:flex; gap:6px; justify-content:center; margin-top:18px; }
.pager a, .pager span{ min-width:38px; height:38px; display:grid; place-items:center; padding:0 10px; border-radius:10px; border:1px solid var(--line); text-decoration:none; color:var(--ink-2); font-size:13.5px; }
.pager span{ background:var(--surface-2); color:var(--ink); }

.rule{ padding:16px 18px; border-radius:14px; border-left:4px solid var(--yellow); background:var(--surface-2); font-size:14px; color:var(--ink-2); }
.rule strong{ color:var(--ink); }

/* Responsivo */
@media (max-width:1100px){
  .grid--kpi{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .grid--3-1{ grid-template-columns:minmax(0,1fr); }
}
@media (max-width:860px){
  .ad{ grid-template-columns:minmax(0,1fr); }
  .ad__side{
    position:fixed; left:0; top:0; z-index:50;
    width:260px;
    transform:translateX(-100%);
    transition:transform .3s;
  }
  .ad.is-menu .ad__side{ transform:none; box-shadow:0 0 0 100vmax rgba(0,0,0,.5); }
  .ad__main{ padding:18px 16px 40px; }
  .ad__menu-btn{
    display:inline-grid; place-items:center;
    width:42px; height:42px;
    border-radius:12px; border:1px solid var(--line);
    background:var(--surface); cursor:pointer;
  }
  .ad__menu-btn svg{ width:22px; height:22px; stroke:var(--ink); }
  .grid--2{ grid-template-columns:minmax(0,1fr); }
  .ad__h1{ font-size:22px; }
  .dl{ grid-template-columns:minmax(0,1fr); gap:2px; }
  .dl dd{ margin-bottom:10px; }
}
@media (max-width:520px){
  .grid--kpi{ gap:12px; }
  .card{ padding:16px; }
  .tbl-wrap{ margin:0 -16px -16px; }
  .kpi__value{ font-size:26px; }
  .tbl th, .tbl td{ padding:11px 14px; }
}
.crit__row strong span{ margin-left:4px; font-weight:500; }
.tbl td{ white-space:nowrap; }
.tbl td.tbl__who{ white-space:normal; min-width:170px; }


/* ==========================================================================
   TEMA CLARO — <html data-theme="claro">
   Mesmas regras do tema escuro; só as cores mudam. As séries dos gráficos
   têm tons próprios, validados contra o fundo branco (daltonismo/contraste).
   ========================================================================== */
html{ color-scheme:dark; }
html[data-theme="claro"]{
  color-scheme:light;
  --bg:#f3f5fb;
  --surface:#ffffff;
  --surface-2:#eef1f8;
  --line:#e0e5f0;
  --ink:#0d1633;
  --ink-2:#44507a;
  --muted:#6b769c;
  --blue:#083fc9;
  --s-qual:#2f5fe0;
  --s-nutr:#b07800;
  --corte:#0d1633;
}
html{ transition:background-color .3s; }
body, .card, .ad__side, .inp, .btn, .tag, .seg, .ad__user{ transition:background-color .3s, border-color .3s, color .3s; }

[data-theme="claro"] .ad__side{ background:#ffffff; }
[data-theme="claro"] .ad__nav a.is-on{ background:rgba(8,63,201,.08); color:#083fc9; }
[data-theme="claro"] .ad__user{ background:var(--surface-2); }
[data-theme="claro"] .card{ box-shadow:0 1px 2px rgba(13,22,51,.04), 0 6px 20px rgba(13,22,51,.04); }
[data-theme="claro"] .card__title::before{ background:#083fc9; }
[data-theme="claro"] .tabs a.is-on{ border-bottom-color:#083fc9; }
[data-theme="claro"] .inp{ background:#fff; }
[data-theme="claro"] .tag--q{ background:rgba(47,95,224,.1); color:#1f47b8; }
[data-theme="claro"] .tag--n{ background:rgba(176,120,0,.12); color:#855a00; }
[data-theme="claro"] .alert--ok{ background:#e6f7ee; color:#136c3e; }
[data-theme="claro"] .alert--err{ background:#fdecef; color:#b3243f; }
[data-theme="claro"] .alert--info{ background:#fff5da; color:#7a5500; }
[data-theme="claro"] .btn--danger{ color:#c0264a; border-color:rgba(192,38,74,.35); }
[data-theme="claro"] .counter.is-over{ color:#b35c00; }
[data-theme="claro"] .tbl tbody tr:hover{ background:#f7f9fd; }
[data-theme="claro"] .rule{ border-left-color:#083fc9; }
[data-theme="claro"] .ad.is-menu .ad__side{ box-shadow:0 0 0 100vmax rgba(13,22,51,.35); }

/* login claro */
[data-theme="claro"] .lg{ background:#eef2ff; }
[data-theme="claro"] .lg__blob--1{ background:#6f93ff; opacity:.45; }
[data-theme="claro"] .lg__blob--2{ background:#fcbe2c; opacity:.4; }
[data-theme="claro"] .lg__blob--3{ background:#b7a6ff; opacity:.4; }
[data-theme="claro"] .lg__grid{
  background-image:linear-gradient(rgba(8,63,201,.06) 1px, transparent 1px),
                   linear-gradient(90deg, rgba(8,63,201,.06) 1px, transparent 1px);
}
[data-theme="claro"] .lg__card{
  background:rgba(255,255,255,.78);
  border-color:rgba(255,255,255,.9);
  box-shadow:0 30px 80px rgba(8,63,201,.18), inset 0 1px 0 #fff;
}
[data-theme="claro"] .lg__field input{ background:rgba(255,255,255,.85); }
[data-theme="claro"] .lg__field input:focus{ background:#fff; }
[data-theme="claro"] .lg__field input:focus ~ svg{ stroke:#083fc9; }
[data-theme="claro"] .lg__msg{ background:#fdecef; color:#b3243f; }
[data-theme="claro"] .lg__foot a:hover{ color:#083fc9; }
[data-theme="claro"] .lg__eye:hover{ background:rgba(8,63,201,.06); }
[data-theme="claro"] .lg__wipe{ background:var(--bg); }
.lg__logo--claro{ display:none; }
[data-theme="claro"] .lg__logo--escuro, [data-theme="claro"] .ad__logo--escuro{ display:none; }
[data-theme="claro"] .lg__logo--claro, [data-theme="claro"] .ad__logo--claro{ display:block; }
.ad__logo--claro{ display:none; }

/* Botão de alternar tema */
.theme-sw{
  display:flex;
  padding:4px;
  margin:0 0 12px;
  border-radius:12px;
  background:var(--surface-2);
  border:1px solid var(--line);
}
.theme-sw button{
  flex:1;
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  height:34px;
  border:0; border-radius:9px;
  background:transparent;
  color:var(--muted);
  font-size:13px; font-weight:500;
  cursor:pointer;
  transition:background .2s, color .2s, box-shadow .2s;
}
.theme-sw button svg{ width:16px; height:16px; stroke:currentColor; }
.theme-sw button[aria-pressed="true"]{ background:var(--surface); color:var(--ink); box-shadow:0 1px 3px rgba(0,0,0,.15); }
.lg__theme{ position:fixed; top:16px; right:16px; z-index:5; margin:0; min-width:190px; background:rgba(127,127,127,.12); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }

/* Resultado do teste de SMTP */
.smtp-log{
  margin:12px 0 0;
  padding:12px 14px;
  max-height:220px;
  overflow:auto;
  border-radius:12px;
  background:var(--bg);
  border:1px solid var(--line);
  color:var(--ink-2);
  font:12px/1.55 ui-monospace, SFMono-Regular, Menlo, monospace;
  white-space:pre-wrap;
  word-break:break-all;
}
.radio-cards{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.radio-card{ position:relative; cursor:pointer; }
.radio-card input{ position:absolute; opacity:0; }
.radio-card span{
  display:block; height:100%;
  padding:12px 14px;
  border:1px solid var(--line); border-radius:12px;
  font-size:13px; color:var(--muted);
  transition:border-color .2s, background .2s;
}
.radio-card strong{ display:block; color:var(--ink); font-size:14px; margin-bottom:2px; }
.radio-card input:checked + span{ border-color:var(--blue); background:rgba(63,107,255,.08); }
.radio-card input:focus-visible + span{ outline:2px solid var(--blue); outline-offset:2px; }
.pill-state{ display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border-radius:20px; font-size:12px; font-weight:600; }
.pill-state--real{ background:rgba(47,191,113,.14); color:#3fd184; }
.pill-state--teste{ background:rgba(252,190,44,.14); color:#e9ad1c; }
[data-theme="claro"] .pill-state--real{ color:#137a43; }
[data-theme="claro"] .pill-state--teste{ color:#8a6100; }
.row-actions{ display:flex; gap:8px; justify-content:flex-end; }
.btn--sm{ height:34px; padding:0 12px; font-size:13px; border-radius:10px; }
@media (max-width:520px){ .radio-cards{ grid-template-columns:1fr; } }
.grid--smtp{ grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1.3fr); gap:0 14px; }
@media (max-width:640px){ .grid--smtp{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); } .grid--smtp > :first-child{ grid-column:1 / -1; } }


/* ==========================================================================
   KANBAN
   ========================================================================== */
.kb-bar{ display:flex; flex-wrap:wrap; gap:10px 14px; align-items:center; margin-bottom:16px; }
.kb-search{
  position:relative; flex:1; min-width:220px; max-width:420px;
}
.kb-search svg{ position:absolute; left:13px; top:50%; width:18px; height:18px; transform:translateY(-50%); stroke:var(--muted); pointer-events:none; }
.kb-search input{
  width:100%; height:42px; padding:0 14px 0 40px;
  border:1px solid var(--line); border-radius:12px;
  background:var(--surface); outline:none;
  transition:border-color .2s, box-shadow .2s;
}
.kb-search input:focus{ border-color:var(--blue); box-shadow:0 0 0 3px rgba(63,107,255,.2); }
.kb-stats{ margin-left:auto; display:flex; flex-wrap:wrap; gap:6px 18px; color:var(--muted); font-size:13px; }
.kb-stats b{ color:var(--ink); font-size:15px; margin-right:3px; }

/* quadro: colunas se ajustam à largura; abaixo do mínimo, rola na horizontal */
.kb{
  display:flex;
  gap:14px;
  overflow-x:auto;
  overflow-y:hidden;
  padding-bottom:6px;
  scroll-snap-type:x proximity;
  overscroll-behavior-x:contain;
  scrollbar-width:thin;
}
.kb-col{
  --kb-cor:#3f6bff;
  flex:1 1 0;
  min-width:208px;
  max-width:420px;
  display:flex;
  flex-direction:column;
  min-height:0;
  border-radius:16px;
  background:var(--surface);
  border:1px solid var(--line);
  border-top:3px solid var(--kb-cor);
  scroll-snap-align:start;
  transition:background .2s, border-color .2s, box-shadow .2s, min-width .25s, max-width .25s;
}
.kb-col__head{ display:flex; align-items:center; gap:8px; padding:12px 12px 2px 8px; }
.kb-col__toggle{
  width:26px; height:26px; flex:none;
  display:grid; place-items:center;
  border:0; border-radius:8px; background:transparent; color:var(--muted); cursor:pointer;
}
.kb-col__toggle:hover{ background:var(--surface-2); color:var(--ink); }
.kb-col__toggle svg{ width:16px; height:16px; stroke:currentColor; transform:rotate(90deg); transition:transform .2s; }
.kb-col__dot{ width:9px; height:9px; border-radius:50%; background:var(--kb-cor); flex:none; }
.kb-col__title{ margin:0; font-size:14.5px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kb-col__count{
  margin-left:auto;
  min-width:26px; padding:1px 8px;
  border-radius:20px;
  background:var(--surface-2);
  color:var(--ink-2);
  font-size:12px; font-weight:600; text-align:center;
}
.kb-col__sub{ margin:0; padding:0 14px 10px 42px; color:var(--muted); font-size:12px; line-height:1.35; }
.kb-col__list{
  flex:1;
  min-height:0;
  overflow-y:auto;
  padding:4px 10px 12px;
  display:flex;
  flex-direction:column;
  gap:10px;
  scrollbar-width:thin;
}
.kb-col__empty{
  display:none;
  padding:22px 10px;
  border:1.5px dashed var(--line);
  border-radius:12px;
  color:var(--muted);
  font-size:12.5px;
  text-align:center;
}
.kb-col__list > .kb-col__empty:only-child{ display:block; }

/* coluna recolhida: vira uma faixa vertical estreita */
.kb-col.is-closed{ flex:0 0 52px; min-width:52px; max-width:52px; }
.kb-col.is-closed .kb-col__head{ flex-direction:column; padding:10px 0; gap:10px; }
.kb-col.is-closed .kb-col__toggle svg{ transform:none; }
.kb-col.is-closed .kb-col__title{ writing-mode:vertical-rl; transform:rotate(180deg); overflow:visible; }
.kb-col.is-closed .kb-col__count{ margin:0; }
.kb-col.is-closed .kb-col__sub, .kb-col.is-closed .kb-col__list{ display:none; }

/* cartão */
.kb-card{
  position:relative;
  padding:12px 12px 10px;
  border-radius:12px;
  background:var(--bg);
  border:1px solid var(--line);
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
  -webkit-touch-callout:none;
  touch-action:manipulation;
  transition:border-color .15s, box-shadow .15s, transform .15s;
}
.kb-card::before{
  content:""; position:absolute; left:-1px; top:12px; bottom:12px; width:3px; border-radius:0 3px 3px 0;
  background:var(--s-nutr);
}
.kb-card.is-q::before{ background:var(--s-qual); }
.kb-card:hover{ border-color:var(--muted); box-shadow:0 4px 14px rgba(0,0,0,.18); }
.kb-card:focus-visible{ outline:2px solid var(--blue); outline-offset:2px; }
.kb-card.is-armed{ transform:scale(1.03); box-shadow:0 10px 26px rgba(0,0,0,.3); border-color:var(--blue); }
.kb-card.is-dropped{ animation:kb-drop .45s cubic-bezier(.2,1.4,.4,1); }
@keyframes kb-drop{ 0%{ transform:scale(1.05); box-shadow:0 0 0 3px rgba(63,107,255,.45); } 100%{ transform:none; } }
.kb-card__top{ display:flex; gap:10px; align-items:center; min-width:0; }
.kb-card__av{
  width:32px; height:32px; flex:none;
  display:grid; place-items:center;
  border-radius:50%;
  background:var(--surface-2); color:var(--ink-2);
  font-size:12px; font-weight:700;
}
.kb-card__who{ min-width:0; }
.kb-card__who strong{ display:block; font-size:14px; font-weight:600; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kb-card__who span{ display:block; color:var(--muted); font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kb-card__tags{ display:flex; flex-wrap:wrap; gap:5px; margin:10px 0 9px; }
.kb-card__tags .tag{ font-size:11px; padding:2px 8px; }
.kb-chip{
  display:inline-flex; align-items:center;
  padding:2px 8px; border-radius:20px;
  background:var(--surface-2); color:var(--ink-2);
  font-size:11px; font-weight:500; white-space:nowrap;
}
.kb-chip--hot{ background:rgba(252,190,44,.16); color:#e9ad1c; }
[data-theme="claro"] .kb-chip--hot{ color:#8a6100; }
.kb-card__foot{ display:flex; align-items:center; gap:10px; color:var(--muted); font-size:12px; }
.kb-card__score{ display:inline-flex; align-items:center; gap:7px; }
.kb-card__score b{ color:var(--ink); font-size:13px; }
.kb-card__score .score__bar{ width:46px; height:5px; }
.kb-card__score .score__bar i{ background:var(--s-nutr); }
.kb-card.is-q .kb-card__score .score__bar i{ background:var(--s-qual); }
.kb-card__nota{ color:var(--ink-2); }
.kb-card__foot time{ margin-left:auto; white-space:nowrap; }

/* durante o arraste */
body.kb-dragging, body.kb-dragging *{ cursor:grabbing !important; }
body.kb-dragging{ user-select:none; -webkit-user-select:none; }
.kb-card--ghost{
  position:fixed; left:0; top:0; z-index:200;
  margin:0;
  pointer-events:none;
  border-color:var(--blue);
  box-shadow:0 18px 40px rgba(0,0,0,.35);
  opacity:.96;
  will-change:transform;
}
.kb-slot{
  flex:none;
  border-radius:12px;
  border:2px dashed var(--kb-cor, var(--blue));
  background:color-mix(in srgb, var(--kb-cor, #3f6bff) 10%, transparent);
  transition:height .12s;
}
.kb-col.is-target .kb-col__list{ transition:background .2s; }
.kb-col.is-over{ border-color:var(--kb-cor); box-shadow:0 0 0 1px var(--kb-cor), 0 10px 30px rgba(0,0,0,.15); }
.kb-col.is-over .kb-col__list{ background:color-mix(in srgb, var(--kb-cor) 6%, transparent); }

/* aviso flutuante */
.kb-toast{
  position:fixed; right:20px; bottom:20px; z-index:300;
  max-width:min(420px, calc(100vw - 40px));
  padding:12px 16px;
  border-radius:12px;
  background:var(--surface); color:var(--ink);
  border:1px solid var(--line);
  box-shadow:0 12px 30px rgba(0,0,0,.3);
  font-size:14px;
  animation:lg-item-in .3s both;
}
.kb-toast--ok{ border-left:4px solid var(--ok); }
.kb-toast--err{ border-left:4px solid var(--err); }

/* ==========================================================================
   MODAL DO LEAD (Kanban)
   ========================================================================== */
.kbm{ position:fixed; inset:0; z-index:150; display:flex; align-items:center; justify-content:center; padding:24px; }
.kbm__overlay{ position:absolute; inset:0; background:rgba(5,8,20,.6); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); opacity:0; transition:opacity .2s; }
.kbm__card{
  --kb-cor:#3f6bff;
  position:relative;
  width:100%; max-width:820px;
  max-height:calc(100dvh - 48px);
  display:flex; flex-direction:column;
  border-radius:20px;
  background:var(--surface);
  border:1px solid var(--line);
  border-top:4px solid var(--kb-cor);
  box-shadow:0 30px 80px rgba(0,0,0,.45);
  outline:none;
  opacity:0; transform:translateY(16px) scale(.98);
  transition:opacity .2s, transform .25s cubic-bezier(.2,.9,.25,1);
}
.kbm.is-open .kbm__overlay{ opacity:1; }
.kbm.is-open .kbm__card{ opacity:1; transform:none; }
body.kbm-open{ overflow:hidden; }
.kbm__head{ display:flex; align-items:center; gap:14px; padding:18px 18px 14px 22px; border-bottom:1px solid var(--line); }
.kbm__avatar{
  width:46px; height:46px; flex:none;
  display:grid; place-items:center;
  border-radius:50%;
  background:linear-gradient(135deg, var(--yellow), #ff9d2c);
  color:#061e4c; font-weight:700; font-size:16px;
}
.kbm__who{ min-width:0; flex:1; }
.kbm__who h2{ margin:0; font-size:19px; line-height:1.25; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kbm__who p{ margin:2px 0 0; color:var(--muted); font-size:13.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kbm__nav{ display:flex; gap:4px; }
.kbm__icon{
  width:36px; height:36px;
  display:grid; place-items:center;
  border:1px solid var(--line); border-radius:10px;
  background:transparent; color:var(--ink-2); cursor:pointer;
}
.kbm__icon:hover:not(:disabled){ color:var(--ink); border-color:var(--muted); }
.kbm__icon:disabled{ opacity:.35; cursor:default; }
.kbm__icon svg{ width:18px; height:18px; stroke:currentColor; }
.kbm__body{ overflow-y:auto; padding:18px 22px 20px; }
.kbm__top{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:space-between; margin-bottom:20px; }
.kbm__score{ display:flex; align-items:center; gap:14px; }
.kbm__score small{ display:block; margin-top:6px; color:var(--muted); font-size:12.5px; }
.kbm__ring{ --p:0; position:relative; width:64px; height:64px; flex:none; }
.kbm__ring svg{ width:100%; height:100%; transform:rotate(-90deg); }
.kbm__ring circle{ fill:none; stroke:var(--surface-2); stroke-width:7; }
.kbm__ring .kbm__ring-val{
  stroke:var(--s-nutr); stroke-linecap:round;
  stroke-dasharray:169.6;
  stroke-dashoffset:calc(169.6 * (1 - var(--p)));
  transition:stroke-dashoffset .6s cubic-bezier(.2,.9,.25,1);
}
.kbm__ring.is-q .kbm__ring-val{ stroke:var(--s-qual); }
.kbm__ring b{ position:absolute; inset:0; display:grid; place-items:center; font-size:20px; }
.kbm__acoes{ display:flex; flex-wrap:wrap; gap:8px; }
.kbm__grid{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:22px; }
.kbm__h{ margin:0 0 12px; color:var(--muted); font-size:11.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.kbm__dl{ grid-template-columns:120px minmax(0,1fr); font-size:13.5px; }
.kbm__form{ margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }
.kbm__form-row{ display:flex; gap:14px; align-items:flex-start; }
.kbm__form-row .fld{ margin-bottom:14px; }
.kbm__form-row .fld:first-child{ width:200px; flex:none; }
.kbm__form textarea.inp{ min-height:84px; }
.kbm__foot{ display:flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:wrap; }
.kbm__salvo{ margin-right:auto; color:var(--muted); font-size:13px; }
.kbm__salvo.is-ok{ color:var(--ok); }
.kbm__salvo.is-err{ color:var(--err); }

/* ---- ajuste por tamanho de tela ---- */
@media (max-width:860px){
  .kb-stats{ margin-left:0; width:100%; }
  .kb{ gap:12px; margin:0 -16px; padding:0 16px 6px; scroll-padding:0 16px; scroll-snap-type:x mandatory; }
  .kb-col{ flex:0 0 min(84vw, 340px); min-width:0; max-width:none; }
  .kb-col.is-closed{ flex:0 0 52px; }
}
@media (max-width:680px){
  .kbm{ padding:0; align-items:flex-end; }
  .kbm__card{ max-height:92dvh; border-radius:20px 20px 0 0; transform:translateY(40px); }
  .kbm__grid{ grid-template-columns:minmax(0,1fr); }
  .kbm__form-row{ flex-direction:column; gap:0; }
  .kbm__form-row .fld:first-child{ width:100%; }
  .kbm__head{ padding:14px 12px 12px 16px; }
  .kbm__body{ padding:16px; }
  .kbm__nav [data-kbm-nav]{ display:none; }
  .kbm__dl{ grid-template-columns:minmax(0,1fr); }
}
@media (prefers-reduced-motion: reduce){
  .kb-card.is-dropped{ animation:none; }
  .kbm__card, .kbm__overlay{ transition:none; }
}
/* notebooks (≈1280 px): colunas mais compactas para as 5 etapas caberem */
@media (min-width:861px) and (max-width:1400px){
  .kb{ gap:10px; }
  .kb-col{ min-width:178px; }
  .kb-col__list{ padding:4px 8px 10px; }
  .kb-card{ padding:10px 10px 9px; }
  .kb-card__av{ width:28px; height:28px; font-size:11px; }
  .kb-col__sub{ padding-left:36px; }
}


/* ==========================================================================
   MENU LATERAL RECOLHÍVEL (.ad.is-collapsed) + TOOLTIPS
   ========================================================================== */
.ad__brand{ display:flex; align-items:center; gap:8px; margin:4px 0 28px; }
.ad__brand .ad__logo{ margin:0 0 0 10px; }
.ad__mark{ display:none; width:34px; height:34px; border-radius:9px; }
.ad__collapse{
  margin-left:auto;
  width:34px; height:34px; flex:none;
  display:grid; place-items:center;
  border:1px solid transparent; border-radius:10px;
  background:transparent; color:var(--muted);
  cursor:pointer;
  transition:background .2s, color .2s, border-color .2s;
}
.ad__collapse:hover, .ad__collapse:focus-visible{ background:var(--surface-2); color:var(--ink); border-color:var(--line); }
.ad__collapse svg{ width:20px; height:20px; stroke:currentColor; transition:transform .28s; }
.ad__label{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ad__nav a{ position:relative; }
.ad__user{ position:relative; min-width:0; }
.ad__user .ad__label{ min-width:0; }

@media (min-width:861px){
  .ad{ transition:grid-template-columns .28s cubic-bezier(.4,0,.2,1); }
  .ad__side{ z-index:20; transition:padding .28s; }

  .ad.is-collapsed{ grid-template-columns:76px minmax(0,1fr); }
  .ad.is-collapsed .ad__side{ padding:20px 12px; }
  .ad.is-collapsed .ad__brand{ flex-direction:column; gap:12px; margin-bottom:22px; }
  .ad.is-collapsed .ad__logo{ display:none !important; }
  .ad.is-collapsed .ad__mark{ display:block; }
  .ad.is-collapsed .ad__collapse{ margin:0; }
  .ad.is-collapsed .ad__collapse svg{ transform:scaleX(-1); }
  .ad.is-collapsed .ad__label{ display:none; }
  .ad.is-collapsed .ad__nav a{ justify-content:center; padding:11px 0; }
  .ad.is-collapsed .ad__nav-sep{ margin:12px 4px; }
  /* contador de leads novos vira um pontinho sobre o ícone */
  .ad.is-collapsed .ad__badge{
    position:absolute; top:5px; right:9px;
    min-width:0; width:9px; height:9px; padding:0;
    font-size:0; border:2px solid var(--surface);
  }
  .ad.is-collapsed .theme-sw{ flex-direction:column; gap:2px; }
  .ad.is-collapsed .theme-sw button{ height:32px; }
  .ad.is-collapsed .ad__user{ justify-content:center; padding:8px 0; }

  /* tooltip: aparece à direita do ícone quando o menu está recolhido
     (e sempre no botão de recolher/expandir) */
  .ad.is-collapsed .ad__side [data-tip]::after,
  .ad__collapse[data-tip]::after{
    content:attr(data-tip);
    position:absolute;
    left:calc(100% + 14px);
    top:50%;
    z-index:60;
    padding:7px 11px;
    border-radius:8px;
    background:var(--ink);
    color:var(--bg);
    font-size:13px; font-weight:500; line-height:1.2;
    white-space:nowrap;
    box-shadow:0 8px 24px rgba(0,0,0,.25);
    pointer-events:none;
    opacity:0;
    transform:translate(-6px, -50%);
    transition:opacity .15s, transform .15s;
  }
  .ad.is-collapsed .ad__side [data-tip]::before,
  .ad__collapse[data-tip]::before{
    content:"";
    position:absolute;
    left:calc(100% + 8px);
    top:50%;
    z-index:60;
    border:6px solid transparent;
    border-right-color:var(--ink);
    border-left:0;
    pointer-events:none;
    opacity:0;
    transform:translate(-6px, -50%);
    transition:opacity .15s, transform .15s;
  }
  .ad.is-collapsed .ad__side [data-tip]:hover::after,
  .ad.is-collapsed .ad__side [data-tip]:hover::before,
  .ad.is-collapsed .ad__side [data-tip]:focus-visible::after,
  .ad.is-collapsed .ad__side [data-tip]:focus-visible::before,
  .ad__collapse[data-tip]:hover::after,
  .ad__collapse[data-tip]:hover::before,
  .ad__collapse[data-tip]:focus-visible::after,
  .ad__collapse[data-tip]:focus-visible::before{
    opacity:1;
    transform:translate(0, -50%);
    transition-delay:.12s;
  }
  /* no menu aberto, o tooltip do botão fica logo abaixo dele */
  .ad:not(.is-collapsed) .ad__collapse[data-tip]::after{ left:50%; top:calc(100% + 10px); transform:translate(-50%, -4px); }
  .ad:not(.is-collapsed) .ad__collapse[data-tip]:hover::after,
  .ad:not(.is-collapsed) .ad__collapse[data-tip]:focus-visible::after{ transform:translate(-50%, 0); }
  .ad:not(.is-collapsed) .ad__collapse[data-tip]::before{ display:none; }
}
/* no celular o menu já abre por cima da tela: o botão de recolher não se aplica */
@media (max-width:860px){
  .ad__collapse{ display:none; }
  .ad__brand{ margin-bottom:24px; }
}
@media (prefers-reduced-motion: reduce){
  .ad, .ad__side, .ad__collapse svg{ transition:none; }
}


/* ==========================================================================
   REUNIÃO AGENDADA — tag e campo
   hoje = destaque amarelo · futura = azul · já passou = apagada
   ========================================================================== */
.tag--reuniao{ gap:5px; }
.tag--reuniao::before{ display:none; }
.tag--reuniao svg{ width:13px; height:13px; stroke:currentColor; flex:none; }
.tag--reuniao-futura{ background:rgba(63,107,255,.14); color:#9db6ff; }
.tag--reuniao-hoje{ background:rgba(252,190,44,.18); color:#ffcb4d; box-shadow:inset 0 0 0 1px rgba(252,190,44,.45); }
.tag--reuniao-passada{ background:var(--surface-2); color:var(--muted); }
[data-theme="claro"] .tag--reuniao-futura{ background:rgba(8,63,201,.08); color:#083fc9; }
[data-theme="claro"] .tag--reuniao-hoje{ background:#fff3cf; color:#7a5500; box-shadow:inset 0 0 0 1px #f1c75b; }
.tbl__tag{ margin-top:6px; }
.kb-card__tags .tag--reuniao{ font-size:11px; padding:2px 8px; }

.reuniao-fld{ display:flex; gap:8px; }
.reuniao-fld .inp{ flex:1; min-width:0; }
.reuniao-fld .btn{ height:46px; }
input[type="datetime-local"].inp{ color-scheme:dark; }
[data-theme="claro"] input[type="datetime-local"].inp{ color-scheme:light; }
.reuniao-agenda{ align-self:flex-start; margin-top:2px; color:var(--blue); font-size:13px; font-weight:500; text-decoration:none; }
.reuniao-agenda:hover{ text-decoration:underline; }
[data-theme="escuro"] .reuniao-agenda, html:not([data-theme]) .reuniao-agenda{ color:#9db6ff; }

.kbm__form-col{ width:220px; flex:none; }
.kbm__form-row .kbm__form-col .fld{ width:auto; margin-bottom:14px; }
.kbm__limpar{ align-self:flex-start; padding:0; border:0; background:none; color:var(--muted); font-size:12.5px; cursor:pointer; text-decoration:underline; }
.kbm__limpar:hover{ color:var(--err); }
@media (max-width:680px){ .kbm__form-col{ width:100%; } }


/* ==========================================================================
   ORIGEM DO LEAD — tag "Site" / "Link da bio"
   ========================================================================== */
.tag--canal{ gap:5px; }
.tag--canal::before{ display:none; }
.tag--canal svg{ width:13px; height:13px; stroke:currentColor; flex:none; }
.tag--canal-site{ background:rgba(45,212,191,.12); color:#5eead4; }
.tag--canal-bio{ background:rgba(236,72,153,.14); color:#f9a8d4; }
.tag--canal-manual{ background:rgba(250,204,21,.14); color:#fde68a; }
[data-theme="claro"] .tag--canal-site{ background:#e6f8f5; color:#0f766e; }
[data-theme="claro"] .tag--canal-bio{ background:#fdeaf4; color:#be185d; }
[data-theme="claro"] .tag--canal-manual{ background:#fef6db; color:#92600e; }
.kb-card__tags .tag--canal{ font-size:11px; padding:2px 8px; }
.crit__row .tag--canal{ font-size:12px; }


/* ==========================================================================
   FUNIL V2 — motivo da perda
   ========================================================================== */
.tag--motivo{ background:rgba(229,86,111,.14); color:#ff9fb1; }
.tag--motivo::before{ background:currentColor; }
.tag--motivo-vazio{ background:var(--surface-2); color:var(--muted); font-style:italic; }
[data-theme="claro"] .tag--motivo{ background:#fdecef; color:#b3243f; }
[data-theme="claro"] .tag--motivo-vazio{ background:var(--surface-2); color:var(--muted); }
.kb-card__tags .tag--motivo{ font-size:11px; padding:2px 8px; }

/* diálogo "Por que a venda foi perdida?" (Kanban) */
.kbm--motivo{ z-index:160; }
.kbmot__card{ max-width:520px; border-top-color:#e5566f; }
.kbmot__lista{ display:flex; flex-direction:column; gap:8px; }
.kbmot__op{ position:relative; cursor:pointer; }
.kbmot__op input{ position:absolute; opacity:0; pointer-events:none; }
.kbmot__op span{
  display:block;
  padding:11px 14px 11px 42px;
  border:1px solid var(--line);
  border-radius:12px;
  transition:border-color .15s, background .15s;
}
.kbmot__op span::before{
  content:"";
  position:absolute; left:14px; top:50%;
  width:16px; height:16px;
  margin-top:-8px;
  border:2px solid var(--muted);
  border-radius:50%;
  transition:border-color .15s, box-shadow .15s;
}
.kbmot__op strong{ display:block; font-size:14px; font-weight:600; }
.kbmot__op small{ display:block; color:var(--muted); font-size:12.5px; margin-top:1px; }
.kbmot__op:hover span{ border-color:var(--muted); }
.kbmot__op input:checked + span{ border-color:#e5566f; background:rgba(229,86,111,.08); }
.kbmot__op input:checked + span::before{ border-color:#e5566f; box-shadow:inset 0 0 0 3px var(--surface), inset 0 0 0 8px #e5566f; }
.kbmot__op input:focus-visible + span{ outline:2px solid var(--blue); outline-offset:2px; }
/* 8 etapas: o nome da coluna pode quebrar em 2 linhas em vez de ser cortado */
.kb-col__head{ align-items:flex-start; }
.kb-col__head .kb-col__toggle, .kb-col__head .kb-col__dot, .kb-col__head .kb-col__count{ margin-top:1px; }
.kb-col__head .kb-col__dot{ margin-top:6px; }
.kb-col__title{
  white-space:normal;
  line-height:1.3;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.kb-col.is-closed .kb-col__title{ display:block; white-space:nowrap; }


/* ==========================================================================
   MODAL DO KANBAN — confirmação de "salvo" bem visível
   ========================================================================== */
#kbm-salvar{ min-width:116px; transition:background .25s, box-shadow .25s, transform .15s; }
#kbm-salvar.is-saved{
  background:var(--ok);
  color:#fff;
  opacity:1;
  cursor:default;
  box-shadow:0 0 0 4px rgba(47,191,113,.25);
  animation:kbm-salvo-pop .45s cubic-bezier(.2,1.5,.4,1);
}
#kbm-salvar .kbm__ok-svg, .kbm__ok-ico .kbm__ok-svg{
  width:18px; height:18px; stroke:currentColor;
  stroke-dasharray:24; stroke-dashoffset:24;
  animation:kbm-check .35s .1s ease forwards;
}
@keyframes kbm-salvo-pop{ 0%{ transform:scale(.92); } 60%{ transform:scale(1.06); } 100%{ transform:none; } }
@keyframes kbm-check{ to{ stroke-dashoffset:0; } }

/* selo "Alterações salvas às 14:32" */
.kbm__salvo.is-ok.is-pop{
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 14px 7px 8px;
  border-radius:30px;
  background:rgba(47,191,113,.14);
  color:#3fd184;
  font-size:13.5px; font-weight:600;
  box-shadow:inset 0 0 0 1px rgba(47,191,113,.35);
  animation:kbm-selo-in .4s cubic-bezier(.2,1.4,.4,1);
}
[data-theme="claro"] .kbm__salvo.is-ok.is-pop{ background:#e3f7ec; color:#137a43; box-shadow:inset 0 0 0 1px #a8e2c1; }
.kbm__ok-ico{
  width:22px; height:22px; flex:none;
  display:grid; place-items:center;
  border-radius:50%;
  background:var(--ok); color:#fff;
}
.kbm__ok-ico .kbm__ok-svg{ width:14px; height:14px; }
@keyframes kbm-selo-in{ from{ opacity:0; transform:translateY(6px) scale(.9); } to{ opacity:1; transform:none; } }
.kbm__salvo.is-dirty{ color:#e9ad1c; font-weight:500; }
[data-theme="claro"] .kbm__salvo.is-dirty{ color:#8a6100; }

/* brilho verde no modal inteiro por um instante */
.kbm__card.is-saved-flash{ animation:kbm-flash 1.1s ease-out; }
@keyframes kbm-flash{
  0%  { box-shadow:0 30px 80px rgba(0,0,0,.45), 0 0 0 0 rgba(47,191,113,.0); }
  20% { box-shadow:0 30px 80px rgba(0,0,0,.45), 0 0 0 4px rgba(47,191,113,.65); }
  100%{ box-shadow:0 30px 80px rgba(0,0,0,.45), 0 0 0 14px rgba(47,191,113,0); }
}
@media (prefers-reduced-motion: reduce){
  #kbm-salvar.is-saved, .kbm__salvo.is-ok.is-pop, .kbm__card.is-saved-flash{ animation:none; }
  #kbm-salvar .kbm__ok-svg, .kbm__ok-ico .kbm__ok-svg{ animation:none; stroke-dashoffset:0; }
}


/* ==========================================================================
   BOTÃO WHATSAPP — verde oficial (#25D366) com texto verde-escuro
   (contraste ≈ 8:1, legível nos temas claro e escuro)
   ========================================================================== */
.btn--whats{
  background:#25d366;
  border-color:#25d366;
  color:#053b1c;
  box-shadow:0 4px 14px rgba(37,211,102,.28);
}
.btn--whats:hover{ background:#1ebe5b; border-color:#1ebe5b; filter:none; box-shadow:0 6px 18px rgba(37,211,102,.38); }
.btn--whats:active{ transform:translateY(1px); }
.btn--whats:focus-visible{ outline:2px solid #25d366; outline-offset:3px; }
.btn--whats .ico-wa{ width:18px; height:18px; flex:none; stroke:none; }
.btn--whats.btn--sm .ico-wa{ width:16px; height:16px; }
[data-theme="claro"] .btn--whats{ box-shadow:0 4px 14px rgba(18,140,74,.22); }


/* ==========================================================================
   FORNECEDORES DO CLIENTE (página do lead) + PRAZO no cartão do Kanban
   ========================================================================== */
.forn__lista{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.forn__op{ position:relative; cursor:pointer; }
.forn__op input{ position:absolute; opacity:0; pointer-events:none; }
.forn__op span{
  display:flex; align-items:center; gap:10px;
  min-height:46px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  font-size:14px; font-weight:500;
  color:var(--ink-2);
  transition:border-color .15s, background .15s, color .15s;
}
.forn__op span i{
  width:18px; height:18px; flex:none;
  border:2px solid var(--muted);
  border-radius:5px;
  display:grid; place-items:center;
  transition:background .15s, border-color .15s;
}
.forn__op span i::after{
  content:""; width:5px; height:9px;
  border:solid #fff; border-width:0 2.5px 2.5px 0;
  transform:rotate(45deg) translate(-1px,-1px) scale(0);
  transition:transform .18s cubic-bezier(.2,1.6,.4,1);
}
.forn__op:hover span{ border-color:var(--muted); color:var(--ink); }
.forn__op input:checked + span{ border-color:var(--blue); background:rgba(63,107,255,.1); color:var(--ink); }
.forn__op input:checked + span i{ background:var(--blue); border-color:var(--blue); }
.forn__op input:checked + span i::after{ transform:rotate(45deg) translate(-1px,-1px) scale(1); }
.forn__op input:focus-visible + span{ outline:2px solid var(--blue); outline-offset:2px; }
[data-theme="claro"] .forn__op input:checked + span{ background:rgba(8,63,201,.06); }
.forn__rodape{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px; min-height:30px; }
.forn__status{ color:var(--muted); font-size:13px; }
.forn__status.is-saving{ color:var(--ink-2); }
.forn__status.is-ok{ color:var(--ok); font-weight:600; }
.forn__status.is-ok b{ display:inline-grid; place-items:center; width:20px; height:20px; margin-right:4px; border-radius:50%; background:var(--ok); color:#fff; font-size:12px; }
.forn__status.is-pop{ animation:kbm-selo-in .35s cubic-bezier(.2,1.4,.4,1); }
.forn__status.is-err{ color:var(--err); }
.forn.is-saved{ animation:forn-ok 1s ease-out; }
@keyframes forn-ok{
  20% { box-shadow:0 0 0 3px rgba(47,191,113,.55); }
  100%{ box-shadow:0 0 0 12px rgba(47,191,113,0); }
}
@media (max-width:420px){ .forn__lista{ grid-template-columns:1fr; } }

/* prazo (Quando pretende resolver) no cartão */
.kb-chip--tempo{ gap:4px; }
.kb-chip--tempo svg{ width:11px; height:11px; stroke:currentColor; flex:none; }
.kb-chip--prazo{ background:rgba(63,107,255,.12); color:#9db6ff; }
.kb-chip--frio{ background:var(--surface-2); color:var(--muted); }
[data-theme="claro"] .kb-chip--prazo{ background:rgba(8,63,201,.07); color:#1f47b8; }
.kb-chip--forn{ background:var(--surface-2); color:var(--ink-2); font-size:12px; padding:3px 9px; margin:0 2px 4px 0; }
@media (prefers-reduced-motion: reduce){ .forn.is-saved, .forn__status.is-pop{ animation:none; } }


/* ==========================================================================
   PRÓXIMA AÇÃO — "lead sem próxima ação é lead esquecido"
   atrasada = vermelho (alerta) · hoje = amarelo · amanhã/futura = azul
   sem ação = laranja · encerrado (ganho/perdido) = não aparece
   ========================================================================== */
.tag--acao{ gap:5px; max-width:100%; }
.tag--acao::before{ display:none; }
.tag--acao svg{ width:13px; height:13px; stroke:currentColor; flex:none; }
.tag--acao .tag__txt{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
.tag--acao-atrasada{ background:rgba(229,86,111,.18); color:#ff9fb1; box-shadow:inset 0 0 0 1px rgba(229,86,111,.45); }
.tag--acao-hoje{ background:rgba(252,190,44,.18); color:#ffcb4d; box-shadow:inset 0 0 0 1px rgba(252,190,44,.4); }
.tag--acao-amanha, .tag--acao-futura{ background:rgba(63,107,255,.13); color:#9db6ff; }
.tag--acao-sem{ background:rgba(249,115,22,.15); color:#fdba74; box-shadow:inset 0 0 0 1px rgba(249,115,22,.4); }
[data-theme="claro"] .tag--acao-atrasada{ background:#fdecef; color:#b3243f; box-shadow:inset 0 0 0 1px #f3b4c0; }
[data-theme="claro"] .tag--acao-hoje{ background:#fff3cf; color:#7a5500; box-shadow:inset 0 0 0 1px #f1c75b; }
[data-theme="claro"] .tag--acao-amanha, [data-theme="claro"] .tag--acao-futura{ background:rgba(8,63,201,.07); color:#1f47b8; }
[data-theme="claro"] .tag--acao-sem{ background:#fff1e6; color:#b45309; box-shadow:inset 0 0 0 1px #f6c79d; }
.tbl__acao{ max-width:260px; }
.tbl__acao .tag{ white-space:nowrap; }

/* cartão do Kanban */
.kb-card__acao{ margin:9px 0 0; }
.kb-card__acao .tag{ display:flex; font-size:11.5px; padding:4px 9px; border-radius:8px; }
.kb-card--acao-atrasada{
  border-color:rgba(229,86,111,.75);
  background:linear-gradient(0deg, rgba(229,86,111,.07), rgba(229,86,111,.07)), var(--bg);
  box-shadow:0 0 0 1px rgba(229,86,111,.35);
}
.kb-card--acao-atrasada:hover{ border-color:#e5566f; }
.kb-card--acao-atrasada .kb-card__acao .tag{ animation:acao-pulso 2.2s ease-in-out infinite; }
.kb-card--acao-sem{ border-style:dashed; border-color:rgba(249,115,22,.6); }
@keyframes acao-pulso{ 0%,100%{ box-shadow:inset 0 0 0 1px rgba(229,86,111,.45); } 50%{ box-shadow:inset 0 0 0 1px rgba(229,86,111,.45), 0 0 0 4px rgba(229,86,111,.18); } }

/* filtro "Precisam de atenção" */
.kb-atencao{
  display:inline-flex; align-items:center; gap:7px;
  height:42px; padding:0 14px;
  border:1px solid var(--line); border-radius:12px;
  background:var(--surface); color:var(--ink-2);
  font-size:13.5px; font-weight:500; cursor:pointer;
  transition:border-color .2s, background .2s, color .2s;
}
.kb-atencao svg{ width:16px; height:16px; stroke:currentColor; }
.kb-atencao b{ min-width:22px; padding:1px 7px; border-radius:20px; background:var(--surface-2); color:var(--ink-2); font-size:12px; text-align:center; }
.kb-atencao.has-itens{ color:#fdba74; border-color:rgba(249,115,22,.45); }
.kb-atencao.has-itens b{ background:#f97316; color:#fff; }
.kb-atencao.is-on{ background:rgba(249,115,22,.14); border-color:#f97316; color:var(--ink); }
[data-theme="claro"] .kb-atencao.has-itens{ color:#b45309; }
.kb-stats__alerta{ color:#ff9fb1; }
.kb-stats__alerta b{ color:#ff5c7a !important; }
[data-theme="claro"] .kb-stats__alerta, [data-theme="claro"] .kb-stats__alerta b{ color:#b3243f !important; }

/* campos (página do lead e modal do Kanban) */
.acao-fld{
  margin:0 0 18px;
  padding:14px 14px 12px;
  border:1px solid var(--line);
  border-left:4px solid var(--blue);
  border-radius:12px;
  background:var(--surface-2);
}
.acao-fld legend{ padding:0 6px; margin-left:-6px; font-weight:600; font-size:14px; }
.acao-fld--atrasada{ border-color:rgba(229,86,111,.5); border-left-color:#e5566f; background:rgba(229,86,111,.07); }
.acao-fld--sem{ border-color:rgba(249,115,22,.45); border-left-color:#f97316; background:rgba(249,115,22,.06); }
.acao-fld--hoje{ border-left-color:#fcbe2c; }
.acao-fld small{ display:block; margin-top:8px; color:var(--muted); font-size:12.5px; }
.acao-fld__row{ display:flex; gap:12px; align-items:flex-end; }
.acao-rapida{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.acao-rapida button{
  height:30px; padding:0 11px;
  border:1px solid var(--line); border-radius:20px;
  background:var(--surface); color:var(--ink-2);
  font-size:12.5px; cursor:pointer;
  transition:border-color .15s, color .15s;
}
.acao-rapida button:hover{ border-color:var(--blue); color:var(--ink); }
.kbm .acao-fld{ margin-top:22px; }
@media (max-width:560px){ .acao-fld__row{ flex-direction:column; align-items:stretch; } .acao-fld__row .fld{ width:auto !important; } }

/* aviso no topo da página do lead */
.acao-aviso{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  margin:0 0 18px; padding:12px 16px;
  border-radius:14px;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--ink-2); font-size:14px;
  text-decoration:none;
  transition:transform .15s;
}
.acao-aviso:hover{ transform:translateY(-1px); }
.acao-aviso strong{ color:var(--ink); }
.acao-aviso > span:not(.tag){ flex:1; min-width:220px; }
.acao-aviso__ir{ flex:none !important; min-width:0 !important; font-weight:600; color:var(--ink); white-space:nowrap; }
.acao-aviso--atrasada{ border-color:rgba(229,86,111,.55); background:rgba(229,86,111,.09); }
.acao-aviso--sem{ border-color:rgba(249,115,22,.5); background:rgba(249,115,22,.07); }
.acao-aviso--hoje{ border-color:rgba(252,190,44,.5); background:rgba(252,190,44,.08); }

/* faixa no dashboard */
.acao-faixa{
  display:flex; align-items:center; flex-wrap:wrap; gap:8px 10px;
  margin:0 0 18px; padding:12px 16px;
  border-radius:14px; border:1px solid var(--line);
  background:var(--surface);
}
.acao-faixa__tit{ margin-right:6px; font-size:14px; }
.acao-faixa__item{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 12px; border-radius:20px;
  background:var(--surface-2); color:var(--ink-2);
  font-size:13px; text-decoration:none;
}
.acao-faixa__item b{ font-size:14px; color:var(--ink); }
.acao-faixa.is-alerta{ border-color:rgba(229,86,111,.5); background:rgba(229,86,111,.06); }
.acao-faixa.is-alerta .acao-faixa__item--atrasada{ background:#e5566f; color:#fff; }
.acao-faixa.is-alerta .acao-faixa__item--atrasada b{ color:#fff; }
.acao-faixa.is-atencao{ border-color:rgba(249,115,22,.45); }
.acao-faixa .acao-faixa__item--sem:not(:has(b:only-child)) b{ color:inherit; }
.acao-faixa.is-ok{ border-color:rgba(47,191,113,.4); }
.acao-faixa.is-ok .acao-faixa__tit{ color:var(--ok); }
.acao-faixa__ver{ margin-left:auto; color:var(--ink-2); font-size:13px; font-weight:500; text-decoration:none; }
.acao-faixa__ver:hover{ color:var(--ink); }

/* contador vermelho no menu (Kanban) */
.ad__badge--alerta{ background:#e5566f; color:#fff; }
.ad.is-collapsed .ad__badge--alerta{ top:auto; bottom:6px; }

@media (prefers-reduced-motion: reduce){ .kb-card--acao-atrasada .kb-card__acao .tag{ animation:none; } }


/* ==========================================================================
   CLASSIFICAÇÃO EM 3 FAIXAS — Prioridade máxima (11–13) · Qualificado (8–10)
   · Nutrição (abaixo de 8)
   ========================================================================== */
:root{ --s-prio:#a855f7; }
[data-theme="claro"]{ --s-prio:#7e22ce; }
.tag--p{ background:rgba(168,85,247,.18); color:#d8b4fe; box-shadow:inset 0 0 0 1px rgba(168,85,247,.45); font-weight:700; }
[data-theme="claro"] .tag--p{ background:#f3e8ff; color:#6b21a8; box-shadow:inset 0 0 0 1px #d8b4fe; }
.kb-card.is-p::before{ background:var(--s-prio); width:4px; }
.kb-card.is-p .kb-card__score .score__bar i{ background:var(--s-prio); }

/* filtros do topo do Kanban com bolinha da cor e contador */
#kb-filtro a{ display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
#kb-filtro a b{
  min-width:20px; padding:0 6px;
  border-radius:20px;
  background:var(--surface-2); color:var(--muted);
  font-size:11.5px; font-weight:600; text-align:center;
}
#kb-filtro a.is-on b{ background:var(--bg); color:var(--ink); }
#kb-filtro .kb-f i{ width:8px; height:8px; border-radius:50%; flex:none; }
.kb-f--prioridade i{ background:var(--s-prio); }
.kb-f--qualificado i{ background:var(--s-qual); }
.kb-f--nutricao i{ background:var(--s-nutr); }

/* bloco "Tratamento" (página do lead e modal) */
.tratamento{
  margin:0 0 20px;
  padding:9px 12px;
  border-radius:10px;
  border-left:3px solid var(--s-nutr);
  background:var(--surface-2);
  color:var(--ink-2);
  font-size:13px; line-height:1.45;
}
.tratamento b{ color:var(--ink); }
.tratamento span{ color:#e9ad1c; font-weight:500; }
[data-theme="claro"] .tratamento span{ color:#8a6100; }
.tratamento--prioridade{ border-left-color:var(--s-prio); }
.tratamento--qualificado{ border-left-color:var(--s-qual); }
.kbm__score .tratamento{ margin:8px 0 0; padding:6px 10px; font-size:12.5px; }
@media (max-width:860px){ #kb-filtro{ overflow-x:auto; max-width:100%; } }
/* codificação extra além da cor (daltonismo): estrela no selo de prioridade */
.tag--p::before{ content:"★"; width:auto; height:auto; border-radius:0; background:none; font-size:11px; line-height:1; }


/* ==========================================================================
   CRM · FASE 1 — FICHA DO LEAD (painel lateral no Kanban e página completa)
   ========================================================================== */
.fx-ico{ width:15px; height:15px; flex:none; }
body.fx-aberta{ overflow:hidden; }
.fx-overlay{ position:fixed; inset:0; z-index:140; background:rgba(5,8,20,.55); opacity:0; transition:opacity .22s; }
.fx-overlay.is-open{ opacity:1; }
[data-theme="claro"] .fx-overlay{ background:rgba(13,22,51,.35); }

.fx{ display:flex; flex-direction:column; background:var(--surface); color:var(--ink); font-size:13px; line-height:1.45; }
.fx--drawer{
  position:fixed; top:0; right:0; z-index:150;
  width:min(680px, 100vw); height:100vh; height:100dvh;
  border-left:1px solid var(--line);
  box-shadow:-24px 0 60px rgba(0,0,0,.35);
  transform:translateX(100%);
  transition:transform .26s cubic-bezier(.2,.8,.2,1);
  outline:none;
}
.fx--drawer.is-open{ transform:none; }
.fx--drawer.is-trocando .fx__body{ opacity:.55; transition:opacity .15s; }
.fx--pagina{ border:1px solid var(--line); border-radius:var(--radius); max-width:980px; margin:0 auto; }

/* D1 — cabeçalho fixo */
.fx__head{
  flex:none;
  display:flex; flex-direction:column; gap:12px;
  padding:16px 20px 12px;
  background:var(--surface);
  border-bottom:1px solid var(--line);
  z-index:3;
}
.fx--pagina .fx__head{ position:sticky; top:0; border-radius:var(--radius) var(--radius) 0 0; box-shadow:0 8px 18px -14px rgba(0,0,0,.5); }
.fx-h1{ display:flex; align-items:center; gap:12px; min-width:0; }
.fx-av{
  width:44px; height:44px; flex:none;
  display:grid; place-items:center; border-radius:50%;
  background:var(--surface-2); color:var(--ink); font-weight:700; font-size:14px;
  box-shadow:inset 0 0 0 2px var(--s-nutr);
}
.fx-av--qualificado{ box-shadow:inset 0 0 0 2px var(--s-qual); }
.fx-av--prioridade{ box-shadow:inset 0 0 0 3px var(--s-prio); }
.fx-who{ min-width:0; flex:1; }
.fx-who h2{ margin:0; font-size:17px; font-weight:600; line-height:1.25; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fx-who p{ margin:3px 0 0; color:var(--muted); font-size:12.5px; display:flex; flex-wrap:wrap; align-items:center; gap:4px 6px; }
.fx-who p b{ color:var(--ink); }
.fx-who .tag{ font-size:11px; padding:2px 8px; }
.fx-tools{ display:flex; gap:6px; flex:none; }
.fx-icobtn{
  width:34px; height:34px; display:grid; place-items:center;
  border:1px solid var(--line); border-radius:10px; background:var(--surface-2);
  color:var(--ink-2); cursor:pointer; text-decoration:none;
}
.fx-icobtn:hover:not(:disabled){ color:var(--ink); border-color:var(--muted); }
.fx-icobtn:disabled{ opacity:.35; cursor:default; }
.fx-icobtn .fx-ico{ width:17px; height:17px; }

.fx-h2{ display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) auto; gap:10px; align-items:end; }
.fx-fld{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.fx-fld > span{ color:var(--muted); font-size:11px; font-weight:500; }
.fx-sel{
  width:100%; height:38px; padding:0 30px 0 11px;
  border:1px solid var(--line); border-radius:10px;
  background:var(--bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%237d88b3' stroke-width='2'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 11px center;
  appearance:none; font-size:13px; color:var(--ink); cursor:pointer;
}
.fx-sel--etapa{ border-color:var(--blue); font-weight:600; background-color:rgba(63,107,255,.1); }
.fx-sel:focus{ outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(63,107,255,.2); }
.fx-btn-perder{
  height:38px; padding:0 14px; border-radius:10px;
  border:1px solid rgba(229,86,111,.5); background:rgba(229,86,111,.1); color:#ff9fb1;
  font-size:12.5px; font-weight:600; cursor:pointer; white-space:nowrap;
}
.fx-btn-perder:hover{ background:rgba(229,86,111,.18); }
[data-theme="claro"] .fx-btn-perder{ color:#b3243f; background:#fdecef; }
.fx-perdida{ display:flex; flex-direction:column; align-items:flex-start; gap:3px; max-width:220px; }
.fx-perdida small{ color:var(--muted); font-size:11.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.fx-link{ padding:0; border:0; background:none; color:var(--blue); font-size:12px; font-weight:500; cursor:pointer; }
[data-theme="escuro"] .fx-link, html:not([data-theme]) .fx-link{ color:#9db6ff; }
.fx-link:hover{ text-decoration:underline; }

.fx-h3{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.fx-tag{
  --tc:#8B95BC;
  display:inline-flex; align-items:center; gap:4px;
  padding:2px 9px; border-radius:99px;
  font-size:11px; font-weight:500; line-height:1.5;
  background:color-mix(in srgb, var(--tc) 18%, transparent);
  color:color-mix(in srgb, var(--tc) 80%, #fff);
  border:1px solid color-mix(in srgb, var(--tc) 40%, transparent);
}
[data-theme="claro"] .fx-tag{ color:color-mix(in srgb, var(--tc) 70%, #000); background:color-mix(in srgb, var(--tc) 13%, #fff); }
.fx-tag button{ padding:0 0 0 2px; border:0; background:none; color:inherit; font-size:13px; line-height:1; cursor:pointer; opacity:.75; }
.fx-tag button:hover{ opacity:1; }
.fx-tag--mais{ --tc:#8B95BC; }
.fx-addtag-wrap{ position:relative; }
.fx-addtag{ padding:2px 10px; border:1px dashed var(--line); border-radius:99px; background:none; color:var(--muted); font-size:11px; cursor:pointer; }
.fx-addtag:hover{ color:var(--ink); border-color:var(--muted); }
.fx-tagpop{
  position:absolute; top:calc(100% + 6px); left:0; z-index:20;
  width:260px; max-height:300px; overflow:auto;
  padding:8px; border-radius:12px; border:1px solid var(--line);
  background:var(--surface); box-shadow:0 16px 40px rgba(0,0,0,.35);
}
.fx-tagpop__busca{ width:100%; height:34px; padding:0 10px; margin-bottom:6px; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--ink); }
.fx-tagpop__lista button{
  display:flex; align-items:center; gap:8px; width:100%;
  padding:7px 8px; border:0; border-radius:8px; background:none; color:var(--ink); text-align:left; cursor:pointer; font-size:13px;
}
.fx-tagpop__lista button:hover, .fx-tagpop__lista button:focus-visible{ background:var(--surface-2); }
.fx-tagpop__lista button small{ margin-left:auto; color:var(--muted); font-size:11px; }
.fx-tagpop__dot{ width:9px; height:9px; border-radius:50%; flex:none; }

/* indicação discreta "Salvo" */
.fx-salvo{ margin-left:auto; display:inline-flex; align-items:center; gap:4px; font-size:11.5px; color:var(--muted); min-height:18px; }
.fx-salvo .fx-ico{ width:13px; height:13px; }
.fx-salvo.is-ok{ color:var(--ok); }
.fx-salvo.is-pop{ animation:fx-pop .45s ease; }
.fx-salvo.is-err{ color:var(--err); font-weight:500; }
@keyframes fx-pop{ 0%{ transform:scale(.85); opacity:.3; } 60%{ transform:scale(1.08); opacity:1; } 100%{ transform:none; } }

/* corpo */
.fx__body{ flex:1; overflow:auto; padding:16px 20px 24px; display:flex; flex-direction:column; gap:16px; }
.fx--pagina .fx__body{ overflow:visible; }
.fx__body > *{ flex-shrink:0; }
.fx-carregando{ color:var(--muted); text-align:center; padding:40px 0; }
.fx__foot{ flex:none; display:flex; align-items:center; gap:8px; padding:10px 20px; border-top:1px solid var(--line); background:var(--surface); }
.fx__foot-ok{ margin-left:auto; display:inline-flex; align-items:center; gap:5px; color:var(--muted); font-size:11.5px; }
.fx__foot-ok .fx-ico{ color:var(--ok); }

/* próxima ação em destaque (D5) */
.fx-acao{
  display:flex; flex-direction:column; gap:8px;
  padding:12px 14px; border-radius:12px;
  border:1px solid rgba(252,190,44,.35); background:rgba(252,190,44,.06);
}
.fx-acao--atrasada{ border-color:rgba(229,86,111,.55); background:rgba(229,86,111,.08); }
.fx-acao--sem{ border-color:rgba(249,115,22,.5); background:rgba(249,115,22,.06); }
.fx-acao--amanha, .fx-acao--futura{ border-color:rgba(63,107,255,.35); background:rgba(63,107,255,.06); }
.fx-acao--encerrado{ border-color:var(--line); background:var(--surface-2); }
.fx-acao__top{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.fx-acao__lbl{ font-weight:600; font-size:13px; }
.fx-selo{ display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border-radius:99px; font-size:11.5px; font-weight:600; }
.fx-selo--atrasada{ background:rgba(229,86,111,.2); color:#ff9fb1; }
.fx-selo--hoje{ background:rgba(252,190,44,.2); color:#ffcb4d; }
.fx-selo--amanha, .fx-selo--futura{ background:rgba(63,107,255,.16); color:#9db6ff; }
.fx-selo--sem{ background:rgba(249,115,22,.18); color:#fdba74; }
.fx-selo--encerrado{ background:var(--bg); color:var(--muted); }
[data-theme="claro"] .fx-selo--atrasada{ color:#b3243f; background:#fdecef; }
[data-theme="claro"] .fx-selo--hoje{ color:#7a5500; background:#fff3cf; }
[data-theme="claro"] .fx-selo--amanha, [data-theme="claro"] .fx-selo--futura{ color:#1f47b8; background:rgba(8,63,201,.08); }
[data-theme="claro"] .fx-selo--sem{ color:#b45309; background:#fff1e6; }
textarea.fx-auto{
  width:100%; min-height:74px; resize:none; overflow:hidden;
  padding:9px 11px; border:1px solid var(--line); border-radius:10px;
  background:var(--bg); color:var(--ink);
  font:inherit; font-size:13px; line-height:1.5;
  white-space:pre-wrap; overflow-wrap:anywhere;
}
textarea.fx-auto:focus{ outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(63,107,255,.18); }
.fx-acao__row{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:8px 12px; }
.fx-acao__data{ display:flex; flex-direction:column; gap:3px; }
.fx-acao__data span{ color:var(--muted); font-size:11px; }
.fx-acao__data input, .fx-reuniao input{
  height:34px; padding:0 10px; border:1px solid var(--line); border-radius:9px;
  background:var(--bg); color:var(--ink); color-scheme:dark;
}
[data-theme="claro"] .fx-acao__data input, [data-theme="claro"] .fx-reuniao input{ color-scheme:light; }
.fx-rapido{ display:flex; flex-wrap:wrap; gap:5px; }
.fx-rapido button{ height:30px; padding:0 10px; border:1px solid var(--line); border-radius:99px; background:var(--surface); color:var(--ink-2); font-size:12px; cursor:pointer; }
.fx-rapido button:hover{ border-color:var(--blue); color:var(--ink); }
.fx-acao__msg{ margin:0; color:var(--err); font-size:12px; min-height:0; }
.fx-acao__msg:empty{ display:none; }

/* abas */
.fx-tabs{ display:flex; gap:2px; border-bottom:1px solid var(--line); overflow-x:auto; }
.fx-tabs button{
  padding:9px 12px; border:0; border-bottom:2px solid transparent; margin-bottom:-1px;
  background:none; color:var(--muted); font-weight:500; font-size:13px; white-space:nowrap; cursor:pointer;
}
.fx-tabs button.is-on{ color:var(--ink); border-bottom-color:var(--yellow); }
.fx-tabs b{ margin-left:3px; padding:0 6px; border-radius:99px; background:var(--surface-2); font-size:11px; color:var(--ink-2); }
.fx-tabs b:empty{ display:none; }
.fx-pane{ display:flex; flex-direction:column; gap:10px; }
.fx-pane[hidden]{ display:none; }
.fx-sec{ display:block; margin:6px 0 0; color:var(--muted); font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; }
.fx-sec b{ color:var(--ink); text-transform:none; letter-spacing:0; }

/* linhas de dados com ações (D2) e edição (D4) */
.fx-rows{ border:1px solid var(--line); border-radius:12px; overflow:hidden; background:var(--bg); }
.fx-row{
  display:grid; grid-template-columns:118px minmax(0,1fr) auto; gap:4px 10px; align-items:center;
  padding:9px 12px; border-bottom:1px solid var(--line);
}
.fx-row:last-child{ border-bottom:0; }
.fx-row--col{ grid-template-columns:minmax(0,1fr); }
.fx-row__k{ color:var(--muted); font-size:12px; }
.fx-row__v{ min-width:0; overflow-wrap:anywhere; }
.fx-row__v a{ color:#9db6ff; }
[data-theme="claro"] .fx-row__v a{ color:#083fc9; }
.fx-row__a{ display:flex; flex-wrap:wrap; gap:4px; justify-content:flex-end; }
.fx-row__erro{ grid-column:1 / -1; margin:2px 0 0; color:var(--err); font-size:12px; }
.fx-vazio{ color:var(--muted); font-style:italic; }
.fx-valor{ color:var(--ok); font-size:14px; }
.fx-mini{
  display:inline-flex; align-items:center; gap:4px;
  height:28px; padding:0 8px;
  border:1px solid var(--line); border-radius:8px;
  background:var(--surface-2); color:var(--ink-2);
  font-size:11.5px; font-weight:500; text-decoration:none; cursor:pointer; white-space:nowrap;
}
.fx-mini:hover{ color:var(--ink); border-color:var(--muted); }
.fx-mini .fx-ico{ width:14px; height:14px; }
.fx-mini--wa{ background:#25d366; border-color:#25d366; color:#053b1c; }
.fx-mini--wa:hover{ background:#1ebe5b; color:#053b1c; }
/* lápis aparece ao passar o mouse (sempre visível em telas de toque) */
.fx-mini--edit{ opacity:0; transition:opacity .15s; }
.fx-row:hover .fx-mini--edit, .fx-mini--edit:focus-visible{ opacity:1; }
@media (hover:none){ .fx-mini--edit{ opacity:1; } }
.fx-row.is-editando .fx-row__a{ display:none; }
.fx-edit{
  width:100%; height:34px; padding:0 10px;
  border:1px solid var(--blue); border-radius:8px; background:var(--surface); color:var(--ink);
  box-shadow:0 0 0 3px rgba(63,107,255,.18);
}
.fx-edit:focus{ outline:none; }
.fx-forn{ display:flex; flex-wrap:wrap; gap:6px; }
.fx-ck{ display:inline-flex; align-items:center; gap:6px; padding:5px 11px; border:1px solid var(--line); border-radius:99px; background:var(--surface); font-size:12.5px; cursor:pointer; }
.fx-ck input{ accent-color:var(--blue); }
.fx-ck:has(input:checked){ border-color:var(--blue); background:rgba(63,107,255,.1); }
.fx-reuniao{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.fx-quali{ display:flex; flex-direction:column; gap:10px; padding:12px; border:1px solid var(--line); border-radius:12px; background:var(--bg); }
.fx-quali .tratamento{ margin:0; }

/* notas e linha do tempo (D5 + histórico) */
.fx-novanota{ display:flex; flex-direction:column; gap:8px; }
.fx-novanota__acoes{ display:flex; justify-content:flex-end; }
.fx-nota{ padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:var(--bg); }
.fx-nota.is-fixada{ border-color:rgba(252,190,44,.45); background:rgba(252,190,44,.07); }
.fx-nota header{ display:flex; flex-wrap:wrap; align-items:center; gap:4px 6px; color:var(--muted); font-size:11.5px; margin-bottom:4px; }
.fx-nota header b{ color:var(--ink-2); }
.fx-nota header .fx-link{ margin-left:auto; font-size:11.5px; }
.fx-nota__pino{ display:inline-flex; align-items:center; gap:3px; color:#ffcb4d; font-weight:600; }
[data-theme="claro"] .fx-nota__pino{ color:#8a6100; }
.fx-nota__txt{ white-space:pre-wrap; overflow-wrap:anywhere; font-size:13px; }
.fx-tl{ list-style:none; margin:0; padding:0; }
.fx-ev{ position:relative; padding:0 0 12px 22px; }
.fx-ev::before{ content:""; position:absolute; left:6px; top:6px; width:9px; height:9px; border-radius:50%; background:var(--surface); border:2px solid var(--blue); }
.fx-ev::after{ content:""; position:absolute; left:10px; top:18px; bottom:0; width:1px; background:var(--line); }
.fx-ev:last-child::after{ display:none; }
.fx-ev--etapa::before{ border-color:var(--yellow); }
.fx-ev--perda::before{ border-color:var(--err); }
.fx-ev--tag::before{ border-color:#22c3d6; }
.fx-ev--acao::before{ border-color:#f97316; }
.fx-ev--nota::before{ border-color:var(--ok); }
.fx-ev--sistema::before{ border-color:var(--muted); }
.fx-ev__w{ color:var(--muted); font-size:11.5px; }
.fx-ev__x{ font-size:13px; overflow-wrap:anywhere; }
.fx-ev__x s{ color:var(--muted); }
.fx-ev__antes{ color:var(--muted); font-size:12px; }
.fx-ev--nota .fx-nota{ margin-top:2px; }

/* diálogo "Marcar como perdida" (C3a) */
.fx-dlg{ position:fixed; inset:0; z-index:170; display:grid; place-items:center; padding:16px; background:rgba(5,8,20,.65); }
.fx-dlg[hidden]{ display:none; }
.fx-dlg__box{
  width:min(560px, 100%); max-height:92vh; overflow:auto;
  display:flex; flex-direction:column; gap:12px;
  padding:20px 22px; border-radius:16px; border:1px solid var(--line);
  border-top:4px solid #e5566f; background:var(--surface); color:var(--ink);
}
.fx-dlg__box h3{ margin:0; font-size:17px; }
.fx-dlg__box > p{ margin:0; color:var(--muted); font-size:12.5px; }
.fx-dlg__grp h4{ margin:4px 0 6px; font-size:12px; color:var(--ink-2); font-weight:600; }
.fx-dlg__grp h4 small{ color:var(--muted); font-weight:400; }
.fx-dlg__op{ display:flex; gap:10px; align-items:flex-start; padding:8px 10px; margin-bottom:5px; border:1px solid var(--line); border-radius:10px; background:var(--bg); cursor:pointer; }
.fx-dlg__op input{ margin-top:3px; accent-color:#e5566f; }
.fx-dlg__op b{ display:block; font-weight:600; font-size:13px; }
.fx-dlg__op small{ color:var(--muted); font-size:12px; }
.fx-dlg__op:has(input:checked){ border-color:#e5566f; background:rgba(229,86,111,.08); }
.fx-dlg__det{ display:flex; flex-direction:column; gap:4px; }
.fx-dlg__det[hidden]{ display:none; }
.fx-dlg__det span{ font-size:12px; color:var(--ink-2); font-weight:500; }
.fx-dlg__det input{ height:38px; padding:0 10px; border:1px solid var(--line); border-radius:10px; background:var(--bg); color:var(--ink); }
.fx-dlg__erro{ margin:0; color:var(--err); font-size:12.5px; }
.fx-dlg__erro:empty{ display:none; }
.fx-dlg__foot{ display:flex; justify-content:flex-end; gap:8px; }
.btn--perder{ background:#e5566f; }

/* aviso rápido ("Número copiado") */
.fx-toast{
  position:fixed; left:50%; bottom:22px; z-index:200; transform:translateX(-50%);
  padding:9px 16px; border-radius:10px;
  background:#eaf7f0; color:#0b3d27; font-weight:600; font-size:12.5px;
  box-shadow:0 10px 30px rgba(0,0,0,.3);
}
.fx-toast--err{ background:#fdecef; color:#8a1c33; }
.fx-toast[hidden]{ display:none; }

/* página completa do lead (D6) */
.lead-top{ margin-bottom:14px; }
.lead-voltar .fx-ico, .lead-voltar svg{ width:18px; height:18px; }
.lead-crumb{ color:var(--muted); font-size:13px; }
.lead-crumb b{ color:var(--ink); font-weight:500; }
.lead-pagina{ margin-bottom:18px; }
.lead-excluir{ max-width:980px; margin:0 auto 24px; display:flex; justify-content:flex-end; }

@media (max-width:640px){
  .fx-h2{ grid-template-columns:1fr 1fr; }
  .fx-h2 > :last-child{ grid-column:1 / -1; }
  .fx-btn-perder{ width:100%; }
  .fx-row{ grid-template-columns:96px minmax(0,1fr); }
  .fx-row__a{ grid-column:2; justify-content:flex-start; }
  .fx__head, .fx__body{ padding-left:14px; padding-right:14px; }
  .fx-tools .fx-icobtn[data-nav]{ display:none; }
}
@media (prefers-reduced-motion: reduce){
  .fx--drawer, .fx-overlay{ transition:none; }
  .fx-salvo.is-pop{ animation:none; }
}

/* ==========================================================================
   CRM · FASE 1 — CARTÃO DO KANBAN (K2)
   ========================================================================== */
.kb-owner{
  width:24px; height:24px; flex:none; margin-left:auto;
  display:grid; place-items:center; border-radius:50%;
  background:#26305a; color:#fff; font-size:9.5px; font-weight:700;
}
.kb-owner--closer{ background:var(--yellow); color:#14110a; }
.kb-owner--gestor{ background:#14b8a6; color:#04201c; }
.kb-owner--vazio{ background:none; border:1px dashed var(--line); color:var(--muted); }
[data-theme="claro"] .kb-owner--sdr{ background:#dfe5f6; color:#1f2a52; }
.kb-next{
  margin:9px 0 0; padding:7px 9px; border-radius:10px;
  border:1px solid rgba(252,190,44,.3); background:rgba(252,190,44,.07);
}
.kb-next--atrasada{ border-color:rgba(229,86,111,.5); background:rgba(229,86,111,.1); }
.kb-next--sem{ border-color:rgba(249,115,22,.45); background:rgba(249,115,22,.07); border-style:dashed; }
.kb-next--amanha, .kb-next--futura{ border-color:rgba(63,107,255,.3); background:rgba(63,107,255,.07); }
.kb-next__due{ display:flex; align-items:center; gap:5px; font-size:10.5px; font-weight:700; color:#ffcb4d; margin-bottom:3px; }
.kb-next__due svg{ width:12px; height:12px; stroke:currentColor; flex:none; }
.kb-next--atrasada .kb-next__due{ color:#ff8ea3; }
.kb-next--sem .kb-next__due{ color:#fdba74; }
.kb-next--amanha .kb-next__due, .kb-next--futura .kb-next__due{ color:#9db6ff; }
[data-theme="claro"] .kb-next__due{ color:#7a5500; }
[data-theme="claro"] .kb-next--atrasada .kb-next__due{ color:#b3243f; }
[data-theme="claro"] .kb-next--sem .kb-next__due{ color:#b45309; }
[data-theme="claro"] .kb-next--amanha .kb-next__due, [data-theme="claro"] .kb-next--futura .kb-next__due{ color:#1f47b8; }
.kb-next__txt{
  font-size:12px; line-height:1.45; color:var(--ink);
  white-space:pre-line; overflow-wrap:anywhere;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.kb-next__txt--vazio{ color:var(--muted); font-style:italic; }
.kb-next.is-aberto .kb-next__txt{ -webkit-line-clamp:unset; display:block; }
.kb-next__mais{ padding:0; margin-top:2px; border:0; background:none; color:#ffcb4d; font-size:11px; font-weight:600; cursor:pointer; }
[data-theme="claro"] .kb-next__mais{ color:#083fc9; }
.kb-card__utags{ display:flex; flex-wrap:wrap; gap:4px; margin:8px 0 0; }
.kb-card__utags .fx-tag{ font-size:10.5px; padding:1px 8px; }
.kb-card__valor{ color:var(--ok); font-weight:700; font-size:12px; }
.kb-card.is-aberto{ border-color:var(--blue); box-shadow:0 0 0 2px rgba(63,107,255,.45); }
.kb-col__soma{ margin:-6px 0 0; padding:0 14px 8px 42px; color:var(--ok); font-size:11.5px; font-weight:600; }
/* com o painel aberto, a próxima ação do cartão continua legível */
.kb-card--acao-atrasada .kb-card__acao, .kb-card .kb-card__acao{ display:none; }

/* ==========================================================================
   CRM · FASE 2 — ETAPAS (K1), TAREFAS (C1) E TAGS (C2)
   ========================================================================== */

/* menu: Tags como subitem de Configurações */
.ad__nav a.ad__sub{ padding-left:44px; font-size:13.5px; }
.ad__nav a.ad__sub svg{ width:17px; height:17px; }
.ad.is-collapsed .ad__nav a.ad__sub{ padding-left:0; }

/* ---- Kanban: dono da etapa, filtro de tag, próxima tarefa no cartão ---- */
.kb-col__dono{
  display:inline-block; margin-right:3px; padding:0 5px; border-radius:5px; vertical-align:1px;
  font-size:10px; font-weight:700; letter-spacing:.02em;
  background:rgba(63,107,255,.16); color:#9db6ff;
}
.kb-col__dono--closer{ background:rgba(252,190,44,.16); color:#ffcb4d; }
[data-theme="claro"] .kb-col__dono{ background:rgba(8,63,201,.08); color:#1f47b8; }
[data-theme="claro"] .kb-col__dono--closer{ background:#fff3cf; color:#7a5500; }
.kb-col.is-closed .kb-col__dono{ display:none; }

.kb-tagfiltro{
  display:inline-flex; align-items:center; gap:6px;
  height:42px; padding:0 4px 0 12px;
  border:1px solid var(--line); border-radius:12px;
  background:var(--surface); color:var(--ink-2);
}
.kb-tagfiltro svg{ width:16px; height:16px; stroke:currentColor; flex:none; }
.kb-tagfiltro select{
  height:38px; max-width:210px; padding:0 26px 0 2px;
  border:0; background:transparent; color:inherit; font-size:13.5px; font-weight:500; cursor:pointer;
  appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%237d88b3' stroke-width='2'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 8px center;
}
.kb-tagfiltro select:focus{ outline:none; }
.kb-tagfiltro select option, .kb-tagfiltro select optgroup{ background:var(--surface); color:var(--ink); }
.kb-tagfiltro.is-on{ border-color:var(--blue); background:rgba(63,107,255,.1); color:var(--ink); }

.kb-next__due span{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kb-next__due b{ font-weight:700; }
.kb-next__n{
  margin-left:auto; flex:none; padding:0 6px; border-radius:99px;
  background:var(--surface-2); color:var(--ink-2); font-size:10px; font-weight:700;
}

/* ---- Ficha: dono da etapa ---- */
.fx-dono{
  margin-left:4px; padding:0 5px; border-radius:5px; font-style:normal;
  font-size:9.5px; font-weight:700; letter-spacing:.03em;
  background:rgba(63,107,255,.16); color:#9db6ff;
}
.fx-dono--closer{ background:rgba(252,190,44,.16); color:#ffcb4d; }
[data-theme="claro"] .fx-dono{ background:rgba(8,63,201,.08); color:#1f47b8; }
[data-theme="claro"] .fx-dono--closer{ background:#fff3cf; color:#7a5500; }

/* avatar do responsável (ficha e tela de tarefas) */
.fx-owner{
  width:24px; height:24px; flex:none;
  display:inline-grid; place-items:center; border-radius:50%;
  background:#26305a; color:#fff; font-size:9.5px; font-weight:700;
}
.fx-owner--closer{ background:var(--yellow); color:#14110a; }
.fx-owner--gestor{ background:#14b8a6; color:#04201c; }
.fx-owner--vazio{ background:none; border:1px dashed var(--line); color:var(--muted); }
[data-theme="claro"] .fx-owner--sdr{ background:#dfe5f6; color:#1f2a52; }

/* ---- Ficha: próxima tarefa no topo ---- */
.fx-acao__tipo{ display:inline-flex; align-items:center; gap:4px; color:var(--ink-2); font-size:12px; font-weight:500; }
.fx-acao__tipo .fx-ico{ width:13px; height:13px; }
.fx-acao__top .fx-owner{ margin-left:auto; }
.fx-acao__tit{ margin:0; font-size:15px; font-weight:600; line-height:1.35; }
.fx-acao__desc{ font-size:13px; line-height:1.55; color:var(--ink-2); white-space:pre-line; overflow-wrap:anywhere; }
.fx-acao__vazio{ margin:0; color:var(--ink-2); font-size:13px; }
.fx-acao__btns{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.fx-acao__btns .fx-ico{ width:15px; height:15px; }
.fx-acao__mais{ margin-left:auto; }

/* ---- Ficha: aba Tarefas ---- */
.fx-tar-novo{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:2px 0 4px; }
.fx-tar-novo .fx-ico{ width:15px; height:15px; }
.fx-sel--modelo{ width:auto; min-width:220px; flex:1; }
.fx-tar-vazio{ display:block; padding:12px; border:1px dashed var(--line); border-radius:10px; font-size:13px; }
.fx-tarefas{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.fx-tarefa{
  display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:10px; align-items:start;
  padding:10px 12px; border:1px solid var(--line); border-left:3px solid var(--line-2, var(--line)); border-radius:10px;
  background:var(--bg);
}
.fx-tarefa--atrasada{ border-left-color:#e5566f; }
.fx-tarefa--hoje{ border-left-color:var(--yellow); }
.fx-tarefa--amanha, .fx-tarefa--futura{ border-left-color:var(--blue); }
.fx-tarefa--concluida{ opacity:.72; border-left-color:var(--ok); }
.fx-tarefa--concluida .fx-tarefa__tit{ text-decoration:line-through; text-decoration-color:var(--muted); }
.fx-tarefa__ck{
  width:22px; height:22px; margin-top:1px; padding:0;
  display:grid; place-items:center;
  border:2px solid var(--muted); border-radius:50%; background:transparent; color:#fff; cursor:pointer;
  transition:border-color .15s, background .15s;
}
.fx-tarefa__ck:hover{ border-color:var(--ok); background:rgba(47,191,113,.15); }
.fx-tarefa__ck.is-on{ border-color:var(--ok); background:var(--ok); }
.fx-tarefa__ck .fx-ico{ width:13px; height:13px; }
.fx-tarefa__main{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.fx-tarefa__meta{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; color:var(--muted); font-size:11.5px; }
.fx-tarefa__meta .fx-selo{ padding:2px 8px; font-size:11px; }
.fx-tarefa__tipo{ display:inline-flex; align-items:center; gap:4px; }
.fx-tarefa__tipo .fx-ico{ width:12px; height:12px; }
.fx-tarefa__tit{ font-size:13.5px; font-weight:600; }
.fx-tarefa__desc{ font-size:13px; line-height:1.5; color:var(--ink-2); white-space:pre-line; overflow-wrap:anywhere; }
.fx-tarefa__res{ font-size:12.5px; color:var(--ink-2); white-space:pre-line; }
.fx-tarefa__res span{ color:var(--muted); }
.fx-tarefa__lado{ display:flex; align-items:center; gap:4px; }
.fx-tarefa:hover .fx-mini--edit, .fx-tarefa .fx-mini--edit:focus-visible{ opacity:1; }

/* ---- Ficha: tags agrupadas e criação rápida ---- */
.fx-tagpop__grp[hidden]{ display:none; }
.fx-tagpop__gt{ display:block; margin:6px 4px 2px; color:var(--muted); font-size:10.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.fx-tagpop__criar{ display:flex; flex-direction:column; gap:6px; margin-top:6px; padding-top:8px; border-top:1px solid var(--line); }
.fx-tagpop__criar[hidden]{ display:none; }
.fx-tagpop__criar button{
  display:flex; align-items:center; gap:6px; width:100%; padding:7px 8px;
  border:0; border-radius:8px; background:rgba(63,107,255,.12); color:var(--ink); font-size:13px; font-weight:500; text-align:left; cursor:pointer;
}
.fx-tagpop__criar button .fx-ico{ width:14px; height:14px; }
.fx-tagpop__criar label{ display:flex; align-items:center; gap:6px; color:var(--muted); font-size:12px; }
.fx-tagpop__criar select{ flex:1; height:30px; padding:0 6px; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--ink); }

/* ---- Janela de tarefa (nova, editar, concluir) e Negócio futuro ---- */
.fx-dlg--tarefa .fx-dlg__box{ width:min(620px, 100%); border-top-color:var(--yellow); }
.fx-tf__fld{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.fx-tf__fld > span{ font-size:12px; color:var(--ink-2); font-weight:500; }
.fx-tf__fld input, .fx-tf__fld select{
  height:38px; padding:0 10px; border:1px solid var(--line); border-radius:10px; background:var(--bg); color:var(--ink); font:inherit; font-size:13.5px;
}
.fx-tf__fld select.fx-sel{ padding-right:30px; }
.fx-tf__fld textarea.fx-auto{ font-size:13px; }
.fx-tf__fld input:focus, .fx-tf__fld select:focus{ outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(63,107,255,.2); }
.fx-dlg input[type="date"], .fx-dlg input[type="time"]{ color-scheme:dark; }
[data-theme="claro"] .fx-dlg input[type="date"], [data-theme="claro"] .fx-dlg input[type="time"]{ color-scheme:light; }
.fx-tf__linha{ display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end; }
.fx-tf__fld--tipo{ flex:0 0 150px; }
.fx-tf__fld--tit{ flex:1 1 220px; }
.fx-tf__fld--resp{ flex:1 1 180px; }
.fx-tf__campos{ display:flex; flex-direction:column; gap:10px; }
.fx-tf__campos[hidden]{ display:none; }
.fx-tf__rapido{ margin-top:-2px; }
.fx-tf__feita{ display:flex; align-items:center; gap:8px; padding:9px 12px; border-radius:10px; background:rgba(47,191,113,.1); color:var(--ink); font-size:13.5px; }
.fx-tf__feita .fx-ico{ width:16px; height:16px; color:var(--ok); }
.fx-tf__prox{ display:flex; flex-direction:column; gap:10px; padding:12px; border:1px solid var(--line); border-radius:12px; background:var(--bg); }
.fx-tf__ck{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:13.5px; cursor:pointer; }
.fx-tf__ck input{ accent-color:var(--yellow); width:16px; height:16px; }
.fx-tf__ck small{ color:var(--muted); font-size:12px; font-weight:400; }
.fx-tf__aviso{ margin:0; padding:8px 10px; border-radius:8px; background:rgba(249,115,22,.1); color:#fdba74; font-size:12.5px; }
[data-theme="claro"] .fx-tf__aviso{ color:#b45309; background:#fff1e6; }

/* ---- Tela Tarefas ---- */
.tf-bar{ display:flex; flex-wrap:wrap; align-items:center; gap:12px 20px; margin-bottom:18px; }
.tf-resp{ display:flex; align-items:center; gap:8px; color:var(--ink-2); font-size:13.5px; }
.tf-resp .inp{ width:auto; min-width:220px; min-height:42px; padding-top:8px; padding-bottom:8px; }
.tf-resumo{ display:flex; flex-wrap:wrap; gap:6px 18px; color:var(--muted); font-size:13px; }
.tf-resumo b{ color:var(--ink); }
.tf-resumo .is-alerta, .tf-resumo .is-alerta b{ color:#ff8ea3; }
.tf-resumo .is-atencao, .tf-resumo .is-atencao b{ color:#fdba74; }
[data-theme="claro"] .tf-resumo .is-alerta, [data-theme="claro"] .tf-resumo .is-alerta b{ color:#b3243f; }
[data-theme="claro"] .tf-resumo .is-atencao, [data-theme="claro"] .tf-resumo .is-atencao b{ color:#b45309; }
.tf-lista{ display:flex; flex-direction:column; gap:18px; }
.tf-sec{ padding:16px 18px 8px; border:1px solid var(--line); border-radius:16px; background:var(--surface); }
.tf-sec--atrasadas{ border-top:3px solid #e5566f; }
.tf-sec--hoje{ border-top:3px solid var(--yellow); }
.tf-sec--proximas, .tf-sec--adiante{ border-top:3px solid var(--blue); }
.tf-sec__t{ display:flex; align-items:center; gap:8px; margin:0 0 8px; font-size:15px; font-weight:600; }
.tf-sec__t b{ min-width:24px; padding:1px 8px; border-radius:99px; background:var(--surface-2); color:var(--ink-2); font-size:12px; text-align:center; }
.tf-sec--atrasadas .tf-sec__t b{ background:#e5566f; color:#fff; }
.tf-sec__t .fx-ico{ width:17px; height:17px; }
.tf-dia{ margin:12px 0 4px; color:var(--ink-2); font-size:12.5px; font-weight:600; }
.tf-vazio{ margin:4px 0 10px; color:var(--muted); font-size:13px; }
.tf-item{
  display:grid; grid-template-columns:auto 58px minmax(0,1fr) auto; gap:12px; align-items:start;
  margin:0 -10px; padding:11px 10px; border-radius:12px; cursor:pointer;
  border-bottom:1px solid var(--line);
}
.tf-item:last-child{ border-bottom:0; }
.tf-item:hover, .tf-item:focus-visible{ background:var(--surface-2); outline:none; }
.tf-item__hora{ display:flex; flex-direction:column; line-height:1.2; }
.tf-item__hora b{ font-size:16px; font-weight:700; }
.tf-item__hora small{ color:var(--muted); font-size:11.5px; }
.tf-item--atrasada .tf-item__hora b{ color:#ff8ea3; }
[data-theme="claro"] .tf-item--atrasada .tf-item__hora b{ color:#b3243f; }
.tf-item__main{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.tf-item__top{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; font-size:14px; }
.tf-item__top .fx-selo{ padding:2px 8px; font-size:11px; }
.tf-item__tipo{ display:inline-flex; align-items:center; gap:4px; padding:1px 7px; border-radius:6px; background:var(--surface-2); color:var(--ink-2); font-size:11.5px; font-weight:500; }
.tf-item__tipo .fx-ico{ width:12px; height:12px; }
.tf-item__lead{ color:var(--ink-2); font-size:12.5px; }
.tf-item__lead strong{ color:var(--ink); font-weight:600; }
.tf-item__lead .tag{ margin-left:4px; }
.tf-item__desc{
  color:var(--ink-2); font-size:12.5px; line-height:1.45; white-space:pre-line; overflow-wrap:anywhere;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.tf-item__acoes{ display:flex; align-items:center; gap:6px; }
.tf-ck{ margin-top:4px; }
.tf-sem{ padding:16px 18px; border:1px dashed rgba(249,115,22,.6); border-radius:16px; background:rgba(249,115,22,.07); }
.tf-sem .tf-sec__t{ color:#fdba74; }
.tf-sem .tf-sec__t b{ background:#f97316; color:#fff; }
[data-theme="claro"] .tf-sem .tf-sec__t{ color:#b45309; }
.tf-sem__sub{ margin:-4px 0 10px; color:var(--ink-2); font-size:13px; }
.tf-sem__lista{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:6px; }
.tf-sem__lead{
  display:inline-flex; align-items:center; gap:8px; max-width:100%;
  padding:7px 10px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink);
  font-size:13px; text-align:left; cursor:pointer;
}
.tf-sem__lead:hover{ border-color:#f97316; }
.tf-sem__lead span:not(.tag):not(.fx-owner){ color:var(--muted); font-size:12px; }
@media (max-width:700px){
  .tf-item{ grid-template-columns:auto minmax(0,1fr); }
  .tf-item__hora{ grid-column:2; flex-direction:row; gap:6px; align-items:baseline; }
  .tf-item__main{ grid-column:2; }
  .tf-item__acoes{ grid-column:2; }
  .tf-ck{ grid-row:1 / span 3; }
  .tf-resp .inp{ min-width:0; }
}

/* ---- Configurações › Tags ---- */
.tg-grupo{ display:flex; align-items:center; gap:8px; margin:16px 0 8px; font-size:13px; font-weight:600; color:var(--ink-2); text-transform:uppercase; letter-spacing:.04em; }
.tg-grupo small{ padding:0 7px; border-radius:99px; background:var(--surface-2); font-size:11px; color:var(--muted); }
.tg-tbl th, .tg-tbl td{ padding:10px 14px; vertical-align:middle; }
.tg-tbl th:first-child, .tg-tbl td:first-child{ padding-left:22px; white-space:normal; }
.tg-tbl th:last-child, .tg-tbl td:last-child{ padding-right:22px; width:1%; white-space:nowrap; }
.tg-desc{ margin-top:4px; color:var(--ink-2); font-size:12.5px; line-height:1.4; }
.tg-auto{ margin-left:6px; padding:1px 6px; border-radius:6px; background:var(--surface-2); color:var(--muted); font-size:10.5px; }
.tg-tbl tr.is-arquivada td{ opacity:.55; }
.tg-tbl tr.is-arquivada td:last-child{ opacity:1; }
.tg-cores{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.tg-cor{ width:26px; height:26px; padding:0; border:2px solid transparent; border-radius:50%; background:var(--tc); cursor:pointer; }
.tg-cor.is-on{ border-color:var(--ink); box-shadow:0 0 0 2px var(--surface) inset; }
.tg-cores input[type="color"]{ width:34px; height:30px; padding:0 2px; border:1px solid var(--line); border-radius:8px; background:var(--bg); cursor:pointer; }
.tg-cores .fx-tag{ margin-left:4px; }

/* ==========================================================================
   CRM · FASE 3 — MOTIVOS (C3), COMERCIAL (C4), FICHA (D3), REGRAS (C5),
   HISTÓRICO (C6)
   ========================================================================== */

/* ---- Ficha: aba Comercial ---- */
.fx-mesa{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:12px 14px; border-radius:12px;
  border:1px solid rgba(47,191,113,.35); background:rgba(47,191,113,.08);
}
.fx-mesa span{ display:block; font-weight:600; font-size:13px; }
.fx-mesa small{ color:var(--muted); font-size:11.5px; }
.fx-mesa b{ color:var(--ok); font-size:20px; font-weight:700; white-space:nowrap; }
.fx-aviso-valores{ margin:0; padding:10px 12px; border:1px dashed var(--line); border-radius:10px; color:var(--muted); font-size:12.5px; }
.fx-grid2{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px 12px; }
.fx-grid2 .fx-tf__fld select, .fx-grid2 .fx-tf__fld input{ width:100%; }
.fx-pane .fx-tf__fld input[type="date"], .fx-pane .fx-tf__fld select{
  height:38px; padding:0 10px; border:1px solid var(--line); border-radius:10px; background:var(--bg); color:var(--ink); font:inherit; font-size:13.5px;
}
.fx-pane input[type="date"]{ color-scheme:dark; }
[data-theme="claro"] .fx-pane input[type="date"]{ color-scheme:light; }
.fx-dica{ display:flex; align-items:center; gap:6px; margin:0; color:var(--muted); font-size:12px; }
.fx-dica .fx-ico{ width:13px; height:13px; }
.fx-simnao{ display:flex; gap:8px; }
.fx-simnao input{ accent-color:var(--yellow); }
.fx-selo--ok{ background:rgba(47,191,113,.16); color:#6ee7a8; }
.fx-selo--ok .fx-ico{ width:12px; height:12px; }
[data-theme="claro"] .fx-selo--ok{ color:#15803d; background:#e7f8ee; }
.fx-sec .fx-selo{ margin-left:6px; vertical-align:1px; text-transform:none; letter-spacing:0; }
.fx-passagem{ display:flex; flex-direction:column; gap:10px; }
.fx-pass{ display:flex; flex-direction:column; gap:4px; }
.fx-pass > span{ font-size:12px; color:var(--ink-2); font-weight:600; }
.fx-pass > span small{ color:var(--muted); font-weight:400; }
.fx-pass.is-falta > span::after{ content:" · obrigatório para a passagem"; color:#fdba74; font-weight:500; }
[data-theme="claro"] .fx-pass.is-falta > span::after{ color:#b45309; }
.fx-pass textarea.fx-auto{ font-size:13px; }
.fx-pass select.fx-sel{ max-width:220px; }
.fx-pass--info p{ margin:0; font-size:13px; color:var(--ink); }
.fx-sel--mini{ height:32px; width:auto; min-width:150px; font-size:13px; }
.fx-row__v .fx-link{ margin-left:8px; }

/* ---- Ficha: histórico com filtros (C6) ---- */
.fx-tl-top{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; }
.fx-tl-top .fx-sec{ margin:0; }
.fx-hfiltro{ display:flex; flex-wrap:wrap; gap:4px; }
.fx-hfiltro button{
  height:28px; padding:0 10px; border:1px solid var(--line); border-radius:99px;
  background:var(--surface); color:var(--ink-2); font-size:12px; cursor:pointer;
}
.fx-hfiltro button[aria-pressed="true"]{ border-color:var(--blue); background:rgba(63,107,255,.14); color:var(--ink); }
.fx-tl > li[hidden]{ display:none; }
.fx-url{ display:inline-block; max-width:100%; overflow-wrap:anywhere; font-size:12.5px; color:var(--ink-2); }

/* ---- Janela de requisitos da etapa (C5) e de perda (C3) ---- */
.fx-req{ display:flex; flex-direction:column; gap:10px; padding:12px; border:1px solid var(--line); border-radius:12px; background:var(--bg); }
.fx-req h4{ margin:0; font-size:13px; font-weight:600; }
.fx-req__dica{ margin:0; color:var(--muted); font-size:12px; }
.fx-req__mesa{ grid-column:1 / -1; margin:0; font-size:13px; color:var(--ink-2); }
.fx-req__mesa b{ color:var(--ok); }
.fx-req__mesa small{ color:var(--muted); }
.fx-req textarea.fx-auto{ font-size:13px; }
.fx-dlg__reab{ display:flex; flex-direction:column; gap:4px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--bg); }
.fx-dlg__reab label{ display:flex; flex-direction:column; gap:4px; }
.fx-dlg__reab span{ font-size:12px; color:var(--ink-2); font-weight:500; }
.fx-dlg__reab span small{ color:var(--muted); font-weight:400; }
.fx-dlg__reab input{ height:38px; max-width:200px; padding:0 10px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink); }
.fx-dlg__reab-obs{ color:var(--muted); font-size:12px; }
@media (max-width:560px){ .fx-grid2{ grid-template-columns:minmax(0,1fr); } }

/* ---- Configurações › Motivos de perda e Comercial ---- */
.mt-cat{ margin:-4px 0 8px; color:var(--muted); font-size:12.5px; }
.mt-nome{ font-weight:600; }
.mt-reab{ white-space:normal !important; font-size:13px; color:var(--ink-2); min-width:110px; }
.mt-op{ display:flex; gap:10px; align-items:flex-start; padding:9px 12px; margin-bottom:6px; border:1px solid var(--line); border-radius:12px; background:var(--bg); cursor:pointer; font-weight:400 !important; }
.mt-op input{ margin-top:3px; accent-color:var(--yellow); }
.mt-op b{ display:block; font-size:13.5px; font-weight:600; color:var(--ink); }
.mt-op small{ color:var(--muted); font-size:12px; }
.mt-op:has(input:checked){ border-color:var(--yellow); }
.mt-ck{ display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--ink-2); cursor:pointer; }
.mt-ck input{ width:16px; height:16px; accent-color:var(--yellow); }
.mt-ck small{ color:var(--muted); }
.ordem-btns{ display:flex; gap:4px; }
.ordem-btns .btn{ width:34px; padding:0; }
.ordem-btns .btn[disabled]{ opacity:.35; cursor:default; }
.op-edit{ display:flex; gap:8px; align-items:center; }
.op-edit .inp{ min-height:38px; padding-top:6px; padding-bottom:6px; }

/* ---- Visão geral: perdas por categoria (C3) ---- */
.perda-cat{
  display:grid; grid-template-columns:1fr auto; gap:2px 10px; margin:12px 0 6px;
  padding:9px 12px; border-radius:10px; text-decoration:none; color:var(--ink);
  border:1px solid var(--line); background:var(--surface-2);
}
.perda-cat:first-of-type{ margin-top:0; }
.perda-cat b{ font-size:13.5px; }
.perda-cat span{ font-weight:700; font-size:13.5px; }
.perda-cat small{ grid-column:1 / -1; color:var(--muted); font-size:12px; }
.perda-cat--pre{ border-left:3px solid #8b95bc; }
.perda-cat--comercial{ border-left:3px solid #e5566f; }
.perda-cat--sem{ border-left:3px solid #f97316; border-style:dashed; }
.perda-cat:hover{ border-color:var(--blue); }

/* formulário de 4 telas: perguntas informativas (sem pontuação) na ficha */
.crit__row--info strong{ color:var(--muted); font-size:11px; font-weight:500; text-transform:uppercase; letter-spacing:.04em; }
.crit__row em{ font-style:italic; }

/* ==========================================================================
   SALVAMENTO EM DESTAQUE (ficha do lead e telas do painel)
   ========================================================================== */
.fx-salvo, .fx__foot-ok{
  display:inline-flex; align-items:center; gap:6px; min-height:26px;
  padding:3px 11px; border-radius:99px; font-size:12.5px; font-weight:600;
  transition:background .2s, color .2s;
}
.fx-salvo:empty{ padding:0; }
.fx-salvo .fx-ico, .fx__foot-ok .fx-ico{ width:14px; height:14px; }
.fx-salvo.is-saving, .fx__foot-ok.is-saving{ background:rgba(252,190,44,.16); color:#ffcb4d; }
.fx-salvo.is-ok, .fx__foot-ok.is-ok{ background:rgba(47,191,113,.16); color:#4ade80; box-shadow:inset 0 0 0 1px rgba(47,191,113,.45); }
.fx-salvo.is-err, .fx__foot-ok.is-err{ background:rgba(229,86,111,.16); color:#ff9fb1; box-shadow:inset 0 0 0 1px rgba(229,86,111,.5); }
.fx-salvo.is-pop, .fx__foot-ok.is-pop{ animation:fx-salvo-pop .6s cubic-bezier(.2,1.4,.4,1); }
.fx__foot-ok.is-ok .fx-ico{ color:inherit; }
[data-theme="claro"] .fx-salvo.is-saving, [data-theme="claro"] .fx__foot-ok.is-saving{ background:#fff3cf; color:#7a5500; }
[data-theme="claro"] .fx-salvo.is-ok, [data-theme="claro"] .fx__foot-ok.is-ok{ background:#e3f7ec; color:#137a43; box-shadow:inset 0 0 0 1px #a8e2c1; }
[data-theme="claro"] .fx-salvo.is-err, [data-theme="claro"] .fx__foot-ok.is-err{ background:#fdecef; color:#b3243f; }
@keyframes fx-salvo-pop{
  0%{ transform:scale(.8); box-shadow:0 0 0 0 rgba(47,191,113,.6); }
  55%{ transform:scale(1.1); }
  100%{ transform:none; box-shadow:0 0 0 10px rgba(47,191,113,0); }
}
.fx-spin{
  width:12px; height:12px; border-radius:50%; flex:none;
  border:2px solid currentColor; border-right-color:transparent;
  animation:fx-girar .7s linear infinite;
}
@keyframes fx-girar{ to{ transform:rotate(360deg); } }

/* o campo salvo brilha em verde por um instante (vermelho se falhou) */
.fx-salvou{ animation:fx-brilho-ok 1.5s ease-out; border-radius:10px; }
.fx-falhou{ animation:fx-brilho-erro 1.5s ease-out; border-radius:10px; }
@keyframes fx-brilho-ok{
  0%{ box-shadow:0 0 0 0 rgba(47,191,113,.0); background-color:rgba(47,191,113,.0); }
  15%{ box-shadow:0 0 0 3px rgba(47,191,113,.55); background-color:rgba(47,191,113,.14); }
  100%{ box-shadow:0 0 0 3px rgba(47,191,113,0); background-color:rgba(47,191,113,0); }
}
@keyframes fx-brilho-erro{
  0%, 100%{ box-shadow:0 0 0 3px rgba(229,86,111,0); }
  15%{ box-shadow:0 0 0 3px rgba(229,86,111,.6); background-color:rgba(229,86,111,.12); }
}

/* avisos das telas com botão Salvar (configurações, usuários, conta) */
.alert--ok{ display:flex; align-items:center; gap:10px; font-weight:600; box-shadow:inset 0 0 0 1px rgba(47,191,113,.45); animation:alerta-ok .7s cubic-bezier(.2,1.3,.4,1); }
.alert--ok::before{
  content:"✓"; flex:none; width:24px; height:24px; display:grid; place-items:center;
  border-radius:50%; background:var(--ok); color:#fff; font-size:14px; font-weight:700;
}
@keyframes alerta-ok{ 0%{ opacity:0; transform:translateY(-10px) scale(.97); } 60%{ opacity:1; transform:translateY(2px) scale(1.01); } 100%{ transform:none; } }

@media (prefers-reduced-motion: reduce){
  .fx-salvo.is-pop, .fx__foot-ok.is-pop, .fx-salvou, .fx-falhou, .alert--ok{ animation:none; }
  .fx-spin{ animation-duration:2s; }
}

/* ==========================================================================
   K3 · FILTROS E VISÕES SALVAS · K4 · ETAPAS PELO PAINEL
   ========================================================================== */

/* barra de visões (Kanban e lista) */
.vs{ position:relative; display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.vs-sel{
  display:inline-flex; align-items:center; gap:6px;
  height:42px; padding:0 4px 0 12px;
  border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--ink-2);
}
.vs-sel svg{ width:17px; height:17px; stroke:currentColor; flex:none; }
.vs-sel select{
  height:38px; max-width:250px; padding:0 26px 0 2px; border:0; background:transparent; color:inherit;
  font-size:13.5px; font-weight:600; cursor:pointer; appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%237d88b3' stroke-width='2'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 8px center;
}
.vs-sel select:focus{ outline:none; }
.vs-sel select option, .vs-sel select optgroup{ background:var(--surface); color:var(--ink); }
.vs-sel.is-on{ border-color:var(--yellow); background:rgba(252,190,44,.1); color:var(--ink); }
.vs-sel.is-personalizada select{ font-weight:500; color:var(--muted); }
.vs-btn{
  display:inline-flex; align-items:center; gap:6px; height:36px; padding:0 12px;
  border:1px solid var(--line); border-radius:10px; background:transparent; color:var(--ink-2);
  font:inherit; font-size:13px; font-weight:500; cursor:pointer;
}
.vs-btn svg{ width:15px; height:15px; stroke:currentColor; }
.vs-btn:hover{ border-color:var(--yellow); color:var(--ink); }
.vs-btn--x:hover{ border-color:#e5566f; color:#ff9fb1; }
.vs-btn--limpar{ border-style:dashed; }
.vs-btn[hidden]{ display:none; }
.vs-pop{
  position:absolute; top:calc(100% + 6px); left:0; z-index:60; width:min(320px, 92vw);
  display:flex; flex-direction:column; gap:10px; padding:14px;
  border:1px solid var(--line); border-radius:14px; background:var(--surface); box-shadow:0 18px 40px rgba(0,0,0,.35);
}
.vs-pop[hidden]{ display:none; }
.vs-pop__fld{ display:flex; flex-direction:column; gap:4px; }
.vs-pop__fld span{ font-size:12px; color:var(--ink-2); font-weight:500; }
.vs-pop__fld input{ height:38px; padding:0 10px; border:1px solid var(--line); border-radius:10px; background:var(--bg); color:var(--ink); font:inherit; font-size:13.5px; }
.vs-pop__fld input:focus{ outline:none; border-color:var(--blue); }
.vs-pop__ck{ display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ink-2); cursor:pointer; }
.vs-pop__ck input{ accent-color:var(--yellow); width:16px; height:16px; }
.vs-pop__erro{ margin:0; color:var(--err); font-size:12.5px; }
.vs-pop__erro:empty{ display:none; }
.vs-pop__acoes{ display:flex; justify-content:flex-end; gap:8px; }
.vs--salvou .vs-sel{ animation:fx-salvo-pop .6s cubic-bezier(.2,1.4,.4,1); border-color:var(--ok); }
.lst-visoes{ margin-bottom:12px; }
[data-theme="claro"] .vs-sel.is-on{ background:#fff7e0; }

/* filtros do Kanban */
.kb-filtros{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:-4px 0 16px; }
.kb-filtros .kb-tagfiltro{ height:38px; }
.kb-filtros .kb-tagfiltro select{ height:34px; font-size:13px; max-width:190px; }
.kb-pontos{ gap:5px; padding-right:8px; font-size:13px; }
.kb-pontos input{
  width:46px; height:28px; padding:0 4px; border:1px solid var(--line); border-radius:8px;
  background:var(--bg); color:var(--ink); font:inherit; font-size:13px; text-align:center;
}
.kb-pontos input:focus{ outline:none; border-color:var(--blue); }

/* K4: tempo na etapa e prazo máximo */
.kb-chip--etapa{ color:var(--ink-2); }
.kb-chip--etapa.is-estourou{ background:rgba(229,86,111,.16); color:#ff9fb1; box-shadow:inset 0 0 0 1px rgba(229,86,111,.45); font-weight:600; }
[data-theme="claro"] .kb-chip--etapa.is-estourou{ color:#b3243f; background:#fdecef; }
.kb-col__prazo{ margin:-4px 0 0; padding:0 14px 8px 42px; color:var(--muted); font-size:11.5px; }
.kb-col__prazo.is-estourou b{ color:#ff8ea3; }
[data-theme="claro"] .kb-col__prazo.is-estourou b{ color:#b3243f; }
.kb-col.is-closed .kb-col__prazo{ display:none; }
.fx-etapa-dias{
  margin-left:4px; padding:0 6px; border-radius:5px; font-style:normal; font-size:10px; font-weight:600;
  background:var(--surface-2); color:var(--ink-2); text-transform:none; letter-spacing:0;
}
.fx-etapa-dias.is-estourou{ background:rgba(229,86,111,.18); color:#ff9fb1; }
[data-theme="claro"] .fx-etapa-dias.is-estourou{ background:#fdecef; color:#b3243f; }
.tbl__etapa{ margin-top:4px; color:var(--muted); font-size:12px; white-space:nowrap; }
.tbl__etapa.is-estourou{ color:#ff8ea3; font-weight:600; }
[data-theme="claro"] .tbl__etapa.is-estourou{ color:#b3243f; }
.lst-pontos{ display:inline-flex; align-items:center; gap:6px; color:var(--ink-2); font-size:13.5px; }
.lst-pontos .inp{ width:70px; min-height:42px; padding:8px 10px; text-align:center; }

/* Configurações › Etapas */
.et-tbl td{ vertical-align:top; }
.et-tbl td:first-child{ white-space:normal; min-width:200px; }
.et-nome{ display:inline-flex; align-items:center; gap:8px; }
.et-nome i{ width:10px; height:10px; border-radius:50%; flex:none; }
.et-dono, .et-prazo{ font-size:13px; }
.et-req{ margin-top:6px; }
.et-chip--auto{ background:rgba(63,107,255,.14); color:#9db6ff; }
[data-theme="claro"] .et-chip--auto{ background:rgba(8,63,201,.08); color:#1f47b8; }
.et-tbl td.et-dono{ white-space:normal; min-width:110px; }
.et-tbl td:last-child{ width:1%; white-space:normal; }
.et-tbl .row-actions{ flex-wrap:wrap; justify-content:flex-end; width:150px; gap:6px; }
.et-chip{ display:inline-block; margin:0 4px 4px 0; padding:1px 7px; border-radius:6px; background:var(--surface-2); color:var(--ink-2); font-size:11px; }
.et-reqs{ display:grid; gap:7px; }
.et-fixo{ margin:0; color:var(--ink); font-weight:600; font-size:13.5px; }
.et-fixo small{ color:var(--muted); font-weight:400; }

/* ==========================================================================
   Relatórios (?p=relatorios)
   ========================================================================== */
.rel-resp{ display:flex; align-items:center; gap:8px; color:var(--ink-2); font-size:13.5px; }
.rel-resp .inp{ width:auto; min-width:190px; max-width:100%; min-height:42px; padding-top:8px; padding-bottom:8px; }
.rel-periodo a{ white-space:nowrap; }
.rel-nav{
  position:sticky; top:0; z-index:6;
  display:flex; gap:6px; overflow-x:auto; scrollbar-width:none;
  margin:-8px -32px 18px; padding:10px 32px;
  background:var(--bg); border-bottom:1px solid transparent;
}
.rel-nav::-webkit-scrollbar{ display:none; }
.rel-nav a{
  flex:none; display:inline-flex; align-items:center; gap:6px;
  padding:7px 13px; border-radius:999px; border:1px solid var(--line); background:var(--surface);
  color:var(--ink-2); text-decoration:none; font-size:13px; font-weight:500; white-space:nowrap;
  transition:border-color .15s, color .15s;
}
.rel-nav a:hover{ color:var(--ink); border-color:var(--blue); }
.rel-nav a b{ min-width:20px; height:20px; padding:0 6px; display:inline-grid; place-items:center; border-radius:999px; background:var(--err); color:#fff; font-size:11px; }
.rel-sec{ scroll-margin-top:72px; }
.rel-kpi-link{ display:block; color:inherit; text-decoration:none; transition:border-color .15s; }
.rel-kpi-link:hover{ border-color:var(--blue); }
.rel-kpi-link.is-alerta .kpi__value{ color:#ff8ea3; }
[data-theme="claro"] .rel-kpi-link.is-alerta .kpi__value{ color:#c4223f; }
.rel-kpi-tempo{ font-size:28px; }

.rel-cab{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin-bottom:4px; }
.rel-cab .card__title{ margin:0; }
.rel-cab__acoes{ display:flex; flex-wrap:wrap; gap:8px; margin-left:auto; }
.rel-cab__acoes .btn svg{ width:16px; height:16px; }
.rel-quando{
  padding:2px 9px; border-radius:999px; background:var(--surface-2); color:var(--ink-2);
  font-size:11.5px; font-weight:600; white-space:nowrap;
}
.rel-quando--agora{ background:rgba(252,190,44,.14); color:var(--yellow); }
[data-theme="claro"] .rel-quando--agora{ background:#fff4d6; color:#8a5a00; }
.rel-h3{ margin:0 0 4px; font-size:14px; font-weight:600; }
.rel-h3.mt{ margin-top:22px; }
.rel-nota{ margin:0 0 14px; color:var(--muted); font-size:12.5px; }
.rel-nota.mt{ margin-top:12px; }
.rel-nota a{ color:var(--blue); }
.rel-vazio{ color:var(--muted); font-size:13px; }
.rel-dot{ display:inline-block; width:9px; height:9px; margin-right:8px; border-radius:50%; vertical-align:0; flex:none; }
.rel-2col{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:26px 34px; }
.rel-2col--fluxo{ grid-template-columns:minmax(0,1fr) minmax(0,1.5fr); }
.rel-2col--sem{ grid-template-columns:minmax(0,1fr) minmax(0,1.6fr); }
.rel-saida > div:first-child{ color:var(--ink-2); }

/* conversão: para onde foram */
.rel-legend{ gap:8px 14px; margin:0 0 14px; font-size:12.5px; }
.rel-c--seguiu{ background:var(--s-qual) !important; }
.rel-c--ganho{ background:var(--ok) !important; }
.rel-c--futuro{ background:var(--yellow) !important; }
.rel-c--perdido{ background:var(--err) !important; }
.rel-c--ainda{ background:repeating-linear-gradient(135deg, var(--line) 0 4px, var(--surface-2) 4px 8px) !important; }
.rel-fluxo{ display:flex; flex-direction:column; gap:16px; }
.rel-fluxo__top{ display:flex; align-items:baseline; gap:6px 10px; flex-wrap:wrap; font-size:14px; margin-bottom:6px; }
.rel-fluxo__nome{ font-weight:500; }
.rel-fluxo__n{ color:var(--muted); font-size:12.5px; }
.rel-fluxo__taxa{ margin-left:auto; font-size:14px; }
.rel-fluxo__taxa span{ color:var(--muted); font-size:12px; font-weight:500; }
.rel-pilha{
  display:flex; height:12px; border-radius:8px; overflow:hidden; background:var(--surface-2);
  transform-origin:left; animation:bar-grow .8s cubic-bezier(.2,.9,.25,1) both;
}
.rel-pilha i{ display:block; height:100%; min-width:3px; }
.rel-pilha i + i{ box-shadow:inset 2px 0 0 var(--surface); }
.rel-destinos{ display:flex; flex-wrap:wrap; gap:4px 12px; margin-top:7px; color:var(--ink-2); font-size:12.5px; }
.rel-destinos span{ display:inline-flex; align-items:center; white-space:nowrap; }
.rel-destinos .rel-dot{ width:7px; height:7px; margin:0 5px 0 4px; }
.rel-destinos b{ margin-left:4px; color:var(--ink); font-weight:600; }
.rel-destinos__mais, .rel-destinos__ainda{ color:var(--muted); }

/* números em faixa */
.rel-mini{ display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:10px; margin:0 0 22px; }
.rel-mini > div{ padding:12px 14px; border-radius:12px; background:var(--surface-2); border:1px solid var(--line); min-width:0; }
.rel-mini span{ display:block; color:var(--muted); font-size:12px; font-weight:500; }
.rel-mini b{ display:block; margin-top:3px; font-size:19px; font-weight:700; letter-spacing:-.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rel-mini small{ display:block; margin-top:2px; color:var(--ink-2); font-size:11.5px; }
.rel-mini .is-ok{ border-color:rgba(47,191,113,.45); }
.rel-mini .is-ok b{ color:var(--ok); }
.rel-mini--valor{ grid-template-columns:repeat(4, minmax(0,1fr)); }
.rel-meta > div:first-child{ font-weight:600; }

/* tabelas dentro das colunas */
.rel-tbl-wrap{ margin:0; border:1px solid var(--line); border-radius:12px; }
.rel-tbl{ font-size:13.5px; }
.rel-tbl th{ padding:10px 12px; letter-spacing:.06em; white-space:normal; vertical-align:bottom; }
.rel-tbl td{ padding:10px 12px; }
.rel-tbl .tag{ font-size:12px; }
.rel-sep{ border-left:1px solid var(--line); }
.rel-tempo__bar{ min-width:170px; }
.rel-tempo__bar b{ display:inline-block; min-width:62px; font-weight:600; font-variant-numeric:tabular-nums; }
.rel-barra{ display:inline-block; width:84px; height:8px; margin-right:10px; border-radius:8px; background:var(--surface-2); overflow:hidden; vertical-align:middle; }
.rel-barra i{ display:block; height:100%; border-radius:8px; transform-origin:left; animation:bar-grow .8s cubic-bezier(.2,.9,.25,1) both; }
.rel-estoura{ color:#ff8ea3; }
[data-theme="claro"] .rel-estoura{ color:#c4223f; }
.rel-tbl a{ color:var(--ink); font-weight:600; text-decoration:none; border-bottom:1px dashed var(--muted); }
.rel-tbl a:hover{ color:var(--blue); border-color:var(--blue); }
.rel-tbl a.rel-acima{ color:#ff8ea3; border-color:currentColor; }
[data-theme="claro"] .rel-tbl a.rel-acima{ color:#c4223f; }
.rel-tbl .tbl__who a{ border:0; }
.rel-falta{ color:var(--yellow); }
[data-theme="claro"] .rel-falta{ color:#8a5a00; }
.rel-valor--futuro td{ color:var(--ink-2); }
.rel-valor--ganho td{ background:rgba(47,191,113,.06); }
.rel-valor--futuro td:first-child, .rel-valor--ganho td:first-child{ white-space:normal; }

/* perdas: barra empilhada por categoria */
.rel-pilha-mini{ background:var(--surface-2); }
.rel-pilha-mini > span{
  display:flex; width:var(--w); height:100%; border-radius:8px; overflow:hidden;
  transform-origin:left; animation:bar-grow .8s cubic-bezier(.2,.9,.25,1) both;
}
.rel-pilha-mini i{ border-radius:0 !important; animation:none !important; }

/* avisos e listas de ação */
.rel-avisos{ display:grid; gap:10px; margin-top:22px; }
.rel-aviso{ padding:12px 14px; border-radius:12px; border:1px solid var(--line); background:var(--surface-2); font-size:13px; }
.rel-aviso b{ display:block; font-size:13.5px; }
.rel-aviso > span{ color:var(--muted); font-size:12.5px; }
.rel-aviso.is-alerta{ border-color:rgba(255,92,122,.4); border-left:3px solid var(--err); }
.rel-aviso__leads{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.rel-aviso__leads a{
  display:flex; flex-direction:column; padding:7px 11px; border-radius:10px; border:1px solid var(--line); background:var(--surface);
  color:var(--ink); text-decoration:none; font-size:13px; font-weight:600; max-width:100%;
}
.rel-aviso__leads a:hover{ border-color:var(--blue); }
.rel-aviso__leads small{ color:var(--muted); font-weight:400; font-size:11.5px; }
.rel-aviso__leads a.rel-aviso__mais{ justify-content:center; color:var(--blue); border-style:dashed; }
.rel-link-row{ color:var(--ink); text-decoration:none; border-radius:8px; margin:-4px -6px; padding:4px 6px; transition:background .15s; }
.rel-link-row:hover{ background:var(--surface-2); }
.rel-sem tbody tr{ cursor:pointer; }
.rel-sem__etapa{ white-space:normal !important; min-width:130px; }
.rel-sem__etapa small{ display:block; margin:2px 0 0 17px; color:var(--muted); font-size:12px; }
.rel-ok{ padding:14px 16px; border-radius:12px; background:rgba(47,191,113,.1); border:1px solid rgba(47,191,113,.35); color:var(--ok); font-weight:600; font-size:14px; }

@media (max-width:1100px){
  .rel-mini{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .rel-mini--valor{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .rel-2col--fluxo, .rel-2col--sem{ grid-template-columns:minmax(0,1fr); }
}
@media (max-width:860px){
  .rel-nav{ margin:-4px -16px 14px; padding:8px 16px; }
  .rel-2col{ grid-template-columns:minmax(0,1fr); }
  .rel-resp{ flex:1 1 100%; }
  .rel-resp .inp{ flex:1; min-width:0; }
}
@media (max-width:520px){
  .rel-periodo{ display:flex; width:100%; }
  .rel-periodo a{ flex:1; padding:7px 4px; text-align:center; }
  .rel-mini, .rel-mini--valor{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .rel-mini > div:last-child:nth-child(odd){ grid-column:1 / -1; }
  .rel-mini b{ font-size:17px; }
  .rel-cab__acoes{ margin-left:0; width:100%; }
  .rel-cab__acoes .btn{ flex:1; }
  .rel-tbl-wrap{ margin:0; }
  .rel-tbl th, .rel-tbl td{ padding:9px 11px; }
}
/* celular: as tabelas viram cartões (rótulo em cima de cada número) */
@media (max-width:600px){
  .tbl-wrap:has(> .rel-cards){ margin:0; overflow:visible; border:0; border-radius:0; }
  .rel-cards thead{ display:none; }
  .rel-cards, .rel-cards tbody{ display:block; }
  .rel-cards tr{
    display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); grid-auto-flow:row dense; gap:8px 14px;
    padding:12px 0; border-bottom:1px solid var(--line);
  }
  .rel-cards--3 tr{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .rel-cards tr:last-child{ border-bottom:0; }
  .rel-cards tr.rel-zero{ display:none; }
  .rel-cards tr:first-child{ padding-top:2px; }
  .rel-cards td, .rel-cards td.num{ display:block; min-width:0 !important; padding:0 !important; border:0 !important; text-align:left; white-space:normal !important; }
  .rel-cards td[data-label]::before{
    content:attr(data-label); display:block; margin-bottom:2px;
    color:var(--muted); font-size:10.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  }
  .rel-cards td:first-child{ grid-column:1 / -1; font-weight:600; }
  .rel-cards td.tbl__who span{ font-weight:400; }
  .rel-cards td.rel-tempo__bar{ grid-column:1 / -1; }
  .rel-cards .rel-barra{ width:calc(100% - 96px); max-width:220px; }
  .rel-valor--ganho td{ background:none; }
  .rel-valor--ganho{ background:rgba(47,191,113,.06); padding-left:10px !important; padding-right:10px !important; border-radius:10px; }
  .rel-sem__etapa small{ margin-left:17px; }
}
@media (prefers-reduced-motion: reduce){
  .rel-pilha, .rel-barra i, .rel-pilha-mini > span{ animation:none; }
}

/* ==========================================================================
   Menu principal com subitens: Funil Comercial (Kanban, Tarefas,
   Relatórios e Configurações) — abre e fecha; no menu recolhido mostra só
   os ícones dos subitens
   ========================================================================== */
.ad__grupo{ display:flex; flex-direction:column; gap:4px; }
.ad__grupo-cab{
  position:relative;
  display:flex; align-items:center; gap:12px; width:100%;
  padding:11px 12px; border:0; border-radius:12px;
  background:transparent; color:var(--ink-2);
  font-weight:500; text-align:left; cursor:pointer;
  transition:background .2s, color .2s;
}
.ad__grupo-cab > svg{ width:20px; height:20px; stroke:currentColor; flex:none; }
.ad__grupo-cab:hover{ background:var(--surface-2); color:var(--ink); }
.ad__grupo-cab:focus-visible{ outline:2px solid var(--blue); outline-offset:-2px; }
.ad__grupo-cab.tem-ativo{ color:var(--ink); }
.ad__grupo-cab > .ad__seta{ width:16px; height:16px; margin-left:auto; color:var(--muted); transition:transform .2s; }
.ad__grupo.is-aberto .ad__seta{ transform:rotate(180deg); }
/* fechado: um ponto sobre o ícone avisa que há ações atrasadas ou tarefas para hoje lá dentro */
.ad__grupo-aviso{
  position:absolute; left:26px; top:7px;
  width:10px; height:10px; border-radius:50%;
  background:var(--yellow); border:2px solid #0c1229;
}
[data-theme="claro"] .ad__grupo-aviso{ border-color:#fff; }
.ad__grupo-aviso.is-alerta{ background:#e5566f; }
.ad__grupo.is-aberto .ad__grupo-aviso{ display:none; }
.ad__grupo-itens{
  display:none; flex-direction:column; gap:2px;
  margin:0 0 4px 22px; padding-left:8px;
  border-left:1px solid var(--line);
}
.ad__grupo.is-aberto .ad__grupo-itens{ display:flex; }
.ad__grupo-itens a{ padding:9px 12px; font-size:14.5px; }
.ad__grupo-itens a svg{ width:18px; height:18px; }
.ad__nav .ad__grupo-itens a.ad__sub{ gap:10px; padding-left:26px; font-size:13px; }
.ad__nav .ad__grupo-itens a.ad__sub svg{ width:16px; height:16px; }
@media (min-width:861px){
  .ad.is-collapsed .ad__grupo-cab{ display:none; }
  .ad.is-collapsed .ad__grupo-itens{
    display:flex; gap:4px; margin:2px 0; padding:6px 0;
    border-left:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  }
  .ad.is-collapsed .ad__grupo-itens a,
  .ad.is-collapsed .ad__nav .ad__grupo-itens a.ad__sub{ justify-content:center; padding:11px 0; }
  .ad.is-collapsed .ad__grupo-itens a svg{ width:20px; height:20px; }
  .ad.is-collapsed .ad__nav .ad__grupo-itens a.ad__sub svg{ width:17px; height:17px; }
}
/* menu mais alto que a tela: a lista de itens rola e o tema e o usuário
   continuam visíveis (no menu recolhido não, por causa das dicas ao lado) */
.ad:not(.is-collapsed) .ad__nav{ min-height:0; overflow-y:auto; scrollbar-width:thin; }
@media (max-width:860px){
  .ad__nav{ min-height:0; overflow-y:auto; scrollbar-width:thin; }
}
@media (prefers-reduced-motion: reduce){
  .ad__grupo-cab > .ad__seta{ transition:none; }
}

/* ==========================================================================
   FUNIL ONBOARDING (Jornada, Kanban, Metas, Desempenho e Configurações)
   JBIZ = lilás · Brindefly = azul · Go-Live = verde
   ========================================================================== */
.onb-mudo{ color:var(--muted); font-size:12.5px; }
.onb-mt4{ margin-top:4px; }
.onb-mt12{ margin-top:12px; }
.onb-centro{ text-align:center; }
.onb-destaque{ color:var(--yellow); }
[data-theme="claro"] .onb-destaque{ color:#083fc9; }
.onb-quebra{ word-break:break-all; }
.onb-linha{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.onb-req{ color:#ff8ea3; }
.onb-vazio{ margin:0; padding:18px 4px; color:var(--muted); font-size:13.5px; text-align:center; }
.onb-perigo{ color:#ff8ea3 !important; }
.onb-perigo:hover{ border-color:rgba(255,92,122,.5) !important; }
[data-uf]{ text-transform:uppercase; }
.inp.is-invalido{ border-color:#ff5c7a; box-shadow:0 0 0 3px rgba(255,92,122,.18); }

/* chips e selos */
.onb-chip{
  display:inline-flex; align-items:center; gap:5px; padding:2px 9px; border-radius:999px;
  background:var(--surface-2); color:var(--ink-2); font-size:11.5px; font-weight:600; white-space:nowrap;
}
.onb-chip--jbiz{ background:rgba(139,92,246,.16); color:#c4b5fd; }
.onb-chip--bfly{ background:rgba(63,107,255,.16); color:#9db6ff; }
.onb-chip--ok{ background:rgba(47,191,113,.16); color:#5fe39b; }
.onb-chip--aviso{ background:rgba(252,190,44,.15); color:#ffd77a; }
.onb-chip--erro{ background:rgba(255,92,122,.15); color:#ff9fb1; }
[data-theme="claro"] .onb-chip--jbiz{ background:#f1ecff; color:#6d3fd6; }
[data-theme="claro"] .onb-chip--bfly{ background:#e9efff; color:#083fc9; }
[data-theme="claro"] .onb-chip--ok{ background:#e3f7ec; color:#138a4a; }
[data-theme="claro"] .onb-chip--aviso{ background:#fff4d6; color:#8a5a00; }
[data-theme="claro"] .onb-chip--erro{ background:#fdecef; color:#b3243f; }
.onb-tag{
  display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border-radius:999px;
  background:rgba(63,107,255,.14); color:#c7d4ff; font-size:12px; font-weight:600; white-space:nowrap;
}
.onb-tag--golive{ background:rgba(47,191,113,.16); color:#5fe39b; }
[data-theme="claro"] .onb-tag{ background:#e9efff; color:#083fc9; }
[data-theme="claro"] .onb-tag--golive{ background:#e3f7ec; color:#138a4a; }
.onb-pulso{ animation:onb-pulso 2.4s ease-in-out infinite; }
@keyframes onb-pulso{ 0%,100%{ box-shadow:0 0 0 0 rgba(47,191,113,.35); } 50%{ box-shadow:0 0 0 7px rgba(47,191,113,0); } }

/* avatares */
.onb-av{
  width:36px; height:36px; flex:none; display:inline-grid; place-items:center; border-radius:50%;
  color:#fff; font-size:13px; font-weight:700; letter-spacing:.02em;
}
.onb-av--sm{ width:28px; height:28px; font-size:11px; }
.onb-av--0{ background:#3f6bff; } .onb-av--1{ background:#8b5cf6; } .onb-av--2{ background:#0f9fb8; }
.onb-av--3{ background:#e0832b; } .onb-av--4{ background:#d6457a; }
.onb-quem{ display:flex; align-items:center; gap:11px; min-width:0; }
.onb-quem > div{ min-width:0; }
.onb-quem > div strong, .onb-quem > div b{ display:block; font-weight:600; }
.onb-quem > div > span{ display:block; color:var(--muted); font-size:12.5px; }
.onb-quem a{ color:inherit; text-decoration:none; }
.onb-quem a:hover{ text-decoration:underline; }
.tbl .onb-av{ color:#fff; font-size:13px; }
.tbl .onb-av--sm{ font-size:11px; }
.onb-ico-btn{
  width:34px; height:34px; display:inline-grid; place-items:center; padding:0; border:1px solid var(--line); border-radius:10px;
  background:transparent; color:var(--muted); cursor:pointer;
}
.onb-ico-btn svg{ width:16px; height:16px; stroke:currentColor; }
.onb-ico-btn:hover{ color:#ff8ea3; border-color:rgba(255,92,122,.5); }
.onb-tbl td.tbl__who{ min-width:180px; }
.onb-tbl th, .onb-tbl td{ padding-left:14px; padding-right:14px; }
.onb-tbl th:first-child, .onb-tbl td:first-child{ padding-left:22px; }
@media (max-width:1280px){ .onb-col-opc{ display:none; } }
.onb-quem--sm{ gap:9px; font-size:13px; }

/* filtros e tabelas */
.onb-filtros{ align-items:flex-end; }
.onb-filtro{ display:flex; flex-direction:column; gap:5px; color:var(--ink-2); font-size:12.5px; }
.onb-filtro .inp{ min-height:42px; padding-top:8px; padding-bottom:8px; }
.onb-tbl td{ vertical-align:middle; }
.onb-tbl-solta{ margin:0 !important; border:1px solid var(--line); border-radius:12px; }
.onb-tbl-solta .tbl th, .onb-tbl-solta .tbl td{ padding:10px 14px; }
.onb-tbl-solta .tbl td:first-child{ white-space:normal; }
.onb-tbl-total td{ font-weight:700; background:var(--surface-2); }
.onb-cab-linha{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px 16px; flex-wrap:wrap; margin-bottom:6px; }
.onb-cab-linha .card__sub{ margin-bottom:8px; }
.onb-2col{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:18px; }

/* avisos, resultados e indicador de gravação */
.onb-aviso{
  display:flex; gap:12px; align-items:flex-start; padding:12px 14px; border-radius:12px;
  background:var(--surface-2); border:1px solid var(--line); font-size:13.5px;
}
.onb-aviso > div{ min-width:0; display:flex; flex-direction:column; gap:3px; }
.onb-aviso b{ color:var(--ink); }
.onb-aviso span{ color:var(--ink-2); }
.onb-aviso__ico{
  width:26px; height:26px; flex:none; display:grid; place-items:center; border-radius:50%;
  background:rgba(252,190,44,.16); color:var(--yellow); font-weight:700; font-size:13px;
}
.onb-aviso--ok{ border-color:rgba(47,191,113,.35); }
.onb-aviso--ok .onb-aviso__ico{ background:rgba(47,191,113,.16); color:var(--ok); }
.onb-aviso--info{ border-color:rgba(63,107,255,.35); }
.onb-aviso--info .onb-aviso__ico{ background:rgba(63,107,255,.16); color:#9db6ff; }
.onb-aviso--erro{ border-color:rgba(255,92,122,.4); }
.onb-aviso--erro .onb-aviso__ico{ background:rgba(255,92,122,.16); color:#ff8ea3; }
.onb-aviso--carregando .onb-aviso__ico{ background:transparent; }
.onb-aviso a{ color:var(--blue); }
.onb-res{ display:grid; gap:8px; margin-top:14px; }
.onb-link{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; word-break:break-all; }
.onb-link a{ color:#9db6ff; font-weight:500; }
[data-theme="claro"] .onb-link a{ color:#083fc9; }
.onb-salvo{ font-size:12.5px; color:var(--muted); min-height:18px; display:inline-flex; align-items:center; gap:6px; }
.onb-salvo.is-pendente{ color:var(--ink-2); }
.onb-salvo.is-salvando{ color:var(--yellow); }
.onb-salvo.is-ok{ color:var(--ok); }
.onb-salvo.is-erro{ color:#ff8ea3; }
.onb-spin{
  display:inline-block; width:16px; height:16px; border:2px solid var(--line); border-top-color:var(--blue);
  border-radius:50%; animation:onb-giro .8s linear infinite; visibility:hidden;
}
.onb-spin.is-on, .is-buscando .onb-spin, .onb-aviso .onb-spin{ visibility:visible; }
@keyframes onb-giro{ to{ transform:rotate(360deg); } }

/* ---- assistente: responsabilidade, etapas e linha do tempo ---- */
.onb-trilha{ margin-bottom:18px; }
.onb-respbar{ display:flex; gap:6px; margin-bottom:14px; }
.onb-respbar__seg{ padding:6px 10px; border-radius:9px; font-size:11.5px; font-weight:600; text-align:center; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.onb-respbar__seg--jbiz{ background:rgba(139,92,246,.14); color:#c4b5fd; }
.onb-respbar__seg--bfly{ background:rgba(63,107,255,.14); color:#9db6ff; }
[data-theme="claro"] .onb-respbar__seg--jbiz{ background:#f1ecff; color:#6d3fd6; }
[data-theme="claro"] .onb-respbar__seg--bfly{ background:#e9efff; color:#083fc9; }
.onb-stepper{ display:grid; grid-template-columns:repeat(9, minmax(76px,1fr)); gap:4px; overflow-x:auto; padding-bottom:4px; }
.onb-step{
  --c:#3f6bff;
  display:flex; flex-direction:column; align-items:center; gap:6px; padding:10px 6px 9px;
  border:1px solid var(--line); border-radius:12px; background:var(--bg); color:var(--ink-2);
  font:inherit; cursor:pointer; text-align:center; transition:border-color .15s, background .15s, transform .15s;
}
.onb-step--jbiz{ --c:#8b5cf6; }
.onb-step:hover:not(:disabled){ border-color:var(--c); transform:translateY(-1px); }
.onb-step__dot{
  width:30px; height:30px; display:grid; place-items:center; border-radius:50%;
  border:2px solid var(--line); background:var(--surface); color:var(--ink-2); font-size:13px; font-weight:700;
}
.onb-step__nome{ font-size:11px; font-weight:600; line-height:1.25; -webkit-hyphens:auto; hyphens:auto; }
.onb-step__resp{ font-size:9.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--c); }
.onb-step.is-feita .onb-step__dot{ background:var(--c); border-color:var(--c); color:#fff; }
.onb-step.is-vista{ border-color:var(--c); background:color-mix(in srgb, var(--c) 12%, var(--bg)); color:var(--ink); }
.onb-step.is-vista .onb-step__dot{ border-color:var(--c); box-shadow:0 0 0 4px color-mix(in srgb, var(--c) 25%, transparent); }
.onb-step.is-golive .onb-step__dot{ background:var(--ok); border-color:var(--ok); }
.onb-step.is-travada{ opacity:.45; cursor:not-allowed; }
.onb-tempo{ margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }
.onb-tempo__topo{ display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:26px; }
.onb-tempo__topo b{ display:block; font-size:14px; }
.onb-tempo__topo span{ color:var(--muted); font-size:12.5px; }
.onb-tempo__dir{ display:flex; align-items:center; gap:10px; }
.onb-tempo__pct{ font-size:20px; color:var(--ink); }
.onb-trilho{ position:relative; height:6px; margin:0 14px 44px; border-radius:6px; background:var(--surface-2); }
.onb-trilho__fill{ position:absolute; left:0; top:0; bottom:0; width:0; border-radius:6px; background:linear-gradient(90deg, #8b5cf6, #3f6bff 40%, #2fbf71); transition:width 1.2s cubic-bezier(.22,1,.36,1); }
.onb-marco{
  position:absolute; top:50%; transform:translate(-50%, -50%); display:flex; flex-direction:column; align-items:center;
  padding:0; border:0; background:none; color:var(--ink-2); font:inherit; cursor:pointer;
}
.onb-marco__ponto{
  width:24px; height:24px; display:grid; place-items:center; border-radius:50%;
  background:var(--surface); border:2px solid var(--line); font-size:10.5px; font-weight:700;
}
.onb-marco__data{ position:absolute; top:30px; font-size:10.5px; color:var(--muted); white-space:nowrap; }
.onb-marco.is-feito .onb-marco__ponto{ background:#3f6bff; border-color:#3f6bff; color:#fff; }
.onb-marco.is-atual .onb-marco__ponto{ border-color:var(--yellow); color:var(--ink); box-shadow:0 0 0 4px rgba(252,190,44,.22); }
.onb-marco.is-travado{ cursor:not-allowed; opacity:.55; }

/* ---- assistente: formulários ---- */
.onb-lados{ display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:18px; align-items:start; }
.onb-lado{ display:grid; gap:18px; position:sticky; top:16px; }
.onb-form .card__title{ flex-wrap:wrap; margin-bottom:16px; }
.onb-grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:0 14px; }
.onb-grid > *{ grid-column:span 12; min-width:0; }
.onb-grid .fld{ margin-bottom:14px; }
.onb-grid > .onb-c1{ grid-column:span 1; } .onb-grid > .onb-c2{ grid-column:span 2; } .onb-grid > .onb-c3{ grid-column:span 3; }
.onb-grid > .onb-c4{ grid-column:span 4; } .onb-grid > .onb-c6{ grid-column:span 6; } .onb-grid > .onb-c9{ grid-column:span 9; }
.onb-grid > div.onb-c12{ margin-bottom:14px; }
.onb-grid > .fld.onb-c12{ margin-bottom:14px; }
.onb-obs{ min-height:70px !important; }
.onb-busca{ position:relative; }
.onb-busca .onb-spin{ position:absolute; right:12px; top:50%; margin-top:-8px; }
.onb-grupo{ display:flex; gap:8px; }
.onb-grupo .inp{ flex:1; min-width:0; }
.onb-bloco{ padding:16px; border-radius:14px; border:1px solid var(--line); background:var(--bg); }
.onb-bloco__topo{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; margin-bottom:14px; }
.onb-bloco__topo > div > b{ display:block; font-size:14.5px; }
.onb-bloco__topo > div > span{ color:var(--muted); font-size:12.5px; }
.onb-bloco__topo > div > span b{ color:var(--ink-2); }
.onb-bloco--acao{ display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:16px; border-left:3px solid var(--yellow); }
.onb-bloco--acao > div > b{ display:block; }
.onb-bloco--acao > div > span{ color:var(--ink-2); font-size:13px; }
.onb-checks{ display:flex; gap:16px; align-items:center; min-height:46px; }
.onb-cc-cliente{ display:flex; flex-wrap:wrap; gap:6px 18px; padding:10px 12px; margin-bottom:14px; border-radius:10px; background:var(--surface-2); font-size:12.5px; color:var(--ink-2); }
.onb-cc-cliente b{ color:var(--ink); }
.onb-botoes{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.onb-botoes small{ color:var(--muted); font-size:12px; }
.onb-drop{
  display:flex; align-items:center; justify-content:center; gap:10px; padding:20px; margin-bottom:14px;
  border:2px dashed var(--line); border-radius:12px; color:var(--ink-2); font-size:13.5px; cursor:pointer;
  transition:border-color .15s, background .15s;
}
.onb-drop:hover, .onb-drop.is-arrastando{ border-color:var(--blue); background:rgba(63,107,255,.06); }
.onb-drop.is-enviando{ opacity:.7; pointer-events:none; }
.onb-drop__ico{ font-size:20px; }
.onb-drop b{ color:var(--ink); }
.onb-cp-grade{ display:grid; grid-template-columns:repeat(auto-fill, minmax(132px,1fr)); gap:12px; }
.onb-cp{ position:relative; margin:0; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:var(--surface); }
.onb-cp__thumb{
  position:relative; display:grid; place-items:center; width:100%; height:110px; padding:0; border:0;
  background:var(--surface-2); cursor:zoom-in;
}
.onb-cp__thumb img{ width:100%; height:100%; object-fit:cover; }
.onb-cp__tipo{ font-size:20px; font-weight:700; color:#ff8ea3; }
.onb-cp__tag{ position:absolute; left:8px; top:8px; padding:2px 7px; border-radius:6px; background:var(--ok); color:#06261a; font-size:10px; font-weight:700; }
.onb-cp figcaption{ padding:8px 10px; font-size:12px; }
.onb-cp figcaption span{ display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; }
.onb-cp figcaption small{ color:var(--muted); font-size:11px; }
.onb-cp__x{
  position:absolute; right:6px; top:6px; width:26px; height:26px; display:grid; place-items:center;
  border:0; border-radius:8px; background:rgba(10,15,34,.75); color:#fff; font-size:12px; cursor:pointer; opacity:0; transition:opacity .15s;
}
.onb-cp:hover .onb-cp__x, .onb-cp__x:focus-visible{ opacity:1; }
@media (hover:none){ .onb-cp__x{ opacity:1; } }
.onb-nav{ display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-top:16px; }
.onb-nav__dir{ display:flex; gap:10px; flex-wrap:wrap; }
#onb-aviso-perm{ margin-top:16px; }
.onb-golive{ text-align:center; padding:48px 24px; }
.onb-golive__ico{ font-size:60px; line-height:1; }
.onb-golive h2{ margin:14px 0 6px; font-size:24px; color:var(--ok); }
.onb-golive p{ margin:0 0 18px; color:var(--ink-2); }
.onb-dados{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:8px 14px; margin:0; font-size:13.5px; }
.onb-dados dt{ color:var(--muted); }
.onb-dados dd{ margin:0; text-align:right; word-break:break-word; }
.onb-dados dd a{ color:var(--blue); }
.onb-tl{ list-style:none; margin:0; padding:0 0 0 14px; border-left:2px solid var(--line); display:grid; gap:12px; }
.onb-tl__item{ position:relative; font-size:13px; }
.onb-tl__item::before{ content:""; position:absolute; left:-20px; top:4px; width:10px; height:10px; border-radius:50%; background:var(--muted); border:2px solid var(--surface); }
.onb-tl__item--avanco::before{ background:#3f6bff; }
.onb-tl__item--retorno::before{ background:#ff9f43; }
.onb-tl__item--golive::before{ background:var(--ok); }
.onb-tl__item small{ display:block; margin-top:2px; color:var(--muted); font-size:11.5px; }
.onb-tl--rolagem{ max-height:340px; overflow-y:auto; padding-right:6px; }

/* ---- modais, visualizador, avisos flutuantes ---- */
.onb-modal{ position:fixed; inset:0; z-index:160; display:flex; align-items:center; justify-content:center; padding:24px; }
.onb-modal__fundo{ position:absolute; inset:0; background:rgba(5,8,20,.6); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); opacity:0; transition:opacity .18s; }
.onb-modal__card{
  position:relative; width:100%; max-width:460px; max-height:calc(100dvh - 48px); display:flex; flex-direction:column;
  border-radius:18px; background:var(--surface); border:1px solid var(--line); box-shadow:0 30px 80px rgba(0,0,0,.45);
  opacity:0; transform:translateY(14px) scale(.98); transition:opacity .18s, transform .22s cubic-bezier(.2,.9,.25,1);
}
.onb-modal__card--lg{ max-width:820px; }
.onb-modal__card--sm{ max-width:380px; }
.onb-modal.is-aberto .onb-modal__fundo{ opacity:1; }
.onb-modal.is-aberto .onb-modal__card{ opacity:1; transform:none; }
.onb-modal__cab{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 18px 12px 22px; border-bottom:1px solid var(--line); }
.onb-modal__cab h3{ margin:0; font-size:17px; }
.onb-modal__corpo{ padding:18px 22px; overflow-y:auto; }
.onb-modal__pe{ display:flex; justify-content:flex-end; flex-wrap:wrap; gap:8px; padding:12px 22px 18px; }
.onb-modal__pe--dentro{ padding:16px 0 0; margin-top:16px; border-top:1px solid var(--line); }
.onb-x{
  width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--line); border-radius:10px;
  background:transparent; color:var(--ink-2); cursor:pointer; font-size:14px;
}
.onb-x:hover{ color:var(--ink); border-color:var(--muted); }
.onb-lightbox{ position:fixed; inset:0; z-index:170; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; padding:24px; background:rgba(5,8,20,.88); }
.onb-lightbox[hidden]{ display:none !important; }
.onb-lightbox__x{ position:absolute; right:18px; top:18px; background:rgba(255,255,255,.08); color:#fff; border-color:rgba(255,255,255,.25); }
.onb-lightbox__corpo{ max-width:min(1000px, 100%); max-height:calc(100dvh - 140px); display:flex; }
.onb-lightbox__corpo img{ max-width:100%; max-height:calc(100dvh - 140px); border-radius:10px; object-fit:contain; }
.onb-lightbox__corpo iframe{ width:min(900px, 92vw); height:calc(100dvh - 140px); border:0; border-radius:10px; background:#fff; }
.onb-lightbox__pe{ display:flex; align-items:center; gap:12px; color:#dfe5ff; font-size:13px; }
.onb-toasts{ position:fixed; right:18px; bottom:18px; z-index:200; display:flex; flex-direction:column; gap:8px; max-width:min(380px, calc(100vw - 36px)); }
.onb-toast{
  padding:11px 14px 11px 16px; border-radius:12px; border-left:4px solid var(--ok);
  background:var(--ink); color:var(--bg); font-size:13.5px; font-weight:500; box-shadow:0 12px 30px rgba(0,0,0,.35);
  animation:onb-toast-in .22s cubic-bezier(.2,.9,.25,1) both;
}
.onb-toast.is-erro{ border-left-color:#ff5c7a; }
.onb-toast.is-saindo{ opacity:0; transform:translateY(6px); transition:opacity .25s, transform .25s; }
@keyframes onb-toast-in{ from{ opacity:0; transform:translateY(10px); } }
.onb-confete{ position:fixed; top:-20px; z-index:300; border-radius:2px; pointer-events:none; animation:onb-cair linear forwards; }
@keyframes onb-cair{ to{ transform:translateY(110vh) rotate(720deg); opacity:.85; } }
.onb-esqueleto{ height:240px; border-radius:12px; background:linear-gradient(90deg, var(--surface-2), var(--line), var(--surface-2)); background-size:200% 100%; animation:onb-brilho 1.2s linear infinite; }
@keyframes onb-brilho{ to{ background-position:-200% 0; } }

/* ---- Kanban ---- */
.onb-kb-filtro .inp{ width:auto; min-width:200px; min-height:42px; padding-top:8px; padding-bottom:8px; }
.onb-kb-legenda{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px; margin:-6px 0 16px; }
.onb-kb-wrap{ overflow-x:auto; padding-bottom:10px; margin:0 -4px; }
.onb-kb{ display:flex; gap:12px; min-height:calc(100dvh - 250px); padding:0 4px; }
.onb-kb-col{
  --c:#3f6bff;
  flex:1 0 236px; max-width:320px; display:flex; flex-direction:column; min-height:0;
  border-radius:16px; background:var(--surface); border:1px solid var(--line); border-top:3px solid var(--c);
  transition:border-color .15s, background .15s;
}
.onb-kb-col--jbiz{ --c:#8b5cf6; }
.onb-kb-col--golive{ --c:#2fbf71; }
.onb-kb-col.is-alvo{ border-color:var(--c); background:color-mix(in srgb, var(--c) 8%, var(--surface)); }
.onb-kb.is-ajustado .onb-kb-col{ flex:1 1 0; min-width:0; max-width:none; }
.onb-kb.is-ajustado .onb-kb-card__valor span, .onb-kb.is-ajustado .onb-kb-card__resp{ display:none; }
.onb-kb-col__cab{ display:flex; align-items:center; gap:6px; padding:12px 12px 10px; border-bottom:1px solid var(--line); }
.onb-kb-col__titulo{ font-size:13px; font-weight:600; line-height:1.3; min-width:0; }
.onb-kb-col__resp{ margin-left:auto; padding:1px 6px; border-radius:6px; background:color-mix(in srgb, var(--c) 18%, transparent); color:var(--c); font-size:9.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.onb-kb-col__n{ min-width:22px; padding:1px 7px; border-radius:999px; background:var(--surface-2); color:var(--ink-2); font-size:11.5px; font-weight:700; text-align:center; }
.onb-kb-col__cards{ flex:1; display:flex; flex-direction:column; gap:8px; padding:10px; overflow-y:auto; max-height:calc(100dvh - 300px); }
.onb-kb-card{
  padding:11px 12px; border-radius:12px; background:var(--bg); border:1px solid var(--line); border-left:3px solid var(--c);
  cursor:grab; transition:border-color .15s, transform .15s, box-shadow .15s; outline:none;
}
.onb-kb-col .onb-kb-card{ --c:inherit; }
.onb-kb-card:hover, .onb-kb-card:focus-visible{ border-color:var(--blue); transform:translateY(-1px); box-shadow:0 8px 18px rgba(0,0,0,.18); }
.onb-kb-card.is-arrastando{ opacity:.45; }
.onb-kb-card.is-travado{ cursor:pointer; }
.onb-kb-card__empresa{ font-weight:600; font-size:13.5px; line-height:1.3; }
.onb-kb-card__contato{ color:var(--muted); font-size:12px; margin-top:2px; }
.onb-kb-card__valor{ margin-top:6px; font-size:12.5px; font-weight:600; color:var(--ink-2); }
.onb-kb-card__valor span{ font-weight:400; color:var(--muted); }
.onb-kb-card__pe{ display:flex; align-items:center; gap:7px; margin-top:9px; font-size:11.5px; color:var(--ink-2); min-width:0; }
.onb-kb-card__resp{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
.onb-kb-card__dias{ margin-left:auto; color:var(--muted); white-space:nowrap; }
.onb-kb-vazio{ margin:6px 0 0; padding:14px 8px; border:1px dashed var(--line); border-radius:10px; color:var(--muted); font-size:12px; text-align:center; }
.onb-det-topo{ margin-bottom:16px; }
.onb-det-topo small{ display:block; margin-top:6px; color:var(--muted); font-size:12px; }
.onb-det-prog{ height:8px; margin-top:12px; border-radius:8px; background:var(--surface-2); overflow:hidden; }
.onb-det-prog i{ display:block; height:100%; border-radius:8px; background:linear-gradient(90deg, #8b5cf6, #3f6bff 45%, #2fbf71); }
.onb-det-stats{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:10px; margin-bottom:14px; }
.onb-det-stats > div{ padding:10px 12px; border-radius:12px; background:var(--surface-2); min-width:0; }
.onb-det-stats span{ display:block; color:var(--muted); font-size:11.5px; }
.onb-det-stats b{ display:block; margin-top:2px; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.onb-det-link{ display:flex; align-items:center; gap:12px; padding:10px 12px; margin-bottom:14px; border-radius:12px; border:1px solid var(--line); }
.onb-det-link > div{ flex:1; min-width:0; }
.onb-det-link small{ display:block; color:var(--muted); font-size:11.5px; }
.onb-det-link a{ display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#9db6ff; font-size:13px; }
[data-theme="claro"] .onb-det-link a{ color:#083fc9; }
.onb-det-cols{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:22px; }
.onb-det-h{ margin:14px 0 10px; color:var(--muted); font-size:11.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.onb-det-cols > div > .onb-det-h:first-child{ margin-top:0; }
.onb-det-obs{ margin-bottom:10px; }
.onb-det-obs p{ margin:6px 0 0; font-size:13px; color:var(--ink-2); white-space:pre-wrap; }

/* ---- Metas ---- */
.onb-metas-topo{ display:grid; grid-template-columns:minmax(280px,400px) minmax(0,1fr); gap:18px; margin-bottom:18px; }
.onb-metas-base{ display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,420px); gap:18px; }
.onb-gauge-card{ display:flex; flex-direction:column; align-items:center; justify-content:center; }
.onb-gauge{ position:relative; width:220px; height:220px; }
.onb-gauge svg{ width:100%; height:100%; transform:rotate(-90deg); }
.onb-gauge circle{ fill:none; stroke-width:18; }
.onb-gauge__trilho{ stroke:var(--surface-2); }
.onb-gauge__arco{ stroke:#3f6bff; stroke-linecap:round; transition:stroke-dashoffset 1.6s cubic-bezier(.22,1,.36,1); }
.onb-gauge__arco--quase{ stroke:var(--yellow); }
.onb-gauge__arco--ok{ stroke:var(--ok); }
.onb-gauge__centro{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.onb-gauge__centro b{ font-size:46px; line-height:1; letter-spacing:-.03em; }
.onb-gauge__centro span{ color:var(--muted); font-size:13px; margin-top:4px; }
.onb-gauge__pct{ margin-top:6px; font-size:18px; }
.onb-cor--bom{ color:#9db6ff; }
.onb-cor--quase{ color:var(--yellow); }
.onb-cor--ok{ color:var(--ok); }
[data-theme="claro"] .onb-cor--bom{ color:#083fc9; }
[data-theme="claro"] .onb-cor--quase{ color:#8a5a00; }
.onb-frase{ margin:14px 0 4px; font-size:17px; font-weight:700; text-align:center; }
.onb-barras{ position:relative; display:flex; align-items:stretch; gap:12px; height:220px; padding-top:6px; }
.onb-barras__col{ flex:1; display:flex; flex-direction:column; align-items:center; gap:6px; min-width:0; height:100%; }
.onb-barras__area{ flex:1; min-height:0; width:100%; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:6px; }
.onb-barras__val{ font-size:12px; font-weight:700; color:var(--ink-2); white-space:nowrap; }
.onb-barras__barra{ flex:none; width:min(46px, 70%); height:3px; border-radius:8px 8px 3px 3px; background:#3f6bff; transition:height 1.1s cubic-bezier(.22,1,.36,1); }
.onb-barras__barra.is-ok{ background:var(--ok); }
.onb-barras__barra.is-passado{ background:color-mix(in srgb, #3f6bff 45%, var(--surface-2)); }
.onb-barras__rot{ font-size:11.5px; color:var(--muted); white-space:nowrap; }
.onb-barras__col.is-atual .onb-barras__rot{ color:var(--ink); font-weight:600; }
.onb-barras--meta .onb-barras__linha{
  position:absolute; left:0; right:0; bottom:calc(24px + (100% - 52px) * var(--meta) / 100);
  border-top:2px dashed var(--yellow); opacity:.75; pointer-events:none;
}
.onb-rank{ list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.onb-rank__item{ display:flex; align-items:center; gap:11px; }
.onb-rank__pos{ width:28px; flex:none; text-align:center; font-size:13px; font-weight:700; color:var(--muted); }
.onb-rank__pos.is-top{ font-size:18px; }
.onb-rank__info{ flex:1; min-width:0; font-size:13.5px; }
.onb-rank__barra{ height:7px; margin-top:6px; border-radius:7px; background:var(--surface-2); overflow:hidden; }
.onb-rank__barra i{ display:block; height:100%; width:0; border-radius:7px; background:linear-gradient(90deg, #3f6bff, #8b5cf6); transition:width 1.1s cubic-bezier(.22,1,.36,1); }
.onb-rank__n{ text-align:right; font-size:20px; font-weight:700; line-height:1; }
.onb-rank__n small{ display:block; margin-top:2px; color:var(--muted); font-size:11px; font-weight:500; }

/* ---- Desempenho ---- */
.onb-funil{ display:grid; gap:4px; margin-top:6px; }
.onb-funil__linha{ display:grid; grid-template-columns:minmax(0,34%) minmax(0,1fr) 78px; align-items:center; gap:12px; }
.onb-funil__nome{ font-size:12.5px; font-weight:600; color:var(--ink-2); text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.onb-funil__trilho{ display:flex; justify-content:center; }
.onb-funil__faixa{ display:grid; place-items:center; height:34px; background:#3f6bff; transition:width .6s; }
.onb-funil__faixa--jbiz{ background:#8b5cf6; }
.onb-funil__faixa--golive{ background:var(--ok); }
.onb-funil__faixa b{ color:#fff; font-size:14px; font-style:normal; text-shadow:0 1px 2px rgba(0,0,0,.25); }
.onb-funil__taxa b{ display:block; font-size:13px; }
.onb-funil__taxa small{ display:block; color:var(--muted); font-size:10.5px; }
.onb-funil__pe{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:14px; }
.onb-funil__pe .onb-mudo{ margin-left:auto; font-size:13px; }
.onb-receita{ display:flex; gap:14px; height:230px; margin-top:12px; }
.onb-receita__mes{ flex:1; display:flex; flex-direction:column; align-items:center; gap:6px; min-width:0; }
.onb-receita__par{ flex:1; width:100%; display:flex; justify-content:center; gap:6px; min-height:0; }
.onb-receita__col{ flex:1; max-width:46px; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:6px; min-width:0; }
.onb-receita__col .onb-barras__val{ font-size:10.5px; }
.onb-receita__col .onb-barras__barra{ width:100%; }

/* ---- Configurações ---- */
.onb-tbl-pct td{ vertical-align:middle; }
.onb-tbl-pct .inp{ min-height:40px; padding:8px 10px; }
.onb-tbl-pct td:first-child{ white-space:normal; }
.onb-tbl-pct tr.is-arquivada td{ opacity:.6; }

/* ---- responsivo ---- */
@media (max-width:1240px){
  .onb-lados, .onb-2col{ grid-template-columns:minmax(0,1fr); }
  .onb-lado{ position:static; grid-template-columns:repeat(auto-fit, minmax(280px,1fr)); align-items:start; }
}
@media (max-width:1100px){
  .onb-metas-topo, .onb-metas-base{ grid-template-columns:minmax(0,1fr); }
}
@media (max-width:760px){
  .onb-grid > .onb-c1, .onb-grid > .onb-c2, .onb-grid > .onb-c3, .onb-grid > .onb-c4{ grid-column:span 6; }
  .onb-grid > .onb-c6, .onb-grid > .onb-c9{ grid-column:span 12; }
  .onb-det-cols{ grid-template-columns:minmax(0,1fr); }
  .onb-det-stats{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .onb-marco__data{ display:none; }
  .onb-trilho{ margin-bottom:24px; }
  .onb-funil__linha{ grid-template-columns:minmax(0,40%) minmax(0,1fr) 58px; gap:8px; }
  .onb-funil__nome{ font-size:11.5px; }
  .onb-receita{ gap:6px; }
  .onb-kb-filtro .inp{ min-width:0; width:100%; }
}
@media (max-width:620px){
  .onb-largo{ display:none; }
  .onb-tbl-solta .tbl th, .onb-tbl-solta .tbl td{ padding:9px 10px; }
}
@media (max-width:480px){
  .onb-grid > .onb-c1, .onb-grid > .onb-c2, .onb-grid > .onb-c3, .onb-grid > .onb-c4{ grid-column:span 12; }
  .onb-modal{ padding:12px; }
  .onb-modal__corpo{ padding:16px; }
  .onb-gauge{ width:190px; height:190px; }
  .onb-barras{ gap:6px; }
  .onb-respbar__seg{ font-size:10.5px; padding:5px 6px; }
}
@media (prefers-reduced-motion: reduce){
  .onb-pulso, .onb-spin, .onb-esqueleto{ animation:none; }
  .onb-trilho__fill, .onb-barras__barra, .onb-rank__barra i, .onb-gauge__arco{ transition:none; }
}

/* ficha do lead: atalho para o Funil Onboarding (Venda ganha) */
.fx-onb{
  display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:12px; align-items:center;
  width:100%; margin:10px 0 2px; padding:10px 14px; border-radius:12px; text-align:left; text-decoration:none;
  border:1px solid rgba(47,191,113,.4); background:rgba(47,191,113,.09); color:var(--ink); font:inherit; cursor:pointer;
  transition:border-color .15s, background .15s;
}
.fx-onb:hover{ border-color:var(--ok); background:rgba(47,191,113,.15); }
.fx-onb span{ grid-row:1 / 3; font-size:12px; font-weight:600; color:#5fe39b; }
.fx-onb b{ font-size:13.5px; }
.fx-onb em{ font-style:normal; color:var(--muted); font-size:11.5px; }
.fx-onb--iniciar{ border-color:rgba(252,190,44,.5); background:rgba(252,190,44,.1); }
.fx-onb--iniciar:hover{ border-color:var(--yellow); background:rgba(252,190,44,.17); }
.fx-onb--iniciar span{ color:var(--yellow); }
.fx-onb:disabled{ opacity:.6; cursor:wait; }
[data-theme="claro"] .fx-onb span{ color:#138a4a; }
[data-theme="claro"] .fx-onb--iniciar span{ color:#8a5a00; }

/* ==========================================================================
   Jornada: etapas e linha do tempo com micro efeitos (como no ESCALA)
   lilás = JBIZ · azul = Brindefly · verde = concluída · destaque = etapa vista
   ========================================================================== */
.onb-trilha{ --onb-verde:#2fbf71; --onb-azul:#3f6bff; --onb-lilas:#8b5cf6; }
.onb-respbar{ gap:8px; margin-bottom:14px; }
.onb-respbar__seg{ padding:8px 10px; font-size:11.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; animation:onb-sobe .4s cubic-bezier(.22,1,.36,1) backwards; }
.onb-respbar__seg--bfly{ animation-delay:.06s; }

.onb-stepper{ grid-template-columns:repeat(9, minmax(92px,1fr)); gap:8px; padding:6px 2px 10px; }
.onb-step{
  position:relative; gap:8px; padding:14px 8px 12px; border-radius:14px; border-width:1.5px;
  transition:transform .18s cubic-bezier(.22,1,.36,1), box-shadow .18s, background .2s, border-color .2s;
  animation:onb-sobe .45s cubic-bezier(.22,1,.36,1) backwards; animation-delay:calc(var(--i, 1) * 35ms);
}
.onb-step--jbiz{ background:rgba(139,92,246,.08); border-color:rgba(139,92,246,.35); }
.onb-step--bfly{ background:rgba(63,107,255,.07); border-color:rgba(63,107,255,.32); }
.onb-step:hover:not(:disabled){ transform:translateY(-3px); box-shadow:0 10px 24px rgba(0,0,0,.28); }
.onb-step__dot{ width:34px; height:34px; font-size:14px; transition:all .25s cubic-bezier(.22,1,.36,1); }
.onb-step--jbiz .onb-step__dot{ border-color:rgba(139,92,246,.55); color:#c4b5fd; }
.onb-step--bfly .onb-step__dot{ border-color:rgba(63,107,255,.55); color:#9db6ff; }
.onb-step__nome{ font-size:11.5px; color:var(--ink-2); transition:color .2s; }
.onb-step__resp{ margin-top:auto; padding:2px 8px; border-radius:999px; font-size:9px; letter-spacing:.07em; }
.onb-step--jbiz .onb-step__resp{ background:rgba(139,92,246,.18); color:#c4b5fd; }
.onb-step--bfly .onb-step__resp{ background:rgba(63,107,255,.18); color:#9db6ff; }
/* conector entre os cartões */
.onb-step:not(:last-child)::after{
  content:""; position:absolute; top:31px; left:100%; width:8px; height:2px;
  background:var(--line); transition:background .3s;
}
/* concluída */
.onb-step.is-feita{ background:rgba(47,191,113,.1); border-color:rgba(47,191,113,.45); }
.onb-step.is-feita .onb-step__dot{ background:var(--onb-verde); border-color:var(--onb-verde); color:#06261a; }
.onb-step.is-feita .onb-step__nome{ color:#5fe39b; }
.onb-step.is-feita::after{ background:var(--onb-verde); }
/* etapa vista: destaque máximo */
.onb-step.is-vista{
  background:var(--surface); border-color:var(--onb-azul); border-width:2px; transform:translateY(-3px);
  box-shadow:0 0 0 3px rgba(63,107,255,.25), 0 12px 28px rgba(0,0,0,.3);
}
.onb-step.is-vista .onb-step__dot{ background:var(--onb-azul); border-color:var(--onb-azul); color:#fff; box-shadow:none; transform:scale(1.06); }
.onb-step.is-vista .onb-step__nome{ color:var(--ink); font-weight:700; }
.onb-step.is-golive, .onb-step.is-golive.is-vista{ background:rgba(47,191,113,.12); border-color:var(--onb-verde); }
.onb-step.is-golive .onb-step__dot{ background:var(--onb-verde); border-color:var(--onb-verde); animation:onb-pulso 2.4s ease-in-out infinite; }
/* sem acesso */
.onb-step.is-travada{ opacity:.55; border-style:dashed; background:var(--surface-2); }
.onb-step.is-travada .onb-step__dot{ border-style:dashed; background:var(--surface-2); font-size:12px; }
.onb-step.is-travada .onb-step__nome{ color:var(--muted); }

/* linha do tempo */
.onb-tempo{ margin-top:20px; padding-top:18px; }
.onb-tempo__pct{ color:#9db6ff; font-size:22px; letter-spacing:-.02em; }
.onb-trilho{ height:6px; border-radius:999px; margin:0 16px 44px; }
.onb-trilho__fill{ border-radius:999px; background:linear-gradient(90deg, var(--onb-verde), var(--onb-azul)); transition:width 1.2s cubic-bezier(.22,1,.36,1); }
.onb-marco{ z-index:1; animation:onb-marco-in .45s cubic-bezier(.22,1,.36,1) backwards; animation-delay:calc(.15s + var(--i, 1) * 45ms); }
.onb-marco__ponto{ width:26px; height:26px; font-size:11px; color:var(--muted); transition:transform .2s cubic-bezier(.22,1,.36,1), border-color .2s, color .2s, background .2s; }
.onb-marco:hover:not(:disabled) .onb-marco__ponto{ transform:scale(1.18); border-color:var(--onb-azul); color:#9db6ff; }
.onb-marco__data{ font-weight:600; }
.onb-marco.is-feito .onb-marco__ponto{ background:var(--onb-verde); border-color:var(--onb-verde); color:#06261a; }
.onb-marco.is-feito .onb-marco__data{ color:#5fe39b; }
.onb-marco.is-atual .onb-marco__ponto{
  width:30px; height:30px; font-size:12px; background:var(--onb-azul); border-color:var(--onb-azul); color:#fff;
  box-shadow:0 0 0 4px rgba(63,107,255,.25); animation:onb-pulso-marco 2s ease-in-out infinite;
}
.onb-marco.is-atual .onb-marco__data{ color:#9db6ff; font-weight:700; }
.onb-marco.is-futuro .onb-marco__ponto{ background:var(--surface); border-style:dashed; }
.onb-marco:first-child .onb-marco__data{ left:0; }
@keyframes onb-pulso-marco{ 0%,100%{ box-shadow:0 0 0 4px rgba(63,107,255,.25); } 50%{ box-shadow:0 0 0 9px rgba(63,107,255,.12); } }
@keyframes onb-marco-in{ from{ opacity:0; transform:translate(-50%, -50%) scale(.4); } }
@keyframes onb-sobe{ from{ opacity:0; transform:translateY(10px); } }

/* troca de etapa: o formulário entra suave */
.onb-form:not([hidden]){ animation:onb-sobe .35s cubic-bezier(.22,1,.36,1) backwards; }

/* tema claro */
[data-theme="claro"] .onb-step--jbiz{ background:#f5f1ff; border-color:#d9ccff; }
[data-theme="claro"] .onb-step--bfly{ background:#eef2ff; border-color:#c8d5ff; }
[data-theme="claro"] .onb-step--jbiz .onb-step__dot{ border-color:#c4b0ff; color:#6d3fd6; background:#fff; }
[data-theme="claro"] .onb-step--bfly .onb-step__dot{ border-color:#b3c5ff; color:#083fc9; background:#fff; }
[data-theme="claro"] .onb-step--jbiz .onb-step__resp{ background:#e9e1ff; color:#6d3fd6; }
[data-theme="claro"] .onb-step--bfly .onb-step__resp{ background:#dfe7ff; color:#083fc9; }
[data-theme="claro"] .onb-step:hover:not(:disabled){ box-shadow:0 10px 22px rgba(13,22,51,.1); }
[data-theme="claro"] .onb-step.is-feita{ background:#e9f8f0; border-color:#9fdcbb; }
[data-theme="claro"] .onb-step.is-feita .onb-step__dot{ background:var(--onb-verde); border-color:var(--onb-verde); color:#fff; }
[data-theme="claro"] .onb-step.is-vista .onb-step__dot{ background:var(--onb-azul); border-color:var(--onb-azul); color:#fff; }
[data-theme="claro"] .onb-step.is-golive .onb-step__dot{ background:var(--onb-verde); border-color:var(--onb-verde); color:#fff; }
[data-theme="claro"] .onb-step.is-travada .onb-step__dot{ background:var(--surface-2); }
[data-theme="claro"] .onb-step.is-feita .onb-step__nome{ color:#138a4a; }
[data-theme="claro"] .onb-trilha{ --onb-azul:#083fc9; }
[data-theme="claro"] .onb-step.is-vista{ background:#fff; box-shadow:0 0 0 3px rgba(8,63,201,.15), 0 10px 22px rgba(13,22,51,.1); }
[data-theme="claro"] .onb-step.is-golive, [data-theme="claro"] .onb-step.is-golive.is-vista{ background:#e9f8f0; }
[data-theme="claro"] .onb-tempo__pct{ color:#083fc9; }
[data-theme="claro"] .onb-marco.is-feito .onb-marco__ponto{ color:#fff; }
[data-theme="claro"] .onb-marco.is-feito .onb-marco__data{ color:#138a4a; }
[data-theme="claro"] .onb-marco.is-atual .onb-marco__data{ color:#083fc9; }
[data-theme="claro"] .onb-marco:hover:not(:disabled) .onb-marco__ponto{ color:#083fc9; }
[data-theme="claro"] .onb-marco.is-futuro .onb-marco__ponto{ background:#fff; }

@media (max-width:760px){ .onb-stepper{ grid-template-columns:repeat(9, minmax(84px,1fr)); } }
@media (prefers-reduced-motion: reduce){
  .onb-step, .onb-marco, .onb-respbar__seg, .onb-form:not([hidden]), .onb-marco.is-atual .onb-marco__ponto, .onb-step.is-golive .onb-step__dot{ animation:none; }
  .onb-step.is-vista, .onb-step:hover:not(:disabled){ transform:none; }
}