/* Chiptune Challenge 2026 - April Theme: Atmospheric / Moody */
/* Overcast skies, frosted glass, rain on windows, quiet introspection */
/* LIGHT THEME - overrides dark-assuming defaults throughout */

@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;600;700&family=Source+Sans+3:wght@400;600&family=Caveat:wght@400;700&display=swap');

:root {
    /* Primary Colors */
    --chiptune-primary: #5C6670;
    --chiptune-primary-hover: #4A535C;
    --chiptune-secondary: #6B8E9F;
    --chiptune-accent: #9B8AA6;

    /* Backgrounds - LIGHT theme (overcast) */
    --chiptune-bg: #D8DDE3;
    --chiptune-header-bg: rgba(107, 142, 159, 0.85);
    --chiptune-card-bg: rgba(255, 255, 255, 0.45);
    --chiptune-surface: rgba(92, 102, 112, 0.08);
    --chiptune-player-bg: rgba(216, 221, 227, 0.92);

    /* Text - DARK on light */
    --chiptune-text: #2D3436;
    --chiptune-text-secondary: #636E72;

    /* Borders & Effects */
    --chiptune-border: rgba(92, 102, 112, 0.25);
    --chiptune-glow: rgba(107, 142, 159, 0.3);
    --chiptune-secondary-glow: rgba(155, 138, 166, 0.3);

    /* Player Handle - Raindrop style */
    --chiptune-handle-size: 20px;
    --chiptune-handle-bg: linear-gradient(135deg, #6B8E9F, #9B8AA6);
    --chiptune-handle-radius: 50%;
    --chiptune-handle-icon-size: 12px;
    --chiptune-handle-icon-color: #D8DDE3;
    --chiptune-handle-icon-shadow: 0 0 4px rgba(107, 142, 159, 0.5);
    --chiptune-handle-glow: rgba(107, 142, 159, 0.4);

    /* Volume Handle */
    --chiptune-volume-handle-size: 16px;
    --chiptune-volume-handle-bg: linear-gradient(135deg, #6B8E9F, #9B8AA6);
    --chiptune-volume-handle-radius: 50%;
    --chiptune-volume-handle-icon-size: 10px;
    --chiptune-volume-handle-icon-color: #D8DDE3;
    --chiptune-volume-handle-icon-shadow: 0 0 3px rgba(107, 142, 159, 0.5);
    --chiptune-volume-handle-glow: rgba(107, 142, 159, 0.4);
}

/* =============================================================================
   BODY & BACKGROUND - Overcast sky with CSS rain
   ============================================================================= */

body.chiptune-theme-april {
    background-color: #D8DDE3;
    background-image:
        /* Semi-transparent overlay for text readability */
        linear-gradient(
            180deg,
            rgba(138, 149, 159, 0.7) 0%,
            rgba(184, 194, 204, 0.5) 30%,
            rgba(216, 221, 227, 0.6) 60%,
            rgba(196, 204, 212, 0.7) 100%
        ),
        /* Main atmospheric background image */
        url('/static/sites/zimventures/chiptune/images/april/april-rain-bg.jpg');
    background-size: auto, cover;
    background-position: center, center;
    background-repeat: no-repeat, no-repeat;
    background-attachment: scroll, fixed;
    color: #2D3436;
}

/* CSS-only rain effect */
body.chiptune-theme-april::before {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        repeating-linear-gradient(
            105deg,
            transparent,
            transparent 98px,
            rgba(107, 142, 159, 0.07) 98px,
            rgba(107, 142, 159, 0.11) 100px
        ),
        repeating-linear-gradient(
            100deg,
            transparent,
            transparent 150px,
            rgba(107, 142, 159, 0.05) 150px,
            rgba(107, 142, 159, 0.08) 152px
        ),
        repeating-linear-gradient(
            108deg,
            transparent,
            transparent 200px,
            rgba(155, 138, 166, 0.04) 200px,
            rgba(155, 138, 166, 0.06) 202px
        );
    animation: rain-fall 0.8s linear infinite;
    will-change: transform;
}

@keyframes rain-fall {
    0% { transform: translateY(-80px); }
    100% { transform: translateY(80px); }
}

/* Make app container transparent so body background shows */
body.chiptune-theme-april .chiptune-app {
    background: transparent;
    color: #2D3436;
}

/* =============================================================================
   HEADER - Storm gradient with drifting mist
   ============================================================================= */

.chiptune-theme-april .chiptune-header {
    background: linear-gradient(180deg, #6B7B86 0%, #8A959F 40%, #B8C2CC 100%);
    border-bottom: 1px solid rgba(107, 142, 159, 0.4);
    position: relative;
    overflow: hidden;
}

/* Drifting mist via pseudo-element */
.chiptune-theme-april .chiptune-header::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 180px 50px at 15% 60%, rgba(255, 255, 255, 0.15) 0%, transparent 70%),
        radial-gradient(ellipse 120px 40px at 40% 40%, rgba(255, 255, 255, 0.1) 0%, transparent 70%),
        radial-gradient(ellipse 200px 45px at 70% 55%, rgba(255, 255, 255, 0.12) 0%, transparent 70%),
        radial-gradient(ellipse 140px 35px at 90% 35%, rgba(255, 255, 255, 0.08) 0%, transparent 70%);
    animation: mist-drift 90s linear infinite;
    pointer-events: none;
    z-index: 0;
}

.chiptune-theme-april .chiptune-header > * {
    position: relative;
    z-index: 1;
}

@keyframes mist-drift {
    0% { transform: translateX(0); opacity: 0.6; }
    25% { opacity: 0.8; }
    50% { transform: translateX(150px); opacity: 0.5; }
    75% { opacity: 0.7; }
    100% { transform: translateX(0); opacity: 0.6; }
}

/* =============================================================================
   LIGHT THEME TEXT OVERRIDES
   These override hardcoded white text from base.css, player.css, yearly.css
   ============================================================================= */

/* --- General text --- */
.chiptune-theme-april,
.chiptune-theme-april .chiptune-app,
.chiptune-theme-april .chiptune-content,
.chiptune-theme-april p,
.chiptune-theme-april span,
.chiptune-theme-april li {
    color: #2D3436;
}

/* --- Logo & Navigation --- */
.chiptune-theme-april .chiptune-logo .logo-text {
    color: #D8DDE3;
    text-shadow:
        0 2px 10px rgba(155, 138, 166, 0.3);
    font-family: 'Quicksand', 'Arial', sans-serif;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: 2px;
}

.chiptune-theme-april .chiptune-logo .logo-icon {
    color: #D8DDE3;
}

.chiptune-theme-april .chiptune-nav a,
.chiptune-theme-april .chiptune-nav .nav-link {
    color: #D8DDE3;
}

.chiptune-theme-april .chiptune-nav a:hover,
.chiptune-theme-april .chiptune-nav .nav-link:hover {
    color: #fff;
}

.chiptune-theme-april .chiptune-nav a.active,
.chiptune-theme-april .chiptune-nav .nav-link.active {
    color: #fff;
    border-bottom-color: #9B8AA6;
}

/* --- Auth & Profile --- */
.chiptune-theme-april .auth-link {
    color: #D8DDE3;
}

.chiptune-theme-april .profile-menu {
    background: rgba(216, 221, 227, 0.95);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(107, 142, 159, 0.3);
}

.chiptune-theme-april .profile-menu-item {
    color: #2D3436;
}

.chiptune-theme-april .profile-menu-item:hover {
    background: rgba(107, 142, 159, 0.15);
    color: #5C6670;
}

/* --- Page Headers --- */
.chiptune-theme-april .page-header h1,
.chiptune-theme-april .page-header h2 {
    color: #2D3436;
    text-shadow: 0 2px 10px rgba(155, 138, 166, 0.2);
    font-family: 'Quicksand', 'Arial', sans-serif;
    letter-spacing: 1px;
}

.chiptune-theme-april .page-header p,
.chiptune-theme-april .page-header .subtitle {
    color: #636E72;
}

/* --- Song Cards - Frosted Glass --- */
.chiptune-theme-april .song-card {
    background: rgba(255, 255, 255, 0.45);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(45, 52, 54, 0.08);
    position: relative;
}

.chiptune-theme-april .song-card .song-title,
.chiptune-theme-april .song-card .song-name {
    color: #2D3436;
    font-family: 'Source Sans 3', 'Helvetica', sans-serif;
}

.chiptune-theme-april .song-card .song-artist,
.chiptune-theme-april .song-card .song-date,
.chiptune-theme-april .song-card .song-duration-text,
.chiptune-theme-april .song-card .song-meta {
    color: #636E72;
}

.chiptune-theme-april .song-card:hover {
    background: rgba(255, 255, 255, 0.6);
    border-color: rgba(107, 142, 159, 0.4);
    box-shadow: 0 6px 24px rgba(45, 52, 54, 0.12);
    transform: translateY(-2px);
}

.chiptune-theme-april .song-card.is-playing {
    border-color: rgba(107, 142, 159, 0.6);
    box-shadow: 0 0 30px rgba(107, 142, 159, 0.25);
    animation: rainPlayPulse 3s ease-in-out infinite;
}

@keyframes rainPlayPulse {
    0%, 100% {
        box-shadow: 0 0 20px rgba(107, 142, 159, 0.15);
    }
    50% {
        box-shadow: 0 0 35px rgba(155, 138, 166, 0.25);
    }
}

/* --- Song Cover & Play Button --- */
.chiptune-theme-april .song-cover .play-btn {
    background: rgba(92, 102, 112, 0.85);
    color: #D8DDE3;
}

.chiptune-theme-april .song-cover .song-duration {
    background: rgba(45, 52, 54, 0.75);
    color: #D8DDE3;
}

/* --- Vote & Like Buttons --- */
.chiptune-theme-april .vote-btn,
.chiptune-theme-april .song-card .vote-btn {
    background: rgba(107, 142, 159, 0.85);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(107, 142, 159, 0.4);
    color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(107, 142, 159, 0.2);
    transition: all 0.3s ease;
}

.chiptune-theme-april .vote-btn:hover:not(:disabled),
.chiptune-theme-april .song-card .vote-btn:hover:not(:disabled) {
    background: rgba(107, 142, 159, 1.0);
    transform: scale(1.02);
    box-shadow: 0 4px 12px rgba(107, 142, 159, 0.3);
    color: #fff;
}

.chiptune-theme-april .vote-btn.voted,
.chiptune-theme-april .song-card .vote-btn.voted {
    background: linear-gradient(135deg, #9B8AA6, #B8A5C4);
    border-color: #9B8AA6;
    color: #fff;
    box-shadow: 0 2px 8px rgba(155, 138, 166, 0.3);
}

/* Like button */
.chiptune-theme-april .like-btn {
    color: #636E72;
}

.chiptune-theme-april .like-btn.liked {
    color: #9B8AA6;
}

.chiptune-theme-april .like-btn.liked .like-icon {
    animation: dropletBounce 0.6s ease;
}

@keyframes dropletBounce {
    0% { transform: scale(1); }
    30% { transform: scale(1.15); }
    50% { transform: scale(1); }
    70% { transform: scale(1.08); }
    100% { transform: scale(1); }
}

/* --- Vote Count Badge --- */
.chiptune-theme-april .vote-count-badge {
    background: rgba(92, 102, 112, 0.85);
    color: #D8DDE3;
}

/* --- Vote Button Overlay --- */
.chiptune-theme-april .vote-btn-overlay.voted {
    color: #D8DDE3;
}

/* --- Day & Card Badges --- */
.chiptune-theme-april .day-badge {
    background: rgba(92, 102, 112, 0.85);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    color: #D8DDE3;
    border-radius: 6px;
}

.chiptune-theme-april .card-badge-weekly {
    background: linear-gradient(135deg, #6B8E9F, #7FA8B9);
    color: #fff;
}

.chiptune-theme-april .card-badge-monthly {
    background: linear-gradient(135deg, #BDC3C7, #9B8AA6);
    color: #2D3436;
}

.chiptune-theme-april .today-badge {
    background: linear-gradient(135deg, #6B8E9F, #9B8AA6);
    color: #fff;
}

/* --- Player Bar - Glassmorphism --- */
.chiptune-theme-april .chiptune-player {
    background: rgba(196, 204, 212, 0.9);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-top: 1px solid rgba(107, 142, 159, 0.3);
}

.chiptune-theme-april .chiptune-player,
.chiptune-theme-april .player-info,
.chiptune-theme-april .player-song-title,
.chiptune-theme-april .player-song-artist {
    color: #2D3436;
}

.chiptune-theme-april .player-time,
.chiptune-theme-april .player-duration {
    color: #636E72;
}

.chiptune-theme-april .player-btn {
    color: #2D3436;
}

.chiptune-theme-april .player-btn:hover {
    color: #5C6670;
}

.chiptune-theme-april .player-btn.play-pause {
    background: linear-gradient(135deg, #6B8E9F, #5C6670);
    color: #D8DDE3;
    box-shadow: 0 0 12px rgba(107, 142, 159, 0.3);
}

/* Ripple-style progress bar */
.chiptune-theme-april .player-progress-fill {
    background: linear-gradient(90deg, #6B8E9F, #9B8AA6);
}

.chiptune-theme-april .player-progress-bar {
    background: rgba(138, 149, 159, 0.25);
    border-radius: 3px;
}

/* Stats panel */
.chiptune-theme-april .stats-panel {
    background: rgba(255, 255, 255, 0.45);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    color: #2D3436;
}

/* --- Week Navigation --- */
.chiptune-theme-april .week-nav {
    background: linear-gradient(
        90deg,
        rgba(92, 102, 112, 0.06),
        rgba(107, 142, 159, 0.06),
        rgba(155, 138, 166, 0.06)
    );
    border-bottom: 1px solid rgba(92, 102, 112, 0.15);
}

.chiptune-theme-april .week-nav a,
.chiptune-theme-april .week-nav span {
    color: #2D3436;
}

.chiptune-theme-april .week-nav a:hover {
    color: #5C6670;
}

/* Week header title — soft atmospheric style */
.chiptune-theme-april .week-nav-current .week-label {
    color: #2D3436;
    font-family: 'Quicksand', 'Arial', sans-serif;
    font-size: 1.4rem;
    font-weight: 700;
    text-shadow: 0 2px 8px rgba(155, 138, 166, 0.2);
    letter-spacing: 1px;
    animation: none;
}

.chiptune-theme-april .week-nav-current .week-year {
    color: #9B8AA6;
    font-weight: 600;
}

.chiptune-theme-april .week-nav-current .week-dates {
    color: #636E72;
    font-size: 0.85rem;
}

.chiptune-theme-april .week-nav-theme-icon {
    filter: none;
}

.chiptune-theme-april .week-nav-theme-name {
    color: #636E72;
}

.chiptune-theme-april .week-nav-btn {
    color: #636E72;
}

.chiptune-theme-april .week-nav-btn:hover:not(.disabled) {
    background: rgba(107, 142, 159, 0.1);
    color: #5C6670;
}

/* --- Theme Banner --- */
.chiptune-theme-april .theme-banner {
    background: rgba(255, 255, 255, 0.35);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(107, 142, 159, 0.2);
    border-radius: 12px;
}

.chiptune-theme-april .theme-banner::before {
    display: none;
}

.chiptune-theme-april .theme-banner .theme-icon {
    filter: none;
}

.chiptune-theme-april .theme-banner .theme-name {
    color: #2D3436;
    text-shadow: 0 2px 8px rgba(155, 138, 166, 0.2);
}

.chiptune-theme-april .theme-banner .theme-tagline {
    color: #636E72;
    font-family: 'Caveat', cursive;
    font-size: 1.1rem;
}

.chiptune-theme-april .theme-banner .theme-description {
    color: #636E72;
}

.chiptune-theme-april .theme-banner .theme-link {
    color: #636E72;
    border-color: rgba(107, 142, 159, 0.3);
}

.chiptune-theme-april .theme-banner .theme-link:hover {
    color: #5C6670;
    border-color: #6B8E9F;
    box-shadow: none;
}

/* --- Vote Banner - Frosted Glass --- */
.chiptune-theme-april .vote-banner {
    background: rgba(107, 142, 159, 0.75);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border: 1px solid rgba(107, 142, 159, 0.2);
    border-radius: 16px;
}

.chiptune-theme-april .vote-banner-content {
    color: #fff;
}

/* --- Voting Open Banner --- */
.chiptune-theme-april .voting-open-banner {
    background: rgba(255, 255, 255, 0.4);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(107, 142, 159, 0.3);
    border-radius: 12px;
}

.chiptune-theme-april .voting-open-banner .vote-btn {
    color: #fff;
}

/* --- Trophy Badges --- */
.chiptune-theme-april .trophy-badge {
    background: rgba(189, 195, 199, 0.3);
    border: 1px solid rgba(189, 195, 199, 0.5);
    border-radius: 8px;
    padding: 0.5rem 1rem;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #2D3436;
}

/* --- Winner Announcements --- */
.chiptune-theme-april .winner-banner,
.chiptune-theme-april .month-winner-banner {
    background: rgba(255, 255, 255, 0.45);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(189, 195, 199, 0.5);
    border-radius: 12px;
    padding: 1.5rem;
    text-align: center;
    margin-bottom: 2rem;
}

.chiptune-theme-april .winner-banner .winner-text strong {
    color: #5C6670;
}

.chiptune-theme-april .winner-icon {
    font-size: 2rem;
}

.chiptune-theme-april .winner-info h3 {
    color: #2D3436;
}

/* --- Stat Cards & Stats Page --- */
.chiptune-theme-april .stats-overview {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

.chiptune-theme-april .stat-card {
    background: rgba(255, 255, 255, 0.45);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 12px;
    padding: 1.5rem;
    text-align: center;
}

.chiptune-theme-april .stat-card h3 {
    font-family: 'Quicksand', 'Arial', sans-serif;
    color: #2D3436;
}

.chiptune-theme-april .stat-card .stat-icon {
    font-size: 1.5rem;
    display: block;
    margin-bottom: 0.5rem;
}

.chiptune-theme-april .stat-card .stat-value {
    font-size: 1.5rem;
    color: #5C6670;
    display: block;
    font-family: 'Press Start 2P', monospace;
}

.chiptune-theme-april .stat-card .stat-label {
    font-size: 0.75rem;
    color: #636E72;
}

/* --- Hall of Fame Cards --- */
.chiptune-theme-april .hof-card {
    background: rgba(255, 255, 255, 0.45);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.3s;
}

.chiptune-theme-april .hof-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 6px 24px rgba(45, 52, 54, 0.12);
}

.chiptune-theme-april .hof-card.year-card {
    border-color: rgba(189, 195, 199, 0.6);
    box-shadow: 0 0 15px rgba(189, 195, 199, 0.2);
}

.chiptune-theme-april .hof-card.month-card {
    border-color: rgba(107, 142, 159, 0.4);
}

.chiptune-theme-april .hof-card-badge.week {
    background: #5C6670;
    color: #D8DDE3;
}

.chiptune-theme-april .hof-label.purple {
    background: #5C6670;
    color: #D8DDE3;
}

.chiptune-theme-april .hof-play-btn {
    background: rgba(92, 102, 112, 0.85);
    color: #D8DDE3;
}

.chiptune-theme-april .hof-btn {
    background: linear-gradient(135deg, #5C6670, #6B8E9F);
    color: #D8DDE3;
}

/* --- Theme Cards --- */
.chiptune-theme-april .theme-card {
    background: rgba(255, 255, 255, 0.45);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 12px;
}

.chiptune-theme-april .theme-card.locked {
    background: rgba(196, 204, 212, 0.4);
}

.chiptune-theme-april .theme-card-header .current-badge {
    background: #6B8E9F;
    color: #fff;
}

/* --- Liked Songs --- */
.chiptune-theme-april .liked-song-play:hover {
    color: #6B8E9F;
}

/* --- Placeholder/Mystery Cards --- */
.chiptune-theme-april .placeholder-static {
    background: rgba(196, 204, 212, 0.5);
}

.chiptune-theme-april .question-mark {
    color: #8A959F;
}

/* --- Current Vote Notice --- */
.chiptune-theme-april .current-vote-notice strong {
    color: #5C6670;
}

/* --- Bracket Components --- */
.chiptune-theme-april .bracket-slot {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(107, 142, 159, 0.2);
    border-radius: 8px;
}

.chiptune-theme-april .bracket-vote-btn:hover:not(:disabled) {
    background: #6B8E9F;
    color: #fff;
}

.chiptune-theme-april .bracket-vote-btn.voted {
    background: rgba(92, 102, 112, 0.85) !important;
    color: #D8DDE3;
}

.chiptune-theme-april .bracket-play-btn {
    background: rgba(92, 102, 112, 0.85);
    color: #D8DDE3;
}

.chiptune-theme-april .bracket-login-link:hover {
    color: #6B8E9F;
}

.chiptune-theme-april .bracket-status.voting p {
    color: #2D3436;
}

.chiptune-theme-april .slot-title {
    color: #2D3436;
}

/* --- Champion & Yearly Cards --- */
.chiptune-theme-april .champion-card {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(107, 142, 159, 0.25);
    border-radius: 12px;
}

.chiptune-theme-april .champion-card-title,
.chiptune-theme-april .champion-info h3 {
    color: #2D3436;
}

.chiptune-theme-april .champion-play-btn {
    background: rgba(92, 102, 112, 0.85);
    color: #D8DDE3;
}

.chiptune-theme-april .past-champion-badge {
    background: #5C6670;
    color: #D8DDE3;
}

/* --- Song Navigation --- */
.chiptune-theme-april .song-nav-btn {
    color: #636E72;
}

.chiptune-theme-april .song-nav-btn:hover:not(.disabled) {
    color: #5C6670;
}

/* --- Song Detail Page --- */
.chiptune-theme-april .play-btn-large {
    background: linear-gradient(135deg, #6B8E9F, #5C6670);
    color: #D8DDE3;
}

.chiptune-theme-april .like-btn-large.liked {
    color: #9B8AA6;
}

/* --- Vote Badge Float --- */
.chiptune-theme-april .vote-badge-float {
    background: #5C6670;
    color: #D8DDE3;
}

/* --- Week Check Boxes --- */
.chiptune-theme-april .week-check {
    background: rgba(107, 142, 159, 0.1);
    border: 1px solid rgba(107, 142, 159, 0.2);
    border-radius: 6px;
}

/* --- Toast Messages --- */
.chiptune-theme-april .chiptune-toast {
    background: rgba(92, 102, 112, 0.9);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    color: #D8DDE3;
}

/* --- Modal --- */
.chiptune-theme-april .modal-close-btn {
    background: rgba(45, 52, 54, 0.5);
    color: #D8DDE3;
}

.chiptune-theme-april .modal-theme-name {
    color: #5C6670;
    font-family: 'Quicksand', 'Arial', sans-serif;
}

/* --- Discord Elements (keep dark for brand consistency) --- */
.chiptune-theme-april .discord-login-btn {
    color: white;
}

.chiptune-theme-april .discord-floating-badge {
    color: white;
}

.chiptune-theme-april .discord-invite-header h2 {
    color: #fff;
}

.chiptune-theme-april .discord-invite-join {
    color: white;
}

/* --- Pause Menu - Frosted glass style --- */
.chiptune-theme-april .pause-menu-content {
    background: rgba(216, 221, 227, 0.92);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-color: rgba(107, 142, 159, 0.3);
    border-radius: 16px;
}

.chiptune-theme-april .pause-menu-content::before {
    border-color: rgba(107, 142, 159, 0.2);
}

.chiptune-theme-april .pause-menu-scanlines {
    display: none;
}

.chiptune-theme-april .pause-menu-header {
    border-bottom-color: rgba(107, 142, 159, 0.2);
}

.chiptune-theme-april .pause-menu-title {
    color: #2D3436;
    text-shadow: none;
    font-family: 'Quicksand', 'Arial', sans-serif;
}

.chiptune-theme-april .pause-menu-subtitle {
    color: #636E72;
    font-family: 'Caveat', cursive;
}

.chiptune-theme-april .pause-menu-item {
    color: #2D3436;
    border-bottom-color: rgba(107, 142, 159, 0.1);
}

.chiptune-theme-april .pause-menu-item:hover {
    background: rgba(107, 142, 159, 0.1);
    color: #5C6670;
}

.chiptune-theme-april .pause-menu-item.active {
    color: #5C6670;
    background: rgba(107, 142, 159, 0.1);
}

.chiptune-theme-april .pause-menu-cursor {
    color: #9B8AA6;
}

.chiptune-theme-april .pause-menu-item-detail {
    border-bottom-color: rgba(107, 142, 159, 0.1);
}

.chiptune-theme-april .pause-menu-item-detail p {
    color: #636E72;
}

.chiptune-theme-april .pause-menu-item-detail p strong {
    color: #2D3436;
}

.chiptune-theme-april .pause-menu-cta {
    background: #6B8E9F;
    color: #fff;
}

.chiptune-theme-april .pause-menu-resume-btn {
    color: #636E72;
}

.chiptune-theme-april .pause-menu-resume-btn:hover {
    color: #2D3436;
}

/* --- New Here Badge --- */
.chiptune-theme-april .newhere-floating-badge:hover {
    color: #6B8E9F;
}

/* =============================================================================
   YEARLY BRACKET OVERRIDES
   ============================================================================= */

.chiptune-theme-april .phase-step {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(107, 142, 159, 0.2);
    border-radius: 8px;
}

.chiptune-theme-april .phase-dot {
    background: #6B8E9F;
}

.chiptune-theme-april .champion-play-overlay {
    background: rgba(92, 102, 112, 0.7);
}

.chiptune-theme-april .entry-play-btn {
    background: rgba(92, 102, 112, 0.8);
    color: #D8DDE3;
}

.chiptune-theme-april .champion-title {
    color: #2D3436;
}

.chiptune-theme-april .champion-stats .stat-value {
    color: #5C6670;
}

.chiptune-theme-april .wildcard-entry .song-name {
    color: #2D3436;
}

.chiptune-theme-april .champion-card .song-title {
    color: #2D3436;
}

.chiptune-theme-april .group-box {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(107, 142, 159, 0.2);
    border-radius: 10px;
}

.chiptune-theme-april .group-entry {
    background: rgba(255, 255, 255, 0.4);
    border: 1px solid rgba(107, 142, 159, 0.15);
    border-radius: 8px;
}

.chiptune-theme-april .group-entry .song-name {
    color: #2D3436;
}

.chiptune-theme-april .vote-counter .vote-pip {
    background: rgba(107, 142, 159, 0.2);
}

.chiptune-theme-april .yearly-matchup {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(107, 142, 159, 0.2);
    border-radius: 10px;
}

.chiptune-theme-april .yearly-bracket-slot {
    background: rgba(255, 255, 255, 0.45);
    border: 1px solid rgba(107, 142, 159, 0.15);
    border-radius: 8px;
}

.chiptune-theme-april .yearly-bracket-slot.empty {
    background: rgba(196, 204, 212, 0.3);
}

.chiptune-theme-april .yearly-bracket-slot .slot-title {
    color: #2D3436;
}

.chiptune-theme-april .yearly-bracket-play-btn {
    background: rgba(92, 102, 112, 0.8);
    color: #D8DDE3;
}

.chiptune-theme-april .yearly-bracket-vote-btn.voted {
    background: rgba(92, 102, 112, 0.85);
    color: #D8DDE3;
}

.chiptune-theme-april .yearly-champ-play {
    background: rgba(92, 102, 112, 0.8);
    color: #D8DDE3;
}

/* =============================================================================
   PIXEL BACKGROUND - No hills for April, rain overlay instead
   ============================================================================= */

.chiptune-theme-april .pixel-bg {
    background: none;
}

/* =============================================================================
   NO CRT SCANLINES for April (override January's body::after)
   ============================================================================= */

.chiptune-theme-april::after {
    display: none;
}

/* =============================================================================
   PLAY BUTTON
   ============================================================================= */

.chiptune-theme-april .player-btn.play-pause {
    background: linear-gradient(135deg, #6B8E9F, #5C6670);
    box-shadow: 0 0 15px rgba(107, 142, 159, 0.3);
}

/* =============================================================================
   FONT OVERRIDES - Atmospheric feel
   ============================================================================= */

.chiptune-theme-april h1,
.chiptune-theme-april h2,
.chiptune-theme-april h3 {
    font-family: 'Quicksand', 'Arial', sans-serif;
}

.chiptune-theme-april .song-card .song-title,
.chiptune-theme-april .song-card .song-name,
.chiptune-theme-april .player-song-title {
    font-family: 'Source Sans 3', 'Helvetica', sans-serif;
}

/* =============================================================================
   SCROLLBAR
   ============================================================================= */

.chiptune-theme-april ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.chiptune-theme-april ::-webkit-scrollbar-track {
    background: #C4CCD4;
}

.chiptune-theme-april ::-webkit-scrollbar-thumb {
    background: #8A959F;
    border-radius: 4px;
}

.chiptune-theme-april ::-webkit-scrollbar-thumb:hover {
    background: #6B8E9F;
}

.chiptune-theme-april .likes-list::-webkit-scrollbar-track {
    background: rgba(196, 204, 212, 0.5);
}

/* =============================================================================
   SELECTION COLOR
   ============================================================================= */

.chiptune-theme-april ::selection {
    background: #6B8E9F;
    color: #fff;
}

/* =============================================================================
   VOTER AVATAR
   ============================================================================= */

.chiptune-theme-april .voter-avatar-placeholder {
    background: #5C6670;
    color: #D8DDE3;
}

/* =============================================================================
   LINKS
   ============================================================================= */

.chiptune-theme-april a {
    color: #6B8E9F;
}

.chiptune-theme-april a:hover {
    color: #5C6670;
}

/* =============================================================================
   FOOTER
   ============================================================================= */

.chiptune-theme-april .chiptune-footer {
    background: rgba(196, 204, 212, 0.6);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-top: 1px solid rgba(107, 142, 159, 0.2);
}

.chiptune-theme-april .chiptune-footer,
.chiptune-theme-april .chiptune-footer a,
.chiptune-theme-april .chiptune-footer p,
.chiptune-theme-april .chiptune-footer span {
    color: #636E72;
}

.chiptune-theme-april .chiptune-footer a:hover {
    color: #5C6670;
}

/* =============================================================================
   ACCESSIBILITY - Reduced motion
   ============================================================================= */

@media (prefers-reduced-motion: reduce) {
    body.chiptune-theme-april::before {
        animation: none;
    }

    .chiptune-theme-april .chiptune-header::after {
        animation: none;
    }

    .chiptune-theme-april .song-card.is-playing {
        animation: none;
    }
}

/* =============================================================================
   BACKDROP-FILTER FALLBACK
   ============================================================================= */

@supports not (backdrop-filter: blur(1px)) {
    .chiptune-theme-april .song-card {
        background: rgba(232, 234, 237, 0.92);
    }

    .chiptune-theme-april .chiptune-player {
        background: rgba(196, 204, 212, 0.97);
    }

    .chiptune-theme-april .profile-menu {
        background: rgba(216, 221, 227, 0.98);
    }

    .chiptune-theme-april .pause-menu-content {
        background: rgba(216, 221, 227, 0.98);
    }

    .chiptune-theme-april .vote-banner {
        background: rgba(107, 142, 159, 0.92);
    }

    .chiptune-theme-april .stat-card,
    .chiptune-theme-april .hof-card,
    .chiptune-theme-april .bracket-slot,
    .chiptune-theme-april .champion-card,
    .chiptune-theme-april .group-box,
    .chiptune-theme-april .yearly-matchup {
        background: rgba(232, 234, 237, 0.92);
    }
}