/* Ágora — tela real (06/11/2026). Base = protótipo aprovado (docs/prototipo/estilo.css), levado como está; acréscimos da tela real no fim.
   Regras: dash-padrao §10 e ictino §6. Tokens e contraste: docs/DESIGN.md §2. Visual próprio da casa; nada copiado de outra plataforma. */

@font-face { font-family: 'Public Sans'; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url(fontes/public-sans-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Public Sans'; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url(fontes/public-sans-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }

/* ── tokens: claro (padrão) ── */
:root {
  color-scheme: light;
  --fonte: 'Public Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --fs-12: 12px; --fs-14: 14px; --fs-16: 16px; --fs-20: 20px; --fs-28: 28px;
  --cab: 64px; --ctrl: 36px; --pad: 32px; --vao: 16px; --teto: 440px; --painel: 400px;
  --lat: 260px; --lat-rec: 68px;
  --raio: 12px; --raio-p: 8px;
  --fundo: #f8fafc; --sup: #ffffff; --sup-2: #f1f5f9; --sup-3: #e2e8f0;
  --borda: #e2e8f0; --borda-forte: #cbd5e1;
  --texto-forte: #0f172a; --texto: #1e293b; --texto-2: #475569; --texto-3: #5b6b82;
  --acento: #7c3aed; --acento-forte: #6d28d9; --acento-suave: #ede9fe; --acento-lavado: #f5f3ff; --acento-texto: #6d28d9; --sobre-acento: #ffffff;
  --ok: #15803d; --ok-suave: #dcfce7; --ok-texto: #166534;
  --alerta: #d97706; --alerta-suave: #fef3c7; --alerta-texto: #92400e;
  --erro: #f43f5e; --erro-forte: #e11d48; --erro-suave: #ffe4e6; --erro-texto: #be123c;
  --bloq: #64748b; --bloq-suave: #e2e8f0; --bloq-texto: #334155;
  --neutro-suave: #f1f5f9; --neutro-texto: #475569;
  /* barra de estados (validada: dataviz validate_palette, vizinhos) */
  --seg-confirmado: #15803d; --seg-aceito: #8b5cf6; --seg-incerto: #d97706; --seg-bloqueado: #64748b; --seg-falhou: #f43f5e; --seg-encerrado: #94a3b8; --trilho: #e2e8f0;
  --menu-fundo: #ffffff; --menu-texto: #0f172a; --menu-texto-2: #5b6b82; --menu-borda: #e2e8f0;
  --menu-hover: #f1f5f9; --menu-faixa: #ede9fe; --menu-ponta: #6d28d9; --sobre-ponta: #ffffff;
  --veu: rgba(15, 23, 42, .45); --sombra-1: 0 1px 2px rgba(15, 23, 42, .06); --sombra-menu: 0 12px 32px rgba(15, 23, 42, .18);
  --foco: #6d28d9;
}
:root[data-theme=dark] {
  color-scheme: dark;
  --fundo: #06080d; --sup: #11151e; --sup-2: #1a2030; --sup-3: #232b3e;
  --borda: #2d374f; --borda-forte: #3b4868;
  --texto-forte: #f8fafc; --texto: #e2e8f0; --texto-2: #b8c1d1; --texto-3: #8593a8;
  --acento: #7c3aed; --acento-forte: #6d28d9; --acento-suave: #2a1f4d; --acento-lavado: #1c1733; --acento-texto: #c4b5fd; --sobre-acento: #ffffff;
  --ok: #22a55a; --ok-suave: #12301f; --ok-texto: #4ade80;
  --alerta: #bf830e; --alerta-suave: #33280f; --alerta-texto: #fbbf24;
  --erro: #f0506a; --erro-forte: #f0506a; --erro-suave: #3a1820; --erro-texto: #fb7185;
  --bloq: #7a879c; --bloq-suave: #232b3e; --bloq-texto: #cbd5e1;
  --neutro-suave: #1a2030; --neutro-texto: #b8c1d1;
  --seg-confirmado: #22a55a; --seg-aceito: #8b6cf0; --seg-incerto: #bf830e; --seg-bloqueado: #7a879c; --seg-falhou: #f0506a; --seg-encerrado: #4b5568; --trilho: #232b3e;
  --menu-fundo: #1a2030; --menu-texto: #f8fafc; --menu-texto-2: #b8c1d1; --menu-borda: #3b4868;
  --menu-hover: #232b3e; --menu-faixa: #2a1f4d; --menu-ponta: #7c3aed; --sobre-ponta: #ffffff;
  --veu: rgba(0, 0, 0, .6); --sombra-1: 0 1px 2px rgba(0, 0, 0, .4); --sombra-menu: 0 12px 32px rgba(0, 0, 0, .55);
  --foco: #c4b5fd;
}

/* ── base ── */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--fonte); font-size: var(--fs-14); line-height: 1.45; color: var(--texto); background: var(--fundo); -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3, p, ul, ol, dl, dd { margin: 0; padding: 0; }
ul, ol { list-style: none; }
a { color: var(--acento-texto); }
:focus-visible { outline: 2px solid var(--foco); outline-offset: 2px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pular { position: absolute; left: 8px; top: -60px; z-index: 500; background: var(--sup); color: var(--texto); padding: 8px 12px; border-radius: var(--raio-p); }
.pular:focus { top: 8px; }
.num { font-variant-numeric: tabular-nums; }
svg { flex: none; }
[hidden] { display: none !important; }
.so-cel { display: none !important; }

/* ── botões ── */
.bt { height: var(--ctrl); display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 14px; border-radius: var(--raio-p); border: 1px solid transparent; font-size: var(--fs-14); font-weight: 600; cursor: pointer; white-space: nowrap; background: none; text-decoration: none; }
.bt.pri { background: var(--acento); color: var(--sobre-acento); }
.bt.pri:hover:not([disabled]) { background: var(--acento-forte); }
.bt.sec { background: var(--sup); color: var(--texto); border-color: var(--borda-forte); }
.bt.sec:hover:not([disabled]) { border-color: var(--acento); }
.bt.fant { color: var(--texto-2); }
.bt.fant:hover:not([disabled]) { color: var(--texto-forte); background: var(--sup-2); }
.bt.perigo { background: var(--sup); color: var(--erro-texto); border-color: var(--borda-forte); }
.bt.perigo:hover { border-color: var(--erro-texto); }
.bt.perigo-pri { background: var(--erro-forte); color: #fff; }
.bt[disabled] { opacity: .5; cursor: not-allowed; }
.bt.mini { height: 30px; padding: 0 10px; }
.bt-icone { width: var(--ctrl); height: var(--ctrl); display: inline-grid; place-items: center; border-radius: var(--raio-p); border: 1px solid transparent; background: none; color: var(--texto-2); cursor: pointer; padding: 0; position: relative; }
.bt-icone:hover { background: var(--sup-2); color: var(--texto-forte); }
.link { border: 0; background: none; padding: 0; color: var(--acento-texto); font-weight: 600; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; font-size: inherit; }

/* ── casca: barra lateral · cabeçalho · faixa · conteúdo ── */
.app { display: grid; grid-template-columns: var(--lat) minmax(0, 1fr); min-height: 100dvh; }
.app.recolhida { grid-template-columns: var(--lat-rec) minmax(0, 1fr); }
.miolo { min-width: 0; display: flex; flex-direction: column; }

.lateral { position: sticky; top: 0; height: 100dvh; display: flex; flex-direction: column; min-width: 0; background: var(--sup); border-right: 1px solid var(--borda); z-index: 30; }
.lat-topo { height: var(--cab); flex: none; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 10px 0 16px; border-bottom: 1px solid var(--borda); }
.lat-marca { display: flex; align-items: center; gap: 10px; min-width: 0; border: 0; background: none; padding: 4px 6px 4px 0; border-radius: var(--raio-p); cursor: pointer; text-align: left; }
.lat-marca:hover .lat-nome span { color: var(--texto); }
.marca-simbolo { width: 36px; height: 36px; border-radius: 10px; background: var(--acento); color: #fff; display: grid; place-items: center; flex: none; }
.lat-nome { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.lat-nome b { font-size: var(--fs-16); font-weight: 700; color: var(--texto-forte); white-space: nowrap; }
.lat-nome span { font-size: var(--fs-12); color: var(--texto-3); white-space: nowrap; display: inline-flex; align-items: center; gap: 4px; }
.lat-busca { margin: 12px 10px 0; height: var(--ctrl); display: flex; align-items: center; gap: 8px; padding: 0 10px; border: 1px solid var(--borda); border-radius: var(--raio-p); background: var(--sup-2); color: var(--texto-3); cursor: pointer; font-size: var(--fs-14); text-align: left; flex: none; }
.lat-busca:hover { border-color: var(--borda-forte); color: var(--texto-2); }
.lat-busca kbd { margin-left: auto; font: 600 var(--fs-12)/1 var(--fonte); color: var(--texto-3); border: 1px solid var(--borda-forte); border-radius: 4px; padding: 3px 5px; }
.lat-nav { flex: 1; min-height: 0; overflow-x: hidden; overflow-y: auto; padding: 12px 10px; display: flex; flex-direction: column; gap: 14px; scrollbar-width: thin; }
.lat-grupo { display: flex; flex-direction: column; gap: 2px; }
.lat-grupo-nome { height: 24px; display: flex; align-items: center; padding: 0 12px; font-size: var(--fs-12); font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: var(--texto-3); white-space: nowrap; }
.lat-item { position: relative; display: flex; align-items: center; gap: 12px; height: 40px; padding: 0 12px; border-radius: var(--raio-p); color: var(--texto-2); font-size: var(--fs-14); font-weight: 500; text-decoration: none; white-space: nowrap; flex: none; }
.lat-item:hover { background: var(--sup-2); color: var(--texto-forte); }
.lat-item[aria-current=page] { background: var(--acento-lavado); color: var(--acento-texto); font-weight: 600; }
.lat-item[aria-current=page]::before { content: ''; position: absolute; left: -10px; top: 9px; bottom: 9px; width: 3px; border-radius: 0 3px 3px 0; background: var(--acento); }
.lat-item.futuro { color: var(--texto-3); }
.lat-item.futuro svg { opacity: .7; }
.lat-qtd { margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--erro-suave); color: var(--erro-texto); font-size: var(--fs-12); font-weight: 700; display: inline-grid; place-items: center; font-variant-numeric: tabular-nums; }
.lat-pe { flex: none; border-top: 1px solid var(--borda); padding: 10px; display: flex; align-items: center; gap: 10px; }
.avatar { width: 32px; height: 32px; border-radius: 50%; display: inline-grid; place-items: center; background: var(--acento-suave); color: var(--acento-texto); font-size: var(--fs-12); font-weight: 700; flex: none; }
.lat-quem { min-width: 0; flex: 1; line-height: 1.25; }
.lat-quem b { display: block; font-size: var(--fs-14); font-weight: 600; color: var(--texto-forte); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lat-quem span { display: block; font-size: var(--fs-12); color: var(--texto-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.recolhida .lat-nome, .recolhida .lat-rot, .recolhida .lat-grupo-nome, .recolhida .lat-busca span, .recolhida .lat-busca kbd, .recolhida .lat-quem, .recolhida .lat-qtd { display: none; }
.recolhida .lat-item:has(.lat-qtd)::after { content: ''; position: absolute; top: 9px; right: 14px; width: 8px; height: 8px; border-radius: 50%; background: var(--erro-forte); box-shadow: 0 0 0 2px var(--sup); }
.recolhida .lat-topo { justify-content: center; padding: 0; flex-direction: column; height: auto; min-height: var(--cab); gap: 6px; padding: 12px 0; }
.recolhida .lat-marca { padding: 0; }
.recolhida .lat-item { justify-content: center; padding: 0; }
.recolhida .lat-busca { justify-content: center; padding: 0; margin: 12px 14px 0; }
.recolhida .lat-grupo { padding-top: 6px; border-top: 1px solid var(--borda); }
.recolhida .lat-grupo:first-child { border-top: 0; padding-top: 0; }
.recolhida .lat-pe { flex-direction: column; }
.lat-dica { position: fixed; z-index: 260; background: var(--texto-forte); color: var(--sup); font-size: var(--fs-12); font-weight: 600; padding: 6px 8px; border-radius: 6px; pointer-events: none; white-space: nowrap; }

.cab { height: var(--cab); flex: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 var(--pad); background: var(--sup); border-bottom: 1px solid var(--borda); }
.cab-tit { min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 2px; }
.cab-linha { display: flex; align-items: center; gap: 10px; min-width: 0; }
.cab h1 { font-size: var(--fs-20); font-weight: 700; letter-spacing: -.2px; color: var(--texto-forte); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.2; }
.trilha { display: flex; align-items: center; gap: 6px; font-size: var(--fs-12); color: var(--texto-3); white-space: nowrap; min-width: 0; line-height: 1.2; }
.trilha a { color: var(--texto-2); text-decoration: none; font-weight: 600; }
.trilha a:hover { color: var(--acento-texto); text-decoration: underline; }
.trilha .selo { display: none; }
.cab-dir { display: flex; align-items: center; gap: 10px; flex: none; }
.carimbo { font-size: var(--fs-12); color: var(--texto-3); white-space: nowrap; }
.so-estreito { display: none !important; }
@media (max-width: 1359px) { .so-largo { display: none !important; } .so-estreito { display: inline-grid !important; } .exemplo { display: none; } }
.exemplo { font-size: var(--fs-12); font-weight: 600; color: var(--alerta-texto); background: var(--alerta-suave); padding: 3px 8px; border-radius: 6px; white-space: nowrap; }
.sino-qtd { position: absolute; top: 3px; right: 3px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px; background: var(--erro-forte); color: #fff; font-size: 12px; line-height: 16px; font-weight: 700; text-align: center; font-variant-numeric: tabular-nums; }

/* faixa de filtros: logo abaixo do cabeçalho, sempre na mesma ordem (Visão · Busca · Período · dimensões · Filtros · etiquetas · Limpar) */
.faixa { flex: none; display: flex; align-items: flex-end; flex-wrap: nowrap; gap: 12px; padding: 12px var(--pad) 14px; background: var(--sup); border-bottom: 1px solid var(--borda); min-width: 0; }
.faixa > * { flex: none; }
.grupo { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.rotulo { height: 14px; display: flex; align-items: center; gap: 6px; font-size: var(--fs-12); line-height: 1; font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: var(--texto-3); white-space: nowrap; }
.rotulo .info { margin: -3px 0; }
.ctrl { height: var(--ctrl); display: inline-flex; align-items: center; gap: 8px; padding: 0 12px; background: var(--sup); border: 1px solid var(--borda-forte); border-radius: var(--raio-p); font-size: var(--fs-14); font-weight: 500; color: var(--texto); cursor: pointer; white-space: nowrap; min-width: 0; text-align: left; }
.ctrl:hover:not([disabled]) { border-color: var(--acento); }
.ctrl > svg { color: var(--texto-3); }
.ctrl .seta { margin-left: auto; }
.ctrl[aria-expanded=true] .seta { transform: rotate(180deg); }
.ctrl .txt { overflow: hidden; text-overflow: ellipsis; }
.ctrl-multi { min-width: 150px; max-width: 210px; }
.ctrl-multi.on { border-color: var(--acento); background: var(--acento-lavado); }
.ctrl-per { min-width: 240px; }
.busca { position: relative; display: flex; align-items: center; }
.busca svg { position: absolute; left: 11px; color: var(--texto-3); pointer-events: none; }
.busca input { width: 200px; height: var(--ctrl); padding: 0 12px 0 34px; border: 1px solid var(--borda-forte); border-radius: var(--raio-p); background: var(--sup); font-size: var(--fs-14); color: var(--texto); }
.busca input::placeholder { color: var(--texto-3); }
.busca input:focus { border-color: var(--acento); outline: none; box-shadow: 0 0 0 3px var(--acento-suave); }
.qtd { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--acento); color: var(--sobre-acento); font-size: var(--fs-12); font-weight: 700; display: inline-grid; place-items: center; }
.seg { display: inline-flex; height: var(--ctrl); border: 1px solid var(--borda-forte); border-radius: var(--raio-p); overflow: hidden; background: var(--sup); }
.seg button { border: 0; border-right: 1px solid var(--borda-forte); background: none; padding: 0 14px; font-size: var(--fs-14); font-weight: 600; color: var(--texto-2); cursor: pointer; white-space: nowrap; }
.seg button:last-child { border-right: 0; }
.seg button:hover:not([disabled]) { color: var(--texto-forte); }
.seg button[aria-pressed=true] { background: var(--acento); color: var(--sobre-acento); }
.seg button[disabled] { color: var(--texto-3); cursor: not-allowed; }
.fim-faixa { display: flex; align-items: flex-end; gap: 12px; }
.etiquetas { display: flex; gap: 8px; align-items: center; min-height: var(--ctrl); flex-wrap: nowrap; }
.etiquetas:empty { display: none; }
.etiqueta { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 5px 0 12px; border-radius: 999px; background: var(--acento-lavado); border: 1px solid var(--acento); color: var(--acento-texto); font-size: var(--fs-12); font-weight: 600; white-space: nowrap; }
.etiqueta button { width: 18px; height: 18px; border-radius: 50%; border: 0; background: transparent; color: inherit; cursor: pointer; display: inline-grid; place-items: center; padding: 0; }
.etiqueta button:hover { background: var(--acento); color: var(--sobre-acento); }

/* barra do assistente: os passos moram onde mora a faixa (mesma tira, mesma altura) */
.passos-faixa { padding: 14px var(--pad); background: var(--sup); border-bottom: 1px solid var(--borda); flex: none; }
.passos { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; counter-reset: passo; }
.passo { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 0; border: 0; background: none; cursor: pointer; text-align: left; color: var(--texto-2); }
.passo[disabled] { cursor: default; }
.passo .bola { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; flex: none; font-size: var(--fs-14); font-weight: 700; font-variant-numeric: tabular-nums; border: 1.5px solid var(--borda-forte); color: var(--texto-3); background: var(--sup); }
.passo .p-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.passo .p-txt b { font-size: var(--fs-14); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.passo .p-txt span { font-size: var(--fs-12); color: var(--texto-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.passo.feito .bola { background: var(--acento-suave); border-color: var(--acento-suave); color: var(--acento-texto); }
.passo.atual .bola { background: var(--acento); border-color: var(--acento); color: var(--sobre-acento); }
.passo.atual b { color: var(--texto-forte); }
.passo:not([disabled]):hover b { color: var(--acento-texto); }
.passos-cel { display: none; }

.area { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--vao); padding: var(--vao) var(--pad) 24px; flex: 1; min-width: 0; align-content: start; }
.area.com-painel { grid-template-columns: minmax(0, 1fr) var(--painel); align-items: start; }
.principal { display: flex; flex-direction: column; gap: var(--vao); min-width: 0; }
.sec-tit { display: flex; align-items: center; gap: 8px; font-size: var(--fs-16); font-weight: 700; color: var(--texto-forte); }
.sec-tit::after { content: ''; flex: 1; height: 1px; background: var(--borda); margin-left: 6px; }
.sec-tit .dir { order: 3; margin-left: 6px; font-size: var(--fs-12); font-weight: 500; color: var(--texto-3); }

/* ── ⓘ: abre no clique ── */
.info { width: 18px; height: 18px; border-radius: 50%; border: 1px solid var(--borda-forte); background: transparent; color: var(--texto-3); font: 700 var(--fs-12)/1 var(--fonte); display: inline-grid; place-items: center; cursor: pointer; padding: 0; flex: none; text-transform: none; letter-spacing: 0; }
.info:hover, .info[aria-expanded=true] { background: var(--acento); border-color: var(--acento); color: var(--sobre-acento); }

/* ── cartão de número: rótulo · valor · uma linha ── */
.kpis { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 14px; }
.principal { container-type: inline-size; }
.kpis.seis { --n: 6; }
@container (max-width: 1060px) { .kpis.seis { --n: 3; } }
@container (max-width: 1240px) { .kpis.seis.longos { --n: 3; } }   /* rótulos longos (Início): 6 por linha só com folga, senão 3 + 3 */
.kpi { background: var(--sup); border: 1px solid var(--borda); border-radius: var(--raio); box-shadow: var(--sombra-1); padding: 14px 16px; min-height: 104px; display: flex; flex-direction: column; gap: 6px; min-width: 0; text-align: left; color: inherit; font: inherit; text-decoration: none; }
.kpi-rot { display: flex; align-items: flex-start; gap: 6px; font-size: var(--fs-12); line-height: 1.25; font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: var(--texto-3); }
.kpi-rot > span { flex: 1; min-width: 0; }
.kpi-valor { font-size: var(--fs-28); font-weight: 700; line-height: 1.15; letter-spacing: -.3px; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--texto-forte); margin-top: auto; }
.kpi-apoio { font-size: var(--fs-12); line-height: 1.35; color: var(--texto-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-height: 16px; }
.kpi-apoio .ruim { color: var(--erro-texto); font-weight: 700; }
.kpi-apoio .atencao { color: var(--alerta-texto); font-weight: 700; }
.kpi[data-filtra], a.kpi { cursor: pointer; }
.kpi[data-filtra]:hover, a.kpi:hover { border-color: var(--acento); }
.kpi.on { border-color: var(--acento); box-shadow: 0 0 0 1px var(--acento); }
.kpi .marca-ruim { width: 8px; height: 8px; border-radius: 50%; background: var(--erro); flex: none; margin-top: 3px; }
.kpi .marca-atencao { width: 8px; height: 8px; border-radius: 2px; background: var(--alerta); flex: none; margin-top: 3px; }

/* ── quadro (caixa com título) ── */
.quadro { background: var(--sup); border: 1px solid var(--borda); border-radius: var(--raio); box-shadow: var(--sombra-1); display: flex; flex-direction: column; min-width: 0; }
.q-cab { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--borda); min-height: 48px; }
.q-cab h2, .q-cab h3 { font-size: var(--fs-14); font-weight: 600; color: var(--texto-forte); display: flex; align-items: center; gap: 6px; }
.q-cab .q-dir { font-size: var(--fs-12); color: var(--texto-3); white-space: nowrap; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.q-corpo { padding: 12px 16px; flex: 1; min-height: 0; }
.par { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--vao); align-items: stretch; }
.par-2-1 { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: var(--vao); align-items: stretch; }

/* linhas de lista (Início): o que é, estado, o que fazer */
.linhas { display: flex; flex-direction: column; }
.linha { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px 12px; padding: 10px 16px; border-bottom: 1px solid var(--borda); text-decoration: none; color: inherit; min-height: 56px; }
.linha:last-child { border-bottom: 0; }
a.linha:hover, .linha[data-ir]:hover { background: var(--sup-2); cursor: pointer; }
.linha-tit { display: flex; align-items: center; gap: 8px; min-width: 0; font-weight: 600; color: var(--texto-forte); }
.linha-tit > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.linha-sub { grid-column: 1; font-size: var(--fs-12); color: var(--texto-2); overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.linha-acao { grid-column: 2; grid-row: 1 / span 2; display: flex; align-items: center; gap: 8px; }

/* ── selo de estado: texto sempre, cor nunca sozinha ── */
.selo { display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 8px; border-radius: 999px; font-size: var(--fs-12); font-weight: 600; white-space: nowrap; background: var(--neutro-suave); color: var(--neutro-texto); vertical-align: middle; }
.selo::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: none; }
.selo.ok { background: var(--ok-suave); color: var(--ok-texto); }
.selo.alerta { background: var(--alerta-suave); color: var(--alerta-texto); }
.selo.erro { background: var(--erro-suave); color: var(--erro-texto); }
.selo.acento { background: var(--acento-suave); color: var(--acento-texto); }
.selo.bloq { background: var(--bloq-suave); color: var(--bloq-texto); }
.selo.bloq::before { border-radius: 1px; width: 7px; height: 7px; background: repeating-linear-gradient(45deg, currentColor 0 1.5px, transparent 1.5px 3px); box-shadow: inset 0 0 0 1px currentColor; }
.selo.alerta::before { border-radius: 1px; transform: rotate(45deg); }
.selo.vazio { background: none; padding: 0; }
.texto-estado { font-size: var(--fs-14); color: var(--texto-2); white-space: nowrap; }
.texto-estado.forte { color: var(--texto-forte); }

/* ── barra de estados por destino (segmentos com vão de 2 px) ── */
.estados { display: flex; gap: 2px; height: 8px; border-radius: 999px; overflow: hidden; background: var(--trilho); min-width: 60px; }
.estados i { display: block; height: 100%; }
.estados i:first-child { border-radius: 999px 0 0 999px; } .estados i:last-child { border-radius: 0 999px 999px 0; } .estados i:only-child { border-radius: 999px; }
.estados .confirmado { background: var(--seg-confirmado); }
.estados .aceito { background: var(--seg-aceito); }
.estados .incerto { background: var(--seg-incerto); }
.estados .bloqueado { background: repeating-linear-gradient(45deg, var(--seg-bloqueado) 0 2px, var(--trilho) 2px 4px); }
.estados .falhou { background: var(--seg-falhou); }
.estados .encerrado { background: var(--seg-encerrado); }
.estados .fila { background: var(--trilho); }
.prog { display: flex; flex-direction: column; gap: 4px; min-width: 150px; }
.prog-linha { display: flex; align-items: center; gap: 10px; }
.prog-linha .estados { flex: 1; }
.prog-num { font-size: var(--fs-12); font-weight: 600; color: var(--texto-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.prog-prob { font-size: var(--fs-12); white-space: nowrap; color: var(--texto-3); }
.prog-prob b { font-weight: 700; }
.prog-prob .f { color: var(--erro-texto); } .prog-prob .u { color: var(--alerta-texto); } .prog-prob .b { color: var(--bloq-texto); }
.legenda { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: var(--fs-12); color: var(--texto-2); }
.legenda span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.legenda i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.legenda .confirmado { background: var(--seg-confirmado); } .legenda .aceito { background: var(--seg-aceito); } .legenda .incerto { background: var(--seg-incerto); }
.legenda .bloqueado { background: repeating-linear-gradient(45deg, var(--seg-bloqueado) 0 2px, var(--trilho) 2px 4px); } .legenda .falhou { background: var(--seg-falhou); } .legenda .fila { background: var(--trilho); box-shadow: inset 0 0 0 1px var(--borda-forte); }

/* ── TRILHO DA SEQUÊNCIA: o objeto da casa Ágora (itens numerados + intervalo entre eles) ── */
.trilho { display: flex; align-items: stretch; gap: 0; min-width: 0; }
.estacao { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 6px; padding: 0; border: 0; background: none; text-align: left; color: inherit; font: inherit; }
button.estacao { cursor: pointer; border-radius: var(--raio-p); }
button.estacao:hover .est-tipo { color: var(--acento-texto); }
.estacao.on .est-bola { box-shadow: 0 0 0 3px var(--acento-suave); background: var(--acento); color: var(--sobre-acento); }
.est-topo { display: flex; align-items: center; gap: 0; }
.est-bola { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; flex: none; font-size: var(--fs-16); font-weight: 700; font-variant-numeric: tabular-nums; background: var(--acento-suave); color: var(--acento-texto); }
.est-linha { flex: 1; height: 2px; background: var(--borda-forte); margin: 0 8px; position: relative; display: flex; align-items: center; justify-content: center; min-width: 40px; }
.est-linha span { position: absolute; background: var(--sup); padding: 0 8px; font-size: var(--fs-12); font-weight: 600; color: var(--texto-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.est-tipo { font-size: var(--fs-14); font-weight: 600; color: var(--texto-forte); display: flex; align-items: center; gap: 6px; }
.est-tipo svg { color: var(--texto-3); }
.est-resumo { font-size: var(--fs-12); color: var(--texto-2); overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; padding-right: 16px; min-height: 32px; }
.estacao .prog { padding-right: 16px; min-width: 0; }
.estacao .prog-prob { white-space: normal; }
.estacao:last-child .est-resumo, .estacao:last-child .prog { padding-right: 0; }
/* versão vertical (editor do assistente): a mesma linha liga os itens de cima a baixo */
.seq { display: flex; flex-direction: column; }
.seq-item { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 0 14px; }
.seq-item .est-bola { grid-row: 1; }
.seq-fio { grid-column: 1; grid-row: 2 / span 2; display: flex; justify-content: center; padding: 6px 0; }
.seq-fio::before { content: ''; width: 2px; background: var(--borda-forte); height: 100%; }
.seq-cartao { grid-column: 2; grid-row: 1 / span 2; background: var(--sup); border: 1px solid var(--borda); border-radius: var(--raio); box-shadow: var(--sombra-1); margin-bottom: 0; min-width: 0; }
.seq-cartao.erro { border-color: var(--erro-texto); }
.seq-cab { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 8px 8px 14px; border-bottom: 1px solid var(--borda); min-height: 44px; }
.seq-cab b { font-size: var(--fs-14); font-weight: 600; color: var(--texto-forte); display: flex; align-items: center; gap: 8px; }
.seq-cab .bts { display: flex; gap: 2px; }
.seq-cab .bt-icone { width: 32px; height: 32px; }
.seq-corpo { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 10px; }
.seq-pausa { grid-column: 2; grid-row: 3; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 0; font-size: var(--fs-14); color: var(--texto-2); }
.seq-pausa > span { white-space: nowrap; }
.seq-pausa input { width: 64px; height: 32px; padding: 0 8px; border: 1px solid var(--borda-forte); border-radius: var(--raio-p); background: var(--sup); text-align: right; font-variant-numeric: tabular-nums; }
.seq-pausa select { height: 32px; padding: 0 8px; border: 1px solid var(--borda-forte); border-radius: var(--raio-p); background: var(--sup); }
.seq-add { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; padding: 12px 14px; border: 1px dashed var(--borda-forte); border-radius: var(--raio); }
.seq-add > span { font-size: var(--fs-14); font-weight: 600; color: var(--texto-2); margin-right: 4px; }
.arquivo { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--borda); border-radius: var(--raio-p); background: var(--sup-2); min-width: 0; }
.arquivo .nome { font-weight: 600; color: var(--texto-forte); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.arquivo .meta { font-size: var(--fs-12); color: var(--texto-3); white-space: nowrap; }
.arquivo .selo { margin-left: auto; }
.miniatura { width: 40px; height: 40px; border-radius: 6px; flex: none; background: linear-gradient(135deg, var(--acento-suave), var(--sup-3)); display: grid; place-items: center; color: var(--acento-texto); }
.barrinha { height: 4px; border-radius: 999px; background: var(--trilho); overflow: hidden; width: 80px; flex: none; }
.barrinha i { display: block; height: 100%; background: var(--acento); }
.contador { font-size: var(--fs-12); color: var(--texto-3); text-align: right; font-variant-numeric: tabular-nums; }
.variavel { font-weight: 600; color: var(--acento-texto); background: var(--acento-lavado); border-radius: 4px; padding: 0 3px; }

/* ── tabela com teto ── */
.tabela-caixa { background: var(--sup); border: 1px solid var(--borda); border-radius: var(--raio); overflow: auto; max-height: var(--teto); box-shadow: var(--sombra-1); scrollbar-width: thin; }
.p-teto-fim .tabela-caixa { max-height: calc(100dvh - 120px); }
.tabela { width: 100%; border-collapse: separate; border-spacing: 0; font-size: var(--fs-14); }
.tabela th { position: sticky; top: 0; z-index: 2; background: var(--sup-2); font-size: var(--fs-12); font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--texto-3); text-align: left; padding: 10px 10px; white-space: nowrap; border-bottom: 1px solid var(--borda); }
.tabela th .info { margin-left: 4px; vertical-align: -4px; }
.tabela th .th-sub { display: block; margin-top: 2px; font-weight: 600; color: var(--texto-3); letter-spacing: .3px; }
.tabela td { padding: 10px 10px; border-bottom: 1px solid var(--borda); white-space: nowrap; vertical-align: middle; }
.tabela tbody tr:last-child td { border-bottom: 0; }
.tabela tbody tr[data-ir] { cursor: pointer; }
.tabela tbody tr[data-ir]:hover td, .tabela tbody tr.clic:hover td { background: var(--sup-2); }
.tabela tbody tr.sel td { background: var(--acento-lavado); }
.tabela .n { text-align: right; font-variant-numeric: tabular-nums; }
.tabela .c { text-align: center; }
.tabela .chk { width: 44px; padding-right: 0; }
.tabela .chk input { width: 16px; height: 16px; margin: 0; accent-color: var(--acento); vertical-align: middle; }
.tabela th:first-child, .tabela td:first-child { padding-left: 14px; }
.tabela th:last-child, .tabela td:last-child { padding-right: 14px; }
.tabela .nome { font-weight: 600; color: var(--texto-forte); overflow: hidden; text-overflow: ellipsis; max-width: 320px; }
.tabela .prim .nome, .tabela .prim .sub { display: block; max-width: 250px; overflow: hidden; text-overflow: ellipsis; }
.tabela .sub.quebra { white-space: normal; max-width: 230px; min-width: 150px; line-height: 1.35; }
.tabela td.quebra { white-space: normal; max-width: 170px; }
.tabela .sub { display: block; font-size: var(--fs-12); font-weight: 400; color: var(--texto-3); overflow: hidden; text-overflow: ellipsis; margin-top: 2px; }
.tabela .sub.erro { color: var(--erro-texto); font-weight: 600; }
.tabela .sub.alerta { color: var(--alerta-texto); font-weight: 600; }
.tabela .menos { color: var(--texto-3); }
.tabela .acoes-linha { text-align: right; width: 1%; }
.tabela .acoes-linha .bt-icone { width: 32px; height: 32px; }
.tabela tfoot td { position: sticky; bottom: 0; background: var(--sup-2); font-weight: 700; border-top: 1px solid var(--borda-forte); border-bottom: 0; }
.p-teto-rodape { font-size: var(--fs-12); color: var(--texto-3); padding: 6px 2px 0; }
.ocup { display: flex; flex-direction: column; gap: 4px; min-width: 140px; }
.ocup-linha { display: flex; align-items: center; gap: 8px; font-variant-numeric: tabular-nums; }
.ocup .barra { flex: 1; height: 6px; border-radius: 999px; background: var(--trilho); overflow: hidden; min-width: 60px; display: flex; gap: 2px; }
.ocup .barra i { display: block; height: 100%; background: var(--acento); }
.ocup .barra i.res { background: repeating-linear-gradient(45deg, var(--acento) 0 2px, var(--trilho) 2px 4px); }
.ocup .barra.cheia i:first-child { background: var(--texto-3); }
.direito { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-14); color: var(--texto-2); white-space: nowrap; }
.direito svg { color: var(--ok); }
.selecao { display: flex; align-items: center; gap: 12px; padding: 8px 12px 8px 16px; background: var(--acento-lavado); border: 1px solid var(--acento); border-radius: var(--raio); }
.selecao b { color: var(--acento-texto); }
.selecao .bt.fant { margin-left: auto; }
.parcial { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border: 1px solid var(--alerta); background: var(--alerta-suave); color: var(--alerta-texto); border-radius: var(--raio); font-weight: 600; }
.parcial .bt { margin-left: auto; }

/* ── estados de lista: carregando · vazio · erro · sem permissão ── */
.vazio { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 56px 16px; text-align: center; color: var(--texto-2); background: var(--sup); border: 1px dashed var(--borda-forte); border-radius: var(--raio); }
.vazio b { font-size: var(--fs-16); color: var(--texto-forte); }
.vazio .bt { margin-top: 8px; }
.vazio.falha { border-style: solid; border-color: var(--erro-texto); }
.vazio.falha b { color: var(--erro-texto); }
.esqueleto td span { display: block; height: 12px; border-radius: 6px; background: linear-gradient(90deg, var(--sup-2) 25%, var(--sup-3) 50%, var(--sup-2) 75%); background-size: 200% 100%; animation: brilho 1.4s infinite; }
@keyframes brilho { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .esqueleto td span { animation: none; } }

/* ── painel do destino (à direita; gaveta abaixo de 1360) ── */
.painel { background: var(--sup); border: 1px solid var(--borda); border-radius: var(--raio); box-shadow: var(--sombra-1); display: flex; flex-direction: column; min-width: 0; position: sticky; top: 16px; max-height: calc(100dvh - 32px); }
.painel-topo { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 10px 10px 16px; border-bottom: 1px solid var(--borda); flex: none; }
.painel-topo h2 { font-size: var(--fs-16); font-weight: 700; color: var(--texto-forte); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.painel-corpo { overflow-y: auto; padding: 14px 16px 18px; display: flex; flex-direction: column; gap: 16px; scrollbar-width: thin; }
.fatos { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 14px; font-size: var(--fs-14); }
.fatos dt { color: var(--texto-3); font-size: var(--fs-12); font-weight: 600; text-transform: uppercase; letter-spacing: .5px; padding-top: 2px; white-space: nowrap; }
.fatos dd { color: var(--texto); min-width: 0; }
.bloco-tit { font-size: var(--fs-14); font-weight: 700; color: var(--texto-forte); margin-bottom: 8px; display: flex; align-items: center; gap: 8px; }
.tentativas { display: flex; flex-direction: column; gap: 0; border-left: 2px solid var(--borda); margin-left: 6px; }
.tentativa { position: relative; padding: 0 0 12px 16px; }
.tentativa::before { content: ''; position: absolute; left: -7px; top: 3px; width: 12px; height: 12px; border-radius: 50%; background: var(--sup); border: 2px solid var(--borda-forte); }
.tentativa.ok::before { border-color: var(--ok); background: var(--ok); }
.tentativa.erro::before { border-color: var(--erro); background: var(--erro); }
.tentativa.alerta::before { border-color: var(--alerta); background: var(--alerta); }
.tentativa.acento::before { border-color: var(--acento); background: var(--acento); }
.tentativa .t-tit { font-weight: 600; color: var(--texto-forte); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tentativa .t-meta { font-size: var(--fs-12); color: var(--texto-3); font-variant-numeric: tabular-nums; }
.tentativa .t-txt { font-size: var(--fs-14); color: var(--texto-2); margin-top: 2px; }
.tentativa code, .cod { font-family: var(--fonte); font-size: var(--fs-12); font-weight: 600; background: var(--sup-2); border: 1px solid var(--borda); border-radius: 4px; padding: 1px 5px; color: var(--texto-2); }
.item-dest { border: 1px solid var(--borda); border-radius: var(--raio-p); padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; }
.item-dest-cab { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.item-dest-cab b { font-weight: 600; color: var(--texto-forte); display: flex; gap: 6px; align-items: center; }
.recibo { font-size: var(--fs-12); color: var(--texto-2); font-variant-numeric: tabular-nums; }
.proximo { display: flex; flex-direction: column; gap: 0; flex: 1; }
.proximo .linha { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 12px 16px 14px; }
.proximo .linha-tit > span:first-child, .proximo .linha-sub { white-space: normal; }
.proximo .linha-acao { margin-top: 6px; }

/* ── assistente ── */
.ass { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--vao); align-items: start; }
.ass-form { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.ass-cartao { background: var(--sup); border: 1px solid var(--borda); border-radius: var(--raio); box-shadow: var(--sombra-1); padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 18px; }
.ass-cartao > h2 { font-size: var(--fs-16); font-weight: 700; color: var(--texto-forte); }
.ass-cartao > p { color: var(--texto-2); margin-top: -10px; }
.plano { position: sticky; top: 16px; background: var(--sup); border: 1px solid var(--borda); border-radius: var(--raio); box-shadow: var(--sombra-1); }
.plano-cab { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--borda); }
.plano-cab h2 { font-size: var(--fs-14); font-weight: 600; color: var(--texto-forte); }
.plano dl { display: flex; flex-direction: column; }
.plano-linha { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 8px; padding: 10px 16px; border-bottom: 1px solid var(--borda); }
.plano-linha:last-child { border-bottom: 0; }
.plano-linha dt { font-size: var(--fs-12); font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: var(--texto-3); }
.plano-linha dd { grid-column: 1; color: var(--texto-forte); font-weight: 500; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.plano-linha dd.falta { color: var(--texto-3); font-weight: 400; }
.plano-linha .link { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-size: var(--fs-12); }
#rodape { position: sticky; bottom: 0; z-index: 20; }
.rodape-ass { display: flex; align-items: center; gap: 10px; padding: 12px var(--pad); background: var(--sup); border-top: 1px solid var(--borda); box-shadow: 0 -4px 12px rgba(15, 23, 42, .04); }
.rodape-ass .estado-rasc { font-size: var(--fs-12); color: var(--texto-3); margin-right: auto; white-space: nowrap; flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.rodape-ass > .bt { flex: none; }
.rodape-ass .motivo { font-size: var(--fs-12); color: var(--alerta-texto); font-weight: 600; white-space: nowrap; }
.revisao { display: flex; flex-direction: column; }
.rev-bloco { display: grid; grid-template-columns: 180px minmax(0, 1fr) auto; gap: 4px 16px; padding: 14px 0; border-bottom: 1px solid var(--borda); align-items: start; }
.rev-bloco:last-child { border-bottom: 0; }
.rev-bloco dt { font-size: var(--fs-12); font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: var(--texto-3); padding-top: 2px; }
.rev-bloco dd { min-width: 0; color: var(--texto); display: flex; flex-direction: column; gap: 4px; }
.rev-bloco dd b { color: var(--texto-forte); font-weight: 600; }
.rev-bloco dd small { font-size: var(--fs-12); color: var(--texto-3); }
.checagem { display: flex; flex-direction: column; }
.checagem li { display: flex; gap: 10px; align-items: flex-start; padding: 10px 16px; border-bottom: 1px solid var(--borda); }
.checagem li:last-child { border-bottom: 0; }
.checagem svg { margin-top: 2px; }
.checagem .ok svg { color: var(--ok); } .checagem .alerta svg { color: var(--alerta); } .checagem .erro svg { color: var(--erro-texto); }
.checagem small { display: block; font-size: var(--fs-12); color: var(--texto-3); }

/* formulário (estilo formulário, não landing) */
.campo { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.campo > label, .campo > .leg { font-size: var(--fs-14); font-weight: 600; color: var(--texto-forte); display: flex; align-items: center; gap: 6px; }
.campo .obrig { color: var(--erro-texto); }
.entrada { width: 100%; height: 40px; padding: 0 12px; border: 1px solid var(--borda-forte); border-radius: var(--raio-p); background: var(--sup); color: var(--texto); font-size: var(--fs-14); }
textarea.entrada { height: auto; min-height: 84px; padding: 10px 12px; resize: vertical; line-height: 1.5; }
.entrada:focus { outline: none; border-color: var(--acento); box-shadow: 0 0 0 3px var(--acento-suave); }
.campo .ajuda { font-size: var(--fs-12); color: var(--texto-3); }
.campo .erro-msg { font-size: var(--fs-12); font-weight: 600; color: var(--erro-texto); }
.campo.invalido .entrada { border-color: var(--erro-texto); }
.dupla { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tripla { display: grid; grid-template-columns: 1fr 1fr 1.4fr; gap: 12px; }
.opcoes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.opcoes.uma { grid-template-columns: 1fr; }
.opcao { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--borda-forte); border-radius: var(--raio-p); cursor: pointer; background: var(--sup); min-width: 0; }
.opcao:has(input:checked) { border-color: var(--acento); background: var(--acento-lavado); box-shadow: 0 0 0 1px var(--acento); }
.opcao:has(input:disabled) { cursor: not-allowed; background: var(--sup-2); }
.opcao input { width: 16px; height: 16px; margin: 2px 0 0; accent-color: var(--acento); flex: none; }
.opcao .o-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.opcao b { font-weight: 600; color: var(--texto-forte); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.opcao:has(input:disabled) b { color: var(--texto-2); }
.opcao small { font-size: var(--fs-12); color: var(--texto-2); }
.opcao .o-dir { margin-left: auto; text-align: right; font-size: var(--fs-12); color: var(--texto-3); white-space: nowrap; }
.resumo-alcance { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 12px 14px; border-radius: var(--raio-p); background: var(--sup-2); }
.resumo-alcance > b { font-size: var(--fs-16); color: var(--texto-forte); font-variant-numeric: tabular-nums; }
.fora-lista { display: flex; flex-direction: column; gap: 6px; font-size: var(--fs-14); }
.fora-lista li { display: flex; gap: 8px; align-items: baseline; }
.fora-lista li span { color: var(--texto-2); }
.fora-lista li b { font-weight: 600; color: var(--texto-forte); }

/* ── pareamento ── */
.parear { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--vao); align-items: stretch; }
.passos-parear { display: flex; flex-direction: column; gap: 14px; counter-reset: pp; }
.passos-parear li { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 12px; align-items: start; }
.passos-parear .est-bola { width: 32px; height: 32px; font-size: var(--fs-14); }
.passos-parear b { display: block; color: var(--texto-forte); font-weight: 600; }
.passos-parear span { color: var(--texto-2); }
.qr-caixa { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 8px 0; text-align: center; }
.qr { position: relative; width: 232px; height: 232px; padding: 12px; background: #fff; border: 1px solid var(--borda-forte); border-radius: var(--raio); }
.qr svg { width: 100%; height: 100%; display: block; }
.qr-veu { position: absolute; inset: 0; border-radius: var(--raio); background: rgba(255, 255, 255, .92); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: #1e293b; font-weight: 600; padding: 16px; }
:root[data-theme=dark] .qr-veu { background: rgba(17, 21, 30, .94); color: var(--texto); }
.qr-carimbo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(-12deg); font-size: var(--fs-12); font-weight: 700; letter-spacing: 1px; color: #6d28d9; background: #fff; border: 1.5px solid #6d28d9; border-radius: 4px; padding: 2px 6px; }
.clepsidra { width: 232px; display: flex; flex-direction: column; gap: 6px; }
.clepsidra .barrinha { width: 100%; height: 6px; }
.clepsidra .barrinha i { transition: width 1s linear; }
.clepsidra .barrinha.fim i { background: var(--alerta); }
.clepsidra-txt { display: flex; justify-content: space-between; font-size: var(--fs-12); color: var(--texto-2); font-variant-numeric: tabular-nums; }
.clepsidra-txt b { color: var(--texto-forte); }
.estado-par { font-weight: 600; color: var(--texto-forte); display: flex; align-items: center; gap: 8px; }
.historico { display: flex; flex-direction: column; }
.historico li { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--borda); font-size: var(--fs-14); }
.historico li:last-child { border-bottom: 0; }
.historico .quando { color: var(--texto-3); font-variant-numeric: tabular-nums; font-size: var(--fs-12); padding-top: 2px; }
.identidade { border: 1px solid var(--alerta); background: var(--alerta-suave); color: var(--alerta-texto); border-radius: var(--raio-p); padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; text-align: left; width: 100%; }
.identidade b { color: var(--alerta-texto); }
.identidade .num { white-space: nowrap; }
.lat-fechar { display: none !important; }
.identidade .bts { display: flex; gap: 8px; flex-wrap: wrap; }

/* ── menus (portal) — cor explícita, nunca herdada ── */
.pop { position: fixed; z-index: 200; background: var(--menu-fundo); color: var(--menu-texto); border: 1px solid var(--menu-borda); border-radius: 10px; box-shadow: var(--sombra-menu); font-size: var(--fs-14); overflow-y: auto; }
.pop button { font: inherit; color: inherit; }
.menu-lista { padding: 4px; min-width: 240px; }
.menu-busca { padding: 8px; border-bottom: 1px solid var(--menu-borda); }
.menu-busca input { width: 100%; height: 32px; padding: 0 10px; border: 1px solid var(--menu-borda); border-radius: 6px; background: var(--menu-fundo); color: var(--menu-texto); }
.menu-op { width: 100%; display: flex; align-items: center; gap: 10px; min-height: 36px; padding: 6px 10px; border: 0; background: none; border-radius: 6px; text-align: left; cursor: pointer; text-decoration: none; color: inherit; }
.menu-op:hover, .menu-op:focus-visible { background: var(--menu-hover); }
.menu-op[aria-selected=true] { font-weight: 600; }
.menu-op .marca { width: 16px; color: var(--menu-ponta); }
.menu-op[disabled] { opacity: .45; cursor: not-allowed; }
.menu-op.perigo { color: var(--erro-texto); }
.menu-op small { display: block; font-size: var(--fs-12); color: var(--menu-texto-2); font-weight: 400; }
.menu-sep { height: 1px; background: var(--menu-borda); margin: 4px 0; }
.menu-tit { padding: 8px 10px 4px; font-size: var(--fs-12); font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: var(--menu-texto-2); }
.pop .menu-limpar { width: 100%; text-align: left; border: 0; border-bottom: 1px solid var(--menu-borda); background: none; padding: 9px 10px; font-size: var(--fs-12); font-weight: 700; color: var(--menu-ponta); cursor: pointer; }
:root[data-theme=dark] .pop .menu-limpar { color: #c4b5fd; }
.menu-chk { display: flex; align-items: center; gap: 10px; min-height: 36px; padding: 6px 10px; border-radius: 6px; cursor: pointer; }
.menu-chk:hover { background: var(--menu-hover); }
.menu-chk input { width: 16px; height: 16px; margin: 0; accent-color: var(--menu-ponta); flex: none; }
.menu-chk .q { margin-left: auto; font-size: var(--fs-12); color: var(--menu-texto-2); font-variant-numeric: tabular-nums; }
.info-caixa { max-width: min(340px, calc(100vw - 32px)); padding: 12px 14px; line-height: 1.5; }
.mais-pop { padding: 12px; display: flex; flex-direction: column; gap: 12px; min-width: 260px; }
.mais-pop .ctrl { width: 100%; }
.alerta-op { display: grid; grid-template-columns: 10px minmax(0, 1fr); gap: 10px; padding: 10px; border-radius: 6px; text-decoration: none; color: inherit; }
.alerta-op:hover { background: var(--menu-hover); }
.alerta-op i { width: 8px; height: 8px; border-radius: 50%; margin-top: 6px; background: var(--erro); }
.alerta-op i.a { background: var(--alerta); border-radius: 2px; }
.alerta-op b { display: block; font-weight: 600; }
.alerta-op small { font-size: var(--fs-12); color: var(--menu-texto-2); }

/* período: atalhos + calendário de intervalo (desenho shadcn/ui, escrito à mão) — o mesmo componente da casa */
.per-pop { display: grid; grid-template-columns: auto auto; }
.per-atalhos { display: flex; flex-direction: column; gap: 2px; padding: 12px 8px; border-right: 1px solid var(--menu-borda); }
.per-atalhos button { height: 32px; padding: 0 12px; text-align: left; border: 0; background: none; border-radius: 6px; cursor: pointer; white-space: nowrap; }
.per-atalhos button:hover { background: var(--menu-hover); }
.per-atalhos button[aria-pressed=true] { background: var(--menu-hover); font-weight: 600; }
.per-cal { padding: 12px; }
.per-meses { display: flex; gap: 16px; }
.per-topo { display: grid; grid-template-columns: 28px 1fr 28px; align-items: center; height: 28px; margin-bottom: 8px; }
.per-topo b { grid-column: 2; text-align: center; font-weight: 600; }
.per-nav { width: 28px; height: 28px; border: 1px solid var(--menu-borda) !important; border-radius: 6px; background: none; display: grid; place-items: center; cursor: pointer; padding: 0; color: var(--menu-texto-2) !important; }
.per-nav:hover:not(:disabled) { background: var(--menu-hover); }
.per-nav:disabled { opacity: .3; cursor: default; }
.per-grade { display: grid; grid-template-columns: repeat(7, 36px); row-gap: 2px; }
.per-grade > span { height: 28px; display: grid; place-items: center; font-size: var(--fs-12); color: var(--menu-texto-2); }
.dia { height: 36px; border: 0; background: none; border-radius: 6px; font-variant-numeric: tabular-nums; cursor: pointer; padding: 0; }
.dia:hover:not(:disabled) { background: var(--menu-hover); }
.dia.hoje { font-weight: 700; box-shadow: inset 0 0 0 1px var(--menu-borda); }
.dia.meio { background: var(--menu-faixa); border-radius: 0; }
.dia.ini, .dia.fim { background: var(--menu-ponta) !important; color: var(--sobre-ponta) !important; box-shadow: none; }
.dia.ini { border-radius: 6px 0 0 6px; } .dia.fim { border-radius: 0 6px 6px 0; } .dia.ini.fim { border-radius: 6px; }
.dia:disabled { opacity: .35; cursor: default; }
.per-pe { grid-column: 1 / -1; border-top: 1px solid var(--menu-borda); padding: 10px 14px; font-size: var(--fs-12); color: var(--menu-texto-2); }

/* ── modal ── */
.modal-fundo { position: fixed; inset: 0; z-index: 300; background: var(--veu); display: grid; place-items: center; padding: 16px; }
.modal { width: min(600px, 100%); max-height: calc(100dvh - 32px); display: flex; flex-direction: column; background: var(--sup); border-radius: var(--raio); box-shadow: var(--sombra-menu); overflow: hidden; }
.modal.largo { width: min(820px, 100%); }
.modal-cab { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px 14px 20px; border-bottom: 1px solid var(--borda); }
.modal-cab h2 { font-size: var(--fs-16); font-weight: 700; color: var(--texto-forte); }
.modal-corpo { flex: 1; overflow-y: auto; padding: 18px 20px; display: flex; flex-direction: column; gap: 16px; }
.modal-corpo p { color: var(--texto-2); }
.modal-pe { flex: none; display: flex; justify-content: flex-end; align-items: center; gap: 8px; padding: 12px 20px; border-top: 1px solid var(--borda); }
.modal-pe .pe-esq { margin-right: auto; font-size: var(--fs-12); color: var(--texto-3); }
.lista-impacto { display: flex; flex-direction: column; border: 1px solid var(--borda); border-radius: var(--raio-p); }
.lista-impacto li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 10px 12px; border-bottom: 1px solid var(--borda); align-items: center; }
.lista-impacto li:last-child { border-bottom: 0; }
.lista-impacto li b { color: var(--texto-forte); font-weight: 600; }
.lista-impacto li small { display: block; color: var(--texto-3); font-size: var(--fs-12); }
.lista-impacto .n { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--texto-forte); }
.resultado { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: var(--raio-p); background: var(--ok-suave); color: var(--ok-texto); }
.resultado.procura { background: var(--sup-2); color: var(--texto-2); }

.retorno { position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%); z-index: 400; max-width: calc(100vw - 32px); background: var(--texto-forte); color: var(--sup); padding: 10px 16px; border-radius: var(--raio-p); box-shadow: var(--sombra-menu); font-size: var(--fs-14); }
.veu { position: fixed; inset: 0; background: var(--veu); z-index: 140; }

/* ── 1100–1359: painel do destino vira gaveta sobre a tabela ── */
@media (max-width: 1359px) {
  .area.com-painel { grid-template-columns: minmax(0, 1fr); }
  .area.com-painel .painel { position: fixed; top: 0; right: 0; bottom: 0; width: min(420px, 100vw); max-height: none; border-radius: 0; z-index: 160; box-shadow: var(--sombra-menu); }
  .ass { grid-template-columns: minmax(0, 1fr) 300px; }
  .tripla { grid-template-columns: 1fr 1fr; }
  .tripla > :last-child { grid-column: 1 / -1; }
}
/* ── tablet: a barra lateral vira gaveta ── */
@media (max-width: 1099px) {
  .app, .app.recolhida { grid-template-columns: minmax(0, 1fr); }
  .lateral { position: fixed; left: 0; top: 0; bottom: 0; width: var(--lat); transform: translateX(-100%); transition: transform .18s ease; z-index: 170; }
  .app.gaveta .lateral { transform: none; box-shadow: var(--sombra-menu); }
  .recolhida .lat-nome, .recolhida .lat-rot, .recolhida .lat-grupo-nome, .recolhida .lat-quem, .recolhida .lat-qtd { display: revert; }
  .so-cel-menu { display: inline-grid !important; }
  .lat-recolher { display: none !important; }
  .lat-fechar { display: inline-grid !important; }
  .ass { grid-template-columns: minmax(0, 1fr); }
  .plano { position: static; }
  .parear { grid-template-columns: 1fr; }
}
@media (min-width: 1100px) { .so-cel-menu { display: none !important; } }
@media (prefers-reduced-motion: reduce) { .lateral { transition: none; } }

/* ── celular (390): faixa quebra em linhas, tabela vira cartão, painel ocupa a tela ── */
@media (max-width: 640px) {
  :root { --pad: 16px; --vao: 12px; --ctrl: 40px; --cab: 56px; }
  .so-cel { display: revert !important; }
  .busca input, .entrada, .seq-pausa input, .seq-pausa select, .menu-busca input { font-size: var(--fs-16); }
  .busca input::placeholder, .menu-busca input::placeholder { font-size: var(--fs-14); }
  .so-desk { display: none !important; }
  .cab { position: sticky; top: 0; z-index: 25; padding: 0 8px 0 4px; gap: 6px; }
  .cab h1 { font-size: var(--fs-16); }
  .cab .carimbo, .cab .exemplo { display: none; }
  .cab-dir .bt .rot-longo { display: none; }
  .cab-dir .bt { padding: 0 12px; }
  .faixa { flex-wrap: wrap; padding: 10px var(--pad) 12px; gap: 10px; }
  .faixa > .grupo { flex: 1 1 100%; }
  .faixa > .g-visao { order: 0; } .faixa > .g-per { order: 1; } .faixa > .g-busca { order: 2; } .faixa > .g-mais { order: 3; } .faixa > .fim-faixa { order: 4; }
  .faixa > .grupo.g-busca { flex: 1 1 0; min-width: 0; }
  .faixa > .grupo.g-mais { flex: none; }
  .faixa > .grupo.g-mais .rotulo { display: none; }
  .faixa .ctrl, .faixa .seg, .busca, .busca input { width: 100%; max-width: none; }
  .seg button { flex: 1; padding: 0 8px; }
  .fim-faixa { flex: none; flex-wrap: wrap; }
  .fim-faixa:has(.etiquetas:not(:empty)) { flex: 1 1 100%; }
  .fim-faixa:empty { display: none; }
  .etiquetas { flex-wrap: wrap; min-height: 0; }
  .kpis { --n: 2 !important; gap: 10px; }
  .kpi { min-height: 96px; padding: 12px; }
  .kpi-valor { font-size: 24px; }
  .par, .par-2-1 { grid-template-columns: 1fr; }
  .p-teto-fim .tabela-caixa { max-height: calc(100dvh - 140px); }
  .tabela-caixa { max-height: 380px; }
  /* tabela empilhada: cada linha vira um cartão com rótulo · valor */
  .empilha thead { display: none; }
  .empilha, .empilha tbody, .empilha tr, .empilha td { display: block; width: 100%; }
  .empilha tbody tr { padding: 12px 14px; border-bottom: 1px solid var(--borda); position: relative; }
  .empilha tbody tr:last-child { border-bottom: 0; }
  .empilha td { border: 0; padding: 3px 0; white-space: normal; display: flex; gap: 12px; align-items: center; justify-content: space-between; text-align: right; }
  .empilha td::before { content: attr(data-r); font-size: var(--fs-12); font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: var(--texto-3); text-align: left; flex: none; }
  .empilha td.prim { display: block; text-align: left; padding: 0 44px 6px 0; }
  .empilha td.prim::before { content: none; }
  .empilha td.prim .sub { text-align: left; }
  .empilha .sub.so-cel { display: block !important; }
  .empilha td.chk { position: absolute; right: 14px; top: 12px; width: auto; padding: 0; }
  .empilha td.chk::before { content: none; }
  .empilha td.acoes-linha { position: absolute; right: 8px; top: 6px; width: auto; padding: 0; }
  .empilha td.acoes-linha::before { content: none; }
  .empilha td.n { justify-content: space-between; }
  .empilha .nome { max-width: none; white-space: normal; }
  .empilha .prog, .empilha .ocup { min-width: 0; width: 60%; }
  .empilha .sub { white-space: normal; }
  .empilha td.vaz { display: none; }
  .empilha td { flex-wrap: wrap; row-gap: 4px; }
  .empilha td > .sub, .empilha td .sub.quebra { flex-basis: 100%; max-width: none; min-width: 0; text-align: right; margin-top: 0; }
  .empilha td.quebra { max-width: none; }
  .trilho { flex-direction: column; gap: 12px; }
  .est-linha { display: none; }
  .estacao { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 4px 12px; }
  .estacao .est-topo { grid-row: 1 / span 3; align-self: start; }
  .estacao .est-resumo, .estacao .prog { padding-right: 0; }
  .est-int { display: inline !important; }
  .passos-faixa { padding: 10px var(--pad); }
  .passos { display: none; }
  .passos-cel { display: flex; flex-direction: column; gap: 6px; }
  .passos-cel .p-cel-txt { display: flex; justify-content: space-between; font-size: var(--fs-14); }
  .passos-cel b { color: var(--texto-forte); }
  .passos-cel .barrinha { width: 100%; height: 6px; }
  .rodape-ass { padding: 10px var(--pad); flex-wrap: wrap; }
  .rodape-ass .estado-rasc { flex: 1 1 100%; }
  .rodape-ass .bt { flex: 1; }
  .rodape-ass .bt.pri { flex: 2 1 100%; white-space: normal; height: auto; min-height: 44px; padding: 8px 12px; text-align: center; }
  .ass-cartao { padding: 14px; }
  .opcoes, .dupla, .tripla { grid-template-columns: 1fr; }
  .tripla > :last-child { grid-column: auto; }
  .rev-bloco { grid-template-columns: minmax(0, 1fr) auto; }
  .rev-bloco dd { grid-column: 1 / -1; grid-row: 2; }
  .rev-bloco .link { grid-column: 2; grid-row: 1; }
  .modal-fundo { place-items: end stretch; padding: 0; }
  .modal, .modal.largo { width: 100%; max-height: 92dvh; border-radius: var(--raio) var(--raio) 0 0; }
  .painel, .area.com-painel .painel { width: 100vw; }
  .linha { padding: 10px 14px; }
  .q-cab { flex-wrap: wrap; row-gap: 2px; }
  .q-cab .q-dir { white-space: normal; }
  .historico li { grid-template-columns: 1fr; gap: 2px; }
  .parear .q-qr { order: -1; }
  .arquivo { flex-wrap: wrap; }
  .arquivo .nome { white-space: normal; overflow-wrap: anywhere; }
  .cab-tit .selo { display: none; }
  .trilha .selo { display: inline-flex !important; height: 18px; }
  .pop.per-pop { grid-template-columns: 1fr; }
  .per-atalhos { flex-direction: row; flex-wrap: wrap; border-right: 0; border-bottom: 1px solid var(--menu-borda); }
  .per-grade { grid-template-columns: repeat(7, 40px); }
  .dia { height: 40px; }
  .selecao { flex-wrap: wrap; }
}
.est-int { display: none; font-size: var(--fs-12); color: var(--texto-3); font-weight: 600; }

/* ════════════ acréscimos da tela real (06/11/2026) ════════════ */
#veu-painel { z-index: 150; }
.carga-inicial { position: fixed; inset: 0; display: grid; place-items: center; padding: 24px; text-align: center; color: var(--texto-2); font-size: var(--fs-16); background: var(--fundo); }
.lat-emp { overflow: hidden; text-overflow: ellipsis; max-width: 150px; }

/* Entrar e Nova senha: formulário simples, letra grande, uma coluna */
.porta { min-height: 100dvh; display: grid; place-items: center; padding: 32px 16px; background: var(--fundo); }
.porta-caixa { width: min(440px, 100%); background: var(--sup); border: 1px solid var(--borda); border-radius: var(--raio); box-shadow: var(--sombra-1); padding: 28px 28px 24px; display: flex; flex-direction: column; gap: 14px; }
.porta-marca { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; }
.porta-marca > span:last-child { display: flex; flex-direction: column; line-height: 1.25; }
.porta-marca b { font-size: var(--fs-16); font-weight: 700; color: var(--texto-forte); }
.porta-marca small { font-size: var(--fs-14); color: var(--texto-3); }
.porta-caixa h1 { font-size: var(--fs-20); font-weight: 700; color: var(--texto-forte); }
.porta-txt { font-size: var(--fs-16); color: var(--texto-2); line-height: 1.5; }
.porta-form { display: flex; flex-direction: column; gap: 16px; margin-top: 4px; }
.porta-form .campo > label { font-size: var(--fs-16); }
.porta-form .ajuda { font-size: var(--fs-14); }
.entrada.grande { height: 48px; font-size: var(--fs-16); padding: 0 14px; }
.bt.grande { height: 48px; font-size: var(--fs-16); width: 100%; }
.porta-form .bt.fant { align-self: center; }
.mostrar { display: inline-flex; align-items: center; gap: 8px; font-size: var(--fs-16); color: var(--texto-2); cursor: pointer; align-self: flex-start; }
.mostrar input { width: 18px; height: 18px; accent-color: var(--acento); margin: 0; }
.porta-erro { padding: 12px 14px; border-radius: var(--raio-p); background: var(--erro-suave); color: var(--erro-texto); font-size: var(--fs-16); font-weight: 600; line-height: 1.4; }

/* erro no topo de modal ou formulário */
.modal-erro { padding: 10px 14px; border-radius: var(--raio-p); border: 1px solid var(--erro-texto); background: var(--erro-suave); color: var(--erro-texto); font-weight: 600; line-height: 1.45; }
.modal-erro .link { color: inherit; }

/* formulário dentro de quadro (Campanha › Geral) */
.form-corpo { display: flex; flex-direction: column; gap: 16px; }
.form-pe { display: flex; justify-content: flex-end; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: auto; padding-top: 4px; }
.prefixo { display: flex; align-items: stretch; min-width: 0; }
.prefixo-txt { display: inline-flex; align-items: center; padding: 0 10px; border: 1px solid var(--borda-forte); border-right: 0; border-radius: var(--raio-p) 0 0 var(--raio-p); background: var(--sup-2); color: var(--texto-3); font-size: var(--fs-14); white-space: nowrap; }
.prefixo .entrada { border-radius: 0 var(--raio-p) var(--raio-p) 0; min-width: 0; }
.campo .ajuda { overflow-wrap: anywhere; }
.tabela.papeis th.c, .tabela.papeis td.c { width: 96px; text-align: center; }
.tabela .prim .sub.url { white-space: normal; overflow-wrap: anywhere; text-overflow: clip; max-width: 300px; }
.historico-caixa { max-height: calc(100dvh - 160px); overflow-y: auto; }
.tabela td.c input { width: 16px; height: 16px; margin: 0; accent-color: var(--acento); vertical-align: middle; }
.linha-campo { display: flex; gap: 8px; align-items: stretch; }
.linha-campo .entrada { flex: 1; min-width: 0; }
.linha-campo .bt { height: 40px; }
.linha-ajuda { display: flex; justify-content: space-between; gap: 12px; }
.mais-linha { display: flex; justify-content: center; padding-top: 10px; }
.bts-linha { display: flex; gap: 8px; flex-wrap: wrap; }
.caixa-borda { border: 1px solid var(--borda); border-radius: var(--raio-p); }
.seq-pausa.invalido input { border-color: var(--erro-texto); }

/* pareamento real: QR do servidor como imagem; código de pareamento */
.qr img { width: 100%; height: 100%; display: block; image-rendering: pixelated; }
.codigo-par { font-size: var(--fs-28); font-weight: 700; letter-spacing: 3px; font-variant-numeric: tabular-nums; color: var(--texto-forte); padding: 10px 18px; border: 1px dashed var(--borda-forte); border-radius: var(--raio-p); background: var(--sup-2); }
.ajuda-par { font-size: var(--fs-12); color: var(--texto-3); max-width: 300px; }
.par-codigo { width: 100%; max-width: 360px; display: flex; flex-direction: column; gap: 8px; align-items: stretch; text-align: left; padding-top: 12px; border-top: 1px solid var(--borda); }
.par-codigo .bt { align-self: flex-start; }
.estado-par.erro-txt { color: var(--erro-texto); font-weight: 600; text-align: left; }
.estado-par.alerta-txt { color: var(--alerta-texto); font-weight: 600; text-align: left; font-size: var(--fs-14); }

/* webhook: segredo mostrado uma vez */
.segredo { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--borda-forte); border-radius: var(--raio-p); background: var(--sup-2); min-width: 0; }
.segredo code { flex: 1; min-width: 0; font-family: ui-monospace, 'SFMono-Regular', Menlo, monospace; font-size: var(--fs-14); overflow-wrap: anywhere; color: var(--texto-forte); }

/* sino */
.pop.alertas-pop { width: min(360px, calc(100vw - 16px)); }
.alertas-pop .alerta-op { align-items: start; }
.campo.invalido:has(.erro-msg.da-api) > .ajuda { display: none; }
.alertas-pop .alerta-op i.i { background: var(--acento); }
.alertas-pop .alerta-op .bt { margin-top: 6px; }

@media (max-width: 640px) {
  .porta-caixa { padding: 22px 18px 20px; }
  .linha-campo { flex-direction: column; }
  .prefixo-txt { font-size: var(--fs-12); padding: 0 8px; }
  .tabela.papeis td.c { width: auto; }
}

/* ════════════ leva 2 (07/11/2026): mídia, estoque, lote ════════════ */
.midia-escolha { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 12px 14px; border: 1px dashed var(--borda-forte); border-radius: var(--raio-p); background: var(--sup-2); }
.midia-escolha.invalido { border-color: var(--erro-texto); }
.midia-ico { width: 40px; height: 40px; border-radius: 8px; display: grid; place-items: center; flex: none; background: var(--acento-suave); color: var(--acento-texto); }
.midia-escolha-txt { flex: 1 1 220px; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.midia-escolha-txt b { color: var(--texto-forte); font-weight: 600; }
.barrinha.larga { width: 100%; height: 6px; }
label.bt { cursor: pointer; }
label.bt.desligado { opacity: .5; pointer-events: none; }
.midia-pronta { display: flex; gap: 14px; align-items: flex-start; flex-wrap: wrap; min-width: 0; }
.midia-pronta > :first-child { flex: 0 1 auto; min-width: 0; }
.midia-info { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1 1 180px; }
.midia-info .nome { font-weight: 600; color: var(--texto-forte); overflow-wrap: anywhere; }
.midia-info .meta { font-size: var(--fs-12); color: var(--texto-3); }
.midia-info .link { align-self: flex-start; font-size: var(--fs-14); }
.midia-img { display: block; max-width: 100%; max-height: 220px; border-radius: var(--raio-p); border: 1px solid var(--borda); background: var(--sup-2); object-fit: contain; }
.midia-video { display: block; width: 100%; max-width: 360px; max-height: 240px; border-radius: var(--raio-p); background: #000; }
.midia-audio { display: block; width: 100%; max-width: 360px; min-width: 240px; }
.midia-doc { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid var(--borda-forte); border-radius: var(--raio-p); background: var(--sup); color: var(--texto); text-decoration: none; min-width: 0; max-width: 360px; }
.midia-doc:hover { border-color: var(--acento); }
.midia-doc svg { color: var(--acento-texto); }
.midia-doc-txt { display: flex; flex-direction: column; min-width: 0; }
.midia-doc-txt b { font-weight: 600; color: var(--texto-forte); overflow-wrap: anywhere; }
.midia-doc-txt small { font-size: var(--fs-12); color: var(--texto-3); }
.midia-vazia { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: var(--raio-p); background: var(--sup-2); color: var(--texto-3); font-size: var(--fs-14); }
.est-mini { display: block; width: 56px; height: 56px; object-fit: cover; border-radius: 6px; border: 1px solid var(--borda); background: var(--sup-2); }
.item-midia { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.item-midia .midia-video, .item-midia .midia-audio, .item-midia .midia-doc { max-width: 100%; min-width: 0; }
.legenda-item { font-size: var(--fs-14); color: var(--texto-2); white-space: pre-wrap; overflow-wrap: anywhere; }
.legenda-item.texto { color: var(--texto); }
.ma-lista { max-height: min(52dvh, 460px); overflow-y: auto; display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.ma-item { display: flex; align-items: center; gap: 12px; width: 100%; padding: 8px 10px; border: 1px solid var(--borda); border-radius: var(--raio-p); background: var(--sup); text-align: left; cursor: pointer; color: inherit; font: inherit; }
.ma-item:hover { border-color: var(--acento); background: var(--acento-lavado); }
.ma-item img { width: 56px; height: 56px; object-fit: cover; border-radius: 6px; flex: none; border: 1px solid var(--borda); }
.ma-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ma-txt b { font-weight: 600; color: var(--texto-forte); overflow-wrap: anywhere; }
.ma-txt small { font-size: var(--fs-12); color: var(--texto-3); }
.ma-item .bt { pointer-events: none; }
.lote-campo { display: flex; flex-direction: column; gap: 8px; }
.lote-ctl { padding-left: 30px; }
.lote-tab .mudanca { display: block; font-size: var(--fs-14); }
.lote-tab .mudanca + .mudanca { margin-top: 2px; }
.lote-tab td.quebra { max-width: 360px; }
.linha-bt { width: 100%; border: 0; border-bottom: 1px solid var(--borda); background: none; text-align: left; font: inherit; color: inherit; cursor: pointer; }
.linha-bt:hover { background: var(--sup-2); }
.lista-pedidos { max-height: 520px; overflow-y: auto; }
@media (max-width: 640px) {
  .midia-pronta { flex-direction: column; }
  .midia-audio { min-width: 0; }
  .lote-ctl { padding-left: 0; }
}
.passos > li { min-width: 0; }
.midia-escolha .ajuda, .seq-corpo > .ajuda { font-size: var(--fs-12); color: var(--texto-3); }
.midia-escolha .erro-msg { font-size: var(--fs-12); font-weight: 600; color: var(--erro-texto); }
.retorno { pointer-events: none; }   /* o aviso curto nunca engole o clique de um botão embaixo dele */
.par.alinha-topo { align-items: start; }   /* Estoque: a lista de pedidos não estica até a altura do formulário (caixa vazia) */
.contador { white-space: nowrap; }
@media (max-width: 640px) {
  .estacao .est-topo { grid-row: 1 / span 5; }
  .estacao > :not(.est-topo) { grid-column: 2; }
}
@media (max-width: 640px) {
  /* cartão com seleção e "⋯": a caixa fica ao lado do botão, não embaixo dele */
  .empilha tr:has(td.acoes-linha .bt-icone) td.chk { right: 52px; top: 14px; }
  .empilha tr:has(td.acoes-linha .bt-icone):has(td.chk) td.prim { padding-right: 92px; }
}

/* ── leva 2b: variáveis, modelos, contatos, automações, métricas (mesmos tokens; nada de cor nova) ── */
.linha-rotulo { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.linha-rotulo label { margin: 0; }
.mini-link { font-size: var(--fs-12); white-space: nowrap; }
.linha-modelo { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.opcoes.tres { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.par-campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; align-items: start; }
.linha-form { display: flex; gap: 8px; align-items: stretch; margin-top: 12px; }
.linha-form .entrada { flex: 1; min-width: 0; }
.url-cola { font-size: var(--fs-12); color: var(--texto-2); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.erro { color: var(--erro-texto); }
/* condição: campo · operador · valor · tirar */
.cond-linha { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1.2fr) 36px; gap: 8px; align-items: start; }
.cond-linha > .erro-msg { grid-column: 1 / -1; }
.cond-linha.invalido .entrada { border-color: var(--erro-texto); }
.cond-valor { min-width: 0; display: flex; align-items: center; min-height: 40px; }
.cond-valor > .entrada { width: 100%; }
.entre { display: flex; align-items: center; gap: 8px; width: 100%; }
.entre .entrada { flex: 1; min-width: 0; }
/* série diária: fileiras de colunas no mesmo eixo de dias, valor escrito em cima */
.leg-graf { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: var(--fs-12); color: var(--texto-2); margin-bottom: 12px; }
.leg-graf span { display: inline-flex; align-items: center; gap: 6px; }
.leg-graf i { width: 10px; height: 10px; border-radius: 2px; display: inline-block; }
.leg-graf i.redir, .serie-col.redir i { background: var(--acento); }
.leg-graf i.entra, .serie-col.entra i { background: var(--ok); }
.leg-graf i.sai, .serie-col.sai i { background: var(--bloq); }
.leg-graf i.sem { background: repeating-linear-gradient(45deg, var(--borda-forte) 0 2px, transparent 2px 4px); border: 1px solid var(--borda-forte); }
.serie { display: flex; flex-direction: column; gap: 6px; }
.serie-linha { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 12px; align-items: end; }
.serie-rot { font-size: var(--fs-12); font-weight: 600; color: var(--texto-2); padding-bottom: 2px; }
.serie-cols { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 6px; align-items: end; height: 72px; border-bottom: 1px solid var(--borda); }
.hbarras { max-width: 880px; }
.serie-linha.eixo .serie-cols { height: auto; border-bottom: 0; }
.serie-linha.eixo .serie-cols span { font-size: var(--fs-12); color: var(--texto-3); text-align: center; white-space: nowrap; font-variant-numeric: tabular-nums; }
.serie-col { height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: stretch; gap: 2px; background: none; border: 0; padding: 0; font: inherit; color: inherit; min-width: 0; cursor: default; border-radius: 4px 4px 0 0; }
button.serie-col { cursor: pointer; }
button.serie-col:hover { background: var(--sup-2); }
.serie-col.on { background: var(--acento-lavado); }
.serie-col .v { font-size: var(--fs-12); font-weight: 600; color: var(--texto); text-align: center; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; }
.serie-col i { display: block; border-radius: 3px 3px 0 0; min-height: 0; width: min(64%, 40px); margin: 0 auto; }
.serie-col.sem .v { color: var(--texto-3); }
.serie-tab { display: none; }
@container (max-width: 700px) { .serie, .leg-graf { display: none; } .serie-tab { display: block; } }
.serie-tab tr[data-filtra] { cursor: pointer; }
/* barras horizontais (por origem): uma cor, valor escrito à direita */
.hbarras { display: flex; flex-direction: column; gap: 10px; }
.hbarra { display: grid; grid-template-columns: minmax(0, 160px) minmax(0, 1fr) auto; gap: 12px; align-items: center; }
.hb-rot { font-size: var(--fs-14); color: var(--texto); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hb-rot small { display: block; font-size: var(--fs-12); color: var(--texto-3); overflow: hidden; text-overflow: ellipsis; }
.hb-trilho { height: 10px; border-radius: 999px; background: var(--acento-suave); overflow: hidden; }
.hb-trilho i { display: block; height: 100%; background: var(--acento); border-radius: 999px; }
.hb-v { font-size: var(--fs-14); font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.hb-v small { font-size: var(--fs-12); font-weight: 400; color: var(--texto-3); }
@media (max-width: 640px) {
  .opcoes.tres, .par-campos { grid-template-columns: 1fr; }
  .cond-linha { grid-template-columns: minmax(0, 1fr) 36px; }
  .cond-linha > select:first-child { grid-column: 1; }
  .cond-linha > select:nth-child(2), .cond-linha > .cond-valor { grid-column: 1; }
  .cond-linha > .bt-icone { grid-column: 2; grid-row: 1; }
  .hbarra { grid-template-columns: minmax(0, 1fr) auto; }
  .hbarra .hb-trilho { grid-column: 1 / -1; grid-row: 2; }
}
[data-acao="aut-add-cond"] { align-self: flex-start; }
@media (max-width: 640px) { .opcoes.curtas { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .so-largo-csv { display: none !important; } }

/* ── frente envio, leva 3 (07/11/2026): opções do item (mencionar todos, fixar), enquete, opções especiais na revisão ── */
.item-opcoes { display: flex; align-items: center; gap: 8px 18px; flex-wrap: wrap; padding-top: 10px; border-top: 1px solid var(--borda); }
.chk-linha { display: inline-flex; align-items: center; gap: 8px; font-size: var(--fs-14); color: var(--texto); cursor: pointer; }
.chk-linha input { width: 16px; height: 16px; accent-color: var(--acento); }
.sel-linha { display: inline-flex; align-items: center; gap: 8px; color: var(--texto-2); }
.entrada.mini { height: 32px; padding: 0 8px; font-size: var(--fs-14); width: auto; }
.enq-opcoes { list-style: decimal; margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 6px; }
.enq-opcoes li { display: flex; align-items: center; gap: 6px; }
.enq-opcoes li::marker { color: var(--texto-3); font-size: var(--fs-12); }
.enq-opcoes .entrada { flex: 1; }
.enq-lista { margin: 4px 0 0; padding-left: 20px; font-size: var(--fs-14); color: var(--texto-2); }
.marca-item { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-12); color: var(--texto-3); }
.link.perigo-link { color: var(--erro-texto); }
.dias-sem { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; }
/* frente automações (leva 3): ramo "senão" da condição, tags escolhidas pelo nome */
.ramo-senao { display: flex; flex-direction: column; gap: 10px; padding: 12px; border: 1px dashed var(--borda-forte); border-radius: var(--raio); background: var(--sup-2); min-width: 0; }
.ramo-senao > .ramo-tit { font-size: var(--fs-14); font-weight: 600; color: var(--texto-forte); display: flex; align-items: center; gap: 6px; }
.ramo-senao .seq-add { margin-top: 0; background: var(--sup); }
.tags-esc { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; min-width: 0; }
.tags-esc .entrada.mini { width: auto; max-width: 100%; }
.cond-valor { flex-direction: column; align-items: stretch; justify-content: center; gap: 6px; }
/* frente automações: no celular, lista DENTRO de um passo (itens do envio, ramo "senão") perde a coluna da bolinha — o número
   vai no título do cartão — e o recuo diminui; sem isso o senão com envio dentro ficava com 80 px de largura */
@media (max-width: 640px) {
  .ramo-senao { padding: 8px; }
  .seq-corpo .seq { counter-reset: passo; }
  .seq-corpo .seq > .seq-item { grid-template-columns: minmax(0, 1fr); counter-increment: passo; }
  .seq-corpo .seq > .seq-item > .est-bola, .seq-corpo .seq > .seq-item > .seq-fio { display: none; }
  .seq-corpo .seq > .seq-item > .seq-cartao, .seq-corpo .seq > .seq-item > .seq-pausa { grid-column: 1; }
  .seq-corpo .seq > .seq-item > .seq-cartao { grid-row: auto; margin-bottom: 8px; }
  .seq-corpo .seq > .seq-item > .seq-cartao > .seq-cab > b::before { content: counter(passo) '.'; color: var(--acento-texto); }
  .seq-corpo .seq-corpo { padding: 10px; }
}
/* foto do grupo (Estoque e lote, L08) */
.foto-grupo { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.foto-mini { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; border: 1px solid var(--borda); background: var(--sup-2); flex: none; }
.foto-mini.vazia { display: inline-flex; align-items: center; justify-content: center; color: var(--texto-3); }
.alertas-pop .alerta-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.identidade .acoes-identidade { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }

/* ── frente extras (leva 3): Projetos, Calendário, Recebidas ── */
.ruim-txt { color: var(--erro-texto); font-weight: 700; }
.cal .q-cab { flex-wrap: wrap; }
.cal-nav { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cal-grade { padding: 0 12px 12px; }
.cal-linha-sem, .cal-dias { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal-sem { font-size: var(--fs-12); font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--texto-3); padding: 8px 6px; }
.cal-dias { border-top: 1px solid var(--borda); border-left: 1px solid var(--borda); border-radius: var(--raio-p); overflow: hidden; }
.cal-dia { min-height: 104px; border-right: 1px solid var(--borda); border-bottom: 1px solid var(--borda); padding: 6px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cal-dia.fora { background: var(--sup-2); }
.cal-dia.fora .cal-num { color: var(--texto-3); }
.cal-dia.hoje { box-shadow: inset 0 0 0 2px var(--acento); }
.cal-num { display: flex; align-items: baseline; justify-content: space-between; gap: 6px; font-size: var(--fs-12); font-weight: 600; color: var(--texto-2); font-variant-numeric: tabular-nums; }
.cal-num small { font-size: var(--fs-12); color: var(--acento-texto); }
.cal-ev { display: flex; flex-direction: column; gap: 0; width: 100%; min-width: 0; text-align: left; border: 1px solid var(--borda); border-left: 3px solid var(--seg-encerrado); border-radius: 6px;
  background: var(--sup); padding: 3px 6px; font: inherit; font-size: var(--fs-12); line-height: 1.35; color: var(--texto); cursor: pointer; }
.cal-ev:hover, .cal-ev:focus-visible { border-color: var(--acento); }
.cal-ev .cal-l1 { display: flex; gap: 6px; align-items: baseline; min-width: 0; }
.cal-ev .cal-h { font-weight: 600; color: var(--texto-2); flex: none; }
.cal-ev .cal-est { font-size: var(--fs-12); font-weight: 600; color: var(--texto-3); }
.cal-ev .cal-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.cal-ev .cal-t svg { vertical-align: -2px; margin-right: 3px; }
.cal-ev.f-ok { border-left-color: var(--seg-confirmado); } .cal-ev.f-acento { border-left-color: var(--seg-aceito); } .cal-ev.f-alerta { border-left-color: var(--seg-incerto); }
.cal-ev.f-erro { border-left-color: var(--seg-falhou); } .cal-ev.f-bloq { border-left-style: dashed; border-left-color: var(--seg-bloqueado); } .cal-ev.f-neutro { border-left-color: var(--seg-encerrado); }
.cal-mais { border: 0; background: none; color: var(--acento-texto); font: inherit; font-size: var(--fs-12); font-weight: 600; text-align: left; padding: 2px 6px; cursor: pointer; }
.cal-mais:hover { text-decoration: underline; }
.cal-legenda { flex: none; border-top: 1px solid var(--borda); padding-top: 10px; padding-bottom: 10px; }
.tipo-msg { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.conteudo-msg { min-width: 220px; }
/* prévia da formatação do WhatsApp (L44) */
.previa-wa { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
.previa-wa[hidden] { display: none; }
.previa-wa-tit { font-size: var(--fs-12); font-weight: 600; letter-spacing: .5px; text-transform: uppercase; color: var(--texto-3); }
.previa-wa-bolha { background: var(--sup-2); border: 1px solid var(--borda); border-radius: 10px; padding: 8px 12px; font-size: var(--fs-14); line-height: 1.45; color: var(--texto); overflow-wrap: anywhere; max-width: 560px; }
.previa-wa-bolha .wa-linha { display: block; min-height: 1em; }
.previa-wa-bolha .wa-lista { margin: 2px 0; padding-left: 22px; }
.previa-wa-bolha .wa-cita { margin: 2px 0; padding: 2px 0 2px 10px; border-left: 3px solid var(--borda-forte); color: var(--texto-2); }
.previa-wa-bolha .wa-mono, .previa-wa-bolha .wa-cod { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: var(--fs-14); }
.previa-wa-bolha .wa-mono { margin: 2px 0; white-space: pre-wrap; }
.previa-wa-bolha .wa-cod { background: var(--sup-3); border-radius: 4px; padding: 0 4px; }
.previa-wa-bolha .wa-var { background: var(--acento-suave); color: var(--acento-texto); border-radius: 4px; padding: 0 4px; font-size: var(--fs-12); font-weight: 600; }
/* seleção "estes" × "todos do filtro" (L44) */
.selecao { flex-wrap: wrap; }
.selecao > span { color: var(--texto-2); font-size: var(--fs-14); }
.previa-wa-bolha ul.wa-lista { list-style: disc; } .previa-wa-bolha ol.wa-lista { list-style: decimal; }
/* deep links (L46) */
.kpis.tres { --n: 3; } .kpis.quatro { --n: 4; }
.mini-kpis .kpi { min-height: 0; padding: 10px 12px; } .mini-kpis .kpi-valor { font-size: var(--fs-20); }
.barras-dia { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.barras-dia li { display: grid; grid-template-columns: 96px minmax(0, 1fr) 56px; align-items: center; gap: 10px; font-size: var(--fs-12); color: var(--texto-2); }
.barras-dia li > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.barras-dia i { display: block; height: 10px; min-width: 2px; border-radius: 3px; background: var(--seg-aceito); }
.barras-dia b { text-align: right; font-weight: 600; color: var(--texto); }
.tres-col { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 640px) { .tres-col { grid-template-columns: 1fr; } .kpis.tres, .kpis.quatro { --n: 2; } }
.previa-link { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; background: var(--sup-2); border: 1px solid var(--borda); border-radius: var(--raio-p); }
.previa-link code { overflow-wrap: anywhere; white-space: normal; }
fieldset.campo { border: 0; padding: 0; margin: 0; min-width: 0; }
.tabela td.dl-dest { max-width: 280px; overflow-wrap: anywhere; word-break: break-word; }
@media (max-width: 640px) { .tabela td.dl-dest { max-width: none; } }
/* mídia em conversão, recusada e miniatura do PDF (L41/L44) */
.midia-vazia.falha { border-color: var(--erro); color: var(--erro-texto); background: var(--erro-suave); }
.midia-doc.com-previa { align-items: flex-start; }
.midia-pdf { width: 96px; height: auto; max-height: 136px; object-fit: cover; object-position: top; border: 1px solid var(--borda); border-radius: 6px; background: #fff; flex: none; }
/* transmissão (L48): risco escrito na tela */
.quadro.risco { border-color: var(--erro); }
.quadro.risco .q-cab { background: var(--erro-suave); border-radius: var(--raio) var(--raio) 0 0; }
.quadro.risco .q-cab h2 { color: var(--erro-texto); }
.quadro.risco.ligado { border-color: var(--alerta); } .quadro.risco.ligado .q-cab { background: var(--alerta-suave); } .quadro.risco.ligado .q-cab h2 { color: var(--alerta-texto); }
.quadro.risco .q-corpo p { margin: 0 0 6px; } .quadro.risco .q-corpo p:last-child { margin-bottom: 0; }
.risco-txt { display: flex; gap: 8px; align-items: flex-start; margin: 10px 0 0; color: var(--erro-texto); font-size: var(--fs-14); font-weight: 600; }
.risco-ok { color: var(--erro-texto); font-weight: 600; }
.pe-motivo { margin-right: auto; font-size: var(--fs-12); color: var(--texto-2); }