/* =============================================================================
   Design system tokens — spacing, motion, focus (works with theme-variables.css)
   ============================================================================= */
:root {
    --ds-space-1: 0.25rem;
    --ds-space-2: 0.5rem;
    --ds-space-3: 0.75rem;
    --ds-space-4: 1rem;
    --ds-space-5: 1.25rem;
    --ds-space-6: 1.5rem;
    --ds-space-8: 2rem;
    --ds-radius-sm: 4px;
    --ds-radius-md: var(--theme-border-radius, 8px);
    --ds-radius-lg: 12px;
    --ds-font-body: clamp(0.9375rem, 0.88rem + 0.3vw, 1.0625rem);
    --ds-font-num: clamp(1rem, 0.95rem + 0.35vw, 1.1875rem);
    --ds-font-num-lg: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem);
    --ds-line-tight: 1.25;
    --ds-line-body: 1.55;
    --ds-focus-ring: 2px solid var(--theme-primary, #1976d2);
    --ds-focus-ring-offset: 2px;
    --ds-transition: 0.2s ease;
}

html {
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Keyboard focus visibility (skip mouse clicks) */
:focus:not(:focus-visible) {
    outline: none;
}

:focus-visible {
    outline: var(--ds-focus-ring);
    outline-offset: var(--ds-focus-ring-offset);
}

.mud-button:focus-visible,
.mud-icon-button:focus-visible,
.mud-nav-link:focus-visible {
    outline: var(--ds-focus-ring);
    outline-offset: var(--ds-focus-ring-offset);
}

/* Readable line length in main content on very wide screens */
.mud-main-content {
    line-height: var(--ds-line-body);
}

@media (min-width: 1400px) {
    .mud-main-content .mud-container:not(.mud-container--fluid) {
        max-width: min(1320px, 100%);
    }
}