/* ==========================================================================
   Juá · gestão: o visual dos painéis do grupo (vidro, fio de luz, brilho suave) no café e dourado do Juá.
   Fundo café quase preto com grade fina, cartões de vidro quente, títulos em Fraunces itálico e números em Manrope.
   Cores dos dados em Componentes/Graficos/Cores.cs. Situação nunca é só cor: vai sempre a palavra junto.
   ========================================================================== */
:root {
    --fundo: #130d09;
    --cartao: #1e150f;
    --cartao-2: #281c13;
    --borda: rgba(222, 184, 140, .14);
    --borda-forte: rgba(222, 184, 140, .32);
    --tinta: #f3e7d6;
    --tinta-2: #cbb9a3;
    --tinta-3: #927f6c;
    --grade: rgba(222, 188, 150, .08);
    --ouro: #c98f56;
    --ouro-claro: #ecc9a0;
    --link: #ddb084;
    --bom: #3fd16b;
    --ruim: #ff7a6e;
    --ok: #3fd16b;
    --atencao: #d98e3f;
    --critico: #ff6b5e;
    --info: #ddb084;
    --cor-empresa: var(--ouro);
    --barra: 48px;
    --raio: 16px;
    color-scheme: dark;
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
    margin: 0;
    color: var(--tinta);
    font-family: Manrope, system-ui, -apple-system, "Segoe UI", sans-serif;
    -webkit-font-smoothing: antialiased;
    background:
        radial-gradient(1100px 500px at 10% -10%, rgba(201, 143, 86, .20), transparent 60%),
        radial-gradient(900px 500px at 100% 0%, rgba(224, 123, 57, .12), transparent 60%),
        linear-gradient(var(--grade) 1px, transparent 1px) 0 0 / 40px 40px,
        linear-gradient(90deg, var(--grade) 1px, transparent 1px) 0 0 / 40px 40px,
        var(--fundo) !important;
    background-attachment: fixed !important;
}
a { color: var(--link); }
::selection { background: rgba(201, 143, 86, .35); }
h1, h2, h3, .ic-valor, .md-texto b, .gr-centro b, .mm-valor b, .ec-principal b, .un-numero b, .marca-nome, .painel-titulo {
    font-family: Manrope, system-ui, sans-serif; letter-spacing: -.01em;
}
.primeira-maiuscula { display: inline-block; }
.primeira-maiuscula::first-letter { text-transform: uppercase; }

/* ---------- Barra do topo, menu e conteúdo ---------- */
/* iPhone com o painel instalado: a barra começa abaixo do relógio/entalhe */
.barra-topo {
    padding-top: env(safe-area-inset-top); padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right);
    background: rgba(19, 13, 9, .78) !important; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--borda);
}
.marca { display: flex; flex-direction: column; margin-left: 8px; text-decoration: none; line-height: 1; }
.marca-nome {
    font-weight: 800; letter-spacing: .2em; text-transform: uppercase; font-size: .95rem;
    background: linear-gradient(90deg, #ffffff, #ecc9a0 60%, #9c6638); -webkit-background-clip: text; background-clip: text; color: transparent;
    filter: drop-shadow(0 0 10px rgba(201, 143, 86, .45));
}
.marca-grupo { color: var(--tinta-3); font-size: .6rem; letter-spacing: .3em; text-transform: uppercase; margin-top: 4px; }
.marca.grande { margin: 0 0 6px; }
.marca.grande .marca-nome { font-size: 1.6rem; }
.marca.grande .marca-grupo { font-size: .7rem; margin-top: 8px; }
.usuario { color: var(--tinta-2); font-size: .82rem; margin-right: 6px; }
.menu-lateral { border-right: 1px solid var(--borda) !important; background: rgba(18, 12, 8, .96) !important; }
.menu-lateral .mud-nav-link { border-radius: 10px; margin: 2px 8px; width: auto; }
.menu-lateral .mud-nav-link.active { color: #fff !important; background: linear-gradient(135deg, rgba(168, 116, 66, .55), rgba(110, 69, 40, .35)) !important; box-shadow: 0 0 18px rgba(201, 143, 86, .25); }
.menu-lateral .mud-nav-link.active .mud-nav-link-icon { color: #fff !important; }

.conteudo { padding: 18px 16px calc(32px + env(safe-area-inset-bottom)); }
@media (min-width: 600px) { .conteudo { padding: 24px 24px 48px; } }

/* ---------- Central (Home, empresa, unidade) ---------- */
.central { overflow-x: clip; }
.central:fullscreen { overflow-y: auto; padding: 24px 28px 48px; background: inherit; }
.central:fullscreen { background:
        radial-gradient(1100px 500px at 10% -10%, rgba(201, 143, 86, .20), transparent 60%),
        radial-gradient(900px 500px at 100% 0%, rgba(224, 123, 57, .12), transparent 60%),
        linear-gradient(var(--grade) 1px, transparent 1px) 0 0 / 40px 40px,
        linear-gradient(90deg, var(--grade) 1px, transparent 1px) 0 0 / 40px 40px,
        var(--fundo); }
.central:fullscreen .lux-nav { top: 0; }

.lux-topo { display: flex; flex-wrap: wrap; gap: 14px 16px; align-items: flex-end; justify-content: space-between; margin-bottom: 14px; }
.lux-titulo-voltar { display: flex; gap: 12px; align-items: flex-start; min-width: 0; }
.lux-voltar { margin-top: 18px; flex: none; }
.lux-sobretitulo { font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--ouro); font-weight: 700; }
.lux-topo h1, .painel-titulo {
    margin: 2px 0 4px; font-size: clamp(1.6rem, 4.2vw, 2.4rem); font-weight: 800; line-height: 1.1;
    background: linear-gradient(90deg, #ffffff, #ecc9a0 60%, #9c6638); -webkit-background-clip: text; background-clip: text; color: transparent;
    overflow-wrap: anywhere;
}
.lux-periodo { color: var(--tinta-3); font-size: .85rem; display: flex; flex-wrap: wrap; align-items: center; gap: 0 6px; }
.lux-periodo .situacao { margin-right: 2px; }
.lux-acoes { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.lux-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.lux-chips.rolagem { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.lux-chips.rolagem::-webkit-scrollbar { display: none; }
.lux-chip, .lux-botao {
    border: 1px solid var(--borda); background: rgba(36, 25, 17, .8); color: var(--tinta-2); text-decoration: none;
    border-radius: 999px; padding: 6px 12px; font: 500 .8rem Manrope, sans-serif; cursor: pointer; transition: all .15s;
    display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; flex: none;
}
.lux-botao { padding: 7px; }
.lux-chip:hover, .lux-botao:hover:not(:disabled) { border-color: var(--borda-forte); color: var(--tinta); }
.lux-botao:disabled { opacity: .55; cursor: default; }
.lux-chip.ativo { background: linear-gradient(135deg, #a87442, #6e4528); color: #fff; border-color: transparent; box-shadow: 0 0 18px rgba(201, 143, 86, .45); }
.lux-chip.ativo.critico { background: linear-gradient(135deg, #c8473d, #8f2a22); box-shadow: 0 0 18px rgba(255, 107, 94, .4); }
.lux-chip.ativo.atencao { background: linear-gradient(135deg, #a8692e, #6f4524); box-shadow: 0 0 18px rgba(217, 142, 63, .35); }
.lux-chip small { opacity: .75; margin-left: 2px; font-variant-numeric: tabular-nums; }
.girando { animation: girar 1s linear infinite; }
@keyframes girar { to { transform: rotate(360deg); } }

/* Menu de seções: fixo no topo ao rolar, de lado no celular */
.lux-nav {
    position: sticky; top: calc(var(--barra) + env(safe-area-inset-top)); z-index: 5; display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none;
    margin: 0 -4px 18px; padding: 8px 4px; background: rgba(19, 13, 9, .82); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--borda);
}
.lux-nav::-webkit-scrollbar { display: none; }
.lux-nav a { flex: none; display: inline-flex; align-items: center; gap: 7px; color: var(--tinta-2); text-decoration: none; font-size: .82rem; padding: 6px 12px; border-radius: 8px; }
.lux-nav a:hover { color: #fff; background: rgba(201, 143, 86, .16); }
.lux-nav-cor { width: 7px; height: 7px; border-radius: 50%; box-shadow: 0 0 8px currentColor; }
@media (max-width: 959px) { .lux-so-pc { display: none !important; } }

/* ---------- Estrutura ---------- */
.lux-secao { margin-bottom: 34px; scroll-margin-top: calc(var(--barra) + 64px); }
.lux-secao-topo { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.lux-secao h2 { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 1.25rem; font-weight: 700; }
.lux-secao h2 > .mud-icon-root { color: var(--ouro); filter: drop-shadow(0 0 6px rgba(201, 143, 86, .7)); }
.lux-secao h2 small { display: block; font: 600 .66rem Manrope, sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--tinta-3); margin-top: 2px; }
.lux-ajuda { font-size: .76rem; color: var(--tinta-3); }

.lux-cartao, .cartao, .login-cartao {
    position: relative; background: linear-gradient(180deg, var(--cartao-2), var(--cartao));
    border: 1px solid var(--borda); border-radius: var(--raio); padding: 16px; min-width: 0;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .04);
}
.lux-cartao::before, .cartao::before, .login-cartao::before {
    content: ""; position: absolute; inset: 0 20% auto; height: 1px; pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(236, 201, 160, .55), transparent);
}
.lux-cartao-titulo { font-weight: 600; font-size: .95rem; margin-bottom: 12px; color: var(--tinta); }
.lux-cartao-titulo small { display: block; font-weight: 400; color: var(--tinta-3); font-size: .75rem; margin-top: 2px; }
.lux-rodape-cartao { margin-top: 10px; font-size: .74rem; color: var(--tinta-3); text-align: right; }
.lux-vazio { text-align: center; color: var(--tinta-2); padding: 26px 16px; }
.lux-vazio-motivo { margin-top: 6px; font-size: .8rem; color: var(--tinta-3); }
.lux-link { display: inline-flex; align-items: center; gap: 4px; color: var(--link); text-decoration: none; font-size: .82rem; font-weight: 600; }
.lux-link:hover { color: #fff; }

.lux-grade { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 960px) {
    .lux-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lux-2-1 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
    .lux-2 > .lux-largo { grid-column: 1 / -1; }
}

/* ---------- Visão geral ---------- */
.lux-hero { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1100px) { .lux-hero { grid-template-columns: 320px minmax(0, 1fr); } }
.lux-saude { display: flex; flex-direction: column; }
.lux-notas { display: grid; gap: 4px; margin-top: 10px; }
.lux-nota { display: grid; grid-template-columns: 82px 1fr 30px; gap: 10px; align-items: center; font-size: .8rem; color: var(--tinta-2); text-decoration: none; padding: 4px 6px; margin: 0 -6px; border-radius: 8px; }
.lux-nota:hover { background: rgba(201, 143, 86, .10); color: var(--tinta); }
.lux-nota span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lux-nota b { text-align: right; color: var(--tinta); font-variant-numeric: tabular-nums; }
.lux-nota.sem-dados { opacity: .55; }
.lux-nota.sem-dados b { color: var(--tinta-3); }
.lux-nota-cor { width: 7px; height: 7px; border-radius: 50%; flex: none; }
.lux-legenda-nota { margin-top: 12px; font-size: .72rem; line-height: 1.45; color: var(--tinta-3); }

.lux-empresas { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .lux-empresas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Cartão da empresa na visão geral */
.ec {
    position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 14px 16px 16px;
    color: inherit; text-decoration: none; border-radius: var(--raio); border: 1px solid var(--borda);
    background:
        radial-gradient(420px 160px at 0% 0%, color-mix(in srgb, var(--cor-empresa) 22%, transparent), transparent 70%),
        linear-gradient(180deg, var(--cartao-2), var(--cartao));
    box-shadow: 0 10px 30px rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .04);
    transition: transform .15s, border-color .15s, box-shadow .15s;
}
.ec::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 3px; border-radius: 0 3px 3px 0; background: var(--cor-empresa); box-shadow: 0 0 14px var(--cor-empresa); }
.ec:hover { transform: translateY(-2px); border-color: var(--borda-forte); box-shadow: 0 0 26px color-mix(in srgb, var(--cor-empresa) 28%, transparent); }
.ec-topo { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ec-icone, .empresa-icone { flex: none; width: 34px; height: 34px; border-radius: 10px; display: inline-grid; place-items: center; }
.ec-nome { flex: 1; min-width: 0; font-weight: 600; font-size: .95rem; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ec-nome small { display: block; font-weight: 500; font-size: .66rem; letter-spacing: .16em; text-transform: uppercase; color: var(--tinta-3); margin-top: 2px; }
.ec-principal { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; position: relative; z-index: 1; }
.ec-principal small { flex-basis: 100%; font-size: .74rem; color: var(--tinta-2); }
.ec-principal b { font-size: clamp(1.6rem, 3.4vw, 2.1rem); font-weight: 700; line-height: 1.05; font-variant-numeric: tabular-nums; text-shadow: 0 0 22px color-mix(in srgb, var(--cor-empresa) 45%, transparent); }
.ec-principal span { font-size: .76rem; color: var(--tinta-3); }
.ec-outros { display: grid; gap: 5px; position: relative; z-index: 1; }
.ec-outros div { display: flex; justify-content: space-between; gap: 10px; font-size: .8rem; color: var(--tinta-2); }
.ec-outros span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ec-outros b { color: var(--tinta); font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ec-vazio { font-size: .84rem; color: var(--tinta-3); padding: 10px 0; }
.ec-rodape { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; position: relative; z-index: 1; }
.ec-spark { height: 46px; opacity: .35; }

/* Pílulas de quantidade de alertas */
.pilula { display: inline-flex; align-items: center; gap: 4px; font-size: .7rem; font-weight: 700; padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
.pilula.critico { color: var(--ruim); background: rgba(255, 122, 110, .14); }
.pilula.atencao { color: var(--atencao); background: rgba(217, 142, 63, .13); }
.pilula.ok { color: var(--bom); background: rgba(63, 209, 107, .11); font-weight: 600; }

/* Situação das fontes */
.situacao { display: inline-flex; align-items: center; gap: 6px; font-size: .74rem; color: var(--tinta-2); white-space: nowrap; }
.situacao i { width: 7px; height: 7px; border-radius: 50%; background: var(--tinta-3); flex: none; }
.situacao.ok i { background: var(--bom); box-shadow: 0 0 0 3px rgba(63, 209, 107, .15), 0 0 10px rgba(63, 209, 107, .6); }
.situacao.atencao { color: var(--atencao); } .situacao.atencao i { background: var(--atencao); }
.situacao.critico { color: var(--ruim); } .situacao.critico i { background: var(--ruim); }

/* Números (KPIs) */
.lux-kpis { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 900px) { .lux-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.lux-numeros { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 700px) { .lux-numeros { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); } }

.ic {
    position: relative; overflow: hidden; min-width: 0; display: block; color: inherit; text-decoration: none;
    background: linear-gradient(160deg, color-mix(in srgb, var(--ic-cor, var(--ouro)) 13%, transparent), rgba(36, 25, 17, .95) 48%);
    border: 1px solid var(--borda); border-radius: 14px; padding: 12px 14px 16px;
    transition: transform .15s, border-color .15s, box-shadow .15s;
}
.ic-link { cursor: pointer; }
.ic-link:hover { transform: translateY(-2px); border-color: var(--borda-forte); box-shadow: 0 0 24px color-mix(in srgb, var(--ic-cor, var(--ouro)) 25%, transparent); }
.ic.ic-atencao { border-color: rgba(217, 142, 63, .35); }
.ic.ic-critico { border-color: rgba(255, 122, 110, .45); box-shadow: 0 0 20px rgba(255, 107, 94, .12); }
.ic-topo { display: flex; align-items: center; gap: 8px; min-height: 26px; }
.ic-icone { width: 26px; height: 26px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.ic-icone .mud-icon-root { font-size: 1.05rem; }
.ic-titulo { flex: 1; min-width: 0; font-size: .76rem; color: var(--tinta-2); line-height: 1.25; }
.ic-titulo small { display: block; font-size: .66rem; color: var(--tinta-3); }
.ic-selo { flex: none; font-size: .62rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 2px 7px; border-radius: 999px; }
.ic-selo.atencao { color: var(--atencao); background: rgba(217, 142, 63, .13); }
.ic-selo.critico { color: var(--ruim); background: rgba(255, 122, 110, .14); }
.ic-valor { font-size: clamp(1.2rem, 2.4vw, 1.7rem); font-weight: 700; margin-top: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; position: relative; z-index: 1; }
.ic-rodape { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 4px; position: relative; z-index: 1; }
.ic-detalhe { font-size: .72rem; color: var(--tinta-3); min-width: 0; overflow-wrap: anywhere; }
.ic-delta { font-size: .72rem; font-weight: 700; padding: 2px 7px; border-radius: 999px; white-space: nowrap; }
.ic-delta.bom { color: var(--bom); background: rgba(63, 209, 107, .12); }
.ic-delta.ruim { color: var(--ruim); background: rgba(255, 122, 110, .12); }
.ic-delta.neutro { color: var(--tinta-2); background: rgba(255, 255, 255, .06); }
.ic-spark { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 34px; opacity: .5; pointer-events: none; }
.ic-compacto .ic-valor { font-size: clamp(1.1rem, 2vw, 1.4rem); }

/* Medidor de saúde */
.md { position: relative; max-width: 260px; margin: 0 auto; width: 100%; }
.md svg { width: 100%; display: block; overflow: visible; }
.md-arco { filter: drop-shadow(0 0 8px var(--md-cor)); transition: stroke-dasharray .8s ease; }
.md-texto { position: absolute; left: 0; right: 0; bottom: 0; text-align: center; }
.md-texto b { display: block; font-size: 2.8rem; line-height: 1; font-weight: 800; }
.md-texto span { font-size: .8rem; color: var(--md-cor); font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
.md-titulo { text-align: center; font-size: .8rem; color: var(--tinta-2); margin-top: 12px; }

/* Medidores de meta */
.lux-medidores { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 700px) { .lux-medidores { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); } }
.mm {
    position: relative; display: flex; flex-direction: column; min-width: 0; padding: 12px 12px 10px; color: inherit; text-decoration: none;
    border-radius: 14px; border: 1px solid var(--borda);
    background: radial-gradient(260px 120px at 50% 100%, color-mix(in srgb, var(--md-cor) 14%, transparent), transparent 70%), linear-gradient(180deg, var(--cartao-2), var(--cartao));
    transition: transform .15s, border-color .15s;
}
.mm-link:hover { transform: translateY(-2px); border-color: var(--borda-forte); }
.mm-titulo { font-size: .76rem; color: var(--tinta-2); line-height: 1.25; min-height: 2.5em; }
.mm-arco { position: relative; margin: 4px auto 0; width: 100%; max-width: 190px; }
.mm-arco svg { width: 100%; display: block; overflow: visible; }
.mm-meta { stroke: #f3e7d6; stroke-width: 3; stroke-linecap: round; filter: drop-shadow(0 0 4px rgba(255, 255, 255, .7)); }
.mm-valor { position: absolute; left: 0; right: 0; bottom: 0; text-align: center; }
.mm-valor b { display: block; font-size: clamp(1.05rem, 2.2vw, 1.35rem); font-weight: 700; line-height: 1.1; white-space: nowrap; font-variant-numeric: tabular-nums; }
.mm-valor span { font-size: .64rem; color: var(--md-cor); font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }
.mm-rodape { display: flex; flex-direction: column; align-items: center; margin-top: 6px; font-size: .72rem; color: var(--tinta-3); text-align: center; }
.mm-rodape small { font-size: .66rem; opacity: .85; }

/* ---------- Alertas ---------- */
.alertas { display: grid; gap: 10px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 800px) { .alertas.em-colunas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1400px) { .alertas.em-colunas { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.alerta {
    --tom: var(--info);
    position: relative; padding: 12px 14px 12px 16px; border-radius: 14px; min-width: 0;
    background: linear-gradient(180deg, var(--cartao-2), var(--cartao)); border: 1px solid var(--borda);
    box-shadow: inset 3px 0 0 var(--tom);
}
.alerta.critico { --tom: #ff6b5e; background: linear-gradient(180deg, rgba(255, 107, 94, .10), var(--cartao) 70%); border-color: rgba(255, 107, 94, .28); }
.alerta.atencao { --tom: #d98e3f; }
.alerta-topo { display: flex; gap: 6px 10px; align-items: center; flex-wrap: wrap; }
.alerta-selo { display: inline-flex; align-items: center; gap: 4px; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--tom); }
.alerta-selo .mud-icon-root { font-size: 1rem; }
.alerta.critico .alerta-selo .mud-icon-root { animation: pulso 2s ease-out infinite; border-radius: 50%; }
@keyframes pulso { 0% { box-shadow: 0 0 0 0 rgba(255, 107, 94, .55); } 70%, 100% { box-shadow: 0 0 0 8px transparent; } }
.alerta-origem { display: inline-flex; align-items: center; gap: 6px; font-size: .74rem; color: var(--tinta-2); min-width: 0; }
.alerta-origem::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--origem, var(--tinta-3)); flex: none; }
.alerta-texto { margin-top: 6px; font-size: .92rem; line-height: 1.45; color: var(--tinta); overflow-wrap: anywhere; }
.alerta .lux-link { margin-top: 8px; }
.lux-ok { display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 14px; color: var(--tinta-2); background: rgba(63, 209, 107, .06); border: 1px solid rgba(63, 209, 107, .2); }
.lux-ok-icone { width: 28px; height: 28px; flex: none; display: grid; place-items: center; border-radius: 50%; color: var(--bom); border: 1px solid rgba(63, 209, 107, .45); box-shadow: 0 0 12px rgba(63, 209, 107, .25); }
.lux-mais { margin: 12px auto 0; display: flex; align-items: center; gap: 4px; border: 0; background: none; color: var(--link); font: 600 .84rem Manrope, sans-serif; cursor: pointer; }
.lux-mais:hover { color: #fff; }
.lux-falhas { margin-bottom: 18px; }

/* ---------- Empresa e unidades ---------- */
.empresa-h2 { min-width: 0; }
.empresa-h2 > span:last-child { min-width: 0; }
.lux-unidades { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); align-content: start; }
@media (min-width: 640px) { .lux-unidades { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.un { display: flex; flex-direction: column; gap: 12px; color: inherit; text-decoration: none; transition: transform .15s, border-color .15s; }
.un:hover { transform: translateY(-2px); border-color: var(--borda-forte); }
.un-topo { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.un-nome { flex: 1; min-width: 0; font-weight: 600; font-size: .95rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.un-seta { color: var(--tinta-3); }
.un-motivo { font-size: .8rem; color: var(--tinta-3); }
.un-numeros { display: grid; gap: 10px 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.un-numero { display: flex; flex-direction: column; min-width: 0; }
.un-numero small { font-size: .7rem; color: var(--tinta-3); line-height: 1.25; }
.un-numero b { font-size: 1.15rem; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.un-numero span { font-size: .68rem; color: var(--tinta-3); }

/* Carregando */
.lux-carregando { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.lux-esqueleto { height: 120px; border-radius: 14px; background: linear-gradient(90deg, #1e150f, #30221a, #1e150f); background-size: 200% 100%; animation: lux-brilho 1.4s infinite; }
@keyframes lux-brilho { to { background-position: -200% 0; } }
.lux-rodape { text-align: center; color: var(--tinta-3); font-size: .75rem; margin-top: 10px; }

/* ==========================================================================
   Gráficos (Componentes/Graficos)
   ========================================================================== */
.gl-vazio { display: flex; align-items: center; justify-content: center; min-height: 80px; height: 100%; color: var(--tinta-3); font-size: .85rem; text-align: center; }

/* Linha */
.gl { display: grid; grid-template-columns: 52px minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) 22px auto; position: relative; }
.gl > .gl-vazio { grid-column: 1 / -1; grid-row: 1 / -1; }
.gl-eixo-y { position: relative; grid-row: 1; }
.gl-eixo-y span, .cn-eixo-y span { position: absolute; right: 8px; transform: translateY(50%); font-size: .68rem; color: var(--tinta-3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.gl-area { position: relative; grid-row: 1; grid-column: 2; }
.gl-grade { position: absolute; left: 0; right: 0; height: 1px; background: var(--grade); }
.gl-grade.zero { background: rgba(222, 188, 150, .28); }
.gl-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.gl-linha { filter: drop-shadow(0 0 6px var(--gl-brilho, rgba(201, 143, 86, .8))); }
.gl-alvos { position: absolute; inset: 0; display: flex; }
.gl-alvos > div { flex: 1; cursor: crosshair; }
.gl-cruz { position: absolute; top: 0; bottom: 0; width: 1px; background: rgba(236, 201, 160, .5); pointer-events: none; }
.gl-ponto { position: absolute; width: 10px; height: 10px; margin: 0 0 -5px -5px; border-radius: 50%; border: 2px solid var(--cartao); pointer-events: none; box-shadow: 0 0 10px var(--gl-brilho, rgba(201, 143, 86, .9)); }
.gl-ponto-final { animation: respira 2.4s ease-in-out infinite; }
@keyframes respira { 50% { box-shadow: 0 0 2px var(--gl-brilho), 0 0 0 6px transparent; } }
.gl-ponto-ant { background: #927f6c; box-shadow: none; }
.gl-dica, .cn-dica {
    position: absolute; top: 4px; z-index: 3; pointer-events: none; min-width: 150px; max-width: 260px;
    background: rgba(19, 13, 9, .95); border: 1px solid var(--borda-forte); border-radius: 10px; padding: 8px 10px; font-size: .76rem; line-height: 1.5;
    color: var(--tinta-2); box-shadow: 0 8px 24px rgba(0, 0, 0, .5);
}
.gl-dica b, .cn-dica b { color: var(--tinta); }
.gl-detalhe { color: var(--tinta-3); font-size: .7rem; margin-top: 2px; }
.gl-marca, .gr-marca { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: middle; flex: none; }
.gl-marca-ant { background: repeating-linear-gradient(90deg, #927f6c 0 4px, transparent 4px 6px); height: 3px; border-radius: 0; }
.cn-marca-ant { background: rgba(146, 127, 108, .45); border: 1px solid rgba(146, 127, 108, .8); }
.gl-eixo-x { position: relative; grid-row: 2; grid-column: 2; }
.gl-eixo-x span { position: absolute; top: 6px; transform: translateX(-50%); font-size: .68rem; color: var(--tinta-3); white-space: nowrap; }
.gl-eixo-x span:first-child { transform: none; }
.gl-eixo-x span:last-child:not(:first-child) { transform: translateX(-100%); }
@media (max-width: 599px) { .gl-eixo-x .gl-x-alt { display: none; } }
.gl-legenda { grid-row: 3; grid-column: 2; display: flex; flex-wrap: wrap; gap: 6px 14px; justify-content: flex-end; font-size: .72rem; color: var(--tinta-2); padding-top: 6px; }
.cn .gl-legenda { padding-top: 8px; }

/* Rosca */
.gr { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); align-items: center; }
@media (min-width: 600px) and (max-width: 959px) { .gr { grid-template-columns: 200px minmax(0, 1fr); } }
.gr-rosca { position: relative; width: min(210px, 70%); margin: 0 auto; }
.gr-rosca svg { width: 100%; display: block; filter: drop-shadow(0 0 10px rgba(201, 143, 86, .18)); }
.gr-fatia { transition: stroke-width .15s, opacity .15s; cursor: pointer; }
.gr-centro { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; pointer-events: none; padding: 0 22%; }
.gr-centro small { font-size: .7rem; color: var(--tinta-3); line-height: 1.2; }
.gr-centro b { font-size: 1.1rem; line-height: 1.25; }
.gr-legenda { display: grid; gap: 2px; }
.gr-item { display: flex; align-items: center; gap: 4px; padding: 6px 8px; border-radius: 8px; font-size: .82rem; cursor: default; }
.gr-item.ativo, .gr-item:hover { background: rgba(201, 143, 86, .12); }
.gr-nome { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.gr-nome small, .gr-valor small { display: block; color: var(--tinta-3); font-size: .7rem; }
.gr-valor { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Barras */
.bl { display: grid; gap: 12px; }
.bl-linha { display: block; color: inherit; text-decoration: none; border-radius: 8px; }
.bl-link:hover .bl-nome { color: #fff; }
.bl-link:hover .bl-barra { filter: brightness(1.2); }
.bl-topo { display: flex; justify-content: space-between; gap: 8px; font-size: .84rem; margin-bottom: 5px; }
.bl-nome { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--tinta); }
.bl-valor { font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.bl-valor.negativo { color: var(--ruim); }
.bl-trilho { height: 8px; border-radius: 4px; background: rgba(255, 255, 255, .06); overflow: hidden; }
.bl-barra { height: 100%; border-radius: 4px; transition: width .6s ease; box-shadow: 0 0 12px var(--bl-brilho, rgba(201, 143, 86, .35)); }
.bl-detalhe { font-size: .7rem; color: var(--tinta-3); margin-top: 4px; }

/* Colunas */
.cn { display: flex; flex-direction: column; }
.cn > .gl-vazio { flex: 1; }
.cn-corpo { flex: 1; display: grid; grid-template-columns: 52px minmax(0, 1fr); min-height: 0; }
.cn-eixo-y { position: relative; }
.cn-barras { position: relative; display: flex; gap: 3px; }
.cn-col { flex: 1; position: relative; cursor: pointer; min-width: 0; }
.cn-barra { position: absolute; left: 0; right: 0; border-radius: 4px 4px 0 0; transition: height .6s ease, bottom .6s ease, filter .15s; opacity: .92; }
.cn-barra.estreita { left: 18%; right: 18%; }
.cn-barra.negativa { border-radius: 0 0 4px 4px; }
.cn-anterior { background: rgba(146, 127, 108, .22); border: 1px solid rgba(146, 127, 108, .45); border-bottom: 0; opacity: 1; }
.cn-col.ativo .cn-barra:not(.cn-anterior), .cn-col:hover .cn-barra:not(.cn-anterior) { opacity: 1; filter: brightness(1.25) drop-shadow(0 0 6px var(--cn-brilho)); }
.cn-dica { top: 0; left: 50%; transform: translateX(-50%); white-space: nowrap; }
.cn-dica.esq { left: 0; transform: none; }
.cn-dica.dir { left: auto; right: 0; transform: none; }
.cn-rotulos { display: flex; gap: 3px; margin: 6px 0 0 52px; }
.cn-rotulos span { flex: 1; text-align: center; font-size: .64rem; color: var(--tinta-3); white-space: nowrap; min-width: 0; overflow: visible; }

/* ==========================================================================
   Telas de sempre (login, personalizar, cadastros) no mesmo tema
   ========================================================================== */
.painel-topo { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.sobretitulo { color: var(--ouro); font-size: .72rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.texto-apoio { color: var(--tinta-2); font-size: .92rem; max-width: 640px; margin: 0 0 20px; line-height: 1.55; }
.cartao { padding: 18px; }
.cartao.vazio { color: var(--tinta-2); }

.botao-discreto, .botao-principal { font: inherit; cursor: pointer; border-radius: 999px; transition: all .15s; }
.botao-discreto {
    display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; font-size: .84rem; font-weight: 500;
    color: var(--tinta); text-decoration: none; border: 1px solid var(--borda-forte); background: rgba(36, 25, 17, .8); white-space: nowrap;
}
.botao-discreto:hover { border-color: var(--ouro); color: #fff; }
.botao-principal {
    border: 0; padding: 10px 26px; font-weight: 700; font-size: .9rem; letter-spacing: .03em; color: #fff;
    background: linear-gradient(135deg, #dfb07e, #a87442 50%, #6e4528); box-shadow: 0 0 22px rgba(201, 143, 86, .4);
}
.botao-principal:hover:not(:disabled) { filter: brightness(1.1); box-shadow: 0 0 28px rgba(201, 143, 86, .6); }
.botao-principal:disabled { opacity: .4; cursor: default; box-shadow: none; }
.botao-principal.largo { width: 100%; padding: 13px; }

/* Personalizar */
.empresa-sub { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; font-size: .7rem; color: var(--tinta-3); letter-spacing: .12em; text-transform: uppercase; margin-top: 3px; }
.empresa-icone.pequeno { width: 34px; height: 34px; color: var(--ouro); background: rgba(201, 143, 86, .14); }
.grade-preferencias { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); align-items: start; }
.preferencia-topo { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.preferencia-nome { font-weight: 600; }
.preferencia-unidade { display: flex; align-items: center; gap: 12px; padding: 11px 4px; border-top: 1px solid var(--borda); cursor: pointer; }
.preferencia-unidade input { position: absolute; opacity: 0; pointer-events: none; }
.preferencia-unidade .caixa { flex: none; width: 20px; height: 20px; border-radius: 6px; border: 1.5px solid var(--borda-forte); display: grid; place-items: center; transition: background .15s, border-color .15s; }
.preferencia-unidade input:checked + .caixa { background: var(--ouro); border-color: var(--ouro); box-shadow: 0 0 12px rgba(201, 143, 86, .5); }
.preferencia-unidade input:checked + .caixa::after { content: "✓"; color: #fff; font-size: .8rem; font-weight: 800; }
.preferencia-unidade input:focus-visible + .caixa { outline: 2px solid var(--ouro-claro); outline-offset: 2px; }
.preferencia-unidade.desligada { cursor: default; opacity: .55; }
.preferencia-texto { display: flex; flex-direction: column; font-size: .92rem; }
.preferencia-texto small { color: var(--tinta-3); font-size: .74rem; }
.barra-salvar { display: flex; justify-content: flex-end; gap: 10px; margin-top: 22px; position: sticky; bottom: 0; padding: 12px 0 calc(12px + env(safe-area-inset-bottom)); background: linear-gradient(transparent, var(--fundo) 40%); }

/* Login */
.tela-login {
    min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 16px;
    background: radial-gradient(700px 420px at 50% 0%, rgba(201, 143, 86, .22), transparent 70%);
}
.login-cartao { width: 100%; max-width: 390px; padding: 36px 30px; box-shadow: 0 30px 80px rgba(0, 0, 0, .55), 0 0 60px rgba(201, 143, 86, .12); }

/* Cadastros (MudBlazor) */
.cartao-topo { display: flex; align-items: center; gap: 10px; padding: 14px 16px; color: inherit; text-decoration: none; }
.cartao-topo:hover .cartao-nome { color: #fff; }
.cartao-nome { font-weight: 600; font-size: 1.05rem; line-height: 1.2; }
.cartao-sistema { font-size: .78rem; color: var(--tinta-3); }
.mud-paper { border: 1px solid var(--borda); }
.mud-appbar.mud-paper, .mud-drawer.mud-paper, .mud-snackbar.mud-paper { border: 0; }
.mud-table.mud-paper { background: linear-gradient(180deg, var(--cartao-2), var(--cartao)); }
.num { text-align: right !important; white-space: nowrap; font-variant-numeric: tabular-nums; }
.mud-table-row.linha-clicavel { cursor: pointer; }
.bolinha { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; vertical-align: middle; }

#blazor-error-ui {
    background: #3a1e24; color: var(--tinta); bottom: 0; box-shadow: 0 -1px 2px rgba(0, 0, 0, .2); box-sizing: border-box;
    display: none; left: 0; padding: .6rem 1.25rem .7rem 1.25rem; position: fixed; width: 100%; z-index: 2000;
}
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: .75rem; top: .5rem; }

.loading-progress { position: absolute; display: block; width: 8rem; height: 8rem; inset: 20vh 0 auto 0; margin: 0 auto; }
.loading-progress circle { fill: none; stroke: #281c13; stroke-width: .6rem; transform-origin: 50% 50%; transform: rotate(-90deg); }
.loading-progress circle:last-child {
    stroke: #c98f56; filter: drop-shadow(0 0 6px rgba(201, 143, 86, .8));
    stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * .8), 500%; transition: stroke-dasharray .05s ease-in-out;
}
.loading-progress-text { position: absolute; text-align: center; font-weight: 600; color: #cbb9a3; font-family: Manrope, system-ui, sans-serif; inset: calc(20vh + 3.25rem) 0 auto .2rem; }
.loading-progress-text:after { content: var(--blazor-load-percentage-text, "Carregando"); }

/* ---------- Celular ---------- */
@media (max-width: 599px) {
    .lux-topo { align-items: flex-start; }
    .lux-voltar { margin-top: 16px; }
    .lux-secao { margin-bottom: 28px; }
    .lux-cartao, .cartao { padding: 14px; }
    .lux-secao h2 { font-size: 1.12rem; }
    .lux-kpis, .lux-numeros { gap: 10px; }
    .ic { padding: 10px 11px 14px; }
    .ic-titulo { font-size: .72rem; }
    .gl, .cn-corpo { grid-template-columns: 44px minmax(0, 1fr); }
    .cn-rotulos { margin-left: 44px; }
    .gl-eixo-y span, .cn-eixo-y span { right: 6px; font-size: .62rem; }
    .md-texto b { font-size: 2.4rem; }
}

@media (prefers-reduced-motion: reduce) {
    .alerta.critico .alerta-selo .mud-icon-root, .girando, .gl-ponto-final, .lux-esqueleto { animation: none; }
    .ec, .ic, .un, .mm { transition: none; }
}

/* ==========================================================================
   Juá: marca, selo do grupo e as telas da gestão
   ========================================================================== */
:root { --ouro-2: #ecc9a0; --ouro-3: #9c6638; --creme: #f3e7d6; --serifa: "Fraunces", Georgia, serif; --grade: rgba(222, 188, 150, .045); }
body {
    background:
        radial-gradient(1100px 520px at 8% -12%, rgba(201, 143, 86, .16), transparent 60%),
        radial-gradient(900px 520px at 105% 0%, rgba(207, 90, 116, .10), transparent 60%),
        linear-gradient(var(--grade) 1px, transparent 1px) 0 0 / 44px 44px,
        linear-gradient(90deg, var(--grade) 1px, transparent 1px) 0 0 / 44px 44px,
        var(--fundo) !important;
    background-attachment: fixed !important;
}
.marca-nome, .marca.grande .marca-nome {
    font: 600 italic 1.45rem/1 var(--serifa); letter-spacing: -.01em; text-transform: none;
    background: linear-gradient(115deg, #f8ead8, var(--ouro-2) 35%, var(--ouro) 65%, #7f5230); -webkit-background-clip: text; background-clip: text; color: transparent;
    filter: drop-shadow(0 0 12px rgba(201, 143, 86, .35));
}
.marca.grande .marca-nome { font-size: 3rem; }
.marca-grupo { letter-spacing: .38em; margin-top: 2px; }
.marca.grande { align-items: center; text-align: center; margin-bottom: 10px; }
.lux-topo h1, .painel-titulo {
    font-family: var(--serifa); font-style: italic; font-weight: 600; letter-spacing: -.02em;
    background: linear-gradient(100deg, #fff6e2, var(--ouro-2) 45%, var(--ouro) 80%); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.lux-secao h2 { font-family: var(--serifa); font-style: italic; font-weight: 600; font-size: 1.45rem; letter-spacing: -.01em; }
.lux-secao h2 small { font-style: normal; }
.botao-principal, .lux-chip.ativo { color: #1c120a !important; }
.botao-principal { background: linear-gradient(135deg, #efcfa8, var(--ouro) 50%, #8c5c32); }
.menu-lateral .mud-nav-link.active { color: #1c120a !important; background: linear-gradient(135deg, #dfb07e, #a87442) !important; }
.menu-lateral .mud-nav-link.active .mud-nav-link-icon { color: #1c120a !important; }
.jua-progresso::after { content: var(--blazor-load-percentage-text, "Abrindo a gestão…"); }

/* Selo discreto do Grupo Sintesys */
.menu-coluna { display: flex; flex-direction: column; min-height: 100%; }
.menu-selo { margin: auto 16px 18px; padding-top: 14px; border-top: 1px solid var(--borda); display: flex; align-items: center; gap: 8px; text-decoration: none;
    color: var(--tinta-3); font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; opacity: .6; transition: opacity .2s; }
.menu-selo:hover { opacity: 1; }
.menu-selo img { height: 20px; width: auto; }
.login-selo { margin: 26px 0 0; justify-content: center; border-top: 0; }

/* Login */
.tela-login { background: radial-gradient(700px 420px at 50% 0%, rgba(201, 143, 86, .20), transparent 70%); }
.login-cartao .texto-apoio { text-align: center; }

/* Painel: abertura */
.jua-hero { position: relative; overflow: hidden; padding: 20px 20px 14px; border-radius: 22px; border: 1px solid var(--borda); margin-bottom: 14px;
    background: radial-gradient(600px 260px at 0% 0%, rgba(201, 143, 86, .20), transparent 70%), radial-gradient(500px 260px at 100% 100%, rgba(207, 90, 116, .10), transparent 70%), linear-gradient(180deg, var(--cartao-2), var(--cartao));
    box-shadow: 0 20px 60px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .05); }
.jua-hero::before { content: ""; position: absolute; inset: 0 15% auto; height: 1px; background: linear-gradient(90deg, transparent, var(--ouro-2), transparent); }
.jua-hero-topo { display: flex; flex-wrap: wrap; gap: 10px 24px; align-items: flex-end; justify-content: space-between; margin-bottom: 10px; }
.jua-hero-valor small { display: block; font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; color: var(--tinta-3); font-weight: 700; }
.jua-hero-valor b { display: block; font: 800 clamp(2.2rem, 6vw, 3.6rem)/1.05 Manrope, sans-serif; letter-spacing: -.03em; font-variant-numeric: tabular-nums;
    background: linear-gradient(180deg, #fff, var(--ouro-2)); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 22px rgba(201, 143, 86, .35)); }
.jua-hero-valor .ic-delta { display: inline-block; margin-top: 6px; }
.jua-hero-lado { display: flex; flex-wrap: wrap; gap: 10px 26px; }
.jua-hero-lado div { display: flex; flex-direction: column; }
.jua-hero-lado small { font-size: .7rem; color: var(--tinta-3); }
.jua-hero-lado b { font-size: 1.05rem; font-variant-numeric: tabular-nums; }

/* Mapa de calor das horas */
.horas { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 4px; }
@media (min-width: 700px) { .horas { grid-template-columns: repeat(24, minmax(0, 1fr)); } }
.hora { aspect-ratio: 1 / 1.25; border-radius: 6px; position: relative; background: rgba(255, 255, 255, .04); display: grid; place-items: end center; padding-bottom: 3px;
    font-size: .58rem; color: var(--tinta-3); font-variant-numeric: tabular-nums; cursor: default; transition: transform .15s; }
.hora:hover { transform: translateY(-2px); }
.hora i { position: absolute; inset: 0; border-radius: inherit; background: var(--ruim); opacity: var(--h, 0); box-shadow: 0 0 calc(var(--h, 0) * 16px) rgba(255, 122, 110, .6); }
.hora span { position: relative; }
.hora.forte span { color: #fff; font-weight: 700; }

/* Avisos numéricos */
.avisos-grade { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.aviso-num { padding: 14px 16px; border-radius: 16px; border: 1px solid var(--borda); background: linear-gradient(180deg, var(--cartao-2), var(--cartao)); text-decoration: none; color: inherit; display: block; }
.aviso-num b { display: block; font: 800 2rem/1.1 Manrope, sans-serif; font-variant-numeric: tabular-nums; }
.aviso-num span { font-size: .8rem; color: var(--tinta-2); }
.aviso-num small { display: block; margin-top: 4px; font-size: .72rem; color: var(--tinta-3); }
.aviso-num.atencao { border-color: rgba(217, 142, 63, .35); } .aviso-num.atencao b { color: var(--atencao); }
.aviso-num.critico { border-color: rgba(255, 122, 110, .4); } .aviso-num.critico b { color: var(--ruim); }
.aviso-num.ok b { color: var(--bom); }
.nota-fonte { margin-top: 26px; text-align: center; color: var(--tinta-3); font-size: .74rem; }

/* Cardápio e pizzas na gestão */
.filtros { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 14px; }
.busca-lux { flex: 1 1 240px; display: flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; border: 1px solid var(--borda); background: rgba(36, 25, 17, .8); }
.busca-lux input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; color: var(--tinta); font: 500 .9rem Manrope, sans-serif; }
.busca-lux .mud-icon-root { color: var(--tinta-3); font-size: 1.1rem; }
.select-lux { padding: 9px 14px; border-radius: 999px; border: 1px solid var(--borda); background: #281c13; color: var(--tinta); font: 500 .85rem Manrope, sans-serif; }
.produtos-grade { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); }
.pc { position: relative; display: flex; flex-direction: column; overflow: hidden; border-radius: 18px; border: 1px solid var(--borda);
    background: linear-gradient(180deg, var(--cartao-2), var(--cartao)); transition: transform .2s, border-color .2s, box-shadow .2s; }
.pc:hover { transform: translateY(-3px); border-color: var(--borda-forte); box-shadow: 0 18px 40px rgba(0, 0, 0, .45), 0 0 24px rgba(201, 143, 86, .12); }
.pc-foto { position: relative; aspect-ratio: 16 / 10; background: radial-gradient(circle at 30% 20%, #30221a, #160f0a); overflow: hidden; }
.pc-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.pc:hover .pc-foto img { transform: scale(1.06); }
.pc-foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, rgba(19, 13, 9, .85)); pointer-events: none; }
.pc-sem-foto { position: absolute; inset: 0; display: grid; place-items: center; font: 600 italic 2.6rem/1 var(--serifa); color: rgba(201, 143, 86, .35); }
.pc-selos { position: absolute; top: 10px; left: 10px; right: 10px; z-index: 1; display: flex; flex-wrap: wrap; gap: 6px; }
.pc-preco { position: absolute; right: 12px; bottom: 10px; z-index: 1; font: 800 1.15rem Manrope, sans-serif; color: #fff; text-shadow: 0 2px 10px rgba(0, 0, 0, .8); font-variant-numeric: tabular-nums; }
.pc-corpo { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.pc-nome { font-weight: 700; font-size: .95rem; line-height: 1.25; }
.pc-nome small { display: block; font-weight: 600; font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-3); margin-top: 3px; }
.pc-linhas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 12px; font-size: .74rem; color: var(--tinta-3); }
.pc-linhas b { display: block; color: var(--tinta); font-size: .92rem; font-variant-numeric: tabular-nums; }
.margem { margin-top: auto; }
.margem-topo { display: flex; justify-content: space-between; font-size: .74rem; color: var(--tinta-3); margin-bottom: 5px; }
.margem-topo b { font-variant-numeric: tabular-nums; }
.margem-trilho { height: 7px; border-radius: 4px; background: rgba(255, 255, 255, .06); overflow: hidden; }
.margem-barra { height: 100%; border-radius: 4px; transition: width .6s; }
.selo-mini { padding: 3px 8px; border-radius: 999px; font-size: .62rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.selo-mini.ouro { background: rgba(201, 143, 86, .92); color: #1c120a; }
.selo-mini.escuro { background: rgba(19, 13, 9, .72); color: var(--tinta-2); border: 1px solid var(--borda); }
.selo-mini.ruim { background: rgba(214, 69, 69, .88); color: #fff; }
.selo-mini.bom { background: rgba(47, 179, 107, .88); color: #fff; }

/* Pizzas */
.pz-disco { position: absolute; inset: 0; display: grid; place-items: center; }
.pz-disco span { width: 54%; aspect-ratio: 1; border-radius: 50%; box-shadow: 0 0 0 7px #ad7746, 0 0 0 9px #704828, 0 18px 40px rgba(0, 0, 0, .6); }
.tamanhos { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.tamanho { padding: 16px; border-radius: 18px; border: 1px solid var(--borda); background: linear-gradient(180deg, var(--cartao-2), var(--cartao)); position: relative; }
.tamanho.inativo { opacity: .7; border-style: dashed; }
.tamanho h3 { margin: 0 0 4px; font: 600 italic 1.5rem var(--serifa); color: var(--ouro-2); }
.tamanho ul { margin: 8px 0 0; padding: 0; list-style: none; display: grid; gap: 4px; font-size: .82rem; color: var(--tinta-2); }
.tamanho .selo-mini { position: absolute; top: 14px; right: 14px; }
.dispersao { position: relative; height: 320px; margin: 8px 8px 30px 44px; border-left: 1px solid var(--borda-forte); border-bottom: 1px solid var(--borda-forte); }
.dispersao-quad { position: absolute; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-3); padding: 6px 8px; }
.dispersao-meio-x { position: absolute; top: 0; bottom: 0; border-left: 1px dashed rgba(222, 184, 140, .2); }
.dispersao-meio-y { position: absolute; left: 0; right: 0; border-top: 1px dashed rgba(222, 184, 140, .2); }
.ponto-pz { position: absolute; width: 14px; height: 14px; margin: 0 0 -7px -7px; border-radius: 50%; border: 2px solid var(--cartao); cursor: pointer; transition: transform .15s; }
.ponto-pz:hover, .ponto-pz.ativo { transform: scale(1.6); z-index: 2; }
.ponto-dica { position: absolute; z-index: 3; transform: translate(-50%, calc(100% + 12px)); white-space: nowrap; pointer-events: none;
    background: rgba(19, 13, 9, .95); border: 1px solid var(--borda-forte); border-radius: 10px; padding: 7px 10px; font-size: .75rem; color: var(--tinta-2); line-height: 1.5; }
.ponto-dica b { color: var(--tinta); }
.eixo-rot { position: absolute; font-size: .64rem; color: var(--tinta-3); white-space: nowrap; }
.legenda-grupos { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: .76rem; color: var(--tinta-2); }
.legenda-grupos span { display: inline-flex; align-items: center; gap: 6px; }
.legenda-grupos i { width: 10px; height: 10px; border-radius: 50%; }
.massa { display: grid; gap: 6px 18px; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); font-size: .84rem; color: var(--tinta-2); }
.massa b { color: var(--tinta); font-variant-numeric: tabular-nums; }
.fid-linhas { display: grid; gap: 2px; margin-top: 12px; }
.fid-linhas div { display: flex; justify-content: space-between; gap: 12px; padding: 7px 4px; border-top: 1px solid var(--borda); font-size: .84rem; color: var(--tinta-2); }
.fid-linhas b { color: var(--tinta); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Pedidos online (quadro do caixa) */
.kanban { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 900px) { .kanban { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1400px) { .kanban { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.kb-coluna { display: grid; gap: 10px; padding: 12px; border-radius: 18px; border: 1px solid var(--borda); background: rgba(36, 25, 17, .45); }
.kb-topo { display: flex; align-items: center; justify-content: space-between; font-weight: 700; font-size: .9rem; padding: 2px 4px 4px; }
.kb-topo span::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--kb-cor); box-shadow: 0 0 10px var(--kb-cor); margin-right: 8px; vertical-align: middle; }
.kb-topo b { font-variant-numeric: tabular-nums; padding: 2px 9px; border-radius: 999px; background: rgba(255, 255, 255, .06); }
.kb-vazio { color: var(--tinta-3); font-size: .82rem; text-align: center; padding: 18px 0; }
.pd { position: relative; display: grid; gap: 8px; padding: 14px; border-radius: 16px; border: 1px solid var(--borda); background: linear-gradient(180deg, var(--cartao-2), var(--cartao)); }
.pd.novo { border-color: rgba(224, 123, 57, .6); box-shadow: 0 0 0 1px rgba(224, 123, 57, .25), 0 0 26px rgba(224, 123, 57, .22); animation: pd-chega 2.2s ease-in-out infinite; }
@keyframes pd-chega { 50% { box-shadow: 0 0 0 1px rgba(224, 123, 57, .45), 0 0 34px rgba(224, 123, 57, .38); } }
.pd.encerrado { opacity: .62; }
.pd-topo { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pd-num { font: 800 1.25rem Manrope, sans-serif; color: var(--ouro-2); }
.pd-modo { font-size: .66rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 3px 8px; border-radius: 999px; background: rgba(63, 167, 181, .18); color: #7fd3de; }
.pd-modo.entrega { background: rgba(224, 123, 57, .18); color: #f0a26e; }
.pd-hora { margin-left: auto; font-size: .74rem; color: var(--tinta-3); }
.pd-cliente { font-size: .9rem; } .pd-cliente a { color: var(--link); text-decoration: none; margin-left: 6px; font-size: .82rem; }
.pd-end { display: flex; gap: 4px; align-items: flex-start; font-size: .82rem; color: var(--tinta-2); }
.pd-end .mud-icon-root { color: var(--ouro); margin-top: 1px; }
.pd-itens { list-style: none; margin: 0; padding: 8px 0; display: grid; gap: 6px; border-block: 1px dashed var(--borda); }
.pd-itens li { display: grid; grid-template-columns: auto 1fr auto; gap: 8px; font-size: .86rem; }
.pd-itens small { display: block; color: var(--tinta-3); font-size: .74rem; }
.pd-itens small.obs { color: var(--atencao); }
.pd-itens em { font-style: normal; color: var(--tinta-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pd-obs { font-size: .8rem; color: var(--atencao); }
.pd-total { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; font-size: .82rem; color: var(--tinta-2); }
.pd-total b { font-size: 1.05rem; color: var(--tinta); font-variant-numeric: tabular-nums; }
.pd-form { display: grid; gap: 10px; margin-top: 4px; }
.pd-campos { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 8px; }
.pd-campos label { display: grid; gap: 4px; font-size: .7rem; color: var(--tinta-3); text-transform: uppercase; letter-spacing: .08em; }
.pd-input { width: 100%; padding: 9px 12px; border-radius: 10px; border: 1px solid var(--borda-forte); background: #160f0a; color: var(--tinta); font: 600 .9rem Manrope, sans-serif; outline: 0; }
.pd-input:focus { border-color: var(--ouro); box-shadow: 0 0 0 3px rgba(201, 143, 86, .18); }
.pd-botoes { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.pd-botoes .botao-principal { padding: 9px 18px; }
.pd-perigo { border: 0; border-radius: 999px; padding: 9px 18px; font: 700 .85rem Manrope, sans-serif; color: #fff; background: linear-gradient(135deg, #e2685c, #a83a30); cursor: pointer; }
.pd-perigo:disabled { opacity: .45; cursor: default; }
.pd-link { font-size: .72rem; color: var(--tinta-3); text-decoration: none; justify-self: start; }
.pd-link:hover { color: var(--ouro-2); }

/* ---------- Logo do Juá (desenho da marca, tons de madeira) ---------- */
img.marca-logo, .marca.grande img.marca-logo { display: block; height: 30px; width: auto; background: none; filter: drop-shadow(0 0 12px rgba(201, 143, 86, .3)); }
.marca.grande img.marca-logo { height: 86px; margin: 0 auto 6px; }
.marca:has(img.marca-logo) { flex-direction: row; align-items: center; gap: 10px; }
.marca.grande:has(img.marca-logo) { flex-direction: column; gap: 0; }

/* ---------- Salão (mapa, conta) e caixa ---------- */
.sl-abrir { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 22px; padding: 14px 16px; }
.sl-numero { width: 86px; text-align: center; font-size: 1.05rem; font-weight: 700; }
.sl-valor { width: 120px; text-align: right; font-variant-numeric: tabular-nums; }
.sl-linha { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 8px; }
.sl-selo { display: inline-block; font-size: .64rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 3px 8px; border-radius: 999px;
    background: linear-gradient(135deg, #ec9a62, #a8692e); color: #fff; animation: sl-pisca 1.6s ease-in-out infinite; }
@keyframes sl-pisca { 50% { box-shadow: 0 0 16px rgba(236, 154, 98, .7); } }
.sl-abertas { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
.sl-conta { display: block; text-decoration: none; color: var(--tinta); padding: 14px 16px; border-radius: 16px; border: 1px solid var(--borda);
    background: linear-gradient(160deg, rgba(201, 143, 86, .16), rgba(201, 143, 86, .03)); transition: transform .15s, border-color .15s, box-shadow .2s; }
.sl-conta:hover { transform: translateY(-2px); border-color: var(--ouro); box-shadow: 0 14px 30px -18px rgba(201, 143, 86, .6); }
.sl-conta.pedida { border-color: #ec9a62; box-shadow: 0 0 0 1px rgba(236, 154, 98, .4); }
.sl-conta.balcao, .sl-conta.lets { background: linear-gradient(160deg, rgba(95, 191, 138, .12), rgba(95, 191, 138, .02)); }
.sl-conta-topo { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.sl-conta-topo b { font-family: var(--serifa); font-style: italic; font-size: 1.15rem; }
.sl-conta-valor { font-size: 1.45rem; font-weight: 800; margin: 6px 0 4px; color: var(--ouro-2); font-variant-numeric: tabular-nums; }
.sl-conta-info { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: .74rem; color: var(--tinta-3); }
.sl-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); gap: 8px; }
.sl-mesa { aspect-ratio: 1; border-radius: 14px; border: 1px solid var(--borda); background: rgba(255, 255, 255, .025); color: var(--tinta-3);
    display: grid; place-content: center; gap: 2px; cursor: pointer; font: inherit; transition: all .15s; }
.sl-mesa b { font-size: 1.1rem; }
.sl-mesa small { font-size: .62rem; }
.sl-mesa:hover { border-color: var(--ouro); color: var(--tinta); }
.sl-mesa.ocupada { background: linear-gradient(150deg, #a87442, #6e4528); color: #fff; border-color: transparent; box-shadow: 0 6px 18px -8px rgba(201, 143, 86, .7); }
.sl-mesa.pedida { background: linear-gradient(150deg, #ec9a62, #a8692e); animation: sl-pisca 1.6s ease-in-out infinite; }
.sl-acao { margin-bottom: 14px; }
.sl-acao.perigo { border-color: rgba(255, 107, 94, .4); }
.sl-conta-corpo { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 16px; align-items: start; }
@media (max-width: 959px) { .sl-conta-corpo { grid-template-columns: 1fr; } }
.sl-fechar { position: sticky; top: 76px; display: grid; gap: 8px; }
.sl-lote { display: flex; justify-content: space-between; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: var(--tinta-3);
    border-bottom: 1px dashed var(--borda); padding: 12px 0 4px; }
.sl-item { display: flex; gap: 10px; align-items: flex-start; padding: 9px 0; border-bottom: 1px solid rgba(255, 255, 255, .04); }
.sl-item.cancelado { opacity: .5; }
.sl-item.cancelado .sl-item-valor { text-decoration: line-through; }
.sl-qtd { color: var(--ouro); min-width: 26px; }
.sl-item-nome { flex: 1; min-width: 0; }
.sl-item-nome small { display: block; color: var(--tinta-3); font-size: .76rem; }
.sl-item-nome small.obs { color: var(--ouro-2); font-weight: 700; }
.sl-item-nome small.cancel { color: var(--ruim); }
.sl-item-valor { font-variant-numeric: tabular-nums; white-space: nowrap; }
.sl-cancelar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 8px 0 12px; }
.sl-cancelar label { display: flex; align-items: center; gap: 6px; font-size: .78rem; color: var(--tinta-3); }
.sl-cancelar label input { width: 60px; }
.sl-total-linha { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: .9rem; }
.sl-total-linha.total { border-top: 1px solid var(--borda); padding-top: 10px; margin-top: 4px; font-size: 1.2rem; }
.sl-total-linha.total b { color: var(--ouro-2); font-size: 1.5rem; }
.sl-servico { display: flex; align-items: center; gap: 8px; font-size: .88rem; color: var(--tinta-2); cursor: pointer; }
.sl-servico b { margin-left: auto; color: var(--tinta); }
.sl-servico input { accent-color: var(--ouro); width: 16px; height: 16px; }
.sl-pagamentos { display: grid; gap: 8px; }
.sl-pg { display: flex; gap: 6px; align-items: center; }
.sl-pg-forma { min-width: 64px; font-size: .84rem; font-weight: 700; }
.sl-pg .sl-valor { width: 96px; }
.sl-pg select { flex: 1; min-width: 0; }
.sl-falta { display: flex; justify-content: space-between; font-size: .86rem; color: var(--atencao); padding: 6px 0; }
.sl-falta.ok { color: var(--bom); }
.sl-falta b { color: var(--tinta); }
.sl-botao-fechar { width: 100%; padding: 12px; font-size: 1rem; margin-top: 6px; }
.cx-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 16px; }
.cx-card { display: grid; gap: 4px; padding: 14px 16px; }
.cx-card span { font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-3); }
.cx-card b { font-size: 1.35rem; font-variant-numeric: tabular-nums; }
.cx-card small { font-size: .7rem; color: var(--tinta-3); }
.cx-card.destaque { border-color: var(--ouro); background: linear-gradient(160deg, rgba(201, 143, 86, .2), rgba(201, 143, 86, .04)); }
.cx-corpo { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; align-items: start; }
.cx-lista { max-height: 420px; overflow: auto; }
.cx-linha { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid rgba(255, 255, 255, .05);
    color: var(--tinta); text-decoration: none; font-size: .88rem; }
.cx-linha small { display: block; color: var(--tinta-3); font-size: .72rem; }
.cx-linha b { font-variant-numeric: tabular-nums; white-space: nowrap; text-align: right; }
.cx-ok { color: var(--bom); }
.cx-dif { color: var(--ruim); }
.cx-abrir { max-width: 520px; }

/* ---------- Couvert ---------- */
.sl-couvert { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-left: auto; }
.sl-couvert-selo { display: inline-flex; align-items: center; gap: 6px; font-size: .82rem; color: var(--tinta-3); padding: 6px 12px; border-radius: 999px; border: 1px dashed var(--borda); }
.sl-couvert-selo.ligado { color: var(--tinta); border: 1px solid var(--ouro); background: rgba(201, 143, 86, .14); }
.sl-couvert-pessoas { width: 52px; padding: 4px 6px; display: inline-block; margin: 0 4px; }

/* ---------- Usuários ---------- */
.us-lista { display: grid; gap: 8px; }
.us-linha { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--borda); background: rgba(255, 255, 255, .02); }
.us-linha.inativo { opacity: .55; }
.us-nome { flex: 1; min-width: 160px; }
.us-nome small { display: block; color: var(--tinta-3); font-size: .76rem; }
.us-perfil { font-size: .66rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 3px 9px; border-radius: 999px; background: rgba(201, 143, 86, .16); color: var(--ouro-2); }
.us-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; align-items: end; }
.us-form label { display: grid; gap: 4px; font-size: .74rem; color: var(--tinta-3); }

/* ---------- Produção e impressoras ---------- */
.pr-corpo { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 16px; align-items: start; }
@media (max-width: 959px) { .pr-corpo { grid-template-columns: 1fr; } }
.pr-linha { cursor: pointer; border-radius: 10px; padding: 9px 8px; }
.pr-linha.ativa, .pr-linha:hover { background: rgba(201, 143, 86, .1); }
.pr-tipo { font-size: .6rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 2px 7px; border-radius: 999px; margin-right: 6px;
    background: rgba(201, 143, 86, .18); color: var(--ouro-2); }
.pr-tipo.cancelado { background: rgba(255, 107, 94, .2); color: var(--ruim); }
.pr-tipo.teste, .pr-tipo.reimpressao { background: rgba(255, 255, 255, .08); color: var(--tinta-3); }
.pr-previa { position: sticky; top: 76px; }
.pr-papel { background: #fbf7f0; color: #111; border-radius: 6px; padding: 16px 12px 22px; font-family: "Courier New", ui-monospace, monospace; font-size: 12px;
    line-height: 1.35; box-shadow: 0 18px 40px -20px rgba(0, 0, 0, .8); max-height: 70vh; overflow: auto; word-break: break-word;
    -webkit-mask: linear-gradient(#000 calc(100% - 10px), transparent); }
.pr-papel > div { white-space: pre-wrap; }
.pr-titulo { font-size: 22px; font-weight: 800; text-align: center; }
.pr-faixa, .pr-alergia { background: #111; color: #fff; font-size: 18px; font-weight: 800; text-align: center; padding: 3px 0; margin: 4px 0; }
.pr-grande { font-size: 16px; font-weight: 800; margin-top: 4px; }
.pr-obs { background: #111; color: #fff; font-weight: 800; padding: 1px 4px; }
.pr-pequeno { font-size: 10px; }
.pr-centro { text-align: center; font-weight: 700; }
.pr-sep { border-top: 1px dashed #555; margin: 6px 0; }
.pr-bip { text-align: center; font-size: 10px; color: #777; }
.pr-setores { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.pr-setor { display: grid; gap: 8px; }
.pr-setor.inativo { opacity: .55; }
.pr-passos { margin: 6px 0 14px 18px; display: grid; gap: 6px; font-size: .88rem; color: var(--tinta-2); }
.pr-passos code, .pr-chave { font-family: ui-monospace, monospace; background: rgba(255, 255, 255, .06); border-radius: 6px; padding: 1px 6px; }
.pr-chave { display: block; padding: 10px 12px; margin-top: 10px; font-size: .95rem; color: var(--ouro-2); user-select: all; word-break: break-all; }

/* ---------- Painel: detalhe ao clicar e período livre ---------- */
.md-caixa { position: relative; }
.cn-col.clicavel, .gl-alvos > div.clicavel, .gr-item.clicavel, .gr-fatia, .hora.clicavel { cursor: pointer; }
.hora.clicavel:hover { outline: 1px solid var(--borda-forte); }
.gr-item.clicavel:hover .gr-nome { color: #fff; }
.pn-dica { display: flex; align-items: center; gap: 6px; margin: -6px 0 14px; color: var(--tinta-3); font-size: .78rem; }
.pn-dica .mud-icon-root { font-size: 1rem; }
.pn-datas { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 16px; justify-content: flex-end; }
.pn-datas label { display: flex; align-items: center; gap: 6px; color: var(--tinta-2); font-size: .82rem; }
.pn-datas input { background: var(--cartao-2); color: var(--tinta); border: 1px solid var(--borda-forte); border-radius: 10px; padding: 6px 10px; font: 600 .85rem Manrope, sans-serif; color-scheme: dark; }

.dg-fundo { position: fixed; inset: 0; z-index: 1400; background: rgba(8, 5, 3, .55); backdrop-filter: blur(3px); animation: dg-aparece .2s ease; }
.dg { position: fixed; z-index: 1401; top: 0; right: 0; bottom: 0; width: min(460px, 100vw); display: flex; flex-direction: column;
      background: linear-gradient(180deg, #241912, #1a120c); border-left: 1px solid var(--borda-forte); box-shadow: -24px 0 60px rgba(0, 0, 0, .5);
      animation: dg-entra .25s cubic-bezier(.2, .8, .2, 1); }
.dg-topo { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 18px 18px 14px; border-bottom: 1px solid var(--borda); }
.dg-topo small { display: block; color: var(--tinta-3); font-size: .74rem; letter-spacing: .02em; min-height: 1em; }
.dg-topo h3 { margin: 4px 0 0; font: italic 600 1.35rem/1.2 Fraunces, serif; color: var(--tinta); }
.dg-fechar { flex: none; border: 1px solid var(--borda); background: var(--cartao-2); color: var(--tinta-2); border-radius: 50%; width: 36px; height: 36px; display: grid; place-items: center; cursor: pointer; }
.dg-fechar:hover { color: #fff; border-color: var(--borda-forte); }
.dg-corpo { flex: 1; overflow-y: auto; padding: 16px 18px 28px; overscroll-behavior: contain; }
.dg-numeros { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 18px; }
.dg-numeros > div { background: rgba(255, 255, 255, .035); border: 1px solid var(--borda); border-radius: 12px; padding: 10px 12px; }
.dg-numeros small { display: block; color: var(--tinta-3); font-size: .72rem; }
.dg-numeros b { display: block; font: 800 1.08rem Manrope, sans-serif; color: var(--ouro-claro); margin-top: 2px; }
.dg-numeros span { display: block; color: var(--tinta-2); font-size: .72rem; margin-top: 2px; }
.dg-secao { margin-top: 16px; }
.dg-secao h4 { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; font: 700 .78rem Manrope, sans-serif; text-transform: uppercase; letter-spacing: .1em; color: var(--ouro); }
.dg-secao h4 small { background: rgba(201, 143, 86, .15); color: var(--ouro-claro); border-radius: 99px; padding: 1px 7px; font-size: .68rem; letter-spacing: 0; }
.dg-linha { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--borda); }
.dg-linha > div { min-width: 0; }
.dg-linha span { display: block; color: var(--tinta); font-size: .88rem; }
.dg-linha small { display: block; color: var(--tinta-3); font-size: .74rem; margin-top: 1px; }
.dg-linha b { flex: none; font: 700 .9rem Manrope, sans-serif; color: var(--tinta); }
.dg-vazio { color: var(--tinta-3); font-size: .82rem; padding: 6px 0; }
.dg-carregando { display: flex; gap: 6px; justify-content: center; padding: 40px 0; }
.dg-carregando span { width: 8px; height: 8px; border-radius: 50%; background: var(--ouro); animation: dg-pulsa 1s infinite ease-in-out; }
.dg-carregando span:nth-child(2) { animation-delay: .15s; }
.dg-carregando span:nth-child(3) { animation-delay: .3s; }
@keyframes dg-entra { from { transform: translateX(40px); opacity: 0; } }
@keyframes dg-aparece { from { opacity: 0; } }
@keyframes dg-pulsa { 0%, 100% { opacity: .25; transform: scale(.8); } 50% { opacity: 1; transform: scale(1); } }
@media (max-width: 599px) {
    .dg { top: auto; left: 0; width: 100%; max-height: 86vh; border-left: 0; border-top: 1px solid var(--borda-forte); border-radius: 20px 20px 0 0; animation-name: dg-sobe; }
    .dg-topo::before { content: ""; position: absolute; left: 50%; top: 7px; width: 40px; height: 4px; margin-left: -20px; border-radius: 4px; background: var(--borda-forte); }
    .dg-topo { position: relative; padding-top: 22px; }
    .pn-datas { justify-content: flex-start; }
}
@keyframes dg-sobe { from { transform: translateY(60px); opacity: 0; } }

/* ---------- Edição do cardápio, fichas e insumos ---------- */
.pc.inativo, .in-linha.inativo, .ct-linha.inativo, .cp-grupo.inativo, .cp-item.inativo { opacity: .55; }
.pc-cobre { position: absolute; inset: 0; z-index: 1; }
.pc-esgotado { position: relative; z-index: 2; margin-top: auto; border: 1px dashed var(--borda-forte); background: none; color: var(--tinta-2); border-radius: 10px; padding: 7px; font: 600 .76rem Manrope, sans-serif; cursor: pointer; }
.pc-esgotado:hover { color: #fff; border-color: var(--ouro); }
.pc-esgotado.ligado { border-style: solid; border-color: rgba(214, 69, 69, .7); color: #ffb3ab; background: rgba(214, 69, 69, .12); }
a.pc-link { color: inherit; text-decoration: none; }
.botao-discreto.ativo-ruim { border-color: rgba(214, 69, 69, .7); color: #ffb3ab; }

.ed-grade { display: grid; gap: 16px; padding-bottom: 90px; }
@media (min-width: 1100px) { .ed-grade { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: start; } }
.ed-coluna { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.ed-form { display: grid; gap: 10px 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ed-form.ed-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 700px) { .ed-form.ed-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.ed-form label, .ed-largo { display: flex; flex-direction: column; gap: 5px; color: var(--tinta-3); font-size: .74rem; font-weight: 600; }
.ed-form .ed-largo { grid-column: 1 / -1; }
.ed-form textarea { resize: vertical; font-weight: 500; line-height: 1.4; }
.ed-checks { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 12px; align-items: center; }
.ed-checks label { display: flex; align-items: center; gap: 7px; color: var(--tinta-2); font-size: .86rem; cursor: pointer; }
.ed-checks input, .ct-baixo input, .cp-acoes input { accent-color: var(--ouro); width: 16px; height: 16px; }
.ed-dias { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 12px; color: var(--tinta-3); font-size: .78rem; }
.ed-dias .lux-chip { min-width: 34px; padding: 5px 0; justify-content: center; }
.ed-margens { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px; margin-top: 14px; }
.ed-margem { background: rgba(255, 255, 255, .035); border: 1px solid var(--borda); border-radius: 12px; padding: 10px 12px; }
.ed-margem small { display: block; color: var(--tinta-3); font-size: .72rem; }
.ed-margem b { display: block; font: 800 1.3rem Manrope, sans-serif; margin: 2px 0; color: var(--ouro-claro); }
.ed-margem span { display: block; color: var(--tinta-2); font-size: .74rem; }
.ed-aviso { margin-top: 12px; padding: 9px 12px; border-radius: 10px; background: rgba(217, 142, 63, .12); border: 1px solid rgba(217, 142, 63, .4); color: #f0c48f; font-size: .8rem; }
.ed-foto { border-radius: 14px; overflow: hidden; aspect-ratio: 16 / 10; background: radial-gradient(circle at 30% 20%, #30221a, #160f0a); border: 1px solid var(--borda); }
.ed-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ed-sem-foto { height: 100%; display: grid; place-content: center; justify-items: center; gap: 6px; color: var(--tinta-3); font-size: .85rem; }
.ed-arquivo { position: relative; display: inline-flex; align-items: center; gap: 6px; }
.ed-arquivo input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.ed-grupo { display: flex; align-items: center; gap: 6px; padding: 8px 0; border-bottom: 1px solid var(--borda); }
.ed-grupo > div { flex: 1; min-width: 0; }
.ed-grupo span { display: block; color: var(--tinta); font-size: .88rem; }
.ed-grupo small { color: var(--tinta-3); font-size: .74rem; }
a.ed-uso { text-decoration: none; color: inherit; }
a.ed-uso:hover span { color: #fff; }
.ed-barra { position: fixed; z-index: 1200; left: 50%; bottom: 16px; transform: translate(-50%, 140%); display: flex; align-items: center; gap: 10px;
            padding: 10px 12px 10px 18px; border-radius: 999px; background: rgba(36, 25, 17, .96); border: 1px solid var(--borda-forte);
            box-shadow: 0 18px 50px rgba(0, 0, 0, .6); transition: transform .25s cubic-bezier(.2, .8, .2, 1); backdrop-filter: blur(8px); max-width: calc(100vw - 24px); }
.ed-barra.visivel { transform: translate(-50%, 0); }
.ed-barra span { color: var(--tinta-2); font-size: .84rem; white-space: nowrap; }

.fe-cab, .fe-linha { display: grid; grid-template-columns: minmax(0, 1fr) 150px 86px 30px; gap: 10px; align-items: center; }
.fe-cab { color: var(--tinta-3); font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; padding-bottom: 4px; border-bottom: 1px solid var(--borda); }
.fe-linha { padding: 8px 0; border-bottom: 1px solid var(--borda); }
.fe-nome { min-width: 0; color: var(--tinta); font-size: .88rem; }
.fe-nome a { color: var(--tinta); text-decoration: none; }
.fe-nome a:hover { color: var(--link); }
.fe-nome small { display: block; color: var(--tinta-3); font-size: .72rem; }
.fe-qtd { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 6px; align-items: center; }
.fe-qtd .pd-input { padding: 7px 9px; }
.fe-qtd span { color: var(--tinta-3); font-size: .74rem; }
.fe-qtd small { grid-column: 1 / -1; color: var(--tinta-3); font-size: .7rem; }
.fe-custo { text-align: right; font: 700 .86rem Manrope, sans-serif; }
.fe-tirar { border: 0; background: none; color: var(--tinta-3); cursor: pointer; border-radius: 50%; width: 28px; height: 28px; display: grid; place-items: center; }
.fe-tirar:hover:not(:disabled) { color: #fff; background: rgba(255, 255, 255, .06); }
.fe-tirar:disabled { opacity: .3; cursor: default; }
.fe-total { display: flex; justify-content: space-between; padding: 10px 0 4px; color: var(--tinta-2); font-size: .86rem; }
.fe-total b { color: var(--ouro-claro); font: 800 1rem Manrope, sans-serif; }
.fe-busca { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding: 8px 12px; border-radius: 10px; border: 1px dashed var(--borda-forte); color: var(--tinta-3); }
.fe-busca input { flex: 1; background: none; border: 0; outline: 0; color: var(--tinta); font: 600 .88rem Manrope, sans-serif; }
.fe-sugestoes { margin-top: 6px; border: 1px solid var(--borda-forte); border-radius: 12px; overflow: hidden; background: #1a120c; }
.fe-sugestoes button { display: block; width: 100%; text-align: left; border: 0; border-bottom: 1px solid var(--borda); background: none; padding: 8px 12px; cursor: pointer; color: var(--tinta); font: 600 .86rem Manrope, sans-serif; }
.fe-sugestoes button:hover { background: rgba(201, 143, 86, .12); }
.fe-sugestoes small { display: block; color: var(--tinta-3); font-weight: 500; font-size: .72rem; }
.fe-sugestoes em { color: var(--ruim); font-style: normal; }
.fe-vazio { color: var(--tinta-3); font-size: .84rem; padding: 8px 0; }
@media (max-width: 599px) {
    .fe-cab { display: none; }
    .fe-linha { grid-template-columns: minmax(0, 1fr) auto; }
    .fe-nome { grid-column: 1; grid-row: 1; }
    .fe-tirar { grid-column: 2; grid-row: 1; justify-self: end; }
    .fe-qtd { grid-column: 1; grid-row: 2; }
    .fe-custo { grid-column: 2; grid-row: 2; white-space: nowrap; }
}

.in-lista { display: flex; flex-direction: column; border: 1px solid var(--borda); border-radius: 14px; overflow: hidden; }
.in-linha { display: grid; grid-template-columns: minmax(0, 1fr) 120px 90px 100px; gap: 10px; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--borda); color: var(--tinta); text-decoration: none; font-size: .86rem; }
a.in-linha:hover { background: rgba(201, 143, 86, .07); }
.in-cab { color: var(--tinta-3); font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; background: rgba(255, 255, 255, .02); }
.in-nome small, .in-custo small { display: block; color: var(--tinta-3); font-size: .72rem; }
.in-linha .ruim { color: var(--ruim); }
@media (max-width: 599px) {
    .in-linha { grid-template-columns: minmax(0, 1fr) auto; }
    .in-linha > :nth-child(3), .in-linha > :nth-child(4) { display: none; }
}

.ct-lista { display: flex; flex-direction: column; gap: 10px; }
.ct-linha { padding: 12px 14px !important; }
.ct-linha.sujo { border-color: var(--ouro) !important; }
.ct-topo { display: grid; grid-template-columns: 70px minmax(0, 1fr) 160px; gap: 8px; }
.ct-baixo { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 10px; color: var(--tinta-2); font-size: .84rem; }
.ct-baixo label { display: flex; align-items: center; gap: 6px; cursor: pointer; }
.ct-dias { display: inline-flex; gap: 3px; }
.ct-dia { width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--borda); background: none; color: var(--tinta-3); font: 700 .7rem Manrope, sans-serif; cursor: pointer; }
.ct-dia.ativo { background: rgba(201, 143, 86, .22); border-color: var(--ouro); color: var(--ouro-claro); }
.ct-salvar { margin-left: auto; padding: 6px 16px !important; }
@media (max-width: 599px) { .ct-topo { grid-template-columns: 60px minmax(0, 1fr); } .ct-setor { grid-column: 1 / -1; } }

.cp-grupo { padding: 0 !important; overflow: hidden; margin-bottom: 10px; }
.cp-cab { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px; border: 0; background: none; color: var(--tinta); text-align: left; cursor: pointer; }
.cp-cab b { display: block; font-size: .95rem; }
.cp-cab small { color: var(--tinta-3); font-size: .76rem; }
.cp-form, .cp-grupo .ed-checks { padding: 0 16px; }
.cp-itens { margin: 14px 0 0; border-top: 1px solid var(--borda); padding: 6px 16px 14px; }
.cp-item { display: grid; grid-template-columns: minmax(0, 1fr) 100px 100px 100px auto; gap: 8px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--borda); }
.cp-item .pd-input { padding: 7px 9px; }
.cp-item-cab { color: var(--tinta-3); font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; }
.cp-ficha { border: 1px dashed var(--borda-forte); background: none; color: var(--tinta-2); border-radius: 10px; padding: 7px 6px; font: 600 .78rem Manrope, sans-serif; cursor: pointer; }
.cp-ficha:hover { color: #fff; border-color: var(--ouro); }
.cp-acoes { display: flex; align-items: center; gap: 8px; justify-content: flex-end; min-width: 90px; }
.cp-acoes .botao-principal { padding: 5px 12px !important; }
@media (max-width: 699px) {
    .cp-item { grid-template-columns: minmax(0, 1fr) 1fr; }
    .cp-item > :first-child { grid-column: 1 / -1; }
    .cp-item-cab { display: none; }
}

.sb-tamanho { align-items: end; padding: 8px 0; border-bottom: 1px solid var(--borda); }
.sb-nome { color: var(--tinta); font-weight: 700; align-self: center; }
.sb-meia { color: var(--tinta-3); font-size: .78rem; align-self: center; }

/* Cancelamento com duas senhas (conta do salão) */
.sl-cancelar { display: block; }
.cf { display: grid; gap: 10px; padding: 10px 12px 12px; margin: 4px 0 10px; border-radius: 12px; border: 1px solid rgba(255, 107, 94, .3); background: rgba(255, 107, 94, .05); }
.cf-campo { display: grid; gap: 6px; font-size: .78rem; color: var(--tinta-3); }
.cf-campo small { color: var(--tinta-3); }
.cf-qtd { width: 80px; }
.cf-linha { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.cf-linha .pd-input { flex: 1 1 160px; }
.cf-botoes { justify-content: flex-end; }
.cf-senha { display: grid; gap: 6px; padding-top: 8px; border-top: 1px dashed var(--borda); }
.cf-senha-titulo { font-weight: 700; font-size: .85rem; display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: baseline; }
.cf-senha-titulo small { font-weight: 400; color: var(--tinta-3); font-size: .76rem; }
.lux-chip.perigo.ativo { background: rgba(255, 107, 94, .18); border-color: rgba(255, 107, 94, .6); color: var(--critico); }
.sl-aprov { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--tinta-3); }
.sl-aprov.aprovado { color: #6fcf97; }
.sl-aprov.reprovado { color: var(--critico); }

/* Gestão: cancelamentos a aprovar */
.ca-datas { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 4px 0 16px; }
.ca-grade { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 1100px) { .ca-grade { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); } }
.ca-lista-topo { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; align-items: flex-start; }
.ca-todos { display: flex; gap: 6px; align-items: center; font-size: .8rem; color: var(--tinta-3); }
.ca-dia { margin: 14px 0 6px; font-size: .72rem; text-transform: uppercase; letter-spacing: .12em; color: var(--tinta-3); }
.ca-dia:first-of-type { margin-top: 4px; }
.ca-item { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-top: 1px solid var(--borda); }
.ca-item > input { margin-top: 4px; }
.ca-item.aprovado { opacity: .75; }
.ca-corpo { flex: 1; min-width: 0; display: grid; gap: 4px; }
.ca-corpo small { color: var(--tinta-3); font-size: .76rem; line-height: 1.45; }
.ca-linha1 { display: flex; justify-content: space-between; gap: 10px; }
.ca-valor { font-weight: 700; white-space: nowrap; }
.ca-motivo { font-size: .85rem; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ca-tag { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: 2px 8px; border-radius: 999px; background: var(--cartao-2); color: var(--tinta-2); }
.ca-tag.perda { background: rgba(255, 107, 94, .15); color: var(--critico); }
.ca-decisao { font-style: italic; }
.ca-form { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.ca-form .pd-input { flex: 1 1 200px; }
.ca-botoes { display: flex; flex-direction: column; gap: 6px; flex: none; }
.ca-reprovar { color: var(--critico); }
.ca-tabela { display: grid; }
.ca-pessoa { display: flex; justify-content: space-between; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--borda); }
.ca-pessoa:first-child { border-top: 0; }
.ca-pessoa > div { display: grid; gap: 2px; }
.ca-pessoa small { color: var(--tinta-3); font-size: .76rem; }
.ca-pessoa.destaque b { color: var(--critico); }
.ca-pendencia { font-size: .78rem; font-weight: 700; color: var(--critico); white-space: nowrap; }
@media (max-width: 600px) {
    .ca-item { flex-wrap: wrap; }
    .ca-botoes { flex-direction: row; width: 100%; justify-content: flex-end; }
}

/* Estoque */
.es-acao { margin-bottom: 14px; }
.es-form { display: grid; gap: 10px; }
.es-form label { display: grid; gap: 4px; font-size: .78rem; color: var(--tinta-3); }
.es-botoes { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.es-abas { margin-bottom: 14px; }
.es-lista { display: flex; flex-direction: column; border: 1px solid var(--borda); border-radius: 14px; overflow: hidden; }
.es-linha { display: grid; grid-template-columns: minmax(0, 1fr) 110px 100px 120px 90px; gap: 10px; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--borda); color: var(--tinta); text-decoration: none; font-size: .86rem; }
.es-linha:hover:not(.es-cab) { background: rgba(255, 255, 255, .025); }
.es-linha > span:not(.es-nome) { text-align: right; white-space: nowrap; }
.es-cab > span:first-child { text-align: left !important; }
.es-cab { color: var(--tinta-3); font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; background: rgba(255, 255, 255, .02); }
.es-nome { min-width: 0; }
.es-nome small { display: block; color: var(--tinta-3); font-size: .72rem; }
.es-linha .ruim, .ed-margem .ruim { color: var(--ruim); }
.es-linha .atencao { color: var(--atencao, #e0b252); }
.es-linha .bom { color: #6fcf97; }
.es-sai { color: var(--tinta-2); white-space: nowrap; }
.es-entra { color: #6fcf97; white-space: nowrap; }
.iv-linha { grid-template-columns: minmax(0, 1fr) 110px 150px 160px; }
.es-linha-acoes { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.es-arquivo { position: relative; overflow: hidden; display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.es-arquivo input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.ee-linha { padding: 12px 0; border-bottom: 1px solid var(--borda); display: grid; gap: 8px; }
.ee-linha.pendente { border-left: 3px solid var(--atencao, #e0b252); padding-left: 10px; }
.ee-nota b { font-size: .88rem; }
.ee-nota small { display: block; color: var(--tinta-3); font-size: .74rem; }
.ee-campos { display: grid; grid-template-columns: minmax(0, 1.4fr) 150px minmax(0, 1fr) 30px; gap: 10px; align-items: start; }
.ee-campos label { display: grid; gap: 4px; font-size: .74rem; color: var(--tinta-3); }
.ee-un { display: flex; align-items: center; gap: 6px; }
.ee-un .pd-input { min-width: 0; flex: 1; }
.ee-un em { font-style: normal; color: var(--tinta-3); font-size: .74rem; }
.ee-resumo { display: grid; gap: 2px; font-size: .84rem; padding-top: 18px; }
.ee-resumo small { color: var(--tinta-3); font-size: .74rem; }
.ee-alerta { color: var(--ruim) !important; }
.ib { position: relative; min-width: 0; }
.ib .fe-busca { margin-top: 0; }
.ib-escolhido { display: block; width: 100%; text-align: left; border: 1px solid var(--borda-forte); border-radius: 10px; background: rgba(255, 255, 255, .02); padding: 7px 12px; cursor: pointer; color: var(--tinta); font: 600 .86rem Manrope, sans-serif; }
.ib-escolhido small { display: block; color: var(--tinta-3); font-weight: 500; font-size: .72rem; }
@media (max-width: 760px) {
    .es-linha { grid-template-columns: minmax(0, 1fr) 90px 80px; }
    .es-linha > span:nth-child(4), .es-linha > span:nth-child(5) { display: none; }
    .iv-linha { grid-template-columns: minmax(0, 1fr) 120px; }
    .iv-linha > span:nth-child(2) { display: none; }
    .iv-linha > span:nth-child(4) { display: block; grid-column: 1 / -1; text-align: right; }
    .ee-campos { grid-template-columns: minmax(0, 1fr) 30px; }
    .ee-campos > label, .ee-campos > .ee-resumo { grid-column: 1 / -1; }
    .ee-resumo { padding-top: 0; }
}

/* Vales */
.vl-assinar { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--borda); display: grid; gap: 8px; }
.vl-pin { letter-spacing: .4em; font-size: 1.1rem; text-align: center; }
.vl-assinado { padding: 8px 12px; border-radius: 10px; background: rgba(224, 178, 82, .1); color: var(--tinta); font-size: .84rem; margin-bottom: 8px; }
.vl-mes { display: flex; gap: 8px; align-items: center; }
.vl-mes .pd-input { width: auto; }
.vl-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; padding: 12px 0 16px; border-bottom: 1px solid var(--borda); margin-bottom: 14px; }
.vl-form label { display: grid; gap: 4px; font-size: .78rem; color: var(--tinta-3); }
.vl-form .vl-check { display: flex; align-items: center; gap: 6px; padding-top: 18px; }
.vl-form .es-botoes, .vl-form .lux-ajuda { grid-column: 1 / -1; }
.vl-linha { grid-template-columns: minmax(0, 1fr) 100px 110px 110px 100px 80px; }
.vl-conta { grid-template-columns: minmax(0, 1fr) 100px 100px 100px 90px; }
.vl-fech { grid-template-columns: minmax(0, 1fr) 110px 120px 90px; }
.vl-acoes { display: flex; gap: 4px; justify-content: flex-end; }
.vl-acoes .botao-discreto { padding: 4px 8px; }
.vl-inativo { opacity: .55; }
.es-nome small.ruim, .es-nome .ruim { color: var(--ruim); }
@media (max-width: 760px) {
    .vl-linha { grid-template-columns: minmax(0, 1fr) 90px 70px; }
    .vl-linha > span:nth-child(2), .vl-linha > span:nth-child(4), .vl-linha > span:nth-child(5) { display: none; }
    .vl-conta { grid-template-columns: minmax(0, 1fr) 90px; }
    .vl-conta > span:nth-child(2), .vl-conta > span:nth-child(4), .vl-conta > span:nth-child(5) { display: none; }
    .vl-fech { grid-template-columns: minmax(0, 1fr) 90px; }
    .vl-fech > span:nth-child(3) { display: none; }
    .vl-fech > span:nth-child(4) { grid-column: 1 / -1; text-align: right; }
}

/* Notas da SEFAZ */
.ns-estado.desligado { border-left: 3px solid var(--atencao, #e0b252); }
.ns-linha { display: flex; gap: 14px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.ns-nota { grid-template-columns: minmax(0, 1fr) 100px 110px 230px; }
.ns-nota .es-nome small.atencao { color: var(--atencao, #e0b252); }
.ns-acoes { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; }
.ns-acoes .botao-principal, .ns-acoes .botao-discreto { padding: 6px 12px; }
.ns-ignorar { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; }
@media (max-width: 760px) {
    .ns-nota { grid-template-columns: minmax(0, 1fr) 100px; }
    .ns-nota > span:nth-child(2) { display: none; }
    .ns-nota > .ns-acoes { grid-column: 1 / -1; }
    .ns-ignorar { grid-template-columns: 1fr 1fr; }
    .ns-ignorar .pd-input { grid-column: 1 / -1; }
}

/* Contas a pagar */
.cp-kpi { text-align: left; cursor: pointer; font: inherit; color: inherit; border: none; }
.cp-takeat { display: flex; gap: 14px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.cp-cf { grid-template-columns: minmax(0, 1fr) 130px 130px 140px 120px 50px; }
.cp-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.cp-form label { display: grid; gap: 4px; font-size: .78rem; color: var(--tinta-3); }
.cp-form .vl-check { display: flex; align-items: center; gap: 6px; padding-top: 18px; }
.cp-largo { grid-column: 1 / -1; }
.cp-filtros { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 4px 0 14px; }
.cp-busca { flex: 1; min-width: 200px; }
.cp-cat { width: auto; max-width: 260px; }
.cp-lote { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.cp-lote .pd-input { width: auto; }
.cp-lista { display: flex; flex-direction: column; }
.cp-dia { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: var(--tinta-3); padding: 14px 4px 6px; }
.cp-dia.vencida { color: var(--ruim); }
.cp-dia.hoje { color: var(--atencao, #e0b252); }
.cp-linha { display: grid; grid-template-columns: 26px minmax(0, 1fr); align-items: center; border-bottom: 1px solid var(--borda); }
.cp-linha > input[type=checkbox] { margin: 0 0 0 4px; }
.cp-linha.vencida { box-shadow: inset 3px 0 0 var(--ruim); }
.cp-linha.hoje { box-shadow: inset 3px 0 0 var(--atencao, #e0b252); }
.cp-linha.aberta { background: rgba(255, 255, 255, .025); }
.cp-corpo { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 8px; background: none; border: none; color: var(--tinta); text-align: left; cursor: pointer; font: inherit; font-size: .86rem; }
.cp-valor { display: grid; justify-items: end; white-space: nowrap; }
.cp-valor small { color: var(--tinta-3); font-size: .7rem; }
.cp-linha.paga .cp-valor b { color: #6fcf97; }
.cp-detalhe { grid-column: 1 / -1; padding: 4px 12px 14px 34px; display: grid; gap: 10px; font-size: .82rem; }
.cp-det-info { display: grid; gap: 2px; color: var(--tinta-2); }
.cp-barras { font-family: ui-monospace, monospace; font-size: .76rem; word-break: break-all; }
.cp-grupo { display: flex; flex-wrap: wrap; gap: 6px; }
.cp-parc { padding: 3px 8px; border-radius: 8px; border: 1px solid var(--borda); font-size: .74rem; color: var(--tinta-2); }
.cp-parc.paga { color: #6fcf97; border-color: rgba(111, 207, 151, .35); }
.cp-parc.atual { border-color: var(--dourado, #c8a15a); color: var(--tinta); }
.cp-baixa { display: flex; justify-content: space-between; gap: 10px; align-items: center; padding: 6px 10px; border-radius: 10px; background: rgba(111, 207, 151, .07); }
.cp-pagar { display: grid; grid-template-columns: 150px 130px 120px 120px minmax(140px, 1fr) auto; gap: 8px; align-items: end; }
.cp-pagar label { display: grid; gap: 4px; font-size: .74rem; color: var(--tinta-3); }
.cp-acoes { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.cp-espaco { flex: 1; }
.cp-anexo { display: inline-flex; align-items: center; gap: 2px; }
.ep-parcelas { display: grid; gap: 8px; margin-top: 10px; }
.ep-parcela { display: grid; grid-template-columns: 30px 170px 140px auto 30px; gap: 8px; align-items: center; }
.ep-parcela small { color: var(--tinta-3); font-size: .74rem; }
@media (max-width: 760px) {
    .cp-cf { grid-template-columns: minmax(0, 1fr) 100px 40px; }
    .cp-cf > span:nth-child(2), .cp-cf > span:nth-child(3) { display: none; }
    .cp-pagar { grid-template-columns: 1fr 1fr; }
    .cp-pagar > button { grid-column: 1 / -1; }
    .cp-detalhe { padding-left: 12px; }
    .ep-parcela { grid-template-columns: 26px 1fr 1fr 26px; }
    .ep-parcela small { display: none; }
}

/* Contas a receber */
.es-entra { color: #6fcf97; }
.cr-maq { display: grid; grid-template-columns: minmax(0, 1fr) 90px 64px 90px 64px 170px auto; gap: 8px; align-items: end; padding: 10px 4px; border-bottom: 1px solid var(--borda); }
.cr-maq label { display: grid; gap: 4px; font-size: .72rem; color: var(--tinta-3); }
@media (max-width: 760px) {
    .cr-maq { grid-template-columns: 1fr 1fr; }
    .cr-maq > .es-nome, .cr-maq > button { grid-column: 1 / -1; }
    .cp-cf > span:nth-child(4) { display: none; }
}

/* Painel: hoje e estoque em risco */
.pn-historico { margin-top: 34px; padding-top: 22px; border-top: 1px solid var(--borda); }
.ph-hero { margin-bottom: 16px; }
.ph-kpis { margin-bottom: 16px; }
.ph-sub { margin-top: 16px; }
.er-resumo { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.er-num { display: grid; gap: 2px; text-align: left; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--borda); background: var(--cartao); color: var(--tinta); cursor: pointer; font: inherit; }
.er-num b { font-size: 1.6rem; line-height: 1.1; }
.er-num span { font-weight: 700; font-size: .86rem; }
.er-num small { color: var(--tinta-3); font-size: .72rem; }
.er-num.zerado b { color: var(--ruim); }
.er-num.critico b { color: #e8875a; }
.er-num.baixo b { color: var(--atencao, #e0b252); }
.er-num.bebida b { color: #c58fd1; }
.er-num.ativo { border-color: var(--borda-forte); background: rgba(255, 255, 255, .05); }
.er-lista { display: flex; flex-direction: column; border: 1px solid var(--borda); border-radius: 14px; overflow: hidden; }
.er-linha { display: grid; grid-template-columns: minmax(0, 1fr) 100px 100px 130px 120px; gap: 10px; align-items: center; padding: 9px 14px; border-bottom: 1px solid var(--borda); color: var(--tinta); text-decoration: none; font-size: .85rem; }
.er-linha > span:not(.es-nome) { text-align: right; white-space: nowrap; }
.er-linha > span:last-child { display: grid; justify-items: end; }
.er-linha > span:last-child small { color: var(--tinta-3); font-size: .7rem; }
.er-cab > span:first-child { text-align: left; }
.er-cab { font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; color: var(--tinta-3); }
.er-linha.zerado { box-shadow: inset 3px 0 0 var(--ruim); }
.er-linha.critico { box-shadow: inset 3px 0 0 #e8875a; }
.er-linha.baixo { box-shadow: inset 3px 0 0 var(--atencao, #e0b252); }
.er-linha.zerado .er-dura, .er-linha .ruim { color: var(--ruim); }
.er-linha.critico .er-dura { color: #e8875a; }
.er-linha:hover:not(.er-cab) { background: rgba(255, 255, 255, .025); }
.er-bebida { color: #c58fd1; vertical-align: -3px; margin-right: 2px; }
.er-nota { margin-top: 10px; }
@media (max-width: 760px) {
    .er-resumo { grid-template-columns: 1fr 1fr; }
    .er-linha { grid-template-columns: minmax(0, 1fr) 90px 92px; }
    .er-linha > span:nth-child(2), .er-linha > span:nth-child(3) { display: none; }
}

/* ---------- Contingência da internet (delivery e agente do caixa) ---------- */
.ml-cartao { display: flex; flex-wrap: wrap; gap: 12px 18px; align-items: center; justify-content: space-between; margin: 0 0 18px; padding: 14px 16px;
    border-radius: 16px; border: 1px solid var(--lux-borda, rgba(255,255,255,.1)); background: rgba(255,255,255,.03); --ml-cor: #9a8f80; }
.ml-cartao.ok { --ml-cor: #5fb37c; }
.ml-cartao.fechado { --ml-cor: #e0765a; border-color: rgba(224,118,90,.45); background: rgba(224,118,90,.08); }
.ml-estado { display: flex; gap: 12px; align-items: flex-start; flex: 1 1 320px; min-width: 0; }
.ml-estado b { display: block; font-size: .98rem; }
.ml-estado small { display: block; opacity: .75; font-size: .82rem; line-height: 1.4; margin-top: 2px; }
.ml-luz { width: 11px; height: 11px; border-radius: 50%; background: var(--ml-cor); box-shadow: 0 0 0 4px color-mix(in srgb, var(--ml-cor) 22%, transparent); margin-top: 5px; flex: none; }
.ml-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.ml-regras { flex: 1 1 100%; display: grid; gap: 8px; padding-top: 10px; border-top: 1px dashed rgba(255,255,255,.12); font-size: .88rem; }
.ml-regras select { margin: 0 6px; padding: 4px 6px; border-radius: 8px; background: transparent; color: inherit; border: 1px solid rgba(255,255,255,.2); }
.ml-regras select option { color: #222; }
.ml-check { display: flex; gap: 8px; align-items: center; }
.ml-pendencias { flex: 1 1 100%; display: grid; gap: 8px; padding-top: 10px; border-top: 1px dashed rgba(255,255,255,.12); font-size: .88rem; }
.ml-pend { display: flex; gap: 10px; justify-content: space-between; align-items: center; }
.ml-pend small { display: block; opacity: .7; }
/* Faixa "sem internet: modo local" (local.js) */
#jua-modo-local { position: fixed; left: 50%; transform: translateX(-50%); top: max(8px, env(safe-area-inset-top)); z-index: 3000; display: none;
    padding: 7px 14px; border-radius: 999px; font: 600 .8rem/1.2 Manrope, system-ui, sans-serif; background: #b8502f; color: #fff; box-shadow: 0 6px 20px rgba(0,0,0,.35); }
#jua-modo-local.visivel { display: block; }
#jua-modo-local.voltando { background: #3f7d58; }
.ml-horario { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; }
.ml-horario b { flex: 1 1 100%; }
.ml-horario input[type=time] { margin-left: 6px; padding: 4px 6px; border-radius: 8px; background: transparent; color: inherit; border: 1px solid rgba(255,255,255,.2); color-scheme: dark; }
.ml-dias { display: flex; gap: 6px; flex-wrap: wrap; }

/* ---------- Controle de perdas (§4.13) ---------- */
.sl-selo.trava { background: rgba(255, 107, 94, .15); color: var(--critico); }
.cx-alerta { margin-bottom: 14px; border-left: 3px solid var(--critico); }
.cx-alerta .lux-chip small { font-weight: 400; }
.cx-cego { display: flex; gap: 8px; align-items: center; padding: 10px 14px; margin-bottom: 14px; border: 1px dashed var(--borda); border-radius: 12px; }
.pe-alertas { margin-bottom: 16px; display: grid; gap: 8px; }
.pe-alerta { font-size: .86rem; line-height: 1.5; padding: 6px 0; border-top: 1px solid var(--borda); }
.pe-cfg { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: .86rem; padding: 4px 0; }
.pe-cfg span { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.pe-faixa { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; border-left: 3px solid var(--critico); text-decoration: none; color: inherit; }
.pe-faixa > div { flex: 1; display: grid; }
.pe-faixa small { color: var(--tinta-3); }

/* ---------- Autoatendimento pelo celular (§4.15) ---------- */
.aa-avisos { margin-bottom: 14px; border-left: 3px solid var(--dourado, #c98f56); display: grid; gap: 4px; }
.aa-linha { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid var(--borda); }
.aa-linha > div:first-child { display: grid; gap: 2px; flex: 1; min-width: 0; }
.aa-linha small { color: var(--tinta-3); }
.aa-linha .aa-espera { color: var(--tinta-2); }
.aa-valor { font-weight: 700; margin-left: 6px; }
.aa-botoes { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.aa-mesa { margin-bottom: 14px; }
.aa-codigo { font-size: 1rem; letter-spacing: .2em; color: var(--tinta-1, inherit); }
.aa-tirar { margin-left: 6px; border: 0; background: transparent; color: var(--critico); font-weight: 800; cursor: pointer; }
.aa-quem { color: var(--tinta-3); }
.aa-qr-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; }
.aa-qr { display: grid; justify-items: center; gap: 4px; padding: 12px; border: 1px solid var(--borda); border-radius: 14px; text-align: center; }
.aa-qr svg { width: 140px; height: 140px; background: #fff; border-radius: 6px; }
.aa-qr b { font-size: 1.1rem; }
.aa-qr small { color: var(--tinta-3); font-size: .7rem; word-break: break-all; }
.aa-cfg { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 5px 0; font-size: .88rem; }
@media print {
    body * { visibility: hidden; }
    .aa-qr-grade, .aa-qr-grade * { visibility: visible; }
    .aa-qr-grade { position: absolute; inset: 0; grid-template-columns: repeat(3, 1fr); }
    .aa-qr { break-inside: avoid; border: 1px dashed #999; }
    .aa-qr .aa-nao-imprime { display: none; }
}
.sl-couvert-hora { display: inline-flex; align-items: center; gap: 6px; font-size: .82rem; color: var(--tinta-3); }
.sl-couvert-hora input[type=time] { width: 110px; }
.sl-couvert-modo { width: auto; }

/* Quantas pessoas na mesa: toque rápido de 1 a 10 ou digita mais */
.sl-pessoas-fundo { position: fixed; inset: 0; background: rgba(8, 5, 3, .62); z-index: 1300; }
.sl-pessoas { position: fixed; z-index: 1301; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(440px, calc(100vw - 32px)); display: grid; gap: 12px; }
.sl-pessoas-grade { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.sl-pessoas-n { min-height: 52px; border-radius: 14px; border: 1px solid var(--borda); background: rgba(201, 143, 86, .08); color: var(--tinta); font: 600 1.25rem/1 var(--fonte-titulo, inherit); cursor: pointer; }
.sl-pessoas-n:hover, .sl-pessoas-n.ativo { border-color: var(--ouro); background: rgba(201, 143, 86, .22); }
.sl-pessoas-outro { flex-wrap: wrap; gap: 8px; }
.sl-pessoas-outro .sl-numero { width: 80px; }
.sl-pessoas-editar { margin-bottom: 14px; display: grid; gap: 10px; max-width: 520px; }
.sl-pessoas-selo { display: inline-flex; align-items: center; gap: 4px; background: none; border: 1px dashed var(--borda); border-radius: 999px; padding: 2px 10px; color: inherit; font: inherit; cursor: pointer; }
.sl-pessoas-selo.falta { border-color: var(--ouro); color: var(--ouro); }
.sl-couvert-pessoas.falta { border-color: var(--ouro); box-shadow: 0 0 0 2px rgba(201, 143, 86, .35); }