/* O LOGO EM CARACTERES das telas de login (painel, console e o login no SAP pelo navegador).
   O desenho mora em src/marca/arteDoLogin.ts; aqui só a fonte, a tela escura e as cores.

   A tela é escura nos dois temas de propósito: é o "terminal" em que o desenho aparece, e as cores
   são as do símbolo (azul #6f8dff do círculo e do ^ do ê, tinta #0b1020 do traço). */

@font-face {
  font-family: 'Ale Arte';
  src: url('/fonts/ale-arte.woff2') format('woff2');
  /* block, e não swap: com outra fonte por um instante o desenho aparece torto. São 3 KB. */
  font-display: block;
}

.arte-login {
  container-type: inline-size;
  margin: 0 0 22px;
  padding: 16px 16px 14px;
  border-radius: 12px;
  background: #0b1020;
}
.arte-login pre {
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
  overflow: hidden;
  /* A tela de guarda do console centraliza o texto; num desenho isso desalinharia cada linha. */
  text-align: left;
  white-space: pre;
  font-family: 'Ale Arte', Consolas, Menlo, 'DejaVu Sans Mono', monospace;
  /* 78 colunas de 0,6em = 46,8em: o desenho ocupa a largura da tela e para em 12px. Sem unidade de
     contêiner (navegador antigo), fica nos 8px da linha de cima. */
  font-size: 8px;
  font-size: min(12px, calc(100cqi / 47));
  line-height: 1.32;
  font-variant-ligatures: none;
  color: #e9edf9;
}
.arte-login .as,
.arte-login .af,
.arte-login .ah { color: #6f8dff; }
.arte-login .al { color: #e9edf9; }
.arte-login .am { color: #8a93b8; }
.arte-login .ad { color: #3a4a85; }
/* Bloco ao lado de bloco deixa um fio claro entre eles (o navegador suaviza cada glifo sozinho).
   O contorno da mesma cor cobre o fio. Só nos blocos: nos traços ele engrossaria a linha fina. */
.arte-login :is(.al, .am, .ah, .af) { -webkit-text-stroke: 0.04em currentColor; }

/* Com o desenho na tela, a marca pequena do lado sai: o desenho já é a marca. */
:root:not([data-marca]) .arte-login + .brand,
:root:not([data-marca]) .brand:has(+ .card > .arte-login:first-child) { display: none; }
/* Instalação vestida com a marca de outra casa (MARCA_DIR): o desenho é do Alê MCP, então ele sai e
   a marca da casa continua onde estava. */
:root[data-marca] .arte-login { display: none; }