/* Typography Styles */
body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
    background-color: #f5f5f5;
    color: #333;
    line-height: 1.6;
    padding-bottom: 0;
}

/* Base Typography Variables */
:root {
    /* Font Families */
    --font-family-system: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

    /* Font Sizes */
    --font-size-xs: 0.75rem;
    /* 12px */
    --font-size-sm: 0.8rem;
    /* ~13px */
    --font-size-base: 0.9rem;
    /* ~14px */
    --font-size-md: 0.95rem;
    /* ~15px */
    --font-size-lg: 1.1rem;
    /* ~18px */
    --font-size-xl: 1.25rem;
    /* 20px */
    --font-size-2xl: 1.35rem;
    /* ~22px */

    /* Font Weights */
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: bold;

    /* Line Heights */
    --line-height-tight: 1;
    --line-height-normal: 1.4;
    --line-height-relaxed: 1.6;
}

/* Typography Utility Classes */
.text-xs {
    font-size: var(--font-size-xs);
}

.text-sm {
    font-size: var(--font-size-sm);
}

.text-base {
    font-size: var(--font-size-base);
}

.text-md {
    font-size: var(--font-size-md);
}

.text-lg {
    font-size: var(--font-size-lg);
}

.text-xl {
    font-size: var(--font-size-xl);
}

.text-2xl {
    font-size: var(--font-size-2xl);
}

.font-normal {
    font-weight: var(--font-weight-normal);
}

.font-medium {
    font-weight: var(--font-weight-medium);
}

.font-semibold {
    font-weight: var(--font-weight-semibold);
}

.font-bold {
    font-weight: var(--font-weight-bold);
}

.leading-tight {
    line-height: var(--line-height-tight);
}

.leading-normal {
    line-height: var(--line-height-normal);
}

.leading-relaxed {
    line-height: var(--line-height-relaxed);
}