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

html {
    font-family: var(--ca-font-family-sans);
}

body {
    margin: 0;
    background-color: var(--ca-color-canvas);
    color: var(--ca-color-text-primary);
    font-family: var(--ca-font-family-sans);
    font-weight: var(--ca-font-weight-regular);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--ca-color-text-primary);
    font-weight: var(--ca-font-weight-bold);
    letter-spacing: -.025em;
}

a {
    transition: color var(--ca-duration-fast) ease-in-out;
}

:focus-visible {
    outline: 3px solid var(--ca-color-focus);
    outline-offset: 2px;
}

.ca-tabular-nums {
    font-variant-numeric: tabular-nums;
}