/* Aviso de proteção, só pt-BR. Cores neutras: o "cores" do config troca as variáveis --ap-*.
   Tema escuro por padrão; claro só com [data-theme="light"] no <html>.
   Camada 10000: cobre tudo do app, inclusive a tela de entrar. */
:root{
  --ap-bg:#070609; --ap-panel:#0f0f15; --ap-card:#111118; --ap-line:#20212f; --ap-line2:#3e3f47;
  --ap-fg:#ffffff; --ap-mut:#adaeb8; --ap-pri:#439cb6; --ap-pri-lt:#7fd6f0; --ap-grey:#9aa2a7;
  --ap-btn:#1c6f8c; --ap-btn-h:#0e5576; --ap-ok:#5ec9a0;
}
[data-theme="light"]{
  --ap-bg:#f6f7f9; --ap-panel:#ffffff; --ap-card:#ffffff; --ap-line:#d9dce3; --ap-line2:#b9bdc7;
  --ap-fg:#111118; --ap-mut:#4b4d57; --ap-pri:#1c6f8c; --ap-pri-lt:#1c6f8c; --ap-grey:#5b6166; --ap-ok:#1f7a55;
}
#aviso-protecao{position:fixed;inset:0;z-index:10000;display:none;align-items:center;justify-content:center;padding:20px;
  background:var(--ap-bg);
  font-family:"Segoe UI",system-ui,sans-serif;color:var(--ap-fg)}
#aviso-protecao.show{display:flex}
#aviso-protecao .apcard{width:min(680px,94vw);background:var(--ap-card);border:1px solid var(--ap-line);border-radius:18px;
  box-shadow:0 20px 60px rgba(0,0,0,.45);padding:26px 26px 22px;box-sizing:border-box}
#aviso-protecao .apmarca{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
/* A marca sempre visível, em toda largura: nome longo quebra a linha em vez de sumir. */
#aviso-protecao .apword{font-weight:800;letter-spacing:.08em;font-size:14px;color:var(--ap-pri-lt);text-transform:uppercase;overflow-wrap:anywhere}
#aviso-protecao .apword span{color:var(--ap-grey)}
#aviso-protecao h1{font-size:20px;margin:4px 0 6px}
#aviso-protecao .apsub{margin:0;color:var(--ap-mut);font-size:13.5px}
#aviso-protecao .aptexto{max-height:min(54vh,560px);overflow:auto;margin-top:12px;background:var(--ap-panel);border:1px solid var(--ap-line);
  border-radius:10px;padding:12px 14px;font-size:13px;line-height:1.6}
#aviso-protecao .aptexto p{margin:0 0 10px}
#aviso-protecao .aptexto h2{font-size:15px;margin:20px 0 2px;padding-top:14px;border-top:1px solid var(--ap-line);color:var(--ap-pri-lt)}
#aviso-protecao .aptexto h3{font-size:13.5px;margin:12px 0 6px}
#aviso-protecao .apver,#aviso-protecao .apnota{color:var(--ap-mut);font-size:12px}
#aviso-protecao a.aplink{color:var(--ap-pri-lt);font-weight:600}
#aviso-protecao .apdica{margin:10px 0 0;font-size:12.5px;color:var(--ap-mut);text-align:center}
#aviso-protecao .apdica.pronto{color:var(--ap-ok)}
#aviso-protecao .apbotao{display:block;width:100%;margin-top:12px;border:0;border-radius:10px;padding:12px 14px;font:inherit;font-size:15px;
  font-weight:700;color:#ffffff;background:var(--ap-btn);cursor:pointer}
#aviso-protecao .apbotao:hover{background:var(--ap-btn-h)}
#aviso-protecao .apbotao:disabled{opacity:.45;cursor:not-allowed}
#aviso-protecao .aprodape{margin-top:12px;font-size:12px;color:var(--ap-mut);text-align:center}
#aviso-protecao :focus-visible{outline:2px solid var(--ap-pri-lt);outline-offset:2px}
#app-demo{padding:40px;font-family:"Segoe UI",system-ui,sans-serif}
