/* =========================================================
   CRISDU Canhotos — estilos
   ========================================================= */
:root{
  --navy:#1C2C4C; --navy-2:#26406B; --navy-3:#2E4877; --navy-ink:#15213A;
  --red:#A41B1A; --red-2:#BA2622; --red-3:#8F1716;
  --bg:#F2F4F8; --surface:#FFFFFF; --soft:#F8FAFC;
  --line:#DFE4EC; --line-2:#ECEFF4;
  --ink:#1A2230; --muted:#5F6B7A; --faint:#8A94A3;
  --ok:#1E7F4F; --ok-bg:#E6F4EC; --warn:#9A5B06; --warn-bg:#FCF0DC; --bad:#A41B1A; --bad-bg:#FBEAEA;

  --sh-1:0 1px 2px rgba(21,33,58,.06), 0 1px 1px rgba(21,33,58,.04);
  --sh-2:0 1px 2px rgba(21,33,58,.05), 0 6px 18px rgba(21,33,58,.07);
  --sh-3:0 2px 6px rgba(21,33,58,.08), 0 18px 40px rgba(21,33,58,.16);

  --petala:10px 30px 10px 10px;       /* o canto da logo */
  --petala-g:14px 64px 14px 14px;

  --rail:76px; --sbw:280px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:15px;line-height:1.45;background:var(--bg);color:var(--ink);
  -webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;
}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
img{max-width:100%}
.hidden{display:none!important}
:focus-visible{outline:2.5px solid #3D6BC4;outline-offset:2px;border-radius:6px}

.nf{font-family:"Archivo",sans-serif;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.sub{color:var(--muted);margin:0 0 18px;font-size:14.5px;max-width:60ch}
.h-page{font-family:"Archivo";font-weight:800;font-size:24px;margin:4px 0 4px;letter-spacing:-.01em}
.h-sec{font-family:"Archivo";font-weight:700;font-size:18px;margin:0 0 4px}

/* ---------- telas ---------- */
.screen{display:none;min-height:100vh;min-height:100dvh}
.screen.on{display:block}

/* ---------- abertura ---------- */
.boot{position:fixed;inset:0;z-index:200;display:grid;place-items:center;background:var(--bg);transition:opacity .3s}
.boot img{width:88px;animation:respira 1.6s ease-in-out infinite}
.boot.sai{opacity:0;pointer-events:none}
@keyframes respira{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(1.05);opacity:1}}

/* ---------- campos ---------- */
.lbl{display:block;font-weight:600;font-size:13.5px;margin:14px 0 6px;color:var(--ink)}
.inp{
  width:100%;height:52px;border:1.5px solid var(--line);border-radius:10px;background:var(--surface);
  padding:0 14px;font-size:16px;transition:border-color .15s, box-shadow .15s;
}
.inp:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(28,44,76,.12)}
.inp-sm{height:44px;font-size:15px}
.inp-num{font-family:"Archivo";font-weight:600;letter-spacing:.04em;font-size:19px}
select.inp{appearance:none;-webkit-appearance:none;padding-right:38px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%235F6B7A' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center}

/* ---------- botões ---------- */
.btn{
  height:50px;border:0;border-radius:10px;padding:0 20px;font-weight:600;font-size:15.5px;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  transition:transform .12s var(--ease), box-shadow .15s, background .15s, opacity .15s;
}
.btn:active{transform:translateY(1px) scale(.985)}
.btn[disabled]{opacity:.5;pointer-events:none}
.btn-full{width:100%;margin-top:18px}
.btn-navy{background:var(--navy);color:#fff;box-shadow:0 6px 14px -8px rgba(28,44,76,.7)}
.btn-navy:hover{background:var(--navy-2)}
.btn-red{background:var(--red);color:#fff;box-shadow:0 8px 18px -8px rgba(164,27,26,.75)}
.btn-red:hover{background:var(--red-2)}
.btn-ghost{background:var(--surface);color:var(--navy);border:1.5px solid var(--line)}
.btn-ghost:hover{border-color:#C8D0DC}
.btn-perigo{background:var(--red);color:#fff}
.btn-quiet{background:none;border:0;color:var(--muted);font-weight:600;font-size:14px;padding:8px 10px;border-radius:8px}
.btn-quiet:hover{background:var(--bg);color:var(--navy)}
.link-btn{display:block;margin:20px auto 0;background:none;border:0;color:var(--navy);font-weight:600;font-size:14px;text-decoration:underline;text-underline-offset:3px}
.ico-btn{
  width:36px;height:36px;border-radius:9px;border:1px solid var(--line);background:var(--surface);
  display:inline-grid;place-items:center;color:var(--navy);transition:background .12s, transform .1s;vertical-align:middle
}
.ico-btn:hover{background:var(--soft)}
.ico-btn:active{transform:scale(.94)}
.ico-btn.perigo{color:var(--red)}
.ico-btn svg{width:17px;height:17px}
.ico-btn + .ico-btn{margin-left:6px}

/* ---------- mensagens ---------- */
.msg{display:none;margin-top:12px;font-size:14px;padding:11px 13px;border-radius:10px;line-height:1.4}
.msg.on{display:block;animation:entra .18s var(--ease)}
.msg.erro{background:var(--bad-bg);color:#7E1716}
.msg.ok{background:var(--ok-bg);color:#135C38}
@keyframes entra{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}

.chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;padding:3px 9px;border-radius:999px;white-space:nowrap}
.chip.ok{background:var(--ok-bg);color:var(--ok)}
.chip.warn{background:var(--warn-bg);color:var(--warn)}
.chip.bad{background:var(--bad-bg);color:var(--bad)}
.chip.neutro{background:var(--line-2);color:var(--muted)}

.spin{width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:gira .7s linear infinite;flex:none;opacity:.8}
@keyframes gira{to{transform:rotate(360deg)}}

/* ---------- carregando (esqueleto) ---------- */
.sk{background:linear-gradient(90deg,#E8ECF2 0%,#F4F6F9 50%,#E8ECF2 100%);background-size:200% 100%;animation:sk 1.2s linear infinite;border-radius:8px}
@keyframes sk{from{background-position:200% 0}to{background-position:-200% 0}}
.sk-linha{height:58px;margin-bottom:10px;border-radius:12px}
.sk-tab{background:var(--surface);border-radius:12px;box-shadow:var(--sh-2);padding:8px 16px}
.sk-tab .sk{height:20px;margin:16px 0}

.vazio{color:var(--muted);text-align:center;padding:40px 16px;font-size:14.5px;background:var(--surface);border-radius:12px;box-shadow:var(--sh-1)}
.vazio b{display:block;color:var(--ink);font-size:15.5px;margin-bottom:4px}
.aparece{animation:aparece .22s var(--ease)}
@keyframes aparece{from{opacity:0}to{opacity:1}}

/* =========================================================
   CONFIG
   ========================================================= */
.s-config.on{display:grid;place-items:center;padding:24px}
.config-card{background:var(--surface);border-radius:var(--petala-g);box-shadow:var(--sh-3);padding:32px;max-width:460px}
.config-logo{height:40px;margin-bottom:18px}
.config-card h1{font-family:"Archivo";font-size:22px;margin:0 0 8px}
.config-status div{padding:8px 0;border-top:1px solid var(--line-2);font-size:14.5px}

/* =========================================================
   LOGIN
   ========================================================= */
.login.on{display:grid;grid-template-columns:minmax(380px,44%) 1fr}
.login-brand{
  position:relative;overflow:hidden;color:#fff;padding:40px 48px;
  background:radial-gradient(120% 90% at 0% 0%, #26395E 0%, var(--navy) 55%, #16233F 100%);
  display:flex;flex-direction:column;justify-content:space-between;min-height:100dvh;
}
.brand-badge{background:#fff;border-radius:var(--petala);padding:14px 20px;width:max-content;box-shadow:0 12px 30px rgba(0,0,0,.28);position:relative;z-index:2}
.brand-badge img{height:42px;display:block}
.brand-copy{position:relative;z-index:2;max-width:440px;margin-bottom:30vh}
.brand-copy h1{font-family:"Archivo";font-weight:800;font-size:clamp(28px,2.9vw,40px);line-height:1.12;margin:0 0 14px;letter-spacing:-.015em}
.brand-copy p{color:#C3CCDC;font-size:16px;margin:0;max-width:34ch}
/* as quatro pétalas da logo, grandes, no canto */
.brand-petalas{position:absolute;right:-70px;bottom:-70px;width:420px;height:290px;z-index:1}
.brand-petalas span{position:absolute;display:block}
.brand-petalas span:nth-child(1){left:0;top:0;width:44%;height:45%;background:var(--red);opacity:.92;border-radius:0 0 0 100%}
.brand-petalas span:nth-child(2){left:46.5%;top:0;width:25%;height:27%;background:var(--red);opacity:.92;border-radius:0 100% 0 0}
.brand-petalas span:nth-child(3){left:20%;top:48%;width:24%;height:34%;background:var(--navy-3);border-radius:0 0 0 100%}
.brand-petalas span:nth-child(4){left:46.5%;top:30%;width:53.5%;height:52%;background:var(--navy-3);border-radius:0 100% 0 0}
.brand-petalas{animation:petalas .7s var(--ease) both .1s}
@keyframes petalas{from{opacity:0;transform:translate(30px,30px)}to{opacity:1;transform:none}}

.login-main{display:flex;align-items:center;justify-content:center;padding:32px 24px;background:var(--bg);position:relative}
.login-main::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 70% 20%,rgba(28,44,76,.06),transparent 70%)}
.login-card{position:relative;width:100%;max-width:420px;background:var(--surface);border-radius:var(--petala-g);box-shadow:0 2px 6px rgba(21,33,58,.06),0 24px 60px rgba(21,33,58,.14);padding:34px 34px 28px;animation:entra .3s var(--ease)}
.login-card .login-form h2:first-child{margin-top:0}
.login-logo-mobile{display:none;height:38px;margin:0 auto 22px}
.login-form h2{font-family:"Archivo";font-weight:800;font-size:26px;margin:22px 0 4px;letter-spacing:-.01em}
.seg{display:flex;background:var(--bg);border-radius:12px;padding:4px;gap:4px}
.seg button{flex:1;border:0;background:transparent;padding:10px 8px;border-radius:9px;font-weight:600;font-size:14px;color:var(--muted);transition:background .15s,color .15s,box-shadow .15s}
.seg button.act{background:var(--surface);color:var(--navy);box-shadow:var(--sh-1)}
.install{display:none;margin-top:22px;padding:12px 14px;border-radius:12px;background:var(--soft);border:1px solid var(--line-2);font-size:13.5px;color:var(--muted)}
.install.on{display:flex;align-items:center;gap:12px;justify-content:space-between}
.install .btn{height:36px;font-size:13.5px;padding:0 14px;flex:none}

@media (max-width:900px){
  .login.on{display:block}
  .login-brand{display:none}
  .login-main{min-height:100dvh;background:var(--bg);align-items:flex-start;padding-top:max(8vh,32px)}
  .login-card{background:var(--surface);border-radius:var(--petala-g);box-shadow:var(--sh-3);padding:28px 22px 24px}
  .login-logo-mobile{display:block}
  .login-form h2{font-size:23px}
}

/* =========================================================
   APP DO MOTORISTA
   ========================================================= */
.mot-top,.cap-top{
  position:sticky;top:0;z-index:20;background:var(--surface);
  display:flex;align-items:center;gap:10px;
  padding:calc(env(safe-area-inset-top) + 10px) 14px 10px 16px;
  box-shadow:0 1px 0 var(--line), 0 6px 16px rgba(21,33,58,.05);
}
.mot-logo{height:28px;width:auto}
.mot-top-dir{margin-left:auto;display:flex;align-items:center;gap:6px}
.mot-body{max-width:620px;margin:0 auto;padding:22px 16px calc(env(safe-area-inset-bottom) + 36px)}
.view{display:none}
.view.on{display:block;animation:aparece .2s var(--ease)}

.home-cab{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:18px}
.ola{font-family:"Archivo";font-weight:800;font-size:27px;margin:2px 0 2px;letter-spacing:-.015em}
.hoje{color:var(--muted);font-size:14.5px}
.hoje::first-letter{text-transform:uppercase}
.chip-trocar{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:7px 12px;font-weight:600;font-size:13px;color:var(--navy);box-shadow:var(--sh-1);display:inline-flex;align-items:center;gap:6px;flex:none}
.chip-trocar svg{width:15px;height:15px}

/* botão herói */
.cta{
  position:relative;overflow:hidden;width:100%;border:0;color:#fff;text-align:left;
  border-radius:var(--petala-g);padding:26px 24px;min-height:178px;
  display:flex;flex-direction:column;justify-content:flex-end;gap:4px;
  background:linear-gradient(155deg,var(--red-2) 0%,var(--red) 55%,var(--red-3) 100%);
  box-shadow:0 18px 32px -14px rgba(164,27,26,.6), 0 2px 6px rgba(21,33,58,.12);
  transition:transform .13s var(--ease), box-shadow .13s;
}
.cta::after{ /* brilho discreto de pétala */
  content:"";position:absolute;right:-40px;top:-40px;width:180px;height:140px;
  background:rgba(255,255,255,.07);border-radius:0 0 0 100%;
}
.cta:hover{box-shadow:0 22px 36px -14px rgba(164,27,26,.65), 0 2px 6px rgba(21,33,58,.12)}
.cta:active{transform:translateY(2px) scale(.992);box-shadow:0 8px 16px -10px rgba(164,27,26,.6)}
.cta-cam{position:absolute;top:22px;left:24px;width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.15);display:grid;place-items:center}
.cta-cam svg{width:26px;height:26px}
.cta-t{font-family:"Archivo";font-weight:800;font-size:27px;letter-spacing:-.01em;position:relative}
.cta-s{opacity:.88;font-size:14px;position:relative}
.cta-sm{min-height:150px;margin-top:20px}
@media (max-width:600px){ .mot .cta{min-height:220px} }
.cta-sm .cta-t{font-size:23px}

.strip{display:flex;margin-top:14px;background:var(--surface);border-radius:14px;box-shadow:var(--sh-2);overflow:hidden}
.strip > div{flex:1;padding:14px 18px;display:flex;align-items:baseline;gap:8px}
.strip b{font-family:"Archivo";font-weight:800;font-size:28px;color:var(--navy);font-variant-numeric:tabular-nums}
.strip span{color:var(--muted);font-size:14px}
.strip button{border:0;border-left:1px solid var(--line-2);background:none;padding:0 20px;font-weight:600;color:var(--navy);display:flex;align-items:center;gap:6px;transition:background .15s}
.strip button:hover{background:var(--soft)}
.strip button svg{width:16px;height:16px}

.voltar{display:inline-flex;align-items:center;gap:4px;border:0;background:none;color:var(--navy);font-weight:600;font-size:14.5px;padding:6px 8px 6px 2px;border-radius:8px}
.voltar svg{width:20px;height:20px}

/* listas simples (minhas notas, escolher nome) */
.linha{
  display:flex;align-items:center;gap:12px;background:var(--surface);border-radius:12px;box-shadow:var(--sh-1);
  padding:12px 14px;margin-bottom:8px;border:0;width:100%;text-align:left;transition:box-shadow .15s, transform .1s;
}
button.linha:hover{box-shadow:var(--sh-2)}
button.linha:active{transform:scale(.99)}
.linha .cresce{flex:1;min-width:0}
.linha .nf{font-size:19px;color:var(--navy)}
.linha .meta{color:var(--muted);font-size:13px;margin-top:1px}
.picker-lista{margin-top:12px}
.picker-lista .linha{padding:16px;font-weight:600;font-size:16.5px}
.inicial{width:36px;height:36px;border-radius:10px 16px 10px 10px;background:var(--bg);color:var(--navy);font-family:"Archivo";font-weight:800;display:grid;place-items:center;flex:none}

/* ---------- fila de envio (selo) ---------- */
.fila-badge{
  display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;border-radius:999px;
  border:1px solid var(--line);background:var(--surface);font-weight:600;font-size:13px;color:var(--navy);box-shadow:var(--sh-1);
  animation:entra .2s var(--ease);
}
.fila-badge svg{width:15px;height:15px}
.fila-badge.ativo{animation:pulsa 1.8s ease-in-out infinite}
.fila-badge.erro{background:var(--bad-bg);border-color:#F1C9C9;color:var(--bad)}
.fila-badge.ok{background:var(--ok-bg);border-color:#BFE2CD;color:var(--ok);animation:salta .35s var(--ease)}
.fila-badge.offline{background:var(--warn-bg);border-color:#F0D9B0;color:var(--warn)}
@keyframes pulsa{0%,100%{box-shadow:var(--sh-1),0 0 0 0 rgba(28,44,76,.18)}50%{box-shadow:var(--sh-1),0 0 0 5px rgba(28,44,76,0)}}
@keyframes salta{0%{transform:scale(.85)}60%{transform:scale(1.06)}100%{transform:scale(1)}}

/* =========================================================
   CAPTURA
   ========================================================= */
.cap-tit{display:flex;flex-direction:column;line-height:1.2}
.cap-tit b{font-family:"Archivo";font-size:17px}
.cap-tit span{color:var(--muted);font-size:13px}
.cap-body{max-width:620px;margin:0 auto;padding:16px 16px calc(env(safe-area-inset-bottom) + 28px)}
.cap-frame{position:relative;height:min(50vh,470px);background:#101828;border-radius:14px;overflow:hidden;box-shadow:var(--sh-2);display:grid;place-items:center}
.cap-frame img{width:100%;height:100%;object-fit:contain;transition:opacity .25s}
.cap-frame img.carregando{opacity:0}
.cap-frame.carregando::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#141E31 0%,#1C2944 50%,#141E31 100%);background-size:200% 100%;animation:sk 1.2s linear infinite}
.cap-status{display:flex;align-items:center;gap:8px;font-size:14px;margin:12px 2px 0;min-height:22px;color:var(--muted)}
.cap-status.ok{color:var(--ok)}
.cap-status.aviso{color:var(--warn)}
.cap-status.erro{color:var(--bad)}
.cap-status svg{width:16px;height:16px;flex:none}
.nf-inp{height:66px;font-family:"Archivo";font-weight:700;font-size:32px;text-align:center;letter-spacing:.04em;color:var(--navy)}
.nf-inp.brilha{animation:brilha .9s var(--ease)}
@keyframes brilha{0%{box-shadow:0 0 0 0 rgba(30,127,79,.35);border-color:var(--ok)}100%{box-shadow:0 0 0 10px rgba(30,127,79,0)}}
.cap-acoes{display:grid;grid-template-columns:1fr 1.5fr;gap:10px;margin-top:16px}
.cap-acoes .btn{height:56px;font-size:16.5px}

.cap-ok{position:fixed;inset:0;z-index:60;background:rgba(242,244,248,.94);display:grid;place-items:center;animation:aparece .15s}
.cap-ok-in{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.cap-ok-in .nf{font-size:28px;color:var(--navy);margin-top:8px}
.cap-ok-in span{color:var(--muted)}
.check-pop{width:78px;height:78px;border-radius:50%;background:var(--ok);display:grid;place-items:center;color:#fff;box-shadow:0 12px 26px -10px rgba(30,127,79,.7);animation:salta .38s var(--ease)}
.check-pop svg{width:40px;height:40px}

/* =========================================================
   PAINEL DO ADMIN
   Camadas: fundo cinza > faixa marinho no topo > cartões brancos
   ========================================================= */
.adm.on{display:block}

/* ---------- sidebar ---------- */
.sidebar{
  position:fixed;z-index:40;top:0;left:0;bottom:0;width:var(--rail);
  background:var(--surface);
  box-shadow:1px 0 0 var(--line), 6px 0 24px rgba(21,33,58,.05);
  display:flex;flex-direction:column;overflow:hidden;
  transition:width .24s var(--ease), box-shadow .24s var(--ease), transform .26s var(--ease);
}
.sidebar.espia,body.sb-fixa .sidebar{width:var(--sbw)}
.sidebar.espia{box-shadow:1px 0 0 var(--line), 18px 0 44px rgba(21,33,58,.16)}
.sb-head{position:relative;height:72px;display:flex;align-items:center;padding:0 12px 0 18px;border-bottom:1px solid var(--line-2);flex:none}
.sb-logo-mini{width:40px;height:auto;transition:opacity .15s}
.sb-logo-full{position:absolute;left:18px;top:50%;height:34px;width:auto;transform:translateY(-50%);opacity:0;transition:opacity .18s}
.sb-fixar{margin-left:auto;width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:var(--surface);display:grid;place-items:center;color:var(--muted);opacity:0;pointer-events:none;transition:opacity .15s, background .15s;position:relative;z-index:1}
.sb-fixar:hover{background:var(--soft);color:var(--navy)}
.sb-fixar svg{width:18px;height:18px}
.sb-nav{padding:14px 12px;display:flex;flex-direction:column;gap:4px;flex:1}
.sb-item{
  position:relative;display:flex;align-items:center;gap:14px;height:46px;padding:0 14px;width:100%;
  border:0;background:none;border-radius:10px;color:var(--muted);font-weight:600;font-size:14.5px;
  white-space:nowrap;text-align:left;transition:background .15s, color .15s, border-radius .2s;
}
.sb-item i{display:grid;place-items:center;flex:none}
.sb-item svg{width:20px;height:20px}
.sb-item span{opacity:0;transition:opacity .15s}
.sb-item:hover{background:var(--bg);color:var(--navy)}
.sb-item.act{background:var(--navy);color:#fff;border-radius:10px 22px 10px 10px;box-shadow:0 8px 16px -8px rgba(28,44,76,.6)}
.sb-item.act::before{content:"";position:absolute;left:-12px;top:11px;bottom:11px;width:4px;border-radius:0 4px 4px 0;background:var(--red)}
.sb-foot{padding:12px;border-top:1px solid var(--line-2)}
.sb-user{display:flex;align-items:center;gap:12px;padding:6px 8px 10px;white-space:nowrap}
.avatar{width:36px;height:36px;border-radius:10px 16px 10px 10px;background:var(--bg);color:var(--navy);font-family:"Archivo";font-weight:800;display:grid;place-items:center;flex:none}
.sb-nome{font-weight:600;font-size:14px;opacity:0;transition:opacity .15s;overflow:hidden;text-overflow:ellipsis}
.sidebar.espia .sb-logo-mini,body.sb-fixa .sb-logo-mini{opacity:0}
.sidebar.espia .sb-logo-full,body.sb-fixa .sb-logo-full,
.sidebar.espia .sb-fixar,body.sb-fixa .sb-fixar,
.sidebar.espia .sb-item span,body.sb-fixa .sb-item span,
.sidebar.espia .sb-nome,body.sb-fixa .sb-nome{opacity:1;pointer-events:auto}
.sb-fundo{display:none}

/* ---------- área principal ---------- */
.adm-main{position:relative;margin-left:var(--rail);min-height:100vh;transition:margin .24s var(--ease)}
body.sb-fixa .adm-main{margin-left:var(--sbw)}

.adm-faixa{
  position:absolute;left:0;right:0;top:0;height:196px;overflow:hidden;
  background:linear-gradient(135deg,#243A61 0%,var(--navy) 48%,#162340 100%);
}
.adm-faixa::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(255,255,255,.06)}
.faixa-petalas{position:absolute;right:5%;top:22px;width:250px;height:172px;opacity:.5}
.faixa-petalas span{position:absolute;display:block}
.faixa-petalas span:nth-child(1){left:0;top:0;width:44%;height:45%;background:rgba(164,27,26,.55);border-radius:0 0 0 100%}
.faixa-petalas span:nth-child(2){left:46.5%;top:0;width:25%;height:27%;background:rgba(164,27,26,.55);border-radius:0 100% 0 0}
.faixa-petalas span:nth-child(3){left:20%;top:48%;width:24%;height:34%;background:rgba(255,255,255,.07);border-radius:0 0 0 100%}
.faixa-petalas span:nth-child(4){left:46.5%;top:30%;width:53.5%;height:52%;background:rgba(255,255,255,.07);border-radius:0 100% 0 0}

.adm-top{
  position:sticky;top:0;z-index:25;height:64px;display:flex;align-items:center;gap:14px;padding:0 32px;
  transition:background .2s, box-shadow .2s;
}
.adm-top-tit{font-family:"Archivo";font-weight:700;font-size:17px;color:var(--navy);opacity:0;transform:translateY(4px);transition:opacity .2s, transform .2s}
.adm-top.rolou{background:rgba(255,255,255,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 1px 0 var(--line), 0 8px 20px rgba(21,33,58,.06)}
.adm-top.rolou .adm-top-tit{opacity:1;transform:none}
.adm-top-dir{margin-left:auto}
.burger{display:none;width:40px;height:40px;border-radius:10px;border:1px solid var(--line);background:var(--surface);place-items:center;color:var(--navy)}
.burger svg{width:20px;height:20px}

.adm-hero,.adm-content{position:relative;max-width:1400px;margin:0 auto;padding-left:32px;padding-right:32px}
.adm-hero{color:#fff;padding-top:0;padding-bottom:26px;animation:entra .3s var(--ease)}
.adm-hero h1{font-family:"Archivo";font-weight:800;font-size:30px;margin:0 0 4px;letter-spacing:-.015em}
.adm-hero p{margin:0;color:#BFC9DA;font-size:15px}
.adm-hero p::first-letter{text-transform:uppercase}
.adm-content{padding-bottom:48px}
.sec{animation:aparece .2s var(--ease)}

/* ---------- resumo: 4 cartões sobre a faixa ---------- */
.resumo{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:22px}
.kpi{
  display:flex;align-items:center;gap:14px;text-align:left;border:0;
  background:var(--surface);border-radius:14px;padding:18px 20px;
  box-shadow:0 1px 2px rgba(21,33,58,.06), 0 10px 28px rgba(21,33,58,.12);
  transition:transform .18s var(--ease), box-shadow .18s var(--ease);
}
.kpi:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(21,33,58,.06), 0 16px 34px rgba(21,33,58,.16)}
.kpi-selo{width:44px;height:44px;border-radius:10px 20px 10px 10px;display:grid;place-items:center;flex:none;background:#E9EEF6;color:var(--navy)}
.kpi-selo svg{width:21px;height:21px}
.kpi b{display:block;font-family:"Archivo";font-weight:800;font-size:28px;line-height:1.1;color:var(--navy);font-variant-numeric:tabular-nums}
.kpi span{color:var(--muted);font-size:13.5px}
.kpi-alerta{cursor:pointer}
.kpi-alerta.tem .kpi-selo{background:var(--bad-bg);color:var(--red)}
.kpi-alerta.tem b{color:var(--red)}
.kpi-alerta.tem{box-shadow:0 1px 2px rgba(21,33,58,.06), 0 10px 28px rgba(164,27,26,.14)}

/* ---------- bloco (cartão com cabeçalho, filtros e lista) ---------- */
.bloco{background:var(--surface);border-radius:16px;box-shadow:var(--sh-2);overflow:hidden;margin-bottom:22px}
.bloco-cab{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px 6px}
.bloco-info{display:block;color:var(--muted);font-size:13.5px;margin-top:2px}
.bloco-rodape{display:flex;justify-content:center}
.bloco-rodape .btn{margin:14px 0 18px}
.bloco .vazio{box-shadow:none;border-radius:0;border-top:1px solid var(--line-2)}
.bloco .sk-tab{box-shadow:none;border-radius:0}

.filtros{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:10px;padding:12px 22px 16px}
.busca{position:relative}
.busca i{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--faint);display:grid}
.busca i svg{width:17px;height:17px}
.busca .inp{padding-left:38px}
.filtros-datas{grid-column:1/-1;display:flex;gap:12px;flex-wrap:wrap}
.filtros-datas label{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--muted);font-weight:600}
.filtros-datas .inp{width:auto}

/* tabela */
.tabela{width:100%;border-collapse:separate;border-spacing:0;background:var(--surface)}
.tabela th{text-align:left;font-size:13px;font-weight:600;color:var(--muted);padding:11px 22px;background:var(--soft);border-top:1px solid var(--line-2);border-bottom:1px solid var(--line)}
.tabela td{padding:12px 22px;border-bottom:1px solid var(--line-2);vertical-align:middle;font-size:14.5px}
.tabela tbody tr:last-child td{border-bottom:0}
.tabela tbody tr{transition:background .12s}
.tabela tbody tr:hover{background:#F7F9FC}
.tabela .nf{font-size:17px;color:var(--navy)}
.tabela .origem{display:block;font-size:12.5px;color:var(--muted)}
.tabela .c-acoes{text-align:right;white-space:nowrap}
.tabela .c-data{color:var(--muted);white-space:nowrap}
.tabela .cpf{font-family:"Archivo";font-weight:600;letter-spacing:.03em;color:var(--muted)}

/* painéis e duas colunas */
.painel{background:var(--surface);border-radius:16px;box-shadow:var(--sh-2);padding:24px;margin-bottom:22px}
.painel .btn{margin-top:18px}
.painel-cab{display:flex;align-items:center;justify-content:space-between;gap:10px}
.duas-col{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;align-items:start}
.duas-col > *{margin-bottom:0}
.linha-form{display:grid;grid-template-columns:1.6fr 1fr auto;gap:12px;align-items:end;margin-top:6px}
.linha-form .lbl{margin-top:8px}
.linha-form .btn{margin:0;height:44px}

.lista-simples{border-top:1px solid var(--line-2)}
.lista-simples .item{display:flex;align-items:center;gap:12px;padding:12px 22px;border-bottom:1px solid var(--line-2);width:100%;border-left:0;border-right:0;border-top:0;background:none;text-align:left;transition:background .12s}
.lista-simples .item:last-child{border-bottom:0}
.lista-simples .item:hover{background:#F7F9FC}
.lista-simples .item .cresce{flex:1;min-width:0}
.lista-simples .nf{font-size:16.5px;color:var(--navy)}
.lista-simples .meta{color:var(--muted);font-size:13px}

.passos{list-style:none;counter-reset:passo;margin:14px 0 0;padding:0}
.passos li{counter-increment:passo;position:relative;padding:0 0 18px 50px}
.passos li:last-child{padding-bottom:0}
.passos li::before{
  content:counter(passo);position:absolute;left:0;top:0;width:34px;height:34px;border-radius:9px 16px 9px 9px;
  background:#E9EEF6;color:var(--navy);font-family:"Archivo";font-weight:800;display:grid;place-items:center;
}
.passos li:not(:last-child)::after{content:"";position:absolute;left:16px;top:38px;bottom:4px;width:2px;background:var(--line-2)}
.passos b{display:block;font-size:15px;margin-top:6px}
.passos span{color:var(--muted);font-size:14px}

/* ---------- admin no celular / telas médias ---------- */
@media (max-width:1100px){
  .resumo{grid-template-columns:repeat(2,1fr)}
  .duas-col{grid-template-columns:1fr}
}
@media (max-width:900px){
  .sidebar{width:var(--sbw);transform:translateX(-102%)}
  .adm.menu-aberto .sidebar{transform:none;box-shadow:var(--sh-3)}
  .sidebar .sb-logo-mini{opacity:0}
  .sidebar .sb-logo-full,.sidebar .sb-item span,.sidebar .sb-nome{opacity:1}
  .sidebar .sb-fixar{display:none}
  .adm.menu-aberto .sb-fundo{display:block;position:fixed;inset:0;z-index:35;background:rgba(21,33,58,.35);animation:aparece .2s}
  .adm-main,body.sb-fixa .adm-main{margin-left:0}
  .burger{display:grid}
  .adm-top{padding:0 16px;height:60px}
  .adm-hero,.adm-content{padding-left:16px;padding-right:16px}
  .adm-hero h1{font-size:24px}
  .adm-faixa{height:176px}
  .faixa-petalas{right:-60px;top:30px;opacity:.35}
  .resumo{gap:10px}
  .kpi{padding:14px}
  .kpi-selo{width:38px;height:38px}
  .kpi b{font-size:23px}
  .filtros{grid-template-columns:1fr 1fr;padding:10px 16px 14px}
  .filtros > :first-child{grid-column:1/-1}
  .bloco-cab{padding:16px 16px 4px}
  .linha-form{grid-template-columns:1fr}
}
@media (max-width:700px){
  .filtros{grid-template-columns:1fr}
  .bloco .tabela thead{display:none}
  .bloco .tabela,.bloco .tabela tbody,.bloco .tabela tr,.bloco .tabela td{display:block;width:100%}
  .bloco .tabela tbody tr{padding:12px 16px;border-top:1px solid var(--line-2)}
  .bloco .tabela td{border:0!important;padding:3px 0}
  .bloco .tabela .c-acoes{text-align:left;padding-top:10px}
}

/* =========================================================
   JANELAS (modal), VISUALIZADOR E AVISOS
   ========================================================= */
.modal-wrap{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:16px}
.modal-bg{position:absolute;inset:0;background:rgba(21,33,58,.42);animation:aparece .16s}
.modal{
  position:relative;width:100%;max-width:440px;max-height:92vh;overflow:auto;
  background:var(--surface);border-radius:16px;box-shadow:var(--sh-3);padding:22px;
  animation:modal .2s var(--ease);
}
@keyframes modal{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
.modal-wrap.sai .modal{opacity:0;transform:scale(.98);transition:.14s}
.modal-wrap.sai .modal-bg{opacity:0;transition:.14s}
.modal-t{font-family:"Archivo";font-weight:800;font-size:19px;margin:0 0 8px}
.modal-c{color:var(--muted);font-size:14.5px}
.modal-c .inp{margin-top:6px}
.modal-a{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}
.modal-a .btn{height:44px}

.visor .modal{max-width:min(960px,96vw);padding:16px}
.visor-cab{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.visor-cab .nf{font-size:20px;color:var(--navy)}
.visor-cab .meta{color:var(--muted);font-size:13px}
.visor-cab .fechar{margin-left:auto}
.visor-foto{position:relative;background:#101828;border-radius:12px;overflow:auto;height:min(76vh,760px);display:flex;align-items:center;justify-content:center}
.visor-foto img{max-width:100%;max-height:100%;cursor:zoom-in;opacity:0;transition:opacity .25s}
.visor-foto img.ok{opacity:1}
.visor-foto.zoom{display:block}
.visor-foto.zoom img{max-width:none;max-height:none;width:180%;cursor:zoom-out}
.visor-foto .sk-escuro{position:absolute;inset:0;background:linear-gradient(90deg,#141E31 0%,#1C2944 50%,#141E31 100%);background-size:200% 100%;animation:sk 1.2s linear infinite}
.visor-foto .falhou{position:absolute;inset:0;display:grid;place-items:center;color:#C3CCDC;text-align:center;padding:20px;font-size:14.5px}
.visor-rodape{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:13px;color:var(--muted)}
.visor-rodape a{color:var(--navy);font-weight:600}

.fila-lista .linha{box-shadow:none;border:1px solid var(--line-2)}
.fila-lista .acoes{display:flex;gap:6px}
.fila-lista .erro-txt{color:var(--bad);font-size:12.5px}

.toast{
  position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom) + 22px);z-index:120;
  transform:translate(-50%,16px);opacity:0;pointer-events:none;
  background:var(--navy-ink);color:#fff;padding:12px 18px;border-radius:12px;font-weight:600;font-size:14.5px;
  box-shadow:var(--sh-3);transition:opacity .2s, transform .2s var(--ease);max-width:92vw;text-align:center;
}
.toast.on{opacity:1;transform:translate(-50%,0)}
.toast.ok{background:var(--ok)}
.toast.erro{background:var(--red)}

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

/* =========================================================
   APARELHO COMPARTILHADO (celular)
   ========================================================= */
.linha > svg{width:18px;height:18px;flex:none;color:var(--faint)}   /* setinhas das listas */
.picker-cab{margin-bottom:14px}
.tag-disp{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--navy);background:#E9EEF6;padding:5px 10px 5px 8px;border-radius:999px;margin-bottom:10px}
.tag-disp i{display:grid}
.tag-disp svg{width:14px;height:14px}
.busca-picker{position:sticky;top:calc(env(safe-area-inset-top) + 58px);z-index:5;margin-bottom:6px}
.busca-picker .inp{box-shadow:var(--sh-2);border-color:transparent}
.busca-picker .inp:focus{border-color:var(--navy)}

.pick-sec{font-size:13px;font-weight:600;color:var(--muted);margin:18px 4px 8px}
.pick-grupo{background:var(--surface);border-radius:14px;box-shadow:var(--sh-2);overflow:hidden}
.pick{
  display:flex;align-items:center;gap:14px;width:100%;border:0;background:none;text-align:left;
  padding:13px 16px;border-top:1px solid var(--line-2);transition:background .12s;
}
.pick:first-child{border-top:0}
.pick:hover{background:var(--soft)}
.pick:active{background:#EEF2F8}
.pick-nome{flex:1;min-width:0;font-weight:600;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pick > svg{width:18px;height:18px;flex:none;color:var(--faint)}
.pick-letra{position:relative;font-family:"Archivo";font-weight:800;font-size:12.5px;color:var(--faint);padding:8px 16px 4px;background:var(--soft);border-top:1px solid var(--line-2)}
.pick-grupo > .pick-letra:first-child{border-top:0}
.recente .inicial{background:var(--navy);color:#fff}

.inicial-g{width:48px;height:48px;border-radius:12px 22px 12px 12px;font-size:17px;background:var(--navy);color:#fff}
.quem{
  display:flex;align-items:center;gap:14px;margin-bottom:16px;padding:14px 14px 14px 16px;
  background:var(--surface);border-radius:16px;box-shadow:var(--sh-2);animation:entra .25s var(--ease);
}
.quem-rot{display:block;font-size:12.5px;color:var(--muted);font-weight:600}
.quem-nome{display:block;font-family:"Archivo";font-weight:800;font-size:19px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.quem-trocar{height:40px;padding:0 14px;font-size:14px;flex:none}
.quem-trocar svg{width:16px;height:16px}

/* =========================================================
   PAGINAÇÃO
   ========================================================= */
.paginacao{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:14px 22px;border-top:1px solid var(--line-2)}
.paginacao:empty{display:none}
.pag-info{color:var(--muted);font-size:13.5px}
.pag-nums{display:flex;align-items:center;gap:4px}
.pag-nums button{
  min-width:36px;height:36px;padding:0 10px;border-radius:9px;border:1px solid transparent;background:none;
  font-weight:600;font-size:14px;color:var(--ink);font-variant-numeric:tabular-nums;transition:background .12s, border-color .12s;
}
.pag-nums button:hover:not([disabled]){background:var(--bg)}
.pag-nums button.act{background:var(--navy);color:#fff;border-radius:9px 16px 9px 9px}
.pag-nums button[disabled]{opacity:.35;cursor:default}
.pag-nums button svg{width:16px;height:16px;vertical-align:-3px}
.pag-nums .ret{color:var(--faint);padding:0 4px}
.pag-tam{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13.5px}
.pag-tam select{width:auto;height:36px;font-size:14px;padding-left:10px}
@media (max-width:700px){
  .paginacao{justify-content:center;padding:14px 16px}
  .pag-info{width:100%;text-align:center}
}

/* =========================================================
   SENHA DO APARELHO
   ========================================================= */
.senha-box{margin:4px 0 6px;padding:14px 16px;background:var(--soft);border:1px solid var(--line-2);border-radius:12px}
.senha-rot{display:block;font-size:12.5px;font-weight:600;color:var(--muted);margin-bottom:6px}
.senha-linha{display:flex;align-items:center;gap:8px}
.senha-linha code{flex:1;font-family:"Archivo",monospace;font-weight:700;font-size:20px;letter-spacing:.06em;color:var(--navy);overflow-wrap:anywhere}
.senha-linha .ico-btn + .ico-btn{margin-left:0}
.marcar{display:flex;align-items:flex-start;gap:10px;margin-top:14px;font-size:14px;color:var(--ink);cursor:pointer}
.marcar input{width:18px;height:18px;margin:1px 0 0;accent-color:var(--navy);flex:none}
.quem .cresce{flex:1;min-width:0}

.busca-cab{width:min(340px,100%)}
@media (max-width:700px){ .bloco-cab{flex-wrap:wrap} .busca-cab{width:100%} }

/* =========================================================
   CÂMERA COM MOLDURA
   Padrão: tela em pé (app travado). A moldura fica em pé e os
   textos de lado; quando o motorista vira o celular para a
   esquerda, tudo fica deitado e legível para ele.
   ========================================================= */
.cam.on{display:block;position:fixed;inset:0;z-index:70;background:#000;overflow:hidden}
.cam video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cam-moldura{
  --alt:74dvh;
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  height:var(--alt);width:calc(var(--alt) / 5.2);
  border:2px solid rgba(255,255,255,.95);border-radius:12px;
  box-shadow:0 0 0 200vmax rgba(8,12,22,.6);
}
.cam-num{position:absolute;left:7%;right:7%;bottom:2.5%;height:24%;border:2px dashed rgba(255,255,255,.9);border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.06)}
.cam-num span{position:absolute;left:-30px;top:50%;transform:translateY(-50%) rotate(90deg);color:#fff;font-family:"Archivo";font-weight:800;font-size:15px;text-shadow:0 1px 3px rgba(0,0,0,.6);white-space:nowrap}
.cam-dica{
  position:absolute;left:50%;top:50%;width:74dvh;text-align:center;color:#fff;font-weight:600;font-size:15px;line-height:1.35;
  text-shadow:0 1px 4px rgba(0,0,0,.7);
  transform:translate(-50%,-50%) rotate(90deg) translateY(calc(-1 * (74dvh / 5.2 / 2) - 42px));
}
.cam-dica i{display:inline-grid;vertical-align:-4px;margin-right:8px}
.cam-dica svg{width:20px;height:20px}
.so-paisagem{display:none}
.cam-btn{
  position:absolute;width:52px;height:52px;border-radius:50%;border:0;display:grid;place-items:center;color:#fff;
  background:rgba(20,28,46,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:background .15s, transform .1s;
}
.cam-btn:active{transform:scale(.92)}
.cam-btn i{display:grid;transform:rotate(90deg)}
.cam-btn svg{width:24px;height:24px}
.cam-btn.ligada{background:#fff;color:var(--navy)}
.cam-fechar{top:calc(env(safe-area-inset-top) + 16px);right:16px}
.cam-luz{bottom:calc(env(safe-area-inset-bottom) + 34px);right:26px}
.cam-galeria{bottom:calc(env(safe-area-inset-bottom) + 34px);left:26px}
.cam-disparo{
  position:absolute;left:50%;bottom:calc(env(safe-area-inset-bottom) + 22px);transform:translateX(-50%);
  width:78px;height:78px;border-radius:50%;border:4px solid #fff;background:transparent;padding:5px;
}
.cam-disparo span{display:block;width:100%;height:100%;border-radius:50%;background:#fff;transition:transform .12s}
.cam-disparo:active span{transform:scale(.86)}
.cam-disparo[disabled]{opacity:.5}
.cam-flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}
.cam-flash.dispara{animation:flash .35s ease-out}
@keyframes flash{0%{opacity:.85}100%{opacity:0}}
.cam-aviso{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:10px;color:#fff;background:rgba(20,28,46,.8);padding:12px 16px;border-radius:12px;font-weight:600}

/* tela girou junto com o celular: tudo deitado, sem textos de lado */
@media (orientation:landscape){
  .cam-moldura{width:70vw;height:calc(70vw / 5.2);max-height:58vh}
  .cam-num{left:auto;right:1.5%;top:9%;bottom:9%;width:18%;height:auto}
  .cam-num span{left:50%;top:-26px;transform:translateX(-50%)}
  .cam-dica{width:70vw;transform:translate(-50%,-50%) translateY(calc(-1 * (70vw / 5.2 / 2) - 30px))}
  .so-retrato{display:none}
  .so-paisagem{display:inline}
  .cam-btn i{transform:none}
  .cam-fechar{right:auto;left:calc(env(safe-area-inset-left) + 16px);top:16px}
  .cam-disparo{left:auto;bottom:auto;top:50%;right:calc(env(safe-area-inset-right) + 22px);transform:translateY(-50%)}
  .cam-luz{bottom:auto;top:20px;right:calc(env(safe-area-inset-right) + 34px)}
  .cam-galeria{bottom:20px;left:auto;right:calc(env(safe-area-inset-right) + 34px)}
}

/* =========================================================
   CORTE MANUAL
   ========================================================= */
.corte.on{display:flex;flex-direction:column;height:100vh;height:100dvh;background:#0F1726}
.corte-area{position:relative;flex:1;min-height:0;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}
#corte-img{position:absolute;display:block}
.corte-caixa{position:absolute;border:2px solid #fff;border-radius:4px;box-shadow:0 0 0 9999px rgba(8,12,22,.6);cursor:move;touch-action:none}
.corte-caixa span{position:absolute;width:28px;height:28px;border-radius:50%;background:#fff;border:3px solid var(--navy);box-shadow:0 2px 8px rgba(0,0,0,.45);touch-action:none}
.corte-caixa span[data-h=nw]{left:-15px;top:-15px;cursor:nwse-resize}
.corte-caixa span[data-h=ne]{right:-15px;top:-15px;cursor:nesw-resize}
.corte-caixa span[data-h=sw]{left:-15px;bottom:-15px;cursor:nesw-resize}
.corte-caixa span[data-h=se]{right:-15px;bottom:-15px;cursor:nwse-resize}
.corte-acoes{display:grid;grid-template-columns:auto 1fr 1.4fr;gap:10px;padding:12px 16px calc(env(safe-area-inset-bottom) + 14px);background:var(--surface);box-shadow:0 -6px 18px rgba(0,0,0,.15)}
.corte-acoes .btn{height:50px;padding:0 14px}
.corte-acoes svg{width:18px;height:18px}

/* =========================================================
   CONFERÊNCIA (canhoto recortado)
   ========================================================= */
.cap-frame{height:auto;min-height:110px;padding:10px}
.cap-frame img{width:100%;height:auto;max-height:32vh;object-fit:contain;border-radius:6px}
.cap-ferramentas{display:flex;justify-content:flex-end;gap:4px;margin-top:6px}
.cap-ferramentas .btn-quiet{display:inline-flex;align-items:center;gap:6px}
.cap-ferramentas svg{width:17px;height:17px}
.cap-qualidade{display:flex;gap:10px;align-items:flex-start;margin-top:8px;padding:11px 13px;border-radius:10px;background:var(--warn-bg);color:#7A4705;font-size:14px}
.cap-qualidade svg{width:18px;height:18px;flex:none;margin-top:1px}
.cap-zoom{margin-top:14px;background:var(--surface);border-radius:12px;box-shadow:var(--sh-1);padding:10px 12px;animation:entra .2s var(--ease)}
.cap-zoom span{display:block;font-size:12.5px;font-weight:600;color:var(--muted);margin-bottom:6px}
.cap-zoom img{display:block;width:100%;max-height:170px;object-fit:contain;border-radius:6px;background:#fff}

.cam-aviso.erro{flex-direction:column;align-items:stretch;gap:14px;width:min(340px,86vw);padding:18px;text-align:center;font-weight:500;line-height:1.45}
.cam-aviso.erro .btn{height:46px}

.fila-aviso{margin:0 0 12px;padding:10px 12px;border-radius:10px;background:var(--warn-bg);color:#7A4705;font-size:13.5px}

/* =========================================================
   DIVERGÊNCIA
   ========================================================= */
.diverg{margin-top:12px;background:var(--surface);border:1.5px solid var(--line);border-radius:12px;overflow:hidden;transition:border-color .15s, box-shadow .15s}
.diverg.marcada{border-color:#E7B25C;box-shadow:0 0 0 3px rgba(231,178,92,.18)}
.diverg-abrir{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;padding:13px 14px;font-weight:600;font-size:15px;color:var(--ink);text-align:left}
.diverg-abrir i{display:grid;color:var(--faint)}
.diverg-abrir svg{width:18px;height:18px}
.diverg-abrir span{flex:1}
.diverg-seta{transition:transform .2s var(--ease)}
.diverg.aberta .diverg-seta{transform:rotate(90deg)}
.diverg.marcada .diverg-abrir{color:var(--warn)}
.diverg.marcada .diverg-abrir i:first-child{color:var(--warn)}
.diverg-corpo{padding:0 14px 12px;animation:entra .18s var(--ease)}
.diverg-opcoes{display:flex;flex-wrap:wrap;gap:8px}
.opcao{position:relative;cursor:pointer}
.opcao input{position:absolute;opacity:0;pointer-events:none}
.opcao span{display:inline-flex;align-items:center;height:40px;padding:0 14px;border-radius:999px;border:1.5px solid var(--line);background:var(--surface);font-weight:600;font-size:14px;color:var(--ink);transition:background .12s, border-color .12s, color .12s, transform .1s}
.opcao span:active{transform:scale(.97)}
.opcao input:checked + span{background:var(--warn-bg);border-color:#E7B25C;color:#7A4705}
.opcao input:checked + span::before{content:"✓";margin-right:6px;font-weight:800}
.opcao input:focus-visible + span{outline:2.5px solid #3D6BC4;outline-offset:2px}
.opcional{font-weight:400;color:var(--faint)}
.inp-area{height:auto;min-height:80px;padding:12px 14px;resize:vertical;font-size:15.5px;line-height:1.4}
.diverg-rodape{display:flex;justify-content:space-between;align-items:center;margin-top:6px;font-size:12.5px;color:var(--faint)}

.chip.laranja{background:var(--warn-bg);color:var(--warn)}
.tabela .c-div{max-width:230px}
.tabela .c-div .obs{display:block;font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi-div.tem .kpi-selo{background:var(--warn-bg);color:var(--warn)}
.kpi-div.tem b{color:var(--warn)}
.kpi-div{cursor:pointer}
.resumo{grid-template-columns:repeat(5,1fr)}
@media (max-width:1250px){ .resumo{grid-template-columns:repeat(3,1fr)} }
@media (max-width:1100px){ .resumo{grid-template-columns:repeat(2,1fr)} }
.filtros{grid-template-columns:1.4fr 1fr 1fr 1fr 1fr}
@media (max-width:1250px){ .filtros{grid-template-columns:1fr 1fr 1fr} .filtros > :first-child{grid-column:1/-1} }
@media (max-width:700px){ .filtros{grid-template-columns:1fr} }
.visor-div{display:flex;gap:10px;align-items:flex-start;margin-bottom:12px;padding:11px 13px;border-radius:10px;background:var(--warn-bg);color:#7A4705;font-size:14px}
.visor-div svg{width:18px;height:18px;flex:none;margin-top:1px}
.visor-div b{display:block}
.j-div .opcao span{height:36px;font-size:13.5px}

/* =========================================================
   DESEMPENHO DOS MOTORISTAS
   ========================================================= */
:root{ --n-amarelo:#C99A06; --n-amarelo-bg:#FDF6DB; --n-laranja:#D9670B; --n-laranja-bg:#FDEEDF; --n-vermelho:#B42318; --n-vermelho-bg:#FDECEA; --n-nunca:#5B4FB5; --n-nunca-bg:#EFEDFB; }
.faixa-alertas{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:18px}
.falerta{display:flex;align-items:center;gap:12px;border:0;text-align:left;background:var(--surface);border-radius:14px;padding:14px 16px;box-shadow:var(--sh-2);transition:transform .15s var(--ease), box-shadow .15s}
.falerta:hover{transform:translateY(-2px);box-shadow:var(--sh-3)}
.falerta.ativo{outline:2px solid var(--navy);outline-offset:-2px}
.falerta .ponto{width:12px;height:12px;border-radius:4px 8px 4px 4px;flex:none}
.falerta b{display:block;font-family:"Archivo";font-weight:800;font-size:24px;line-height:1.1;font-variant-numeric:tabular-nums}
.falerta span{font-size:13px;color:var(--muted)}
.falerta.zero b{color:var(--faint)}
.desemp-ferr{display:flex;gap:10px;align-items:center}
.desemp-ferr .busca{width:240px}
.desemp-ferr select{width:auto}
.desemp-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px;padding:6px 22px 22px}
.desemp-grade .vazio{grid-column:1/-1;border-top:0}

.dcard{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 16px 12px 20px;overflow:hidden;animation:aparece .2s var(--ease)}
.dcard::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--line)}
.dcard.n-amarelo::before{background:var(--n-amarelo)} .dcard.n-laranja::before{background:var(--n-laranja)}
.dcard.n-vermelho::before{background:var(--n-vermelho)} .dcard.n-nunca::before{background:var(--n-nunca)}
.dcard.n-ok::before{background:#3AA76D} .dcard.n-desligado{background:var(--soft)} .dcard.n-desligado::before{background:#B8C0CC}
.dcard-cab{display:flex;align-items:flex-start;gap:12px}
.dcard-cab .cresce{flex:1;min-width:0}
.dcard-cab b{display:block;font-size:15.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dcard-cab .meta{display:block;font-size:13px;color:var(--muted);margin-top:1px}
.chip.n-amarelo{background:var(--n-amarelo-bg);color:#8A6A00} .chip.n-laranja{background:var(--n-laranja-bg);color:var(--n-laranja)}
.chip.n-vermelho{background:var(--n-vermelho-bg);color:var(--n-vermelho)} .chip.n-nunca{background:var(--n-nunca-bg);color:var(--n-nunca)}
.chip.n-ok{background:var(--ok-bg);color:var(--ok)} .chip.n-desligado{background:var(--line-2);color:var(--muted)}
.dnums{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:14px 0 10px}
.dnums div{background:var(--soft);border-radius:10px;padding:8px 8px 7px;text-align:center}
.dnums b{display:block;font-family:"Archivo";font-weight:800;font-size:19px;color:var(--navy);font-variant-numeric:tabular-nums;line-height:1.15}
.dnums span{font-size:11.5px;color:var(--muted)}
.dnums .alto b{color:var(--n-laranja)}
.dgraf svg{display:block;width:100%;height:58px}
.dgraf .rot{display:flex;justify-content:space-between;font-size:11px;color:var(--faint);margin-top:2px}
.davisos{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.davisos:empty{display:none}
.dcard-rod{display:flex;align-items:center;justify-content:space-between;margin-top:12px;padding-top:10px;border-top:1px solid var(--line-2)}
.dcard-rod .meta{font-size:12.5px;color:var(--faint)}
/* chave liga/desliga */
.chave{display:inline-flex;align-items:center;gap:9px;cursor:pointer;font-size:13.5px;font-weight:600;color:var(--ink);user-select:none}
.chave input{position:absolute;opacity:0;pointer-events:none}
.chave .trilho{position:relative;width:38px;height:22px;border-radius:999px;background:#C9D0DB;transition:background .15s;flex:none}
.chave .trilho::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .18s var(--ease)}
.chave input:checked + .trilho{background:var(--navy)}
.chave input:checked + .trilho::after{transform:translateX(16px)}
.chave input:focus-visible + .trilho{outline:2.5px solid #3D6BC4;outline-offset:2px}
.kpi-mot{cursor:pointer}
.kpi-mot.n-amarelo .kpi-selo{background:var(--n-amarelo-bg);color:#8A6A00} .kpi-mot.n-amarelo b{color:#8A6A00}
.kpi-mot.n-laranja .kpi-selo{background:var(--n-laranja-bg);color:var(--n-laranja)} .kpi-mot.n-laranja b{color:var(--n-laranja)}
.kpi-mot.n-vermelho .kpi-selo{background:var(--n-vermelho-bg);color:var(--n-vermelho)} .kpi-mot.n-vermelho b{color:var(--n-vermelho)}
.kpi-mot.n-nunca .kpi-selo{background:var(--n-nunca-bg);color:var(--n-nunca)} .kpi-mot.n-nunca b{color:var(--n-nunca)}
@media (max-width:1250px){ .faixa-alertas{grid-template-columns:repeat(3,1fr)} }
@media (max-width:900px){ .faixa-alertas{grid-template-columns:repeat(2,1fr)} .desemp-ferr{width:100%} .desemp-ferr .busca{flex:1;width:auto} .desemp-grade{padding:6px 16px 16px} }
@media (max-width:700px){ .desemp-grade{grid-template-columns:1fr} }
.dnums{grid-template-columns:repeat(4,minmax(0,1fr))}
.dnums span{display:block;line-height:1.25}
@media (max-width:700px){
  .desemp-ferr{flex-direction:column;align-items:stretch}
  .desemp-ferr .busca,.desemp-ferr select{width:100%}
  .dcard-cab{flex-wrap:wrap}
  .dcard-cab .cresce{min-width:calc(100% - 60px)}
  .dcard-cab .chip{margin-left:48px}
  .dnums span{font-size:11px}
}

/* =========================================================
   ATUALIZAÇÃO AUTOMÁTICA
   ========================================================= */
.sino{position:relative;width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:var(--surface);display:inline-grid;place-items:center;color:var(--navy);flex:none}
.sino svg{width:19px;height:19px}
.sino .sino-ponto{position:absolute;top:6px;right:7px;width:9px;height:9px;border-radius:50%;background:var(--red);box-shadow:0 0 0 2px var(--surface);display:none}
.sino.tem .sino-ponto{display:block}
.sino.tem svg{animation:balanca 1.6s ease-in-out infinite;transform-origin:50% 10%}
@keyframes balanca{0%,60%,100%{transform:rotate(0)}10%{transform:rotate(14deg)}20%{transform:rotate(-12deg)}30%{transform:rotate(8deg)}40%{transform:rotate(-5deg)}}
.adm-top-dir{display:flex;align-items:center;gap:8px}
.versao-login{text-align:center;color:var(--faint);font-size:12px;margin:18px 0 0}
.atualizando{position:fixed;inset:0;z-index:300;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;animation:aparece .2s}
.atualizando img{width:84px;animation:respira 1.4s ease-in-out infinite;margin-bottom:6px}
.atualizando b{font-family:"Archivo";font-weight:800;font-size:20px;color:var(--navy)}
.atualizando span{color:var(--muted);font-size:14px}
.atualizando .spin{color:var(--navy);width:20px;height:20px;margin-top:6px}
.c-tipo{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.chave-p{font-size:12.5px;font-weight:600}
.chave-p .trilho{width:32px;height:18px}
.chave-p .trilho::after{width:12px;height:12px;top:3px;left:3px}
.chave-p input:checked + .trilho::after{transform:translateX(14px)}
.app-modelo{display:block;font-size:12px;color:var(--muted);margin-top:3px;max-width:170px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dleitura{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:12.5px;color:var(--muted)}
.dleitura .barra{flex:1;height:7px;border-radius:999px;background:var(--line-2);overflow:hidden}
.dleitura .barra i{display:block;height:100%;border-radius:999px;background:#3AA76D}
.dleitura.media .barra i{background:var(--n-amarelo)} .dleitura.baixa .barra i{background:var(--n-vermelho)}
.dleitura b{font-family:"Archivo";font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}

/* =========================================================
   CÂMERA 2: moldura menor, nitidez ao vivo, foco e calibração
   ========================================================= */
.cam{--alt:62dvh}
.cam-moldura{--alt:62dvh;transition:border-color .2s, box-shadow .2s}
.cam-moldura.nitida{border-color:#3BD17F;box-shadow:0 0 0 200vmax rgba(8,12,22,.6), 0 0 0 3px rgba(59,209,127,.35)}
.cam-moldura.borrada{border-color:#F2B44B}
.cam-dica{width:var(--alt);transform:translate(-50%,-50%) rotate(90deg) translateY(calc(-1 * (var(--alt) / 5.2 / 2) - 42px))}
.cam-status{position:absolute;left:50%;top:50%;width:var(--alt);display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none;
  transform:translate(-50%,-50%) rotate(90deg) translateY(calc(var(--alt) / 5.2 / 2 + 44px))}
.cam-status > *{pointer-events:auto}
.cam-foco{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:999px;background:rgba(20,28,46,.72);color:#FFD891;font-weight:600;font-size:13.5px}
.cam-foco.ok{color:#7BE3A8}
.cam-foco svg{width:16px;height:16px}
.cam-foco .spin{width:12px;height:12px}
.cam-luz-dica{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:0;background:#FFD891;color:#4A3200;font-weight:700;font-size:13.5px}
.cam-luz-dica[disabled]{background:rgba(20,28,46,.72);color:#FFD891}
.cam-luz-dica svg{width:16px;height:16px}
.cam-anel{position:fixed;width:74px;height:74px;margin:-37px 0 0 -37px;border:2px solid #FFD891;border-radius:50%;pointer-events:none;opacity:0;z-index:5}
.cam-anel.mostra{animation:anel .9s var(--ease)}
@keyframes anel{0%{opacity:1;transform:scale(1.4)}40%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1)}}
.cal-painel{position:absolute;left:50%;top:50%;width:min(300px,calc(var(--alt) * .8));z-index:6;background:var(--surface);border-radius:16px;padding:16px;box-shadow:var(--sh-3);
  display:flex;flex-direction:column;gap:8px;transform:translate(-50%,-50%) rotate(90deg) translateY(calc(var(--alt) / 5.2 / 2 + 110px))}
.cal-painel b{font-family:"Archivo";font-weight:800;font-size:17px;color:var(--navy)}
.cal-painel span{font-size:13.5px;color:var(--muted);line-height:1.4}
.cal-barra{height:8px;border-radius:999px;background:var(--line-2);overflow:hidden;margin-top:4px}
.cal-barra i{display:block;height:100%;width:0;border-radius:999px;background:var(--navy);transition:width .4s var(--ease)}
.cal-acoes{display:flex;gap:8px;justify-content:flex-end;margin-top:4px}
.cal-acoes .btn{height:40px;padding:0 14px;font-size:14px}
.cam.calibrando .cam-disparo,.cam.calibrando .cam-galeria,.cam.calibrando .cam-status{display:none}
@media (orientation:landscape){
  .cam{--alt:60vw}
  .cam-moldura{width:60vw;height:calc(60vw / 5.2);max-height:52vh}
  .cam-dica{width:60vw;transform:translate(-50%,-50%) translateY(calc(-1 * (60vw / 5.2 / 2) - 30px))}
  .cam-status{width:60vw;transform:translate(-50%,-50%) translateY(calc(60vw / 5.2 / 2 + 34px))}
  .cal-painel{width:300px;transform:translate(-50%,-50%) translateY(calc(60vw / 5.2 / 2 + 110px))}
}
/* sugestão de número na conferência */
.cap-sugestao{display:flex;align-items:center;gap:10px;width:100%;margin-top:10px;padding:12px 14px;border-radius:12px;border:1.5px dashed #E7B25C;background:var(--warn-bg);color:#7A4705;text-align:left;font-size:14px}
.cap-sugestao .nf{font-size:20px;color:var(--navy)}
.cap-sugestao .usar{margin-left:auto;font-weight:700;color:var(--navy);white-space:nowrap}
/* cartão de ajuste da câmera na tela inicial */
.cal-card{display:flex;align-items:center;gap:12px;width:100%;margin-top:12px;border:0;text-align:left;background:none;padding:8px 4px;color:var(--muted);font-size:14px}
.cal-card svg{width:20px;height:20px;flex:none}
.cal-card .cresce{flex:1;min-width:0}
.cal-card b{display:block;font-size:14.5px}
.cal-card .acao{font-weight:700;color:var(--navy);white-space:nowrap}
.cal-card.destaque{background:var(--warn-bg);border:1px solid #F0D9B0;border-radius:14px;padding:13px 14px;color:#7A4705;box-shadow:var(--sh-1)}
.cal-card.destaque b{color:#7A4705}
.cal-card.ok svg{color:var(--ok)}
.tabela .chip.conf{display:table;margin-top:4px;font-size:11.5px}
.j-conf{display:flex;gap:10px;align-items:flex-start;margin-bottom:6px;padding:11px 13px;border-radius:10px;background:var(--bad-bg);color:#7E1716;font-size:14px}
.j-conf svg{width:18px;height:18px;flex:none;margin-top:2px}
.j-conf .nf{color:#7E1716;font-size:16px}
.j-conf .link-btn{display:inline;margin:0 0 0 6px;color:#7E1716}
.filtros{grid-template-columns:1.3fr repeat(5,1fr)}
@media (max-width:1400px){ .filtros{grid-template-columns:1fr 1fr 1fr} .filtros > :first-child{grid-column:1/-1} }
@media (max-width:700px){ .filtros{grid-template-columns:1fr} }
/* painel da calibração compacto: cabe ao lado da moldura (com o celular deitado fica embaixo dela) */
.cal-painel{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"titulo acoes" "texto acoes" "barra barra";
  gap:3px 12px;align-items:center;padding:11px 14px;width:calc(var(--alt) * .92);max-height:126px;
  transform:translate(-50%,-50%) rotate(90deg) translateY(calc(var(--alt) / 5.2 / 2 + 72px))}
.cal-painel b{grid-area:titulo;font-size:16px}
.cal-painel > span{grid-area:texto;font-size:12.5px;line-height:1.35}
.cal-barra{grid-area:barra;margin-top:6px}
.cal-acoes{grid-area:acoes;margin:0}
.cal-acoes .btn{height:38px}
@media (orientation:landscape){
  .cal-painel{width:min(560px,70vw);transform:translate(-50%,-50%) translateY(calc(60vw / 5.2 / 2 + 80px))}
}

/* =========================================================
   CONFERÊNCIA DE CANHOTOS
   ========================================================= */
.conf-ind{display:grid;grid-template-columns:repeat(4,1fr) 1.3fr;gap:12px;margin-bottom:18px}
.cind{display:flex;align-items:center;gap:12px;border:0;text-align:left;background:var(--surface);border-radius:14px;padding:14px 16px;box-shadow:var(--sh-2);transition:transform .15s var(--ease), box-shadow .15s}
.cind:hover{transform:translateY(-2px);box-shadow:var(--sh-3)}
.cind.ativo{outline:2px solid var(--navy);outline-offset:-2px}
.cind .ponto{width:12px;height:12px;border-radius:4px 8px 4px 4px;flex:none}
.cind b{display:block;font-family:"Archivo";font-weight:800;font-size:24px;line-height:1.1;font-variant-numeric:tabular-nums}
.cind span{font-size:13px;color:var(--muted)}
.cind.amostra{cursor:default}
.cind.amostra:hover{transform:none;box-shadow:var(--sh-2)}
.cind .barra{height:7px;border-radius:999px;background:var(--line-2);overflow:hidden;margin-top:6px}
.cind .barra i{display:block;height:100%;background:#3AA76D}
.conf-acoes{display:flex;gap:8px}
.conf-acoes .btn{height:40px;font-size:14px;padding:0 14px}
.filtros-conf{grid-template-columns:1.2fr repeat(6,1fr)}
@media (max-width:1400px){ .filtros-conf{grid-template-columns:1fr 1fr 1fr} .filtros-conf > :first-child{grid-column:1/-1} }
@media (max-width:1250px){ .conf-ind{grid-template-columns:repeat(2,1fr)} .conf-ind .amostra{grid-column:1/-1} }
@media (max-width:700px){ .filtros-conf{grid-template-columns:1fr} .conf-acoes{width:100%} .conf-acoes .btn{flex:1} }
.chip.info{background:#E6EEFB;color:#2752A6}
.cmp{font-family:"Archivo";font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.cmp .g{color:var(--muted);font-weight:600}
.cmp mark,.rev-num mark{background:#FDE2E1;color:var(--bad);border-radius:3px;padding:0 1px}
.tabela tbody tr.clicavel{cursor:pointer}

/* tela de análise */
.revisao{position:fixed;inset:0;z-index:95;background:rgba(21,33,58,.5);display:grid;place-items:center;padding:20px;animation:aparece .15s}
.rev-caixa{width:min(1100px,100%);max-height:94vh;overflow:auto;background:var(--surface);border-radius:18px;box-shadow:var(--sh-3);animation:modal .2s var(--ease)}
.rev-cab{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--line-2)}
.rev-cab b{font-family:"Archivo";font-weight:800;font-size:18px;display:block}
.rev-cab span{font-size:13px;color:var(--muted)}
.rev-corpo{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:22px;padding:20px}
.rev-foto{display:flex;flex-direction:column;gap:10px}
.rev-zoom{position:relative;width:100%;aspect-ratio:1.35/1;border-radius:12px;background:#101828 no-repeat;background-size:385% auto;background-position:100% 50%;overflow:hidden}
.rev-zoom .sk-escuro{position:absolute;inset:0;background:linear-gradient(90deg,#141E31 0%,#1C2944 50%,#141E31 100%);background-size:200% 100%;animation:sk 1.2s linear infinite}
.rev-zoom .sem{position:absolute;inset:0;display:grid;place-items:center;color:#C3CCDC;font-size:14px;text-align:center;padding:20px}
.rev-inteira{width:100%;border-radius:12px;background:#101828;max-height:52vh;object-fit:contain}
.rev-foto-acoes{display:flex;justify-content:space-between;align-items:center;font-size:13.5px}
.rev-foto-acoes a{color:var(--navy);font-weight:600}
.rev-dados{display:flex;flex-direction:column;gap:12px}
.rev-dados > .chip{align-self:flex-start}
.rev-num{background:var(--soft);border:1px solid var(--line-2);border-radius:12px;padding:12px 14px}
.rev-num span{display:block;font-size:12.5px;font-weight:600;color:var(--muted)}
.rev-num b{display:block;font-size:30px;color:var(--navy);line-height:1.2}
.rev-num.rev-g b{font-size:24px;color:var(--ink)}
.rev-meta{display:grid;grid-template-columns:auto 1fr;gap:5px 12px;margin:0;font-size:13.5px}
.rev-meta dt{color:var(--muted)}
.rev-meta dd{margin:0;font-weight:600}
.rev-linha{display:flex;gap:8px}
.rev-linha .nf-inp{height:52px;font-size:24px}
.rev-linha .btn{height:52px}
.rev-botoes{display:flex;flex-direction:column;gap:8px}
.rev-botoes .btn{justify-content:space-between;height:46px}
.rev-botoes kbd{font-family:inherit;font-size:11.5px;font-weight:700;padding:2px 7px;border-radius:6px;background:rgba(0,0,0,.08);color:inherit;opacity:.8}
.btn-ok{background:var(--ok);color:#fff;box-shadow:0 8px 18px -8px rgba(30,127,79,.7)}
.btn-ok:hover{background:#18704A}
.rev-nav{display:flex;justify-content:space-between;gap:8px;margin-top:auto}
.rev-nav .btn{height:40px;font-size:14px;flex:1}
@media (max-width:860px){ .rev-corpo{grid-template-columns:1fr} }
.filtros-conf{grid-template-columns:1.3fr 1fr 1fr 1fr}
@media (max-width:1100px){ .filtros-conf{grid-template-columns:1fr 1fr} .filtros-conf > :first-child{grid-column:1/-1} }
@media (max-width:700px){ .filtros-conf{grid-template-columns:1fr} }

/* =========================================================
   VERSÃO 3.0
   ========================================================= */
/* filtro de motoristas com seleção múltipla (como filtro de planilha) */
.multi{position:relative}
.multi-btn{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;height:42px;padding:0 12px;border:1.5px solid var(--line);border-radius:10px;background:var(--surface);font-size:14.5px;color:var(--ink);text-align:left}
.multi-btn span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.multi-btn svg{width:14px;height:14px;transform:rotate(90deg);color:var(--faint);flex:none}
.multi.filtrado .multi-btn{border-color:var(--navy);background:#F3F6FC;font-weight:600}
.multi-painel{position:absolute;z-index:40;top:calc(100% + 6px);left:0;width:max(100%,290px);background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh-3);padding:10px;display:flex;flex-direction:column;gap:8px;animation:aparece .12s}
.multi-painel .inp{height:38px}
.multi-lista{max-height:260px;overflow:auto;display:flex;flex-direction:column;border-top:1px solid var(--line-2);padding-top:6px}
.multi-item{display:flex;align-items:center;gap:10px;padding:7px 6px;border-radius:8px;font-size:14px;cursor:pointer}
.multi-item:hover{background:var(--soft)}
.multi-item input{width:17px;height:17px;accent-color:var(--navy);flex:none}
.multi-item.todos{font-weight:700}
.multi-item small{margin-left:auto;color:var(--faint);font-size:12px}
.multi-acoes{display:flex;gap:8px;justify-content:flex-end;border-top:1px solid var(--line-2);padding-top:8px}
.multi-acoes .btn{height:36px;padding:0 14px;font-size:13.5px}
/* período início/fim */
.periodo{display:flex;gap:8px}
.periodo label{flex:1;display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);white-space:nowrap}
.periodo .inp{flex:1;min-width:0}
/* linhas por página, no alto à direita */
.tabela-topo{display:flex;justify-content:flex-end;align-items:center;padding:0 22px 10px}
.tabela-topo .linhas{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.tabela-topo select{width:auto;height:34px}
.paginacao .pag-tam{display:none}
/* exportar */
.bloco-cab{gap:12px}
.btn-exportar{height:40px;font-size:14px;padding:0 14px}
.btn-exportar i{display:grid}
.btn-exportar svg{width:17px;height:17px}
/* celular compartilhado */
.painel-disp-info{margin-top:18px}
.disp-cel{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin-top:10px}
.disp-cel div{background:var(--soft);border-radius:10px;padding:10px 12px}
.disp-cel span{display:block;font-size:12.5px;color:var(--muted)}
.disp-cel b{display:block;font-size:15px;margin-top:2px}
/* texto lido pelo Google */
.rev-g .link-btn{display:inline-block;margin-top:6px;font-size:13px}
.texto-google{max-height:50vh;overflow:auto;white-space:pre-wrap;font:13px/1.5 ui-monospace,Menlo,Consolas,monospace;background:var(--soft);border:1px solid var(--line-2);border-radius:10px;padding:12px;margin:0}
.texto-google mark{border-radius:3px;padding:0 2px}
.texto-google mark.lanc{background:#DDF3E6;color:#14532D}
.texto-google mark.goog{background:#FDE2E1;color:var(--bad)}
.legenda-texto{display:flex;gap:14px;font-size:12.5px;color:var(--muted);margin:0 0 8px}
.legenda-texto i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
/* espaço do Drive (no sino do admin) */
.espaco{display:flex;flex-direction:column;gap:8px;padding:12px 14px;border:1px solid var(--line-2);border-radius:12px;background:var(--soft);margin-bottom:14px}
.espaco h3{margin:0;font-family:"Archivo";font-weight:800;font-size:15px;color:var(--navy)}
.espaco .barra{height:10px;border-radius:999px;background:var(--line);overflow:hidden}
.espaco .barra i{display:block;height:100%;border-radius:999px;background:#3AA76D;transition:width .4s var(--ease)}
.espaco.atencao .barra i{background:var(--n-amarelo)} .espaco.critico .barra i{background:var(--n-vermelho)}
.espaco .linha{display:flex;justify-content:space-between;gap:10px;font-size:13.5px}
.espaco .linha b{font-variant-numeric:tabular-nums}
.espaco .grande{font-size:15px}
.espaco .nota{font-size:12.5px;color:var(--muted)}
.espaco .aviso-lixeira{font-size:12.5px;color:#7A4705;background:var(--warn-bg);border-radius:8px;padding:6px 9px}
.versao-bloco{font-size:14px}

/* =========================================================
   VERSÃO 3.1
   ========================================================= */
.chip.cte{background:#EFE7FA;color:#6B3FA0}
.rev-g-acoes{display:flex;gap:14px;flex-wrap:wrap;margin-top:6px}
.rev-g-acoes .link-btn{margin:0;font-size:13px}
.rev-g-acoes .spin{width:12px;height:12px;vertical-align:-2px}
.rev-cte{display:flex;flex-direction:column;gap:6px;padding:12px 14px;border-radius:12px;background:#F5F0FC;border:1px solid #DCCDF1;color:#4A2A75;font-size:13.5px}
.rev-cte b{font-size:15px}
.rev-cte-botoes{display:flex;gap:8px;margin-top:4px;flex-wrap:wrap}
.rev-cte-botoes .btn{height:40px;font-size:14px;padding:0 14px}
.btn-perigo{background:var(--bad);color:#fff}
.btn-perigo:hover{background:#8F1414}
.espaco-cab{display:flex;justify-content:space-between;align-items:center;gap:10px}
.btn-medir{height:32px;padding:0 12px;font-size:13px}
.btn-medir .spin{width:12px;height:12px}
.tabela-aparelhos td b{display:block}
/* aviso de CT-e para o motorista, na conferência */
.cap-cte{display:flex;flex-direction:column;gap:8px;margin-top:10px;padding:12px 14px;border-radius:12px;background:#F5F0FC;border:1.5px solid #CDB8EC;color:#4A2A75}
.cap-cte b{font-size:15px}
.cap-cte span{font-size:13.5px}
.cap-cte .btn{height:42px;font-size:14px}
/* sair do modo compartilhado */
.sair-aparelho{display:block;margin:22px auto 6px;color:var(--muted);font-size:13.5px}