/* Motion follows the existing portal layout; all content remains visible without JavaScript. */
:root { --portal-ease-out: cubic-bezier(.22,1,.36,1); }

.portal-button:focus-visible, .portal-panel-link:focus-visible, .panel-button:focus-visible { outline: 2px solid #e4c991; outline-offset: 4px; }
.home-announcements-heading a span { display: inline-block; }

@media (prefers-reduced-motion: no-preference) {
    body.unlocked:not(.edit-mode) #regulamin.active .portal-hero-logo,
    body.unlocked:not(.edit-mode) #regulamin.active .portal-hero-kicker,
    body.unlocked:not(.edit-mode) #regulamin.active .portal-wordmark,
    body.unlocked:not(.edit-mode) #regulamin.active .portal-hero-subtitle,
    body.unlocked:not(.edit-mode) #regulamin.active .portal-gate,
    body.unlocked:not(.edit-mode) #regulamin.active .portal-hero-actions .portal-button,
    body.unlocked:not(.edit-mode) #regulamin.active .portal-signature {
        animation: portal-enter .7s var(--portal-ease-out) var(--portal-delay,0s) backwards;
    }
    body.unlocked #regulamin.active .portal-hero-logo { --portal-delay: .04s; }
    body.unlocked #regulamin.active .portal-hero-kicker { --portal-delay: .1s; }
    body.unlocked #regulamin.active .portal-wordmark { --portal-delay: .16s; }
    body.unlocked #regulamin.active .portal-hero-subtitle { --portal-delay: .24s; }
    body.unlocked #regulamin.active .portal-gate { --portal-delay: calc(.3s + var(--motion-order,0) * .055s); }
    .portal-gate:nth-child(1) { --motion-order: 0; }
    .portal-gate:nth-child(2) { --motion-order: 1; }
    .portal-gate:nth-child(3) { --motion-order: 2; }
    .portal-gate:nth-child(4) { --motion-order: 3; }
    .portal-gate:nth-child(5) { --motion-order: 4; }
    .portal-gate:nth-child(6) { --motion-order: 5; }
    .portal-gate:nth-child(7) { --motion-order: 6; }
    body.unlocked #regulamin.active .portal-hero-actions .portal-button { --portal-delay: .64s; }
    body.unlocked #regulamin.active .portal-hero-actions .portal-button:nth-child(2) { --portal-delay: .7s; }
    body.unlocked #regulamin.active .portal-signature { --portal-delay: .78s; }

    body.unlocked:not(.edit-mode) #regulamin.active .portal-wordmark span {
        background: linear-gradient(110deg,transparent 38%,rgba(230,201,149,.28) 50%,transparent 62%) 0 0 / 300% 100% no-repeat;
        -webkit-background-clip: text;
        background-clip: text;
        animation: portal-gold-pass 1.8s .55s backwards;
    }
    body.share-warning-open #regulamin .portal-hero * { animation-play-state: paused !important; }

    .portal-gate { transition: border-color .25s ease, transform .3s var(--portal-ease-out), box-shadow .3s ease; }
    .portal-gate::before { transition: transform .65s var(--portal-ease-out); }
    .portal-gate-icon { transition: translate .3s var(--portal-ease-out); }
    .portal-gate:focus-visible { box-shadow: 0 10px 30px rgba(0,0,0,.3),0 0 0 2px rgba(215,183,121,.16); }
    .portal-gate:focus-visible::before { transform: scale(1.055); }
    .portal-gate:focus-visible .portal-gate-icon { translate: 0 -3px; }

    .portal-button, .portal-panel-link, .panel-button, .profile-back {
        transition: translate .22s var(--portal-ease-out), border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
    }
    .portal-button:active, .portal-panel-link:active, .panel-button:active, .profile-back:active { translate: 0 0; }
    .portal-button i, .home-announcements-heading a span { transition: translate .25s var(--portal-ease-out); }
    .portal-button:focus-visible i { translate: 3px 0; }

    .portal-nav .nav-section[open] .nav-section-panel { animation: portal-menu-enter .2s var(--portal-ease-out) backwards; transform-origin: top; }
    .portal-actions .search-wrap:focus-within .site-search,
    .portal-actions .search-results:not([hidden]) { animation: portal-menu-enter .2s var(--portal-ease-out) backwards; }
    .page-section.active .portal-section-hero,
    .page-section.active .announcements-page-heading,
    .page-section.active .panel-heading { animation: portal-enter .5s var(--portal-ease-out) backwards; }

    .motion-waiting { transition: opacity .65s ease, translate .65s var(--portal-ease-out); }
    .motion-waiting:not(.motion-visible):not(:focus-within) { opacity: 0; translate: 0 18px; }
    .home-announcements-list.motion-waiting { transition-delay: .1s; }

    @media (hover: hover) and (pointer: fine) {
        .portal-gate:hover { box-shadow: 0 12px 30px rgba(0,0,0,.3); }
        .portal-gate:hover::before { transform: scale(1.055); }
        .portal-gate:hover .portal-gate-icon { translate: 0 -3px; }
        .portal-button:hover:not(:active), .portal-panel-link:hover:not(:active), .panel-button:not(:disabled):hover:not(:active), .profile-back:hover:not(:active) { translate: 0 -2px; }
        .portal-button:hover i { translate: 3px 0; }
        .home-announcements-heading a:hover span { translate: 2px -2px; }
    }
    @media (min-width: 761px) {
        body.unlocked[data-page='regulamin']::before { animation: portal-scene-drift 24s ease-in-out infinite alternate; transform-origin: 54% 50%; }
        body.unlocked[data-page='regulamin'].motion-paused::before,
        body.unlocked[data-page='regulamin'].share-warning-open::before,
        body.unlocked[data-page='regulamin'].edit-mode::before { animation-play-state: paused; }
    }
}

@keyframes portal-enter {
    from { opacity: 0; translate: 0 16px; }
    to { opacity: 1; translate: 0 0; }
}
@keyframes portal-menu-enter {
    from { opacity: 0; translate: 0 -5px; }
    to { opacity: 1; translate: 0 0; }
}
@keyframes portal-gold-pass {
    from { background-position: 100% 0; }
    to { background-position: 0 0; }
}
@keyframes portal-scene-drift {
    from { transform: scale(1.025) translate3d(-.2%,0,0); }
    to { transform: scale(1.055) translate3d(.2%,-.3%,0); }
}

@media (prefers-reduced-motion: reduce) {
    .motion-waiting { opacity: 1; translate: none; transition: none; }
    .portal-gate:hover, .portal-gate:focus-visible { transform: none; }
    .portal-gate::before, .portal-gate-icon, .portal-button, .portal-panel-link, .panel-button, .profile-back { transition: none; }
}
