:root{--logo-pilatus:url("assets/marca/pilatus-cor.png")}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--logo-pilatus:url("assets/marca/pilatus-branco.png")}}
:root[data-theme="dark"]{--logo-pilatus:url("assets/marca/pilatus-branco.png")}
@font-face{font-family:"Baloo Paaji 2";src:url("assets/fontes/BalooPaaji2-var-latin.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:"Outfit";src:url("assets/fontes/Outfit-var-latin.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
/* Pilatus · Estratégia comercial e marketing
   Layout: régua lateral marinho (a "lombada" da editora) + páginas claras de leitura editorial.
   Uma tela por vez no modo apresentação; todas em fluxo no modo leitura contínua e na impressão.
   Cor: paleta Pilatus V1 (marinho, azul, verde, ouro). WalkWise (laranja e âmbar) só no território dela. */

:root {
  --fundo: #FBFAF7;
  --fundo-2: #F3F1EB;
  --cartao: #FFFFFF;
  --cartao-2: #EEF1F6;
  --tinta: #0D1B2A;
  --tinta-2: #3B475C;
  --tinta-3: #5F687B;
  --linha: #D6DBE3;
  --linha-2: #B9C3D6;
  --titulo: #002060;
  --titulo-suave: #6B7385;
  --marinho: #002060;
  --sobre-marinho: #FFFFFF;
  --sobre-marinho-2: #B9C3D6;
  --azul: #115196;
  --verde: #006B3F;
  --ouro: #F8D300;
  --ouro-claro: #FDF6C9;
  --ouro-texto: #6B5600;
  --bb: #006B3F;
  --bb-claro: #E2EFE8;
  --bb-linha: #9FCBB3;
  --ww: #F88A31;
  --ww-2: #FBAC1A;
  --ww-claro: #FDEDE0;
  --ww-texto: #B4540A;
  --ww-tinta: #203065;
  --ww-linha: #F5C49A;
  --foco: #115196;
  --sombra: 0 24px 48px -28px rgba(0, 32, 96, .45);

  --f-display: "Baloo Paaji 2", "Baloo 2", "Trebuchet MS", system-ui, sans-serif;
  --f-texto: "Outfit", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --t-capa: clamp(48px, 6.6vw, 120px);
  --t-h1: clamp(25px, 2.35vw, 46px);
  --t-h2: clamp(20px, 1.7vw, 29px);
  --t-lead: clamp(16px, 1.16vw, 20px);
  --t-corpo: clamp(15px, 1.02vw, 17px);
  --t-menor: 14px;
  --t-rotulo: 13px;

  --e1: 8px;
  --e2: 16px;
  --e3: 24px;
  --e4: 32px;
  --e6: 48px;
  --e8: 64px;

  --r1: 4px;
  --r2: 10px;
  --r-pilula: 999px;

  --regua: 84px;
  --gutter: 16px;
  --largura: 1280px;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --fundo: #0A1531;
    --fundo-2: #0E1A3A;
    --cartao: #111F45;
    --cartao-2: #172753;
    --tinta: #EEF1F6;
    --tinta-2: #C5CDDB;
    --tinta-3: #A7B4CF;
    --linha: #26365F;
    --linha-2: #3A4C7A;
    --titulo: #F4F6FA;
    --titulo-suave: #A7B4CF;
    --marinho: #06112B;
    --sobre-marinho: #FFFFFF;
    --sobre-marinho-2: #A9B4CB;
    --azul: #8DB8EE;
    --verde: #5CCB93;
    --ouro: #F8D300;
    --ouro-claro: #332E0B;
    --ouro-texto: #F3DD6A;
    --bb: #5CCB93;
    --bb-claro: #0F3328;
    --bb-linha: #2D6A50;
    --ww: #F88A31;
    --ww-2: #FBAC1A;
    --ww-claro: #36230F;
    --ww-texto: #F9AE70;
    --ww-tinta: #FCDDBF;
    --ww-linha: #7A4A22;
    --foco: #9CC7FF;
    --sombra: 0 24px 48px -24px rgba(0, 0, 0, .7);
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --fundo: #0A1531;
  --fundo-2: #0E1A3A;
  --cartao: #111F45;
  --cartao-2: #172753;
  --tinta: #EEF1F6;
  --tinta-2: #C5CDDB;
  --tinta-3: #A7B4CF;
  --linha: #26365F;
  --linha-2: #3A4C7A;
  --titulo: #F4F6FA;
  --titulo-suave: #A7B4CF;
  --marinho: #06112B;
  --sobre-marinho: #FFFFFF;
  --sobre-marinho-2: #A9B4CB;
  --azul: #8DB8EE;
  --verde: #5CCB93;
  --ouro: #F8D300;
  --ouro-claro: #332E0B;
  --ouro-texto: #F3DD6A;
  --bb: #5CCB93;
  --bb-claro: #0F3328;
  --bb-linha: #2D6A50;
  --ww: #F88A31;
  --ww-2: #FBAC1A;
  --ww-claro: #36230F;
  --ww-texto: #F9AE70;
  --ww-tinta: #FCDDBF;
  --ww-linha: #7A4A22;
  --foco: #9CC7FF;
  --sombra: 0 24px 48px -24px rgba(0, 0, 0, .7);
  color-scheme: dark;
}

/* ------------------------------------------------------------ base */

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html, body { height: 100%; }
body {
  margin: 0;
  background: var(--fundo);
  color: var(--tinta);
  font-family: var(--f-texto);
  font-size: var(--t-corpo);
  font-weight: 400;
  line-height: 1.5;
  font-feature-settings: "kern";
  text-rendering: optimizeLegibility;
}
img, svg { max-width: 100%; }
img { height: auto; display: block; }
p, h1, h2, h3, h4, ul, ol, dl, dd, figure, blockquote { margin: 0; }
ul, ol { padding: 0; list-style: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: var(--azul); text-underline-offset: 3px; }
strong { font-weight: 600; color: var(--tinta); }
:focus-visible { outline: 3px solid var(--foco); outline-offset: 2px; border-radius: 2px; }
.vh { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.pular {
  position: fixed; left: 12px; top: 12px; z-index: 50;
  background: var(--cartao); color: var(--titulo); padding: 8px 12px; border-radius: var(--r1);
  transform: translateY(-160%); transition: transform .15s ease-out; text-decoration: none; font-weight: 600;
  box-shadow: var(--sombra);
}
.pular:focus { transform: none; }

/* ------------------------------------------------------------ esqueleto */

.app { min-height: 100%; }
.palco { position: relative; }

html[data-modo="apresentacao"] .app {
  height: 100%;
  display: grid;
  grid-template-columns: var(--regua) minmax(0, 1fr);
}
html[data-modo="apresentacao"] .palco {
  grid-column: 2;
  height: 100%;
  overflow-y: auto;
  overscroll-behavior: contain;
  touch-action: pan-y;
  scroll-behavior: auto;
}
html[data-modo="apresentacao"] .slide:not(.atual) { display: none; }
html[data-modo="apresentacao"] .slide { min-height: 100%; }

html[data-modo="leitura"] .palco { margin-left: var(--regua); }
html[data-modo="leitura"] .slide { border-bottom: 1px solid var(--linha); scroll-margin-top: 0; }

/* ------------------------------------------------------------ régua (lombada) */

.regua {
  position: fixed; left: 0; top: 0; bottom: 0; z-index: 20;
  width: var(--regua);
  background: var(--marinho);
  color: var(--sobre-marinho);
  display: flex; flex-direction: column; align-items: center;
  padding-top: calc(env(safe-area-inset-top, 0px) + 20px);
  padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 16px);
  padding-left: env(safe-area-inset-left, 0px);
}
.regua__fio { width: 28px; height: 3px; background: var(--ouro); border-radius: 2px; margin-bottom: 16px; }
.regua__caps { display: flex; flex-direction: column; gap: 2px; position: relative; }
.regua__trilho {
  position: absolute; left: 50%; top: 18px; bottom: 18px; width: 2px; transform: translateX(-50%);
  background: rgba(255, 255, 255, .14); border-radius: 2px; pointer-events: none;
}
.regua__trilho span { display: block; width: 100%; height: var(--progresso, 0%); background: var(--ouro); border-radius: 2px; transition: height .25s ease-out; }
.regua__cap {
  position: relative; display: grid; place-items: center;
  width: 32px; height: 32px; border-radius: var(--r-pilula);
  color: var(--sobre-marinho-2); text-decoration: none;
  font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums;
  background: var(--marinho);
}
.regua__cap:hover { color: var(--sobre-marinho); background: rgba(255, 255, 255, .1); }
.regua__cap[aria-current="true"] { background: var(--ouro); color: #002060; }
.regua__cap .regua__nome {
  position: absolute; left: calc(100% + 12px); top: 50%; transform: translateY(-50%);
  white-space: nowrap; background: #002060; color: #FFFFFF; font-weight: 500; font-size: 13px;
  padding: 4px 8px; border-radius: var(--r1); opacity: 0; pointer-events: none; transition: opacity .12s ease-out;
  box-shadow: var(--sombra);
}
.regua__cap:hover .regua__nome, .regua__cap:focus-visible .regua__nome { opacity: 1; }
.regua__espaco { flex: 1; min-height: 12px; }
.regua__lombada {
  writing-mode: vertical-rl; transform: rotate(180deg);
  font-size: 12px; color: var(--sobre-marinho-2);
  white-space: nowrap; margin-bottom: 12px; opacity: .8;
}
.regua__ferramentas { display: grid; grid-template-columns: repeat(2, 34px); gap: 4px; justify-content: center; }
.regua__pos { grid-column: 1 / -1; text-align: center; font-size: 12px; color: var(--sobre-marinho-2); font-variant-numeric: tabular-nums; margin: 0 0 2px; }
.bt-regua {
  display: grid; place-items: center; width: 34px; height: 34px; border-radius: var(--r2);
  border: 1px solid rgba(255, 255, 255, .22); background: transparent; color: var(--sobre-marinho);
  text-decoration: none; position: relative;
}
.bt-regua:hover { background: rgba(255, 255, 255, .1); }
.bt-regua svg { width: 18px; height: 18px; }
@media (max-height: 1000px) { .regua__lombada { display: none; } }
@media (max-height: 700px) { .regua__cap { width: 26px; height: 26px; font-size: 12px; } .regua__fio { margin-bottom: 8px; } }
.bt-regua .regua__nome {
  position: absolute; left: calc(100% + 12px); top: 50%; transform: translateY(-50%);
  white-space: nowrap; background: #002060; color: #FFFFFF; font-size: 13px; padding: 4px 8px; border-radius: var(--r1);
  opacity: 0; pointer-events: none; transition: opacity .12s ease-out; box-shadow: var(--sombra);
}
.bt-regua:hover .regua__nome, .bt-regua:focus-visible .regua__nome { opacity: 1; }
.bt-regua:focus-visible, .regua__cap:focus-visible { outline-color: var(--ouro); }

/* ------------------------------------------------------------ barra (tela estreita) */

.barra { display: none; }

/* ------------------------------------------------------------ slide */

.slide {
  position: relative;
  display: flex; flex-direction: column;
  background: var(--fundo);
}
.slide__in {
  width: 100%; max-width: calc(var(--largura) + 2 * var(--gutter-d, 56px));
  margin-inline: auto;
  display: flex; flex-direction: column; gap: var(--e2);
  flex: 1;
  padding-left: max(var(--gutter-d, 56px), env(safe-area-inset-left, 0px));
  padding-right: max(var(--gutter-d, 56px), env(safe-area-inset-right, 0px));
  padding-block: var(--e3) var(--e2);
}
.slide__topo {
  display: flex; align-items: center; gap: var(--e2); flex-wrap: wrap;
  min-height: 32px;
}
.slide__cap { font-size: var(--t-rotulo); font-weight: 600; color: var(--titulo); }
.slide__cap b { color: var(--tinta-3); font-weight: 600; margin-right: 4px; font-variant-numeric: tabular-nums; }
.slide__logo {
  margin-left: auto; display: block; height: 30px; aspect-ratio: 640 / 197; flex: none;
  background: var(--logo-pilatus) left center / contain no-repeat;
}
.so-escuro { display: none; }
:root[data-theme="dark"] .so-claro { display: none; }
:root[data-theme="dark"] .so-escuro { display: block; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .so-claro { display: none; }
  :root:not([data-theme="light"]) .so-escuro { display: block; }
}
.slide__corpo { display: flex; flex-direction: column; gap: 20px; margin-block: auto; padding-block: 4px; min-width: 0; }
.slide__pe {
  display: flex; align-items: flex-start; gap: var(--e2); flex-wrap: wrap;
  border-top: 1px solid var(--linha); padding-top: var(--e1);
  font-size: 13px; color: var(--tinta-3);
}
.slide__pe .fontes-curtas { flex: 1; min-width: 0; }
.slide__num { margin-left: auto; font-variant-numeric: tabular-nums; }
.link-fontes { border: 0; background: none; padding: 0; font: inherit; color: var(--azul); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.link-fontes:hover { color: var(--titulo); }

.titulo {
  font-family: var(--f-display); font-weight: 500; font-size: var(--t-h1); line-height: 1.06;
  letter-spacing: -.005em; color: var(--titulo); text-wrap: balance; max-width: 48ch;
}
.titulo .t-suave { color: var(--titulo-suave); display: block; }
.titulo .t-forte { display: block; }
.lead { font-size: var(--t-lead); line-height: 1.42; color: var(--tinta-2); max-width: 74ch; text-wrap: pretty; }
.h2 { font-family: var(--f-display); font-weight: 500; font-size: var(--t-h2); line-height: 1.15; color: var(--titulo); text-wrap: balance; }
.h3 { font-family: var(--f-texto); font-weight: 600; font-size: var(--t-corpo); line-height: 1.3; color: var(--titulo); }
.rotulo { font-size: var(--t-rotulo); font-weight: 600; color: var(--tinta-3); }
.menor { font-size: var(--t-menor); color: var(--tinta-2); line-height: 1.45; }
.texto p + p { margin-top: .6em; }
.prosa { max-width: 68ch; }

/* ------------------------------------------------------------ legenda de status (fato / validado / proposta / hipótese) */

.st { display: inline-flex; align-items: center; gap: 8px; font-size: var(--t-rotulo); font-weight: 600; color: var(--tinta-3); white-space: nowrap; }
.st::before { content: ""; width: 11px; height: 11px; border-radius: 50%; flex: none; box-sizing: border-box; }
.st--registro::before { background: var(--titulo); }
.st--validado::before { background: var(--verde); box-shadow: inset 0 0 0 2px var(--verde), inset 0 0 0 4px var(--fundo); }
.st--proposta::before { border: 2px solid var(--titulo); background: transparent; }
.st--hipotese::before { background: var(--ouro); border: 2px solid var(--titulo); }
.st--avalidar::before { border: 2px dashed var(--tinta-3); background: transparent; }

/* ------------------------------------------------------------ frentes */

.fr { display: inline-flex; align-items: center; gap: 8px; font-size: var(--t-rotulo); font-weight: 600; }
.fr::before { content: ""; width: 10px; height: 10px; border-radius: 2px; flex: none; }
.fr--ww { color: var(--ww-texto); }
.fr--ww::before { background: linear-gradient(135deg, var(--ww-2), var(--ww)); }
.fr--bb { color: var(--verde); }
.fr--bb::before { background: var(--bb); }
.fr--at { color: var(--azul); }
.fr--at::before { background: transparent; border: 2px solid var(--azul); }
.fr--comum { color: var(--titulo); }
.fr--comum::before { background: var(--titulo); }

/* ------------------------------------------------------------ chips de material */

.chip {
  display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px 4px 8px; border-radius: var(--r-pilula);
  font-size: 13px; font-weight: 500; line-height: 1.3; white-space: nowrap; border: 1px solid transparent;
}
.chip::before { content: ""; width: 8px; height: 8px; border-radius: 50%; flex: none; box-sizing: border-box; }
.chip--ok { background: var(--bb-claro); color: var(--verde); }
.chip--ok::before { background: var(--verde); }
.chip--hist { background: var(--cartao-2); color: var(--tinta-2); }
.chip--hist::before { background: transparent; border: 2px solid var(--tinta-3); }
.chip--verif { background: var(--ouro-claro); color: var(--ouro-texto); }
.chip--verif::before { background: var(--ouro); border: 1.5px solid var(--ouro-texto); }
.chip--produzir { background: transparent; color: var(--tinta-2); border: 1px dashed var(--linha-2); }
.chip--produzir::before { background: transparent; border: 1.5px dashed var(--tinta-3); }
.chip--restrito { background: transparent; color: var(--tinta-3); border: 1px solid var(--linha); }
.chip--restrito::before { background: var(--tinta-3); border-radius: 1px; }

/* ------------------------------------------------------------ grades */

.g2, .g3, .g4 { display: grid; gap: var(--e3); }
.g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pilha { display: flex; flex-direction: column; gap: var(--e2); }
.pilha-p { display: flex; flex-direction: column; gap: var(--e1); }
.linha-f { display: flex; flex-wrap: wrap; gap: var(--e1) var(--e2); align-items: center; }

/* ------------------------------------------------------------ detalhes expansíveis */

details.mais { border-top: 1px solid var(--linha); }
details.mais > summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px;
  padding: 8px 0; font-size: var(--t-menor); font-weight: 600; color: var(--azul);
}
details.mais > summary::-webkit-details-marker { display: none; }
details.mais > summary::before {
  content: ""; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: rotate(-45deg); transition: transform .15s ease-out; flex: none; margin-left: 2px;
}
details.mais[open] > summary::before { transform: rotate(45deg); }
details.mais > .mais__corpo { padding: 2px 0 12px; display: flex; flex-direction: column; gap: 8px; }

/* ------------------------------------------------------------ controles segmentados (filtro por frente, antes e depois) */

.seg { display: inline-flex; padding: 4px; border-radius: var(--r-pilula); background: var(--cartao-2); gap: 2px; flex-wrap: wrap; }
.seg button {
  border: 0; background: transparent; padding: 8px 12px; border-radius: var(--r-pilula); font-size: 13px; font-weight: 500; color: var(--tinta-2);
}
.seg button[aria-pressed="true"] { background: var(--cartao); color: var(--titulo); box-shadow: 0 1px 0 var(--linha), 0 0 0 1px var(--linha); }
.seg button:hover { color: var(--titulo); }

[data-frente="ww"] [data-fr="bb"], [data-frente="bb"] [data-fr="ww"] { opacity: .28; }
[data-fr] { transition: opacity .2s ease-out; }

/* ------------------------------------------------------------ capa */

.slide--capa .slide__in { padding-block: 0; }
.capa { flex: 1; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); min-height: 100%; }
.capa__texto { display: flex; flex-direction: column; justify-content: space-between; gap: var(--e6); padding: var(--e8) var(--e6) var(--e6) 0; }
.capa__logo { width: 230px; height: auto; }
.capa__titulo { font-family: var(--f-display); font-weight: 400; font-size: var(--t-capa); line-height: .95; letter-spacing: -.01em; color: var(--titulo); text-wrap: balance; }
.capa__titulo span { display: block; color: var(--titulo-suave); }
.capa__fio { width: 64px; height: 5px; background: var(--ouro); border-radius: 3px; }
.capa__linha { font-size: var(--t-lead); color: var(--tinta-2); max-width: 40ch; line-height: 1.4; }
.capa__meta { display: flex; flex-wrap: wrap; gap: var(--e1) var(--e3); }
.capa__painel {
  background: var(--marinho); color: var(--sobre-marinho); display: flex; flex-direction: column; justify-content: center; gap: var(--e4);
  padding: var(--e8) var(--e6); margin-right: calc(-1 * max(var(--gutter-d, 56px), env(safe-area-inset-right, 0px)));
}
.capa__painel .rotulo { color: var(--ouro); }
.capa__tese { font-family: var(--f-display); font-weight: 400; font-size: clamp(26px, 2.6vw, 46px); line-height: 1.1; color: var(--sobre-marinho); text-wrap: balance; }
.capa__frentes { display: flex; flex-direction: column; gap: var(--e3); }
.capa__frente { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: var(--e2); align-items: center; }
.capa__frente img { width: 112px; height: auto; }
.capa__frente p { color: var(--sobre-marinho-2); font-size: var(--t-menor); }
.capa__selo { background: #FFFFFF; border-radius: var(--r2); padding: 8px; display: grid; place-items: center; }

/* ------------------------------------------------------------ abertura */

.mapa-caps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; border-top: 2px solid var(--titulo); }
.mapa-caps li { border-right: 1px solid var(--linha); padding: 12px 12px 12px 0; }
.mapa-caps li:nth-child(5n) { border-right: 0; }
.mapa-caps li:nth-child(n+6) { border-top: 1px solid var(--linha); }
.mapa-caps li + li { padding-left: 12px; }
.mapa-caps li:nth-child(6) { padding-left: 0; }
.mapa-caps a { text-decoration: none; color: inherit; display: flex; flex-direction: column; gap: 4px; }
.mapa-caps a:hover .mapa-caps__nome { color: var(--azul); }
.mapa-caps__n { font-family: var(--f-display); font-size: 22px; line-height: 1; color: var(--titulo-suave); font-variant-numeric: tabular-nums; }
.mapa-caps__nome { font-weight: 600; color: var(--titulo); font-size: var(--t-corpo); line-height: 1.25; }
.mapa-caps__q { font-size: 13px; color: var(--tinta-3); line-height: 1.35; }

.estado { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0; border: 1px solid var(--linha); border-radius: var(--r2); overflow: hidden; background: var(--cartao); }
.estado > div { padding: var(--e3); display: flex; flex-direction: column; gap: 8px; }
.estado > div + div { border-left: 1px solid var(--linha); background: var(--fundo-2); }
.estado ul { display: flex; flex-direction: column; gap: 8px; }
.estado li { padding-left: 16px; position: relative; font-size: var(--t-menor); color: var(--tinta-2); line-height: 1.45; }
.estado li::before { content: ""; position: absolute; left: 0; top: .5em; width: 8px; height: 8px; border-radius: 50%; }
.estado__sim li::before { background: var(--verde); }
.estado__nao li::before { border: 1.5px dashed var(--tinta-3); }
.legenda { display: flex; flex-wrap: wrap; gap: 8px 20px; }

/* ------------------------------------------------------------ aprendizado 2025 */

.tri { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 2px solid var(--titulo); }
.tri > section { padding: var(--e2) var(--e3) var(--e2) 0; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.tri > section + section { padding-left: var(--e3); border-left: 1px solid var(--linha); }
.tri ul { display: flex; flex-direction: column; gap: 8px; }
.tri li { font-size: var(--t-menor); line-height: 1.45; color: var(--tinta-2); padding-left: 16px; position: relative; }
.tri li::before { content: ""; position: absolute; left: 0; top: .55em; width: 7px; height: 7px; border-radius: 50%; background: var(--linha-2); }
.tri__feito li::before { background: var(--titulo); }
.tri__indica li::before { background: var(--ouro); border: 1.5px solid var(--titulo); width: 8px; height: 8px; }
.tri__nao li::before { background: transparent; border: 1.5px dashed var(--tinta-3); }
.tri .rotulo { color: var(--titulo); }
.aviso {
  display: flex; gap: 12px; align-items: flex-start; padding: 12px 16px; border-radius: var(--r2);
  background: var(--ouro-claro); color: var(--tinta); font-size: var(--t-menor); line-height: 1.45;
}
.aviso::before { content: ""; flex: none; width: 10px; height: 10px; margin-top: .35em; border-radius: 50%; background: var(--ouro); border: 2px solid var(--titulo); }

/* trilha 2025 x proposta (antes e depois) */
.trilha { display: flex; flex-direction: column; gap: var(--e2); }
.trilha__passos { display: grid; grid-template-columns: repeat(var(--n, 5), minmax(0, 1fr)); gap: 0; counter-reset: passo; }
.passo { position: relative; padding: 0 var(--e2) 0 0; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.passo__no { display: flex; align-items: center; gap: 0; }
.passo__no i { width: 14px; height: 14px; border-radius: 50%; background: var(--titulo); flex: none; }
.passo__no b { flex: 1; height: 2px; background: var(--linha-2); }
.passo:last-child .passo__no b { visibility: hidden; }
.passo__nome { font-weight: 600; color: var(--titulo); font-size: var(--t-corpo); line-height: 1.25; }
.passo__lacuna, .passo__regra { font-size: 13px; line-height: 1.4; padding: 8px 8px; border-radius: var(--r1); }
.passo__lacuna { background: var(--cartao-2); color: var(--tinta-2); }
.passo__regra { background: var(--bb-claro); color: var(--tinta); }
.trilha[data-estado="2025"] .passo__regra, .trilha[data-estado="proposta"] .passo__lacuna { display: none; }
.trilha[data-estado="2025"] .passo__no i { background: var(--tinta-3); }
.trilha[data-estado="proposta"] .passo__no i { background: var(--verde); }
.trilha[data-estado="proposta"] .passo__no b { background: var(--verde); }
.trilha__nota { font-size: 13px; color: var(--tinta-3); }
.licao {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: var(--e4); align-items: start;
  padding: var(--e3); background: var(--marinho); color: var(--sobre-marinho); border-radius: var(--r2);
}
.licao .h2 { color: var(--sobre-marinho); }
.licao p, .licao li { color: var(--sobre-marinho-2); font-size: var(--t-menor); line-height: 1.5; }
.licao ul { display: flex; flex-direction: column; gap: 8px; }
.licao li { padding-left: 16px; position: relative; }
.licao li::before { content: ""; position: absolute; left: 0; top: .55em; width: 7px; height: 7px; border-radius: 50%; background: var(--ouro); }

/* ------------------------------------------------------------ tese e envelopes */

.tese { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--e3); align-items: stretch; }
.envelope { border-radius: var(--r2); padding: var(--e3); display: flex; flex-direction: column; gap: 12px; position: relative; overflow: hidden; min-width: 0; }
.envelope--ww { background: var(--ww-claro); }
.envelope--bb { background: var(--bb-claro); }
.envelope dl { display: flex; flex-direction: column; gap: 8px; }
.envelope dt { font-size: var(--t-rotulo); font-weight: 600; color: var(--tinta-3); }
.envelope dd { font-size: var(--t-menor); line-height: 1.42; color: var(--tinta); }
.envelope__logo { height: 34px; width: auto; align-self: flex-start; }
.nucleo {
  background: var(--marinho); color: var(--sobre-marinho); border-radius: var(--r2); padding: var(--e3);
  display: flex; flex-direction: column; gap: 12px; justify-content: center;
}
.nucleo .rotulo { color: var(--ouro); }
.nucleo .h2 { color: var(--sobre-marinho); }
.nucleo ul { display: flex; flex-direction: column; gap: 8px; }
.nucleo li { font-size: var(--t-menor); color: var(--sobre-marinho-2); line-height: 1.45; padding-left: 16px; position: relative; }
.nucleo li::before { content: ""; position: absolute; left: 0; top: .55em; width: 7px; height: 7px; border-radius: 50%; background: var(--ouro); }
.nao-cruza { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); gap: var(--e3); align-items: start; border-top: 1px solid var(--linha); padding-top: var(--e2); }
.nao-cruza ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px var(--e3); }
.nao-cruza li { font-size: var(--t-menor); color: var(--tinta-2); line-height: 1.4; padding-left: 20px; position: relative; }
.nao-cruza li::before, .nao-cruza li::after { content: ""; position: absolute; left: 2px; top: .65em; width: 11px; height: 2px; background: var(--tinta-3); transform: rotate(45deg); }
.nao-cruza li::after { transform: rotate(-45deg); }
.atitude { display: flex; gap: var(--e2); align-items: flex-start; padding: 12px 16px; border: 1px dashed var(--linha-2); border-radius: var(--r2); font-size: var(--t-menor); color: var(--tinta-2); }

/* caminhos comerciais */
.caminhos { display: flex; flex-direction: column; gap: var(--e4); }
.caminho { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: var(--e3); align-items: start; }
.caminho__id { display: flex; flex-direction: column; gap: 8px; padding-top: 4px; }
.caminho__id img { height: 30px; width: auto; align-self: flex-start; }
.caminho__passos { display: grid; grid-template-columns: repeat(var(--n, 6), minmax(0, 1fr)); gap: 0; }
.cp { position: relative; padding: 0 12px 0 0; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cp__marca { display: flex; align-items: center; }
.cp__marca i { width: 12px; height: 12px; border-radius: 50%; flex: none; }
.cp__marca b { flex: 1; height: 2px; }
.caminho--ww .cp__marca i { background: var(--ww); }
.caminho--ww .cp__marca b { background: var(--ww-linha); }
.caminho--bb .cp__marca i { background: var(--bb); }
.caminho--bb .cp__marca b { background: var(--bb-linha); }
.cp:last-child .cp__marca b { visibility: hidden; }
.cp__nome { font-weight: 600; font-size: var(--t-menor); color: var(--titulo); line-height: 1.3; }
.cp__txt { font-size: 13px; color: var(--tinta-2); line-height: 1.4; }
.cp__portao { font-size: 13px; color: var(--tinta); background: var(--ouro-claro); border-radius: var(--r1); padding: 4px 8px; line-height: 1.35; }
.cp--comum .cp__nome::after { content: "núcleo comum"; display: block; font-size: 12px; font-weight: 600; color: var(--tinta-3); margin-top: 2px; }

/* ------------------------------------------------------------ personas: mapa de decisão e influência */

.zonas { display: grid; grid-template-columns: repeat(var(--z, 5), minmax(0, 1fr)); border: 1px solid var(--linha); border-radius: var(--r2); overflow: hidden; background: var(--cartao); }
.zona { padding: 12px 12px 12px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.zona + .zona { border-left: 1px solid var(--linha); }
.zona__nome { font-size: var(--t-rotulo); font-weight: 600; color: var(--tinta-3); }
.zona__papeis { display: flex; flex-direction: column; gap: 8px; }
.papel {
  display: block; text-decoration: none; font-weight: 600; font-size: 14px; line-height: 1.3; color: var(--titulo);
  padding: 8px 8px 8px 24px; border-radius: var(--r1); background: var(--fundo-2); border: 1px solid var(--linha); position: relative;
}
.papel::before { content: ""; position: absolute; left: 10px; top: 13px; width: 9px; height: 9px; border-radius: 2px; background: var(--tinta-3); }
.papel small { display: block; font-weight: 400; color: var(--tinta-3); font-size: 13px; margin-top: 2px; }
.papel--ww::before { background: linear-gradient(135deg, var(--ww-2), var(--ww)); }
.papel--bb::before { background: var(--bb); }
.papel--fora::before { background: transparent; border: 1.5px dashed var(--tinta-3); }
.papel--fora { border-style: dashed; background: transparent; }
a.papel:hover { border-color: var(--azul); }

.tabela-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
table.mat { width: 100%; border-collapse: collapse; font-size: var(--t-menor); line-height: 1.42; }
table.mat th, table.mat td { text-align: left; vertical-align: top; padding: 8px 12px 8px 0; border-bottom: 1px solid var(--linha); }
table.mat td + td, table.mat th + th { padding-left: 12px; }
table.mat thead th { font-size: var(--t-rotulo); font-weight: 600; color: var(--tinta-3); border-bottom: 2px solid var(--titulo); }
table.mat tbody th { font-weight: 600; color: var(--titulo); width: 19%; }
table.mat tbody th small { display: block; font-weight: 400; color: var(--tinta-3); font-size: 13px; margin-top: 4px; }
table.mat td { color: var(--tinta-2); }
table.mat tr:target th, table.mat tr:target td { background: var(--ouro-claro); }

/* ------------------------------------------------------------ perfil desejado e antiperfil */

.perfis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e4); }
.perfil { display: flex; flex-direction: column; gap: var(--e2); min-width: 0; }
.perfil__cab { display: flex; align-items: center; gap: 12px; padding-bottom: 8px; border-bottom: 2px solid var(--linha); }
.perfil--ww .perfil__cab { border-bottom-color: var(--ww); }
.perfil--bb .perfil__cab { border-bottom-color: var(--bb); }
.perfil__cab img { height: 28px; width: auto; }
.crivo { display: flex; flex-direction: column; gap: 0; border: 1px solid var(--linha); border-radius: var(--r2); overflow: hidden; background: var(--cartao); }
.crivo__item { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 8px; padding: 4px 12px; font-size: var(--t-menor); line-height: 1.4; color: var(--tinta-2); }
.crivo__item + .crivo__item { border-top: 1px solid var(--linha); }
.crivo__item b { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid var(--titulo); font-size: 12px; color: var(--titulo); font-variant-numeric: tabular-nums; }
.crivo__item strong { color: var(--titulo); font-weight: 600; }
.desfechos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.desfecho { border-radius: var(--r1); padding: 8px 8px; font-size: 13px; line-height: 1.35; }
.desfecho b { display: block; font-size: 12px; margin-bottom: 2px; }
.desfecho--segue { background: var(--bb-claro); color: var(--tinta); }
.desfecho--segue b { color: var(--verde); }
.desfecho--pausa { background: var(--ouro-claro); color: var(--tinta); }
.desfecho--pausa b { color: var(--ouro-texto); }
.desfecho--sai { background: var(--cartao-2); color: var(--tinta); }
.desfecho--sai b { color: var(--tinta-3); }
.anti { display: flex; flex-direction: column; gap: 4px; padding: 8px 12px; border: 1px dashed var(--linha-2); border-radius: var(--r2); }
.anti li { font-size: var(--t-menor); color: var(--tinta-2); line-height: 1.4; padding-left: 20px; position: relative; }
.anti li::before, .anti li::after { content: ""; position: absolute; left: 2px; top: .65em; width: 11px; height: 2px; background: var(--tinta-3); transform: rotate(45deg); }
.anti li::after { transform: rotate(-45deg); }

/* ------------------------------------------------------------ canais */

.canais td.c-etapas { white-space: nowrap; }
.etp { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 3px; font-size: 11px; font-weight: 600; margin-right: 2px; border: 1px solid var(--linha); color: var(--tinta-3); background: transparent; }
.etp--on { background: var(--titulo); border-color: var(--titulo); color: var(--fundo); }
.etp--apoio { background: var(--cartao-2); border-color: var(--linha-2); color: var(--titulo); }
.prio { display: inline-block; font-size: 12px; font-weight: 600; padding: 4px 8px; border-radius: var(--r1); white-space: nowrap; }
.prio--p0 { background: var(--titulo); color: var(--fundo); }
.prio--p1 { background: var(--cartao-2); color: var(--titulo); border: 1px solid var(--linha-2); }
.prio--p2 { background: transparent; color: var(--tinta-2); border: 1px solid var(--linha-2); }
.prio--cond { background: transparent; color: var(--tinta-2); border: 1px dashed var(--tinta-3); }
.canais tr.grupo th { padding-top: 16px; border-bottom: 1px solid var(--linha-2); }
.canais .meio { font-size: 12px; font-weight: 600; color: var(--tinta-3); display: block; margin-top: 2px; }

/* ------------------------------------------------------------ tom de voz */

.voz { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: var(--e4); align-items: start; }
.voz__frentes { display: flex; flex-direction: column; gap: var(--e2); }
.voz__frente { padding: 12px 16px; border-radius: var(--r2); background: var(--cartao); border: 1px solid var(--linha); display: flex; flex-direction: column; gap: 8px; }
.voz__frente p { font-size: var(--t-menor); color: var(--tinta-2); line-height: 1.45; }
.voz__frente .evita { color: var(--tinta-3); }
.reescritas { display: flex; flex-direction: column; gap: 0; border-top: 2px solid var(--titulo); }
.reescrita { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: var(--e3); padding: 12px 0; border-bottom: 1px solid var(--linha); }
.reescrita__antes { font-size: var(--t-menor); color: var(--tinta-3); text-decoration: line-through; text-decoration-color: var(--linha-2); text-decoration-thickness: 1.5px; line-height: 1.4; }
.reescrita__depois { font-size: var(--t-corpo); color: var(--titulo); line-height: 1.38; font-weight: 500; }
.reescrita__por { display: block; font-size: 13px; color: var(--tinta-3); font-weight: 400; margin-top: 4px; }

/* ------------------------------------------------------------ KV: lombada + capa */

.kv { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: var(--e4); align-items: start; }
.kv__regras { display: flex; flex-direction: column; gap: 12px; }
.kv__regras li { font-size: var(--t-menor); color: var(--tinta-2); line-height: 1.45; padding-left: 16px; position: relative; }
.kv__regras li::before { content: ""; position: absolute; left: 0; top: .55em; width: 7px; height: 7px; border-radius: 50%; background: var(--titulo); }
.kv__pecas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e2); }
.peca-kv { display: grid; grid-template-columns: 34px minmax(0, 1fr); border-radius: var(--r2); overflow: hidden; min-height: 300px; box-shadow: 0 0 0 1px var(--linha); }
.peca-kv__lombada { background: #002060; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 12px 0; }
.peca-kv__lombada span { writing-mode: vertical-rl; transform: rotate(180deg); color: #FFFFFF; font-size: 12px; white-space: nowrap; }
.peca-kv__lombada i { width: 3px; height: 34px; background: #F8D300; border-radius: 2px; }
.peca-kv__capa { padding: 16px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.peca-kv--ww .peca-kv__capa { background: linear-gradient(160deg, #FDEDE0 0%, #FFFFFF 62%); color: #203065; }
.peca-kv--bb .peca-kv__capa { background: #FFFFFF; color: #0D1B2A; }
.peca-kv__titulo { font-family: var(--f-display); font-weight: 500; font-size: 22px; line-height: 1.08; color: #203065; }
.peca-kv--bb .peca-kv__titulo { color: #002060; }
.peca-kv__img { border-radius: 6px; height: 150px; object-fit: contain; width: 100%; max-width: 100%; background: #F3F1EB; }
.slot-marca { border: 1.5px dashed #F88A31; border-radius: 6px; color: #9A4A0C; font-size: 12px; font-weight: 600; padding: 8px; text-align: center; background: rgba(255, 255, 255, .6); }
.regua-ano { display: grid; grid-template-columns: repeat(10, 1fr); gap: 2px; align-items: end; }
.regua-ano span { height: 8px; background: #E2EFE8; border-radius: 1px; }
.regua-ano span.f { height: 16px; background: #006B3F; }
.regua-ano__leg { display: flex; justify-content: space-between; font-size: 11px; color: #5F687B; }
.peca-kv__nota { font-size: 11px; line-height: 1.35; color: #5F687B; }
.peca-kv__assina { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 8px; border-top: 1px solid rgba(0, 32, 96, .15); padding-top: 8px; }
.peca-kv__assina img { height: 18px; width: auto; }
.peca-kv__assina small { font-size: 11px; color: #5F687B; }
.tag-proposta {
  display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600;
  color: var(--titulo); border: 1.5px solid var(--titulo); border-radius: var(--r1); padding: 4px 8px; align-self: flex-start; background: var(--fundo);
}

/* ------------------------------------------------------------ jornada: visão geral em faixas */

.jornada-ctrl { display: flex; flex-wrap: wrap; gap: var(--e2); align-items: center; justify-content: space-between; }
.faixas { display: grid; grid-template-columns: 128px repeat(8, minmax(0, 1fr)) 14px repeat(3, minmax(0, 1fr)); column-gap: 4px; row-gap: 0; }
.faixas__rot { font-size: var(--t-rotulo); font-weight: 600; color: var(--tinta-3); padding: 8px 8px 8px 0; display: flex; align-items: flex-start; border-bottom: 1px solid var(--linha); }
.faixas__rot--mkt { color: var(--azul); }
.faixas__rot--com { color: var(--titulo); }
.faixas__rot--ped { color: var(--verde); }
.faixas__rot--pass { color: var(--tinta-3); }
.faixas__grupo { grid-row: 1; font-size: 12px; font-weight: 600; color: var(--tinta-3); padding-bottom: 4px; border-bottom: 2px solid var(--titulo); }
.faixas__grupo--pos { border-bottom: 2px dashed var(--linha-2); }
.etapa-col { display: contents; }
.etapa-cab {
  grid-row: 2; display: flex; flex-direction: column; gap: 4px; padding: 8px 0 8px; text-decoration: none; color: inherit; border-bottom: 1px solid var(--linha); min-width: 0;
}
.etapa-cab:hover .etapa-cab__nome { color: var(--azul); }
.letra { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--titulo); color: var(--fundo); font-weight: 600; font-size: 13px; flex: none; }
.letra--pos { background: transparent; color: var(--titulo); border: 1.5px dashed var(--titulo); }
.letra--g { background: var(--verde); }
.letra--h { background: var(--tinta-3); }
.celula-planilha {
  display: inline-block; font-size: 12px; font-weight: 500; line-height: 1.25; color: var(--tinta); background: var(--cartao);
  border: 1px solid var(--linha-2); border-radius: 2px; padding: 4px 4px; box-shadow: inset 0 -1px 0 var(--linha);
}
.etapa-cab__nome { font-size: 13px; color: var(--tinta-3); line-height: 1.3; }
.etapa-cab__forma { font-size: 12px; color: var(--tinta-3); display: flex; align-items: center; gap: 4px; }
.cel { font-size: 13px; line-height: 1.32; color: var(--tinta-2); padding: 8px 4px 8px 0; border-bottom: 1px solid var(--linha); min-width: 0; position: relative; }
.cel--vazia::before { content: ""; position: absolute; left: 0; right: 6px; top: 50%; height: 1px; background: var(--linha); }
.cel--mkt { background: linear-gradient(var(--fundo), var(--fundo)) padding-box; }
.cel .gate { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; font-size: 11px; font-weight: 600; letter-spacing: .04em; color: var(--ouro-texto); }
.cel .gate::before { content: ""; width: 7px; height: 7px; background: var(--ouro); transform: rotate(45deg); border: 1px solid var(--titulo); }
.cel--pass { color: var(--titulo); font-weight: 500; }
.cel--pass .seta { display: inline-block; width: 14px; height: 10px; vertical-align: -1px; margin-right: 4px; }
.cel--pos { background: var(--fundo-2); padding-left: 4px; }
.faixas__sep { grid-row: 1 / span 6; border-left: 1px dashed var(--linha-2); margin-left: 4px; }
.rot-mob { display: none; }

/* desfechos e laço no cabeçalho */
.forma-laco, .forma-ou { width: 14px; height: 12px; flex: none; }

/* ------------------------------------------------------------ jornada: fichas por etapa */

.etapas { display: grid; grid-template-columns: repeat(var(--n, 2), minmax(0, 1fr)); gap: var(--e3); align-items: start; }
.etapa { display: flex; flex-direction: column; gap: 8px; min-width: 0; padding-top: 8px; border-top: 3px solid var(--titulo); scroll-margin-top: 16px; }
.etapa--g { border-top-color: var(--verde); }
.etapa--h { border-top-color: var(--tinta-3); }
.etapa--pos { border-top-style: dashed; }
.etapa__cab { display: flex; gap: 12px; align-items: flex-start; }
.etapa__cab > div { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.etapa__obj { font-size: var(--t-corpo); color: var(--titulo); line-height: 1.32; font-weight: 500; }
.etapa__entra { font-size: 13px; color: var(--tinta-3); line-height: 1.38; }
.etapa__entra b { font-weight: 600; color: var(--tinta-2); }
.lanes { display: flex; flex-direction: column; gap: 0; border-radius: var(--r2); overflow: hidden; border: 1px solid var(--linha); background: var(--cartao); }
.lane { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 8px; padding: 8px 12px; }
.lane + .lane { border-top: 1px solid var(--linha); }
.lane__nome { font-size: 12px; font-weight: 600; padding-top: 2px; }
.lane--mkt .lane__nome { color: var(--azul); }
.lane--com .lane__nome { color: var(--titulo); }
.lane--ped .lane__nome { color: var(--verde); }
.lane--dir .lane__nome { color: var(--ouro-texto); }
.lane__acoes { display: flex; flex-direction: column; gap: 4px; font-size: 13px; line-height: 1.38; color: var(--tinta-2); }
.lane__acoes .meio { font-size: 12px; font-weight: 600; color: var(--tinta-3); margin-right: 4px; }
.difs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.dif { border-radius: var(--r1); padding: 8px 8px; font-size: 13px; line-height: 1.38; color: var(--tinta); display: flex; flex-direction: column; gap: 4px; }
.dif--ww { background: var(--ww-claro); }
.dif--bb { background: var(--bb-claro); }
.regras { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 16px; }
.regras > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.regras dt { font-size: 12px; font-weight: 600; color: var(--tinta-3); }
.regras dd { font-size: 13px; line-height: 1.38; color: var(--tinta); }
.regras .saida dd { color: var(--titulo); font-weight: 500; }
.lista-mat { display: flex; flex-wrap: wrap; gap: 4px; }
.lista-mat .chip { white-space: normal; text-align: left; }
.dados { font-size: 13px; color: var(--tinta-2); line-height: 1.45; }
.mini-jornada { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.mini-jornada a { text-decoration: none; }
.mini-jornada .letra { width: 22px; height: 22px; font-size: 12px; opacity: .5; }
.mini-jornada .letra.on { opacity: 1; box-shadow: 0 0 0 2px var(--fundo), 0 0 0 4px var(--ouro); }
.mini-jornada i { width: 8px; height: 2px; background: var(--linha-2); }
.mini-jornada i.sep { width: 14px; background: transparent; border-top: 2px dotted var(--linha-2); height: 0; }

/* ------------------------------------------------------------ materiais por etapa */

.mat-etapas { display: grid; grid-template-columns: repeat(var(--n, 6), minmax(0, 1fr)); gap: var(--e2); }
.mat-col { display: flex; flex-direction: column; gap: 8px; min-width: 0; padding-top: 8px; border-top: 2px solid var(--titulo); }
.mat-col--pos { border-top-style: dashed; }
.mat-col h3 { display: flex; gap: 8px; align-items: center; font-size: 13px; font-weight: 600; color: var(--titulo); line-height: 1.25; }
.mat-col .letra { width: 22px; height: 22px; font-size: 12px; }
.mat-col ul { display: flex; flex-direction: column; gap: 4px; }
.mat-col li .chip { white-space: normal; border-radius: var(--r1); width: 100%; align-items: flex-start; }
.mat-col li .chip::before { margin-top: 4px; }
.mat-col li .chip small { display: block; font-size: 12px; color: var(--tinta-3); font-weight: 400; }
[data-status-filtro] [data-status] { transition: opacity .2s ease-out; }
[data-status-filtro="ok"] [data-status]:not([data-status="ok"]),
[data-status-filtro="hist"] [data-status]:not([data-status="hist"]),
[data-status-filtro="verif"] [data-status]:not([data-status="verif"]),
[data-status-filtro="produzir"] [data-status]:not([data-status="produzir"]) { opacity: .22; }

.mat-linhas { display: flex; flex-direction: column; border-top: 2px solid var(--titulo); }
.mat-linha { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 12px; padding: 4px 0; border-bottom: 1px solid var(--linha); align-items: start; }
.mat-linha--pos { background: var(--fundo-2); }
.mat-linha__etapa { display: flex; gap: 8px; align-items: center; font-size: 13px; font-weight: 600; color: var(--titulo); line-height: 1.25; padding-top: 2px; }
.mat-linha__etapa .letra { width: 22px; height: 22px; font-size: 12px; }
.mat-linha__chips { display: flex; flex-wrap: wrap; gap: 4px; }
.mat-linha__chips .chip { font-size: 12px; padding: 2px 8px 2px 4px; }
.mat-linha__chips .chip__fr { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-left: 6px; vertical-align: 1px; }
.chip__fr--ww { background: linear-gradient(135deg, var(--ww-2), var(--ww)); }
.chip__fr--bb { background: var(--bb); }
.mat-leg { margin-left: auto; }
.mat-leg .chip__fr { margin: 0 4px 0 8px; }
.chip small { font-size: 12px; }
.mat-linha__chips .chip { white-space: normal; }
.chip__fr { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-left: 6px; vertical-align: 1px; }
.chip__fr--ww { background: linear-gradient(135deg, var(--ww-2), var(--ww)); }
.chip__fr--bb { background: var(--bb); }
.mat-leg { margin-left: auto; }
.mat-leg .chip__fr { margin: 0 4px 0 8px; }
.chip small { font-size: 12px; color: var(--tinta-3); font-weight: 400; margin-left: 4px; }
.canais__topo { justify-content: space-between; }
.canais__logo { height: 30px; width: auto; }

/* ------------------------------------------------------------ painel e indicadores */

.conexao { display: grid; grid-template-columns: minmax(0, 1fr) 40px minmax(0, 1fr) 40px minmax(0, 1fr); align-items: stretch; gap: 0; }
.cx { border: 1px solid var(--linha); border-radius: var(--r2); background: var(--cartao); padding: 12px 16px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.cx--existe { border-color: var(--linha-2); }
.cx--propoe { border: 1.5px dashed var(--linha-2); background: transparent; }
.cx ul { display: flex; flex-direction: column; gap: 4px; }
.cx li { font-size: 13px; color: var(--tinta-2); line-height: 1.4; }
.cx__seta { display: grid; place-items: center; color: var(--tinta-3); }
.cx__seta svg { width: 26px; height: 14px; }
.achados { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: var(--e2); }
.achado { padding: 12px 12px; border-radius: var(--r2); background: var(--cartao-2); display: flex; flex-direction: column; gap: 4px; }
.achado p { font-size: 13px; line-height: 1.42; color: var(--tinta-2); }
.achado strong { font-size: var(--t-menor); color: var(--titulo); }
.cinco { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; border-top: 2px solid var(--titulo); }
.cinco > section { padding: 12px 12px 12px 0; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.cinco > section + section { padding-left: 12px; border-left: 1px solid var(--linha); }
.cinco ul { display: flex; flex-direction: column; gap: 8px; }
.cinco li { font-size: 13px; line-height: 1.4; color: var(--tinta-2); }
.cinco .base { font-size: 13px; color: var(--ouro-texto); background: var(--ouro-claro); border-radius: var(--r1); padding: 4px 8px; line-height: 1.35; margin-top: auto; }
.okr { display: flex; flex-direction: column; gap: 0; }
.okr__linha { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr) minmax(0, 1.1fr) minmax(0, .8fr); gap: var(--e3); padding: 12px 0; border-bottom: 1px solid var(--linha); }
.okr__linha--cab { border-bottom: 2px solid var(--titulo); padding-top: 0; }
.okr__linha--cab span { font-size: var(--t-rotulo); font-weight: 600; color: var(--tinta-3); }
.okr__linha p { font-size: 13px; line-height: 1.42; color: var(--tinta-2); }
.okr__linha p.obj { color: var(--titulo); font-weight: 500; font-size: var(--t-menor); }
.okr__linha .fr { margin-bottom: 4px; }

/* ------------------------------------------------------------ capacidade e funções */

.funcoes { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr); gap: var(--e4); align-items: start; }
.funcao { border-radius: var(--r2); padding: 12px 12px; display: flex; flex-direction: column; gap: 4px; }
.funcao--conf { background: var(--marinho); color: var(--sobre-marinho); }
.funcao--conf strong { color: var(--sobre-marinho); }
.funcao--conf p { color: var(--sobre-marinho-2); font-size: 13px; line-height: 1.42; }
.funcao--prop { border: 1.5px dashed var(--linha-2); background: transparent; }
.funcao--prop p { color: var(--tinta-2); font-size: 13px; line-height: 1.42; }
.funcoes__grupo { font-size: var(--t-rotulo); font-weight: 600; color: var(--tinta-3); }
.funcoes__grupo--conf { color: var(--titulo); }
.funcao__estado { font-size: 12px; font-weight: 600; color: var(--tinta-3); }
.funcao--conf .funcao__estado { color: var(--ouro); }
.corrente { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-top: var(--e1); }
.elo { position: relative; padding: 12px 16px 12px 12px; display: flex; flex-direction: column; gap: 4px; border: 1px solid var(--linha); background: var(--cartao); min-width: 0; }
.elo + .elo { border-left: 0; }
.elo:first-child { border-radius: var(--r2) 0 0 var(--r2); }
.elo:last-child { border-radius: 0 var(--r2) var(--r2) 0; }
.elo strong { font-size: var(--t-menor); color: var(--titulo); }
.elo p { font-size: 13px; color: var(--tinta-2); line-height: 1.4; }
.elo .pergunta { font-size: 13px; color: var(--ouro-texto); background: var(--ouro-claro); border-radius: var(--r1); padding: 4px 8px; line-height: 1.35; }

/* ------------------------------------------------------------ sequência e dependências */

.seq { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--e3); }
.seq__col { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.seq__col > .rotulo { padding-bottom: 4px; border-bottom: 2px solid var(--titulo); color: var(--titulo); }
.seq__col--depois > .rotulo { border-bottom-style: dashed; }
.prod { border: 1px solid var(--linha); border-radius: var(--r2); background: var(--cartao); padding: 12px 12px; display: flex; flex-direction: column; gap: 4px; }
.prod__cab { display: flex; gap: 8px; align-items: flex-start; }
.prod__n { font-family: var(--f-display); font-size: 22px; line-height: 1; color: var(--titulo-suave); font-variant-numeric: tabular-nums; min-width: 22px; }
.prod strong { font-size: var(--t-menor); color: var(--titulo); line-height: 1.3; }
.prod p { font-size: 13px; color: var(--tinta-2); line-height: 1.4; }
.prod .dep { font-size: 13px; color: var(--tinta-3); }
.prod .dep b { color: var(--tinta-2); font-weight: 600; }
.fases { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; }
.fase { padding: 8px 12px 8px 0; display: flex; flex-direction: column; gap: 4px; position: relative; min-width: 0; }
.fase + .fase { padding-left: 12px; border-left: 1px solid var(--linha); }
.fase b { font-family: var(--f-display); font-weight: 500; color: var(--titulo); font-size: 22px; }
.fase p { font-size: 13px; line-height: 1.4; color: var(--tinta-2); }
.fase small { font-size: 12px; color: var(--tinta-3); }

/* ------------------------------------------------------------ peças-piloto (rascunhos) */

.pecas { display: grid; grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); gap: var(--e3); align-items: start; }
.peca { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.peca__meta { display: flex; flex-direction: column; gap: 4px; }
.peca__meta p { font-size: 13px; color: var(--tinta-2); line-height: 1.4; }
.peca__meta p b { color: var(--tinta); font-weight: 600; }
.folha {
  position: relative; border-radius: var(--r2); overflow: hidden; background: #FFFFFF; color: #0D1B2A;
  box-shadow: 0 0 0 1px var(--linha), 0 18px 36px -26px rgba(0, 32, 96, .5);
  display: grid; grid-template-columns: 22px minmax(0, 1fr);
}
.folha__lombada { background: #002060; position: relative; }
.folha__lombada::after { content: ""; position: absolute; left: 9px; top: 14px; width: 3px; height: 26px; background: #F8D300; border-radius: 2px; }
.folha strong, .folha b { color: inherit; }
.folha__corpo { padding: 12px 16px 16px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.folha--ww .folha__corpo { background: linear-gradient(170deg, #FDEDE0 0%, #FFFFFF 55%); }
.folha__faixa { position: absolute; top: 9px; right: -38px; pointer-events: none; transform: rotate(35deg); background: #F8D300; color: #002060; font-size: 9.5px; font-weight: 700; padding: 4px 40px; }
.folha__eyebrow { padding-right: 64px; font-size: 12px; font-weight: 600; color: #5F687B; }
.folha--ww .folha__eyebrow { color: #9A4A0C; }
.folha--bb .folha__eyebrow { color: #006B3F; }
.folha__titulo { font-family: var(--f-display); font-weight: 500; font-size: 22px; line-height: 1.1; color: #002060; text-wrap: balance; }
.folha--ww .folha__titulo { color: #203065; }
.folha__txt { font-size: 13px; line-height: 1.45; color: #3B475C; }
.folha__lista { display: flex; flex-direction: column; gap: 4px; }
.folha__lista li { font-size: 13px; line-height: 1.4; color: #3B475C; padding-left: 12px; position: relative; }
.folha__lista li::before { content: ""; position: absolute; left: 0; top: .5em; width: 6px; height: 6px; border-radius: 50%; background: #002060; }
.folha--ww .folha__lista li::before { background: #F88A31; }
.folha--bb .folha__lista li::before { background: #006B3F; }
.folha__form { display: flex; flex-direction: column; gap: 4px; border: 1px solid #D6DBE3; border-radius: 6px; padding: 8px 8px; background: #FFFFFF; }
.folha__q { font-size: 12px; font-weight: 600; color: #203065; }
.folha__op { display: flex; align-items: center; gap: 8px; font-size: 12px; color: #3B475C; }
.folha__op i { width: 12px; height: 12px; border-radius: 50%; border: 1.5px solid #5F687B; flex: none; }
.folha__op--sai { color: #5F687B; }
.folha__op--sai em { font-style: normal; display: block; font-size: 12px; color: #9A4A0C; }
.folha__bt { align-self: flex-start; background: #203065; color: #FFFFFF; border-radius: 6px; font-size: 12px; font-weight: 600; padding: 8px 12px; }
.folha--bb .folha__bt { background: #002060; }
.folha__assina { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-top: 1px solid #E3E7EE; padding-top: 8px; margin-top: 2px; }
.folha__assina img { height: 16px; width: auto; }
.folha__assina small { font-size: 11px; color: #5F687B; }
.folha__img { border-radius: 6px; width: 100%; height: 150px; object-fit: contain; max-width: 100%; background: #F3F1EB; }
.folha__tabela { width: 100%; border-collapse: collapse; font-size: 12px; }
.folha__tabela th, .folha__tabela td { text-align: left; padding: 4px 4px 4px 0; border-bottom: 1px solid #E3E7EE; vertical-align: top; color: #3B475C; }
.folha__tabela th { font-size: 12px; color: #5F687B; font-weight: 600; }
.folha__check li { font-size: 12px; color: #3B475C; padding-left: 20px; position: relative; line-height: 1.4; }
.folha__check li::before { content: ""; position: absolute; left: 0; top: .2em; width: 12px; height: 12px; border: 1.5px solid #002060; border-radius: 2px; }
.folha__check { display: flex; flex-direction: column; gap: 4px; }

/* ------------------------------------------------------------ decisões */

.decisoes { display: flex; flex-direction: column; gap: 0; border-top: 2px solid var(--titulo); }
.decisao { display: grid; grid-template-columns: 30px minmax(0, .9fr) minmax(0, 1.5fr) auto minmax(150px, .55fr); gap: 12px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--linha); }
.decisao__seg button { padding: 4px 8px; font-size: 13px; }
.decisao__nota input { width: 100%; border: 1px solid var(--linha-2); border-radius: var(--r1); padding: 4px 8px; font-size: 13px; background: var(--cartao); color: var(--tinta); }
.decisao__n { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--ouro); color: #002060; font-weight: 700; font-size: 13px; font-variant-numeric: tabular-nums; }
.decisao strong { font-size: var(--t-menor); color: var(--titulo); }
.decisao p { font-size: 13px; color: var(--tinta-2); line-height: 1.4; }
.decisao .dono { font-size: 13px; color: var(--tinta-3); }
.decisao[data-estado="aprovar"] .decisao__n { background: var(--verde); color: #FFFFFF; }
.decisao[data-estado="ajustar"] .decisao__n { background: var(--azul); color: #FFFFFF; }
.decisao[data-estado="adiar"] .decisao__n { background: var(--cartao-2); color: var(--tinta-3); }
.registro-acoes { display: flex; flex-wrap: wrap; gap: var(--e2); align-items: center; }
.bt { border: 1px solid var(--titulo); background: var(--titulo); color: var(--fundo); border-radius: var(--r1); padding: 8px 12px; font-weight: 600; font-size: 13px; }
.bt--sec { background: transparent; color: var(--titulo); }
.bt:hover { filter: brightness(1.08); }
.registro-msg { font-size: 13px; color: var(--tinta-3); }
.hipoteses { display: flex; flex-wrap: wrap; gap: 8px; }

/* ------------------------------------------------------------ diálogos (índice e fontes) */

dialog.painel {
  width: min(760px, calc(100vw - 32px)); max-height: min(86vh, 900px); padding: 0; border: 0; border-radius: var(--r2);
  background: var(--fundo); color: var(--tinta); box-shadow: var(--sombra);
}
dialog.painel::backdrop { background: rgba(6, 17, 43, .55); }
.painel__cab { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; gap: var(--e2); padding: 16px 20px; background: var(--fundo); border-bottom: 1px solid var(--linha); }
.painel__cab .h2 { font-size: 22px; }
.painel__fechar { margin-left: auto; border: 1px solid var(--linha-2); background: transparent; border-radius: var(--r1); padding: 4px 12px; font-size: 13px; }
.painel__corpo { padding: 16px 20px 20px; display: flex; flex-direction: column; gap: var(--e3); overflow: auto; }
.indice-caps { display: flex; flex-direction: column; gap: var(--e2); }
.indice-cap { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 8px; }
.indice-cap__n { font-family: var(--f-display); font-size: 22px; color: var(--titulo-suave); line-height: 1.1; }
.indice-cap__nome { font-weight: 600; color: var(--titulo); }
.indice-cap ol { display: flex; flex-direction: column; gap: 2px; margin-top: 4px; }
.indice-cap a { color: var(--tinta-2); text-decoration: none; font-size: var(--t-menor); display: inline-block; padding: 2px 0; }
.indice-cap a:hover { color: var(--azul); text-decoration: underline; }
.indice-cap a[aria-current="true"] { color: var(--titulo); font-weight: 600; }
.opcoes { display: flex; flex-wrap: wrap; gap: 8px; border-top: 1px solid var(--linha); padding-top: var(--e2); }
.fontes-lista { display: flex; flex-direction: column; gap: 8px; }
.fonte { display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: 8px; font-size: var(--t-menor); line-height: 1.4; }
.fonte__cod { font-weight: 600; color: var(--titulo); font-variant-numeric: tabular-nums; }
.fonte__nota { color: var(--tinta-3); font-size: 13px; }
.fonte__estado { font-size: 12px; font-weight: 600; color: var(--verde); }
.fonte__estado--parcial { color: var(--ouro-texto); }
.fonte__estado--nome, .fonte__estado--nao { color: var(--tinta-3); }

.vivo { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ------------------------------------------------------------ movimento (revelar em ordem de leitura; traço que se desenha) */

@media (prefers-reduced-motion: no-preference) {
  html[data-modo="apresentacao"] .slide.entra [data-mov] {
    animation: entrar .44s cubic-bezier(.2, .7, .2, 1) both;
    animation-delay: calc(var(--i, 0) * 60ms);
  }
  html[data-modo="apresentacao"] .slide.entra .traco {
    stroke-dasharray: 1; stroke-dashoffset: 1;
    animation: tracar .9s cubic-bezier(.4, 0, .2, 1) forwards;
    animation-delay: calc(var(--i, 0) * 60ms + 120ms);
  }
  .regua__trilho span { transition: height .25s ease-out; }
}
@keyframes entrar { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes tracar { to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* ------------------------------------------------------------ responsivo */

@media (max-width: 1180px) {
  :root { --gutter-d: 36px; }
  .faixas { grid-template-columns: 96px repeat(8, minmax(0, 1fr)) 10px repeat(3, minmax(0, 1fr)); column-gap: 4px; }
  .cel { font-size: 12px; }
  .decisao { grid-template-columns: 30px minmax(0, 1fr) minmax(0, 1.3fr); }
  .decisao__seg { grid-column: 2; }
  .decisao__nota { grid-column: 3; }
  .cinco { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cinco > section:nth-child(4) { padding-left: 0; border-left: 0; }
  .cinco > section:nth-child(n+4) { border-top: 1px solid var(--linha); }
  .mat-etapas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 980px) {
  .tese { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .tese .nucleo { grid-column: 1 / -1; order: -1; }
  .kv, .voz, .funcoes, .licao { grid-template-columns: minmax(0, 1fr); }
  .seq { grid-template-columns: minmax(0, 1fr); }
  .pecas { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .conexao { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .cx__seta { transform: rotate(90deg); height: 24px; }
  .achados { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .okr__linha { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .fases { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 8px; }
  .fase:nth-child(odd) { padding-left: 0; border-left: 0; }
  .corrente { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .elo { border-left: 1px solid var(--linha) !important; border-radius: var(--r2) !important; }
  .corrente { gap: 8px; }
}

/* janela baixa (notebook de 900 px): mesma composição, respiro mais curto */
@media (max-height: 960px) and (min-width: 761px) {
  :root { --t-h1: clamp(24px, 2.1vw, 40px); --t-lead: clamp(15px, 1.1vw, 18px); }
  .slide__in { padding-block: 16px 12px; }
  .slide__corpo { gap: 16px; }
  .decisao { padding-block: 4px; }
  .mat-linha { padding-block: 2px; }
  .mat-linha__chips { gap: 3px; }
  .mat-linha__chips .chip { padding-block: 1px; }
  .etapas, .pecas { gap: 16px; }
  .folha__corpo { gap: 8px; padding-block: 12px; }
  .folha__img { height: 128px; }
  .peca-kv__img { height: 132px; }
}

/* tela estreita: leitura sequencial, régua vira barra inferior */
@media (max-width: 760px) {
  :root { --regua: 0px; --gutter-d: 16px; }
  .regua { display: none; }
  html[data-modo="apresentacao"] .app { grid-template-columns: minmax(0, 1fr); }
  html[data-modo="apresentacao"] .palco { grid-column: 1; height: calc(100% - 58px - env(safe-area-inset-bottom, 0px)); }
  html[data-modo="leitura"] .palco { margin-left: 0; padding-bottom: calc(56px + env(safe-area-inset-bottom, 0px)); }
  .barra {
    display: flex; align-items: center; gap: 4px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30;
    background: var(--marinho); color: var(--sobre-marinho);
    padding: 8px max(8px, env(safe-area-inset-right, 0px)) calc(8px + env(safe-area-inset-bottom, 0px)) max(8px, env(safe-area-inset-left, 0px));
  }
  .barra .bt-regua { width: 44px; height: 44px; flex: none; }
  .barra__pos {
    flex: 1; min-width: 0; height: 44px; border: 1px solid rgba(255, 255, 255, .22); border-radius: var(--r2); background: transparent; color: var(--sobre-marinho);
    display: flex; flex-direction: column; justify-content: center; padding: 0 8px; text-align: left;
  }
  .barra__pos b { font-size: 12px; font-weight: 500; color: var(--sobre-marinho-2); font-variant-numeric: tabular-nums; }
  .barra__pos span { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .bt-regua .regua__nome { display: none; }

  .slide__in { padding-block: var(--e3) var(--e2); gap: var(--e2); }
  .slide__logo { height: 22px; }
  .titulo { max-width: none; }
  .g2, .g3, .g4, .tri, .perfis, .tese, .difs, .regras, .estado, .achados, .okr__linha, .pecas, .corrente, .desfechos, .kv__pecas, .nao-cruza, .nao-cruza ul { grid-template-columns: minmax(0, 1fr); }
  .tri > section + section, .estado > div + div { padding-left: 0; border-left: 0; border-top: 1px solid var(--linha); padding-top: var(--e2); }
  .estado > div + div { padding: var(--e3); }
  .tri > section { padding-right: 0; }
  .capa { grid-template-columns: minmax(0, 1fr); }
  .capa__texto { padding: var(--e4) 0 var(--e4); }
  .capa__painel { margin-right: calc(-1 * max(16px, env(safe-area-inset-right, 0px))); margin-left: calc(-1 * max(16px, env(safe-area-inset-left, 0px))); padding: var(--e4) max(16px, env(safe-area-inset-left, 0px)); }
  .capa__logo { width: 170px; }
  .mapa-caps { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .mapa-caps li { border-right: 0 !important; padding: 8px 0 !important; border-top: 1px solid var(--linha); }
  .trilha__passos, .caminho__passos { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .passo__no b, .cp__marca b { display: none; }
  .passo, .cp { padding: 0 0 0 20px; }
  .passo__no, .cp__marca { position: absolute; left: 0; top: 3px; }
  .caminho { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .zonas { grid-template-columns: minmax(0, 1fr); }
  .zona + .zona { border-left: 0; border-top: 1px solid var(--linha); }
  .zona__papeis { flex-direction: row; flex-wrap: wrap; }
  .reescrita { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .lane { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .etapas { grid-template-columns: minmax(0, 1fr); }
  .mat-etapas { grid-template-columns: minmax(0, 1fr); }
  .cinco { grid-template-columns: minmax(0, 1fr); }
  .cinco > section, .cinco > section + section { padding-left: 0; border-left: 0; border-top: 1px solid var(--linha); padding-right: 0; }
  .fases { grid-template-columns: minmax(0, 1fr); }
  .fase, .fase + .fase { padding-left: 0; border-left: 0; border-top: 1px solid var(--linha); }
  .decisao { grid-template-columns: 30px minmax(0, 1fr); }
  .decisao > :nth-child(n+3) { grid-column: 2; }
  .mat-linha { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .okr__linha--cab { display: none; }
  .okr__linha p::before { content: attr(data-rot); display: block; font-size: 12px; font-weight: 600; color: var(--tinta-3); margin-bottom: 2px; }

  /* jornada em faixas vira leitura por etapa */
  .faixas { display: flex; flex-direction: column; gap: 8px; }
  .faixas__rot, .faixas__grupo, .faixas__sep { display: none; }
  .etapa-col { display: flex; flex-direction: column; border: 1px solid var(--linha); border-radius: var(--r2); background: var(--cartao); overflow: hidden; }
  .etapa-col--pos { border-style: dashed; }
  .etapa-cab { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 12px; border-bottom: 1px solid var(--linha); background: var(--fundo-2); }
  .etapa-cab__nome { width: 100%; }
  .cel { padding: 8px 12px; border-bottom: 1px solid var(--linha); font-size: 13px; }
  .cel:last-child { border-bottom: 0; }
  .cel--vazia { display: none; }
  .rot-mob { display: block; font-size: 12px; font-weight: 600; color: var(--tinta-3); margin-bottom: 2px; }

  /* tabelas viram fichas */
  table.mat.resp, table.mat.resp tbody, table.mat.resp tr, table.mat.resp th, table.mat.resp td { display: block; width: 100%; }
  table.mat.resp thead { display: none; }
  table.mat.resp tr { border-bottom: 1px solid var(--linha); padding: 8px 0; }
  table.mat.resp th, table.mat.resp td { border: 0; padding: 4px 0 !important; }
  table.mat.resp td::before { content: attr(data-rot); display: block; font-size: 12px; font-weight: 600; color: var(--tinta-3); }
  table.mat.resp tr.grupo { padding-top: 16px; border-bottom: 2px solid var(--linha-2); }
}

@media (max-width: 420px) {
  .mapa-caps { grid-template-columns: minmax(0, 1fr); }
  .seg button { padding: 8px 12px; }
}

/* ------------------------------------------------------------ impressão (leitura contínua no papel) */

@media print {
  @page { size: A4 landscape; margin: 11mm 12mm; }
  html, body { height: auto; background: var(--fundo); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .regua, .barra, .pular, dialog, [data-so-tela] { display: none !important; }
  html[data-modo] .app { display: block; height: auto; }
  html[data-modo] .palco { margin: 0; height: auto; overflow: visible; }
  html[data-modo] .slide { display: block !important; min-height: 0; break-before: page; border: 0; }
  html[data-modo] .slide:first-of-type { break-before: auto; }
  .slide__in { display: block; padding: 0; max-width: none; }
  .slide__in > * + * { margin-top: 8px; }
  .slide__corpo { display: block; margin-block: 0; padding-block: 0; }
  .slide__corpo > * + * { margin-top: 12px; }
  .slide--capa .slide__in > * + * { margin-top: 0; }
  .slide__logo { display: none; }
  .slide__pe { break-before: avoid-page; page-break-before: avoid; padding-top: 4px; }
  .slide__topo { min-height: 0; }
  .etapas, .pecas, .seq, .tese, .perfis { gap: 16px; }
  .lane { padding-block: 4px; }
  .status-defs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 16px; }
  .mat-linha { padding-block: 3px; }
  details.mais > .mais__corpo { display: flex; }
  details.mais > summary::before { display: none; }
  .trilha .passo__lacuna, .trilha .passo__regra { display: block !important; }
  .trilha .passo__lacuna::before { content: "2025: "; font-weight: 600; }
  .trilha .passo__regra::before { content: "Proposta: "; font-weight: 600; color: var(--verde); }
  .tabela-wrap { overflow: visible; }
  .slide [data-mov] { animation: none !important; opacity: 1 !important; transform: none !important; }
  .capa__painel { margin-right: 0; }
  .achado, .cx, .prod, .peca, .folha, .reescrita, .decisao, .mat-linha, .elo, .funcao, .lane, .envelope, .nucleo, tr, .difs, .regras, .etapa__cab { break-inside: avoid; }
  .titulo, .h2, .h3 { break-after: avoid; }
  a { color: inherit; text-decoration: none; }
}
