:root{--bg:#14212B;--surface:#1B2C38;--ink:#EEF2F4;--muted:#9AA9B4;--line:#2D4150;--brand:#D4900F;--brand-ink:#14212B;--red:#FF8B82;--red-bg:#40181A;--green:#6FD394;--green-bg:#12331F;--amber:#F0B04A;--amber-bg:#3A2A0C;--blue-bg:#22384A;color-scheme:dark;
--fonte:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.4 var(--fonte);padding-inline:max(16px,env(safe-area-inset-left,0px)) max(16px,env(safe-area-inset-right,0px))}
.wrap{max-width:560px;margin:0 auto;padding-block:16px 120px}
.wrap.larga{max-width:1000px}
h1{font-size:1.45rem;margin:0;text-transform:uppercase;letter-spacing:.03em;line-height:1.1}
h2{font-size:1.15rem;margin:22px 0 8px}
h3{font-size:1.05rem;margin:0}
small,.muted{color:var(--muted);font-size:.88rem}
small.bloco{display:block}
.num{font-variant-numeric:tabular-nums}
.card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-top:10px;min-width:0}
.card.pad{padding:16px}
a{color:var(--brand)}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
label{display:block;font-size:.78rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);margin:12px 0 4px}
input[type=text],input[type=password],input[type=date],input[type=search],select{width:100%;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:8px;padding:10px 12px;font:inherit;min-height:46px}
input.codigo{font-size:1.5rem;letter-spacing:.3em;text-align:center}
.btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--brand);background:var(--brand);color:var(--brand-ink);border-radius:8px;padding:10px 16px;font:inherit;font-weight:600;cursor:pointer;min-height:44px;text-decoration:none}
.btn.sec{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.small{min-height:40px;padding:6px 14px;background:transparent;color:var(--brand)}
.btn.mudo{color:var(--muted);border-color:var(--line)}
.btn.bloco{width:100%;margin-top:16px}
.erro,.aviso,.ok{padding:10px 12px;border-radius:8px;margin-top:12px}
.erro{background:var(--red-bg);color:var(--red)}.aviso{background:var(--amber-bg);color:var(--amber)}.ok{background:var(--green-bg);color:var(--green)}
.topo{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}
.topo form{margin:0}
.linha{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.linha>div:first-child{flex:1;min-width:0}
.linha small{display:block;overflow-wrap:anywhere}
.val{font-size:1.25rem;font-weight:600;text-align:right;white-space:nowrap;flex:none}
.rodape{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.rodape form{margin:0}
.pill{display:inline-block;font-size:.78rem;font-weight:600;padding:2px 9px;border-radius:99px;white-space:nowrap}
.pill.late{background:var(--red-bg);color:var(--red)}.pill.soon{background:var(--amber-bg);color:var(--amber)}.pill.later{background:var(--blue-bg);color:var(--brand)}.pill.done{background:var(--green-bg);color:var(--green)}
small.inline{display:inline}
.placa{font-family:ui-monospace,Menlo,monospace;font-size:.8rem;border:1px solid var(--line);border-radius:4px;padding:0 5px;background:var(--bg)}
.hero{background:var(--brand);color:var(--brand-ink);border-radius:12px;padding:16px;margin-top:10px}
.hero small{color:inherit;opacity:.85;text-transform:uppercase;letter-spacing:.07em;font-size:.75rem;display:block}
.hero b{display:block;font-size:2.3rem;line-height:1.15}
.hero .sub{display:flex;gap:24px;margin-top:10px;padding-top:10px;border-top:1px solid rgba(20,33,43,.3)}
.hero .sub b{font-size:1.35rem}
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin:12px 0}
.chip{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:99px;padding:8px 14px;white-space:nowrap;text-decoration:none;min-height:40px;display:inline-flex;align-items:center}
.chip.on{background:var(--brand);color:var(--brand-ink);border-color:var(--brand);font-weight:600}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px}
.cal .dow{font-size:.7rem;text-transform:uppercase;color:var(--muted);text-align:center;padding-bottom:2px}
.dia{height:46px;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none;color:var(--ink);font-weight:600;font-size:.9rem}
.dia.fora{opacity:.35}.dia.hoje{box-shadow:inset 0 0 0 2px var(--brand)}.dia.sel{background:var(--blue-bg)}
.pontos{display:flex;gap:3px;height:7px}
.ponto{width:7px;height:7px;border-radius:50%;display:inline-block}
.ponto.late{background:var(--red)}.ponto.soon{background:var(--amber)}.ponto.later{background:var(--brand)}.ponto.done{background:var(--green)}
.calcab{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.calcab a{width:44px;height:44px;border:1px solid var(--line);background:var(--surface);border-radius:8px;display:flex;align-items:center;justify-content:center;text-decoration:none;font-size:1.3rem}
.calcab h3{text-transform:capitalize}
.legenda{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:.75rem;color:var(--muted);margin:8px 0}
.legenda .ponto{margin-right:4px}
.acao{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:12px;cursor:pointer;min-height:72px;text-decoration:none;font:inherit}
.acao.main{background:var(--brand);color:var(--brand-ink);border-color:var(--brand)}
.acao b{display:block;font-size:1.1rem}.acao span{font-size:.9rem;opacity:.85}
.acao input[type=file]{position:absolute;width:1px;height:1px;opacity:0}
.espelho{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px}
.field{min-width:0}.field.wide{grid-column:1/-1}
.field.found input,.field.found select{border-color:var(--green);background:var(--green-bg)}
.field.check input,.field.check select{border-color:var(--amber);background:var(--amber-bg)}
.marca{display:flex;align-items:center;gap:10px;margin:14px 0 0;grid-column:1/-1}
.marca input{width:22px;height:22px}
.marca label{margin:0;text-transform:none;letter-spacing:0;font-size:1rem;color:var(--ink)}
.resumo{margin-top:14px;padding:12px;background:var(--surface);border:1px solid var(--line);border-radius:10px;display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px}
.resumo small{display:block;text-transform:uppercase;letter-spacing:.06em;font-size:.72rem}
.resumo b{font-size:1.25rem}
.rolagem{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:.92rem}
th{font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);text-align:left;padding:8px 6px}
td{padding:8px 6px;border-top:1px solid var(--line);vertical-align:top}
td.d,th.d{text-align:right}
.rolagem table{min-width:760px}
.cte input{min-width:90px;padding:6px 8px;min-height:38px}
.acoes{position:sticky;bottom:calc(76px + env(safe-area-inset-bottom,0px));display:flex;gap:10px;padding:10px 0;background:var(--bg);margin-top:12px}
.acoes .btn.primary,.acoes .btn.main{flex:1}
dl.det{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0;font-size:.95rem}
dl.det dt{color:var(--muted)}dl.det dd{margin:0;text-align:right;overflow-wrap:anywhere}
.nav{position:fixed;left:0;right:0;bottom:0;background:var(--surface);border-top:1px solid var(--line);z-index:5;padding:6px max(8px,env(safe-area-inset-right,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px))}
.nav .links{max-width:560px;margin:0 auto;display:grid;grid-template-columns:repeat(6,1fr);gap:2px;align-items:end}
.nav a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 0;color:var(--muted);font-size:.75rem;text-decoration:none;min-height:54px}
.nav a svg{width:24px;height:24px}
.nav a.on{color:var(--brand);font-weight:600}
.nav a.mais i{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--brand);color:var(--brand-ink);margin-top:-18px;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.nav a.mais{color:var(--muted)}.nav a.mais.on{color:var(--brand)}
.grade{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.k small{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em}.k b{font-size:1.7rem}
.qr{display:block;margin:12px auto;width:220px;max-width:100%;background:#fff;padding:8px;border-radius:8px}
code.seg{display:block;word-break:break-all;background:var(--bg);padding:8px;border-radius:6px}
ul.codigos{list-style:none;padding:0;margin:12px 0;display:grid;grid-template-columns:1fr 1fr;gap:6px;font-family:ui-monospace,Menlo,monospace}
ul.codigos li{background:var(--bg);padding:8px;border-radius:6px;text-align:center}
.vazio{color:var(--muted);text-align:center;padding:24px 0}
.inline-form{display:inline}
a.linkcard{display:block;color:inherit;text-decoration:none}
.acao.espaco{margin-top:14px}
.js .semjs{display:none}
.acoes2{display:flex;gap:10px;margin:10px 0}.btn.perigo{color:var(--red);border-color:var(--red)}.btn.perigo.cheio{background:var(--red);color:#14212B}
.linha.prot{padding:6px 0;align-items:center}.linha.prot+.linha.prot{border-top:1px solid var(--line)}
figure.foto{margin:12px 0;padding:0}.foto img{display:block;width:100%;max-height:60vh;object-fit:contain;background:#000;border-radius:8px}.foto figcaption{margin-top:6px;font-size:.88rem}.marca.conferi{background:var(--amber-bg);border-radius:8px;padding:12px;margin-top:12px}
.demo{background:var(--amber-bg);color:var(--amber);text-align:center;font-size:.8rem;font-weight:600;padding:6px 10px;margin-inline:calc(-1 * max(16px,env(safe-area-inset-left,0px)))}
.aviso-card{background:var(--amber-bg);border-color:transparent}.aviso-card b{color:var(--amber)}
label.acao{text-transform:none;letter-spacing:0;font-size:1rem;color:var(--ink);margin:0 0 12px}label.acao.main{color:var(--brand-ink)}
.logo{display:block}.logo img{display:block;width:100%;max-width:300px;height:auto}.logo.pequeno img{max-width:190px}.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.card .acoes{background:var(--surface)}
td.d,th.d{white-space:nowrap}
textarea{width:100%;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:8px;padding:10px 12px;font:inherit}
.docs{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:10px}.doc{display:flex;flex-direction:column;gap:3px}.doc a.pill{text-decoration:none}
.erro-txt{color:var(--red)}
.rolagem table.compacta{min-width:0}

/* ---------- computador: menu lateral, colunas e tabelas ---------- */
.nav .marca-nav,.marca-nav,.nav-usuario,.so-desktop{display:none}
.wrap.login{margin-inline:auto}
@media (min-width:900px){
  .so-celular{display:none!important}
  .so-desktop{display:block}
  table.so-desktop{display:table}
  body.com-menu{padding-left:calc(256px + 28px);padding-right:28px}
  .wrap{max-width:1240px;margin-left:0;padding-block:28px 56px}
  body:not(.com-menu) .wrap{margin-inline:auto}
  .wrap.estreita{max-width:680px}.wrap.login{max-width:460px;margin-top:8vh}
  .nav{top:0;bottom:0;right:auto;width:256px;border-top:0;border-right:1px solid var(--line);padding:22px 16px;display:flex;flex-direction:column}
  .nav .links{display:flex;flex-direction:column;gap:4px;max-width:none;margin:0}
  .nav a{flex-direction:row;justify-content:flex-start;gap:12px;padding:10px 14px;border-radius:8px;min-height:44px;font-size:.95rem}
  .nav .links a:hover,.nav .links a.on{background:var(--blue-bg)}
  .nav a.mais{order:-1;background:var(--brand);color:var(--brand-ink);font-weight:700;margin-bottom:12px}
  .nav a.mais:hover,.nav a.mais.on{background:var(--brand);color:var(--brand-ink);filter:brightness(1.08)}
  .nav a.mais i{display:inline-flex;width:auto;height:auto;margin:0;background:none;box-shadow:none;color:inherit}
  .nav .marca-nav{display:block;padding:4px 6px 22px}.nav .marca-nav:hover{background:none}.nav .marca-nav img{width:100%;max-width:210px;height:auto;display:block}
  .nav .nav-usuario{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding:14px 6px 0;border-top:1px solid var(--line);font-size:.88rem;color:var(--muted)}
  .nav .nav-usuario form{margin:0}.nav .nav-usuario b{color:var(--ink)}
  .topo-mobile{display:none}
  .grade-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:14px;align-items:start}
  .grade-cards>.card,.grade-cards>a.card{margin-top:0}
  .inicio-grade{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:32px;align-items:start}
  .duas-col{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
  .hero{display:flex;align-items:center;justify-content:space-between;gap:36px;padding:24px 32px}
  .hero b{font-size:3rem}.hero .sub{border-top:0;margin:0;padding:0;gap:48px}.hero .sub b{font-size:1.7rem}
  .dia{height:64px}
  .espelho{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px 14px}.field.wide{grid-column:span 2}
  .duas-colunas{display:grid;grid-template-columns:minmax(320px,440px) minmax(0,1fr);gap:32px;align-items:start}
  .duas-colunas figure.foto{position:sticky;top:24px;margin-top:0}
  .acoes{bottom:0;margin-inline:-4px}
  .resumo{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
  h1{font-size:1.9rem}h2{font-size:1.3rem}
  .tabela-lista td,.tabela-lista th{padding:11px 10px}.tabela-lista tr:hover td{background:rgba(255,255,255,.03)}
  .tabela-lista .acao-col{text-align:right;white-space:nowrap}
}
@media (min-width:900px){.wrap.larga{max-width:1240px}}
@media (min-width:900px){.nav .links{align-items:stretch}}
@media (min-width:900px){.contrato-grade{grid-template-columns:minmax(0,520px) minmax(0,1fr)}.topo-h2{margin-top:0}}
@media (min-width:900px){.lista-falta{columns:3;column-gap:28px;margin-top:6px}.lista-falta small{break-inside:avoid}}

/* relatórios */
.relatorio .rel-cab{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.5rem}
.relatorio tr.grupo td{background:var(--surface-2,rgba(255,255,255,.06))}
.relatorio tr.sub td,.relatorio tr.total td{border-top:1px solid currentColor}
@media print{
  body{background:#fff!important;color:#000!important}
  .nav,.nao-imprimir,.flash,footer{display:none!important}
  .card,.relatorio{background:#fff!important;color:#000!important;box-shadow:none!important;border:0!important}
  .relatorio *{color:#000!important;background:transparent!important}
  .relatorio tr.grupo td{background:#eee!important}
  main,.conteudo,.wrap{max-width:none!important;margin:0!important;padding:0!important}
  .relatorio .rolagem{overflow:visible!important}
}
/* acerto de viagem */
.tab-form{width:100%;border-collapse:collapse}
.tab-form td,.tab-form th{padding:3px 4px}
.tab-form input,.tab-form select{width:100%;min-width:84px;box-sizing:border-box}
.tab-form td:nth-child(2) input{min-width:150px}
.relatorio .rel-cab b,.relatorio .rel-cab small{display:block}

/* menu lateral: opções de Fretes sempre visíveis (só no computador) */
.sub-menu{display:none}
@media (min-width:900px){
  .nav .sub-menu{display:flex;flex-direction:column;gap:2px;margin:-2px 0 6px 26px;padding-left:12px;border-left:1px solid var(--line)}
  .nav .sub-menu a{min-height:36px;padding:7px 12px;font-size:.88rem}
  .nav .sub-menu a.on{background:var(--blue-bg);color:var(--brand);font-weight:600}
}
/* tela inicial: calendário grande e resumo do dia embaixo */
.resumo-dia{margin-top:14px}
.resumo-dia h2{margin:0}
.resumo-dia .tot-dia{display:flex;gap:28px;text-align:right}
.resumo-dia .tot-dia b{display:block;font-size:1.3rem}
.resumo-dia .grade-cards{margin-top:10px}
.valor-dia{display:none;font-size:.7rem;font-weight:500;color:var(--muted)}
.cal.grande .dia.sel .valor-dia{color:var(--ink)}
@media (min-width:900px){
  .inicio-grade{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}
  .inicio-grade .col-cal{grid-column:1;grid-row:1}
  .inicio-grade .col-avisos{grid-column:2;grid-row:1}
  .cal.grande{gap:4px}
  .cal.grande .dow{font-size:.78rem;padding-bottom:4px}
  .cal.grande .dia{height:96px;border:1px solid var(--line);justify-content:flex-start;padding-top:8px;gap:4px;align-items:center;background:rgba(255,255,255,.02)}
  .cal.grande .dia .num{font-size:1.15rem}
  .cal.grande .dia:hover{background:var(--blue-bg)}
  .cal.grande .dia.sel{background:var(--blue-bg);border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}
  .cal.grande .dia.hoje{box-shadow:inset 0 0 0 2px var(--brand)}
  .cal.grande .ponto{width:9px;height:9px}.cal.grande .pontos{height:9px}
  .valor-dia{display:block}
  .resumo-dia .grade-cards{grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}
}

/* despesas do cartão */
.cartao-bloco{margin-top:14px}
.tab-form tr.revisar td{background:rgba(212,144,15,.10)}
.cat{display:inline-block;padding:2px 9px;border-radius:99px;font-size:.78rem;background:var(--blue-bg);white-space:nowrap}
.cat.combustível{background:rgba(212,144,15,.22);color:var(--brand)}
.cat.manutenção-e-peças{background:rgba(90,160,220,.2)}
.cat.a-classificar{background:rgba(220,90,90,.2);color:var(--red)}
.placa{white-space:nowrap}

/* gestão: painel executivo e DRE */
:root{--s1:#3987e5;--s2:#d95926}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin:14px 0}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:4px}
.kpi small{text-transform:uppercase;letter-spacing:.06em;font-size:.72rem;color:var(--muted)}
.kpi b{font-size:1.55rem;line-height:1.15}.kpi span{font-size:.8rem;color:var(--muted)}
.kpi.destaque{border-color:var(--brand)}
.neg{color:var(--red)}
.alertas ul{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:8px}.alertas li{display:flex;gap:10px;align-items:flex-start}
.grafico svg{width:100%;height:auto;display:block}
.grafico .grade{stroke:var(--line);stroke-width:1;opacity:.6}.grafico .base{stroke:var(--muted);stroke-width:1}
.grafico .eixo{fill:var(--muted);font-size:11px}
.grafico .barra.receita{fill:var(--s1)}.grafico .barra.custo{fill:var(--s2)}
.legenda-g{display:flex;gap:18px;font-size:.85rem;color:var(--muted);margin-bottom:6px}.amostra{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}.amostra.s1{background:var(--s1)}.amostra.s2{background:var(--s2)}
.tabela-g{margin-top:8px}.tabela-g summary{cursor:pointer;color:var(--muted);font-size:.85rem}
.dre tr.forte td{font-weight:700}.dre tr.sub td{border-top:1px solid var(--muted);background:rgba(255,255,255,.04)}.dre tr.info td{color:var(--muted);font-size:.9rem}
.dre td:first-child,.dre th:first-child{white-space:nowrap;position:sticky;left:0;background:var(--surface)}
form.enc{display:flex;gap:6px}form.enc input{min-width:120px}
@media print{.kpi,.alertas,.card{background:#fff!important;border-color:#bbb!important}.kpi *{color:#000!important}.grafico .barra.receita{fill:#2a78d6!important}.grafico .barra.custo{fill:#eb6834!important}}
.chips.sem-margem{margin-top:0}
.duas-col>*{min-width:0}
.kpi b{font-size:1.4rem;white-space:nowrap}
.duas-col .rolagem table{min-width:0}.duas-col .rolagem{overflow-x:auto}
.acoes.estatica{position:static;margin-inline:0}
.tab-form tr.do-cartao td{background:rgba(57,135,229,.08)}

/* histórico */
.selo-ok{border-color:var(--green)}.selo-erro{border-color:var(--red);background:rgba(220,90,90,.12)}
.selo-ok b{color:var(--green)}.selo-erro b{color:var(--red)}
.mudanca{font-size:.85rem;color:var(--muted);overflow-wrap:anywhere}
.tabela-lista td{vertical-align:top}

/* fluxo de caixa */
.grafico .zero{stroke:var(--muted);stroke-width:1;stroke-dasharray:4 3}
.grafico .linha-saldo{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linejoin:round}
.grafico .ponto-saldo{fill:var(--bg);stroke:var(--ink);stroke-width:2}.grafico .ponto-saldo.neg{stroke:var(--red);fill:var(--red)}
.amostra.linha{width:16px;height:3px;border-radius:2px;background:var(--ink);vertical-align:middle}
.pos{color:var(--green)}
.aviso.ok{border-color:var(--green)}

@media (min-width:900px){
  .nav{overflow-y:auto;overscroll-behavior:contain}
  .nav .marca-nav,.nav .links,.nav .nav-usuario{flex-shrink:0}
}

/* conferência dos cartões */
.gasto{margin-top:10px;border-left-width:4px}
.gasto.n-alto{border-left-color:var(--red)}.gasto.n-medio{border-left-color:var(--amber)}.gasto.n-baixo,.gasto.n-info{border-left-color:var(--line)}
.alertas-gasto{list-style:none;margin:8px 0;padding:0;display:grid;gap:6px;font-size:.9rem}
form.conferir{display:flex;gap:8px;flex-wrap:wrap}form.conferir input[type=text]{flex:1;min-width:220px}
form.conferir select{flex:0 0 170px;width:170px}
