/*
 * TATO TOTAL — base CSS
 *
 * Dono: contrato global do documento. Esta camada não conhece telas nem
 * componentes; ela só torna a geometria e os controles nativos previsíveis.
 * Ordem obrigatória: tokens.css → base.css → utilities.css → superfície.
 */

html {
    margin: 0;
    padding: 0;
    min-height: 100%;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    min-height: 100%;
    background: var(--bg);
    color: var(--text-primary);
    font-family: var(--font-body);
    line-height: 1.5;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

/* `hidden` e' estado semantico, nao apenas uma sugestao visual. Sem esta
   garantia, componentes com display:flex/grid podem reaparecer antes da
   acao que deveria revela-los (como o recibo do pedido de upgrade). */
[hidden] {
    display: none !important;
}

button,
input,
textarea,
select {
    font: inherit;
}

:where(a, button, input, textarea, select, summary):focus-visible {
    outline: 2px solid var(--tato-teal);
    outline-offset: 2px;
}

button:not(:disabled),
summary {
    cursor: pointer;
}