/* ============================================================
   MULTINÍVEL · esqueleto das páginas de dashboard (demonstrações)
   Carregar DEPOIS de multinivel.css. Este arquivo só acrescenta:
   usa os tokens --mn-* e convive com as classes mn-* do site.
   Os estilos internos dos gráficos (.mnc-*) vêm de mn-charts.js.
   CSS que só serve a UMA página vai no <style> da própria página.

   Índice
    1. Base da página e grade de 12 colunas
    2. Faixa de abertura (hero compacto)
    3. Nota de contexto (.mn-dash-nota) e aviso forte (.mn-dash-aviso)
    4. Barra de filtros, controle segmentado e select
    5. Cartões de KPI
    6. Cartão de gráfico e selo
    7. Frase de efeito (.mn-dash-pitch)
    8. Painel de detalhe e lista de pares
    9. Responsivo
   10. Impressão
   ============================================================ */

/* ---------- 1. Base e grade ---------- */
:root {
  --mn-amber:      #E6A700;                    /* feedback "atenção" do design system */
  --mn-amber-soft: rgba(230, 167, 0, 0.14);    /* o mesmo âmbar, em véu */
  --mn-danger:     #D64545;                    /* feedback "erro" do design system */
  --mn-dash-wrap:  1280px;
  --mn-dash-gap:   24px;
}

.mn-dash { background: var(--mn-paper); }
.mn-wrap.mn-dash-wrap { max-width: var(--mn-dash-wrap); }

.mn-dash-bloco { padding-block: clamp(28px, 4vw, 48px); }
.mn-dash-bloco--branco { background: var(--mn-white); }
.mn-dash-bloco + .mn-dash-bloco { padding-top: 0; }
.mn-dash-bloco--branco + .mn-dash-bloco, .mn-dash-bloco + .mn-dash-bloco--branco { padding-top: clamp(28px, 4vw, 48px); }

.mn-dash-secao { margin-bottom: 28px; max-width: 820px; }
.mn-dash-secao__titulo {
  font-family: var(--mn-font-display); font-weight: 800; text-transform: uppercase;
  font-size: clamp(22px, 2.6vw, 30px); line-height: 1.1; color: var(--mn-petrol);
}
.mn-dash-secao p { margin: 14px 0 0; font-size: 16px; line-height: 1.6; color: var(--mn-gray-700); }

.mn-dash-grid {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--mn-dash-gap); align-items: stretch;
}
.mn-dash-grid > * { grid-column: span 12; min-width: 0; }
.mn-dash-col-3  { grid-column: span 3; }
.mn-dash-col-4  { grid-column: span 4; }
.mn-dash-col-5  { grid-column: span 5; }
.mn-dash-col-6  { grid-column: span 6; }
.mn-dash-col-7  { grid-column: span 7; }
.mn-dash-col-8  { grid-column: span 8; }
.mn-dash-col-9  { grid-column: span 9; }
.mn-dash-col-12 { grid-column: span 12; }
.mn-dash-grid > .mn-dash-col-3  { grid-column: span 3; }
.mn-dash-grid > .mn-dash-col-4  { grid-column: span 4; }
.mn-dash-grid > .mn-dash-col-5  { grid-column: span 5; }
.mn-dash-grid > .mn-dash-col-6  { grid-column: span 6; }
.mn-dash-grid > .mn-dash-col-7  { grid-column: span 7; }
.mn-dash-grid > .mn-dash-col-8  { grid-column: span 8; }
.mn-dash-grid > .mn-dash-col-9  { grid-column: span 9; }
.mn-dash-grid + .mn-dash-grid { margin-top: var(--mn-dash-gap); }

/* ---------- 2. Faixa de abertura ---------- */
.mn-dash-hero {
  position: relative; overflow: hidden;
  background: var(--mn-grad-petrol); color: var(--mn-white);
  padding-block: clamp(36px, 5vw, 60px);
}
/* chevrons tom sobre tom, apontando para o conteúdo */
.mn-dash-hero::after {
  content: ""; position: absolute; inset: 0 0 0 auto; width: min(44%, 520px);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='96' viewBox='0 0 64 96'%3E%3Cpath d='M44 8 L12 48 L44 88' fill='none' stroke='%2300C896' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 64px 96px; background-position: right center;
  opacity: 0.10; pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 70%);
          mask-image: linear-gradient(90deg, transparent 0%, #000 70%);
}
.mn-dash-hero__inner {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 56px); align-items: end;
}
.mn-dash-hero__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.mn-dash-hero__selo {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--mn-emerald); border: 1.5px solid var(--mn-emerald);
  border-radius: var(--mn-radius-pill); padding: 7px 14px 7px 12px; line-height: 1;
}
.mn-dash-hero__selo svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.mn-dash-hero__titulo {
  font-family: var(--mn-font-display); font-weight: 800; text-transform: uppercase;
  font-size: clamp(30px, 4.4vw, 50px); line-height: 1.04; letter-spacing: -0.01em; margin: 0;
}
.mn-dash-hero .mn-rule { margin-top: 2px; }
.mn-dash-hero__sub { margin: 0; max-width: 60ch; font-size: clamp(16px, 1.4vw, 18px); line-height: 1.6; color: var(--mn-gray-300); }
.mn-dash-hero__sub strong { color: var(--mn-white); font-weight: 600; }

.mn-dash-hero__fatos {
  margin: 0; padding: 20px 22px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px;
  background: rgba(18, 64, 60, 0.72); border: 1px solid var(--mn-petrol-700); border-radius: var(--mn-radius-lg);
}
.mn-dash-hero__fatos dt { font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.07em; color: var(--mn-emerald); }
.mn-dash-hero__fatos dd { margin: 3px 0 0; font-size: 14.5px; line-height: 1.4; color: var(--mn-white); }

/* ---------- 3. Nota de contexto e aviso ---------- */
/* Peso leve: uma linha elegante antes dos dados */
.mn-dash-nota {
  display: flex; align-items: flex-start; gap: 10px;
  margin: 0; padding: 4px 0 4px 14px;
  border-left: 3px solid var(--mn-emerald);
  font-size: 14.5px; line-height: 1.55; color: var(--mn-gray-700);
}
.mn-dash-nota svg { flex-shrink: 0; width: 18px; height: 18px; margin-top: 2px; fill: none; stroke: var(--mn-teal); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.mn-dash-nota strong { color: var(--mn-petrol); font-weight: 600; }

/* Peso forte: DADOS SIMULADOS. Faixa âmbar com ícone + caixa em véu âmbar */
.mn-dash-aviso {
  display: grid; grid-template-columns: 76px minmax(0, 1fr);
  border: 2px solid var(--mn-amber); border-radius: var(--mn-radius-lg); overflow: hidden;
  background: linear-gradient(var(--mn-amber-soft), var(--mn-amber-soft)), var(--mn-white);
  box-shadow: 0 8px 24px rgba(230, 167, 0, 0.16);
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.mn-dash-aviso__icone {
  display: flex; align-items: center; justify-content: center;
  background-color: var(--mn-amber);
  background-image: repeating-linear-gradient(135deg, rgba(10, 46, 46, 0.10) 0 10px, rgba(10, 46, 46, 0) 10px 20px);
  color: var(--mn-petrol);
}
.mn-dash-aviso__icone svg { width: 36px; height: 36px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.mn-dash-aviso__corpo { padding: 20px 24px; display: flex; flex-direction: column; gap: 6px; }
.mn-dash-aviso__titulo {
  font-family: var(--mn-font-display); font-weight: 800; text-transform: uppercase;
  font-size: clamp(17px, 1.8vw, 21px); line-height: 1.15; letter-spacing: 0.01em; color: var(--mn-petrol); margin: 0;
}
.mn-dash-aviso p { margin: 0; font-size: 15.5px; line-height: 1.6; color: var(--mn-ink); max-width: 86ch; }
.mn-dash-aviso p strong { font-weight: 600; color: var(--mn-petrol); }
.mn-dash-aviso a { color: var(--mn-petrol); font-weight: 600; }

/* ---------- 4. Filtros ---------- */
.mn-dash-filtros {
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: 16px 28px;
  background: var(--mn-white); border: 1px solid var(--mn-gray-200);
  border-radius: var(--mn-radius-lg); padding: 18px 22px;
  box-shadow: 0 4px 14px rgba(10, 46, 46, 0.07);
}
.mn-dash-filtros--fixa { position: sticky; top: calc(var(--mn-header-h) + 10px); z-index: 50; }
.mn-dash-filtro { display: flex; flex-direction: column; gap: 7px; min-width: 0; border: 0; margin: 0; padding: 0; }
.mn-dash-filtro__rotulo {
  font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.07em;
  color: var(--mn-teal); padding: 0;
}
.mn-dash-filtros__resumo { margin: 0 0 0 auto; align-self: center; font-size: 13.5px; line-height: 1.45; color: var(--mn-gray-700); max-width: 40ch; }
.mn-dash-filtros__resumo strong { color: var(--mn-petrol); font-weight: 600; }

/* Controle segmentado. Forma recomendada: rádios nativos dentro de role="radiogroup"
   (setas do teclado funcionam sem JavaScript). Também aceita <button role="tab"> em role="tablist". */
.mn-dash-seg {
  display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px;
  background: var(--mn-paper); border: 1.5px solid var(--mn-gray-300); border-radius: 26px;
}
.mn-dash-seg__op { position: relative; display: inline-flex; cursor: pointer; }
.mn-dash-seg__op input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.mn-dash-seg__op span, .mn-dash-seg > button {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 40px; padding: 8px 16px; border: 0; border-radius: var(--mn-radius-pill);
  background: transparent; cursor: pointer;
  font-family: var(--mn-font-body); font-size: 14px; font-weight: 500; line-height: 1.2; color: var(--mn-gray-700);
  transition: background .15s ease, color .15s ease;
}
.mn-dash-seg__op:hover span, .mn-dash-seg > button:hover { background: var(--mn-gray-200); color: var(--mn-petrol); }
.mn-dash-seg__op input:checked + span,
.mn-dash-seg > button[aria-selected="true"], .mn-dash-seg > button[aria-checked="true"] {
  background: var(--mn-petrol); color: var(--mn-white); font-weight: 600;
}
.mn-dash-seg__op input:focus-visible + span { outline: 3px solid var(--mn-teal); outline-offset: 2px; }
.mn-dash-seg > button:focus-visible { outline: 3px solid var(--mn-teal); outline-offset: 2px; border-radius: var(--mn-radius-pill); }

.mn-dash-select { position: relative; display: inline-flex; min-width: 200px; max-width: 100%; }
.mn-dash-select select {
  -webkit-appearance: none; appearance: none; width: 100%;
  font-family: var(--mn-font-body); font-size: 15px; font-weight: 500; line-height: 1.3; color: var(--mn-petrol);
  background-color: var(--mn-white);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2316697A' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; background-size: 20px 20px;
  border: 1.5px solid var(--mn-gray-500); border-radius: var(--mn-radius-md); /* 5,34:1 sobre branco */
  padding: 11px 44px 11px 14px; min-height: 48px; cursor: pointer;
  transition: border-color .15s ease;
}
.mn-dash-select select:hover { border-color: var(--mn-teal); }
.mn-dash-select select:focus-visible { border-color: var(--mn-teal); outline: 3px solid var(--mn-teal); outline-offset: 1px; }

/* ---------- 5. KPIs ---------- */
.mn-dash-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--mn-dash-gap); }
.mn-dash-kpis--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mn-dash-kpi {
  background: var(--mn-white); border-radius: var(--mn-radius-lg);
  padding: 22px 22px 20px; min-width: 0;
  display: flex; flex-direction: column; gap: 10px;
  box-shadow: var(--mn-shadow-card);
}
.mn-dash-kpi__topo { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 8px 10px; }
.mn-dash-kpi__rotulo { margin: 0; flex: 1 1 130px; font-family: var(--mn-font-body); font-size: 13.5px; font-weight: 500; line-height: 1.35; color: var(--mn-gray-700); }
.mn-dash-kpi__valor {
  margin: 0; font-family: var(--mn-font-display); font-weight: 800;
  font-size: clamp(28px, 2.9vw, 38px); line-height: 1; color: var(--mn-petrol); letter-spacing: -0.01em;
}
.mn-dash-kpi__unidade { font-family: var(--mn-font-body); font-size: 14px; font-weight: 500; color: var(--mn-gray-500); letter-spacing: 0; margin-left: 2px; }
/* variação: <p class="mn-dash-kpi__var mn-dash-kpi__var--bom"><b><svg/>+6,4%</b> <span>contra o ano anterior</span></p> */
.mn-dash-kpi__var { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0; font-size: 13px; line-height: 1.3; color: var(--mn-gray-700); }
.mn-dash-kpi__var b {
  display: inline-flex; align-items: center; gap: 5px; white-space: nowrap;
  font-weight: 600; color: var(--mn-petrol);
  background: var(--mn-gray-200); border-radius: var(--mn-radius-pill); padding: 4px 10px 4px 7px;
}
.mn-dash-kpi__var svg { width: 15px; height: 15px; fill: none; stroke: var(--mn-gray-500); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.mn-dash-kpi__var--bom b { background: var(--mn-mint); }
.mn-dash-kpi__var--bom svg { stroke: var(--mn-emerald-600); }
.mn-dash-kpi__var--ruim b { background: rgba(214, 69, 69, 0.12); color: var(--mn-ink); }
.mn-dash-kpi__var--ruim svg { stroke: var(--mn-danger); }
.mn-dash-kpi--destaque .mn-dash-kpi__var { color: var(--mn-gray-300); }
.mn-dash-kpi__spark { margin-top: auto; min-height: 44px; }
.mn-dash-kpi__medidor { margin-top: auto; }
.mn-dash-kpi__nota { margin: 0; font-size: 12.5px; line-height: 1.45; color: var(--mn-gray-500); }

.mn-dash-kpi--destaque { background: var(--mn-petrol); box-shadow: none; }
.mn-dash-kpi--destaque .mn-dash-kpi__rotulo { color: var(--mn-gray-300); }
.mn-dash-kpi--destaque .mn-dash-kpi__valor { color: var(--mn-emerald); }
.mn-dash-kpi--destaque .mn-dash-kpi__unidade, .mn-dash-kpi--destaque .mn-dash-kpi__nota { color: var(--mn-gray-300); }

/* ---------- 6. Cartão de gráfico e selo ---------- */
.mn-dash-card {
  background: var(--mn-white); border-radius: var(--mn-radius-lg);
  padding: 24px 26px 20px; min-width: 0;
  display: flex; flex-direction: column; gap: 16px;
  box-shadow: var(--mn-shadow-card);
}
.mn-dash-card__topo { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px 16px; flex-wrap: wrap; }
.mn-dash-card__topo > div { min-width: 0; flex: 1 1 260px; }
.mn-dash-card__titulo { font-family: var(--mn-font-display); font-weight: 700; font-size: clamp(17px, 1.5vw, 20px); line-height: 1.25; color: var(--mn-petrol); margin: 0; }
.mn-dash-card__sub { margin: 6px 0 0; font-size: 14px; line-height: 1.5; color: var(--mn-gray-700); }
.mn-dash-card__grafico { min-width: 0; flex: 1 1 auto; }
.mn-dash-card__leitura {
  margin: 0; padding: 12px 16px; border-radius: var(--mn-radius-md);
  background: var(--mn-mint); color: var(--mn-petrol); font-size: 14px; line-height: 1.55;
}
.mn-dash-card__leitura strong { font-weight: 600; }
.mn-dash-card__rodape {
  margin-top: auto; padding-top: 14px; border-top: 1px solid var(--mn-gray-200);
  display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap;
}
.mn-dash-fonte { margin: 0; font-size: 12.5px; line-height: 1.45; color: var(--mn-gray-500); flex: 1 1 220px; min-width: 0; }
.mn-dash-fonte a { color: var(--mn-teal); }

.mn-dash-selo {
  display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; white-space: nowrap;
  font-family: var(--mn-font-body); font-size: 10.5px; font-weight: 600; line-height: 1;
  text-transform: uppercase; letter-spacing: 0.07em; color: var(--mn-petrol);
  background: linear-gradient(var(--mn-amber-soft), var(--mn-amber-soft)), var(--mn-white);
  border: 1.5px solid var(--mn-amber); border-radius: var(--mn-radius-pill); padding: 5px 10px 5px 8px;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.mn-dash-selo::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--mn-amber); box-shadow: 0 0 0 1.5px var(--mn-petrol); }
.mn-dash-selo--real { background: var(--mn-mint); border-color: var(--mn-emerald-600); }
.mn-dash-selo--real::before { background: var(--mn-emerald); }
.mn-dash-selo--neutro { background: var(--mn-paper); border-color: var(--mn-gray-400); }
.mn-dash-selo--neutro::before { background: var(--mn-gray-400); }

/* ---------- 7. Frase de efeito ---------- */
.mn-dash-pitch {
  position: relative; overflow: hidden; isolation: isolate;
  border-radius: var(--mn-radius-lg);
  padding: clamp(32px, 5vw, 60px) clamp(24px, 5vw, 64px);
  background: var(--mn-grad-petrol); color: var(--mn-white);
  display: flex; flex-direction: column; align-items: flex-start; gap: 20px;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.mn-dash-pitch::before {
  content: ""; position: absolute; z-index: -1; right: -120px; top: -160px; width: 460px; height: 460px; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(0, 200, 150, 0.30), rgba(0, 200, 150, 0));
  pointer-events: none;
}
.mn-dash-pitch::after {
  content: ""; position: absolute; z-index: -1; right: clamp(16px, 4vw, 56px); bottom: -14px; width: 210px; height: 150px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='70' height='150' viewBox='0 0 70 150'%3E%3Cpath d='M16 14 L54 75 L16 136' fill='none' stroke='%2300C896' stroke-width='9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 70px 150px; background-repeat: repeat-x; opacity: 0.12; pointer-events: none;
}
.mn-dash-pitch__frase {
  margin: 0; max-width: 24ch;
  font-family: var(--mn-font-display); font-weight: 800; text-transform: uppercase;
  font-size: clamp(24px, 3.4vw, 42px); line-height: 1.1; letter-spacing: -0.005em;
}
.mn-dash-pitch__frase--longa { max-width: 34ch; font-size: clamp(21px, 2.5vw, 31px); line-height: 1.18; }
.mn-dash-pitch__apoio { margin: 0; max-width: 62ch; font-size: clamp(15px, 1.3vw, 17px); line-height: 1.6; color: var(--mn-gray-300); }
.mn-dash-pitch__apoio strong { color: var(--mn-white); font-weight: 600; }
.mn-dash-pitch .mn-rule { margin: 0; }
.mn-dash-pitch__acoes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 4px; }

.mn-dash-pitch--grad { background: linear-gradient(135deg, #0A2E2E 0%, #12403C 52%, #16697A 100%); }
.mn-dash-pitch--mint { background: var(--mn-mint); color: var(--mn-petrol); }
.mn-dash-pitch--mint::before { background: radial-gradient(closest-side, rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0)); }
.mn-dash-pitch--mint::after { opacity: 0.20; }
.mn-dash-pitch--mint .mn-accent { color: var(--mn-teal); }
.mn-dash-pitch--mint .mn-dash-pitch__apoio { color: var(--mn-gray-700); }
.mn-dash-pitch--mint .mn-dash-pitch__apoio strong { color: var(--mn-petrol); }
.mn-dash-pitch--centro { align-items: center; text-align: center; }
.mn-dash-pitch--centro .mn-dash-pitch__acoes { justify-content: center; }

/* ---------- 8. Painel de detalhe e lista de pares ---------- */
.mn-dash-card--petrol { background: var(--mn-petrol); color: var(--mn-white); box-shadow: none; }
.mn-dash-card--petrol .mn-dash-card__titulo { color: var(--mn-white); }
.mn-dash-card--petrol .mn-dash-card__sub { color: var(--mn-gray-300); }
.mn-dash-card--petrol .mn-dash-card__rodape { border-top-color: var(--mn-petrol-700); }
.mn-dash-card--petrol .mn-dash-fonte { color: var(--mn-gray-300); }
.mn-dash-card--mint { background: var(--mn-mint); box-shadow: none; }

.mn-dash-numero { margin: 0; font-family: var(--mn-font-display); font-weight: 800; font-size: clamp(40px, 4.6vw, 58px); line-height: 1; color: var(--mn-emerald-600); }
.mn-dash-card--petrol .mn-dash-numero { color: var(--mn-emerald); }

.mn-dash-pares { margin: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0; font-size: 14.5px; line-height: 1.4; }
.mn-dash-pares dt, .mn-dash-pares dd { margin: 0; padding: 10px 0; border-top: 1px solid var(--mn-gray-200); }
.mn-dash-pares dt { color: var(--mn-gray-700); padding-right: 16px; }
.mn-dash-pares dd { font-weight: 600; color: var(--mn-petrol); text-align: right; font-variant-numeric: tabular-nums; }
.mn-dash-card--petrol .mn-dash-pares dt, .mn-dash-card--petrol .mn-dash-pares dd { border-top-color: var(--mn-petrol-700); }
.mn-dash-card--petrol .mn-dash-pares dt { color: var(--mn-gray-300); }
.mn-dash-card--petrol .mn-dash-pares dd { color: var(--mn-white); }

/* foco visível sobre fundos escuros */
.mn-dash-hero :focus-visible, .mn-dash-pitch :focus-visible, .mn-dash-card--petrol :focus-visible, .mn-dash-kpi--destaque :focus-visible {
  outline-color: var(--mn-emerald);
}
.mn-dash-pitch--mint :focus-visible { outline-color: var(--mn-teal); }

/* ---------- 9. Responsivo ---------- */
@media (max-width: 1100px) {
  .mn-dash-kpis, .mn-dash-kpis--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mn-dash-grid > .mn-dash-col-3, .mn-dash-grid > .mn-dash-col-4 { grid-column: span 6; }
  .mn-dash-grid > .mn-dash-col-5, .mn-dash-grid > .mn-dash-col-6, .mn-dash-grid > .mn-dash-col-7,
  .mn-dash-grid > .mn-dash-col-8, .mn-dash-grid > .mn-dash-col-9 { grid-column: span 12; }

  .mn-dash-hero__inner { grid-template-columns: 1fr; align-items: start; }
}
/* Entre 761 e 1100px o par 8 + 4 (ou 9 + 3) vira duas linhas inteiras, para o cartão menor não ficar
   sozinho em meia largura. Não pode valer abaixo de 761px: lá a grade tem uma coluna só. */
@media (min-width: 761px) and (max-width: 1100px) {
  .mn-dash-grid > .mn-dash-col-8 + .mn-dash-col-4, .mn-dash-grid > .mn-dash-col-4:has(+ .mn-dash-col-8),
  .mn-dash-grid > .mn-dash-col-9 + .mn-dash-col-3, .mn-dash-grid > .mn-dash-col-3:has(+ .mn-dash-col-9) { grid-column: span 12; }
}


@media (max-width: 760px) {
  :root { --mn-dash-gap: 16px; }
  .mn-dash-grid { grid-template-columns: minmax(0, 1fr); }
  .mn-dash-grid > * , .mn-dash-grid > [class*="mn-dash-col-"] { grid-column: 1 / -1; }
  .mn-dash-card { padding: 20px 18px 16px; }
  .mn-dash-kpi { padding: 18px; }
  .mn-dash-filtros { padding: 16px; gap: 14px; }
  .mn-dash-filtros--fixa { position: static; }
  .mn-dash-filtro, .mn-dash-select { width: 100%; }
  .mn-dash-filtros__resumo { margin-left: 0; max-width: none; }
  .mn-dash-seg { display: flex; border-radius: 22px; }
  .mn-dash-seg__op { flex: 1 1 auto; }
  .mn-dash-seg__op span, .mn-dash-seg > button { width: 100%; min-height: 44px; padding-inline: 12px; }
  .mn-dash-aviso { grid-template-columns: 52px minmax(0, 1fr); }
  .mn-dash-aviso__icone { align-items: flex-start; padding-top: 20px; }
  .mn-dash-aviso__icone svg { width: 28px; height: 28px; }
  .mn-dash-aviso__corpo { padding: 16px 16px 18px; }
  .mn-dash-aviso p { font-size: 15px; }
  .mn-dash-hero::after { opacity: 0.06; }
  .mn-dash-hero__fatos { padding: 16px 18px; }
  .mn-dash-pitch::after { width: 140px; opacity: 0.12; }
  .mn-dash-pitch__acoes, .mn-dash-pitch__acoes .mn-btn { width: 100%; }
}

@media (max-width: 480px) {
  .mn-dash-kpis, .mn-dash-kpis--3 { grid-template-columns: minmax(0, 1fr); }
  .mn-dash-hero__fatos { grid-template-columns: minmax(0, 1fr); }
}

@media (pointer: coarse) {
  .mn-dash-seg__op span, .mn-dash-seg > button { min-height: 44px; }
}

/* ---------- 10. Impressão ---------- */
@media print {
  .mn-header, .mn-footer, .mn-dock, .mn-skip, .mn-burger, .mn-dash-filtros, .mn-dash-pitch__acoes { display: none !important; }
  body, .mn-dash { background: #fff; font-size: 11pt; }
  .mn-dash-hero { background: #fff; color: var(--mn-petrol); padding-block: 0 14pt; border-bottom: 3px solid var(--mn-emerald); }
  .mn-dash-hero::after { display: none; }
  .mn-dash-hero__sub, .mn-dash-hero__fatos dd { color: var(--mn-gray-700); }
  .mn-dash-hero__sub strong { color: var(--mn-petrol); }
  .mn-dash-hero__selo, .mn-dash-hero__fatos dt { color: var(--mn-teal); border-color: var(--mn-teal); }
  .mn-dash-hero__fatos { background: #fff; border-color: var(--mn-gray-300); }
  .mn-dash-hero .mn-accent { color: var(--mn-teal); }
  .mn-dash-bloco { padding-block: 12pt; }
  .mn-dash-grid { display: block; }
  .mn-dash-grid > * { margin-bottom: 14pt; }
  .mn-dash-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10pt; }
  .mn-dash-card, .mn-dash-kpi, .mn-dash-aviso, .mn-dash-pitch { box-shadow: none; break-inside: avoid; page-break-inside: avoid; }
  .mn-dash-card, .mn-dash-kpi { border: 1px solid var(--mn-gray-300); }
  a[href]::after { content: none; }
}