/* =============================================================================
   Aula — tokens visuais

   Direção: editor de código. A tela existe para o aluno ler o que está na tela
   do professor durante duas horas, então tudo aqui serve a isso — fundo escuro
   sem brilho, contraste alto só onde importa (o código do mural), nenhum
   elemento animado perto da área de vídeo.

   Tema único, escuro. Não tem alternância de claro/escuro de propósito: o
   iframe do Jitsi é escuro e não acompanha, e meia tela clara ao lado de meia
   tela escura fica pior que as duas escuras.

   Nenhum hex solto nos outros arquivos.
   ========================================================================== */

:root {
    /* ---- Superfícies ---------------------------------------------------- */

    --cor-fundo: #0B0F14;

    /* Cards, painéis, barra superior. */
    --cor-superficie: #121A22;

    /* Bloco de código no mural, campos de formulário. */
    --cor-superficie-alta: #18222C;

    --cor-borda: #1E2A35;
    --cor-borda-forte: #2C3B49;

    /* ---- Texto ---------------------------------------------------------- */

    --cor-texto: #E4EDF4;

    /* Legendas, rótulos, informação secundária. */
    --cor-texto-suave: #8FA3B4;

    /* Timestamps, dicas, texto de apoio. */
    --cor-texto-fraco: #5E7285;

    /* ---- Marca e estados ------------------------------------------------ */

    /* Ações, links, foco. Azul de editor: não compete com o vídeo. */
    --cor-acento: #4C9EF5;
    --cor-acento-forte: #2C7FDA;
    --cor-acento-fraco: rgba(76, 158, 245, .12);

    /* Só o indicador de transmissão usa vermelho. Nada mais. */
    --cor-ao-vivo: #F2555A;
    --cor-ao-vivo-fraco: rgba(242, 85, 90, .14);

    --cor-ok: #3FBF7F;
    --cor-alerta: #E8B44C;
    --cor-erro: #F2555A;
    --cor-erro-fraco: rgba(242, 85, 90, .1);

    /* ---- Tipografia ----------------------------------------------------- */

    --fonte: 'Inter', 'Segoe UI', system-ui, sans-serif;

    /*
       Monoespaçada do sistema, de propósito. É a fonte do bloco de código do
       mural, e puxar uma .woff2 de CDN quebraria a regra que existe justamente
       para o dia da aula: fonte instalada não depende de rede.
    */
    --fonte-mono: ui-monospace, 'Cascadia Mono', 'Segoe UI Mono', Consolas,
        'DejaVu Sans Mono', 'Liberation Mono', monospace;

    --fs-titulo: 20px;
    --fs-subtitulo: 15px;
    --fs-corpo: 15px;
    --fs-pequeno: 13px;
    --fs-micro: 12px;

    /* O código do mural. Menor que isso não dá para ler numa turma inteira. */
    --fs-codigo: 13.5px;
    --lh-codigo: 1.6;

    /* Rastreamento das etiquetas em caixa alta. */
    --tracking: .08em;

    /* ---- Forma e espaço ------------------------------------------------- */

    --raio-sm: 4px;
    --raio: 6px;
    --raio-lg: 10px;

    --altura-barra: 60px;

    /* Largura do painel do mural no desktop. */
    --largura-painel: 380px;

    --sombra: 0 10px 30px rgba(0, 0, 0, .35);

    --transicao: 160ms ease;
}

@media (max-width: 991px) {
    :root {
        --altura-barra: 54px;
        --fs-titulo: 18px;
    }
}