:root {
    --font-scale: 1;
}

html {
    font-size: calc(16px * var(--font-scale));
    scroll-behavior: smooth;
}

body.high-contrast {
    background: #000 !important;
    color: #fff !important;
}

body.high-contrast * {
    border-color: #fff !important;
}

body.high-contrast a,
body.high-contrast button {
    outline: 2px solid #ff0 !important;
}

.skip-link {
    position: absolute;
    left: -999px;
    top: 1rem;
    z-index: 9999;
    background: #fff;
    color: #0033A0;
    padding: 0.75rem 1rem;
    border: 2px solid #0033A0;
    border-radius: 0.5rem;
    font-weight: 700;
}

.skip-link:focus {
    left: 1rem;
}

.nav-link {
    display: inline-flex;
    align-items: center;
    padding: 0.65rem 0.9rem;
    border-radius: 0.65rem;
    color: #fff;
    text-decoration: none;
}

.nav-link:hover,
.nav-link:focus {
    background: rgba(255, 255, 255, 0.16);
    outline: none;
}

.nav-link.active {
    background: rgba(255, 255, 255, 0.22);
}

.ui-btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.75rem;
    background: #0033A0;
    color: #fff;
    padding: 0.65rem 1rem;
    font-weight: 700;
    text-decoration: none;
    border: 1px solid #0033A0;
    transition: transform 0.15s ease, background 0.15s ease;
}

.ui-btn-primary:hover,
.ui-btn-primary:focus {
    background: #001F5B;
    transform: translateY(-1px);
    outline: 3px solid rgba(0, 51, 160, 0.25);
}

.ui-btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.75rem;
    background: #fff;
    color: #0033A0;
    padding: 0.6rem 0.9rem;
    font-weight: 700;
    text-decoration: none;
    border: 1px solid #cbd5e1;
    transition: transform 0.15s ease, background 0.15s ease;
}

.dark .ui-btn-secondary {
    background: #0f172a;
    color: #bfdbfe;
    border-color: #334155;
}

.ui-btn-secondary:hover,
.ui-btn-secondary:focus {
    background: #E8F0FF;
    transform: translateY(-1px);
    outline: 3px solid rgba(0, 51, 160, 0.2);
}

.dark .ui-btn-secondary:hover,
.dark .ui-btn-secondary:focus {
    background: #1e293b;
}

.ui-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    padding: 1.5rem;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
}

.dark .ui-card {
    background: #0f172a;
    border-color: #1e293b;
}

.ui-card-title {
    font-size: 1.125rem;
    font-weight: 700;
    color: #0f172a;
}

.dark .ui-card-title {
    color: #fff;
}

.check-item::before {
    content: "✓";
    display: inline-flex;
    width: 1.5rem;
    color: #0033A0;
    font-weight: 700;
}

.next-item::before {
    content: "→";
    display: inline-flex;
    width: 1.5rem;
    color: #D52B1E;
    font-weight: 700;
}

:focus-visible {
    outline: 3px solid rgba(213, 43, 30, 0.45);
    outline-offset: 2px;
}