/* ========================================================================
   MSB Music 10.9.79 — canonical fixed-player content clearance
   Geometry only: shared by dark/light. No palette changes, no JS, no network.

   The fixed mini-player is ~64px high on desktop. On mobile it sits above the
   ~65px bottom navigation. Content therefore needs a real scrollable tail,
   otherwise the final card can be covered by fixed UI. Earlier mobile rules
   were also being overridden at <=480px, which reduced the clearance to only
   a few pixels.
   ======================================================================== */
:root {
    --msb-content-player-gap: 12px;
    --msb-desktop-fixed-ui-clearance: 62px;
    --msb-mobile-fixed-ui-clearance: calc(62px + env(safe-area-inset-bottom, 0px));
}

/* One owner for the bottom reserve: main-content. Avoid stacked padding from
   main-container and page-specific wrappers. */
.main-container {
    padding-bottom: 0 !important;
}

@media (min-width: 992px) {
    .main-content {
        padding-bottom: var(--msb-desktop-fixed-ui-clearance) !important;
    }
    html {
        scroll-padding-bottom: var(--msb-desktop-fixed-ui-clearance);
    }
}

@media (max-width: 991px) {
    .main-content,
    body.msb-artist-profile-active .main-content.msb-artist-profile-main {
        padding-bottom: var(--msb-mobile-fixed-ui-clearance) !important;
    }

    /* The tail must remain document-flow space, not a min-height trick. */
    .app-wrapper,
    .main-container {
        height: auto !important;
    }

    html {
        scroll-padding-bottom: var(--msb-mobile-fixed-ui-clearance);
    }
}

/* Very small screens use the same physical fixed UI height; do not collapse
   the reserve at <=480px. */
@media (max-width: 480px) {
    .main-content,
    body.msb-artist-profile-active .main-content.msb-artist-profile-main {
        padding-bottom: var(--msb-mobile-fixed-ui-clearance) !important;
    }
}