:root{--amarelo:#FFD400;--amarelo-2:#FFE766;--amarelo-fundo:#FFFBE3;--tinta:#0B0B0B;--tinta-2:#1A1A1A;--suave:#5E5B52;--linha:#E7E2CF;--papel:#FAF8F0;--card:#fff;--verde:#0E7A43;--verde-claro:#DFF4E7;--verm:#B3261E;--verm-claro:#FCE4E2;--ambar:#8A5A00;--ambar-claro:#FFF1C2;--azul:#2B4E7E;--azul-claro:#E6EEF8;--raio:16px;--sombra:0 1px 2px rgba(11,11,11,.05),0 6px 18px rgba(11,11,11,.06)}
*{box-sizing:border-box}html,body{margin:0}
body{background:var(--papel);color:var(--tinta);font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3{margin:0;line-height:1.2}h1{font-size:26px;letter-spacing:-.02em}h2{font-size:18px}h3{font-size:15px}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit}
.oculta{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
/* layout */
.casca{display:grid;grid-template-columns:240px 1fr;min-height:100vh}
.lateral{background:var(--tinta);color:#fff;padding:20px 14px;display:flex;flex-direction:column;gap:6px;position:sticky;top:0;height:100vh}
.marca{display:flex;align-items:center;gap:10px;padding:4px 8px 18px}.marca img{width:36px;height:36px}.marca b{font-size:17px;letter-spacing:-.01em}.marca small{display:block;color:#bdb8a6;font-size:12px}
.menu{display:flex;flex-direction:column;gap:2px}
.menu a{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;color:#d8d4c4;text-decoration:none;font-weight:600;font-size:14px}
.menu a:hover{background:var(--tinta-2);color:#fff}.menu a.on{background:var(--amarelo);color:var(--tinta)}
.menu svg{width:20px;height:20px;flex:none}
.rodape-lateral{margin-top:auto;padding:12px 8px;border-top:1px solid #2a2a2a;font-size:13px;color:#bdb8a6}
.rodape-lateral b{display:block;color:#fff}
.principal{min-width:0;padding:24px 28px 40px;max-width:1280px}
.topo{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:20px}
.topo p{margin:4px 0 0;color:var(--suave)}
.acoes{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
/* componentes */
.cartao{background:var(--card);border:1px solid var(--linha);border-radius:var(--raio);padding:18px;box-shadow:var(--sombra)}
.cartao>h2,.cartao>h3{margin-bottom:4px}.cartao .sub{color:var(--suave);font-size:13px;margin-bottom:12px}
.grade{display:grid;gap:16px}.g2{grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr))}.g3{grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.kpis{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));margin-bottom:16px}
.kpi{background:var(--card);border:1px solid var(--linha);border-radius:var(--raio);padding:14px 16px;box-shadow:var(--sombra)}
.kpi.destaque{background:var(--tinta);color:#fff;border-color:var(--tinta)}.kpi.destaque .rot,.kpi.destaque .delta{color:#cfcab7}
.kpi .rot{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--suave)}
.kpi .num{font-size:30px;font-weight:800;letter-spacing:-.03em;line-height:1.15;margin-top:2px}
.delta{font-size:12px;font-weight:700;color:var(--suave);margin-top:2px}.delta.sobe{color:var(--verde)}.delta.desce{color:var(--verm)}
.kpi.destaque .delta.sobe{color:var(--amarelo)}
.btn{border:0;background:var(--amarelo);color:var(--tinta);font-weight:700;border-radius:12px;padding:10px 16px;min-height:42px;cursor:pointer}
.btn:hover{background:var(--amarelo-2)}.btn.sec{background:#fff;border:1px solid var(--linha)}.btn.sec:hover{background:var(--amarelo-fundo)}.btn.escuro{background:var(--tinta);color:#fff}.btn.perigo{background:var(--verm-claro);color:var(--verm)}.btn.peq{min-height:34px;padding:6px 12px;font-size:13px}.btn:disabled{opacity:.5;cursor:default}
.seg{display:inline-flex;background:#fff;border:1px solid var(--linha);border-radius:12px;padding:3px}
.seg button{border:0;background:none;padding:7px 14px;border-radius:9px;font-weight:700;font-size:13px;cursor:pointer;color:var(--suave)}.seg button.on{background:var(--tinta);color:#fff}
input,select,textarea{border:1px solid var(--linha);border-radius:12px;padding:10px 12px;width:100%;background:#fff;min-height:42px}
input:focus,select:focus,textarea:focus,.btn:focus-visible,.menu a:focus-visible,.seg button:focus-visible{outline:3px solid var(--amarelo);outline-offset:1px}
label.campo{display:block;font-size:13px;font-weight:700;color:var(--suave);margin-bottom:10px}label.campo>*:not(span){margin-top:4px;font-weight:400;color:var(--tinta)}
.selo{display:inline-block;font-size:12px;font-weight:700;padding:2px 10px;border-radius:99px;background:#eee;color:var(--suave)}
.t-quente{background:var(--verm-claro);color:var(--verm)}.t-morna{background:var(--ambar-claro);color:var(--ambar)}.t-fria{background:var(--azul-claro);color:var(--azul)}.t-cliente{background:var(--verde-claro);color:var(--verde)}
.aviso{background:var(--ambar-claro);border:1px solid #E7D08A;border-radius:12px;padding:10px 14px;margin-bottom:14px;font-size:14px}
.erro{background:var(--verm-claro);color:var(--verm);border-radius:12px;padding:10px 14px;margin:0 0 14px}
.ok{background:var(--verde-claro);color:var(--verde);border-radius:12px;padding:10px 14px;margin:0 0 14px}
.vazio{color:var(--suave);text-align:center;padding:24px 12px}
.lista{display:flex;flex-direction:column;gap:8px}
.linha{background:var(--card);border:1px solid var(--linha);border-radius:14px;padding:12px 14px;display:flex;gap:12px;align-items:center;justify-content:space-between;text-decoration:none}
a.linha:hover,.linha.clicavel:hover{background:var(--amarelo-fundo);cursor:pointer}
.linha .t{font-weight:700}.linha .s{color:var(--suave);font-size:13px}
.duas{display:grid;grid-template-columns:1fr 110px;gap:8px;align-items:center;margin-bottom:8px}
/* gráficos */
.graf{width:100%;height:auto;display:block;overflow:visible}
.graf text{font-size:11px;fill:var(--suave)}
.legenda{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--suave);margin-bottom:6px}.legenda i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}
.dica{position:absolute;pointer-events:none;background:var(--tinta);color:#fff;border-radius:10px;padding:8px 10px;font-size:12px;white-space:nowrap;transform:translate(-50%,-110%);z-index:3}
.relativo{position:relative}
.barras{display:flex;flex-direction:column;gap:10px}
.barra .topo-barra{display:flex;justify-content:space-between;font-size:13px;margin-bottom:3px;gap:8px}.barra .topo-barra span:last-child{color:var(--suave);font-weight:600;white-space:nowrap}
.barra .trilho{height:10px;background:#F1EDDC;border-radius:99px;overflow:hidden}.barra .trilho i{display:block;height:100%;border-radius:99px;background:var(--amarelo)}
.funil{display:flex;flex-direction:column;gap:8px}.funil .etapa{background:var(--amarelo);border-radius:12px;padding:10px 14px;display:flex;justify-content:space-between;gap:10px;font-weight:700;min-width:210px;max-width:100%;white-space:nowrap}.funil .etapa small{font-weight:600;opacity:.75}
.rosca-caixa{display:flex;gap:18px;align-items:center;flex-wrap:wrap}.rosca-caixa .graf{width:170px;flex:none}
.estim{display:flex;gap:6px;align-items:flex-end;height:120px}.estim .col{flex:1;text-align:center;font-size:11px;color:var(--suave)}.estim .col i{display:block;background:repeating-linear-gradient(45deg,var(--amarelo),var(--amarelo) 6px,var(--amarelo-2) 6px,var(--amarelo-2) 12px);border-radius:8px 8px 0 0;min-height:3px;margin-bottom:4px}
.tag-estim{display:inline-block;background:var(--azul-claro);color:var(--azul);font-size:11px;font-weight:800;border-radius:6px;padding:1px 7px;letter-spacing:.04em;margin-left:6px;vertical-align:middle}
/* agora */
.cards-prof{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(min(290px,100%),1fr))}
.prof{background:var(--card);border:1px solid var(--linha);border-left:8px solid #8C8A82;border-radius:var(--raio);padding:16px;box-shadow:var(--sombra)}
.prof.livre{border-left-color:var(--verde)}.prof.ocupada{border-left-color:var(--verm)}.prof.pausa{border-left-color:#C99700}.prof.minha{outline:3px solid var(--amarelo)}
.prof .nome{font-size:20px;font-weight:800}.prof .est{display:inline-block;font-size:13px;font-weight:700;padding:2px 10px;border-radius:99px;margin:4px 0}
.prof.livre .est{background:var(--verde-claro);color:var(--verde)}.prof.ocupada .est{background:var(--verm-claro);color:var(--verm)}.prof.pausa .est{background:var(--ambar-claro);color:var(--ambar)}.prof.ausente .est{background:#eee;color:var(--suave)}
.prof .det{color:var(--suave);font-size:14px;min-height:21px}.prof .hab{color:var(--suave);font-size:12px;margin-top:4px}
.botoes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.botoes button{min-height:48px;border-radius:12px;border:1px solid var(--linha);background:#fff;font-weight:700;cursor:pointer}
.botoes .b-ocupada{background:var(--verm-claro);border-color:#E8B7B2;color:var(--verm)}.botoes .b-livre{background:var(--verde-claro);border-color:#A8D7BB;color:var(--verde)}.botoes .b-outro{background:var(--ambar-claro);border-color:#E7D08A;color:var(--ambar)}
.fotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin:10px 0}.fotos figure{margin:0}.fotos img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;border:1px solid var(--linha)}.fotos figcaption{font-size:12px;color:var(--suave);margin:2px 0 4px}
.fita{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:16px}.fita .chip{flex:none;background:#fff;border:1px solid var(--linha);border-radius:99px;padding:6px 12px;font-size:13px;font-weight:700;text-decoration:none;display:flex;gap:6px;align-items:center}.fita .chip i{width:9px;height:9px;border-radius:50%;background:#8C8A82}.chip.livre i{background:var(--verde)}.chip.ocupada i{background:var(--verm)}.chip.pausa i{background:#C99700}
/* login */
.login{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr}
.login .vitrine{background:var(--tinta);color:#fff;padding:48px;display:flex;flex-direction:column;justify-content:space-between;background-image:radial-gradient(circle at 85% 12%,rgba(255,212,0,.22),transparent 45%)}
.login .vitrine h1{font-size:44px;letter-spacing:-.03em;line-height:1.05;max-width:420px}.login .vitrine h1 em{font-style:normal;color:var(--amarelo)}
.login .vitrine p{color:#cfcab7;max-width:420px}
.login .form{display:flex;align-items:center;justify-content:center;padding:32px}.login form{width:100%;max-width:360px}
.login form h2{font-size:26px;margin-bottom:6px}.login form p{color:var(--suave);margin:0 0 18px}
.pe{color:#8e8a79;font-size:12px;margin-top:18px}
@media (max-width:860px){
  .casca{grid-template-columns:1fr}
  .lateral{position:fixed;top:auto;bottom:0;left:0;right:0;height:auto;flex-direction:row;padding:6px 8px calc(6px + env(safe-area-inset-bottom));z-index:20;gap:0}
  .marca,.rodape-lateral{display:none}.menu{flex-direction:row;overflow-x:auto;width:100%;gap:2px}
  .menu a{flex-direction:column;gap:2px;padding:6px 10px;font-size:11px;min-width:64px;text-align:center;border-radius:10px;white-space:nowrap}
  .principal{padding:16px 14px 100px}.topo-mobile{display:flex}
  h1{font-size:22px}.kpi .num{font-size:25px}
  .login{grid-template-columns:1fr}.login .vitrine{padding:28px;min-height:200px}.login .vitrine h1{font-size:30px}
}
@media (min-width:861px){.topo-mobile{display:none}}
.topo-mobile{align-items:center;justify-content:space-between;margin:-4px 0 14px}.topo-mobile .marca{display:flex;padding:0;color:var(--tinta)}.topo-mobile .marca small{color:var(--suave)}
@media print{.lateral,.acoes{display:none}.principal{padding:0}}

.alerta{background:#FDECEA;color:#9B2C1F;border:1px solid #F5C2BC;border-radius:10px;padding:8px 12px;margin:8px 0}
.bolinha{display:inline-block;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #262A33;vertical-align:middle}
.trilha{margin:8px 0 12px}.cor-item{display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center}
.campos-ficha{display:grid;gap:8px}.cor-linha{display:flex;align-items:center;gap:8px;font-size:14px}.cor-linha input[type=color]{width:44px;height:30px;padding:0;border:0;background:none}
.cor-linha input[type=checkbox]{width:20px;height:20px;padding:0;flex:none}.cor-linha input[type=color]{flex:none;margin-left:auto;cursor:pointer}
