/* Arsenal dos Mestres · refino visual, versão 2 (05/10/2026).
   Pedido do Tiago: "melhore o visual e o UX, sem mexer na organização e nas hierarquias". Depois da versão 1
   (ajustes finos), o retorno foi "quase não vi mudança": esta versão muda o visual de verdade.
   Direção: vitrine escura. Preto profundo e neutro, cartões nítidos, a cor de cada biblioteca como luz
   (no brilho do fundo, nos botões, nos realces e ao passar o mouse), tipografia grande e firme.
   Só aparência: mesmas seções, textos, rotas, ordem, menus e comportamento.
   Carrega por último. Para desfazer, basta tirar a linha do refino.css do index.html.
   O prefixo body.tema-arsenal[data-secao][class] dá a estas regras peso suficiente sobre as camadas antigas. */

/* =========================================================
   0. Tokens
   ========================================================= */
:root { color-scheme: dark; }
/* a cor local (--section-accent) muda por seção e, no Início, por cartão de biblioteca: os tons derivados
   são recalculados em cada um desses lugares */
body.tema-arsenal[data-secao][class],
body.tema-arsenal[data-secao][class] :is(.bib-library, .bib-category-cover) {
  --acc: var(--section-accent, #c5f76b);
  --acc-12: color-mix(in srgb, var(--acc) 12%, transparent);
  --acc-20: color-mix(in srgb, var(--acc) 20%, transparent);
  --acc-35: color-mix(in srgb, var(--acc) 35%, transparent);
  --acc-55: color-mix(in srgb, var(--acc) 55%, transparent);
  --v-borda: linear-gradient(160deg, rgba(255, 255, 255, .17), rgba(255, 255, 255, .05) 28%, rgba(255, 255, 255, .03) 65%, color-mix(in srgb, var(--acc) 22%, transparent));
  --v-borda-hover: linear-gradient(160deg, color-mix(in srgb, var(--acc) 80%, #fff), color-mix(in srgb, var(--acc) 30%, transparent) 40%, color-mix(in srgb, var(--acc) 45%, transparent));
  --v-sombra-hover: 0 1px 0 rgba(255, 255, 255, .08) inset, 0 34px 70px -34px rgba(0, 0, 0, .95), 0 18px 60px -26px var(--acc-55);
}
body.tema-arsenal[data-secao][class] {
  --v-bg: #060708;
  --v-s1: #0e1013;
  --v-s2: #13161a;
  --v-s3: #1a1e23;
  --v-line: rgba(255, 255, 255, .075);
  --v-line-2: rgba(255, 255, 255, .13);
  --v-line-3: rgba(255, 255, 255, .2);
  --v-txt: #f5f6f8;
  --v-txt-2: #b9c0c8;
  --v-txt-3: #858d97;
  --leitura: 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --v-card: linear-gradient(180deg, #14171b 0%, #0d0f12 100%);
  --v-sombra: 0 1px 0 rgba(255, 255, 255, .06) inset, 0 24px 48px -30px rgba(0, 0, 0, .9);

  /* as camadas antigas usam estas variáveis: passam a falar a língua nova */
  --fundo: var(--v-bg);
  --fundo-elevado: var(--v-s1);
  --sup-1: var(--v-s1); --sup-2: var(--v-s2); --sup-3: var(--v-s3); --sup-afundada: #08090b;
  --sec-panel: var(--v-s1);
  --sec-panel-top: var(--v-s2);
  --sec-glass: #121519;
  --sec-ink: #08090b;
  --sec-line: var(--v-line);
  --sec-text: #e8ebee;
  --texto: var(--v-txt);
  --texto-2: var(--v-txt-2);
  --texto-3: var(--v-txt-3);
  --borda-1: var(--v-line); --borda-2: var(--v-line-2); --borda-3: var(--v-line-3);
  --vidro: var(--v-card);
  background: var(--v-bg);
  color: var(--v-txt);
}

/* =========================================================
   1. Fundo, barras de rolagem
   ========================================================= */
html { scrollbar-color: #ffffff2e transparent; scrollbar-width: thin; }
body.tema-arsenal[data-secao][class] ::-webkit-scrollbar { width: 10px; height: 10px; }
body.tema-arsenal[data-secao][class] ::-webkit-scrollbar-track { background: transparent; }
body.tema-arsenal[data-secao][class] ::-webkit-scrollbar-thumb { background: #ffffff24; border: 3px solid transparent; border-radius: 99px; background-clip: padding-box; }
body.tema-arsenal[data-secao][class] .ambient {
  background:
    radial-gradient(1100px 620px at 78% -8%, color-mix(in srgb, var(--acc) 15%, transparent), transparent 62%),
    radial-gradient(700px 520px at 8% 4%, color-mix(in srgb, var(--acc) 6%, transparent), transparent 65%),
    radial-gradient(900px 700px at 50% 110%, color-mix(in srgb, var(--acc) 5%, transparent), transparent 70%),
    var(--v-bg);
}
body.tema-arsenal[data-secao][class] ::selection { background: var(--acc-35); color: #fff; }

/* =========================================================
   2. Tipografia: Sora nos títulos, DM Sans nos textos corridos
   ========================================================= */
body.tema-arsenal[data-secao][class] :is(.card-desc, .cab-desc, .bib-category-body p, .bib-library p, .ajuda-txt p,
  .menu-ajuda > span, .bib-help p, .bib-help li, .tut-corpo .apoio, .secao-sub, .hangar-txt > p:not(.hangar-rodape), .missao .desc) {
  font-family: var(--leitura);
  letter-spacing: 0;
}
body.tema-arsenal[data-secao][class] :is(h1, h2, h3) { text-wrap: balance; }
body.tema-arsenal[data-secao][class] .card-titulo { text-wrap: pretty; }
body.tema-arsenal[data-secao][class] .card-desc { font-size: 15px; line-height: 1.6; color: var(--v-txt-2); }
body.tema-arsenal[data-secao][class] .card-desc b { font-weight: 600; color: var(--v-txt); }
body.tema-arsenal[data-secao][class] .card-titulo { font-weight: 600; letter-spacing: -.02em; line-height: 1.22; overflow-wrap: break-word; color: var(--v-txt); }
body.tema-arsenal[data-secao][class] .bib-items .card:not(.kit):not(.cine) .card-titulo { font-size: 19px; }
body.tema-arsenal[data-secao][class] .bib-items .card.kit .card-titulo { font-size: 23px; }
body.tema-arsenal[data-secao][class] .card .etiqueta { font-size: 12px; color: var(--v-txt-2); }
body.tema-arsenal[data-secao][class] .card .etiqueta .fraco { color: var(--v-txt-3); }

/* títulos de seção */
body.tema-arsenal[data-secao][class] :is(.secao-cab, .arsenal-cab) h2 { font-size: 32px; font-weight: 600; letter-spacing: -.035em; line-height: 1.15; }
body.tema-arsenal[data-secao][class] .secao-sub { font-size: 15.5px; color: var(--v-txt-2); margin-top: 6px; }
body.tema-arsenal[data-secao][class] :is(.secao-cab, .arsenal-cab) { margin-bottom: 22px; }

/* =========================================================
   3. Barra do topo: vidro escuro
   ========================================================= */
body.tema-arsenal[data-secao][class] .topo {
  background: rgba(6, 7, 8, .72);
  -webkit-backdrop-filter: blur(20px) saturate(1.5);
  backdrop-filter: blur(20px) saturate(1.5);
  border-bottom: 1px solid var(--v-line);
  box-shadow: none;
}
body.tema-arsenal[data-secao][class] .topo::after { background: linear-gradient(90deg, transparent 10%, var(--acc-55), transparent 90%); opacity: .55; }
body.tema-arsenal[data-secao][class] .busca {
  background: rgba(255, 255, 255, .045);
  border: 1px solid var(--v-line-2);
  border-radius: 999px;
  box-shadow: none;
  transition: border-color .2s, box-shadow .2s, background .2s;
}
body.tema-arsenal[data-secao][class] .busca:focus-within { background: rgba(255, 255, 255, .06); border-color: var(--acc-55); box-shadow: 0 0 0 4px var(--acc-12); }
body.tema-arsenal[data-secao][class] .avatar { background: var(--acc-20); border-color: var(--acc-35); color: #fff; box-shadow: none; }
body.tema-arsenal[data-secao][class] .uout { border-color: var(--v-line-2); background: rgba(255, 255, 255, .03); }

/* =========================================================
   4. Menu lateral
   ========================================================= */
body.tema-arsenal[data-secao][class] .menu {
  background: rgba(6, 7, 8, .55);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  border-right: 1px solid var(--v-line);
  scrollbar-width: none;
}
body.tema-arsenal[data-secao][class] .menu::-webkit-scrollbar { display: none; }
body.tema-arsenal[data-secao][class] .menu-grupo { color: var(--v-txt-3); letter-spacing: .14em; }
body.tema-arsenal[data-secao][class] .menu-item {
  font-size: 14px;
  color: var(--v-txt-2);
  border-color: transparent;
  transition: background .18s, color .18s, border-color .18s;
}
body.tema-arsenal[data-secao][class] .menu-item:hover { background: rgba(255, 255, 255, .05); color: var(--v-txt); }
body.tema-arsenal[data-secao][class] .menu-item[aria-current="page"] {
  color: #fff;
  font-weight: 600;
  background: linear-gradient(90deg, var(--acc-20), color-mix(in srgb, var(--acc) 4%, transparent));
  border-color: var(--acc-35);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 10px 30px -18px var(--acc-55);
}
body.tema-arsenal[data-secao][class] .menu-item[aria-current="page"]::before { background: var(--acc); box-shadow: 0 0 14px var(--acc); }
body.tema-arsenal[data-secao][class] .menu-ajuda { background: rgba(255, 255, 255, .03); border: 1px solid var(--v-line); }

/* =========================================================
   5. Banner das bibliotecas
   ========================================================= */
body.tema-arsenal[data-secao][class] .cabecalho {
  border-radius: 30px;
  border: 1px solid color-mix(in srgb, var(--acc) 26%, transparent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 40px 90px -50px #000, 0 0 140px -70px var(--acc-55);
}
body.tema-arsenal[data-secao][class] .cabecalho.com-foto:not(.bib-cover-hero) { padding: 34px 40px 40px; min-height: 330px; }
body.tema-arsenal[data-secao][class] .cabecalho:not(.bib-cover-hero) h1 { font-size: 54px; line-height: 1.02; }
body.tema-arsenal[data-secao][class] .cabecalho h1 { font-weight: 650; letter-spacing: -.04em; filter: none; }
body.tema-arsenal[data-secao][class]:not([data-secao="inicio"]) .cabecalho h1 {
  background: linear-gradient(100deg, #fff 0%, #fff 35%, color-mix(in srgb, var(--acc) 85%, #fff) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
body.tema-arsenal[data-secao][class] .cabecalho .cab-ic {
  width: 62px; height: 62px; border-radius: 18px;
  color: var(--acc);
  background: linear-gradient(145deg, color-mix(in srgb, var(--acc) 26%, #0b0d10), color-mix(in srgb, var(--acc) 8%, #0b0d10));
  border: 1px solid var(--acc-55);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 0 40px -10px var(--acc-55);
}
body.tema-arsenal[data-secao][class] .cabecalho .cab-ic .ic { width: 28px; height: 28px; }
body.tema-arsenal[data-secao][class] .cabecalho .cab-linha { gap: 18px; }
body.tema-arsenal[data-secao][class] .cabecalho .cab-desc { font-size: 15.5px; line-height: 1.65; color: #e3e7ea; text-shadow: 0 2px 12px #000; }
body.tema-arsenal[data-secao][class] .cabecalho:not(.bib-cover-hero) .cab-desc { font-size: 17.5px; max-width: 44ch; margin-top: 14px; }
body.tema-arsenal[data-secao][class] .cabecalho .trilha { font-size: 13px; color: var(--v-txt-2); }
body.tema-arsenal[data-secao][class] .cabecalho .trilha a { color: var(--v-txt-2); text-decoration: none; }
body.tema-arsenal[data-secao][class] .cabecalho .trilha a:hover { color: #fff; }
/* contagem vira um selo */
body.tema-arsenal[data-secao][class] .bib-total {
  display: inline-flex; align-items: center; width: fit-content;
  margin-top: 16px; padding: 6px 13px;
  border-radius: 999px;
  background: var(--acc-12);
  border: 1px solid var(--acc-35);
  color: var(--acc);
  font-size: 13px; font-weight: 600;
}
/* foto do banner: volta a ter as cores e o detalhe originais, com um véu da cor da biblioteca
   (antes a foto inteira virava uma cor só) */
body.tema-arsenal[data-secao][class]:not([data-secao="inicio"]) .cabecalho.com-foto {
  background-color: #08090b;
  background-image:
    linear-gradient(90deg, #08090bf2 0%, #08090bc7 30%, #08090b45 60%, #08090b12 100%),
    linear-gradient(0deg, #08090bcc 0%, transparent 55%),
    linear-gradient(color-mix(in srgb, var(--acc) 40%, transparent), color-mix(in srgb, var(--acc) 40%, transparent)),
    var(--foto);
  background-blend-mode: normal, normal, color, normal;
  background-size: cover, cover, cover, cover;
  background-position: center, center, center, 70% 50%;
  background-repeat: no-repeat;
}
/* capa das subcategorias */
body.tema-arsenal[data-secao][class] .bib-page .cabecalho.bib-cover-hero {
  background: radial-gradient(ellipse at 10% 30%, color-mix(in srgb, var(--acc) 16%, #08090b), #050607 75%);
}
body.tema-arsenal[data-secao][class] .bib-page .bib-cover-hero h1 { font-size: clamp(30px, 3.4vw, 46px); line-height: 1.05; }
/* vídeo "Comece por aqui" */
body.tema-arsenal[data-secao][class] .bib-hero-tutorial {
  border-radius: 20px;
  background: rgba(10, 12, 14, .72);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  border: 1px solid var(--acc-35);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 30px 60px -30px #000;
}
body.tema-arsenal[data-secao][class] .bib-hero-caption { border-color: var(--v-line); }
body.tema-arsenal[data-secao][class] .bib-hero-caption > span { color: var(--acc); font-weight: 600; }
body.tema-arsenal[data-secao][class] .bib-hero-caption h2 { font-size: 15px; font-weight: 600; color: #fff; }
body.tema-arsenal[data-secao][class] .btn-midia { border-radius: 999px; background: rgba(6, 7, 8, .75); border-color: var(--v-line-2); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
body.tema-arsenal[data-secao][class] .btn-midia .play-bola { background: var(--acc); color: #0b0d0f; }

/* =========================================================
   6. Início
   ========================================================= */
body.tema-arsenal[data-secao="inicio"][class] .topo { background: rgba(6, 7, 8, .72); border-bottom-color: var(--v-line); }
body.tema-arsenal[data-secao="inicio"][class] .hangar {
  border-radius: 32px;
  background: #07090a;
  border: 1px solid color-mix(in srgb, var(--acc) 30%, transparent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 50px 100px -50px #000, 0 0 160px -60px var(--acc-55);
}
body.tema-arsenal[data-secao="inicio"][class] .hangar-img::after {
  background: linear-gradient(90deg, #07090af7 0%, #07090ad1 32%, #07090a40 64%, #07090a14 100%), linear-gradient(0deg, #07090ac0, transparent 60%);
}
body.tema-arsenal[data-secao="inicio"][class] .hangar h1 { font-size: 60px; line-height: 1; font-weight: 650; letter-spacing: -.045em; }
body.tema-arsenal[data-secao="inicio"][class] .hangar-txt > p:not(.hangar-rodape) { font-size: 17.5px; line-height: 1.6; color: #dfe4e0; max-width: 44ch; }
body.tema-arsenal[data-secao="inicio"][class] .hud-rotulo { color: var(--acc); font-weight: 600; }
body.tema-arsenal[data-secao="inicio"][class] .missoes-painel {
  border-radius: 24px;
  background: rgba(10, 13, 11, .7);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  border: 1px solid var(--acc-35);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 30px 60px -30px #000;
}
body.tema-arsenal[data-secao="inicio"][class] .missao { border-radius: 14px; background: rgba(255, 255, 255, .035); border-color: var(--v-line); }
body.tema-arsenal[data-secao="inicio"][class] .missao:hover { background: var(--acc-12); border-color: var(--acc-35); }

/* =========================================================
   7. Cartões (todos)
   ========================================================= */
body.tema-arsenal[data-secao][class] :is(.card, .bib-category, .bib-library, .bib-family, .vitrine, .como-card, .tut-card, .ct-panel, .ct-stats) {
  background: var(--v-card) padding-box, var(--v-borda) border-box;
  border: 1px solid transparent;
  border-radius: 22px;
  box-shadow: var(--v-sombra);
}
body.tema-arsenal[data-secao][class] .card.cine { background: #000; border: 1px solid var(--v-line); }
body.tema-arsenal[data-secao][class] :is(.card, .bib-category, .bib-library) {
  transition: transform .3s var(--ease), border-color .25s, box-shadow .3s var(--ease);
}
@media (hover: hover) {
  body.tema-arsenal[data-secao][class] :is(.bib-items .card, .grade .card, .bib-category, .bib-library):hover {
    transform: translateY(-4px);
    background: var(--v-card) padding-box, var(--v-borda-hover) border-box;
    box-shadow: var(--v-sombra-hover);
  }
}
body.tema-arsenal[data-secao][class] .card:focus-within { background: var(--v-card) padding-box, var(--v-borda-hover) border-box; }
body.tema-arsenal[data-secao][class] .card-corpo { padding: 22px 24px 24px; gap: 10px; }
body.tema-arsenal[data-secao][class] .card.rec .card-corpo { padding: 0; }
body.tema-arsenal[data-secao][class] .card-acoes { padding-top: 16px; }
body.tema-arsenal[data-secao][class] .card-acoes .link-acao { font-weight: 600; color: var(--acc); }
body.tema-arsenal[data-secao][class] .card-topo .fmt-ic {
  width: 40px; height: 40px; border-radius: 12px;
  background: var(--acc-12);
  border: 1px solid var(--acc-35);
  color: var(--acc);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
}
body.tema-arsenal[data-secao][class] .like { border-color: var(--v-line-2); background: rgba(255, 255, 255, .03); }

/* Aplicativos: vitrine. A tela do app sobe de dentro de um palco iluminado na cor da biblioteca;
   "Ampliar prévia" vira etiqueta de vidro sobre a imagem. */
body.tema-arsenal[data-secao][class] .app-preview.card.kit .card-media {
  height: auto; aspect-ratio: auto; overflow: hidden;
  padding: 20px 20px 0;
  background:
    radial-gradient(ellipse 80% 90% at 50% 0%, color-mix(in srgb, var(--acc) 28%, transparent), transparent 70%),
    linear-gradient(180deg, #111418, #0b0d10);
  border-bottom: 1px solid var(--v-line);
}
body.tema-arsenal[data-secao][class] .app-preview.card.kit .card-media .app-preview-open { padding: 0; height: auto; }
body.tema-arsenal[data-secao][class] .app-preview.card.kit .card-media .app-preview-open img {
  width: 100%; height: auto; aspect-ratio: 1713 / 844;
  object-fit: cover; object-position: top center;
  border-radius: 12px 12px 0 0;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .1), 0 -6px 40px -8px color-mix(in srgb, var(--acc) 40%, transparent), 0 24px 40px -12px #000;
  transform-origin: 50% 100%;
  transition: transform .7s var(--ease);
}
body.tema-arsenal[data-secao][class] .app-preview-open > span {
  inset: auto 12px 12px auto;
  z-index: 1;
  height: 34px; padding: 0 14px 0 12px;
  border: 1px solid rgba(255, 255, 255, .18); border-radius: 999px;
  background: rgba(8, 9, 11, .78);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  color: #fff; font: 600 12.5px/1 var(--fonte-titulo);
  box-shadow: 0 8px 22px -10px #000;
  transition: background .2s, color .2s, border-color .2s;
}
body.tema-arsenal[data-secao][class] .app-preview-open:is(:hover, :focus-visible) > span { background: var(--acc); border-color: transparent; color: #0b0d0f; }

@media (hover: hover) {
  body.tema-arsenal[data-secao][class] .app-preview.card.kit:hover .card-media .app-preview-open img { transform: translateY(-4px) scale(1.02); }
}
body.tema-arsenal[data-secao][class] .selo-linha { font-size: 12.5px; }

/* Ferramentas e referências: miniatura em cima; sem imagem, some */
body.tema-arsenal[data-secao][class] .bib-items .card.rec { grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 20px 20px 22px; }
body.tema-arsenal[data-secao][class] .bib-items .card.rec .rec-capa { aspect-ratio: 2 / 1; border-radius: 14px; }
body.tema-arsenal[data-secao][class] .bib-items .card.rec .rec-capa:empty { display: none; }
/* nomes de repositório são longos: um ponto menor para caberem inteiros */
body.tema-arsenal[data-secao][class] .bib-items .card.rec .card-titulo { font-size: 16.5px; letter-spacing: -.025em; overflow-wrap: anywhere; }

/* Capas das categorias (Skills, Prompts, Squads, Guias) */
body.tema-arsenal[data-secao][class] .bib-page .bib-category-cover { overflow: hidden; }
body.tema-arsenal[data-secao][class] .bib-page .bib-category-cover .bib-category-art { background: #000; }
body.tema-arsenal[data-secao][class] .bib-page .bib-category-cover .bib-category-art::after { background: linear-gradient(0deg, #0d0f12 0%, transparent 40%); }
body.tema-arsenal[data-secao][class] .bib-page .bib-category-cover .bib-category-art img { transition: transform .8s var(--ease); }
@media (hover: hover) {
  body.tema-arsenal[data-secao][class] .bib-page .bib-category-cover:hover .bib-category-art img { transform: scale(1.06); }
}
body.tema-arsenal[data-secao][class] .bib-page .bib-category-cover .bib-cover-number {
  width: 36px; height: 36px; border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, .18);
  background: rgba(6, 7, 8, .7);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  color: var(--acc); font: 600 12px/1 var(--fonte-titulo);
}
body.tema-arsenal[data-secao][class] .bib-category-body { padding: 18px 24px 24px; }
body.tema-arsenal[data-secao][class] .bib-category-body h2 { font-size: 21px; font-weight: 600; letter-spacing: -.025em; }
body.tema-arsenal[data-secao][class] :is(.bib-category-body p, .bib-library p) { font-size: 14.5px; line-height: 1.55; color: var(--v-txt-2); }
body.tema-arsenal[data-secao][class] :is(.bib-category-count, .bib-library-count) { font-size: 12.5px; font-weight: 600; color: var(--acc); }
/* "Explorar" vira botão */
body.tema-arsenal[data-secao][class] :is(.bib-category .link-acao, .bib-library-open) {
  display: inline-flex; align-items: center; gap: 8px; width: fit-content;
  height: 38px; padding: 0 16px;
  border-radius: 12px;
  border: 1px solid var(--acc-35);
  background: var(--acc-12);
  color: var(--acc);
  font: 600 13.5px/1 var(--fonte-titulo);
  transition: background .2s, color .2s, gap .25s var(--ease);
}
body.tema-arsenal[data-secao][class] :is(.bib-category:hover .link-acao, .bib-library:hover .bib-library-open) { background: var(--acc); color: #0b0d0f; gap: 11px; }

/* Bibliotecas do Início: cada cartão com a cor da sua biblioteca */
body.tema-arsenal[data-secao][class] .bib-library[href="#/referencias"] { --section-accent: #d7d7d7; }
body.tema-arsenal[data-secao][class] .bib-library { padding: 24px 22px 22px; }
body.tema-arsenal[data-secao][class] .bib-library::before {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: radial-gradient(ellipse 90% 60% at 0% 0%, var(--acc-12), transparent 70%);
}
body.tema-arsenal[data-secao][class] .bib-library { position: relative; }
body.tema-arsenal[data-secao][class] .bib-library h3 { font-size: 20px; font-weight: 600; letter-spacing: -.025em; }
body.tema-arsenal[data-secao][class] .bib-library-ic { width: 48px; height: 48px; border-radius: 14px; }
body.tema-arsenal[data-secao][class] .bib-cofre {
  border-radius: 24px;
  background: radial-gradient(ellipse 60% 120% at 0% 50%, var(--acc-20), transparent 70%), var(--v-card);
  border: 1px solid var(--acc-35);
  box-shadow: var(--v-sombra);
}
body.tema-arsenal[data-secao][class] .bib-cofre b { font-size: 21px; letter-spacing: -.02em; }

/* Cinema: pôsteres com borda fina e brilho ao passar */
body.tema-arsenal[data-secao][class] .card.cine { border-radius: 16px; }
@media (hover: hover) {
  body.tema-arsenal[data-secao][class] .card.cine:hover { background: #000; border-color: var(--acc-55); }
}
body.tema-arsenal[data-secao][class] .card.cine .card-media video { transition: transform .7s var(--ease); }
@media (hover: hover) {
  body.tema-arsenal[data-secao][class] .card.cine:hover .card-media video { transform: scale(1.05); }
}

/* =========================================================
   8. Busca e barra de resultados
   ========================================================= */
body.tema-arsenal[data-secao][class] .bib-search label,
body.tema-arsenal[data-secao][class] .bib-toolbar > .bib-select { font-size: 13px; font-weight: 500; color: var(--v-txt-2); }
body.tema-arsenal[data-secao][class] .bib-search > div {
  min-height: 58px; padding: 6px 6px 6px 18px;
  border-radius: 18px;
  background: rgba(255, 255, 255, .04);
  border: 1px solid var(--v-line-2);
  transition: border-color .2s, box-shadow .2s, background .2s;
}
body.tema-arsenal[data-secao][class] .bib-search > div:focus-within { background: rgba(255, 255, 255, .06); border-color: var(--acc-55); box-shadow: 0 0 0 4px var(--acc-12); }
body.tema-arsenal[data-secao][class] .bib-search input { font-size: 15px; height: 44px; }
body.tema-arsenal[data-secao][class] .bib-search .btn {
  min-height: 44px; padding: 0 22px; border-radius: 13px; font-weight: 650;
  background: linear-gradient(180deg, color-mix(in srgb, var(--acc) 82%, #fff), var(--acc));
  color: #0b0d0f; border-color: transparent;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), 0 8px 22px -12px var(--acc);
}
body.tema-arsenal[data-secao][class] :is(.grade, .bib-items, .bib-categories, .bib-library-grid) { gap: 20px; }
body.tema-arsenal[data-secao][class] .bib-select select {
  min-height: 58px; border-radius: 16px;
  background-color: rgba(255, 255, 255, .04);
  border-color: var(--v-line-2);
  font-size: 13.5px;
}
body.tema-arsenal[data-secao][class] .bib-results-header select { min-height: 42px; border-radius: 12px; }
body.tema-arsenal[data-secao][class] .bib-search-links .link-acao { font-size: 13px; color: var(--acc); }
body.tema-arsenal[data-secao][class] .bib-results-header p { color: var(--v-txt-3); font-size: 13px; }
/* filtros em pílula (Cinema, Cofre) */
body.tema-arsenal[data-secao][class] :is(.chip, .filtro, .bib-chip, .cine-filtro button) { border-color: var(--v-line-2); }

/* =========================================================
   9. Botões
   ========================================================= */
body.tema-arsenal[data-secao][class] .btn { border-radius: 12px; font-weight: 600; transition: transform .15s, box-shadow .2s, background .2s, border-color .2s, color .2s; }
body.tema-arsenal[data-secao][class] .btn:active { transform: translateY(1px); }
body.tema-arsenal[data-secao][class] .btn-primario {
  background: linear-gradient(180deg, color-mix(in srgb, var(--acc) 82%, #fff), var(--acc));
  color: #0b0d0f;
  border-color: transparent;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), 0 10px 26px -12px var(--acc);
}
body.tema-arsenal[data-secao][class] .btn-primario:hover { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), 0 14px 34px -12px var(--acc); filter: brightness(1.05); }
body.tema-arsenal[data-secao][class] .btn-secundario { background: rgba(255, 255, 255, .04); border-color: var(--v-line-2); color: var(--v-txt); }
body.tema-arsenal[data-secao][class] .btn-secundario:hover { background: rgba(255, 255, 255, .08); border-color: var(--acc-55); }

/* =========================================================
   10. Apoio: "Como usar", "Travou em algum passo?", rodapé
   ========================================================= */
body.tema-arsenal[data-secao][class] details.bib-help { border-radius: 18px; background: rgba(255, 255, 255, .025); border: 1px solid var(--v-line); box-shadow: none; }
body.tema-arsenal[data-secao][class] .bib-help summary { font-size: 14.5px; }
body.tema-arsenal[data-secao][class] .ajuda-faixa {
  border-radius: 24px;
  background: radial-gradient(ellipse 50% 140% at 0% 50%, var(--acc-12), transparent 70%), var(--v-card);
  border: 1px solid var(--v-line-2);
  box-shadow: var(--v-sombra);
}
body.tema-arsenal[data-secao][class] .ajuda-faixa b { font-size: 19px; letter-spacing: -.02em; }
body.tema-arsenal[data-secao][class] .rodape { border-top-color: var(--v-line); color: var(--v-txt-3); }

/* =========================================================
   11. Painel de detalhes
   ========================================================= */
body.tema-arsenal[data-secao][class] .overlay { background: rgba(3, 4, 5, .72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
body.tema-arsenal[data-secao][class] .item-wrap {
  background: linear-gradient(180deg, #0f1114, #08090b 60%);
  border-left: 1px solid var(--acc-35);
  box-shadow: -40px 0 90px -30px #000;
}
body.tema-arsenal[data-secao][class] .item-top {
  background: rgba(10, 11, 13, .8);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--v-line);
}
body.tema-arsenal[data-secao][class] .item-tipo { color: var(--acc); }
body.tema-arsenal[data-secao][class] .item-titulo { font-size: 32px; font-weight: 650; letter-spacing: -.035em; line-height: 1.1; }
body.tema-arsenal[data-secao][class] .item-wrap .it-sub { font-family: var(--leitura); font-size: 16.5px; line-height: 1.6; color: var(--v-txt-2); }
body.tema-arsenal[data-secao][class] .item-wrap :is(.como-usar, .it-precisa, .bloco, .it-selo > div, .detalhes-rec) {
  border-radius: 18px;
  background: rgba(255, 255, 255, .03);
  border-color: var(--v-line-2);
}
body.tema-arsenal[data-secao][class] .item-wrap :is(.como-usar, .it-precisa, .desc-body) :is(p, li) { font-family: var(--leitura); }
body.tema-arsenal[data-secao][class] .item-wrap .bloco pre { font-size: 14px; line-height: 1.7; }
body.tema-arsenal[data-secao][class] .item-wrap .passos li > :first-child::before,
body.tema-arsenal[data-secao][class] .item-wrap .passos .n { border-color: var(--acc-35); color: var(--acc); }
body.tema-arsenal[data-secao][class] .item-wrap .it-media { border-radius: 18px; border: 1px solid var(--v-line-2); overflow: hidden; }

/* =========================================================
   12. Quero Contribuir
   ========================================================= */
body.tema-arsenal[data-secao][class] input[type="file"] { color: var(--v-txt-2); font-size: 13px; }
body.tema-arsenal[data-secao][class] input[type="file"]::file-selector-button {
  margin-right: 12px; padding: 9px 15px;
  border: 1px solid var(--v-line-2); border-radius: 10px;
  background: rgba(255, 255, 255, .05); color: var(--v-txt);
  font: 600 13px/1 var(--fonte-titulo); cursor: pointer;
}
body.tema-arsenal[data-secao][class] input[type="file"]::file-selector-button:hover { border-color: var(--acc-55); }
body.tema-arsenal[data-secao][class] .ct-stats > p:only-child { grid-column: 1 / -1; padding: 16px 20px; color: var(--v-txt-3); }
body.tema-arsenal[data-secao][class] :is(.ct-form input:not([type="checkbox"]):not([type="file"]), .ct-form textarea, .ct-form select) {
  background: rgba(255, 255, 255, .035); border-color: var(--v-line-2); border-radius: 12px;
}
body.tema-arsenal[data-secao][class] :is(.ct-form input, .ct-form textarea, .ct-form select):focus { border-color: var(--acc-55); box-shadow: 0 0 0 4px var(--acc-12); outline: none; }

/* =========================================================
   13. Foco visível
   ========================================================= */
body.tema-arsenal[data-secao][class] :focus-visible { outline: 2px solid var(--acc); outline-offset: 3px; }

/* =========================================================
   14. Telas médias e celular
   ========================================================= */
@media (max-width: 1023px) {
  body.tema-arsenal[data-secao][class] .cabecalho:not(.bib-cover-hero) h1 { font-size: 44px; }
  body.tema-arsenal[data-secao="inicio"][class] .hangar h1 { font-size: 46px; }
}
@media (max-width: 850px) {
  /* "Comece por aqui": texto e Assistir à esquerda, miniatura à direita; ao tocar, o vídeo volta à largura toda */
  body.tema-arsenal[data-secao][class] .bib-hero-tutorial:not(:has(.video-box.tocando)) {
    position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 42%; align-items: stretch; max-width: none;
  }
  body.tema-arsenal[data-secao][class] .bib-hero-tutorial:not(:has(.video-box.tocando)) .bib-hero-caption {
    padding: 14px 14px 62px 16px; border-bottom: 0; border-right: 1px solid var(--v-line);
  }
  body.tema-arsenal[data-secao][class] .bib-hero-tutorial:not(:has(.video-box.tocando)) .bib-hero-caption h2 { font-size: 14px; line-height: 1.4; }
  body.tema-arsenal[data-secao][class] .bib-hero-tutorial:not(:has(.video-box.tocando)) .video-box { position: static; aspect-ratio: auto; min-height: 112px; }
  body.tema-arsenal[data-secao][class] .bib-hero-tutorial:not(:has(.video-box.tocando)) .video-box video { width: 100%; height: 100%; object-fit: cover; }
  body.tema-arsenal[data-secao][class] .bib-hero-tutorial:not(:has(.video-box.tocando)) .btn-midia { left: 14px; bottom: 14px; height: 38px; max-width: calc(58% - 28px); }
}
@media (max-width: 719px) {
  body.tema-arsenal[data-secao][class] .cabecalho { border-radius: 24px; }
  body.tema-arsenal[data-secao][class] .cabecalho.com-foto:not(.bib-cover-hero) { padding: 22px 20px 24px; min-height: 0; }
  body.tema-arsenal[data-secao][class] .cabecalho:not(.bib-cover-hero) h1 { font-size: 36px; }
  body.tema-arsenal[data-secao][class] .cabecalho .cab-ic { width: 52px; height: 52px; border-radius: 16px; }
  body.tema-arsenal[data-secao][class] .cabecalho:not(.bib-cover-hero) .cab-desc { font-size: 16px; }
  body.tema-arsenal[data-secao][class] .cabecalho .trilha { font-size: 12px; }
  body.tema-arsenal[data-secao][class] .bib-page .bib-cover-hero h1 { font-size: 30px; }
  body.tema-arsenal[data-secao][class] .bib-page .bib-cover-hero .bib-cover-hero-art { aspect-ratio: 2 / 1; }
  body.tema-arsenal[data-secao="inicio"][class] .hangar { border-radius: 26px; }
  body.tema-arsenal[data-secao="inicio"][class] .hangar h1 { font-size: 40px; }
  body.tema-arsenal[data-secao="inicio"][class] .hangar-txt > p:not(.hangar-rodape) { font-size: 16px; }
  body.tema-arsenal[data-secao][class] :is(.secao-cab, .arsenal-cab) h2 { font-size: 26px; }
  body.tema-arsenal[data-secao][class] .card-corpo { padding: 20px; }
  body.tema-arsenal[data-secao][class] .bib-items .card.rec { padding: 20px; }
  body.tema-arsenal[data-secao][class] .card-desc { font-size: 15.5px; }
  body.tema-arsenal[data-secao][class] .bib-category-body { padding: 16px 20px 20px; }
  body.tema-arsenal[data-secao][class] .item-titulo { font-size: 28px; }
  /* contagem e "Ordenar": na mesma linha quando cabem */
  body.tema-arsenal[data-secao][class] .bib-results-header { flex-wrap: wrap; gap: 8px 12px; }
  body.tema-arsenal[data-secao][class] .bib-results-header p { white-space: nowrap; font-size: 12.5px; }
  body.tema-arsenal[data-secao][class] .bib-results-header .bib-select { width: auto; margin-left: auto; gap: 8px; justify-content: flex-end; }
  body.tema-arsenal[data-secao][class] .bib-results-header select { padding-left: 10px; padding-right: 28px; }
  /* painel: links com cara de botão */
  body.tema-arsenal[data-secao][class] .it-acoes .btn-fantasma { min-height: 44px; border: 1px solid var(--v-line-2); background: rgba(255, 255, 255, .03); }
  /* barra de baixo em vidro, com a cor da seção no item ativo */
  body.tema-arsenal[data-secao][class] .barra-inferior {
    background: rgba(6, 7, 8, .8);
    -webkit-backdrop-filter: blur(20px) saturate(1.5); backdrop-filter: blur(20px) saturate(1.5);
    border-top: 1px solid var(--v-line-2);
  }
}

/* =========================================================
   15. Movimento reduzido
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
  body.tema-arsenal[data-secao][class] :is(.card, .bib-category, .bib-library, .app-preview-open img, .bib-category-art img, .card-media video, .link-acao, .btn) { transition: none !important; transform: none !important; }
}

/* =========================================================
   16. Novidades de 05/10/2026: banners novos, Cofre da Edição IA, "Mais curtidos" e patentes em 3D
   ========================================================= */

/* --- Banners das seções: arte no padrão do Mestres Play e, quando não há vídeo tutorial, um loop por trás --- */
body.tema-arsenal[data-secao][class] .cabecalho.com-foto.arte-nova {
  position: relative; overflow: hidden; isolation: isolate;
  min-height: 360px;
  background-color: #05060a;
  background-image: var(--foto);
  background-blend-mode: normal;
  background-repeat: no-repeat;
  background-size: auto 125%;
  background-position: right center;
}
body.tema-arsenal[data-secao][class] .cabecalho.arte-nova::before {
  content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; display: block;
  width: auto; height: auto; border: 0; border-radius: 0;
  background:
    linear-gradient(90deg, #05060a 0%, #05060af2 24%, #05060a9e 42%, #05060a00 62%),
    linear-gradient(0deg, #05060ad9 0%, #05060a00 40%),
    linear-gradient(180deg, #05060a8c 0%, #05060a00 24%);
}
body.tema-arsenal[data-secao][class] .cabecalho.arte-nova > :not(.cab-loop) { position: relative; z-index: 2; }
body.tema-arsenal[data-secao][class] .cab-loop {
  position: absolute; z-index: 0; top: 50%; right: 0;
  height: 125%; width: auto; aspect-ratio: 16 / 9; max-width: none;
  transform: translateY(-50%); object-fit: cover; pointer-events: none;
  opacity: 0; transition: opacity .8s var(--ease);
}
body.tema-arsenal[data-secao][class] .cab-loop.pronto { opacity: 1; }
/* com o vídeo tutorial (Aplicativos, Ferramentas e referências): a arte fica atrás do texto e do cartão de vidro */
body.tema-arsenal[data-secao][class] .cabecalho.com-foto.arte-nova.bib-has-tutorial { background-size: cover; background-position: 58% 45%; }
body.tema-arsenal[data-secao][class] .cabecalho.arte-nova.bib-has-tutorial::before {
  background: linear-gradient(90deg, #05060a 0%, #05060ae6 26%, #05060a66 46%, #05060a1a 70%, #05060a73 100%), linear-gradient(0deg, #05060acc 0%, #05060a00 45%);
}
@media (max-width: 719px) {
  /* celular: a arte em cima, o texto embaixo */
  body.tema-arsenal[data-secao][class] .cabecalho.com-foto.arte-nova {
    min-height: 0; padding-top: 58%;
    background-size: 150% auto; background-position: right top;
  }
  body.tema-arsenal[data-secao][class] .cabecalho.com-foto.arte-nova.bib-has-tutorial { background-size: 150% auto; background-position: right top; }
  body.tema-arsenal[data-secao][class] .cabecalho.arte-nova::before,
  body.tema-arsenal[data-secao][class] .cabecalho.arte-nova.bib-has-tutorial::before {
    background: linear-gradient(180deg, #05060a66 0%, #05060a00 14%, #05060a00 34%, #05060ae6 58%, #05060a 70%);
  }
  body.tema-arsenal[data-secao][class] .cab-loop { top: 0; right: 0; width: 150%; height: auto; transform: none; }
  body.tema-arsenal[data-secao][class] .cabecalho.arte-nova .trilha { position: absolute; top: 16px; left: 20px; right: 20px; margin: 0; padding: 0; }
}

/* --- Cofre da Edição IA: vídeos verticais inteiros, uma caixa por área --- */
body.tema-arsenal[data-secao][class] .cofre-areas { display: grid; gap: 40px; }
body.tema-arsenal[data-secao][class] .cofre-area-cab { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; }
body.tema-arsenal[data-secao][class] .cofre-area-cab h3 { font: 600 22px/1.2 var(--fonte-titulo); letter-spacing: -.02em; color: var(--v-txt); }
body.tema-arsenal[data-secao][class] .cofre-area-n {
  display: inline-grid; place-items: center; min-width: 30px; height: 26px; padding: 0 9px; border-radius: 999px;
  background: var(--acc-12); border: 1px solid var(--acc-35); color: var(--acc); font: 600 12.5px/1 var(--fonte-titulo);
}
body.tema-arsenal[data-secao][class] .cofre-area-cab .link-acao { margin-left: auto; font-size: 13px; color: var(--acc); }
body.tema-arsenal[data-secao][class] .bib-items.grade-cofre { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
@media (max-width: 1250px) { body.tema-arsenal[data-secao][class] .bib-items.grade-cofre { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 719px) { body.tema-arsenal[data-secao][class] .bib-items.grade-cofre { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } }
body.tema-arsenal[data-secao][class] .card.cofre { overflow: hidden; }
body.tema-arsenal[data-secao][class] .card.cofre .cofre-media {
  position: relative; display: block; width: 100%; aspect-ratio: 9 / 16; padding: 0; border: 0;
  background: #000; cursor: pointer; overflow: hidden; color: #fff; text-align: left;
}
body.tema-arsenal[data-secao][class] .card.cofre .cofre-media video,
body.tema-arsenal[data-secao][class] .card.cofre .cofre-media img {
  position: absolute; inset: 0; width: 100%; height: 100%; max-height: none; object-fit: cover; transition: transform .7s var(--ease);
}
@media (hover: hover) {
  body.tema-arsenal[data-secao][class] .card.cofre:hover .cofre-media video,
  body.tema-arsenal[data-secao][class] .card.cofre:hover .cofre-media img { transform: scale(1.04); }
}
body.tema-arsenal[data-secao][class] .cofre-legenda {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; display: grid; gap: 3px;
  padding: 48px 14px 13px; background: linear-gradient(0deg, #000000e0 0%, #000000a0 45%, transparent 100%);
}
body.tema-arsenal[data-secao][class] .cofre-legenda b { font: 650 18px/1.15 var(--fonte-titulo); letter-spacing: -.02em; color: #fff; }
body.tema-arsenal[data-secao][class] .cofre-legenda small { font: 500 12.5px/1.3 var(--leitura); color: #e4e8ec; }
body.tema-arsenal[data-secao][class] .cofre-ver {
  position: absolute; top: 10px; right: 10px; z-index: 1; display: inline-flex; align-items: center; gap: 6px;
  height: 30px; padding: 0 11px; border-radius: 999px; border: 1px solid #ffffff2e;
  background: #08090bb8; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  font: 600 12px/1 var(--fonte-titulo); color: #fff; opacity: 0; transform: translateY(-4px);
  transition: opacity .25s, transform .25s var(--ease), background .2s, color .2s;
}
body.tema-arsenal[data-secao][class] .cofre-ver .ic { width: 14px; height: 14px; }
body.tema-arsenal[data-secao][class] .cofre-media:is(:hover, :focus-visible) .cofre-ver { opacity: 1; transform: none; background: var(--acc); color: #0b0d0f; border-color: transparent; }
@media (hover: none) { body.tema-arsenal[data-secao][class] .cofre-ver { display: none; } }
body.tema-arsenal[data-secao][class] .card.cofre .card-corpo { padding: 13px 14px 15px; gap: 10px; }
body.tema-arsenal[data-secao][class] .cofre-para {
  margin: 0; font: 400 13.5px/1.45 var(--leitura); color: var(--v-txt-2);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
body.tema-arsenal[data-secao][class] .cofre-para span { color: var(--acc); font-weight: 600; }
body.tema-arsenal[data-secao][class] .card.cofre .card-acoes { padding-top: 2px; gap: 8px; flex-wrap: wrap; }
body.tema-arsenal[data-secao][class] .card.cofre .card-acoes .btn { flex: 1 1 auto; height: 36px; min-height: 36px; padding: 0 12px; font-size: 13px; justify-content: center; }
@media (max-width: 719px) {
  body.tema-arsenal[data-secao][class] .card.cofre .card-acoes .btn-secundario { display: none; }
  body.tema-arsenal[data-secao][class] .cofre-legenda b { font-size: 15px; }
  body.tema-arsenal[data-secao][class] .cofre-para { font-size: 12.5px; }
}
/* modelo aberto: vídeo vertical à esquerda, detalhes à direita; anterior e próximo no topo */
@media (min-width: 980px) {
  body.tema-arsenal[data-secao][class] .item-wrap.cofre-aberto { width: min(1060px, 100%); }
  body.tema-arsenal[data-secao][class] .item-wrap.cofre-aberto .item-corpo {
    display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); column-gap: 30px; row-gap: 20px; align-items: start;
  }
  body.tema-arsenal[data-secao][class] .item-wrap.cofre-aberto .item-corpo > * { grid-column: 2; }
  body.tema-arsenal[data-secao][class] .item-wrap.cofre-aberto #it-media { grid-column: 1; grid-row: 1 / span 40; position: sticky; top: 84px; }
}
body.tema-arsenal[data-secao][class] .item-wrap.cofre-aberto #it-media.cofre { border-radius: 20px; background: #000; }
body.tema-arsenal[data-secao][class] .item-wrap.cofre-aberto #it-media.cofre video {
  display: block; width: 100%; aspect-ratio: 9 / 16; height: auto; max-height: calc(100vh - 120px); object-fit: cover;
}
@media (max-width: 979px) {
  body.tema-arsenal[data-secao][class] .item-wrap.cofre-aberto #it-media.cofre { width: min(340px, 100%); margin: 0 auto; }
}
body.tema-arsenal[data-secao][class] .it-nav-cofre { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
body.tema-arsenal[data-secao][class] .it-nav-cofre span { font: 500 12.5px/1 var(--fonte-titulo); color: var(--v-txt-3); white-space: nowrap; }
body.tema-arsenal[data-secao][class] .it-nav-cofre .btn { max-width: 42%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; line-height: 36px; height: 38px; }

/* --- "Mais curtidos": panorama da turma --- */
body.tema-arsenal[data-secao][class] .panorama-abas {
  display: inline-flex; gap: 6px; margin: 4px 0 26px; padding: 5px;
  border-radius: 14px; background: rgba(255, 255, 255, .04); border: 1px solid var(--v-line-2);
}
body.tema-arsenal[data-secao][class] .panorama-aba {
  display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 18px; border-radius: 10px;
  font: 600 14px/1 var(--fonte-titulo); color: var(--v-txt-2); transition: background .2s, color .2s;
}
body.tema-arsenal[data-secao][class] .panorama-aba .ic { width: 17px; height: 17px; }
body.tema-arsenal[data-secao][class] .panorama-aba:hover { color: #fff; background: rgba(255, 255, 255, .05); }
body.tema-arsenal[data-secao][class] .panorama-aba[aria-selected="true"] { background: var(--acc); color: #0b0d0f; box-shadow: 0 8px 22px -12px var(--acc); }
body.tema-arsenal[data-secao][class] .panorama { display: grid; gap: 8px; }
body.tema-arsenal[data-secao][class] .panorama-podio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
body.tema-arsenal[data-secao][class] .podio-item {
  position: relative; display: grid; grid-template-rows: auto 1fr auto; overflow: hidden; cursor: pointer;
  border-radius: 22px; border: 1px solid transparent;
  background: var(--v-card) padding-box, var(--v-borda) border-box; box-shadow: var(--v-sombra);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
@media (hover: hover) { body.tema-arsenal[data-secao][class] .podio-item:hover { transform: translateY(-4px); box-shadow: var(--v-sombra-hover); } }
body.tema-arsenal[data-secao][class] .podio-item .prat-capa { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: radial-gradient(ellipse at 50% 0, color-mix(in srgb, var(--tc) 30%, transparent), transparent 70%), #0b0d10; }
body.tema-arsenal[data-secao][class] .podio-item .prat-capa img { width: 100%; height: 100%; object-fit: cover; }
body.tema-arsenal[data-secao][class] .podio-item .prat-tile { display: grid; place-items: center; width: 100%; height: auto; border-radius: 0; border: 0; }
body.tema-arsenal[data-secao][class] .podio-item .prat-tile .ic { width: 44px; height: 44px; }
body.tema-arsenal[data-secao][class] .podio-item .rk-pos {
  position: absolute; top: 12px; left: 12px; z-index: 1; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%;
  background: var(--acc); color: #0b0d0f; font: 700 16px/1 var(--fonte-titulo); box-shadow: 0 6px 18px -6px #000;
}
body.tema-arsenal[data-secao][class] .podio-item .prat-txt { display: grid; gap: 4px; padding: 16px 18px 6px; }
body.tema-arsenal[data-secao][class] .podio-item .rk-titulo { font: 600 18px/1.25 var(--fonte-titulo); letter-spacing: -.02em; color: var(--v-txt); text-align: left; }
body.tema-arsenal[data-secao][class] :is(.podio-item, .prat-item) .rk-meta { font-size: 12.5px; color: var(--v-txt-3); }
body.tema-arsenal[data-secao][class] .podio-item .prat-n { display: flex; align-items: center; gap: 7px; padding: 4px 18px 18px; font-size: 14px; color: var(--v-txt-2); }
body.tema-arsenal[data-secao][class] :is(.podio-item, .prat-item) .prat-n .ic { width: 16px; height: 16px; color: var(--acc); }
body.tema-arsenal[data-secao][class] :is(.podio-item, .prat-item) .prat-n b { font-weight: 600; color: var(--v-txt); }
body.tema-arsenal[data-secao][class] .panorama-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
body.tema-arsenal[data-secao][class] .prateleira {
  padding: 18px 18px 12px; border-radius: 22px; border: 1px solid transparent;
  background: radial-gradient(ellipse 70% 50% at 0 0, color-mix(in srgb, var(--tc) 12%, transparent), transparent 70%), var(--v-card) padding-box, var(--v-borda) border-box;
}
body.tema-arsenal[data-secao][class] .prateleira-cab { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
body.tema-arsenal[data-secao][class] .prateleira-cab h3 { font: 600 18px/1.2 var(--fonte-titulo); letter-spacing: -.02em; }
body.tema-arsenal[data-secao][class] .prateleira-cab .link-acao { margin-left: auto; font-size: 13px; color: var(--tc); }
body.tema-arsenal[data-secao][class] .prateleira-lista { display: grid; }
body.tema-arsenal[data-secao][class] .prat-item {
  display: grid; grid-template-columns: 24px 56px minmax(0, 1fr) auto; align-items: center; gap: 12px;
  padding: 9px 8px; border-radius: 12px; cursor: pointer; transition: background .2s;
}
body.tema-arsenal[data-secao][class] .prat-item + .prat-item { border-top: 1px solid var(--v-line); }
body.tema-arsenal[data-secao][class] .prat-item:hover { background: rgba(255, 255, 255, .04); }
body.tema-arsenal[data-secao][class] .prat-item .rk-pos { font: 700 15px/1 var(--fonte-titulo); color: var(--v-txt-3); text-align: center; }
body.tema-arsenal[data-secao][class] .prat-item:nth-child(-n+3) .rk-pos { color: var(--tc); }
body.tema-arsenal[data-secao][class] .prat-item .prat-capa { display: grid; place-items: center; width: 56px; height: 42px; overflow: hidden; border-radius: 10px; background: #0b0d10; border: 1px solid var(--v-line); }
body.tema-arsenal[data-secao][class] .prat-item .prat-capa img { width: 100%; height: 100%; object-fit: cover; }
body.tema-arsenal[data-secao][class] .prat-item .prat-txt { display: grid; gap: 3px; min-width: 0; }
body.tema-arsenal[data-secao][class] .prat-item .rk-titulo {
  display: block; max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  font: 600 14.5px/1.3 var(--fonte-titulo); color: var(--v-txt); text-align: left;
}
body.tema-arsenal[data-secao][class] .prat-item .prat-n { display: flex; align-items: center; gap: 5px; font-size: 12.5px; color: var(--v-txt-2); white-space: nowrap; }
@media (max-width: 900px) {
  body.tema-arsenal[data-secao][class] .panorama-podio,
  body.tema-arsenal[data-secao][class] .panorama-grade { grid-template-columns: minmax(0, 1fr); }
  body.tema-arsenal[data-secao][class] .podio-item { grid-template-columns: 120px minmax(0, 1fr); grid-template-rows: auto auto; }
  body.tema-arsenal[data-secao][class] .podio-item .prat-capa { grid-row: 1 / span 2; aspect-ratio: auto; height: 100%; min-height: 96px; }
  body.tema-arsenal[data-secao][class] .podio-item .prat-txt { padding: 14px 14px 2px; }
  body.tema-arsenal[data-secao][class] .podio-item .prat-n { padding: 2px 14px 14px; }
  body.tema-arsenal[data-secao][class] .podio-item .rk-titulo { font-size: 16px; }
  body.tema-arsenal[data-secao][class] .panorama-abas { display: flex; }
  body.tema-arsenal[data-secao][class] .panorama-aba { flex: 1; justify-content: center; padding: 0 10px; }
}

/* --- Patentes: ícones 3D e insígnia que gira --- */
body.tema-arsenal[data-secao][class] img.ins { object-fit: contain; filter: drop-shadow(0 6px 12px rgba(0, 0, 0, .5)); }
body.tema-arsenal[data-secao][class] .patente { cursor: pointer; }
body.tema-arsenal[data-secao][class] .patente .ins { transition: transform .3s var(--ease); }
body.tema-arsenal[data-secao][class] .patente:hover .ins { transform: scale(1.1) rotate(-4deg); }
body.tema-arsenal[data-secao][class] .ins-botao { position: relative; padding: 0; border: 0; background: none; cursor: pointer; border-radius: 26px; }
body.tema-arsenal[data-secao][class] .painel-patente .ins-botao .ins { width: 150px; height: 150px; transition: transform .35s var(--ease); }
body.tema-arsenal[data-secao][class] .ins-botao:hover .ins { transform: scale(1.06) rotate(-3deg); }
body.tema-arsenal[data-secao][class] .ins-dica {
  position: absolute; left: 50%; bottom: -4px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 5px; white-space: nowrap;
  height: 26px; padding: 0 10px; border-radius: 999px; border: 1px solid var(--v-line-2); background: #08090bd9;
  font: 600 11.5px/1 var(--fonte-titulo); color: var(--v-txt);
}
body.tema-arsenal[data-secao][class] .ins-dica .ic { width: 13px; height: 13px; }
body.tema-arsenal[data-secao][class] .degrau { padding: 0; }
body.tema-arsenal[data-secao][class] .degrau-botao {
  display: grid; justify-items: center; gap: 6px; width: 100%; padding: 14px 6px 12px; border: 0; background: none; color: inherit;
  cursor: pointer; border-radius: inherit; font: inherit; text-align: center;
}
body.tema-arsenal[data-secao][class] .degrau .ins { width: 70px; height: 70px; transition: transform .3s var(--ease); }
body.tema-arsenal[data-secao][class] .degrau-botao:hover .ins { transform: translateY(-3px) scale(1.06); }
body.tema-arsenal[data-secao][class] .degrau:not(.ok):not(.atual) .ins { opacity: 1; filter: grayscale(1) brightness(.5) drop-shadow(0 6px 12px rgba(0, 0, 0, .5)); }
@media (max-width: 719px) { body.tema-arsenal[data-secao][class] .degrau .ins { width: 48px; height: 48px; } }

.medalha-fundo {
  position: fixed; inset: 0; z-index: 400; display: grid; place-items: center; padding: 16px;
  background: radial-gradient(ellipse at 50% 38%, rgba(60, 90, 140, .35), rgba(3, 4, 6, .93) 68%);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  animation: fundo .2s ease;
}
.medalha-fundo[hidden] { display: none; }
.medalha-caixa {
  position: relative; display: grid; justify-items: center; gap: 10px; width: min(440px, 100%);
  padding: 22px 22px 20px; border-radius: 28px; text-align: center;
  background: linear-gradient(180deg, #13161b, #0a0b0d); border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: 0 40px 100px -30px #000, inset 0 1px 0 rgba(255, 255, 255, .07);
}
.medalha-caixa .close { position: absolute; top: 14px; right: 14px; z-index: 2; }
.medalha-caixa h2 { font: 650 28px/1.1 var(--fonte-titulo); letter-spacing: -.03em; color: #fff; }
.medalha-caixa p { margin: 0; font: 400 15px/1.5 'DM Sans', var(--fonte-texto); color: #b9c0c8; }
.medalha-caixa .hud-rotulo { margin-top: 4px; color: #c5f76b; font-weight: 600; }
.medalha-caixa > .btn { margin-top: 6px; }
.medalha-dica { font-size: 12px; color: #858d97; }
.medalha-palco {
  position: relative; display: grid; place-items: center; width: min(300px, 72vw); aspect-ratio: 1;
  perspective: 900px; cursor: grab; touch-action: none; border-radius: 26px; outline-offset: 6px; user-select: none; -webkit-user-select: none;
}
.medalha-palco.arrastando { cursor: grabbing; }
.medalha-chao { position: absolute; bottom: 5%; left: 22%; width: 56%; height: 9%; border-radius: 50%; background: radial-gradient(ellipse, rgba(0, 0, 0, .7), transparent 70%); filter: blur(5px); }
.medalha3d { position: relative; width: 80%; aspect-ratio: 1; transform-style: preserve-3d; will-change: transform; }
.medalha3d img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; pointer-events: none; user-select: none; -webkit-user-drag: none; }
.medalha3d .m-frente { transform: translateZ(7px); backface-visibility: hidden; -webkit-backface-visibility: hidden; filter: drop-shadow(0 0 1px rgba(255, 255, 255, .2)); }
.medalha3d .m-camada { transform: translateZ(calc(7px - var(--k) * 1.3px)); filter: brightness(.38) saturate(.85); }
.medalha3d .m-verso { transform: translateZ(-7px) rotateY(180deg); filter: brightness(.58) saturate(.6); backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.medalha3d .m-brilho {
  position: absolute; inset: 0; transform: translateZ(7.5px); pointer-events: none; backface-visibility: hidden; -webkit-backface-visibility: hidden;
  background: linear-gradient(115deg, transparent calc(var(--luz, 50%) - 22%), rgba(255, 255, 255, .5) var(--luz, 50%), transparent calc(var(--luz, 50%) + 22%));
  mix-blend-mode: soft-light;
  -webkit-mask: var(--src) center / contain no-repeat; mask: var(--src) center / contain no-repeat;
}
.medalha3d.bloqueada img { filter: grayscale(1) brightness(.45); }
.medalha3d.bloqueada .m-camada { filter: grayscale(1) brightness(.25); }
.medalha3d .m-cadeado {
  position: absolute; left: 50%; top: 50%; width: 30%; aspect-ratio: 1; transform: translate(-50%, -50%) translateZ(10px);
  display: grid; place-items: center; border-radius: 50%; background: #0b0d10e6; border: 1px solid rgba(255, 255, 255, .2); color: #e8ebee;
  backface-visibility: hidden; -webkit-backface-visibility: hidden;
}
.medalha3d .m-cadeado svg { width: 46%; height: 46%; }
.medalha-nav { display: flex; align-items: center; gap: 14px; margin-top: 2px; }
.medalha-nav .btn { width: 40px; min-height: 36px; height: 36px; padding: 0; justify-content: center; font-size: 20px; }
.medalha-nav .btn[disabled] { opacity: .35; cursor: default; }
.medalha-nav span { display: flex; gap: 6px; }
.medalha-nav i { width: 8px; height: 8px; border-radius: 50%; background: rgba(255, 255, 255, .16); }
.medalha-nav i.tem { background: rgba(197, 247, 107, .45); }
.medalha-nav i.on { background: #c5f76b; box-shadow: 0 0 10px #c5f76b; transform: scale(1.25); }
/* nova patente: a insígnia balança 15° para cada lado, em vaivém */
.subiu-card { perspective: 800px; }
.subiu-card .medalha3d.girando { width: 150px; animation: medalha-balanca 4s ease-in-out infinite; }
@keyframes medalha-balanca { 0%, 100% { transform: rotateX(-6deg) rotateY(-15deg); } 50% { transform: rotateX(-6deg) rotateY(15deg); } }
@media (prefers-reduced-motion: reduce) { .subiu-card .medalha3d.girando { animation: none; transform: rotateY(-20deg); } }