/* Videre · P6 · G2 · conversa e /explorar/ na linguagem 2.5 (W19, 29/09/2026).
   Especificação: _w19/visual-image25/p6/spec-P6-futurista.md §2.2 (Revisão 1) e as decisões de
   Tiago de 29/09 ~01h10–01h20 (painel de apoio sempre à vista, fundamentos e temas da resposta
   atual, pergunta anterior recolhida em "Perguntas anteriores").
   Carregado só por explorar/index.html, depois de futuro.css e antes de vivo*.css; serve também
   a janela do assistente (o mesmo /explorar/ no iframe, html.is-assistant-embedded).
   Escopo: .site-clean.tema-escuro main.explore-page (EXPL). Vence as regras W11 de style.css
   (L2875–3060) e componentes.css (L859–864, L1009–1010) por ordem e especificidade, sem editá-las.
   M7: .ex-map e o canvas de explore-space.js ficam intocáveis (só a caixa e os controles DOM).
   Movimento: só transform e opacity; hover, foco e troca de aba não animam cor, borda nem sombra.
   Todo var(--fx-*) leva reserva literal. */

/* --- CA-14 / COD-A3 · Página e colunas: o fundo #03060D do body e a camada da P5 aparecem;
   divisor luminoso (F10: linha em gradiente de 1 px e ponto ciano de 8 px) sob o cabeçalho. */
.site-clean.tema-escuro main.explore-page { background: transparent; color: #B2C0D4; }
.site-clean.tema-escuro main.explore-page .ex-layout { gap: clamp(1.25rem, 2vw, 2rem); align-items: start; }
.site-clean.tema-escuro main.explore-page .ex-heading { position: relative; }
.site-clean.tema-escuro main.explore-page .ex-heading::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1.3rem;
  height: 8px;
  pointer-events: none;
  background:
    radial-gradient(circle, #FFFFFF 0 1.5px, var(--fx-ciano, #38E8FF) 2.5px 3.5px, rgba(56, 232, 255, .35) 4px, rgba(56, 232, 255, 0) 5px) 38% 50% / 10px 8px no-repeat,
    linear-gradient(90deg, rgba(56, 232, 255, 0) 0%, rgba(91, 140, 255, .85) 8%, rgba(56, 232, 255, .75) 38%, rgba(91, 140, 255, .18) 62%, transparent 100%) 0 50% / 100% 1px no-repeat;
}
html.is-assistant-embedded .site-clean.tema-escuro main.explore-page .ex-heading::after { display: none; }

/* --- CA-01 · Cabeçalho e disponibilidade (modelo: cabeçalho de /produto/).
   R-ROTULO (F06) em todo .ex-eyebrow: mono ciano com nó luminoso estático. vivo-sinais.js não
   decodifica .ex-* (SEM_TEXTO), então o pseudo é livre. O <em> do h1 recebe a classe
   texto-gradiente (F05 de futuro.css); aqui só se zera o itálico. */
.site-clean.tema-escuro main.explore-page .ex-eyebrow {
  font: 500 .75rem/1.4 var(--fonte-mono);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--fx-ciano, #38E8FF);
}
.site-clean.tema-escuro main.explore-page .ex-eyebrow::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 .75em .1em 0;
  border-radius: 50%;
  vertical-align: middle;
  background: var(--fx-ciano, #38E8FF);
  box-shadow: 0 0 0 3px rgba(56, 232, 255, .14), 0 0 12px 2px rgba(56, 232, 255, .55);
}
.site-clean.tema-escuro main.explore-page .ex-heading h1 { color: #F6F8FC; }
.site-clean.tema-escuro main.explore-page .ex-heading h1 em { font-style: normal; }
.site-clean.tema-escuro main.explore-page .ex-intro { color: #B2C0D4; max-width: 62ch; }
/* A disponibilidade vira o chip de console do "LANÇAMENTO CONJUNTO · EM PREPARAÇÃO" de /produto/
   (.v-estado com F12): o estado (.ex-mode) é a pílula com LED; o parágrafo fica ao lado (≥ 721)
   ou embaixo (≤ 720). O LED não pisca (M21/M23): ciano se a IA está disponível, âmbar se não. */
.site-clean.tema-escuro main.explore-page .ex-connection {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .6rem 1rem;
  max-width: 40ch;
  padding: 0;
  border: 0;
}
.site-clean.tema-escuro main.explore-page .ex-mode {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  min-height: 2.25rem;
  padding: .45rem .9rem;
  border: 1px solid rgba(56, 232, 255, .35);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  box-shadow: 0 0 0 1px rgba(56, 232, 255, .18), 0 0 16px rgba(56, 232, 255, .16);
  color: var(--fx-ciano, #38E8FF);
  font: 500 .75rem/1.35 var(--fonte-mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.site-clean.tema-escuro main.explore-page .ex-mode::before {
  content: "";
  flex: none;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #93A7C2;
  box-shadow: none;
}
.site-clean.tema-escuro main.explore-page .ex-mode[data-live="true"]::before {
  background: var(--fx-ciano, #38E8FF);
  box-shadow: 0 0 0 3px rgba(56, 232, 255, .14), 0 0 12px 2px rgba(56, 232, 255, .55);
}
.site-clean.tema-escuro main.explore-page .ex-mode[data-live="false"]::before {
  background: #FFC575;
  box-shadow: 0 0 0 3px rgba(255, 197, 117, .14), 0 0 12px 2px rgba(255, 197, 117, .5);
}
.site-clean.tema-escuro main.explore-page .ex-connection p { flex: 1 1 16rem; margin: 0; color: #B2C0D4; }
/* "Verificar disponibilidade": R-PILULA pequena (borda de controle, sem transição, M44). */
.site-clean.tema-escuro main.explore-page .ex-connection [data-ex-reconnect] {
  align-items: center;
  min-height: 44px;
  padding: .35rem .9rem;
  border: 1px solid var(--fx-borda-controle, #4A7795);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  text-decoration: none;
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08));
  transition: none;
}
.site-clean.tema-escuro main.explore-page .ex-connection [data-ex-reconnect]:is(:hover, :focus-visible) { border-color: var(--fx-ciano, #38E8FF); box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22); }
@media (max-width: 720px) {
  .site-clean.tema-escuro main.explore-page .ex-connection { gap: .4rem; max-width: none; }
  .site-clean.tema-escuro main.explore-page .ex-mode { min-height: 0; padding: .3rem .7rem; }
  .site-clean.tema-escuro main.explore-page .ex-connection p { flex-basis: 100%; font-size: 13px; line-height: 1.45; }
}

/* --- CA-02 · Painel "Sua conversa" e mensagens: console de vidro com balões distintos.
   R-VIDRO + R-CANTOS (cópia do F11: 8 barras 18×2/2×18 a 10 px e 4 brilhos a 8 px), sem grade
   (ordem de Tiago de 29/09 ~04h05: "REMOVE TUDO, QUERO ESTRELAS"). Sai o border-top de 3 px da W11 (componentes.css L1009). */
.site-clean.tema-escuro main.explore-page .ex-conversation {
  --fx-canto: linear-gradient(#38E8FF, #38E8FF);
  --fx-canto-luz: linear-gradient(rgba(56, 232, 255, .18), rgba(56, 232, 255, .18));
  border: 1px solid rgba(91, 140, 255, .38);
  border-radius: 18px;
  background:
    var(--fx-canto), var(--fx-canto), var(--fx-canto), var(--fx-canto),
    var(--fx-canto), var(--fx-canto), var(--fx-canto), var(--fx-canto),
    var(--fx-canto-luz), var(--fx-canto-luz), var(--fx-canto-luz), var(--fx-canto-luz),
    var(--fx-vidro, linear-gradient(180deg, rgba(20, 45, 80, .72) 0%, rgba(7, 16, 29, .88) 100%));
  background-position:
    10px 10px, 10px 10px, calc(100% - 10px) 10px, calc(100% - 10px) 10px,
    10px calc(100% - 10px), 10px calc(100% - 10px), calc(100% - 10px) calc(100% - 10px), calc(100% - 10px) calc(100% - 10px),
    8px 8px, 8px 8px, calc(100% - 8px) calc(100% - 8px), calc(100% - 8px) calc(100% - 8px), 0 0;
  background-size:
    18px 2px, 2px 18px, 18px 2px, 2px 18px, 18px 2px, 2px 18px, 18px 2px, 2px 18px,
    22px 6px, 6px 22px, 22px 6px, 6px 22px, auto;
  background-repeat: no-repeat;
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08)), var(--fx-halo, 0 0 0 1px rgba(91, 140, 255, .10), 0 0 28px rgba(11, 92, 232, .20), 0 22px 56px rgba(0, 0, 0, .45));
}
.site-clean.tema-escuro main.explore-page .ex-conversation-heading h2 { color: #F6F8FC; }
.site-clean.tema-escuro main.explore-page .ex-transcript { scrollbar-color: rgba(56, 232, 255, .42) #03060D; }
/* Balões: o do visitante à direita, borda ciano; o da Videre à esquerda, com o filete luminoso. */
.site-clean.tema-escuro main.explore-page .ex-message--user,
.site-clean.tema-escuro main.explore-page .ex-message--assistant {
  padding: .9rem 1.1rem;
  border: 1px solid rgba(91, 140, 255, .38);
  background: var(--fx-vidro, linear-gradient(180deg, rgba(20, 45, 80, .72) 0%, rgba(7, 16, 29, .88) 100%));
  color: #B2C0D4;
}
.site-clean.tema-escuro main.explore-page .ex-message--user {
  justify-self: end;
  max-width: 85%;
  margin-left: auto;
  border-color: rgba(56, 232, 255, .45);
  border-radius: 16px 16px 4px 16px;
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08));
  color: #F6F8FC;
}
.site-clean.tema-escuro main.explore-page .ex-message--assistant {
  justify-self: start;
  border-radius: 16px 16px 16px 4px;
  box-shadow: inset 2px 0 0 rgba(56, 232, 255, .75), var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08)), 0 0 0 1px rgba(91, 140, 255, .10), 0 0 22px rgba(11, 92, 232, .16);
}
.site-clean.tema-escuro main.explore-page .ex-message + .ex-message--assistant { padding-bottom: .9rem; border-bottom: 1px solid rgba(91, 140, 255, .38); }
.site-clean.tema-escuro main.explore-page .ex-message .ex-message-label {
  font: 500 .6875rem/1.5 var(--fonte-mono);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--fx-ciano, #38E8FF);
}
.site-clean.tema-escuro main.explore-page .ex-message--assistant .ex-message-label::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 .75em .1em 0;
  border-radius: 50%;
  vertical-align: middle;
  background: var(--fx-ciano, #38E8FF);
  box-shadow: 0 0 0 3px rgba(56, 232, 255, .14), 0 0 12px 2px rgba(56, 232, 255, .55);
}
.site-clean.tema-escuro main.explore-page .ex-message--user .ex-message-label { color: #93A7C2; }
/* "Ver fundamentos": R-DETALHE compacto (+/− em ciano; texto alternativo vazio, reserva antes). */
.site-clean.tema-escuro main.explore-page .ex-message details { margin-top: .6rem; }
.site-clean.tema-escuro main.explore-page .ex-message summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  min-height: 44px;
  padding: 0;
  color: #EAF2FF;
  font: 500 .8125rem/1.4 var(--fonte-corpo);
  cursor: pointer;
}
.site-clean.tema-escuro main.explore-page .ex-message summary::-webkit-details-marker { display: none; }
.site-clean.tema-escuro main.explore-page .ex-message summary::after { content: "+"; content: "+" / ""; font: 500 1rem var(--fonte-mono); color: var(--fx-ciano, #38E8FF); }
.site-clean.tema-escuro main.explore-page .ex-message details[open] > summary::after { content: "\2212"; content: "\2212" / ""; }
/* "Recomeçar", "Ver na demonstração" e "Cancelar": R-PILULA fantasma. */
.site-clean.tema-escuro main.explore-page .ex-text-button {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: .35rem 1rem;
  border: 1px solid var(--fx-borda-controle, #4A7795);
  border-radius: 999px;
  background: transparent;
  color: #EAF2FF;
  font: 500 .8125rem/1.4 var(--fonte-corpo);
  text-decoration: none;
  box-shadow: none;
  transition: none;
}
.site-clean.tema-escuro main.explore-page .ex-text-button:is(:hover, :focus-visible) { border-color: var(--fx-ciano, #38E8FF); box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22); }
/* Entrada da mensagem: uma vez (não é laço), só com movimento livre. */
@keyframes p6-ex-entra { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
html.js .site-clean.tema-escuro main.explore-page .ex-transcript > .ex-message { animation: p6-ex-entra 220ms ease-out 1 both; }
html:is(.vivo-calmo, .vivo-parado, .vivo-quieto, .vivo-janela-aberta) .site-clean.tema-escuro main.explore-page .ex-transcript > .ex-message { animation: none !important; }
@media (prefers-reduced-motion: reduce) {
  html.js .site-clean.tema-escuro main.explore-page .ex-transcript > .ex-message { animation: none !important; }
}

/* --- CA-03 · Compositor (F14 + MOD-2): vidro interno sem cantos, campo escuro com foco em halo
   ciano (sai o anel grosso), contador de console e envio em gradiente (R-CTA, hover = repouso). */
.site-clean.tema-escuro main.explore-page .ex-composer {
  padding: 1rem;
  border: 1px solid rgba(91, 140, 255, .38);
  border-radius: 14px;
  background: var(--fx-vidro, linear-gradient(180deg, rgba(20, 45, 80, .72) 0%, rgba(7, 16, 29, .88) 100%));
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08));
}
.site-clean.tema-escuro main.explore-page .ex-composer label {
  font: 500 .75rem/1.4 var(--fonte-mono);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--fx-ciano, #38E8FF);
}
.site-clean.tema-escuro main.explore-page .ex-composer label::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 .75em .1em 0;
  border-radius: 50%;
  vertical-align: middle;
  background: var(--fx-ciano, #38E8FF);
  box-shadow: 0 0 0 3px rgba(56, 232, 255, .14), 0 0 12px 2px rgba(56, 232, 255, .55);
}
.site-clean.tema-escuro main.explore-page .ex-composer textarea {
  padding: .7rem .8rem;
  border: 1px solid var(--fx-borda-controle, #4A7795);
  border-radius: 12px;
  background: #07101D;
  color: #F6F8FC;
  /* Sem a alça cinza nativa de redimensionar (FID-P6-12); a altura mínima continua a de sempre. */
  resize: none;
}
.site-clean.tema-escuro main.explore-page .ex-composer textarea::placeholder { color: #93A7C2; }
.site-clean.tema-escuro main.explore-page .ex-conversation .ex-composer textarea:focus-visible,
.site-clean.tema-escuro main.explore-page .ex-composer textarea:focus {
  outline: 2px solid var(--fx-ciano, #38E8FF);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(56, 232, 255, .18);
}
.site-clean.tema-escuro main.explore-page .ex-composer textarea:read-only:not(:disabled) { background: #0A1422; border-color: rgba(58, 107, 176, .55); color: #B2C0D4; }
/* Durante a espera da resposta o campo fica em somente leitura e com foco: sem o cursor piscando,
   o quadro fica fixo no pausado (MOV-03, M29). */
.site-clean.tema-escuro main.explore-page #explore-question[readonly] { caret-color: transparent; }
.site-clean.tema-escuro main.explore-page .ex-composer textarea:disabled { background: #0A1422; border-color: rgba(58, 107, 176, .55); color: #B2C0D4; }
.site-clean.tema-escuro main.explore-page .ex-composer-actions > span { margin-left: auto; color: #93A7C2; font: 400 .75rem/1.5 var(--fonte-mono); font-variant-numeric: tabular-nums; text-align: right; }
.site-clean.tema-escuro main.explore-page .ex-composer-actions { justify-content: flex-end; gap: .75rem 1rem; }
.site-clean.tema-escuro main.explore-page .ex-send {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 44px;
  padding: .6rem 1.1rem;
  border: 1px solid transparent;
  border-radius: 999px;
  background:
    linear-gradient(100deg, #0746C8 0%, #0B5CE8 40%, #0A7F95 100%) padding-box,
    linear-gradient(100deg, var(--fx-cobalto-claro, #5B8CFF), var(--fx-ciano, #38E8FF)) border-box;
  color: #FFFFFF;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .30), 0 0 26px rgba(11, 92, 232, .50), 18px 0 34px -14px rgba(56, 232, 255, .45);
  transition: none;
}
.site-clean.tema-escuro main.explore-page .ex-send:hover:not(:disabled) {
  background:
    linear-gradient(100deg, #0746C8 0%, #0B5CE8 40%, #0A7F95 100%) padding-box,
    linear-gradient(100deg, var(--fx-cobalto-claro, #5B8CFF), var(--fx-ciano, #38E8FF)) border-box;
  color: #FFFFFF;
}
.site-clean.tema-escuro main.explore-page .ex-conversation .ex-send:focus-visible { outline: 0; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .30), 0 0 0 5px var(--fx-ciano, #38E8FF); }
.site-clean.tema-escuro main.explore-page .ex-send:disabled {
  /* W19q r3: desligado continua apagado, mas em vidro com luz no canto e borda em degradê (era o
     #0C192B chapado com a borda de uma cor só). */
  background:
    radial-gradient(80% 120% at 0% 0%, rgba(56, 232, 255, .12), rgba(56, 232, 255, 0) 70%) padding-box,
    linear-gradient(180deg, #13263F 0%, #0A1626 100%) padding-box,
    linear-gradient(100deg, #3A6BB0, rgba(56, 232, 255, .55)) border-box;
  color: #93A7C2;
  box-shadow: inset 0 1px 0 rgba(234, 253, 255, .08);
  opacity: 1;
}
.site-clean.tema-escuro main.explore-page :is(.ex-composer > p, .ex-privacy) { color: #93A7C2; }
.site-clean.tema-escuro main.explore-page .ex-privacy a { color: var(--fx-ciano, #38E8FF); text-decoration: underline; text-decoration-color: rgba(56, 232, 255, .55); }

/* --- CA-04 · Aguardando a resposta: três nós luminosos "digitando" (explore.js addPending()).
   Normal: 3 animações só durante a espera, 1,2 s alternado (fora de 4–6 s, M23), só opacidade.
   Calmo e reduzido (as duas vias, C2-03), pausado, quieto e janela aberta: nós parados em .35/.6/1. */
.site-clean.tema-escuro main.explore-page .ex-message--pendente { min-width: 5.5rem; padding: .85rem 1.1rem; }
.site-clean.tema-escuro main.explore-page .ex-digitando { display: inline-flex; align-items: center; gap: .55rem; height: 1.2rem; }
.site-clean.tema-escuro main.explore-page .ex-digitando i {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: radial-gradient(circle, #FFFFFF 0 1px, #9FF6FF 2px, var(--fx-ciano, #38E8FF) 3px, rgba(56, 232, 255, .45) 4px);
  box-shadow: 0 0 10px 1px rgba(56, 232, 255, .55);
  opacity: .35;
}
.site-clean.tema-escuro main.explore-page .ex-digitando i:nth-child(2) { opacity: .6; }
.site-clean.tema-escuro main.explore-page .ex-digitando i:nth-child(3) { opacity: 1; }
@keyframes p6-ex-digitando { from { opacity: .25; } to { opacity: 1; } }
html.js .site-clean.tema-escuro main.explore-page .ex-digitando i { animation: p6-ex-digitando 1.2s ease-in-out infinite alternate; }
html.js .site-clean.tema-escuro main.explore-page .ex-digitando i:nth-child(2) { animation-delay: .2s; }
html.js .site-clean.tema-escuro main.explore-page .ex-digitando i:nth-child(3) { animation-delay: .4s; }
html:is(.vivo-calmo, .vivo-parado, .vivo-quieto, .vivo-janela-aberta) .site-clean.tema-escuro main.explore-page .ex-digitando i { animation: none !important; }
@media (prefers-reduced-motion: reduce) {
  html.js .site-clean.tema-escuro main.explore-page .ex-digitando i { animation: none !important; }
}
@media (forced-colors: active) {
  .site-clean.tema-escuro main.explore-page .ex-digitando i { forced-color-adjust: none; background: CanvasText; box-shadow: none; }
}

/* --- CA-05 · Erro e indisponível: explore.js grava data-estado="erro" no aviso; ele vira a faixa
   R-ALERTA em âmbar (é aviso de disponibilidade, não falha do visitante). A região viva nunca sai
   da árvore de acessibilidade: vazia, só perde a moldura e guarda o min-height de style.css.
   Posição: a mesma order do compositor (1 sem conversa, 3 com), e a ordem do DOM (aviso depois
   do compositor, orderConversation) o põe logo abaixo dele. Sem animação: transition: none vence a
   transição curtíssima do modo calmo, que deixava a moldura atrasada um quadro. */
.site-clean.tema-escuro main.explore-page .ex-announcement { order: 1; color: #93A7C2; border: 0; padding: 0; background: none; box-shadow: none; transition: none; }
.site-clean.tema-escuro main.explore-page .has-conversation .ex-announcement { order: 3; }
.site-clean.tema-escuro main.explore-page .ex-announcement[data-estado="erro"] {
  margin-top: .75rem;
  padding: .75rem 1rem;
  border: 1px solid var(--fx-alerta-borda, rgba(255, 197, 117, .55));
  border-radius: 14px;
  background: var(--fx-vidro, linear-gradient(180deg, rgba(20, 45, 80, .72) 0%, rgba(7, 16, 29, .88) 100%));
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08)), 0 0 18px rgba(255, 197, 117, .10);
  color: #F6F8FC;
}
.site-clean.tema-escuro main.explore-page .ex-announcement[data-estado="erro"]::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 .75em .1em 0;
  border-radius: 50%;
  vertical-align: middle;
  background: var(--fx-alerta, #FFC575);
  box-shadow: 0 0 0 3px rgba(255, 197, 117, .14), 0 0 12px 2px rgba(255, 197, 117, .5);
}
/* A faixa de erro acompanha a largura do compositor e das pílulas (sem a max-width herdada da região
   viva), para a borda direita alinhar com os outros painéis de vidro da coluna. */
.site-clean.tema-escuro main.explore-page .ex-announcement[data-estado="erro"] { max-width: none; }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.explore-page .ex-announcement[data-estado="erro"] { border-color: CanvasText; box-shadow: none; }
  /* O ponto âmbar vira marcador em CanvasText: sem ele o fundo forçado a Canvas deixaria só o recuo vazio. */
  .site-clean.tema-escuro main.explore-page .ex-announcement[data-estado="erro"]::before { forced-color-adjust: none; background: CanvasText; box-shadow: none; }
}
/* Decisão de Tiago, 29/09 (S-6, item 4): "Tentar de novo" logo abaixo da faixa de erro, na mesma
   order do aviso (1 sem conversa, 3 com) e logo depois dele no DOM (explore.js cria o bloco e o põe
   em orderConversation). R-PILULA com borda ciano, para ser a ação óbvia; alvo de 44 px; foco com o
   anel ciano do envio. Indisponível (aria-disabled) enquanto a nova tentativa corre: esmaece, sem
   perder o foco. */
.site-clean.tema-escuro main.explore-page .ex-retry { order: 1; display: flex; margin: .6rem 0 .9rem; }
.site-clean.tema-escuro main.explore-page .has-conversation .ex-retry { order: 3; }
.site-clean.tema-escuro main.explore-page .ex-retry[hidden] { display: none; }
.site-clean.tema-escuro main.explore-page .ex-retry-button {
  min-height: 44px;
  padding: .5rem 1.25rem;
  border-color: var(--fx-ciano, #38E8FF);
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  font-weight: 600;
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08)), 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .18);
}
.site-clean.tema-escuro main.explore-page .ex-retry-button:hover:not([aria-disabled="true"]) { background: rgba(56, 232, 255, .12); }
.site-clean.tema-escuro main.explore-page .ex-conversation .ex-retry-button:focus-visible { outline: 0; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .30), 0 0 0 4px var(--fx-ciano, #38E8FF); }
.site-clean.tema-escuro main.explore-page .ex-retry-button[aria-disabled="true"] { opacity: .55; cursor: progress; box-shadow: none; }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.explore-page .ex-retry-button { border-color: ButtonText; box-shadow: none; }
  /* Mesma especificidade da regra de foco comum (com .ex-conversation) e depois dela: em cores forçadas o
     box-shadow some, e sem isto o outline: 0 da regra comum deixava o botão sem indicador de foco. */
  .site-clean.tema-escuro main.explore-page .ex-conversation .ex-retry-button:focus-visible { outline: 2px solid Highlight; outline-offset: 2px; }
  .site-clean.tema-escuro main.explore-page .ex-retry-button[aria-disabled="true"] { border-color: GrayText; color: GrayText; opacity: 1; }
}

/* --- CA-06 · Percursos guiados e continuações: pílulas de console (R-PILULA, raio 14 px) com a
   seta ciano e o nó à direita; a escolhida tem borda ciano e o halo forte (não o gradiente, para
   não competir com o envio). A seta só se desloca no hover com ponteiro fino (transform, 180 ms). */
.site-clean.tema-escuro main.explore-page .ex-prompts-label { margin-top: .5rem; }
.site-clean.tema-escuro main.explore-page .ex-prompts { gap: .6rem; }
.site-clean.tema-escuro main.explore-page .ex-prompts button,
.site-clean.tema-escuro main.explore-page .ex-followups button {
  min-height: 44px;
  border: 1px solid var(--fx-borda-controle, #4A7795);
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08));
  transition: none;
}
.site-clean.tema-escuro main.explore-page .ex-prompts button {
  width: 100%;
  padding: .7rem 1rem;
  border-radius: 14px;
  text-align: left;
}
.site-clean.tema-escuro main.explore-page .ex-followups button { padding: .5rem 1rem; border-radius: 999px; }
.site-clean.tema-escuro main.explore-page .ex-prompts button > span:last-child {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  color: var(--fx-ciano, #38E8FF);
  transition: transform 180ms var(--fx-ease-sai, cubic-bezier(.2, .7, .3, 1));
}
.site-clean.tema-escuro main.explore-page .ex-prompts button > span:last-child::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--fx-ciano, #38E8FF);
  box-shadow: 0 0 0 3px rgba(56, 232, 255, .14), 0 0 10px 1px rgba(56, 232, 255, .5);
}
.site-clean.tema-escuro main.explore-page :is(.ex-prompts, .ex-followups) button:is(:hover, :focus-visible) { background: var(--luz-chip-denso, rgba(4, 16, 29, .85)); border-color: var(--fx-ciano, #38E8FF); color: #FFFFFF; box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22); }
.site-clean.tema-escuro main.explore-page .ex-prompts button[aria-pressed="true"] {
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  border-color: var(--fx-ciano, #38E8FF);
  color: #FFFFFF;
  box-shadow: var(--fx-halo-forte, 0 0 0 1px rgba(56, 232, 255, .35), 0 0 34px rgba(56, 232, 255, .18), 0 22px 56px rgba(0, 0, 0, .45));
}
@media (hover: hover) and (pointer: fine) {
  .site-clean.tema-escuro main.explore-page .ex-prompts button:hover > span:last-child { transform: translate(2px, -2px); }
}
html:is(.vivo-calmo, .vivo-parado, .vivo-quieto) .site-clean.tema-escuro main.explore-page .ex-prompts button > span:last-child { transition: none; }
@media (prefers-reduced-motion: reduce) {
  .site-clean.tema-escuro main.explore-page .ex-prompts button > span:last-child { transition: none; }
}
@media (forced-colors: active) {
  .site-clean.tema-escuro main.explore-page :is(.ex-prompts, .ex-followups) button { border-color: ButtonText; box-shadow: none; }
  .site-clean.tema-escuro main.explore-page .ex-prompts button[aria-pressed="true"] { forced-color-adjust: none; border: 1px solid Highlight; background: Highlight; color: HighlightText; }
}

/* --- CA-07 · Palco "Em apoio à conversa": vidro com cantoneiras (sai o radial #153451→#0a1728);
   abas em pílulas soltas (R-ABAS, sem trilho nem filete; a ativa é a pílula ativa da Home);
   dossiês em cartões compactos com o número mono ciano e o nó; limite com traço âmbar. */
.site-clean.tema-escuro main.explore-page .ex-stage {
  --fx-canto: linear-gradient(#38E8FF, #38E8FF);
  --fx-canto-luz: linear-gradient(rgba(56, 232, 255, .18), rgba(56, 232, 255, .18));
  border: 1px solid rgba(91, 140, 255, .38);
  border-radius: 18px;
  background:
    var(--fx-canto), var(--fx-canto), var(--fx-canto), var(--fx-canto),
    var(--fx-canto), var(--fx-canto), var(--fx-canto), var(--fx-canto),
    var(--fx-canto-luz), var(--fx-canto-luz), var(--fx-canto-luz), var(--fx-canto-luz),
    var(--fx-vidro, linear-gradient(180deg, rgba(20, 45, 80, .72) 0%, rgba(7, 16, 29, .88) 100%));
  background-position:
    10px 10px, 10px 10px, calc(100% - 10px) 10px, calc(100% - 10px) 10px,
    10px calc(100% - 10px), 10px calc(100% - 10px), calc(100% - 10px) calc(100% - 10px), calc(100% - 10px) calc(100% - 10px),
    8px 8px, 8px 8px, calc(100% - 8px) calc(100% - 8px), calc(100% - 8px) calc(100% - 8px), 0 0;
  background-size:
    18px 2px, 2px 18px, 18px 2px, 2px 18px, 18px 2px, 2px 18px, 18px 2px, 2px 18px,
    22px 6px, 6px 22px, 22px 6px, 6px 22px, auto;
  background-repeat: no-repeat;
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08)), var(--fx-halo, 0 0 0 1px rgba(91, 140, 255, .10), 0 0 28px rgba(11, 92, 232, .20), 0 22px 56px rgba(0, 0, 0, .45));
}
.site-clean.tema-escuro main.explore-page .ex-stage-heading h2 { color: #F6F8FC; }
.site-clean.tema-escuro main.explore-page .ex-view-controls { display: flex; flex-wrap: wrap; gap: .75rem; padding: 0; border: 0; background: none; }
.site-clean.tema-escuro main.explore-page .ex-view-controls button {
  min-height: 44px;
  padding: .5rem 1rem;
  border: 1px solid var(--fx-borda-controle, #4A7795);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  font: 500 .75rem/1.4 var(--fonte-mono);
  letter-spacing: .08em;
  text-transform: uppercase;
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08));
  transition: none;
}
.site-clean.tema-escuro main.explore-page .ex-view-controls button:is(:hover, :focus-visible) { border-color: var(--fx-ciano, #38E8FF); color: #FFFFFF; box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22); }
/* Vista ativa (W19v, regra de Tiago "nenhum quadro com cor sólida"): era o degradê opaco azul → violeta.
   Passa ao vidro aceso, igual à aba ativa de /experiencias/: luz no canto de cima, borda acesa nos 4 lados
   (mais viva no topo), anel de luz por dentro e halo. W19v r2: mais o marcador de 2 px embaixo (o da aba ativa de /experiencias/) e um vidro mais claro que o das inativas. Mesma borda de 1 px; estático. */
.site-clean.tema-escuro main.explore-page .ex-view-controls button[aria-pressed="true"] {
  border: 1px solid;
  border-color: var(--luz-borda-acesa, #38E8FF rgba(56, 232, 255, .62) rgba(91, 140, 255, .55) rgba(56, 232, 255, .62));
  background:
    radial-gradient(90% 150% at 0% 0%, rgba(56, 232, 255, .30), rgba(56, 232, 255, 0) 72%) 0 0 / 100% 100% no-repeat,
    radial-gradient(70% 130% at 100% 100%, rgba(11, 92, 232, .24), rgba(11, 92, 232, 0) 70%) 0 0 / 100% 100% no-repeat,
    linear-gradient(180deg, rgba(38, 96, 176, .88) 0%, rgba(16, 48, 98, .90) 100%);
  color: #FFFFFF;
  box-shadow: inset 0 -2px 0 #38E8FF, inset 0 0 0 1px rgba(56, 232, 255, .30), var(--luz-halo-leve-aceso, inset 0 1px 0 rgba(234, 253, 255, .14), 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .26));
}
.site-clean.tema-escuro main.explore-page .ex-explanation { padding-top: 1.5rem; border-top: 0; }
.site-clean.tema-escuro main.explore-page .ex-explanation h3,
.site-clean.tema-escuro main.explore-page .ex-comparison h3 { color: #F6F8FC; }
.site-clean.tema-escuro main.explore-page :is(.ex-explanation, .ex-comparison) p { color: #B2C0D4; }
.site-clean.tema-escuro main.explore-page .ex-comparison { display: grid; gap: .75rem; }
/* Integração P6: a nota de abertura da aba Dossiês encostava nas pílulas (4 px de texto a texto);
   fica com a mesma folga da aba Caso Maralto (~19 px). */
.site-clean.tema-escuro main.explore-page .ex-comparison > .ex-stage-note:first-child { margin-top: .9rem; }
.site-clean.tema-escuro main.explore-page .ex-comparison article {
  gap: 1rem;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(91, 140, 255, .38);
  border-radius: 14px;
  background: var(--fx-vidro, linear-gradient(180deg, rgba(20, 45, 80, .72) 0%, rgba(7, 16, 29, .88) 100%));
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08)), 0 0 0 1px rgba(91, 140, 255, .10), 0 0 18px rgba(11, 92, 232, .16);
}
.site-clean.tema-escuro main.explore-page .ex-step-number {
  display: inline-flex;
  align-items: flex-start;
  gap: .5rem;
  padding-top: 0;
  color: var(--fx-ciano, #38E8FF);
  font: 500 1.25rem/1.2 var(--fonte-mono);
}
.site-clean.tema-escuro main.explore-page .ex-step-number::before {
  content: "";
  flex: none;
  width: 7px;
  height: 7px;
  margin-top: .5rem;
  border-radius: 50%;
  background: var(--fx-ciano, #38E8FF);
  box-shadow: 0 0 0 3px rgba(56, 232, 255, .14), 0 0 12px 2px rgba(56, 232, 255, .55);
}
.site-clean.tema-escuro main.explore-page .ex-comparison p.ex-limit { padding-left: .75rem; border-left: 2px solid var(--fx-alerta, #FFC575); color: #93A7C2; }
.site-clean.tema-escuro main.explore-page .ex-stage-note { color: #93A7C2; }
.site-clean.tema-escuro main.explore-page .ex-source-link,
.site-clean.tema-escuro main.explore-page .ex-explanation a { color: var(--fx-ciano, #38E8FF); text-decoration-color: rgba(56, 232, 255, .55); }
.site-clean.tema-escuro main.explore-page .ex-source-link::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 .6em .1em 0;
  border-radius: 50%;
  vertical-align: middle;
  background: var(--fx-ciano, #38E8FF);
  box-shadow: 0 0 0 3px rgba(56, 232, 255, .14), 0 0 10px 1px rgba(56, 232, 255, .5);
}
@media (forced-colors: active) {
  .site-clean.tema-escuro main.explore-page :is(.ex-conversation, .ex-stage) { background-image: none; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.explore-page .ex-view-controls button { border-color: ButtonText; box-shadow: none; }
  .site-clean.tema-escuro main.explore-page .ex-view-controls button[aria-pressed="true"] { forced-color-adjust: none; border: 1px solid Highlight; background: Highlight; color: HighlightText; box-shadow: none; }
  .site-clean.tema-escuro main.explore-page .ex-comparison article { border-color: CanvasText; box-shadow: none; }
}

/* --- CA-08 · Caso Maralto no palco: linha do tempo de nós (F08 na horizontal). A linha de 2 px em
   gradiente corre por trás das pílulas (que têm fundo opaco) e aparece entre elas; cada pílula
   leva o nó com borda ciano; a etapa ativa tem o halo forte. Documentos em pílula-fonte, listas
   com o ponto luminoso do F09 e a entrada do caso em cartão de vidro com cantoneiras. */
.site-clean.tema-escuro main.explore-page .ex-case-label {
  font: 500 .75rem/1.4 var(--fonte-mono);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--fx-ciano, #38E8FF);
}
.site-clean.tema-escuro main.explore-page .ex-case-label::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 .75em .1em 0;
  border-radius: 50%;
  vertical-align: middle;
  background: var(--fx-ciano, #38E8FF);
  box-shadow: 0 0 0 3px rgba(56, 232, 255, .14), 0 0 12px 2px rgba(56, 232, 255, .55);
}
.site-clean.tema-escuro main.explore-page .ex-case-steps {
  gap: .75rem 1.25rem;
  width: fit-content;
  max-width: 100%;
  background: linear-gradient(90deg, rgba(56, 232, 255, .75), rgba(91, 140, 255, .55)) 0 21px / 100% 2px no-repeat;
}
/* Linha do tempo estreita (integração da P6): quando as três etapas não cabem numa linha (~27 rem,
   celular e janela do assistente estreita), a terceira quebrava e o filete da primeira linha ficava
   solto até a borda. Abaixo de 28 rem de largura do caso, as etapas empilham com o filete vertical
   passando pelos nós (x = recuo da pílula + metade do nó). */
.site-clean.tema-escuro main.explore-page .ex-case { container-type: inline-size; }
@container (max-width: 28rem) {
  .site-clean.tema-escuro main.explore-page .ex-case-steps {
    flex-direction: column;
    align-items: flex-start;
    background: linear-gradient(180deg, rgba(56, 232, 255, .75), rgba(91, 140, 255, .55)) calc(.7rem + 6px) 22px / 2px calc(100% - 44px) no-repeat;
  }
}
.site-clean.tema-escuro main.explore-page .ex-case-steps button {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  min-height: 44px;
  padding: .45rem 1rem .45rem .7rem;
  border: 1px solid var(--fx-borda-controle, #4A7795);
  border-radius: 999px;
  background: #07101D;
  color: #EAF2FF;
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08));
  transition: none;
}
.site-clean.tema-escuro main.explore-page .ex-case-steps button::before {
  content: "";
  flex: none;
  box-sizing: border-box;
  width: 12px;
  height: 12px;
  border: 2px solid rgba(56, 232, 255, .75);
  border-radius: 50%;
  background: #07101D;
}
.site-clean.tema-escuro main.explore-page .ex-case-steps button:is(:hover, :focus-visible) { border-color: var(--fx-ciano, #38E8FF); box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22); }
.site-clean.tema-escuro main.explore-page .ex-case-steps button[aria-pressed="true"] {
  border-color: var(--fx-ciano, #38E8FF);
  color: #FFFFFF;
  background: #07101D;
  box-shadow: var(--fx-halo-forte, 0 0 0 1px rgba(56, 232, 255, .35), 0 0 34px rgba(56, 232, 255, .18), 0 22px 56px rgba(0, 0, 0, .45));
}
.site-clean.tema-escuro main.explore-page .ex-case-steps button[aria-pressed="true"]::before { background: var(--fx-ciano, #38E8FF); box-shadow: 0 0 10px 2px rgba(56, 232, 255, .6); }
.site-clean.tema-escuro main.explore-page .ex-case h3 { color: #F6F8FC; }
.site-clean.tema-escuro main.explore-page .ex-case p { color: #B2C0D4; }
.site-clean.tema-escuro main.explore-page .ex-case ul { list-style: none; padding-left: 0; }
.site-clean.tema-escuro main.explore-page .ex-case li { position: relative; padding-left: 1.4rem; color: #D8E2F0; }
.site-clean.tema-escuro main.explore-page .ex-case li::before {
  content: "";
  position: absolute;
  left: .2rem;
  top: .6em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--fx-ciano, #38E8FF);
  box-shadow: 0 0 0 3px rgba(56, 232, 255, .14), 0 0 10px 1px rgba(56, 232, 255, .5);
}
.site-clean.tema-escuro main.explore-page [data-ex-case-content] a {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  min-height: 44px;
  padding: .4rem 1rem;
  border: 1px solid var(--fx-borda-controle, #4A7795);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  text-decoration: none;
  transition: none;
}
.site-clean.tema-escuro main.explore-page [data-ex-case-content] a::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--fx-ciano, #38E8FF);
  box-shadow: 0 0 0 3px rgba(56, 232, 255, .14), 0 0 10px 1px rgba(56, 232, 255, .5);
}
.site-clean.tema-escuro main.explore-page [data-ex-case-content] a:is(:hover, :focus-visible) { border-color: var(--fx-ciano, #38E8FF); box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22); }
.site-clean.tema-escuro main.explore-page .ex-case-entry {
  --fx-canto: linear-gradient(#38E8FF, #38E8FF);
  --fx-canto-luz: linear-gradient(rgba(56, 232, 255, .18), rgba(56, 232, 255, .18));
  padding: 1.4rem 1.5rem;
  border: 1px solid rgba(91, 140, 255, .38);
  border-radius: 18px;
  background:
    var(--fx-canto), var(--fx-canto), var(--fx-canto), var(--fx-canto),
    var(--fx-canto), var(--fx-canto), var(--fx-canto), var(--fx-canto),
    var(--fx-canto-luz), var(--fx-canto-luz), var(--fx-canto-luz), var(--fx-canto-luz),
    var(--fx-vidro, linear-gradient(180deg, rgba(20, 45, 80, .72) 0%, rgba(7, 16, 29, .88) 100%));
  background-position:
    10px 10px, 10px 10px, calc(100% - 10px) 10px, calc(100% - 10px) 10px,
    10px calc(100% - 10px), 10px calc(100% - 10px), calc(100% - 10px) calc(100% - 10px), calc(100% - 10px) calc(100% - 10px),
    8px 8px, 8px 8px, calc(100% - 8px) calc(100% - 8px), calc(100% - 8px) calc(100% - 8px), 0 0;
  background-size:
    18px 2px, 2px 18px, 18px 2px, 2px 18px, 18px 2px, 2px 18px, 18px 2px, 2px 18px,
    22px 6px, 6px 22px, 22px 6px, 6px 22px, auto;
  background-repeat: no-repeat;
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08)), var(--fx-halo, 0 0 0 1px rgba(91, 140, 255, .10), 0 0 28px rgba(11, 92, 232, .20), 0 22px 56px rgba(0, 0, 0, .45));
}
.site-clean.tema-escuro main.explore-page .ex-case-entry strong { color: #F6F8FC; }
.site-clean.tema-escuro main.explore-page .ex-case-entry strong > span { color: var(--fx-ciano, #38E8FF); }
.site-clean.tema-escuro main.explore-page .ex-case-entry > span:last-child { color: #B2C0D4; }
.site-clean.tema-escuro main.explore-page .ex-case-entry:is(:hover, :focus-visible) { border-color: var(--fx-ciano, #38E8FF); }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.explore-page .ex-case-steps { background: none; }
  .site-clean.tema-escuro main.explore-page .ex-case-steps button { border-color: ButtonText; box-shadow: none; }
  .site-clean.tema-escuro main.explore-page .ex-case-steps button[aria-pressed="true"] { forced-color-adjust: none; border: 1px solid Highlight; background: Highlight; color: HighlightText; }
  .site-clean.tema-escuro main.explore-page .ex-case-steps button::before { forced-color-adjust: none; border-color: CanvasText; background: Canvas; box-shadow: none; }
  .site-clean.tema-escuro main.explore-page .ex-case-entry { background-image: none; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.explore-page [data-ex-case-content] a { border-color: LinkText; }
}


/* --- CA-09 · Mapa dos temas fora do palco (M7): o details vira R-DETALHE (o ✧ fica, em ciano) e,
   aberto, a moldura de console (R-CONSOLE-PALCO) no próprio details: colchetes com halo no
   ::before, que só pinta as quinas da calha de 22 px, e o cabeçalho de console no summary (texto
   #C8F6FF, "• • •" pintado à direita, divisória recuada com o ponto de luz). O .ex-map só ganha
   borda e raio (geometria); controles DOM do palco com estilo estático, sem transição. */
.site-clean.tema-escuro main.explore-page .ex-map-disclosure { position: relative; margin-top: 1.5rem; padding-top: 0; border-top: 0; border-radius: 18px; }
.site-clean.tema-escuro main.explore-page .ex-map-disclosure > summary {
  list-style: none;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 44px;
  padding: .5rem 0;
  border-top: 1px solid rgba(91, 140, 255, .38);
  border-bottom: 1px solid rgba(91, 140, 255, .38);
  color: #EAF2FF;
  cursor: pointer;
}
.site-clean.tema-escuro main.explore-page .ex-map-disclosure > summary::-webkit-details-marker { display: none; }
.site-clean.tema-escuro main.explore-page .ex-map-disclosure > summary span { color: var(--fx-ciano, #38E8FF); }
.site-clean.tema-escuro main.explore-page .ex-map-disclosure[open] {
  padding: 0 22px 22px;
  border: 1px solid rgba(91, 140, 255, .30);
  background: #03060D;
  box-shadow: 0 0 0 1px rgba(91, 140, 255, .10), 0 0 28px rgba(11, 92, 232, .20);
}
.site-clean.tema-escuro main.explore-page .ex-map-disclosure[open]::before {
  content: "";
  position: absolute;
  inset: 8px;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(var(--fx-ciano, #38E8FF), var(--fx-ciano, #38E8FF)) left top / 16px 2px no-repeat,
    linear-gradient(var(--fx-ciano, #38E8FF), var(--fx-ciano, #38E8FF)) left top / 2px 16px no-repeat,
    linear-gradient(var(--fx-ciano, #38E8FF), var(--fx-ciano, #38E8FF)) right top / 16px 2px no-repeat,
    linear-gradient(var(--fx-ciano, #38E8FF), var(--fx-ciano, #38E8FF)) right top / 2px 16px no-repeat,
    linear-gradient(var(--fx-ciano, #38E8FF), var(--fx-ciano, #38E8FF)) left bottom / 16px 2px no-repeat,
    linear-gradient(var(--fx-ciano, #38E8FF), var(--fx-ciano, #38E8FF)) left bottom / 2px 16px no-repeat,
    linear-gradient(var(--fx-ciano, #38E8FF), var(--fx-ciano, #38E8FF)) right bottom / 16px 2px no-repeat,
    linear-gradient(var(--fx-ciano, #38E8FF), var(--fx-ciano, #38E8FF)) right bottom / 2px 16px no-repeat,
    linear-gradient(180deg, rgba(56, 232, 255, .22), rgba(56, 232, 255, 0)) left 0 top 2px / 22px 6px no-repeat,
    linear-gradient(90deg, rgba(56, 232, 255, .22), rgba(56, 232, 255, 0)) left 2px top 0 / 6px 22px no-repeat,
    linear-gradient(180deg, rgba(56, 232, 255, .22), rgba(56, 232, 255, 0)) right 0 top 2px / 22px 6px no-repeat,
    linear-gradient(270deg, rgba(56, 232, 255, .22), rgba(56, 232, 255, 0)) right 2px top 0 / 6px 22px no-repeat,
    linear-gradient(0deg, rgba(56, 232, 255, .22), rgba(56, 232, 255, 0)) left 0 bottom 2px / 22px 6px no-repeat,
    linear-gradient(90deg, rgba(56, 232, 255, .22), rgba(56, 232, 255, 0)) left 2px bottom 0 / 6px 22px no-repeat,
    linear-gradient(0deg, rgba(56, 232, 255, .22), rgba(56, 232, 255, 0)) right 0 bottom 2px / 22px 6px no-repeat,
    linear-gradient(270deg, rgba(56, 232, 255, .22), rgba(56, 232, 255, 0)) right 2px bottom 0 / 6px 22px no-repeat;
}
.site-clean.tema-escuro main.explore-page .ex-map-disclosure[open] > summary {
  z-index: 1;
  margin-bottom: .9rem;
  padding: .9rem 4.5rem .9rem 0;
  border-top: 0;
  border-bottom: 0;
  color: #C8F6FF;
}
.site-clean.tema-escuro main.explore-page .ex-map-disclosure[open] > summary::after {
  content: "";
  position: absolute;
  right: 2.25rem;
  top: 50%;
  width: 34px;
  height: 10px;
  margin-top: -5px;
  pointer-events: none;
  background: radial-gradient(circle, var(--fx-branco-luz, #EAFDFF) 0 1.5px, var(--fx-ciano, #38E8FF) 2.2px 2.8px, rgba(56, 232, 255, .35) 3.4px, rgba(56, 232, 255, 0) 5px) 0 0 / 12px 10px repeat-x;
}
.site-clean.tema-escuro main.explore-page .ex-map-disclosure[open] > summary::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 6px;
  margin-bottom: -3px;
  pointer-events: none;
  background:
    radial-gradient(circle, #FFFFFF 0 1px, var(--fx-ciano, #38E8FF) 2px, rgba(56, 232, 255, 0) 3px) 50% 50% / 6px 6px no-repeat,
    linear-gradient(90deg, rgba(56, 232, 255, 0), rgba(56, 232, 255, .55) 50%, rgba(56, 232, 255, 0)) 0 50% / 100% 1px no-repeat;
}
.site-clean.tema-escuro main.explore-page .ex-map-disclosure[open] > :not(summary) { position: relative; z-index: 1; }
/* FID-P6-05: dentro do painel de apoio (.ex-stage, que já tem as cantoneiras dele) os colchetes do
   details aberto e os do cartão "Prefere ver na prática?" saem; ficam a borda de 1 px e o halo.
   Um console dentro do outro dobrava os "L" nas quinas e poluía o painel. */
.site-clean.tema-escuro main.explore-page .ex-stage .ex-map-disclosure[open]::before { display: none; }
/* No cartão, as 12 camadas das cantoneiras ficam com tamanho zero (o vidro continua); :where()
   mantém a força da regra base, para os modos de cores forçadas, transparência reduzida e
   impressão continuarem valendo. */
.site-clean.tema-escuro main.explore-page :where(.ex-stage) .ex-case-entry {
  background-size: 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, auto;
}
.site-clean.tema-escuro main.explore-page .ex-map { border: 1px solid rgba(91, 140, 255, .38); border-radius: 14px; }
.site-clean.tema-escuro main.explore-page .ex-map-disclosure[open] .ex-map.is-space-ready { margin-inline: 0; }
.site-clean.tema-escuro main.explore-page .ex-map .map-tools button {
  min-height: 44px;
  padding: .5rem 1rem;
  border: 1px solid var(--fx-borda-controle, #4A7795);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08));
  transition: none;
}
.site-clean.tema-escuro main.explore-page .ex-map .map-tools button:is(:hover, :focus-visible) { border-color: var(--fx-ciano, #38E8FF); box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22); }
.site-clean.tema-escuro main.explore-page .ex-map .map-tools button[aria-pressed="true"] { border-color: var(--fx-ciano, #38E8FF); background: var(--luz-chip-denso, rgba(4, 16, 29, .85)); color: #FFFFFF; }
.site-clean.tema-escuro main.explore-page .ex-map .map-stage__hint { color: #93A7C2; font: 500 .75rem/1.4 var(--fonte-mono); letter-spacing: .06em; }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.explore-page .ex-map-disclosure[open]::before,
  .site-clean.tema-escuro main.explore-page .ex-map-disclosure[open] > summary::before,
  .site-clean.tema-escuro main.explore-page .ex-map-disclosure[open] > summary::after { display: none; }
  .site-clean.tema-escuro main.explore-page .ex-map-disclosure[open] { border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.explore-page .ex-map .map-tools button { border-color: ButtonText; box-shadow: none; }
}

/* --- P6-AS-01 / EX-08 · A conversa dentro da janela do assistente (o mesmo /explorar/ no iframe):
   o mesmo desenho, compacto. Sobrepõe as regras .is-assistant-embedded de style.css L3102–3105
   (o fundo var(--cor-papel-escuro), a borda inferior antiga do estado e o palco sem moldura). */
html.is-assistant-embedded .site-clean.tema-escuro main.explore-page {
  /* Sem grade (ordem de Tiago de 29/09 ~04h05): o main fica transparente para o fundo de estrelas
     (.fundo-espaco, raia FUNDO) aparecer atrás dos painéis; sem JS, o body do iframe (#010309)
     mantém o espaço escuro. Correção FID-P6-01/F1. */
  background: transparent;
}
html.is-assistant-embedded .site-clean.tema-escuro main.explore-page .ex-shell { padding: 1.25rem; }
html.is-assistant-embedded .site-clean.tema-escuro main.explore-page .ex-connection { max-width: none; margin: 0 0 1rem; padding: 0; border: 0; }
html.is-assistant-embedded .site-clean.tema-escuro main.explore-page .ex-page-context {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  align-self: flex-start;
  width: fit-content;
  max-width: 100%;
  min-height: 2.25rem;
  margin: 0 0 1rem;
  padding: .4rem .95rem;
  border: 1px solid var(--fx-borda-controle, #4A7795);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08));
}
html.is-assistant-embedded .site-clean.tema-escuro main.explore-page .ex-page-context[hidden] { display: none; }
html.is-assistant-embedded .site-clean.tema-escuro main.explore-page .ex-page-context::before {
  content: "";
  flex: none;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--fx-ciano, #38E8FF);
  box-shadow: 0 0 0 3px rgba(56, 232, 255, .14), 0 0 12px 2px rgba(56, 232, 255, .55);
}
/* Folga para as cantoneiras (braços de 18 px a 10 px da borda): o texto e as pílulas não encostam
   nelas, nem no fim da rolagem do painel (integração da P6). */
html.is-assistant-embedded .site-clean.tema-escuro main.explore-page .ex-stage { padding: 1.75rem 1.5rem; }
@media (max-width: 720px) {
  html.is-assistant-embedded .site-clean.tema-escuro main.explore-page .ex-shell { padding: .75rem; }
  .site-clean.tema-escuro main.explore-page :is(.ex-conversation, .ex-stage) { padding: 1.75rem 1.25rem; }
}
/* Coluna única (até 780 px): 32 px em cima e embaixo, para o conteúdo não tocar a ponta do brilho
   das cantoneiras (de 8 a 30 px de cada quina; FID-P6-03/FID-P6-05). */
@media (max-width: 780px) {
  .site-clean.tema-escuro main.explore-page :is(.ex-conversation, .ex-stage),
  html.is-assistant-embedded .site-clean.tema-escuro main.explore-page .ex-stage { padding-block: 2rem; }
}
@media (forced-colors: active) {
  html.is-assistant-embedded .site-clean.tema-escuro main.explore-page { background: Canvas; }
  html.is-assistant-embedded .site-clean.tema-escuro main.explore-page .ex-page-context { border-color: CanvasText; box-shadow: none; }
}

/* --- Links e noscript (revisão C1-13): links ciano da P5 (saem o #9dccff de style.css L2906 e o
   --cor-marca de L3034; especificidade baixa por :where, para as pílulas manterem o próprio
   desenho) e o bloco sem JavaScript em vidro, com texto claro. */
.site-clean.tema-escuro main.explore-page :where(.ex-message, .ex-stage, .ex-noscript, .ex-conversation) a { color: var(--fx-ciano, #38E8FF); text-decoration-color: rgba(56, 232, 255, .55); }
.site-clean.tema-escuro main.explore-page .ex-noscript {
  margin-top: 2rem;
  padding: 1.5rem 1.75rem;
  border: 1px solid rgba(91, 140, 255, .38);
  border-radius: 18px;
  background: var(--fx-vidro, linear-gradient(180deg, rgba(20, 45, 80, .72) 0%, rgba(7, 16, 29, .88) 100%));
  box-shadow: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08)), var(--fx-halo, 0 0 0 1px rgba(91, 140, 255, .10), 0 0 28px rgba(11, 92, 232, .20), 0 22px 56px rgba(0, 0, 0, .45));
  color: #B2C0D4;
}
.site-clean.tema-escuro main.explore-page .ex-noscript h2 { color: #F6F8FC; }
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.explore-page :is(.ex-conversation, .ex-stage, .ex-case-entry) { background-image: none; background-color: #0C192B; }
  .site-clean.tema-escuro main.explore-page :is(.ex-message--user, .ex-message--assistant, .ex-composer, .ex-comparison article, .ex-noscript, .ex-announcement[data-estado="erro"]) { background: #0C192B; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.explore-page :is(.ex-conversation, .ex-stage, .ex-case-entry, .ex-noscript, .ex-comparison article) { border-color: #6F8FB0; box-shadow: none; }
  .site-clean.tema-escuro main.explore-page :is(.ex-text-button, .ex-prompts button, .ex-followups button, .ex-view-controls button, .ex-case-steps button, .ex-composer textarea, .ex-map .map-tools button) { border-color: #5B8CFF; box-shadow: none; }
  /* "Tentar de novo" continua a ação óbvia com mais contraste: borda ciano de 2 px, sem halo (a regra
     acima, mais específica que a do botão, o igualaria às outras pílulas; este seletor a vence). */
  .site-clean.tema-escuro main.explore-page .ex-conversation .ex-retry .ex-retry-button { border-color: var(--fx-ciano, #38E8FF); border-width: 2px; }
  /* W19v: a vista ativa fica com a borda ciano e um anel por dentro (a regra acima a igualaria às outras). */
  .site-clean.tema-escuro main.explore-page .ex-view-controls button[aria-pressed="true"] { border-color: #38E8FF; box-shadow: inset 0 -2px 0 #38E8FF, inset 0 0 0 1px #38E8FF; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.explore-page .ex-view-controls button[aria-pressed="true"] { background: #1D4A85; }
}
@media (forced-colors: active) {
  .site-clean.tema-escuro main.explore-page .ex-noscript { border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.explore-page .ex-heading::after,
  .site-clean.tema-escuro main.explore-page .ex-case-steps button::after { display: none; }
}
/* Impressão: fundo branco, texto preto, painéis com filete fino; decoração e indicador fora. */
@media print {
  .site-clean.tema-escuro main.explore-page,
  .site-clean.tema-escuro main.explore-page :is(.ex-conversation, .ex-stage, .ex-message--user, .ex-message--assistant, .ex-composer, .ex-comparison article, .ex-case-entry, .ex-noscript, .ex-announcement[data-estado="erro"]) {
    background: #FFFFFF; color: #000000; border-color: #999999; box-shadow: none;
  }
  .site-clean.tema-escuro main.explore-page :is(h1, h2, h3, p, li, strong, .ex-eyebrow, .ex-message-label, .ex-case-label, .ex-mode) { color: #000000; }
  .site-clean.tema-escuro main.explore-page a { color: #000000; }
  .site-clean.tema-escuro main.explore-page .ex-message--pendente { display: none; }
  .site-clean.tema-escuro main.explore-page .ex-heading::after,
  .site-clean.tema-escuro main.explore-page .ex-eyebrow::before,
  .site-clean.tema-escuro main.explore-page .ex-mode::before,
  .site-clean.tema-escuro main.explore-page .ex-map-disclosure::before { display: none; }
}

/* --- Decisão de Tiago, 29/09 ~01h10–01h20 (a): o painel "Em apoio à conversa" fica FIXO ao lado da
   conversa no computador, sempre à vista, com rolagem própria e altura máxima da janela. Causa
   medida: na segunda pergunta a página do iframe rolava ~830 px e o painel de 1.268 px saía pelo
   alto (y = −801). Vale na página e dentro da janela do assistente (?assistente=1), onde o
   cabeçalho do site não existe. As cantoneiras são fundo do próprio painel e ficam nas quinas.
   FID-P6-03: quem rola é o filho .ex-stage-rolagem, não o painel. O painel fica com a moldura
   (vidro, borda, cantoneiras) e o recuo de 32 px em cima e embaixo e de 28 px ou mais dos lados,
   fora da área que rola: o conteúdo rolado some antes das quinas (cantoneiras de 8 a 30 px) e
   nunca passa por baixo nem por cima delas. A folga de 6 px dos lados da área que rola guarda o
   anel de foco dos controles da borda. */
@media (min-width: 781px) {
  .site-clean.tema-escuro main.explore-page .ex-layout { align-items: start; }
  .site-clean.tema-escuro main.explore-page .ex-stage {
    position: sticky;
    top: 6.5rem;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 7.5rem);
    max-height: calc(100dvh - 7.5rem);
    padding: 2rem max(1.75rem, var(--fluido-pad, 1.75rem));
    overflow: hidden;
  }
  .site-clean.tema-escuro main.explore-page .ex-stage-rolagem {
    flex: 1 1 auto;
    min-height: 0;
    margin-inline: -6px;
    padding-inline: 6px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(56, 232, 255, .42) #03060D;
  }
  html.is-assistant-embedded .site-clean.tema-escuro main.explore-page .ex-stage {
    top: 1rem;
    max-height: calc(100vh - 2rem);
    max-height: calc(100dvh - 2rem);
    padding: 2rem 1.75rem;
  }
}
@media print {
  .site-clean.tema-escuro main.explore-page .ex-stage { position: static; display: block; max-height: none; overflow: visible; }
  .site-clean.tema-escuro main.explore-page .ex-stage-rolagem { margin: 0; padding: 0; overflow: visible; }
}

/* --- Decisão de Tiago, 29/09 (b): fundamentos e temas da resposta atual no alto do painel de
   apoio, acima do conteúdo fixo da visualização. Rótulos R-ROTULO; fontes em lista com seta
   ciano; temas em pílulas estáticas. Troca a cada pergunta (explore.js renderApoio). */
.site-clean.tema-escuro main.explore-page .ex-apoio-atual {
  display: grid;
  gap: 1rem;
  margin: 0 0 1.25rem;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(56, 232, 255, .35);
  border-radius: 14px;
  background: rgba(4, 16, 29, .72);
  box-shadow: inset 2px 0 0 rgba(56, 232, 255, .75), 0 0 0 1px rgba(56, 232, 255, .10), 0 0 18px rgba(56, 232, 255, .10);
}
.site-clean.tema-escuro main.explore-page .ex-apoio-atual[hidden],
.site-clean.tema-escuro main.explore-page .ex-apoio-grupo[hidden] { display: none; }
.site-clean.tema-escuro main.explore-page .ex-apoio-grupo h3 { max-width: none; margin: 0 0 .55rem; }
.site-clean.tema-escuro main.explore-page :is(.ex-apoio-fontes, .ex-apoio-temas) li { margin: 0; padding: 0; }
.site-clean.tema-escuro main.explore-page .ex-apoio-fontes { display: grid; gap: .35rem; margin: 0; padding: 0; list-style: none; }
.site-clean.tema-escuro main.explore-page .ex-apoio-fontes a { display: inline-flex; align-items: center; gap: .5rem; min-height: 32px; color: #EAF2FF; font-size: .9375rem; text-decoration-color: rgba(56, 232, 255, .55); }
.site-clean.tema-escuro main.explore-page .ex-apoio-fontes a::after { content: "\2197\FE0E"; content: "\2197\FE0E" / ""; color: var(--fx-ciano, #38E8FF); }
.site-clean.tema-escuro main.explore-page .ex-apoio-temas { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.site-clean.tema-escuro main.explore-page .ex-apoio-temas a {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  min-height: 36px;
  padding: .3rem .85rem;
  border: 1px solid var(--fx-borda-controle, #4A7795);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  font-size: .875rem;
  text-decoration: none;
  transition: none;
}
.site-clean.tema-escuro main.explore-page .ex-apoio-temas a::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--fx-ciano, #38E8FF);
  box-shadow: 0 0 0 3px rgba(56, 232, 255, .14), 0 0 10px 1px rgba(56, 232, 255, .5);
}
.site-clean.tema-escuro main.explore-page .ex-apoio-temas a:is(:hover, :focus-visible) { border-color: var(--fx-ciano, #38E8FF); box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22); }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.explore-page .ex-apoio-atual { border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.explore-page .ex-apoio-temas a { border-color: LinkText; }
}
@media print {
  .site-clean.tema-escuro main.explore-page .ex-apoio-atual { background: #FFFFFF; border-color: #999999; box-shadow: none; }
}

/* --- Decisão de Tiago, 29/09 (c): a pergunta anterior sai da tela e vai para "Perguntas anteriores
   (n)", um details fechado (R-DETALHE) logo acima da pergunta atual; aberto, as mensagens antigas
   rolam dentro dele. Mesma order da transcrição (ordem do DOM: antes dela). */
.site-clean.tema-escuro main.explore-page .has-conversation .ex-anteriores { order: 1; }
.site-clean.tema-escuro main.explore-page .ex-anteriores { margin: 0 0 .75rem; }
.site-clean.tema-escuro main.explore-page .ex-anteriores > summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 44px;
  padding: .45rem 1rem;
  border: 1px solid var(--fx-borda-controle, #4A7795);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #B2C0D4;
  font: 500 .75rem/1.4 var(--fonte-mono);
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: none;
}
.site-clean.tema-escuro main.explore-page .ex-anteriores > summary::-webkit-details-marker { display: none; }
.site-clean.tema-escuro main.explore-page .ex-anteriores > summary::after { content: "+"; content: "+" / ""; font: 500 1rem var(--fonte-mono); color: var(--fx-ciano, #38E8FF); }
.site-clean.tema-escuro main.explore-page .ex-anteriores[open] > summary::after { content: "\2212"; content: "\2212" / ""; }
.site-clean.tema-escuro main.explore-page .ex-anteriores > summary:is(:hover, :focus-visible) { border-color: var(--fx-ciano, #38E8FF); color: #EAF2FF; box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22); }
.site-clean.tema-escuro main.explore-page .ex-anteriores-lista {
  display: grid;
  gap: 1rem;
  max-height: 26rem;
  margin-top: .75rem;
  padding: .25rem .35rem .25rem 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  overflow-wrap: anywhere;
  scrollbar-width: thin;
  scrollbar-color: rgba(56, 232, 255, .42) #03060D;
}
@media (forced-colors: active) {
  .site-clean.tema-escuro main.explore-page .ex-anteriores > summary { border-color: ButtonText; box-shadow: none; }
}
@media print {
  .site-clean.tema-escuro main.explore-page .ex-anteriores-lista { max-height: none; overflow: visible; }
}
/* --- Tiago, 29/09 ~11h45: o painel mostra o conteúdo ao lado da resposta. Formas de contratação lado a
   lado (duas colunas a partir de 520 px de painel; empilhadas abaixo) e, em cada fundamento, uma linha
   sobre o que a página traz. */
.site-clean.tema-escuro main.explore-page .ex-apoio-formas { display: grid; gap: .75rem; }
.site-clean.tema-escuro main.explore-page .ex-apoio-formas h3 { max-width: none; margin: 0; }
.site-clean.tema-escuro main.explore-page .ex-apoio-formas__grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); gap: .75rem; }
.site-clean.tema-escuro main.explore-page .ex-apoio-forma {
  display: grid; align-content: start; gap: .35rem; padding: .85rem .95rem;
  border: 1px solid rgba(91, 140, 255, .45); border-radius: 12px; background: rgba(8, 24, 44, .78);
}
.site-clean.tema-escuro main.explore-page .ex-apoio-forma__tipo { color: var(--fx-ciano, #38E8FF); font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: .75rem; letter-spacing: .04em; text-transform: uppercase; }
.site-clean.tema-escuro main.explore-page .ex-apoio-forma h4 { margin: 0; color: #FFFFFF; font-size: 1.0625rem; }
.site-clean.tema-escuro main.explore-page .ex-apoio-forma ul { display: grid; gap: .3rem; margin: .2rem 0 0; padding: 0 0 0 1rem; }
.site-clean.tema-escuro main.explore-page .ex-apoio-forma li { max-width: none; margin: 0; color: #C9D6EA; font-size: .875rem; line-height: 1.45; }
.site-clean.tema-escuro main.explore-page .ex-apoio-formas__nota { max-width: none; margin: 0; color: #C9D6EA; font-size: .875rem; }
.site-clean.tema-escuro main.explore-page .ex-apoio-formas__nota a { color: #EAF2FF; text-decoration-color: rgba(56, 232, 255, .55); }
.site-clean.tema-escuro main.explore-page .ex-apoio-fontes li { display: grid; gap: .1rem; }
.site-clean.tema-escuro main.explore-page .ex-apoio-resumo { color: #C9D6EA; font-size: .8125rem; line-height: 1.4; }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.explore-page .ex-apoio-forma { border-color: CanvasText; }
}
/* ===========================================================================
   F12-LUZ · tarefa 2 (W19q, 06/10/2026). Tiago: "LUZ EM TODOS OS QUADROS, NENHUM QUADRO COM COR
   SOLIDA.. BORDA EM TODOS OS CARDS". Na conversa: os fundos chapados rgba(4, 16, 29, .85) viraram o
   vidro curto denso (--luz-chip-denso, futuro.css §A) e o vidro (--fx-vidro) tem luz no canto. Aqui:
   fio de luz no topo e borda acesa nos painéis (conversa, palco do caso, entrada do caso, compositor,
   mensagens), controles com o topo aceso, campo de texto em vidro e o "Mapa dos temas" com moldura
   inteira. Tudo estático (M44). O palco do mapa (.ex-map.map-stage) só recebe luz estática (M7).
   ========================================================================= */
@media (forced-colors: none) {
  .site-clean.tema-escuro main.explore-page :is(.ex-conversation, .ex-stage, .ex-case-entry) {
    border-color: var(--luz-borda, rgba(91, 140, 255, .38));
    background: var(--luz-cantos), var(--luz-fio), var(--fx-vidro);
  }
  .site-clean.tema-escuro main.explore-page .ex-case-entry:is(:hover, :focus-visible) { border-color: var(--luz-borda-acesa, #38E8FF); }
  .site-clean.tema-escuro main.explore-page :is(.ex-composer, .ex-message--user, .ex-message--assistant) {
    border-color: rgba(56, 232, 255, .55) rgba(91, 140, 255, .42) rgba(91, 140, 255, .30) rgba(91, 140, 255, .42);
    background: var(--luz-fio), var(--fx-vidro);
  }
  .site-clean.tema-escuro main.explore-page .ex-message--user { border-color: rgba(56, 232, 255, .70) rgba(56, 232, 255, .45) rgba(56, 232, 255, .35) rgba(56, 232, 255, .45); }
  /* O balão da Videre perde o fio de 2 px da esquerda (inset): a moldura inteira já acende. */
  .site-clean.tema-escuro main.explore-page .ex-message--assistant { box-shadow: inset 0 1px 0 rgba(234, 253, 255, .10), 0 0 0 1px rgba(56, 232, 255, .05), 0 0 22px rgba(11, 92, 232, .16); }
  .site-clean.tema-escuro main.explore-page .ex-composer { box-shadow: inset 0 1px 0 rgba(234, 253, 255, .10), 0 0 0 1px rgba(56, 232, 255, .05), 0 0 18px rgba(56, 232, 255, .10); }
  /* Controles: topo aceso (o hover e o aria-pressed continuam com a cor própria, de força maior). */
  .site-clean.tema-escuro main.explore-page :is(.ex-connection [data-ex-reconnect], .ex-text-button, .ex-prompts button, .ex-followups button, .ex-view-controls button, .ex-case-steps button, [data-ex-case-content] a, .ex-apoio-temas a, .ex-anteriores > summary):where(:not(:hover):not(:focus-visible):not([aria-pressed="true"]):not([aria-current]):not([aria-selected="true"]):not(.ex-retry-button)) {
    border-top-color: rgba(56, 232, 255, .80);
  }
  .site-clean.tema-escuro main.explore-page .ex-map .map-tools button:where(:not(:hover):not(:focus-visible):not([aria-pressed="true"]):not([aria-current]):not([aria-selected="true"]):not(.ex-retry-button)) { border-top-color: rgba(56, 232, 255, .80); }
  .site-clean.tema-escuro main.explore-page .ex-case-steps button { background: var(--luz-chip-denso, #07101D); }
  /* Campo de texto: vidro escuro com luz no canto e topo aceso (somente leitura e desativado ficam como estão). */
  .site-clean.tema-escuro main.explore-page .ex-composer textarea:not(:read-only):not(:disabled):where(:not(:focus):not([aria-invalid="true"])) { border-top-color: rgba(56, 232, 255, .80); }
  /* W19v: o campo da pergunta ganha o vidro dos campos de /contato/ (fio do topo com a luz embaixo, luz
     no canto de cima, vidro mais claro em cima) em todos os estados; desativado e somente leitura também
     ficam com a borda em degradê, ciano mais viva no topo (era rgba(58, 107, 176, .55), de uma cor só e
     mais escura que o quadro em volta). O texto desativado continua no cinza claro; tamanho igual. */
  /* W19v r2: o somente leitura (o campo durante a espera da resposta, com ou sem foco) é citado por extenso,
     :read-only:not(:disabled), para vencer a regra antiga do quadro chapado #0A1422 (mesma especificidade,
     regra posterior); antes só o desativado mudava. */
  .site-clean.tema-escuro main.explore-page .ex-composer textarea,
  .site-clean.tema-escuro main.explore-page .ex-composer textarea:read-only:not(:disabled),
  .site-clean.tema-escuro main.explore-page .ex-composer textarea:disabled {
    background:
      linear-gradient(90deg, rgba(56, 232, 255, 0), rgba(56, 232, 255, .90) 30%, #EAFDFF 50%, rgba(56, 232, 255, .90) 70%, rgba(56, 232, 255, 0)) 50% 0 / 80% 1px no-repeat,
      radial-gradient(50% 100% at 50% 0%, rgba(56, 232, 255, .24), rgba(56, 232, 255, 0)) 50% 0 / 80% 16px no-repeat,
      radial-gradient(70% 140% at 0% 0%, rgba(56, 232, 255, .14), rgba(56, 232, 255, 0) 70%) 0 0 / 100% 100% no-repeat,
      radial-gradient(50% 120% at 100% 100%, rgba(11, 92, 232, .14), rgba(11, 92, 232, 0) 70%) 0 0 / 100% 100% no-repeat,
      linear-gradient(180deg, rgba(18, 40, 70, .82) 0%, rgba(6, 14, 27, .86) 100%);
  }
  .site-clean.tema-escuro main.explore-page .ex-composer textarea:read-only:not(:disabled),
  .site-clean.tema-escuro main.explore-page .ex-composer textarea:disabled {
    border-color: rgba(56, 232, 255, .70) var(--fx-borda-controle, #4A7795) var(--fx-borda-controle, #4A7795);
  }
  @media (prefers-contrast: more) {
    .site-clean.tema-escuro main.explore-page .ex-composer textarea:read-only:not(:disabled),
    .site-clean.tema-escuro main.explore-page .ex-composer textarea:disabled { border-color: #5B8CFF; }
  }
  .site-clean.tema-escuro main.explore-page .ex-composer textarea:not(:focus) { box-shadow: inset 0 1px 0 rgba(234, 253, 255, .06), 0 0 14px rgba(56, 232, 255, .08); }
  /* "Mapa dos temas" fechado: a pílula ganha a moldura inteira (eram só as linhas de cima e de baixo). */
  .site-clean.tema-escuro main.explore-page .ex-map-disclosure:not([open]) > summary {
    padding: .5rem 1rem;
    border: 1px solid;
    border-color: rgba(56, 232, 255, .80) var(--fx-borda-controle, #4A7795) var(--fx-borda-controle, #4A7795);
    border-radius: 14px;
    background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
    box-shadow: inset 0 1px 0 rgba(234, 253, 255, .10), 0 0 14px rgba(56, 232, 255, .10);
  }
  .site-clean.tema-escuro main.explore-page .ex-map-disclosure:not([open]) > summary:is(:hover, :focus-visible) { border-color: #38E8FF rgba(56, 232, 255, .70) rgba(56, 232, 255, .55); }
  /* Aberto: a moldura do console com a borda acesa e luz estática por baixo do palco. */
  .site-clean.tema-escuro main.explore-page .ex-map-disclosure[open] {
    border-color: var(--luz-borda, rgba(91, 140, 255, .30));
    background: var(--luz-fio), var(--luz-canto), #03060D;
  }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.explore-page :is(.ex-composer, .ex-message--user, .ex-message--assistant, .ex-conversation, .ex-stage, .ex-case-entry) { border-color: #6F8FB0; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.explore-page :is(.ex-composer, .ex-message--user, .ex-message--assistant) { background: #0C192B; }
}
@media (forced-colors: active) {
  .site-clean.tema-escuro main.explore-page .ex-map-disclosure > summary { border-color: CanvasText; }
}
/* F12-LUZ · tarefa 2 (cont.): os dois quadros que só aparecem depois de uma resposta também perdem o
   fio da esquerda: o apoio da resposta atual (sombra interna de 2 px) e o limite da comparação
   (borda âmbar de 2 px) passam a moldura inteira, com o vidro e a luz. */
@media (forced-colors: none) {
  .site-clean.tema-escuro main.explore-page .ex-apoio-atual {
    border-color: rgba(56, 232, 255, .60) rgba(56, 232, 255, .35) rgba(56, 232, 255, .28) rgba(56, 232, 255, .35);
    background: var(--luz-fio), var(--luz-chip-denso, rgba(4, 16, 29, .72));
    box-shadow: inset 0 1px 0 rgba(234, 253, 255, .10), 0 0 0 1px rgba(56, 232, 255, .10), 0 0 18px rgba(56, 232, 255, .10);
  }
  /* Correção 2: a folga e o fio da base ficam (2 px, agora transparente; o texto não se move) e a
     moldura âmbar acesa vai para um pseudo-elemento atrás do texto, estendido para fora. */
  .site-clean.tema-escuro main.explore-page .ex-comparison p.ex-limit { position: relative; isolation: isolate; border-left-color: transparent; }
  .site-clean.tema-escuro main.explore-page .ex-comparison p.ex-limit::before {
    content: "";
    position: absolute;
    inset: -.5rem -.75rem -.5rem -2px;
    z-index: -1;
    border: 1px solid;
    border-color: rgba(255, 197, 117, .65) rgba(255, 197, 117, .38) rgba(255, 197, 117, .30) rgba(255, 197, 117, .38);
    border-radius: 10px;
    background:
      linear-gradient(90deg, rgba(255, 197, 117, 0), rgba(255, 197, 117, .80) 30%, #FFF3DD 50%, rgba(255, 197, 117, .80) 70%, rgba(255, 197, 117, 0)) 50% 0 / 76% 1px no-repeat,
      radial-gradient(80% 120% at 0% 0%, rgba(255, 197, 117, .10), rgba(255, 197, 117, 0) 70%),
      linear-gradient(180deg, rgba(20, 30, 46, .60), rgba(6, 13, 25, .70));
    box-shadow: 0 0 14px rgba(255, 197, 117, .08);
    pointer-events: none;
  }
}
@media (forced-colors: active) {
  .site-clean.tema-escuro main.explore-page .ex-comparison p.ex-limit { border-left-color: CanvasText; }
}
/* F12-LUZ · correção 2 (W19q): /explorar/ com tudo aberto. Os quatro cartões de "Dossiês" com o fio de
   luz do topo; "Nova conversa" e "Limpar" (eram só contorno) no vidro curto com luz; a etapa ativa do
   Caso Maralto (era #07101D chapado: a regra do aria-pressed vencia a do vidro) acesa, na mesma força
   da regra dela. Estático; cores forçadas e contraste ficam com as regras próprias. */
@media (forced-colors: none) {
  .site-clean.tema-escuro main.explore-page .ex-comparison article {
    border-color: rgba(56, 232, 255, .55) rgba(91, 140, 255, .42) rgba(91, 140, 255, .30) rgba(91, 140, 255, .42);
    background: var(--luz-fio), var(--fx-vidro, linear-gradient(180deg, rgba(20, 45, 80, .72) 0%, rgba(7, 16, 29, .88) 100%));
  }
  .site-clean.tema-escuro main.explore-page .ex-text-button { background: var(--luz-chip, rgba(4, 16, 29, .6)); }
  .site-clean.tema-escuro main.explore-page .ex-text-button:is(:hover, :focus-visible) { background: var(--luz-chip-aceso, rgba(4, 16, 29, .6)); }
  .site-clean.tema-escuro main.explore-page .ex-case-steps button[aria-pressed="true"] {
    background: var(--luz-chip-aceso, #07101D), #07101D;
  }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.explore-page .ex-comparison p.ex-limit::before { background: #0C192B; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.explore-page .ex-comparison p.ex-limit::before { border-color: #FFC575; box-shadow: none; }
}
@media print {
  .site-clean.tema-escuro main.explore-page .ex-comparison p.ex-limit::before { display: none !important; }
}
/* W19v r3: na impressão, a vista ativa fica sem a borda acesa, como na base. */
@media print {
  .site-clean.tema-escuro main.explore-page .ex-view-controls button[aria-pressed="true"] { border-color: transparent !important; }
}