.fm-live-player{
    --fm-player-bg:#050505;
    --fm-player-panel:#0b0b0b;
    --fm-player-border:rgba(255,255,255,.09);
    --fm-player-text:#fff;
    --fm-player-muted:#9a9a9a;
    --fm-player-red:#ff1024;
    display:grid;
    grid-template-columns:180px minmax(0,1fr) 190px;
    gap:24px;
    align-items:center;
    width:100%;
    padding:24px;
    background:
        radial-gradient(circle at 12% 15%,rgba(255,16,36,.09),transparent 30%),
        linear-gradient(135deg,#080808,#020202);
    border:1px solid rgba(255,255,255,.06);
    border-radius:18px;
    color:var(--fm-player-text);
    overflow:hidden;
}
.fm-live-player__cover-wrap{position:relative;min-width:0}
.fm-live-player__cover{
    display:block;width:180px;height:180px;object-fit:cover;border-radius:8px;
    background:#111;
}
.fm-live-player__live-badge{
    position:absolute;left:10px;top:10px;display:inline-flex;align-items:center;gap:6px;
    padding:6px 9px;border-radius:6px;background:rgba(0,0,0,.78);font-size:11px;
    font-weight:800;letter-spacing:.08em;
}
.fm-live-player__live-badge i,.fm-live-player__status-row strong i{
    width:7px;height:7px;border-radius:50%;display:inline-block;background:var(--fm-player-red);
    box-shadow:0 0 10px rgba(255,16,36,.65)
}
.fm-live-player__main{min-width:0}
.fm-live-player__eyebrow{
    color:var(--fm-player-red);font-size:11px;font-weight:800;letter-spacing:.16em;
    text-transform:uppercase;margin-bottom:7px;
}
.fm-live-player__artist{
    margin:0;font-size:clamp(28px,4vw,52px);line-height:.98;letter-spacing:-.045em;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.fm-live-player__title{
    margin-top:9px;font-size:clamp(16px,2vw,24px);font-weight:700;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.fm-live-player__meta{
    margin-top:10px;color:#c6c6c6;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.fm-live-player__progress-shell{margin-top:24px}
.fm-live-player__progress{
    position:relative;height:4px;border-radius:999px;background:rgba(255,255,255,.15);overflow:hidden
}
.fm-live-player__progress span{
    display:block;height:100%;width:0;background:var(--fm-player-red);border-radius:inherit;
    transition:width .35s linear;
}
.fm-live-player__times{
    margin-top:7px;display:flex;justify-content:space-between;color:#9c9c9c;font-size:11px;font-variant-numeric:tabular-nums
}
.fm-live-player__controls{display:flex;align-items:center;gap:16px;margin-top:18px;min-width:0}
.fm-live-player__play{
    flex:0 0 48px;width:48px;height:48px;border-radius:50%;border:0;background:#fff;color:#050505;
    display:grid;place-items:center;font-size:17px;cursor:pointer
}
.fm-live-player__play:hover{transform:translateY(-1px)}
.fm-live-player__volume{display:flex;align-items:center;gap:9px;min-width:120px}
.fm-live-player__volume input{width:110px;accent-color:#fff}
.fm-live-player__quality{
    margin-left:auto;display:flex;align-items:center;gap:2px;padding:3px;background:#111;border:1px solid var(--fm-player-border);border-radius:999px
}
.fm-live-player__quality button{
    border:0;background:transparent;color:#838383;border-radius:999px;padding:7px 10px;
    font-size:9px;font-weight:800;letter-spacing:.04em;cursor:pointer
}
.fm-live-player__quality button.active{background:#fff;color:#080808}
.fm-live-player__status{
    border-left:1px solid var(--fm-player-border);padding-left:20px;display:grid;gap:16px
}
.fm-live-player__status-row span{
    display:block;color:#777;font-size:9px;font-weight:800;letter-spacing:.12em;margin-bottom:5px
}
.fm-live-player__status-row strong{font-size:14px;font-variant-numeric:tabular-nums}
.fm-live-player__status-row strong.is-online{color:#fff}
.fm-live-player__status-row strong.is-offline{color:#aaa}
.fm-live-player__status-row strong.is-offline i{background:#666;box-shadow:none}
.fm-live-player.is-offline .fm-live-player__live-badge{opacity:.5}
.fm-live-player.is-offline .fm-live-player__progress span{width:0!important}
@media(max-width:900px){
    .fm-live-player{grid-template-columns:130px minmax(0,1fr);gap:18px}
    .fm-live-player__cover{width:130px;height:130px}
    .fm-live-player__status{grid-column:1/-1;border-left:0;border-top:1px solid var(--fm-player-border);padding:16px 0 0;grid-template-columns:repeat(3,1fr)}
}
@media(max-width:620px){
    .fm-live-player{grid-template-columns:96px minmax(0,1fr);padding:15px;gap:13px;border-radius:14px}
    .fm-live-player__cover{width:96px;height:96px}
    .fm-live-player__artist{font-size:24px}
    .fm-live-player__title{font-size:14px}
    .fm-live-player__progress-shell{margin-top:14px}
    .fm-live-player__controls{grid-column:1/-1;flex-wrap:wrap}
    .fm-live-player__quality{width:100%;margin-left:0;justify-content:center}
    .fm-live-player__quality button{flex:1}
    .fm-live-player__status{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
    .fm-live-player__status-row strong{font-size:12px}
}

/* 0.45.0.4 hero-player-final */

.hero-player-inner{
    width:100%;
    max-width:1440px;
    min-height:435px;
    margin:0 auto;
    padding:48px 54px;
    display:flex;
    align-items:center;
    position:relative;
    z-index:2;
}

.hero-player-inner .fm-live-player{
    width:100%;
    margin:0;
    grid-template-columns:210px minmax(0,1fr) 180px;
    gap:32px;
    padding:28px;
    border-radius:10px;

    background:
        linear-gradient(
            105deg,
            rgba(4,7,9,.96),
            rgba(5,9,12,.88) 58%,
            rgba(5,9,12,.72)
        );

    border:1px solid rgba(255,255,255,.09);
    box-shadow:0 24px 70px rgba(0,0,0,.28);
}

.hero-player-inner .fm-live-player__cover{
    width:210px;
    height:210px;
}

.hero-player-inner .fm-live-player__artist{
    font-size:clamp(34px,4vw,54px);
}

.hero-player-inner .fm-live-player__play{
    background:#ef2851;
    color:#fff;
}

.hero-player-inner .fm-live-player__progress span{
    background:#ef2851;
}

.hero-player-inner .fm-live-player__quality button.active{
    background:#ef2851;
    color:#fff;
}

.hero-player-inner .fm-live-player__volume input{
    accent-color:#ef2851;
}

@media(max-width:900px){
    .hero-player-inner{
        padding:30px 24px;
    }

    .hero-player-inner .fm-live-player{
        grid-template-columns:140px minmax(0,1fr);
        gap:20px;
    }

    .hero-player-inner .fm-live-player__cover{
        width:140px;
        height:140px;
    }
}

@media(max-width:620px){
    .hero-player-inner{
        padding:20px 18px;
    }

    .hero-player-inner .fm-live-player{
        grid-template-columns:96px minmax(0,1fr);
        gap:14px;
        padding:15px;
    }

    .hero-player-inner .fm-live-player__cover{
        width:96px;
        height:96px;
    }
}


/* ==========================================================
   320 FM GLOBAL PLAYER · HERO → FOOTER HANDOVER
   ========================================================== */

.fm-footer-player{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:1000;
    padding:0 18px 16px;
    pointer-events:none;
    opacity:0;
    transform:translateY(110%);
    transition:
        opacity .35s ease,
        transform .45s cubic-bezier(.22,.8,.22,1);
}

.fm-footer-player.is-visible{
    opacity:1;
    transform:translateY(0);
    pointer-events:auto;
}

.fm-footer-player__inner{
    width:min(1440px,100%);
    min-height:76px;
    margin:0 auto;
    padding:10px 14px;
    display:grid;
    grid-template-columns:auto minmax(160px,1fr) minmax(260px,1.2fr) auto;
    gap:16px;
    align-items:center;
    color:#fff;

    background:
        linear-gradient(
            110deg,
            rgba(7,10,13,.96),
            rgba(9,13,17,.92)
        );

    border:1px solid rgba(255,255,255,.10);
    border-radius:12px;

    box-shadow:
        0 14px 50px rgba(0,0,0,.46),
        inset 0 1px 0 rgba(255,255,255,.035);

    backdrop-filter:blur(22px) saturate(125%);
    -webkit-backdrop-filter:blur(22px) saturate(125%);
}

.fm-footer-player__cover{
    position:relative;
    width:54px;
    height:54px;
    flex:none;
}

.fm-footer-player__cover img{
    width:54px;
    height:54px;
    display:block;
    object-fit:cover;
    border-radius:7px;
    background:#111;
}

.fm-footer-player__live{
    position:absolute;
    left:4px;
    bottom:4px;
    display:flex;
    align-items:center;
    gap:4px;
    padding:3px 5px;
    border-radius:4px;
    background:rgba(0,0,0,.8);
    font-size:7px;
    font-weight:900;
    letter-spacing:.1em;
}

.fm-footer-player__live i,
.fm-footer-player [data-player-status] i{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#ef2851;
    display:inline-block;
    box-shadow:0 0 10px rgba(239,40,81,.7);
}

.fm-footer-player__info{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:2px;
}

.fm-footer-player__info > span{
    color:#ef2851;
    font-size:8px;
    font-weight:900;
    letter-spacing:.14em;
}

.fm-footer-player__info strong{
    font-size:14px;
    line-height:1.15;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.fm-footer-player__info small{
    color:#aeb3b8;
    font-size:11px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.fm-footer-player__transport{
    min-width:0;
    display:grid;
    grid-template-columns:42px minmax(80px,1fr) auto;
    gap:12px;
    align-items:center;
}

.fm-footer-player__play{
    width:42px;
    height:42px;
    border:0;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:#ef2851;
    color:#fff;
    cursor:pointer;
    font-size:14px;
}

.fm-footer-player__progress{
    position:relative;
    height:4px;
    overflow:hidden;
    border-radius:999px;
    background:rgba(255,255,255,.13);
}

.fm-footer-player__progress span{
    display:block;
    width:0;
    height:100%;
    background:#ef2851;
    border-radius:inherit;
    transition:width .35s linear;
}

.fm-footer-player__time{
    display:flex;
    gap:4px;
    color:#858c92;
    font-size:9px;
    font-variant-numeric:tabular-nums;
}

.fm-footer-player__right{
    display:flex;
    align-items:center;
    gap:14px;
}

.fm-footer-player [data-player-status]{
    display:flex;
    align-items:center;
    gap:5px;
    font-size:9px;
    letter-spacing:.08em;
}

.fm-footer-player [data-player-status].is-offline{
    color:#7c8185;
}

.fm-footer-player [data-player-status].is-offline i{
    background:#60666a;
    box-shadow:none;
}

.fm-footer-player__volume{
    display:flex;
    align-items:center;
    gap:7px;
}

.fm-footer-player__volume input{
    width:74px;
    accent-color:#ef2851;
}

.fm-footer-player__quality{
    display:flex;
    gap:2px;
    padding:3px;
    border-radius:999px;
    background:rgba(255,255,255,.055);
    border:1px solid rgba(255,255,255,.08);
}

.fm-footer-player__quality button{
    border:0;
    padding:6px 8px;
    border-radius:999px;
    background:transparent;
    color:#7e858b;
    font-size:8px;
    font-weight:900;
    cursor:pointer;
}

.fm-footer-player__quality button.active{
    background:#ef2851;
    color:#fff;
}

body.fm-footer-player-visible{
    padding-bottom:94px;
}


/* ==========================================================
   PAGE TRANSITION · PREMIUM BLUR + 10 BAND EQ
   ========================================================== */

.fm-page-transition{
    position:fixed;
    inset:0;
    z-index:900;
    display:grid;
    place-items:center;
    opacity:0;
    visibility:hidden;
    pointer-events:none;

    background:rgba(4,7,9,.28);

    backdrop-filter:
        blur(0)
        saturate(100%);

    -webkit-backdrop-filter:
        blur(0)
        saturate(100%);

    transition:
        opacity .24s ease,
        visibility .24s ease,
        backdrop-filter .4s ease;
}

.fm-page-transition.is-active{
    opacity:1;
    visibility:visible;
    pointer-events:auto;

    backdrop-filter:
        blur(18px)
        saturate(80%);

    -webkit-backdrop-filter:
        blur(18px)
        saturate(80%);
}

.fm-page-transition__inner{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:12px;
    padding:18px 22px;

    border:1px solid rgba(255,255,255,.08);
    border-radius:14px;

    background:
        linear-gradient(
            145deg,
            rgba(7,10,13,.88),
            rgba(9,12,15,.65)
        );

    box-shadow:0 20px 70px rgba(0,0,0,.30);
}

.fm-page-transition__inner > span{
    color:rgba(255,255,255,.55);
    font-size:9px;
    font-weight:900;
    letter-spacing:.24em;
}

.fm-transition-eq{
    height:42px;
    display:flex;
    align-items:center;
    gap:4px;
}

.fm-transition-eq i{
    display:block;
    width:4px;
    height:9px;
    border-radius:999px;
    background:#ef2851;
    box-shadow:0 0 12px rgba(239,40,81,.20);

    animation:
        fm-eq 720ms ease-in-out infinite alternate;
    transform-origin:center;
}

.fm-transition-eq i:nth-child(1){animation-delay:-.62s}
.fm-transition-eq i:nth-child(2){animation-delay:-.17s}
.fm-transition-eq i:nth-child(3){animation-delay:-.49s}
.fm-transition-eq i:nth-child(4){animation-delay:-.31s}
.fm-transition-eq i:nth-child(5){animation-delay:-.70s}
.fm-transition-eq i:nth-child(6){animation-delay:-.11s}
.fm-transition-eq i:nth-child(7){animation-delay:-.55s}
.fm-transition-eq i:nth-child(8){animation-delay:-.25s}
.fm-transition-eq i:nth-child(9){animation-delay:-.43s}
.fm-transition-eq i:nth-child(10){animation-delay:-.05s}

@keyframes fm-eq{
    0%{
        height:8px;
        opacity:.52;
    }
    45%{
        height:30px;
        opacity:1;
    }
    100%{
        height:15px;
        opacity:.72;
    }
}

@media(max-width:860px){
    .fm-footer-player{
        padding:0 8px 8px;
    }

    .fm-footer-player__inner{
        grid-template-columns:44px minmax(0,1fr) auto;
        min-height:68px;
        padding:8px;
        gap:10px;
    }

    .fm-footer-player__cover,
    .fm-footer-player__cover img{
        width:44px;
        height:44px;
    }

    .fm-footer-player__transport{
        grid-column:2 / 4;
        grid-template-columns:38px minmax(60px,1fr);
    }

    .fm-footer-player__time,
    .fm-footer-player__volume,
    .fm-footer-player [data-player-status]{
        display:none;
    }

    .fm-footer-player__right{
        justify-content:flex-end;
    }

    body.fm-footer-player-visible{
        padding-bottom:112px;
    }
}

@media(max-width:540px){
    .fm-footer-player__quality button:not(.active){
        display:none;
    }

    .fm-footer-player__quality{
        background:transparent;
        border:0;
    }

    .fm-footer-player__info strong{
        font-size:12px;
    }
}

@media(prefers-reduced-motion:reduce){
    .fm-transition-eq i{
        animation:none;
        height:18px;
    }

    .fm-footer-player,
    .fm-page-transition{
        transition:none;
    }
}

/* 320 FM page transition refinement */

.fm-page-transition{
    transition:
        opacity .32s cubic-bezier(.22,.61,.36,1),
        visibility .32s ease,
        backdrop-filter .52s ease,
        -webkit-backdrop-filter .52s ease;
}

.fm-page-transition.is-active{
    background:rgba(3,6,9,.34);

    backdrop-filter:
        blur(22px)
        saturate(72%)
        brightness(.78);

    -webkit-backdrop-filter:
        blur(22px)
        saturate(72%)
        brightness(.78);
}

.fm-page-transition__inner{
    transition:
        opacity .32s ease,
        transform .42s cubic-bezier(.22,.61,.36,1);
}

.fm-page-transition:not(.is-active) .fm-page-transition__inner{
    opacity:0;
    transform:scale(.96);
}

.fm-page-transition.is-active .fm-page-transition__inner{
    opacity:1;
    transform:scale(1);
}


/* ==========================================================
   EXTERNE PLAYER
   ========================================================== */

.fm-live-player__external{
    display:flex;
    align-items:center;
    gap:5px;
    margin-left:auto;
    min-width:0;
}

.fm-live-player__external + .fm-live-player__quality{
    margin-left:8px;
}

.fm-external-player{
    height:31px;
    min-width:31px;
    padding:0 8px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:5px;

    color:#aeb3b8;
    background:rgba(255,255,255,.045);
    border:1px solid rgba(255,255,255,.09);
    border-radius:999px;

    text-decoration:none;
    transition:
        color .2s ease,
        background .2s ease,
        border-color .2s ease,
        transform .2s ease;
}

.fm-external-player:hover{
    color:#fff;
    background:rgba(239,40,81,.14);
    border-color:rgba(239,40,81,.45);
    transform:translateY(-1px);
}

.fm-external-player__logo{
    width:15px;
    height:15px;
    display:grid;
    place-items:center;
    flex:none;
}

.fm-external-player__logo svg{
    width:15px;
    height:15px;
    fill:currentColor;
    stroke:currentColor;
    stroke-width:1.25;
}

.fm-external-player__label{
    display:none;
    font-size:8px;
    line-height:1;
    font-weight:800;
    letter-spacing:.04em;
    white-space:nowrap;
}

@media(min-width:1280px){
    .fm-external-player__label{
        display:inline;
    }
}

@media(max-width:760px){
    .fm-live-player__external{
        width:100%;
        order:8;
        margin-left:0;
        overflow-x:auto;
        padding-bottom:2px;
    }

    .fm-live-player__external + .fm-live-player__quality{
        margin-left:0;
    }
}

/* 320 FM external players · icon only */

.fm-external-player{
    width:32px;
    min-width:32px;
    height:32px;
    padding:0;
    border-radius:50%;
}

.fm-external-player__label{
    display:none !important;
}

.relaunch-player-links a{
    width:44px;
    min-width:44px;
    height:44px;
    padding:0;
    display:grid;
    place-items:center;
}

.relaunch-player-links a strong,
.relaunch-player-links a small{
    display:none !important;
}

.relaunch-player-icon{
    margin:0 !important;
}

/* ==========================================================
   320 FM · EXTERNE PLAYER · COMPACT PREMIUM ICON BAR
   ========================================================== */

/* HERO */
.fm-live-player__external{
    display:inline-flex;
    align-items:center;
    gap:5px;
    margin-left:auto;
    padding:4px;

    background:rgba(255,255,255,.045);
    border:1px solid rgba(255,255,255,.08);
    border-radius:999px;

    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
}

.fm-live-player__external + .fm-live-player__quality{
    margin-left:8px;
}

.fm-external-player{
    width:34px;
    min-width:34px;
    height:34px;
    padding:0;

    display:grid;
    place-items:center;

    color:#9da3a8;
    background:transparent;
    border:0;
    border-radius:50%;

    text-decoration:none;

    transition:
        color .18s ease,
        background .18s ease,
        transform .18s ease;
}

.fm-external-player:hover{
    color:#fff;
    background:rgba(239,40,81,.16);
    transform:translateY(-1px);
}

.fm-external-player:focus-visible{
    outline:2px solid #ef2851;
    outline-offset:2px;
}

.fm-external-player__logo,
.fm-external-player__logo svg{
    width:17px;
    height:17px;
}

.fm-external-player__logo{
    display:grid;
    place-items:center;
}

.fm-external-player__logo svg{
    fill:currentColor;
    stroke:currentColor;
    stroke-width:1.15;
}


/* ==========================================================
   RELAUNCH POPUP
   ========================================================== */

.relaunch-player-links{
    display:flex !important;
    align-items:center;
    justify-content:center;
    flex-wrap:nowrap;

    gap:5px !important;

    width:max-content;
    max-width:100%;
    margin:18px auto 4px !important;
    padding:5px !important;

    background:rgba(255,255,255,.045);
    border:1px solid rgba(255,255,255,.08);
    border-radius:999px;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035);

    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);

    overflow-x:auto;
    scrollbar-width:none;
}

.relaunch-player-links::-webkit-scrollbar{
    display:none;
}

.relaunch-player-links a{
    width:38px !important;
    min-width:38px !important;
    height:38px !important;

    padding:0 !important;
    margin:0 !important;

    display:grid !important;
    place-items:center;

    border:0 !important;
    border-radius:50% !important;

    color:#a4aab0 !important;
    background:transparent !important;

    box-shadow:none !important;
    text-decoration:none;

    transition:
        color .18s ease,
        background .18s ease,
        transform .18s ease !important;
}

.relaunch-player-links a:hover{
    color:#fff !important;
    background:rgba(239,40,81,.17) !important;
    transform:translateY(-1px);
}

.relaunch-player-links a:focus-visible{
    outline:2px solid #ef2851;
    outline-offset:2px;
}

.relaunch-player-icon{
    width:18px !important;
    height:18px !important;
    margin:0 !important;

    display:grid !important;
    place-items:center;
}

.relaunch-player-icon svg{
    width:18px !important;
    height:18px !important;

    fill:currentColor;
    stroke:currentColor;
    stroke-width:1.1;
}


/* Texte definitiv aus */
.relaunch-player-links strong,
.relaunch-player-links small,
.fm-external-player__label{
    display:none !important;
}


/* Mobile */
@media(max-width:680px){
    .fm-live-player__external{
        max-width:100%;
        overflow-x:auto;
        scrollbar-width:none;
    }

    .fm-live-player__external::-webkit-scrollbar{
        display:none;
    }

    .relaunch-player-links{
        justify-content:flex-start;
        max-width:calc(100vw - 48px);
    }
}
