:root{
  --navy:#071c36;--navy2:#0c2b52;--cyan:#22c3e6;--cyan2:#7de8ff;--teal:#2dd4bf;
  --bg:#f2f5f9;--card:#fff;--line:#dbe3ed;--text:#0b1f38;--muted:#5a6a7f;
  --yellow:#ffd84d;--yellow2:#fff6cc;--red:#d93644;--red2:#fdecee;--green:#14915a;--green2:#e6f6ee;
  --amber:#b86e00;--amber2:#fff3dc;--blue2:#e8f7fc;
  --r:14px;--shadow:0 1px 2px rgba(7,28,54,.06),0 4px 14px rgba(7,28,54,.06);
  color-scheme:light;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--text);font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
a{color:#0a6f8f}
.boot{display:grid;place-items:center;min-height:100vh;color:var(--muted)}
.hidden{display:none!important}

/* ---------- auth ---------- */
.auth{min-height:100vh;display:grid;place-items:center;padding:24px 16px;background:radial-gradient(1000px 500px at 80% -10%,#124a7c 0,transparent 60%),var(--navy)}
.auth-card{width:100%;max-width:400px;background:#fff;border-radius:18px;padding:28px 24px;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.brand{font-weight:800;letter-spacing:-.02em;font-size:20px;color:var(--navy)}
.brand span{color:var(--cyan)}
.auth-card h1{margin:14px 0 4px;font-size:22px}
.auth-card p.sub{margin:0 0 18px;color:var(--muted);font-size:14px}
.auth-foot{margin-top:16px;font-size:13px;color:var(--muted);text-align:center}

/* ---------- fields ---------- */
label.f{display:block;margin:0 0 12px}
label.f>span{display:block;font-size:12.5px;font-weight:650;color:#33465e;margin-bottom:5px}
input[type=text],input[type=password],input[type=tel],input[type=email],input[type=date],input[type=time],input[type=number],input[type=search],select,textarea{
  width:100%;border:1px solid var(--line);background:#fff;border-radius:10px;padding:10px 12px;min-height:42px;outline:none;transition:border-color .15s,box-shadow .15s}
textarea{min-height:90px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(34,195,230,.18)}
.row{display:grid;gap:10px;grid-template-columns:1fr 1fr}
.row3{display:grid;gap:10px;grid-template-columns:1.3fr .9fr 1.2fr}
@media (max-width:560px){.row,.row3{grid-template-columns:1fr}}
.err{color:var(--red);font-size:13.5px;margin:4px 0 10px;min-height:1px}
.hint{font-size:12.5px;color:var(--muted)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:#fff;border-radius:10px;padding:10px 14px;min-height:42px;font-weight:650;cursor:pointer;text-decoration:none;color:var(--text);white-space:nowrap}
.btn:hover{border-color:#b9c7d8}
.btn.pri{background:linear-gradient(135deg,var(--cyan),var(--teal));border-color:transparent;color:#05223a}
.btn.dark{background:var(--navy);border-color:var(--navy);color:#fff}
.btn.wa{background:#1fa855;border-color:#1fa855;color:#fff}
.btn.danger{color:var(--red);border-color:#f2c4c9}
.btn.sm{min-height:34px;padding:6px 10px;font-size:13.5px;border-radius:9px}
.btn.block{width:100%}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btns{display:flex;gap:8px;flex-wrap:wrap}

/* ---------- shell ---------- */
.top{position:sticky;top:0;z-index:30;background:var(--navy);color:#fff;padding:0 16px;padding-top:env(safe-area-inset-top)}
.top-in{max-width:1180px;margin:auto;display:flex;align-items:center;gap:16px;height:60px}
.top .brand{color:#fff;font-size:18px;white-space:nowrap}
.top .brand small{display:block;font-size:11px;font-weight:600;color:var(--cyan2);letter-spacing:.06em;text-transform:uppercase}
.nav{display:flex;gap:4px;margin-left:auto}
.nav button{background:transparent;border:0;color:#c9d7ea;padding:8px 12px;border-radius:9px;font-weight:650;cursor:pointer;position:relative}
.nav button:hover{background:rgba(255,255,255,.08);color:#fff}
.nav button.on{background:rgba(125,232,255,.14);color:#fff}
.nav .ico{display:none}
.badge{display:inline-grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:99px;background:var(--red);color:#fff;font-size:11px;font-weight:800;margin-left:6px}
.wrap{max-width:1180px;margin:auto;padding:18px 16px 40px}
@media (max-width:820px){
  .top-in{height:54px}
  .nav{position:fixed;left:0;right:0;bottom:0;margin:0;background:#fff;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(var(--n,4),1fr);gap:0;padding:4px 4px calc(4px + env(safe-area-inset-bottom));box-shadow:0 -4px 16px rgba(7,28,54,.08)}
  .nav button{color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:1px;font-size:11.5px;padding:6px 2px;border-radius:10px}
  .nav button:hover{background:transparent;color:var(--muted)}
  .nav button.on{background:var(--blue2);color:#075e78}
  .nav .ico{display:block;font-size:19px;line-height:1.1}
  .nav .badge{position:absolute;top:2px;right:calc(50% - 22px);margin:0}
  .wrap{padding:14px 12px 96px}
}

/* ---------- cards / headings ---------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:16px}
.h{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:2px 0 14px}
.h h1{font-size:22px;margin:0;letter-spacing:-.01em}
.h p{margin:2px 0 0;color:var(--muted);font-size:14px}
.step{font-size:11.5px;font-weight:800;letter-spacing:.08em;color:#0a7f9e;text-transform:uppercase;margin-bottom:8px}
.sec+.sec{margin-top:14px}

/* ---------- central ---------- */
.central{display:grid;grid-template-columns:minmax(300px,380px) 1fr;gap:14px;align-items:start}
@media (max-width:900px){.central{grid-template-columns:1fr}}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.seg.tres{grid-template-columns:repeat(3,1fr)}
.seg button{border:1.5px solid var(--line);background:#fff;border-radius:11px;padding:10px;text-align:left;cursor:pointer;min-height:56px}
.seg button b{display:block;font-size:14.5px}
.seg button small{display:block;color:var(--muted);font-size:12px;margin-top:1px}
.seg button.on{border-color:var(--cyan);background:var(--blue2);box-shadow:0 0 0 3px rgba(34,195,230,.14)}
.seg.three{grid-template-columns:repeat(3,1fr)}
@media (max-width:560px){.seg.three{grid-template-columns:1fr}}
.rec{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:800;letter-spacing:.06em;padding:3px 8px;border-radius:99px;background:var(--green2);color:var(--green);margin-top:6px}
.tip{background:var(--yellow2);border:1px solid #f1df8c;border-radius:10px;padding:10px 12px;font-size:13.5px;color:#4d3d00;margin-top:10px}
.tip b{color:#3b2f00}
.helpbtn{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;border:0;background:var(--yellow);color:#3b2f00;font-weight:900;font-size:13px;cursor:pointer;vertical-align:middle;margin-left:6px}
.msg{width:100%;min-height:300px;font:14.5px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:#fbfdff}
@media (max-width:560px){.msg{min-height:340px;font-size:14px}}
.edited{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13px;color:var(--amber);background:var(--amber2);border-radius:9px;padding:6px 10px;margin-bottom:8px}
.after{margin-top:12px;border:1.5px dashed #9fdcec;background:#f5fcfe;border-radius:12px;padding:12px}
.after h3{margin:0 0 8px;font-size:15px}
.pill{display:inline-flex;align-items:center;gap:5px;border-radius:99px;padding:3px 9px;font-size:12px;font-weight:700;background:#eef2f7;color:#334a66;white-space:nowrap}
.flow{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.flow span{font-size:12.5px;background:#eef3f8;border-radius:99px;padding:4px 10px;color:#3a4f69}
.flow span b{color:#0a7f9e}
details.manual{margin-top:14px}
details.manual summary{cursor:pointer;font-weight:700;color:#0a6f8f}
details.manual ol{padding-left:20px;margin:10px 0 0}
details.manual li{margin-bottom:6px}

/* ---------- pipeline ---------- */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:12px}
@media (max-width:700px){.kpis{grid-template-columns:repeat(2,1fr)}}
.kpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.kpi b{display:block;font-size:20px;letter-spacing:-.01em}
.kpi span{font-size:12.5px;color:var(--muted)}
.kpi.alert b{color:var(--red)}
.toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.toolbar input[type=search]{flex:1;min-width:180px}
.toolbar select{width:auto;min-width:160px}
.chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;margin-bottom:10px;scrollbar-width:thin}
.chips button{flex:none;border:1px solid var(--line);background:#fff;border-radius:99px;padding:6px 12px;font-size:13px;font-weight:650;cursor:pointer;color:#33465e}
.chips button.on{background:var(--navy);border-color:var(--navy);color:#fff}
.chips button i{font-style:normal;opacity:.7;margin-left:4px}
.list{display:grid;gap:8px}
.item{display:grid;grid-template-columns:1fr auto;gap:6px 12px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;cursor:pointer;text-align:left;width:100%}
.item:hover{border-color:#a9c3da}
.item .t{font-weight:750;font-size:15px}
.item .s{color:var(--muted);font-size:13px}
.item .r{display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.empty{text-align:center;color:var(--muted);padding:30px 16px;background:#fff;border:1px dashed var(--line);border-radius:12px}

.st-novo{background:#eef2f7;color:#334a66}
.st-abordado{background:#e8f7fc;color:#086a85}
.st-qualificacao{background:#ede9fe;color:#5b3fc4}
.st-proposta{background:#fff3dc;color:#9a5b00}
.st-negociacao{background:#ffe9d6;color:#a9480b}
.st-fechado{background:var(--green2);color:var(--green)}
.st-perdido{background:var(--red2);color:var(--red)}
.st-demonstracao{background:#e6f0ff;color:#2a56b8}
.st-implantacao{background:#e3f6ec;color:#1b7a43}
.st-evento{background:#dff5f0;color:#0c6b5a}
.st-pos_evento{background:#eaf4dc;color:#4f7414}
.st-renovacao{background:#f0eafc;color:#6a3fb8}
.pill.cls{background:#071c36;color:#7de8ff;font-weight:800;min-width:20px;text-align:center}
.pill.cls.auto{background:#e9eef5;color:#33465e}
.qchk{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:8px 10px;border-radius:10px;font-size:13.5px}
.qchk.pend{background:#fff8e6;border:1px solid #f3c76b}.qchk.ok{background:#eafbf0;border:1px solid #9bd9b3}
.qbox{border:1.5px solid var(--line);border-radius:11px;padding:8px 12px 10px;margin:4px 0 12px}
.qbox.pend{border-color:#f3c76b;background:#fffdf5}.qbox.ok{border-color:#9bd9b3}
.qbox legend{font-weight:700;font-size:14px;padding:0 6px}
.qcats{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;margin:4px 0 6px;font-size:14px}
.s.qfalta{color:#9a5b00}
.due{font-size:12.5px;font-weight:700;border-radius:8px;padding:2px 7px}
.due.late{background:var(--red2);color:var(--red)}
.due.today{background:var(--amber2);color:var(--amber)}
.due.ok{background:#eef3f8;color:#3a4f69}
.due.none{background:#fff;color:var(--muted);border:1px dashed var(--line)}

/* ---------- agenda ---------- */
.agroup{margin-bottom:16px}
.agroup h2{font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:#3a4f69;margin:0 0 8px;display:flex;align-items:center;gap:8px}
.agroup h2 .n{background:#e3eaf2;border-radius:99px;padding:1px 8px;font-size:12px}
.agroup.late h2{color:var(--red)}
.aitem{display:grid;grid-template-columns:76px 1fr auto;gap:12px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:8px}
.aitem .when{font-weight:800;font-size:14px;line-height:1.2}
.aitem .when small{display:block;font-weight:600;color:var(--muted);font-size:12px}
.aitem .t{font-weight:700}
.aitem .s{font-size:13px;color:var(--muted)}
@media (max-width:620px){.aitem{grid-template-columns:62px 1fr}.aitem .btns{grid-column:1/-1}}

/* ---------- modal ---------- */
.modal{position:fixed;inset:0;z-index:60;background:rgba(5,18,36,.55);display:flex;align-items:flex-start;justify-content:center;padding:28px 12px;overflow:auto}
.modal .box{background:#fff;border-radius:16px;width:100%;max-width:820px;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.modal .mh{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;border-radius:16px 16px 0 0;z-index:2}
.modal .mh h2{margin:0;font-size:18px}
.modal .mb{padding:16px}
.x{border:0;background:#eef2f7;width:36px;height:36px;border-radius:10px;font-size:20px;cursor:pointer}
@media (max-width:620px){.modal{padding:0}.modal .box{border-radius:0;min-height:100%}.modal .mh{border-radius:0}}
.tabs2{display:flex;gap:6px;margin-bottom:12px;border-bottom:1px solid var(--line)}
.tabs2 button{border:0;background:none;padding:8px 10px;font-weight:700;color:var(--muted);border-bottom:2.5px solid transparent;cursor:pointer}
.tabs2 button.on{color:var(--text);border-color:var(--cyan)}
.hist{list-style:none;margin:0;padding:0}
.hist li{border-left:2px solid var(--line);padding:2px 0 12px 12px;position:relative}
.hist li:before{content:"";position:absolute;left:-6px;top:6px;width:10px;height:10px;border-radius:50%;background:#fff;border:2px solid var(--cyan)}
.hist .m{font-size:12px;color:var(--muted)}
.hist .tx{white-space:pre-wrap;font-size:14px}

/* ---------- equipe ---------- */
.utable{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.utable th,.utable td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);font-size:14px;vertical-align:top}
.utable th{background:#f6f9fc;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:#3a4f69}
.utable code{font-size:12.5px;background:#eef3f8;padding:2px 6px;border-radius:6px;word-break:break-all}
@media (max-width:760px){.utable thead{display:none}.utable tr{display:block;border-bottom:1px solid var(--line);padding:8px 0}.utable td{display:block;border:0;padding:4px 12px}}
.copyline{display:flex;gap:6px;align-items:center}
.copyline input{font-size:13px;min-height:36px;background:#f8fbfd}

#toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:var(--navy);color:#fff;padding:10px 16px;border-radius:12px;font-weight:600;font-size:14px;opacity:0;pointer-events:none;transition:.25s;z-index:100;max-width:calc(100% - 32px);text-align:center}
#toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
#toast.bad{background:var(--red)}
@media (max-width:820px){#toast{bottom:84px}}

.tip.internal{background:#fff1f2;border-color:#f5c2c7;color:#5c1d24}
.tip.internal b{color:#8a1c28}

/* =====================================================================
   Layout de tela cheia (margem a margem) · v2
   ===================================================================== */
:root{--topH:56px}
.top-in{max-width:none;height:var(--topH)}
.wrap{max-width:none;padding:12px 20px 20px}
.pagebar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 10px}
.pagebar h1{font-size:20px;margin:0;letter-spacing:-.01em}
.pagebar .sub{color:var(--muted);font-size:13.5px;flex:1}
.h{margin:0 0 10px}.h h1{font-size:20px}.h p{font-size:13.5px}
.card{padding:14px}
.step{margin-bottom:8px}
label.f{margin:0 0 10px}
.g2 label.f,.g4 label.f,.row label.f,.row3 label.f{margin:0}
.row,.row3{margin-bottom:10px}
label.f>span{font-size:12px;margin-bottom:3px}
input[type=text],input[type=password],input[type=tel],input[type=email],input[type=date],input[type=time],input[type=number],input[type=search],select{min-height:38px;padding:7px 10px}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:8px 10px;margin-bottom:8px}
.g2 .span2{grid-column:1/-1}
.g4{display:grid;grid-template-columns:1fr .7fr 1fr 2fr;gap:8px 10px;margin-bottom:10px}

/* solução e níveis */
.seg button{min-height:0;padding:8px 10px}
.seg button b{font-size:14px}
.seg button small{font-size:11.5px}
.recline{display:flex;gap:8px;align-items:flex-start;margin-top:8px;font-size:13px;color:#33465e;line-height:1.35}
.recline .rec,.recline .pill{margin:0;flex:none}
details.tip{margin-top:10px;padding:8px 12px}
details.tip summary{cursor:pointer;font-weight:800;color:#8a1c28;list-style:none}
details.tip summary::-webkit-details-marker{display:none}
details.tip summary:after{content:" ▸";font-weight:700}
details.tip[open] summary:after{content:" ▾"}
details.tip .dtx{font-size:13px;margin-top:6px;line-height:1.45}
.levels{display:grid;gap:6px}
.levels button{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1.5px solid var(--line);background:#fff;border-radius:11px;padding:8px 12px;cursor:pointer;text-align:left}
.levels button b{display:flex;align-items:center;gap:8px;font-size:14px}
.levels button b i{font-style:normal;display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#eef3f8;color:#0a7f9e;font-size:12px}
.levels button small{color:var(--muted);font-size:12px}
.levels button.on{border-color:var(--cyan);background:var(--blue2);box-shadow:0 0 0 3px rgba(34,195,230,.14)}
.levels button.on b i{background:var(--cyan);color:#05223a}
.levels-cap{margin:10px 0 4px;font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.levels.pos button b i{background:#e8f6ee;color:#1b7a43}

/* mensagem */
.colC{display:flex;flex-direction:column;min-height:0}
.msg{flex:1;min-height:220px;resize:none;font-size:14px;line-height:1.5}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.after{margin-top:10px;padding:10px 12px}
.after h3{font-size:14px;margin:0 0 8px}
.edited{margin-bottom:6px}
.manual ol{padding-left:20px;margin:0}.manual li{margin-bottom:6px}

/* Central: 3 colunas numa tela (computador) */
.c3{display:grid;gap:12px}
@media (min-width:1100px){
  .c3{grid-template-columns:minmax(290px,.9fr) minmax(300px,1fr) minmax(440px,1.9fr);
      height:calc(100vh - var(--topH) - 12px - 46px - 22px);min-height:440px}
  .c3>.card{overflow:auto;min-height:0}
}
/* tablet / notebook estreito: 2 colunas */
@media (min-width:760px) and (max-width:1099px){
  .c3{grid-template-columns:1fr 1.25fr;grid-template-areas:"a c" "b c"}
  .colA{grid-area:a}.colB{grid-area:b}.colC{grid-area:c}
  .msg{min-height:360px}
}
/* celular */
@media (max-width:759px){
  .wrap{padding:10px 10px 150px}
  .pagebar .sub{display:none}
  .pagebar h1{font-size:18px;flex:1}
  .card{padding:12px}
  .levels{grid-template-columns:repeat(3,1fr)}
  .levels.pos{grid-template-columns:repeat(2,1fr)}
  .levels button{flex-direction:column;align-items:flex-start;gap:2px;padding:7px 8px}
  .levels button b{font-size:13px;gap:5px}
  .levels button small{font-size:10.5px}
  .seg button small{display:none}
  .recline span:last-child{font-size:12.5px}
  .msg{min-height:300px}
  .g4{grid-template-columns:1fr 1fr}
  .g4 label:last-child{grid-column:1/-1}
  /* botões de envio sempre à mão, acima do menu inferior */
  .colC .actions{position:fixed;left:0;right:0;bottom:calc(58px + env(safe-area-inset-bottom));z-index:25;margin:0;
    background:rgba(255,255,255,.97);border-top:1px solid var(--line);padding:8px 10px;flex-wrap:nowrap;box-shadow:0 -4px 14px rgba(7,28,54,.07)}
  .colC .actions .btn{flex:1;padding:9px 8px;font-size:14px;min-height:40px}
  .colC .actions .btn.wa{flex:1.6}
  #toast{bottom:140px}
}

/* Prospects e Agenda: aproveitar a largura */
.kpis{gap:8px;margin-bottom:10px}
.kpi{padding:8px 12px}.kpi b{font-size:18px}
.list{grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:8px}
@media (max-width:420px){.list{grid-template-columns:1fr}}
.agrid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));align-items:start}
@media (max-width:420px){.agrid{grid-template-columns:1fr}}
.agroup{margin:0;background:#f8fafd;border:1px solid var(--line);border-radius:14px;padding:10px}
.agroup.late{background:#fff8f8;border-color:#f3d0d4}
.aitem{grid-template-columns:62px 1fr;gap:4px 10px;padding:9px 10px}
.aitem .btns{grid-column:1/-1;justify-content:flex-end}
.aitem .btns .btn{min-height:32px;padding:5px 10px;font-size:13px}
.modal .box{max-width:980px}
.utable td,.utable th{padding:8px 10px}

@media (max-width:759px){.pagebar .lbl{display:none}.pagebar h1{font-size:17px}}
@media (min-width:1100px) and (max-height:760px){
  .card{padding:12px}.levels button{padding:6px 10px}.seg button{padding:6px 10px}
  .g2{gap:6px 10px}.recline{margin-top:6px}
}

/* =====================================================================
   v3 · ajuda "?" no lugar de textos espalhados + fontes maiores
   ===================================================================== */
body{font-size:17px}
.help{display:inline-grid;place-items:center;width:24px;height:24px;flex:none;border-radius:50%;border:0;background:var(--yellow);color:#3b2f00;
  font:900 14px/1 system-ui,sans-serif;cursor:pointer;vertical-align:middle;margin-left:6px;box-shadow:0 1px 0 rgba(0,0,0,.12);letter-spacing:0;text-transform:none}
.help:hover,.help[aria-expanded="true"]{background:#ffcc1a}
.help:focus-visible{outline:3px solid var(--navy);outline-offset:2px}
#helpPop{position:fixed;z-index:200;background:#fff8d6;color:#3b2f00;border:1px solid #e9cf63;border-radius:12px;padding:12px 14px;
  font-size:15.5px;line-height:1.5;box-shadow:0 12px 34px rgba(7,28,54,.22)}
.pagebar h1,.h h1{display:flex;align-items:center;gap:2px}
.pagebar h1{font-size:23px}.h h1{font-size:23px}
.step{font-size:13.5px;display:flex;align-items:center;flex-wrap:wrap;gap:4px}
.step .pill{font-size:12.5px}
label.f>span{font-size:14px;display:flex;align-items:center;gap:2px}
input[type=text],input[type=password],input[type=tel],input[type=email],input[type=date],input[type=time],input[type=number],input[type=search],select,textarea{font-size:16px;min-height:42px}
.btn{font-size:16px}
.btn.sm{font-size:14.5px}
.nav button{font-size:16px}
.seg button b,.levels button b{font-size:15.5px}
.seg button small,.levels button small{font-size:13px}
.msg{font-size:16px;line-height:1.55}
.recline{align-items:center}
.rec{font-size:12px}
.hint{font-size:14px}
.pill{font-size:13px}
.item .t{font-size:16.5px}.item .s{font-size:14.5px}
.aitem .t{font-size:16px}.aitem .s{font-size:14.5px}
.kpi b{font-size:21px}.kpi span{font-size:14px}
.chips button{font-size:14.5px}
.utable th{font-size:13px}.utable td{font-size:15px}
details.tip summary{font-size:15px}
details.tip .dtx,.tip{font-size:14.5px}
.agroup h2{font-size:15px}
.recruit-box{background:#eef6ff;border:1px solid #bcd6f5;border-radius:12px;padding:12px 14px;font-size:15px;color:#173a63;line-height:1.45}
.recruit-box span{font-size:14.5px}
.pill.recruit{background:#e6f0ff;color:#1d4f91;font-size:12px;vertical-align:middle}
@media (min-width:1100px) and (max-height:760px){body{font-size:16px}.msg{font-size:15px}}
@media (max-width:759px){.pagebar h1{font-size:19px}.levels button b{font-size:14px}.levels button small{font-size:11.5px}}

/* Sair na barra superior, ao lado de Conta */
.logout{display:inline-flex;align-items:center;gap:6px;margin-left:6px;background:transparent;border:1px solid rgba(255,255,255,.28);color:#ffd6db;
  border-radius:9px;padding:7px 12px;font-weight:700;font-size:16px;cursor:pointer;white-space:nowrap}
.logout:hover{background:rgba(255,90,110,.16);color:#fff;border-color:rgba(255,120,135,.6)}
.logout:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
@media (max-width:820px){.logout{margin-left:auto;padding:6px 10px;font-size:15px}}
#cSalvar,#cAbrir,#cNovo{margin-top:2px}
.colA .btns{align-items:center}

/* =====================================================================
   v4 · tela única por padrão (computador): página fixa, listas rolam por dentro
   ===================================================================== */
@media (min-width:1100px) and (min-height:600px){
  html,body{height:100%;overflow:hidden}
  .wrap{height:calc(100vh - var(--topH));overflow:auto;display:flex;flex-direction:column}
  .wrap>*{flex:none}
  .wrap>.fill,.wrap>.c3{flex:1 1 auto;min-height:0}
  .wrap>.fill{overflow:auto;padding-bottom:6px;align-content:start}
  .c3{height:auto!important;min-height:0!important}
  .list.fill{grid-auto-rows:max-content}
  /* janelas (fichas, e-mail, cadastro) sempre inteiras na tela */
  .modal{align-items:center;padding:16px}
  .modal .box{max-height:calc(100vh - 32px);display:flex;flex-direction:column;max-width:1280px}
  .modal .mb{overflow:auto;min-height:0}
  .modal .mh{flex:none}
  #fDados{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 14px;align-items:end}
  #fDados .row,#fDados .row3{display:contents}
  #fDados label.f{margin:0}
  #fDados .obs,#fDados .btns{grid-column:1/-1}
  #fDados .row3>label:last-child{grid-column:span 2}
  #fDados .qbox{grid-column:1/-1}
  #fDados .qbox .row3{display:grid;grid-template-columns:1fr 1fr 2fr;gap:10px 14px}
  #fDados .qbox .row3>label:last-child{grid-column:auto}
  #fDados textarea{min-height:64px}
  #fReg{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 14px;align-items:end}
  #fReg>*{grid-column:1/-1}
  #fReg>.row{display:contents}
  #fReg>.row>label{grid-column:span 2;margin:0}
  #fReg textarea{min-height:70px}
  #fReg .row3{margin-bottom:0}
  #fReg>button{grid-column:auto;justify-self:start}
  .mailbody{min-height:200px!important;height:calc(100vh - 330px)}
  .modal .tabs2{margin-bottom:10px}
}

.verwarn{background:#fde7ea;color:#7a1522;border-bottom:1px solid #f3b6be;padding:8px 20px;font-size:15px}

/* botões de ícone (Equipe) */
.iconbar{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}
.ibtn{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:62px;padding:6px 8px;border:1px solid var(--line);
  background:#fff;border-radius:10px;cursor:pointer;font-size:19px;line-height:1.1}
.ibtn span{font-size:12.5px;font-weight:700;color:#33465e}
.ibtn:hover:not(:disabled){border-color:#a9c3da;background:#f6fafd}
.ibtn:disabled{opacity:.38;cursor:not-allowed}
.ibtn.danger span{color:var(--red)}
.ibtn.ok span{color:var(--green)}
.ibtn:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
.utable tr.inativo td{opacity:.6}
.utable tr.inativo td:last-child{opacity:1}
@media (max-width:760px){.iconbar{justify-content:flex-start}}

/* dados cadastrais */
.cad{border:1px solid var(--line);border-radius:12px;padding:8px 12px 12px;margin:0 0 10px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px 12px;grid-column:1/-1;min-width:0}
.cad legend{font-size:13px;font-weight:800;color:#0a7f9e;text-transform:uppercase;letter-spacing:.06em;padding:0 6px;display:flex;align-items:center}
.cad label.f{margin:0;min-width:0}
.cad .span2{grid-column:span 2}
.cad .span-all{grid-column:1/-1}
.cad textarea{min-height:52px}
.cepline{display:flex;gap:6px}.cepline input{flex:1;min-width:0}
.cepbtn{min-height:42px!important;padding:6px 10px}
@media (max-width:700px){.cad{grid-template-columns:1fr 1fr}.cad .span2{grid-column:1/-1}}
@media (min-width:1100px) and (max-height:760px){.cad{gap:6px 10px;padding:6px 10px 10px}.cad textarea{min-height:44px}}

/* formulário de vendedor em 4 colunas */
.g4f{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px 14px;align-content:start}
.g4f label.f{margin:0}
.g4f .span2{grid-column:span 2}
.g4f .span-all,.g4f .cad{grid-column:1/-1}
.modal .mh .btns{flex-wrap:nowrap}
@media (max-width:760px){.g4f{grid-template-columns:1fr 1fr}.g4f .span2{grid-column:1/-1}}
/* telas baixas (ex.: 1920 com zoom 125%): campos mais justos nas janelas */
@media (min-width:1100px) and (max-height:820px){
  .modal .mb{padding:10px 16px 12px}
  .modal .mh{padding:10px 16px}
  .modal label.f>span{font-size:13px;margin-bottom:2px}
  .modal input[type=text],.modal input[type=tel],.modal input[type=email],.modal input[type=date],.modal input[type=time],.modal input[type=number],.modal select{min-height:36px;padding:5px 10px;font-size:15px}
  .modal textarea{min-height:44px!important;font-size:15px;padding:6px 10px}
  .cad{padding:4px 10px 8px;gap:5px 10px;margin-bottom:6px}
  #fDados,#fReg,.g4f{gap:6px 12px}
  .modal .tabs2{margin-bottom:6px}.modal .tabs2 button{padding:5px 10px}
  .modal .btns .btn{min-height:36px;padding:6px 12px}
}

/* =====================================================================
   Manual em slides (sem rolagem: o conteúdo se ajusta à tela)
   ===================================================================== */
.manual-modal{align-items:center;padding:14px}
.slidebox{max-width:1400px!important;width:100%;height:calc(100vh - 28px);max-height:calc(100vh - 28px)!important;display:flex;flex-direction:column}
.slidebox .mh h2{font-size:clamp(18px,1.7vw,26px)}
.scount{font-weight:800;color:var(--muted);font-size:14px;min-width:54px;text-align:center}
.sbody{flex:1;min-height:0;overflow:hidden;padding:clamp(12px,2vh,24px) clamp(14px,2vw,30px);font-size:100%}
.sfoot{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;border-top:1px solid var(--line)}
.sdots{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.sdots button{width:12px;height:12px;border-radius:50%;border:0;background:#cfd9e5;cursor:pointer;padding:0}
.sdots button.on{background:var(--cyan);transform:scale(1.25)}
.sbody p,.sbody li{font-size:1.06em;line-height:1.5;margin:0 0 .55em}
.sbody .lead{font-size:1.35em;line-height:1.35}
.sbody h4{margin:0 0 .45em;font-size:1.12em;display:flex;align-items:center;gap:6px;color:var(--text)}
.mgrid2{display:grid;grid-template-columns:1.1fr .9fr;gap:2.2vw;align-items:start;height:100%}
.mgrid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2vw}
.mgrid4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1vw}
.mcard{background:#f7fafd;border:1px solid var(--line);border-radius:14px;padding:clamp(10px,1.6vh,18px) clamp(12px,1.2vw,18px)}
.mcard p{font-size:1em}
.mcard .erro{color:#8a1c28}
.mcard.q{background:#eef7fd;border-color:#bfe3f3}
.mcard.price > b{display:block;font-size:2.2em;color:#0b2b52;line-height:1.1;margin-bottom:.15em}
.mcard.final{background:linear-gradient(135deg,#e8f9fd,#e9fbf6);border-color:#9fdcec}
.mlist,.mcheck{padding-left:0;list-style:none;margin:.6em 0}
.mlist li{padding:.35em 0;border-bottom:1px dashed var(--line)}
.mcheck li{padding:.45em 0 .45em 2em;position:relative;font-size:1.15em}
.mcheck li:before{content:"✔";position:absolute;left:.2em;color:var(--green);font-weight:900}
.mfoot{margin-top:1em!important;padding:.7em 1em;background:#fff8d6;border:1px solid #e9cf63;border-radius:12px;color:#3b2f00}
.fn{display:inline-grid;place-items:center;width:1.8em;height:1.8em;border-radius:50%;background:linear-gradient(135deg,var(--cyan),var(--teal));color:#05223a;font-weight:900;font-size:.9em;flex:none}
.fases{display:flex;flex-wrap:wrap;align-items:center;gap:.5em}
.fase{display:flex;align-items:center;gap:.4em;background:#fff;border:1.5px solid var(--line);border-radius:999px;padding:.35em .55em .35em .35em;font-weight:800}
.fase b{display:inline-grid;place-items:center;width:1.8em;height:1.8em;border-radius:50%;background:var(--navy);color:#7de8ff;font-size:.9em}
.fase .help{margin-left:.1em}
.seta{color:#9fb3c8;font-style:normal;font-weight:900}
.mtimeline{display:grid;grid-template-columns:repeat(5,1fr);gap:1vw}
.mstep{position:relative;background:#f7fafd;border:1px solid var(--line);border-radius:14px;padding:2.6em 1em 1em}
.mstep>b{position:absolute;top:.7em;left:1em;width:1.7em;height:1.7em;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#7de8ff}
.mtable{width:100%;border-collapse:collapse;font-size:1.05em}
.mtable th,.mtable td{border-bottom:1px solid var(--line);padding:.7em .8em;text-align:left;vertical-align:top}
.mtable th{background:#f2f6fa;font-size:.85em;text-transform:uppercase;letter-spacing:.05em;color:#3a4f69}
.midia{border-radius:16px;overflow:hidden;background:#071c36;aspect-ratio:16/9;display:grid;place-items:center;max-height:100%}
.midia video,.midia iframe{width:100%;height:100%;border:0;display:block;background:#000}
.midia-vazia{display:flex;flex-direction:column;align-items:center;gap:.4em;color:#cfe3f3;text-align:center;padding:1.5em;font-size:1.1em}
.midia-vazia b{color:#fff;font-size:1.2em}
.midia-vazia span{font-size:.85em;max-width:30em}
@media (max-width:900px){
  .mgrid2,.mgrid3,.mgrid4,.mtimeline{grid-template-columns:1fr 1fr}
  .slidebox{height:calc(100vh - 16px);max-height:none!important}
  .manual-modal{padding:8px}
}
@media (max-width:560px){.mgrid2,.mgrid3,.mgrid4,.mtimeline{grid-template-columns:1fr}.sfoot .btn{padding:8px 10px;font-size:14px}}
@media (max-width:900px){.sbody{overflow:auto}}

/* telefone com número incompleto */
input.tel-erro{border-color:#c62f3e!important;box-shadow:0 0 0 3px rgba(198,47,62,.15)!important}

/* Nível 1: envio único ou em 2 etapas */
.n1seg{margin:0 0 8px}
.n1seg button{min-height:0;padding:7px 10px}
.n1tabs{display:flex;align-items:center;gap:6px;margin:0 0 6px}
.n1tabs button[data-aba]{flex:1;display:flex;align-items:center;gap:8px;text-align:left;border:1.5px solid var(--line);background:#f6f9fc;border-radius:11px;padding:6px 10px;cursor:pointer;font:inherit;color:#33465e}
.n1tabs button[data-aba] i{font-style:normal;flex:0 0 26px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-weight:900;background:#dfe8f1;color:#33465e}
.n1tabs button[data-aba] b{display:block;font-size:14px}
.n1tabs button[data-aba] small{display:block;font-size:12px;color:var(--muted)}
.n1tabs button[data-aba].on{border-color:#22c3e6;background:#e6f8fc;box-shadow:0 0 0 3px rgba(34,195,230,.14);color:#05223a}
.n1tabs button[data-aba].on i{background:linear-gradient(135deg,#22c3e6,#26d3bf);color:#05223a}
.n1seta{color:#0a6f8f;font-weight:900}
.n1dica{margin:0 0 6px;font-size:13px;color:#0a5a74;background:#eef8fb;border-radius:9px;padding:6px 10px}
.colC.duas .msg{min-height:150px}

/* etapa Fechado / Perdido em destaque */
select.etsel.et-fechado{border-color:#1f9d55!important;background:#eafbf0!important;color:#11603a;font-weight:700}
select.etsel.et-perdido{border-color:#c62f3e!important;background:#fdeef0!important;color:#8a1c28;font-weight:700}
select.etsel option.op-fechado{background:#eafbf0;color:#11603a;font-weight:700}
select.etsel option.op-perdido{background:#fdeef0;color:#8a1c28;font-weight:700}
.fech-box{border:1.5px solid #1f9d55!important;background:#eafbf0!important;border-radius:12px;padding:10px 12px;margin-bottom:12px}
.fech-nota{font-size:14px;color:#11603a;margin-bottom:8px}
.s.acc .pill{font-size:12px}
.s.acc-off{color:#7a5a00}

/* lição de casa */
.licbox{margin:0 0 12px;padding:10px 14px;border-radius:12px;background:#fff8e6;border:1.5px solid #f3c76b;color:#5a4100;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.licbox.ok{background:#eafbf0;border-color:#1f9d55;color:#11603a}
.lic{font-weight:700;color:#7a5a00;font-size:.92em}
.lic-ok{font-weight:700;color:#11603a;font-size:.92em}
.utable .iconbar{flex-wrap:nowrap;gap:4px}
.utable .ibtn{min-width:50px;padding:4px 6px}
.utable td{vertical-align:top}

/* mensalidades */
.mensal-box{display:grid;grid-template-columns:auto 1fr auto;gap:8px 12px;align-items:end;margin:8px 0 10px;padding:10px 12px;border:1.5px dashed var(--line);border-radius:11px}
.mensal-box .chk{grid-column:2/4}
.mensal-box .mensal-tot{font-size:15px}
.mensal-box #cMensal{grid-column:1/-1;justify-self:start}
.chk{display:flex;gap:8px;align-items:center;font-size:14px}
.mensal-resumo{padding:10px 12px;background:#f2f9fc;border-radius:10px}
@media (max-width:759px){.mensal-box{grid-template-columns:1fr}.mensal-box .chk{grid-column:auto}}

.qbox .row3{display:grid;grid-template-columns:1fr 1fr 2fr;gap:8px 12px}
@media (max-width:759px){.qbox .row3,#fDados .qbox .row3{grid-template-columns:1fr 1fr}.qbox .row3>label:last-child{grid-column:1/-1}}

.autost{font-size:12.5px;color:var(--muted);align-self:center}.autost.ok{color:#1b7a43}.autost.bad{color:var(--red)}
#rChk .row3{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px 12px}

/* escolha rápida (botões) */
.qgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px 18px;margin:4px 0 6px}
.qf>span{display:block;font-size:13px;font-weight:700;margin-bottom:5px}.qf>span small{font-weight:400;color:var(--muted)}
.qf.qwide{grid-column:1/-1}
.chipsr{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.chipr{position:relative;cursor:pointer;margin:0}
.chipr input{position:absolute;opacity:0;pointer-events:none}
.chipr span{display:inline-block;min-width:38px;text-align:center;padding:7px 12px;border:1.5px solid var(--line);border-radius:999px;background:#fff;font-size:14px;line-height:1.1;user-select:none}
.chipr:hover span{border-color:var(--cyan)}
.chipr input:checked+span{background:var(--blue2);border-color:var(--cyan);font-weight:700;box-shadow:0 0 0 3px rgba(34,195,230,.14)}
.chipr input:focus-visible+span{outline:2px solid var(--cyan);outline-offset:2px}
.chipsr input[type=date]{width:auto}
.qf input[name=q_decisor_outro]{margin-top:6px;max-width:360px}
