:root {
    --steel-950: #1c2228;
    --steel-900: #252c33;
    --steel-800: #323b44;
    --steel-700: #3e4954;
    --steel-600: #4d5a66;
    --steel-500: #667480;
    --steel-400: #8b969f;
    --steel-300: #aeb6bd;
    --steel-200: #d2d7db;
    --steel-100: #eceff1;
    --amber: #e6a23c;
    --amber-dark: #c9841d;
    --alert: #e15a4a;
    --ok: #3dae8c;
    --linha: rgba(255, 255, 255, 0.1);
    --painel: rgba(255, 255, 255, 0.05);
    --fonte: "Inter", "Segoe UI", sans-serif;
    --display: "Barlow Condensed", "Segoe UI", sans-serif;
    --mono: "JetBrains Mono", Consolas, monospace;
    --raio: 12px;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
    font-family: var(--fonte);
    color: var(--steel-100);
    background: var(--steel-950);
    -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3 { font-family: var(--display); font-weight: 600; letter-spacing: 0.01em; }

.fundo {
    position: fixed;
    inset: 0;
    z-index: -1;
    background:
        radial-gradient(520px 380px at 18% -8%, rgba(230, 162, 60, 0.12), transparent 70%),
        radial-gradient(460px 420px at 92% 110%, rgba(77, 90, 102, 0.35), transparent 70%),
        linear-gradient(180deg, #252c33 0%, #1c2228 62%);
}

.app { display: flex; max-width: 1440px; margin: 0 auto; min-height: 100vh; }
.lateral {
    position: sticky;
    top: 0;
    display: none;
    width: 256px;
    height: 100vh;
    flex-direction: column;
    border-right: 1px solid var(--linha);
    background: rgba(37, 44, 51, 0.72);
    backdrop-filter: blur(16px);
}
.marca { display: flex; gap: 12px; align-items: center; padding: 20px; }
.lateral > .marca { justify-content: space-between; }
.lateral > .marca > div { flex: 1; min-width: 0; }
.menu-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    margin: 0;
    padding: 6px 10px;
    border: 0;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.06);
    box-shadow: inset 0 0 0 1px var(--linha);
    color: var(--steel-300);
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
}
.menu-toggle:hover { color: var(--steel-100); box-shadow: inset 0 0 0 1px rgba(230, 162, 60, 0.45); }
.barra-menu-reabrir {
    display: none;
    align-items: center;
    gap: 8px;
    padding: 10px 16px 0;
}
.menu-toggle-mostrar {
    background: rgba(230, 162, 60, 0.14);
    color: var(--amber);
    box-shadow: inset 0 0 0 1px rgba(230, 162, 60, 0.35);
}
.menu-toggle-drawer { display: none; }
.menu-drawer {
    width: min(420px, 94vw);
    max-height: 90vh;
    border: 0;
    border-radius: 12px;
    padding: 0;
    background: #252c33;
    color: var(--steel-100);
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.45);
}
.menu-drawer::backdrop { background: rgba(8, 10, 12, 0.62); }
.menu-drawer > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--linha);
}
.menu-drawer > header h2 { margin: 0; font-size: 20px; }
.menu-drawer > header .acoes { display: flex; flex-wrap: wrap; gap: 8px; }
.menu-drawer > .corpo { padding: 8px 8px 16px; overflow: auto; max-height: calc(90vh - 70px); }
.menu-drawer .menu { padding: 0 8px; }
.logo {
    display: block;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    object-fit: cover;
    flex-shrink: 0;
}
.marca strong { display: block; font-family: var(--display); font-size: 20px; line-height: 1; }
.olho { margin: 0; font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em; color: var(--steel-400); }
.seletor { margin: 0 12px 12px; }
.rotulo-legivel {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: var(--steel-100);
}
.seletor span, .rotulo {
    display: block;
    margin-bottom: 6px;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--steel-400);
}
.seletor select, .campo input, .campo select, .campo textarea, input.campo, select.campo, textarea.campo, .busca, .status-select {
    color: var(--steel-100);
    color-scheme: dark;
    width: 100%;
    border: 0;
    border-radius: 8px;
    background: rgba(28, 34, 40, 0.7);
    padding: 8px 10px;
    outline: none;
    box-shadow: inset 0 0 0 1px var(--linha);
}
.seletor select:focus, .campo input:focus, .campo select:focus, .campo textarea:focus, input.campo:focus, select.campo:focus, textarea.campo:focus, .busca:focus, .status-select:focus {
    box-shadow: inset 0 0 0 1px rgba(230, 162, 60, 0.55);
}
.form-status {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.form-status .status-select {
    width: auto;
    min-width: 160px;
    flex: 1 1 160px;
}
.form-status .botao {
    flex: 0 0 auto;
    white-space: nowrap;
}
.cadastrar-empresa {
    display: block;
    margin: 0 12px 12px;
    padding: 10px 12px;
    border: 1px dashed rgba(230, 162, 60, 0.45);
    border-radius: 8px;
    color: var(--amber);
    font-size: 12px;
    text-decoration: none;
}
.menu { flex: 1; overflow: auto; padding: 4px 12px 12px; }
.grupo { margin: 14px 12px 6px; font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--steel-500); }
.menu a {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 2px;
    padding: 8px 10px;
    border-radius: 8px;
    color: var(--steel-400);
    font-size: 14px;
    text-decoration: none;
}
.menu a:hover { background: rgba(255, 255, 255, 0.05); color: var(--steel-200); }
.menu a.ativo { background: rgba(255, 255, 255, 0.1); color: var(--steel-100); box-shadow: inset 0 0 0 1px var(--linha); }
.ponto { width: 6px; height: 6px; border-radius: 50%; background: var(--steel-600); }
.menu a.ativo .ponto { background: var(--amber); }
.conta {
    display: flex;
    gap: 10px;
    align-items: center;
    margin: 12px;
    padding: 10px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.05);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}
.avatar {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--steel-700);
    font-family: var(--display);
    font-size: 14px;
}
.conta p { margin: 0; max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.sair { padding: 0; border: 0; background: none; color: var(--steel-400); font-size: 11px; cursor: pointer; }
.sair:hover { color: var(--amber); }
.principal { min-width: 0; flex: 1; }
.nav-movel, .topo-movel { display: flex; }
.topo-movel {
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--linha);
}
.nav-movel {
    gap: 4px;
    overflow-x: auto;
    padding: 8px 12px;
    border-bottom: 1px solid var(--linha);
}
.nav-movel a { white-space: nowrap; padding: 6px 10px; border-radius: 8px; color: var(--steel-300); font-size: 12px; text-decoration: none; }
.nav-movel a.ativo { background: rgba(255, 255, 255, 0.08); color: white; }
.pagina-topo {
    position: sticky;
    top: 0;
    z-index: 5;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 24px;
    border-bottom: 1px solid var(--linha);
    background: rgba(28, 34, 40, 0.72);
    backdrop-filter: blur(16px);
}
.abas { display: flex; gap: 18px; padding: 0 24px; border-bottom: 1px solid var(--linha); background: rgba(28, 34, 40, 0.45); }
.abas a { padding: 12px 0; color: var(--steel-400); text-decoration: none; border-bottom: 2px solid transparent; font-size: 14px; }
.abas a.ativo { color: white; border-bottom-color: var(--amber); }
.checks { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.check { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.pagina-topo h1 { margin: 0; font-size: 28px; }
.pagina-topo p, .miolo > p { margin: 4px 0 0; color: var(--steel-400); font-size: 14px; }
.acoes, .botoes { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.miolo { display: grid; gap: 16px; padding: 24px; }
.grade-kpi { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.passos { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.passos a { padding: 8px 12px; border-radius: 8px; background: rgba(255, 255, 255, 0.05); color: var(--steel-200); text-decoration: none; font-size: 14px; }
.passos a.feito { color: var(--ok); }
.grade-2 { display: grid; gap: 16px; }
.painel {
    border-radius: var(--raio);
    background: var(--painel);
    box-shadow: inset 0 0 0 1px var(--linha);
    backdrop-filter: blur(10px);
}
.painel-topo, .linha {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.painel-topo { padding: 16px 20px; border-bottom: 1px solid var(--linha); }
.painel-topo h2 { margin: 0; font-size: 20px; }
.painel-topo p, .vazio { margin: 2px 0 0; color: var(--steel-400); font-size: 12px; }
.vazio { padding: 36px 20px; text-align: center; font-size: 14px; }
.linha { padding: 12px 20px; border-top: 1px solid rgba(255, 255, 255, 0.05); }
.linha[hidden], .vazio[hidden] { display: none; }
.linha strong { display: block; font-size: 14px; font-weight: 600; }
.linha span, .sub { color: var(--steel-400); font-size: 12px; }
details { margin-top: 12px; }
details summary { cursor: pointer; color: var(--steel-300); }
.kpi { padding: 16px; }
.kpi span { color: var(--steel-400); font-family: var(--mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; }
.kpi strong { display: block; margin: 8px 0 4px; font-family: var(--display); font-size: 32px; }
.kpi em { color: var(--steel-400); font-size: 12px; font-style: normal; }
.kpi.alerta strong { color: var(--alert); }
.botao, .botao-sec, .link-alerta {
    border: 0;
    border-radius: 8px;
    padding: 8px 14px;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
}
.campo input[type="date"], .campo input[type="time"], .campo input[type="month"], .campo select, input[type="month"] {
    color-scheme: dark;
    background-color: #1c2228;
    color: var(--steel-100);
    min-height: 38px;
}
.pagina-topo .campo { display: grid; gap: 6px; width: min(220px, 70vw); }
input[type="month"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
    opacity: 0.75;
}
.dre-linha span { color: var(--steel-100); font-size: 14px; font-variant-numeric: tabular-nums; }
.dre-linha.deduz span { color: var(--steel-300); }
.dre-linha.destaque { background: rgba(255, 255, 255, 0.03); }
.dre-linha.destaque strong, .dre-linha.resultado strong, .dre-linha.resultado span { color: var(--steel-100); }
.dre-linha.resultado span { color: var(--amber); font-weight: 650; }
.botao { background: var(--amber); color: var(--steel-950); font-size: 14px; font-weight: 650; box-shadow: inset 0 0 0 1px rgba(230, 162, 60, 0.4); }
.botao:hover { background: var(--amber-dark); }
.botao:disabled { opacity: 0.5; cursor: not-allowed; }
.botao-sec, .busca { background: rgba(255, 255, 255, 0.05); color: var(--steel-200); box-shadow: inset 0 0 0 1px var(--linha); }
.botao-sec:hover { background: rgba(255, 255, 255, 0.1); }
.botao-copiado,
.botao-sec.botao-copiado {
    background: rgba(46, 160, 108, 0.22);
    color: #b7f0d0;
    box-shadow: inset 0 0 0 1px rgba(46, 160, 108, 0.55);
    transform: scale(0.98);
    transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.campo-link-protegido {
    margin: 0;
    padding: 10px 12px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.04);
    box-shadow: inset 0 0 0 1px var(--linha);
    color: var(--steel-400);
    font-size: 13px;
    line-height: 1.4;
    user-select: none;
    pointer-events: none;
}
.campo-link-oculto {
    letter-spacing: 0.12em;
    caret-color: transparent;
    user-select: none;
    cursor: default;
}
.busca { width: min(280px, 70vw); }
.link-alerta { background: none; color: var(--steel-400); font-size: 12px; }
.link-alerta:hover { color: var(--alert); }
.placa { font-family: var(--mono); color: var(--amber); }
.selo, .status {
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 11px;
    white-space: nowrap;
}
.selo { background: rgba(230, 162, 60, 0.15); color: var(--amber); box-shadow: inset 0 0 0 1px rgba(230, 162, 60, 0.25); }
.selo-alerta { background: rgba(225, 90, 74, 0.15); color: var(--alert); box-shadow: inset 0 0 0 1px rgba(225, 90, 74, 0.25); }
.status-agendado { background: rgba(255, 255, 255, 0.05); color: var(--steel-300); }
.status-em_execucao { background: rgba(230, 162, 60, 0.15); color: var(--amber); }
.status-aguardando_peca { background: rgba(62, 73, 84, 0.8); color: var(--steel-200); }
.status-concluido { background: rgba(61, 174, 140, 0.15); color: var(--ok); }
.status-cancelado, .status-erro { background: rgba(225, 90, 74, 0.15); color: var(--alert); }
.etapas { display: flex; gap: 8px; margin: 16px 0; }
.etapas span { flex: 1; padding: 8px 6px; border-radius: 8px; text-align: center; font-size: 12px; background: rgba(255, 255, 255, 0.05); color: var(--steel-400); }
.etapas .feito { color: var(--ok); }
.etapas .atual { background: rgba(230, 162, 60, 0.15); color: var(--amber); }
.fotos { display: flex; flex-wrap: wrap; gap: 12px; }
.fotos figure { margin: 0; }
.fotos img { display: block; width: 160px; height: 120px; object-fit: cover; border-radius: 8px; background: #1c2228; }
#assinatura, .assinatura { display: block; width: min(480px, 100%); height: 160px; border-radius: 8px; background: #fff; touch-action: none; }
.patio { align-items: start; }
@media (min-width: 1100px) {
    .patio { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.patio-card { display: grid; gap: 4px; padding: 12px 16px; border-top: 1px solid rgba(255, 255, 255, 0.05); }
.patio-card strong { font-family: var(--mono); color: var(--amber); }
@media (max-width: 720px) {
    .botao, .botao-sec { min-height: 44px; }
    .nav-movel a { padding: 10px 12px; font-size: 14px; }
}
.barra { height: 6px; margin-top: 8px; overflow: hidden; border-radius: 99px; background: rgba(62, 73, 84, 0.7); }
.barra i { display: block; height: 100%; background: var(--alert); }
.flash, .aviso-master {
    margin: 16px 24px 0;
    padding: 12px 14px;
    border-radius: 8px;
    background: rgba(230, 162, 60, 0.12);
    box-shadow: inset 0 0 0 1px rgba(230, 162, 60, 0.28);
}
.flash-erro { background: rgba(225, 90, 74, 0.12); box-shadow: inset 0 0 0 1px rgba(225, 90, 74, 0.3); }
.flash-ok { background: rgba(61, 174, 140, 0.12); box-shadow: inset 0 0 0 1px rgba(61, 174, 140, 0.3); }
.aviso-master, .aviso-certificado { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.aviso-master p, .aviso-certificado p { margin: 0; font-size: 14px; }
.aviso-certificado { margin: 16px 24px 0; padding: 12px 14px; border-radius: 8px; background: rgba(230, 162, 60, 0.12); box-shadow: inset 0 0 0 1px rgba(230, 162, 60, 0.28); }
dialog {
    width: min(680px, calc(100% - 32px));
    margin: auto;
    border: 0;
    border-radius: var(--raio);
    padding: 0;
    color: var(--steel-100);
    background: rgba(37, 44, 51, 0.98);
    box-shadow: inset 0 0 0 1px var(--linha);
}
dialog::backdrop { background: rgba(28, 34, 40, 0.72); backdrop-filter: blur(6px); }
dialog header, dialog .corpo { padding: 16px 20px; }
dialog header { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--linha); }
dialog h2 { margin: 0; font-size: 22px; }
dialog .corpo { display: grid; gap: 14px; max-height: min(72vh, 680px); overflow: auto; }
.grade-form { display: grid; gap: 14px; }
.grade-form > label:not(.check) { display: grid; gap: 6px; color: var(--steel-200); font-size: 13px; line-height: 1.4; }
.campo.largo { grid-column: 1 / -1; }
.campo .botao, .campo .botao-sec { margin-top: 8px; }
.erro { display: block; margin-top: 4px; color: var(--alert); font-size: 12px; }
.login-pagina { display: grid; min-height: 100vh; place-items: center; padding: 24px; }
.cartao-login { width: min(440px, 100%); padding: 32px; border-radius: var(--raio); background: rgba(255, 255, 255, 0.05); box-shadow: inset 0 0 0 1px var(--linha); }
.cartao-login h1 { margin: 28px 0 4px; font-size: 30px; }
.cartao-login > p { color: var(--steel-400); }
.cartao-login form { display: grid; gap: 14px; margin-top: 22px; }
.troca { display: block; width: 100%; margin-top: 18px; border: 0; background: none; color: var(--steel-400); text-align: center; text-decoration: none; cursor: pointer; }
.troca:hover { color: var(--amber); }
.direitos { margin: 18px 0 0; color: var(--steel-500); font-size: 11px; line-height: 1.45; text-align: center; }
.pagina-topo-fluxo { position: static; background: transparent; backdrop-filter: none; }
.pdv { align-items: start; position: relative; z-index: 0; }
.pdv-busca, .pdv-campos { padding: 16px 20px 20px; display: grid; gap: 14px; }
.pdv-busca .busca, .pdv-busca input { width: 100%; min-height: 48px; font-size: 16px; }
.pdv-resultados { display: grid; gap: 8px; padding: 0 20px 20px; }
.pdv-resultados[hidden] { display: none; }
.pdv-item, .pdv-linha {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 12px;
    align-items: center;
    padding: 12px;
    border-radius: 8px;
    background: rgba(28, 34, 40, 0.45);
}
.pdv-item strong, .pdv-linha strong { display: block; }
.pdv-linha { grid-template-columns: minmax(0, 1fr) 72px 108px auto; }
.pdv-linha input { width: 100%; }
.pdv-total { font-family: var(--display); font-size: 36px; line-height: 1; color: var(--amber); }
.pdv-troco-bloco {
    grid-column: 1 / -1;
    display: grid;
    gap: 12px;
    padding: 14px;
    border-radius: 12px;
    background: rgba(230, 162, 60, 0.1);
    box-shadow: inset 0 0 0 1px rgba(230, 162, 60, 0.35);
}
.pdv-troco-bloco[hidden] { display: none; }
@media (min-width: 560px) {
    .pdv-troco-bloco { grid-template-columns: minmax(0, 1fr) minmax(160px, 0.9fr); align-items: stretch; }
}
.pdv-recebido-campo input {
    min-height: 48px;
    font-size: 18px;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
}
.pdv-troco-painel {
    display: grid;
    align-content: center;
    gap: 4px;
    padding: 12px 14px;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.22);
    box-shadow: inset 0 0 0 1px var(--linha);
}
.pdv-troco-rotulo {
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--steel-400);
}
.pdv-troco-valor {
    font-family: var(--display);
    font-size: 28px;
    line-height: 1;
    color: var(--ok);
}
.pdv-troco-painel[data-estado="vazio"] .pdv-troco-valor { color: var(--steel-400); }
.pdv-troco-painel[data-estado="falta"] .pdv-troco-valor { color: var(--alert); }
.pdv-troco-painel[data-estado="exato"] .pdv-troco-valor { color: var(--steel-100); }
.pdv-troco-painel[data-estado="troco"] .pdv-troco-valor { color: var(--ok); }
.pdv-troco-painel .sub { margin: 2px 0 0; }
.pdv-ticket { position: relative; z-index: 1; background: #252c33; }
.pdv-ticket details { padding: 0; }
.pdv-ticket summary { margin-bottom: 8px; }
.pdv-pix-receber { display: grid; gap: 16px; padding: 16px 20px 20px; }
.pdv-pix-grade {
    display: grid;
    gap: 16px;
}
@media (min-width: 720px) {
    .pdv-pix-grade { grid-template-columns: 280px 1fr; align-items: start; }
}
.pdv-pix-qr {
    text-align: center;
    padding: 12px;
    border-radius: 12px;
    background: #fff;
    color: #1c2430;
}
.pdv-pix-qr img,
.pdv-pix-qr-svg svg {
    display: block;
    margin: 0 auto 8px;
    width: 280px;
    height: 280px;
    max-width: 100%;
}
.pdv-pix-qr-svg { line-height: 0; }
.pdv-pix-copia textarea {
    font-family: var(--mono, ui-monospace, monospace);
    font-size: 12px;
    word-break: break-all;
}
.pdv-pix-acoes {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}
.pdv-acoes {
    position: relative;
    z-index: 2;
    margin: 0 -20px -20px;
    padding: 14px 20px;
    background: #252c33;
    border-top: 1px solid var(--linha);
}
.pdv-docs { grid-column: 1 / -1; grid-row: 2; position: relative; z-index: 0; margin-top: 8px; background: #252c33; }
.principal > .direitos { padding: 8px 24px 28px; text-align: left; }
.lateral .direitos { margin: 0 16px 16px; text-align: left; }
@media (min-width: 960px) {
    .lateral { display: flex; }
    .nav-movel, .topo-movel { display: none; }
    .menu-toggle-ocultar { display: inline-flex; }
    html.menu-oculto .lateral { display: none; }
    html.menu-oculto .barra-menu-reabrir { display: flex; gap: 8px; flex-wrap: wrap; }
    html.menu-oculto .menu-toggle-mostrar,
    html.menu-oculto .menu-toggle-drawer { display: inline-flex; }
    html.menu-oculto .nav-movel,
    html.menu-oculto .topo-movel { display: flex; }
    .grade-kpi { grid-template-columns: repeat(4, 1fr); }
    .grade-2 { grid-template-columns: 2fr 1fr; }
    .grade-form { grid-template-columns: 1fr 1fr; }
    .pdv { grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.85fr); }
    .pdv-busca-painel { grid-column: 1; grid-row: 1; }
    .pdv-ticket { grid-column: 2; grid-row: 1; position: relative; top: auto; }
}

/* Dashboard gerencial — mobile first + períodos */
.dash {
    --dash-teal: #0d9488;
    --dash-teal-soft: rgba(13, 148, 136, 0.18);
    --dash-orange: #ea580c;
    --dash-orange-soft: rgba(234, 88, 12, 0.18);
    --dash-blue: #2563eb;
    --dash-blue-soft: rgba(37, 99, 235, 0.18);
    --dash-red: #b91c1c;
    --dash-red-soft: rgba(185, 28, 28, 0.18);
    --dash-violet: #7c3aed;
    --dash-violet-soft: rgba(124, 58, 237, 0.16);
    --dash-amber-soft: rgba(230, 162, 60, 0.2);
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.dash-topo {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
}
.dash-filtro-painel {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px;
    border-radius: var(--raio);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.03));
    box-shadow: inset 0 0 0 1px var(--linha);
}
.dash-periodos {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    padding-bottom: 2px;
}
.dash-mais {
    border-radius: 10px;
    background: rgba(28, 34, 40, 0.45);
    box-shadow: inset 0 0 0 1px var(--linha);
}
.dash-mais summary {
    cursor: pointer;
    list-style: none;
    padding: 10px 12px;
    color: var(--steel-200);
    font-size: 13px;
    font-weight: 500;
}
.dash-mais summary::-webkit-details-marker { display: none; }
.dash-mais[open] summary,
.dash-mais.aberto summary {
    color: #f0c06a;
    border-bottom: 1px solid var(--linha);
}
.dash-mais .dash-periodos-mais,
.dash-mais .dash-filtro-custom {
    padding: 10px 12px 12px;
}
.dash-mais .dash-filtro-custom { border-top: 1px solid var(--linha); }
.dash-comparativo-nota {
    margin: 0;
    color: var(--steel-400);
    font-size: 12px;
}
.dash-filtro-acoes {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: flex-end;
}
.dash-meta {
    display: grid;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 12px;
    background: rgba(28, 34, 40, 0.4);
    box-shadow: inset 0 0 0 1px var(--linha);
}
.dash-meta-form {
    display: grid;
    gap: 10px;
    grid-column: 1 / -1;
}
.dash-meta .campo { margin: 0; }
.dash-meta-dica { margin: 0; color: var(--steel-300); font-size: 12px; grid-column: 1 / -1; }
.dash-meta-progresso { margin: 0; color: var(--steel-300); font-size: 13px; }
.dash-meta-barra {
    height: 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    overflow: hidden;
}
.dash-meta-barra span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #2dd4bf, var(--dash-teal));
}
@media (min-width: 720px) {
    .dash-meta-form {
        grid-template-columns: minmax(180px, 240px) auto 1fr;
        align-items: end;
    }
    .dash-meta-dica,
    .dash-meta-progresso,
    .dash-meta-barra { grid-column: 1 / -1; }
}
.dash-kpi-link {
    display: block;
    color: inherit;
    text-decoration: none;
    transition: transform .12s ease, box-shadow .12s ease;
}
.dash-kpi-link:hover {
    transform: translateY(-1px);
    box-shadow: inset 0 0 0 1px rgba(230, 162, 60, 0.45);
}
.dash-delta {
    display: inline-block;
    margin-top: 8px;
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 0.02em;
}
.dash-delta-alta { color: #5eead4; }
.dash-delta-baixa { color: #fca5a5; }
.dash-delta-neutro { color: var(--steel-400); }
.dash-periodo {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(28, 34, 40, 0.65);
    box-shadow: inset 0 0 0 1px var(--linha);
    color: var(--steel-200);
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
}
.dash-periodo:hover { color: var(--steel-100); box-shadow: inset 0 0 0 1px rgba(230, 162, 60, 0.45); }
.dash-periodo.ativo {
    background: rgba(230, 162, 60, 0.2);
    color: #f0c06a;
    box-shadow: inset 0 0 0 1px rgba(230, 162, 60, 0.55);
}
.dash-filtro-extras {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.dash-filtro-mes,
.dash-filtro-custom { margin: 0; }
.dash-campo-mes { margin: 0; }
.dash-campo-mes input[type="month"] { width: 100%; min-height: 42px; }
.dash-personalizado-campos {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}
.dash-personalizado-campos .campo { margin: 0; }
.dash-personalizado-campos .botao,
.dash-personalizado-campos .botao-sec { width: 100%; min-height: 42px; }

.dash-saude {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px 16px;
    border-radius: var(--raio);
    background:
        linear-gradient(135deg, rgba(230, 162, 60, 0.18), rgba(37, 99, 235, 0.08)),
        var(--painel);
    box-shadow: inset 0 0 0 1px rgba(230, 162, 60, 0.32);
}
.dash-saude-selo {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    background: rgba(230, 162, 60, 0.22);
    color: var(--amber);
}
.dash-saude-ok {
    background: linear-gradient(135deg, var(--dash-teal-soft), rgba(255, 255, 255, 0.03)), var(--painel);
    box-shadow: inset 0 0 0 1px rgba(13, 148, 136, 0.4);
}
.dash-saude-ok .dash-saude-selo { background: var(--dash-teal-soft); color: #5eead4; }
.dash-saude-alerta {
    background: linear-gradient(135deg, var(--dash-red-soft), rgba(255, 255, 255, 0.03)), var(--painel);
    box-shadow: inset 0 0 0 1px rgba(185, 28, 28, 0.4);
}
.dash-saude-alerta .dash-saude-selo { background: var(--dash-red-soft); color: #fca5a5; }
.dash-saude-main { flex: 1 1 auto; }
.dash-saude-detalhe { margin: 8px 0 0; font-size: 14px; color: var(--steel-100); }
.dash-saude-aviso { margin: 0; color: var(--steel-400); font-size: 12px; }

.dash-escopo {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px;
    border-radius: var(--raio);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.03));
    box-shadow: inset 0 0 0 1px var(--linha), 0 10px 28px rgba(0, 0, 0, 0.18);
}
.dash-escopo-periodo { box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.28), 0 10px 28px rgba(0, 0, 0, 0.18); }
.dash-escopo-agora { box-shadow: inset 0 0 0 1px rgba(13, 148, 136, 0.28), 0 10px 28px rgba(0, 0, 0, 0.18); }
.dash-escopo-topo {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
}
.dash-escopo-selo {
    margin: 0 0 6px;
    font-family: var(--mono);
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--steel-400);
}
.dash-escopo-periodo .dash-escopo-selo { color: #93c5fd; }
.dash-escopo-agora .dash-escopo-selo { color: #5eead4; }
.dash-escopo-topo h2 { margin: 0; font-size: 22px; }
.dash-escopo-topo p { margin: 4px 0 0; color: var(--steel-400); font-size: 13px; }
.dash-escopo-topo .botao-sec { align-self: flex-start; }
.dash-bloco {
    padding: 14px;
    border-radius: var(--raio);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.03));
    box-shadow: inset 0 0 0 1px var(--linha), 0 10px 28px rgba(0, 0, 0, 0.18);
}
.dash-bloco-serie {
    padding: 14px;
    border-radius: 12px;
    background: rgba(28, 34, 40, 0.35);
    box-shadow: inset 0 0 0 1px var(--linha);
}
.dash-bloco-serie h3 { margin: 0; font-size: 16px; }
.dash-bloco-topo {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    margin-bottom: 12px;
}
.dash-bloco-topo h2 { margin: 0; font-size: 20px; }
.dash-bloco-topo p { margin: 4px 0 0; color: var(--steel-400); font-size: 13px; }
.dash-bloco-topo .botao-sec { align-self: flex-start; }

.dash-kpis { display: grid; grid-template-columns: 1fr; gap: 10px; }
.dash-kpi {
    position: relative;
    overflow: hidden;
    padding: 12px 14px 12px 16px;
    border-radius: 12px;
    background: rgba(28, 34, 40, 0.55);
    box-shadow: inset 0 0 0 1px var(--linha);
}
.dash-kpi::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--steel-500);
}
.dash-kpi-amber { background: linear-gradient(135deg, var(--dash-amber-soft), rgba(28, 34, 40, 0.45)); }
.dash-kpi-amber::before { background: var(--amber); }
.dash-kpi-amber strong { color: #f0c06a; }
.dash-kpi-teal { background: linear-gradient(135deg, var(--dash-teal-soft), rgba(28, 34, 40, 0.45)); }
.dash-kpi-teal::before { background: var(--dash-teal); }
.dash-kpi-teal strong { color: #5eead4; }
.dash-kpi-blue { background: linear-gradient(135deg, var(--dash-blue-soft), rgba(28, 34, 40, 0.45)); }
.dash-kpi-blue::before { background: var(--dash-blue); }
.dash-kpi-blue strong { color: #93c5fd; }
.dash-kpi-orange { background: linear-gradient(135deg, var(--dash-orange-soft), rgba(28, 34, 40, 0.45)); }
.dash-kpi-orange::before { background: var(--dash-orange); }
.dash-kpi-orange strong { color: #fdba74; }
.dash-kpi-red { background: linear-gradient(135deg, var(--dash-red-soft), rgba(28, 34, 40, 0.45)); }
.dash-kpi-red::before { background: var(--dash-red); }
.dash-kpi-red strong { color: #fca5a5; }
.dash-kpi-violet { background: linear-gradient(135deg, var(--dash-violet-soft), rgba(28, 34, 40, 0.45)); }
.dash-kpi-violet::before { background: var(--dash-violet); }
.dash-kpi-violet strong { color: #c4b5fd; }
.dash-kpi span {
    color: var(--steel-300);
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.dash-kpi strong {
    display: block;
    margin: 8px 0 4px;
    font-family: var(--display);
    font-size: 26px;
    line-height: 1.05;
    word-break: break-word;
}
.dash-kpi em { color: var(--steel-400); font-size: 12px; font-style: normal; }

.dash-visuais { display: grid; gap: 12px; grid-template-columns: 1fr; }
.dash-card-chart {
    padding: 14px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.04);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.dash-card-chart h3 {
    margin: 0 0 12px;
    font-size: 15px;
    font-weight: 600;
    color: var(--steel-100);
}
.dash-bars {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    min-height: 170px;
    align-items: end;
}
.dash-bars-3 { grid-template-columns: repeat(3, 1fr); }
.dash-bar-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    min-width: 0;
}
.dash-bar-track {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    width: 100%;
    height: 110px;
    padding: 8px 0 0;
    border-radius: 10px;
    background:
        linear-gradient(to top, transparent 0, transparent calc(25% - 1px), rgba(255, 255, 255, 0.04) calc(25% - 1px), rgba(255, 255, 255, 0.04) 25%, transparent 25%),
        linear-gradient(to top, transparent 0, transparent calc(50% - 1px), rgba(255, 255, 255, 0.05) calc(50% - 1px), rgba(255, 255, 255, 0.05) 50%, transparent 50%),
        linear-gradient(to top, transparent 0, transparent calc(75% - 1px), rgba(255, 255, 255, 0.04) calc(75% - 1px), rgba(255, 255, 255, 0.04) 75%, transparent 75%),
        rgba(12, 16, 20, 0.35);
}
.dash-bar-fill {
    display: block;
    width: 28px;
    max-width: 55%;
    min-height: 0;
    border-radius: 8px 8px 3px 3px;
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.25);
}
.dash-bar-fill.is-zero,
.dash-barra.is-zero {
    height: 0 !important;
    min-height: 0;
    box-shadow: none;
    opacity: 0;
}
.dash-bar-item strong {
    font-family: var(--mono);
    font-size: 11px;
    font-weight: 500;
    color: var(--steel-200);
    text-align: center;
}
.dash-bar-item em {
    font-size: 11px;
    font-style: normal;
    color: var(--steel-400);
    text-align: center;
    line-height: 1.25;
}
.dash-c-teal { background: var(--dash-teal); }
.dash-c-orange { background: var(--dash-orange); }
.dash-c-blue { background: var(--dash-blue); }
.dash-c-red { background: var(--dash-red); }
.dash-c-violet { background: var(--dash-violet); }

.dash-donut-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    min-height: 200px;
    justify-content: center;
}
.dash-donut {
    position: relative;
    width: 148px;
    height: 148px;
    border-radius: 50%;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
}
.dash-donut-furo {
    position: absolute;
    inset: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #1f262d;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
}
.dash-donut-furo strong {
    font-family: var(--display);
    font-size: 30px;
    line-height: 1;
}
.dash-donut-furo span {
    color: var(--steel-400);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.dash-donut-legenda {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 14px;
    width: 100%;
}
.dash-donut-legenda li {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--steel-300);
    font-size: 12px;
}
.dash-donut-legenda i {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 3px;
}
.dash-donut-legenda b {
    margin-left: 2px;
    color: var(--steel-100);
    font-family: var(--mono);
    font-weight: 500;
}

.dash-serie-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
}
.dash-serie {
    display: grid;
    grid-template-columns: repeat(var(--dash-cols, 4), minmax(52px, 1fr));
    gap: 8px;
    min-width: min(100%, calc(var(--dash-cols, 4) * 56px));
    min-height: 170px;
    align-items: end;
}
.dash-serie-col { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; }
.dash-serie-barras {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 3px;
    width: 100%;
    height: 110px;
    padding: 0 4px;
    border-radius: 8px;
    background: rgba(28, 34, 40, 0.4);
}
.dash-barra {
    display: block;
    width: 42%;
    max-width: 16px;
    min-height: 2px;
    border-radius: 6px 6px 2px 2px;
}
.dash-barra-receita { background: linear-gradient(180deg, #2dd4bf, var(--dash-teal)); }
.dash-barra-despesa { background: linear-gradient(180deg, #fb923c, var(--dash-orange)); }
.dash-serie-col strong { font-size: 11px; color: var(--steel-300); font-weight: 500; text-align: center; }
.dash-serie-col em { font-size: 10px; font-style: normal; color: var(--steel-400); font-family: var(--mono); text-align: center; }
.dash-serie-col em.neg { color: #fca5a5; }
.dash-legenda {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 12px 0 0;
    color: var(--steel-400);
    font-size: 12px;
}
.dash-legenda .dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 6px;
    border-radius: 99px;
    vertical-align: middle;
}
.dash-legenda .dot.receita { background: var(--dash-teal); }
.dash-legenda .dot.despesa { background: var(--dash-orange); }
.dash-atalhos { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.dash-atalhos .botao,
.dash-atalhos .botao-sec { flex: 1 1 140px; text-align: center; }
.dash-ops { display: grid; gap: 10px; margin-top: 2px; }
.dash-op {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas: "titulo valor" "sub valor" "acao acao";
    gap: 4px 12px;
    align-items: center;
    padding: 12px 14px;
    border-radius: 12px;
    background: rgba(28, 34, 40, 0.55);
    box-shadow: inset 0 0 0 1px var(--linha);
}
.dash-op span { grid-area: titulo; color: var(--steel-400); font-family: var(--mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; }
.dash-op strong { grid-area: valor; font-family: var(--display); font-size: 32px; line-height: 1; text-align: right; }
.dash-op em { grid-area: sub; color: var(--steel-400); font-size: 12px; font-style: normal; }
.dash-op .botao-sec { grid-area: acao; justify-self: start; margin-top: 6px; }
.dash-op-teal { background: linear-gradient(135deg, var(--dash-teal-soft), rgba(28, 34, 40, 0.5)); box-shadow: inset 0 0 0 1px rgba(13, 148, 136, 0.35); }
.dash-op-teal strong { color: #5eead4; }
.dash-op-blue { background: linear-gradient(135deg, var(--dash-blue-soft), rgba(28, 34, 40, 0.5)); box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.35); }
.dash-op-blue strong { color: #93c5fd; }
.dash-op-red { background: linear-gradient(135deg, var(--dash-red-soft), rgba(28, 34, 40, 0.5)); box-shadow: inset 0 0 0 1px rgba(185, 28, 28, 0.4); }
.dash-op-red strong { color: #fca5a5; }
.dash-bloco-atalhos .dash-atalhos { margin-top: 0; }

@media (min-width: 480px) {
    .dash-kpis { grid-template-columns: 1fr 1fr; }
    .dash-bars { grid-template-columns: repeat(4, 1fr); }
    .dash-personalizado-campos { grid-template-columns: 1fr 1fr; }
    .dash-personalizado-campos .botao,
    .dash-personalizado-campos .botao-sec { grid-column: 1 / -1; }
}
@media (min-width: 720px) {
    .dash { gap: 16px; }
    .dash-topo { flex-direction: row; align-items: flex-end; justify-content: space-between; }
    .dash-campo-mes { min-width: 180px; max-width: 240px; }
    .dash-saude { flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 18px 20px; }
    .dash-saude-aviso { max-width: 320px; align-self: center; }
    .dash-escopo { padding: 18px 20px 20px; gap: 16px; }
    .dash-escopo-topo { flex-direction: row; align-items: flex-start; justify-content: space-between; }
    .dash-bloco { padding: 18px 20px 20px; }
    .dash-bloco-topo { flex-direction: row; align-items: flex-start; justify-content: space-between; }
    .dash-bloco-topo h2 { font-size: 22px; }
    .dash-kpi strong { font-size: 28px; }
    .dash-donut { width: 168px; height: 168px; }
    .dash-donut-furo { inset: 28px; }
    .dash-donut-furo strong { font-size: 34px; }
    .dash-op strong { font-size: 36px; }
}
@media (min-width: 900px) {
    .dash-kpis { grid-template-columns: repeat(3, 1fr); }
    .dash-visuais { grid-template-columns: repeat(3, 1fr); align-items: stretch; }
    .dash-ops { grid-template-columns: repeat(3, 1fr); }
    .dash-atalhos .botao,
    .dash-atalhos .botao-sec { flex: 0 1 auto; }
}

/* Visualizador de fotos da entrada — zoom no balcão e na rampa */
body.foto-zoom-aberto { overflow: hidden; }
.fotos img[data-foto-zoom] {
    cursor: zoom-in;
    transition: transform .15s ease, box-shadow .15s ease;
}
.fotos img[data-foto-zoom]:hover,
.fotos img[data-foto-zoom]:focus-visible {
    transform: scale(1.03);
    box-shadow: 0 0 0 2px var(--amber);
    outline: none;
}
.foto-zoom {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: grid;
    place-items: center;
}
.foto-zoom[hidden] { display: none !important; }
.foto-zoom-fundo {
    position: absolute;
    inset: 0;
    background: rgba(12, 16, 20, 0.88);
    cursor: zoom-out;
}
.foto-zoom-caixa {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-rows: auto 1fr auto;
    width: min(1100px, 100vw);
    height: min(100dvh, 100vh);
    max-height: 100dvh;
    padding: 12px 12px 16px;
    gap: 8px;
}
.foto-zoom-topo { text-align: center; color: #e8edf2; }
.foto-zoom-titulo { margin: 0; font-weight: 700; }
.foto-zoom-dica { margin: 4px 0 0; font-size: 13px; color: #9aa7b5; }
.foto-zoom-palco {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    background: #0f1419;
    touch-action: none;
    display: grid;
    place-items: center;
    min-height: 0;
}
.foto-zoom-palco.foto-zoom-arraste { cursor: grab; }
.foto-zoom-palco.foto-zoom-arraste:active { cursor: grabbing; }
.foto-zoom-palco img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    transform-origin: center center;
    user-select: none;
    -webkit-user-drag: none;
}
.foto-zoom-barra {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
}
.foto-zoom-acoes { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
@media (max-width: 720px) {
    .foto-zoom-barra { justify-content: center; }
    .foto-zoom-dica { font-size: 12px; }
}