/* Kerfline – identidade visual (design system "Kerfline"): verde-abeto, laranja-resina e casca sobre serragem.
   Tema escuro (padrão) e claro; cores só por variáveis. Fontes servidas pelo próprio servidor (a CSP não deixa usar fontes externas):
   Archivo largo (títulos e indicadores), IBM Plex Sans (interface) e IBM Plex Mono (valores, datas, placas, km). Licenças em fonts/. */
@font-face{font-family:"Archivo";src:url(../fonts/archivo-latin-wdth.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url(../fonts/ibm-plex-sans-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url(../fonts/ibm-plex-sans-600.woff2) format("woff2");font-weight:500 800;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(../fonts/ibm-plex-mono-500.woff2) format("woff2");font-weight:400 500;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(../fonts/ibm-plex-mono-600.woff2) format("woff2");font-weight:600 800;font-style:normal;font-display:swap}
:root{
  /* escuro: sawdust #15130F · sawdust-deep #0D0C0A · paper #1F1C17 · bark #F1EBE0 · spruce #7FB3A6 · resin #F08A3C */
  --bg:#15130F;--nav:#0D0C0A;--card:#1F1C17;--card2:#26221C;--line:#36322A;--line2:#7D7563;
  --ink:#F1EBE0;--mut:#ADA493;--fraco:#8F8676;
  --g:#7FB3A6;--g2:#1B2E2A;--g3:#3A5C54;--g-ink:#0F1E1A;--g-hover:#9CC8BD;
  --amb:#E0B04A;--amb2:#3A2C0C;--amb-ink:#E0B04A;
  --red:#EE8FA2;--red2:#3D1621;
  --resin:#F08A3C;--resin-text:#F08A3C;--resin2:#3A2210;
  --inflow:#6FB7D9;--inflow2:#14303D;--outflow:#EE8FA2;--outflow2:#3D1621;
  --fsc:#7cc46a;--fsc2:rgba(124,196,106,.14);
  --serie-fsc:#5aa84a;--serie-nao:#4f8ad0;
  --qp-ok:#23864c;--qp-par:#c4372c;   /* botões Iniciar/Parar (texto branco legível nos dois temas) */   /* barras do pátio (validadas: banda, CVD e contraste no fundo escuro) */
  --campo:#1F1C17;--sombra:none;--sombra-float:0 2px 8px rgba(0,0,0,.5);
  --disp:"Archivo","Segoe UI",system-ui,sans-serif;
  --sans:"IBM Plex Sans","Segoe UI",system-ui,sans-serif;
  --mono:"IBM Plex Mono",Consolas,ui-monospace,monospace;
  --r-sm:2px;--r-md:6px;--r-lg:10px;
  color-scheme:dark;
}
[data-tema="claro"]{
  /* claro: sawdust #F4EEE3 · sawdust-deep #E8DFCF · paper #FFF · bark #211E1A · spruce #24433C · resin #E07A22 */
  --bg:#F4EEE3;--nav:#E8DFCF;--card:#FFFFFF;--card2:#FAF6EF;--line:#DDD4C4;--line2:#8A806F;
  --ink:#211E1A;--mut:#5D564B;--fraco:#6E665A;
  --g:#24433C;--g2:#DCE6E2;--g3:#A9C2BA;--g-ink:#FFFFFF;--g-hover:#18302A;
  --amb:#8A5A00;--amb2:#F5E8C8;--amb-ink:#8A5A00;
  --red:#A3304A;--red2:#F7E3E8;
  --resin:#E07A22;--resin-text:#A4520F;--resin2:#FBE7D4;
  --inflow:#1D6A8C;--inflow2:#DDEBF2;--outflow:#A3304A;--outflow2:#F7E3E8;
  --fsc:#3d7f2e;--fsc2:#e6f2e1;--serie-fsc:#3d7f2e;--serie-nao:#2f6aa8;
  --campo:#FFFFFF;--sombra:none;--sombra-float:0 2px 8px rgba(33,30,26,.12);color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{background:var(--bg)}
body{margin:0;font:14.5px/1.5 var(--sans);font-stretch:112%;color:var(--ink)}
a{color:var(--g)}
::selection{background:var(--g3)}

/* ---------- estrutura e menu lateral ---------- */
#app{display:grid;grid-template-columns:250px 1fr;min-height:100vh}
nav{background:var(--nav);color:var(--ink);padding:18px 10px 24px;position:sticky;top:0;height:100vh;overflow:auto;border-right:1px solid var(--line)}
nav::-webkit-scrollbar{width:8px}nav::-webkit-scrollbar-thumb{background:var(--line2);border-radius:var(--r-md)}
nav .brand{display:flex;flex-direction:column;gap:6px;align-items:flex-start;padding:4px 10px 16px;margin-bottom:6px;border-bottom:1px solid var(--line)}
nav .brand img{width:150px;height:auto;display:block}nav .brand .logo-claro{display:none}[data-tema="claro"] nav .brand .logo-claro{display:block}[data-tema="claro"] nav .brand .logo-escuro{display:none}
nav .brand b{display:none}

nav .brand small{display:block;font-size:10.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--mut);margin-top:3px;max-width:170px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
nav .mod{display:flex;align-items:center;gap:8px;width:100%;text-align:left;background:none;border:0;color:var(--ink);font:inherit;font-family:var(--disp);padding:9px 10px;margin-top:4px;font-size:15.5px;letter-spacing:.3px;font-weight:600;border-radius:var(--r-md)}

nav .mod .mod-ic{width:18px;text-align:center;color:var(--g);font-size:14px;flex:none}
nav button.mod{cursor:pointer;transition:background .12s}
nav button.mod::after{content:'›';margin-left:auto;font-size:18px;color:var(--mut);transform:rotate(0);transition:transform .15s}
nav button.mod.aberto::after{transform:rotate(90deg)}
nav button.mod:hover{background:color-mix(in srgb,var(--ink) 6%,transparent)}
nav button.mod.aberto{color:var(--ink)}
nav .mod-corpo{margin:0 0 6px 18px;padding-left:2px;border-left:1px solid var(--line2)}
nav .mod-corpo a{padding:6px 8px;font-size:13.5px}
nav .mod-corpo .submod{padding:8px 8px 2px}
nav .mod.na-secao{padding-left:12px}
nav .mod-corpo.na-secao{margin-left:21px}
nav .secao{margin:16px 6px 2px;padding-top:12px;border-top:1px solid var(--line);font-family:var(--disp);font-size:12px;letter-spacing:2.2px;text-transform:uppercase;color:var(--g);font-weight:700}
nav .secao-fim{margin:12px 6px 4px;border-top:1px solid var(--line)}
nav .submod{padding:8px 12px 2px;font-size:11px;color:var(--mut);text-transform:uppercase;letter-spacing:1px;font-weight:600}
nav a.atalho span{color:var(--g);font-weight:600}
nav a{display:flex;align-items:center;gap:8px;color:var(--mut);text-decoration:none;padding:7px 12px;margin:1px 0;font-size:14px;border-radius:var(--r-md);border-left:3px solid transparent}

nav a .cnt{margin-left:auto;font-family:var(--mono);font-size:11.5px;color:var(--fraco)}
nav a:hover{background:color-mix(in srgb,var(--ink) 5%,transparent);color:var(--ink)}
nav a.on{background:var(--g2);color:var(--g);font-weight:600;border-left-color:var(--g)}
nav a.top{font-weight:500}
main{padding:22px 34px 70px;min-width:0;max-width:1500px}
#topo{display:flex;align-items:center;gap:10px;justify-content:flex-end;margin:-6px 0 16px;font-size:13px;color:var(--mut)}
#topo b{color:var(--ink)}
#topo button{padding:5px 11px;font-size:12.5px}

/* ---------- títulos e textos ---------- */
h1{font-family:var(--disp);font-size:26px;font-weight:700;letter-spacing:-.25px;margin:0 0 6px;color:var(--ink);line-height:32px}

h2{font-family:var(--disp);font-size:14px;font-weight:600;letter-spacing:1.3px;text-transform:uppercase;margin:26px 0 10px;color:var(--mut)}
.sub{color:var(--mut);margin:0 0 18px;max-width:900px}
.small{font-size:12px;color:var(--mut)}
.bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.bar .sp{flex:1}

/* ---------- botões e campos ---------- */
button,.btn{font:inherit;font-size:14px;border:1px solid var(--line2);background:var(--card);border-radius:var(--r-md);padding:8px 16px;cursor:pointer;color:var(--ink);text-decoration:none;display:inline-block}
button:hover,.btn:hover{border-color:var(--g)}
button.pri,a.btn.pri{background:var(--g);border-color:var(--g);color:var(--g-ink);font-weight:700}
button.pri:hover,a.btn.pri:hover{background:var(--g-hover);border-color:var(--g-hover)}
button.del{color:var(--red);border-color:color-mix(in srgb,var(--red) 45%,transparent);background:transparent}
button:disabled{opacity:.5;cursor:default}
input,select,textarea{font:inherit;border:1px solid var(--line2);border-radius:var(--r-md);padding:8px 12px;min-height:40px;background:var(--campo);width:100%;color:var(--ink)}
input[type=number],input[type=date],input[type=month],input[type=time]{font-family:var(--mono);font-size:13.5px}
input:focus,select:focus,textarea:focus{outline:2px solid var(--g);outline-offset:2px;border-color:var(--g)}
:focus-visible{outline:2px solid var(--g);outline-offset:2px}
optgroup{font-style:normal;font-weight:700;color:var(--mut)}
option{color:var(--ink);background:var(--card)}

/* ---------- cartões, tabelas e formulários ---------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px}
table.lst{width:100%;border-collapse:separate;border-spacing:0;background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
table.lst th{background:var(--card2);color:var(--mut);text-align:left;font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;padding:10px 12px;white-space:nowrap;border-bottom:1px solid var(--line)}
table.lst td{padding:9px 12px;border-top:1px solid var(--line);font-size:13.5px;vertical-align:top}
table.lst tr:nth-child(2) td{border-top:0}
table.lst td.n{font-family:var(--mono);font-size:13px}
table.lst tr.clk:hover td{background:color-mix(in srgb,var(--g) 8%,transparent);cursor:pointer}
table.lst th.ord{cursor:pointer;user-select:none}
table.lst th.ord i{font-style:normal;margin-left:5px;opacity:.35;font-size:10px}
table.lst th.ord:hover i,table.lst th.ord.ativo i{opacity:1;color:var(--g)}
table.lst th.ord.ativo{color:var(--ink)}
.seg{display:inline-flex;border:1px solid var(--line2);border-radius:10px;overflow:hidden;margin:0 0 14px}
.seg a{padding:7px 16px;text-decoration:none;color:var(--mut);font-size:13.5px;border-right:1px solid var(--line2)}
.seg a:last-child{border-right:0}
.seg a.on{background:var(--g2);color:var(--g);font-weight:700}
/* listas no estilo do painel de pedidos: indicadores, filtro por situação, cartões com selo colorido */
.tit-acoes{display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap}
.tit-acoes>div:first-child{flex:1;min-width:260px}
.tit-acoes>.bar{margin:6px 0 0}
.lst-kpis{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));margin-bottom:14px}
.lst-filtros{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px}
.lst-filtros input[type=search]{max-width:300px}
.chips-f{display:flex;flex-wrap:wrap;gap:6px}
.chips-f button{border-radius:20px;padding:5px 12px;font-size:13px;background:var(--card2);color:var(--mut)}
.chips-f button i{font-style:normal;font-family:var(--mono);font-size:12px;margin-left:4px;opacity:.75}
.chips-f button.on{background:var(--g2);border-color:var(--g);color:var(--g);font-weight:600}
.seg-vista button{padding:6px 14px;font-size:12.5px}
button.link{background:none;border:0;padding:0;color:var(--g);text-decoration:underline;cursor:pointer;font:inherit}
.ordem-cartoes{margin-bottom:8px}
.reg-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}
.reg-card{display:flex;flex-direction:column;gap:6px;background:var(--card);border:1px solid var(--line);border-top:4px solid var(--line2);border-radius:var(--r-lg);padding:12px 14px;box-shadow:var(--sombra);color:var(--ink);text-decoration:none;transition:transform .12s,border-color .12s}
.reg-card{cursor:pointer}
.reg-card:hover,.reg-card:focus-visible{transform:translateY(-2px);border-color:var(--g3);outline:0}
.lst-kpis .kpi-largo{grid-column:span 2}
/* "Editar menu": só muda grupo e ordem dos itens (links e grupos continuam os do sistema) */
.menu-editar{display:block;width:calc(100% - 12px);margin:18px 6px 0;background:transparent;color:var(--mut);border:1px dashed var(--line2);font-size:13px}
.menu-editar:hover{color:var(--g);border-color:var(--g)}
#app.menu-editando{grid-template-columns:360px 1fr}
.me-topo{display:flex;flex-direction:column;gap:6px;padding:4px 6px 12px;border-bottom:1px solid var(--line);margin-bottom:8px}
.me-topo b{font-family:var(--disp);font-size:16px}
.me-bts{display:flex;flex-wrap:wrap;gap:6px}.me-bts button{padding:6px 10px;font-size:12.5px}
.me-no{margin:10px 0 0}
.me-no.sub{margin:6px 0 0 6px}
.me-filhos{border-left:2px solid var(--line);margin-left:10px;padding:2px 0 4px 8px;min-height:10px;border-radius:0}
.me-filhos.alvo{border-left-color:var(--g);background:var(--g2)}
.me-raiz{border-left:0;margin-left:0;padding-left:0}
.me-cab select{grid-column:2/-1;min-height:0;padding:3px 6px;font-size:12px}
.me-acoes{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:4px}
.me-acoes button{padding:1px 7px;font-size:11.5px;min-height:0;background:transparent}
.me-no.sub>.me-cab{background:var(--card2);border-color:var(--line)}
.me-no.sub>.me-cab b{color:var(--ink);font-size:13px}
.me-cab{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:6px;margin:14px 2px 0;padding:6px 8px;border-radius:var(--r-md);background:var(--g2);border:1px solid var(--g3);cursor:grab}
.me-cab b{font-family:var(--disp);font-size:14px;color:var(--g)}
.me-cab button{padding:1px 7px;font-size:12px;min-height:0}
.me-cab.alvo{border-color:var(--g);outline:2px dashed var(--g)}.me-cab.arrastando{opacity:.4}
.me-cab+.me-grupo{margin-top:6px}
.me-grupo{border:1px solid var(--line);border-radius:var(--r-md);padding:6px;margin:8px 2px;background:color-mix(in srgb,var(--card) 60%,transparent)}
.me-grupo.alvo{border-color:var(--g);background:var(--g2)}
.me-tit{font-family:var(--disp);font-weight:600;font-size:13px;color:var(--g);padding:2px 4px 6px}
.me-it{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:4px;padding:4px;border-radius:var(--r-sm);font-size:12.5px;cursor:grab;background:var(--card);border:1px solid var(--line);margin-top:4px}
.me-it.arrastando{opacity:.4}
.me-alca{color:var(--fraco);padding:0 2px}
.me-rot{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.me-it button{padding:1px 6px;font-size:12px;min-height:0}
.me-it select{grid-column:2/-1;min-height:0;padding:3px 6px;font-size:12px}
.me-vazio{font-size:12px;color:var(--fraco);padding:8px;text-align:center;border:1px dashed var(--line2);border-radius:var(--r-sm)}
.bt-menu{display:none}
@media (max-width:800px){
  .bt-menu{display:inline-flex;align-items:center;gap:6px;margin:0 0 12px;padding:9px 16px;font-weight:600}
  #app:not(.nav-aberto) nav{display:none}
  #app.nav-aberto main #topo,#app.nav-aberto main #main{display:none}
  #app.nav-aberto main{order:-1;padding-bottom:0}
}
h1.tit-reg{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px}
h1.tit-reg .st{font-family:var(--sans,inherit);font-size:13px;letter-spacing:0;text-transform:none}
.reg-card.cor-bom{border-top-color:var(--g)}.reg-card.cor-atencao{border-top-color:var(--amb)}.reg-card.cor-ruim{border-top-color:var(--red)}
.reg-card.pn-nunca .reg-tit{color:var(--red)}
.reg-top{display:flex;align-items:center;gap:8px}
.reg-top b{font-family:var(--disp);font-size:16px;font-weight:600}
.reg-top .st{margin-left:auto}
.reg-tit{font-weight:600;font-size:14.5px}
.reg-campos{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;font-size:12.5px}
.reg-campos span{color:var(--fraco)}.reg-campos b{font-weight:500;text-align:right;overflow:hidden;text-overflow:ellipsis}
.reg-val{margin-top:auto;padding-top:6px;border-top:1px solid var(--line);text-align:right;font-family:var(--mono);font-size:17px;font-weight:600;color:var(--g)}
.st{display:inline-block;font-weight:700;font-size:12px;padding:2px 10px;border-radius:20px;background:var(--card2);color:var(--mut);white-space:nowrap}
.st.bom{background:var(--g2);color:var(--g)}.st.atencao{background:var(--amb2);color:var(--amb-ink)}.st.ruim{background:var(--red2);color:var(--red)}
/* formulário em blocos numerados (schema `blocos`) com o resumo fixo ao lado */
.form-lado{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:16px;align-items:start}
.blocos{display:flex;flex-direction:column;gap:16px;min-width:0}
.bloco h3,.resumo-lado h3{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-family:var(--disp);font-size:15px;font-weight:600;letter-spacing:.6px;color:var(--ink)}
.bloco h3 .num{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--g2);border:1px solid var(--g3);color:var(--g);font-size:13px}
.resumo-lado{position:sticky;top:16px}
.resumo-lado .card{display:flex;flex-direction:column;gap:10px}
.res-total{display:flex;flex-direction:column;gap:2px;padding:12px 14px;background:var(--g2);border:1px solid var(--g3);border-radius:10px}
.res-total span{font-size:11.5px;font-weight:600;color:var(--mut);letter-spacing:.6px;text-transform:uppercase}
.res-total b{font-family:var(--mono);font-size:24px;color:var(--g)}
.res-lin{display:flex;justify-content:space-between;gap:10px;padding:5px 2px;border-bottom:1px solid var(--line);font-size:13.5px}
.res-lin span{color:var(--mut)}.res-lin b{font-family:var(--mono);font-weight:600}
.res-calc{display:grid;grid-template-columns:auto 1fr;gap:6px 10px;margin:0;font-size:13px}
.res-calc dt{color:var(--mut)}.res-calc dd{margin:0;text-align:right;font-weight:600}
.res-acoes{display:flex;flex-direction:column;gap:8px;margin:0!important}
.res-acoes .btn,.res-acoes button{width:100%;text-align:center;justify-content:center}
.itens-topo{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-bottom:12px}
.itens-rolagem{overflow-x:auto}
.pac-lin{display:flex;align-items:center;gap:8px;margin-top:6px}
.pac-lin span{font-size:10.5px;color:var(--fraco);letter-spacing:.8px;text-transform:uppercase}
table.itens-venda{min-width:720px}
table.itens-venda select,table.itens-venda input{min-width:0;width:100%}
table.itens-venda th{padding:6px 6px;border-bottom:1px solid var(--line)}
table.itens-venda td{padding:6px;border-bottom:1px solid var(--line)}
table.itens-venda td.n-lin{color:var(--fraco);font-family:var(--mono);padding-top:14px;width:24px}
@media (max-width:1100px){.form-lado{grid-template-columns:1fr}.resumo-lado{position:static}}
.seg-campo{margin:0}
.seg-campo button{background:var(--card2);color:var(--mut);border:0;border-right:1px solid var(--line2);border-radius:0;padding:8px 22px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;cursor:pointer}
.seg-campo button:last-child{border-right:0}
.seg-campo button.on{background:var(--g2);color:var(--g)}
.seg-campo button:disabled:not(.on){opacity:.45;cursor:default}
/* opção em botões dentro do formulário (ex.: Etapa Pedido | Venda): ocupa a largura do campo, na altura dos outros campos */
.f .seg-campo{display:flex;width:100%;border-radius:var(--r-md)}
.f .seg-campo button{flex:1;min-height:38px;padding:8px 12px;text-align:center}
table.lst tr.grp th{background:transparent;color:var(--g);border-bottom:1px solid var(--line);padding-top:16px;font-size:12px}
table.lst tr.total td{background:var(--card2);font-weight:700}
td.n,th.n{text-align:right;white-space:nowrap}
.empty{padding:34px;text-align:center;color:var(--mut);background:var(--card);border:1px dashed var(--line2);border-radius:var(--r-lg)}
.form{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px 18px}
.f{display:flex;flex-direction:column;gap:5px;position:relative}
.f.wide{grid-column:1/-1}
.f label{font-size:11.5px;font-weight:600;color:var(--mut);letter-spacing:.6px;text-transform:uppercase}
.f .req{color:var(--red)}
.f .help{font-size:11.5px;color:var(--fraco)}
.f .err{font-size:12px;color:var(--red)}
.f.bad input,.f.bad select{border-color:var(--red);background:var(--red2)}
.f .calc{padding:8px 10px;background:var(--g2);border-radius:var(--r-md);font-weight:600;color:var(--g);min-height:37px;font-family:var(--mono);font-size:13.5px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips label{display:flex;gap:6px;align-items:center;border:1px solid var(--line2);border-radius:18px;padding:5px 11px;font-weight:400;font-size:13px;cursor:pointer;background:var(--card2);color:var(--ink);text-transform:none;letter-spacing:0}
.chips input{width:auto;margin:0}
.chips label.sel{background:var(--g2);border-color:var(--g);color:var(--g);font-weight:600}
.unit{display:flex;align-items:center;gap:6px}.unit span{color:var(--mut);font-size:12.5px}
table.itens{width:100%;border-collapse:collapse}
table.itens th{font-size:10.5px;text-align:left;color:var(--fraco);padding:3px 4px;letter-spacing:.8px;text-transform:uppercase}
table.itens td{padding:3px 4px;vertical-align:top}
table.itens td input,table.itens td select{padding:6px 8px}
table.itens tr.usos td{padding:0 6px 10px;color:var(--mut)}
.toast{position:fixed;right:20px;bottom:20px;background:var(--g);color:var(--g-ink);font-weight:600;padding:11px 18px;border-radius:var(--r-lg);box-shadow:var(--sombra-float);max-width:440px;z-index:9}
.toast.warn{background:var(--amb2);color:var(--amb-ink);border:1px solid var(--amb)}.toast.bad{background:var(--red2);color:var(--red);border:1px solid var(--red)}
.alert{background:var(--amb2);border:1px solid color-mix(in srgb,var(--amb) 35%,transparent);color:var(--amb-ink);border-radius:var(--r-lg);padding:10px 14px;margin-bottom:10px}
.alert.err{background:var(--red2);border-color:color-mix(in srgb,var(--red) 35%,transparent);color:var(--red)}
.alert.ok{background:var(--g2);border-color:var(--g3);color:var(--g)}
.ro-aviso{background:var(--g2);color:var(--g);border-radius:9px;padding:8px 13px;margin-bottom:12px;font-size:13px}

/* ---------- indicadores ---------- */
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px 16px;min-width:0}
.kpi b{display:block;font-size:10.5px;color:var(--mut);text-transform:uppercase;letter-spacing:1.2px;font-weight:600}
.kpi>span{display:block;font-family:var(--mono);font-size:21px;font-weight:600;color:var(--ink);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi small{display:block;color:var(--fraco);font-size:12px;margin-top:2px}
.kpi.neg>span{color:var(--red)}.kpi.ok>span{color:var(--g)}.kpi.fsc>span{color:var(--fsc)}
.kpis.seis{grid-template-columns:repeat(6,minmax(0,1fr))}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.tag{display:inline-block;font-size:11px;padding:2px 8px;border-radius:10px;background:var(--g2);color:var(--g);font-weight:600}
.tag.v{background:var(--red2);color:var(--red)}.tag.a{background:var(--amb2);color:var(--amb)}.tag.fsc{background:var(--fsc2);color:var(--fsc);font-family:var(--mono)}

/* ---------- painel ---------- */
.hero{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:14px}
.hero .kpi{padding:18px 20px 12px;display:flex;flex-direction:column}
.hero .kpi b{display:flex;align-items:center;gap:8px}
.hero .kpi b i{display:inline-block;width:10px;height:10px;border-radius:2px;background:var(--g)}
.hero .kpi.custos b i{background:var(--amb)}
.hero .kpi>span{font-family:var(--disp);font-size:46px;font-weight:700;letter-spacing:.3px;line-height:1.05;margin-top:8px}
.hero .kpi.res>span{color:var(--g)}.hero .kpi.res.neg>span{color:var(--red)}
.hero .kpi .lin{font-size:13px;color:var(--mut);margin-top:6px}
.hero .kpi .lin em{font-style:normal;font-family:var(--mono);color:var(--ink)}
.var-up{color:var(--g)}.var-dn{color:var(--red)}
.selo{display:inline-flex;align-items:center;gap:6px;margin-top:10px;padding:3px 10px;border-radius:var(--r-lg);font-size:12px;background:var(--g2);color:var(--g);align-self:flex-start}
.selo::before{content:'';width:7px;height:7px;border-radius:50%;background:currentColor}
.selo.neg{background:var(--red2);color:var(--red)}.selo.a{background:var(--amb2);color:var(--amb)}
svg.spark{display:block;width:100%;height:42px;margin-top:auto;padding-top:10px}
svg.spark path{fill:none;stroke-width:2}
.painel-g{display:grid;grid-template-columns:1.6fr 1fr;gap:14px;margin-top:14px}
.painel-g .card h3,.card h3{margin:0 0 12px;font-family:var(--disp);font-size:14px;letter-spacing:1.3px;text-transform:uppercase;color:var(--mut);font-weight:600;display:flex;align-items:center;gap:10px}
.card h3 .sp{flex:1}
.leg{font-size:12px;color:var(--mut);display:flex;gap:14px;font-family:inherit;text-transform:none;letter-spacing:0}
.leg i{display:inline-block;width:14px;height:2px;background:var(--g);vertical-align:middle;margin-right:5px}
.leg i.c{background:var(--amb)}
svg.grafico{display:block;width:100%;height:auto}
svg.grafico .grade{stroke:var(--line);stroke-dasharray:3 4}
svg.grafico text{fill:var(--fraco);font:11px var(--mono)}
svg.grafico .rec{stroke:var(--g);stroke-width:2.5;fill:none}
svg.grafico .cus{stroke:var(--amb);stroke-width:2.5;fill:none;stroke-dasharray:6 5}
svg.grafico .area{fill:var(--g);opacity:.08}
svg.grafico circle{stroke:var(--card);stroke-width:2}
svg.grafico .ponto{opacity:0}svg.grafico g.mes:hover .ponto{opacity:1}
table.dre{width:100%;border-collapse:collapse}
table.dre td{padding:8px 2px;border-top:1px solid var(--line);font-size:13.5px}
table.dre tr:first-child td{border-top:0}
table.dre td.n{font-family:var(--mono)}
table.dre tr.sub td:first-child{padding-left:16px;color:var(--mut)}
table.dre tr.forte td{font-weight:700}
table.dre tr.res td{font-weight:700;color:var(--g);border-top:1px solid var(--line2)}
table.dre tr.res.neg td{color:var(--red)}
.contador{background:var(--g2);border:1px solid var(--g3);border-radius:10px;padding:10px 14px;color:var(--ink);font-size:14px;line-height:1.6}
.contador b{color:var(--g)}
.barra-aprov{display:flex;height:26px;border-radius:var(--r-md);overflow:hidden;background:var(--card2);border:1px solid var(--line)}
.barra-aprov span{display:block;height:100%}
.leg-aprov{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:12px;font-size:13px}
.leg-aprov i{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.leg-aprov b{font-family:var(--mono);margin-left:4px}
.rola-x{overflow-x:auto;border-radius:var(--r-lg)}
table.lst.aprov td{vertical-align:middle}
table.lst.aprov input{padding:5px 7px;text-align:right}
button.mini{padding:3px 9px;font-size:12px;margin-left:6px}
/* avisos do painel: botão amarelo com o sinal de perigo; a lista abre numa janela, cada aviso com o link da tela que resolve */
.avisos-bt{display:inline-flex;align-items:center;gap:8px;background:var(--amb2);color:var(--amb-ink);border:1px solid var(--amb);font-weight:700;padding:8px 14px}
.avisos-bt:hover{border-color:var(--amb);background:color-mix(in srgb,var(--amb) 22%,var(--amb2))}
.avisos-bt b{min-width:22px;padding:0 7px;border-radius:999px;background:var(--amb);color:var(--amb2);font-family:var(--mono);font-size:12.5px;text-align:center}
.perigo{font-size:17px;line-height:1;color:var(--amb)}
.avisos-jan{width:min(760px,calc(100vw - 32px))}
.avisos-lista{display:flex;flex-direction:column;gap:8px;max-height:calc(80vh - 90px);overflow:auto}
.aviso-it{border:1px solid color-mix(in srgb,var(--amb) 35%,transparent);background:var(--amb2);border-radius:var(--r-md);padding:10px 12px}
.aviso-tx{display:block;color:var(--amb-ink);font-weight:600;text-decoration:none}
a.aviso-tx:hover{text-decoration:underline}a.aviso-tx i{font-style:normal}
.aviso-regs{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.aviso-regs a{font-size:12.5px;padding:2px 10px;border-radius:999px;background:var(--card);border:1px solid var(--line2);color:var(--ink);text-decoration:none}
.aviso-regs a:hover{border-color:var(--g);color:var(--g)}
.alertas{display:grid;gap:8px;margin-bottom:14px}
.alertas .alert{margin:0;display:flex;gap:10px;align-items:flex-start}
.alertas .alert::before{content:'!';flex:none;width:18px;height:18px;border-radius:50%;background:var(--amb);color:var(--amb2);font-weight:800;font-size:12px;display:flex;align-items:center;justify-content:center;margin-top:1px}

/* ---------- pneus por posição ---------- */
.posmap{display:flex;gap:14px;flex-wrap:wrap;margin-top:6px}
.eixo{border:1px solid var(--line);border-radius:var(--r-md);padding:6px 8px;background:var(--card2)}
.eixo b{display:block;font-size:11px;color:var(--mut);margin-bottom:4px}
.pos{display:inline-block;min-width:54px;text-align:center;border:1.5px dashed var(--amb);border-radius:5px;padding:3px 5px;margin:2px;font-size:11.5px;color:var(--amb)}
.pos.on{border:1.5px solid var(--g);background:var(--g);color:var(--g-ink)}
.card.bad{border-color:var(--red)}
.pn-topo{display:flex;gap:12px;align-items:baseline;flex-wrap:wrap;margin-bottom:10px}
.pn-grid{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:18px;align-items:start}
svg.veic{display:block;width:100%;max-width:300px}
svg.veic .cab{fill:#3d6f99}
svg.veic .vidro{fill:#cfe2f3}
svg.veic .bau{fill:#3a3326;stroke:#8a744f;stroke-width:1.5}
[data-tema="claro"] svg.veic .bau{fill:#efe6d3;stroke:#b89a6a}
svg.veic .tabua{stroke:#5a4c36;stroke-width:1}
[data-tema="claro"] svg.veic .tabua{stroke:#d8c9a8}
svg.veic .chassi{fill:#6b5a48}
svg.veic .quinta{fill:#8a7a1f}
svg.veic .pino{fill:#5b4630}
svg.veic .engate{stroke:#6b5a48;stroke-width:5;stroke-linecap:round}
svg.veic .eixo{stroke:#7a7a7a;stroke-width:5}
svg.veic .tr{font-size:9px;fill:#b59b6a;font-weight:600}
svg.veic .frente{font-size:9px;fill:var(--mut)}
svg.veic .pn{cursor:pointer;outline:none}
svg.veic .pn rect{stroke-width:1.5}
svg.veic .pn text{font-size:8px;font-weight:700;fill:#fff;pointer-events:none}
svg.veic .pn.pend rect{fill:var(--card);stroke:var(--amb);stroke-dasharray:3 2}
svg.veic .pn.pend text,svg.veic .pn.sem text{fill:var(--mut)}
svg.veic .pn.ok rect{fill:var(--g);stroke:var(--g)}
svg.veic .pn.mont rect{fill:#2b3a33;stroke:#56705f}
svg.veic .pn.sem rect{fill:var(--card2);stroke:var(--fraco);stroke-dasharray:2 2}
svg.veic .pn.sel rect,svg.veic .pn:focus rect{stroke:#e0a100;stroke-width:3.5;stroke-dasharray:none}
.pn-acoes{display:flex;gap:6px;flex-wrap:wrap}
.pn-acoes button{padding:6px 10px;font-size:13px}
.pn-acao{margin-top:10px;background:var(--card2)}
table.hist td{font-size:12.5px}
table.hist td:first-child{white-space:nowrap}
table.lst tr.pn-nunca td{color:var(--red);font-weight:700}
select.pn-nunca-sel,option.pn-nunca-opt{color:var(--red);font-weight:700}
option.pn-normal-opt{color:var(--ink);font-weight:400}
.chk{display:flex;gap:6px;align-items:center;font-weight:600}
.chk input{width:auto;margin:0}

/* ---------- calculadora de desdobro ---------- */
svg.corte{display:block;width:100%;max-width:440px;margin:0 auto}
svg.corte .casca{fill:#9c7d52}
svg.corte .tora{fill:#e9dcc0;stroke:#b89a6a;stroke-width:1.5}
svg.corte rect{stroke:#fff;stroke-width:.6}
svg.corte rect.esc{stroke:#1f2622;stroke-width:1.6}
svg.corte rect.corte-fita{fill:#5b4630;stroke:none;opacity:.75}
svg.corte text{fill:#fff;font-weight:600;pointer-events:none}
.cor{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:6px;vertical-align:-1px}
details summary{cursor:pointer}

/* ---------- login ---------- */
/* login: o elemento gráfico da marca – bloco verde-abeto cortado por um traço fino a 45° (só em capas, login e estados vazios) */
.tela-login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px;background:linear-gradient(135deg,var(--g) 0 16%,var(--bg) 16% calc(16% + 3px),var(--g) calc(16% + 3px) 21%,transparent 21%),var(--bg)}
.tela-login .logo-login{width:190px;height:auto;margin-bottom:14px}
.tela-login .logo-login.claro{display:none}[data-tema="claro"] .tela-login .logo-login.claro{display:block}[data-tema="claro"] .tela-login .logo-login.escuro{display:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tela-login .tagline{font-family:var(--disp);font-weight:600;color:var(--resin-text);margin:-2px 0 14px;letter-spacing:.2px}
.tela-login .card{width:100%;max-width:400px;padding:30px;box-shadow:var(--sombra-float)}
.tela-login h1{margin-bottom:2px}
.tela-login form{display:grid;gap:14px;margin-top:16px}
.senha-box{background:var(--amb2);border:1px solid color-mix(in srgb,var(--amb) 35%,transparent);border-radius:10px;padding:12px 14px;margin:10px 0}
.senha-box code{font-size:17px;font-weight:700;letter-spacing:.5px;user-select:all;font-family:var(--mono)}
.lin{display:flex;gap:8px;flex-wrap:wrap;align-items:end}
.lin .f{flex:1;min-width:170px}
table.lst td .mini{padding:3px 8px;font-size:12px}
table.lst select.mini{width:auto;padding:3px 6px;font-size:12.5px}

/* ---------- relatórios, etiqueta, sugestões ---------- */
.rel-lista{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.rel-item{text-decoration:none;font-weight:600;color:var(--ink)}
.rel-item:hover{border-color:var(--g);color:var(--g)}
.etiqueta{width:100%;max-width:420px;border:2px solid #1f2622;border-radius:var(--r-md);padding:14px 16px;background:#fff;color:#1f2622}
.etiqueta .etq-emp{font-size:12px;color:#5f6b64}
.etiqueta .etq-cod{font-size:34px;font-weight:800;letter-spacing:1px;margin:2px 0;font-family:var(--disp)}
.etiqueta .etq-prod{font-size:17px;font-weight:700;margin-bottom:8px}
.etiqueta table{width:100%;border-collapse:collapse;font-size:13px}
.etiqueta td{padding:3px 0;border-top:1px solid #dde1da}
.etiqueta+.etiqueta{margin-top:14px}
/* pátio de pacotes: cartões por madeira, barras FSC × não FSC e janela de detalhe */
.patio-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;margin-bottom:8px}
.pac-card{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--serie-nao);border-radius:var(--r-lg);padding:14px 16px 12px;box-shadow:var(--sombra);transition:transform .15s,border-color .15s}
.pac-card.fsc{border-left-color:var(--serie-fsc)}
.pac-card:hover,.pac-card:focus-visible{transform:translateY(-3px);border-color:var(--line2)}
.pac-card:focus-visible{outline:2px solid var(--g);outline-offset:2px}
.pac-card .n{font-family:var(--disp);font-size:44px;font-weight:700;line-height:1;color:var(--ink)}
.pac-card .n small{font-size:16px;font-weight:600;color:var(--mut);margin-left:6px}
.pac-card .bit{font-size:15px;font-weight:600;margin-top:6px;color:var(--ink)}
.pac-card .det{font-size:12px;color:var(--mut);margin-top:4px}
.pac-card .det em{font-style:normal;font-family:var(--mono);color:var(--ink)}
.pac-card .pac-ico{display:flex;flex-wrap:wrap;gap:3px;margin-top:10px}
.pac-card .pac-ico i{width:9px;height:9px;border-radius:2px;background:var(--serie-nao)}
.pac-card.fsc .pac-ico i{background:var(--serie-fsc)}
.kpi.clk{cursor:pointer;transition:transform .15s}.kpi.clk:hover{transform:translateY(-3px);border-color:var(--amb)}
.kpi.estufa>span{color:var(--amb)}
.barras{display:grid;grid-template-columns:minmax(120px,240px) 1fr;gap:6px 12px;align-items:center}
.barras .rot{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.barras .trilho{display:flex;gap:2px;height:22px;position:relative}
.barras .seg-b{height:100%;border-radius:0;min-width:3px;display:flex;align-items:center;justify-content:flex-end;padding-right:6px;font:600 12px var(--mono);color:#fff}
.barras .seg-b:last-of-type{border-radius:0 4px 4px 0}
.barras .seg-b.f{background:var(--serie-fsc)}.barras .seg-b.nf{background:var(--serie-nao)}
.barras .tot{font:600 12.5px var(--mono);color:var(--ink);margin-left:8px;align-self:center;white-space:nowrap}
@media (max-width:700px){.barras{grid-template-columns:1fr;gap:2px 0}.barras .rot{margin-top:8px}}
.leg-b{display:flex;gap:16px;font-size:12.5px;color:var(--mut);margin:0 0 10px}
.leg-b i{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.leg-b i.f{background:var(--serie-fsc)}.leg-b i.nf{background:var(--serie-nao)}
.dica{position:fixed;z-index:20;pointer-events:none;background:var(--card2);border:1px solid var(--line2);border-radius:var(--r-md);padding:6px 10px;font-size:12.5px;box-shadow:var(--sombra-float);color:var(--ink)}
dialog.janela{border:1px solid var(--line2);border-radius:var(--r-lg);background:var(--card);color:var(--ink);padding:18px 20px;width:min(720px,calc(100vw - 32px));max-height:80vh;box-shadow:var(--sombra-float)}
dialog.janela::backdrop{background:rgba(0,0,0,.55)}
dialog.janela h2{margin-top:0}
.sec-tit{display:flex;align-items:center;gap:10px}
/* monitor de pedidos (O que serrar): quadro por pedido; verde quando tudo está no pátio */
.ped-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-bottom:8px}
.ped-card{display:flex;flex-direction:column;gap:4px;background:var(--card);border:1px solid var(--line);border-top:4px solid var(--amb);border-radius:var(--r-lg);padding:12px 14px;box-shadow:var(--sombra)}
.ped-card.pronto{border-color:var(--g3);border-top-color:var(--g);background:linear-gradient(var(--g2),var(--g2)),var(--card)}
.ped-top{display:flex;align-items:center;gap:8px}.ped-top a{color:var(--ink);text-decoration:none;font-family:var(--disp);font-size:17px}
.ped-st{margin-left:auto;font-weight:700;font-size:12.5px;padding:2px 10px;border-radius:20px;background:var(--amb2);color:var(--amb-ink)}
.ped-card.pronto .ped-st{background:var(--g);color:var(--g-ink)}
.ped-cli{font-weight:600}
.ped-itens{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.ped-it{display:grid;grid-template-columns:1fr auto;gap:2px 8px;font-size:13px}
.ped-n{font-family:var(--mono);font-weight:600;text-align:right}
.ped-bar{grid-column:1/-1;height:6px;border-radius:4px;background:var(--line);overflow:hidden}
.ped-bar i{display:block;height:100%;background:var(--serie-nao);border-radius:4px}.ped-bar.f i{background:var(--serie-fsc)}
.ped-bt{margin-top:8px;align-self:flex-start}
.ped-falta{grid-column:1/-1;font-size:12px;font-weight:600;color:var(--amb-ink)}
/* painel da frota: um quadro por veículo/implemento com resultado, manutenção e documentos */
.fr-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px;margin-bottom:8px}
.fr-card{display:flex;flex-direction:column;gap:6px;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--g);border-radius:var(--r-lg);padding:12px 14px;box-shadow:var(--sombra)}
.fr-card.alerta{border-left-color:var(--red)}
.fr-card.em-viagem{border-color:var(--g);border-left-width:6px;background:linear-gradient(var(--g2),var(--g2)),var(--card)}
.fr-viagem{display:flex;flex-direction:column;gap:4px;background:var(--g2);border:1px solid var(--g3);border-radius:10px;padding:8px 10px}
.fr-viagem b{color:var(--g);font-family:var(--disp);letter-spacing:.5px}
.fr-viagem .btn{align-self:flex-start;margin-top:4px}
.fr-top{display:flex;align-items:baseline;gap:8px}.fr-top a{color:var(--ink);text-decoration:none;font-family:var(--disp);font-size:18px}
.fr-km{margin-left:auto;font-family:var(--mono);font-size:12.5px;color:var(--mut)}
.fr-num{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.fr-num b{display:block;font-family:var(--mono);font-size:15px}.fr-num small{color:var(--mut);font-size:11px}
.fr-num .pos b{color:var(--g)}.fr-num .neg b{color:var(--red)}
.fr-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.fr-chip{font-size:12px;padding:2px 9px;border-radius:20px;background:var(--g2);color:var(--g);text-decoration:none;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fr-chip.a{background:var(--amb2);color:var(--amb-ink)}.fr-chip.v{background:var(--red2);color:var(--red);font-weight:600}
.fr-bts{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}.fr-bts .btn{padding:4px 10px;font-size:12.5px}
/* quadro de paradas: quadro branco com controles de início/parada (posição e tamanho editáveis) */
.quadro-wrap{overflow:auto;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg);max-width:100%}
.quadro{position:relative;min-width:100%;touch-action:none}
.editando .quadro{background-image:radial-gradient(var(--line2) 1px,transparent 1px);background-size:20px 20px}
.qp-el{position:absolute;container-type:size;background:var(--card);border:1px solid var(--line2);border-left:5px solid var(--qp-ok);border-radius:var(--r-lg);box-shadow:var(--sombra);display:flex;flex-direction:column;padding:10px 12px;gap:6px;overflow:hidden;user-select:none}
.qp-el.parado{border-left-color:var(--qp-par);box-shadow:0 0 0 2px var(--red2),var(--sombra)}
.qp-el .nome{font-family:var(--disp);font-weight:700;font-size:clamp(14px,11cqh,28px);line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chave{display:flex;align-items:center;gap:16px;flex-wrap:wrap;background:var(--card);border:1px solid var(--line2);border-left:6px solid var(--line2);border-radius:var(--r-lg);padding:12px 16px;margin-bottom:12px}
.chave.on{border-left-color:var(--qp-ok)}
.chave>div{flex:1;min-width:240px}
.chave b{font-family:var(--disp);font-size:18px;letter-spacing:1px;margin-right:6px}
.chave .ok{color:var(--qp-ok);font-weight:700}.chave .off{color:var(--mut);font-weight:700}
.chave button{font-family:var(--disp);font-size:16px;padding:10px 18px}
.qp-hor{align-self:flex-start;background:none;border:1px dashed var(--line2);color:var(--mut);font-family:var(--mono);font-size:12px;padding:2px 8px;border-radius:var(--r-md);cursor:pointer}
.qp-hor:hover:not(:disabled){color:var(--ink);border-color:var(--g)}
.qp-hor:disabled{cursor:default;opacity:.8}
.qp-linha{display:inline-block;font-family:var(--mono);font-size:.62em;font-weight:700;background:var(--g2);color:var(--g);border-radius:6px;padding:1px 6px;margin-right:6px;vertical-align:.15em}
.qp-el .st{font-size:clamp(11px,7cqh,14px);color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qp-el .st b.par{color:var(--qp-par)}.qp-el .st b.ok{color:var(--qp-ok)}.qp-el .st b.desl{color:var(--mut)}
/* liga/desliga do equipamento (não é parada): botão discreto ao lado do horímetro */
.qp-ctl{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.qp-lig{background:none;border:1px solid var(--line2);color:var(--mut);font-size:12px;padding:2px 9px;min-height:0;border-radius:var(--r-md)}
.qp-lig.on{color:var(--g);border-color:var(--g)}
.qp-lig:hover:not(:disabled){color:var(--ink);border-color:var(--g)}
.qp-el:not(.parado):has(.st b.desl){border-left-color:var(--line2)}
.lc-lista{display:flex;flex-direction:column;gap:4px;max-height:50vh;overflow:auto;margin-top:12px}
.lc-it{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:6px 8px;border:1px solid var(--line);border-radius:var(--r-md);text-transform:none;letter-spacing:0;font-weight:400;font-size:14px;color:var(--ink)}
.lc-it input{width:auto;min-height:0}
.qp-el .bts{display:flex;gap:8px;flex:1;min-height:0}
.qp-el .bts button{flex:1;min-height:0;border:0;border-radius:var(--r-lg);font-family:var(--disp);font-weight:800;font-size:clamp(13px,12cqh,32px);letter-spacing:.5px;color:#fff;cursor:pointer;transition:transform .1s,filter .1s}
.qp-el .bts button:hover:not(:disabled){filter:brightness(1.1)}.qp-el .bts button:active:not(:disabled){transform:scale(.97)}
.qp-el .bts .ini{background:var(--qp-ok)}.qp-el .bts .par{background:var(--qp-par)}
.qp-el .bts button:disabled{opacity:.25;cursor:default}
.qp-el.texto{background:transparent;border:1px dashed transparent;box-shadow:none;justify-content:center;font-family:var(--disp);font-weight:700;color:var(--mut);font-size:clamp(14px,50cqh,44px);white-space:nowrap}
.editando .qp-el{cursor:move;outline:1px dashed var(--g)}
.editando .qp-el .bts{pointer-events:none}
.qp-alca{position:absolute;right:3px;bottom:3px;width:18px;height:18px;cursor:nwse-resize;border-right:3px solid var(--g);border-bottom:3px solid var(--g);border-radius:0 0 8px 0}
.qp-x{all:unset;position:absolute;top:4px;right:6px;width:22px;height:22px;border-radius:50%;background:var(--red2);color:var(--red);text-align:center;font-weight:800;cursor:pointer;line-height:22px}
.qp-barra{background:var(--card);border:1px solid var(--g3);border-radius:var(--r-lg);padding:10px 12px;flex-wrap:wrap}
dialog.janela .form{grid-template-columns:repeat(2,minmax(0,1fr))}
.sec-tit .tag{font-size:12px}
@media print{.etiqueta+.etiqueta{margin-top:0;break-before:page}}
/* NF-e: quadro de emissão (chave longa quebra em grupos de 4) */
.nf-topo{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.nf-sit{font-family:var(--disp);font-size:15px;font-weight:700;padding:3px 12px;border-radius:999px;background:var(--amb2);color:var(--amb-ink)}
.nf-sit.ok{background:var(--g2);color:var(--g)}.nf-sit.bad{background:var(--red2);color:var(--red)}
.nf-num{margin-left:auto;font-family:var(--disp);font-size:16px}
.nf-dados{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:10px}
.nf-dado{background:var(--card2);border:1px solid var(--line);border-radius:9px;padding:8px 11px;min-width:0}
.nf-dado.wide{grid-column:1/-1}
.nf-dado b{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--mut);font-weight:600}
.nf-dado span{display:block;overflow-wrap:anywhere}
.nf-chave{font-family:var(--mono);font-size:15px;letter-spacing:.5px;color:var(--g)}
@media (max-width:700px){.nf-dados{grid-template-columns:1fr}}
/* DANFE: sempre em papel branco (A4 retrato) */
.danfe{position:relative;background:#fff;color:#000;max-width:800px;padding:14px;border-radius:6px;font:11px/1.3 Arial,"Segoe UI",sans-serif;overflow:hidden}
.danfe h4{margin:8px 0 2px;font-size:10px;text-transform:uppercase;letter-spacing:.5px}
.df-linha{display:flex;gap:0;border:1px solid #000;border-top:0}
.df-linha:first-child,.danfe h4+.df-linha,.df-topo{border-top:1px solid #000}
.df-cx{flex:1;padding:3px 5px;border-left:1px solid #000;min-width:0;display:flex;flex-direction:column;gap:1px}
.df-cx:first-child{border-left:0}
.df-cx.g2{flex:2}.df-cx.g3{flex:3}
.df-cx small{font-size:8px;text-transform:uppercase;color:#333}
.df-cx span{overflow-wrap:anywhere}
.df-num .df-cx span{text-align:right;font-family:var(--mono)}
.df-emit{flex:3;justify-content:center}.df-emit b{font-size:13px}
.df-tit{flex:1.6;align-items:center;text-align:center}.df-tit>b:first-child{font-size:18px}
.df-chave{flex:4}.df-chave code{font-family:var(--mono);font-size:10.5px;font-weight:700;white-space:nowrap}
.df-barras{width:100%;height:44px;fill:#000}
.df-itens{width:100%;border-collapse:collapse;font-size:9.5px}
.df-itens th,.df-itens td{border:1px solid #000;padding:2px 3px;vertical-align:top}
.df-itens th{font-size:8px;text-transform:uppercase;background:#eee}
.df-itens td.n{text-align:right;font-family:var(--mono);white-space:nowrap}
.df-adic{min-height:90px}
.df-marca{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:62px;font-weight:800;color:rgba(200,0,0,.14);transform:rotate(-28deg);pointer-events:none;white-space:nowrap}
@media print{.danfe{max-width:none;padding:0;border-radius:0}@page{size:A4 portrait;margin:8mm}}
/* orçamento / pedido para o cliente (papel branco) */
.doc-ped{background:#fff;color:#1f2622;max-width:800px;padding:26px 30px;border-radius:var(--r-md);font-size:13px}
.doc-ped .small{color:#5f6b64}
.dp-topo{display:flex;justify-content:space-between;gap:20px;border-bottom:3px solid #24433C;padding-bottom:12px;margin-bottom:14px}
.dp-emp{font-family:var(--disp);font-size:22px}
.dp-num{text-align:right;display:flex;flex-direction:column}
.dp-num span:first-child{text-transform:uppercase;letter-spacing:1px;font-size:11px;color:#5f6b64}
.dp-num b{font-family:var(--disp);font-size:24px;color:#24433C}
.dp-dados{border-collapse:collapse;margin-bottom:14px}
.dp-dados td{padding:2px 14px 2px 0;vertical-align:top}
.dp-dados td:first-child{color:#5f6b64;white-space:nowrap}
.dp-itens{width:100%;border-collapse:collapse;margin-bottom:12px}
.dp-itens th{text-align:left;background:#DCE6E2;padding:6px 8px;font-size:11.5px;text-transform:uppercase;letter-spacing:.5px}
.dp-itens td{padding:6px 8px;border-bottom:1px solid #dde1da}
.dp-itens .n{text-align:right;font-family:var(--mono);white-space:nowrap}
.dp-itens th.n{font-family:inherit}
.dp-tot td{font-weight:700;font-size:15px;border-bottom:0;border-top:2px solid #1f2622}
.dp-ass{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:60px}
.dp-ass div{border-top:1px solid #1f2622;padding-top:4px;text-align:center;font-size:12px}
@media print{.doc-ped{max-width:none;padding:0}}
.sugestoes{position:absolute;left:0;right:0;top:100%;margin-top:2px;background:var(--card);border:1px solid var(--line2);border-radius:var(--r-md);box-shadow:var(--sombra-float);z-index:6;max-height:260px;overflow:auto}
.sugestoes .sug{padding:7px 11px;cursor:pointer;font-size:13.5px}
.sugestoes .sug b{color:var(--mut);font-weight:600;margin-left:2px}
.sugestoes .sug.on,.sugestoes .sug:hover{background:var(--g2)}
.mini-btn{align-self:flex-start;padding:4px 10px;font-size:12.5px;margin-top:4px}
.aviso-campo{font-size:12px;color:var(--amb-ink);background:var(--amb2);border:1px solid color-mix(in srgb,var(--amb) 35%,transparent);border-radius:var(--r-md);padding:4px 8px}

@media (max-width:1100px){.hero{grid-template-columns:1fr}.painel-g{grid-template-columns:1fr}.kpis.seis{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}}
@media (max-width:800px){#app{grid-template-columns:1fr}nav{position:static;height:auto}.grid2{grid-template-columns:1fr}main{padding:16px}.pn-grid{grid-template-columns:1fr}}
@media print{
  :root{--bg:#fff;--card:#fff;--card2:#f2f2f2;--ink:#000;--mut:#444;--line:#bbb;--g:#1d5a3c}
  nav,#topo,.nao-imprime,.toast,#busca{display:none!important}
  #app{display:block}main{padding:0}body{background:#fff;color:#000}h1{color:#000}
  table.lst{border:1px solid #999}table.lst th{background:#eee;color:#000}
}
