*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:Inter,system-ui,sans-serif;background:#F5F8FB;color:#0B2A45;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:none;background:none}
a{color:inherit;text-decoration:none}

/* ─── Shell desktop ─── */
.screen{display:flex;height:100vh;background:#F5F8FB;overflow:hidden}
.side{width:228px;flex:none;background:#fff;border-right:1px solid #E3EAF2;padding:24px 18px;display:flex;flex-direction:column;gap:18px;overflow-y:auto}
.side .logo{width:84px;height:90px;object-fit:contain;align-self:center}
.store{position:relative;border:1px solid #D6E4F0;border-radius:14px;padding:10px 12px;background:#F2F8FD}
.store small{font-size:10px;color:#5B7590;text-transform:uppercase;letter-spacing:.08em;font-weight:600;display:block}
.store div{font-size:13px;font-weight:700;color:#0B2A45;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.store select{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.nav{display:flex;flex-direction:column;gap:4px}
.nav a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;font-size:14px;color:#47627C;font-weight:500;cursor:pointer;transition:background .15s}
.nav a:hover{background:#F2F8FD}
.nav a.on{background:#0072BB;color:#fff;font-weight:600;box-shadow:0 6px 16px rgba(0,114,187,.25)}
.dot{width:8px;height:8px;border-radius:3px;background:currentColor;opacity:.8;flex:none}
.wl{margin-top:auto;font-size:11px;color:#7A90A6;border-top:1px solid #E3EAF2;padding-top:14px;line-height:1.45}
.wl button{color:#0072BB;font-size:11px;font-weight:600;margin-top:6px}

.main{flex:1;padding:24px 28px;display:flex;flex-direction:column;gap:18px;min-width:0;overflow-y:auto}
.main.agente{padding-right:20px}
.top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.top h1{font-size:26px;font-weight:800;letter-spacing:-.02em;white-space:nowrap}
.top p{font-size:13px;color:#5B7590;margin-top:2px}
.tools{display:flex;gap:10px;align-items:center;flex:none}
.chip{display:inline-flex;align-items:center;gap:4px;padding:8px 14px;border-radius:999px;background:#fff;border:1px solid #D6E4F0;font-size:12px;font-weight:600;color:#47627C;white-space:nowrap;cursor:pointer;position:relative;line-height:1.2}
.chip:hover{border-color:#9CCBEA}
.chip.on{background:#E6F2FA;border-color:#0072BB;color:#005A94}
.chip.online{background:#E4F5EE;color:#0F8A5F;border-color:#BFE6D5;cursor:default}
.chip select{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 16px;border-radius:999px;background:#0072BB;color:#fff;font-size:13px;font-weight:700;white-space:nowrap;cursor:pointer;border:1px solid #0072BB}
.btn:hover{background:#005A94}
.btn.ghost{background:#fff;color:#0072BB;border:1px solid #0072BB}
.btn.ghost:hover{background:#F2F8FD}
.btn.red{background:#fff;color:#C2410C;border-color:#F3C7B5}
.btn:disabled{opacity:.55;cursor:default}
.av{width:36px;height:36px;border-radius:50%;background:#005A94;color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:none}
.filtros{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.filtros .esp{flex:1}

.grid{display:grid;gap:14px}.grid>*{min-width:0}
.g5{grid-template-columns:repeat(5,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g2c{grid-template-columns:1fr 1fr}
.g15{grid-template-columns:1.5fr 1fr}
.g16{grid-template-columns:1.6fr 1fr}
.g17{grid-template-columns:1.7fr 1fr}
.grow{flex:1 0 auto}
.card{background:#fff;border:1px solid #E3EAF2;border-radius:18px;padding:16px 18px;box-shadow:0 2px 8px rgba(11,42,69,.04);min-width:0}
.card h3{font-size:14px;font-weight:700;margin-bottom:10px;display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.card h3 span{font-size:11px;color:#7A90A6;font-weight:500;text-align:right}
.card.flex{display:flex;flex-direction:column}
.kpi small{font-size:11px;color:#5B7590;font-weight:600;text-transform:uppercase;letter-spacing:.06em;display:block;line-height:1.5}
.kpi b{display:block;font-size:21px;font-weight:800;margin:6px 0 4px;white-space:nowrap;letter-spacing:-.02em;overflow:hidden;text-overflow:ellipsis}
.kpi .sub{font-size:12px;font-weight:600;color:#5B7590}
.kpi>span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.up{color:#0F8A5F;font-size:12px;font-weight:700}.dn{color:#C2410C;font-size:12px;font-weight:700}.nt{color:#5B7590;font-size:12px;font-weight:600}
.kpi.hero{background:linear-gradient(135deg,#0072BB,#004F82);color:#fff;border:none}
.kpi.hero small,.kpi.hero .up,.kpi.hero .dn,.kpi.hero .nt{color:#CFE6F6}

.tbl{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:12.5px}
th{text-align:left;color:#7A90A6;font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.05em;padding:8px 6px;border-bottom:1px solid #E3EAF2;white-space:nowrap}
td{padding:9px 6px;border-bottom:1px solid #F0F4F8;white-space:nowrap}
td.wrap{white-space:normal;min-width:150px}
td.ell{max-width:170px;overflow:hidden;text-overflow:ellipsis}
td.num,th.num{text-align:right}
tr:last-child td{border-bottom:none}
.tag{padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;display:inline-block;white-space:nowrap}
.t-ok{background:#E4F5EE;color:#0F8A5F}.t-w{background:#FFF4DA;color:#8A5A00}.t-r{background:#FDEBE3;color:#C2410C}.t-b{background:#E6F2FA;color:#005A94}
.bar{height:8px;border-radius:99px;background:#E6EEF5;overflow:hidden}.bar i{display:block;height:100%;background:#0072BB;border-radius:99px}
.row{display:flex;align-items:center;gap:10px;font-size:12.5px;margin:7px 0}
.row .n{flex:0 0 clamp(88px,36%,160px);color:#2C4A66;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .bar{flex:1}.row .v{min-width:64px;text-align:right;font-weight:700;white-space:nowrap}
.row.sb{justify-content:space-between}
.row.sb .n{flex:1 1 auto;min-width:0}
.dre .row{margin:5px 0}.dre .row small{color:#7A90A6;font-weight:500;margin-left:4px}
.dre .row.neg b{color:#C2410C}
.dre .row.tot{border-top:1px solid #E3EAF2;padding-top:7px;margin-top:2px}
.dre .row.ok b{color:#0F8A5F}
.alert{display:flex;gap:10px;padding:10px;border-radius:12px;background:#F7FAFC;margin-bottom:8px;font-size:12.5px}
.alert i{width:4px;border-radius:4px;background:#0072BB;flex:none}
.alert b{display:block;font-size:12.5px}.alert span{color:#5B7590;font-size:11.5px}
.alert.alerta i{background:#C2410C}.alert.aviso i{background:#FFB81C}.alert.ok i{background:#0F8A5F}
.insight{margin-top:14px;padding:12px;border-radius:12px;background:#F2F8FD;font-size:12px;color:#1D3B57;line-height:1.5}
.leg{display:flex;gap:14px;font-size:11px;color:#5B7590;margin-bottom:6px}.leg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.chart{position:relative;flex:1;min-height:240px;overflow:hidden}
.chart svg{position:absolute;inset:0;width:100%;height:100%}
.vazio{font-size:12.5px;color:#7A90A6;padding:12px 0}
.muted{color:#5B7590}

/* ─── Assistente lateral ─── */
.ai{width:300px;flex:none;background:#fff;border-left:1px solid #E3EAF2;padding:20px;display:flex;flex-direction:column;gap:12px;min-height:0}
.aih{display:flex;align-items:center;gap:10px}
.orb{width:34px;height:34px;border-radius:12px;overflow:hidden;flex:none;background:#E6F2FA}
.orb img{width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block}
.aih b{font-size:14px}.aih span{font-size:11px;color:#0F8A5F;display:block}
.aih .acoes{margin-left:auto;display:flex;align-items:center;gap:8px}
.aih .fechar{font-size:16px;color:#7A90A6}
.limpar{font-size:11px;font-weight:700;color:#5B7590}
.limpar:hover{color:#0072BB}
.card h3 .limpar{font-weight:700}
.conversa{display:flex;flex-direction:column;gap:10px;overflow-y:auto;min-height:0}
.msg{background:#F2F8FD;border-radius:14px 14px 14px 4px;padding:10px 12px;font-size:12.5px;line-height:1.5;color:#1D3B57;white-space:pre-wrap;word-break:break-word}
.fonte{display:block;margin-top:8px;font-size:10.5px;color:#5B7590;font-weight:600}
.msg.me{background:#0072BB;color:#fff;border-radius:14px 14px 4px 14px;align-self:flex-end;max-width:85%}
.msg.pensando{color:#7A90A6;font-style:italic;display:flex;align-items:center;gap:6px}
.pontos{display:inline-flex;align-items:flex-end;gap:3px;height:12px}
.pontos i{width:4px;height:4px;border-radius:50%;background:#7A90A6;animation:ponto 1.1s ease-in-out infinite}
.pontos i:nth-child(2){animation-delay:.15s}
.pontos i:nth-child(3){animation-delay:.3s}
@keyframes ponto{0%,70%,100%{opacity:.25;transform:translateY(0)}35%{opacity:1;transform:translateY(-4px)}}
@media (prefers-reduced-motion:reduce){.pontos i{animation:none;opacity:.7}}
.atalhos{display:flex;flex-wrap:wrap;gap:6px}
.atalhos .chip{font-size:11px}
.act{border:1px solid #D6E4F0;border-radius:14px;padding:12px;font-size:12px;color:#2C4A66}
.act b{font-size:13px;display:block;margin:6px 0 4px;color:#0B2A45}
.act .bs{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}.act .btn{padding:7px 12px;font-size:12px}
.act.destaque{border-color:#0072BB;background:#F7FBFE}
.act+.act{margin-top:8px}
.inp{margin-top:auto;border:1px solid #D6E4F0;border-radius:999px;padding:6px 6px 6px 14px;display:flex;justify-content:space-between;align-items:center;gap:8px;background:#fff}
.inp input{flex:1;border:none;outline:none;font-size:12.5px;background:transparent;min-width:0}
.inp input::placeholder{color:#7A90A6}
.send{width:28px;height:28px;border-radius:50%;background:#0072BB;color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;flex:none}
.chat{display:flex;flex-direction:column;gap:12px;min-height:520px}
.chat .conversa{flex:1}
.chat .msg{max-width:88%}
.chat .inp{margin-top:0}
.autonomia{font-size:12px;color:#47627C;line-height:1.6}

/* ─── Carregamento ─── */
.carregando{display:flex;flex-direction:column;gap:14px}
.sk{background:linear-gradient(90deg,#EEF3F8 25%,#F7FAFC 37%,#EEF3F8 63%);background-size:400% 100%;animation:sk 1.4s ease infinite;border-radius:18px}
@keyframes sk{0%{background-position:100% 50%}100%{background-position:0 50%}}
.aviso-carga{font-size:12.5px;color:#5B7590;display:flex;align-items:center;gap:8px}
.spin{width:14px;height:14px;border:2px solid #CFE6F6;border-top-color:#0072BB;border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.carga-video{position:fixed;inset:0;z-index:80;overflow:hidden;background:#000}
.carga-video[hidden]{display:none !important}
.carga-video video{
  position:absolute;top:50%;left:50%;
  width:100%;height:100%;
  transform:translate(-50%,-50%);
  object-fit:cover;object-position:center center;
  pointer-events:none;
}
.erro{background:#FDEBE3;color:#C2410C;border-radius:14px;padding:12px 14px;font-size:13px;font-weight:600;display:flex;justify-content:space-between;gap:10px;align-items:center}

/* ─── Formulários ─── */
.campo{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#5B7590;font-weight:600}
.campo input,.campo select{border:1px solid #D6E4F0;border-radius:10px;padding:9px 11px;font-size:13px;color:#0B2A45;background:#fff;outline:none}
.campo input:focus,.campo select:focus{border-color:#0072BB}
.busca{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.busca h3{flex:1 0 100%;margin-bottom:0}
.busca .campo{min-width:180px;flex:1}
.busca .btn{margin-bottom:1px}
.metas{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.inline{display:flex;gap:6px;align-items:center}
.inline input{border:1px solid #D6E4F0;border-radius:10px;padding:7px 10px;font-size:12px;width:130px;background:#fff}
.inline input:focus{border-color:#0072BB;outline:none}
td select{border:1px solid #D6E4F0;border-radius:10px;padding:6px 8px;font-size:12px;background:#fff}
.toggle{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;padding:8px 0;border-bottom:1px solid #F0F4F8}
.toggle input{width:18px;height:18px;accent-color:#0072BB}
.relat{display:flex;flex-direction:column;gap:8px}
.relat p{font-size:12.5px;color:#5B7590;line-height:1.5;flex:1}

.login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:28px 20px;background:#0B2A45}
.login-card{width:min(980px,100%);min-height:560px;display:flex;background:#fff;border-radius:28px;overflow:hidden;box-shadow:0 28px 70px rgba(0,0,0,.32)}
.login-form{flex:0 0 42%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:42px 40px;background:#fff}
.login-form img{width:118px;height:auto}
.login-avatar{width:74px;height:74px;border-radius:50%;background:#E6F2FA;color:#0072BB;display:flex;align-items:center;justify-content:center;margin:6px 0 4px}
.login-avatar svg{width:34px;height:34px}
.login-field{width:100%;max-width:320px;display:flex;align-items:center;gap:10px;border:1.5px solid #D5E3EF;border-radius:999px;padding:0 16px;background:#fff;color:#7A90A6}
.login-field:focus-within{border-color:#0072BB;color:#0072BB}
.login-field svg{width:18px;height:18px;flex:none}
.login-field input{flex:1;border:none;outline:none;background:transparent;padding:12px 0;font-size:14px;color:#0B2A45;min-width:0}
.login-field input::placeholder{color:#8AA0B5}
.login-btn{width:100%;max-width:320px;margin-top:4px;padding:12px 16px;letter-spacing:.12em;text-transform:uppercase;font-size:13px}
.login .erro{width:100%;max-width:320px;border-radius:16px}
.login-hero{position:relative;flex:1;min-width:0;background:#0072BB}
.login-ondas{position:absolute;inset:0;width:100%;height:100%;display:block}
.login-hero-texto{position:absolute;left:40px;right:36px;bottom:52px;color:#fff;z-index:1}
.login-hero-texto h1{font-size:58px;font-weight:800;letter-spacing:-.04em;line-height:.95;text-shadow:0 8px 24px rgba(0,50,90,.25)}
.login-hero-texto p{margin-top:14px;font-size:15px;line-height:1.45;font-weight:500;color:rgba(255,255,255,.92);max-width:240px}
@media (max-width:760px){
  .login{padding:16px;align-items:stretch}
  .login-card{flex-direction:column;min-height:0}
  .login-hero{min-height:210px;flex:none;order:-1}
  .login-hero-texto{left:22px;bottom:22px}
  .login-hero-texto h1{font-size:36px}
  .login-form{flex:none;padding:28px 22px 32px}
}

/* ─── Mobile ─── */
.mh,.bn,.fab,.sheet,.veu{display:none}

@media (max-width:1180px){
  .screen>.ai{display:none}
  .fab{display:flex}
}
@media (max-width:1180px) and (min-width:761px){
  .g5{grid-template-columns:repeat(3,1fr)}
}

@media (max-width:760px){
  .screen{flex-direction:column;height:auto;min-height:100vh;overflow:visible}
  .side{display:none}
  .mh{display:flex;position:sticky;top:0;z-index:20;background:#fff;padding:14px 16px 12px;border-bottom:1px solid #E3EAF2;align-items:center;gap:10px}
  .mh .logo{width:34px;height:36px;object-fit:contain}
  .mh .store{flex:1;padding:6px 10px;min-width:0}.mh .store div{font-size:12px}
  .main,.main.agente{padding:14px 16px 100px;gap:12px;overflow:visible}
  .top{flex-direction:column;align-items:flex-start;gap:2px}
  .top h1{font-size:22px}
  .top p{font-size:12px}
  .top .tools{display:none}
  .filtros{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px}
  .filtros::-webkit-scrollbar{display:none}
  .filtros .esp{display:none}
  .grid{gap:10px}
  .g5,.g4{grid-template-columns:1fr 1fr}
  .g5>.kpi:nth-child(5){display:none}
  .g3,.g2c,.g15,.g16,.g17{grid-template-columns:1fr}
  .card{padding:12px 14px;border-radius:16px}
  .kpi b{font-size:18px}
  .row .n{width:96px}
  .chart{min-height:150px}
  .desk{display:none!important}
  .mlist{display:flex!important;flex-direction:column;gap:10px}
  .mlist h3{font-size:15px;font-weight:700;margin-top:4px}
  .li{display:flex;justify-content:space-between;align-items:center;gap:10px;background:#fff;border:1px solid #E3EAF2;border-radius:14px;padding:10px 12px;font-size:12px}
  .li b{font-size:13px;display:block}.li .s{color:#5B7590;font-size:11px}.li .r{text-align:right;flex:none}
  .li .r .tag{margin-top:3px}
  .chat{min-height:calc(100vh - 260px)}
  .bn{display:flex;position:fixed;left:12px;right:12px;bottom:14px;height:62px;background:#fff;border-radius:22px;box-shadow:0 8px 24px rgba(11,42,69,.12);justify-content:space-around;align-items:center;z-index:30}
  .bn a{font-size:10.5px;font-weight:600;color:#7A90A6;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer}
  .bn a i{width:22px;height:22px;border-radius:8px;background:#E6EEF5;display:block}
  .bn a.on{color:#0072BB}.bn a.on i{background:#0072BB}
  .fab{bottom:92px}
}
.mlist{display:none}

.fab{position:fixed;right:18px;bottom:24px;width:56px;height:56px;border-radius:20px;padding:0;overflow:hidden;background:#E6F2FA;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(0,114,187,.4);z-index:31;cursor:pointer}
.fab img{width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block}
.veu.aberto{display:block;position:fixed;inset:0;background:rgba(11,42,69,.35);z-index:40}
.sheet.aberto{display:flex;position:fixed;right:0;top:0;bottom:0;width:min(380px,100%);z-index:41;box-shadow:-10px 0 30px rgba(11,42,69,.15)}
.sheet.ai{border-left:none}
.sheet.menu{flex-direction:column;gap:6px;background:#fff;padding:20px;top:auto;left:0;width:100%;border-radius:22px 22px 0 0}
.sheet.menu a{padding:12px;border-radius:12px;font-weight:600;color:#2C4A66;display:flex;gap:10px;align-items:center;cursor:pointer}
.sheet.menu a.on{background:#E6F2FA;color:#005A94}
@media (max-width:760px){
  .sheet.ai.aberto{width:100%}
}
