@media (max-width: 720px) {
    .site-sidebar {
        z-index: 120 !important;
    }

    .site-sidebar-brand,
    .site-sidebar-toggle,
    .site-side-nav a {
        position: relative;
        z-index: 121 !important;
    }

    #music-card {
        left: max(10px, env(safe-area-inset-left, 0px)) !important;
        right: max(10px, env(safe-area-inset-right, 0px)) !important;
        bottom: calc(70px + env(safe-area-inset-bottom, 0px)) !important;
        width: auto !important;
        max-width: none !important;
        padding: 10px 12px !important;
        border-radius: 12px !important;
        z-index: 80 !important;
    }

    #music-card select {
        min-height: 34px;
        font-size: 12px;
    }

    #music-name {
        margin-bottom: 6px !important;
        font-size: 12px !important;
    }

    #music-controls {
        gap: 6px !important;
    }

    #music-controls button {
        min-height: 34px !important;
        height: 34px !important;
        padding: 0 8px !important;
        border-radius: 8px !important;
        font-size: 12px !important;
    }

    .music-progress {
        margin: 8px 0 4px !important;
    }

    .music-meta {
        gap: 8px !important;
        font-size: 12px !important;
    }

    #music-volume {
        max-width: 96px !important;
    }

    .asmr-player {
        left: max(10px, env(safe-area-inset-left, 0px)) !important;
        right: max(10px, env(safe-area-inset-right, 0px)) !important;
        bottom: calc(70px + env(safe-area-inset-bottom, 0px)) !important;
        width: auto !important;
        max-width: none !important;
        z-index: 80 !important;
    }

    .asmr-player-copy {
        min-width: 0;
    }

    :root.has-expanded-sidebar #music-card,
    :root.has-expanded-sidebar .asmr-player {
        opacity: 0.22;
        pointer-events: none;
    }
}

@media (max-width: 380px) {
    #music-card {
        padding: 8px 10px !important;
    }

    #music-volume {
        max-width: 76px !important;
    }
}