:root{
  --ground:#FFFFFF; --surface:#FFFFFF; --surface-2:#F4F4F5; --ink:#17181A; --muted:#6B6E73;
  --line:#E4E4E7; --accent:#C4161C; --accent-ink:#9E1216; --accent-soft:#FBE9E9;
  --ok:#2E8F5B; --warn:#B7791F; --crit:#B00020;
  /* fundos suaves dos dois pools de estoque (Loja x CD) */
  --ok-soft:#E7F4ED; --ok-borda:#B7DCC6; --warn-soft:#FBF1DF;
  --cd:#2F5F94; --cd-soft:#E8EEF6; --cd-borda:#BCCFE6;
  --radius:14px;
  --font:"Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",sans-serif;
  --mono:"Cascadia Code","SF Mono",Consolas,monospace;
}
@media (prefers-color-scheme:dark){
  :root{
    --ground:#121316; --surface:#1B1C1F; --surface-2:#26272B; --ink:#F2F2F3; --muted:#A0A2A8;
    --line:#34353A; --accent:#EF4444; --accent-ink:#F6A7A7; --accent-soft:#2A1516;
    --ok:#4BB07C; --warn:#D79A44; --crit:#F26D6D;
    --ok-soft:#14251C; --ok-borda:#26543C; --warn-soft:#2A2113;
    --cd:#7FA9DC; --cd-soft:#15202E; --cd-borda:#2C4664;
  }
}
:root[data-theme="light"]{
  --ground:#FFFFFF; --surface:#FFFFFF; --surface-2:#F4F4F5; --ink:#17181A; --muted:#6B6E73;
  --line:#E4E4E7; --accent:#C4161C; --accent-ink:#9E1216; --accent-soft:#FBE9E9;
  --ok:#2E8F5B; --warn:#B7791F; --crit:#B00020;
}
:root[data-theme="dark"]{
  --ground:#121316; --surface:#1B1C1F; --surface-2:#26272B; --ink:#F2F2F3; --muted:#A0A2A8;
  --line:#34353A; --accent:#EF4444; --accent-ink:#F6A7A7; --accent-soft:#2A1516;
  --ok:#4BB07C; --warn:#D79A44; --crit:#F26D6D;
  --ok-soft:#14251C; --ok-borda:#26543C; --warn-soft:#2A2113;
  --cd:#7FA9DC; --cd-soft:#15202E; --cd-borda:#2C4664;
}
*{box-sizing:border-box}
/* Garante que o atributo `hidden` esconda mesmo elementos com display:flex/grid
   (senão as telas login/home/pedido empilham em vez de trocar). */
[hidden]{display:none !important}
html,body{margin:0}
body{
  background:var(--ground); color:var(--ink); font-family:var(--font); line-height:1.5;
  -webkit-font-smoothing:antialiased; min-height:100dvh;
}
.top{
  position:sticky; top:0; z-index:5; display:flex; align-items:center; justify-content:space-between;
  padding:.7rem 1rem; background:var(--surface); border-bottom:1px solid var(--line);
}
.brand{display:flex; align-items:center; gap:.5rem; font-weight:750; letter-spacing:-.01em}
.brand .mark{width:30px; height:30px; display:block; border-radius:8px; overflow:hidden; flex:0 0 auto}
.brand .mark img{display:block; width:100%; height:100%; object-fit:cover}
.header-right{display:flex; align-items:center; gap:.7rem}
.tema-btn{
  border:1px solid var(--line); background:var(--surface-2); color:var(--ink);
  width:36px; height:36px; border-radius:10px; display:grid; place-items:center; cursor:pointer; padding:0;
}
.tema-btn svg{display:block}
.tema-btn .ic-sol{display:none}
.tema-btn .ic-lua{display:block}
@media (prefers-color-scheme:dark){ .tema-btn .ic-sol{display:block} .tema-btn .ic-lua{display:none} }
:root[data-theme="dark"] .tema-btn .ic-sol{display:block}
:root[data-theme="dark"] .tema-btn .ic-lua{display:none}
:root[data-theme="light"] .tema-btn .ic-sol{display:none}
:root[data-theme="light"] .tema-btn .ic-lua{display:block}
.cover{display:flex; justify-content:center; margin:.2rem 0 .8rem}
.cover-img{width:150px; height:150px; border-radius:20px; object-fit:cover; box-shadow:0 10px 26px -16px rgba(0,0,0,.55)}
.status{display:flex; align-items:center; gap:.4rem; font-size:.82rem; color:var(--muted)}
.dot{width:9px; height:9px; border-radius:50%; background:var(--muted)}
.dot.on{background:var(--ok)} .dot.off{background:var(--crit)}

main{max-width:520px; margin:0 auto; padding:1.1rem 1rem 3rem}
.view{display:flex; flex-direction:column; gap:1rem}
h1{font-size:1.5rem; letter-spacing:-.02em; margin:.4rem 0 0}
h2{font-size:1.05rem; margin:0; letter-spacing:-.01em}
.muted{color:var(--muted); font-size:.92rem; margin:0}
.hint{color:var(--muted); font-size:.82rem; text-align:center; margin:0}
code{font-family:var(--mono); background:var(--surface-2); padding:.05rem .35rem; border-radius:5px; font-size:.85em}

form{display:flex; flex-direction:column; gap:.9rem}
/* Nome do campo em cor forte: no balcão o vendedor VARRE a tela, não lê.
   Em cinza claro cada campo custava um segundo a mais para achar. */
label{display:flex; flex-direction:column; gap:.35rem; font-size:.88rem; color:var(--ink); font-weight:700; letter-spacing:.01em}
input{
  font:inherit; font-size:1rem; color:var(--ink); background:var(--surface);
  border:1px solid var(--line); border-radius:10px; padding:.7rem .8rem;
}
input:focus{outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent)}
.senha-wrap{position:relative; display:block}
.senha-wrap input{width:100%; padding-right:5.4rem}
.ver-senha{
  position:absolute; right:.35rem; top:50%; transform:translateY(-50%);
  border:0; background:transparent; color:var(--accent); font:inherit; font-size:.82rem; font-weight:700;
  cursor:pointer; padding:.35rem .55rem; border-radius:8px;
}
.ver-senha:active{transform:translateY(-50%) scale(.96)}
.ver-senha svg{display:block}
.ver-senha .slash{display:none}
.ver-senha.on .slash{display:inline}

.btn{
  font:inherit; font-size:1rem; font-weight:650; border:1px solid var(--line); background:var(--surface);
  color:var(--ink); border-radius:11px; padding:.8rem 1rem; cursor:pointer; width:100%;
  transition:transform .05s ease;
}
.btn:active{transform:translateY(1px)}
.btn.primary{background:var(--accent); border-color:var(--accent); color:#fff}
.btn.ghost{background:transparent; color:var(--muted)}
.btn:disabled{opacity:.5; cursor:not-allowed}
.erro{color:var(--crit); font-size:.86rem; margin:0}

.card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:1.1rem;
  display:flex; flex-direction:column; gap:.8rem; box-shadow:0 10px 26px -20px rgba(0,0,0,.5);
}
.whoami{font-size:1.1rem}
.sync-head{display:flex; align-items:center; justify-content:space-between}
.badge{
  font-size:.7rem; font-weight:700; padding:.22rem .6rem; border-radius:99px;
  background:var(--surface-2); color:var(--muted); text-transform:uppercase; letter-spacing:.05em;
}
.badge.ok{background:var(--accent-soft); color:var(--accent-ink)}
.badge.warn{background:color-mix(in srgb,var(--warn) 22%,transparent); color:var(--warn)}
.metrics{display:flex; gap:.8rem}
.metric{
  flex:1; background:var(--surface-2); border-radius:10px; padding:.7rem;
  display:flex; flex-direction:column; align-items:center; gap:.1rem;
}
.metric .n{font-size:1.5rem; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.metric .k{font-size:.72rem; color:var(--muted); text-transform:uppercase; letter-spacing:.05em}

select,textarea{
  font:inherit; font-size:1rem; color:var(--ink); background:var(--surface);
  border:1px solid var(--line); border-radius:10px; padding:.7rem .8rem; width:100%;
}
select:focus,textarea:focus{outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent)}
.btn.small{width:auto; padding:.45rem .8rem; font-size:.85rem}
.link{background:none; border:0; color:var(--accent); font:inherit; font-weight:650; cursor:pointer; padding:.2rem 0}
.topo-view{display:flex; align-items:center; gap:.8rem}
.topo-view h1{margin:0; font-size:1.3rem}

/* cliente / pagamento info */
.cliente-info{background:var(--surface-2); border:1px solid var(--line); border-radius:10px; padding:.6rem .8rem; font-size:.88rem; color:var(--muted)}
.cliente-info.alerta{background:color-mix(in srgb,var(--warn) 14%,transparent); border-color:color-mix(in srgb,var(--warn) 40%,var(--line)); color:var(--ink)}
.cliente-info b{color:var(--ink)}
.cliente-info .ci-linha{display:flex; flex-wrap:wrap; gap:.35rem .6rem; align-items:center}
.cliente-info .ci-linha + .ci-linha{margin-top:.45rem}
.prazo-badge{display:inline-flex; align-items:center; gap:.3rem; font-size:.78rem; font-weight:800; padding:.22rem .6rem; border-radius:999px}
.prazo-badge.ok{color:var(--ok); background:color-mix(in srgb,var(--ok) 15%,transparent)}
.prazo-badge.bloq{color:var(--crit); background:color-mix(in srgb,var(--crit) 15%,transparent)}
.aviso-credito{margin:.1rem 0 0; padding:.55rem .8rem; border-radius:10px; font-size:.85rem; font-weight:700}
.aviso-credito.bloq{color:var(--crit); background:color-mix(in srgb,var(--crit) 12%,transparent); border:1px solid color-mix(in srgb,var(--crit) 40%,var(--line))}
.aviso-credito.warn{color:var(--ink); background:color-mix(in srgb,var(--warn) 15%,transparent); border:1px solid color-mix(in srgb,var(--warn) 40%,var(--line))}
/* seletor Pedido x Consignado */
.seg{display:flex; gap:.3rem; background:var(--surface-2); border:1px solid var(--line); border-radius:11px; padding:.25rem}
.seg-btn{flex:1; border:0; background:transparent; color:var(--muted); font:inherit; font-weight:700; padding:.55rem .6rem; border-radius:8px; cursor:pointer}
.seg-btn.on{background:var(--accent); color:#fff}
.doc-filtros{margin:.5rem 0}
.doc-filtros .seg-btn{font-size:.8rem; padding:.5rem .25rem}
#doc-busca{margin-top:.2rem}
.nota-consignado{margin:.1rem 0 0; padding:.55rem .8rem; border-radius:10px; font-size:.85rem; color:var(--ink); background:var(--accent-soft); border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line))}
.tag-consig{display:inline-block; margin-left:.4rem; font-size:.7rem; font-weight:800; color:var(--accent-ink); background:var(--accent-soft); border-radius:6px; padding:.06rem .38rem}

/* busca de produto + scanner */
.busca-prod-row{display:flex; gap:.4rem; align-items:stretch}
.busca-prod-row input{flex:1; min-width:0}
.scan-btn{flex:0 0 auto; width:50px; border:1px solid var(--line); background:var(--surface-2); color:var(--accent-ink); border-radius:10px; cursor:pointer; display:flex; align-items:center; justify-content:center}
.scan-btn:active{transform:translateY(1px)}
.scan-overlay{position:fixed; inset:0; z-index:60; background:rgba(0,0,0,.93); display:flex; align-items:center; justify-content:center; padding:1rem}
.scan-overlay[hidden]{display:none !important}
.scan-box{display:flex; flex-direction:column; align-items:center; gap:1rem; width:100%; max-width:520px; position:relative}
.scan-box video{width:100%; border-radius:14px; background:#000; max-height:70vh; object-fit:cover}
.scan-frame{position:absolute; top:50%; left:50%; transform:translate(-50%,-70%); width:80%; height:30%; border:3px solid var(--accent); border-radius:12px; pointer-events:none}
.scan-hint{color:#fff; text-align:center; margin:0; font-weight:600}
.scan-overlay .btn{background:#fff; color:#111; min-width:170px}
.result{display:flex; flex-direction:column; gap:.4rem}
.result:not(:empty){margin-top:.2rem}
/* Lista de resultados da busca de produtos: rola dentro de si mesma, com barra
   de rolagem visível, para navegar entre muitos itens sem empurrar a tela. */
#result-prod{max-height:56vh; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; padding-right:6px; scrollbar-width:thin; scrollbar-color:var(--line) transparent}
#result-prod::-webkit-scrollbar{width:9px}
#result-prod::-webkit-scrollbar-thumb{background:var(--line); border-radius:9px; border:2px solid var(--surface)}
#result-prod::-webkit-scrollbar-thumb:active{background:var(--muted)}
.result-info{position:sticky; top:0; z-index:1; background:var(--surface); font-size:.78rem; color:var(--muted); padding:.25rem .1rem; border-bottom:1px solid var(--line)}
/* Barra fixa de "nova versão disponível" no topo. */
.update-bar{position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:center; gap:.7rem; background:var(--accent); color:#fff; padding:.5rem .8rem; font-weight:700; font-size:.9rem}
.update-bar button{background:#fff; color:var(--accent); border:0; border-radius:8px; padding:.35rem .9rem; font-weight:800; cursor:pointer}
.update-bar button:active{transform:translateY(1px)}
/* Botão secundário (contorno) e telas de biometria. */
.btn.ghost{background:transparent; color:var(--muted); border:1px solid var(--line)}
#view-lock{text-align:center}
#view-lock .btn{margin-top:.6rem}
#lock-nome:empty{display:none}
.bio-offer{position:fixed; inset:0; z-index:60; display:flex; align-items:flex-end; justify-content:center; background:rgba(0,0,0,.45); padding:16px}
.bio-card{background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:18px; max-width:440px; width:100%; box-shadow:0 10px 34px rgba(0,0,0,.35)}
.bio-card p{color:var(--muted); font-size:.9rem; margin:.4rem 0 .9rem}
.bio-actions{display:flex; gap:.6rem}
.bio-actions .btn{flex:1; margin-top:0}
/* Barra "pedido não finalizado" na tela inicial (auto-salvar/restaurar). */
.rascunho-banner{display:flex; align-items:center; justify-content:space-between; gap:.6rem; flex-wrap:wrap;
  background:var(--accent-soft); border:1px solid var(--accent); border-radius:12px; padding:.6rem .8rem; margin-bottom:.8rem}
.rascunho-banner .rb-txt{font-size:.9rem}
.rascunho-banner .rb-txt span{color:var(--muted)}
.rascunho-banner .rb-actions{display:flex; gap:.4rem}
.rascunho-banner .btn{width:auto; margin:0}
.prod-op{text-align:left; background:var(--surface-2); border:1px solid var(--line); border-radius:10px; padding:.6rem .7rem; cursor:pointer; display:flex; flex-direction:column; gap:.25rem}
.prod-op:active{transform:translateY(1px)}
.prod-op.added{border-color:var(--ok); background:color-mix(in srgb,var(--ok) 10%,var(--surface-2))}
.prod-op.added .po-sub::after{content:" · ✓ adicionado"; color:var(--ok); font-weight:800}
.ver-app{text-align:center; opacity:.6; margin-top:.4rem}
.po-head{display:flex; align-items:flex-start; justify-content:space-between; gap:.5rem}
.po-desc{font-weight:600; font-size:.92rem; line-height:1.25}
/* SKU como etiqueta separada — longe do "disponível" para não confundir. */
.po-sku{flex:none; align-self:flex-start; font-size:.66rem; font-weight:800; letter-spacing:.04em;
  color:var(--accent-ink); background:var(--accent-soft); border-radius:6px; padding:.12rem .4rem; white-space:nowrap; font-variant-numeric:tabular-nums}
.po-sub{font-size:.78rem; color:var(--muted); font-variant-numeric:tabular-nums}
.po-sub b{color:var(--ink)}
.prod-wrap{display:grid; grid-template-columns:1fr auto; gap:.4rem; align-items:stretch}
.prod-wrap .prod-op{grid-column:1}
.est-toggle{grid-column:2; border:1px solid var(--line); background:var(--surface-2); color:var(--accent-ink);
  border-radius:10px; padding:0 .7rem; cursor:pointer; display:flex; align-items:center; justify-content:center}
.est-toggle.on{background:var(--accent-soft); border-color:var(--accent)}
.est-toggle:active{transform:translateY(1px)}
.estoque-box{grid-column:1 / -1; background:var(--surface-2); border:1px solid var(--line); border-radius:10px;
  padding:.55rem .7rem; font-size:.82rem; display:flex; flex-direction:column; gap:.22rem}
.est-topo{font-size:.78rem; color:var(--muted); padding-bottom:.3rem; border-bottom:1px solid var(--line); margin-bottom:.15rem}
.est-topo b{color:var(--ink); font-variant-numeric:tabular-nums}
.est-linha{display:flex; justify-content:space-between; gap:.6rem}
.est-linha span:last-child{color:var(--muted); white-space:nowrap; font-variant-numeric:tabular-nums}

/* carrinho */
.carrinho{display:flex; flex-direction:column; gap:.7rem}
.carrinho:not(:empty){margin-top:.3rem}
.item{border:1px solid var(--line); border-radius:11px; padding:.7rem; display:flex; flex-direction:column; gap:.55rem; background:var(--surface)}
@keyframes itemflash{from{background:color-mix(in srgb,var(--ok) 28%,var(--surface)); border-color:var(--ok)} to{background:var(--surface)}}
.item.flash{animation:itemflash 1s ease-out}
/* EDITOR único: área fixa (abaixo da busca) do produto selecionado */
.editor-item{border:2px solid var(--accent); border-radius:12px; padding:.75rem; display:flex; flex-direction:column; gap:.6rem; background:var(--surface); margin:.1rem 0 .3rem}
.editor-item[hidden]{display:none !important}
.confirmar-item{width:100%; margin-top:.15rem}
.editor-disp{font-size:.82rem; color:var(--muted); margin:-.2rem 0 .1rem; font-variant-numeric:tabular-nums}
.editor-disp b{color:var(--ink)}
.editor-disp.excede{color:var(--crit); font-weight:700}
.editor-disp.excede b{color:var(--crit)}
/* LOJA x CD (V2-001-R): dois blocos lado a lado. Verde = pode vender; azul =
   existe no CD mas não é disponibilidade de venda. */
.editor-pools{margin:-.2rem 0 .1rem}
.pools{display:grid; grid-template-columns:1fr 1fr; gap:.5rem}
.pool{
  border-radius:10px; padding:.45rem .55rem; display:grid; gap:.05rem;
  border:1px solid var(--line); background:var(--surface-2); font-variant-numeric:tabular-nums;
}
.pool .rot{font-size:.64rem; letter-spacing:.08em; text-transform:uppercase; font-weight:700; color:var(--muted)}
.pool b{font-size:1.15rem; letter-spacing:-.02em; line-height:1.15}
.pool .sub{font-size:.68rem; color:var(--muted)}
.pool.loja{background:var(--ok-soft); border-color:var(--ok-borda)}
.pool.loja .rot{color:var(--ok)}
.pool.cd{background:var(--cd-soft); border-color:var(--cd-borda)}
.pool.cd .rot{color:var(--cd)}
.pool.vazio b{color:var(--muted)}
.pool-aviso{
  margin-top:.4rem; font-size:.8rem; padding:.4rem .55rem; border-radius:9px;
  background:var(--warn-soft); border-left:3px solid var(--warn); color:var(--ink);
}
.pool-aviso b{font-variant-numeric:tabular-nums}
/* Já pedido ao CD: informa, não cobra ação. */
.pool-aviso.ok{background:var(--ok-soft); border-left-color:var(--ok)}
.est-outros{font-size:.72rem; color:var(--muted); padding:.15rem 0 .3rem; font-variant-numeric:tabular-nums}
/* Reposição no CD (V2-008): estado do pedido + botão. */
.rep-card{
  margin-top:.4rem; padding:.4rem .55rem; border-radius:9px; font-size:.8rem;
  display:grid; gap:.05rem; border-left:3px solid var(--line); background:var(--surface-2);
}
.rep-card b{font-size:.84rem}
.rep-card span{color:var(--muted); font-variant-numeric:tabular-nums}
.rep-card.espera{border-left-color:var(--cd); background:var(--cd-soft)}
.rep-card.ok{border-left-color:var(--ok); background:var(--ok-soft)}
.rep-card.atraso{border-left-color:var(--crit); background:var(--accent-soft)}
.rep-quando{font-size:.7rem; color:var(--muted)}
/* Radar: candidatos a inventário (V2-012) */
.inv-linha{
  display:flex; justify-content:space-between; align-items:flex-start; gap:.7rem;
  padding:.5rem 0; border-top:1px solid var(--line);
}
.inv-prod{display:grid; gap:.1rem; min-width:0}
.inv-prod b{font-size:.88rem; line-height:1.25}
.inv-quem{font-size:.72rem; color:var(--muted); font-variant-numeric:tabular-nums}
.inv-nums{display:grid; gap:.1rem; text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums}
.inv-antes{font-size:.72rem; color:var(--muted)}
.inv-agora{font-size:.82rem; font-weight:700}
.inv-agora.alerta{color:var(--warn)}
.inv-agora.ok{color:var(--muted); font-weight:600}
.rep-check{
  margin-top:.35rem; justify-self:start; border:1px solid var(--line); background:var(--surface);
  color:var(--ink); border-radius:9px; padding:.35rem .7rem; font:inherit; font-size:.78rem;
  font-weight:600; cursor:pointer;
}
.rep-check:active{transform:translateY(1px)}
.rep-check:disabled{opacity:.6; cursor:not-allowed}
.btn-cd{
  margin-top:.5rem; width:100%; border:1px solid var(--cd); background:var(--cd); color:#fff;
  border-radius:11px; padding:.65rem .9rem; font:inherit; font-size:.92rem; font-weight:650; cursor:pointer;
}
.btn-cd:active{transform:translateY(1px)}
.btn-cd:disabled{opacity:.6; cursor:not-allowed}
/* Frescor do preço/estoque no editor: "atualizado agora" (ao vivo) x offline. */
.editor-fresh{font-size:.76rem; color:var(--muted); margin:0 0 .35rem}
.editor-fresh.ok{color:var(--ok); font-weight:700}
.editor-fresh.off{color:var(--warn); font-weight:700}
/* item COLAPSADO: uma linha só (descrição · qtd · total) + editar/remover */
.item.colapsado{flex-direction:row; align-items:center; gap:.5rem; padding:.6rem .7rem}
.item.colapsado .col-main{flex:1; min-width:0; display:flex; flex-direction:column; gap:.1rem}
.item.colapsado .item-desc{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:.9rem}
.item.colapsado .col-sub{font-size:.82rem; color:var(--muted); font-variant-numeric:tabular-nums}
.item.colapsado .col-sub b{color:var(--ink)}
.col-editar{flex:0 0 auto; width:38px; height:38px; border:1px solid var(--line); background:var(--surface-2); color:var(--accent-ink); border-radius:9px; cursor:pointer; display:flex; align-items:center; justify-content:center}
.col-editar:active{transform:translateY(1px)}
.add-outro{width:100%; margin-top:.6rem; border:1px dashed var(--accent); color:var(--accent-ink); background:transparent; font-weight:700}
.add-outro:active{transform:translateY(1px)}
.item-top{display:flex; align-items:flex-start; justify-content:space-between; gap:.5rem}
.item-desc{font-size:.9rem; font-weight:600; line-height:1.3}
.rm{border:0; background:none; color:var(--crit); font-size:1.1rem; cursor:pointer; padding:0 .2rem}
.item-ctrls{display:flex; align-items:center; gap:.5rem; flex-wrap:wrap}
.item-ctrls select{width:auto; flex:1; min-width:120px; padding:.5rem .6rem}
.stepper{display:flex; align-items:center; border:1px solid var(--line); border-radius:9px; overflow:hidden; flex:1 1 auto; min-width:186px; max-width:300px}
.stepper button{flex:0 0 42px; border:0; background:var(--surface-2); color:var(--ink); width:42px; height:40px; font-size:1.2rem; cursor:pointer}
/* Atalho de 10 em 10: parafuso raramente sai unidade a unidade. Fica ao lado
   do "+", com o texto menor para não competir com ele. */
.stepper button.passo10{font-size:.86rem; font-weight:700; border-left:1px solid var(--line); color:var(--muted)}
.stepper button.passo10:active{transform:translateY(1px)}
.stepper input{flex:1 1 auto; width:100%; min-width:64px; text-align:center; border:0; border-left:1px solid var(--line); border-right:1px solid var(--line); border-radius:0; font-variant-numeric:tabular-nums}
/* Remove as setinhas nativas (spinner) dos campos numéricos — já temos −/+. */
input[type=number]{-moz-appearance:textfield; appearance:textfield}
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none; margin:0}
.mini{display:flex; flex-direction:column; gap:.2rem; font-size:.68rem; color:var(--muted); font-weight:700; text-transform:uppercase; letter-spacing:.04em}
.mini input{width:88px; padding:.45rem .5rem; font-variant-numeric:tabular-nums}
/* Desconto escondido atrás do botão −$ (o cliente não vê que pode ganhar). */
.desc-toggle{width:40px; height:40px; border:1px solid var(--line); background:var(--surface-2); color:var(--muted);
  border-radius:9px; font:inherit; font-weight:800; cursor:pointer; align-self:flex-end}
.desc-toggle.on{background:var(--accent-soft); border-color:var(--accent); color:var(--accent-ink)}
.desc-toggle:active{transform:translateY(1px)}
.desc-field[hidden]{display:none}
.linha-total{margin-left:auto; font-weight:750; font-variant-numeric:tabular-nums; align-self:flex-end}

/* total + envio */
.total-bar{display:flex; align-items:center; justify-content:space-between; padding:.4rem .2rem; font-size:1.05rem}
.total-bar b{font-size:1.2rem; font-variant-numeric:tabular-nums}
/* resumo do pedido: valor cheio, desconto, total e comissão */
.totais{display:flex; flex-direction:column; gap:.18rem; padding:.5rem .2rem; margin-top:.2rem}
.tot-linha{display:flex; align-items:baseline; justify-content:space-between; gap:.6rem; font-size:.95rem; color:var(--muted); font-variant-numeric:tabular-nums}
.tot-linha span:last-child,.tot-linha b{color:var(--ink)}
.tot-linha.desc span:last-child{color:var(--accent-ink)}
.tot-linha.total{font-size:1.1rem; color:var(--ink); font-weight:700; padding-top:.35rem; margin-top:.18rem; border-top:1px solid var(--line)}
.tot-linha.total b{font-size:1.25rem}
.tot-linha.comissao{color:var(--ok); font-weight:700; margin-top:.15rem}
.tot-linha.comissao b{color:var(--ok)}
.tot-linha.comissao em{font-style:normal; font-weight:600; opacity:.8}
.tot-linha.desc-edit label{color:var(--muted)}
.desc-inputs{display:flex; gap:.4rem; align-items:center}
.desc-wrap{display:inline-flex; align-items:center; gap:.2rem; border:1px solid var(--line); border-radius:8px; padding:.1rem .5rem; background:var(--surface)}
.desc-wrap .rs{color:var(--muted); font-size:.85rem}
.desc-wrap input{width:66px; border:0; background:transparent; text-align:right; padding:.3rem 0; font-variant-numeric:tabular-nums; color:var(--ink); font-weight:700}
.desc-max{margin:-.05rem 0 .15rem; text-align:right; color:var(--accent-ink)}
.tot-linha.comissao-perdida{color:var(--crit); font-weight:700}
.tot-linha.comissao-perdida b{color:var(--crit)}
.ok-msg{background:var(--accent-soft); color:var(--accent-ink); border-radius:10px; padding:.6rem .8rem; font-size:.88rem; margin:0}

/* lista de pedidos */
.pedidos-head{display:flex; align-items:center; justify-content:space-between; margin-top:.4rem}
.lista{display:flex; flex-direction:column; gap:.5rem}
.pedido-item{display:flex; align-items:center; justify-content:space-between; gap:.6rem; text-align:left;
  background:var(--surface); border:1px solid var(--line); border-radius:11px; padding:.7rem .8rem; cursor:pointer}
.pi-main{display:flex; flex-direction:column; gap:.1rem}
.pi-sub{font-size:.78rem; color:var(--muted); font-variant-numeric:tabular-nums}
.chip{font-size:.68rem; font-weight:700; padding:.2rem .55rem; border-radius:99px; white-space:nowrap; text-transform:uppercase; letter-spacing:.03em; background:var(--surface-2); color:var(--muted)}
.chip.pendente{background:var(--surface-2); color:var(--muted)}
.chip.enviado{background:var(--accent-soft); color:var(--accent-ink)}
.chip.com_cortes{background:color-mix(in srgb,var(--warn) 20%,transparent); color:var(--warn)}
.chip.rejeitado{background:color-mix(in srgb,var(--crit) 16%,transparent); color:var(--crit)}
.chip.erro{background:color-mix(in srgb,var(--crit) 16%,transparent); color:var(--crit)}

/* detalhe */
.det-itens{display:flex; flex-direction:column; gap:.35rem}
.det-item{display:flex; justify-content:space-between; gap:.6rem; font-size:.9rem; padding:.3rem 0; border-bottom:1px solid var(--line)}
.det-item span:last-child{color:var(--muted); white-space:nowrap; font-variant-numeric:tabular-nums}
.aviso{border-radius:10px; padding:.6rem .8rem; font-size:.85rem}
.aviso ul{margin:.35rem 0 0; padding-left:1.1rem}
.aviso.corte{background:color-mix(in srgb,var(--crit) 12%,transparent); color:var(--ink)}
.aviso.preco{background:color-mix(in srgb,var(--warn) 14%,transparent); color:var(--ink)}

/* ================= Meu Dia (desempenho do vendedor) ================= */
.dz-num{font-variant-numeric:tabular-nums}
.dz-hero{background:linear-gradient(160deg,hsl(212,66%,30%),hsl(198,70%,46%)); color:#fff; border:none}
.dz-proj{margin:.7rem 0 0; font-size:.82rem; font-weight:600; background:rgba(255,255,255,.16); padding:.45rem .65rem; border-radius:9px}
.dz-hz{display:flex; gap:5px; margin-bottom:1rem}
.dz-c{flex:1; border:none; border-radius:9px; padding:7px 4px; font:inherit; font-size:.8rem; font-weight:700;
  background:rgba(255,255,255,.16); color:#fff; cursor:pointer}
.dz-c.on{background:#fff; color:var(--accent-ink)}
.dz-ringrow{display:flex; align-items:center; gap:1rem}
.dz-ring{position:relative; width:112px; height:112px; flex:0 0 auto}
.dz-ring svg{transform:rotate(-90deg)}
.dz-trk{fill:none; stroke:rgba(255,255,255,.25); stroke-width:12}
.dz-prog{fill:none; stroke:#fff; stroke-width:12; stroke-linecap:round; stroke-dasharray:326.7;
  stroke-dashoffset:326.7; transition:stroke-dashoffset .5s ease}
.dz-ring-mid{position:absolute; inset:0; display:grid; place-content:center; text-align:center}
.dz-pct{font-size:1.5rem; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.dz-cap{font-size:.62rem; text-transform:uppercase; letter-spacing:.1em; opacity:.85}
.dz-money{font-size:1.5rem; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.dz-goal{opacity:.9; font-size:.82rem; margin:.1rem 0 .6rem}
.dz-hero .btn.small{background:rgba(255,255,255,.18); color:#fff; border:none}
.dz-push{margin:.9rem 0 0; font-weight:600; font-size:.9rem; background:rgba(255,255,255,.16);
  padding:.55rem .7rem; border-radius:10px}
.dz-h2{font-size:.98rem; margin:.2rem 0 .1rem; letter-spacing:-.01em}
.dz-grid{display:grid; grid-template-columns:1fr 1fr; gap:.7rem}
.dz-stat{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:.7rem .8rem}
.dz-k{font-size:.72rem; color:var(--muted); font-weight:700; text-transform:uppercase; letter-spacing:.03em}
.dz-v{font-size:1.25rem; font-weight:800; letter-spacing:-.02em; margin-top:.15rem; font-variant-numeric:tabular-nums}
.dz-s{font-size:.74rem; color:var(--muted); font-variant-numeric:tabular-nums}
.dz-v.neg{color:var(--crit)} .dz-v.pos{color:var(--ok)}
.dz-bars{display:flex; align-items:flex-end; justify-content:space-between; gap:6px; height:120px; margin-top:.5rem}
.dz-bar{flex:1; display:flex; flex-direction:column; align-items:center; gap:5px; height:100%; justify-content:flex-end}
.dz-col{width:70%; max-width:28px; border-radius:6px 6px 2px 2px; background:hsl(210,55%,62%);
  border:1px solid transparent; min-height:3px}
.dz-bar.on .dz-col{border:none}
.dz-d{font-size:.66rem; color:var(--muted); font-weight:600}
.dz-bar.on .dz-d{color:var(--accent)}
.dz-track2{height:11px; background:var(--surface-2); border-radius:99px; overflow:hidden; border:1px solid var(--line)}
.dz-fill{height:100%; background:hsl(198,70%,46%); border-radius:99px; transition:width .5s ease, background .5s ease}
.dz-barwrap{position:relative; padding-top:16px; margin:.5rem 0 .2rem}
.dz-mark{position:absolute; top:0; transform:translateX(-50%); line-height:1; text-align:center; white-space:nowrap; color:var(--ink)}
.dz-mark b{display:block; font-size:.8rem}
.dz-mark small{display:block; font-size:.56rem; color:var(--muted); margin-top:-2px}
.dz-proj2{margin:.55rem 0 .1rem; font-size:.8rem; color:var(--ink)}
.dz-rowb{display:flex; justify-content:space-between; align-items:baseline}
.dz-big{font-size:1.2rem; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.dz-tiers{display:flex; gap:4px; margin-top:.7rem}
.dz-tier{flex:1; text-align:center; font-size:.6rem; font-weight:700; padding:5px 2px; border-radius:7px;
  background:var(--surface-2); color:var(--muted); border:1px solid var(--line)}
.dz-tier.on{background:var(--accent-soft); color:var(--accent-ink); border-color:var(--accent)}
.dz-tier span{display:block; font-size:.9em; opacity:.8; font-weight:600}
.dz-comm{display:flex; align-items:center; margin-top:.8rem; padding-top:.8rem; border-top:1px solid var(--line); font-size:.85rem; color:var(--muted)}
.dz-comm .amt{margin-left:auto; font-weight:800; color:var(--ok); font-size:1.05rem; font-variant-numeric:tabular-nums}
.dz-chip{display:flex; align-items:center; gap:.7rem; padding:.6rem 0; border-bottom:1px solid var(--line)}
.dz-chip:last-child{border-bottom:none}
.dz-chip .ic{width:34px; height:34px; border-radius:9px; display:grid; place-items:center; font-size:1.1rem;
  background:var(--surface-2); flex:0 0 auto}
.dz-chip .t{font-weight:700; font-size:.9rem} .dz-chip .u{color:var(--muted); font-size:.76rem}
.dz-note{font-size:.74rem; color:var(--muted); margin:.4rem 0 0}

/* ---- Equipe (gerência) ---- */
.dz-teamkpi{display:flex; gap:8px; margin-top:.9rem}
.dz-teamkpi>div{flex:1; background:rgba(255,255,255,.14); border-radius:10px; padding:.5rem .4rem; text-align:center}
.dz-teamkpi b{display:block; font-size:1.05rem; font-weight:800; font-variant-numeric:tabular-nums}
.dz-teamkpi span{font-size:.64rem; opacity:.85}
.eq-row{display:flex; align-items:center; gap:.6rem; padding:.6rem .1rem; width:100%; text-align:left;
  background:none; border:none; border-bottom:1px solid var(--line); color:inherit; font:inherit; cursor:pointer}
.eq-row:last-child{border-bottom:none}
.eq-row:active{background:var(--surface-2)}
.eq-pos{width:20px; text-align:center; font-weight:800; color:var(--muted); font-size:.82rem; flex:0 0 auto}
.eq-row.top1 .eq-pos{color:var(--warn); font-size:1rem}
.eq-who{flex:1; min-width:0}
.eq-nm{font-weight:700; font-size:.85rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.eq-sub{color:var(--muted); font-size:.72rem; font-variant-numeric:tabular-nums}
.eq-badge{display:inline-block; font-size:.56rem; font-weight:800; padding:1px 5px; border-radius:5px;
  background:var(--accent-soft); color:var(--accent-ink); margin-left:5px; vertical-align:1px}
.eq-val{text-align:right; flex:0 0 auto; width:98px}
.eq-m{font-weight:800; font-size:.85rem; font-variant-numeric:tabular-nums}
.eq-bar{height:5px; background:var(--surface-2); border-radius:99px; overflow:hidden; margin-top:3px; border:1px solid var(--line)}
.eq-bar>i{display:block; height:100%; background:hsl(200,68%,50%)}
.eq-chev{color:var(--muted); flex:0 0 auto; font-size:1.1rem}
.eq-att{display:flex; align-items:center; gap:.5rem; padding:.5rem 0; border-bottom:1px solid var(--line); font-size:.85rem}
.eq-att:last-child{border-bottom:none}
.eq-att .dot2{width:8px; height:8px; border-radius:50%; background:var(--warn); flex:0 0 auto}
.eq-att .tag2{margin-left:auto; color:var(--warn); font-weight:700; font-size:.74rem; font-variant-numeric:tabular-nums}
.eq-marg{font-size:.66rem; font-weight:800; padding:2px 6px; border-radius:6px; background:var(--surface-2); color:var(--muted)}

/* ================= Gerência v2 ================= */
#gv-blocos{display:flex; flex-direction:column; gap:12px}
#gv-blocos .card h2{margin-bottom:10px}
.gv-num{font-variant-numeric:tabular-nums}
.gv-rent{display:flex; align-items:baseline; justify-content:space-between; gap:10px}
.gv-rent .dz-big{font-size:1.6rem}
.gv-marg{font-size:1.35rem; font-weight:800; color:var(--ok); font-variant-numeric:tabular-nums}
.gv-stack{height:16px; border-radius:8px; overflow:hidden; display:flex; border:1px solid var(--line); margin-top:9px}
.gv-stack i{display:block; height:100%}
.gv-stack .cus{background:var(--muted); opacity:.5} .gv-stack .luc{background:var(--ok)}
.gv-leg{display:flex; gap:14px; margin-top:8px; font-size:.74rem; color:var(--muted); flex-wrap:wrap; font-variant-numeric:tabular-nums}
.gv-leg b{width:9px; height:9px; border-radius:2px; display:inline-block; margin-right:5px}
.gv-leg .cus{background:var(--muted); opacity:.5} .gv-leg .luc{background:var(--ok)}
.gv-trend{display:flex; align-items:flex-end; gap:12px; height:112px; padding-top:6px}
.gv-tc{flex:1; display:flex; flex-direction:column; align-items:center; gap:5px; height:100%; justify-content:flex-end}
.gv-bar{width:62%; max-width:46px; border-radius:6px 6px 3px 3px; min-height:4px}
.gv-tv{font-size:.7rem; font-weight:700; font-variant-numeric:tabular-nums} .gv-tl{font-size:.66rem; color:var(--muted)}
.gv-deltas{display:flex; gap:9px; margin-top:11px}
.gv-delta{flex:1; background:var(--surface-2); border:1px solid var(--line); border-radius:10px; padding:7px; text-align:center}
.gv-delta b{font-size:1.05rem; display:block; font-variant-numeric:tabular-nums} .gv-delta span{font-size:.66rem; color:var(--muted)}
.li{display:flex; align-items:center; gap:9px; padding:7px 0; border-bottom:1px solid var(--line)}
.li:last-child{border-bottom:none}
.li .n{width:18px; color:var(--muted); font-weight:800; font-size:.8rem; text-align:center; flex:0 0 auto}
.li .t{flex:1; font-size:.85rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.li .m{font-weight:700; font-size:.83rem; font-variant-numeric:tabular-nums}
.mk{display:flex; align-items:center; gap:9px; padding:6px 0}
.mk .t{width:70px; font-weight:700; font-size:.8rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; flex:0 0 auto}
.mk .track{flex:1; height:9px; background:var(--surface-2); border-radius:99px; overflow:hidden; border:1px solid var(--line)}
.mk .track i{display:block; height:100%; background:linear-gradient(90deg,hsl(210,70%,55%),var(--ok))}
.mk .v{width:64px; text-align:right; font-size:.78rem; font-weight:700; font-variant-numeric:tabular-nums; flex:0 0 auto}
.grid2gv{display:grid; grid-template-columns:1fr 1fr 1fr; gap:9px}
.grid2gv .mini{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:11px 10px}
.grid2gv .mini .k{font-size:.68rem; color:var(--muted); font-weight:700}
.grid2gv .mini .v{font-size:1.25rem; font-weight:800; margin-top:2px; font-variant-numeric:tabular-nums}
.grid2gv .mini .s{font-size:.68rem; color:var(--muted); font-variant-numeric:tabular-nums}

/* ---- ações na lista de orçamentos (Usar / PDF) ---- */
.pi-acoes{display:flex; flex-direction:column; gap:.35rem; align-items:flex-end; flex:0 0 auto}
.pi-main{cursor:pointer}

/* ================= PDF do orçamento ================= */
#print-area{display:none}
.pdf-doc{max-width:720px; margin:0 auto; padding:24px; color:#111; font-family:var(--font);
  -webkit-print-color-adjust:exact; print-color-adjust:exact}
.pdf-head{display:flex; align-items:center; gap:16px; border-bottom:3px solid #C4161C; padding-bottom:12px}
.pdf-logo{width:70px; height:70px; object-fit:contain; flex:0 0 auto}
.pdf-store b{font-size:15px; display:block} .pdf-store div{font-size:11px; color:#555; line-height:1.4}
.pdf-title{font-size:20px; margin:16px 0 12px; color:#111}
.pdf-meta{display:grid; grid-template-columns:1fr 1fr; gap:6px 18px; margin-bottom:14px; font-size:12px}
.pdf-meta span{color:#888; margin-right:6px}
.pdf-itens{width:100%; border-collapse:collapse; font-size:12px}
.pdf-itens th{background:#f2f2f2; text-align:left; padding:7px 8px; border-bottom:1px solid #ccc; font-size:11px; text-transform:uppercase; letter-spacing:.03em}
.pdf-itens td{padding:7px 8px; border-bottom:1px solid #eee; vertical-align:top}
.pdf-itens .c{text-align:center} .pdf-itens .r{text-align:right; font-variant-numeric:tabular-nums}
.pdf-totais{margin-top:14px}
.pdf-lin{display:flex; justify-content:space-between; padding:3px 0; font-size:13px; color:#333; font-variant-numeric:tabular-nums}
.pdf-lin.desc{color:#C4161C}
.pdf-total{display:flex; justify-content:space-between; margin-top:6px; padding-top:10px; border-top:2px solid #111; font-size:16px; font-weight:800}
.pdf-obs{margin-top:12px; font-size:12px; background:#f7f7f7; padding:8px 10px; border-radius:6px}
.pdf-foot{margin-top:20px; font-size:10px; color:#888; border-top:1px solid #eee; padding-top:8px}
@media print {
  .top, main, .scan-overlay, .update-bar, .bio-offer { display:none !important; }
  #print-area{ display:block !important; }
  body{ background:#fff; }
  @page { margin:14mm; }
}
/* Balão de alerta (reservas paradas há mais de 24h) — V2-005 */
.balao{
  display:inline-grid; place-items:center; min-width:20px; height:20px; padding:0 .35rem;
  margin-left:.4rem; border-radius:99px; background:var(--crit); color:#fff;
  font-size:.72rem; font-weight:800; font-variant-numeric:tabular-nums; vertical-align:middle;
}
.pi-idade{font-size:.75rem; color:var(--muted); font-variant-numeric:tabular-nums}
.pi-idade.alerta{color:var(--crit); font-weight:700}
.pedido-item.vencida{border-left:3px solid var(--crit)}
/* Cadastro de cliente no balcão (V2-004) */
/* O + fica colado na busca de cliente, como a câmera na busca de produto. */
.novo-cli-btn{font-size:1.6rem; font-weight:400; line-height:1; padding:0}
.cad-cli label{margin-bottom:.1rem}
.cc-linha{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:.7rem}
.cc-linha label{min-width:0}
.cad-cli input{width:100%; min-width:0}
.cc-end{font-size:.82rem; color:var(--muted); margin:.1rem 0 .2rem; min-height:1.1em}
.cc-end.ok{color:var(--ok)}

/* "Não tem inscrição": caixa larga, para o dedo acertar no balcão. */
.cc-check{display:flex;align-items:center;gap:.5rem;margin:.35rem 0 .1rem;
  font-size:.9rem;color:var(--ink)}
.cc-check input{width:1.15rem;height:1.15rem;flex:none}

/* CAPITAL (V2-017). Os três blocos têm cores DIFERENTES de propósito: eles
   nunca devem ser lidos como parcelas de uma soma. */
.cap-bloco .cap-topo{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem}
.cap-bloco h2{margin:0}
.cap-tot{font-size:1.35rem;font-weight:800;font-variant-numeric:tabular-nums}
.cap-pagar .cap-tot{color:var(--crit)}
.cap-receber .cap-tot{color:var(--ok)}
.cap-pendente .cap-tot{color:var(--muted)}
.cap-pendente{border:1px dashed var(--line)}
.cap-sub{margin:.2rem 0 0;color:var(--muted);font-size:.9rem}
.cap-linhas{margin-top:.5rem;display:flex;flex-direction:column;gap:.3rem}
.cap-l{display:flex;justify-content:space-between;gap:.6rem;font-size:.92rem}
.cap-l b{font-variant-numeric:tabular-nums}
.cap-l.urg b{color:var(--warn)}
.cap-l.ruim b{color:var(--crit)}
.cap-lista{display:flex;flex-direction:column;gap:.45rem;margin-top:.4rem}
.cap-item{display:flex;justify-content:space-between;gap:.7rem;align-items:center;
  border-bottom:1px solid var(--line);padding-bottom:.4rem}
.cap-item:last-child{border-bottom:0;padding-bottom:0}
.cap-item-txt{min-width:0;display:flex;flex-direction:column}
.cap-item-txt b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cap-item-txt span,.cap-item-nr span{font-size:.8rem;color:var(--muted)}
.cap-item-nr{text-align:right;flex:none;display:flex;flex-direction:column}
.cap-item-nr b{font-variant-numeric:tabular-nums}
.cap-item.ruim .cap-item-nr b{color:var(--crit)}

/* Seletor de dia da tela da equipe: as setas existem porque comparar dias
   seguidos é o uso real — abrir o calendário para andar um dia é lento. */
.eq-dia{display:flex;align-items:center;gap:.4rem;justify-content:center;margin:.5rem 0 .2rem}
.eq-dia input[type=date]{font:inherit;padding:.45rem .6rem;border:1px solid var(--line);
  border-radius:10px;background:var(--surface);color:var(--ink)}
.eq-seta{font-size:1.3rem;line-height:1;padding:.25rem .6rem;border:1px solid var(--line);
  border-radius:10px;background:var(--surface);color:var(--ink);cursor:pointer}
.eq-seta:disabled{opacity:.4}

/* Fila do CD (V2-016). A cor É o aviso: sem notificação por item, que no
   volume real daria 124 por dia e ninguém leria a centésima. */
.fila-lista{display:flex;flex-direction:column;gap:.4rem;margin-top:.4rem}
.fila-i{display:flex;justify-content:space-between;gap:.7rem;align-items:center;
  border-left:4px solid var(--line);padding:.45rem .6rem;border-radius:8px;
  background:var(--surface-2)}
.fila-i .txt{min-width:0;display:flex;flex-direction:column}
.fila-i .txt b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fila-i .txt span{font-size:.8rem;color:var(--muted)}
.fila-i .min{flex:none;font-weight:800;font-variant-numeric:tabular-nums;text-align:right}
.fila-i.amarelo{border-left-color:var(--warn)}
.fila-i.laranja{border-left-color:#E07B39}
.fila-i.vermelho{border-left-color:var(--crit)}
.fila-i.critico{border-left-color:var(--crit);background:var(--accent-soft)}
.fila-i.critico .min{color:var(--crit)}
.fila-badge{font-weight:800;font-size:.9rem;color:var(--crit)}

/* O que o número NÃO inclui, dentro do próprio cartão. Fora dele ninguém lê,
   e margem bruta lida como lucro é decisão errada tomada com número certo. */
.gv-naoinclui{margin:.6rem 0 0;padding-top:.5rem;border-top:1px solid var(--line);
  font-size:.78rem;line-height:1.35;color:var(--muted)}
.gv-naoinclui b{color:var(--ink)}

/* Margem de contribuição: a leitura é de cima para baixo, e as linhas de
   TOTAL precisam se destacar das parcelas — senão o dono soma o que não deve. */
.mg-card input[type=month]{font:inherit;padding:.35rem .5rem;border:1px solid var(--line);
  border-radius:8px;background:var(--surface);color:var(--ink)}
.mg-linhas{display:flex;flex-direction:column;gap:.1rem;margin-top:.6rem}
.mg-l{display:flex;justify-content:space-between;gap:.6rem;padding:.3rem 0;font-size:.92rem}
.mg-l .v{font-variant-numeric:tabular-nums;white-space:nowrap}
.mg-l .p{color:var(--muted);font-size:.78rem;margin-left:.4rem}
.mg-l.parcela{padding-left:1rem;color:var(--muted);font-size:.86rem}
.mg-l.soma{border-top:1px solid var(--line);font-weight:800;margin-top:.2rem;padding-top:.45rem}
.mg-l.destaque{background:var(--accent-soft);border-radius:8px;padding:.5rem .6rem;
  font-weight:800;margin-top:.4rem}
.mg-l.destaque.neg{color:var(--crit)}
.mg-l.destaque.pos{color:var(--ok)}
.mg-premissa{color:var(--warn)}

.mg-canais{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.5rem;margin-top:.7rem}
.mg-canal{background:var(--surface-2);border-radius:10px;padding:.5rem .6rem;
  display:flex;flex-direction:column;gap:.1rem;min-width:0}
.mg-canal b{font-size:.85rem}
.mg-canal span{font-variant-numeric:tabular-nums;font-weight:700}
.mg-canal .p{font-size:.75rem;color:var(--muted);font-weight:400}

/* Três blocos: quem PRODUZ e quem CONSOME. Separados em caixas para o dono
   nunca somar o que não deve — a receita do e-commerce não está aqui. */
.mg-bloco{border:1px solid var(--line);border-radius:12px;padding:.6rem .7rem;margin-top:.7rem}
.mg-bt{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.35rem}
.mg-bt span{font-size:.75rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.mg-br{display:flex;justify-content:space-between;gap:.6rem;font-size:.9rem;padding:.15rem 0}
.mg-br b{font-variant-numeric:tabular-nums;white-space:nowrap}
.mg-br.tot{border-top:1px solid var(--line);margin-top:.3rem;padding-top:.4rem;font-weight:800}
.mg-br.tot.ok b{color:var(--ok)}
.mg-br.tot.falta b{color:var(--crit)}

.rsv-pedi{font-size:.72rem;color:var(--warn);font-weight:700}
.fila-i .min .btn.small{margin-top:.25rem;padding:.2rem .5rem;font-size:.75rem}

/* ---------- RADAR DE VENDAS-BALCÃO (ritmo, prioridades, orçamentos) ---------- */
/* O cabeçalho com selo/badge era usado sem regra: título e selo empilhavam. */
.card > .cap-topo{display:flex; justify-content:space-between; align-items:baseline; gap:.6rem}
.rb-topo{display:flex; align-items:flex-end; justify-content:space-between; gap:.8rem}
.rb-topo .dz-big{font-size:1.9rem}
.rb-selo{font-size:.8rem; font-weight:800; padding:.25rem .5rem; border-radius:8px; white-space:nowrap}
.rb-selo.abaixo{background:var(--accent-soft); color:var(--crit)}
.rb-selo.acima{background:var(--ok-soft); color:var(--ok)}
.rb-selo.neutro{background:var(--surface-2); color:var(--muted)}
.rb-graf{width:100%; height:auto; display:block}
.rb-leg{display:flex; flex-wrap:wrap; gap:.9rem; font-size:.74rem; color:var(--muted)}
.rb-leg span{display:inline-flex; align-items:center; gap:.35rem}
.rb-leg i{width:14px; height:3px; border-radius:2px; display:block}
.rb-leg .rb-i-hoje{background:var(--crit)}
.rb-leg .rb-i-base{background:var(--cd)}
.rb-proj{
  display:flex; justify-content:space-between; gap:.6rem; font-size:.82rem;
  border-top:1px dashed var(--line); padding-top:.55rem; font-variant-numeric:tabular-nums;
}

/* Cartão de prioridade: peso (R$ em jogo) à esquerda, fato/conta/ação à direita.
   A cor da barra é a gravidade, e o texto nunca depende só dela. */
.rb-pri{
  display:grid; grid-template-columns:auto 1fr; gap:.5rem .7rem; align-items:start;
  border:1px solid var(--line); border-left:3px solid var(--rb-cor,var(--accent));
  border-radius:10px; padding:.6rem .7rem; margin-top:.55rem;
}
.rb-pri:first-child{margin-top:0}
.rb-pri.alerta{--rb-cor:var(--crit)}
.rb-pri.atencao{--rb-cor:var(--warn)}
.rb-pri.info{--rb-cor:var(--cd)}
.rb-pri .peso{
  font-size:.8rem; font-weight:800; color:var(--rb-cor,var(--accent));
  font-variant-numeric:tabular-nums; white-space:nowrap;
}
.rb-pri .corpo{display:flex; flex-direction:column; gap:.2rem; min-width:0}
.rb-pri .fato{font-size:.88rem; font-weight:700; letter-spacing:-.01em}
.rb-pri .porque{font-size:.78rem; color:var(--muted)}
.rb-pri .acao{font-size:.79rem; font-weight:700; color:var(--rb-cor,var(--accent))}
.rb-pri .acao::before{content:"→ "; font-weight:400}

.rb-kpi{display:grid; grid-template-columns:1fr 1fr; gap:.5rem; text-align:center}
.rb-kpi div{background:var(--surface-2); border-radius:10px; padding:.5rem .3rem}
.rb-kpi b{display:block; font-size:1.05rem; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.rb-kpi span{font-size:.7rem; color:var(--muted)}
.rb-orc-l{
  display:grid; grid-template-columns:1fr auto; gap:.1rem .6rem; align-items:center;
  padding:.5rem 0; border-top:1px solid var(--line);
}
.rb-orc-l:first-child{border-top:0}
.rb-orc-l .nm{font-size:.86rem; font-weight:650; letter-spacing:-.01em}
.rb-orc-l .vl{grid-row:1/3; font-size:.95rem; font-weight:800; text-align:right; font-variant-numeric:tabular-nums}
.rb-orc-l .mt{font-size:.73rem; color:var(--muted); grid-column:1}
.rb-orc-l .idade{
  display:inline-block; font-size:.68rem; font-weight:800; padding:.02rem .3rem;
  border-radius:5px; background:var(--warn-soft); color:var(--warn); margin-left:.3rem;
}
.rb-orc-l .idade.quente{background:var(--accent-soft); color:var(--crit)}

/* Férias e afastamentos (apontados pela gerência) */
.rb-fer-l{
  display:grid; grid-template-columns:1fr auto auto; gap:.1rem .5rem; align-items:center;
  padding:.45rem 0; border-top:1px solid var(--line); font-size:.85rem;
}
.rb-fer-l:first-child{border-top:0}
.rb-fer-l .nm{font-weight:650}
.rb-fer-l .per{font-size:.75rem; color:var(--muted); font-variant-numeric:tabular-nums}
.rb-fer-l.vig .per{color:var(--cd); font-weight:700}
.rb-fer-l .link{background:none; border:0; color:var(--muted); font-size:1rem; cursor:pointer; padding:.1rem .3rem}
.rb-fer-form{display:flex; flex-direction:column; gap:.5rem; margin-top:.7rem;
  border-top:1px dashed var(--line); padding-top:.7rem}
.rb-fer-datas{display:flex; gap:.5rem}
.rb-fer-datas label{flex:1; font-size:.78rem; color:var(--muted); font-weight:600}
.eq-badge.fer{background:var(--cd-soft); color:var(--cd)}

/* Parado na prateleira */
.rb-par-l{
  display:grid; grid-template-columns:1fr auto; gap:.1rem .6rem; align-items:center;
  padding:.5rem 0; border-top:1px solid var(--line);
}
.rb-par-l:first-child{border-top:0}
.rb-par-l .nm{font-size:.84rem; font-weight:650; letter-spacing:-.01em}
.rb-par-l .vl{grid-row:1/3; font-size:.92rem; font-weight:800; text-align:right; font-variant-numeric:tabular-nums}
.rb-par-l .mt{grid-column:1; font-size:.73rem; color:var(--muted)}
.rb-par-l .mt b{color:var(--warn)}
.rb-par-l .mt b.nunca{color:var(--crit)}

/* ---- Consulta rápida de preço (ficha do produto) ---- */
.cons-ficha{display:flex; flex-direction:column; gap:.6rem}
.cf-topo{display:flex; flex-direction:column; gap:.15rem}
.cf-desc{font-size:1.02rem; line-height:1.25}
.cf-meta{font-size:.74rem; color:var(--muted)}
.cf-selo{align-self:flex-start; font-size:.7rem; font-weight:700; color:var(--muted);
  background:var(--surface-2); border:1px solid var(--line); border-radius:999px; padding:.15rem .55rem}
.cf-selo.ok{color:var(--ok); border-color:color-mix(in srgb,var(--ok) 40%,var(--line))}
.cf-selo.off{color:var(--warn)}
.cf-precos{display:flex; flex-direction:column; gap:.3rem}
/* O preço é a resposta da pergunta: a unidade-base vem grande, o resto apoia. */
.cf-preco{display:flex; justify-content:space-between; align-items:baseline; gap:.6rem;
  padding:.4rem .6rem; border-radius:10px; background:var(--surface-2); font-size:.9rem}
.cf-preco b{font-variant-numeric:tabular-nums}
.cf-preco.base{background:var(--accent-soft); color:var(--accent-ink)}
.cf-preco.base b{font-size:1.5rem; font-weight:800; letter-spacing:-.02em}
.cf-fator{color:var(--muted); font-size:.76rem}
.cf-disp{font-size:.9rem; color:var(--muted)}
.cf-disp b{color:var(--text)}

/* Balão de explicação (V2-023). O dono lê no celular: o título vira botão e a
   explicação nasce colada na linha, não num rodapé que ninguém liga ao número. */
.mg-q{background:none; border:0; padding:0; font:inherit; color:inherit; text-align:left;
  border-bottom:1px dotted var(--muted); cursor:pointer}
.mg-q::after{content:"?"; font-size:.62em; font-weight:800; color:var(--accent);
  vertical-align:super; margin-left:.15rem}
.mg-q:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:3px}
.mg-balao{background:var(--surface-2); border:1px solid var(--line); border-radius:10px;
  padding:.6rem .7rem; margin:.3rem 0 .5rem; font-size:.82rem; line-height:1.5; color:var(--ink)}

/* Caixa do mês: venceu × saiu. Quatro colunas fixas para os números alinharem
   entre as linhas — se a família tiver nome longo, ela que quebra. */
.cx-h3{margin:1rem 0 .35rem; font-size:.95rem}
.cx-tab{display:flex; flex-direction:column; gap:.15rem}
.cx-cf{display:grid; grid-template-columns:minmax(0,1.4fr) repeat(3, minmax(0,1fr));
  gap:.4rem; font-size:.84rem; padding:.3rem 0; border-bottom:1px solid var(--line)}
.cx-cf b{text-align:right; font-variant-numeric:tabular-nums; font-weight:600}
.cx-cf.cab{color:var(--muted); font-size:.72rem; text-transform:uppercase;
  letter-spacing:.04em; border-bottom:1px solid var(--muted)}
.cx-cf.cab b{font-weight:700}
.cx-cf.deve b:last-child{color:var(--crit); font-weight:800}

/* Alerta de qualidade do dado (V2-024). Amarelo e não vermelho: não é dívida
   nem prejuízo, é lançamento para arrumar — e o card só existe quando há o quê. */
.cap-alerta{border:1px solid var(--warn); background:var(--warn-soft)}
.cap-alerta h2, .cap-alerta .cap-tot{color:var(--warn)}

/* ---- Promoção (de/por, validade) ---- */
.promo-box{display:flex; flex-wrap:wrap; align-items:baseline; gap:.4rem .55rem;
  background:color-mix(in srgb,var(--ok) 12%,var(--surface-2)); border:1px solid color-mix(in srgb,var(--ok) 35%,var(--line));
  border-radius:10px; padding:.45rem .6rem; margin:.1rem 0}
.promo-box.mini{padding:.3rem .45rem}
.pr-tag{font-size:.62rem; font-weight:800; letter-spacing:.08em; color:#fff;
  background:var(--ok); border-radius:999px; padding:.1rem .45rem}
.pr-tag.mini{font-size:.58rem; padding:.05rem .35rem}
/* O preço "de" só faz sentido riscado: é o que o cliente NÃO vai pagar. */
.pr-de,.po-de{text-decoration:line-through; color:var(--muted); font-size:.82rem}
.pr-por{font-size:.95rem}
.pr-por b{font-size:1.15rem; font-weight:800; color:var(--ok); letter-spacing:-.02em}
.po-promo{color:var(--ok); font-weight:800}
.pr-val{font-size:.72rem; color:var(--muted)}
.pr-qtd{font-size:.72rem; color:var(--warn)}
.pr-nome{font-size:.72rem; color:var(--muted); width:100%}
.tot-linha.promocao b{color:var(--ok)}

/* ---- Posição do vendedor (sem ranking: só o lugar dele) ---- */
.dz-pos{margin:.35rem 0 0; align-self:flex-start; font-size:.82rem; font-weight:600;
  color:#fff; background:rgba(255,255,255,.18); border-radius:999px; padding:.2rem .6rem}
.dz-pos b{font-size:1rem; font-weight:800}
.dz-pos.podio{background:rgba(255,255,255,.3)}
.dz-pos.neutro{font-weight:500; opacity:.9}

/* ---- Caminho da mercadoria (clique no produto parado) ---- */
.rb-par-l[data-extrato]{cursor:pointer}
.rb-par-l[data-extrato]:active{background:var(--surface-2)}
.rb-sku{font-size:.68rem; font-weight:700; color:var(--muted);
  background:var(--surface-2); border-radius:6px; padding:.05rem .3rem; margin-right:.25rem}
.rb-cam{grid-column:1/-1; margin-top:.5rem; border-top:1px dashed var(--line); padding-top:.5rem}
.cam-tab{width:100%; border-collapse:collapse; font-size:.8rem}
.cam-tab th{font-size:.68rem; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-weight:700}
.cam-tab td{padding:.3rem .35rem; border-bottom:1px solid var(--line)}
.cam-tab .num{text-align:right; font-variant-numeric:tabular-nums; font-weight:700}
.cam-tab .cap{display:block; font-size:.62rem; font-weight:500; color:var(--muted); text-transform:uppercase}
.cam-tab tr.dep td{background:color-mix(in srgb,#c8922a 10%,transparent)}
.cam-tab tr.bal td{background:color-mix(in srgb,#0C447C 10%,transparent)}
.cam-tab tr.bli td{background:color-mix(in srgb,#0F6E56 12%,transparent)}
.cam-tab tr.sal td{background:var(--surface-2); font-size:.75rem}
.cam-alerta{margin-top:.4rem; font-size:.76rem; color:var(--warn)}
.cam-vazio{font-size:.8rem; color:var(--muted)}
.cam-periodo{margin-top:.45rem}

/* ---- "Só no CD": um produto por vez ---- */
.cd-nome{font-size:1rem; font-weight:600; margin:.1rem 0 .1rem; line-height:1.3}
.cd-sku{font-size:.72rem; color:var(--muted); margin:0 0 .7rem}
.cd-saldos{display:grid; grid-template-columns:1fr 1fr; gap:.5rem; margin-bottom:.6rem}
.cd-s{border-radius:10px; padding:.5rem .65rem; display:flex; flex-direction:column; gap:.1rem}
.cd-s .rot{font-size:.68rem; text-transform:uppercase; letter-spacing:.06em; font-weight:700; opacity:.75}
.cd-s b{font-size:1.15rem; letter-spacing:-.02em}
.cd-s.zero{background:color-mix(in srgb,var(--erro,#C4161C) 12%,transparent); color:var(--erro,#C4161C)}
.cd-s.tem{background:color-mix(in srgb,var(--ok) 14%,transparent); color:var(--ok)}
.cd-venda{font-size:.85rem; color:var(--muted); margin:0 0 .6rem; line-height:1.5}
.cd-venda b{color:var(--text)}
.cd-jape{font-size:.8rem; color:var(--warn); margin:0 0 .6rem}
.cd-acao{display:flex; align-items:flex-end; gap:.5rem; flex-wrap:wrap; border-top:1px solid var(--line); padding-top:.7rem}
.cd-acao .mini{flex:0 0 auto}
.cd-acao input{width:88px}
.cd-acao .btn{flex:1 1 auto; margin:0}
.cd-rodape{margin:.5rem 0 0}
.cd-verif{margin-top:.6rem; border-top:1px dashed var(--line); padding-top:.55rem}
.cd-sol{display:flex; justify-content:space-between; gap:.6rem; padding:.4rem 0; border-bottom:1px solid var(--line); font-size:.8rem}
.cd-sol .txt span{display:block; font-size:.72rem; color:var(--muted)}
.cd-sol .st{text-align:right; font-size:.72rem; color:var(--muted); white-space:nowrap}
.cd-sol .st .atraso{color:var(--warn); font-weight:700}
/* "Abaixo do ritmo": o gerente precisa de um número, não de um adjetivo. */
.eq-att{align-items:flex-start}
.att-quem{display:flex; flex-direction:column; gap:.15rem; flex:1 1 auto; min-width:0}
.att-falta{font-size:.74rem; color:var(--muted); line-height:1.45}
.att-falta b{color:var(--warn)}

/* ---- Cartões recolhíveis: o cabeçalho (com o aviso) sempre fica ---- */
#view-equipe .card.recolhivel > .cap-topo,
#view-equipe .card.recolhivel > h2{cursor:pointer; user-select:none}
#view-equipe .card.recolhivel > .cap-topo::after,
#view-equipe .card.recolhivel > h2::after{content:"⌄"; margin-left:.4rem; color:var(--muted); font-size:.9rem}
#view-equipe .card.recolhido > .cap-topo::after,
#view-equipe .card.recolhido > h2::after{content:"›"}
#view-equipe .card.recolhido > *:not(.cap-topo):not(h2){display:none}
#view-equipe .card.recolhido{padding-bottom:.7rem}
/* Aviso de retorno de férias: é a informação que muda a escala de amanhã. */
.fila-badge.volta{color:var(--ok); font-weight:700}
/* Navegação ‹ › entre os produtos do "Só no CD" */
.cd-nav{background:none; border:1px solid var(--line); color:var(--text); border-radius:8px;
  width:26px; height:26px; line-height:1; font-size:1rem; cursor:pointer; padding:0}
.cd-nav[disabled]{opacity:.35; cursor:default}
.cd-cont{margin:0 .45rem; font-size:.78rem; color:var(--muted)}

/* ---- Rentabilidade: margem x desconto (v120) ----
   As duas linhas compartilham o MESMO eixo, a partir do zero. Com eixos
   separados um desconto de 8% pareceria do tamanho de uma margem de 47%. */
.gv-desc { font-size: 1.5rem; font-weight: 700; color: var(--warn); line-height: 1.1; }
.gv-fat { margin: 2px 0 6px; }
.gv-graf { width: 100%; height: auto; display: block; margin: 2px 0 4px; overflow: visible; }
.gv-graf .gx { stroke: var(--line); stroke-width: 1; }
.gv-graf .gy, .abc-graf .gy { fill: var(--muted); font-size: 9px; text-anchor: end; }
.gv-graf .gx-l, .abc-graf .gx-l { fill: var(--muted); font-size: 9px; }
/* Leitura de bolsa: a SETA diz o rumo, a COR diz se e bom para a loja.
   Desconto que sobe fica vermelho, e nao verde como no pregao. */
.gv-graf .sg { stroke-linecap: round; }
.gv-graf .sg-m { stroke-width: 2.6; }
.gv-graf .sg-d { stroke-width: 2; stroke-dasharray: 5 3; }
.gv-graf .sg.boa, .gv-graf .st.boa { stroke: var(--ok); fill: var(--ok); }
.gv-graf .sg.ruim, .gv-graf .st.ruim { stroke: var(--crit); fill: var(--crit); }
.gv-graf .sg.igual, .gv-graf .st.igual { stroke: var(--muted); fill: var(--muted); }
.gv-graf .st { stroke-width: 0; }
.gv-graf .gp-m { fill: var(--ok); }
.gv-graf .gp-d { fill: var(--warn); }
.gv-var { font-weight: 700; margin-left: 4px; white-space: nowrap; }
.gv-var.boa { color: var(--ok); }
.gv-var.ruim { color: var(--crit); }
.gv-var.igual { color: var(--muted); font-weight: 400; }
.gv-regra { margin: 4px 0 0; line-height: 1.35; }
.gv-regra .boa { color: var(--ok); }
.gv-regra .ruim { color: var(--crit); }
.gv-leg2 { display: flex; align-items: center; gap: 14px; font-size: .78rem; color: var(--muted); }
.gv-leg2 i { display: inline-block; width: 14px; height: 3px; border-radius: 2px; margin-right: 5px; vertical-align: middle; }
.gv-leg2 .lm { background: var(--ink); height: 3px; }
.gv-leg2 .ld { background: none; height: 0; border-top: 3px dashed var(--ink); }
.gv-leg2 .gv-dias { margin-left: auto; }
.gv-corr { margin: 6px 0 0; line-height: 1.35; }

/* ---- Curva ABC por categoria (v120) ---- */
.abc-frase { margin: 0 0 6px; line-height: 1.35; }
.abc-graf { width: 100%; height: auto; display: block; overflow: visible; }
.abc-graf .abc-linha { fill: none; stroke: var(--cd); stroke-width: 2; stroke-linejoin: round; }
.abc-graf .abc-80 { stroke: var(--muted); stroke-width: 1; stroke-dasharray: 3 3; }
.abc-graf .abc-corte { stroke: var(--warn); stroke-width: 1; stroke-dasharray: 3 3; }

/* ---- Ajuste de Estoque ---- */
.ajuste-item {
  background: var(--surface-2); border: 1px solid var(--line); border-radius: 10px;
  padding: .8rem; display: flex; flex-direction: column; gap: .6rem;
}
.ajuste-desc {
  font-weight: 600; color: var(--ink); font-size: .95rem;
}
.ajuste-saldo {
  display: flex; align-items: center; justify-content: space-between;
  font-size: .88rem; color: var(--muted);
}
.ajuste-negativo {
  font-weight: 700; color: var(--crit); font-size: 1.1rem;
}
.ajuste-deficit {
  font-weight: 700; color: var(--warn); font-size: 1.05rem;
}
.ajuste-info {
  font-size: .8rem; color: var(--muted);
}

/* Modal de Ajuste */
.modal {
  position: fixed; inset: 0; z-index: 100;
  background: rgba(0, 0, 0, .7); display: flex;
  align-items: center; justify-content: center; padding: 1rem;
}
.modal[hidden] { display: none !important; }
.modal-content {
  background: var(--surface); border-radius: var(--radius);
  box-shadow: 0 20px 60px rgba(0, 0, 0, .3);
  max-width: 450px; width: 100%;
  display: flex; flex-direction: column; max-height: 90vh;
}
.modal-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.2rem; border-bottom: 1px solid var(--line);
}
.modal-header h2 {
  margin: 0; font-size: 1.2rem;
}
.modal-close {
  background: transparent; border: 0; color: var(--muted);
  font-size: 1.5rem; cursor: pointer; padding: 0;
  width: 36px; height: 36px; display: grid; place-items: center;
}
.modal-close:hover { color: var(--ink); }
.modal-body {
  padding: 1.2rem; overflow-y: auto; flex: 1;
  display: flex; flex-direction: column; gap: .8rem;
}
.modal-footer {
  display: flex; gap: .8rem; padding: 1rem;
  border-top: 1px solid var(--line);
}
.modal-footer .btn { margin: 0; }

.form-group {
  display: flex; flex-direction: column; gap: .4rem;
}
.form-group label {
  margin: 0; font-weight: 600; font-size: .9rem; color: var(--ink);
}
.form-readonly {
  padding: .7rem .8rem; background: var(--surface-2);
  border: 1px solid var(--line); border-radius: 8px;
  font-size: .95rem; color: var(--ink); min-height: 2.3rem;
  display: flex; align-items: center;
}
.form-row {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: .8rem;
}
@media (max-width: 480px) {
  .form-row { grid-template-columns: 1fr; }
}
.abc-faixas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 10px 0 4px; }
.abc-f { background: var(--surface-2); border-radius: 10px; padding: 8px; text-align: center; }
.abc-f b { display: block; font-size: .8rem; }
.abc-f.A b { color: var(--ok); }
.abc-f.B b { color: var(--warn); }
.abc-f.C b { color: var(--muted); }
.abc-f .q { display: block; font-size: 1.25rem; font-weight: 700; }
.abc-f .s { display: block; font-size: .68rem; color: var(--muted); line-height: 1.25; }
.abc-topo .li { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-top: 1px solid var(--line); }
.abc-topo .cl { flex: 0 0 20px; height: 20px; line-height: 20px; text-align: center; border-radius: 6px;
  font-size: .7rem; font-weight: 700; background: var(--surface-2); }
.abc-topo .cl.A { color: var(--ok); }
.abc-topo .cl.B { color: var(--warn); }
.abc-topo .cl.C { color: var(--muted); }
.abc-topo .t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .85rem; }
.abc-topo .m { text-align: right; font-size: .85rem; font-weight: 600; }
.abc-topo .m i { display: block; font-style: normal; font-size: .68rem; font-weight: 400; color: var(--muted); }

/* Aviso sobre o DOCUMENTO (frete): pede acao ANTES de o cliente ir ao caixa. */
.aviso.doc { border-color: var(--crit); background: var(--accent-soft); }
.aviso.doc b { color: var(--crit); }

/* ---- Registro de uso do app ---- */
.reg-filtro { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; margin: 4px 0 12px; }
.reg-filtro label { font-size: .78rem; color: var(--muted); display: flex; flex-direction: column; gap: 3px; }
.reg-filtro input { padding: 7px 9px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--surface); color: var(--ink); font-size: .9rem; }
.reg-vend { margin-bottom: 14px; }
.reg-cab { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline;
  padding-bottom: 5px; border-bottom: 1px solid var(--line); }
.reg-cab span { font-size: .8rem; color: var(--muted); }
.reg-cab i { font-style: normal; color: var(--ok); font-weight: 600; }
.reg-dia { display: grid; grid-template-columns: 3.2rem 1fr auto auto; gap: 10px; align-items: center;
  padding: 8px 0; border-bottom: 1px solid var(--line); cursor: pointer; font-size: .87rem; }
.reg-dia:hover { background: var(--surface-2); }
.reg-dia .dt { color: var(--muted); font-variant-numeric: tabular-nums; }
.reg-dia .hr { font-variant-numeric: tabular-nums; }
.reg-dia .con { font-variant-numeric: tabular-nums; color: var(--muted); min-width: 4.2rem; text-align: right; }
.reg-dia .atv { font-variant-numeric: tabular-nums; color: var(--ok); font-weight: 600;
  min-width: 4.2rem; text-align: right; }
.reg-legenda { display: flex; gap: 14px; flex-wrap: wrap; font-size: .74rem; color: var(--muted); padding-top: 8px; }
.reg-legenda .con::before, .reg-legenda .atv::before { content: "■ "; }
.reg-legenda .atv { color: var(--ok); }
.reg-regua { line-height: 1.45; margin-top: 12px; }

/* Aviso de publicação revertida — gerência, no alto da home. */
.aviso-deploy { display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
  border: 1px solid var(--crit); background: var(--accent-soft); border-radius: var(--radius);
  padding: 12px 14px; margin: 10px 0; }
.aviso-deploy .ad-txt { flex: 1; min-width: 220px; font-size: .9rem; line-height: 1.4; }
.aviso-deploy b { display: block; color: var(--crit); font-size: .95rem; }
.aviso-deploy .ad-quando { display: block; color: var(--muted); font-size: .78rem; margin-top: 3px; }

/* Por que este produto esta na lista de conferencia. */
.ajuste-motivo-tag { display: inline-block; font-size: .68rem; padding: 1px 6px; margin: 2px 4px 0 0;
  border-radius: 999px; background: var(--surface-2); color: var(--muted); }
.ajuste-motivo-tag.forte { background: var(--accent-soft); color: var(--crit); font-weight: 600; }
.ajuste-quem { display: block; font-size: .7rem; color: var(--muted); margin-top: 2px; }

/* Busca de produto para ajustar: o campo vem antes da lista de suspeitos. */
.ajuste-busca { display: flex; gap: 8px; margin: 6px 0 10px; }
.ajuste-busca input { flex: 1; padding: 10px 12px; border: 1px solid var(--line);
  border-radius: 10px; background: var(--surface); color: var(--ink); font-size: 1rem; }
.ajuste-busca .btn { padding: 8px 12px; }
.ajuste-achado { display: flex; align-items: center; gap: 10px; padding: 9px 0;
  border-bottom: 1px solid var(--line); }
.ajuste-achado .aa-desc { flex: 1; min-width: 0; font-size: .88rem; }
.ajuste-achado .aa-desc b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ajuste-achado .aa-desc span { font-size: .74rem; color: var(--muted); }
#ajuste-sub { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); }