@charset "UTF-8";
/* ==========================================================================
   Compatibilidade com as páginas que trazem o seu próprio HTML e CSS.

   Carregada no template Canvas e em qualquer conteúdo com um <style> próprio
   (ver inc/setup.php). Portada do tema lg-systems, onde nasceu.

   São elas: /montrafolio/ (.lgmf), /lg-portfolio/ (.lgpf),
   /mailmerge-splitter/ (.lgms) e a política de privacidade (.lgpp). Chegam-lhes
   links de dentro de aplicações e plugins já distribuídos, que não se corrigem
   remotamente — a /montrafolio/ é o Plugin URI que foi para os revisores do
   WordPress.org. Não podem partir-se numa troca de tema.

   Elas decidem o claro/escuro pelo prefers-color-scheme do sistema; este tema
   tem um botão que sobrepõe essa escolha, escrevendo data-theme no <html>. Sem
   esta folha ficava um site com o cabeçalho escuro e o conteúdo claro.

   PARA ACRESCENTAR UMA PÁGINA NOVA com CSS próprio: junta o namespace dela às
   listas abaixo e replica as variáveis. Se ela usar as variáveis --lgst-* do
   tema em vez das suas, não precisa de nada.
   ========================================================================== */

/* --- tema forçado a escuro -------------------------------------------- */
:root[data-theme="dark"] .lgmf,
:root[data-theme="dark"] .lgpf,
:root[data-theme="dark"] .lgms {
  --lgmf-fg: #e8e8ea;
  --lgmf-muted: #a0a0a8;
  --lgmf-line: #33333a;
  --lgmf-accent: #7aa2e8;
  --lgmf-accent-fg: #10131a;
  --lgmf-soft: #1e2027;
  --lgmf-ok: #5cc48d;
  --lgpf-fg: #e8e8ea;
  --lgpf-muted: #a0a0a8;
  --lgpf-line: #33333a;
  --lgpf-accent: #7aa2e8;
  --lgpf-accent-fg: #10131a;
  --lgpf-soft: #1e2027;
  --lgpf-ok: #5cc48d;
  --lgms-fg: #e8e8ea;
  --lgms-muted: #a0a0a8;
  --lgms-line: #33333a;
  --lgms-accent: #7aa2e8;
  --lgms-accent-fg: #10131a;
  --lgms-soft: #1e2027;
  --lgms-ok: #5cc48d;
}
:root[data-theme="dark"] .lgpp {
  --lgpp-fg: #e8e8ea;
  --lgpp-muted: #a0a0a8;
  --lgpp-line: #33333a;
  --lgpp-accent: #7aa2e8;
  --lgpp-code: #232328;
}

/* --- tema forçado a claro num sistema escuro -------------------------- */
@media (prefers-color-scheme: dark) {
  :root[data-theme="light"] .lgmf,
  :root[data-theme="light"] .lgpf,
  :root[data-theme="light"] .lgms {
    --lgmf-fg: #1c1c1e;
    --lgmf-muted: #5a5a60;
    --lgmf-line: #e2e2e6;
    --lgmf-accent: #2b5bb5;
    --lgmf-accent-fg: #fff;
    --lgmf-soft: #f4f6fa;
    --lgmf-ok: #1f7a4d;
    --lgpf-fg: #1c1c1e;
    --lgpf-muted: #5a5a60;
    --lgpf-line: #e2e2e6;
    --lgpf-accent: #2b5bb5;
    --lgpf-accent-fg: #fff;
    --lgpf-soft: #f4f6fa;
    --lgpf-ok: #1f7a4d;
    --lgms-fg: #1c1c1e;
    --lgms-muted: #5a5a60;
    --lgms-line: #e2e2e6;
    --lgms-accent: #2b5bb5;
    --lgms-accent-fg: #fff;
    --lgms-soft: #f4f6fa;
    --lgms-ok: #1f7a4d;
  }
  :root[data-theme="light"] .lgpp {
    --lgpp-fg: #1c1c1e;
    --lgpp-muted: #5a5a60;
    --lgpp-line: #e2e2e6;
    --lgpp-accent: #2b5bb5;
    --lgpp-code: #f4f4f6;
  }
}

/* --- costura entre o tema e o conteúdo destas páginas ------------------ */
/* Elas trazem a sua própria largura e o seu próprio espaçamento. O tema só
   garante que herdam a fonte do site. */
.lgst-canvas .lgmf,
.lgst-canvas .lgpf,
.lgst-canvas .lgms,
.lgst-canvas .lgpp,
.lgst-prose .lgmf,
.lgst-prose .lgpf,
.lgst-prose .lgms,
.lgst-prose .lgpp {
  font-family: inherit;
}

/* Nenhuma destas páginas deve conseguir provocar scroll horizontal. */
.lgst-canvas img,
.lgst-canvas video,
.lgst-canvas iframe,
.lgst-canvas table,
.lgst-canvas pre { max-width: 100%; }
.lgst-canvas pre { overflow-x: auto; }
.lgst-canvas table { display: block; overflow-x: auto; }

/* ==========================================================================
   LARGURA

   Foram desenhadas para 62rem (992px), para um tema anterior mais estreito.
   Ao lado do cabeçalho e do rodapé deste tema pareciam encolhidas, por isso
   ocupam a largura disponível. O que ganha com ela são as grelhas, que são
   `auto-fit`; o texto corrido continua com medida de leitura, porque estas
   páginas já limitam o `-lead` a 42rem.

   O `.lgst-canvas` vai à frente de propósito: o CSS destas páginas vive no
   corpo do documento e ganharia os empates de especificidade contra uma folha
   carregada no cabeçalho.
   ========================================================================== */

.lgst-canvas .lgmf,
.lgst-canvas .lgpf,
.lgst-canvas .lgms,
.lgst-prose .lgmf,
.lgst-prose .lgpf,
.lgst-prose .lgms {
  max-width: none;
}

/* Com uma linha longa disponível, equilibrar os títulos evita a última linha
   com uma palavra só. */
.lgst-canvas .lgmf h1, .lgst-canvas .lgmf h2,
.lgst-canvas .lgpf h1, .lgst-canvas .lgpf h2,
.lgst-canvas .lgms h1, .lgst-canvas .lgms h2 {
  text-wrap: balance;
}

/* O conteúdo do Canvas não leva a medida de leitura do .lgst-prose por cima. */
.lgst-canvas > * { max-width: none; }

/* --- Excepção: a política de privacidade ------------------------------
   Texto legal corrido, sem uma única grelha. À largura total ia a perto de 160
   caracteres por linha. Fica com medida de leitura, centrada.

   60ch dão cerca de 72 caracteres reais — a unidade `ch` mede o algarismo
   zero, mais largo que a média das minúsculas. Dentro da faixa de 45 a 75. */
.lgst-canvas .lgpp .lgpp-doc,
.lgst-canvas .lgpp .lgpp-meta,
.lgst-canvas .lgpp .lgpp-langs,
.lgst-prose .lgpp .lgpp-doc,
.lgst-prose .lgpp .lgpp-meta,
.lgst-prose .lgpp .lgpp-langs {
  max-width: 60ch;
  margin-inline: auto;
}
