/* Barra de rolagem fina e discreta, em todas as telas. Só as propriedades nativas: a barra continua sendo a do
   navegador (mesma área de arraste, mesmo comportamento), apenas mais estreita e na cor do sistema.
   #64748b (slate-500) dá ~4:1 sobre o azul #090e1a e sobre o branco, e some de vista no que não rola. */
:root {
    --rolagem: #64748b;
}

* {
    scrollbar-width: thin;
    scrollbar-color: var(--rolagem) transparent;
}

/* Navegadores sem scrollbar-color (Safari antes do 18.2) ainda recebem a mesma aparência. */
@supports not (scrollbar-color: auto) {
    ::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    ::-webkit-scrollbar-track {
        background: transparent;
    }

    ::-webkit-scrollbar-thumb {
        background: var(--rolagem);
        background-clip: content-box;
        border: 2px solid transparent;
        border-radius: 999px;
    }
}