/* BuzzPromo mobile listener app shell - 2026-06-14 */
.mobile-app-topbar,
.mobile-app-dock,
.mobile-player-sheet-handle{
    display:none;
}

@media (max-width:767px){
    html{
        min-height:100%;
        background:#000;
    }

    body.mobile-app-player{
        display:block !important;
        min-height:100svh !important;
        align-items:initial !important;
        justify-content:initial !important;
        padding:0 !important;
        overflow-x:hidden !important;
        background-attachment:scroll !important;
        -webkit-tap-highlight-color:transparent;
    }

    .mobile-app-topbar{
        position:fixed;
        top:0;
        left:0;
        right:0;
        z-index:120;
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:12px;
        min-height:54px;
        padding:calc(8px + env(safe-area-inset-top, 0px)) 14px 8px;
        box-sizing:border-box;
        background:linear-gradient(180deg,rgba(0,0,0,.92),rgba(0,0,0,.56));
        border-bottom:1px solid rgba(255,255,255,.08);
        backdrop-filter:blur(14px);
    }

    .mobile-app-brand{
        display:inline-flex;
        align-items:center;
        gap:9px;
        color:#fff;
        text-decoration:none;
        min-width:0;
        font-weight:900;
    }

    .mobile-app-logo{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        width:30px;
        height:30px;
        border-radius:10px;
        background:linear-gradient(135deg,#ffe45c,#ff4d72);
        color:#000;
        font-weight:900;
        box-shadow:0 10px 22px rgba(0,0,0,.35);
    }

    .mobile-app-title{
        font-size:14px;
        letter-spacing:.02em;
        text-transform:uppercase;
        white-space:nowrap;
    }

    .mobile-app-actions{
        display:flex;
        align-items:center;
        gap:8px;
        flex-shrink:0;
    }

    .mobile-app-install,
    .mobile-app-mini-link{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        min-height:30px;
        padding:7px 10px;
        border-radius:999px;
        border:1px solid rgba(255,255,255,.14);
        background:rgba(255,255,255,.08);
        color:#fff;
        font-size:12px;
        font-weight:900;
        text-decoration:none;
    }

    .mobile-app-install{
        background:linear-gradient(135deg,#ffe45c,#ff4d72);
        color:#000;
        border-color:rgba(255,255,255,.22);
    }

    body.mobile-app-player #songRankWidget.song-rank-widget{
        top:calc(62px + env(safe-area-inset-top, 0px)) !important;
        left:10px !important;
        right:10px !important;
        width:auto !important;
        max-width:none !important;
        display:flex !important;
        grid-template-columns:none !important;
        overflow-x:auto !important;
        overflow-y:hidden !important;
        gap:8px !important;
        padding:8px !important;
        border-radius:18px !important;
        scroll-snap-type:x proximity;
        pointer-events:auto !important;
        -webkit-overflow-scrolling:touch;
        scrollbar-width:none;
    }

    body.mobile-app-player #songRankWidget.song-rank-widget::-webkit-scrollbar{
        display:none;
    }

    body.mobile-app-player #songRankWidget .song-rank-cell{
        flex:0 0 86px !important;
        min-width:86px !important;
        padding:9px 8px !important;
        border-radius:14px !important;
        scroll-snap-align:start;
    }

    body.mobile-app-player #songRankWidget .song-rank-label{
        font-size:8px !important;
        margin-bottom:5px !important;
    }

    body.mobile-app-player #songRankWidget .song-rank-value,
    body.mobile-app-player #songRankWidget #songPlayCount,
    body.mobile-app-player #songRankWidget #songTrendValue{
        font-size:20px !important;
    }

    body.mobile-app-player #songRankWidget .song-rank-sub{
        font-size:8px !important;
        margin-top:5px !important;
    }

    body.mobile-app-player .player{
        position:fixed !important;
        left:0 !important;
        right:0 !important;
        bottom:calc(72px + env(safe-area-inset-bottom, 0px)) !important;
        z-index:95 !important;
        width:auto !important;
        max-width:none !important;
        max-height:calc(100svh - 178px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
        overflow:auto !important;
        margin:0 !important;
        padding:13px 16px 16px !important;
        border-radius:28px 28px 0 0 !important;
        border:1px solid rgba(255,255,255,.12) !important;
        border-bottom:0 !important;
        background:linear-gradient(180deg,rgba(14,14,14,.92),rgba(0,0,0,.86)) !important;
        box-shadow:0 -22px 58px rgba(0,0,0,.62) !important;
        backdrop-filter:blur(18px) !important;
        transition:transform .26s ease, max-height .26s ease !important;
        -webkit-overflow-scrolling:touch;
    }

    body.mobile-player-collapsed .player{
        transform:translateY(calc(100% - 92px));
    }

    body.mobile-player-expanded .player{
        transform:translateY(0);
    }

    .mobile-player-sheet-handle{
        display:flex;
        width:100%;
        align-items:center;
        justify-content:center;
        flex-direction:column;
        gap:6px;
        padding:0 0 10px;
        margin:0 0 6px;
        border:0;
        color:#fff;
        background:transparent;
        font-size:11px;
        font-weight:900;
        letter-spacing:.12em;
        text-transform:uppercase;
        opacity:.78;
    }

    .mobile-player-grip{
        display:block;
        width:48px;
        height:5px;
        border-radius:999px;
        background:rgba(255,255,255,.36);
    }

    body.mobile-app-player .player h1{
        margin:0 0 12px !important;
        text-align:left !important;
    }

    body.mobile-app-player .track-artist{
        font-size:clamp(26px, 10vw, 46px) !important;
        line-height:.96 !important;
        letter-spacing:-.04em;
    }

    body.mobile-app-player .track-song-info{
        font-size:clamp(14px, 4.8vw, 22px) !important;
        line-height:1.12 !important;
        margin-top:6px !important;
    }

    body.mobile-app-player audio{
        margin-top:8px !important;
        height:42px !important;
    }

    body.mobile-app-player #gainAppliedInfo{
        display:none !important;
    }

    body.mobile-app-player .download-btn,
    body.mobile-app-player .more-like-this-btn,
    body.mobile-app-player .favourite-track-btn,
    body.mobile-app-player .my-liked-tracks-link,
    body.mobile-app-player .donate-btn{
        min-width:0 !important;
        flex:1 1 calc(50% - 8px) !important;
        padding:13px 12px !important;
        border-radius:15px !important;
        font-size:13px !important;
        box-sizing:border-box;
    }

    body.mobile-app-player .share-track-box,
    body.mobile-app-player .video-tools-box{
        margin-top:12px !important;
        padding:12px !important;
    }

    body.mobile-player-collapsed .player > *:not(.mobile-player-sheet-handle):not(h1):not(audio){
        display:none !important;
    }

    body.mobile-player-collapsed .player h1{
        margin-bottom:8px !important;
    }

    body.mobile-player-collapsed .track-artist{
        font-size:22px !important;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
    }

    body.mobile-player-collapsed .track-song-info{
        display:block !important;
        font-size:13px !important;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
    }

    body.mobile-player-collapsed .player audio{
        display:none !important;
    }

    .mobile-app-dock{
        position:fixed;
        left:8px;
        right:8px;
        bottom:calc(8px + env(safe-area-inset-bottom, 0px));
        z-index:130;
        display:grid;
        grid-template-columns:repeat(6,minmax(0,1fr));
        gap:5px;
        padding:7px;
        border-radius:22px;
        border:1px solid rgba(255,255,255,.12);
        background:rgba(0,0,0,.82);
        box-shadow:0 -10px 42px rgba(0,0,0,.55);
        backdrop-filter:blur(18px);
    }

    .mobile-dock-btn{
        appearance:none;
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:3px;
        min-width:0;
        min-height:50px;
        border:1px solid rgba(255,255,255,.08);
        border-radius:16px;
        background:rgba(255,255,255,.055);
        color:#fff;
        text-decoration:none;
        font-weight:900;
        cursor:pointer;
    }

    .mobile-dock-btn span{
        font-size:17px;
        line-height:1;
    }

    .mobile-dock-btn small{
        display:block;
        font-size:9px;
        line-height:1;
        opacity:.72;
        white-space:nowrap;
    }

    .mobile-dock-primary{
        background:linear-gradient(135deg,#ffe45c,#ff4d72);
        color:#000;
        border-color:rgba(255,255,255,.18);
    }

    body.mobile-app-player #nowPlayingVideoBadge.now-playing-video-badge,
    body.mobile-app-player .video-mini-bar{
        display:none !important;
    }

    body.mobile-app-player .brand{
        padding-bottom:8px;
    }
}


/* BuzzPromo mobile listener polish v2 - gestures, toast and better dock feedback */
.mobile-app-toast,
.mobile-gesture-hint{
    display:none;
}

@media (max-width:767px){
    body.mobile-app-player{
        touch-action:pan-y;
        overscroll-behavior-y:contain;
    }

    .mobile-gesture-hint{
        position:fixed;
        left:14px;
        right:14px;
        bottom:calc(160px + env(safe-area-inset-bottom, 0px));
        z-index:126;
        display:flex;
        justify-content:center;
        gap:8px;
        flex-wrap:wrap;
        pointer-events:none;
        opacity:0;
        transform:translateY(10px);
        transition:opacity .22s ease, transform .22s ease;
    }

    .mobile-gesture-hint.is-visible{
        opacity:1;
        transform:translateY(0);
        pointer-events:auto;
    }

    .mobile-gesture-hint.is-hidden{
        display:none;
    }


    .mobile-gesture-dismiss{
        appearance:none;
        border:1px solid rgba(255,255,255,.18);
        background:rgba(255,255,255,.12);
        color:#fff;
        min-height:30px;
        padding:7px 11px;
        border-radius:999px;
        font-size:11px;
        font-weight:800;
        letter-spacing:.02em;
    }

    .mobile-gesture-hint span{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        min-height:30px;
        padding:7px 11px;
        border-radius:999px;
        border:1px solid rgba(255,255,255,.12);
        background:rgba(0,0,0,.72);
        color:#fff;
        font-size:11px;
        font-weight:900;
        letter-spacing:.02em;
        box-shadow:0 10px 28px rgba(0,0,0,.35);
        backdrop-filter:blur(12px);
    }

    .mobile-app-toast{
        position:fixed;
        left:50%;
        bottom:calc(92px + env(safe-area-inset-bottom, 0px));
        z-index:145;
        display:block;
        max-width:calc(100vw - 32px);
        padding:10px 14px;
        border-radius:999px;
        border:1px solid rgba(255,255,255,.14);
        background:rgba(0,0,0,.84);
        color:#fff;
        font-size:13px;
        font-weight:900;
        text-align:center;
        box-shadow:0 12px 36px rgba(0,0,0,.48);
        backdrop-filter:blur(14px);
        opacity:0;
        transform:translate(-50%, 8px) scale(.96);
        pointer-events:none;
        transition:opacity .18s ease, transform .18s ease;
    }

    .mobile-app-toast.is-visible{
        opacity:1;
        transform:translate(-50%, 0) scale(1);
    }

    .mobile-dock-btn small strong{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        min-width:17px;
        height:17px;
        margin-left:2px;
        padding:0 4px;
        border-radius:999px;
        background:rgba(255,255,255,.16);
        color:inherit;
        font-size:9px;
        line-height:1;
    }

    .mobile-dock-btn:active,
    .mobile-app-mini-link:active,
    .mobile-app-install:active{
        transform:scale(.96);
    }

    body.mobile-app-player .mobile-player-sheet-handle{
        cursor:pointer;
        touch-action:manipulation;
    }

    body.mobile-player-collapsed .player{
        box-shadow:0 -14px 44px rgba(0,0,0,.72), 0 0 0 1px rgba(255,255,255,.06) inset !important;
    }

    body.mobile-player-expanded .mobile-app-dock{
        opacity:.92;
    }
}

/* BuzzPromo mobile hint hard fix + phone landscape video mode - 2026-06-14d */
.mobile-gesture-hint{
    position:fixed !important;
    left:14px !important;
    right:14px !important;
    bottom:calc(160px + env(safe-area-inset-bottom, 0px)) !important;
    z-index:99999 !important;
    display:none !important;
    justify-content:center !important;
    align-items:center !important;
    gap:8px !important;
    flex-wrap:wrap !important;
    pointer-events:none !important;
    opacity:0 !important;
    transform:translateY(10px) !important;
    transition:opacity .2s ease, transform .2s ease !important;
    font-size:12px !important;
    line-height:1.2 !important;
}
.mobile-gesture-hint.is-visible{
    display:flex !important;
    opacity:1 !important;
    transform:translateY(0) !important;
    pointer-events:auto !important;
}
.mobile-gesture-hint.is-hidden{
    display:none !important;
    opacity:0 !important;
    pointer-events:none !important;
}
.mobile-gesture-hint span{
    display:inline-flex !important;
    align-items:center !important;
    min-height:30px !important;
    border:1px solid rgba(255,255,255,.14) !important;
    background:rgba(0,0,0,.74) !important;
    color:#fff !important;
    padding:7px 10px !important;
    border-radius:999px !important;
    box-shadow:0 14px 34px rgba(0,0,0,.35) !important;
    backdrop-filter:blur(10px) !important;
    font-size:12px !important;
    white-space:nowrap !important;
}
.mobile-gesture-dismiss{
    appearance:none !important;
    border:1px solid rgba(255,255,255,.20) !important;
    background:linear-gradient(135deg,#ffcf4a,#ff416c) !important;
    color:#080808 !important;
    font-weight:900 !important;
    min-height:30px !important;
    padding:7px 12px !important;
    border-radius:999px !important;
    font-size:12px !important;
    box-shadow:0 14px 34px rgba(0,0,0,.35) !important;
}

@media (orientation: landscape) and (max-height:620px) and (pointer:coarse){
    body.mobile-app-player{
        padding-bottom:0 !important;
        overflow:hidden !important;
    }
    body.mobile-video-landscape .mobile-app-topbar,
    body.mobile-video-landscape .mobile-app-dock,
    body.mobile-video-landscape .mobile-player-sheet-handle,
    body.mobile-video-landscape .mobile-gesture-hint{
        display:none !important;
    }
    body.mobile-video-landscape .youtube-video-bg,
    body.mobile-video-landscape .youtube-video-overlay{
        display:block !important;
    }
    body.mobile-video-landscape .player{
        position:fixed !important;
        top:auto !important;
        left:50% !important;
        bottom:calc(14px + env(safe-area-inset-bottom, 0px)) !important;
        width:min(430px, 45vw) !important;
        max-height:calc(100vh - 28px) !important;
        transform:translateX(-50%) !important;
        padding:14px 16px !important;
        border-radius:18px !important;
        background:rgba(0,0,0,.44) !important;
        backdrop-filter:blur(10px) !important;
        opacity:.92 !important;
        z-index:16 !important;
    }
    body.mobile-video-landscape.player-minimized .player{
        transform:translateX(-50%) translateY(calc(100% - 60px)) !important;
        opacity:.72 !important;
    }
    body.mobile-video-landscape .player h1{
        font-size:16px !important;
        margin:0 0 3px !important;
        white-space:nowrap !important;
        overflow:hidden !important;
        text-overflow:ellipsis !important;
    }
    body.mobile-video-landscape .track-artist,
    body.mobile-video-landscape .track-song-info{
        font-size:11px !important;
        margin:0 0 6px !important;
        white-space:nowrap !important;
        overflow:hidden !important;
        text-overflow:ellipsis !important;
    }
    body.mobile-video-landscape audio{
        height:34px !important;
        margin:6px 0 !important;
    }
    body.mobile-video-landscape #gainAppliedInfo,
    body.mobile-video-landscape .share-track-box,
    body.mobile-video-landscape .video-tools-box,
    body.mobile-video-landscape .brand,
    body.mobile-video-landscape .footer,
    body.mobile-video-landscape .donate-btn,
    body.mobile-video-landscape .download-btn,
    body.mobile-video-landscape .my-liked-tracks-link,
    body.mobile-video-landscape .favourite-track-btn,
    body.mobile-video-landscape .more-like-this-btn{
        display:none !important;
    }
    body.mobile-video-landscape .song-rank-widget{
        transform:scale(.78) !important;
        transform-origin:top left !important;
        top:10px !important;
        left:10px !important;
        z-index:20 !important;
    }
    body.mobile-video-landscape .now-playing-video-badge{
        display:block !important;
        left:14px !important;
        bottom:14px !important;
        transform:scale(.72) !important;
        transform-origin:bottom left !important;
        z-index:15 !important;
    }
}

/* BuzzPromo mobile landscape fullscreen polish - 2026-06-14e
   Note: iOS Safari browser chrome cannot be hidden from a normal web tab.
   This makes the in-page landscape player use the full available viewport and
   gives users a one-tap fullscreen/PWA instruction path. */
.mobile-landscape-fullscreen-hint{
    display:none;
}
@media (orientation: landscape) and (max-height:620px) and (pointer:coarse){
    html, body.mobile-video-landscape{
        width:100vw !important;
        min-height:100dvh !important;
        height:100dvh !important;
        max-height:100dvh !important;
        overflow:hidden !important;
        overscroll-behavior:none !important;
        background:#000 !important;
    }
    body.mobile-video-landscape .youtube-video-bg{
        position:fixed !important;
        inset:0 !important;
        width:100vw !important;
        height:100dvh !important;
        z-index:0 !important;
        background:#000 !important;
    }
    body.mobile-video-landscape .youtube-video-bg iframe{
        position:absolute !important;
        top:50% !important;
        left:50% !important;
        width:100vw !important;
        height:56.25vw !important;
        min-width:177.78dvh !important;
        min-height:100dvh !important;
        transform:translate(-50%, -50%) !important;
    }
    body.mobile-video-landscape .youtube-video-overlay{
        position:fixed !important;
        inset:0 !important;
        z-index:1 !important;
        background:linear-gradient(90deg, rgba(0,0,0,.55), rgba(0,0,0,.2) 45%, rgba(0,0,0,.44)) !important;
    }
    body.mobile-video-landscape .song-rank-widget{
        top:max(8px, env(safe-area-inset-top, 0px)) !important;
        left:max(8px, env(safe-area-inset-left, 0px)) !important;
        max-width:65vw !important;
        overflow:hidden !important;
    }
    body.mobile-video-landscape .video-mini-bar{
        left:calc(14px + env(safe-area-inset-left, 0px)) !important;
        right:calc(14px + env(safe-area-inset-right, 0px)) !important;
        bottom:calc(12px + env(safe-area-inset-bottom, 0px)) !important;
        width:auto !important;
        min-height:54px !important;
        z-index:40 !important;
        border-radius:16px !important;
        background:rgba(0,0,0,.55) !important;
        border:1px solid rgba(255,255,255,.16) !important;
        backdrop-filter:blur(14px) !important;
    }
    body.mobile-video-landscape .video-mini-actions{
        gap:7px !important;
    }
    body.mobile-video-landscape .video-mini-actions button{
        min-width:58px !important;
        min-height:40px !important;
        border-radius:13px !important;
        font-size:14px !important;
        font-weight:900 !important;
    }
    body.mobile-video-landscape .video-mini-fullscreen-btn{
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
        background:linear-gradient(135deg,#ffcf4a,#ff416c) !important;
        color:#080808 !important;
        border-color:rgba(255,255,255,.18) !important;
    }
    body.mobile-video-landscape .now-playing-video-badge{
        bottom:86px !important;
        left:calc(12px + env(safe-area-inset-left, 0px)) !important;
        max-width:60vw !important;
        transform:none !important;
    }
    body.mobile-video-landscape .now-playing-video-artist{
        font-size:clamp(24px, 5.4vw, 46px) !important;
        max-width:60vw !important;
        white-space:nowrap !important;
        overflow:hidden !important;
        text-overflow:ellipsis !important;
    }
    body.mobile-video-landscape .now-playing-video-song{
        font-size:clamp(13px, 2vw, 18px) !important;
        max-width:62vw !important;
        white-space:nowrap !important;
        overflow:hidden !important;
        text-overflow:ellipsis !important;
    }
    .mobile-landscape-fullscreen-hint{
        position:fixed !important;
        right:calc(12px + env(safe-area-inset-right, 0px)) !important;
        top:calc(12px + env(safe-area-inset-top, 0px)) !important;
        z-index:60 !important;
        display:none !important;
        max-width:min(360px, 44vw) !important;
        padding:12px 12px !important;
        border-radius:16px !important;
        border:1px solid rgba(255,255,255,.18) !important;
        background:rgba(0,0,0,.72) !important;
        color:#fff !important;
        box-shadow:0 18px 40px rgba(0,0,0,.45) !important;
        backdrop-filter:blur(16px) !important;
        font-family:Arial,sans-serif !important;
    }
    .mobile-landscape-fullscreen-hint.is-visible{
        display:block !important;
    }
    .mobile-landscape-fullscreen-hint strong{
        display:block !important;
        font-size:13px !important;
        text-transform:uppercase !important;
        letter-spacing:.08em !important;
        margin-bottom:4px !important;
    }
    .mobile-landscape-fullscreen-hint span{
        display:block !important;
        font-size:12px !important;
        line-height:1.35 !important;
        opacity:.82 !important;
    }
    .mobile-landscape-fullscreen-hint button{
        margin-top:8px !important;
        border:1px solid rgba(255,255,255,.18) !important;
        background:rgba(255,255,255,.12) !important;
        color:#fff !important;
        border-radius:999px !important;
        padding:7px 12px !important;
        font-weight:900 !important;
    }
}


/* BuzzPromo PWA install guidance - 2026-06-14f */
.mobile-pwa-guide{
    display:none;
}

@media (max-width:767px), (pointer:coarse){
    .mobile-pwa-guide{
        position:fixed;
        inset:0;
        z-index:260;
        display:flex;
        align-items:flex-end;
        justify-content:center;
        padding:18px 14px calc(18px + env(safe-area-inset-bottom, 0px));
        box-sizing:border-box;
        background:rgba(0,0,0,.58);
        opacity:0;
        pointer-events:none;
        transition:opacity .18s ease;
        backdrop-filter:blur(8px);
    }

    .mobile-pwa-guide.is-visible{
        opacity:1;
        pointer-events:auto;
    }

    .mobile-pwa-guide-card{
        position:relative;
        width:min(460px, 100%);
        padding:22px 20px 18px;
        border-radius:26px;
        border:1px solid rgba(255,255,255,.14);
        background:linear-gradient(180deg,rgba(20,20,22,.98),rgba(2,2,3,.98));
        box-shadow:0 26px 70px rgba(0,0,0,.72), inset 0 1px 0 rgba(255,255,255,.08);
        color:#fff;
        transform:translateY(18px) scale(.98);
        transition:transform .18s ease;
    }

    .mobile-pwa-guide.is-visible .mobile-pwa-guide-card{
        transform:translateY(0) scale(1);
    }

    .mobile-pwa-guide-close{
        position:absolute;
        top:10px;
        right:10px;
        width:34px;
        height:34px;
        border-radius:999px;
        border:1px solid rgba(255,255,255,.16);
        background:rgba(255,255,255,.08);
        color:#fff;
        font-size:22px;
        line-height:1;
    }

    .mobile-pwa-guide-icon{
        display:flex;
        align-items:center;
        justify-content:center;
        width:54px;
        height:54px;
        margin-bottom:14px;
        border-radius:18px;
        background:linear-gradient(135deg,#ffe45c,#ff4d72);
        color:#000;
        font-size:30px;
        font-weight:900;
        box-shadow:0 18px 36px rgba(0,0,0,.45);
    }

    .mobile-pwa-guide-title{
        font-size:24px;
        line-height:1.05;
        font-weight:950;
        letter-spacing:-.02em;
        text-transform:uppercase;
        margin-bottom:8px;
    }

    .mobile-pwa-guide-text{
        color:rgba(255,255,255,.78);
        font-size:14px;
        line-height:1.45;
        margin-bottom:12px;
    }

    .mobile-pwa-guide-steps{
        margin:0 0 16px 0;
        padding:0;
        list-style:none;
        display:grid;
        gap:8px;
        counter-reset:pwaStep;
    }

    .mobile-pwa-guide-steps li{
        position:relative;
        min-height:36px;
        padding:10px 10px 10px 48px;
        border-radius:16px;
        background:rgba(255,255,255,.06);
        border:1px solid rgba(255,255,255,.08);
        color:rgba(255,255,255,.9);
        font-size:14px;
        line-height:1.35;
        counter-increment:pwaStep;
    }

    .mobile-pwa-guide-steps li::before{
        content:counter(pwaStep);
        position:absolute;
        left:10px;
        top:50%;
        transform:translateY(-50%);
        display:flex;
        align-items:center;
        justify-content:center;
        width:26px;
        height:26px;
        border-radius:999px;
        background:rgba(255,228,92,.18);
        color:#ffe45c;
        font-weight:950;
    }

    .mobile-pwa-guide-actions{
        display:flex;
        gap:10px;
    }

    .mobile-pwa-guide-actions button{
        flex:1;
        min-height:44px;
        border-radius:16px;
        border:1px solid rgba(255,255,255,.14);
        font-weight:950;
        letter-spacing:.01em;
    }

    .mobile-pwa-guide-primary{
        background:linear-gradient(135deg,#ffe45c,#ff4d72);
        color:#000;
    }

    .mobile-pwa-guide-secondary{
        background:rgba(255,255,255,.08);
        color:#fff;
    }

    .mobile-app-install[hidden]{
        display:none !important;
    }
}


/* BuzzPromo PWA install visibility fix - 2026-06-14h */
.mobile-pwa-floating-install{
    display:none;
}
@media (max-width:767px){
    #mobileAppTopBar.mobile-app-topbar{
        display:flex !important;
    }
    #mobileInstallBtn.mobile-app-install:not([hidden]),
    #mobileInstallFloatingBtn.mobile-pwa-floating-install:not([hidden]){
        display:inline-flex !important;
    }
    #mobileInstallFloatingBtn.mobile-pwa-floating-install{
        position:fixed;
        right:14px;
        bottom:calc(88px + env(safe-area-inset-bottom, 0px));
        z-index:145;
        align-items:center;
        justify-content:center;
        min-height:38px;
        padding:10px 14px;
        border-radius:999px;
        border:1px solid rgba(255,255,255,.24);
        background:linear-gradient(135deg,#ffe45c,#ff4d72);
        color:#000;
        font-size:12px;
        font-weight:950;
        text-transform:uppercase;
        letter-spacing:.02em;
        box-shadow:0 16px 36px rgba(0,0,0,.55);
    }
    body.mobile-player-expanded #mobileInstallFloatingBtn.mobile-pwa-floating-install{
        bottom:calc(260px + env(safe-area-inset-bottom, 0px));
    }
    body.mobile-video-landscape #mobileInstallFloatingBtn.mobile-pwa-floating-install,
    body.mobile-video-landscape #mobileAppTopBar.mobile-app-topbar{
        display:none !important;
    }
}