/* ==========================================================================
   PAINEL DO CONSELHO (visão integral em uma tela) — classes pn-*
   ========================================================================== */
.pn-cena h1, .pn-cena h3, .pn-cena p, .pn-cena blockquote, .pn-cena ol { margin: 0; padding: 0; }
.pn-cena h1, .pn-cena h3 { text-wrap: balance; }
.pn-cena .pn-palco { --marfim: #F3EFE6; --grafite: #292C28; --ouro: #A48B5F; --areia: #DCD3C4; --verde: #2E3B2F; --branco: #FFFCF7; --ouro-tinta: #75603C; --ouro-claro: #CDB78C; --tinta-2: #565A53; --linha: #CFC4B1; --linha-suave: #E4DCCD; color: var(--grafite); --alerta: #8A4B2E; }
html.noite .pn-cena .pn-palco { --marfim: #1F231F; --grafite: #ECE5D8; --branco: #262A26; --areia: #33372F; --ouro-tinta: #D2BC90; --tinta-2: #B9B2A5; --linha: #40453E; --linha-suave: #30352F; --alerta: #E0A27F; }
html.noite .pn-cartao p { color: var(--grafite); }
.pn-cena.pn-home { height: auto; min-height: 0; aspect-ratio: 1600 / 1000; background: none; border-radius: 10px; }
.pn-cena.pn-home .pn-palco { box-shadow: 0 30px 80px -30px rgba(41,44,40,.45); border-radius: 10px; }
.pn-ctrl a.pn-btn-txt { height: 40px; display: inline-flex; align-items: center; gap: 6px; padding: 0 16px; border-radius: 999px; background: var(--verde); color: #F3EFE6; text-decoration: none; font: 600 13px var(--f-texto); white-space: nowrap; border: 0; cursor: pointer; }
.pn-ctrl .pn-btn-txt .ico { width: 18px; height: 18px; }
.pn-ctrl .pn-btn-txt:hover { background: var(--grafite); color: var(--marfim); }
.pn-cena:fullscreen { height: 100vh; }
.modo-seg { display: inline-flex; padding: 3px; border: 1px solid var(--linha); border-radius: 999px; background: var(--branco); gap: 2px; }
.modo-seg button { border: 0; background: transparent; height: 36px; padding: 0 14px; border-radius: 999px; font: 600 var(--t-xs) var(--f-texto); letter-spacing: .02em; color: var(--tinta-2); cursor: pointer; display: inline-flex; gap: 6px; align-items: center; }
.modo-seg button .ico { width: 16px; height: 16px; }
.modo-seg button[aria-pressed="true"] { background: var(--verde); color: var(--sobre-verde); }
html.noite .modo-seg button[aria-pressed="true"] { background: var(--ouro); color: #1C1F1C; }
.conselho[data-modo="painel"] .conselho-grade { display: none; }
.conselho[data-modo="leitura"] .pn-cena { display: none; }
.conselho[data-modo="painel"] .so-leitura { display: none; }
.destaque-cab { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 16px; margin-bottom: var(--s5); }
@media (max-width: 899px) { .pn-cena.pn-home { aspect-ratio: auto; } .pn-cena.pn-home .pn-palco { border-radius: 10px; overflow: hidden; } .modo-seg button span { display: none; } }

/* palco */
.pn-cena { position: relative; display: block; overflow: hidden; height: calc(100svh - var(--barra) - 61px - env(safe-area-inset-top, 0px)); min-height: 560px; background:
  radial-gradient(80% 70% at 30% 20%, #2B352D 0%, #1A1F1B 70%); }
.pn-palco {
  width: 1600px; height: 1000px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(var(--s, 1)); transform-origin: center;
  display: grid; grid-template-columns: 500px 1fr; grid-template-rows: 100%; background: var(--marfim); box-shadow: 0 40px 120px -30px rgba(0,0,0,.7);
  overflow: hidden;
}

/* coluna institucional */
.pn-lado { position: relative; background: var(--verde); color: #F3EFE6; display: grid; grid-template-rows: 520px 1fr; overflow: hidden; }
.pn-foto { position: relative; overflow: hidden; }
.pn-foto img { width: 100%; height: 100%; object-fit: cover; display: block; transform: scale(1.04); }
.pn-foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(46,59,47,0) 45%, rgba(46,59,47,.75) 80%, var(--verde) 100%); }
.pn-foto .pn-moldura { position: absolute; inset: 22px 22px 0; border: 1px solid rgba(243,239,230,.35); border-bottom: 0; border-radius: 240px 240px 0 0; z-index: 1; pointer-events: none; }
.pn-numero { position: absolute; left: 34px; bottom: -18px; z-index: 2; font-family: var(--f-display); font-weight: 300; font-size: 230px; line-height: .8; color: var(--ouro-claro); letter-spacing: -.03em; font-variant-numeric: lining-nums; text-shadow: 0 10px 40px rgba(0,0,0,.35); }
.pn-numero small { position: absolute; left: 8px; top: -26px; font: 600 13px/1 var(--f-texto); letter-spacing: .24em; text-transform: uppercase; color: var(--marfim); opacity: .85; text-shadow: none; white-space: nowrap; }
.pn-lado-txt { padding: 52px 44px 36px; display: grid; align-content: start; gap: 26px; position: relative; z-index: 2; }
.pn-aspas { font-family: var(--f-display); font-size: 90px; line-height: .4; height: 28px; color: var(--ouro); }
.pn-citacao blockquote { font-family: var(--f-display); font-style: italic; font-weight: 500; font-size: 37px; line-height: 1.12; text-wrap: balance; }
.pn-citacao cite { display: inline-flex; gap: 10px; align-items: center; margin-top: 16px; font: 600 14px/1 var(--f-texto); letter-spacing: .16em; text-transform: uppercase; color: var(--ouro-claro); font-style: normal; }
.pn-citacao cite::before { content: ""; width: 26px; height: 1px; background: currentColor; }
.pn-licao { border-top: 1px solid rgba(205,183,140,.3); padding-top: 18px; display: grid; gap: 6px; }
.pn-licao b, .pn-rot { font: 600 12px/1 var(--f-texto); letter-spacing: .2em; text-transform: uppercase; }
.pn-licao b { color: var(--ouro-claro); }
.pn-licao p { font-family: var(--f-display); font-size: 22px; line-height: 1.3; color: rgba(243,239,230,.9); }
.pn-selo { position: absolute; left: 44px; bottom: 30px; display: flex; gap: 10px; align-items: center; font: 600 11px/1.3 var(--f-texto); letter-spacing: .2em; text-transform: uppercase; color: rgba(243,239,230,.6); }
.pn-selo svg { width: 28px; height: 28px; color: var(--ouro); }

/* coluna de estudo */
.pn-estudo { padding: 34px 48px 30px; display: grid; grid-template-rows: auto auto auto minmax(0,1fr) auto; gap: 18px; min-width: 0; min-height: 0; overflow: hidden; }
.pn-cab { display: grid; grid-template-columns: minmax(0,1fr) auto; column-gap: 24px; align-items: center; }
.pn-cab .pn-h1 { grid-column: 1 / -1; }
.pn-eyebrow { font: 600 12px/1 var(--f-texto); letter-spacing: .2em; text-transform: uppercase; color: var(--ouro-tinta); display: flex; gap: 12px; align-items: center; }
.pn-eyebrow i { width: 4px; height: 4px; background: var(--ouro); transform: rotate(45deg); }
.pn-cab .pn-h1 { font-family: var(--f-display); font-weight: 600; font-size: 48px; line-height: 1.02; letter-spacing: -.01em; margin-top: 4px; text-wrap: balance; max-width: 30ch; }
.pn-ctrl { display: flex; gap: 6px; align-items: center; }
.pn-ctrl button, .pn-ctrl select { height: 40px; border-radius: 999px; border: 1px solid var(--linha); background: var(--branco); color: var(--grafite); font: 600 13px var(--f-texto); cursor: pointer; }
.pn-ctrl button { width: 40px; display: grid; place-items: center; }
.pn-ctrl button .ico { width: 18px; height: 18px; }
.pn-ctrl button:hover { background: var(--grafite); color: var(--marfim); border-color: var(--grafite); }
.pn-ctrl select { padding: 0 14px; max-width: 200px; }
.pn-ctrl .pn-voltar { height: 40px; display: inline-flex; align-items: center; gap: 6px; padding: 0 16px 0 10px; margin-right: 6px; border-radius: 999px; background: var(--verde); color: var(--marfim); text-decoration: none; font: 600 13px var(--f-texto); white-space: nowrap; }
.pn-ctrl .pn-voltar .ico { width: 18px; height: 18px; }
.pn-ctrl .pn-voltar:hover { background: var(--grafite); }

.pn-secao-rot { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.pn-secao-rot .pn-rot { color: var(--tinta-2); }
.pn-secao-rot::after { content: ""; flex: 1; height: 1px; background: var(--linha-suave); }
.pn-secao-rot .pn-letra { font: 600 14px/1 var(--f-display); width: 24px; height: 24px; border: 1px solid var(--linha); border-radius: 50%; display: grid; place-items: center; color: var(--ouro-tinta); }

/* mapa */
.pn-mapa ol { list-style: none; display: grid; grid-template-columns: repeat(5, 1fr); position: relative; }
.pn-mapa ol::before { content: ""; position: absolute; top: 31px; left: 10%; right: 10%; height: 1px; background: repeating-linear-gradient(90deg, var(--ouro) 0 6px, transparent 6px 11px); }
.pn-mapa li { display: grid; justify-items: center; align-content: start; text-align: center; gap: 6px; position: relative; }
.pn-disco { position: relative; width: 62px; height: 62px; border-radius: 50%; background: var(--verde); color: var(--ouro-claro); display: grid; place-items: center; box-shadow: 0 0 0 6px var(--marfim); }
.pn-disco .ico { width: 27px; height: 27px; stroke-width: 1.4; }
.pn-disco .pn-n { position: absolute; top: -5px; right: -7px; width: 22px; height: 22px; border-radius: 50%; background: var(--ouro); color: #FFFCF7; font: 600 11px/22px var(--f-texto); text-align: center; }
.pn-mapa .pn-nome { font-family: var(--f-display); font-weight: 600; font-size: 21px; letter-spacing: .08em; text-transform: uppercase; line-height: 1; margin-top: 4px; }
.pn-mapa .pn-desc { font-size: 15px; line-height: 1.3; color: var(--tinta-2); max-width: 16ch; }

/* princípios */
.pn-principios ol { list-style: none; display: grid; grid-template-columns: repeat(5, 1fr); border-block: 1px solid var(--linha); }
.pn-principios li { padding: 10px 14px 10px 0; display: grid; gap: 6px; align-content: start; font-family: var(--f-display); font-size: 18px; font-weight: 500; line-height: 1.18; }
.pn-principios li + li { padding-left: 14px; border-left: 1px solid var(--linha-suave); }
.pn-principios li b { font: 600 13px/1 var(--f-display); color: var(--ouro-tinta); font-size: 22px; }

/* cartões */
.pn-cartoes { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: 1fr 1fr; gap: 12px; min-height: 0; }
.pn-cartao { border: 1px solid var(--linha); border-radius: 6px; background: var(--branco); padding: 14px 18px; display: grid; grid-template-rows: auto 1fr; gap: 8px; min-height: 0; }
.pn-cartao h3 { display: flex; gap: 10px; align-items: center; font-family: var(--f-display); font-weight: 600; font-size: 21px; line-height: 1; }
.pn-cartao h3 .ico { width: 22px; height: 22px; color: var(--ouro-tinta); }
.pn-cartao p { font-size: 15px; line-height: 1.42; color: #3A3D38; }
.pn-cartao.pn-exemplo { background: var(--areia); border-color: var(--areia); }
.pn-cartao.pn-exemplo p { font-family: var(--f-display); font-size: 18px; line-height: 1.28; font-weight: 500; color: var(--grafite); }
.pn-cartao.pn-erro h3, .pn-cartao.pn-erro h3 .ico { color: var(--alerta); }
.pn-cartao.pn-erro { border-color: color-mix(in srgb, var(--alerta) 35%, var(--linha)); }
.pn-cartao.pn-revisao { background: var(--verde); border-color: var(--verde); color: #F3EFE6; }
.pn-cartao.pn-revisao h3 .ico { color: var(--ouro-claro); }
.pn-cartao.pn-revisao p { font-family: var(--f-display); font-style: italic; font-size: 19px; line-height: 1.24; color: #F3EFE6; }

/* revisão da lição */
.pn-faixa { display: grid; grid-template-columns: auto 1fr auto; gap: 24px; align-items: center; background: #292C28; color: #F3EFE6; border-radius: 6px; padding: 12px 22px; }
.pn-faixa .pn-rot { color: var(--ouro-claro); }
.pn-faixa ol { list-style: none; display: grid; grid-template-columns: repeat(5, 1fr); }
.pn-faixa li { display: flex; gap: 10px; align-items: center; justify-content: center; font-family: var(--f-display); font-size: 22px; font-weight: 500; }
.pn-faixa li + li { border-left: 1px solid rgba(205,183,140,.25); }
.pn-faixa li .ico { width: 22px; height: 22px; color: var(--ouro-claro); }
.pn-faixa .pn-fonte { font-size: 12px; color: rgba(243,239,230,.6); letter-spacing: .04em; text-align: right; line-height: 1.35; }

/* entrada */
.pn-entra { animation: pn-entra .7s var(--ease) both; }
.pn-entra.pn-d1 { animation-delay: .05s } .pn-entra.pn-d2 { animation-delay: .12s } .pn-entra.pn-d3 { animation-delay: .19s } .pn-entra.pn-d4 { animation-delay: .26s } .pn-entra.pn-d5 { animation-delay: .33s }
@keyframes pn-entra { from { transform: translateY(12px); } to { transform: none; } }
.pn-foto img { animation: pn-zoom 1.4s var(--ease) both; }
@keyframes pn-zoom { from { transform: scale(1.12); } to { transform: scale(1.04); } }
@media (prefers-reduced-motion: reduce) { .pn-entra, .pn-foto img { animation: none; } }

/* celular e janelas estreitas: leitura vertical */
@media (max-width: 899px) {
  .pn-cena { position: static; display: block; background: none; height: auto; min-height: 0; }
  .pn-palco { position: static; width: auto; height: auto; transform: none; grid-template-columns: 1fr; grid-template-rows: auto; box-shadow: none; }
  .pn-estudo { overflow: visible; }
  .pn-lado { grid-template-rows: 360px auto; }
  .pn-numero { font-size: 160px; left: 20px; }
  .pn-lado-txt { padding: 40px 20px 80px; }
  .pn-citacao blockquote { font-size: 30px; }
  .pn-estudo { padding: 28px 16px 40px; }
  .pn-cab { grid-template-columns: 1fr; }
  .pn-cab .pn-h1 { font-size: 38px; }
  .pn-mapa ol { grid-template-columns: 1fr; gap: 14px; }
  .pn-mapa ol::before { top: 31px; bottom: 31px; left: 31px; right: auto; width: 1px; height: auto; background: repeating-linear-gradient(180deg, var(--ouro) 0 6px, transparent 6px 11px); }
  .pn-mapa li { grid-template-columns: 62px 1fr; justify-items: start; text-align: left; column-gap: 16px; row-gap: 2px; }
  .pn-mapa li .pn-disco { grid-row: span 2; }
  .pn-mapa .pn-desc { max-width: none; }
  .pn-principios ol { grid-template-columns: 1fr; }
  .pn-principios li, .pn-principios li + li { padding: 12px 0; border-left: 0; border-bottom: 1px solid var(--linha-suave); grid-template-columns: 32px 1fr; }
  .pn-cartoes { grid-template-columns: 1fr; grid-template-rows: none; }
  .pn-faixa { grid-template-columns: 1fr; }
  .pn-faixa ol { grid-template-columns: repeat(2, 1fr); gap: 10px 0; }
  .pn-faixa li + li { border-left: 0; }
  .pn-faixa li { justify-content: flex-start; }
  .pn-faixa .pn-fonte { text-align: left; }
  .pn-ctrl select { max-width: none; flex: 1; }
}
.pn-ctrl .pn-btn-txt { width: auto; height: 40px; display: inline-flex; align-items: center; gap: 6px; padding: 0 16px; border-radius: 999px; background: var(--verde); border: 1px solid var(--verde); color: #F3EFE6; text-decoration: none; font: 600 13px var(--f-texto); white-space: nowrap; cursor: pointer; }
.pn-ctrl .pn-btn-txt:hover { background: #292C28; border-color: #292C28; color: #F3EFE6; }