@keyframes view-rise {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes item-rise {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes seal-settle {
    from {
        opacity: 0;
        transform: scale(0.82) rotate(-8deg);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes ember-drift {
    from {
        opacity: 0.35;
        transform: translateY(0) scale(1);
    }
    to {
        opacity: 0.7;
        transform: translateY(-6px) scale(1.06);
    }
}

@keyframes shimmer-sweep {
    from {
        background-position: -140% 0;
    }
    to {
        background-position: 240% 0;
    }
}

@keyframes mark-ignite {
    from {
        background-size: 0% 100%;
    }
    to {
        background-size: 100% 100%;
    }
}

.view {
    animation: view-rise 320ms var(--ease-out, cubic-bezier(0.22, 0.68, 0.3, 1)) both;
}

.category-grid-item {
    animation: item-rise 340ms cubic-bezier(0.22, 0.68, 0.3, 1) both;
}

.category-grid-item:nth-child(1) { animation-delay: 20ms; }
.category-grid-item:nth-child(2) { animation-delay: 45ms; }
.category-grid-item:nth-child(3) { animation-delay: 70ms; }
.category-grid-item:nth-child(4) { animation-delay: 95ms; }
.category-grid-item:nth-child(5) { animation-delay: 120ms; }
.category-grid-item:nth-child(6) { animation-delay: 145ms; }
.category-grid-item:nth-child(7) { animation-delay: 170ms; }
.category-grid-item:nth-child(8) { animation-delay: 195ms; }
.category-grid-item:nth-child(9) { animation-delay: 220ms; }
.category-grid-item:nth-child(10) { animation-delay: 245ms; }
.category-grid-item:nth-child(11) { animation-delay: 270ms; }
.category-grid-item:nth-child(12) { animation-delay: 295ms; }

.category-emblem {
    animation: seal-settle 420ms cubic-bezier(0.34, 1.4, 0.44, 1) both;
    animation-delay: inherit;
}

.entry-item {
    animation: item-rise 280ms cubic-bezier(0.22, 0.68, 0.3, 1) both;
}

.entry-item:nth-child(1) { animation-delay: 10ms; }
.entry-item:nth-child(2) { animation-delay: 26ms; }
.entry-item:nth-child(3) { animation-delay: 42ms; }
.entry-item:nth-child(4) { animation-delay: 58ms; }
.entry-item:nth-child(5) { animation-delay: 74ms; }
.entry-item:nth-child(6) { animation-delay: 90ms; }
.entry-item:nth-child(7) { animation-delay: 106ms; }
.entry-item:nth-child(8) { animation-delay: 122ms; }
.entry-item:nth-child(9) { animation-delay: 138ms; }
.entry-item:nth-child(10) { animation-delay: 154ms; }
.entry-item:nth-child(n + 11) { animation-delay: 170ms; }

.brand-mark {
    transition: transform 400ms cubic-bezier(0.34, 1.4, 0.44, 1), filter 300ms ease;
}

.brand:hover .brand-mark {
    transform: rotate(-14deg) scale(1.12);
    filter: drop-shadow(0 0 6px hsl(42 70% 58% / 0.55));
}

.category-card .category-emblem {
    transition: transform 320ms cubic-bezier(0.34, 1.4, 0.44, 1), filter 320ms ease;
}

.category-card:hover .category-emblem,
.category-card:focus-visible .category-emblem {
    transform: translateY(-2px) scale(1.09);
    filter: drop-shadow(0 0 7px hsl(var(--accent-hue) 60% 50% / 0.45));
}

.rule-diamond {
    transition: transform 420ms cubic-bezier(0.34, 1.4, 0.44, 1);
}

.codex-sheet:hover .rule-diamond,
.overview-hero:hover .rule-diamond {
    transform: rotate(225deg);
}

.chip {
    transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms cubic-bezier(0.34, 1.4, 0.44, 1);
}

.chip:active {
    transform: scale(0.94);
}

.chip-selected {
    transform: translateY(-1px);
}

.entry-snippet mark,
.entry-name mark {
    background-image: linear-gradient(var(--gold-bright), var(--gold-bright));
    background-repeat: no-repeat;
    background-position: left center;
    animation: mark-ignite 420ms ease both;
}

.view-status {
    background-image: linear-gradient(
        100deg,
        transparent 20%,
        hsl(42 70% 70% / 0.22) 42%,
        transparent 62%
    );
    background-size: 220% 100%;
    background-repeat: no-repeat;
    animation: shimmer-sweep 1900ms linear infinite;
}

.scroll-top {
    position: fixed;
    right: clamp(0.9rem, 3vw, 2rem);
    bottom: clamp(0.9rem, 3vw, 2rem);
    z-index: 30;
    display: grid;
    place-items: center;
    width: 2.9rem;
    height: 2.9rem;
    padding: 0.7rem;
    color: var(--gold-bright);
    background: rgba(28, 20, 13, 0.92);
    border: 1px solid rgba(169, 131, 47, 0.5);
    border-radius: 50%;
    cursor: pointer;
    animation: item-rise 260ms ease both;
    transition: transform 200ms cubic-bezier(0.34, 1.4, 0.44, 1), border-color 200ms ease;
}

.scroll-top:hover {
    transform: translateY(-3px);
    border-color: var(--gold-bright);
}

.scroll-top[hidden] {
    display: none;
}

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

@media print {
    .view,
    .entry-item,
    .category-grid-item,
    .category-emblem,
    .scroll-top {
        animation: none !important;
    }
}