/* =========================================================
   KITTY CATCHER — DESKTOP / TABLET OVERRIDES

   Loaded AFTER kittycatcher.css.
   Do not @import the shared stylesheet from here.
   ========================================================= */

/* =========================================================
       TOUCH DEVICES
       ========================================================= */
.touch-pause-button {
        display: none;
    }
    
    .pause-touch-message {
        display: none !important;
    }
    
    .phone-landscape-note,
    .ios-landscape-note {
        display: none;
    }


/*
    Show touch pause control on phones/tablets.
*/

@media (pointer: coarse) {

    .game-stage {
        position: relative;
    }

    .touch-pause-button {
        position: absolute;

        z-index: 50;

        top: 32px;
        right: 9px;

        display: block;

        min-width: 82px;
        min-height: 38px;

        padding:
            7px
            10px;

        border:
            1px solid
            rgba(255, 228, 92, 0.9);

        border-radius: 7px;

        font-family:
            "Audiowide",
            sans-serif;

        font-size: 10px;
        font-weight: 700;

        letter-spacing: 0.06em;

        color: #ffe45c;

        background:
            rgba(
                9,
                7,
                24,
                0.9
            );

        box-shadow:
            0 0 7px rgba(255, 228, 92, 0.65),
            0 0 14px rgba(255, 42, 157, 0.25);

        text-shadow:
            0 0 6px rgba(255, 228, 92, 0.85);

        touch-action: manipulation;

        cursor: pointer;
    }


    .touch-pause-button:active {
        transform:
            scale(0.95);
    }


    body.game-paused
    .touch-pause-button {
        color: #bfff39;

        border-color: #bfff39;

        box-shadow:
            0 0 7px rgba(191, 255, 57, 0.7),
            0 0 16px rgba(0, 238, 255, 0.28);
    }


    .pause-desktop-message {
        display: none !important;
    }


    .pause-touch-message {
        display: block !important;
    }

}

/* =========================================================
   DESKTOP / TABLET PAGE UTILITIES
   ========================================================= */

/* Phone-only UI never appears in the desktop/tablet shell. */
.phone-landscape-gate,
.phone-landscape-note,
.ios-landscape-note {
    display: none !important;
}

/* Keyboard instructions are for fine-pointer/desktop input only. */
.desktop-controls-message {
    display: block;
}

@media (pointer: coarse) {
    .desktop-controls-message {
        display: none !important;
    }
}


/* =========================================================
   COARSE POINTER HUD — TABLETS / TOUCH LAPTOPS
   ========================================================= */

.mobile-control-hud {
    display: none;
}

@media (pointer: coarse) {
    .game-instructions {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 52px;
    }

    .desktop-controls-message {
        display: none !important;
    }

    .mobile-control-hud {
        display: flex;
    }

    /* The pause control used to float over the top marquee. It now belongs
       to the same instruction-strip HUD as Interact and Throw. */
    .mobile-control-hud .touch-pause-button {
        position: static;
        z-index: auto;
        top: auto;
        right: auto;
        min-width: 96px;
        min-height: 44px;
        padding: 8px 12px;
        font-size: 11px;
    }
}