:root {
    --app-font-sans: "Plus Jakarta Sans", system-ui, sans-serif;
    --app-font-display: var(--app-font-sans);
    --app-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

    --app-font-weight-regular: 400;
    --app-font-weight-medium: 500;
    --app-font-weight-semibold: 600;
    --app-font-weight-bold: 700;
    --app-font-weight-extrabold: 800;

    --app-font-size-10: 0.625rem;
    --app-font-size-11: 0.6875rem;
    --app-font-size-12: 0.75rem;
    --app-font-size-13: 0.8125rem;
    --app-font-size-14: 0.875rem;
    --app-font-size-15: 0.9375rem;
    --app-font-size-16: 1rem;
    --app-font-size-18: 1.125rem;
    --app-font-size-20: 1.25rem;
    --app-font-size-22: 1.375rem;
    --app-font-size-24: 1.5rem;
    --app-font-size-26: 1.625rem;
    --app-font-size-28: 1.75rem;
    --app-font-size-30: 1.875rem;
    --app-font-size-32: 2rem;
    --app-font-size-36: 2.25rem;
    --app-font-size-38: 2.375rem;
    --app-font-size-40: 2.5rem;
    --app-font-size-42: 2.625rem;
}

body,
button,
input,
select,
textarea {
    font-family: var(--app-font-sans);
}

body {
    font-size: var(--app-font-size-14);
    font-weight: var(--app-font-weight-regular);
    line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6,
.app-display-font {
    font-family: var(--app-font-display);
    font-weight: var(--user-heading-weight, var(--app-font-weight-bold));
    letter-spacing: normal;
}

code,
pre,
kbd,
samp,
.app-mono-font {
    font-family: var(--app-font-mono);
}

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