/* Videre · P6 · caso interativo de /experiencias/ na linguagem 2.5 (W19, 29/09/2026).
   Especificação: _w19/visual-image25/p6/spec-P6-futurista.md, §2.1 (G1). Carregada só em
   experiencias/index.html, depois de futuro.css e antes de vivo*.css. Não edita regra antiga:
   vence por ordem e especificidade (escopo `.site-clean.tema-escuro main.experiencias`).
   Toda cor de luz leva reserva literal (G1 não depende de G5). Nada anima em laço aqui; o que
   se move (o deslocamento das escolhas da abertura) é só transform, com ponteiro fino.
   M7: .x-graph-viewport, .x-space-canvas e o que eles pintam ficam intocáveis. */

/* §0 · Receitas comuns (spec §1.4), como variáveis no escopo. A imersão (.x-immersive) é filha
   de main.experiencias (nav.js: root.appendChild(modal)) e herda as mesmas variáveis. */
.site-clean.tema-escuro main.experiencias {
  --p6-vidro: var(--fx-vidro, linear-gradient(180deg, rgba(20, 45, 80, .72) 0%, rgba(7, 16, 29, .88) 100%));
  --p6-reflexo: var(--fx-reflexo, inset 0 1px 0 rgba(255, 255, 255, .08));
  --p6-halo: 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));
  --p6-halo-forte: 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));
  --p6-borda-vidro: rgba(91, 140, 255, .38);
  --p6-borda-controle: var(--fx-borda-controle, #4A7795);
  --p6-ciano: var(--fx-ciano, #38E8FF);
  /* R-CANTOS (cópia do F11, futuro.css L394–416): 8 barras e 4 brilhos, em camadas de fundo. */
  --p6-canto: linear-gradient(#38E8FF, #38E8FF);
  --p6-canto-luz: linear-gradient(rgba(56, 232, 255, .18), rgba(56, 232, 255, .18));
  --p6-cantos:
    var(--p6-canto), var(--p6-canto), var(--p6-canto), var(--p6-canto),
    var(--p6-canto), var(--p6-canto), var(--p6-canto), var(--p6-canto),
    var(--p6-canto-luz), var(--p6-canto-luz), var(--p6-canto-luz), var(--p6-canto-luz),
    /* F12-LUZ tarefa 2 (W19q): fio de luz no topo, nas mesmas listas das cantoneiras. */
    linear-gradient(90deg, rgba(56, 232, 255, 0), rgba(56, 232, 255, .85) 30%, #EAFDFF 50%, rgba(56, 232, 255, .85) 70%, rgba(56, 232, 255, 0)),
    radial-gradient(50% 100% at 50% 0%, rgba(56, 232, 255, .20), rgba(56, 232, 255, 0));
  --p6-cantos-pos:
    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),
    50% 0, 50% 0;
  --p6-cantos-tam:
    18px 2px, 2px 18px, 18px 2px, 2px 18px, 18px 2px, 2px 18px, 18px 2px, 2px 18px,
    22px 6px, 6px 22px, 22px 6px, 6px 22px,
    76% 1px, 76% 16px;
  /* Sem R-GRADE: por ordem de Tiago de 29/09 ~04h05 ("REMOVE TUDO, QUERO ESTRELAS"), nenhum
     painel do caso leva grade, malha ou riscos; o fundo de estrelas vem da raia FUNDO. */
  /* Nó luminoso da R-ROTULO (F06). */
  --p6-no-sombra: 0 0 0 3px rgba(56, 232, 255, .14), 0 0 12px 2px rgba(56, 232, 255, .55);
}

/* R-FOCO · anel de foco 2.5 em todo o caso (sai o âmbar #f8ac55 de style.css L2184). Estático. */
.site-clean.tema-escuro main.experiencias :is(a, button, input, summary, [tabindex]):not(:where(.x-graph-viewport *)):focus-visible {
  outline: 2px solid var(--p6-ciano);
  outline-offset: 3px;
  box-shadow: 0 0 14px 2px rgba(56, 232, 255, .40);
}

/* P6-EXP-06 / COD-A4 / EX-05 · Abas do caso: pílulas soltas da navegação de seções de
   /produto/ (R-ABAS). Sem trilho, sem fundo, sem filete no pé; troca instantânea (M44). */
.site-clean.tema-escuro main.experiencias .x-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin: 0 0 1.25rem;
  border: 0;
  border-radius: 0;
  background: none;
  overflow: visible;
}
.site-clean.tema-escuro main.experiencias .x-tabs a {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  column-gap: .75rem;
  row-gap: .15rem;
  flex: 1 1 16rem;
  min-height: 44px;
  padding: .7rem 1.15rem;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 14px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #F6F8FC;
  box-shadow: var(--p6-reflexo);
  text-decoration: none;
  transition: none;
}
.site-clean.tema-escuro main.experiencias .x-tabs a:last-child { border: 1px solid var(--p6-borda-controle); }
.site-clean.tema-escuro main.experiencias .x-tabs a > span {
  grid-row: span 2;
  display: inline-flex;
  align-items: center;
  font: 500 .75rem/1.4 var(--fonte-mono, "IBM Plex Mono", monospace);
  letter-spacing: .08em;
  color: var(--p6-ciano);
}
.site-clean.tema-escuro main.experiencias .x-tabs a > span::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: .6em;
  border-radius: 50%;
  background: var(--p6-ciano);
  box-shadow: var(--p6-no-sombra);
}
.site-clean.tema-escuro main.experiencias .x-tabs strong {
  font: 500 .8125rem/1.35 var(--fonte-mono, "IBM Plex Mono", monospace);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #F6F8FC;
}
.site-clean.tema-escuro main.experiencias .x-tabs small { margin: 0; color: #B2C0D4; }
.site-clean.tema-escuro main.experiencias .x-tabs a:is(:hover, :focus-visible):not([aria-selected="true"]) {
  border-color: var(--p6-ciano);
  box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22);
}
.site-clean.tema-escuro main.experiencias .x-tabs a:focus-visible { outline-offset: 3px; }
/* Ativa (W19v, regra de Tiago "nenhum quadro com cor sólida"): era a pílula ativa da Home, um degradê
   opaco azul → violeta. Passa ao vidro aceso dos quadros: luz no canto de cima, fio de luz no topo, borda
   acesa nos 4 lados (mais viva no topo) e halo. Continua bem distinta das inativas: borda e luz mais
   fortes, o ponto branco e o marcador de 2 px embaixo; W19v r2: vidro mais claro que o das inativas. Mesma
   borda de 1 px (a medida não muda). Estático. */
.site-clean.tema-escuro main.experiencias .x-tabs a[aria-selected="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:
    var(--luz-fio, linear-gradient(90deg, rgba(56, 232, 255, 0), #EAFDFF 50%, rgba(56, 232, 255, 0)) 50% 0 / 76% 1px no-repeat),
    radial-gradient(90% 150% at 0% 0%, rgba(56, 232, 255, .26), rgba(56, 232, 255, 0) 70%) 0 0 / 100% 100% no-repeat,
    radial-gradient(60% 120% at 100% 100%, rgba(11, 92, 232, .22), rgba(11, 92, 232, 0) 70%) 0 0 / 100% 100% no-repeat,
    linear-gradient(165deg, rgba(40, 100, 184, .86) 0%, rgba(24, 64, 124, .88) 55%, rgba(14, 40, 82, .90) 100%);
  color: #FFFFFF;
  box-shadow: inset 0 -2px 0 #38E8FF, 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.experiencias .x-tabs a[aria-selected="true"] > span,
.site-clean.tema-escuro main.experiencias .x-tabs a[aria-selected="true"] strong { color: #FFFFFF; }
.site-clean.tema-escuro main.experiencias .x-tabs a[aria-selected="true"] small { color: #EAF2FF; }
.site-clean.tema-escuro main.experiencias .x-tabs a[aria-selected="true"] > span::before { background: #FFFFFF; box-shadow: 0 0 0 3px rgba(255, 255, 255, .18), 0 0 10px 1px rgba(234, 253, 255, .6); }
.site-clean.tema-escuro main.experiencias .x-tabs a[aria-selected="true"]::after { content: none; }
@media (max-width: 780px) {
  .site-clean.tema-escuro main.experiencias .x-tabs a { display: grid; padding: .65rem .9rem; }
  .site-clean.tema-escuro main.experiencias .x-tabs small { display: block; }
}
/* EX-05: a ≤ 720 px cada aba ocupa a linha inteira, com o <small> visível e sem corte a 320. */
@media (max-width: 720px) {
  .site-clean.tema-escuro main.experiencias .x-tabs { gap: .5rem; }
  .site-clean.tema-escuro main.experiencias .x-tabs a { flex: 1 1 100%; min-width: 0; }
  .site-clean.tema-escuro main.experiencias .x-tabs :is(strong, small) { overflow-wrap: anywhere; }
}
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias .x-tabs a { forced-color-adjust: none; border: 1px solid ButtonBorder; background: ButtonFace; color: ButtonText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-tabs a :is(span, strong, small) { color: ButtonText; }
  .site-clean.tema-escuro main.experiencias .x-tabs a[aria-selected="true"] { border: 1px solid Highlight; background: Highlight; color: HighlightText; }
  /* W19v r3: a aba 03 (a:last-child, linha "border: 1px solid var(--p6-borda-controle)") é mais específica que a regra acima. */
  .site-clean.tema-escuro main.experiencias .x-tabs a:last-child:not([aria-selected="true"]) { border-color: ButtonBorder; }
  .site-clean.tema-escuro main.experiencias .x-tabs a[aria-selected="true"] :is(span, strong, small) { color: HighlightText; }
  .site-clean.tema-escuro main.experiencias .x-tabs a > span::before { background: currentColor; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(a, button, input, summary, [tabindex]):not(:where(.x-graph-viewport *)):focus-visible { outline-color: Highlight; box-shadow: none; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.experiencias .x-tabs a { border-color: #5B8CFF; }
  .site-clean.tema-escuro main.experiencias .x-tabs a[aria-selected="true"] { border-color: #38E8FF; box-shadow: inset 0 -2px 0 #38E8FF; }
}
/* W19v: transparência reduzida, a aba ativa fecha o vidro (como os outros quadros do F12.8). */
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.experiencias .x-tabs a[aria-selected="true"] { background: var(--luz-fio, none), #1D4A85; }
}

/* COD-A4 · Painel .x-panel: R-VIDRO + R-CANTOS, raio de 18 px nos quatro cantos
   (sai o chapado #07101d com raio só embaixo); sem grade (ordem de Tiago de 29/09 ~04h05). A entrada .is-entering (style.css L2187) já é só opacity/transform. */
.site-clean.tema-escuro main.experiencias .x-panel {
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 18px;
  background-color: transparent;
  background-image: var(--p6-cantos), var(--p6-vidro);
  background-position: var(--p6-cantos-pos), 0 0;
  background-size: var(--p6-cantos-tam), auto;
  background-repeat: no-repeat;
  box-shadow: var(--p6-reflexo), var(--p6-halo);
  color: #E9F1FF;
}
/* R-ROTULO em todo rótulo mono do caso (F06): mono ciano maiúsculo com o nó luminoso.
   vivo-sinais.js decodifica o texto dos .x-eyebrow, não o pseudo (L60–62). */
.site-clean.tema-escuro main.experiencias .x-eyebrow {
  font: 500 .75rem/1.4 var(--fonte-mono, "IBM Plex Mono", monospace);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--p6-ciano);
}
.site-clean.tema-escuro main.experiencias .x-eyebrow::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 .75em .1em 0;
  border-radius: 50%;
  vertical-align: middle;
  background: var(--p6-ciano);
  box-shadow: var(--p6-no-sombra);
}
.site-clean.tema-escuro main.experiencias .x-panel-heading h2 { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias .x-panel-heading p:not(.x-eyebrow) { color: #B2C0D4; }
/* R-PILULA: "Voltar ao início" e o link de seguir do pé do painel. */
.site-clean.tema-escuro main.experiencias :is(.x-text-button, .x-panel-next a) {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  min-height: 44px;
  padding: .5rem 1rem;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  box-shadow: var(--p6-reflexo);
  font: 500 .875rem/1.3 var(--fonte-corpo, "Public Sans", sans-serif);
  text-decoration: none;
  transition: none;
}
.site-clean.tema-escuro main.experiencias .x-text-button.x-controls { display: none; }
.site-clean.tema-escuro main.experiencias.x-ready .x-text-button.x-controls { display: inline-flex; }
.site-clean.tema-escuro main.experiencias .x-text-button span { margin-left: 0; color: var(--p6-ciano); }
.site-clean.tema-escuro main.experiencias :is(.x-text-button, .x-panel-next a):is(:hover, :focus-visible) {
  border-color: var(--p6-ciano);
  box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22);
}
.site-clean.tema-escuro main.experiencias .x-panel-next { border-top: 1px solid rgba(91, 140, 255, .18); }
.site-clean.tema-escuro main.experiencias .x-panel-next > span { color: #B2C0D4; }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias .x-panel { background-image: none; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-eyebrow::before { forced-color-adjust: none; background: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(.x-text-button, .x-panel-next a) { border-color: ButtonText; box-shadow: none; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.experiencias .x-panel { border-color: #6F8FB0; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(.x-text-button, .x-panel-next a) { border-color: #5B8CFF; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.experiencias .x-panel { background-image: var(--p6-cantos), linear-gradient(#0C192B, #0C192B); background-repeat: no-repeat; }
}

/* P6-EXP-01 · Abertura (.x-intro): dois cartões de vidro com cantoneiras, no modelo das fichas
   de /produto/. As escolhas viram linhas de console (R-PILULA de 14 px) com "Iniciar →" em
   mono ciano; o deslocamento de 4 px é só transform e só com ponteiro fino. */
.site-clean.tema-escuro main.experiencias .x-intro {
  gap: 1.25rem;
  border: 0;
  border-radius: 0;
  overflow: visible;
}
.site-clean.tema-escuro main.experiencias :is(.x-company, .x-first-choice) {
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 18px;
  background-color: transparent;
  background-image: var(--p6-cantos), var(--p6-vidro);
  background-position: var(--p6-cantos-pos), 0 0;
  background-size: var(--p6-cantos-tam), auto;
  background-repeat: no-repeat;
  box-shadow: var(--p6-reflexo), var(--p6-halo);
  color: #B2C0D4;
}
.site-clean.tema-escuro main.experiencias .x-company-monogram {
  width: 48px;
  height: 48px;
  border: 1px solid transparent;
  background: radial-gradient(circle, #173A6A, #050B16) padding-box, linear-gradient(135deg, #5B8CFF, #38E8FF) border-box;
  color: #F6F8FC;
  font-size: 1.35rem;
  box-shadow: 0 0 18px rgba(56, 232, 255, .18);
}
.site-clean.tema-escuro main.experiencias .x-chip {
  display: inline-flex;
  align-items: center;
  padding: .3rem .75rem;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  font: 500 .6875rem/1.4 var(--fonte-mono, "IBM Plex Mono", monospace);
  letter-spacing: .08em;
  box-shadow: var(--p6-reflexo);
}
.site-clean.tema-escuro main.experiencias :is(.x-company h3, .x-first-choice h3) { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias :is(.x-company-line, .x-first-choice > p) { color: #B2C0D4; }
.site-clean.tema-escuro main.experiencias .x-company dl > div { border-color: rgba(91, 140, 255, .18); }
.site-clean.tema-escuro main.experiencias .x-company dt { color: #B2C0D4; }
.site-clean.tema-escuro main.experiencias .x-company dd { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias .x-company-foot { color: #93A7C2; }
.site-clean.tema-escuro main.experiencias .x-first-choice .x-small { color: #93A7C2; }
/* "COMECE POR AQUI" deixa o fundo ciano cheio e vira R-ROTULO. */
.site-clean.tema-escuro main.experiencias .x-start-badge {
  padding: 0;
  border-radius: 0;
  background: none;
  color: var(--p6-ciano);
  font: 500 .75rem/1.4 var(--fonte-mono, "IBM Plex Mono", monospace);
  letter-spacing: .08em;
}
.site-clean.tema-escuro main.experiencias .x-start-badge::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 .75em .1em 0;
  border-radius: 50%;
  vertical-align: middle;
  background: var(--p6-ciano);
  box-shadow: var(--p6-no-sombra);
}
.site-clean.tema-escuro main.experiencias .x-choice-list button {
  min-height: 64px;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 14px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #F6F8FC;
  box-shadow: var(--p6-reflexo);
  transition: none;
}
.site-clean.tema-escuro main.experiencias .x-choice-list button:is(:hover, :focus-visible) {
  border-color: var(--p6-ciano);
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22);
  transform: none;
}
.site-clean.tema-escuro main.experiencias .x-choice-list button:focus-visible { box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22), 0 0 14px 2px rgba(56, 232, 255, .40); }
.site-clean.tema-escuro main.experiencias .x-choice-start {
  color: var(--p6-ciano);
  font: 500 .75rem/1.4 var(--fonte-mono, "IBM Plex Mono", monospace);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.site-clean.tema-escuro main.experiencias .x-choice-start::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--p6-ciano);
  box-shadow: var(--p6-no-sombra);
}
@media (hover: hover) and (pointer: fine) {
  .site-clean.tema-escuro main.experiencias .x-choice-list button { transition: transform .18s ease-out; }
  .site-clean.tema-escuro main.experiencias .x-choice-list button:is(:hover, :focus-visible) { transform: translateX(4px); }
}
html:is(.vivo-calmo, .vivo-quieto, .vivo-parado) .site-clean.tema-escuro main.experiencias .x-choice-list button { transition: none; }
@media (prefers-reduced-motion: reduce) {
  .site-clean.tema-escuro main.experiencias .x-choice-list button { transition: none !important; }
}
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias :is(.x-company, .x-first-choice) { background-image: none; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-company-monogram { forced-color-adjust: none; background: Canvas; color: CanvasText; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(.x-chip, .x-choice-list button) { border-color: ButtonText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(.x-start-badge, .x-choice-start)::before { forced-color-adjust: none; background: CanvasText; box-shadow: none; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.experiencias :is(.x-company, .x-first-choice) { border-color: #6F8FB0; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(.x-chip, .x-choice-list button) { border-color: #5B8CFF; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.experiencias :is(.x-company, .x-first-choice) { background-image: var(--p6-cantos), linear-gradient(#0C192B, #0C192B); }
}

/* P6-EXP-02 / COD-A5 · Imersão (dialog.x-immersive), FORA do palco: console da dobra 2 da Home.
   M7: .x-graph-viewport (estrelas e linhas) e .x-space-canvas intocáveis; muda só a caixa
   .x-map-wrap (borda, raio, sombra externa) e o estilo estático dos controles DOM. As
   estrelas e linhas ficam como estão até a P-P6-3. */
.site-clean.tema-escuro main.experiencias .x-immersive .x-space-bar {
  border-bottom: 0;
  border-radius: 0;
  background: var(--p6-vidro);
  box-shadow: var(--p6-reflexo), inset 0 -1px 0 rgba(56, 232, 255, .45);
}
/* Logotipo no lugar do texto "VIDERE"; o texto fica no DOM (leitor de tela e cores forçadas).
   font-size: 0 e não color: transparent (o axe-core leria contraste 1:1; revisão C2-16). */
.site-clean.tema-escuro main.experiencias .x-immersive .x-space-wordmark {
  display: inline-block;
  flex-shrink: 0;
  /* FID-P6-10: 144×36 (o logotipo 300×76 sai com ~142×36), perto do peso da marca do cabeçalho;
     com 96×20 o "DUE DILIGENCE" ficava ilegível. */
  width: 144px;
  height: 36px;
  background: url("/assets/marca/logo-mono-claro.svg") left center / contain no-repeat;
  font-size: 0;
  line-height: 0;
  letter-spacing: 0;
}
/* FID-P6-04: o título "Constelação da contratação" é o rótulo do cabeçalho de console, dentro da
   moldura (nav.js o põe no .x-discovery-top), em mono ciano claro, como "CONSTELAÇÃO VIDERE" da
   dobra 2 da Home; o "•••" fica à direita na mesma linha. */
.site-clean.tema-escuro main.experiencias .x-immersive .x-discovery-top .x-space-title {
  flex: none;
  max-width: none;
  margin: 0;
  color: #C8F6FF;
  font: 500 .8125rem/1.4 var(--fonte-mono, "IBM Plex Mono", monospace);
  letter-spacing: .12em;
  text-transform: uppercase;
  white-space: nowrap;
}
/* Cabeçalho de console (E2-03/E2-04) na barra que já existe acima do palco: texto ciano claro,
   "• • •" pintado à direita e divisória recuada com o ponto de luz no meio. Fora do palco. */
.site-clean.tema-escuro main.experiencias .x-immersive .x-discovery-top {
  position: relative;
  justify-content: flex-start;
  gap: 1.5rem;
  min-height: 52px;
  border-bottom: 0;
  background: transparent;
  padding-right: 5rem;
}
.site-clean.tema-escuro main.experiencias .x-immersive .x-discovery-top p { color: #C8F6FF; }
.site-clean.tema-escuro main.experiencias .x-immersive .x-discovery-top::after {
  content: "";
  position: absolute;
  right: 2rem;
  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.experiencias .x-immersive .x-discovery-top::before {
  content: "";
  position: absolute;
  left: 2rem;
  right: 2rem;
  bottom: 0;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(56, 232, 255, .15), #2A5F80 20%, #3C7FA6 50%, #2A5F80 80%, rgba(56, 232, 255, .15));
}
/* R-CONSOLE-PALCO no .x-workspace: a calha de 22 px sai de padding novo (o palco encolhe e o
   fitMap reescala; §6 compara geometria normalizada). Colchetes de 16 × 2 e os oito halos no
   ::before do contêiner, ABAIXO do palco (z-index), só nas quinas da calha. */
.site-clean.tema-escuro main.experiencias .x-immersive .x-workspace {
  position: relative;
  isolation: isolate;
  padding: 22px;
  gap: 22px;
  background: #03060D;
}
.site-clean.tema-escuro main.experiencias .x-immersive .x-workspace::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.experiencias .x-immersive .x-workspace > * { position: relative; z-index: 1; }
/* Caixa do palco: só borda, raio e sombra externa (o box-shadow externo pinta fora da caixa). */
.site-clean.tema-escuro main.experiencias .x-immersive .x-map-wrap {
  border: 1px solid rgba(91, 140, 255, .38);
  border-radius: 14px;
  box-shadow: 0 0 28px rgba(11, 92, 232, .20);
}
/* FID-P6-04 · Console da dobra 2 da Home (E2-01/E2-02) no computador: a moldura com os colchetes
   passa do .x-workspace para o .x-discovery inteiro (cabeçalho de console, palco, inspetor e a
   legenda do pé), com 16 a 24 px de margem da tela. Os colchetes ficam a 8 px da borda da
   moldura, na calha: o cabeçalho, o palco e a legenda começam a 22 px ou mais dela. */
@media (min-width: 781px) {
  .site-clean.tema-escuro main.experiencias .x-immersive .x-discovery {
    margin: 16px 24px 24px;
    border: 1px solid #1C3D57;
    border-bottom-color: #2A5F80;
    border-radius: 14px;
    background: linear-gradient(180deg, #071A2C 0%, #04101C 120px);
    box-shadow: inset 0 1px 0 rgba(143, 220, 255, .14), inset 0 0 22px rgba(56, 232, 255, .06), 0 0 0 1px #02060D, 0 0 24px rgba(11, 92, 232, .16);
  }
  .site-clean.tema-escuro main.experiencias .x-immersive .x-discovery::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.experiencias .x-immersive .x-workspace { padding-top: 12px; border: 0; border-radius: 0; background: transparent; }
  .site-clean.tema-escuro main.experiencias .x-immersive .x-workspace::before { display: none; }
  .site-clean.tema-escuro main.experiencias .x-immersive .x-discovery > .x-discovery-bottom { border-top: 0; background: transparent; }
}
/* Celular: a moldura do palco fica no .x-workspace (o .x-discovery rola), a 16 px da tela, e o
   palco começa depois da calha de 16 px (colchetes e halo de 8 a 16 px de cada borda, fora da
   caixa do palco; M7). */
@media (max-width: 780px) {
  .site-clean.tema-escuro main.experiencias .x-immersive .x-workspace { margin-inline: 8px; }
}
/* Ferramentas (controles DOM dentro do palco: estilo estático, sem nó novo visível). */
.site-clean.tema-escuro main.experiencias .x-immersive .x-graph-toolbar p {
  font: 400 .72rem/1.4 var(--fonte-mono, "IBM Plex Mono", monospace);
  color: #93A7C2;
}
.site-clean.tema-escuro main.experiencias .x-immersive .x-graph-toolbar button {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 36px;
  min-width: 36px;
  height: 36px;
  min-height: 36px;
  padding: 0;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  box-shadow: var(--p6-reflexo);
  transition: none;
}
/* Área de toque de 44 px, invisível. */
.site-clean.tema-escuro main.experiencias .x-immersive .x-graph-toolbar button::before { content: ""; position: absolute; inset: -4px; border-radius: 999px; }
.site-clean.tema-escuro main.experiencias .x-immersive .x-graph-toolbar button:not(:disabled):is(:hover, :focus-visible) {
  border-color: var(--p6-ciano);
  box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22);
}
/* Chips da lista de pontos: R-PILULA; o pressionado é a pílula ativa da Home (sai o lilás
   antigo #9881bd/#e3d7ff); o de alerta com a borda âmbar da R-ALERTA. */
.site-clean.tema-escuro main.experiencias .x-immersive .x-map-wrap > .x-node-list {
  background: transparent;
  scrollbar-color: rgba(56, 232, 255, .42) #03060D;
}
.site-clean.tema-escuro main.experiencias .x-immersive .x-node-list button {
  min-height: 44px;
  padding: .5rem .95rem;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  box-shadow: var(--p6-reflexo);
  transition: none;
}
.site-clean.tema-escuro main.experiencias .x-immersive .x-node-list button.is-alert { border-color: var(--fx-alerta-borda, rgba(255, 197, 117, .55)); color: #FFC575; }
.site-clean.tema-escuro main.experiencias .x-immersive .x-node-list button:is(:hover, :focus-visible):not([aria-pressed="true"]) {
  border-color: var(--p6-ciano);
  box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22);
}
/* W19v: o documento ativo da lista também sai do degradê opaco para o vidro aceso (como a pergunta ativa). */
.site-clean.tema-escuro main.experiencias .x-immersive .x-node-list 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.experiencias .x-immersive .x-node-list button[aria-pressed="true"] span { color: #FFFFFF; }
/* Contador e barra de conexão (sai o #c9b7ff, L2425). */
.site-clean.tema-escuro main.experiencias .x-immersive .x-counter {
  font: 500 .8125rem/1.5 var(--fonte-mono, "IBM Plex Mono", monospace);
  color: var(--p6-ciano);
}
.site-clean.tema-escuro main.experiencias .x-immersive .x-map-connect-bar { border-top: 1px solid rgba(56, 232, 255, .25); }
.site-clean.tema-escuro main.experiencias .x-immersive .x-map-connect-context p { color: #B2C0D4; }
/* "Conectar seleção" e "Limpar": pílulas de contorno iguais entre si, o desenho de
   .map-footer button da Home (E2-07); o gradiente fica só para a ação principal (C1-08). */
.site-clean.tema-escuro main.experiencias .x-immersive :is(.x-map-connect-bar .x-button, .map-clear, [data-x-clear]) {
  min-height: 44px;
  padding: .55rem 1.25rem;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  box-shadow: var(--p6-reflexo);
  font: 500 .875rem/1.3 var(--fonte-corpo, "Public Sans", sans-serif);
  transition: none;
}
.site-clean.tema-escuro main.experiencias .x-immersive :is(.x-map-connect-bar .x-button, .map-clear, [data-x-clear]):not(:disabled):is(:hover, :focus-visible) {
  border-color: var(--p6-ciano);
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22);
}
.site-clean.tema-escuro main.experiencias .x-immersive :is(.x-map-connect-bar .x-button, .map-clear, [data-x-clear]):disabled {
  border-color: rgba(74, 119, 149, .55);
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #93A7C2;
  box-shadow: none;
  opacity: 1;
}
/* Inspetor: R-VIDRO simples, SEM cantoneiras (painel de texto ao lado do palco, C1-06). */
.site-clean.tema-escuro main.experiencias .x-immersive .x-inspector {
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 14px;
  background: var(--p6-vidro);
  box-shadow: var(--p6-reflexo), var(--p6-halo);
  scrollbar-color: rgba(56, 232, 255, .42) #03060D;
}
.site-clean.tema-escuro main.experiencias .x-immersive .x-inspector h3 { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias .x-immersive .x-inspector p:not(.x-eyebrow) { color: #B2C0D4; }
.site-clean.tema-escuro main.experiencias .x-immersive .x-inspector blockquote {
  border-radius: 0 10px 10px 0;
  background: rgba(7, 16, 29, .72);
  border-left: 2px solid rgba(56, 232, 255, .75);
  color: #D3E1F4;
}
.site-clean.tema-escuro main.experiencias .x-immersive .x-document-reader {
  padding: 1rem;
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 14px;
  background: var(--p6-vidro);
  box-shadow: var(--p6-reflexo);
}
.site-clean.tema-escuro main.experiencias .x-immersive .x-document-reader :is(h2, h3) { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias .x-immersive .x-document-reader blockquote { color: #D3E1F4; }
/* Pé da imersão e legenda. */
.site-clean.tema-escuro main.experiencias .x-immersive .x-discovery-bottom { background: #03060D; border-top: 1px solid rgba(91, 140, 255, .18); }
.site-clean.tema-escuro main.experiencias .x-immersive .x-space-selection-note {
  font: 400 .72rem/1.5 var(--fonte-mono, "IBM Plex Mono", monospace);
  color: #93A7C2;
}
/* Sair da imersão: R-PILULA. */
.site-clean.tema-escuro main.experiencias .x-immersive .x-space-close {
  min-height: 44px;
  padding: .5rem 1rem;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  box-shadow: var(--p6-reflexo);
  transition: none;
}
.site-clean.tema-escuro main.experiencias .x-immersive .x-space-close:is(:hover, :focus-visible) {
  border-color: var(--p6-ciano);
  box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22);
}
.site-clean.tema-escuro main.experiencias .x-immersive .x-space-close:focus-visible { box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 14px 2px rgba(56, 232, 255, .40); }
@media (max-width: 1050px) {
  .site-clean.tema-escuro main.experiencias .x-immersive .x-workspace { grid-template-columns: minmax(0, 1fr) 290px; }
}
@media (max-width: 780px) {
  .site-clean.tema-escuro main.experiencias .x-immersive .x-workspace { display: block; padding: 16px; }
  .site-clean.tema-escuro main.experiencias .x-immersive .x-inspector { margin-top: 12px; }
}
@media (max-width: 720px) {
  .site-clean.tema-escuro main.experiencias .x-immersive .x-space-wordmark { width: 112px; height: 28px; }
  /* FID-P6-07 · Barra da imersão no celular em duas linhas de altura conhecida: marca à esquerda e
     "Sair da imersão ×" à direita na primeira; o volume na largura toda na segunda. */
  .site-clean.tema-escuro main.experiencias .x-immersive {
    --p6-barra-imersao: 112px;
  }
  .site-clean.tema-escuro main.experiencias .x-immersive .x-space-bar {
    position: relative;
    z-index: 6;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 4px 12px;
    box-sizing: border-box;
    height: var(--p6-barra-imersao);
    min-height: 0;
    padding: 10px 16px;
  }
  .site-clean.tema-escuro main.experiencias .x-immersive .x-space-actions { display: contents; }
  .site-clean.tema-escuro main.experiencias .x-immersive .x-space-brand { grid-row: 1; grid-column: 1; }
  .site-clean.tema-escuro main.experiencias .x-immersive .x-space-close { grid-row: 1; grid-column: 2; min-height: 44px; }
  /* A síntese começa abaixo da barra (não cobre o "Sair") e fica presa à janela: na imersão a
     entrada do .x-discovery não usa transform, que o faria bloco de contenção do position: fixed
     e levaria a síntese junto com a rolagem. */
  .site-clean.tema-escuro main.experiencias .x-immersive .x-synthesis { top: calc(var(--p6-barra-imersao) + 8px); }
  .site-clean.tema-escuro main.experiencias .x-immersive .x-discovery.is-entering { animation-name: none; }
}
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias .x-immersive .x-space-wordmark { background: none; width: auto; height: auto; font-size: inherit; line-height: inherit; letter-spacing: .36em; color: CanvasText; }
  .site-clean.tema-escuro main.experiencias .x-immersive :is(.x-workspace, .x-discovery-top, .x-discovery)::before,
  .site-clean.tema-escuro main.experiencias .x-immersive .x-discovery-top::after { display: none; }
  .site-clean.tema-escuro main.experiencias .x-immersive :is(.x-space-bar, .x-inspector, .x-document-reader, .x-map-wrap, .x-discovery) { background: Canvas; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-immersive :is(.x-graph-toolbar button, .x-node-list button, .x-map-connect-bar .x-button, .x-space-close) { forced-color-adjust: none; border: 1px solid ButtonBorder; background: ButtonFace; color: ButtonText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-immersive .x-node-list button.is-alert { border-color: ButtonBorder; color: ButtonText; }
  .site-clean.tema-escuro main.experiencias .x-immersive .x-node-list button[aria-pressed="true"] { border: 1px solid Highlight; background: Highlight; color: HighlightText; }
  .site-clean.tema-escuro main.experiencias .x-immersive .x-map-connect-bar .x-button:disabled { background: ButtonFace; color: GrayText; border-color: GrayText; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.experiencias .x-immersive :is(.x-graph-toolbar button, .x-node-list button, .x-map-connect-bar .x-button, .x-space-close) { border-color: #5B8CFF; }
  .site-clean.tema-escuro main.experiencias .x-immersive :is(.x-inspector, .x-map-wrap, .x-discovery) { border-color: #6F8FB0; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-immersive .x-node-list 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.experiencias .x-immersive :is(.x-space-bar, .x-inspector, .x-document-reader) { background: #0C192B; }
  .site-clean.tema-escuro main.experiencias .x-immersive .x-node-list button[aria-pressed="true"] { background: #1D4A85; }
}

/* P6-EXP-03 · Síntese (.x-synthesis, na página e dentro da imersão): painel de achados em vidro
   com cantoneiras; rótulos em R-ROTULO; títulos brancos (sai o lilás #d1c6ff); referências
   como pílula-fonte; "Voltar às estrelas ×" em R-PILULA. */
.site-clean.tema-escuro main.experiencias .x-synthesis {
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 18px;
  background-color: transparent;
  background-image: var(--p6-cantos), var(--p6-vidro);
  background-position: var(--p6-cantos-pos), 0 0;
  background-size: var(--p6-cantos-tam), auto;
  background-repeat: no-repeat;
  box-shadow: var(--p6-reflexo), var(--p6-halo);
}
/* Dentro da imersão o painel flutua sobre o palco: o vidro fica opaco para a leitura
   (#07101D por baixo do gradiente), sem desfoque (nada de backdrop-filter). */
.site-clean.tema-escuro main.experiencias .x-immersive .x-synthesis {
  background-image: var(--p6-cantos), var(--p6-vidro), linear-gradient(#07101D, #07101D);
  background-position: var(--p6-cantos-pos), 0 0, 0 0;
  background-size: var(--p6-cantos-tam), auto, auto;
  box-shadow: var(--p6-reflexo), var(--p6-halo-forte);
  scrollbar-color: rgba(56, 232, 255, .42) #03060D;
}
.site-clean.tema-escuro main.experiencias .x-synthesis :is(h3, h4) { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias .x-synthesis p:not(.x-eyebrow) { color: #B2C0D4; }
.site-clean.tema-escuro main.experiencias .x-synthesis article { border-top-color: rgba(91, 140, 255, .18); }
.site-clean.tema-escuro main.experiencias .x-findings article > span {
  font: 500 .75rem/1.4 var(--fonte-mono, "IBM Plex Mono", monospace);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--p6-ciano);
}
.site-clean.tema-escuro main.experiencias .x-findings article > span::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 .75em .1em 0;
  border-radius: 50%;
  vertical-align: middle;
  background: var(--p6-ciano);
  box-shadow: var(--p6-no-sombra);
}
/* Pílula-fonte: toda referência a documento (E0n) do caso. Alvo de 24 px (ACS-06) mantido. */
.site-clean.tema-escuro main.experiencias a.x-source {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  margin: .25rem .4rem .25rem 0;
  padding: .1rem .6rem;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: var(--p6-ciano);
  font: 500 .75rem/1.4 var(--fonte-mono, "IBM Plex Mono", monospace);
  text-decoration: none;
  transition: none;
}
.site-clean.tema-escuro main.experiencias a.x-source:is(:hover, :focus-visible) {
  border-color: var(--p6-ciano);
  box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22);
}
.site-clean.tema-escuro main.experiencias a.x-source:focus-visible { box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 14px 2px rgba(56, 232, 255, .40); }
.site-clean.tema-escuro main.experiencias .x-synthesis-close {
  min-height: 44px;
  padding: .5rem 1rem;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  box-shadow: var(--p6-reflexo);
  transition: none;
}
.site-clean.tema-escuro main.experiencias .x-synthesis-close:is(:hover, :focus-visible) {
  border-color: var(--p6-ciano);
  box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22);
}
/* A ação que segue da síntese ("Examinar a resposta do fornecedor →") é a ação principal do
   painel: receita R-CTA, igual à ação principal do §C, com o hover igual ao repouso. */
.site-clean.tema-escuro main.experiencias .x-synthesis a.x-button,
.site-clean.tema-escuro main.experiencias .x-synthesis a.x-button:hover {
  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.experiencias .x-synthesis a.x-button:focus-visible { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .30), 0 0 0 5px #38E8FF; }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias .x-synthesis { background-image: none; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-findings article > span::before { forced-color-adjust: none; background: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias a.x-source { border-color: LinkText; color: LinkText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-synthesis-close { border-color: ButtonText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-synthesis a.x-button,
  .site-clean.tema-escuro main.experiencias .x-synthesis a.x-button:hover { forced-color-adjust: auto; border-color: ButtonText; background: ButtonFace; color: ButtonText; box-shadow: none; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.experiencias .x-synthesis { border-color: #6F8FB0; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(a.x-source, .x-synthesis-close) { border-color: #5B8CFF; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.experiencias .x-synthesis { background-image: var(--p6-cantos), linear-gradient(#0C192B, #0C192B); }
}

/* P6-EXP-04 · Análise documentada (#dossie): cartões F07 com nó numerado; a resposta
   (.x-answer) deixa de ser branca e vira R-VIDRO; revisão em vidro com cantoneiras; a ação
   "Considerar a proposta revisada" em R-CTA (igual à ação principal do §C). */
.site-clean.tema-escuro main.experiencias #dossie .x-claim {
  border: 1px solid var(--fx-borda, rgba(91, 140, 255, .30));
  border-radius: 14px;
  background:
    linear-gradient(90deg, rgba(56, 232, 255, 0), rgba(56, 232, 255, .85) 30%, rgba(91, 140, 255, .35) 80%, rgba(91, 140, 255, 0)) top / 100% 2px no-repeat,
    var(--luz-cartao, #0A1526);
  color: #F6F8FC;
  box-shadow: var(--p6-reflexo), var(--p6-halo);
  transition: none;
}
.site-clean.tema-escuro main.experiencias #dossie .x-claim:is(:hover, :focus-visible):not([aria-pressed="true"]) { border-color: var(--p6-ciano); }
.site-clean.tema-escuro main.experiencias #dossie .x-claim[aria-pressed="true"] {
  border-color: rgba(56, 232, 255, .45);
  box-shadow: var(--p6-reflexo), var(--p6-halo-forte);
}
.site-clean.tema-escuro main.experiencias #dossie .x-claim small { color: #93A7C2; }
.site-clean.tema-escuro main.experiencias #dossie .x-claim em { color: var(--p6-ciano); }
.site-clean.tema-escuro main.experiencias #dossie .x-claim > span[aria-hidden="true"] { color: var(--p6-ciano); }
/* Nó numerado (reaproveitado nos cenários e no fluxo das regras). */
.site-clean.tema-escuro main.experiencias :is(.x-claim-number, .x-rule-flow > div > span) {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 1px solid rgba(56, 232, 255, .75);
  border-radius: 50%;
  background: radial-gradient(circle, #0C192B, #03060D);
  color: var(--p6-ciano);
  font: 500 .72rem/1 var(--fonte-mono, "IBM Plex Mono", monospace);
  box-shadow: 0 0 0 3px rgba(56, 232, 255, .10), 0 0 12px rgba(56, 232, 255, .30);
}
.site-clean.tema-escuro main.experiencias #dossie .x-claims > .x-eyebrow { color: var(--p6-ciano); }
/* Versão ("Documentos iniciais"): pílula estática com o nó. */
.site-clean.tema-escuro main.experiencias .x-panel-heading .x-version {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: .35rem .9rem;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  box-shadow: var(--p6-reflexo);
  font: 500 .72rem/1.4 var(--fonte-mono, "IBM Plex Mono", monospace);
  letter-spacing: .06em;
}
.site-clean.tema-escuro main.experiencias .x-panel-heading .x-version::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: .6em;
  border-radius: 50%;
  background: var(--p6-ciano);
  box-shadow: var(--p6-no-sombra);
}
/* A resposta: vidro escuro no lugar do painel branco #f2f6fd. */
.site-clean.tema-escuro main.experiencias .x-answer {
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 18px;
  background: var(--p6-vidro);
  color: #B2C0D4;
  box-shadow: var(--p6-reflexo), var(--p6-halo);
}
.site-clean.tema-escuro main.experiencias .x-answer-head { background: none; }
.site-clean.tema-escuro main.experiencias .x-answer h3 { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias .x-answer-content { color: #B2C0D4; }
.site-clean.tema-escuro main.experiencias .x-answer blockquote {
  padding: .75rem 1rem;
  border-left: 2px solid rgba(56, 232, 255, .75);
  border-radius: 0 10px 10px 0;
  background: rgba(7, 16, 29, .72);
  color: #D3E1F4;
}
.site-clean.tema-escuro main.experiencias .x-answer-bottom { border-top-color: rgba(91, 140, 255, .18); }
.site-clean.tema-escuro main.experiencias .x-answer-bottom p { color: #B2C0D4; }
/* Perguntas da resposta: R-PILULA compacta; a pressionada é a pílula ativa da Home. */
.site-clean.tema-escuro main.experiencias :is(.x-questions, .x-clue-questions) button {
  min-height: 44px;
  padding: .35rem .85rem;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  box-shadow: var(--p6-reflexo);
  transition: none;
}
.site-clean.tema-escuro main.experiencias :is(.x-questions, .x-clue-questions) button:is(:hover, :focus-visible):not([aria-pressed="true"]) {
  border-color: var(--p6-ciano);
  box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22);
}
/* W19v (regra de Tiago "nenhum quadro com cor sólida"): a pergunta ativa era o degradê opaco azul → violeta;
   passa ao vidro aceso da vista ativa de /explorar/ (luz no canto, borda acesa nos 4 lados, anel 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.experiencias :is(.x-questions, .x-clue-questions) 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));
}
/* "Resposta do fornecedor": sai o tracejado, entra o vidro. */
.site-clean.tema-escuro main.experiencias .x-new-evidence {
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 14px;
  background: var(--p6-vidro);
  box-shadow: var(--p6-reflexo);
}
.site-clean.tema-escuro main.experiencias .x-new-evidence h3 { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias .x-new-evidence p { color: #B2C0D4; }
.site-clean.tema-escuro main.experiencias .x-new-evidence .x-small { color: #93A7C2; }
/* R-CTA na ação do painel (sem .botao--primario): hover igual ao repouso. */
.site-clean.tema-escuro main.experiencias [data-x-evidence-toggle],
.site-clean.tema-escuro main.experiencias [data-x-evidence-toggle]:hover {
  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.experiencias [data-x-evidence-toggle]:focus-visible { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .30), 0 0 0 5px #38E8FF; }
/* Nota de capacidade: vidro com o filete ciano à esquerda. */
.site-clean.tema-escuro main.experiencias .x-capacity-note {
  border: 1px solid var(--p6-borda-vidro);
  border-left: 2px solid rgba(56, 232, 255, .75);
  border-radius: 0 14px 14px 0;
  background: var(--p6-vidro);
  color: #B2C0D4;
  box-shadow: var(--p6-reflexo);
}
.site-clean.tema-escuro main.experiencias .x-capacity-note strong { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias .x-capacity-note p { color: #B2C0D4; }
.site-clean.tema-escuro main.experiencias .x-capacity-note a { color: var(--p6-ciano); }
/* Efeito da resposta: vidro com cantoneiras (sai o verde-petróleo chapado). */
.site-clean.tema-escuro main.experiencias .x-revision {
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 18px;
  background-color: transparent;
  background-image: var(--p6-cantos), var(--p6-vidro);
  background-position: var(--p6-cantos-pos), 0 0;
  background-size: var(--p6-cantos-tam), auto;
  background-repeat: no-repeat;
  box-shadow: var(--p6-reflexo), var(--p6-halo);
}
.site-clean.tema-escuro main.experiencias .x-revision h3,
.site-clean.tema-escuro main.experiencias .x-revision li strong { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias .x-revision li { border-bottom-color: rgba(91, 140, 255, .18); color: #B2C0D4; }
.site-clean.tema-escuro main.experiencias .x-revision p:last-child { color: #B2C0D4; }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias :is(#dossie .x-claim, .x-answer, .x-new-evidence, .x-capacity-note, .x-revision) { background: Canvas; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(.x-claim-number, .x-rule-flow > div > span) { forced-color-adjust: none; background: Canvas; color: CanvasText; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-panel-heading .x-version { border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-panel-heading .x-version::before { forced-color-adjust: none; background: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(.x-questions, .x-clue-questions) button { forced-color-adjust: none; border: 1px solid ButtonBorder; background: ButtonFace; color: ButtonText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(.x-questions, .x-clue-questions) button[aria-pressed="true"] { border: 1px solid Highlight; background: Highlight; color: HighlightText; }
  .site-clean.tema-escuro main.experiencias [data-x-evidence-toggle],
  .site-clean.tema-escuro main.experiencias [data-x-evidence-toggle]:hover { forced-color-adjust: auto; border-color: ButtonText; background: ButtonFace; color: ButtonText; box-shadow: none; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.experiencias :is(#dossie .x-claim, .x-answer, .x-new-evidence, .x-revision) { border-color: #6F8FB0; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(.x-questions, .x-clue-questions) button { border-color: #5B8CFF; }
  .site-clean.tema-escuro main.experiencias :is(.x-questions, .x-clue-questions) 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.experiencias :is(.x-answer, .x-new-evidence, .x-capacity-note) { background: #0C192B; }
  .site-clean.tema-escuro main.experiencias .x-revision { background-image: var(--p6-cantos), linear-gradient(#0C192B, #0C192B); }
  .site-clean.tema-escuro main.experiencias :is(.x-questions, .x-clue-questions) button[aria-pressed="true"] { background: #1D4A85; }
}

/* P6-EXP-05 · Cenários (#laboratorio): cartões de escolha em vidro com a escolha acesa em
   ciano; resultado em vidro com cantoneiras, sem grade; "Por que essa leitura?" com filete
   ciano; regras em R-DETALHE. Inclui os restos do laboratório (C1-02): o 2º fieldset
   (.x-policy), as legendas, o fluxo numerado, a matriz e as fontes. */
.site-clean.tema-escuro main.experiencias #laboratorio :is(.x-context, .x-policy) label {
  border: 1px solid var(--fx-borda, rgba(91, 140, 255, .30));
  border-radius: 14px;
  background: var(--luz-cartao, #0A1526);
  color: #F6F8FC;
  box-shadow: var(--p6-reflexo);
  transition: none;
}
.site-clean.tema-escuro main.experiencias #laboratorio :is(.x-context, .x-policy) label:has(input:checked) {
  border-color: #38E8FF;
  background: var(--luz-cartao, #0A1526);
  box-shadow: var(--p6-reflexo), var(--p6-halo-forte);
}
.site-clean.tema-escuro main.experiencias #laboratorio label small { color: #B2C0D4; }
.site-clean.tema-escuro main.experiencias #laboratorio input:is([type="radio"], [type="checkbox"]),
.site-clean.tema-escuro main.experiencias .x-evidence-check input { accent-color: #38E8FF; }
.site-clean.tema-escuro main.experiencias .x-evidence-check { color: #D3E1F4; }
.site-clean.tema-escuro main.experiencias .x-lab legend {
  font: 500 .75rem/1.4 var(--fonte-mono, "IBM Plex Mono", monospace);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--p6-ciano);
}
.site-clean.tema-escuro main.experiencias .x-lab legend::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 .75em .1em 0;
  border-radius: 50%;
  vertical-align: middle;
  background: var(--p6-ciano);
  box-shadow: var(--p6-no-sombra);
}
.site-clean.tema-escuro main.experiencias .x-lab-result {
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 18px;
  background-color: transparent;
  background-image: var(--p6-cantos), var(--p6-vidro);
  background-position: var(--p6-cantos-pos), 0 0;
  background-size: var(--p6-cantos-tam), auto;
  background-repeat: no-repeat;
  box-shadow: var(--p6-reflexo), var(--p6-halo);
}
.site-clean.tema-escuro main.experiencias .x-lab-result h3,
.site-clean.tema-escuro main.experiencias .x-rule-flow h4 { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias :is(.x-lab-summary, .x-rule-flow p, .x-lab-limit) { color: #B2C0D4; }
.site-clean.tema-escuro main.experiencias .x-rule-flow > div { border-top-color: rgba(91, 140, 255, .18); }
.site-clean.tema-escuro main.experiencias .x-lab-reason {
  border: 1px solid var(--p6-borda-vidro);
  border-left: 2px solid rgba(56, 232, 255, .75);
  border-radius: 0 12px 12px 0;
  background: rgba(7, 16, 29, .72);
}
.site-clean.tema-escuro main.experiencias .x-lab-reason strong { color: var(--p6-ciano); }
.site-clean.tema-escuro main.experiencias .x-lab-reason p { color: #B2C0D4; }
/* "Simulação de políticas" e o código do cenário: pílula estática com nó. */
.site-clean.tema-escuro main.experiencias .x-chip[data-x-lab-code]::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: .6em;
  border-radius: 50%;
  background: var(--p6-ciano);
  box-shadow: var(--p6-no-sombra);
}
/* Fontes do cenário: a pílula-fonte. */
.site-clean.tema-escuro main.experiencias .x-lab-sources a {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  margin: .25rem .4rem .25rem 0;
  padding: .1rem .6rem;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: var(--p6-ciano);
  font: 500 .75rem/1.4 var(--fonte-mono, "IBM Plex Mono", monospace);
  text-decoration: none;
}
.site-clean.tema-escuro main.experiencias .x-lab-sources a:is(:hover, :focus-visible) { border-color: var(--p6-ciano); }
/* R-DETALHE: "Comparar os critérios das duas políticas". */
.site-clean.tema-escuro main.experiencias details.x-rules {
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 18px;
  background: var(--p6-vidro);
  box-shadow: var(--p6-reflexo);
}
.site-clean.tema-escuro main.experiencias details.x-rules > summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 44px;
  color: #F6F8FC;
  cursor: pointer;
}
.site-clean.tema-escuro main.experiencias details.x-rules > summary::-webkit-details-marker { display: none; }
.site-clean.tema-escuro main.experiencias details.x-rules > summary::after {
  content: "+";
  content: "+" / "";
  font: 500 1rem var(--fonte-mono, "IBM Plex Mono", monospace);
  color: var(--p6-ciano);
}
.site-clean.tema-escuro main.experiencias details.x-rules[open] > summary::after { content: "\2212"; content: "\2212" / ""; }
.site-clean.tema-escuro main.experiencias .x-rule-matrix article {
  padding: 1rem;
  border: 1px solid var(--fx-borda, rgba(91, 140, 255, .30));
  border-radius: 14px;
  background:
    linear-gradient(90deg, rgba(56, 232, 255, 0), rgba(56, 232, 255, .6) 30%, rgba(91, 140, 255, .25) 80%, rgba(91, 140, 255, 0)) top / 100% 1px no-repeat,
    var(--luz-cartao, #0A1526);
}
.site-clean.tema-escuro main.experiencias .x-rule-matrix h3 { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias .x-rule-matrix p { color: #B2C0D4; }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias :is(#laboratorio :is(.x-context, .x-policy) label, .x-lab-result, .x-lab-reason, details.x-rules, .x-rule-matrix article) { background: Canvas; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias #laboratorio :is(.x-context, .x-policy) label:has(input:checked) { border-color: Highlight; }
  .site-clean.tema-escuro main.experiencias :is(.x-lab legend, .x-chip[data-x-lab-code])::before { forced-color-adjust: none; background: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-lab-sources a { border-color: LinkText; color: LinkText; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.experiencias :is(#laboratorio :is(.x-context, .x-policy) label, .x-lab-result, details.x-rules) { border-color: #6F8FB0; box-shadow: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.experiencias details.x-rules { background: #0C192B; }
  .site-clean.tema-escuro main.experiencias .x-lab-result { background-image: var(--p6-cantos), linear-gradient(#0C192B, #0C192B); }
}

/* P6-EXP-07 / COD-A6 · Pergunta ao caso (.x-ask): formulário F14 em vidro com cantoneiras;
   campo escuro R-CAMPO (sai o campo branco #f9fbff e o anel âmbar); "Consultar" em R-CTA;
   sugestões em R-PILULA; resultado em vidro com R-ROTULO e pílulas-fonte. */
.site-clean.tema-escuro main.experiencias .x-ask {
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 18px;
  background-color: transparent;
  background-image: var(--p6-cantos), var(--p6-vidro);
  background-position: var(--p6-cantos-pos), 0 0;
  background-size: var(--p6-cantos-tam), auto;
  background-repeat: no-repeat;
  box-shadow: var(--p6-reflexo), var(--p6-halo);
  color: #B2C0D4;
}
.site-clean.tema-escuro main.experiencias .x-ask h2 { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias .x-ask p:not(.x-eyebrow) { color: #B2C0D4; }
.site-clean.tema-escuro main.experiencias .x-ask form label { color: #D3E1F4; }
.site-clean.tema-escuro main.experiencias .x-ask .x-small { color: #93A7C2; }
.site-clean.tema-escuro main.experiencias #x-question-input {
  background: #07101D;
  color: #F6F8FC;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 12px;
  box-shadow: none;
}
.site-clean.tema-escuro main.experiencias #x-question-input::placeholder { color: #93A7C2; opacity: 1; }
.site-clean.tema-escuro main.experiencias #x-question-input:focus-visible {
  outline: 2px solid var(--p6-ciano);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(56, 232, 255, .18);
}
.site-clean.tema-escuro main.experiencias #x-question-input[aria-invalid="true"] {
  border-color: var(--fx-erro-borda, #E5484D);
  box-shadow: 0 0 0 3px rgba(229, 72, 77, .18);
}
.site-clean.tema-escuro main.experiencias .x-ask-input .x-button,
.site-clean.tema-escuro main.experiencias .x-ask-input .x-button:hover {
  border: 1px solid transparent;
  border-radius: 12px;
  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.experiencias .x-ask-input .x-button:focus-visible { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .30), 0 0 0 5px #38E8FF; }
.site-clean.tema-escuro main.experiencias .x-ask-input .x-button:disabled {
  background: linear-gradient(#0C192B, #0C192B) padding-box, linear-gradient(100deg, #3A6BB0, #3A6BB0) border-box;
  color: #93A7C2;
  box-shadow: none;
  opacity: 1;
}
.site-clean.tema-escuro main.experiencias .x-suggested button {
  min-height: 44px;
  padding: .35rem .85rem;
  border: 1px solid var(--p6-borda-controle);
  border-radius: 999px;
  background: var(--luz-chip-denso, rgba(4, 16, 29, .85));
  color: #EAF2FF;
  box-shadow: var(--p6-reflexo);
  transition: none;
}
.site-clean.tema-escuro main.experiencias .x-suggested button:is(:hover, :focus-visible) {
  border-color: var(--p6-ciano);
  box-shadow: 0 0 0 1px rgba(56, 232, 255, .25), 0 0 18px rgba(56, 232, 255, .22);
}
.site-clean.tema-escuro main.experiencias .x-ask-result {
  border: 1px solid var(--p6-borda-vidro);
  border-left: 2px solid rgba(56, 232, 255, .75);
  border-radius: 0 14px 14px 0;
  background: var(--p6-vidro);
  box-shadow: var(--p6-reflexo);
}
.site-clean.tema-escuro main.experiencias .x-ask-result h3 {
  font: 500 .75rem/1.4 var(--fonte-mono, "IBM Plex Mono", monospace);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--p6-ciano);
}
.site-clean.tema-escuro main.experiencias .x-ask-result h3::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 .75em .1em 0;
  border-radius: 50%;
  vertical-align: middle;
  background: var(--p6-ciano);
  box-shadow: var(--p6-no-sombra);
}
.site-clean.tema-escuro main.experiencias .x-ask-result p { color: #B2C0D4; }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias :is(.x-ask, .x-ask-result) { background: Canvas; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias #x-question-input { background: Field; color: FieldText; border-color: FieldText; }
  .site-clean.tema-escuro main.experiencias .x-ask-input .x-button,
  .site-clean.tema-escuro main.experiencias .x-ask-input .x-button:hover { forced-color-adjust: auto; border-color: ButtonText; background: ButtonFace; color: ButtonText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-suggested button { border-color: ButtonText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-ask-result h3::before { forced-color-adjust: none; background: CanvasText; box-shadow: none; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.experiencias .x-ask { border-color: #6F8FB0; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(#x-question-input, .x-suggested button) { border-color: #5B8CFF; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.experiencias .x-ask { background-image: var(--p6-cantos), linear-gradient(#0C192B, #0C192B); }
  .site-clean.tema-escuro main.experiencias .x-ask-result { background: #0C192B; }
}

/* P6-EXP-08 / COD-A7 · Documentos (details#documentos, E01–E08) e a biblioteca de alertas:
   R-DETALHE (resumo com +/−) e fichas F07 com cantoneiras (sai o #fff/#c6d4e8 da base e o
   chapado escuro #101d30); código E0n em R-ROTULO; citação em vidro com filete ciano. */
.site-clean.tema-escuro main.experiencias details.x-documents {
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 18px;
  background: var(--p6-vidro);
  color: #B2C0D4;
  box-shadow: var(--p6-reflexo), var(--p6-halo);
}
.site-clean.tema-escuro main.experiencias details.x-documents > summary {
  list-style: none;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .25rem 1.5rem;
  min-height: 44px;
  padding-right: 3.5rem;
  position: relative;
  color: #F6F8FC;
  cursor: pointer;
}
.site-clean.tema-escuro main.experiencias details.x-documents > summary::-webkit-details-marker { display: none; }
.site-clean.tema-escuro main.experiencias details.x-documents > summary::after {
  content: "+";
  content: "+" / "";
  position: absolute;
  right: 1.5rem;
  top: 50%;
  transform: translateY(-50%);
  font: 500 1rem var(--fonte-mono, "IBM Plex Mono", monospace);
  color: var(--p6-ciano);
}
.site-clean.tema-escuro main.experiencias details.x-documents[open] > summary::after { content: "\2212"; content: "\2212" / ""; }
.site-clean.tema-escuro main.experiencias details.x-documents > summary > span:first-child { color: #F6F8FC; margin-right: 0; }
.site-clean.tema-escuro main.experiencias details.x-documents > summary > span:last-child {
  font: 400 .78rem/1.5 var(--fonte-mono, "IBM Plex Mono", monospace);
  color: #93A7C2;
}
.site-clean.tema-escuro main.experiencias #documentos .x-document-list article {
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 18px;
  background-color: transparent;
  background-image: var(--p6-cantos), var(--luz-cartao, #0A1526);
  background-position: var(--p6-cantos-pos), 0 0;
  background-size: var(--p6-cantos-tam), auto;
  background-repeat: no-repeat;
  box-shadow: var(--p6-reflexo), var(--p6-halo);
}
.site-clean.tema-escuro main.experiencias .x-document-list :is(h2, h3, h4) { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias .x-document-list p:not(.x-eyebrow) { color: #B2C0D4; }
.site-clean.tema-escuro main.experiencias .x-document-list article > p:last-child { color: #93A7C2; }
.site-clean.tema-escuro main.experiencias .x-document-list blockquote {
  padding: .75rem 1rem;
  border-left: 2px solid rgba(56, 232, 255, .75);
  border-radius: 0 10px 10px 0;
  background: rgba(7, 16, 29, .72);
  color: #D3E1F4;
}
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias :is(details.x-documents, #documentos .x-document-list article) { background: Canvas; border-color: CanvasText; box-shadow: none; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.experiencias :is(details.x-documents, #documentos .x-document-list article) { border-color: #6F8FB0; box-shadow: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.experiencias details.x-documents { background: #0C192B; }
  .site-clean.tema-escuro main.experiencias #documentos .x-document-list article { background-image: var(--p6-cantos), linear-gradient(#0C192B, #0C192B); }
}

/* P6-EXP-09 · Alertas (#alertas e #alerta-*): R-ALERTA (vidro com borda âmbar e nó âmbar no
   rótulo); autenticidade e titular, que tratam de falha, na variante de erro; subtítulos no
   ritmo da P5. */
.site-clean.tema-escuro main.experiencias #alertas .x-document-list article {
  border: 1px solid var(--fx-alerta-borda, rgba(255, 197, 117, .55));
  border-radius: 18px;
  background: var(--p6-vidro);
  box-shadow: var(--p6-reflexo), 0 0 22px rgba(255, 197, 117, .08), 0 22px 56px rgba(0, 0, 0, .45);
}
.site-clean.tema-escuro main.experiencias #alertas .x-document-list article > .x-eyebrow { color: var(--fx-alerta, #FFC575); }
.site-clean.tema-escuro main.experiencias #alertas .x-document-list article > .x-eyebrow::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.experiencias #alertas :is(#alerta-autenticidade, #alerta-titular) { border-color: var(--fx-erro-borda, #E5484D); box-shadow: var(--p6-reflexo), 0 0 22px rgba(229, 72, 77, .10), 0 22px 56px rgba(0, 0, 0, .45); }
.site-clean.tema-escuro main.experiencias #alertas :is(#alerta-autenticidade, #alerta-titular) > .x-eyebrow { color: var(--fx-erro, #FF8A8A); }
.site-clean.tema-escuro main.experiencias #alertas :is(#alerta-autenticidade, #alerta-titular) > .x-eyebrow::before {
  background: #FF8A8A;
  box-shadow: 0 0 0 3px rgba(255, 138, 138, .14), 0 0 12px 2px rgba(255, 138, 138, .5);
}
.site-clean.tema-escuro main.experiencias #alertas .x-document-list article :is(h3, h4) {
  margin: 1rem 0 .5rem;
  font-size: clamp(1.05rem, 1.2vw, 1.2rem);
  color: #F6F8FC;
}
.site-clean.tema-escuro main.experiencias #alertas .x-document-list > p { color: #B2C0D4; }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias #alertas .x-document-list article { background: Canvas; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias #alertas .x-document-list article > .x-eyebrow::before { forced-color-adjust: none; background: CanvasText; box-shadow: none; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.experiencias #alertas .x-document-list article { box-shadow: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.experiencias #alertas .x-document-list article { background: #0C192B; }
}

/* P6-EXP-10 / COD-A8 · Caso curto (#caso-curto) e cartões da página: variante própria do F07
   (a exclusão :not(.caso-didatico *, .experiencias *) de futuro.css continua lá; aqui os
   cartões entram por seletor próprio). Conector luminoso com nó; resultado em vidro com
   cantoneiras; leitura extra em R-DETALHE; percurso em vidro sem grade. */
.site-clean.tema-escuro main.experiencias .caso-didatico .caso-fontes article {
  border: 1px solid var(--fx-borda, rgba(91, 140, 255, .30));
  border-radius: 18px;
  background:
    linear-gradient(90deg, rgba(56, 232, 255, 0), rgba(56, 232, 255, .85) 30%, rgba(91, 140, 255, .35) 80%, rgba(91, 140, 255, 0)) top / 100% 2px no-repeat,
    var(--luz-cartao, #0A1526);
  box-shadow: var(--p6-reflexo), var(--p6-halo);
}
.site-clean.tema-escuro main.experiencias :is(.caso-didatico .v-card, .pratica-percurso .v-card) {
  border-color: var(--fx-borda, rgba(91, 140, 255, .30));
  background: var(--luz-cartao, #0A1526);
  box-shadow: var(--p6-reflexo), var(--p6-halo);
  transition: transform .2s ease;
}
.site-clean.tema-escuro main.experiencias :is(.caso-didatico .v-card, .pratica-percurso .v-card)::before {
  inset: 0 18px auto; /* correção 2 da W19q: o fio fica na parte reta, longe da curva dos cantos */
  border-radius: 0;
  height: 2px;
  box-shadow: 0 0 14px 1px rgba(56, 232, 255, .45);
}
.site-clean.tema-escuro main.experiencias :is(.caso-didatico .v-card, .pratica-percurso .v-card)::after {
  content: "";
  position: absolute;
  inset: -1px;
  padding: 1px;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(56, 232, 255, .55), rgba(91, 140, 255, .18) 35%, rgba(91, 140, 255, .08));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}
/* Rótulos do caso curto (.caso-ref e a etiqueta) em R-ROTULO. */
.site-clean.tema-escuro main.experiencias .caso-didatico :is(.caso-ref, .abertura__etiqueta) {
  font: 500 .75rem/1.4 var(--fonte-mono, "IBM Plex Mono", monospace);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--p6-ciano);
}
.site-clean.tema-escuro main.experiencias .caso-didatico :is(.caso-ref, .abertura__etiqueta)::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 .75em .1em 0;
  border-radius: 50%;
  vertical-align: middle;
  background: var(--p6-ciano);
  box-shadow: var(--p6-no-sombra);
}
/* Conector ↔: linha de 2 px em gradiente com um nó central; o símbolo continua visível. */
.site-clean.tema-escuro main.experiencias .caso-didatico .caso-conector {
  position: relative;
  color: var(--p6-ciano);
  background: linear-gradient(90deg, rgba(56, 232, 255, .85), rgba(91, 140, 255, .35)) center / 100% 2px no-repeat;
}
.site-clean.tema-escuro main.experiencias .caso-didatico .caso-conector::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 22px;
  height: 22px;
  margin: -11px 0 0 -11px;
  border-radius: 50%;
  background: var(--fx-no, radial-gradient(circle, #FFFFFF 0 2px, #9FF6FF 3px, #38E8FF 5px, rgba(56, 232, 255, .40) 6.5px, rgba(11, 92, 232, .30) 8.5px, rgba(11, 92, 232, 0) 11px));
  pointer-events: none;
}
.site-clean.tema-escuro main.experiencias .caso-didatico .caso-conector { padding-bottom: 2.6rem; line-height: 1; }
.site-clean.tema-escuro main.experiencias .caso-didatico .caso-resultado {
  padding: clamp(1.5rem, 2.4vw, 2.25rem);
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 18px;
  background-color: transparent;
  background-image: var(--p6-cantos), var(--p6-vidro);
  background-position: var(--p6-cantos-pos), 0 0;
  background-size: var(--p6-cantos-tam), auto;
  background-repeat: no-repeat;
  box-shadow: var(--p6-reflexo), var(--p6-halo);
}
.site-clean.tema-escuro main.experiencias .caso-didatico :is(.caso-resultado h3, .caso-fontes h3) { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias .caso-didatico :is(.caso-resultado p:not(.caso-ref), .caso-fontes p:not(.caso-ref)) { color: #B2C0D4; }
/* R-DETALHE: "Uma nova evidência muda a conclusão?". */
.site-clean.tema-escuro main.experiencias .caso-didatico details.leitura-extra {
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 18px;
  background: var(--p6-vidro);
  box-shadow: var(--p6-reflexo);
}
.site-clean.tema-escuro main.experiencias .caso-didatico details.leitura-extra > summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 44px;
  padding: 1rem 1.25rem;
  color: #F6F8FC;
  cursor: pointer;
}
.site-clean.tema-escuro main.experiencias .caso-didatico details.leitura-extra > summary::-webkit-details-marker { display: none; }
.site-clean.tema-escuro main.experiencias .caso-didatico details.leitura-extra > summary::after {
  content: "+";
  content: "+" / "";
  font: 500 1rem var(--fonte-mono, "IBM Plex Mono", monospace);
  color: var(--p6-ciano);
}
.site-clean.tema-escuro main.experiencias .caso-didatico details.leitura-extra[open] > summary::after { content: "\2212"; content: "\2212" / ""; }
.site-clean.tema-escuro main.experiencias .caso-didatico details.leitura-extra > div { padding: 0 1.25rem 1.25rem; color: #B2C0D4; }
/* "Abrir a investigação completa": seta ciano com o nó. */
.site-clean.tema-escuro main.experiencias .caso-didatico .home-proximo > a { color: var(--p6-ciano); }
.site-clean.tema-escuro main.experiencias .caso-didatico .home-proximo > a::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin: 0 .6em .1em 0;
  border-radius: 50%;
  vertical-align: middle;
  background: var(--p6-ciano);
  box-shadow: var(--p6-no-sombra);
}
.site-clean.tema-escuro main.experiencias .caso-didatico .home-proximo > span { color: #93A7C2; }
/* "Veja o mesmo caso em cada dossiê" (#como-funciona): vidro sem grade, raio de 18 px (sai o
   #1B2E4A com raio de 24 px). O #id vence o F02 de futuro.css (.v-painel:not(:has(...))). */
.site-clean.tema-escuro main.experiencias #como-funciona.pratica-percurso {
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 18px;
  background-color: transparent;
  background-image: var(--p6-vidro);
  background-position: 0 0;
  background-size: auto;
  background-repeat: no-repeat;
  box-shadow: var(--p6-reflexo), var(--p6-halo);
}
@media (max-width: 720px) {
  .site-clean.tema-escuro main.experiencias :is(.caso-didatico .v-card, .pratica-percurso .v-card, .caso-didatico .caso-fontes article) { box-shadow: var(--p6-reflexo), 0 0 14px rgba(11, 92, 232, .20); }
  /* Empilhado, o conector é girado 90° (style.css): a linha de 100% da largura virava um risco
     vertical de ~360 px por cima dos textos de E01 e E04. Fica do tamanho do vão entre os cartões. */
  .site-clean.tema-escuro main.experiencias .caso-didatico .caso-conector { padding-bottom: 0; padding-right: 2.6rem; background-size: 2.75rem 2px; }
}
html:is(.vivo-calmo, .vivo-quieto, .vivo-parado) .site-clean.tema-escuro main.experiencias :is(.caso-didatico .v-card, .pratica-percurso .v-card) { transition: none; }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias :is(.caso-didatico .caso-fontes article, .caso-didatico .caso-resultado, .caso-didatico details.leitura-extra, #como-funciona.pratica-percurso) { background: Canvas; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(.caso-didatico .v-card, .pratica-percurso .v-card) { background: Canvas; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(.caso-didatico .v-card, .pratica-percurso .v-card)::after,
  .site-clean.tema-escuro main.experiencias .caso-didatico .caso-conector::before { display: none; }
  .site-clean.tema-escuro main.experiencias .caso-didatico .caso-conector { background: none; color: CanvasText; }
  .site-clean.tema-escuro main.experiencias .caso-didatico :is(.caso-ref, .abertura__etiqueta, .home-proximo > a)::before { forced-color-adjust: none; background: CanvasText; box-shadow: none; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.experiencias :is(.caso-didatico .v-card, .pratica-percurso .v-card, .caso-didatico .caso-fontes article) { border-color: #3A6BB0; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(.caso-didatico .v-card, .pratica-percurso .v-card)::after { display: none; }
  .site-clean.tema-escuro main.experiencias :is(.caso-didatico .caso-resultado, #como-funciona.pratica-percurso) { border-color: #6F8FB0; box-shadow: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.experiencias :is(.caso-didatico details.leitura-extra, #como-funciona.pratica-percurso) { background: #0C192B; }
  .site-clean.tema-escuro main.experiencias .caso-didatico .caso-resultado { background-image: var(--p6-cantos), linear-gradient(#0C192B, #0C192B); }
}

/* P6-EXP-11 · Fechamento (.x-closing): chamada final da P5 (D6) em vidro com cantoneiras, sem
   grade; o <strong> que já existia vai em gradiente (HTML). O .botao--primario recebe a ação
   principal do §C de futuro.css (regra única D0, G5): aqui não se repete a receita. */
.site-clean.tema-escuro main.experiencias .x-closing {
  margin: clamp(2rem, 4vw, 3rem) 0;
  padding: clamp(1.75rem, 3.5vw, 3rem);
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 18px;
  background-color: transparent;
  background-image: var(--p6-cantos), var(--p6-vidro);
  background-position: var(--p6-cantos-pos), 0 0;
  background-size: var(--p6-cantos-tam), auto;
  background-repeat: no-repeat;
  box-shadow: var(--p6-reflexo), var(--p6-halo);
}
.site-clean.tema-escuro main.experiencias .x-closing > p { color: #F6F8FC; }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias .x-closing { background: Canvas; border-color: CanvasText; box-shadow: none; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.experiencias .x-closing { border-color: #6F8FB0; box-shadow: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.experiencias .x-closing { background-image: var(--p6-cantos), linear-gradient(#0C192B, #0C192B); background-repeat: no-repeat; }
}

/* Restos do caso (revisão C1-02): o que sobrou das cores da W11/W17 e não entrou nos itens
   acima (perguntas do inspetor, .x-policy, legendas, fluxo e matriz já estão nos itens 04/05). */
.site-clean.tema-escuro main.experiencias .x-inspector .x-inspector-note {
  border-top: 1px solid rgba(91, 140, 255, .18);
  color: #B2C0D4;
}
.site-clean.tema-escuro main.experiencias .x-method-note {
  border-left: 2px solid rgba(56, 232, 255, .75);
  color: #B2C0D4;
}
.site-clean.tema-escuro main.experiencias .x-map-key i { height: 2px; background: linear-gradient(90deg, #38E8FF, #0B5CE8); }
.site-clean.tema-escuro main.experiencias .x-discovery :is(.x-discovery-top p, .x-small) { color: #B2C0D4; }
.site-clean.tema-escuro main.experiencias .x-immersive .x-discovery-top p { color: #C8F6FF; }
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias .x-map-key i { forced-color-adjust: none; background: CanvasText; }
  .site-clean.tema-escuro main.experiencias .x-method-note { border-left-color: CanvasText; }
}

/* Aviso .x-disclosure ("Demonstração com dados fictícios"): já aceitável; ganha moldura leve
   (R-VIDRO sem cantos, raio de 14 px) e o ponto vira o nó ciano. */
.site-clean.tema-escuro main.experiencias .x-disclosure {
  padding: .75rem 1rem;
  border: 1px solid var(--p6-borda-vidro);
  border-radius: 14px;
  background: var(--p6-vidro);
  color: #B2C0D4;
  box-shadow: var(--p6-reflexo);
}
.site-clean.tema-escuro main.experiencias .x-disclosure strong { color: #F6F8FC; }
.site-clean.tema-escuro main.experiencias .x-dot {
  width: 7px;
  height: 7px;
  background: var(--p6-ciano);
  box-shadow: var(--p6-no-sombra);
}
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias .x-disclosure { background: Canvas; border-color: CanvasText; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias .x-dot { forced-color-adjust: none; background: CanvasText; box-shadow: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.experiencias .x-disclosure { background: #0C192B; }
}

/* EXTRA-06 · Fundo nos modos quieto e parado: nada próprio do caso. Sem grade e sem os nós com
   linhas do canto (ordem de Tiago de 29/09 ~04h05; F-11 da raia FUNDO); o quadro estático é o do
   fundo de espaço, que já respeita os modos quieto e parado. */

/* EX-09 · Modos do caso (tabela do §1.5). As cores forçadas, o contraste reforçado e a
   transparência reduzida estão junto de cada item acima; aqui ficam movimento e impressão.
   G1 não cria laço infinito: só as entradas antigas (.is-entering/.is-updated, x-enter, só
   opacity/transform) e o deslocamento das escolhas da abertura. */
/* Calmo e movimento reduzido (as duas vias escritas separadas, C2-03): sem entrada. */
html.vivo-calmo .site-clean.tema-escuro main.experiencias :is(.x-panel, .x-discovery, .x-synthesis, .x-revision, .x-inspector, .x-answer-content, .x-lab-result):is(.is-entering, .is-updated) { animation: none !important; }
@media (prefers-reduced-motion: reduce) {
  .site-clean.tema-escuro main.experiencias :is(.x-panel, .x-discovery, .x-synthesis, .x-revision, .x-inspector, .x-answer-content, .x-lab-result):is(.is-entering, .is-updated) { animation: none !important; }
  .site-clean.tema-escuro main.experiencias :is(.x-choice-list button, .caso-didatico .v-card, .pratica-percurso .v-card) { transition: none !important; transform: none !important; }
}
/* Pausado, quieto e janela da conversa aberta: quadro fixo (none, não paused: M31). */
html:is(.vivo-parado, .vivo-quieto, .vivo-janela-aberta) .site-clean.tema-escuro main.experiencias :is(.x-panel, .x-discovery, .x-synthesis, .x-revision, .x-inspector, .x-answer-content, .x-lab-result):is(.is-entering, .is-updated) { animation: none !important; }
html:is(.vivo-parado, .vivo-quieto, .vivo-janela-aberta) .site-clean.tema-escuro main.experiencias :is(.x-choice-list button, .caso-didatico .v-card, .pratica-percurso .v-card) { transition: none !important; }

/* Impressão: fundo branco, texto preto, painéis com filete fino #999, gradiente de texto em
   preto sólido; cantoneiras, nós, halos e o conector luminoso somem. */
@media print {
  .site-clean.tema-escuro main.experiencias,
  .site-clean.tema-escuro main.experiencias :is(.x-panel, .x-company, .x-first-choice, .x-synthesis, #dossie .x-claim, .x-answer, .x-new-evidence, .x-capacity-note, .x-revision, #laboratorio :is(.x-context, .x-policy) label, .x-lab-result, .x-lab-reason, details.x-rules, .x-rule-matrix article, .x-ask, .x-ask-result, details.x-documents, .x-document-list article, .caso-didatico .caso-fontes article, .caso-didatico .caso-resultado, .caso-didatico details.leitura-extra, .caso-didatico .v-card, .pratica-percurso .v-card, #como-funciona.pratica-percurso, .x-closing, .x-disclosure, .x-tabs a, .x-chip, .x-version, a.x-source, .x-document-list blockquote, .x-answer blockquote, .x-choice-list button, .x-text-button, .x-panel-next a, .x-questions button, .x-clue-questions button, .x-suggested button, [data-x-evidence-toggle], .x-ask-input .x-button, #x-question-input, .x-synthesis-close, .x-synthesis a.x-button, .x-lab-sources a) {
    background: #FFFFFF !important;
    color: #000000 !important;
    border-color: #999999 !important;
    box-shadow: none !important;
  }
  .site-clean.tema-escuro main.experiencias :is(h1, h2, h3, h4, p, li, dt, dd, strong, small, em, span, a, label, legend, summary, blockquote) { color: #000000 !important; }
  .site-clean.tema-escuro main.experiencias .texto-gradiente { background: none !important; color: #000000 !important; -webkit-text-fill-color: #000000 !important; }
  .site-clean.tema-escuro main.experiencias :is(.x-eyebrow, .x-tabs a > span, .x-start-badge, .x-choice-start, .x-findings article > span, .x-version, .x-lab legend, .x-chip[data-x-lab-code], .x-ask-result h3, .caso-didatico .caso-ref, .caso-didatico .abertura__etiqueta, .caso-didatico .home-proximo > a, .caso-didatico .caso-conector, .caso-didatico .v-card)::before,
  .site-clean.tema-escuro main.experiencias :is(.caso-didatico .v-card, .pratica-percurso .v-card)::after { display: none !important; }
  .site-clean.tema-escuro main.experiencias .caso-didatico .caso-conector { background: none !important; }
  .site-clean.tema-escuro main.experiencias :is(.x-dot, .x-claim-number, .x-rule-flow > div > span, .x-company-monogram) { background: #FFFFFF !important; color: #000000 !important; border-color: #999999 !important; box-shadow: none !important; }
  .site-clean.tema-escuro main.experiencias .x-tabs a[aria-selected="true"] { border: 2px solid #000000 !important; }
}
/* ===========================================================================
   F12-LUZ · tarefa 2 (W19q, 06/10/2026). Tiago: "LUZ EM TODOS OS QUADROS, NENHUM QUADRO COM COR
   SOLIDA.. BORDA EM TODOS OS CARDS". No caso: os fundos chapados rgba(4, 16, 29, .85) viraram o vidro
   curto denso (--luz-chip-denso, futuro.css §A); as cantoneiras (--p6-cantos) ganharam o fio de luz do
   topo; o vidro (--fx-vidro) tem a luz no canto. Aqui: controles com o topo aceso, citações e notas
   que eram "fio azul na esquerda" passam a moldura inteira acesa, e o campo da pergunta vira vidro.
   Tudo estático (M44: hover e foco trocam na hora). O palco (.x-graph-viewport) não entra (M7).
   ========================================================================= */
@media (forced-colors: none) {
  .site-clean.tema-escuro main.experiencias :is(.x-tabs a, .x-text-button, .x-panel-next a, .x-chip, .x-choice-list button, a.x-source, .x-synthesis-close, .x-panel-heading .x-version, .x-questions button, .x-clue-questions button, .x-lab-sources a, .x-suggested button):where(:not(:hover):not(:focus-visible):not([aria-pressed="true"]):not([aria-current]):not([aria-selected="true"]):not(.ex-retry-button)),
  .site-clean.tema-escuro main.experiencias .x-immersive :is(.x-graph-toolbar button, .x-node-list button, .x-map-connect-bar .x-button, .map-clear, [data-x-clear], .x-space-close):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.experiencias :is(.x-tabs a, .x-text-button, .x-panel-next a, .x-chip, .x-choice-list button, a.x-source, .x-panel-heading .x-version, .x-questions button, .x-clue-questions button, .x-lab-sources a, .x-suggested button) {
    box-shadow: inset 0 1px 0 rgba(234, 253, 255, .10), 0 0 0 1px rgba(56, 232, 255, .05), 0 0 14px rgba(56, 232, 255, .10);
  }
  /* Citações dos documentos e da resposta, nota de capacidade, motivo do laboratório e resultado da
     pergunta: sai o fio de 2 px da esquerda; entra a moldura acesa nos 4 lados (mais viva no topo), o
     fio de luz do topo, o vidro com luz no canto e o halo curto. Correção 2: as espessuras da base
     ficam (2 px à esquerda, 1 px nos outros lados das notas), transparentes, e a moldura é desenhada
     por dentro (anel de sombra interna sobre o fundo recortado na caixa de preenchimento): nenhum
     texto se move. */
  .site-clean.tema-escuro main.experiencias :is(.x-inspector blockquote, .x-immersive .x-inspector blockquote, .x-answer blockquote, .x-document-list blockquote, .x-capacity-note, .x-lab-reason, .x-ask-result) {
    border-color: transparent;
    border-radius: 12px;
    background: var(--luz-fio), var(--fx-vidro);
    background-clip: padding-box;
    box-shadow: inset 0 1px 0 rgba(56, 232, 255, .62), inset 0 0 0 1px rgba(91, 140, 255, .42), inset 0 2px 0 rgba(234, 253, 255, .08), 0 0 0 1px rgba(56, 232, 255, .05), 0 0 18px rgba(56, 232, 255, .10);
  }
  /* A citação do leitor de documentos e a nota de método não tinham caixa nem folga: a moldura acesa
     fica por fora (pseudo-elemento atrás do texto), sem folga nova. */
  .site-clean.tema-escuro main.experiencias :is(.x-document-reader blockquote, .x-method-note) { position: relative; isolation: isolate; border-left-color: transparent; }
  .site-clean.tema-escuro main.experiencias :is(.x-document-reader blockquote, .x-method-note)::before {
    content: "";
    position: absolute;
    inset: -.5rem -.75rem -.5rem -2px;
    z-index: -1;
    border: 1px solid;
    border-color: rgba(56, 232, 255, .55) rgba(91, 140, 255, .42) rgba(91, 140, 255, .30) rgba(91, 140, 255, .42);
    border-radius: 12px;
    background: var(--luz-fio), var(--fx-vidro);
    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);
    pointer-events: none;
  }
  .site-clean.tema-escuro main.experiencias .x-document-reader blockquote::before { left: -.75rem; }
  /* Campo da pergunta: vidro escuro com luz no canto (o texto digitado continua sobre fundo quase preto). */
  .site-clean.tema-escuro main.experiencias #x-question-input:where(:not(:focus):not([aria-invalid="true"])) { border-top-color: rgba(56, 232, 255, .80); }
  .site-clean.tema-escuro main.experiencias #x-question-input { background: var(--luz-campo, #07101D); box-shadow: inset 0 1px 0 rgba(234, 253, 255, .06); }
}
@media (forced-colors: active) {
  .site-clean.tema-escuro main.experiencias :is(.x-inspector blockquote, .x-immersive .x-inspector blockquote, .x-answer blockquote, .x-document-list blockquote, .x-capacity-note, .x-lab-reason, .x-ask-result) { border-color: CanvasText; background: Canvas; box-shadow: none; }
  .site-clean.tema-escuro main.experiencias :is(.x-document-reader blockquote, .x-method-note)::before { display: none; }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.experiencias :is(.x-inspector blockquote, .x-immersive .x-inspector blockquote, .x-answer blockquote, .x-document-list blockquote, .x-capacity-note, .x-lab-reason, .x-ask-result) { box-shadow: inset 0 0 0 1px #6F8FB0; }
  .site-clean.tema-escuro main.experiencias :is(.x-document-reader blockquote, .x-method-note)::before { border-color: #6F8FB0; box-shadow: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.experiencias :is(.x-inspector blockquote, .x-immersive .x-inspector blockquote, .x-answer blockquote, .x-document-list blockquote, .x-capacity-note, .x-lab-reason, .x-ask-result),
  .site-clean.tema-escuro main.experiencias :is(.x-document-reader blockquote, .x-method-note)::before { background: #0C192B; }
}
@media print {
  .site-clean.tema-escuro main.experiencias :is(.x-inspector blockquote, .x-immersive .x-inspector blockquote, .x-answer blockquote, .x-document-list blockquote, .x-capacity-note, .x-lab-reason, .x-ask-result) { border-color: #999 !important; background: none !important; box-shadow: none !important; }
  .site-clean.tema-escuro main.experiencias :is(.x-document-reader blockquote, .x-method-note)::before { display: none !important; }
}
/* F12-LUZ · tarefa 2 (cont.): fio de luz no topo dos quadros grandes do caso que não usam as
   cantoneiras, alertas com o fio na cor do próprio alerta, o percurso (#como-funciona) de volta ao
   vidro com cantoneiras (o FID-05 de fundo-espaco.css o deixava transparente, por um #id no :is) e a
   "Leitura do percurso", que era só um filete, como quadro aceso. */
@media (forced-colors: none) {
  .site-clean.tema-escuro main.experiencias :is(details.x-documents, .x-disclosure) { background: var(--luz-fio), var(--p6-vidro); }
  .site-clean.tema-escuro main.experiencias .x-disclosure {
    border-color: rgba(56, 232, 255, .55) rgba(91, 140, 255, .42) rgba(91, 140, 255, .30) rgba(91, 140, 255, .42);
    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);
  }
  .site-clean.tema-escuro main.experiencias #alertas .x-document-list article {
    background:
      linear-gradient(90deg, rgba(255, 197, 117, 0), rgba(255, 197, 117, .85) 30%, #FFF3DD 50%, rgba(255, 197, 117, .85) 70%, rgba(255, 197, 117, 0)) 50% 0 / 76% 1px no-repeat,
      radial-gradient(50% 100% at 50% 0%, rgba(255, 197, 117, .16), rgba(255, 197, 117, 0)) 50% 0 / 76% 16px no-repeat,
      var(--p6-vidro);
  }
  .site-clean.tema-escuro main.experiencias #alertas :is(#alerta-autenticidade, #alerta-titular) {
    background:
      linear-gradient(90deg, rgba(255, 138, 138, 0), rgba(255, 138, 138, .85) 30%, #FFE4E4 50%, rgba(255, 138, 138, .85) 70%, rgba(255, 138, 138, 0)) 50% 0 / 76% 1px no-repeat,
      radial-gradient(50% 100% at 50% 0%, rgba(229, 72, 77, .18), rgba(229, 72, 77, 0)) 50% 0 / 76% 16px no-repeat,
      var(--p6-vidro);
  }
  html.tem-fundo-espaco .site-clean.tema-escuro main.experiencias #como-funciona.pratica-percurso.v-painel {
    border-color: var(--luz-borda, rgba(91, 140, 255, .38));
    background: var(--luz-cantos), var(--luz-fio), var(--p6-vidro);
  }
  /* Correção 2: a folga e a largura da base ficam (o texto não se move); a moldura acesa fica por
     fora, num pseudo-elemento atrás do texto, e o filete de cima da base fica transparente. */
  html .site-clean.tema-escuro main.experiencias .pratica-leitura {
    position: relative;
    isolation: isolate;
    border-top-color: transparent;
    border-image: none;
  }
  html .site-clean.tema-escuro main.experiencias .pratica-leitura::before {
    content: "";
    position: absolute;
    inset: clamp(.75rem, 2vw, 1.5rem) calc(-1 * clamp(.75rem, 2.5vw, 2rem)) calc(-1 * clamp(.75rem, 2vw, 1.5rem));
    z-index: -1;
    border: 1px solid;
    border-color: rgba(56, 232, 255, .55) rgba(91, 140, 255, .42) rgba(91, 140, 255, .30) rgba(91, 140, 255, .42);
    border-radius: 18px;
    background: var(--luz-fio), var(--luz-canto), var(--luz-vidro);
    box-shadow: inset 0 1px 0 rgba(234, 253, 255, .10), inset 0 0 48px rgba(56, 232, 255, .045), 0 0 0 1px rgba(56, 232, 255, .05), 0 0 34px rgba(56, 232, 255, .10);
    pointer-events: none;
  }
}
@media (forced-colors: active) {
  html .site-clean.tema-escuro main.experiencias .pratica-leitura { border-top-color: CanvasText; border-image: none; }
  html .site-clean.tema-escuro main.experiencias .pratica-leitura::before { display: none; }
}
@media (prefers-reduced-transparency: reduce) {
  html .site-clean.tema-escuro main.experiencias .pratica-leitura::before,
  html.tem-fundo-espaco .site-clean.tema-escuro main.experiencias #como-funciona.pratica-percurso.v-painel { background: #0C192B; }
}
@media print {
  html .site-clean.tema-escuro main.experiencias .pratica-leitura { border-top-color: #999 !important; }
  html .site-clean.tema-escuro main.experiencias .pratica-leitura::before { display: none !important; }
}
/* F12-LUZ · correção 2 (W19q): os quadros que só aparecem ao abrir ("Uma nova evidência muda a
   conclusão?", "Comparar os critérios das duas políticas" e os seis cartões dele, a revisão da Lumea e
   a resposta "Documentos e justificativa") com o fio de luz do topo e o halo, como os outros. Estático. */
@media (forced-colors: none) {
  .site-clean.tema-escuro main.experiencias :is(.caso-didatico details.leitura-extra, .x-new-evidence, details.x-rules, .x-answer) {
    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(--p6-vidro);
    box-shadow: var(--p6-reflexo), var(--p6-halo);
  }
  .site-clean.tema-escuro main.experiencias .x-rule-matrix article {
    border-color: rgba(56, 232, 255, .50) rgba(91, 140, 255, .40) rgba(91, 140, 255, .28) rgba(91, 140, 255, .40);
    background: var(--luz-fio), var(--luz-canto), var(--luz-cartao, #0A1526);
    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, .12);
  }
}
@media (prefers-contrast: more) {
  .site-clean.tema-escuro main.experiencias :is(.caso-didatico details.leitura-extra, .x-new-evidence, details.x-rules, .x-answer, .x-rule-matrix article) { border-color: #6F8FB0; box-shadow: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .site-clean.tema-escuro main.experiencias :is(.caso-didatico details.leitura-extra, .x-new-evidence, details.x-rules, .x-answer, .x-rule-matrix article) { background: var(--luz-fio), #0C192B; }
}
