/**
 * Global typography — body copy, headings, lists, links.
 * Load order: `base.css` → `main.css` → this file → `btns.css` (`app.html`).
 */

body {
    font-family: var(--app-font-body);
    line-height: 1.45;
    -webkit-font-smoothing: antialiased;
}

/* inline text links */
body,
.app-link,
.app-link:hover,
.app-link:visited {
    color: var(--app-text);
}

.app-link,
.app-link:visited {
    text-decoration: none;
}

.app-link:hover {
    text-decoration: underline;
}

.app-link {
    text-underline-offset: 4px;
}

.status-bar {
    font-family: var(--app-font-system);
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--app-font-heading);
    font-weight: 750;
    letter-spacing: -0.02em;
    line-height: 1.15;
}

body, p, ul, .h-ul { font-size: var(--font-size-base); }

p, h1, h2, h3, h4, h5, h6 { margin: 0; }

h1 { font-size: var(--font-size-h1); letter-spacing: -0.045em; }
h2 { font-size: var(--font-size-h2); }
h3 { font-size: var(--font-size-h3); }
h4 { font-size: var(--font-size-h4); }
h5 { font-size: var(--font-size-h5); }
h6 { font-size: var(--font-size-h6); }

ul {
    margin-top: 0;
    margin-bottom: 1rem;
}

/* Pagination toolbars — bits-ui/shadcn `ul`; must not inherit prose list margins */
ul[data-slot='pagination-content'] {
    margin-bottom: 0;
    margin-top: 0;
}

.h-ul {
    font-size: var(--font-size-base);
    margin-bottom: 0.25rem;
}

small { font-size: var(--font-size-small); }

/* Brand spelling stays TrainersMap even inside an uppercase line. */
.brand-name {
    text-transform: none;
}

/* Section eyebrow — uppercase caption above a heading */
.eyebrow {
    margin: 0 0 7px;
    color: var(--app-text-dim);
    display: flex;
    align-items: center;
    gap: 5px;
    text-transform: uppercase;
    font-size: var(--font-size-caption);
    letter-spacing: 0.08em;
    font-weight: 700;
}

/* @ prefix on username handles. Size / weight / color inherit from the handle. */
.handle-at {
    font-family: var(--app-font-at);
}

code {
    font-family: var(--app-font-digital);
    font-size: 0.95em;
    padding: 0.1em 0.35em;
    background: var(--app-code-bg);
    color: var(--app-text);
}