:root{--preto:#0b0b0c;--preto2:#141416;--preto3:#1d1d21;--linha:#2a2a30;--ouro:#c9a24a;--ouro2:#e6c77a;--texto:#f2efe8;--cinza:#9a978f;--verde:#3fb37f;--vermelho:#e05d5d;--azul:#5b9bd5;--amarelo:#e0b84d;--raio:12px}
*{box-sizing:border-box}
html,body{margin:0;background:var(--preto);color:var(--texto);font:15px/1.5 Inter,system-ui,sans-serif}
h1,h2,h3,.logo,.logo-grande,.num{font-family:Oswald,Inter,sans-serif;letter-spacing:.02em}
a{color:var(--ouro2)}
[hidden]{display:none!important}
.tela-cheia{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px}
.logo-grande{width:64px;height:64px;border-radius:16px;display:grid;place-items:center;font-size:28px;font-weight:700;color:var(--preto);background:linear-gradient(135deg,var(--ouro2),var(--ouro))}
.sub{color:var(--cinza)}
.cartao-login{width:100%;max-width:380px;background:var(--preto2);border:1px solid var(--linha);border-radius:18px;padding:28px;display:flex;flex-direction:column;gap:12px;align-items:stretch}
.cartao-login .logo-grande{align-self:center}
.cartao-login h1{margin:4px 0 0;text-align:center;color:var(--ouro2)}
.cartao-login .sub{text-align:center;margin:0 0 8px}
label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--cinza)}
input,select,textarea{font:inherit;color:var(--texto);background:var(--preto);border:1px solid var(--linha);border-radius:10px;padding:10px 12px;min-height:40px}
input:focus,select:focus,textarea:focus{outline:2px solid var(--ouro);outline-offset:0;border-color:transparent}
button{font:inherit;cursor:pointer}
.btn-ouro{background:linear-gradient(135deg,var(--ouro2),var(--ouro));color:var(--preto);border:0;border-radius:10px;padding:10px 16px;font-weight:700;min-height:40px}
.btn-ouro:disabled{opacity:.5;cursor:default}
.btn{background:var(--preto3);color:var(--texto);border:1px solid var(--linha);border-radius:10px;padding:8px 14px;min-height:38px}
.btn:hover{border-color:var(--ouro)}
.btn-link{background:none;border:0;color:var(--ouro2);padding:6px;text-decoration:underline}
.msg{min-height:1.2em;margin:0;color:var(--vermelho);font-size:13px}
.rodape{font-size:12px;color:var(--cinza);text-align:center;margin:8px 0 0}
#app{display:flex;min-height:100vh}
.lateral{width:220px;flex:0 0 220px;background:var(--preto2);border-right:1px solid var(--linha);display:flex;flex-direction:column;padding:18px 12px;position:sticky;top:0;height:100vh}
.marca{display:flex;align-items:center;gap:10px;font-family:Oswald;font-size:20px;margin:0 6px 22px}
.marca .logo{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;color:var(--preto);background:linear-gradient(135deg,var(--ouro2),var(--ouro));font-weight:700}
#menu{display:flex;flex-direction:column;gap:4px}
#menu a{color:var(--texto);text-decoration:none;padding:10px 12px;border-radius:10px;border-left:3px solid transparent}
#menu a:hover{background:var(--preto3)}
#menu a.ativa{background:var(--preto3);border-left-color:var(--ouro);color:var(--ouro2);font-weight:600}
.lateral-pe{margin-top:auto;font-size:13px;color:var(--cinza);padding:0 6px}
.lateral-pe .loja{color:var(--texto);font-weight:600}
main{flex:1;min-width:0;padding:20px 24px 40px}
.topo{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.topo h2{margin:0;font-size:26px;color:var(--ouro2)}
.btn-menu{display:none;background:none;border:1px solid var(--linha);color:var(--texto);border-radius:10px;width:40px;height:40px}
.painel{background:var(--preto2);border:1px solid var(--linha);border-radius:var(--raio);padding:16px;margin-bottom:16px}
.barra{display:flex;flex-wrap:wrap;gap:8px;align-items:end;margin-bottom:12px}
.barra label{min-width:140px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.chip{background:var(--preto3);border:1px solid var(--linha);color:var(--texto);border-radius:999px;padding:6px 12px;font-size:13px}
.chip .num{color:var(--ouro2);margin-left:6px}
.chip.ativa{border-color:var(--ouro);background:#2a2316}
.tabela-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;color:var(--cinza);font-weight:500;font-size:12px;text-transform:uppercase;letter-spacing:.04em;padding:8px;border-bottom:1px solid var(--linha);white-space:nowrap}
td{padding:10px 8px;border-bottom:1px solid var(--linha);vertical-align:top}
tr:hover td{background:#17171a}
.mp{display:inline-block;font-size:11px;font-weight:700;border-radius:6px;padding:2px 6px;color:#fff;white-space:nowrap}
.mp-shopee{background:#ee4d2d}.mp-ml{background:#ffe600;color:#222}.mp-tiktok{background:#111;border:1px solid #444}
.etapa{font-size:12px;border-radius:999px;padding:2px 8px;white-space:nowrap;border:1px solid}
.etapa-a_pagar{color:var(--amarelo)}.etapa-pra_enviar{color:var(--ouro2)}.etapa-enviado{color:var(--azul)}.etapa-entregue{color:var(--verde)}.etapa-cancelado{color:var(--vermelho)}.etapa-outros{color:var(--cinza)}
.pequeno{font-size:12px;color:var(--cinza)}
.vazio{color:var(--cinza);text-align:center;padding:30px}
.aviso{border:1px solid var(--linha);border-left:4px solid var(--amarelo);background:#1a1710;border-radius:10px;padding:10px 12px;margin-bottom:12px;font-size:14px}
.aviso.erro{border-left-color:var(--vermelho);background:#1c1212}
.aviso.ok{border-left-color:var(--verde);background:#101a14}
.aviso .acoes{margin-top:6px;display:flex;gap:8px;flex-wrap:wrap}
.grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.num-grande{font-family:Oswald;font-size:28px;color:var(--ouro2)}
input.cel{width:90px;min-height:34px;padding:6px 8px}
input.cel.mudou{border-color:var(--ouro);background:#1e1a10}
.ajuda-doc{max-width:760px}
.ajuda-doc h1{color:var(--ouro2)}
.ajuda-doc li{margin:4px 0}
@media (max-width:900px){
  .lateral{position:fixed;z-index:10;left:-240px;transition:left .2s}
  .lateral.aberta{left:0}
  .btn-menu{display:inline-block}
  main{padding:16px}
}
.folhas{display:flex;flex-wrap:wrap;gap:12px}
.folha{background:#f4f1ea;border-radius:6px;padding:6px;display:grid;gap:4px;box-shadow:0 2px 10px #0006}
.folha.f10x15{width:90px;height:135px;grid-template-columns:1fr}
.folha.fa4{width:150px;height:212px;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}
.bloco{border:1px dashed #888;border-radius:4px;color:#222;font-size:10px;padding:4px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;overflow:hidden}
.bloco.etiqueta{background:#fff}.bloco.declaracao{background:#fff8e1}.bloco.danfe{background:#e8f1ff}
.form-grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.campo-erro{border-color:var(--vermelho)!important}
