:root {
    --sg-transition-fast: 180ms;
    --sg-transition-normal: 320ms;
    --sg-transition-slow: 460ms;
    --sg-transition-ease: cubic-bezier(.18, .84, .28, 1);
}

html.sg-navigating,
html.sg-navigating body {
    cursor: progress;
}

body {
    overscroll-behavior-y: contain;
    background: #000;
}

:is(a, button, .nav-icon, .filter-chip, .catalog-chip, .media-card, .poster-card, .catalog-card) {
    -webkit-tap-highlight-color: transparent;
}

:is(a, button, .filter-chip, .catalog-chip, .media-card, .poster-card, .catalog-card) {
    transition:
        transform var(--sg-transition-fast) var(--sg-transition-ease),
        opacity var(--sg-transition-fast) var(--sg-transition-ease),
        border-color var(--sg-transition-normal) var(--sg-transition-ease),
        background var(--sg-transition-normal) var(--sg-transition-ease),
        box-shadow var(--sg-transition-normal) var(--sg-transition-ease);
}

:is(a, button, .filter-chip, .catalog-chip, .media-card, .poster-card, .catalog-card):active {
    transform: scale(.975);
}

.original-bottom-nav a,
.oscar-bottom-nav a {
    transition:
        transform 220ms var(--sg-transition-ease),
        opacity 220ms var(--sg-transition-ease),
        color 260ms var(--sg-transition-ease),
        filter 260ms var(--sg-transition-ease);
}

.original-bottom-nav a.active,
.oscar-bottom-nav a.active {
    animation: sgNavActivePop 360ms var(--sg-transition-ease) both;
}

@keyframes sgNavActivePop {
    0% { transform: translateY(8px) scale(.92); filter: blur(2px); }
    68% { transform: translateY(-2px) scale(1.05); filter: blur(0); }
    100% { transform: translateY(0) scale(1); filter: blur(0); }
}

.sg-list-refreshing :is(.media-card, .poster-card, .catalog-card) {
    animation: sgListRefreshIn 360ms var(--sg-transition-ease) both;
}

@keyframes sgListRefreshIn {
    from { opacity: 0; transform: translateY(14px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    :is(a, button, .filter-chip, .catalog-chip, .media-card, .poster-card, .catalog-card, .original-bottom-nav a, .oscar-bottom-nav a) {
        animation: none !important;
        transition: none !important;
    }
}