/**
 * Leptir typography — mirrors Tailwind scale (text-xs/sm/lg/2xl/4xl).
 * Load after Inter (see includes/typography_head.html).
 */
:root {
    --lf-font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
        "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    --lf-text-xs: 0.75rem;
    --lf-text-sm: 0.875rem;
    --lf-text-lg: 1.125rem;
    --lf-text-2xl: 1.5rem;
    --lf-text-4xl: 2.25rem;
    --lf-leading-relaxed: 1.625;
    --lf-tracking-tight: -0.025em;
    --lf-neutral-300: #d4d4d8;
    --lf-neutral-400: #a3a3a3;
    --lf-neutral-500: #737373;
}

html {
    font-family: var(--lf-font-sans);
    -webkit-font-smoothing: antialiased;
}

.lf-heading-xl {
    font-size: var(--lf-text-4xl);
    line-height: 2.5rem;
    font-weight: 600;
    letter-spacing: var(--lf-tracking-tight);
}

.lf-page-title {
    font-size: var(--lf-text-2xl);
    line-height: 2rem;
    font-weight: 600;
    letter-spacing: var(--lf-tracking-tight);
}

.lf-section-title {
    font-size: var(--lf-text-lg);
    line-height: 1.75rem;
    font-weight: 500;
}

.lf-body {
    font-size: var(--lf-text-sm);
    line-height: var(--lf-leading-relaxed);
}

.lf-muted {
    font-size: var(--lf-text-xs);
    line-height: 1rem;
    color: rgba(255, 255, 255, 0.5);
}

.lf-label {
    font-size: var(--lf-text-sm);
    line-height: 1.25rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.6);
}

.lf-table {
    font-size: var(--lf-text-sm);
    line-height: var(--lf-leading-relaxed);
}

.lf-btn-text {
    font-size: var(--lf-text-sm);
    font-weight: 500;
}