:root {
    --color-primary: #E63946;
    --color-primary-hover: #D62839;
    --color-primary-active: #C41E3A;
    --color-primary-focus: rgba(230, 57, 70, 0.18);
    --color-primary-dark: #1A1A1A;
    --color-primary-light: #FDEBEC;

    --color-accent: #1A1A1A;

    --color-neutral-900: #17241d;
    --color-neutral-800: #33413a;
    --color-neutral-500: #5B6472;
    --color-neutral-400: #9ca3af;
    --color-neutral-200: #e5e7eb;
    --color-neutral-100: #f3f4f6;
    --color-neutral-50: #f9fafb;
    --color-white: #ffffff;

    --color-warning: #F5A623;
    --color-warning-hover: #DB9315;
    --color-info-action: #4A90D9;
    --color-info-action-hover: #3A78B8;
    --color-danger: #B3261E;
    --color-danger-hover: #94201A;

    --color-background: #FAFAFA;

    --radius-pill: 999px;
    --radius-sm: 8px;
    --radius-md: 10px;
    --radius-lg: 18px;
    --radius-xl: 22px;

    --shadow-card: 0 8px 24px rgba(0, 0, 0, 0.07);
    --shadow-focus-ring: 0 0 0 3px var(--color-primary-focus);

    --transition-fast: 0.2s ease;
    --transition-base: 0.3s ease;
    --transition-modal: 0.25s ease;

    --font-family-base: 'Inter', sans-serif;
}

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

.skip-link {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 1050;
    padding: 10px 18px;
    border-radius: var(--radius-md);
    background: var(--color-primary-dark);
    color: var(--color-white);
    text-decoration: none;
    font-weight: 600;
}

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

.swal2-styled.swal2-confirm {
    background-color: var(--color-primary) !important;
}

.swal2-styled.swal2-confirm:hover {
    background-color: var(--color-primary-hover) !important;
}

.swal2-confirm-danger.swal2-styled.swal2-confirm {
    background-color: var(--color-danger) !important;
}

.swal2-confirm-danger.swal2-styled.swal2-confirm:hover {
    background-color: var(--color-danger-hover) !important;
}