/* Painel Nexo — azul = Amazon/neutro · laranja = TikTok/destaque · vermelho = problema
   Sistema de design: grade de 4/8 px, 4 raios, 3 sombras, escala tipográfica fixa. */
:root {
  /* marca */
  --azul: #2B54F4;
  --azul-forte: #1E3FCC;
  --azul-claro: #E8EDFF;
  --azul-texto: #2B54F4;
  --laranja: #FF6A34;
  --laranja-forte: #C2410C;   /* superfície com texto branco (5,2:1) */
  --laranja-texto: #C2410C;
  --laranja-claro: #FFEDE5;
  --teo: #1F9E89;
  --verm: #D92D3A;
  --verm-claro: #FDECEE;
  --verm-texto: #B4232F;
  --verde: #12805C;
  --verde-texto: #0E6E4F;
  --amarelo: #E8A100;
  --amarelo-claro: #FFF6DB;
  --amarelo-texto: #8A5A00;
  --roxo: #8E7CF0;
  --acao: #2B54F4;
  --acao-hover: #1E3FCC;
  --sucesso: var(--verde); --perigo: var(--verm); --aviso: var(--amarelo);

  /* superfícies e tinta */
  --fundo: #F3F5FA;
  --papel: #FFFFFF;
  --papel-2: #F6F7FB;
  --papel-3: #EEF0F6;
  --tinta: #121733;
  --tinta-2: #4A5170;
  --tinta-3: #646B88;   /* legenda: 5,2:1 no branco */
  --tinta-4: #9AA0B8;   /* só ícone e placeholder */
  --linha: #E2E6F0;
  --linha-forte: #CDD3E3;
  --chart-grade: #EDF0F6;
  --brilho: #E9ECF4;

  /* espaçamento */
  --e-1: 4px; --e-2: 8px; --e-3: 12px; --e-4: 16px; --e-5: 20px; --e-6: 24px; --e-8: 32px; --e-10: 40px; --e-12: 48px;
  /* raios */
  --r-xs: 6px; --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-full: 999px;
  /* sombras */
  --s-1: 0 1px 2px rgba(18, 23, 51, .06);
  --s-2: 0 1px 2px rgba(18, 23, 51, .06), 0 8px 24px -8px rgba(18, 23, 51, .14);
  --s-3: 0 24px 64px -16px rgba(18, 23, 51, .32);
  /* tipografia */
  --f-titulo: "Bricolage Grotesque", system-ui, sans-serif;
  --f-texto: "Hanken Grotesk", system-ui, sans-serif;
  --f-num: "Space Mono", ui-monospace, monospace;
  --t-11: 11px/16px; --t-12: 12px/16px; --t-13: 13px/20px; --t-14: 14px/20px; --t-15: 15px/20px; --t-16: 16px/24px;
  --t-20: 20px/28px; --t-24: 24px/32px; --t-32: 32px/40px; --t-48: 48px/52px; --t-72: 72px/72px;
  /* movimento */
  --m-rapido: 120ms; --m-medio: 200ms; --m-lento: 320ms; --curva: cubic-bezier(.2, .8, .2, 1);

  /* camadas e efeitos (no escuro ganham brilho; no claro ficam neutros) */
  --papel-elev: var(--papel);
  --realce: 0 0 0 transparent;
  --inv-fundo: var(--tinta); --inv-tinta: var(--papel); --inv-linha: transparent;
  --chip-on-fundo: var(--tinta); --chip-on-tinta: var(--papel);
  --fundo-luz: none; --heroi-brilho: none; --kpi-brilho: none; --kpi-brilho-tt: none; --brilho-ativo: none; --brilho-btn: none;
  --anel-foco: 0 0 0 3px color-mix(in srgb, var(--azul) 22%, transparent);
  --backdrop: rgba(10, 14, 35, .45);
  --sombra-borda: rgba(18, 23, 51, .2);
  --campo-fundo: var(--papel); --btn-sec-fundo: var(--papel); --ic-brilho: none;
  --ativo-fundo: var(--papel); --ativo-ic: var(--tinta);
  --seg-fundo: var(--papel-3); --seg-on: var(--papel);
  --btn-lar-fundo: var(--laranja-forte); --btn-lar-tinta: #fff;
  --btn-verde: #12805C; --btn-verde-hover: #0E6E4F; --btn-perigo: var(--verm);
  --login-luz: radial-gradient(1200px 600px at 100% 0%, color-mix(in srgb, var(--azul) 7%, transparent), transparent 60%);

  /* compat */
  --r: var(--r-md); --r-p: var(--r-sm); --sombra: var(--s-1);
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    /* escuro premium: quase preto azulado, elevação por luminosidade, bordas finas */
    --azul: #5675FF; --azul-forte: #7D95FF; --azul-claro: #141A33; --azul-texto: #93A6FF;
    --laranja: #FF7A45; --laranja-texto: #FF9A6E; --laranja-claro: #26150E; --laranja-forte: #C8460F;
    --teo: #2BB39A; --verm: #E0606A; --verm-claro: #241316; --verm-texto: #F08A92;
    --verde: #3DAA7D; --verde-texto: #5CC79A;
    --amarelo: #D4A440; --amarelo-claro: #221C0E; --amarelo-texto: #E6BE66; --roxo: #9D8CFF;
    --acao: #3A5BFA; --acao-hover: #4D6BFF;
    --fundo: #0A0B10; --papel: #101219; --papel-2: #151821; --papel-3: #1B1F2A; --papel-elev: #14171F;
    --tinta: #ECEDF2; --tinta-2: #A3A8B7; --tinta-3: #858B9C; --tinta-4: #4C5160;
    --linha: #1E222C; --linha-forte: #2A2F3B; --chart-grade: #191C25; --brilho: #252A36;
    --s-1: 0 1px 2px rgba(0, 0, 0, .35);
    --s-2: 0 0 0 1px rgba(255, 255, 255, .03), 0 12px 32px -8px rgba(0, 0, 0, .7);
    --s-3: 0 0 0 1px rgba(255, 255, 255, .04), 0 32px 80px -16px rgba(0, 0, 0, .85);
    --realce: inset 0 1px 0 rgba(255, 255, 255, .035);
    --inv-fundo: #1E2230; --inv-tinta: #ECEDF2; --inv-linha: rgba(255, 255, 255, .08);
    --chip-on-fundo: #232836; --chip-on-tinta: #ECEDF2;
    --fundo-luz: radial-gradient(1100px 420px at 60% -160px, rgba(86, 117, 255, .075), transparent 70%);
    --heroi-brilho: 0 0 36px rgba(110, 135, 255, .28);
    --kpi-brilho: 0 0 18px rgba(110, 135, 255, .22);
    --kpi-brilho-tt: 0 0 18px rgba(255, 122, 69, .22);
    --brilho-ativo: 0 0 12px -2px rgba(86, 117, 255, .55);
    --brilho-btn: inset 0 1px 0 rgba(255, 255, 255, .14), 0 6px 18px -6px rgba(58, 91, 250, .6);
    --anel-foco: 0 0 0 3px rgba(86, 117, 255, .28), 0 0 14px -2px rgba(86, 117, 255, .45);
    --backdrop: rgba(3, 4, 8, .62);
    --sombra-borda: rgba(0, 0, 0, .55);
    --campo-fundo: #0C0E14; --btn-sec-fundo: #171A23; --ic-brilho: drop-shadow(0 0 6px rgba(147, 166, 255, .45));
    --ativo-fundo: #191C26; --ativo-ic: #93A6FF;
    --seg-fundo: #0D0F15; --seg-on: #1F2330;
    --btn-lar-fundo: #FF7A45; --btn-lar-tinta: #160A04;
    --btn-verde: #1F7A57; --btn-verde-hover: #248A63; --btn-perigo: #B93A45;
    --login-luz: radial-gradient(900px 520px at 50% -12%, rgba(86, 117, 255, .16), transparent 62%), radial-gradient(700px 420px at 100% 110%, rgba(255, 122, 69, .07), transparent 60%);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  /* escuro premium: quase preto azulado, elevação por luminosidade, bordas finas */
  --azul: #5675FF; --azul-forte: #7D95FF; --azul-claro: #141A33; --azul-texto: #93A6FF;
  --laranja: #FF7A45; --laranja-texto: #FF9A6E; --laranja-claro: #26150E; --laranja-forte: #C8460F;
  --teo: #2BB39A; --verm: #E0606A; --verm-claro: #241316; --verm-texto: #F08A92;
  --verde: #3DAA7D; --verde-texto: #5CC79A;
  --amarelo: #D4A440; --amarelo-claro: #221C0E; --amarelo-texto: #E6BE66; --roxo: #9D8CFF;
  --acao: #3A5BFA; --acao-hover: #4D6BFF;
  --fundo: #0A0B10; --papel: #101219; --papel-2: #151821; --papel-3: #1B1F2A; --papel-elev: #14171F;
  --tinta: #ECEDF2; --tinta-2: #A3A8B7; --tinta-3: #858B9C; --tinta-4: #4C5160;
  --linha: #1E222C; --linha-forte: #2A2F3B; --chart-grade: #191C25; --brilho: #252A36;
  --s-1: 0 1px 2px rgba(0, 0, 0, .35);
  --s-2: 0 0 0 1px rgba(255, 255, 255, .03), 0 12px 32px -8px rgba(0, 0, 0, .7);
  --s-3: 0 0 0 1px rgba(255, 255, 255, .04), 0 32px 80px -16px rgba(0, 0, 0, .85);
  --realce: inset 0 1px 0 rgba(255, 255, 255, .035);
  --inv-fundo: #1E2230; --inv-tinta: #ECEDF2; --inv-linha: rgba(255, 255, 255, .08);
  --chip-on-fundo: #232836; --chip-on-tinta: #ECEDF2;
  --fundo-luz: radial-gradient(1100px 420px at 60% -160px, rgba(86, 117, 255, .075), transparent 70%);
  --heroi-brilho: 0 0 36px rgba(110, 135, 255, .28);
  --kpi-brilho: 0 0 18px rgba(110, 135, 255, .22);
  --kpi-brilho-tt: 0 0 18px rgba(255, 122, 69, .22);
  --brilho-ativo: 0 0 12px -2px rgba(86, 117, 255, .55);
  --brilho-btn: inset 0 1px 0 rgba(255, 255, 255, .14), 0 6px 18px -6px rgba(58, 91, 250, .6);
  --anel-foco: 0 0 0 3px rgba(86, 117, 255, .28), 0 0 14px -2px rgba(86, 117, 255, .45);
  --backdrop: rgba(3, 4, 8, .62);
  --sombra-borda: rgba(0, 0, 0, .55);
  --campo-fundo: #0C0E14; --btn-sec-fundo: #171A23; --ic-brilho: drop-shadow(0 0 6px rgba(147, 166, 255, .45));
  --ativo-fundo: #191C26; --ativo-ic: #93A6FF;
  --seg-fundo: #0D0F15; --seg-on: #1F2330;
  --btn-lar-fundo: #FF7A45; --btn-lar-tinta: #160A04;
  --btn-verde: #1F7A57; --btn-verde-hover: #248A63; --btn-perigo: #B93A45;
  --login-luz: radial-gradient(900px 520px at 50% -12%, rgba(86, 117, 255, .16), transparent 62%), radial-gradient(700px 420px at 100% 110%, rgba(255, 122, 69, .07), transparent 60%);
  color-scheme: dark;
}

/* ================= base ================= */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; background: var(--fundo); scrollbar-color: var(--linha-forte) transparent; }
body {
  margin: 0; background: var(--fundo-luz) no-repeat, var(--fundo); color: var(--tinta);
  font: 400 var(--t-14) var(--f-texto); -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
h1, h2, h3 { margin: 0; font-weight: 700; letter-spacing: -.01em; }
h1 { font: 800 var(--t-32) var(--f-titulo); letter-spacing: -.02em; }
h2 { font: 700 var(--t-20) var(--f-titulo); }
h3 { font: 600 var(--t-15) var(--f-texto); }
p { margin: 0; }
a { color: var(--azul-texto); }
button, input, select, textarea { font: inherit; color: inherit; }
::placeholder { color: var(--tinta-4); opacity: 1; }
:focus-visible { outline: 2px solid var(--azul); outline-offset: 2px; border-radius: var(--r-xs); }
.num { font-family: var(--f-num); font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.mudo { color: var(--tinta-3); }
.neg { color: var(--verm-texto); }
.pos { color: var(--verde-texto); }
.oculto { display: none !important; }
kbd { font: 700 11px/16px var(--f-num); border: 1px solid var(--linha-forte); border-bottom-width: 2px; border-radius: var(--r-xs); padding: 0 5px; color: var(--tinta-2); background: var(--papel); display: inline-block; min-width: 20px; text-align: center; }

/* ================= topo ================= */
.topo {
  position: sticky; top: 0; z-index: 20; background: color-mix(in srgb, var(--fundo) 86%, transparent);
  backdrop-filter: saturate(1.4) blur(12px); -webkit-backdrop-filter: saturate(1.4) blur(12px);
  border-bottom: 1px solid var(--linha);
}
.topo-in { max-width: 1280px; margin: 0 auto; padding: 0 var(--e-6); height: 56px; display: flex; align-items: center; gap: var(--e-6); }
.marca { display: flex; align-items: center; gap: var(--e-2); text-decoration: none; color: var(--tinta); }
.marca .marca-n { width: 28px; height: 28px; border-radius: var(--r-sm); background: var(--acao); position: relative; display: grid; place-items: center; color: #fff; font: 800 16px/1 var(--f-titulo); margin: 0; flex: none; }
.marca .marca-n::after { content: ""; position: absolute; right: -3px; bottom: -3px; width: 10px; height: 10px; border-radius: 50%; background: var(--laranja); border: 2px solid var(--fundo); }
.marca b { font: 800 18px/1 var(--f-titulo); letter-spacing: -.02em; }
.marca span { font: 500 var(--t-13) var(--f-texto); color: var(--tinta-3); }
.nav { display: flex; gap: var(--e-1); flex: 1; }
.nav a {
  text-decoration: none; color: var(--tinta-2); font-weight: 600; padding: 6px 12px; border-radius: var(--r-sm);
  display: inline-flex; align-items: center; gap: var(--e-2); transition: background var(--m-rapido), color var(--m-rapido);
}
.nav a:hover { background: var(--papel-3); color: var(--tinta); }
.nav a.on { background: var(--papel); color: var(--tinta); box-shadow: inset 0 0 0 1px var(--linha), var(--s-1); }
.nav a .ponto { width: 8px; height: 8px; border-radius: 50%; }
.nav a svg { width: 18px; height: 18px; }
.ponto.amz { background: var(--azul); }
.ponto.tt { background: var(--laranja); }
.ponto.ct { background: var(--tinta-3); }
.topo-acoes { margin-left: auto; display: flex; align-items: center; gap: var(--e-1); }
.nav-baixo { display: none; }

/* ================= página ================= */
main { max-width: 1280px; margin: 0 auto; padding: var(--e-6) var(--e-6) 64px; }
.cab-pagina { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--e-4); flex-wrap: wrap; margin-bottom: var(--e-6); }
.cab-pagina .sub { color: var(--tinta-3); margin-top: var(--e-1); }

/* abas da seção: sublinhado (o ativo pega a cor da seção) */
.abas { display: flex; gap: var(--e-1); border-bottom: 1px solid var(--linha); }
.abas a { text-decoration: none; color: var(--tinta-3); font-weight: 600; padding: var(--e-2) var(--e-3); white-space: nowrap; position: relative; border-radius: var(--r-xs) var(--r-xs) 0 0; }
.abas a:hover { color: var(--tinta); }
.abas a.on { color: var(--tinta); }
.abas a.on::after { content: ""; position: absolute; left: var(--e-3); right: var(--e-3); bottom: -1px; height: 2px; border-radius: 2px; background: var(--azul); box-shadow: var(--brilho-ativo); }
.secao-tt .abas a.on::after { background: var(--laranja); }

/* controle segmentado (período, filtros curtos) */
.periodo { display: inline-flex; gap: 2px; align-items: center; background: var(--seg-fundo); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--linha) 60%, transparent); border-radius: var(--r-sm); padding: 2px; flex-wrap: wrap; }
.chip {
  border: 1px solid var(--linha); background: var(--papel); color: var(--tinta-2); border-radius: var(--r-sm);
  min-height: 32px; padding: 0 var(--e-3); font: 600 var(--t-13) var(--f-texto); cursor: pointer; white-space: nowrap;
  display: inline-flex; align-items: center; gap: 6px; transition: background var(--m-rapido), color var(--m-rapido), box-shadow var(--m-rapido);
}
.chip:hover { color: var(--tinta); border-color: var(--linha-forte); }
.chip.on { background: var(--chip-on-fundo); border-color: var(--chip-on-fundo); color: var(--chip-on-tinta); }
.periodo .chip { border-color: transparent; background: transparent; min-height: 28px; border-radius: var(--r-xs); padding: 0 10px; }
.periodo .chip:hover { background: color-mix(in srgb, var(--papel) 60%, transparent); }
.periodo .chip.on { background: var(--seg-on); color: var(--tinta); border-color: transparent; box-shadow: var(--s-1), inset 0 0 0 1px var(--linha), var(--realce); }
.periodo .datas { display: inline-flex; align-items: center; gap: var(--e-1); }
.periodo .datas.oculto { display: none; }
.periodo input[type=date], .periodo .data-txt { border: 1px solid var(--linha); background: var(--campo-fundo); border-radius: var(--r-xs); padding: 0 var(--e-2); height: 28px; font: var(--t-13) var(--f-num); width: 104px; }

/* ================= blocos ================= */
.painel { background: var(--papel); border: 1px solid var(--linha); border-radius: var(--r-md); box-shadow: var(--s-1), var(--realce); }
.painel-cab { display: flex; align-items: baseline; justify-content: space-between; gap: var(--e-3); padding: var(--e-5) var(--e-6) 0; flex-wrap: wrap; }
.painel-cab h2 { font: 600 var(--t-15) var(--f-texto); letter-spacing: -.005em; }
.painel-cab p { color: var(--tinta-3); font: var(--t-13) var(--f-texto); }
.painel-corpo { padding: var(--e-4) var(--e-6) var(--e-5); }
.grade { display: grid; gap: var(--e-4); }
.g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.g-7-5 { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.pilha > * + * { margin-top: var(--e-4); }

/* herói: o resultado do período (o único lugar com tipografia grande) */
.heroi { padding: var(--e-6) var(--e-6) var(--e-5); position: relative; overflow: hidden; }
.heroi-rot { color: var(--tinta-2); font-weight: 600; display: flex; gap: var(--e-2); align-items: center; flex-wrap: wrap; }
.heroi-rot .quando { color: var(--tinta-3); font-weight: 500; }
.heroi-valor { font: 700 clamp(48px, 7vw, 72px)/1 var(--f-num); letter-spacing: -.05em; margin: var(--e-3) 0 var(--e-5); text-shadow: var(--heroi-brilho); }
.heroi-valor .rs { font-size: .38em; letter-spacing: 0; margin-right: .25em; color: var(--tinta-3); vertical-align: .9em; }
.heroi-valor .cent { font-size: .45em; color: var(--tinta-3); letter-spacing: -.02em; }
.divisao { display: flex; height: 8px; border-radius: var(--r-full); overflow: hidden; background: var(--linha); gap: 2px; }
.divisao i { display: block; height: 100%; min-width: 0; transition: flex-grow .5s var(--curva); }
.divisao .a { background: var(--azul); }
.divisao .t { background: var(--laranja); }
.legenda-div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-4); margin-top: var(--e-3); }
.legenda-div .item { display: flex; gap: var(--e-2); align-items: flex-start; }
.legenda-div .sw { width: 8px; height: 8px; border-radius: 2px; margin-top: 8px; flex: none; }
.legenda-div .v { font: 700 var(--t-20) var(--f-num); letter-spacing: -.03em; }
.legenda-div .r { color: var(--tinta-2); font: var(--t-13) var(--f-texto); }

/* faixa hoje / semana / mês */
.faixa { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.faixa > div { padding: var(--e-4) var(--e-5); }
.faixa > div + div { border-left: 1px solid var(--linha); }
.faixa .q { font: 600 var(--t-12) var(--f-texto); color: var(--tinta-2); }
.faixa .v { font: 700 var(--t-24) var(--f-num); letter-spacing: -.04em; margin: var(--e-1) 0; }
.faixa .d { font: var(--t-12) var(--f-texto); color: var(--tinta-3); display: flex; gap: var(--e-3); flex-wrap: wrap; }
.faixa .d b { font-family: var(--f-num); font-weight: 400; color: var(--tinta-2); }
.faixa .d .sw { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: var(--e-1); vertical-align: 0; }

/* métricas do período */
.metricas { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.metricas > div { padding: var(--e-4) var(--e-5); }
.metricas > div + div { border-left: 1px solid var(--linha); }
.metricas .q { font: 600 var(--t-12) var(--f-texto); color: var(--tinta-2); }
.metricas .v { font: 700 var(--t-20) var(--f-num); letter-spacing: -.03em; margin-top: var(--e-1); }
.metricas .x { font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.metricas .grande .v { font-size: 24px; line-height: 32px; color: var(--azul-texto); }
.secao-tt .metricas .grande .v { color: var(--laranja-texto); }

/* gráfico */
.grafico { position: relative; height: 280px; }
.grafico.baixo { height: 220px; }
.leg { display: flex; gap: var(--e-4); flex-wrap: wrap; font: var(--t-12) var(--f-texto); color: var(--tinta-2); }
.leg span { display: inline-flex; align-items: center; gap: 6px; }
.leg i { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }
.leg i.tracejado { width: 14px; height: 0; border-top: 2px dashed var(--tinta-4); border-radius: 0; }

/* ranking em barras */
.rank { list-style: none; margin: 0; padding: 0; }
.rank li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px var(--e-3); padding: var(--e-2) 0; border-top: 1px solid var(--linha); }
.rank li:first-child { border-top: 0; }
.rank .n { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rank .v { font-family: var(--f-num); font-weight: 700; text-align: right; }
.rank .barra { grid-column: 1 / -1; height: 4px; border-radius: var(--r-full); background: var(--papel-3); overflow: hidden; }
.rank .barra i { display: block; height: 100%; border-radius: var(--r-full); background: var(--azul); }
.secao-tt .rank .barra i { background: var(--laranja); }
.rank .barra i.neg { background: var(--verm); }
.rank .info { grid-column: 1 / -1; font: var(--t-12) var(--f-texto); color: var(--tinta-3); }

/* listas de alerta */
.alerta-lista { list-style: none; margin: 0; padding: 0; max-height: 360px; overflow: auto; }
.alerta-lista li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px var(--e-2); padding: var(--e-2) 0; border-top: 1px solid var(--linha); align-items: center; }
.alerta-lista li:first-child { border-top: 0; }
.alerta-lista .id { font: var(--t-13) var(--f-num); }
.alerta-lista .p { font: var(--t-13) var(--f-texto); color: var(--tinta-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.alerta-lista li:hover .id { color: var(--azul-texto); text-decoration: underline; }
.alerta-lista li > a { display: flex; flex-direction: column; min-width: 0; color: inherit; text-decoration: none; }
.contador { font: 700 var(--t-12) var(--f-num); padding: 2px var(--e-2); border-radius: var(--r-full); background: var(--papel-3); color: var(--tinta-2); }
.contador.ruim { background: var(--verm-claro); color: var(--verm-texto); }
.contador.atencao { background: var(--amarelo-claro); color: var(--amarelo-texto); }

/* etiquetas de status */
.tag { display: inline-flex; align-items: center; gap: var(--e-1); font: 600 var(--t-12) var(--f-texto); padding: 2px var(--e-2); border-radius: var(--r-full); background: var(--papel-3); color: var(--tinta-2); white-space: nowrap; text-decoration: none; }
.tag.ruim { background: var(--verm-claro); color: var(--verm-texto); }
.tag.ok { background: color-mix(in srgb, var(--verde) 12%, var(--papel)); color: var(--verde-texto); }
.tag.atencao { background: var(--amarelo-claro); color: var(--amarelo-texto); }
.tag.azul { background: var(--azul-claro); color: var(--azul-texto); }
.tag.tt { background: var(--laranja-claro); color: var(--laranja-texto); }

/* regra visível */
.regra { display: flex; gap: var(--e-2); align-items: flex-start; font: var(--t-13) var(--f-texto); color: var(--tinta-2); background: var(--papel-2); border: 1px solid var(--linha); border-radius: var(--r-sm); padding: var(--e-2) var(--e-3); }
.regra svg { flex: none; width: 16px; height: 16px; margin-top: 2px; color: var(--verm); }
.regra a { font-weight: 600; }

/* ================= formulários ================= */
.campo { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.campo[hidden] { display: none; }
.campo label { font: 600 var(--t-12) var(--f-texto); color: var(--tinta-2); }
.entrada, .campo input, .campo select, .campo textarea {
  border: 1px solid var(--linha-forte); background: var(--campo-fundo); border-radius: var(--r-sm);
  padding: var(--e-2) var(--e-3); min-height: 40px; width: 100%; transition: border-color var(--m-rapido), box-shadow var(--m-rapido);
}
.entrada:focus, .campo input:focus, .campo select:focus, .campo textarea:focus { outline: none; border-color: var(--azul); box-shadow: var(--anel-foco); }
.campo input.din, .campo .calc { font-family: var(--f-num); text-align: right; }
.campo .calc { min-height: 40px; display: flex; align-items: center; justify-content: flex-end; padding: 0 var(--e-3); border-radius: var(--r-sm); background: var(--papel-2); font-weight: 700; border: 1px solid var(--linha); }
.campo.erro input { border-color: var(--verm); }
textarea { resize: vertical; }

.linha-lanc { display: grid; gap: var(--e-3); align-items: end; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.linha-lanc .w2 { grid-column: span 2; }
.linha-lanc .w3 { grid-column: span 3; }
.linha-lanc .acao .btn { width: 100%; min-height: 40px; }
.dica { font: var(--t-13) var(--f-texto); color: var(--tinta-3); }
.lucro-vivo.pos { color: var(--verde-texto); }
.lucro-vivo.neg { color: var(--verm-texto); }

/* ================= botões ================= */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--e-2); min-height: 36px; padding: 0 var(--e-4);
  border-radius: var(--r-sm); border: 1px solid transparent; font: 600 var(--t-14) var(--f-texto); cursor: pointer; text-decoration: none;
  background: var(--acao); color: #fff; box-shadow: var(--brilho-btn); transition: background var(--m-rapido), box-shadow var(--m-rapido), transform 80ms; white-space: nowrap;
}
.btn:hover { background: var(--acao-hover); }
.btn:active { transform: translateY(1px); }
.btn.lar { background: var(--btn-lar-fundo); color: var(--btn-lar-tinta); box-shadow: none; }
.btn.lar:hover { background: color-mix(in srgb, var(--btn-lar-fundo) 88%, #000); }
.btn.sec { background: var(--btn-sec-fundo); color: var(--tinta); border-color: var(--linha-forte); box-shadow: var(--s-1), var(--realce); }
.btn.sec:hover { background: var(--papel-3); }
.btn.perigo { background: var(--btn-perigo); box-shadow: none; }
.btn.sec.perigo-txt { color: var(--verm-texto); }
.btn.verde { background: var(--btn-verde); box-shadow: none; }
.btn.verde:hover { background: var(--btn-verde-hover); }
.btn.peq { min-height: 32px; padding: 0 var(--e-3); font-size: 13px; }
.btn svg { width: 16px; height: 16px; flex: none; }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn.fantasma { background: transparent; color: var(--tinta-2); box-shadow: none; }
.btn.fantasma:hover { background: var(--papel-3); color: var(--tinta); }
.icone-btn { width: 36px; height: 36px; border-radius: var(--r-sm); border: 1px solid transparent; background: transparent; color: var(--tinta-2); cursor: pointer; display: inline-grid; place-items: center; text-decoration: none; flex: none; }
.icone-btn:hover { background: var(--papel-3); color: var(--tinta); }
.icone-btn svg { width: 18px; height: 18px; }
.icone-btn.on { background: var(--ativo-fundo); color: var(--tinta); box-shadow: inset 0 0 0 1px var(--linha); }
.icone-btn.lixo:hover { color: var(--verm-texto); background: var(--verm-claro); }

/* colar em lote */
details.colar > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: var(--e-3); padding: var(--e-4) var(--e-6); font-weight: 600; }
details.colar > summary::-webkit-details-marker { display: none; }
details.colar > summary svg { width: 18px; height: 18px; flex: none; color: var(--tinta-2); }
details.colar > summary .seta { margin-left: auto; transition: transform var(--m-medio); color: var(--tinta-3); }
details.colar > summary .seta svg { width: 18px; height: 18px; }
details.colar[open] > summary .seta { transform: rotate(180deg); }
details.colar > summary small { font-weight: 500; color: var(--tinta-3); font-size: 13px; }
.colar-corpo { padding: 0 var(--e-6) var(--e-5); }
.colar textarea { width: 100%; min-height: 128px; font: var(--t-13) var(--f-num); border: 1px dashed var(--linha-forte); border-radius: var(--r-sm); padding: var(--e-3); background: var(--papel-2); }
.colar textarea:focus { outline: none; border-style: solid; border-color: var(--azul); }
.previa-resumo { display: flex; gap: var(--e-2); flex-wrap: wrap; align-items: center; margin: var(--e-3) 0 var(--e-2); }

/* ================= tabelas ================= */
.filtros { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1.3fr .9fr; gap: var(--e-3); padding: var(--e-4) var(--e-6); border-bottom: 1px solid var(--linha); }
.filtros.tt { grid-template-columns: 1fr 1fr 1.4fr 1.4fr; }
.filtros .campo input, .filtros .campo select { min-height: 36px; padding: 6px var(--e-3); }
.tab-rodape { display: flex; justify-content: space-between; align-items: center; gap: var(--e-3); padding: var(--e-3) var(--e-6); flex-wrap: wrap; font: var(--t-13) var(--f-texto); color: var(--tinta-2); border-top: 1px solid var(--linha); }
.tab-rodape b { font-family: var(--f-num); color: var(--tinta); }
.rolagem { overflow-x: auto; -webkit-overflow-scrolling: touch; }
table.t { width: 100%; border-collapse: separate; border-spacing: 0; font: var(--t-14) var(--f-texto); }
table.t th { position: sticky; top: 0; background: var(--papel); text-align: left; font: 600 11px/16px var(--f-texto); letter-spacing: .04em; text-transform: uppercase; color: var(--tinta-3); padding: var(--e-3) var(--e-2); border-bottom: 1px solid var(--linha); white-space: nowrap; }
table.t th.d, table.t td.d { text-align: right; }
table.t td { padding: 2px var(--e-1); border-bottom: 1px solid var(--linha); vertical-align: middle; white-space: nowrap; }
table.t tr:hover td { background: var(--papel-2); }
table.t td:first-child, table.t th:first-child { padding-left: var(--e-4); }
table.t td:last-child, table.t th:last-child { padding-right: var(--e-3); }
table.t .ed {
  border: 1px solid transparent; background: transparent; border-radius: var(--r-xs); padding: 6px; width: 100%; min-width: 0; height: 32px;
  text-overflow: ellipsis; transition: border-color var(--m-rapido), background var(--m-rapido);
}
table.t .ed:hover { border-color: var(--linha-forte); background: var(--campo-fundo); }
table.t .ed:focus { outline: none; border-color: var(--azul); background: var(--campo-fundo); box-shadow: var(--anel-foco); }
table.t .ed.din, table.t .ed.int { font-family: var(--f-num); text-align: right; font-size: 13px; }
table.t .ed.idp { font: 13px/20px var(--f-num); letter-spacing: -.02em; }
table.t select.ed { cursor: pointer; appearance: none; -webkit-appearance: none; padding-right: 6px; }
table.t .lucro { font: 700 13px/20px var(--f-num); text-align: right; padding: 0 var(--e-2); }
table.t tr.fora td { background: color-mix(in srgb, var(--verm-claro) 60%, var(--papel)); }
table.t tr.fora .lucro { color: var(--verm-texto); }
table.t tr.fora .lucro s { opacity: .7; font-weight: 400; }
table.t tr.fora .lucro small { display: block; font: 600 11px/14px var(--f-texto); color: var(--verm-texto); }
table.t tr.salvou td { animation: salvou 1.2s ease-out; }
@keyframes salvou { from { background: color-mix(in srgb, var(--verde) 16%, transparent); } }
table.t tr.novo td { animation: novo 1.6s ease-out; }
@keyframes novo { from { background: var(--azul-claro); } }
table.t.amz { min-width: 1150px; }
table.t.tt { min-width: 1180px; }
table.t .icone-btn { width: 32px; height: 32px; }
table.t td.fixa-d, table.t th.fixa-d { position: sticky; right: 0; background: var(--papel); z-index: 1; }
table.t th.fixa-d { z-index: 3; }
table.t td.fixa-d { box-shadow: -10px 0 10px -10px var(--sombra-borda); }
table.t tr:hover td.fixa-d { background: var(--papel-2); }
table.t tr.fora td.fixa-d { background: color-mix(in srgb, var(--verm-claro) 60%, var(--papel)); }
table.t .lixo { opacity: 0; transition: opacity var(--m-rapido); }
table.t tr:hover .lixo, table.t tr:focus-within .lixo, table.t .lixo:focus-visible { opacity: 1; }
@media (hover: none) { table.t .lixo { opacity: 1; } }
.fixa-in { display: flex; align-items: center; gap: 2px; }
.fixa-in .ed { flex: 1; }
.sel-status { font-weight: 700; font-size: 12px; }
.sel-status.ruim { color: var(--verm-texto); }
.sel-status.ok { color: var(--verde-texto); }
.sel-status.atencao { color: var(--amarelo-texto); }
.cod-nao { color: var(--amarelo-texto); font-weight: 700; }
table.previa td { padding: var(--e-2); }
table.previa tr.sit-erro td { background: color-mix(in srgb, var(--verm-claro) 70%, transparent); }
table.previa tr.sit-duplicado td { color: var(--tinta-3); }
table.previa tr.sit-nota td { font-size: 12px; padding-top: 0; white-space: normal; }
table.contas td { padding: var(--e-2); }
table.contas td:first-child { padding-left: var(--e-6); }
.conta-link { font-weight: 700; color: var(--tinta); text-decoration: none; }
.conta-link:hover { color: var(--azul-texto); text-decoration: underline; }
.mini-barra { display: block; height: 4px; border-radius: var(--r-full); background: var(--papel-3); overflow: hidden; min-width: 80px; }
.mini-barra i { display: block; height: 100%; background: var(--azul); border-radius: var(--r-full); }
.mini-barra i.neg { background: var(--verm); }
.motivos { display: block; font: var(--t-12) var(--f-texto); color: var(--tinta-3); margin-top: 2px; white-space: normal; }
.alerta-link { display: contents; color: inherit; text-decoration: none; }

/* ================= vazio ================= */
.vazio { text-align: center; padding: var(--e-10) var(--e-6); }
.vazio h2 { font: 700 var(--t-20) var(--f-titulo); margin: var(--e-3) 0 6px; }
.vazio p { color: var(--tinta-2); max-width: 46ch; margin: 0 auto; }
.vazio .acoes { display: flex; gap: var(--e-2); justify-content: center; flex-wrap: wrap; margin-top: var(--e-5); }
.vazio-mini { padding: var(--e-5) var(--e-1); color: var(--tinta-3); font: var(--t-14) var(--f-texto); }
.vazio-icone { width: 48px; height: 48px; margin: 0 auto; border-radius: var(--r-md); display: grid; place-items: center; background: var(--azul-claro); color: var(--azul-texto); }
.vazio-icone.tt { background: var(--laranja-claro); color: var(--laranja-texto); }
.vazio-icone svg { width: 24px; height: 24px; }
.boas-vindas { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 0; overflow: hidden; }
.boas-vindas .lado { padding: var(--e-8); }
.boas-vindas .lado + .lado { border-left: 1px solid var(--linha); background: var(--papel-2); }
.boas-vindas h2 { font: 800 var(--t-32) var(--f-titulo); letter-spacing: -.02em; }
.boas-vindas p { color: var(--tinta-2); margin-top: var(--e-2); max-width: 44ch; }
.passos { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--e-3); }
.passos li { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: var(--e-3); align-items: start; }
.passos .nn { width: 32px; height: 32px; border-radius: var(--r-sm); display: grid; place-items: center; font: 700 var(--t-14) var(--f-num); background: var(--papel); border: 1px solid var(--linha); }
.passos b { display: block; }
.passos span { font: var(--t-13) var(--f-texto); color: var(--tinta-2); }
.exemplo-linha { margin-top: var(--e-4); font: var(--t-12) var(--f-num); color: var(--tinta-2); background: var(--papel); border: 1px dashed var(--linha-forte); border-radius: var(--r-sm); padding: var(--e-2) var(--e-3); overflow-x: auto; white-space: nowrap; }
button.exemplo-linha { width: 100%; text-align: left; cursor: pointer; display: block; }
button.exemplo-linha:hover { border-color: var(--azul); color: var(--tinta); }
.acoes-linha { display: flex; gap: var(--e-2); flex-wrap: wrap; margin-top: var(--e-6); }
.atalho-card .painel-cab { align-items: center; }
.tecla { font: 700 var(--t-14) var(--f-num); border: 1px solid var(--linha-forte); border-bottom-width: 3px; border-radius: var(--r-sm); padding: 4px 10px; background: var(--papel); color: var(--tinta-2); }
.atalho-ic { width: 36px; height: 36px; display: grid; place-items: center; border-radius: var(--r-sm); background: var(--azul-claro); color: var(--azul-texto); }
.atalho-ic svg { width: 20px; height: 20px; }

/* ================= login ================= */
.login { min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; padding: var(--e-6); background: var(--login-luz), var(--fundo); }
.login .caixa { width: 100%; max-width: 400px; background: var(--papel-elev); border: 1px solid var(--linha); border-radius: var(--r-lg); box-shadow: var(--s-3), var(--realce); padding: var(--e-8); }
.login .marca { margin-bottom: var(--e-6); }
.login h1 { font: 800 var(--t-24) var(--f-titulo); }
.login p { color: var(--tinta-2); margin: var(--e-1) 0 var(--e-5); }
.login form { display: grid; gap: var(--e-3); }
.login .campo { position: relative; }
.login .campo input { padding-right: 48px; min-height: 44px; }
.login .btn { min-height: 44px; }
.ver-senha { position: absolute; right: 4px; bottom: 4px; }
.login .erro { min-height: 0; }
.login .erro:not(:empty) { display: flex; gap: var(--e-2); align-items: center; background: var(--verm-claro); color: var(--verm-texto); border-radius: var(--r-sm); padding: var(--e-2) var(--e-3); font-weight: 600; font-size: 13px; }
.login .erro svg { width: 16px; height: 16px; flex: none; }
.tremer { animation: tremer .32s; }
@keyframes tremer { 20%, 60% { transform: translateX(-4px); } 40%, 80% { transform: translateX(4px); } }

/* ================= ajustes ================= */
.lista-edit textarea { min-height: 120px; font: var(--t-13) var(--f-num); }
.opcoes { display: flex; flex-wrap: wrap; gap: var(--e-2); }
.opcao { display: inline-flex; align-items: center; gap: var(--e-2); border: 1px solid var(--linha-forte); border-radius: var(--r-sm); padding: 6px var(--e-3); cursor: pointer; font: 600 var(--t-13) var(--f-texto); background: var(--papel); }
.opcao input { accent-color: var(--azul); width: 16px; height: 16px; margin: 0; }
.opcao:has(input:checked) { border-color: var(--azul); background: var(--azul-claro); }

/* ================= toasts e diálogo ================= */
#toasts { position: fixed; right: var(--e-6); bottom: var(--e-6); display: grid; gap: var(--e-2); z-index: 300; width: 360px; max-width: calc(100vw - 32px); }
.toast { position: relative; overflow: hidden; display: grid; grid-template-columns: 20px minmax(0, 1fr) auto auto; gap: var(--e-2) var(--e-3); align-items: start;
  background: var(--inv-fundo); color: var(--inv-tinta); border: 1px solid var(--inv-linha); padding: var(--e-3) var(--e-3) var(--e-3) var(--e-4); border-radius: var(--r-md); box-shadow: var(--s-3);
  animation: toast var(--m-medio) var(--curva); }
.toast.saindo { opacity: 0; transform: translateY(4px); transition: opacity 160ms, transform 160ms; }
.toast-ic { width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; margin-top: 0; }
.toast-ic svg { width: 14px; height: 14px; }
.toast.t-ok .toast-ic { background: color-mix(in srgb, #3CC48F 22%, transparent); color: #3CC48F; }
.toast.t-erro .toast-ic { background: color-mix(in srgb, #FF5C68 22%, transparent); color: #FF7A84; }
.toast.t-aviso .toast-ic, .toast.t-info .toast-ic { background: color-mix(in srgb, #F5C451 22%, transparent); color: #F5C451; }
.toast-txt { display: grid; gap: 2px; min-width: 0; padding-top: 0; }
.toast-txt b { font: 600 var(--t-14) var(--f-texto); }
.toast-txt span { font: var(--t-13) var(--f-texto); opacity: .75; }
.toast-acao { border: 0; background: color-mix(in srgb, var(--inv-tinta) 12%, transparent); color: inherit; font: 600 var(--t-13) var(--f-texto); border-radius: var(--r-xs); padding: 2px var(--e-2); min-height: 28px; cursor: pointer; display: inline-flex; gap: 6px; align-items: center; white-space: nowrap; }
.toast-acao:hover { background: color-mix(in srgb, var(--inv-tinta) 20%, transparent); }
.toast-acao kbd { background: transparent; color: inherit; border-color: color-mix(in srgb, var(--inv-tinta) 35%, transparent); opacity: .8; }
.toast-x { border: 0; background: none; color: inherit; opacity: .6; width: 28px; height: 28px; border-radius: var(--r-xs); display: grid; place-items: center; cursor: pointer; }
.toast-x:hover { opacity: 1; background: color-mix(in srgb, var(--inv-tinta) 12%, transparent); }
.toast-x svg { width: 14px; height: 14px; }
.toast-tempo { position: absolute; left: 0; bottom: 0; height: 2px; width: 100%; background: color-mix(in srgb, var(--inv-tinta) 30%, transparent); transform-origin: left; animation: tempo linear forwards; }
@keyframes tempo { to { transform: scaleX(0); } }
@keyframes toast { from { transform: translateY(8px); opacity: 0; } }
table.t tr.saindo td { opacity: .35; transition: opacity var(--m-medio); }
dialog { border: 1px solid var(--linha); border-radius: var(--r-lg); background: var(--papel-elev); color: var(--tinta); padding: 0; width: min(420px, calc(100vw - 32px)); box-shadow: var(--s-3); }
dialog::backdrop { background: var(--backdrop); backdrop-filter: blur(3px); }
dialog[open] { animation: sobe var(--m-medio) var(--curva); }
@keyframes sobe { from { transform: translateY(-8px) scale(.98); opacity: 0; } }
dialog .dc { padding: var(--e-6) var(--e-6) var(--e-2); }
dialog .dc p { color: var(--tinta-2); margin-top: var(--e-2); }
dialog .da { display: flex; gap: var(--e-2); justify-content: flex-end; padding: var(--e-4) var(--e-6) var(--e-5); }
#app.carregando { min-height: 100vh; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ================= barra de período e títulos de bloco ================= */
.barra-per { display: flex; align-items: center; justify-content: space-between; gap: var(--e-3); flex-wrap: wrap; margin: var(--e-2) 0 0; }
.barra-per h2 { font: 700 var(--t-20) var(--f-titulo); }
.titulo-bloco { display: flex; align-items: baseline; justify-content: space-between; gap: var(--e-3); flex-wrap: wrap; margin: var(--e-3) 0; }

/* ================= meta ================= */
.meta-barra { position: relative; height: 12px; border-radius: var(--r-full); background: var(--papel-3); margin: var(--e-3) 0 var(--e-4); overflow: visible; }
.meta-barra i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: var(--r-full); }
.meta-barra .proj { background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--azul) 24%, transparent) 0 4px, transparent 4px 8px); }
.meta-barra .feito { background: var(--azul); box-shadow: var(--brilho-ativo); z-index: 1; transition: width .6s var(--curva); }
.meta-barra b { position: absolute; top: -4px; bottom: -4px; width: 2px; background: var(--tinta); border-radius: 2px; z-index: 2; }
.meta-dados { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-3) var(--e-4); margin: 0 0 var(--e-3); }
.meta-dados dt { font: 600 var(--t-12) var(--f-texto); color: var(--tinta-3); }
.meta-dados dd { margin: 2px 0 0; font-size: 16px; line-height: 24px; font-weight: 700; letter-spacing: -.03em; }
.meta-dados .bate { color: var(--tinta); }
.meta-dados .nao-bate { color: var(--laranja-texto); }

/* ================= radar ================= */
.radar .painel-cab h2 { display: flex; align-items: center; gap: var(--e-2); }
.radar-ponto { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.radar.rep .radar-ponto { background: var(--verde); box-shadow: 0 0 0 4px color-mix(in srgb, var(--verde) 18%, transparent); }
.radar.cor .radar-ponto { background: var(--verm); box-shadow: 0 0 0 4px color-mix(in srgb, var(--verm) 18%, transparent); }
.radar.ate .radar-ponto { background: var(--amarelo); box-shadow: 0 0 0 4px color-mix(in srgb, var(--amarelo) 20%, transparent); }
.radar-lista { list-style: none; margin: 0; padding: 0; }
.radar-lista li + li { border-top: 1px solid var(--linha); }
.radar-lista li > * { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px var(--e-2); padding: var(--e-2) 0; color: inherit; text-decoration: none; }
.radar-lista a:hover b { color: var(--azul-texto); }
.radar-lista b { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.radar-lista .motivo { grid-column: 1 / -1; font: var(--t-13) var(--f-texto); color: var(--tinta-2); }
details.como { margin-top: var(--e-2); font: var(--t-13) var(--f-texto); color: var(--tinta-3); }
details.como summary { cursor: pointer; font-weight: 600; width: max-content; }
details.como p { margin-top: 6px; }
.como-passos { margin: 6px 0 0; padding-left: 20px; display: grid; gap: 4px; }
.como-passos code, details.como p code { font: var(--t-12) var(--f-num, monospace); background: var(--papel-3); padding: 1px 4px; border-radius: 4px; overflow-wrap: anywhere; }

/* ================= lançar rápido ================= */
dialog.cmd, dialog.calc-dlg { width: min(720px, calc(100vw - 24px)); margin-top: 12vh; overflow: visible; }
dialog.calc-dlg { width: min(520px, calc(100vw - 24px)); }
.cmd-campo { display: flex; align-items: center; gap: var(--e-3); padding: var(--e-4) var(--e-5); border-bottom: 1px solid var(--linha); }
.cmd-campo svg { width: 20px; height: 20px; color: var(--tinta-3); flex: none; }
.cmd-campo input { flex: 1; min-width: 0; border: 0; background: transparent; font: 500 var(--t-16) var(--f-texto); outline: none; }
#cmd-previa { padding: var(--e-3) var(--e-5) var(--e-5); max-height: 60vh; overflow: auto; }
.cmd-ex p:first-child { font: 600 var(--t-12) var(--f-texto); color: var(--tinta-3); margin-bottom: 6px; }
.cmd-ex button { display: flex; gap: var(--e-2); align-items: center; width: 100%; text-align: left; border: 1px solid transparent; background: transparent; padding: var(--e-2); border-radius: var(--r-sm); cursor: pointer; }
.cmd-ex button:hover, .cmd-ex button:focus-visible { background: var(--papel-2); border-color: var(--linha); }
.cmd-ex code { font: var(--t-13) var(--f-num); color: var(--tinta-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.cmd-tipo { display: flex; justify-content: space-between; align-items: center; gap: var(--e-2); margin-bottom: var(--e-3); }
.cmd-grade { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e-2); }
.cmd-ch { border: 1px solid var(--linha); border-radius: var(--r-sm); padding: var(--e-2) var(--e-3); min-width: 0; background: var(--papel-2); }
.cmd-ch > span { display: block; font: 600 var(--t-11) var(--f-texto); color: var(--tinta-3); }
.cmd-ch b { display: block; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmd-ch.num b { font-family: var(--f-num); }
.cmd-ch.largo { grid-column: span 2; }
.cmd-ch.destaque { background: var(--azul-claro); border-color: color-mix(in srgb, var(--azul) 30%, transparent); }
.cmd-res.tt .cmd-ch.destaque { background: var(--laranja-claro); border-color: color-mix(in srgb, var(--laranja) 35%, transparent); }
.cmd-ch.falta { border-color: var(--verm); border-style: dashed; background: var(--verm-claro); }
.cmd-ch.falta b { color: var(--verm-texto); }
.cmd-ch .pos { color: var(--verde-texto); }
.cmd-aviso { margin-top: var(--e-2); font: var(--t-13) var(--f-texto); color: var(--amarelo-texto); }

/* ================= calculadora ================= */
.calc-in { padding: 0; }
.calc-cab { display: flex; justify-content: space-between; gap: var(--e-3); padding: var(--e-5) var(--e-5) 0; }
.calc-cab h2 { font: 700 var(--t-20) var(--f-titulo); }
.calc-campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-3); padding: var(--e-4) var(--e-5) 0; }
.calc-origem { padding: var(--e-2) var(--e-5) 0; }
.calc-res { padding: var(--e-4) var(--e-5) var(--e-5); }
.calc-preco { background: var(--acao); color: #fff; border-radius: var(--r-md); padding: var(--e-4) var(--e-5); }
.calc-preco span { font-weight: 600; opacity: .9; font-size: 14px; }
.calc-preco > .num { font: 700 var(--t-48) var(--f-num); letter-spacing: -.04em; margin: var(--e-1) 0 6px; }
.calc-preco p { font: var(--t-14) var(--f-texto); opacity: .92; }
.calc-preco p .num { font-size: inherit; font-weight: 700; }
.calc-tab { list-style: none; margin: var(--e-3) 0 0; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: var(--e-2); }
.calc-tab li { border: 1px solid var(--linha); border-radius: var(--r-sm); padding: var(--e-2) var(--e-3); }
.calc-tab span { display: block; font: 600 var(--t-12) var(--f-texto); color: var(--tinta-3); }

/* ================= CONTEÚDO ================= */
.nav-cont { font: 700 11px/1 var(--f-num); background: var(--laranja-claro); color: var(--laranja-texto); border-radius: var(--r-full); padding: 3px 6px; margin-left: 2px; }
.avatar { position: relative; display: inline-grid; place-items: center; border-radius: 50%; overflow: hidden; flex: none; background: var(--laranja-claro); color: var(--laranja-texto); font: 800 12px/1 var(--f-titulo); vertical-align: middle; }
.avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.chip .avatar { margin: -2px 2px -2px -4px; }

/* quadro */
.quadro { display: flex; align-items: flex-start; gap: var(--e-3); padding: var(--e-4) var(--e-6) var(--e-5); overflow-x: auto; scroll-snap-type: x proximity; }
.coluna { background: var(--papel-2); border: 1px solid var(--linha); border-radius: var(--r-md); min-width: 240px; flex: 1 1 0; scroll-snap-align: start; display: flex; flex-direction: column; max-height: 720px; }
.coluna.vazia, .coluna.c-roteiro:not(.aberta) { flex: 0 0 136px; min-width: 136px; }
.coluna.vazia .col-dica, .coluna.c-roteiro:not(.aberta) .col-dica { padding-left: 0; }
.coluna.c-roteiro.aberta { flex: 0 0 240px; }
.col-cab { padding: var(--e-3) var(--e-3) var(--e-2); }
.col-cab > div, .col-tog { display: flex; align-items: center; gap: var(--e-2); }
.col-tog { border: 0; background: none; padding: 0; cursor: pointer; width: 100%; text-align: left; }
.col-cab b { font: 600 var(--t-14) var(--f-texto); flex: 1; }
.col-dica { display: block; font: var(--t-12) var(--f-texto); color: var(--tinta-3); margin-top: 2px; padding-left: var(--e-4); }
.col-ponto { width: 8px; height: 8px; border-radius: 50%; background: var(--tinta-3); flex: none; }
.c-gerado .col-ponto { background: var(--roxo); }
.c-aguardando .col-ponto { background: var(--amarelo); box-shadow: 0 0 0 4px color-mix(in srgb, var(--amarelo) 20%, transparent); }
.c-aprovado .col-ponto { background: var(--verde); }
.c-postado .col-ponto { background: var(--laranja); }
.c-reprovado .col-ponto { background: var(--verm); }
.c-aguardando { background: color-mix(in srgb, var(--amarelo) 6%, var(--papel-2)); border-color: color-mix(in srgb, var(--amarelo) 30%, var(--linha)); }
.col-corpo { padding: 0 var(--e-2) var(--e-2); overflow-y: auto; display: grid; gap: var(--e-2); align-content: start; }
.col-vazia { font: var(--t-13) var(--f-texto); color: var(--tinta-3); padding: 6px 6px var(--e-2); }
.coluna.c-roteiro:not(.aberta) .col-corpo { display: none; }
.coluna.c-roteiro:not(.aberta) .col-dica::after { content: " · toque para ver"; }
.kcard { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: var(--e-3); background: var(--papel); border: 1px solid var(--linha); border-radius: var(--r-sm); padding: var(--e-2); color: inherit; text-decoration: none; transition: border-color var(--m-rapido), box-shadow var(--m-rapido); }
.kcard:hover { border-color: var(--linha-forte); box-shadow: var(--s-2); }
.kcard:focus-visible { outline: 2px solid var(--laranja); }
.kcard.compacto { grid-template-columns: minmax(0, 1fr); gap: 2px; padding: var(--e-2) var(--e-3); }
.kc-thumb { position: relative; width: 48px; aspect-ratio: 9 / 16; border-radius: var(--r-xs); overflow: hidden; background: var(--linha); display: grid; place-items: center; }
.kc-thumb img { width: 100%; height: 100%; object-fit: cover; }
.kc-thumb i svg { width: 20px; height: 20px; color: var(--tinta-3); }
.kc-thumb em { position: absolute; right: 2px; bottom: 2px; font-style: normal; font-size: 10px; background: rgba(10, 14, 35, .75); color: #fff; padding: 0 4px; border-radius: 4px; }
.kc-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kc-top { display: flex; align-items: center; gap: 6px; font: 600 var(--t-12) var(--f-texto); color: var(--tinta-2); min-width: 0; }
.kc-top b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; color: var(--tinta); }
.kc-prod { font: 600 13px/18px var(--f-texto); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kc-gancho { font: var(--t-12) var(--f-texto); color: var(--tinta-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kc-motivo { font: var(--t-12) var(--f-texto); color: var(--verm-texto); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.selo { display: inline-flex; align-items: center; gap: var(--e-1); font: 600 11px/16px var(--f-texto); border-radius: var(--r-full); padding: 1px var(--e-2) 1px 6px; width: max-content; }
.selo svg { width: 12px; height: 12px; }
.selo.falando { background: var(--laranja-claro); color: var(--laranja-texto); }
.selo.parada { background: var(--papel-2); color: var(--tinta-2); border: 1px solid var(--linha); }
.quadro-abas { display: none; }

/* fila do dia */
.fila { gap: var(--e-5); }
.fila-cab { display: flex; gap: var(--e-2); align-items: center; margin-bottom: var(--e-2); }
.fila-cab b { font: 600 var(--t-15) var(--f-texto); display: block; }
.fila-cab span { font: var(--t-13) var(--f-texto); color: var(--tinta-3); }
.fila-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--e-2); }
.fila-lista li { display: grid; grid-template-columns: auto 30px minmax(0, 1fr) auto; gap: var(--e-2); align-items: center; border: 1px solid var(--linha); border-radius: var(--r-md); padding: var(--e-2); background: var(--papel); }
.fila-lista li.feito { background: var(--papel-2); }
.fila-lista li.feito .fila-nome b { color: var(--tinta-2); }
.fila-lista li.com-erro { border-color: color-mix(in srgb, var(--verm) 45%, transparent); background: var(--verm-claro); }
.fila-lista li.fila-vazio { grid-template-columns: auto minmax(0, 1fr); border-style: dashed; color: var(--tinta-3); font-size: 13px; background: transparent; }
.fila-lista .nn { min-width: 44px; height: 28px; padding: 0 6px; border-radius: var(--r-xs); display: grid; place-items: center; font: 700 12px var(--f-num); background: var(--papel-2); border: 1px solid var(--linha); color: var(--tinta-2); }
.fila-lista li.feito .nn { background: var(--verde); border-color: var(--verde); color: #fff; }
.fila-lista .nn svg { width: 14px; height: 14px; }
.fila-thumb { width: 30px; aspect-ratio: 9 / 16; border-radius: var(--r-xs); overflow: hidden; background: var(--linha); display: block; }
.fila-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fila-nome { display: flex; flex-direction: column; min-width: 0; color: inherit; text-decoration: none; }
.fila-nome b { font: 600 var(--t-14) var(--f-texto); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fila-nome span { font: var(--t-12) var(--f-texto); color: var(--tinta-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fila-acoes { display: flex; align-items: center; gap: 2px; }

/* sugestões */
.sug-lista { list-style: none; margin: 0; padding: 0; }
.sug-lista li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--e-2) var(--e-4); align-items: center; padding: var(--e-3) 0; border-top: 1px solid var(--linha); }
.sug-lista li:first-child { border-top: 0; }
.sug-info { display: flex; gap: var(--e-2); align-items: flex-start; min-width: 0; }
.sug-info b { display: block; }
.sug-motivo { display: block; font: var(--t-13) var(--f-texto); color: var(--tinta-2); }
.sug-nums { display: flex; flex-wrap: wrap; gap: var(--e-1) var(--e-3); margin-top: var(--e-1); font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.sug-nums em { font-style: normal; }
.sug-nums b { display: inline; color: var(--tinta); font-size: 12px; }
.sug-acoes { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.sug-com { min-height: 32px; padding: var(--e-1) var(--e-2); width: 200px; font-size: 13px; }

/* card aberto */
dialog.card-dlg { width: min(940px, calc(100vw - 24px)); max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow: hidden; }
.cd { display: grid; grid-template-columns: minmax(0, 400px) minmax(0, 1fr); max-height: calc(100vh - 34px); max-height: calc(100dvh - 34px); }
.cd-video { background: #05070F; display: grid; place-items: center; min-height: 0; }
.cd-video video { width: 100%; max-height: calc(100vh - 34px); max-height: calc(100dvh - 34px); aspect-ratio: 9 / 16; object-fit: contain; background: #000; display: block; }
.cd-semvideo { color: #B3B9D1; display: grid; gap: var(--e-2); justify-items: center; text-align: center; padding: var(--e-10) var(--e-6); }
.cd-semvideo svg { width: 32px; height: 32px; }
.cd-semvideo code { font: var(--t-12) var(--f-num); background: rgba(255, 255, 255, .06); padding: var(--e-2); border-radius: var(--r-sm); word-break: break-all; }
.cd-lado { padding: var(--e-5); overflow-y: auto; max-height: calc(100vh - 34px); max-height: calc(100dvh - 34px); display: flex; flex-direction: column; gap: var(--e-3); }
.cd-cab { display: flex; gap: var(--e-3); align-items: center; position: sticky; top: 0; z-index: 3; background: var(--papel); margin: calc(-1 * var(--e-5)) calc(-1 * var(--e-5)) 0; padding: var(--e-4) var(--e-5) var(--e-3); border-bottom: 1px solid var(--linha); }
.cd-cab-nota .selo-nota { font-size: 16px; padding: 4px 10px; }
.cd-cab > div { flex: 1; min-width: 0; }
.cd-cab b { font: 700 var(--t-16) var(--f-titulo); display: block; }
.cd-cab span { color: var(--tinta-2); font-size: 14px; }
.cd-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.tag.etapa-aguardando, .tag.etapa-gerado { background: var(--amarelo-claro); color: var(--amarelo-texto); }
.tag.etapa-aprovado { background: color-mix(in srgb, var(--verde) 12%, var(--papel)); color: var(--verde-texto); }
.tag.etapa-postado { background: var(--laranja-claro); color: var(--laranja-texto); }
.tag.etapa-reprovado { background: var(--verm-claro); color: var(--verm-texto); }
.cd-gancho { margin: 0; font: 600 var(--t-16) var(--f-titulo); border-left: 3px solid var(--laranja); padding: 2px 0 2px var(--e-3); }
.cd-legenda { border: 1px solid var(--linha); border-radius: var(--r-md); padding: var(--e-3) var(--e-4); background: var(--papel-2); }
.cd-leg-cab { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.cd-leg-cab span { font: 600 var(--t-12) var(--f-texto); color: var(--tinta-3); }
.cd-legenda p { white-space: pre-line; font-size: 14px; }
.hashtags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: var(--e-2); }
.hashtags span { font: 600 var(--t-12) var(--f-texto); color: var(--azul-texto); background: var(--azul-claro); padding: 2px var(--e-2); border-radius: var(--r-full); }
.cd-baixar { width: 100%; }
.decidir textarea, .postar input { width: 100%; border: 1px solid var(--linha-forte); border-radius: var(--r-sm); padding: var(--e-2) var(--e-3); background: var(--campo-fundo); }
.decidir textarea:focus { outline: none; border-color: var(--laranja); }
.decidir-bts { display: grid; grid-template-columns: 1fr 1fr; gap: var(--e-2); margin-top: var(--e-2); }
.postar { display: grid; gap: var(--e-2); border-top: 1px solid var(--linha); padding-top: var(--e-3); }
.motivo-box { border: 1px solid color-mix(in srgb, var(--verm) 35%, transparent); background: var(--verm-claro); border-radius: var(--r-md); padding: var(--e-3) var(--e-4); }
.motivo-box span { font: 600 var(--t-12) var(--f-texto); color: var(--verm-texto); }
.postado-box { display: flex; align-items: center; gap: var(--e-3); flex-wrap: wrap; color: var(--tinta-2); font-size: 14px; }
.metr-video { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--linha); border-radius: var(--r-md); }
.metr-video > div { padding: var(--e-2) var(--e-3); }
.metr-video > div + div { border-left: 1px solid var(--linha); }
.metr-video span { display: block; font: 600 var(--t-11) var(--f-texto); color: var(--tinta-3); }
.metr-video b { font-size: 15px; }
.hist { list-style: none; margin: var(--e-2) 0 0; padding: 0; display: grid; gap: 6px; }
.hist li { font-size: 13px; }
.hist-nota { display: block; color: var(--tinta-2); word-break: break-word; }

/* conteúdo no início */
.cont-nums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cont-nums a { padding: var(--e-3) var(--e-6) var(--e-4); color: inherit; text-decoration: none; display: flex; flex-direction: column; gap: 2px; }
.cont-nums a + a { border-left: 1px solid var(--linha); }
.cont-nums a:hover .v { color: var(--laranja-texto); }
.cont-nums .v { font-size: 24px; line-height: 32px; font-weight: 700; letter-spacing: -.04em; }
.cont-nums .v.destaque { color: var(--laranja-texto); }
.cont-nums span:last-child { font: var(--t-13) var(--f-texto); color: var(--tinta-3); }

/* agenda / agendar */
.sem-nav { display: flex; align-items: center; gap: var(--e-1); }
.sem-nav span { font-size: 13px; color: var(--tinta-2); min-width: 112px; text-align: center; }
.agenda .painel-cab p { max-width: 70ch; margin-top: 2px; }
.agenda-grade { display: grid; gap: 6px; padding: var(--e-3) var(--e-6) var(--e-5); min-width: 920px; }
.ag-dia { text-align: center; padding: var(--e-1) 0 6px; border-bottom: 2px solid var(--linha); }
.ag-dia b { display: block; font-size: 12px; text-transform: capitalize; color: var(--tinta-2); }
.ag-dia span { font-size: 12px; color: var(--tinta-3); }
.ag-dia.hoje { border-bottom-color: var(--laranja); }
.ag-dia.hoje b { color: var(--laranja-texto); }
.ag-perfil { display: flex; align-items: center; gap: var(--e-2); font-size: 14px; }
.ag-cel { min-height: 72px; border: 1px solid var(--linha); border-radius: var(--r-sm); padding: var(--e-1); display: flex; flex-direction: column; gap: var(--e-1); background: var(--papel-2); }
.ag-cel.hoje { background: color-mix(in srgb, var(--laranja) 6%, var(--papel)); border-color: color-mix(in srgb, var(--laranja) 30%, var(--linha)); }
.ag-cel.quebra { border-color: var(--verm); border-style: dashed; }
.ag-item { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 6px; align-items: baseline; text-align: left; border: 1px solid var(--linha); border-left: 3px solid var(--azul); background: var(--papel); border-radius: var(--r-xs); padding: var(--e-1) 6px; font-size: 12px; cursor: pointer; }
.ag-item:hover { border-color: var(--linha-forte); }
.ag-item .num { font-weight: 700; font-size: 11px; }
.ag-prod { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--tinta-2); }
.ag-item em { grid-column: 1 / -1; font-style: normal; font-size: 11px; font-weight: 700; }
.ag-item.st-postado { border-left-color: var(--verde); }
.ag-item.st-postado em { color: var(--verde-texto); }
.ag-item.st-postando { border-left-color: var(--amarelo); }
.ag-item.st-postando em { color: var(--amarelo-texto); }
.ag-item.st-erro { border-left-color: var(--verm); background: var(--verm-claro); }
.ag-item.st-erro em { color: var(--verm-texto); }
.ag-aviso { font-size: 11px; font-weight: 700; color: var(--verm-texto); }
.agendar { display: grid; gap: var(--e-2); border: 1px solid color-mix(in srgb, var(--verde) 35%, var(--linha)); background: color-mix(in srgb, var(--verde) 5%, var(--papel)); border-radius: var(--r-md); padding: var(--e-3) var(--e-4); }
.agendar h3 { font: 600 var(--t-15) var(--f-texto); }
.ag-linha { display: grid; grid-template-columns: 1fr 1fr; gap: var(--e-2); }
.ag-sug { gap: 6px; }
.agendar .btn { width: 100%; }
.avisos-regra { display: flex; gap: var(--e-2); background: var(--amarelo-claro); color: var(--amarelo-texto); border-radius: var(--r-sm); padding: var(--e-2) var(--e-3); font-size: 13px; }
.avisos-regra svg { width: 16px; height: 16px; flex: none; margin-top: 2px; }
.avisos-regra p + p { margin-top: var(--e-1); }
.agenda-box { border-radius: var(--r-md); padding: var(--e-3) var(--e-4); background: var(--azul-claro); display: grid; gap: 2px; }
.agenda-box b { font-size: 15px; }
.agenda-box span { font-size: 13px; color: var(--tinta-2); }
.agenda-box.st-erro { background: var(--verm-claro); }
.agenda-box.st-erro b { color: var(--verm-texto); }
.agenda-box.st-postando { background: var(--amarelo-claro); }
.agenda-box.st- { background: var(--verm-claro); }
.agenda-lista { display: none; }

/* ================= responsivo ================= */
@media (max-width: 1100px) {
  .linha-lanc, .linha-lanc.tt { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .linha-lanc .w3 { grid-column: span 2; }
  .linha-lanc .acao { grid-column: span 4; }
  .metricas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .metricas > div:nth-child(4) { border-left: 0; }
  .metricas > div:nth-child(n+4) { border-top: 1px solid var(--linha); }
  .g-7-5 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  body { font-size: 15px; }
  h1 { font-size: 24px; line-height: 32px; }
  .topo-in { padding: 0 var(--e-4); height: 52px; }
  .topo .nav { display: none; }
  .nav-baixo {
    display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 30;
    background: var(--papel); border-top: 1px solid var(--linha); padding: var(--e-1) var(--e-1) calc(var(--e-1) + env(safe-area-inset-bottom));
  }
  .nav-baixo a { display: flex; flex-direction: column; align-items: center; gap: 2px; text-decoration: none; color: var(--tinta-3); font: 600 11px/16px var(--f-texto); padding: 6px 0; border-radius: var(--r-sm); min-height: 48px; }
  .nav-baixo a svg { width: 22px; height: 22px; }
  .nav-baixo a.on { color: var(--azul-texto); }
  .nav-baixo a.on.tt { color: var(--laranja-texto); }
  main { padding: var(--e-4) var(--e-4) 96px; }
  #toasts { top: calc(var(--e-3) + env(safe-area-inset-top)); bottom: auto; right: var(--e-4); left: var(--e-4); width: auto; }
  .cab-pagina { margin-bottom: var(--e-4); }
  .abas { width: 100%; }
  .abas a { flex: 1; text-align: center; }
  .periodo { flex-wrap: nowrap; overflow-x: auto; max-width: 100%; scrollbar-width: none; }
  .periodo::-webkit-scrollbar { display: none; }
  .g2, .g3 { grid-template-columns: minmax(0, 1fr); }
  .heroi { padding: var(--e-5) var(--e-4) var(--e-4); }
  .faixa { grid-template-columns: minmax(0, 1fr); }
  .faixa > div { padding: var(--e-3) var(--e-4); display: grid; grid-template-columns: auto 1fr; gap: 0 var(--e-3); align-items: baseline; }
  .faixa > div + div { border-left: 0; border-top: 1px solid var(--linha); }
  .faixa .v { grid-column: 2; text-align: right; margin: 0; font-size: 20px; }
  .faixa .d { grid-column: 1 / -1; margin-top: 2px; }
  .metricas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metricas > div { padding: var(--e-3) var(--e-4); }
  .metricas > div:nth-child(n) { border-left: 0; border-top: 1px solid var(--linha); }
  .metricas > div:nth-child(even) { border-left: 1px solid var(--linha); }
  .metricas > div:nth-child(-n+2) { border-top: 0; }
  .metricas .grande { grid-column: 1 / -1; border-left: 0 !important; }
  .metricas .grande + div { border-top: 1px solid var(--linha) !important; border-left: 0 !important; }
  .metricas .grande ~ div:nth-child(odd) { border-left: 1px solid var(--linha); }
  .metricas .grande ~ div:nth-child(even) { border-left: 0; }
  .grafico { height: 220px; }
  .painel-cab { padding: var(--e-4) var(--e-4) 0; }
  .painel-corpo { padding: var(--e-3) var(--e-4) var(--e-4); }
  .btn { min-height: 44px; }
  .btn.peq { min-height: 36px; }
  .icone-btn { width: 44px; height: 44px; }
  .campo input, .campo select, .campo textarea, .entrada { min-height: 44px; font-size: 16px; }
  .linha-lanc, .linha-lanc.tt { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .linha-lanc .w2, .linha-lanc .w3, .linha-lanc .acao { grid-column: 1 / -1; }
  .linha-lanc .acao .btn { min-height: 48px; }
  .filtros, .filtros.tt { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: var(--e-3) var(--e-4); }
  .filtros .w2 { grid-column: 1 / -1; }
  .boas-vindas { grid-template-columns: minmax(0, 1fr); }
  .boas-vindas .lado { padding: var(--e-5) var(--e-4); }
  .boas-vindas .lado + .lado { border-left: 0; border-top: 1px solid var(--linha); }
  .legenda-div .v { font-size: 16px; }
  details.colar > summary { padding: var(--e-3) var(--e-4); }
  .colar-corpo { padding: 0 var(--e-4) var(--e-4); }
  .esconde-cel { display: none !important; }
  .cmd-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  dialog.cmd, dialog.calc-dlg { margin-top: var(--e-3); }
  .barra-per h2 { display: none; }
  table.contas td:first-child { padding-left: var(--e-4); }
  .quadro-abas { display: flex; gap: 6px; overflow-x: auto; padding: var(--e-3) var(--e-4) 0; scrollbar-width: none; }
  .quadro-abas::-webkit-scrollbar { display: none; }
  .quadro-abas .chip b { margin-left: var(--e-1); font-weight: 700; }
  .quadro { display: block; padding: var(--e-3) var(--e-4) var(--e-4); }
  .quadro .coluna { display: none; max-height: none; min-width: 0; }
  .quadro .coluna.ativa { display: flex; background: transparent; border: 0; }
  .quadro .coluna.c-roteiro.ativa .col-corpo { display: grid; }
  .quadro .coluna.ativa .col-cab { display: none; }
  .quadro .col-corpo { padding: 0; }
  .fila-lista li { grid-template-columns: auto 30px minmax(0, 1fr) auto; padding: var(--e-2); }
  .sug-lista li { grid-template-columns: minmax(0, 1fr); }
  .sug-acoes { justify-content: flex-start; }
  .sug-com { width: 100%; }
  dialog.card-dlg { width: 100vw; max-width: 100vw; height: 100vh; height: 100dvh; max-height: 100vh; max-height: 100dvh; margin: 0; border-radius: 0; border: 0; }
  .cd { display: block; max-height: 100vh; max-height: 100dvh; height: 100vh; height: 100dvh; overflow-y: auto; }
  .cd-video { height: 48vh; height: 48dvh; display: block; }
  .cd-video video { height: 100%; width: 100%; max-height: none; aspect-ratio: auto; object-fit: contain; }
  .cd-lado { overflow: visible; max-height: none; }
  .cont-nums a { padding: var(--e-3) var(--e-4); }
  .cont-nums .v { font-size: 20px; }
  .metr-video { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metr-video > div:nth-child(3) { border-left: 0; border-top: 1px solid var(--linha); }
  .metr-video > div:nth-child(4) { border-top: 1px solid var(--linha); }
  .agenda-grade { padding: var(--e-3) var(--e-4) var(--e-4); }
  .sem-nav { width: 100%; justify-content: space-between; }
  .agenda .rolagem { display: none; }
  .agenda-lista { display: grid; gap: var(--e-3); padding: var(--e-3) var(--e-4) var(--e-4); }
  .al-dia > b { display: block; font-size: 13px; text-transform: capitalize; color: var(--tinta-2); margin-bottom: 6px; }
  .al-dia.hoje > b { color: var(--laranja-texto); }
  .al-item { display: grid; grid-template-columns: 44px 22px minmax(0, 1fr) auto; gap: var(--e-2); align-items: center; width: 100%; text-align: left; border: 1px solid var(--linha); border-left: 3px solid var(--azul); background: var(--papel); border-radius: var(--r-sm); padding: var(--e-2) var(--e-3); margin-top: 6px; font-size: 13px; min-height: 44px; }
  .al-item.st-postado { border-left-color: var(--verde); }
  .al-item.st-erro { border-left-color: var(--verm); background: var(--verm-claro); }
  .al-item.st-postando { border-left-color: var(--amarelo); }
  .al-item .num { font-weight: 700; }
}

/* ================= carregando, erro, transição (L3) ================= */
#carga { position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 200; pointer-events: none; opacity: 0; transition: opacity var(--m-medio); }
#carga::after { content: ""; position: absolute; inset: 0; transform-origin: left; transform: scaleX(0); background: var(--azul); box-shadow: var(--brilho-ativo); }
body:has(.secao-tt) #carga::after { background: var(--laranja); }
#carga.ativa { opacity: 1; }
#carga.ativa::after { animation: carga 1.6s var(--curva) forwards; }
#carga.fim::after { animation: none; transform: scaleX(1); transition: transform var(--m-medio); }
@keyframes carga { from { transform: scaleX(0); } to { transform: scaleX(.85); } }
.sk { display: block; border-radius: var(--r-xs); background: linear-gradient(90deg, var(--papel-3) 0, var(--brilho) 50%, var(--papel-3) 100%); background-size: 200% 100%; animation: brilho 1.2s linear infinite; }
@keyframes brilho { from { background-position: 100% 0; } to { background-position: -100% 0; } }
.sk-h1 { width: 260px; height: 32px; }
.sk-linha { height: 12px; width: 100%; }
.sk-per { width: 420px; height: 32px; border-radius: var(--r-sm); display: inline-block; }
.sk-abas { width: 280px; height: 36px; }
.sk-heroi { width: 280px; height: 64px; margin: 16px 0 20px; }
.sk-barra { height: 8px; border-radius: var(--r-full); margin-top: 12px; }
.sk-valor { width: 55%; height: 28px; margin: 10px 0 8px; }
.sk-grafico { height: 260px; margin-top: 16px; border-radius: var(--r-sm); }
.sk-campo { height: 40px; }
.sk-card { height: 72px; margin-top: 8px; border-radius: var(--r-sm); }
.sk-painel { overflow: hidden; }
.sk-kpis { display: grid; }
.sk-kpis > div { padding: 16px 20px; }
.sk-kpis > div + div { border-left: 1px solid var(--linha); }
.sk-tr { display: flex; gap: 16px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--linha); }
.sk-tr .sk-linha { flex: none; }
.sk-form { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
.sk-colunas { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; padding: 20px 24px; }
.erro-tela { text-align: center; padding: var(--e-12) var(--e-6); max-width: 640px; margin: var(--e-8) auto 0; }
.erro-icone { width: 48px; height: 48px; margin: 0 auto var(--e-4); border-radius: var(--r-md); display: grid; place-items: center; background: var(--verm-claro); color: var(--verm-texto); }
.erro-icone svg { width: 24px; height: 24px; }
.erro-tela h2 { font: 700 var(--t-20) var(--f-titulo); }
.erro-tela p { color: var(--tinta-2); margin-top: var(--e-2); }
.erro-tela .erro-tec { font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.erro-tela code { font: var(--t-12) var(--f-num); background: var(--papel-3); padding: 1px 6px; border-radius: var(--r-xs); }
.erro-tela .acoes { display: flex; gap: var(--e-2); justify-content: center; flex-wrap: wrap; margin-top: var(--e-5); }
main.entrando { animation: entra 160ms var(--curva); }
@keyframes entra { from { opacity: 0; transform: translateY(4px); } }
@media (max-width: 760px) {
  .sk-per { width: 100%; }
  .sk-form, .sk-colunas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sk-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* ================= paleta de comandos e atalhos (L5) ================= */
dialog.cmd { width: min(640px, calc(100vw - 24px)); margin-top: 12vh; overflow: hidden; }
.cmd-campo { padding: var(--e-3) var(--e-4); }
.cmd-campo input { font: 500 var(--t-16) var(--f-texto); }
.cmd-lista { max-height: min(56vh, 520px); overflow-y: auto; padding: var(--e-2); scroll-padding: var(--e-2); }
.cmd-grupo + .cmd-grupo { margin-top: var(--e-2); }
.cmd-grupo > p { font: 600 var(--t-11) var(--f-texto); color: var(--tinta-3); padding: var(--e-1) var(--e-2); }
.cmd-item { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: var(--e-3); align-items: center; padding: var(--e-2); border-radius: var(--r-sm); cursor: pointer; min-height: 44px; }
.cmd-item.on { background: var(--papel-3); }
.cmd-item.on .cmd-ic { color: var(--ativo-ic); background: var(--papel-elev); box-shadow: var(--s-1), inset 0 0 0 1px var(--linha); }
.cmd-ic { width: 28px; height: 28px; border-radius: var(--r-xs); display: grid; place-items: center; color: var(--tinta-3); background: var(--papel-2); }
.cmd-ic svg { width: 16px; height: 16px; }
.cmd-rot { display: flex; flex-direction: column; min-width: 0; }
.cmd-rot b { font: 500 var(--t-14) var(--f-texto); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmd-rot small { font: var(--t-12) var(--f-texto); color: var(--tinta-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmd-atalho { display: flex; gap: 2px; }
.cmd-item-lanc { display: block; padding: var(--e-3); border: 1px solid var(--linha); }
.cmd-item-lanc.on { background: var(--papel-2); border-color: var(--azul); box-shadow: var(--anel-foco); }
.cmd-dica-lanc { padding: var(--e-2) var(--e-3); font: var(--t-13) var(--f-texto); color: var(--tinta-2); }
.cmd-dica-lanc code { font: var(--t-12) var(--f-num); background: var(--papel-3); padding: 1px 4px; border-radius: 4px; }
.cmd-vazio { padding: var(--e-8) var(--e-4); text-align: center; color: var(--tinta-2); display: grid; gap: var(--e-1); }
.cmd-vazio span { font: var(--t-13) var(--f-texto); color: var(--tinta-3); }
.cmd-rodape { display: flex; gap: var(--e-4); align-items: center; padding: var(--e-2) var(--e-4); border-top: 1px solid var(--linha); background: color-mix(in srgb, var(--papel-2) 70%, var(--papel-elev)); font: var(--t-12) var(--f-texto); color: var(--tinta-3); flex-wrap: wrap; }
.cmd-rodape span { display: inline-flex; gap: 4px; align-items: center; }
.cmd-rod-dir { margin-left: auto; }
dialog.ajuda { width: min(820px, calc(100vw - 24px)); max-height: calc(100vh - 48px); max-height: calc(100dvh - 48px); overflow: auto; }
.ajuda-cab { display: flex; justify-content: space-between; gap: var(--e-3); padding: var(--e-5) var(--e-6) var(--e-3); border-bottom: 1px solid var(--linha); position: sticky; top: 0; background: var(--papel-elev); }
.ajuda-cab h2 { font: 700 var(--t-20) var(--f-titulo); }
.ajuda-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--e-5) var(--e-6); padding: var(--e-5) var(--e-6) var(--e-6); }
.ajuda-grade h3 { font: 600 var(--t-12) var(--f-texto); color: var(--tinta-3); margin-bottom: var(--e-2); }
.ajuda-grade dl { margin: 0; display: grid; gap: 2px; }
.ajuda-grade dl > div { display: flex; justify-content: space-between; align-items: center; gap: var(--e-3); padding: 6px 0; border-bottom: 1px solid var(--linha); }
.ajuda-grade dt { font: var(--t-13) var(--f-texto); color: var(--tinta-2); }
.ajuda-grade dd { margin: 0; display: flex; gap: 4px; align-items: center; flex: none; font-size: 12px; }
@media (max-width: 760px) {
  .cmd-rodape { display: none; }
  dialog.cmd { margin-top: var(--e-3); }
}

/* ================= KPIs com delta e minigráfico (L6) ================= */
.kpis { display: grid; }
.kpis.k4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kpis.k5 { grid-template-columns: 1.25fr repeat(4, minmax(0, 1fr)); }
.kpi { display: flex; flex-direction: column; gap: var(--e-1); padding: var(--e-4) var(--e-5); min-width: 0; color: inherit; text-decoration: none; position: relative; }
.kpis > .kpi + .kpi { border-left: 1px solid var(--linha); }
a.kpi { transition: background var(--m-rapido); }
a.kpi:hover { background: var(--papel-2); }
.kpis > .kpi:first-child { border-radius: var(--r-md) 0 0 var(--r-md); }
.kpis > .kpi:last-child { border-radius: 0 var(--r-md) var(--r-md) 0; }
.kpi-rot { font: 600 var(--t-12) var(--f-texto); color: var(--tinta-2); }
.kpi-topo { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--e-2); min-height: 24px; }
.kpi-v { font: 700 var(--t-24) var(--f-num); letter-spacing: -.04em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kpi.destaque .kpi-v { color: var(--azul-texto); text-shadow: var(--kpi-brilho); }
.secao-tt .kpi.destaque .kpi-v { color: var(--laranja-texto); text-shadow: var(--kpi-brilho-tt); }
.kpi .spark { flex: none; margin-top: -2px; }
.kpi-delta { display: flex; flex-wrap: wrap; gap: 2px var(--e-2); align-items: baseline; font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.kpi-sub { flex-basis: 100%; }
.dl { font: 700 var(--t-12) var(--f-num); letter-spacing: -.02em; white-space: nowrap; }
.dl.sobe { color: var(--verde-texto); }
.dl.desce { color: var(--verm-texto); }
.dl.igual { color: var(--tinta-3); }
.vs { white-space: nowrap; }
.heroi-linha { display: flex; align-items: flex-end; gap: var(--e-5); flex-wrap: wrap; margin: var(--e-3) 0 var(--e-5); }
.heroi-linha .heroi-valor { margin: 0; }
.heroi-delta { display: flex; flex-direction: column; gap: 2px; padding-bottom: var(--e-2); font: var(--t-13) var(--f-texto); color: var(--tinta-3); }
.heroi-delta .dl { font-size: 15px; line-height: 20px; }
@media (max-width: 1100px) {
  .kpis.k5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpis.k5 > .kpi:first-child { grid-column: 1 / -1; }
  .kpis.k5 > .kpi { border-left: 0 !important; border-top: 1px solid var(--linha); }
  .kpis.k5 > .kpi:first-child { border-top: 0; }
  .kpis.k5 > .kpi:nth-child(odd):not(:first-child) { border-left: 1px solid var(--linha) !important; }
  .kpis > .kpi { border-radius: 0 !important; }
}
@media (max-width: 760px) {
  .kpis.k4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpis.k4 > .kpi { border-left: 0 !important; }
  .kpis.k4 > .kpi:nth-child(even) { border-left: 1px solid var(--linha) !important; }
  .kpis.k4 > .kpi:nth-child(n+3) { border-top: 1px solid var(--linha); }
  .kpi { padding: var(--e-3) var(--e-4); }
  .kpi-v { font-size: 18px; line-height: 24px; }
  .kpi .spark { width: 56px; }
  .heroi-linha { gap: var(--e-2); }
  .heroi-delta { flex-direction: row; gap: var(--e-2); padding: 0; }
}

/* ================= tabela profissional (L7) ================= */
.tab-painel { overflow: clip; }
.tab-ferr { display: flex; align-items: center; justify-content: space-between; gap: var(--e-2); padding: var(--e-3) var(--e-4); border-bottom: 1px solid var(--linha); flex-wrap: wrap; }
.tg-compacta .tab-ferr { display: none; }
.tab-chips { display: flex; align-items: center; gap: var(--e-2); flex-wrap: wrap; flex: 1; min-width: 0; }
.tab-ferr-dir { display: flex; gap: var(--e-1); align-items: center; }
.busca-tab { display: inline-flex; align-items: center; gap: var(--e-2); height: 32px; padding: 0 var(--e-2) 0 var(--e-3); border: 1px solid var(--linha-forte); border-radius: var(--r-sm); background: var(--campo-fundo); min-width: 260px; color: var(--tinta-3); }
.busca-tab:focus-within { border-color: var(--azul); box-shadow: var(--anel-foco); }
.busca-tab svg { width: 16px; height: 16px; flex: none; }
.busca-tab input { border: 0; outline: 0; background: transparent; flex: 1; min-width: 0; font: var(--t-14) var(--f-texto); color: var(--tinta); }
.busca-tab input::-webkit-search-cancel-button { cursor: pointer; }
.chip-filtro { display: inline-flex; align-items: center; gap: var(--e-1); height: 28px; padding: 0 2px 0 var(--e-2); border-radius: var(--r-sm); background: var(--azul-claro); color: var(--azul-texto); font: var(--t-13) var(--f-texto); }
.chip-filtro b { font-weight: 600; }
.chip-filtro button { border: 0; background: none; color: inherit; width: 24px; height: 24px; border-radius: var(--r-xs); display: grid; place-items: center; cursor: pointer; }
.chip-filtro button:hover { background: color-mix(in srgb, var(--azul) 16%, transparent); }
.chip-filtro svg { width: 12px; height: 12px; }
.link-limpar { border: 0; background: none; color: var(--tinta-3); font: 600 var(--t-13) var(--f-texto); cursor: pointer; padding: 4px 6px; border-radius: var(--r-xs); }
.link-limpar:hover { color: var(--tinta); background: var(--papel-3); }
.tab-rol { position: relative; max-height: calc(100vh - 220px); max-height: calc(100dvh - 220px); overflow: auto; }
table.tg { min-width: 0; }
table.tg.amz { min-width: 1240px; }
table.tg.tt { min-width: 1100px; }
table.tg th { z-index: 2; padding: 0 var(--e-2); height: 40px; }
table.tg th .th-ord { all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; padding: 4px 2px; border-radius: var(--r-xs); }
table.tg th.d .th-ord { flex-direction: row-reverse; }
table.tg th .th-ord:hover { color: var(--tinta); }
table.tg th .th-ord:focus-visible { outline: 2px solid var(--azul); }
table.tg th .th-ord.on { color: var(--tinta); }
.seta-ord { font-size: 9px; opacity: .35; }
.th-ord.on .seta-ord { opacity: 1; color: var(--azul-texto); }
.th-ord sup { font-size: 9px; color: var(--tinta-3); }
table.tg .sel-col { width: 40px; text-align: center; padding: 0 !important; }
table.tg .sel-col input, .cc-sel input { width: 16px; height: 16px; accent-color: var(--azul); cursor: pointer; margin: 0; vertical-align: middle; }
table.tg td.fixa-e, table.tg th.fixa-e { position: sticky; left: 0; background: var(--papel); z-index: 1; }
table.tg td.fixa-e2, table.tg th.fixa-e2 { position: sticky; left: 40px; background: var(--papel); z-index: 1; }
table.tg th.fixa-e, table.tg th.fixa-e2, table.tg th.fixa-d { z-index: 3; }
.tg-compacta table.tg td.fixa-e2, .tg-compacta table.tg th.fixa-e2 { left: 0; }
.tab-rol.tem-esq table.tg td.fixa-e2 { box-shadow: 10px 0 10px -10px var(--sombra-borda); }
table.tg td.acoes-col, table.tg th.acoes-col { position: sticky; right: 0; background: var(--papel); text-align: right; z-index: 1; }
.tab-rol.tem-dir table.tg td.acoes-col { box-shadow: -10px 0 10px -10px var(--sombra-borda); }
table.tg tr:hover td, table.tg tr:hover td.fixa-e, table.tg tr:hover td.fixa-e2, table.tg tr:hover td.acoes-col { background: var(--papel-2); }
table.tg tr.fora td, table.tg tr.fora td.fixa-e, table.tg tr.fora td.fixa-e2, table.tg tr.fora td.acoes-col { background: color-mix(in srgb, var(--verm-claro) 55%, var(--papel)); }
table.tg tr.sel td, table.tg tr.sel td.fixa-e, table.tg tr.sel td.fixa-e2, table.tg tr.sel td.acoes-col { background: color-mix(in srgb, var(--azul) 7%, var(--papel)); }
table.tg tr.foco td:first-child { box-shadow: inset 2px 0 0 var(--azul); }
table.tg.dens-compacta td { height: 32px; padding-top: 0; padding-bottom: 0; }
table.tg.dens-compacta .ed { height: 28px; }
table.tg.dens-padrao td { height: 40px; }
table.tg.dens-conforto td { height: 48px; }
table.tg .ed.forte { font-weight: 700; }
table.tg .mudo-forte { color: var(--tinta-2); }
table.tg .ed-data { text-align: left; cursor: pointer; font-size: 13px; width: auto; min-width: 56px; }
table.tg td.salvou-cel { position: relative; }
table.tg td.salvou-cel::after { content: ""; position: absolute; right: 4px; top: 50%; width: 12px; height: 12px; margin-top: -6px; border-radius: 50%; background: var(--verde) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/9px no-repeat; animation: some-ok 1.4s ease-out forwards; }
@keyframes some-ok { 0%, 60% { opacity: 1; } 100% { opacity: 0; } }
table.tg .lucro small { font-size: 11px; }
.tab-mais { display: flex; justify-content: center; padding: var(--e-3); border-top: 1px solid var(--linha); }
.tab-rodape:empty { display: none; }
.rod-sel { color: var(--azul-texto); }
.tab-lote { position: sticky; bottom: var(--e-4); z-index: 10; margin: var(--e-3) auto; width: max-content; max-width: calc(100% - 32px); display: flex; align-items: center; gap: var(--e-1); background: var(--inv-fundo); color: var(--inv-tinta); border: 1px solid var(--inv-linha); border-radius: var(--r-md); padding: 6px 6px 6px var(--e-4); box-shadow: var(--s-3); animation: toast var(--m-medio) var(--curva); flex-wrap: wrap; }
.tab-lote[hidden] { display: none; }
.tab-lote > b { font: 600 var(--t-13) var(--f-texto); margin-right: var(--e-2); }
.lote-bt { border: 0; background: transparent; color: inherit; font: 500 var(--t-13) var(--f-texto); display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 var(--e-2); border-radius: var(--r-sm); cursor: pointer; }
.lote-bt:hover, .lote-bt:focus-visible { background: color-mix(in srgb, var(--inv-tinta) 12%, transparent); }
.lote-bt svg { width: 14px; height: 14px; opacity: .8; }
.lote-bt.perigo { color: #FF9AA2; }
.lote-x { border: 0; background: none; color: inherit; width: 32px; height: 32px; border-radius: var(--r-sm); display: grid; place-items: center; cursor: pointer; opacity: .7; }
.lote-x:hover { opacity: 1; background: color-mix(in srgb, var(--inv-tinta) 12%, transparent); }
.lote-x svg { width: 14px; height: 14px; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* popover, menu, calendário */
.popover { position: fixed; z-index: 400; background: var(--papel-elev); border: 1px solid var(--linha); border-radius: var(--r-md); box-shadow: var(--s-2); animation: pop var(--m-rapido) var(--curva); color: var(--tinta); }
@keyframes pop { from { opacity: 0; transform: translateY(-4px); } }
.menu { padding: var(--e-1); min-width: 200px; max-height: 360px; overflow: auto; }
.menu-tit { font: 600 var(--t-11) var(--f-texto); color: var(--tinta-3); padding: 6px var(--e-2) 4px; }
.menu hr { border: 0; border-top: 1px solid var(--linha); margin: var(--e-1) 0; }
.menu-item { display: flex; align-items: center; gap: var(--e-2); width: 100%; border: 0; background: none; text-align: left; padding: 0 var(--e-2); height: 32px; border-radius: var(--r-xs); font: var(--t-14) var(--f-texto); color: var(--tinta); cursor: pointer; }
.menu-item:hover, .menu-item:focus-visible { background: var(--papel-3); outline: none; }
.menu-item svg { width: 16px; height: 16px; color: var(--tinta-3); }
.menu-item.perigo { color: var(--verm-texto); }
.menu-ok { margin-left: auto; color: var(--azul-texto); }
.menu-ok svg { color: var(--azul-texto); }
.cal { width: 280px; padding: var(--e-3); }
.cal-cab { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--e-2); }
.cal-cab b { font: 600 var(--t-14) var(--f-texto); text-transform: capitalize; }
.cal-cab .icone-btn { width: 32px; height: 32px; }
.cal-grade { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.cal-sem { font: 600 var(--t-11) var(--f-texto); color: var(--tinta-3); text-align: center; padding: 4px 0; }
.cal-dia { height: 34px; border: 0; background: none; border-radius: var(--r-sm); font: var(--t-13) var(--f-num); color: var(--tinta); cursor: pointer; }
.cal-dia:hover { background: var(--papel-3); }
.cal-dia.fora { color: var(--tinta-4); }
.cal-dia.hoje { box-shadow: inset 0 0 0 1px var(--azul); font-weight: 700; }
.cal-dia.on { background: var(--acao); color: #fff; font-weight: 700; box-shadow: var(--brilho-btn); }
.cal-dia:disabled { opacity: .3; cursor: not-allowed; }
.cal-dia:focus-visible { outline: 2px solid var(--azul); outline-offset: 1px; }
.cal-rod { display: flex; gap: var(--e-1); align-items: center; margin-top: var(--e-2); padding-top: var(--e-2); border-top: 1px solid var(--linha); }
.cal-rod .dica { margin-left: auto; font-family: var(--f-num); }
.campo-data { position: relative; }
.campo-data input { padding-right: 40px; width: 100%; }
.cd-cal { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; border: 0; background: none; color: var(--tinta-3); border-radius: var(--r-xs); display: grid; place-items: center; cursor: pointer; }
.cd-cal:hover { background: var(--papel-3); color: var(--tinta); }
.cd-cal svg { width: 16px; height: 16px; }
input.invalido { border-color: var(--verm) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--verm) 16%, transparent) !important; }

/* lista em cards no celular */
.lista-cel { list-style: none; margin: 0; padding: 0; }
.lista-cel li { display: flex; align-items: stretch; border-bottom: 1px solid var(--linha); }
.lista-cel li.fora { background: color-mix(in srgb, var(--verm-claro) 50%, var(--papel)); }
.lista-cel li.sel { background: color-mix(in srgb, var(--azul) 7%, var(--papel)); }
.lista-cel li.foco { box-shadow: inset 3px 0 0 var(--azul); }
.cc-sel { display: grid; place-items: center; padding: 0 0 0 var(--e-4); min-width: 44px; }
.card-cel { all: unset; box-sizing: border-box; display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; padding: var(--e-3) var(--e-4); flex: 1; min-width: 0; cursor: pointer; overflow: hidden; }
.card-cel:focus-visible { outline: 2px solid var(--azul); outline-offset: -2px; }
.cc-l1 { display: flex; justify-content: space-between; gap: var(--e-3); align-items: baseline; }
.cc-l1 b { font: 600 var(--t-14) var(--f-texto); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; flex: 1; }
.cc-v { font: 700 15px/20px var(--f-num); flex: none; }
.cc-l2 { font: var(--t-12) var(--f-texto); color: var(--tinta-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cc-l2 .num { font-size: 12px; }
.cc-l3 { display: flex; gap: var(--e-1); flex-wrap: wrap; }
@media (max-width: 760px) {
  .tab-ferr { padding: var(--e-3); }
  .busca-tab { min-width: 0; flex: 1 1 100%; height: 40px; }
  .tab-ferr { gap: var(--e-2); justify-content: flex-start; }
  .tab-chips { display: contents; }
  .tab-ferr-dir { margin-left: auto; }
  .tab-ferr-dir .btn { padding: 0 var(--e-2); }
  .busca-tab kbd { display: none; }
  .tab-lote { bottom: calc(72px + env(safe-area-inset-bottom)); }
  .tab-rol { max-height: none; }
}
.leg i.tracejado.meta { border-top: 2px dotted var(--laranja-texto); }

/* ================= visão enxuta (L9) ================= */
.abas-int { overflow: clip; }
.abas-int-cab { display: flex; gap: var(--e-1); padding: 0 var(--e-4); border-bottom: 1px solid var(--linha); overflow-x: auto; scrollbar-width: none; }
.abas-int-cab::-webkit-scrollbar { display: none; }
.abas-int-cab [role=tab] { border: 0; background: none; padding: var(--e-3) var(--e-2); margin: 0 var(--e-1); font: 600 var(--t-14) var(--f-texto); color: var(--tinta-3); cursor: pointer; position: relative; display: inline-flex; align-items: center; gap: var(--e-2); white-space: nowrap; }
.abas-int-cab [role=tab]:hover { color: var(--tinta); }
.abas-int-cab [role=tab][aria-selected=true] { color: var(--tinta); }
.abas-int-cab [role=tab][aria-selected=true]::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; border-radius: 2px; background: var(--azul); }
.secao-tt .abas-int-cab [role=tab][aria-selected=true]::after { background: var(--laranja); }
.abas-int-pn[hidden] { display: none; }
.abas-int-pn { animation: entra var(--m-medio) var(--curva); }
.pn-dica { padding: var(--e-4) var(--e-6) var(--e-2); }
.pn-grade { padding: var(--e-4) var(--e-6) var(--e-5); gap: var(--e-6); }
.pn-h3 { font: 600 var(--t-14) var(--f-texto); display: flex; gap: var(--e-2); align-items: center; margin-bottom: var(--e-2); }
.rank-ferr { display: flex; justify-content: space-between; align-items: center; gap: var(--e-2); flex-wrap: wrap; margin-bottom: var(--e-3); }
.rank .n a { color: inherit; text-decoration: none; }
.rank .n a:hover { color: var(--azul-texto); text-decoration: underline; }
.rank-resto { border-top: 1px dashed var(--linha); margin-top: var(--e-1); }
.radar-bloco .titulo-bloco { align-items: flex-end; }
@media (max-width: 760px) {
  .pn-dica { padding: var(--e-3) var(--e-4) var(--e-1); }
  .pn-grade { padding: var(--e-3) var(--e-4) var(--e-4); }
  .abas-int-cab { padding: 0 var(--e-2); }
}

/* ================= celular (L10) ================= */
dialog.folha { margin: 0 0 0 auto; height: 100vh; height: 100dvh; max-height: 100vh; max-height: 100dvh; width: min(440px, 100vw); border-radius: var(--r-lg) 0 0 var(--r-lg); border-right: 0; animation: lateral var(--m-lento) var(--curva); }
@keyframes lateral { from { transform: translateX(24px); opacity: 0; } }
.folha-in { display: flex; flex-direction: column; height: 100%; }
.folha-pega { display: none; }
.folha-cab { display: flex; justify-content: space-between; gap: var(--e-3); padding: var(--e-5) var(--e-6) var(--e-3); border-bottom: 1px solid var(--linha); }
.folha-cab h2 { font: 700 var(--t-20) var(--f-titulo); overflow-wrap: anywhere; }
.folha-corpo { flex: 1; overflow-y: auto; padding: var(--e-4) var(--e-6); }
.folha-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-3); }
.folha-form .largo, .folha-form .campo:has(.idp) { grid-column: 1 / -1; }
.folha-rod { display: flex; gap: var(--e-2); align-items: center; padding: var(--e-3) var(--e-6) calc(var(--e-3) + env(safe-area-inset-bottom)); border-top: 1px solid var(--linha); background: var(--papel-elev); }
.folha-rod .esp { flex: 1; }
@media (max-width: 760px) {
  dialog.folha { margin: auto 0 0; width: 100vw; max-width: 100vw; height: auto; max-height: 92vh; max-height: 92dvh; border-radius: var(--r-lg) var(--r-lg) 0 0; border: 0; animation: sobeFolha var(--m-lento) var(--curva); }
  @keyframes sobeFolha { from { transform: translateY(40px); opacity: 0; } }
  .folha-in { max-height: 92vh; max-height: 92dvh; transition: transform var(--m-rapido); }
  .folha-pega { display: block; width: 40px; height: 5px; border-radius: 3px; background: var(--linha-forte); margin: var(--e-2) auto 0; touch-action: none; cursor: grab; padding: 6px 0; background-clip: content-box; height: 17px; }
  .folha-cab { padding: var(--e-2) var(--e-4) var(--e-3); }
  .folha-corpo { padding: var(--e-3) var(--e-4); }
  .folha-rod { padding: var(--e-3) var(--e-4) calc(var(--e-3) + env(safe-area-inset-bottom)); }
  .folha-rod .btn { flex: 1; }
  .folha-rod .esp { display: none; }
  .periodo { -webkit-mask-image: none; mask-image: none; }
  .periodo.rola-dir { -webkit-mask-image: linear-gradient(90deg, #000 80%, transparent); mask-image: linear-gradient(90deg, #000 80%, transparent); }
  .periodo.rola-esq { -webkit-mask-image: linear-gradient(90deg, transparent, #000 20%); mask-image: linear-gradient(90deg, transparent, #000 20%); }
  .periodo.rola-esq.rola-dir { -webkit-mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent); mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent); }
  .barra-per { flex-wrap: nowrap; }
  .barra-per .periodo { width: 100%; }
  .cab-pagina > .periodo { width: 100%; }
}
.cd-barra { display: none; }
@media (max-width: 760px) {
  .cd-barra { display: grid; grid-template-columns: 1fr 1.4fr; gap: var(--e-2); position: sticky; bottom: 0; margin: 0 calc(-1 * var(--e-5)) calc(-1 * var(--e-5)); padding: var(--e-3) var(--e-4) calc(var(--e-3) + env(safe-area-inset-bottom)); background: var(--papel-elev); border-top: 1px solid var(--linha); box-shadow: 0 -8px 24px -12px var(--sombra-borda); z-index: 2; }
  .cd-barra .btn { min-height: 48px; }
  .cd { position: relative; }
}

/* ================= conteúdo (L11) ================= */
.cab-acoes { display: flex; gap: var(--e-2); flex-wrap: wrap; }
.cont-kpis .kpi-v { font-size: 24px; }
.quadro-ferr { display: flex; gap: var(--e-3); align-items: center; justify-content: space-between; padding: var(--e-3) var(--e-6) 0; flex-wrap: wrap; }
.col-mais { border: 1px dashed var(--linha-forte); background: transparent; border-radius: var(--r-sm); padding: var(--e-2); font: 600 var(--t-13) var(--f-texto); color: var(--tinta-2); cursor: pointer; }
.col-mais:hover { background: var(--papel); color: var(--tinta); }
.fila-cab { justify-content: space-between; }
.fila-cab > .avatar { order: -1; }
.fila-tit { flex: 1; display: flex; align-items: center; gap: var(--e-2); flex-wrap: wrap; }
.fila-tit b { font: 600 var(--t-15) var(--f-texto); }
.fila-prog { display: inline-flex; gap: 3px; }
.fila-prog i { width: 18px; height: 6px; border-radius: 3px; background: var(--papel-3); box-shadow: inset 0 0 0 1px var(--linha); }
.fila-prog i.agendado { background: var(--azul-claro); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--azul) 40%, transparent); }
.fila-prog i.feito { background: var(--verde); box-shadow: none; }
.fila-cont { font-size: 12px; color: var(--tinta-3); }
.fila-lista li.fila-vazio { grid-template-columns: auto minmax(0, 1fr) auto; min-height: 0; padding: 6px var(--e-2); }
.fila-lista li.fila-vazio .nn { min-width: 32px; font-size: 12px; }
.ag-item.st-manual { border-left-color: var(--tinta-4); background: var(--papel-2); }
.ag-item.st-manual em { color: var(--tinta-3); }
.al-item.st-manual { border-left-color: var(--tinta-4); }
.cd-seq { display: flex; align-items: center; gap: 2px; font-size: 12px; color: var(--tinta-3); }
.cd-seq .icone-btn { width: 32px; height: 32px; }
.cd-seq .icone-btn:disabled { opacity: .3; cursor: default; }
.rep-box { display: grid; gap: var(--e-2); margin-top: var(--e-2); }
.rep-box[hidden] { display: none; }
.decidir kbd { margin-left: var(--e-1); }
@media (max-width: 760px) {
  .quadro-ferr { padding: var(--e-3) var(--e-4) 0; }
  .cab-acoes { width: 100%; flex-wrap: nowrap; }
  .cab-acoes .btn.lar { flex: 1; }
  .cont-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .cont-kpis .kpi { grid-column: auto !important; border-left: 0 !important; border-top: 0 !important; padding: var(--e-3); }
  .cont-kpis .kpi:nth-child(n+4) { display: none; }
  .cont-kpis .kpi + .kpi { border-left: 1px solid var(--linha) !important; }
  .cont-kpis .kpi-delta { display: none; }
  .cont-kpis .kpi-rot { font-size: 11px; line-height: 14px; }
  .decidir kbd { display: none; }
}

/* ================= menu lateral + topo com trilha e período (L12) ================= */
:root { --lat: 232px; }
body.lat-recolhida { --lat: 64px; }
.pular { position: absolute; left: -999px; top: 8px; z-index: 500; background: var(--papel); padding: var(--e-2) var(--e-3); border-radius: var(--r-sm); box-shadow: var(--s-2); }
.pular:focus { left: 8px; }
.lateral { position: fixed; inset: 0 auto 0 0; width: var(--lat); z-index: 40; background: var(--fundo); border-right: 1px solid var(--linha); display: flex; flex-direction: column; padding: var(--e-3) var(--e-2); gap: var(--e-2); transition: width var(--m-medio) var(--curva); overflow: hidden; }
.area { margin-left: var(--lat); transition: margin-left var(--m-medio) var(--curva); min-width: 0; }
.lat-topo { display: flex; align-items: center; justify-content: space-between; padding: 2px var(--e-1) var(--e-1) var(--e-2); min-height: 40px; }
.lat-topo .marca b { font-size: 17px; }
.lat-busca { display: flex; align-items: center; gap: var(--e-2); height: 36px; padding: 0 var(--e-2) 0 10px; border: 1px solid var(--linha-forte); background: var(--campo-fundo); border-radius: var(--r-sm); color: var(--tinta-3); font: var(--t-13) var(--f-texto); cursor: pointer; box-shadow: var(--s-1); white-space: nowrap; }
.lat-busca:hover { color: var(--tinta); border-color: var(--tinta-4); }
.lat-busca svg { width: 16px; height: 16px; flex: none; }
.lat-kbd { margin-left: auto; display: flex; gap: 2px; }
.lat-nav { flex: 1; overflow-y: auto; overflow-x: hidden; display: flex; flex-direction: column; gap: 2px; margin-top: var(--e-1); }
.lat-grupo { font: 600 var(--t-11) var(--f-texto); color: var(--tinta-3); padding: var(--e-3) 10px var(--e-1); white-space: nowrap; }
.lat-item { position: relative; display: flex; align-items: center; gap: 10px; height: 34px; padding: 0 10px; border-radius: var(--r-sm); color: var(--tinta-2); text-decoration: none; font: 500 var(--t-14) var(--f-texto); border: 0; background: none; cursor: pointer; width: 100%; text-align: left; white-space: nowrap; }
.lat-item svg { width: 18px; height: 18px; flex: none; color: var(--tinta-3); }
.lat-item:hover { background: var(--papel-3); color: var(--tinta); }
.lat-item.on { background: var(--ativo-fundo); color: var(--tinta); box-shadow: inset 0 0 0 1px var(--linha), var(--s-1), var(--realce); font-weight: 600; }
.lat-item.on svg { color: var(--ativo-ic); filter: var(--ic-brilho); }
.lat-item kbd { margin-left: auto; }
.lat-item .nav-cont { margin-left: auto; }
.lat-ponto { position: absolute; left: 22px; top: 8px; width: 7px; height: 7px; border-radius: 50%; border: 1.5px solid var(--fundo); z-index: 1; }
.lat-ponto.amz { background: var(--azul); }
.lat-ponto.tt { background: var(--laranja); }
.lat-item.on .lat-ponto { border-color: var(--ativo-fundo); }
.lat-filhos { display: none; flex-direction: column; gap: 1px; margin: 2px 0 var(--e-1) 19px; padding-left: var(--e-3); border-left: 1px solid var(--linha); }
.lat-filhos.aberto { display: flex; }
.lat-sub { height: 30px; display: flex; align-items: center; padding: 0 var(--e-2); border-radius: var(--r-xs); color: var(--tinta-3); text-decoration: none; font: 500 var(--t-13) var(--f-texto); white-space: nowrap; }
.lat-sub:hover { color: var(--tinta); background: var(--papel-3); }
.lat-sub.on { color: var(--tinta); font-weight: 600; background: var(--papel-3); }
.lat-rodape { display: flex; flex-direction: column; gap: 2px; border-top: 1px solid var(--linha); padding-top: var(--e-2); }
body.lat-recolhida .lat-rot, body.lat-recolhida .lat-grupo, body.lat-recolhida .lat-filhos, body.lat-recolhida .lat-item kbd { display: none !important; }
body.lat-recolhida .lat-topo { flex-direction: column; gap: var(--e-2); padding: 2px 0 var(--e-1); }
body.lat-recolhida .lat-busca, body.lat-recolhida .lat-item { justify-content: center; padding: 0; }
body.lat-recolhida .lat-item .nav-cont { position: absolute; top: 2px; right: 4px; padding: 2px 4px; font-size: 10px; }
body.lat-recolhida .lat-nav { gap: 4px; }
body.lat-recolhida .lat-nav::before { content: ""; height: var(--e-2); }
body.lat-recolhida [data-dica]:hover::after, body.lat-recolhida [data-dica]:focus-visible::after { content: attr(data-dica); position: fixed; left: calc(var(--lat) + 6px); transform: translateY(-50%); margin-top: 17px; background: var(--inv-fundo); color: var(--inv-tinta); border: 1px solid var(--inv-linha); font: 600 var(--t-12) var(--f-texto); padding: 4px 8px; border-radius: var(--r-xs); white-space: pre; z-index: 60; pointer-events: none; box-shadow: var(--s-2); }
.lat-recolher svg { width: 16px; height: 16px; }

.topo { background: color-mix(in srgb, var(--fundo) 88%, transparent); }
.topo-in { max-width: 1280px; height: 52px; gap: var(--e-4); justify-content: space-between; }
.trilha { display: flex; align-items: center; gap: var(--e-2); font: 500 var(--t-14) var(--f-texto); color: var(--tinta-3); min-width: 0; white-space: nowrap; }
.trilha a { color: var(--tinta-3); text-decoration: none; }
.trilha a:hover { color: var(--tinta); }
.trilha [aria-current] { color: var(--tinta); font-weight: 600; }
.trilha-sep { color: var(--tinta-4); }
.topo-per { display: flex; align-items: center; }
.topo-per .periodo .chip svg { width: 14px; height: 14px; }
.per-cel { display: none; }
.so-cel { display: none !important; }
main { padding-top: var(--e-6); }

@media (max-width: 1100px) {
  .topo-per .chip[data-per="mesp"] { display: none; }
}
@media (max-width: 960px) and (min-width: 761px) {
  body:not(.lat-recolhida) { --lat: 64px; }
  body:not(.lat-recolhida) .lat-rot, body:not(.lat-recolhida) .lat-grupo, body:not(.lat-recolhida) .lat-filhos { display: none !important; }
  body:not(.lat-recolhida) .lat-busca, body:not(.lat-recolhida) .lat-item { justify-content: center; padding: 0; }
  body:not(.lat-recolhida) .lat-topo { flex-direction: column; gap: 8px; }
  .per-desk { display: none !important; }
  .per-cel { display: inline-flex; }
}
@media (max-width: 760px) {
  .lateral { display: none; }
  .area { margin-left: 0; }
  .so-cel { display: flex !important; }
  .topo-in { padding: 0 var(--e-3) 0 var(--e-4); }
  .trilha { display: none; }
  .per-desk { display: none !important; }
  .per-cel { display: inline-flex; min-height: 36px; padding: 0 var(--e-2); gap: 6px; }
  .per-cel span { max-width: 112px; overflow: hidden; text-overflow: ellipsis; }
  .topo-per { margin-left: auto; }
  .topo-acoes.so-cel { gap: 0; margin-left: 0; }
  .nav-baixo a { position: relative; }
  .nav-baixo .nav-cont { position: absolute; top: 2px; left: calc(50% + 6px); font-size: 10px; padding: 2px 5px; }
}

/* ================= ajustes (L12) ================= */
.ajustes-lay { display: grid; grid-template-columns: 220px minmax(0, 720px); gap: var(--e-6); align-items: start; }
.aj-nav { position: sticky; top: 76px; display: flex; flex-direction: column; gap: 2px; }
.aj-nav button { display: flex; align-items: center; gap: 10px; height: 36px; padding: 0 10px; border: 0; background: none; border-radius: var(--r-sm); color: var(--tinta-2); font: 500 var(--t-14) var(--f-texto); cursor: pointer; text-align: left; }
.aj-nav button svg { width: 16px; height: 16px; color: var(--tinta-3); flex: none; }
.aj-nav button:hover { background: var(--papel-3); color: var(--tinta); }
.aj-nav button.on { background: var(--ativo-fundo); color: var(--tinta); font-weight: 600; box-shadow: inset 0 0 0 1px var(--linha), var(--s-1), var(--realce); }
.aj-nav button.on svg { color: var(--ativo-ic); }
.aj-sec[hidden] { display: none; }
.aj-sec { animation: entra var(--m-medio) var(--curva); }
.aj-bloco + .aj-bloco { margin-top: var(--e-5); padding-top: var(--e-5); border-top: 1px solid var(--linha); }
.aj-bloco h3 { font: 600 var(--t-14) var(--f-texto); margin-bottom: var(--e-1); }
.aj-bloco > .dica { margin-bottom: var(--e-3); }
.aj-bloco > .opcoes, .aj-bloco > .aj-radios, .aj-bloco > .aj-grade, .aj-bloco > .aj-bool, .aj-bloco > .aj-mapa { margin-top: var(--e-3); }
.aj-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-3) var(--e-4); }
.aj-grade .dica { font-size: 12px; line-height: 16px; }
.aj-num { position: relative; display: flex; align-items: center; }
.aj-num input { padding-right: 104px; text-align: left !important; }
.aj-suf { position: absolute; right: var(--e-3); font: var(--t-12) var(--f-texto); color: var(--tinta-3); pointer-events: none; }
.aj-radios { display: grid; gap: var(--e-2); }
.aj-radio, .aj-bool { display: flex; gap: var(--e-3); align-items: flex-start; padding: var(--e-3); border: 1px solid var(--linha); border-radius: var(--r-sm); cursor: pointer; background: var(--papel); }
.aj-radio:has(input:checked), .aj-bool:has(input:checked) { border-color: var(--azul); background: color-mix(in srgb, var(--azul) 5%, var(--papel)); }
.aj-radio input, .aj-bool input { accent-color: var(--azul); width: 16px; height: 16px; margin: 2px 0 0; flex: none; }
.aj-radio span, .aj-bool span { display: grid; gap: 2px; }
.aj-radio b, .aj-bool b { font: 600 var(--t-14) var(--f-texto); }
.aj-radio small, .aj-bool small { font: var(--t-13) var(--f-texto); color: var(--tinta-3); }
.aj-bool { margin-top: var(--e-3); }
.aj-mapa { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-2) var(--e-4); }
.aj-mapa-l { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: var(--e-2); align-items: center; }
.aj-mapa-l > span { font: 600 var(--t-13) var(--f-texto); color: var(--tinta-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aj-mapa-l input { border: 1px solid var(--linha-forte); border-radius: var(--r-sm); padding: 6px var(--e-2); min-height: 36px; width: 100%; background: var(--campo-fundo); }
.aj-mapa-l input:focus { outline: none; border-color: var(--azul); box-shadow: var(--anel-foco); }
.aj-acoes { grid-column: 1 / -1; display: flex; gap: var(--e-3); align-items: center; flex-wrap: wrap; }
.aj-dica-data { display: block; margin-top: 4px; }
.aj-salvo { display: inline-flex; align-items: center; gap: 6px; font: 600 var(--t-13) var(--f-texto); color: var(--tinta-3); min-height: 20px; }
.aj-salvo svg { width: 14px; height: 14px; }
.aj-salvo.ok { color: var(--verde-texto); }
.aj-salvo.erro { color: var(--verm-texto); }
.aj-lista + .aj-lista { margin-top: var(--e-4); }
.aj-lista-cab { display: flex; gap: var(--e-2); align-items: baseline; margin-bottom: 6px; }
.aj-lista-cab b { font: 600 var(--t-13) var(--f-texto); }
.tags-ed { display: flex; flex-wrap: wrap; gap: 6px; padding: 6px; border: 1px solid var(--linha-forte); border-radius: var(--r-sm); background: var(--campo-fundo); min-height: 44px; cursor: text; }
.tags-ed:focus-within { border-color: var(--azul); box-shadow: var(--anel-foco); }
.tag-ed { display: inline-flex; align-items: center; gap: 2px; height: 28px; padding: 0 2px 0 var(--e-2); border-radius: var(--r-xs); background: var(--papel-3); font: 500 var(--t-13) var(--f-texto); }
.tag-ed button { border: 0; background: none; width: 22px; height: 22px; border-radius: 4px; display: grid; place-items: center; color: var(--tinta-3); cursor: pointer; }
.tag-ed button:hover { background: var(--verm-claro); color: var(--verm-texto); }
.tag-ed button svg { width: 12px; height: 12px; }
.tags-in { border: 0; outline: 0; background: transparent; flex: 1; min-width: 120px; font: var(--t-14) var(--f-texto); padding: 0 4px; }
.aj-videos { font: var(--t-13) var(--f-num) !important; }
@media (max-width: 960px) {
  .ajustes-lay { grid-template-columns: minmax(0, 1fr); }
  .aj-nav { position: static; flex-direction: row; overflow-x: auto; scrollbar-width: none; gap: var(--e-1); margin: 0 calc(-1 * var(--e-4)); padding: 0 var(--e-4); }
  .aj-nav::-webkit-scrollbar { display: none; }
  .aj-nav button { flex: none; }
}
@media (max-width: 760px) {
  .aj-grade, .aj-mapa { grid-template-columns: minmax(0, 1fr); }
  .aj-mapa-l { grid-template-columns: 110px minmax(0, 1fr); }
}

/* ================= funções novas: dinheiro e operação (L13) ================= */
.din-grade { align-items: stretch; }
.din-card { display: flex; flex-direction: column; gap: var(--e-2); padding: var(--e-4) var(--e-5); color: inherit; text-decoration: none; transition: border-color var(--m-rapido), box-shadow var(--m-rapido); }
a.din-card:hover { border-color: var(--linha-forte); box-shadow: var(--s-2); }
.din-cab { display: flex; justify-content: space-between; align-items: center; gap: var(--e-2); min-height: 24px; }
.din-rot { font: 600 var(--t-12) var(--f-texto); color: var(--tinta-2); }
.din-v { font: 700 var(--t-24) var(--f-num); letter-spacing: -.04em; }
.din-ls { display: grid; gap: 2px; }
.din-l { display: flex; justify-content: space-between; gap: var(--e-2); font: var(--t-13) var(--f-texto); color: var(--tinta-2); padding: 3px 0; border-top: 1px solid var(--linha); }
.din-l:first-child { border-top: 0; }
.din-l b { font-size: 13px; color: var(--tinta); }
.din-l.mudo b { color: var(--tinta-3); font-weight: 400; }
.din-rod { font: var(--t-12) var(--f-texto); color: var(--tinta-3); margin-top: auto; }
.din-aviso { display: flex; gap: 6px; font: 600 var(--t-12) var(--f-texto); color: var(--verm-texto); }
.din-aviso svg { width: 14px; height: 14px; flex: none; margin-top: 1px; }
.teto-barra { position: relative; height: 8px; border-radius: var(--r-full); background: var(--papel-3); }
.teto-barra i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: var(--r-full); }
.teto-barra .proj { background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--tinta-3) 30%, transparent) 0 3px, transparent 3px 6px); }
.teto-barra .feito { background: var(--verde); z-index: 1; }
.nivel-atencao .teto-barra .feito { background: var(--amarelo); }
.nivel-estourou .teto-barra .feito { background: var(--verm); }
.teto-barra b { position: absolute; top: -3px; bottom: -3px; width: 2px; background: var(--tinta-3); z-index: 2; }
.heroi-nota { margin-top: var(--e-3); font: var(--t-13) var(--f-texto); }
.heroi-nota a { color: var(--tinta-3); text-decoration: none; }
.heroi-nota a:hover { color: var(--laranja-texto); text-decoration: underline; }
.explica { display: flex; gap: 6px; font: var(--t-12) var(--f-texto); color: var(--tinta-3); margin-top: var(--e-4); max-width: 80ch; }
.explica svg { width: 14px; height: 14px; flex: none; margin-top: 1px; }
.pn-pad { padding: var(--e-4) var(--e-6) var(--e-5); }
.aviso-linha { display: flex; gap: 6px; align-items: center; font: var(--t-12) var(--f-texto); color: var(--amarelo-texto); background: var(--amarelo-claro); border-radius: var(--r-sm); padding: 6px var(--e-3); margin: var(--e-3) 0 var(--e-4); }
.aviso-linha svg { width: 14px; height: 14px; flex: none; }
.dev-topo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: var(--e-6); margin-bottom: var(--e-5); }
.dev-motivos { display: grid; gap: 4px; }
.barra-l { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto auto; gap: var(--e-2); align-items: center; font: var(--t-13) var(--f-texto); padding: 4px 0; }
.barra-l > span, .barra-l > a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--tinta); text-decoration: none; }
.barra-l > a:hover { color: var(--azul-texto); text-decoration: underline; }
.barra-l > i { height: 6px; border-radius: var(--r-full); background: linear-gradient(90deg, var(--azul) var(--w), var(--papel-3) var(--w)); }
.barra-l.neg > i { background: linear-gradient(90deg, var(--verm) var(--w), var(--papel-3) var(--w)); }
.barra-l > b { font-size: 13px; min-width: 64px; text-align: right; }
.barra-l > small { font: var(--t-12) var(--f-num); color: var(--tinta-3); min-width: 24px; text-align: right; }
.dev-motivos .barra-l { grid-template-columns: 110px minmax(0, 1fr) auto; }
.rep-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e-3); }
.rep-kpis > div { display: grid; gap: 2px; padding: var(--e-3); border: 1px solid var(--linha); border-radius: var(--r-sm); background: var(--papel-2); }
.rep-kpis b { font: 700 var(--t-16) var(--f-num); letter-spacing: -.03em; }
.rep-semanas { display: grid; gap: 6px; }
.rep-sem { display: grid; grid-template-columns: 48px minmax(0, 1fr) 104px; gap: var(--e-3); align-items: center; font: var(--t-12) var(--f-texto); }
.rep-sem > b { text-align: right; font-size: 13px; }
.rep-barra { display: flex; height: 16px; width: var(--w); min-width: 4px; border-radius: 4px; overflow: hidden; gap: 1px; }
.rep-barra i { display: block; height: 100%; min-width: 2px; }
.rep-leg { margin-top: var(--e-3); }
.rep-contas { list-style: none; margin: 0; padding: 0; }
.rep-contas li { display: grid; grid-template-columns: 140px minmax(0, 1fr) auto; gap: var(--e-3); align-items: baseline; padding: var(--e-2) 0; border-top: 1px solid var(--linha); font: var(--t-13) var(--f-texto); }
.rep-contas li:first-child { border-top: 0; }
.rep-contas a { color: var(--tinta); text-decoration: none; }
.rep-contas a:hover { color: var(--azul-texto); }
.rep-contas span { color: var(--tinta-2); }
table.contas-n td { padding: var(--e-2); vertical-align: top; white-space: normal; }
table.contas-n td:first-child { padding-left: var(--e-6); min-width: 200px; }
table.contas-n td.d { white-space: nowrap; }
table.contas-n .conta-link { margin-right: var(--e-2); }
table.contas-n tr.nv-linha-ruim td:first-child { box-shadow: inset 3px 0 0 var(--verm); }
table.contas-n tr.nv-linha-atencao td:first-child { box-shadow: inset 3px 0 0 var(--amarelo); }
.aviso-pouco { color: var(--amarelo-texto); }
.med-col { min-width: 250px; }
.meds { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3px; }
.med { display: grid; grid-template-columns: 92px minmax(40px, 1fr) 44px; gap: 6px; align-items: center; font: var(--t-11) var(--f-texto); color: var(--tinta-3); cursor: help; }
.med-trilho { position: relative; height: 5px; border-radius: 3px; background: var(--papel-3); }
.med-trilho i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 3px; background: var(--verde); }
.med-trilho b { position: absolute; top: -2px; bottom: -2px; width: 2px; background: var(--tinta-3); border-radius: 1px; }
.med.nv-atencao .med-trilho i { background: var(--amarelo); }
.med.nv-ruim .med-trilho i { background: var(--verm); }
.med.nv-ruim .med-v { color: var(--verm-texto); font-weight: 700; }
.med.nv-sem_dados { opacity: .55; }
.med-v { text-align: right; font-size: 11px; color: var(--tinta-2); }
.alerta-caixa { display: flex; gap: var(--e-3); background: var(--verm-claro); border-radius: var(--r-md); padding: var(--e-3) var(--e-4); margin: var(--e-4) 0; }
.alerta-caixa > svg { width: 18px; height: 18px; flex: none; color: var(--verm-texto); margin-top: 2px; }
.alerta-caixa > div { display: grid; gap: 4px; justify-items: start; }
.alerta-caixa b { font: 600 var(--t-14) var(--f-texto); color: var(--verm-texto); }
.alerta-caixa span { font: var(--t-13) var(--f-texto); color: var(--tinta-2); }
.alerta-caixa.leve { background: var(--amarelo-claro); }
.alerta-caixa.leve > svg, .alerta-caixa.leve b { color: var(--amarelo-texto); }
.prev-dias { display: flex; gap: 3px; align-items: flex-end; height: 120px; padding-bottom: 20px; position: relative; overflow-x: auto; }
.prev-d { flex: 1 0 18px; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 4px; position: relative; }
.prev-d i { width: 100%; max-width: 22px; background: var(--laranja); border-radius: 3px 3px 0 0; opacity: .85; }
.prev-d:hover i { opacity: 1; }
.prev-d span { position: absolute; bottom: -18px; font-size: 10px; color: var(--tinta-3); white-space: nowrap; }
.prev-d:nth-child(odd):not(:first-child) span { visibility: hidden; }
.gx-var { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: var(--e-3); margin-bottom: var(--e-4); }
.gx-var > div { display: grid; gap: 2px; padding: var(--e-3); border: 1px solid var(--linha); border-radius: var(--r-sm); background: var(--papel-2); }
.gx-var b { font: 600 var(--t-14) var(--f-texto); }
.g-rot { display: inline-grid; place-items: center; min-width: 28px; height: 22px; padding: 0 6px; border-radius: var(--r-xs); background: var(--laranja-claro); color: var(--laranja-texto); font: 700 12px var(--f-num); width: max-content; }
.gx-prods { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--e-4); }
.gx-prods > li { border-top: 1px solid var(--linha); padding-top: var(--e-4); }
.gx-pcab { display: flex; gap: var(--e-3); align-items: baseline; flex-wrap: wrap; margin-bottom: var(--e-2); }
.gx-pcab b { font: 600 var(--t-15) var(--f-texto); }
.gx-tot { margin-left: auto; font-weight: 700; }
.gx-ganchos { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--e-2); }
.gancho { border: 1px solid var(--linha); border-radius: var(--r-sm); padding: var(--e-3); display: grid; gap: 6px; align-content: start; background: var(--papel); }
.gancho.venceu { border-color: color-mix(in srgb, var(--verde) 50%, var(--linha)); background: color-mix(in srgb, var(--verde) 5%, var(--papel)); box-shadow: inset 0 3px 0 var(--verde); }
.gancho.pouco { opacity: .7; }
.g-replicar { justify-self: start; margin-top: 2px; }
.g-replicar:disabled { opacity: 1; color: var(--verde-texto); cursor: default; }
.g-cab { display: flex; gap: var(--e-2); align-items: center; }
.g-cab .icone-btn { margin-left: auto; width: 28px; height: 28px; }
.g-cab .icone-btn svg { width: 16px; height: 16px; }
.g-cab .tag svg { width: 12px; height: 12px; }
.g-txt { font: 500 var(--t-13) var(--f-texto); color: var(--tinta); }
.g-est { font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.g-nums { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px var(--e-3); margin: 0; }
.g-nums dt { font: var(--t-11) var(--f-texto); color: var(--tinta-3); }
.g-nums dd { margin: 0; font-size: 13px; font-weight: 700; }
.fl-trilha { margin-bottom: var(--e-4); padding-bottom: var(--e-4); border-bottom: 1px solid var(--linha); }
.trilha-ped { list-style: none; margin: var(--e-2) 0; padding: 0; display: flex; gap: 0; overflow-x: auto; }
.trilha-ped li { position: relative; flex: 1 0 84px; display: grid; justify-items: start; gap: 2px; padding: 14px var(--e-2) 0 0; }
.trilha-ped li::before { content: ""; position: absolute; top: 5px; left: 10px; right: 0; height: 2px; background: var(--linha-forte); }
.trilha-ped li:last-child::before { display: none; }
.tp-ponto { position: absolute; top: 0; left: 0; width: 12px; height: 12px; border-radius: 50%; background: var(--azul); box-shadow: 0 0 0 3px var(--papel); }
.tp-status:has(+ .tp-repasse) .tp-ponto { background: var(--verde); }
.tp-repasse .tp-ponto { background: var(--papel); box-shadow: inset 0 0 0 2px var(--tinta-4), 0 0 0 3px var(--papel); }
.tp-codigo .tp-ponto { background: var(--tinta-3); }
.trilha-ped li.estimada .tp-ponto { background: var(--papel); box-shadow: inset 0 0 0 2px var(--azul), 0 0 0 3px var(--papel); }
.trilha-ped b { font: 600 var(--t-12) var(--f-texto); }
.tp-data { font-size: 12px; color: var(--tinta-3); }
.tp-editar { border: 0; background: none; color: var(--tinta-4); width: 24px; height: 24px; display: grid; place-items: center; border-radius: var(--r-xs); cursor: pointer; padding: 0; }
.tp-editar:hover { color: var(--azul-texto); background: var(--papel-3); }
.tp-editar svg { width: 13px; height: 13px; }
.fl-mais { grid-column: 1 / -1; border-top: 1px solid var(--linha); padding-top: var(--e-3); }
.fl-mais > summary { cursor: pointer; font: 600 var(--t-13) var(--f-texto); color: var(--tinta-2); margin-bottom: var(--e-2); }
.fl-mais .folha-form { margin-top: var(--e-2); }
.fl-cond[hidden] { display: none; }
table.tg .acoes-col .icone-btn:not(.lixo) { color: var(--tinta-4); }
table.tg tr:hover .acoes-col .icone-btn:not(.lixo) { color: var(--tinta-2); }
@media (max-width: 760px) {
  .pn-pad { padding: var(--e-3) var(--e-4) var(--e-4); }
  .dev-topo { grid-template-columns: minmax(0, 1fr); }
  .rep-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rep-contas li { grid-template-columns: minmax(0, 1fr) auto; }
  .rep-contas li span { grid-column: 1 / -1; grid-row: 2; }
  .rep-sem { grid-template-columns: 40px minmax(0, 1fr) 88px; }
  .din-card { padding: var(--e-3) var(--e-4); }
  .meds { grid-template-columns: minmax(0, 1fr); }
}

/* ================= conta de vendedor Amazon (v3 B0) ================= */
.vend { display: grid; gap: var(--e-5); }
.vend-conta { display: grid; gap: var(--e-3); }
.vend-cab { display: flex; justify-content: space-between; align-items: baseline; gap: var(--e-3); flex-wrap: wrap; }
.vend-cab > div { display: flex; align-items: center; gap: var(--e-2); }
.vend-cab b { font: 700 var(--t-16) var(--f-texto); }
.vend-meds { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-3); }
.vm { display: grid; gap: 6px; padding: var(--e-3) var(--e-4); border: 1px solid var(--linha); border-radius: var(--r-sm); background: var(--papel-2); }
.vm .med { grid-template-columns: 120px minmax(60px, 1fr) 52px; font-size: 13px; color: var(--tinta-2); }
.vm .med-v { font-size: 13px; }
.vm .med-trilho { height: 6px; }
.vm-det { font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.vm.nv-ruim { border-color: color-mix(in srgb, var(--verm) 40%, var(--linha)); }
.vm.nv-atencao { border-color: color-mix(in srgb, var(--amarelo) 40%, var(--linha)); }
@media (max-width: 760px) { .vend-meds { grid-template-columns: minmax(0, 1fr); } .vm .med { grid-template-columns: 100px minmax(40px, 1fr) 48px; } }

/* arrastar e soltar no quadro (v3 B3) */
.kcard[draggable=true] { cursor: grab; }
.kcard.arrastando { opacity: .45; cursor: grabbing; }
.quadro .coluna { transition: border-color var(--m-rapido), background var(--m-rapido), opacity var(--m-rapido); }
.quadro .coluna.pode-soltar { border-style: dashed; border-color: color-mix(in srgb, var(--azul) 45%, var(--linha)); }
.quadro .coluna.sobre { border-color: var(--azul); background: color-mix(in srgb, var(--azul) 8%, var(--papel-2)); box-shadow: var(--brilho-ativo); }
.quadro .coluna.nao-solta { opacity: .45; }

/* ---------------------------------------------------------------- fiscal: regime no card (PF / MEI / Simples) */
.regime { display: inline-flex; padding: 2px; gap: 2px; border-radius: var(--r-sm); background: var(--seg-fundo); align-self: flex-start; }
.regime button { font: 600 var(--t-12) var(--f-texto); padding: 3px 9px; border: 0; border-radius: 6px; background: none; color: var(--tinta-3); cursor: pointer; }
.regime button:hover { color: var(--tinta); }
.regime button.on { background: var(--seg-on); color: var(--tinta); box-shadow: var(--s-1); }
.regime button:focus-visible { outline: none; box-shadow: var(--anel-foco); }
.fiscal-card[aria-busy] { opacity: .6; pointer-events: none; }
.din-aj { font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.din-aj:hover { color: var(--azul-texto); }
.pf-meses { display: grid; grid-template-columns: repeat(12, 1fr); gap: 3px; height: 54px; align-items: end; }
.pf-meses span { position: relative; display: flex; flex-direction: column-reverse; height: 100%; padding-bottom: 14px; }
.pf-meses i { display: block; width: 100%; min-height: 0; }
.pf-meses i.a { background: var(--azul); border-radius: 0 0 2px 2px; }
.pf-meses i.t { background: var(--laranja); border-radius: 2px 2px 0 0; }
.pf-meses span::before { content: ""; position: absolute; left: 0; right: 0; bottom: 14px; height: 1px; background: var(--linha); }
.pf-meses em { position: absolute; bottom: 0; left: 0; right: 0; text-align: center; font: normal 10px/12px var(--f-texto); color: var(--tinta-4); }
.pf-meses span.atual em { color: var(--tinta); font-weight: 700; }
.din-l .sw { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 6px; vertical-align: 1px; }
.teto-barra.neutra .feito { background: var(--azul); }
.din-nota { display: flex; gap: 6px; font: var(--t-12) var(--f-texto); color: var(--tinta-2); }
.din-nota svg { width: 14px; height: 14px; flex: none; margin-top: 1px; color: var(--tinta-3); }

/* ================================================================ Estúdio de revisão (v4)
   O palco é sempre uma sala escura (vídeo se julga como no celular); o painel segue o tema. */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
dialog.estudio-dlg { width: 100vw; max-width: 100vw; height: 100vh; height: 100dvh; max-height: 100vh; max-height: 100dvh; margin: 0; border: 0; border-radius: 0; background: var(--papel); overflow: hidden; animation: none; }
dialog.estudio-dlg::backdrop { background: #000; }
.estudio { --palco: #06070C; --palco-2: #10121A; --palco-tinta: #E7E9F0; --palco-mudo: #8B91A3;
  display: grid; height: 100vh; height: 100dvh; grid-template: "topo topo" 60px "palco painel" minmax(0, 1fr) "barra barra" auto / minmax(0, 1fr) 380px; }
.est-topo { grid-area: topo; display: flex; align-items: center; gap: var(--e-3); padding: 0 var(--e-4) 0 var(--e-5); border-bottom: 1px solid var(--linha); background: var(--papel-elev); }
.est-tit { flex: 1; min-width: 0; display: grid; }
.est-tit b { font: 700 var(--t-16) var(--f-titulo); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.est-tit span { font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.est-nav { display: flex; align-items: center; gap: 2px; font: var(--t-13) var(--f-num); color: var(--tinta-3); }
.est-nav .icone-btn:disabled { opacity: .3; cursor: default; }

.est-palco { grid-area: palco; background: var(--palco); color: var(--palco-tinta); display: flex; flex-direction: column; min-height: 0; padding: var(--e-5) var(--e-6) var(--e-4); gap: var(--e-4); }
.est-telas { flex: 1; min-height: 0; display: flex; gap: var(--e-5); justify-content: center; align-items: center; container-type: size;
  --h: min(calc(100cqh - 56px), calc((100cqw - 48px) / 1.38)); }
.est-tela { margin: 0; display: flex; flex-direction: column; gap: var(--e-2); flex: none; width: calc(var(--h) * .72 * 9 / 16); opacity: .6; transition: width var(--m-medio) var(--curva), opacity var(--m-medio); }
.est-tela.on { width: calc(var(--h) * 9 / 16); opacity: 1; }
.est-tela:hover { opacity: .9; }
.est-tela-alvo { padding: 0; border: 0; background: none; cursor: pointer; border-radius: 22px; display: block; width: 100%; }
.est-tela-alvo:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--azul); }
.est-fone { position: relative; display: block; width: 100%; aspect-ratio: 9 / 16; border-radius: 22px; overflow: hidden; background: #000; box-shadow: 0 0 0 1px rgba(255, 255, 255, .09), 0 24px 60px -20px rgba(0, 0, 0, .9); }
.est-tela.on .est-fone { box-shadow: 0 0 0 2px var(--azul), 0 0 0 6px color-mix(in srgb, var(--azul) 22%, transparent), 0 30px 80px -24px rgba(0, 0, 0, .95); }
.est-fone video { width: 100%; height: 100%; object-fit: cover; display: block; }
.est-semvideo { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: var(--e-2); color: var(--palco-mudo); font: var(--t-13) var(--f-texto); text-align: center; padding: var(--e-4); background: var(--palco-2); }
.est-semvideo svg { width: 28px; height: 28px; }
.est-fone-topo { position: absolute; top: 10px; left: 10px; right: 10px; display: flex; justify-content: space-between; align-items: center; pointer-events: none; }
.est-fone-topo kbd { font-size: 15px; line-height: 24px; min-width: 28px; background: rgba(6, 7, 12, .72); color: #fff; border-color: rgba(255, 255, 255, .28); backdrop-filter: blur(6px); }
.est-tela.on .est-fone-topo kbd { background: var(--azul); border-color: var(--azul); }
.est-fone-topo .selo { backdrop-filter: blur(6px); }
.est-fone-topo .selo.parada { background: rgba(6, 7, 12, .72); color: #D9DCE6; border-color: rgba(255, 255, 255, .16); }
.est-fone-topo .selo.falando { background: var(--laranja); color: #fff; }
.est-carimbo { position: absolute; left: 10px; bottom: 10px; font: 700 var(--t-12) var(--f-texto); padding: 3px 8px; border-radius: var(--r-full); background: rgba(6, 7, 12, .78); color: #fff; }
.est-carimbo.et-aprovado { background: var(--btn-verde); }
.est-carimbo.et-reprovado { background: var(--verm); }
.est-tela figcaption { display: grid; gap: 2px; font: var(--t-12) var(--f-texto); color: var(--palco-mudo); max-width: 100%; }
.est-tela figcaption q { color: var(--palco-tinta); font: 500 var(--t-13) var(--f-texto); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; quotes: "“" "”"; }
.est-tela:not(.on) figcaption q { -webkit-line-clamp: 1; }
.est-comp { display: flex; align-items: center; gap: var(--e-3); justify-content: center; font: var(--t-13) var(--f-texto); color: var(--palco-mudo); }
.est-comp p { max-width: 60ch; }
.est-comp-i { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px 2px 3px; border-radius: var(--r-full); background: rgba(255, 255, 255, .06); color: var(--palco-mudo); }
.est-comp-i kbd { background: transparent; color: inherit; border-color: rgba(255, 255, 255, .2); }
.est-comp-i svg { width: 14px; height: 14px; }
.est-comp-i.fala { background: color-mix(in srgb, var(--laranja) 22%, transparent); color: #FFB08C; }

.est-painel { grid-area: painel; overflow-y: auto; border-left: 1px solid var(--linha); background: var(--papel-elev); padding: var(--e-5); display: flex; flex-direction: column; gap: var(--e-4); }
.est-pn-cab { display: flex; gap: 6px; flex-wrap: wrap; }
.est-bloco { border-top: 1px solid var(--linha); padding-top: var(--e-4); display: grid; gap: var(--e-2); }
.est-bloco h3 { font: 700 var(--t-14) var(--f-titulo); }
.est-leg { white-space: pre-line; font: var(--t-14) var(--f-texto); color: var(--tinta-2); }
.est-estado b { font: 700 var(--t-14) var(--f-titulo); text-transform: none; }
.est-estado span { color: var(--tinta-2); font-size: 14px; }
.est-rep textarea { width: 100%; }
.est-bloco[hidden] { display: none; }

.est-barra { grid-area: barra; display: flex; align-items: center; gap: var(--e-4); padding: var(--e-3) var(--e-5) calc(var(--e-3) + env(safe-area-inset-bottom)); border-top: 1px solid var(--linha); background: var(--papel-elev); }
.est-barra .btn { min-height: 44px; }
.est-barra .btn kbd { margin-left: 4px; background: transparent; color: inherit; border-color: currentColor; opacity: .55; }
.est-barra [data-est-ok] { margin-left: auto; min-width: 240px; justify-content: center; }
.est-teclas { flex: 1; text-align: center; font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.est-teclas kbd { margin: 0 1px; }
@media (prefers-reduced-motion: reduce) { .est-tela { transition: none; } }
.est-gesto, .est-veu, .est-cel { display: none; }
.est-comp-i { border: 0; font: inherit; cursor: pointer; }
.est-comp-i.on { box-shadow: 0 0 0 1px var(--azul); color: var(--palco-tinta); }
.est-comp-i:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--azul); }
@media (max-width: 760px) {
  /* celular: tela cheia, vídeo inteiro, gesto de arrastar e barra fixa; o painel vira folha de baixo */
  .est-cel { display: initial; }
  .estudio { position: relative; grid-template: "topo" 52px "palco" minmax(0, 1fr) "barra" auto / 100%; overflow: hidden; }
  .est-topo { padding: 0 var(--e-2) 0 var(--e-3); gap: var(--e-2); }
  .est-tit span { display: none; }
  .est-nav .num { font-size: 12px; }
  .est-palco { padding: var(--e-2) var(--e-2) var(--e-3); gap: var(--e-2); touch-action: pan-y; position: relative; overflow: hidden; }
  .est-tela:not(.on) { display: none; }
  .est-telas { --h: calc(100cqh - 44px); }
  .est-tela figcaption { padding: 0 var(--e-1); }
  .est-tela figcaption q { -webkit-line-clamp: 1; }
  .est-fone { transition: transform var(--m-medio) var(--curva); touch-action: pan-y; }
  .est-palco[data-gesto] .est-fone { transition: none; }
  .est-comp { justify-content: center; }
  .est-comp p { display: none; }
  .est-comp-i { padding: 6px 12px 6px 6px; font: 600 var(--t-13) var(--f-texto); min-height: 36px; }
  .est-gesto { display: flex; position: absolute; inset: 0; justify-content: space-between; align-items: flex-start; padding: 64px var(--e-4) 0; pointer-events: none; }
  .est-gesto span { display: inline-flex; gap: 6px; align-items: center; font: 800 var(--t-20) var(--f-titulo); color: #fff; padding: 6px 14px; border-radius: var(--r-md); opacity: 0; transform: scale(.9); transition: opacity 80ms; }
  .est-gesto svg { width: 20px; height: 20px; }
  .est-gesto .g-ok { background: var(--btn-verde); transform: rotate(-8deg); order: 0; }
  .est-gesto .g-rep { background: var(--verm); transform: rotate(8deg); order: 1; }
  .est-palco[data-gesto="ok"] .g-ok, .est-palco[data-gesto="rep"] .g-rep { opacity: var(--gesto, 0); }
  .est-painel { position: absolute; left: 0; right: 0; bottom: 0; z-index: 5; max-height: 78%; border: 0; border-top: 1px solid var(--linha); border-radius: var(--r-lg) var(--r-lg) 0 0;
    box-shadow: 0 -24px 60px -12px rgba(0, 0, 0, .6); transform: translateY(105%); transition: transform var(--m-lento) var(--curva); padding: 0 var(--e-4) calc(84px + env(safe-area-inset-bottom)); visibility: hidden; }
  .estudio[data-folha="aprovar"] .est-painel, .estudio[data-folha="reprovar"] .est-painel, .estudio[data-folha="detalhes"] .est-painel { transform: none; visibility: visible; }
  .est-folha-cab { display: flex; position: sticky; top: 0; z-index: 1; justify-content: center; align-items: center; padding: var(--e-2) 0; background: var(--papel-elev); margin: 0 calc(-1 * var(--e-4)); }
  .est-folha-cab i { width: 40px; height: 4px; border-radius: var(--r-full); background: var(--linha-forte); }
  .est-folha-cab .icone-btn { position: absolute; right: var(--e-2); }
  .est-veu { display: block; position: absolute; inset: 0; z-index: 4; background: var(--backdrop); opacity: 0; pointer-events: none; transition: opacity var(--m-medio); }
  .estudio[data-folha="aprovar"] .est-veu, .estudio[data-folha="reprovar"] .est-veu, .estudio[data-folha="detalhes"] .est-veu { opacity: 1; pointer-events: auto; }
  .estudio[data-folha="aprovar"] .est-rep { display: none; }
  .est-barra { position: relative; z-index: 6; gap: var(--e-2); padding: var(--e-2) var(--e-3) calc(var(--e-2) + env(safe-area-inset-bottom)); }
  .est-teclas, .est-barra kbd { display: none; }
  .est-barra .btn { min-height: 48px; padding-left: var(--e-3); padding-right: var(--e-3); }
  .est-barra [data-est-rep] { flex: 1; justify-content: center; }
  .est-barra [data-est-det] { flex: none; display: inline-flex; }
  .est-barra [data-est-ok] { min-width: 0; flex: 1.5; margin-left: 0; }
}
@media (max-width: 760px) and (prefers-reduced-motion: reduce) { .est-painel, .est-fone { transition: none; } }
/* estúdio: legenda revisável + checklist de conformidade */
.est-legenda label { font: 600 var(--t-12) var(--f-texto); color: var(--tinta-3); display: inline-flex; gap: 6px; align-items: center; }
.est-leg-acoes { display: inline-flex; gap: 4px; }
.est-legenda textarea { width: 100%; font: var(--t-14) var(--f-texto); resize: vertical; min-height: 128px; }
.est-leg-rod { display: flex; justify-content: space-between; gap: var(--e-2); font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.check { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.check li { display: grid; grid-template-columns: 20px 1fr; gap: var(--e-2); align-items: start; font: var(--t-13) var(--f-texto); }
.check li b { font-weight: 500; color: var(--tinta); }
.check li small { display: block; color: var(--tinta-3); font-size: 12px; line-height: 16px; }
.check-ic { width: 20px; height: 20px; border-radius: var(--r-full); display: grid; place-items: center; }
.check-ic svg { width: 12px; height: 12px; }
.check li.ok .check-ic { background: color-mix(in srgb, var(--verde) 16%, transparent); color: var(--verde-texto); }
.check li.aviso .check-ic { background: var(--amarelo-claro); color: var(--amarelo-texto); }
.check li.bloq .check-ic { background: var(--verm-claro); color: var(--verm-texto); }
.check li.bloq b { color: var(--verm-texto); font-weight: 600; }
.est-bloq { display: flex; gap: 6px; font: 600 var(--t-13) var(--f-texto); color: var(--verm-texto); }
.est-bloq svg { width: 16px; height: 16px; flex: none; margin-top: 2px; }
.est-bloco h3 .tag { margin-left: 6px; vertical-align: 1px; }
.cd-check { border: 1px solid var(--linha); border-radius: var(--r-md); padding: var(--e-3) var(--e-4); display: grid; gap: var(--e-2); }
.cd-check h3 { font: 700 var(--t-14) var(--f-titulo); }
.motivos { display: flex; flex-wrap: wrap; gap: 6px; }
.motivos .chip[aria-pressed="true"] { background: var(--verm-claro); color: var(--verm-texto); border-color: color-mix(in srgb, var(--verm) 45%, transparent); }

/* ---------------------------------------------------------------- prévia do perfil (feed TikTok) */
.perfil-previa { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 400px)); gap: var(--e-6); justify-content: center; }
.pf-fone { border: 1px solid var(--linha); border-radius: 28px; overflow: hidden; background: var(--papel); box-shadow: var(--s-2); }
.pf-cab { display: grid; justify-items: center; text-align: center; gap: 6px; padding: var(--e-6) var(--e-5) var(--e-4); }
.pf-cab .avatar { box-shadow: 0 0 0 3px var(--papel), 0 0 0 4px var(--linha-forte); }
.pf-cab .avatar b { font-size: 32px; }
.pf-handle { font: 700 var(--t-16) var(--f-texto); }
.pf-nome { font: var(--t-13) var(--f-texto); color: var(--tinta-3); }
.pf-nums { display: flex; gap: var(--e-5); margin: var(--e-2) 0 0; }
.pf-nums div { display: grid; }
.pf-nums dd { margin: 0; font: 700 var(--t-16) var(--f-num); order: -1; }
.pf-nums dt { font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.pf-bio { font: var(--t-13) var(--f-texto); color: var(--tinta-2); max-width: 32ch; }
.pf-abas { display: flex; justify-content: center; border-bottom: 1px solid var(--linha); }
.pf-abas span { padding: var(--e-2) var(--e-8); border-bottom: 2px solid var(--tinta); color: var(--tinta); }
.pf-abas svg { width: 18px; height: 18px; display: block; }
.pf-grade { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; background: var(--papel); }
.pf-item a { position: relative; display: block; aspect-ratio: 3 / 4; overflow: hidden; background: var(--papel-3); }
.pf-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pf-item i { position: absolute; inset: 0; display: grid; place-items: center; color: var(--tinta-4); }
.pf-item a::after { content: ""; position: absolute; inset: 50% 0 0; background: linear-gradient(transparent, rgba(0, 0, 0, .55)); pointer-events: none; }
.pf-sel { position: absolute; left: 6px; bottom: 5px; z-index: 1; display: inline-flex; align-items: center; gap: 3px; color: #fff; font: 700 12px/16px var(--f-texto); text-shadow: 0 1px 2px rgba(0, 0, 0, .6); }
.pf-sel svg { width: 12px; height: 12px; }
.pf-sel.ag { background: rgba(43, 84, 244, .92); padding: 1px 6px; border-radius: var(--r-xs); text-shadow: none; font-family: var(--f-num); font-weight: 400; font-size: 11px; }
.pf-item.t-agendado img { filter: saturate(.75); }
.pf-item.t-agendado a { outline: 2px dashed color-mix(in srgb, var(--azul) 70%, transparent); outline-offset: -2px; }
.pf-item.t-erro .pf-sel.ag { background: var(--verm); }
.pf-venc { position: absolute; right: 5px; top: 5px; z-index: 1; width: 22px; height: 22px; border-radius: var(--r-full); background: var(--laranja); color: #fff; display: grid; place-items: center; }
.pf-venc svg { width: 13px; height: 13px; }
.pf-vazio { padding: var(--e-8) var(--e-5); text-align: center; color: var(--tinta-3); font: var(--t-13) var(--f-texto); }

/* ---------------------------------------------------------------- aprovar em lote + distribuir */
.lote .painel-cab { align-items: flex-start; gap: var(--e-4); }
.lote-acoes { display: flex; gap: var(--e-2); flex: none; }
.lote-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: var(--e-5); }
.lote-perfil { display: flex; align-items: center; gap: var(--e-2); font: 700 var(--t-14) var(--f-titulo); margin-bottom: var(--e-2); }
.lote-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; max-height: 420px; overflow-y: auto; }
.lote-l label { display: grid; grid-template-columns: 18px 30px minmax(0, 1fr) auto; gap: var(--e-3); align-items: center; padding: 6px var(--e-2); border-radius: var(--r-sm); cursor: pointer; }
.lote-l label:hover { background: var(--papel-2); }
.lote-l:has(input:checked) label { background: color-mix(in srgb, var(--azul) 8%, var(--papel)); }
.lote-l.bloq label { cursor: not-allowed; opacity: .7; }
.lote-l input { accent-color: var(--azul); width: 16px; height: 16px; margin: 0; }
.lote-th { width: 30px; height: 40px; border-radius: 4px; overflow: hidden; background: var(--papel-3); }
.lote-th img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lote-info { display: grid; min-width: 0; }
.lote-info b { font: 600 var(--t-13) var(--f-texto); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lote-info span { font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.lote-rod { display: flex; align-items: center; justify-content: flex-end; gap: var(--e-3); margin-top: var(--e-4); padding-top: var(--e-4); border-top: 1px solid var(--linha); }
.lote-rod > span { margin-right: auto; font: var(--t-13) var(--f-texto); color: var(--tinta-3); }
.lote-plano { margin-top: var(--e-5); border: 1px solid color-mix(in srgb, var(--azul) 35%, var(--linha)); border-radius: var(--r-md); padding: var(--e-4) var(--e-5); background: color-mix(in srgb, var(--azul) 4%, var(--papel)); display: grid; gap: var(--e-4); }
.lote-plano-cab h3 { font: 700 var(--t-16) var(--f-titulo); }
.lote-plano-cab p { font: var(--t-13) var(--f-texto); color: var(--tinta-2); }
.lp-dia { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: var(--e-3); align-items: start; padding-top: var(--e-3); border-top: 1px solid var(--linha); }
.lp-dia > b { font: 700 var(--t-13) var(--f-texto); padding-top: 8px; }
.lp-dia > b .num { font-weight: 400; color: var(--tinta-3); }
.lp-perfis { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--e-3); }
.lp-dia ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; align-content: start; }
.lp-dia li { display: grid; grid-template-columns: 64px minmax(0, 1fr) 32px; gap: var(--e-2); align-items: center; background: var(--papel); border: 1px solid var(--linha); border-radius: var(--r-sm); padding: 4px 4px 4px 6px; }
.lp-hora { width: 64px; border: 1px solid var(--linha-forte); border-radius: var(--r-xs); background: var(--campo-fundo); padding: 4px 6px; text-align: center; font: var(--t-13) var(--f-num); }
.lp-hora:focus { outline: none; border-color: var(--azul); box-shadow: var(--anel-foco); }
.lp-prod { display: flex; gap: var(--e-2); align-items: center; min-width: 0; }
.lp-prod img { width: 24px; height: 32px; object-fit: cover; border-radius: 3px; flex: none; }
.lp-prod span { display: grid; min-width: 0; }
.lp-prod b { font: 600 var(--t-13) var(--f-texto); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lp-prod em { font: normal var(--t-12) var(--f-texto); color: var(--tinta-3); }
.lp-ign { margin: var(--e-2) 0 0; padding-left: var(--e-4); font: var(--t-12) var(--f-texto); color: var(--tinta-2); display: grid; gap: 2px; }
.lote-plano .lote-rod { margin-top: 0; }
@media (max-width: 760px) {
  .lote .painel-cab { flex-direction: column; }
  .lp-dia { grid-template-columns: 1fr; gap: 4px; }
  .lp-dia > b { padding-top: 0; }
}

/* ---------------------------------------------------------------- painel da fábrica */
.fabrica + .painel { margin-top: var(--e-4); }
.fab-inst { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--linha); border-radius: var(--r-md); overflow: hidden; }
.fab-i { display: grid; gap: 4px; align-content: start; padding: var(--e-4); border-left: 1px solid var(--linha); }
.fab-i:first-child { border-left: 0; }
.fab-i > b { font: 700 var(--t-24) var(--f-num); letter-spacing: -.03em; }
.fab-i > b small { font-size: 15px; color: var(--tinta-3); font-weight: 400; }
.fab-sub { font: var(--t-12) var(--f-texto); color: var(--tinta-3); display: flex; gap: 4px; align-items: flex-start; }
.fab-sub svg { width: 14px; height: 14px; flex: none; margin-top: 1px; }
.fab-i.alerta { background: var(--amarelo-claro); }
.fab-i.alerta .fab-sub { color: var(--amarelo-texto); font-weight: 600; }
.fab-veo { display: grid; grid-template-columns: repeat(4, 1fr); gap: 3px; max-width: 120px; }
.fab-veo i { height: 6px; border-radius: 2px; background: var(--papel-3); }
.fab-veo i.on { background: var(--laranja); }
.fab-listas { margin-top: var(--e-5); align-items: start; }
.fab-h { font: 700 var(--t-14) var(--f-titulo); display: flex; align-items: center; gap: var(--e-2); margin-bottom: var(--e-2); }
.fab-fila, .fab-erros { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.fab-fila li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: var(--e-3); align-items: start; padding: 6px 0; border-top: 1px solid var(--linha); }
.fab-fila li:first-child { border-top: 0; }
.fab-fila span { display: grid; min-width: 0; }
.fab-fila q { font: var(--t-13) var(--f-texto); quotes: "“" "”"; }
.fab-fila em, .fab-erros em { font: normal var(--t-11) var(--f-num); color: var(--tinta-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fab-erros li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--e-2); align-items: baseline; padding: 6px 0; border-top: 1px solid var(--linha); font: var(--t-13) var(--f-texto); }
.fab-erros li:first-child { border-top: 0; }
.fab-erros li > span:nth-child(2) { overflow-wrap: anywhere; }
@media (max-width: 900px) { .fab-inst { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fab-i:nth-child(3) { border-left: 0; } .fab-i:nth-child(n+3) { border-top: 1px solid var(--linha); } }
.fab-vezes { font: 600 var(--t-11) var(--f-num); color: var(--tinta-3); }

/* ---------------------------------------------------------------- desempenho do vídeo postado */
.selo.vencedor { background: var(--laranja); color: #fff; }
.kc-desemp { font: var(--t-11) var(--f-num); color: var(--tinta-2); }
.metr-video.m5 { grid-template-columns: 1fr .8fr 1.4fr 1fr 1.2fr; }
.postado-box { flex-wrap: wrap; }
.var-comp { display: grid; gap: 2px; border: 1px solid var(--linha); border-radius: var(--r-md); padding: var(--e-3) var(--e-4); }
.var-comp .barra-l { grid-template-columns: 110px minmax(0, 1fr) auto; }
.var-comp .barra-l.eu > span { font-weight: 700; }
@media (max-width: 760px) {
  .metr-video.m5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .metr-video.m5 > div { border-left: 0 !important; border-top: 0 !important; }
}
.metr-video.m5 b { font-size: 14px; white-space: nowrap; }
.metr-video.m5 > div { padding: var(--e-2); min-width: 0; }
@media (max-width: 760px) {
  .estudio[data-folha="aprovar"] .est-barra [data-est-rep], .estudio[data-folha="aprovar"] .est-barra [data-est-det],
  .estudio[data-folha="reprovar"] .est-barra [data-est-ok], .estudio[data-folha="reprovar"] .est-barra [data-est-det] { display: none; }
  .estudio[data-folha="reprovar"] .est-barra [data-est-rep] { background: var(--btn-perigo); color: #fff; border-color: transparent; }
  .estudio[data-folha="reprovar"] .est-painel > :not(.est-folha-cab):not(.est-pn-cab):not(.est-rep) { display: none; }
  .estudio[data-folha="reprovar"] .est-rep { border-top: 0; padding-top: var(--e-2); }
  .est-rep .decidir-bts { display: none; }
  .est-painel .est-pn-cab { margin-top: 0; }
}

/* ================= v5 · multiusuário: conta, faixa "vendo como", área admin ================= */
.login-rodape { margin: var(--e-1) 0 0; color: var(--tinta-3); font: var(--t-13) var(--f-texto); text-align: center; }
.login input[readonly] { color: var(--tinta-2); background: var(--papel-2); }

/* avatar: iniciais num disco azul; admin ganha anel laranja */
.avatar { width: 32px; height: 32px; flex: none; border-radius: 50%; display: inline-grid; place-items: center; background: color-mix(in srgb, var(--azul) 22%, var(--papel)); color: var(--azul-texto); font: 700 12px/1 var(--f-titulo); letter-spacing: .02em; }
.avatar.adm { box-shadow: 0 0 0 2px var(--fundo), 0 0 0 3.5px var(--laranja); }
.avatar.peq { width: 26px; height: 26px; font-size: 11px; }
.lat-conta { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 48px; margin-top: var(--e-1); padding: var(--e-2) 8px; border-radius: var(--r-sm); border: 1px solid var(--linha); background: var(--papel); color: var(--tinta); cursor: pointer; text-align: left; }
.lat-conta:hover { border-color: var(--linha-forte); background: var(--papel-3); }
.lat-conta:focus-visible { outline: none; box-shadow: var(--anel-foco); }
.conta-txt { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.conta-txt b { font: 600 var(--t-13) var(--f-texto); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conta-txt small { font: var(--t-11) var(--f-texto); color: var(--tinta-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.conta-seta svg { width: 14px; height: 14px; color: var(--tinta-3); transform: rotate(180deg); }
body.lat-recolhida .lat-conta { justify-content: center; padding: var(--e-2) 0; border-color: transparent; background: none; }
@media (max-width: 960px) and (min-width: 761px) { body:not(.lat-recolhida) .lat-conta { justify-content: center; padding: var(--e-2) 0; border-color: transparent; background: none; } }
.b-conta2 { width: 40px; }

/* faixa "Vendo como": listras âmbar diagonais = vidro de vitrine, não dá pra mexer */
.faixa-leitura { position: sticky; top: 0; z-index: 25; display: flex; align-items: center; gap: var(--e-3); padding: var(--e-2) var(--e-6);
  background: repeating-linear-gradient(-45deg, color-mix(in srgb, var(--amarelo) 26%, var(--fundo)) 0 14px, color-mix(in srgb, var(--amarelo) 16%, var(--fundo)) 14px 28px);
  border-bottom: 1px solid color-mix(in srgb, var(--amarelo) 55%, var(--fundo)); color: var(--tinta); }
.faixa-leitura p { margin: 0; flex: 1; min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px var(--e-2); font: var(--t-14) var(--f-texto); }
.faixa-leitura b { font: 700 var(--t-15) var(--f-titulo); }
.fl-email { color: var(--tinta-2); font-size: 13px; }
.fl-modo { font: 700 var(--t-11) var(--f-texto); padding: 2px var(--e-2); border-radius: var(--r-full); background: var(--amarelo); color: #2A1D00; }
.fl-olho { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--amarelo); color: #2A1D00; flex: none; }
.fl-olho svg { width: 18px; height: 18px; }
body.vendo-como .topo { top: 49px; }
body.vendo-como #b-lancar, body.vendo-como .boas-vindas .acoes-linha { display: none; }

/* lista de usuários */
.usuarios { list-style: none; margin: 0; padding: 0; }
.usr { display: grid; grid-template-columns: minmax(200px, 1.5fr) 200px 236px minmax(120px, 1fr) 160px; align-items: center; gap: var(--e-4); padding: var(--e-4) var(--e-6); border-bottom: 1px solid var(--linha); }
.usr:last-child { border-bottom: 0; }
.usr.pausado .usr-quem, .usr.pausado .usr-mods { opacity: .55; }
.usr-quem { display: flex; align-items: center; gap: var(--e-3); min-width: 0; }
.usr-nome { display: flex; flex-direction: column; min-width: 0; }
.usr-nome b { font: 600 var(--t-15) var(--f-texto); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.usr-nome span { font: var(--t-13) var(--f-texto); color: var(--tinta-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.voce { font: 600 var(--t-11) var(--f-texto); color: var(--laranja-texto); margin-left: 4px; }
.usr-st { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.usr-st .tag svg { width: 12px; height: 12px; }
.usr-st .dica { flex-basis: 100%; font-size: 12px; }
.usr-mods { justify-self: start; display: inline-flex; padding: 3px; gap: 2px; border-radius: var(--r-sm); background: var(--seg-fundo); }
.mod-tg { border: 0; background: none; color: var(--tinta-3); font: 600 var(--t-12) var(--f-texto); padding: 5px 10px; border-radius: var(--r-xs); cursor: pointer; text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--tinta-3) 60%, transparent); }
.mod-tg.on { background: var(--seg-on); color: var(--tinta); text-decoration: none; box-shadow: var(--s-1); }
.mod-tg:hover { color: var(--tinta); }
.mod-tg:focus-visible { outline: none; box-shadow: var(--anel-foco); }
.usr-acesso { display: flex; flex-direction: column; font: var(--t-13) var(--f-texto); color: var(--tinta-2); }
.usr-acesso .dica { font-size: 12px; }
.usr-acoes { display: flex; align-items: center; gap: var(--e-1); justify-content: flex-end; }
.rodape-adm { margin-top: var(--e-3); }

/* folhas do admin */
.form-conv { display: grid; gap: var(--e-4); }
.form-conv fieldset { border: 0; padding: 0; margin: 0; }
.form-conv legend { font: 600 var(--t-12) var(--f-texto); color: var(--tinta-2); margin-bottom: 6px; padding: 0; }
.form-conv .erro:not(:empty), .excluir-aviso .erro:not(:empty) { display: flex; gap: var(--e-2); align-items: center; background: var(--verm-claro); color: var(--verm-texto); border-radius: var(--r-sm); padding: var(--e-2) var(--e-3); font: 600 13px/20px var(--f-texto); }
.form-conv .erro svg, .excluir-aviso .erro svg { width: 16px; height: 16px; flex: none; }
.link-convite p { margin: 0 0 var(--e-3); color: var(--tinta-2); }
.link-caixa { display: flex; gap: var(--e-2); margin-bottom: var(--e-3); }
.link-caixa input { flex: 1; min-width: 0; font: 13px/20px var(--f-num); }
.excluir-aviso { display: grid; gap: var(--e-3); }
.excluir-aviso p { margin: 0; color: var(--tinta-2); }

/* todos os negócios: total + faixa de participação */
.neg-heroi { display: grid; grid-template-columns: minmax(260px, 1fr) 1.4fr; gap: var(--e-6); padding: var(--e-6); align-items: center; margin-bottom: var(--e-4); }
.neg-total { display: flex; flex-direction: column; gap: var(--e-1); }
.neg-valor { font: 700 var(--t-48) var(--f-num); letter-spacing: -.05em; color: var(--tinta); }
.neg-valor.neg, .neg-tab .neg { color: var(--verm-texto); }
.part { display: flex; height: 40px; gap: 3px; border-radius: var(--r-sm); overflow: hidden; }
.part-seg { background: var(--c); min-width: 6px; position: relative; }
.part-seg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255,255,255,.18), transparent 60%); }
.part-leg { list-style: none; display: flex; flex-wrap: wrap; gap: var(--e-2) var(--e-4); margin: var(--e-3) 0 0; padding: 0; font: var(--t-13) var(--f-texto); color: var(--tinta-2); }
.part-leg li { display: inline-flex; align-items: center; gap: 6px; }
.part-leg i { width: 10px; height: 10px; border-radius: 3px; background: var(--c); }
.part-leg b { color: var(--tinta); font-size: 12px; }
.tabela-rolo { overflow-x: auto; }
.neg-tab td { padding: var(--e-3) var(--e-2); }
.neg-tab .forte { font-weight: 700; color: var(--tinta); }
.neg-tab tfoot td { font-weight: 700; border-bottom: 0; padding: var(--e-3) var(--e-2); background: var(--papel-2); }
.neg-tab tfoot td:first-child { padding-left: var(--e-4); }
.neg-tab tr.pausado td, .neg-tab tr.convidado td { color: var(--tinta-3); }

/* registro de atividade */
.aud-filtros { display: grid; grid-template-columns: 220px 200px 1fr; gap: var(--e-3); padding: var(--e-4) var(--e-6); border-bottom: 1px solid var(--linha); }
.aud { list-style: none; margin: 0; padding: var(--e-2) 0; }
.aud-l { display: grid; grid-template-columns: 100px 180px 1fr auto; gap: var(--e-3); align-items: baseline; padding: var(--e-2) var(--e-6); border-bottom: 1px solid color-mix(in srgb, var(--linha) 60%, transparent); font: var(--t-14) var(--f-texto); }
.aud-l:last-child { border-bottom: 0; }
.aud-l time { font-size: 12px; color: var(--tinta-3); }
.aud-l .tag { justify-self: start; }
.aud-txt { min-width: 0; color: var(--tinta-2); overflow-wrap: anywhere; }
.aud-txt b { color: var(--tinta); font-weight: 600; }
.aud-txt code { font: 11px/16px var(--f-num); color: var(--tinta-3); margin-left: 4px; }
.aud-ip { font-size: 11px; color: var(--tinta-4); }

@media (max-width: 1100px) {
  .usr { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "quem acoes" "st st" "mods acesso"; gap: var(--e-2) var(--e-3); }
  .usr-quem { grid-area: quem; } .usr-acoes { grid-area: acoes; } .usr-st { grid-area: st; } .usr-mods { grid-area: mods; justify-self: start; } .usr-acesso { grid-area: acesso; text-align: right; }
}
@media (max-width: 760px) {
  .faixa-leitura { position: static; padding: var(--e-2) var(--e-4); gap: var(--e-2); }
  .faixa-leitura .fl-email { display: none; }
  .faixa-leitura .btn { padding: 0 var(--e-2); font-size: 12px; }
  .fl-olho { display: none; }
  body.vendo-como .topo { top: 0; }
  .usr { padding: var(--e-4); grid-template-areas: "quem acoes" "st st" "mods mods" "acesso acesso"; }
  .usr-acesso { text-align: left; flex-direction: row; gap: var(--e-2); }
  .usr-acoes .btn span { display: none; }
  .neg-heroi { grid-template-columns: 1fr; padding: var(--e-5) var(--e-4); gap: var(--e-4); }
  .neg-valor { font-size: 36px; line-height: 40px; }
  .aud-filtros { grid-template-columns: 1fr 1fr; padding: var(--e-4); }
  .aud-filtros .au-busca { grid-column: 1 / -1; }
  .aud-l { grid-template-columns: auto 1fr; padding: var(--e-3) var(--e-4); gap: var(--e-1) var(--e-2); }
  .aud-l time { grid-column: 1; } .aud-l .tag { grid-column: 2; justify-self: end; }
  .aud-txt { grid-column: 1 / -1; } .aud-ip { display: none; }
  .link-caixa { flex-direction: column; }
}
/* Início com menos módulos: quantas colunas de indicador a conta tem (no celular segue a grade 2×2) */
@media (min-width: 761px) { .kpis.k4[style*="--n"] { grid-template-columns: repeat(var(--n), minmax(0, 1fr)); } }

/* ---------------------------------------------------------------- Integração Amazon (SP-API) */
/* a "ponte": Amazon ●──● Painel. O fio diz o estado: tracejado = desligado, azul = ok, vermelho partido = erro,
   e só anda (um pulso correndo) enquanto a busca roda — o único movimento da tela. */
.ponte { padding: var(--e-6); display: grid; gap: var(--e-5); }
.ponte-linha { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--e-4); }
.ponte-no { display: flex; flex-direction: column; gap: 2px; }
.ponte-no.dir { text-align: right; }
.ponte-no b { font: 700 var(--t-20) var(--f-titulo); letter-spacing: -.01em; }
.ponte-no small { font: var(--t-13) var(--f-texto); color: var(--tinta-3); }
.ponte-fio { position: relative; height: 12px; display: flex; align-items: center; }
.ponte-fio::before, .ponte-fio::after { content: ""; width: 12px; height: 12px; border-radius: 50%; background: var(--fio, var(--linha-forte)); flex: none; }
.ponte-fio i { flex: 1; height: 2px; margin: 0 -1px; background: var(--fio, var(--linha-forte)); position: relative; overflow: hidden; }
.ponte-off .ponte-fio i { background: repeating-linear-gradient(90deg, var(--linha-forte) 0 8px, transparent 8px 14px); }
.ponte-ok, .ponte-rodando { --fio: var(--azul); }
.ponte-erro { --fio: var(--verm); }
.ponte-erro .ponte-fio i { background: linear-gradient(90deg, var(--verm) 0 44%, transparent 44% 56%, var(--verm) 56%); }
.ponte-rodando .ponte-fio i::after { content: ""; position: absolute; inset: -3px auto -3px 0; width: 22%; border-radius: 4px;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--azul) 30%, #fff), transparent); animation: ponte-corre 1.4s var(--curva) infinite; }
@keyframes ponte-corre { from { transform: translateX(-100%); } to { transform: translateX(460%); } }
@media (prefers-reduced-motion: reduce) { .ponte-rodando .ponte-fio i::after { animation: none; left: 39%; } }
.ponte-frase { font: 500 var(--t-16) var(--f-texto); max-width: 70ch; }
.ponte-erro .ponte-frase { color: var(--verm-texto); }
.ponte-acoes { display: flex; flex-wrap: wrap; gap: var(--e-2); }
.ponte-acoes .perigo-txt { color: var(--verm-texto); margin-left: auto; }

.integ-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--e-8); }
.integ-form form { display: grid; gap: var(--e-4); align-content: start; }
.integ-form input { font-family: var(--f-num); font-size: 13px; }
.integ-passos { display: grid; gap: var(--e-3); padding-left: var(--e-5); font: var(--t-14) var(--f-texto); color: var(--tinta-2); max-width: 62ch; }
.integ-passos li::marker { font: 700 var(--t-13) var(--f-num); color: var(--azul-texto); }
.integ-passos b { color: var(--tinta); }

.integ-fila { display: flex; align-items: center; gap: var(--e-4); padding: var(--e-4) var(--e-6); text-decoration: none; color: inherit;
  border-color: color-mix(in srgb, var(--amarelo) 45%, var(--linha)); }
.integ-fila > span:nth-child(2) { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.integ-fila > svg { width: 20px; height: 20px; flex: none; color: var(--tinta-3); }
.integ-fila small { color: var(--tinta-3); font: var(--t-13) var(--f-texto); }
.integ-fila:hover { background: var(--papel-2); }
.integ-fila:focus-visible { outline: none; box-shadow: var(--anel-foco); }

.integ-log { list-style: none; display: grid; gap: 0; padding: 0; margin: 0; }
.integ-log > li { display: grid; grid-template-columns: 12px 1fr; gap: var(--e-3); padding-bottom: var(--e-4); position: relative; }
.integ-log > li:not(:last-child)::before { content: ""; position: absolute; left: 5px; top: 14px; bottom: 0; width: 2px; background: var(--linha); }
.integ-log-ponto { width: 12px; height: 12px; border-radius: 50%; margin-top: 4px; background: var(--verde); }
.integ-log .erro .integ-log-ponto { background: var(--verm); }
.integ-log .rodando .integ-log-ponto { background: var(--azul); }
.integ-log p { font: var(--t-14) var(--f-texto); }
.integ-log-msg { color: var(--tinta-2); }
.integ-log .erro .integ-log-msg { color: var(--verm-texto); }
.integ-log details { margin-top: var(--e-1); font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.integ-log details li { font-size: 12px; word-break: break-all; }
.integ-regras { display: grid; gap: var(--e-4); }
.integ-regras p { font: var(--t-14) var(--f-texto); color: var(--tinta-2); }
.integ-regras .pn-h3 { margin-bottom: var(--e-1); }

/* selo "via Amazon" e fila Completar custo */
.selo-amz { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: var(--r-xs); background: var(--azul-claro);
  color: var(--azul-texto); font: 800 13px/1 var(--f-titulo); margin-right: 4px; vertical-align: -4px; }
td.falta-custo { box-shadow: inset 0 -2px 0 var(--amarelo); }
.custo-fila { list-style: none; padding: 0; margin: var(--e-4) 0 0; }
.custo-fila li { display: grid; grid-template-columns: minmax(0, 2.2fr) 84px 76px 120px minmax(0, 1fr) 92px auto; gap: var(--e-4); align-items: end;
  padding: var(--e-4) var(--e-6); border-top: 1px solid var(--linha); transition: opacity var(--m-medio) var(--curva), transform var(--m-medio) var(--curva); }
.custo-fila li:focus-within { background: var(--papel-2); }
.custo-fila li.feito { opacity: 0; transform: translateX(12px); }
.custo-ped { display: flex; flex-direction: column; gap: 2px; min-width: 0; align-self: center; }
.custo-ped b { font: 600 var(--t-14) var(--f-texto); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.custo-ped small, .custo-num small { font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.custo-num { display: flex; flex-direction: column; gap: 6px; text-align: right; padding-bottom: 10px; }
@media (max-width: 760px) {
  .integ-form { grid-template-columns: 1fr; gap: var(--e-6); }
  .ponte { padding: var(--e-5) var(--e-4); }
  .ponte-no b { font-size: 15px; }
  .ponte-acoes .perigo-txt { margin-left: 0; }
  .custo-fila li { grid-template-columns: 1fr 1fr; gap: var(--e-3); padding: var(--e-4); }
  .custo-ped { grid-column: 1 / -1; }
  .custo-num { text-align: left; padding-bottom: 0; }
  .custo-fila li .btn { min-height: 44px; align-self: end; }
  .cab-pagina .abas { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
}
@media (prefers-reduced-motion: reduce) { .custo-fila li { transition: none; } }

/* banco de demonstração (scripts/semear_teste.py): fita fixa no topo de toda tela, impossível confundir com o real */
.faixa-demo { position: sticky; top: 0; z-index: 26; display: flex; align-items: center; justify-content: center; gap: var(--e-3);
  min-height: 28px; padding: 4px var(--e-4); text-align: center;
  background: repeating-linear-gradient(-45deg, #7A1FA2 0 12px, #651887 12px 24px); color: #fff; }
.faixa-demo b { font: 800 12px/16px var(--f-titulo); letter-spacing: .08em; }
.faixa-demo span { font: 500 var(--t-12) var(--f-texto); opacity: .9; }
body.demo .topo { top: 28px; }
body.demo .faixa-leitura { top: 28px; }
body.demo.vendo-como .topo { top: 77px; }
@media (max-width: 760px) {
  .faixa-demo { min-height: 24px; padding: 2px var(--e-3); }
  .faixa-demo span { display: none; }
  body.demo .topo { top: 24px; }
  body.demo .faixa-leitura { top: 0; }
}

/* primeiros passos (Início): checklist conferido nos dados; some quando tudo está feito */
.primeiros-passos { display: grid; gap: var(--e-3); }
.primeiros-passos.painel { padding: var(--e-5) var(--e-6); }
.pp-cab { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--e-3); }
.pp-cab h2 { font: 700 var(--t-20) var(--f-titulo); letter-spacing: -.01em; }
.pp-conta { margin: 2px 0 0; font: var(--t-13) var(--f-texto); color: var(--tinta-3); }
.pp-esconder { font-size: 13px; color: var(--tinta-3); white-space: nowrap; }
.pp-barra { height: 4px; border-radius: var(--r-full); background: var(--linha); overflow: hidden; }
.pp-barra i { display: block; height: 100%; background: var(--verde); border-radius: inherit; transition: width var(--m-lento) var(--curva); }
.pp-lista { list-style: none; margin: 0; padding: 0; display: grid; }
.pp-item { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: var(--e-3); align-items: center; padding: var(--e-3) 0; border-top: 1px solid var(--linha); }
.pp-item:first-child { border-top: 0; }
.pp-marca { width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid var(--linha-forte); display: grid; place-items: center; align-self: start; margin-top: 1px; }
.pp-item.atual .pp-marca { border-color: var(--azul); box-shadow: 0 0 0 3px color-mix(in srgb, var(--azul) 18%, transparent); }
.pp-item.feito .pp-marca { background: var(--verde); border-color: var(--verde); color: #fff; }
.pp-marca svg { width: 13px; height: 13px; }
.pp-txt b { display: block; font: 600 var(--t-14) var(--f-texto); }
.pp-txt span { display: block; font: var(--t-13) var(--f-texto); color: var(--tinta-2); margin-top: 2px; max-width: 52ch; }
.pp-item.feito .pp-txt b { color: var(--tinta-3); font-weight: 500; }
.pp-opc { font: 500 var(--t-11) var(--f-texto); color: var(--tinta-3); border: 1px solid var(--linha); border-radius: var(--r-full); padding: 0 6px; margin-left: 4px; }
.pp-ok { font: 500 var(--t-12) var(--f-texto); color: var(--verde-texto); }
.pp-acao { display: flex; justify-content: flex-end; }
.pp-seg { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.pp-seg .chip { font-size: 12px; }
.pp-meta { display: flex; gap: 6px; }
.pp-meta input { width: 110px; height: 32px; }
.boas-vindas .lado .primeiros-passos h2 { font: 700 var(--t-20) var(--f-titulo); }
.boas-vindas .lado .primeiros-passos p { margin-top: 2px; }
@media (max-width: 760px) {
  .primeiros-passos.painel { padding: var(--e-4); }
  .pp-item { grid-template-columns: 22px minmax(0, 1fr); }
  .pp-acao { grid-column: 2; justify-content: flex-start; }
  .pp-seg { justify-content: flex-start; }
  .pp-meta input { flex: 1; width: auto; }
  .pp-item.feito .pp-acao { display: none; }
}
.pp-txt span.pp-opc { display: inline-block; margin: 0 0 0 6px; vertical-align: 1px; padding: 0 6px; }
.pp-meta input { height: 32px; padding: 0 var(--e-3); border: 1px solid var(--linha-forte); border-radius: var(--r-sm); background: var(--campo-fundo); color: var(--tinta); font: 400 var(--t-14) var(--f-num); text-align: right; }
.pp-meta input:focus { outline: none; border-color: var(--azul); box-shadow: var(--anel-foco); }

/* ------------------------------------------------------------ Integrações (#/integracoes) */
.ig-lista { display: grid; gap: var(--e-5); max-width: 1080px; }
.ig-card { --rail: var(--linha-forte); position: relative; background: var(--papel); border: 1px solid var(--linha); border-radius: var(--r-md);
  box-shadow: var(--s-1), var(--realce); overflow: hidden; scroll-margin-top: 80px; }
.ig-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--rail); }
.ig-ok { --rail: var(--verde); } .ig-erro { --rail: var(--verm); } .ig-vencendo { --rail: var(--amarelo); }
.ig-rodando { --rail: var(--azul); } .ig-em_breve { --rail: transparent; } .ig-em_breve::before { background: repeating-linear-gradient(180deg, var(--linha-forte) 0 6px, transparent 6px 12px); }
.ig-foco { animation: ig-foco 1.6s var(--curva) 1; }
@keyframes ig-foco { 0% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--azul) 45%, transparent); } 100% { box-shadow: var(--s-1), var(--realce); } }
@media (prefers-reduced-motion: reduce) { .ig-foco { animation: none; } }
.ig-cab { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--e-4); align-items: start; padding: var(--e-5) var(--e-6) 0; }
.ig-marca { width: 40px; height: 40px; border-radius: var(--r-sm); display: grid; place-items: center; background: var(--papel-3); color: var(--tinta-2); }
.ig-marca svg { width: 20px; height: 20px; }
.ig-marca.amz { background: var(--azul-claro); color: var(--azul-texto); }
.ig-marca.kalo { background: color-mix(in srgb, var(--roxo) 16%, var(--papel)); color: var(--roxo); }
.ig-marca.tt { background: var(--laranja-claro); color: var(--laranja-texto); }
.ig-tit h2 { font: 700 var(--t-20) var(--f-titulo); letter-spacing: -.01em; }
.ig-tit p { color: var(--tinta-3); font: var(--t-14) var(--f-texto); margin-top: 2px; max-width: 64ch; }
.ig-selo { margin-top: 6px; }
.ig-corpo { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: var(--e-6); padding: var(--e-5) var(--e-6) var(--e-5) calc(var(--e-6) + 56px); }
.ig-corpo.ig-uma { grid-template-columns: minmax(0, 1fr); }
.ig-principal { display: grid; gap: var(--e-4); align-content: start; min-width: 0; }
.ig-frase { font: 500 var(--t-16) var(--f-texto); max-width: 64ch; }
.ig-frase.ig-ruim { color: var(--verm-texto); }
.ig-mascara { font: 600 14px var(--f-num); padding: 1px 6px; border-radius: var(--r-xs); background: var(--papel-3); color: var(--tinta); letter-spacing: -.02em; white-space: nowrap; }
.ig-acoes { display: flex; flex-wrap: wrap; gap: var(--e-2); }
.ig-acoes .perigo-txt { color: var(--verm-texto); }
.ig-form { display: grid; gap: var(--e-3); max-width: 520px; }
.ig-form .acoes-linha { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2); }
.ig-fila { display: flex; align-items: center; gap: var(--e-3); padding: var(--e-3) var(--e-4); border-radius: var(--r-sm); background: var(--amarelo-claro);
  color: var(--tinta); text-decoration: none; max-width: 520px; }
.ig-fila span:nth-child(2) { display: grid; flex: 1; } .ig-fila small { color: var(--tinta-3); }
.ig-fila svg { width: 18px; height: 18px; color: var(--tinta-3); }
.ig-fatos { display: grid; gap: var(--e-4); align-content: start; padding-left: var(--e-5); border-left: 1px solid var(--linha); }
.ig-fato { display: grid; gap: 2px; }
.ig-fato > span, .ig-fato > label { font: 500 var(--t-12) var(--f-texto); color: var(--tinta-3); }
.ig-fato > b { font: 600 var(--t-16) var(--f-texto); display: inline-flex; align-items: center; gap: 6px; }
.ig-fato > b svg { width: 16px; height: 16px; color: var(--verde-texto); }
.ig-fato > small { font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.ig-fato b.ig-atencao { color: var(--amarelo-texto); } .ig-fato b.ig-ruim { color: var(--verm-texto); }
.ig-trilho { height: 6px; border-radius: var(--r-full); background: var(--papel-3); overflow: hidden; margin: 4px 0 2px; }
.ig-trilho i { display: block; height: 100%; border-radius: inherit; background: var(--verde); }
.ig-trilho.atencao i { background: var(--amarelo); } .ig-trilho.ruim i { background: var(--verm); }
.ig-teto-linha { display: flex; gap: var(--e-2); align-items: center; } .ig-teto-linha input { width: 96px; min-height: 36px; text-align: right; }
.ig-fato b .mudo { font: 500 var(--t-14) var(--f-texto); color: var(--tinta-3); }
.ig-como { border-top: 1px solid var(--linha); }
.ig-como > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: var(--e-2); padding: var(--e-4) var(--e-6);
  font: 600 var(--t-14) var(--f-texto); color: var(--tinta-2); }
.ig-como > summary::-webkit-details-marker { display: none; }
.ig-como > summary:hover { color: var(--tinta); }
.ig-como > summary svg { width: 16px; height: 16px; flex: none; }
.ig-como-seta { margin-left: auto; display: inline-flex; transition: transform var(--m-medio) var(--curva); color: var(--tinta-3); }
.ig-como[open] .ig-como-seta { transform: rotate(180deg); }
.ig-como-corpo { padding: 0 var(--e-6) var(--e-6) calc(var(--e-6) + 56px); display: grid; gap: var(--e-4); max-width: calc(72ch + 80px); }
.ig-aviso { display: flex; gap: var(--e-3); padding: var(--e-3) var(--e-4); border-radius: var(--r-sm); background: var(--amarelo-claro); color: var(--tinta); font: var(--t-14) var(--f-texto); }
.ig-aviso svg { width: 18px; height: 18px; flex: none; color: var(--amarelo-texto); margin-top: 1px; }
.ig-passos { counter-reset: ig; list-style: none; display: grid; gap: var(--e-4); }
.ig-passos li { counter-increment: ig; position: relative; padding-left: 36px; font: var(--t-14) var(--f-texto); color: var(--tinta-2); line-height: 22px; }
.ig-passos li::before { content: counter(ig); position: absolute; left: 0; top: 0; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center;
  background: var(--azul-claro); color: var(--azul-texto); font: 700 12px/1 var(--f-num); }
.ig-passos b { color: var(--tinta); }
.ig-passos code, .ig-nota code { font: 12px var(--f-num); padding: 1px 4px; border-radius: 4px; background: var(--papel-3); color: var(--tinta); white-space: nowrap; }
.ig-nota { font: var(--t-13) var(--f-texto); color: var(--tinta-3); padding-left: 36px; }
.ig-log .integ-log { max-height: 320px; overflow: auto; }
@media (max-width: 860px) {
  .ig-corpo { grid-template-columns: minmax(0, 1fr); padding-left: var(--e-6); }
  .ig-fatos { padding-left: 0; border-left: 0; border-top: 1px solid var(--linha); padding-top: var(--e-4); grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
  .ig-como-corpo { padding-left: var(--e-6); }
}
@media (max-width: 760px) {
  .ig-cab { grid-template-columns: auto minmax(0, 1fr); padding: var(--e-4) var(--e-4) 0; gap: var(--e-3); }
  .ig-cab .ig-selo { grid-column: 2; margin-top: 0; justify-self: start; }
  .ig-corpo { padding: var(--e-4); gap: var(--e-4); }
  .ig-como > summary { padding: var(--e-4); }
  .ig-como-corpo { padding: 0 var(--e-4) var(--e-5); }
  .ig-passos li { padding-left: 32px; }
  .ig-nota { padding-left: 0; }
  .ig-passos code { white-space: normal; word-break: break-all; }
  .ig-acoes .btn { flex: 1 1 auto; }
}

/* 03/10 · perfis com meta de 1000 seguidores, fase, preço com data e capa */
.perfis-fase .pf-fase { display: grid; gap: var(--e-2); padding: var(--e-3); border: 1px solid var(--linha); border-radius: var(--r-md); background: var(--papel-2); min-width: 0; }
.pf-fase-cab { display: flex; align-items: center; gap: var(--e-2); }
.pf-fase-cab > div { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px var(--e-2); }
.pf-fase-cab .num { font-size: 12px; }
.pf-aparelho { flex-basis: 100%; font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.pf-meta { display: flex; align-items: center; gap: var(--e-3); font-size: 13px; }
.pf-barra { flex: 1; height: 10px; border-radius: var(--r-full); background: var(--papel-3); overflow: hidden; }
.pf-barra i { display: block; height: 100%; background: linear-gradient(90deg, var(--azul), var(--laranja)); border-radius: inherit; min-width: 2px; }
.pf-identidade { color: var(--tinta); font: inherit; }
.nc-perfil { margin-top: var(--e-4); }
.nc-perfil h3 { font: 600 var(--t-14, 14px) var(--f-texto); margin: 0 0 var(--e-2); }
.nc-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--e-2); }
.nc-lista li { display: grid; gap: 4px; padding: var(--e-3); border: 1px solid var(--linha); border-radius: var(--r-md); background: var(--papel-2); min-width: 0; }
.nc-nome { display: grid; gap: 2px; min-width: 0; overflow-wrap: anywhere; }
.nc-num { font-size: 13px; }
.nc-acoes { display: flex; gap: var(--e-2); flex-wrap: wrap; }
.pf-identidade summary { color: var(--tinta-2); }
.pf-identidade .form-conv { margin-top: var(--e-3); }
.pf-voz { display: flex; gap: var(--e-2); align-items: center; }
.pf-voz select { flex: 1; min-width: 0; }
/* fotos do personagem no cadastro: retrato em pé (9:16), clicável para escolher o arquivo */
.pf-fotos { display: grid; grid-template-columns: repeat(2, minmax(0, 120px)); gap: var(--e-3); }
.pf-foto { position: relative; display: grid; gap: 6px; justify-items: center; cursor: pointer; font: 600 var(--t-13) var(--f-texto); }
.pf-foto-img { width: 100%; aspect-ratio: 9 / 16; display: grid; place-items: center; border: 1px dashed var(--linha-forte); border-radius: var(--r-md); background: var(--papel-2); color: var(--tinta-3); overflow: hidden; }
.pf-foto-img img { width: 100%; height: 100%; object-fit: cover; }
.pf-foto:hover .pf-foto-img, .pf-foto:focus-within .pf-foto-img { border-color: var(--azul); }
.pf-foto input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.pf-acoes { display: flex; gap: var(--e-2); flex-wrap: wrap; justify-content: flex-end; }
.pf-seg { display: flex; align-items: center; gap: var(--e-2); flex-wrap: wrap; }
.pf-seg .entrada { width: 150px; }
.faixa-fase { display: flex; gap: var(--e-2); align-items: flex-start; border-radius: var(--r-sm); padding: var(--e-2) var(--e-3); font-size: 13px; line-height: 18px; }
.faixa-fase svg { flex: 0 0 16px; width: 16px; height: 16px; margin-top: 1px; }
.faixa-fase.f1 { background: var(--azul-claro); color: var(--azul-texto); }
.faixa-fase.f2 { background: color-mix(in srgb, var(--verde) 12%, transparent); color: var(--verde-texto); }
.kc-preco { display: inline-flex; align-items: center; gap: 4px; flex-wrap: wrap; font: var(--t-12) var(--f-texto); color: var(--tinta-2); }
.kc-preco s { color: var(--tinta-3); }
.kc-preco svg { width: 13px; height: 13px; }
.kc-preco.velho { color: var(--amarelo-texto); background: var(--amarelo-claro); border-radius: var(--r-xs); padding: 0 6px; }
.cd-preco { display: grid; gap: 4px; font-size: 13px; }
.cd-tela0 { display: grid; gap: 2px; padding: var(--e-2) var(--e-3); border-radius: var(--r-sm); background: var(--papel-3); }
.cd-tela0 span { font: var(--t-11) var(--f-texto); color: var(--tinta-3); text-transform: uppercase; letter-spacing: .04em; }
.cd-tela0 b { font: 700 16px/22px var(--f-titulo); }
.coluna.c-arquivado .kcard { opacity: .7; }

/* 03/10 · Métricas */
.met-pf-tit { display: flex; align-items: center; gap: var(--e-2); }
.met-pf-tit h2 .num { font-size: 12px; font-weight: 400; }
.met-perfil .painel-corpo { display: grid; gap: var(--e-3); }
.graf-seg { width: 100%; height: auto; display: block; }
.graf-seg .g-eixo { stroke: var(--linha-forte); stroke-width: 1; }
.graf-seg .g-meta { stroke: var(--laranja); stroke-width: 1.5; stroke-dasharray: 4 4; }
.graf-seg .g-linha { fill: none; stroke: var(--azul); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.graf-seg .g-prev { fill: none; stroke: var(--azul); stroke-width: 2; stroke-dasharray: 3 5; opacity: .55; }
.graf-seg .g-pt circle { fill: var(--azul); stroke: var(--papel); stroke-width: 2; }
.graf-seg .g-pt .g-alvo { fill: transparent; stroke: none; }
.graf-seg .g-pt:hover circle:not(.g-alvo) { r: 6; }
.graf-seg .g-rot { font: 11px var(--f-num); fill: var(--tinta-3); }
.met-recs { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--e-2); }
.met-recs li { display: flex; gap: var(--e-2); align-items: flex-start; padding: var(--e-2) var(--e-3); border-radius: var(--r-sm); background: var(--papel-2); font-size: 14px; line-height: 20px; }
.met-recs .tag { flex: 0 0 auto; }
.met-ranks { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--e-4); }
.met-rank h3 { font: 600 14px/20px var(--f-texto); margin: 0 0 var(--e-2); }
.met-rank ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.met-rank li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: "nome valor n" "barra barra barra"; gap: 2px var(--e-2); font-size: 13px; align-items: baseline; }
.met-rank .mr-nome { grid-area: nome; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.met-rank .mr-barra { grid-area: barra; display: block; height: 6px; border-radius: 0 4px 4px 0; background: var(--papel-3); position: relative; }
.met-rank .mr-barra::after { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--w); background: var(--tinta-4); border-radius: 0 4px 4px 0; }
.met-rank li.top .mr-barra::after { background: var(--azul); }
.met-rank .mr-n { font-size: 11px; color: var(--tinta-3); }
.met-rank .mr-n.atencao { color: var(--amarelo-texto); }
.met-tab td .avatar { vertical-align: middle; }
.met-tab td { white-space: nowrap; }
.met-tab svg { width: 14px; height: 14px; vertical-align: -2px; }

/* 03/10 · Sprint (fabrica/sprint.json): meta do dia por perfil + tarefas do dono */
.sp-corpo { display: grid; gap: var(--e-3); }
.sp-perfis .sp-pf { display: grid; gap: var(--e-2); padding: var(--e-3); border: 1px solid var(--linha); border-radius: var(--r-md); background: var(--papel-2); min-width: 0; }
.sp-pf-cab { display: flex; align-items: center; gap: var(--e-2); }
.sp-pf-cab h3 { flex: 1; margin: 0; font: 600 15px/20px var(--f-texto); }
.sp-pf dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px var(--e-3); margin: 0; font-size: 13px; line-height: 18px; }
.sp-pf dt { color: var(--tinta-3); }
.sp-pf dd { margin: 0; }
.sp-pf .pf-barra i.ok { background: var(--verde); }
.sp-pf .pf-barra i.atencao { background: var(--amarelo); }
.sp-pf .pf-barra i.ruim { background: var(--verm); }
.sp-tit { margin: 0; font: 600 15px/20px var(--f-texto); }
.sp-tarefas .sp-tarefa-txt { flex: 1; min-width: 0; }
.sp-tarefas .sp-tarefa-txt p { margin: 2px 0 0; font-size: 13px; }
.sp-tarefas .sp-tarefa-txt svg { width: 14px; height: 14px; vertical-align: -2px; }
.sp-sug { margin-top: var(--e-1); font-size: 13px; }
.sp-sug summary { cursor: pointer; color: var(--azul-texto); }
.sp-sug ul { margin: var(--e-1) 0 0; padding-left: var(--e-4); display: grid; gap: 2px; }

/* ---- selo de viral pré-post (fabrica/selo.py) + aba 🔥 Destaques (05/10) ---- */
.selo-nota { display: inline-flex; align-items: center; gap: 3px; flex: none; margin-left: auto; font: 600 11px/18px var(--f-texto); border-radius: var(--r-full); padding: 0 7px; cursor: help; white-space: nowrap; border: 1px solid transparent; }
.selo-nota b { font-size: 12px; font-weight: 800; }
.selo-nota[data-selo-nota] { min-height: 22px; }
.selo-nota:focus-visible { outline: 2px solid var(--laranja); outline-offset: 1px; }
.selo-nota.n-verde { background: color-mix(in srgb, var(--verde) 14%, var(--papel)); color: var(--verde-texto); border-color: color-mix(in srgb, var(--verde) 35%, transparent); }
.selo-nota.n-amarelo { background: var(--amarelo-claro); color: var(--amarelo-texto); border-color: color-mix(in srgb, var(--amarelo) 40%, transparent); }
.selo-nota.n-verm { background: var(--verm-claro); color: var(--verm-texto); border-color: color-mix(in srgb, var(--verm) 35%, transparent); }
.est-fone-topo .selo-nota { pointer-events: auto; margin-left: 6px; backdrop-filter: blur(6px); }
.selo-pop { position: fixed; z-index: 1000; background: var(--papel); color: var(--tinta); border: 1px solid var(--linha-forte); border-radius: var(--r-sm); box-shadow: var(--s-3, 0 8px 24px rgba(0,0,0,.25)); padding: var(--e-2) var(--e-3); font: var(--t-13) var(--f-texto); }
.selo-pop[hidden] { display: none; }
.sn-tit { display: block; margin-bottom: 4px; font-size: 13px; }
.sn-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.sn-lista li { display: grid; grid-template-columns: 14px minmax(0, 1fr); gap: 6px; font-size: 12px; line-height: 16px; color: var(--tinta-2); }
.sn-lista li i { font-style: normal; font-weight: 800; }
.sn-lista li.ok i { color: var(--verde-texto); }
.sn-lista li.nao i { color: var(--verm-texto); }
.sn-lista li b { color: var(--tinta); }
.sn-lista em { font-style: normal; color: var(--tinta-3); }
.cd-selo { border: 1px solid var(--linha); border-radius: var(--r-sm); padding: var(--e-2) var(--e-3); }
.cd-selo summary { display: flex; align-items: center; gap: var(--e-2); cursor: pointer; font: 600 var(--t-13) var(--f-texto); list-style: none; }
.cd-selo summary::-webkit-details-marker { display: none; }
.cd-selo summary .selo-nota { margin-left: 0; }
.cd-selo[open] summary { margin-bottom: var(--e-2); }
.dest-dica { margin: 0; padding: var(--e-4) var(--e-6) var(--e-2); font: var(--t-13) var(--f-texto); color: var(--tinta-2); }
.dest-auto { padding: var(--e-4) var(--e-6) 0; }
.dest-auto .btn { width: 100%; max-width: 420px; justify-content: center; }
.ag-auto { align-items: center; gap: var(--e-2); }
.dest-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--e-3); padding: var(--e-2) var(--e-6) var(--e-5); }
.dest-item { display: grid; gap: var(--e-2); align-content: start; background: var(--papel-2); border: 1px solid var(--linha); border-radius: var(--r-sm); padding: var(--e-2); }
.dest-item .kcard { grid-template-columns: 72px minmax(0, 1fr); }
.dest-acoes { display: flex; gap: var(--e-2); flex-wrap: wrap; }
.dest-acoes .btn { flex: 1 1 auto; }
@media (max-width: 760px) {
  .dest-dica { padding: var(--e-3) var(--e-3) var(--e-1); }
  .dest-auto { padding: var(--e-3) var(--e-3) 0; }
  .dest-auto .btn { max-width: none; min-height: 44px; }
  .dest-grade { grid-template-columns: minmax(0, 1fr); padding: var(--e-2) var(--e-3) var(--e-4); }
  .dest-acoes .btn { min-height: 40px; }
}
.kc-top .selo-nota b { color: inherit; overflow: visible; font-size: 12px; }

/* ================= Trend (perfis de entretenimento; nada do Conteúdo aqui) ================= */
.tr-teto { display: block; height: 6px; border-radius: var(--r-full); background: var(--papel-3); overflow: hidden; margin: 2px 0; }
.tr-teto i { display: block; height: 100%; border-radius: inherit; background: var(--azul); }
.tr-teto i.perto { background: var(--verm); }
.tr-pers { display: flex; gap: var(--e-4); align-items: center; padding: var(--e-4); min-width: 0; }
.tr-pers.principal { border-color: color-mix(in srgb, var(--azul) 45%, var(--linha)); }
.tr-foto { width: 72px; height: 96px; flex: none; border-radius: var(--r-sm); object-fit: cover; object-position: 50% 22%; background: var(--papel-3); }
.tr-foto.sem { display: grid; place-items: center; font: 700 var(--t-24) var(--f-titulo); color: var(--tinta-3); }
.tr-pers-txt { min-width: 0; }
.tr-pers-txt h2 { font: 600 var(--t-15) var(--f-texto); display: flex; gap: var(--e-2); align-items: center; flex-wrap: wrap; }
.tr-pers-txt p { color: var(--tinta-3); font: var(--t-13) var(--f-texto); margin-top: 2px; }
.tr-pers-txt .tr-pers-num { color: var(--tinta-2); margin-top: var(--e-2); }
.tr-pers-num b { color: var(--tinta); font-family: var(--f-num); }
.tr-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: var(--e-5) var(--e-4); }
.tr-video { display: flex; flex-direction: column; gap: var(--e-3); min-width: 0; }
.tr-tela { position: relative; aspect-ratio: 9 / 16; border-radius: var(--r-md); overflow: hidden; background: #000; border: 1px solid var(--linha); }
.tr-tela video { width: 100%; height: 100%; object-fit: contain; display: block; }
.tr-video.no-original .tr-tela { border-color: var(--amarelo-texto); }
.tr-troca {
  position: absolute; top: var(--e-2); left: var(--e-2); display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 var(--e-3);
  border: 0; border-radius: var(--r-full); background: rgba(10, 12, 18, .72); color: #fff; font: 600 var(--t-12) var(--f-texto); cursor: pointer; backdrop-filter: blur(6px);
}
.tr-troca:hover { background: rgba(10, 12, 18, .9); }
.tr-troca[aria-pressed="true"] { background: var(--amarelo-claro); color: var(--amarelo-texto); }
.tr-troca svg { width: 14px; height: 14px; }
.tr-video-txt { min-width: 0; flex: 1 1 auto; display: flex; flex-direction: column; }
.tr-video-txt h3 { font: 600 var(--t-14) var(--f-texto); overflow-wrap: anywhere; }
.tr-meta { color: var(--tinta-3); font: var(--t-12) var(--f-texto); margin-top: 2px; overflow-wrap: anywhere; }
.tr-meta a { color: inherit; display: inline-flex; align-items: center; gap: 4px; }
.tr-meta a:hover { color: var(--tinta); }
.tr-meta svg { width: 12px; height: 12px; flex: none; }
.tr-nota { font: var(--t-13) var(--f-texto); color: var(--tinta-2); margin-top: var(--e-1); }
.tr-acoes { display: flex; gap: var(--e-2); flex-wrap: wrap; margin-top: auto; padding-top: var(--e-3); }   /* botões alinhados entre os cards */
.tr-acoes .btn { flex: 1 1 auto; }
.tr-link { flex: 1 1 100%; min-width: 0; height: 32px; padding: 0 var(--e-2); border: 1px solid var(--linha-forte); border-radius: var(--r-sm); background: var(--campo-fundo); color: var(--tinta); font: var(--t-13) var(--f-texto); }
.tr-link:focus { outline: none; border-color: var(--azul); box-shadow: var(--anel-foco); }
.tr-com-etapa { display: flex; flex-direction: column; gap: var(--e-2); align-items: flex-start; min-width: 0; }
.tr-com-etapa .tr-video { width: 100%; }
.tr-fechados > summary { cursor: pointer; padding: var(--e-4) var(--e-6); font: 600 var(--t-15) var(--f-texto); list-style-position: inside; }
.tr-garimpo { list-style: none; margin: 0; padding: var(--e-2) 0 var(--e-2); }
.tr-garimpo li { display: flex; align-items: center; gap: var(--e-4); padding: var(--e-3) var(--e-6); border-top: 1px solid var(--linha); }
.tr-garimpo li:first-child { border-top: 0; }
.tr-garimpo li.usado .tr-g-txt b { color: var(--tinta-3); }
.tr-garimpo img, .tr-sem-grade { width: 90px; height: 80px; flex: none; border-radius: var(--r-xs); object-fit: cover; background: var(--papel-3); }
.tr-sem-grade { display: grid; place-items: center; color: var(--tinta-3); }
.tr-sem-grade svg { width: 18px; height: 18px; }
.tr-g-txt { flex: 1 1 auto; min-width: 0; }
.tr-g-txt p:first-child { display: flex; gap: var(--e-2); align-items: center; flex-wrap: wrap; }
.tr-g-num { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; flex: none; font: var(--t-12) var(--f-texto); color: var(--tinta-3); white-space: nowrap; }
.tr-g-num b { color: var(--tinta); }
@media (max-width: 760px) {
  .tr-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-4) var(--e-3); }
  .tr-acoes .btn { min-height: 40px; }
  .tr-link { height: 40px; font-size: 16px; }
  .tr-garimpo li { flex-wrap: wrap; padding: var(--e-3) var(--e-4); gap: var(--e-2) var(--e-3); }
  .tr-garimpo img, .tr-sem-grade { width: 72px; height: 64px; }
  .tr-g-txt { flex-basis: calc(100% - 90px); }
  .tr-g-num { flex-direction: row; gap: var(--e-3); align-items: center; flex: 1 1 auto; }
  .tr-fechados > summary { padding: var(--e-4); }
  .nav-baixo:has(> a:nth-child(8)) a { font-size: 10px; letter-spacing: -.01em; }   /* admin: 8 seções com a Trend */
  .nav-baixo:has(> a:nth-child(9)) a { font-size: 9px; letter-spacing: -.02em; }    /* admin: + Estúdio */
}

/* ================================================================ Estúdio (quadro de produção dos perfis realistas)
   Grade de fotos e resultados no estilo galeria: cartões grandes de imagem/vídeo, ações por cima ao passar o mouse. */
.cab-pagina + .abas { margin: calc(var(--e-2) * -1) 0 var(--e-5); }
.es-aviso { display: flex; gap: var(--e-2); align-items: flex-start; padding: var(--e-3) var(--e-4); border-radius: var(--r-md); background: var(--azul-claro); color: var(--azul-texto); font: 600 var(--t-13) var(--f-texto); }
.es-aviso.ruim { background: var(--verm-claro); color: var(--verm-texto); }
.es-aviso svg { width: 16px; height: 16px; flex: none; margin-top: 2px; }
.es-contrato { display: flex; gap: var(--e-2); align-items: center; flex-wrap: wrap; }
.es-contrato svg { width: 14px; height: 14px; }
.es-contrato code, .es-ped-dlg code { font: var(--t-12) var(--f-num); background: var(--papel-3); padding: 1px 6px; border-radius: var(--r-xs); overflow-wrap: anywhere; }
.es-voltar { display: inline-flex; align-items: center; gap: 4px; color: var(--azul-texto); text-decoration: none; font-weight: 600; }
.es-voltar svg { width: 14px; height: 14px; }
.es-sem { display: grid; place-items: center; width: 100%; height: 100%; color: var(--tinta-4); background: var(--papel-3); }
.es-sem svg { width: 28px; height: 28px; }

/* quadro: 4 colunas de status */
.es-quadro { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e-4); align-items: start; }
.es-col { background: var(--papel-2); border: 1px solid var(--linha); border-radius: var(--r-lg); padding: var(--e-3); min-width: 0; }
.es-col > header { display: flex; justify-content: space-between; align-items: center; padding: var(--e-1) var(--e-1) var(--e-3); }
.es-col > header h2 { font-size: inherit; }
.es-col-corpo { display: flex; flex-direction: column; gap: var(--e-3); }
.es-col-vazia { color: var(--tinta-3); font: var(--t-13) var(--f-texto); padding: var(--e-4) var(--e-2); text-align: center; border: 1px dashed var(--linha-forte); border-radius: var(--r-md); }
.es-ped { display: flex; flex-direction: column; background: var(--papel); border: 1px solid var(--linha); border-radius: var(--r-md); overflow: hidden; cursor: pointer; transition: border-color var(--m-rapido), transform var(--m-rapido); box-shadow: var(--s-1), var(--realce); }
.es-ped:hover, .es-ped:focus-visible { border-color: var(--linha-forte); transform: translateY(-1px); outline: none; }
.es-ped:focus-visible { box-shadow: var(--anel-foco); }
.es-ped-mini { position: relative; aspect-ratio: 4 / 5; background: #000; }
.es-ped-mini.video { aspect-ratio: 9 / 12; }
.es-ped-mini img, .es-ped-mini video { width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; display: block; }
.es-ped-mini img.es-apagada { opacity: .45; filter: saturate(.6); }
.es-ped-tipo { position: absolute; left: var(--e-2); top: var(--e-2); display: inline-flex; gap: 4px; align-items: center; padding: 3px 8px; border-radius: var(--r-full); background: rgba(10, 12, 18, .72); color: #fff; font: 600 var(--t-11) var(--f-texto); backdrop-filter: blur(6px); }
.es-ped-tipo svg { width: 12px; height: 12px; }
.es-ped-txt { padding: var(--e-3); display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.es-ped-nome { font: var(--t-14) var(--f-texto); }
.es-ped-res { font: var(--t-13) var(--f-texto); color: var(--tinta-2); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.es-ped-fonte { display: inline-flex; gap: 4px; align-items: center; font: var(--t-12) var(--f-texto); color: var(--tinta-3); }
.es-ped-fonte svg, .es-ped-nota svg { width: 12px; height: 12px; flex: none; }
.es-ped-nota { font: var(--t-12) var(--f-texto); color: var(--amarelo-texto); display: flex; gap: 6px; align-items: flex-start; overflow-wrap: anywhere; }
.es-liberado { align-self: flex-start; font: 600 var(--t-11) var(--f-texto); color: var(--azul-texto); background: var(--azul-claro); padding: 2px 8px; border-radius: var(--r-full); }
.es-fechados > summary { padding: var(--e-4) var(--e-6); cursor: pointer; font-weight: 600; }
.es-fechados-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: var(--e-4); padding: 0 var(--e-6) var(--e-5); }
.es-com-tag { display: flex; flex-direction: column; gap: var(--e-2); align-items: flex-start; }
.es-com-tag .es-ped { width: 100%; }

/* diálogos */
dialog.es-dlg { width: min(560px, calc(100vw - 24px)); max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow: auto; }
dialog.es-dlg-ped { width: min(980px, calc(100vw - 24px)); overflow: hidden; display: flex; }
dialog.es-dlg-ped[open] { display: flex; }
.es-form .dc { display: flex; flex-direction: column; gap: var(--e-3); }
.es-form .erro:not(:empty), .es-ped-form .erro:not(:empty) { background: var(--verm-claro); color: var(--verm-texto); border-radius: var(--r-sm); padding: var(--e-2) var(--e-3); font: 600 var(--t-13) var(--f-texto); }
.es-form [data-so] { display: flex; flex-direction: column; gap: var(--e-3); }
.es-form [data-so][hidden] { display: none; }
.es-tipos { display: grid; grid-template-columns: 1fr 1fr; gap: var(--e-2); margin-top: var(--e-2); }
.es-tipos label { position: relative; cursor: pointer; }
.es-tipos input { position: absolute; opacity: 0; }
.es-tipos span { display: grid; grid-template-columns: auto 1fr; column-gap: var(--e-2); align-items: center; padding: var(--e-3); border: 1px solid var(--linha-forte); border-radius: var(--r-md); }
.es-tipos span svg { width: 18px; height: 18px; grid-row: span 2; color: var(--tinta-3); }
.es-tipos small { color: var(--tinta-3); font: var(--t-12) var(--f-texto); }
.es-tipos input:checked + span { border-color: var(--azul); box-shadow: var(--anel-foco); }
.es-tipos input:checked + span svg { color: var(--azul-texto); }
.es-tipos input:focus-visible + span { box-shadow: var(--anel-foco); }
.es-trecho { display: grid; grid-template-columns: 1fr 1fr auto; gap: var(--e-2); align-items: end; }
.es-previa { width: 100%; max-height: 260px; background: #000; border-radius: var(--r-md); }
.es-redes-form { border: 0; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e-2); }
.es-redes-form legend { font: 600 var(--t-12) var(--f-texto); color: var(--tinta-2); margin-bottom: 6px; }
.es-ped-dlg { display: flex; flex-direction: column; width: 100%; max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); }
.es-ped-cab { display: flex; justify-content: space-between; gap: var(--e-3); padding: var(--e-5) var(--e-6) var(--e-3); border-bottom: 1px solid var(--linha); }
.es-ped-cab h2 { font: 700 var(--t-18, 18px) var(--f-titulo); display: flex; gap: var(--e-2); align-items: center; flex-wrap: wrap; }
.es-ped-corpo { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--e-5); padding: var(--e-5) var(--e-6); overflow: auto; }
.es-ped-midia { display: flex; gap: var(--e-3); align-items: flex-start; min-width: 0; }
.es-ped-midia figure { flex: 1 1 0; min-width: 0; margin: 0; }
.es-ped-midia figcaption { font: 600 var(--t-12) var(--f-texto); color: var(--tinta-3); margin-bottom: 6px; }
.es-ped-midia video { width: 100%; aspect-ratio: 9 / 16; max-height: 62vh; max-height: 62dvh; background: #000; border-radius: var(--r-md); object-fit: contain; }
.es-ped-imgs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-2); width: 100%; }
.es-ped-imgs img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: var(--r-md); }
.es-ped-vazio { width: 100%; aspect-ratio: 9 / 12; display: grid; place-content: center; justify-items: center; gap: var(--e-2); text-align: center; color: var(--tinta-3); border: 1px dashed var(--linha-forte); border-radius: var(--r-md); padding: var(--e-4); }
.es-ped-vazio svg { width: 28px; height: 28px; }
.es-ped-form { display: flex; flex-direction: column; gap: var(--e-3); min-width: 0; }
.es-ped-form .btn { align-self: flex-start; }
.es-postar { display: grid; grid-template-columns: 1fr 1.6fr; gap: var(--e-2); padding: var(--e-3); border: 1px solid var(--linha); border-radius: var(--r-md); background: var(--papel-2); }
.es-postado { display: flex; gap: var(--e-2); align-items: center; color: var(--verde-texto); font-weight: 600; }
.es-postado svg { width: 16px; height: 16px; }
.es-ped-acoes { display: flex; gap: var(--e-2); align-items: center; flex-wrap: wrap; padding: var(--e-4) var(--e-6); border-top: 1px solid var(--linha); background: var(--papel-2); }
.es-esp { flex: 1 1 auto; }

/* elenco */
.es-elenco { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: var(--e-4); }
.es-pers { display: flex; flex-direction: column; text-decoration: none; color: inherit; background: var(--papel); border: 1px solid var(--linha); border-radius: var(--r-lg); overflow: hidden; transition: border-color var(--m-rapido), transform var(--m-rapido); box-shadow: var(--s-1), var(--realce); }
.es-pers:hover { border-color: var(--linha-forte); transform: translateY(-2px); }
.es-pers-fotos { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; aspect-ratio: 3 / 2; background: var(--linha); }
.es-pers-fotos img, .es-pers-fotos .es-sem { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
.es-pers-txt { padding: var(--e-4); display: flex; flex-direction: column; gap: 6px; }
.es-pers-txt h2 { font: 700 var(--t-16, 16px) var(--f-titulo); display: flex; gap: var(--e-2); align-items: center; flex-wrap: wrap; }
.es-pers-txt p, .es-perfil-txt p { color: var(--tinta-2); font: var(--t-13) var(--f-texto); }
.es-pers-num { color: var(--tinta-3) !important; }
.es-pers-num b { color: var(--tinta); font-family: var(--f-num); }
.es-redes { display: flex; flex-wrap: wrap; gap: 6px; }
.es-redes span { font: var(--t-12) var(--f-texto); color: var(--tinta-3); background: var(--papel-3); border-radius: var(--r-full); padding: 2px 10px; }
.es-redes b { color: var(--tinta); font-weight: 600; }

/* perfil do personagem + grade de fotos (galeria) */
.es-perfil { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--e-6); padding: var(--e-5) var(--e-6); align-items: start; }
.es-oficiais { display: flex; gap: var(--e-3); }
.es-oficial { margin: 0; width: 150px; }
.es-oficial img, .es-oficial .es-sem { width: 150px; aspect-ratio: 3 / 4; object-fit: cover; object-position: 50% 20%; border-radius: var(--r-md); border: 1px solid var(--linha); display: block; }
.es-oficial figcaption { display: flex; justify-content: space-between; align-items: center; margin-top: 6px; font: 600 var(--t-13) var(--f-texto); }
.es-perfil-txt { display: flex; flex-direction: column; gap: var(--e-2); min-width: 0; }
.es-perfil-txt h2 { font: 800 var(--t-24, 24px) var(--f-titulo); letter-spacing: -.01em; }
.es-bio { font-style: italic; }
.es-prompt summary { cursor: pointer; font: 600 var(--t-13) var(--f-texto); color: var(--tinta-2); }
.es-prompt p { font: var(--t-12) var(--f-num) !important; margin-top: 6px; overflow-wrap: anywhere; }
.es-filtros { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.es-filtros a.chip { text-decoration: none; }
.es-filtros-gal { margin-bottom: var(--e-4); }
.es-sep { width: 1px; height: 20px; background: var(--linha-forte); margin: 0 var(--e-1); }
.es-envio { display: flex; gap: var(--e-3); align-items: end; flex-wrap: wrap; margin-bottom: var(--e-4); }
.es-solta { flex: 1 1 260px; display: flex; gap: var(--e-3); align-items: center; padding: var(--e-3) var(--e-4); border: 1px dashed var(--linha-forte); border-radius: var(--r-md); cursor: pointer; color: var(--tinta-2); }
.es-solta:hover { border-color: var(--azul); color: var(--tinta); }
.es-solta svg { width: 20px; height: 20px; flex: none; }
.es-solta span { display: flex; flex-direction: column; }
.es-solta small { color: var(--tinta-3); font: var(--t-12) var(--f-texto); }
.es-envio:focus-within .es-solta { box-shadow: var(--anel-foco); }
.es-galeria { columns: 4 220px; column-gap: var(--e-3); }
.es-foto { position: relative; margin: 0 0 var(--e-3); break-inside: avoid; border-radius: var(--r-md); overflow: hidden; background: var(--papel-3); border: 1px solid var(--linha); }
.es-foto img { width: 100%; display: block; }
.es-foto.oficial { border-color: var(--verde); box-shadow: 0 0 0 1px var(--verde); }
.es-foto figcaption { position: absolute; left: var(--e-2); top: var(--e-2); }
.es-foto-acoes { position: absolute; inset: auto 0 0 0; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; padding: var(--e-6) var(--e-2) var(--e-2); background: linear-gradient(transparent, rgba(5, 6, 10, .85)); opacity: 0; transition: opacity var(--m-rapido); }
.es-foto:hover .es-foto-acoes, .es-foto:focus-within .es-foto-acoes { opacity: 1; }
.es-foto-acoes .icone-btn { color: #fff; width: 32px; height: 32px; }
.es-foto-acoes .icone-btn:hover { background: rgba(255, 255, 255, .14); color: #fff; }
.es-foto-acoes .btn.peq { min-height: 28px; padding: 0 var(--e-2); font-size: 12px; background: rgba(255, 255, 255, .14); color: #fff; box-shadow: none; }
.es-foto-acoes .btn.peq:hover { background: var(--azul); }
.es-fav { position: absolute; right: var(--e-2); bottom: var(--e-2); }
.es-fav, .es-foto.fav .es-fav { width: 32px; height: 32px; border-radius: var(--r-full); border: 0; cursor: pointer; font-size: 18px; line-height: 1; background: rgba(255, 255, 255, .14); color: #fff; }
.es-foto-acoes .es-fav { position: static; margin-left: auto; order: 9; }
.es-fav[aria-pressed="true"] { background: var(--amarelo); color: #1a1200; }
.es-foto.fav::after { content: "★"; position: absolute; right: var(--e-2); top: var(--e-2); width: 26px; height: 26px; display: grid; place-items: center; border-radius: var(--r-full); background: var(--amarelo); color: #1a1200; font-size: 14px; }
.es-foto.fav:hover::after { opacity: 0; }

/* galeria de resultados */
.es-resultados { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--e-5) var(--e-4); }
.es-res { display: flex; flex-direction: column; gap: var(--e-2); cursor: pointer; min-width: 0; }
.es-res:focus-visible { outline: none; }
.es-res:focus-visible .es-res-tela { box-shadow: var(--anel-foco); }
.es-res-tela { position: relative; aspect-ratio: 9 / 16; border-radius: var(--r-lg); overflow: hidden; background: #000; border: 1px solid var(--linha); transition: transform var(--m-medio) var(--curva); }
.es-res:hover .es-res-tela { transform: scale(1.012); }
.es-res-tela video { width: 100%; height: 100%; object-fit: cover; display: block; }
.es-play { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; pointer-events: none; transition: opacity var(--m-rapido); }
.es-play svg { width: 44px; height: 44px; filter: drop-shadow(0 2px 8px rgba(0, 0, 0, .6)); }
.es-res:hover .es-play { opacity: 0; }
.es-res-tag { position: absolute; left: var(--e-2); top: var(--e-2); }
.es-res-imgs { display: grid; gap: 2px; width: 100%; height: 100%; }
.es-res-imgs.n2, .es-res-imgs.n3, .es-res-imgs.n4 { grid-template-columns: 1fr 1fr; }
.es-res-imgs.n3 img:first-child { grid-row: span 2; }
.es-res-imgs img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; min-height: 0; }
.es-res-txt p { font: var(--t-14) var(--f-texto); }

@media (max-width: 1100px) { .es-quadro { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .es-quadro { grid-template-columns: minmax(0, 1fr); }
  .es-ped { flex-direction: row; }
  .es-ped-mini, .es-ped-mini.video { width: 96px; flex: none; aspect-ratio: 3 / 4; align-self: flex-start; }
  .es-ped-tipo { left: 4px; top: 4px; padding: 2px 6px; }
  .es-ped-corpo { grid-template-columns: minmax(0, 1fr); padding: var(--e-4); }
  .es-perfil { grid-template-columns: minmax(0, 1fr); padding: var(--e-4); }
  .es-oficial, .es-oficial img, .es-oficial .es-sem { width: 100%; }
  .es-oficiais { display: grid; grid-template-columns: 1fr 1fr; }
  .es-galeria { columns: 2 140px; }
  .es-foto-acoes { opacity: 1; }
  .es-resultados { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-3); }
  .es-redes-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .es-trecho { grid-template-columns: 1fr 1fr; }
  .es-trecho .btn { grid-column: span 2; }
  .es-ped-acoes, .es-ped-cab { padding-left: var(--e-4); padding-right: var(--e-4); }
  .es-elenco { grid-template-columns: minmax(0, 1fr); }
}

/* Produtos › Fotos para a fábrica */
.pr-galeria { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2); margin-top: var(--e-2); }
.pr-gal-foto { width: 64px; height: 64px; border: 1px solid var(--linha); border-radius: var(--r-md); overflow: hidden; background: var(--papel-2); }
.pr-gal-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pr-gal-mais { font-size: .85rem; }
.pr-fab { display: grid; gap: var(--e-3); }
.pr-fab-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: var(--e-2); }
.pr-fab-foto { position: relative; margin: 0; aspect-ratio: 1; border: 1px solid var(--linha); border-radius: var(--r-md); overflow: hidden; background: var(--papel-2); }
.pr-fab-foto img { width: 100%; height: 100%; object-fit: cover; }
.pr-fab-foto .icone-btn { position: absolute; top: 4px; right: 4px; background: var(--papel); }
.pr-fab-acoes { display: flex; flex-wrap: wrap; gap: var(--e-2); }
.pr-fab-recorte { position: absolute; left: 4px; bottom: 4px; padding: 1px 6px; border-radius: var(--r-md); background: var(--papel); color: var(--tinta-2); font-size: .72rem; }
.pr-fab-env { cursor: pointer; }