   
        /* 네비게이션 바 내부 배치를 위한 스타일 추가/보완 */
        .categories {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
        }
        /* 로그인 정보 및 로그아웃 버튼을 오른쪽 끝으로 밀어내는 스타일 */
        .categories .nav-login-info {
            margin-left: auto; 
            font-size: 14px;
            display: flex;
            align-items: center;
            gap: 10px;
        }
        .categories .nav-login-info strong {
            font-weight: 500;
        }
        .categories .nav-login-info a {
            margin-left: 5px;
            text-decoration: none;
        }

        /* 🆕 NEW 표식 깜빡임 애니메이션 스타일 */
        .new-badge {
            display: inline-block;
            background-color: #dc3545;
            color: #ffffff;
            font-size: 11px;
            font-weight: bold;
            padding: 2px 6px;
            border-radius: 4px;
            margin-left: 8px;
            vertical-align: middle;
            font-family: 'Noto Sans KR', sans-serif;
            animation: blink-animation 1.2s infinite alternate;
        }

        @keyframes blink-animation {
            0% { opacity: 1.0; }
            100% { opacity: 0.2; }
        }

        /* 🎵 배경음악 컨트롤러 스타일 */
        .bgm-controller {
            position: fixed;
            bottom: 20px;
            right: 20px;
            background: rgba(255, 255, 255, 0.9);
            padding: 8px 15px;
            border-radius: 30px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            display: flex;
            align-items: center;
            gap: 10px;
            font-size: 12px;
            z-index: 9999;
            border: 1px solid #eee;
        }
        .bgm-btn {
            background: #333;
            color: #fff;
            border: none;
            padding: 4px 10px;
            border-radius: 15px;
            cursor: pointer;
            font-size: 11px;
        }
        .bgm-btn:hover {
            background: #555;
        }
    
