/* Immersive / fullscreen — app-like viewport */
html.evo-immersive,
html.evo-pwa-standalone {
    height: 100%;
    height: 100dvh;
}

/* Default: scrollable immersive (replay, arena, hub, store, etc.) */
html.evo-immersive body {
    min-height: 100dvh;
    min-height: -webkit-fill-available;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: auto;
    -webkit-overflow-scrolling: touch;
    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}

/* Sticky topbar on scroll pages (desktop + mobile default) */
html.evo-immersive .evo-topbar {
    position: sticky;
    top: env(safe-area-inset-top, 0);
    left: 0;
    right: 0;
    z-index: 1200;
    transform: none;
    opacity: 1;
    pointer-events: auto;
}

/* Game pages — lock viewport, auto-hide topbar (desktop) */
@media (min-width: 769px) {
    html.evo-immersive-game body,
    html.evo-immersive body.play-shell,
    html.evo-immersive body.dojo-shell.dojo-has-game,
    html.evo-immersive body.nx-play-body.nx-play-active {
        overflow: hidden;
        overscroll-behavior: none;
    }

    html.evo-immersive-game body .evo-topbar,
    html.evo-immersive body.play-shell .evo-topbar,
    html.evo-immersive body.dojo-shell.dojo-has-game .evo-topbar,
    html.evo-immersive body.nx-play-body.nx-play-active .evo-topbar {
        position: fixed;
        transition: transform 0.25s ease, opacity 0.25s ease;
    }

    html.evo-immersive-game body:not(.evo-topbar-visible) .evo-topbar,
    html.evo-immersive body.play-shell:not(.evo-topbar-visible) .evo-topbar,
    html.evo-immersive body.dojo-shell.dojo-has-game:not(.evo-topbar-visible) .evo-topbar,
    html.evo-immersive body.nx-play-body.nx-play-active:not(.evo-topbar-visible) .evo-topbar {
        transform: translateY(calc(-100% - 8px));
        opacity: 0.35;
        pointer-events: none;
    }

    html.evo-immersive-game body.evo-topbar-visible .evo-topbar,
    html.evo-immersive body.play-shell.evo-topbar-visible .evo-topbar,
    html.evo-immersive body.dojo-shell.dojo-has-game.evo-topbar-visible .evo-topbar,
    html.evo-immersive body.nx-play-body.nx-play-active.evo-topbar-visible .evo-topbar {
        pointer-events: auto;
        opacity: 1;
    }

    html.evo-immersive body.play-shell,
    html.evo-immersive body.dojo-shell.dojo-has-game {
        height: 100dvh;
        max-height: 100dvh;
    }

    html.evo-immersive body.play-shell .play-battle,
    html.evo-immersive body.dojo-shell.dojo-has-game .dojo-layout {
        flex: 1;
        min-height: 0;
        overflow: hidden;
    }
}

/* Hub / sidebar pages — inner scroll regions */
html.evo-immersive .evo-app {
    min-height: 100dvh;
}

html.evo-immersive .evo-app .evo-main {
    height: auto;
    max-height: none;
    overflow-x: hidden;
    overflow-y: visible;
}

html.evo-immersive body:has(.page-content) .page-content,
html.evo-immersive body.supervisor-page,
html.evo-immersive body.puzzle-page .puzzle-layout {
    min-height: calc(100dvh - 56px);
}

/* Lounge / Nexus play — allow vertical scroll when not in active match */
html.evo-immersive body.lounge-page,
html.evo-immersive body.nx-play-body {
    overflow-x: hidden;
    overflow-y: auto !important;
    overscroll-behavior: auto;
    -webkit-overflow-scrolling: touch;
}

html.evo-immersive body.lounge-page .nx-shell,
html.evo-immersive body.nx-play-body .nx-play-shell {
    height: auto;
    max-height: none;
    overflow: visible;
}

/* Nexus play — one-screen fit (extends nexus.css nx-play-active rules) */
@media (min-width: 769px) {
    html.evo-immersive body.nx-play-body.nx-play-active {
        overflow: hidden !important;
        height: 100dvh;
    }

    html.evo-immersive body.nx-play-body.nx-play-active .nx-play-shell:not([hidden]) {
        max-width: 100%;
    }
}

@media (max-height: 900px) {
    html.evo-immersive body.nx-play-body.nx-play-active .nx-play-shell:not([hidden]) {
        overflow-y: auto;
        overflow-x: hidden;
    }
}

/* Mobile / touch: always scroll + sticky topbar */
@media (max-width: 768px), (pointer: coarse) {
    html.evo-immersive body {
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: auto;
        -webkit-overflow-scrolling: touch;
    }

    html.evo-immersive .evo-topbar {
        position: sticky;
        top: 0;
        transform: none !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    html.evo-immersive body.dojo-has-game.dojo-shell {
        height: auto;
        min-height: 100dvh;
        overflow-x: hidden;
        overflow-y: auto;
    }
}

.evo-fullscreen-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-width: 2.25rem;
}

.evo-fullscreen-btn__icon {
    font-size: 1.05rem;
    line-height: 1;
    flex-shrink: 0;
}

.evo-fullscreen-btn__text {
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

@media (max-width: 480px) {
    .evo-fullscreen-btn__text {
        display: none;
    }
}

.evo-fullscreen-nav {
    width: 100%;
    margin-top: 0.5rem;
    border: none;
    cursor: pointer;
    font: inherit;
    text-align: left;
    box-sizing: border-box;
}

.evo-fullscreen-nav:hover {
    color: var(--evo-cyan);
    background: var(--evo-cyan-dim);
}

.evo-sidebar-fullscreen {
    padding: 0.5rem 0 0;
    border-top: 1px solid var(--evo-border-subtle);
    margin-top: 0.5rem;
}

.myroom-fullscreen-btn {
    border-radius: 999px;
}

/* Floating exit — mobile escape hatch when chrome is crowded */
.evo-immersive-exit-fab {
    display: none;
}

@media (max-width: 768px), (pointer: coarse) {
    html.evo-immersive .evo-immersive-exit-fab {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        position: fixed;
        bottom: max(0.85rem, env(safe-area-inset-bottom));
        right: max(0.85rem, env(safe-area-inset-right));
        z-index: 1300;
        padding: 0.55rem 0.85rem;
        border-radius: 999px;
        border: 1px solid rgba(0, 229, 255, 0.45);
        background: rgba(5, 7, 15, 0.92);
        color: var(--evo-cyan, #00e5ff);
        font-size: 0.72rem;
        font-weight: 700;
        letter-spacing: 0.04em;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.45);
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }

    html.evo-immersive .evo-immersive-exit-fab:active {
        transform: scale(0.97);
    }

    .evo-immersive-exit-fab__text {
        max-width: 8rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

@media (display-mode: standalone) {
    body {
        padding-top: env(safe-area-inset-top);
        padding-bottom: env(safe-area-inset-bottom);
    }
}

.evo-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (prefers-reduced-motion: reduce) {
    .dojo-heart,
    .dojo-read-progress-shimmer,
    .dojo-action-sheet,
    .album-zodiac-card.is-unsealing,
    .album-zodiac-aura,
    .nx-boss-cutin,
    .nx-result-confetti,
    .nx-skill-cutin,
    .nx-gold-bump {
        animation: none !important;
        transition: none !important;
    }
}