/*
 * LDP-69. Application styles. Every colour, size and weight here is a var(--ldp-*) custom
 * property from /css/tokens.css, which is generated from the design system and loaded first.
 *
 * Never write a colour literal in this file or in a template: the WCAG 2.2 AA corrections in
 * design-system-spec.md §4.3 live in the token layer, and a literal hex value bypasses them.
 * NoColourLiteralsGuardTest fails the build on one. If no existing token fits, the token is
 * missing from the design system. Add it there and regenerate tokens.css; do not inline a value.
 */

body {
    margin: 0;
    background: var(--ldp-color-surface-page);
    color: var(--ldp-color-text-body);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: var(--ldp-font-body);
    font-weight: var(--ldp-weight-regular);
}

main {
    max-width: 1200px;
    margin: var(--ldp-space-3xl) auto;
    padding: var(--ldp-space-xl);
    background: var(--ldp-color-surface-raised);
    border-radius: var(--ldp-radius-panel);
    box-shadow: var(--ldp-shadow-sm);
}

h1 {
    margin: 0 0 var(--ldp-space-lg);
    color: var(--ldp-color-text-primary);
    font-size: var(--ldp-font-page-title);
    font-weight: var(--ldp-weight-semibold);
}

a {
    color: var(--ldp-color-text-link);
}

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