/* ===== SoulKeeper - Jukebox "Now Playing"-Anzeige ======================
   Blendet kurz unten links ein, wenn ein neuer Titel beginnt, dann wieder
   aus - bleibt aber im Layout (kein display:none), damit die Ein-/Ausblend-
   Animation sauber läuft. Ausnahme siehe js/jukebox.js: beim Himmel→Level1-
   Übergang an Lautstärke gekoppelt, nicht an Abspielbeginn. */

.jukebox-toast {
    position: absolute;
    left: clamp(0.8rem, calc(2.5 * var(--uw)), 1.6rem);
    bottom: clamp(0.8rem, calc(2.5 * var(--uw)), 1.6rem);
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    background: var(--panel-bg);
    border: 1px solid var(--panel-border);
    border-radius: 8px;
    padding: 0.6rem 0.9rem;
    backdrop-filter: blur(3px);
    max-width: min(calc(80 * var(--uw)), 320px);
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.5s ease, transform 0.5s ease;
    pointer-events: none;
}

.jukebox-toast.sichtbar {
    opacity: 1;
    transform: translateY(0);
}

.jukebox-icon {
    font-size: 1.1rem;
    flex: none;
}

.jukebox-info {
    font-size: clamp(0.55rem, calc(1.6 * var(--uw)), 0.7rem);
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (prefers-reduced-motion: reduce) {
    .jukebox-toast {
        transition: opacity 0.3s linear;
        transform: none;
    }
}