/* tools/revisao/revisao.css — o site da revisão guiada.

   O visual é o do protótipo aprovado pelo Marcelo (prototipos/revisao-guiada/
   index.html, CSS das linhas 10 a 736): fundo escuro, lilás de destaque,
   Archivo + JetBrains Mono, menu lateral de 248 px com o trilho de passos,
   o item no palco e a decisão à direita. As classes são as do protótipo, sem
   renomear (contrato de DOM: docs/superpowers/plans/2026-11-03-revisao-guiada-
   casar-prototipo.md, seção 3).

   Três cuidados que o protótipo não precisava ter:

   1. A página do tema carrega o CSS INTEIRO da casca antes deste arquivo, e a
      figura (.rv-palco) é conteúdo da aula: tokens, fonte e regras são os da
      casca. Por isso os tokens daqui levam o prefixo --rv- (a casca já usa
      --ink, --fonte, --topo, --ease-out, --line...), e nenhuma regra de
      elemento (p, h1, button, a...) é global: todas param na .rv-palco
      (`:not(.rv-palco *)`). As classes genéricas que a casca e o molde também
      usam (.btn, .barra, .palco, .passos, .grupo, .legenda) vêm sempre com
      o pai ou com a mesma trava.
   2. A casca põe `html{font-size:17.5px}`: aqui tudo é em px, como no
      protótipo.
   3. Grade de 8: os 10, 14, 18 e 22 do protótipo viraram 8, 16 e 24; o 4 e
      o 12 ficam como meio passo. Alvo de toque de 48 nos botões de ação e,
      no celular, em todo o trilho e na faixa de telas. */

/* ---------- tokens ---------- */
:root{
  --rv-bg:#070910; --rv-sup:#0f1319; --rv-sup2:#141a22;
  --rv-linha:rgba(255,255,255,.09); --rv-linha2:rgba(255,255,255,.16); --rv-veu:rgba(255,255,255,.045);
  --rv-ink:#f4f6f8; --rv-sec:#98a0ab; --rv-ter:#7d8592;
  --rv-con:#b886da; --rv-con-ink:#1a1022; --rv-con-hover:#c99ae6;
  --rv-ec:#25b892; --rv-mm:#26ace0; --rv-qs:#fbbf24; --rv-cr:#f47a6b; --rv-cr-ink:#1a0806; --rv-ec-ink:#06140c;
  --rv-fonte:'Archivo',-apple-system,'Segoe UI','Helvetica Neue',Arial,sans-serif;
  --rv-mono:'JetBrains Mono',ui-monospace,Consolas,monospace;
  --rv-topo:60px; --rv-r:12px;
  --rv-ease:cubic-bezier(.23,1,.32,1); --rv-base-mix:#2b2e34;
}
@media (min-width:861px){ :root{--rv-topo:0px} }

/* ---------- base (só no painel; a figura fica com a casca) ---------- */
html:has(> body.rv){height:auto;color-scheme:dark;scroll-padding-top:var(--rv-topo);scroll-padding-bottom:0}
body.rv{height:auto;min-height:100vh;margin:0;overflow:visible;display:block;background:var(--rv-bg);color:var(--rv-ink);
  font:16px/1.5 var(--rv-fonte);-webkit-font-smoothing:antialiased}
:where(.rv) :where(h1,h2,h3):where(:not(.rv-palco *)){text-wrap:balance;font-family:var(--rv-fonte);color:inherit}
:where(.rv) p:where(:not(.rv-palco *)){margin:0}
:where(.rv) a:where(:not(.rv-palco *)){color:inherit}
:where(.rv) button:where(:not(.rv-palco *)){font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;text-align:inherit}
:where(.rv) textarea:where(:not(.rv-palco *)){font:inherit;color:inherit}
.rv ::selection{background:rgba(184,134,218,.35)}
.rv-palco ::selection{background:revert}
.rv .sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.rv svg.i,.rv svg.ic{display:inline-block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.rv .mono{font-family:var(--rv-mono)}
.rv :is(button,a,textarea,input,summary,select):not(.rv-palco *):focus-visible{outline:2px solid var(--rv-mm);outline-offset:2px}
/* Os artigos do tema que não estão na vez, o motivo fechado, o balão sem dica. */
.rv [hidden]:not(.rv-palco *){display:none!important}

/* Barra de rolagem do painel: fina, sem setas, no tom das linhas. Só nas
   áreas escuras: na figura clara ela sumiria. */
html:has(> body.rv)::-webkit-scrollbar,.rv :is(.lat-tema,.lat-ini,.palco,.decisao,.faixa,.esteira,.passos-m)::-webkit-scrollbar{width:12px;height:12px}
html:has(> body.rv)::-webkit-scrollbar-track,.rv :is(.lat-tema,.lat-ini,.palco,.decisao,.faixa,.esteira)::-webkit-scrollbar-track{background:transparent}
html:has(> body.rv)::-webkit-scrollbar-button,.rv :is(.lat-tema,.lat-ini,.palco,.decisao,.faixa,.esteira)::-webkit-scrollbar-button{display:none}
html:has(> body.rv)::-webkit-scrollbar-thumb,.rv :is(.lat-tema,.lat-ini,.palco,.decisao,.faixa,.esteira)::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14) padding-box;border:3px solid transparent;border-radius:8px}
html:has(> body.rv)::-webkit-scrollbar-thumb:hover,.rv :is(.lat-tema,.lat-ini,.palco,.decisao,.faixa,.esteira)::-webkit-scrollbar-thumb:hover{background-color:rgba(255,255,255,.28)}
@supports not selector(::-webkit-scrollbar){
  html:has(> body.rv),.rv :is(.lat-tema,.lat-ini,.palco,.decisao,.faixa,.esteira){scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.18) transparent}
}

/* ---------- menu lateral (o da fábrica) ---------- */
.rv .shell{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}
.rv .lat{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:24px 16px 16px;background:var(--rv-sup);border-right:1px solid var(--rv-linha);min-width:0;z-index:20}
.rv .lat .marca{display:flex;align-items:center;gap:8px;text-decoration:none;padding:4px 8px 24px;cursor:pointer;color:var(--rv-ink)}
.rv .lat .marca svg{display:block;width:32px;height:20px;flex:none}
.rv .lat .marca b{font-weight:700;font-size:15px;letter-spacing:-.01em;line-height:1.15;display:block}
.rv .lat .marca small{display:block;font:500 11px/1 var(--rv-mono);color:var(--rv-qs);letter-spacing:.06em;text-transform:uppercase;margin-top:4px}
.rv .lat nav{display:flex;flex-direction:column;gap:2px}
.rv .lat nav a{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--rv-sec);padding:8px 12px;border-radius:8px;font-size:14.5px;font-weight:500;cursor:pointer;transition:color .12s ease,background-color .12s ease}
.rv .lat nav a svg{width:16px;height:16px;opacity:.8}
.rv .lat nav a:hover,.rv .lat nav a.on{color:var(--rv-ink);background:var(--rv-veu)}
.rv .lat nav a.on svg{color:var(--rv-con);opacity:1}
.rv .lat nav a .n{margin-left:auto;font:500 11px/1 var(--rv-mono);color:var(--rv-ter)}
.rv .lat .grupo{margin-top:24px;padding:0 12px 8px;border-top:0;font:500 11px/1 var(--rv-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--rv-ter);display:flex;justify-content:space-between}
.rv .lat .uso-l{display:flex;flex-direction:column;gap:1px}
.rv .lat .uso-l :is(a,.it){display:block;text-decoration:none;color:var(--rv-sec);padding:8px 12px 8px 24px;border-radius:8px;font-size:13.5px;line-height:1.3;position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;transition:color .12s ease,background-color .12s ease}
.rv .lat .uso-l :is(a,.it)::before{content:"";position:absolute;left:12px;top:50%;translate:0 -50%;width:5px;height:5px;border-radius:50%;background:var(--c,var(--rv-con))}
.rv .lat .uso-l a:hover{color:var(--rv-ink);background:var(--rv-veu)}
.rv .lat .uso-l :is(a,.it) small{font:500 11px/1 var(--rv-mono);color:var(--rv-ter);margin-left:8px}
.rv .lat .uso-l .it{cursor:default}
.rv .lat .pe{margin-top:auto;padding:16px 12px 0;border-top:1px solid var(--rv-linha);display:flex;align-items:center;gap:8px}
.rv .lat .pe .av{width:32px;height:32px;border-radius:8px;display:grid;place-items:center;font:700 12px/1 var(--rv-mono);background:rgba(184,134,218,.16);color:var(--rv-con);flex:none;text-transform:uppercase}
.rv .lat .pe .av:empty{display:none}
.rv .lat .pe .q{min-width:0;flex:1}
.rv .lat .pe b{display:block;font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rv .lat .pe small{display:block;font-size:12px;color:var(--rv-ter)}
.rv .lat .sair{color:var(--rv-sec);font-size:13px;padding:8px;border-radius:8px;flex:none;transition:color .12s ease,background-color .12s ease}
.rv .lat .sair:hover{color:var(--rv-ink);background:var(--rv-veu)}

/* O menu vira o trilho dos passos na página do tema. No índice, quem
   aparece é a .lat-ini (ou a .lat-tema, se for a única). */
.rv .lat-ini{display:flex;flex-direction:column;min-height:0;flex:1;overflow:auto}
.rv .lat-tema{display:flex;flex-direction:column;min-height:0;flex:1;overflow:auto;margin:0 -4px;padding:0 4px}
.rv .lat:has(.lat-ini) .lat-tema{display:none}
.rv .shell[data-vista=tema] .lat-ini{display:none}
.rv .shell[data-vista=tema] .lat .lat-tema{display:flex}
.rv .volta{display:inline-flex;align-items:center;gap:8px;min-height:32px;color:var(--rv-sec);text-decoration:none;font-size:14px;margin:0 0 12px 8px;padding:4px 0;cursor:pointer;transition:color .12s ease;align-self:flex-start}
.rv .volta:not(:has(svg))::before{content:"←";font-size:15px;line-height:1;transition:translate .16s var(--rv-ease)}
.rv .volta:hover{color:var(--rv-ink)}
.rv .volta svg{transition:translate .16s var(--rv-ease)}
@media (hover:hover) and (pointer:fine){ .rv .volta:hover svg,.rv .volta:hover::before{translate:-2px 0} }
.rv .lat-tema .eyebrow{padding:0 8px;margin-bottom:8px}
.rv .lat .lat-tema h2{font-size:16px;font-weight:600;letter-spacing:-.01em;line-height:1.3;margin:0;padding:0 8px}
.rv .prog{display:flex;align-items:center;gap:8px;margin:16px 8px 0;font:500 12px/1 var(--rv-mono);color:var(--rv-ter)}
/* .barra é também a barra de progresso da casca (144 px, gradiente): o pai vence. */
.rv .prog .barra{position:relative;flex:1;width:auto;height:5px;border-radius:3px;background:var(--rv-veu);overflow:hidden}
.rv .prog .barra i{display:block;height:100%;width:0;background:var(--rv-con);border-radius:3px}
.rv .lat .passos,.rv .passos-m{list-style:none;margin:0;padding:0;counter-reset:none;display:flex;flex-direction:column;gap:2px}
.rv .passo{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:8px;align-items:center;width:100%;min-height:48px;text-align:left;padding:8px;border-radius:8px;color:var(--rv-sec);transition:color .12s ease,background-color .12s ease}
.rv .passo:not([disabled]):hover,.rv .passo.ativo{color:var(--rv-ink);background:var(--rv-veu)}
.rv .passo .pt{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:1.5px solid var(--rv-linha2);color:var(--rv-sec);font:600 12px/1 var(--rv-mono)}
.rv .passo.ativo .pt{border-color:var(--rv-con);color:var(--rv-con)}
.rv .passo.feito .pt{background:var(--rv-con);border-color:var(--rv-con);color:var(--rv-con-ink)}
.rv .passo.feito .pt svg{width:14px;height:14px;stroke-width:2.4}
.rv .passo.pendente .pt{background:var(--rv-cr);border-color:var(--rv-cr);color:var(--rv-cr-ink)}
.rv .passo b{display:block;font-size:14px;font-weight:600;line-height:1.3}
.rv .passo small{display:block;font-size:12.5px;color:var(--rv-ter);line-height:1.35;margin-top:1px}
.rv .passo .n{font:500 11px/1 var(--rv-mono);color:var(--rv-ter)}
/* Passo desligado (o caso, que entra na semana 2; o mapa, onde não há):
   legível, sem hover e sem cara de clicável. */
.rv .passo[disabled],.rv .passo[aria-disabled=true]{cursor:default;color:var(--rv-ter);background:none}
.rv .passo[disabled] .pt,.rv .passo[aria-disabled=true] .pt{border-style:dashed;color:var(--rv-ter)}
.rv .passo[disabled] small,.rv .passo[aria-disabled=true] small{color:var(--rv-ter);font-style:italic}
.rv .aprovado-antes{margin:16px 4px 0;padding:12px 16px;border-radius:10px;background:var(--rv-veu);font-size:13px;line-height:1.5;color:var(--rv-sec)}
.rv .aprovado-antes .bd{margin-bottom:8px}
.rv .aprovado-antes a{color:var(--rv-con);text-decoration:none;cursor:pointer}
.rv .aprovado-antes a:hover{text-decoration:underline}
/* Sem caixa configurada: a decisão fica só neste navegador. */
.rv .rv-faixa--local{margin:12px 4px 0;padding:12px 16px;border-radius:10px;border:1px solid color-mix(in srgb,var(--rv-qs) 40%,transparent);background:color-mix(in srgb,var(--rv-qs) 8%,transparent);color:var(--rv-qs);font-size:13px;font-weight:600;line-height:1.5;display:grid;gap:8px}
.rv .rv-faixa--local button{justify-self:start;min-height:32px;padding:0 12px;border-radius:8px;border:1px solid color-mix(in srgb,var(--rv-qs) 50%,transparent);color:var(--rv-qs);font-size:13px;font-weight:600;transition:background-color .12s ease}
.rv .rv-faixa--local button:hover{background:color-mix(in srgb,var(--rv-qs) 12%,transparent)}
.rv .passos-m{display:none}
.rv .wrap .rv-faixa--local{margin:0 0 24px}

/* ---------- geral ---------- */
.rv .wrap{max-width:1120px;margin:0 auto;padding:32px 24px 96px}
.rv .eyebrow{font:500 12px/1.3 var(--rv-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--rv-con);margin:0 0 12px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rv .eyebrow span{color:var(--rv-sec)}
.rv h1:not(.rv-palco *){font-size:clamp(26px,3.4vw,36px);line-height:1.12;letter-spacing:-.02em;font-weight:700;margin:0 0 8px;font-stretch:98%}
.rv h1:not(.rv-palco *) em{font-style:normal;color:var(--rv-con)}
.rv h2:not(.rv-palco *){font-size:18px;font-weight:600;letter-spacing:-.01em;margin:0 0 12px}
.rv .cab .sub,.rv .wrap > .sub{color:var(--rv-sec);margin:0;max-width:62ch}
.rv .cab .sub a,.rv .rv-link{color:var(--rv-con);font-weight:600;text-underline-offset:4px}
.rv .cab{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 24px;margin-bottom:32px}
.rv .card{background:var(--rv-sup);border:1px solid var(--rv-linha);border-radius:var(--rv-r)}
.rv .card.pad{padding:24px}
.rv section:not(.rv-palco *){margin-bottom:32px}
.rv .sec-t{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}
.rv .sec-t h2{margin:0;font-size:16px}
.rv .sec-t .n{font:500 12px/1 var(--rv-mono);color:var(--rv-sec)}

/* ---------- botões: com cara de botão ----------
   `.btn` é também o botão da casca (borda de 2, 48 de altura, sobe no
   hover): aqui ele vem com a trava da figura e vence a casca. `.rv-btn` é o
   nome da P1, mantido para o que ainda o emitir. */
.rv :is(.btn,.rv-btn):not(.rv-palco *){display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;min-height:0;padding:0 16px;border-radius:10px;border:1px solid var(--rv-linha2);background:var(--rv-veu);color:var(--rv-ink);
  font:600 14.5px/1 var(--rv-fonte);text-decoration:none;white-space:nowrap;cursor:pointer;box-shadow:none;
  transition:transform .16s var(--rv-ease),background-color .16s ease,border-color .16s ease,color .16s ease}
.rv :is(.btn,.rv-btn):not(.rv-palco *) svg{width:16px;height:16px}
.rv :is(.btn,.rv-btn):not(.rv-palco *):hover{background:rgba(255,255,255,.08);transform:none;box-shadow:none}
.rv :is(.btn,.rv-btn):not(.rv-palco *):active{transform:scale(.97)}
.rv :is(.btn,.rv-btn):not(.rv-palco *):focus-visible{outline:2px solid var(--rv-mm);outline-offset:2px}
.rv :is(.btn.pri,.rv-btn--cta):not(.rv-palco *){background:var(--rv-con);border-color:var(--rv-con);color:var(--rv-con-ink)}
.rv :is(.btn.pri,.rv-btn--cta):not(.rv-palco *):hover{background:var(--rv-con-hover);border-color:var(--rv-con-hover)}
.rv :is(.btn.sm,.rv-btn--fino):not(.rv-palco *){height:32px;padding:0 12px;font-size:13px;gap:8px;border-radius:8px}
.rv .btn.lg:not(.rv-palco *){height:48px;font-size:15px}
.rv .btn.gh:not(.rv-palco *){border-color:transparent;background:transparent;color:var(--rv-sec)}
.rv .btn.gh:not(.rv-palco *):hover{color:var(--rv-ink);background:var(--rv-veu)}
.rv .btn.traco:not(.rv-palco *){--c:var(--cor,var(--rv-con));border-color:var(--c);background:transparent;color:var(--c);padding:0 12px}
.rv .btn.traco:not(.rv-palco *):hover{background:color-mix(in srgb,var(--c) 12%,transparent)}
.rv :is(.btn.peri,.rv-btn--nao):not(.rv-palco *){border-color:color-mix(in srgb,var(--rv-cr) 50%,transparent);color:var(--rv-cr);background:transparent}
.rv :is(.btn.peri,.rv-btn--nao):not(.rv-palco *):hover{background:color-mix(in srgb,var(--rv-cr) 12%,transparent)}
.rv :is(.btn.peri.cheio,.rv-btn--nao[aria-pressed=true],.rv-reprova .rv-btn--nao[type=submit]):not(.rv-palco *){background:var(--rv-cr);border-color:var(--rv-cr);color:var(--rv-cr-ink)}
.rv .btn.peri.aberto:not(.rv-palco *){border-color:var(--rv-cr);background:color-mix(in srgb,var(--rv-cr) 12%,transparent)}
.rv .rv-btn--ok:not(.rv-palco *){border-color:color-mix(in srgb,var(--rv-ec) 50%,transparent);color:var(--rv-ec);background:transparent}
.rv .rv-btn--ok[aria-pressed=true]:not(.rv-palco *){background:var(--rv-ec);border-color:var(--rv-ec);color:var(--rv-ec-ink)}
.rv :is(.btn,.rv-btn):not(.rv-palco *):is([disabled],[aria-disabled=true]){opacity:.4;cursor:not-allowed;transform:none}

/* ---------- estados ---------- */
.rv .bd{display:inline-flex;align-items:center;gap:8px;font:700 11px/1 var(--rv-mono);letter-spacing:.1em;text-transform:uppercase;padding:4px 8px;border-radius:6px;color:var(--c,var(--rv-sec));background:color-mix(in srgb,var(--c,var(--rv-sec)) 14%,transparent);white-space:nowrap}
.rv .bd::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--c,var(--rv-sec))}
.rv .bd[data-e=ok]{--c:var(--rv-ec)} .rv .bd[data-e=espera]{--c:var(--rv-qs)} .rv .bd[data-e=gerando]{--c:var(--rv-mm)} .rv .bd[data-e=err]{--c:var(--rv-cr)} .rv .bd[data-e=fila]{--c:var(--rv-sec)} .rv .bd[data-e=proxima]{--c:var(--rv-con)}
.rv .bd[data-e=gerando]::before{animation:rv-pulsa 1.2s ease-in-out infinite}
@keyframes rv-pulsa{0%,100%{opacity:.35}50%{opacity:1}}
.rv .orb{width:20px;height:20px;border-radius:50%;background:conic-gradient(var(--rv-con) 0 25%,var(--rv-mm) 0 50%,var(--rv-con-hover) 0 75%,rgba(184,134,218,.2) 0);animation:rv-gira 1s linear infinite;flex:none;margin-top:2px}
@keyframes rv-gira{to{transform:rotate(360deg)}}

/* ---------- início: a grade dos temas ---------- */
.rv .dh{overflow:hidden;padding-bottom:24px}
.rv .dh__cab{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:flex-start;justify-content:space-between;padding:24px 24px 0}
.rv .dh__cab h3{margin:0;font-size:18px;font-weight:600;letter-spacing:-.01em}
.rv .dh__cab small{display:block;font-size:13px;color:var(--rv-ter);margin-top:4px}
.rv .temas{list-style:none;margin:0;display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:8px;padding:16px 24px 0}
.rv .temas > li{display:contents}
/* Cada tema: o número, a conta e a barra, no tom do estado. Âmbar espera
   você, verde é tudo decidido, coral tem reprovação, tracejado não foi
   gerado nesta rodada. */
.rv .rv-tema{--c:var(--rv-qs);position:relative;display:grid;grid-template-rows:auto auto;justify-items:center;align-content:center;gap:4px;min-height:64px;padding:8px 4px 12px;border-radius:8px;
  border:1px solid color-mix(in srgb,var(--c) 35%,transparent);background:color-mix(in srgb,var(--c) 14%,transparent);color:color-mix(in srgb,var(--c) 75%,#fff);text-decoration:none;
  transition:transform .16s var(--rv-ease),filter .12s ease}
.rv a.rv-tema:hover{filter:brightness(1.25)}
@media (hover:hover) and (pointer:fine){ .rv a.rv-tema:hover{transform:translateY(-1px)} }
.rv a.rv-tema:active{transform:scale(.96)}
.rv .rv-tema__n{font:700 12.5px/1 var(--rv-mono);white-space:nowrap}
.rv .rv-tema__t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rv .rv-tema__conta{font:500 10.5px/1 var(--rv-mono);color:color-mix(in srgb,var(--c) 55%,var(--rv-sec));white-space:nowrap}
.rv .rv-barra{position:absolute;left:8px;right:8px;bottom:6px;display:block;height:3px;border-radius:2px;background:rgba(255,255,255,.08);overflow:hidden}
.rv .rv-barra i{display:block;height:100%;width:0;background:var(--c);border-radius:2px}
.rv .rv-tema[data-feito=true],.rv .rv-tema[data-estado=aprovado]{--c:var(--rv-ec)}
.rv .rv-tema[data-estado=reprovado]{--c:var(--rv-cr)}
.rv .rv-tema[aria-current],.rv .rv-tema.atual{border-color:var(--c);background:color-mix(in srgb,var(--c) 22%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 16%,transparent)}
.rv .rv-tema--fora{--c:var(--rv-ter);background:transparent;border-style:dashed;border-color:var(--rv-linha2);color:var(--rv-ter);cursor:default}
.rv .rv-tema--fora .rv-tema__conta{font-size:0}
.rv .rv-tema--fora .rv-tema__conta::after{content:"—";font-size:10.5px}
.rv .dh .legenda{display:flex;gap:8px 16px;flex-wrap:wrap;padding:16px 24px 0;font-size:13px;color:var(--rv-sec)}
.rv .dh .legenda span{display:inline-flex;align-items:center;gap:8px}
.rv .dh .legenda i{width:7px;height:7px;border-radius:50%;background:var(--c)}
.rv .dh .legenda .dica{color:var(--rv-qs);font-weight:600;margin-left:auto}

/* ---------- revisão: o item no centro, a decisão à direita ---------- */
.rv .rev{display:grid;grid-template-columns:minmax(0,1fr) 380px;height:100vh;min-width:0}
.rv .rev > .palco{overflow:auto;min-width:0;padding:32px max(32px,calc((100% - 960px) / 2)) 72px}
/* A pauta, o alt e o link vêm como irmãos do .pauta, direto no palco. */
.rv .rev > .palco > :is(.rv-pauta,.rv-conferir){margin-top:12px}
.rv .rev > .palco > .rv-alt{margin-top:8px}
.rv .rev > .palco > :is(a,button):is(.btn,.rv-btn){margin-top:8px}
.rv .item__cab{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.rv .item__cab > div:first-child{flex:1 1 320px;min-width:0}
.rv .item__cab .eyebrow{margin-bottom:8px}
.rv .item__cab h1{font-size:clamp(22px,2.4vw,28px);margin:0}
.rv .item__nav{display:flex;gap:8px}
.rv .item__nav .btn:not(.rv-palco *){width:40px;padding:0}
.rv .item__nav:empty{display:none}
.rv .quadro{border:1px solid var(--rv-linha2);border-radius:var(--rv-r);overflow:hidden;background:#fff}
.rv .quadro > iframe{display:block;width:100%;border:0;background:#fff;min-height:240px}

/* Onde a figura mora na aula, e a figura entre o parágrafo anterior e o
   seguinte. A área é CLARA e é da casca: tokens, fonte e regras da aula. */
.rv .rv-onde{margin:0 0 8px;font:500 12px/1.5 var(--rv-mono);letter-spacing:.02em;color:var(--rv-ter)}
.rv .quadro.rv-palco{overflow:visible;position:relative;padding:32px;background:var(--mist,#f6f7fc);color:var(--ink,#181d4a);
  font-family:var(--fonte);font-size:1rem;line-height:1.65;color-scheme:light;-webkit-font-smoothing:antialiased}
.rv .rv-palco__viz{opacity:.6}
.rv .rv-palco__viz:empty{display:none}
.rv .rv-palco__fig{position:relative;margin:24px 0;outline:2px dashed var(--rv-con);outline-offset:8px;border-radius:4px}
.rv .rv-palco__viz:empty + .rv-palco__fig{margin-top:8px}
.rv .rv-palco__fig:has(+ .rv-palco__viz:empty){margin-bottom:8px}
/* Marcando na figura: o contorno vira coral e o cursor vira mira. */
.rv :is(.rv-palco,.rv-palco__fig).marcando .rv-palco__fig,.rv .rv-palco__fig.marcando{outline-color:color-mix(in srgb,var(--rv-cr) 70%,transparent);cursor:crosshair}
.rv :is(.rv-palco,.rv-palco__fig).marcando .rv-palco__fig *,.rv .rv-palco__fig.marcando *{cursor:crosshair}
.rv .rv-palco__fig .rg-mira{outline:2px dashed var(--rv-cr)!important;outline-offset:2px;cursor:crosshair!important}
/* O alfinete: o mesmo pino que o protótipo injeta na tela da aula. */
.rv .rg-pino{--t:calc(24px*var(--rg-k,1));position:absolute;z-index:5;width:var(--t);height:var(--t);margin:calc(var(--t)*-1.1) 0 0 calc(var(--t)*-.5);pointer-events:none;display:grid;place-items:center;
  border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--rv-cr);box-shadow:0 2px 6px rgba(0,0,0,.35);border:calc(2px*var(--rg-k,1)) solid #fff;box-sizing:border-box}
.rv .rg-pino b{transform:rotate(45deg);font:700 calc(11px*var(--rg-k,1))/1 var(--rv-mono);color:var(--rv-cr-ink)}
.rv .rg-pino.novo{transition:scale 180ms var(--rv-ease),translate 180ms var(--rv-ease),opacity 100ms linear}
@starting-style{ .rv .rg-pino.novo{scale:.6;translate:0 8px;opacity:0} }
.rv .rg-pino.antigo{opacity:.85}

/* A esteira: as figuras do tema, a atual em destaque, com o estado de cada uma. */
.rv .esteira{margin-top:16px;display:flex;gap:8px;overflow-x:auto;padding:8px 4px;scroll-snap-type:x proximity}
.rv .esteira__item{flex:none;width:56px;min-height:56px;scroll-snap-align:center;display:grid;place-items:center;padding:8px;border-radius:10px;border:1px solid var(--rv-linha);background:var(--rv-sup);color:var(--rv-sec);position:relative;font:600 12px/1 var(--rv-mono);transition:border-color .12s ease,background-color .12s ease,transform .16s var(--rv-ease)}
.rv .esteira__item:hover{border-color:var(--rv-linha2);color:var(--rv-ink)}
.rv .esteira__item:active{transform:scale(.96)}
.rv .esteira__item .arte{width:40px;height:40px;background:#fff;border-radius:6px;overflow:hidden;display:block}
.rv .esteira__item .arte svg{width:100%;height:100%;display:block}
.rv .esteira__item .arte img{width:100%;height:100%;object-fit:cover;display:block}
.rv .esteira__item b{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rv .esteira__item.ativo{border-color:var(--rv-con);color:var(--rv-ink);background:color-mix(in srgb,var(--rv-con) 14%,var(--rv-sup));box-shadow:0 0 0 3px rgba(184,134,218,.18)}
.rv .esteira__item.ok{border-color:color-mix(in srgb,var(--rv-ec) 60%,transparent)}
.rv .esteira__item.err{border-color:color-mix(in srgb,var(--rv-cr) 60%,transparent)}
.rv .esteira__item .marca{position:absolute;top:-8px;right:-8px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;color:#07130e}
.rv .esteira__item .marca svg{width:11px;height:11px;stroke-width:3}
.rv .esteira__item.ok .marca{background:var(--rv-ec)}
.rv .esteira__item.err .marca{background:var(--rv-cr);color:var(--rv-cr-ink)}
.rv .esteira__item.rasc{border-style:dashed;border-color:var(--rv-cr)}
.rv .esteira__item.rasc .marca{background:var(--rv-sup);color:var(--rv-cr);box-shadow:inset 0 0 0 1.5px var(--rv-cr)}
.rv .esteira__fig{flex:none;writing-mode:vertical-rl;transform:rotate(180deg);font:500 11px var(--rv-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--rv-ter);align-self:center;padding:0 2px;border-left:1px solid var(--rv-linha2)}

/* A pauta: como decidir, o que cada parte precisa mostrar, o que conferir. */
.rv .pauta{margin-top:24px;display:grid;gap:12px}
.rv .quadro + .pauta{margin-top:16px}
.rv .pauta .card p{color:var(--rv-sec);line-height:1.6;font-size:15px;max-width:72ch}
.rv .pauta .card p + p{margin-top:8px}
.rv .pauta .card .eyebrow{margin-bottom:8px}
.rv .pauta__ajuda{font-size:13.5px;color:var(--rv-ter)}
.rv .pauta--topo{margin:0 0 24px}
.rv .pauta > .btn:not(.rv-palco *),.rv .pauta > .rv-btn:not(.rv-palco *){justify-self:start}
.rv :is(.rv-pauta,.rv-conferir){padding:24px;border-radius:var(--rv-r);background:var(--rv-sup);border:1px solid var(--rv-linha);font-size:15px;line-height:1.6;color:var(--rv-sec)}
.rv .rv-conferir{border-color:color-mix(in srgb,var(--rv-con) 35%,transparent);background:color-mix(in srgb,var(--rv-con) 6%,var(--rv-sup))}
.rv :is(.rv-pauta,.rv-conferir) h3{margin:0 0 8px;font:500 12px/1.3 var(--rv-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--rv-con)}
.rv :is(.rv-pauta,.rv-conferir) ul{margin:0;padding-left:20px}
.rv :is(.rv-pauta,.rv-conferir) li + li{margin-top:8px}
.rv :is(.rv-pauta,.rv-conferir) li b{color:var(--rv-ink);font-weight:600}
.rv .rv-regente{display:inline-block;margin-top:4px;font:500 12px/1.5 var(--rv-mono);color:var(--rv-qs)}
.rv :is(.rv-alt,.rv-telas,details.mais){color:var(--rv-sec);font-size:14px}
.rv :is(.rv-alt,.rv-telas,details.mais) summary{cursor:pointer;color:var(--rv-sec);font-size:14px;min-height:40px;padding:8px 0;list-style:none;display:inline-flex;gap:8px;align-items:center;transition:color .12s ease}
.rv :is(.rv-alt,.rv-telas,details.mais) summary::-webkit-details-marker{display:none}
.rv :is(.rv-alt,.rv-telas,details.mais) summary::before{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;rotate:-45deg;translate:0 -1px;transition:rotate .16s var(--rv-ease)}
.rv :is(.rv-alt,.rv-telas,details.mais)[open] summary::before{rotate:45deg;translate:0 -2px}
.rv :is(.rv-alt,.rv-telas,details.mais) summary:hover{color:var(--rv-ink)}
.rv .rv-alt p{margin:8px 0 0;padding:8px 16px;border-left:2px solid var(--rv-linha2);line-height:1.6;max-width:72ch}
.rv .rv-telas ol{margin:8px 0 0;padding-left:32px;columns:2 240px;column-gap:32px;line-height:1.7}
.rv .rv-telas li{break-inside:avoid}
.rv .rv-telas{margin-top:8px}
.rv .rv-aula__acoes{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0}
.rv .rv-aula__acoes :is(.btn,.rv-btn):not(.rv-palco *){height:48px}
.rv .rv-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:0 0 16px;color:var(--rv-sec);font-size:14px}
.rv .rv-meta code{font:500 13px/1.4 var(--rv-mono);color:var(--rv-sec)}
.rv .rv-erro{padding:16px;border-radius:10px;border:1px solid color-mix(in srgb,var(--rv-cr) 45%,transparent);background:color-mix(in srgb,var(--rv-cr) 8%,transparent);color:var(--rv-cr);font-weight:600}

/* Faixa das telas: onde ela está, o que já aprovou, reprovou e deixou pela metade. */
.rv .faixa{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 12px;margin:0 0 16px}
.rv .faixa__item{flex:none;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:8px;row-gap:4px;align-items:center;min-width:128px;max-width:176px;min-height:48px;padding:8px 12px 8px 8px;border-radius:10px;border:1px solid var(--rv-linha);background:var(--rv-sup);text-align:left;color:var(--rv-sec);transition:border-color .12s ease,background-color .12s ease,transform .16s var(--rv-ease)}
.rv .faixa__item:hover{border-color:var(--rv-linha2);color:var(--rv-ink)}
.rv .faixa__item:active{transform:scale(.97)}
.rv .faixa__item.ativo,.rv .faixa__item[aria-current]{border-color:var(--rv-con);color:var(--rv-ink);background:color-mix(in srgb,var(--rv-con) 14%,var(--rv-sup))}
.rv .faixa__item.ok{border-color:color-mix(in srgb,var(--rv-ec) 55%,transparent)}
.rv .faixa__item.err{border-color:color-mix(in srgb,var(--rv-cr) 60%,transparent)}
.rv .faixa__item.rasc{border-style:dashed;border-color:var(--rv-cr)}
.rv .faixa__n{grid-row:1/3;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font:600 11px/1 var(--rv-mono);border:1.5px solid var(--rv-linha2)}
.rv .faixa__item.ok .faixa__n{background:var(--rv-ec);border-color:var(--rv-ec);color:var(--rv-ec-ink)}
.rv .faixa__item:is(.err,.rasc) .faixa__n{background:var(--rv-cr);border-color:var(--rv-cr);color:var(--rv-cr-ink)}
.rv .faixa__nm{font-size:13px;font-weight:600;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rv .faixa__item:not(:has(.faixa__st)) .faixa__nm{grid-row:1/3}
.rv .faixa__st{display:flex;align-items:center;gap:8px;font:500 11px/1 var(--rv-mono);color:var(--rv-ter)}
.rv .faixa__st svg{width:14px;height:14px;stroke-width:1.8}
.rv .faixa__st .sim{color:var(--rv-ec)}
.rv .faixa__st .sim svg{stroke-width:2.4}
.rv .faixa__st em{font-style:normal;color:var(--rv-cr)}

/* Rodadas: "1. Desktop" e "2. Celular", e a tela cheia. */
.rv .vistas{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:16px}
.rv .vistas__grupo{display:flex;gap:8px;flex-wrap:wrap}
.rv .vistas .dica{margin-left:auto;font-size:13px;color:var(--rv-ter)}
.rv .vistas .cheia-btn:not(.rv-palco *){margin-left:auto;height:40px;gap:8px}
.rv .vistas .cheia-btn svg{width:18px;height:18px}
.rv .chip{--ex:var(--rv-sec);display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 12px;border-radius:10px;border:1px solid var(--rv-linha);background:transparent;color:var(--rv-sec);font-size:13.5px;font-weight:600;cursor:pointer;
  transition:border-color .16s ease,color .16s ease,background-color .16s ease,transform .16s var(--rv-ease)}
.rv .chip:hover{border-color:color-mix(in srgb,var(--ex) 60%,var(--rv-base-mix));color:var(--rv-ink)}
.rv .chip:active{transform:scale(.98)}
.rv .chip:is(.on,[aria-pressed=true]){color:color-mix(in srgb,var(--ex) 70%,#fff);border-color:color-mix(in srgb,var(--ex) 45%,var(--rv-base-mix));
  background:color-mix(in srgb,var(--ex) 16%,#0b0e14) linear-gradient(160deg,color-mix(in srgb,var(--ex) 24%,#0b0e14) 0%,color-mix(in srgb,var(--ex) 9%,#0b0e14) 70%)}
.rv .chip[disabled]{opacity:.4;cursor:not-allowed;transform:none}
.rv .vistas .chip{--ex:var(--rv-con)}
.rv .vistas .chip .ok{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--rv-ec);color:var(--rv-ec-ink)}
.rv .vistas .chip .ok svg{width:12px;height:12px;stroke-width:3}
.rv .chip .n{font:500 11px/1 var(--rv-mono);color:var(--rv-ter);margin-left:2px}
.rv .chip.so-ico{width:40px;height:40px;min-height:40px;padding:0;justify-content:center}
.rv .chip.so-ico svg{width:20px;height:20px}

/* Desktop e celular. */
.rv .duplo{display:grid;grid-template-columns:minmax(0,1fr) min(415px,40%);gap:16px;align-items:start}
.rv .duplo--cel{grid-template-columns:minmax(0,1fr)}
.rv .duplo--cel .frame--desk{display:none}
.rv .duplo--cel .frame--cel{max-width:100%;margin:0 auto}
.rv .duplo--desk{grid-template-columns:minmax(0,1fr)}
.rv .duplo--desk .frame--cel{display:none}
.rv .frame{position:relative;min-width:0}
.rv .frame__rot{display:flex;align-items:center;justify-content:center;gap:8px;min-height:32px;font:500 11px/1.3 var(--rv-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--rv-ter);margin-bottom:8px}
.rv .frame__rot .btn:not(.rv-palco *){font-family:inherit;letter-spacing:0;text-transform:none}
.rv .frame__rot .mt{display:none;color:var(--rv-cr);letter-spacing:.04em}
.rv .frame.marcando .frame__rot .mt{display:inline}
.rv .frame.marcando .frame__rot .nm{display:none}
.rv .frame.marcando .fone,.rv .frame.marcando.frame--desk .frame__caixa{outline:2px dashed color-mix(in srgb,var(--rv-cr) 70%,transparent);outline-offset:6px}
.rv .frame__caixa{position:relative;overflow:hidden;border:1px solid var(--rv-linha2);border-radius:10px;background:#fff}
.rv .frame__caixa iframe{position:absolute;top:0;left:0;border:0;transform-origin:0 0;background:#fff}
.rv .frame--cel .frame__caixa{overflow:visible;border:0;border-radius:0;background:none;padding:0;box-shadow:none}
/* O celular é o iPhone do site da fábrica: aro, ilha, barra de status e
   indicador. A tela é 375 x 812; a aula ocupa 375 x 740. O JS escala. */
.rv .fone{position:absolute;top:6px;left:9px;transform-origin:0 0;width:397px;height:834px;padding:11px;border-radius:62px;background:#0a0b0e;
  box-shadow:0 0 0 1.5px #1c1e23,0 0 0 3.5px #8d9199,0 0 0 4.5px #4a4d54,0 0 0 5.5px #25272c,inset 0 0 0 1px rgba(255,255,255,.07),0 40px 60px -38px rgba(0,0,0,.7)}
.rv .fone::before,.rv .fone::after{content:"";position:absolute;width:4px;border-radius:2px;background:linear-gradient(90deg,#5d6068,#9a9ea6 50%,#5d6068)}
.rv .fone::before{left:-8.5px;top:128px;height:196px;-webkit-mask:linear-gradient(#000 0 30px,transparent 30px 58px,#000 58px 120px,transparent 120px 134px,#000 134px);mask:linear-gradient(#000 0 30px,transparent 30px 58px,#000 58px 120px,transparent 120px 134px,#000 134px)}
.rv .fone::after{right:-8.5px;top:212px;height:98px}
.rv .fone__tela{display:flex;flex-direction:column;height:100%;border-radius:51px;overflow:hidden;background:#fff;isolation:isolate}
.rv .fone__status{display:flex;position:absolute;z-index:2;top:11px;left:11px;right:11px;height:50px;align-items:center;justify-content:space-between;padding:4px 32px 0 40px;border-radius:51px 51px 0 0;background:#fff;color:#0b0c0f;font:600 15.5px/1 -apple-system,'SF Pro Text','Segoe UI',system-ui,sans-serif;letter-spacing:-.01em}
.rv .fone__ic{display:flex;align-items:center;gap:4px}
.rv .fone__ic svg{display:block;height:11.5px;width:auto;fill:currentColor}
.rv .fone__bat{position:relative;width:25px;height:12px;border:1.2px solid rgba(11,12,15,.4);border-radius:4px;padding:1.5px}
.rv .fone__bat::after{content:"";position:absolute;right:-3.5px;top:3.5px;width:1.6px;height:3.6px;border-radius:0 1px 1px 0;background:rgba(11,12,15,.45)}
.rv .fone__bat i{display:block;width:78%;height:100%;border-radius:1.6px;background:currentColor}
.rv .fone__ilha{position:absolute;z-index:3;top:22px;left:50%;width:122px;height:35px;margin-left:-61px;border-radius:20px;background:#000;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}
.rv .fone__ilha::after{content:"";position:absolute;right:13px;top:11px;width:13px;height:13px;border-radius:50%;background:radial-gradient(circle at 40% 38%,#2b3346 0 22%,#0d0f15 50%)}
.rv .fone__home{position:absolute;z-index:3;bottom:20px;left:50%;width:128px;height:5px;margin-left:-64px;border-radius:3px;background:#111317;opacity:.82}
.rv .fone .fone__tela iframe{position:static;display:block;flex:none;width:375px;height:740px;margin:48px 0 24px;border:0;transform:none;background:#fff}

/* No celular, enquanto marca: a barra de baixo diz quantos pontos e leva ao Guardar. */
.rv .barra-marcar{display:none}

/* ---------- decisão ---------- */
.rv .decisao{background:var(--rv-sup);border-left:1px solid var(--rv-linha);display:flex;flex-direction:column;overflow:auto;min-width:0}
.rv .decisao > .rv-decisao{display:flex;flex-direction:column;flex:1 0 auto}
.rv .decisao__cab{padding:24px 24px 16px;border-bottom:1px solid var(--rv-linha)}
.rv .decisao__cab .eyebrow{margin-bottom:8px}
.rv .decisao__cab h2{font-size:16px;margin:0}
.rv .decisao__corpo{padding:24px;display:grid;gap:16px;align-content:start;flex:1}
.rv .pergunta{font-size:19px;font-weight:600;line-height:1.35;letter-spacing:-.01em}
.rv .pergunta small{display:block;font-weight:400;color:var(--rv-sec);font-size:14px;line-height:1.5;margin-top:8px;letter-spacing:0}
.rv .acoes{display:grid;gap:8px}
.rv .acoes :is(.btn,.rv-btn):not(.rv-palco *){width:100%;height:48px}
.rv .acoes .btn.sm:not(.rv-palco *){height:40px}
.rv .ja{justify-self:start}
.rv .par-check{padding:16px;border-radius:10px;background:var(--rv-veu);font-size:14px}
.rv .par-check .eyebrow{margin-bottom:8px;color:var(--rv-qs)}
.rv .par-check ul{margin:0;padding-left:20px;color:var(--rv-sec);line-height:1.55}
.rv .par-check small{display:block;margin-top:8px;color:var(--rv-ter);font-size:12.5px}
.rv .motivo{display:grid;gap:8px}
.rv .motivo .eyebrow{margin:4px 0 0;color:var(--rv-cr)}
.rv .chips{display:flex;flex-wrap:wrap;gap:8px}
.rv .motivo .chip{--ex:var(--rv-cr);min-height:36px;font-size:13px;font-weight:500}
.rv .campo,.rv .rv-campo :is(input,textarea){width:100%;min-height:112px;padding:12px 16px;border-radius:10px;border:1px solid var(--rv-linha2);background:var(--rv-bg);color:var(--rv-ink);font:400 15px/1.45 var(--rv-fonte);resize:vertical;transition:border-color .15s ease,box-shadow .15s ease}
.rv .rv-campo input{min-height:48px;resize:none}
.rv :is(.campo,.rv-campo input,.rv-campo textarea)::placeholder{color:var(--rv-ter)}
.rv :is(.campo,.rv-campo input,.rv-campo textarea):focus{border-color:var(--rv-con);outline:none;box-shadow:0 0 0 3px rgba(184,134,218,.25)}
.rv .campo.erro{border-color:var(--rv-cr)}
.rv .motivo label,.rv .rv-campo{display:grid;gap:8px;font-size:14px;font-weight:600;color:var(--rv-ink)}
.rv .motivo label .campo{min-height:88px;font-weight:400}
.rv .motivo label small{font-size:12.5px;font-weight:400;color:var(--rv-ter);margin-top:-4px}
.rv .motivo .falta{margin:-2px 0 0;font-size:13px;color:var(--rv-cr)}
.rv .dica{font-size:13px;color:var(--rv-ter);line-height:1.5}
.rv .classif{margin:0;font-size:13.5px;line-height:1.5;color:var(--rv-sec)}
.rv .classif b{color:var(--rv-ink);font-weight:600}
/* Os motivos da P1 (caixa de seleção), para o que ainda os emitir. */
.rv .rv-motivo{display:flex;align-items:center;gap:12px;min-height:48px;cursor:pointer;font-size:14px;color:var(--rv-ink)}
.rv .rv-motivo input{width:20px;height:20px;margin:0;accent-color:var(--rv-cr);flex:none}

/* Modo alfinete: reprovar é tocar no defeito. */
.rv .marcar-aviso{display:flex;gap:8px;align-items:flex-start;padding:16px;border-radius:10px;border:1px dashed color-mix(in srgb,var(--rv-cr) 55%,transparent);background:color-mix(in srgb,var(--rv-cr) 8%,transparent);font-size:14px;line-height:1.5;color:var(--rv-ink)}
.rv .marcar-aviso svg{width:20px;height:20px;flex:none;color:var(--rv-cr);margin-top:1px}
.rv .marcar-aviso small{display:block;color:var(--rv-sec);font-size:12.5px;margin-top:2px}
.rv .pinos{list-style:none;display:grid;gap:8px;margin:0;padding:0}
.rv .pinos li{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:8px 12px;align-items:start;padding:12px 16px;border:1px solid var(--rv-linha);border-radius:10px;background:var(--rv-bg)}
.rv .pinos li.sem{border-color:color-mix(in srgb,var(--rv-cr) 60%,transparent)}
.rv :is(.pinos,.balao) .n{display:grid;flex:none;aspect-ratio:1;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--rv-cr);color:var(--rv-cr-ink);font:700 12px/1 var(--rv-mono)}
.rv .pinos p{margin:0;font-size:13.5px;line-height:1.45;color:var(--rv-ink);min-width:0;overflow-wrap:anywhere}
.rv .pinos p small{display:block;color:var(--rv-ter);font-size:12.5px}
.rv .pinos p em{font-style:normal;color:var(--rv-cr);font-weight:600}
.rv .pinos .btn:not(.rv-palco *){height:32px;padding:0 8px}

/* O balão do alfinete: chips do problema, nota, Tirar e Pronto. */
.rv .balao{position:absolute;z-index:6;width:min(300px,calc(100% - 16px));padding:16px;border-radius:12px;background:var(--rv-sup);border:1px solid var(--rv-linha2);box-shadow:0 18px 40px rgba(0,0,0,.55);display:grid;gap:8px;
  color:var(--rv-ink);font:400 14px/1.45 var(--rv-fonte);text-align:left;color-scheme:dark;cursor:auto;
  transition:opacity 150ms var(--rv-ease),transform 150ms var(--rv-ease)}
.rv .balao *{cursor:auto}
.rv .balao :is(button,.chip){cursor:pointer}
.rv .balao:focus{outline:none}
.rv .balao[data-instantaneo]{transition:none}
@starting-style{ .rv .balao{opacity:0;transform:scale(.96)} }
.rv .balao__cab{display:flex;gap:8px;align-items:center;font-size:14px;font-weight:600;color:var(--rv-ink)}
.rv .balao__cab small{display:block;font-weight:400;color:var(--rv-ter);font-size:12.5px;overflow-wrap:anywhere}
.rv .balao .chips .chip{--ex:var(--rv-cr);min-height:40px;font-size:13px;font-weight:500}
.rv .balao .campo{min-height:64px;font-size:14px}
.rv .balao__pe{display:flex;gap:8px;justify-content:space-between}
.rv .balao__pe :is(.btn,.rv-btn):not(.rv-palco *){height:40px}
.rv .balao__dica{margin:0;font-size:12.5px;color:var(--rv-sec)}
.rv .balao__pe .tirar:not(.rv-palco *){gap:8px;padding:0 8px;color:color-mix(in srgb,var(--rv-cr) 85%,#fff);border-color:transparent}
.rv .balao__pe .tirar svg{width:16px;height:16px}
@media (hover:hover) and (pointer:fine){ .rv .balao__pe .tirar:not(.rv-palco *):hover{background:color-mix(in srgb,var(--rv-cr) 12%,transparent);border-color:color-mix(in srgb,var(--rv-cr) 35%,transparent)} }

/* Reprovado: o que vai ser refeito. */
.rv .refazendo{display:grid;gap:16px;padding:16px;border-radius:10px;border:1px solid color-mix(in srgb,var(--rv-con) 35%,transparent);background:color-mix(in srgb,var(--rv-con) 7%,transparent)}
.rv .refazendo__cab{display:flex;align-items:center;gap:8px;font-weight:600}
.rv .refazendo__cab .orb{margin:0}
.rv .entendi{padding:12px 16px;background:var(--rv-bg);border-radius:8px;font-size:14px;line-height:1.55;color:var(--rv-sec)}
.rv .entendi b{color:var(--rv-ink);font-weight:600}
.rv .refazendo ol{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:14px}
.rv .refazendo li{display:flex;gap:8px;align-items:center;color:var(--rv-ink)}
.rv .refazendo li svg{color:var(--rv-ec);stroke-width:2.4}
.rv .refazendo li.pend{color:var(--rv-ter)}
.rv .refazendo li.pend svg{color:var(--rv-ter);stroke-width:1.8}
.rv .refazendo li .orb{width:16px;height:16px;margin:0}
.rv .recebe{margin-top:8px}
.rv .recebe summary{cursor:pointer;font-size:13px;color:var(--rv-sec)}
.rv .recebe pre{margin:8px 0 0;padding:12px;border-radius:8px;background:var(--rv-bg);font:12px/1.55 var(--rv-mono);color:var(--rv-sec);white-space:pre-wrap;overflow-wrap:anywhere}

/* Histórico do item: a versão da refação (P3) e o registro, no tom do
   "Histórico deste item" do protótipo. */
.rv .decisao .hist-bloco,.rv .decisao .rv-versao{border-top:1px solid var(--rv-linha);padding:24px 24px 16px}
.rv .decisao .hist-bloco .eyebrow{color:var(--rv-ter)}
.rv .hist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.rv .hist li{display:grid;grid-template-columns:44px 14px minmax(0,1fr);gap:0 12px}
.rv .hist .dt{font:500 12.5px/1.5 var(--rv-mono);color:var(--rv-ter);padding:8px 0}
.rv .hist .pt{position:relative;display:grid;place-items:center}
.rv .hist .pt::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;background:var(--rv-linha)}
.rv .hist li:first-child .pt::before{top:50%} .rv .hist li:last-child .pt::before{bottom:50%}
.rv .hist li:only-child .pt::before{display:none}
.rv .hist .pt i{width:8px;height:8px;border-radius:50%;background:var(--c,var(--rv-con));position:relative;box-shadow:0 0 0 3px var(--rv-sup)}
.rv .hist p{margin:0;font-size:14px;padding:8px 0;line-height:1.4}
.rv .hist p small{display:block;color:var(--rv-ter);font-size:13px}
.rv .rv-versao h3{margin:0 0 12px;font:500 12px/1.3 var(--rv-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--rv-con);display:flex;align-items:center;gap:8px}
.rv .rv-versao h3::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--rv-con);box-shadow:0 0 0 3px color-mix(in srgb,var(--rv-con) 20%,transparent)}
.rv .rv-versao p{position:relative;margin:0;padding:0 0 12px 20px;font-size:14px;line-height:1.5;overflow-wrap:anywhere}
.rv .rv-versao p::before{content:"";position:absolute;left:3px;top:0;bottom:0;width:1px;background:var(--rv-linha)}
.rv .rv-versao p:last-child{padding-bottom:0}
.rv .rv-versao p:last-child::before{bottom:auto;height:8px}
.rv .rv-versao__resposta{color:var(--rv-ink)}
.rv .rv-versao__origem{color:var(--rv-ter)}
.rv .rv-versao__origem::after{content:"";position:absolute;left:0;top:6px;width:7px;height:7px;border-radius:50%;background:var(--rv-cr)}
.rv .rv-registro{margin:0;padding:12px 24px 24px;font:500 12px/1.5 var(--rv-mono);color:var(--rv-ter);overflow-wrap:anywhere}
.rv .decisao > .rv-registro:only-of-type{border-top:1px solid var(--rv-linha);padding-top:16px}

/* ---------- o nome de quem revisa (diálogo da P1) ---------- */
.rv dialog.rv-nome{max-width:440px;width:calc(100% - 32px);padding:32px;border:1px solid var(--rv-linha2);border-radius:var(--rv-r);background:var(--rv-sup);color:var(--rv-ink);
  font:16px/1.5 var(--rv-fonte);box-shadow:0 24px 64px rgba(0,0,0,.6);color-scheme:dark}
.rv dialog.rv-nome::backdrop{background:rgba(7,9,16,.72);backdrop-filter:blur(4px)}
.rv .rv-nome__form{display:grid;gap:16px}
.rv .rv-nome h2{margin:0;font-size:22px;font-weight:700;letter-spacing:-.01em}
.rv .rv-nome p{margin:0;color:var(--rv-sec);font-size:15px}
.rv .rv-nome :is(.btn,.rv-btn):not(.rv-palco *){height:48px;width:100%}

/* ---------- toast ---------- */
.rv .toast{position:fixed;left:50%;top:calc(var(--rv-topo) + 16px);translate:-50% -12px;background:var(--rv-ink);color:var(--rv-bg);padding:12px 16px;border-radius:10px;font-size:14px;font-weight:600;
  box-shadow:0 10px 30px rgba(0,0,0,.4);opacity:0;pointer-events:none;transition:opacity .15s ease,translate .15s var(--rv-ease);z-index:70;max-width:calc(100% - 32px);text-align:center}
.rv .toast.com-acao{pointer-events:auto}
.rv .toast__acao{margin-left:12px;padding:0 8px;min-height:32px;border:0;border-radius:6px;background:color-mix(in srgb,var(--rv-bg) 12%,transparent);color:var(--rv-bg);font:inherit;font-weight:700;text-decoration:underline;cursor:pointer}
.rv .toast.on{opacity:1;translate:-50% 0;transition:opacity .2s var(--rv-ease),translate .25s var(--rv-ease)}
@media (min-width:861px){ .rv .toast{top:auto;bottom:24px;translate:-50% 12px} .rv .toast.on{translate:-50% 0} }

@keyframes rv-ent{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
.rv .dh,.rv .rev:not([hidden]) > .palco > .item__cab{animation:rv-ent .3s var(--rv-ease) both}

/* ---------- telas menores ---------- */
@media (max-width:1100px){
  .rv .rev{grid-template-columns:minmax(0,1fr);height:auto}
  .rv .rev > .palco{overflow:visible}
  .rv .decisao{border-left:0;border-top:1px solid var(--rv-linha);overflow:visible}
  .rv .duplo{grid-template-columns:minmax(0,1fr)}
  .rv .duplo .frame--cel{max-width:415px}
}
/* No celular o menu lateral vira a barra do topo, e o trilho dos passos
   desce para o #passosM, horizontal, no começo do conteúdo. */
@media (max-width:860px){
  .rv .shell{grid-template-columns:minmax(0,1fr)}
  .rv .lat{position:sticky;top:0;height:var(--rv-topo);flex-direction:row;align-items:center;gap:8px;padding:0 16px;border-right:0;border-bottom:1px solid var(--rv-linha);background:rgba(7,9,16,.86);backdrop-filter:blur(14px) saturate(1.4);z-index:20}
  .rv .lat .marca{padding:0 8px 0 0;min-height:48px}
  .rv .lat .marca b{display:none}
  .rv .lat .marca small{margin-top:0}
  .rv .lat-ini,.rv .lat-tema{flex-direction:row;align-items:center;overflow:visible;flex:0 1 auto;margin:0;padding:0}
  .rv .lat-ini{flex:1 1 auto;min-width:0}
  .rv .lat nav{flex-direction:row;min-width:0;overflow-x:auto;scrollbar-width:none;gap:2px}
  .rv .lat nav::-webkit-scrollbar{display:none}
  .rv .lat nav a{font-size:0;gap:0;padding:0;width:48px;min-height:48px;flex:none;justify-content:center}
  .rv .lat nav a svg{display:block;width:20px;height:20px}
  .rv .lat nav a .n{display:none}
  .rv .lat .grupo,.rv .lat .uso-l{display:none}
  .rv .lat-tema > :not(.volta){display:none}
  .rv .volta{margin:0;min-height:48px}
  .rv .lat .pe{margin:0 0 0 auto;padding:0;border:0}
  .rv .lat .pe .q{display:none}
  .rv .lat .sair{min-height:48px;min-width:48px;justify-content:center;display:inline-flex;align-items:center}
  .rv .passos-m{display:flex;flex-direction:row;gap:8px;overflow-x:auto;margin:0;padding:16px 16px 4px;scrollbar-width:none}
  .rv .passos-m::-webkit-scrollbar{display:none}
  .rv .passos-m .passo{flex:none;width:auto;min-height:48px;grid-template-columns:28px auto auto;border:1px solid var(--rv-linha)}
  .rv .passos-m .passo.ativo{border-color:color-mix(in srgb,var(--rv-con) 45%,transparent)}
  .rv .passos-m .passo small{display:none}
  .rv .temas{grid-template-columns:repeat(8,minmax(0,1fr))}
  .rv .dh .legenda .dica{margin-left:0;flex-basis:100%}
  .rv .barra-marcar.on{display:flex;position:fixed;left:16px;right:16px;bottom:16px;z-index:25;align-items:center;justify-content:space-between;gap:8px;padding:8px 8px 8px 16px;border-radius:12px;background:var(--rv-sup);
    border:1px solid color-mix(in srgb,var(--rv-cr) 50%,transparent);box-shadow:0 12px 32px rgba(0,0,0,.5);font-size:14px;font-weight:600}
  .rv .barra-marcar :is(.btn,.rv-btn):not(.rv-palco *){height:48px}
}
@media (max-width:700px){
  .rv .wrap{padding:24px 16px 72px}
  .rv .dh__cab,.rv .temas,.rv .dh .legenda{padding-left:16px;padding-right:16px}
  .rv .temas{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  .rv .rv-tema{min-height:64px}
  .rv .rev > .palco{padding:16px 16px 32px}
  .rv .quadro.rv-palco{padding:16px}
  .rv .rv-palco__fig{outline-offset:4px}
  .rv .vistas .dica{margin-left:0;flex-basis:100%}
  .rv .decisao__cab,.rv .decisao__corpo{padding-left:16px;padding-right:16px}
  .rv .decisao .hist-bloco,.rv .decisao .rv-versao{padding-left:16px;padding-right:16px}
  .rv .rv-registro{padding-left:16px;padding-right:16px}
  .rv .rv-telas ol{columns:1}
}
@media (max-width:600px){
  .rv .lat{gap:2px;padding:0 8px}
  .rv .lat .marca svg{width:26px;height:16px}
  .rv .lat .marca small{display:none}
  .rv .lat .pe .av{display:none}
  .rv .lat .sair{padding:8px 4px;font-size:12.5px}
}
/* No toque, todo alvo tem 48 px. */
@media (max-width:860px), (pointer:coarse){
  .rv :is(.btn,.rv-btn):not(.rv-palco *),.rv .btn.sm:not(.rv-palco *),.rv .rv-btn--fino:not(.rv-palco *){height:48px}
  .rv .item__nav .btn:not(.rv-palco *),.rv .chip.so-ico{width:48px;height:48px}
  .rv .chip,.rv .motivo .chip,.rv .balao .chips .chip,.rv :is(.rv-alt,.rv-telas,details.mais) summary{min-height:48px}
  .rv .faixa__item,.rv .passo,.rv .esteira__item{min-height:48px}
  .rv .rv-faixa--local button{min-height:48px}
  .rv .volta,.rv .lat .marca{min-height:48px}
}

@media (prefers-reduced-motion:reduce){
  .rv .balao{transition:opacity 120ms ease}
  @starting-style{ .rv .balao{transform:none} }
  .rv .rg-pino.novo{transition:opacity 100ms linear}
  @starting-style{ .rv .rg-pino.novo{scale:none;translate:none} }
  @keyframes rv-ent{from{opacity:0}to{opacity:1}}
  .rv .toast,.rv .toast.on{translate:-50% 0}
  .rv :is(.btn,.rv-btn,.chip,.esteira__item,.faixa__item,.rv-tema):active,.rv a.rv-tema:hover,.rv .volta:hover svg,.rv .volta:hover::before{transform:none;translate:none}
  .rv .prog .barra i,.rv .rv-barra i{transition:none}
  .rv .orb{animation-duration:3s}
  .rv .bd[data-e=gerando]::before{animation:none}
}
