/* ============================================================
   Polimento visual: camadas de preto e cinza, bordas com luz,
   sombras em profundidade e brilhos suaves de fundo.
   Carregado por último.
   ============================================================ */
:root {
  --p-0: #050507;
  --p-1: #0b0b10;
  --p-2: #121218;
  --p-3: #1a1a22;
  --p-4: #24242e;
  --borda-1: rgba(255,255,255,.07);
  --borda-2: rgba(255,255,255,.13);
  --luz-topo: inset 0 1px 0 rgba(255,255,255,.07);
  --sombra-1: 0 1px 2px rgba(0,0,0,.6), 0 8px 18px rgba(0,0,0,.45);
  --sombra-2: 0 2px 4px rgba(0,0,0,.6), 0 16px 36px rgba(0,0,0,.55);
  --brilho-roxo: 0 0 0 1px rgba(200,62,250,.28), 0 12px 34px rgba(200,62,250,.18);
}

/* Fundo geral com brilhos suaves */
html { background: var(--p-0); }
body {
  background:
    radial-gradient(900px 520px at 8% -8%, rgba(200,62,250,.13), transparent 62%),
    radial-gradient(800px 600px at 100% 12%, rgba(124,92,255,.11), transparent 60%),
    radial-gradient(700px 520px at 50% 115%, rgba(61,213,255,.05), transparent 60%),
    linear-gradient(180deg, #08080c 0%, #050507 60%, #070609 100%);
  background-attachment: fixed;
}
body::after {
  content: ""; position: fixed; inset: -20%; z-index: 0; pointer-events: none;
  background:
    radial-gradient(28% 22% at 22% 30%, rgba(200,62,250,.07), transparent 70%),
    radial-gradient(26% 24% at 78% 70%, rgba(124,92,255,.07), transparent 70%);
  filter: blur(20px);
  animation: brilhoFundo 28s ease-in-out infinite alternate;
}
@keyframes brilhoFundo { to { transform: translate3d(4%, -3%, 0) scale(1.06); } }
.shell, .lp { position: relative; z-index: 1; }

/* Barra de rolagem */
* { scrollbar-width: thin; scrollbar-color: #3a2f4a transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #3d2f52, #2a2238); border-radius: 10px; border: 2px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #6a3d93, #45306a); background-clip: padding-box; }

/* Menu lateral: preto profundo com vidro */
.sidebar { background: linear-gradient(180deg, rgba(18,17,24,.96) 0%, rgba(10,10,14,.97) 55%, rgba(7,7,10,.98) 100%); backdrop-filter: blur(14px); box-shadow: 1px 0 0 rgba(255,255,255,.04), 12px 0 40px rgba(0,0,0,.55); }
.sb-nav { background: linear-gradient(180deg, var(--p-3), var(--p-2)); border-color: var(--borda-1); box-shadow: var(--luz-topo), var(--sombra-1); }
.sb-nav:hover { border-color: var(--borda-2); background: linear-gradient(180deg, #202029, #16161d); box-shadow: var(--luz-topo), var(--sombra-2); }
.sb-nav.active { box-shadow: var(--luz-topo), inset 3px 0 0 var(--mg), var(--brilho-roxo); }
.sb-resumo { box-shadow: var(--luz-topo), var(--sombra-1); }

/* Menu lateral: acabamento sofisticado e discreto (25/09/2026) - ícones e fonte menores,
   sombras leves, tom magenta mais contido em vez do brilho forte de antes. */
.sb-menu { gap: 4px; }
.sb-nav { padding: 6px 9px; gap: 9px; border-radius: 10px; border-color: rgba(255,255,255,.05); box-shadow: 0 1px 0 rgba(255,255,255,.03) inset, 0 2px 5px rgba(0,0,0,.3); }
.sb-nav:hover { transform: translateX(1px); box-shadow: 0 1px 0 rgba(255,255,255,.04) inset, 0 3px 10px rgba(0,0,0,.38); }
.sb-nav.active { background: linear-gradient(90deg, rgba(200,62,250,.13), rgba(124,92,255,.05) 55%, rgba(18,18,24,.92)); border-color: rgba(200,62,250,.3); box-shadow: 0 1px 0 rgba(255,255,255,.04) inset, inset 2px 0 0 var(--mg), 0 3px 12px rgba(200,62,250,.1); }
.sb-ic { width: 20px; height: 20px; border-radius: 7px; box-shadow: 0 1px 0 rgba(0,0,0,.5); position: relative; overflow: hidden; }
.sb-ic svg { width: 11px; height: 11px; position: relative; z-index: 1; }
.sb-nav.active .sb-ic, .sb-nav:hover .sb-ic { box-shadow: 0 1px 0 rgba(0,0,0,.35), 0 2px 6px rgba(200,62,250,.26); }
/* Radar: varredura girando dentro do ícone do item selecionado */
.sb-nav.active .sb-ic::before {
  content: ""; position: absolute; inset: -35%; z-index: 0;
  background: conic-gradient(from 0deg, transparent 0deg, transparent 290deg, rgba(231,166,255,.55) 316deg, var(--vio) 334deg, transparent 352deg);
  animation: sbRadarGiro 3.4s linear infinite;
}
@keyframes sbRadarGiro { to { transform: rotate(360deg); } }
.sb-lbl b { font-size: .74rem; font-weight: 600; letter-spacing: .1px; }
.sb-lbl small { font-size: .6rem; }
.sb-badge { font-size: .56rem; padding: 1px 6px; font-weight: 700; }
@media (max-width: 420px) {
  .sb-nav { padding: 6px 8px; gap: 8px; }
  .sb-ic { width: 18px; height: 18px; }
  .sb-ic svg { width: 10px; height: 10px; }
  .sb-lbl b { font-size: .71rem; }
  .sb-lbl small { font-size: .58rem; }
}

/* Barra superior em vidro */
.topbar { background: linear-gradient(180deg, rgba(16,13,22,.82), rgba(8,8,11,.72)); backdrop-filter: blur(14px) saturate(1.2); box-shadow: 0 1px 0 rgba(255,255,255,.04), 0 10px 30px rgba(0,0,0,.45); }

/* Painéis e cartões: camadas de cinza, luz no topo e profundidade */
.panel, .dash-card, .cat-card, .tf-item, .lp-rec, .lp-conc-card, .lp-dep, .coment-box, .rep-card, .plano {
  box-shadow: var(--luz-topo), var(--sombra-2) !important;
}
.panel { position: relative; }
.panel::after, .cat-card::after, .dash-kpi::after, .tf-item.ganho::after, .lp-rec::after, .plano::after {
  content: ""; position: absolute; left: 12%; right: 12%; top: 0; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), rgba(231,166,255,.35), rgba(255,255,255,.22), transparent);
}
.cat-card, .dash-kpi, .tf-item, .lp-rec, .plano { position: relative; }
.panel:hover, .cat-card:hover, .lp-rec:hover, .plano:hover { box-shadow: var(--luz-topo), var(--sombra-2), var(--brilho-roxo) !important; }
.panel { transition: box-shadow .25s ease, transform .25s ease; }
.panel-h { background: linear-gradient(180deg, rgba(200,62,250,.12), rgba(124,92,255,.03) 70%, transparent), linear-gradient(180deg, rgba(255,255,255,.025), transparent); }

/* Cabeçalhos das páginas */
.app > h1.title { box-shadow: var(--luz-topo), 0 18px 40px rgba(0,0,0,.55), 0 0 60px rgba(200,62,250,.06); }
.app > p.subtitle { box-shadow: 0 18px 36px rgba(0,0,0,.45); }

/* Números (KPIs): nitidos, sem desfoque (pedido do usuario, 29/09/2026) */
.dash-kpi { box-shadow: var(--luz-topo), var(--sombra-2); border-color: var(--borda-1); }
.dash-kpi:hover { box-shadow: var(--luz-topo), var(--sombra-2), 0 0 30px color-mix(in srgb, var(--c1) 26%, transparent); }

/* Linhas e tabelas */
.row { border-bottom-color: rgba(255,255,255,.045); transition: background .2s, box-shadow .2s, transform .2s; }
.row:hover { transform: translateX(2px); }
.tbl th { background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.015)); border-bottom: 1px solid var(--borda-2); }
.tbl td { border-bottom-color: rgba(255,255,255,.045); }
.tbl tr:not(.grp):not(.sub):not(.bloq):hover td { background: linear-gradient(90deg, rgba(200,62,250,.07), rgba(255,255,255,.015) 70%); }

/* Botões: relevo e reflexo de luz no principal */
.btn { box-shadow: var(--luz-topo), 0 2px 0 rgba(0,0,0,.7), 0 8px 18px rgba(0,0,0,.35); }
.btn.primary { position: relative; overflow: hidden; box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 3px 0 var(--mg-3), 0 10px 26px rgba(200,62,250,.35); }
.btn.primary::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; pointer-events: none; background: linear-gradient(100deg, transparent, rgba(255,255,255,.28), transparent); transform: skewX(-18deg); transition: left .6s ease; }
.btn.primary:hover::after { left: 130%; }
.btn.ghost, .btn.outline { backdrop-filter: blur(6px); }

/* Etiquetas e campos */
.chip { background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02)); border-color: var(--borda-2); box-shadow: var(--luz-topo); }
.fld input, .fld select, .fld textarea, .busca, .nick-box, .login-card input:not([type=checkbox]), .bonus-form input, .rep-card textarea {
  background: linear-gradient(180deg, #09090d, #0e0e14) !important;
  box-shadow: inset 0 2px 8px rgba(0,0,0,.65), 0 1px 0 rgba(255,255,255,.04) !important;
}
.fld input:focus, .fld select:focus, .rep-card textarea:focus, .bonus-form input:focus, .login-card input:focus { border-color: rgba(200,62,250,.7) !important; box-shadow: inset 0 2px 8px rgba(0,0,0,.65), 0 0 0 3px rgba(200,62,250,.18) !important; outline: none; }

/* Meta e constância / Calendário de estudos: acabamento elegante (29/09/2026) */
.dash-metas .panel-b { padding: 20px 18px 22px; gap: 18px; }
.dash-anel { filter: drop-shadow(0 6px 16px rgba(200,62,250,.14)); }
.dm-lista { gap: 10px; }
.dm-lista div { padding: 12px 10px; border-radius: 12px; background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)); border: 1px solid var(--borda-1); box-shadow: var(--luz-topo), 0 3px 8px rgba(0,0,0,.28); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.dm-lista div:hover { transform: translateY(-2px); border-color: rgba(200,62,250,.28); box-shadow: var(--luz-topo), 0 8px 18px rgba(200,62,250,.14); }
.dm-lista b { background: linear-gradient(180deg, #fff, var(--mg-hi)); -webkit-background-clip: text; background-clip: text; color: transparent; }

.cal-mes { font-weight: 800; letter-spacing: .2px; }
.cal-sem span { opacity: .55; }
.cal-d { border-radius: 11px; transition: transform .15s ease, box-shadow .15s ease; }
.cal-d.ok { background: linear-gradient(160deg, #4fe092, #23a35c 65%, #1c8a4c); border-color: rgba(255,255,255,.16); box-shadow: 0 1px 0 rgba(255,255,255,.22) inset, 0 3px 10px rgba(35,163,92,.22); }
.cal-d.perdido { background: linear-gradient(160deg, #f0605f, #c22f2f 65%, #a52626); border-color: rgba(255,255,255,.12); box-shadow: 0 1px 0 rgba(255,255,255,.16) inset, 0 3px 10px rgba(194,47,47,.2); }
.cal-d.ok:hover, .cal-d.perdido:hover { transform: translateY(-1px); }
.cal-d.is-hoje { box-shadow: 0 0 0 2px var(--mg-hi), 0 3px 12px rgba(200,62,250,.28); }
.cal-mk { font-size: .78rem; text-shadow: 0 1px 2px rgba(0,0,0,.35); }
.cal-leg { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 18px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--borda-1); font-size: .78rem; }
.cal-leg .cal-seq { margin-left: auto; color: var(--gray-hi); }
.cal-leg .cal-seq b { color: var(--mg-hi); font-weight: 800; }

/* Janelas (login, avisos, troféu) */
.rep-pop { background: radial-gradient(60% 60% at 50% 40%, rgba(40,20,60,.55), rgba(3,3,6,.82)); }
.rep-card { border: 1px solid transparent; background: linear-gradient(180deg, #1d1828, #111117) padding-box, var(--grad-edge) border-box; }

/* Movimento reduzido */
@media (prefers-reduced-motion: reduce) { body::after { animation: none; } .btn.primary::after { display: none; } .sb-nav.active .sb-ic::before { animation: none; } }

/* Listas de seleção legíveis (as opções abrem com fundo escuro e texto claro) */
select option, select optgroup { background: #17151f; color: #f4f4f7; }
.fld select { color: var(--text); }

/* Configurações: interruptores lado a lado, sem quebra de linha */
.form-grid .sw-linha { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 32px; padding-top: 2px; }
.sw-linha .sw span { white-space: nowrap; }
.conta-dados .sw + .nick-msg { display: block; margin-top: 6px; max-width: 520px; }
@media (max-width: 640px) { .sw-linha .sw span { white-space: normal; } }

/* Painel comercial: botão atualizar */
.adm-atualizar { display: inline-flex; align-items: center; gap: 6px; }
.adm-atualizar svg { width: 14px; height: 14px; }
.adm-atualizar:disabled { opacity: .6; }

/* Verso do flashcard: explicações uma embaixo da outra */
.quiz .fc-stage .verso .box-estrutura { display: block !important; }
.fc-stage .verso .lista-item { margin-bottom: 14px; }

/* Comentários: paginação */
.coment-mais { display: flex; justify-content: center; padding: 10px 0 4px; }

/* Barra da apostila: informações à esquerda, ações alinhadas à direita; no celular, 4 botões iguais lado a lado */
.viewer-bar.vb2 { display: flex; align-items: center; justify-content: space-between; gap: 14px 22px; flex-wrap: wrap; margin-bottom: 12px; padding: 16px 18px; border-radius: 16px; border: 1px solid transparent;
  background: linear-gradient(180deg, #2a1838 0%, #1a1424 55%, #15151c 100%) padding-box, var(--grad-edge) border-box; box-shadow: var(--luz-topo), var(--sombra-2); }
.vb2 .vb-info { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.vb2 .vb-kicker { font-size: .68rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; color: var(--mg-hi); }
.vb2 .vb-info h2 { margin: 0; font-size: 1.1rem; line-height: 1.3; }
.vb2 .vb-info small { color: var(--muted); font-size: .8rem; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vb2 .vb-info .rep-btn { margin: 6px 0 0; align-self: flex-start; }
.vb2 .vb-acts { flex: 0 1 auto; display: grid; grid-template-columns: repeat(4, auto); gap: 8px; align-items: center; }
.vb2 .vb-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; white-space: nowrap; min-height: 42px; padding: 9px 14px; }
.vb2 .vb-ic { width: 17px; height: 17px; flex: none; }
.vb2 .vb-curto { display: none; }
@media (max-width: 900px) {
  .viewer-bar.vb2 { display: flex; flex-direction: column; align-items: stretch; padding: 12px 12px 10px; gap: 10px; }
  .vb2 .vb-info { flex: 0 0 auto; }
  .vb2 .vb-info h2 { font-size: 1rem; }
  .vb2 .vb-info small { -webkit-line-clamp: 1; }
  .vb2 .vb-acts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
  .vb2 .vb-btn { flex-direction: column; gap: 5px; min-height: 60px; padding: 8px 4px 7px; font-size: .68rem; line-height: 1.1; letter-spacing: .01em; border-radius: 13px; white-space: nowrap; overflow: hidden; }
  .vb2 .vb-btn b { font-weight: 900; }
  .vb2 .vb-ic { width: 20px; height: 20px; }
  .vb2 .vb-longo { display: none; }
  .vb2 .vb-curto { display: inline; }
  .vb2 .vb-btn.ghost, .vb2 .vb-btn.outline { background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025)); border: 1px solid rgba(255,255,255,.14); }
  .vb2 .vb-btn.outline { border-color: rgba(200,62,250,.55); color: var(--mg-hi); }
}
@media (max-width: 360px) { .vb2 .vb-btn { font-size: .62rem; padding-left: 2px; padding-right: 2px; } }

/* Apostila carregando do servidor protegido */
.frame.frame-box { display: grid; place-items: center; background: linear-gradient(180deg, #121218, #0b0b10); border: 1px solid rgba(255,255,255,.08); border-radius: 14px; }
.frame.frame-box .empty { max-width: 420px; text-align: center; }

/* Sem impressão no app (apostilas e flashcards não saem em PDF nem em papel) */
@media print { html, body { display: none !important; } }

/* Tela cheia da apostila dentro do app */
.ap-tela { position: relative; }
.ap-sair-tela { display: none; }
.ap-tela.tela-cheia { position: fixed; inset: 0; z-index: 1000; background: #050507; padding: env(safe-area-inset-top) 0 env(safe-area-inset-bottom); display: flex; flex-direction: column; }
.ap-tela.tela-cheia .frame { flex: 1; width: 100%; height: auto !important; min-height: 0 !important; border-radius: 0; border: 0; }
.ap-tela.tela-cheia .ap-sair-tela { display: inline-flex; align-items: center; gap: 6px; position: absolute; top: calc(10px + env(safe-area-inset-top)); right: 14px; z-index: 2; background: rgba(12,12,18,.82); border: 1px solid rgba(255,255,255,.18); backdrop-filter: blur(8px); box-shadow: 0 6px 20px rgba(0,0,0,.5); }
.ap-tela.tela-cheia .ap-sair-tela svg { width: 15px; height: 15px; }
.ap-tela:fullscreen { background: #050507; }
body.tela-cheia-ativa { overflow: hidden; }

/* Rodapé do menu: apelido e suporte pelo WhatsApp numa linha só (não empurra nem corta o menu) */
.sidebar .sb-body { min-height: 0; padding-bottom: 12px; }
.sb-foot { padding: 10px 12px 10px; gap: 8px; }
.sb-foot .sb-user { flex: 1 1 0; min-width: 0; display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 12px; color: var(--text); font-weight: 700; background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)); border: 1px solid rgba(255,255,255,.08); }
.sb-foot .sb-user[hidden] { display: none; }
.sb-foot .sb-user .av { width: 28px; height: 28px; flex: none; font-size: .8rem; }
.sb-foot .sb-user span:not(.av) { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .82rem; }
.sb-foot .sb-user:hover { border-color: rgba(200,62,250,.45); }
.sb-foot .sb-suporte { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: 5px; padding: 6px 10px; border-radius: 10px; font-weight: 800; font-size: .74rem; color: #eafff1; background: linear-gradient(135deg, #1f9d55, #25d366); border: 1px solid rgba(37,211,102,.55); box-shadow: 0 6px 18px rgba(37,211,102,.22), inset 0 1px 0 rgba(255,255,255,.2); }
.sb-foot .sb-user[hidden] + .sb-suporte { flex: 0 0 auto; }
.sb-foot .sb-suporte:hover { filter: brightness(1.08); }
.sb-foot .sb-suporte svg { width: 14px; height: 14px; flex: none; }
.sb-foot .sb-legal { width: 100%; flex-wrap: wrap; gap: 12px; }
/* telas mais baixas: menu um pouco mais compacto para caber sem cortar */
@media (min-width: 901px) and (max-height: 860px) {
  .sb-menu { gap: 4px; }
  .sb-nav { padding: 6px 9px; }
  .sb-nav small { display: none; }
  .sb-resumo { margin-top: 10px; }
}
@media (min-width: 901px) {
  body.sb-mini .sb-foot { display: flex; justify-content: center; padding: 10px 8px; }
  body.sb-mini .sb-foot > :not(.sb-suporte) { display: none !important; }
  body.sb-mini .sb-foot .sb-suporte { width: 44px; height: 44px; padding: 0; border-radius: 50%; flex: none; }
  body.sb-mini .sb-foot .sb-suporte span { display: none; }
}
/* Avisos da Eduzz no painel */
.chip.ev-aplicado { color: #bff5d2; border-color: rgba(95,217,143,.5); background: rgba(47,191,104,.12); }
.chip.ev-erro, .chip.ko { color: #ffb4b4; border-color: rgba(255,120,120,.45); }
.chip.ev-ignorado { color: var(--muted); }

/* Plano anual (plano único) */
.planos.plano-unico { grid-template-columns: minmax(0, 480px); }
.plano-unico .plano-preco small:first-child { display: block; margin-bottom: 2px; text-transform: uppercase; letter-spacing: .08em; font-weight: 800; font-size: .68rem; color: var(--mg-hi); }
.plano-unico .plano-preco b { font-size: 2.3rem; line-height: 1.1; }
.plano-unico .btn.lp-btn-grande { justify-content: center; width: 100%; }
.plano-gratis { color: var(--muted); font-size: .86rem; margin-top: 14px; }

/* Assunto sem conteúdo ainda */
.chip.chip-dev { margin-left: 8px; font-weight: 700; color: var(--mg-hi); border-color: rgba(200,62,250,.45); background: rgba(200,62,250,.08); white-space: nowrap; }
@media (max-width: 640px) { .chip.chip-dev { white-space: normal; display: inline-block; margin: 6px 0 0; } }

/* Quantidade de comentários: ao lado do apelido e no perfil */
.cm-top { flex-wrap: wrap; row-gap: 2px; }
.cm-qtd { font-size: .68rem; font-weight: 700; color: var(--mg-hi); padding: 1px 8px; border-radius: 999px; border: 1px solid rgba(200,62,250,.35); background: rgba(200,62,250,.08); white-space: nowrap; }
.dash-kpi.k-cia { --c1: #1fb6d6; --c2: #8be9ff; }
.perfil-kpis { grid-template-columns: repeat(6, 1fr); }
@media (max-width: 1400px) { .perfil-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 760px) { .perfil-kpis { grid-template-columns: repeat(2, 1fr); } }

/* Textos dos cards de números sem cortar */
.dk-txt { min-width: 0; }
.dk-txt small, .dk-txt span { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; overflow-wrap: normal; word-break: normal; hyphens: none; }
@media (max-width: 600px) { .dk-txt span { font-size: .62rem; letter-spacing: .2px; } .dk-kpi, .dash-kpi { padding: 14px 12px; gap: 10px; } }
/* Perfil: concursos e progresso por matéria e assunto */
.pf-concursos .panel-b { display: grid; gap: 14px; }
.pfc { padding: 14px; border-radius: 14px; border: 1px solid rgba(255,255,255,.08); background: linear-gradient(180deg, #1a1622, #121118); }
.pfc-top { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.pfc-logo { flex: none; display: grid; place-items: center; width: 74px; height: 40px; padding: 4px 6px; border-radius: 10px; background: #fff; }
.pfc-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.pfc-nome { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.pfc-nome b { font-size: 1.05rem; color: #fff; }
.pfc-nome small { color: var(--muted); font-size: .78rem; overflow-wrap: anywhere; }
.pfc-pct { font-size: 1.5rem; font-weight: 900; color: var(--mg-hi); }
.pfc .bar { height: 10px; }
.pfc > .bar { margin-bottom: 4px; }
.pfc-info { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 8px 0 4px; font-size: .78rem; color: var(--muted); }
.pfc-mats { display: grid; gap: 6px; margin-top: 10px; }
.pfm { border-radius: 10px; border: 1px solid rgba(255,255,255,.06); background: rgba(255,255,255,.02); }
.pfm summary { display: grid; grid-template-columns: minmax(0, 1fr) minmax(90px, 160px) 46px; align-items: center; gap: 10px; padding: 9px 12px; cursor: pointer; list-style: none; }
.pfm summary::-webkit-details-marker { display: none; }
.pfm summary::before { content: "›"; position: absolute; opacity: 0; }
.pfm[open] summary { border-bottom: 1px solid rgba(255,255,255,.06); }
.pfm-nome { font-weight: 700; font-size: .86rem; color: var(--text); overflow-wrap: anywhere; }
.pfm .bar, .pfa .bar { display: block; height: 8px; }
.pfm summary b, .pfa b { text-align: right; font-size: .82rem; color: var(--mg-hi); }
.pfa { list-style: none; margin: 0; padding: 6px 12px 10px; display: grid; gap: 6px; }
.pfa li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(70px, 140px) 46px; align-items: center; gap: 10px; font-size: .8rem; color: var(--gray-hi); }
.pfa-nome { overflow-wrap: anywhere; }
.pf-legenda { margin: 2px 0 0; font-size: .74rem; color: var(--muted); }
/* Troféus: filtro por categoria */
.tf-filtros { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.tf-filtro { font: inherit; font-size: .78rem; font-weight: 700; color: var(--gray-hi); padding: 6px 12px; border-radius: 999px; border: 1px solid rgba(255,255,255,.1); background: #16151d; cursor: pointer; }
.tf-filtro b { color: var(--muted); font-weight: 800; margin-left: 4px; }
.tf-filtro.on { color: #fff; border-color: rgba(200,62,250,.6); background: linear-gradient(135deg, rgba(200,62,250,.28), rgba(124,92,255,.22)); }
.tf-filtro.on b { color: var(--mg-hi); }
@media (max-width: 600px) {
  .pfm summary { grid-template-columns: minmax(0, 1fr) 46px; }
  .pfm summary .bar { grid-column: 1 / -1; grid-row: 2; }
  .pfa li { grid-template-columns: minmax(0, 1fr) 46px; }
  .pfa li .bar { grid-column: 1 / -1; grid-row: 2; }
  .pfc-logo { width: 60px; height: 34px; }
}

/* Perfil: sem o nome abaixo do apelido, espaço antes das etiquetas */
.ph-id h1 { margin-bottom: 10px; }

/* Ranking: cabecalho sempre em 2 linhas (titulo, depois chips), pra ficar igual nos dois quadros
   independente do titulo ser curto ("Ranking do dia") ou longo ("Ranking geral: mais...") */
.rk-painel .panel-h { flex-direction: column; align-items: stretch; gap: 8px; padding: 14px 16px 12px; background: linear-gradient(180deg, rgba(200,62,250,.12), rgba(124,92,255,.03) 70%, transparent); border-bottom: 1px solid rgba(231,166,255,.18); }
.rk-painel .panel-h h2 { line-height: 1.25; font-weight: 800; letter-spacing: .1px; }
.rk-painel .panel-h .r { margin-left: 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: flex-end; }
.rk-chip-pos { font-weight: 800; }
.rk-painel .panel-b { padding: 14px 16px; }
.rk-sep { display: flex; justify-content: center; gap: 6px; padding: 2px 0; }
.rk-sep span { width: 5px; height: 5px; border-radius: 50%; background: rgba(231,166,255,.45); }
@media (max-width: 600px) { .rk-painel .panel-h { gap: 6px; } .rk-painel .panel-h .r { justify-content: flex-start; } }

/* Card Troféus conquistados: contagem por nível em miniatura */
.dash-kpi.com-extra { flex-wrap: wrap; container-type: inline-size; }
.tf-mini { flex: 1 0 100%; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 5px; margin-top: 2px; }
.tf-mini i { --nv: #F6C08D; display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 5px 2px 4px; border-radius: 10px; font-style: normal; line-height: 1;
  color: var(--nv); border: 1px solid color-mix(in srgb, var(--nv) 38%, transparent); background: linear-gradient(180deg, color-mix(in srgb, var(--nv) 16%, transparent), color-mix(in srgb, var(--nv) 5%, transparent)); }
.tf-mini svg { width: 14px; height: 14px; filter: drop-shadow(0 1px 3px color-mix(in srgb, var(--nv) 45%, transparent)); }
.tf-mini em { font-style: normal; font-size: .8rem; font-weight: 900; color: #fff; }
.tf-mini small { display: none; font-size: .54rem; font-weight: 800; letter-spacing: .2px; text-transform: uppercase; color: var(--nv); white-space: nowrap; }
.tf-mini .tf-mini-prata { --nv: #E6EAF2; }
.tf-mini .tf-mini-ouro { --nv: #FFD95A; }
.tf-mini .tf-mini-diamante { --nv: #8FE3FF; }
.tf-mini .tf-mini-lenda { --nv: #E7A6FF; }
@container (min-width: 250px) { .tf-mini small { display: block; } .tf-mini { gap: 6px; } }

/* Tela larga: o conteúdo ocupa a largura disponível (antes parava em 1180px e sobrava espaço à direita) */
.app { max-width: 1760px; margin-inline: auto; padding-inline: clamp(12px, 1.8vw, 32px); }

/* Topo sempre em uma linha: a trilha encurta com reticências; página atual, Desempenho e conta nunca quebram */
.topbar { flex-wrap: nowrap; min-height: 60px; gap: 10px; padding-block: 10px; }
.crumbs { flex: 1 1 auto; flex-wrap: nowrap; overflow: hidden; white-space: nowrap; gap: 4px; font-size: .8rem; }
.crumbs > * { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.crumbs > a { max-width: 24ch; padding: 3px 6px; }
.crumbs .sep { flex: none; overflow: visible; }
.crumbs > span:not(.sep):last-child { flex-shrink: .25; padding: 3px 9px; }
.top-link { flex: none; white-space: nowrap; font-size: .8rem; padding: 7px 12px; }
.top-conta { flex: none; }
.top-user { white-space: nowrap; font-size: .8rem; padding: 3px 12px 3px 3px; }
.top-user > span:not(.av) { display: block; max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1100px) { .top-user > span:not(.av) { max-width: 150px; } .crumbs > a { max-width: 16ch; } }
@media (max-width: 600px) { .top-user > span:not(.av) { display: none; } .top-user { padding: 3px; } }

/* Minha assinatura (Configurações) e cancelamento */
.ass-grade { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.ass-grade > div { display: flex; flex-direction: column; gap: 3px; padding: 10px 12px; border-radius: 12px; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.03); min-width: 0; }
.ass-grade small { font-size: .7rem; font-weight: 700; letter-spacing: .3px; text-transform: uppercase; color: var(--muted); }
.ass-grade b { font-size: .92rem; color: #fff; overflow-wrap: anywhere; }
.ass-regra { margin: 12px 0 10px; font-size: .84rem; color: var(--gray-hi); }
.ass-linha { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.ass-linha > div { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1 1 280px; }
.ass-linha small { color: var(--muted); font-size: .82rem; line-height: 1.45; }
.chip.ass-ok { color: #9af0bd; border-color: rgba(47,191,104,.5); background: rgba(47,191,104,.12); }
.chip.ass-ko { color: #ffb4b4; border-color: rgba(220,38,38,.5); background: rgba(220,38,38,.12); }
.btn.ass-cancelar { color: #ffd0d0; border: 1px solid rgba(220,38,38,.55); background: linear-gradient(180deg, rgba(220,38,38,.22), rgba(220,38,38,.08)); }
.btn.ass-cancelar:hover:not(:disabled) { box-shadow: 0 0 18px rgba(220,38,38,.35); }
.btn.ass-cancelar:disabled { opacity: .5; cursor: not-allowed; }
.canc-card { max-width: 520px; }
.canc-lista { margin: 4px 0 12px; padding-left: 18px; display: grid; gap: 6px; font-size: .88rem; color: var(--gray-hi); }
.canc-card textarea { width: 100%; resize: vertical; min-height: 70px; }
.canc-ok { display: flex; align-items: flex-start; gap: 8px; margin: 10px 0 4px; font-size: .84rem; color: var(--text); cursor: pointer; }
.canc-ok input { margin-top: 3px; width: 16px; height: 16px; accent-color: #dc2626; flex: none; }
@media (max-width: 900px) { .ass-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .ass-grade { grid-template-columns: 1fr; } .ass-linha .btn { width: 100%; } .canc-card .rep-acts { flex-direction: column-reverse; } .canc-card .rep-acts .btn { width: 100%; } }

/* Card Flashcards respondidos: certos e errados */
.ce-mini { flex: 1 0 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin-top: 2px; }
.ce-mini-barra { grid-column: 1 / -1; display: flex; height: 6px; border-radius: 999px; overflow: hidden; background: rgba(255,255,255,.08); }
.ce-mini-barra i { display: block; height: 100%; }
.ce-b-ok { background: linear-gradient(90deg, #1f9d55, #3ddc84); }
.ce-b-ko { background: linear-gradient(90deg, #ef4444, #b91c1c); }
.ce-cel { --c: #3ddc84; display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 7px; align-items: center; padding: 6px 9px; border-radius: 10px; min-width: 0; overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--c) 35%, transparent); background: linear-gradient(180deg, color-mix(in srgb, var(--c) 14%, transparent), color-mix(in srgb, var(--c) 4%, transparent)); }
.ce-cel.ce-ko { --c: #ff6b6b; }
.ce-cel svg { grid-row: 1 / 3; width: 18px; height: 18px; flex: none; padding: 3px; border-radius: 50%; fill: none; stroke: #0b0b10; stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; background: var(--c); }
.ce-cel em { min-width: 0; font-style: normal; font-size: .95rem; font-weight: 900; color: #fff; line-height: 1.1; }
.ce-cel small { min-width: 0; font-size: .64rem; font-weight: 800; letter-spacing: .2px; text-transform: uppercase; color: var(--c); white-space: normal; overflow-wrap: break-word; line-height: 1.25; }
/* card estreito (perfil no celular ou tablet em pé): empilha os dois blocos em vez de espremer o texto até cortar */
@container (max-width: 260px) { .ce-mini { grid-template-columns: 1fr; } }
@container (max-width: 130px) { .ce-cel { padding: 5px 7px; } .ce-cel small { font-size: .6rem; } }

/* Paginação (catálogo de concursos) */
.paginacao:empty { display: none; }
.paginacao { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; margin: 18px 0 6px; }
.pg-info { font-size: .8rem; color: var(--muted); }
.pg-botoes { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.pg-num, .pg-seta { font: inherit; font-size: .82rem; font-weight: 800; min-width: 38px; height: 38px; padding: 0 12px; border-radius: 10px; color: var(--gray-hi); border: 1px solid rgba(255,255,255,.1); background: #16151d; cursor: pointer; }
.pg-num:hover, .pg-seta:hover:not(:disabled) { color: #fff; border-color: rgba(200,62,250,.5); }
.pg-num.on { color: #fff; border-color: rgba(200,62,250,.7); background: linear-gradient(135deg, rgba(200,62,250,.35), rgba(124,92,255,.28)); box-shadow: 0 0 16px rgba(200,62,250,.25); }
.pg-seta:disabled { opacity: .4; cursor: default; }
.pg-reti { color: var(--muted); padding: 0 2px; }
@media (max-width: 600px) { .paginacao { justify-content: center; } .pg-info { width: 100%; text-align: center; } .pg-num, .pg-seta { min-width: 34px; height: 34px; padding: 0 9px; } }

/* Cards de números com conteúdo extra: ícone e número lado a lado, extra na largura toda; no celular esses cards ocupam a linha inteira */
.dash-kpi.com-extra { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; column-gap: 12px; row-gap: 10px; }
.dash-kpi.com-extra > .tf-mini, .dash-kpi.com-extra > .ce-mini { grid-column: 1 / -1; margin-top: 0; }
@media (max-width: 760px) { .perfil-kpis { grid-auto-flow: row dense; } .perfil-kpis .dash-kpi.com-extra { grid-column: 1 / -1; } }

/* Resumo do menu: coluna da meta mais larga para "Meta flashcards" caber em uma linha */
/* resumo do menu: uma linha por número (dias seguidos, meta diária, troféus do dia), sem quebra de linha */
.sb-resumo { grid-template-columns: 1fr; gap: 3px; padding: 8px 10px; }
.sb-resumo div { display: grid; grid-template-columns: 54px minmax(0, 1fr); align-items: center; gap: 9px; text-align: left; }
.sb-resumo b { font-size: .96rem; line-height: 1.25; text-align: right; }
.sb-resumo span { display: block; white-space: nowrap; overflow: hidden; text-overflow: clip; letter-spacing: .35px; font-size: .6rem; line-height: 1.2; }
body.sb-mini .sb-resumo div { grid-template-columns: 1fr; gap: 0; }
body.sb-mini .sb-resumo b { text-align: center; }
.mini-kpis span { white-space: nowrap; }

/* Cadastro com Gmail: entrar na hora pelo Google */
.rep-status .btn-google-agora { display: flex; width: 100%; justify-content: center; margin: 10px 0 6px; }
.rep-status small.nick-msg { display: block; }

/* Novidades no app (aviso de conteúdo novo) */
.nov-card { max-width: 600px; width: 100%; }
.rep-ic.nov-ic { color: #FFE68A; }
.nov-lista { max-height: min(60vh, 520px); overflow-y: auto; margin: 4px -4px 6px; padding: 0 4px; display: grid; gap: 12px; }
.nov-bloco h4 { margin: 2px 0 8px; font-size: .74rem; font-weight: 800; letter-spacing: .4px; text-transform: uppercase; color: var(--muted); }
.nov-bloco ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.nov-item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; border: 1px solid rgba(255,255,255,.08); background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)); }
.nov-tag { --c: #E7A6FF; font-size: .66rem; font-weight: 900; letter-spacing: .3px; text-transform: uppercase; white-space: nowrap; padding: 4px 9px; border-radius: 999px; color: var(--c); border: 1px solid color-mix(in srgb, var(--c) 45%, transparent); background: color-mix(in srgb, var(--c) 12%, transparent); }
.nov-tag.nov-apostila { --c: #5eead4; }
.nov-tag.nov-flashcards { --c: #E7A6FF; }
.nov-tag.nov-atualizada { --c: #FFD95A; }
.nov-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nov-txt b { font-size: .88rem; color: #fff; overflow-wrap: anywhere; }
.nov-txt small { font-size: .74rem; color: var(--muted); overflow-wrap: anywhere; }
.nov-mais { font-size: .78rem; color: var(--muted); padding: 2px 12px; }
@media (max-width: 520px) {
  .nov-item { grid-template-columns: minmax(0, 1fr) auto; }
  .nov-item .nov-tag { grid-column: 1 / -1; justify-self: start; }
}

.nov-item { grid-template-columns: 124px minmax(0, 1fr) auto; }
.nov-tag { justify-self: start; }
@media (max-width: 520px) { .nov-item { grid-template-columns: minmax(0, 1fr) auto; } }

/* Pedido de apelido obrigatório no primeiro acesso: fica por cima de tudo */
.rep-pop.nick-pop { z-index: 9999; }
body.nick-obrigatorio .tf-pop { display: none !important; }

/* Novidades: item fora do plano gratuito leva à assinatura */
.nov-item .nov-liberar { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; text-decoration: none; }
.nov-item .nov-liberar .ic-cad { width: 14px; height: 14px; }

/* Novidades: resumo com apostilas e flashcards incluídos */
.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.nov-resumo { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 0 12px; }
.nov-resumo span { --c: #E7A6FF; display: inline-flex; align-items: baseline; gap: 5px; padding: 6px 12px; border-radius: 999px; font-size: .78rem; font-weight: 700; color: var(--gray-hi);
  border: 1px solid color-mix(in srgb, var(--c) 40%, transparent); background: color-mix(in srgb, var(--c) 10%, transparent); }
.nov-resumo b { font-size: 1rem; font-weight: 900; color: var(--c); }
.nov-resumo .nov-r-ap { --c: #5eead4; }
.nov-resumo .nov-r-at { --c: #FFD95A; }
.nov-resumo .nov-r-fc { --c: #E7A6FF; }

/* Botão Novidades no topo e concurso em destaque no aviso */
.top-link.top-novidades { margin-left: auto; position: relative; display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: .8rem; font-weight: 700; cursor: pointer; }
.top-link.top-novidades + .top-link { margin-left: 0; }
.top-novidades svg { width: 16px; height: 16px; color: #FFD95A; }
.top-novidades .tn-ponto { position: absolute; top: 4px; right: 4px; width: 9px; height: 9px; border-radius: 50%; background: #ff4d8d; box-shadow: 0 0 0 2px #120f18, 0 0 10px rgba(255,77,141,.8); }
@media (max-width: 760px) { .top-novidades .tn-txt { display: none; } .top-link.top-novidades { padding: 6px 9px; } }
.nov-grupo + .nov-grupo { margin-top: 12px; }
.nov-conc { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; padding: 8px 10px; border-radius: 12px; border: 1px solid rgba(200,62,250,.35); background: linear-gradient(135deg, rgba(200,62,250,.16), rgba(124,92,255,.08)); }
.nov-conc-logo { flex: none; display: grid; place-items: center; width: 64px; height: 34px; padding: 3px 5px; border-radius: 8px; background: #fff; }
.nov-conc-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.nov-conc-txt { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.nov-conc-txt b { font-size: .98rem; color: #fff; }
.nov-conc-txt small { font-size: .74rem; color: var(--gray-hi); overflow-wrap: anywhere; }
.nov-resumo .nov-r-conc { --c: #FFD95A; }
.nov-resumo .nov-r-conc b { font-size: .9rem; }
p.nov-mais { margin: 6px 0 0; }

/* Limite diário do plano gratuito */
.chip.chip-limite { color: var(--gray-hi); }
.chip.chip-limite.perto { color: #ffd0d0; border-color: rgba(220,38,38,.5); background: rgba(220,38,38,.12); }
.limite-tela .limite-barra { width: min(420px, 100%); height: 10px; margin: 6px auto 4px; border-radius: 999px; overflow: hidden; background: rgba(255,255,255,.08); }
.limite-tela .limite-barra i { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, #C83EFA, #ef4444); }
.limite-tela .limite-num { display: block; text-align: center; color: var(--muted); font-size: .82rem; margin-bottom: 10px; }
.btn-liberar-total { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.btn-liberar-total .ic-cad { width: 16px; height: 16px; }
.limite-card .conf-txt b { color: #fff; }
@media (max-width: 480px) { .limite-tela .lp-cta-row { flex-direction: column; align-items: stretch; } .limite-card .rep-acts { flex-direction: column-reverse; } .limite-card .rep-acts .btn { width: 100%; } }

/* Painel comercial: busca de cadastros */
.adm-cad-h { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.adm-busca { display: flex; align-items: center; gap: 8px; flex: 1 1 320px; max-width: 520px; padding: 4px 6px 4px 12px; border-radius: 12px; border: 1px solid var(--borda-2); background: rgba(255,255,255,.04); }
.adm-busca svg { width: 16px; height: 16px; flex: none; color: var(--gray-hi); }
.adm-busca input { flex: 1 1 auto; min-width: 0; border: 0; background: transparent; color: var(--text); font: inherit; font-size: .9rem; padding: 6px 0; outline: none; }
.adm-busca input::placeholder { color: var(--muted); }
.adm-busca input::-webkit-search-cancel-button { filter: invert(.8); cursor: pointer; }
.adm-busca:focus-within { border-color: rgba(200,62,250,.6); box-shadow: 0 0 0 3px rgba(200,62,250,.15); }
.adm-busca-info { padding: 10px 16px 0; font-size: .82rem; color: var(--gray-hi); }
.adm-busca-info.erro { color: #ffb3b3; padding-bottom: 12px; }
#admCadastros .tbl small { color: var(--muted); }
@media (max-width: 600px) { .adm-busca { flex-basis: 100%; max-width: none; } .adm-busca .btn { display: none; } }

/* Confirmação com palavra digitada (remover concurso) */
.conf-campo { display: grid; gap: 6px; margin: 14px 0 4px; }
.conf-campo label { font-size: .85rem; color: var(--gray-hi); }
.conf-campo label b { color: #fff; letter-spacing: .5px; }
.conf-campo input { width: 100%; box-sizing: border-box; padding: 11px 14px; border-radius: 12px; border: 1px solid var(--borda-2); background: rgba(255,255,255,.05); color: var(--text); font: inherit; font-size: 1rem; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; outline: none; }
.conf-campo input::placeholder { color: rgba(255,255,255,.22); font-weight: 700; }
.conf-campo input:focus { border-color: rgba(200,62,250,.65); box-shadow: 0 0 0 3px rgba(200,62,250,.15); }
.conf-dica { font-size: .78rem; color: var(--muted); min-height: 1em; }
.conf-dica.ok { color: #9be7b0; }
.conf-texto-pop .rep-acts .btn[disabled] { opacity: .45; cursor: not-allowed; }
@media (max-width: 480px) { .conf-texto-pop .rep-acts { flex-direction: column-reverse; } .conf-texto-pop .rep-acts .btn { width: 100%; } }

/* Celular no navegador: 100vh inclui a barra de endereço e a de navegação, e cortava o rodapé do menu (Suporte e Instalar app).
   Usa a altura visível (dvh) e ancora o menu no topo e no fundo da tela visível; o rodapé respeita a área segura. */
.shell { min-height: 100vh; min-height: 100dvh; }
.sidebar { height: 100vh; height: 100dvh; }
@media (max-width: 900px) {
  .sidebar { height: auto; top: 0; bottom: 0; max-height: 100dvh; }
  .sidebar .sb-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
  .sidebar .sb-foot { flex: none; padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
  .sidebar .sb-foot #sbInstall:not([hidden]) { flex: 1 1 100%; width: 100%; }
  .frame { height: calc(100vh - 210px); height: calc(100dvh - 210px); }
}

/* Safari (iPhone e iPad) e Chrome em celular e tablet: mesma altura visível para menu, janelas e telas cheias */
@supports (-webkit-touch-callout: none) {
  .sidebar { height: -webkit-fill-available; }
  .shell { min-height: -webkit-fill-available; }
}
.rep-pop { padding-bottom: max(12px, env(safe-area-inset-bottom)); }
.rep-pop .rep-card { max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); overflow-y: auto; -webkit-overflow-scrolling: touch; }
@media (min-width: 901px) and (max-width: 1100px) { .sidebar { height: 100dvh; } .sidebar .sb-foot { padding-bottom: calc(10px + env(safe-area-inset-bottom)); } }

/* Novidades v2 (30/09/2026): lista organizada por concurso, sem logos, 20 por página com paginação */
.rep-card.nv-card { max-width: 660px; width: 100%; display: flex; flex-direction: column; max-height: min(86vh, 760px); padding: 0; overflow: hidden; }
.nv-cab { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 18px 20px 14px; border-bottom: 1px solid rgba(176,135,247,.24); background: linear-gradient(90deg, rgba(176,135,247,.22), rgba(176,135,247,.06) 60%, transparent); }
.nv-cabtxt b { display: block; font-size: 1.15rem; font-weight: 800; color: #fff; letter-spacing: -.005em; }
.nv-cabtxt small { display: block; margin-top: 3px; font-size: .8rem; color: #C7ADFB; }
.nv-corpo { flex: 1; min-height: 0; overflow-y: auto; padding: 4px 20px 10px; }
.nv-grupo { padding-top: 14px; }
.nv-gcab { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; padding: 10px 12px; margin-bottom: 2px; border-radius: 8px; background: linear-gradient(90deg, rgba(176,135,247,.28), rgba(176,135,247,.10) 70%, rgba(176,135,247,.03)); box-shadow: inset 3px 0 0 #B087F7; }
.nv-gnome { font-weight: 800; font-size: .95rem; color: #fff; }
.nv-gcargo { font-size: .78rem; color: var(--muted); }
.nv-gdata { margin-left: auto; font-size: .7rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #C7ADFB; }
.nv-lista { list-style: none; margin: 0; padding: 0; }
.nv-item { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 12px; padding: 10px 12px; border-bottom: 1px solid rgba(255,255,255,.05); }
.nv-item:last-child { border-bottom: 0; }
.nv-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nv-txt b { font-size: .88rem; font-weight: 600; color: #F2F2F5; overflow-wrap: anywhere; }
.nv-txt small { font-size: .74rem; color: var(--muted); overflow-wrap: anywhere; }
.nv-tag { font-size: .66rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; padding: 3px 8px; border: 1px solid rgba(176,135,247,.4); border-radius: 6px; color: #C7ADFB; background: rgba(176,135,247,.10); }
.nv-tag.nv-apostila { color: #8EE3D3; border-color: rgba(94,234,212,.4); background: rgba(94,234,212,.08); }
.nv-tag.nv-atualizada { color: #F3D77A; border-color: rgba(243,215,122,.4); background: rgba(243,215,122,.08); }
.nv-mais { margin: 10px 0 4px; font-size: .78rem; color: var(--muted); }
.nv-pe { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 20px 16px; border-top: 1px solid rgba(255,255,255,.08); flex-wrap: wrap; }
.nv-pag { display: flex; align-items: center; gap: 8px; }
.nv-pagtxt { font-size: .78rem; color: var(--muted); min-width: 92px; text-align: center; }
@media (max-width: 520px) {
  .nv-item { grid-template-columns: minmax(0, 1fr) auto; }
  .nv-item .nv-tag { grid-column: 1; justify-self: start; }
  .nv-item .btn { grid-row: 1 / span 2; grid-column: 2; }
  .nv-pe { justify-content: center; }
}