:root {
    color-scheme: light;
    --sc-font-sans: "Segoe UI", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --sc-page-bg: #f4f7fa;
    --sc-surface: #ffffff;
    --sc-surface-subtle: #f8fafc;
    --sc-text: #17263a;
    --sc-text-muted: #5f6f82;
    --sc-heading: #0f2f57;
    --sc-border: #dce4ec;
    --sc-border-strong: #c7d2de;
    --sc-primary: #175ea8;
    --sc-primary-hover: #124b87;
    --sc-success: #157347;
    --sc-success-bg: #eaf7ef;
    --sc-warning: #9a5b00;
    --sc-warning-bg: #fff7e6;
    --sc-danger: #b42318;
    --sc-danger-bg: #fff1f0;
    --sc-info: #175ea8;
    --sc-info-bg: #eef5fc;
    --sc-neutral: #526170;
    --sc-neutral-bg: #f1f4f7;
    --sc-space-1: 4px;
    --sc-space-2: 8px;
    --sc-space-3: 12px;
    --sc-space-4: 16px;
    --sc-space-5: 20px;
    --sc-space-6: 24px;
    --sc-space-8: 32px;
    --sc-space-10: 40px;
    --sc-radius-sm: 6px;
    --sc-radius: 8px;
    --sc-radius-lg: 10px;
    --sc-shadow-panel: 0 2px 8px rgba(15, 23, 42, .04);
    --sc-focus-ring: 0 0 0 3px rgba(23, 94, 168, .24);
}

body {
    font-family: var(--sc-font-sans);
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 2px solid var(--sc-primary);
    outline-offset: 2px;
    box-shadow: var(--sc-focus-ring);
}

.sc-skip-link {
    position: fixed;
    top: var(--sc-space-2);
    left: var(--sc-space-2);
    z-index: 10000;
    padding: var(--sc-space-2) var(--sc-space-3);
    border-radius: var(--sc-radius-sm);
    background: var(--sc-heading);
    color: #fff;
    font: 600 14px/20px var(--sc-font-sans);
    text-decoration: none;
    transform: translateY(calc(-100% - var(--sc-space-4)));
}

.sc-skip-link:focus {
    color: #fff;
    transform: translateY(0);
}

.sc-visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}