/* Soft drop shadow, falling to the bottom-right, under the OUTER box/pill of each block on the site. Inner
   pieces (stat tiles inside a card, buttons inside a pagination bar, etc.) deliberately don't get one - only
   the box around them does. Loaded last so it layers on the page styles; delete this file and its <link> in
   index.html to undo it completely. Boxes that already have the faint top highlight keep it (the inset part). */
:root {
    --soft-shadow: 4px 4px 10px 0 rgba(0, 0, 0, 0.4);
    --soft-shadow-hl: inset 0 1px 0 rgba(255, 255, 255, 0.1), 4px 4px 10px 0 rgba(0, 0, 0, 0.4);
}
/* Plain boxes / pills */
.nav__group,
.nav__stat,
.nav__cta,
.nav__icon.discord-icon,
.page-list .search-row,
.page-leaderboard .search-row,
.page-list .list-row:not(.active),
.page-list .level-container .level .video,
.page-list .level-container .level .records-verify-panel,
.page-list .level-container .level .records-wrap,
.guidelines-outer,
.page-leaderboard .checklist-pill,
.pagination-controls,
.level-pager {
    box-shadow: var(--soft-shadow) !important;
}
/* Boxes that already carry the top highlight */
.page-list .level-container .level h1,
.page-list .level-container .level .info-merged-box,
.page-list .meta .editors-card,
.page-list .meta .gdlist-card,
.page-list .meta .score-curve-card,
.page-changelog .changelog-card,
.page-leaderboard .player-header-box,
.page-leaderboard .record-section {
    box-shadow: var(--soft-shadow-hl) !important;
}
/* Leaderboard rows sit in a frame that clips sideways (page-turn slide) 0.6rem inside its edge, so their
   shadow is tighter - the full-size one was getting sliced off on the right, most visibly on the selected row. */
.page-leaderboard .board-row:not(.active) {
    box-shadow: 3px 3px 6px 0 rgba(0, 0, 0, 0.4) !important;
}
.page-leaderboard .board-row.active {
    box-shadow: 0 0 0 1px rgba(161, 19, 251, 0.45), 3px 3px 6px 0 rgba(0, 0, 0, 0.4) !important;
}
/* Selected rows keep their purple ring and add the shadow on top of it */
.page-list .list-row.active {
    box-shadow: 0 0 0 1px rgba(161, 19, 251, 0.45), 4px 4px 10px 0 rgba(0, 0, 0, 0.4) !important;
}
