更新前端静态网页获取方式，放弃使用后端获取api

frontend/public/60sapi/热搜榜单/Hacker News 榜单/css/background.css

@@ -0,0 +1,106 @@
+/* 彩虹背景相关样式 */
+body {
+    background: linear-gradient(
+        135deg, 
+        #ff6b6b 0%, 
+        #4ecdc4 12.5%, 
+        #45b7d1 25%, 
+        #96ceb4 37.5%, 
+        #feca57 50%, 
+        #ff9ff3 62.5%, 
+        #54a0ff 75%, 
+        #5f27cd 87.5%, 
+        #00d2d3 100%
+    );
+    background-size: 400% 400%;
+    animation: rainbowGradient 15s ease infinite;
+    background-attachment: fixed;
+    min-height: 100vh;
+    position: relative;
+}
+
+@keyframes rainbowGradient {
+    0% {
+        background-position: 0% 50%;
+    }
+    25% {
+        background-position: 100% 50%;
+    }
+    50% {
+        background-position: 100% 100%;
+    }
+    75% {
+        background-position: 0% 100%;
+    }
+    100% {
+        background-position: 0% 50%;
+    }
+}
+
+/* 彩虹装饰层 */
+body::before {
+    content: '';
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: 
+        radial-gradient(circle at 20% 20%, rgba(255, 107, 107, 0.15) 0%, transparent 50%),
+        radial-gradient(circle at 80% 80%, rgba(78, 205, 196, 0.15) 0%, transparent 50%),
+        radial-gradient(circle at 40% 80%, rgba(69, 183, 209, 0.12) 0%, transparent 40%),
+        radial-gradient(circle at 60% 20%, rgba(150, 206, 180, 0.12) 0%, transparent 40%),
+        radial-gradient(circle at 80% 40%, rgba(254, 202, 87, 0.1) 0%, transparent 35%);
+    pointer-events: none;
+    z-index: -1;
+    animation: float 20s ease-in-out infinite alternate;
+}
+
+/* 彩虹粒子效果 */
+body::after {
+    content: '';
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-image: 
+        radial-gradient(circle at 10% 10%, rgba(255, 107, 107, 0.8) 2px, transparent 2px),
+        radial-gradient(circle at 30% 20%, rgba(78, 205, 196, 0.8) 1.5px, transparent 1.5px),
+        radial-gradient(circle at 50% 30%, rgba(69, 183, 209, 0.8) 1px, transparent 1px),
+        radial-gradient(circle at 70% 40%, rgba(150, 206, 180, 0.8) 2px, transparent 2px),
+        radial-gradient(circle at 90% 50%, rgba(254, 202, 87, 0.8) 1.5px, transparent 1.5px),
+        radial-gradient(circle at 20% 60%, rgba(255, 159, 243, 0.8) 1px, transparent 1px),
+        radial-gradient(circle at 40% 70%, rgba(84, 160, 255, 0.8) 2px, transparent 2px),
+        radial-gradient(circle at 60% 80%, rgba(95, 39, 205, 0.8) 1.5px, transparent 1.5px),
+        radial-gradient(circle at 80% 90%, rgba(0, 210, 211, 0.8) 1px, transparent 1px);
+    background-size: 200px 200px, 250px 250px, 180px 180px, 300px 300px, 220px 220px, 160px 160px, 280px 280px, 240px 240px, 200px 200px;
+    animation: sparkle 25s linear infinite;
+    pointer-events: none;
+    z-index: -1;
+    opacity: 0.6;
+}
+
+@keyframes float {
+    0% {
+        transform: translateY(0px) rotate(0deg);
+    }
+    100% {
+        transform: translateY(-15px) rotate(2deg);
+    }
+}
+
+@keyframes sparkle {
+    0%, 100% {
+        transform: translateX(0) translateY(0) scale(1);
+    }
+    25% {
+        transform: translateX(-10px) translateY(-5px) scale(1.1);
+    }
+    50% {
+        transform: translateX(10px) translateY(-10px) scale(0.9);
+    }
+    75% {
+        transform: translateX(-5px) translateY(-15px) scale(1.05);
+    }
+}

frontend/public/60sapi/热搜榜单/Hacker News 榜单/css/style.css

@@ -0,0 +1,863 @@
+/* 背景样式 */
+.background-container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: -1;
+    overflow: hidden;
+    background-color: #f8f9fa;
+}
+
+.modern-gradient {
+    position: absolute;
+    top: -50%;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: linear-gradient(
+        135deg,
+        rgba(64, 169, 255, 0.4) 0%,
+        rgba(120, 192, 255, 0.3) 25%,
+        rgba(255, 175, 64, 0.2) 50%,
+        rgba(255, 140, 50, 0.3) 75%,
+        rgba(255, 122, 69, 0.4) 100%
+    );
+    animation: gradient-flow 20s ease-in-out infinite;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+.modern-gradient::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: radial-gradient(
+        circle at 30% 70%,
+        rgba(64, 169, 255, 0.5) 0%,
+        transparent 50%
+    ), radial-gradient(
+        circle at 70% 30%,
+        rgba(255, 140, 50, 0.4) 0%,
+        transparent 50%
+    );
+    animation: pulse-effect 15s ease-in-out infinite alternate;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+@keyframes gradient-flow {
+    0%, 100% {
+        transform: rotate(0deg) scale(1);
+        opacity: 0.8;
+    }
+    25% {
+        transform: rotate(90deg) scale(1.1);
+        opacity: 0.6;
+    }
+    50% {
+        transform: rotate(180deg) scale(0.9);
+        opacity: 0.9;
+    }
+    75% {
+        transform: rotate(270deg) scale(1.05);
+        opacity: 0.7;
+    }
+}
+
+@keyframes pulse-effect {
+    0% {
+        transform: scale(1) rotate(0deg);
+        opacity: 0.5;
+    }
+    50% {
+        transform: scale(1.2) rotate(180deg);
+        opacity: 0.8;
+    }
+    100% {
+        transform: scale(1) rotate(360deg);
+        opacity: 0.6;
+    }
+}
+
+/* 主样式 */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+    font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
+    color: #333;
+    background-color: #f8f9fa;
+    position: relative;
+    min-height: 100vh;
+}
+
+.container {
+    max-width: 800px;
+    margin: 0 auto;
+    padding: 24px;
+    position: relative;
+    z-index: 1;
+    background-color: rgba(255, 255, 255, 0.85);
+    border-radius: 16px;
+    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
+    backdrop-filter: blur(10px);
+}
+
+header, .header {
+    text-align: center;
+    margin-bottom: 28px;
+    padding-bottom: 20px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
+}
+
+.header-icon {
+    font-size: 3rem;
+    margin-bottom: 10px;
+    display: block;
+}
+
+header h1, .title {
+    background: linear-gradient(135deg, #4096ff, #ff7a45);
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+    margin-bottom: 14px;
+    font-size: 2.4rem;
+    font-weight: 700;
+    letter-spacing: -0.5px;
+}
+
+.subtitle {
+    color: #666;
+    font-size: 1.1rem;
+    margin-bottom: 20px;
+    font-weight: 400;
+}
+
+.tab-container {
+    display: flex;
+    justify-content: center;
+    gap: 12px;
+    margin-bottom: 20px;
+    flex-wrap: wrap;
+}
+
+.tab-btn {
+    background: linear-gradient(135deg, #f0f0f0, #e8e8e8);
+    border: none;
+    padding: 12px 20px;
+    border-radius: 25px;
+    cursor: pointer;
+    font-size: 0.95rem;
+    font-weight: 500;
+    color: #666;
+    transition: all 0.3s ease;
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+}
+
+.tab-btn:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+}
+
+.tab-btn.active {
+    background: linear-gradient(135deg, #4096ff, #40a9ff);
+    color: white;
+    box-shadow: 0 4px 16px rgba(64, 150, 255, 0.3);
+}
+
+.tab-icon {
+    font-size: 1.1rem;
+}
+
+.refresh-btn {
+    background: linear-gradient(135deg, #52c41a, #73d13d);
+    border: none;
+    padding: 12px 24px;
+    border-radius: 25px;
+    color: white;
+    cursor: pointer;
+    font-size: 0.95rem;
+    font-weight: 500;
+    margin-top: 15px;
+    transition: all 0.3s ease;
+    display: inline-flex;
+    align-items: center;
+    gap: 8px;
+    box-shadow: 0 4px 12px rgba(82, 196, 26, 0.3);
+}
+
+.refresh-btn:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 6px 16px rgba(82, 196, 26, 0.4);
+}
+
+.btn-icon {
+    font-size: 1.1rem;
+}
+
+.time-icon {
+    margin-right: 6px;
+}
+
+.update-time {
+    color: #666;
+    font-size: 0.9rem;
+    background-color: rgba(0, 0, 0, 0.03);
+    padding: 8px 16px;
+    border-radius: 24px;
+    display: inline-block;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
+}
+
+.hot-list {
+    list-style: none;
+}
+
+.hot-item {
+    padding: 20px;
+    margin-bottom: 16px;
+    border-radius: 12px;
+    background-color: white;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
+    transition: all 0.3s ease;
+    display: flex;
+    align-items: center;
+    border: 1px solid rgba(0, 0, 0, 0.03);
+}
+
+.hot-item:hover {
+    transform: translateY(-3px);
+    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
+    border-color: rgba(64, 169, 255, 0.3);
+}
+
+.hot-rank {
+    font-size: 1.2rem;
+    font-weight: bold;
+    color: #4096ff;
+    margin-right: 18px;
+    min-width: 38px;
+    text-align: center;
+    background-color: rgba(64, 169, 255, 0.1);
+    border-radius: 50%;
+    width: 38px;
+    height: 38px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.hot-rank.top-1 {
+    background: linear-gradient(135deg, #ff4d4f, #ff7a45);
+    color: white;
+}
+
+.hot-rank.top-2 {
+    background: linear-gradient(135deg, #ff7a45, #ffa940);
+    color: white;
+}
+
+.hot-rank.top-3 {
+    background: linear-gradient(135deg, #ffa940, #ffec3d);
+    color: white;
+}
+
+.hot-content {
+    flex: 1;
+}
+
+.hot-title {
+    font-size: 1.15rem;
+    margin-bottom: 8px;
+    color: #333;
+    text-decoration: none;
+    display: block;
+    line-height: 1.5;
+    font-weight: 500;
+    transition: color 0.2s ease;
+}
+
+.hot-title:hover {
+    color: #4096ff;
+    text-decoration: none;
+}
+
+.loading {
+    text-align: center;
+    padding: 40px;
+    color: #666;
+    font-size: 1.1rem;
+    display: none;
+}
+
+.loading-content {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 20px;
+}
+
+.rainbow-spinner {
+    width: 50px;
+    height: 50px;
+    border: 4px solid transparent;
+    border-top: 4px solid #4096ff;
+    border-radius: 50%;
+    animation: spin 1s linear infinite;
+    background: linear-gradient(45deg, #ff6b6b, #4ecdc4, #45b7d1, #96ceb4, #feca57, #ff9ff3, #54a0ff, #5f27cd);
+    background-size: 400% 400%;
+    animation: spin 1s linear infinite, rainbowGradient 3s ease infinite;
+}
+
+@keyframes spin {
+    0% { transform: rotate(0deg); }
+    100% { transform: rotate(360deg); }
+}
+
+.loading-text {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 10px;
+}
+
+.loading-emoji {
+    font-size: 2rem;
+    animation: bounce 1.5s ease-in-out infinite;
+}
+
+@keyframes bounce {
+    0%, 20%, 50%, 80%, 100% {
+        transform: translateY(0);
+    }
+    40% {
+        transform: translateY(-10px);
+    }
+    60% {
+        transform: translateY(-5px);
+    }
+}
+
+.loading-dots {
+    display: flex;
+    gap: 4px;
+}
+
+.loading-dots span {
+    width: 8px;
+    height: 8px;
+    background: #4096ff;
+    border-radius: 50%;
+    animation: loadingDots 1.4s ease-in-out infinite both;
+}
+
+.loading-dots span:nth-child(1) { animation-delay: -0.32s; }
+.loading-dots span:nth-child(2) { animation-delay: -0.16s; }
+.loading-dots span:nth-child(3) { animation-delay: 0s; }
+
+@keyframes loadingDots {
+    0%, 80%, 100% {
+        transform: scale(0);
+    }
+    40% {
+        transform: scale(1);
+    }
+}
+
+.news-list {
+    margin-top: 20px;
+}
+
+/* 新闻项目卡片 - 移动端优先设计 */
+.news-item {
+    background: white;
+    border-radius: 16px;
+    padding: 16px;
+    margin-bottom: 12px;
+    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
+    transition: all 0.3s ease;
+    border: 1px solid rgba(0, 0, 0, 0.05);
+    display: flex;
+    gap: 12px;
+    position: relative;
+    overflow: hidden;
+}
+
+.news-item:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
+    border-color: rgba(64, 169, 255, 0.2);
+}
+
+/* 排名容器 */
+.news-rank-container {
+    flex-shrink: 0;
+    display: flex;
+    align-items: flex-start;
+    padding-top: 2px;
+}
+
+.news-rank {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    width: 48px;
+    height: 48px;
+    border-radius: 12px;
+    background: linear-gradient(135deg, #f0f0f0, #e8e8e8);
+    color: #666;
+    font-weight: 600;
+    position: relative;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+}
+
+.news-rank.rank-1 {
+    background: linear-gradient(135deg, #ff4d4f, #ff7a45);
+    color: white;
+    box-shadow: 0 4px 12px rgba(255, 77, 79, 0.3);
+}
+
+.news-rank.rank-2 {
+    background: linear-gradient(135deg, #ff7a45, #ffa940);
+    color: white;
+    box-shadow: 0 4px 12px rgba(255, 122, 69, 0.3);
+}
+
+.news-rank.rank-3 {
+    background: linear-gradient(135deg, #ffa940, #ffec3d);
+    color: #333;
+    box-shadow: 0 4px 12px rgba(255, 169, 64, 0.3);
+}
+
+.rank-number {
+    font-size: 0.9rem;
+    font-weight: 700;
+    line-height: 1;
+}
+
+.rank-emoji {
+    font-size: 0.7rem;
+    line-height: 1;
+    margin-top: 1px;
+}
+
+/* 内容包装器 */
+.news-content-wrapper {
+    flex: 1;
+    min-width: 0;
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+}
+
+/* 标题 */
+.news-title {
+    font-size: 1rem;
+    font-weight: 600;
+    color: #333;
+    line-height: 1.4;
+    margin: 0;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    cursor: pointer;
+    transition: color 0.2s ease;
+}
+
+.news-title:hover {
+    color: #4096ff;
+}
+
+/* 元信息行 */
+.news-meta-row {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    gap: 12px;
+    flex-wrap: wrap;
+}
+
+.news-author, .news-time {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    color: #666;
+    font-size: 0.8rem;
+    flex: 1;
+    min-width: 0;
+}
+
+.meta-icon {
+    font-size: 0.9rem;
+    flex-shrink: 0;
+}
+
+.meta-text {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+/* 统计信息行 */
+.news-stats-row {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    gap: 12px;
+    margin-top: 4px;
+}
+
+.news-score {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    background: linear-gradient(135deg, #ff6b6b, #4ecdc4);
+    color: white;
+    padding: 4px 10px;
+    border-radius: 12px;
+    font-size: 0.75rem;
+    font-weight: 600;
+    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
+}
+
+.heat-level {
+    font-size: 0.8rem;
+}
+
+.score-text {
+    font-size: 0.75rem;
+}
+
+.news-link {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    background: linear-gradient(135deg, #4096ff, #40a9ff);
+    color: white;
+    text-decoration: none;
+    padding: 6px 12px;
+    border-radius: 12px;
+    font-size: 0.75rem;
+    font-weight: 600;
+    transition: all 0.3s ease;
+    box-shadow: 0 2px 6px rgba(64, 150, 255, 0.3);
+    flex-shrink: 0;
+}
+
+.news-link:hover {
+    transform: translateY(-1px);
+    box-shadow: 0 4px 10px rgba(64, 150, 255, 0.4);
+    text-decoration: none;
+    color: white;
+}
+
+.link-icon {
+    font-size: 0.8rem;
+}
+
+.link-text {
+    font-size: 0.75rem;
+}
+
+.error-message {
+    text-align: center;
+    padding: 40px;
+    background: white;
+    border-radius: 12px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
+}
+
+.error-content {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 16px;
+}
+
+.error-icon {
+    font-size: 3rem;
+}
+
+.error-content h3 {
+    color: #ff4d4f;
+    margin: 0;
+    font-size: 1.3rem;
+}
+
+.error-content p {
+    color: #666;
+    margin: 0;
+    font-size: 1rem;
+}
+
+.retry-btn {
+    background: linear-gradient(135deg, #ff4d4f, #ff7a45);
+    border: none;
+    padding: 12px 24px;
+    border-radius: 25px;
+    color: white;
+    cursor: pointer;
+    font-size: 0.95rem;
+    font-weight: 500;
+    transition: all 0.3s ease;
+    display: inline-flex;
+    align-items: center;
+    gap: 8px;
+    box-shadow: 0 4px 12px rgba(255, 77, 79, 0.3);
+}
+
+.retry-btn:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 6px 16px rgba(255, 77, 79, 0.4);
+}
+
+footer {
+    text-align: center;
+    margin-top: 30px;
+    padding-top: 20px;
+    border-top: 1px solid rgba(0, 0, 0, 0.06);
+    color: #666;
+    font-size: 0.9rem;
+}
+
+/* 响应式设计 - 移动端优化 */
+@media (max-width: 1024px) and (min-width: 768px) {
+    .container {
+        max-width: 90%;
+        padding: 20px;
+    }
+    
+    header h1 {
+        font-size: 2.2rem;
+    }
+    
+    .hot-item {
+        padding: 18px;
+    }
+    
+    .hot-title {
+        font-size: 1.1rem;
+    }
+}
+
+@media (max-width: 768px) {
+    body {
+        background-color: #f8f9fa;
+    }
+    
+    .container {
+        max-width: 95%;
+        margin: 12px auto;
+        padding: 8px;
+        border-radius: 12px;
+    }
+    
+    header, .header {
+        margin-bottom: 20px;
+        padding: 12px 0 16px 0;
+    }
+    
+    header h1, .title {
+        font-size: 1.6rem;
+        margin-bottom: 10px;
+    }
+    
+    .subtitle {
+        font-size: 0.85rem;
+    }
+    
+    .tab-container {
+        gap: 8px;
+        margin: 16px 0;
+    }
+    
+    .tab-btn {
+        padding: 8px 12px;
+        font-size: 0.8rem;
+        min-width: auto;
+    }
+    
+    .refresh-btn {
+        padding: 8px 10px;
+        font-size: 0.8rem;
+    }
+    
+    .update-time {
+        font-size: 0.85rem;
+        padding: 6px 12px;
+    }
+    
+    .hot-item {
+        padding: 16px;
+        margin-bottom: 12px;
+        border-radius: 10px;
+        flex-direction: row;
+        align-items: flex-start;
+    }
+    
+    .hot-rank {
+        font-size: 1.1rem;
+        margin-right: 14px;
+        min-width: 32px;
+        width: 32px;
+        height: 32px;
+        margin-top: 2px;
+    }
+    
+    .hot-title {
+        font-size: 1rem;
+        line-height: 1.5;
+        margin-bottom: 6px;
+    }
+    
+    .news-item {
+        padding: 12px;
+        margin-bottom: 10px;
+        gap: 10px;
+    }
+    
+    .news-rank {
+        width: 40px;
+        height: 40px;
+    }
+    
+    .rank-number {
+        font-size: 0.8rem;
+    }
+    
+    .rank-emoji {
+        font-size: 0.6rem;
+    }
+    
+    .news-title {
+        font-size: 0.9rem;
+        line-height: 1.3;
+    }
+    
+    .news-meta-row {
+        gap: 8px;
+    }
+    
+    .news-author, .news-time {
+        font-size: 0.75rem;
+    }
+    
+    .news-score {
+        padding: 3px 8px;
+        font-size: 0.7rem;
+    }
+    
+    .news-link {
+        padding: 5px 10px;
+        font-size: 0.7rem;
+    }
+    
+    .link-text {
+        font-size: 0.7rem;
+    }
+    
+    footer {
+        margin-top: 24px;
+        padding-top: 16px;
+        font-size: 0.85rem;
+    }
+}
+
+@media (max-width: 480px) {
+    .container {
+        margin: 8px auto;
+        padding: 6px;
+    }
+    
+    header h1, .title {
+        font-size: 1.6rem;
+    }
+    
+    .hot-item {
+        padding: 14px;
+        margin-bottom: 10px;
+    }
+    
+    .hot-rank {
+        font-size: 1rem;
+        margin-right: 12px;
+        min-width: 30px;
+        width: 30px;
+        height: 30px;
+    }
+    
+    .hot-title {
+        font-size: 0.95rem;
+    }
+    
+    .news-item {
+        padding: 10px;
+        gap: 8px;
+    }
+    
+    .news-rank {
+        width: 36px;
+        height: 36px;
+    }
+    
+    .rank-number {
+        font-size: 0.75rem;
+    }
+    
+    .news-title {
+        font-size: 0.85rem;
+    }
+    
+    .news-meta-row {
+        flex-direction: column;
+        align-items: flex-start;
+        gap: 6px;
+    }
+    
+    .news-stats-row {
+        gap: 8px;
+    }
+    
+    .news-author, .news-time {
+        font-size: 0.7rem;
+    }
+    
+    .news-score {
+        font-size: 0.65rem;
+    }
+    
+    .news-link {
+        font-size: 0.65rem;
+        padding: 4px 8px;
+    }
+}
+
+/* 减少动画以节省电池 */
+@media (prefers-reduced-motion: reduce) {
+    .modern-gradient,
+    .modern-gradient::before {
+        animation: none;
+    }
+    
+    .modern-gradient {
+        background: linear-gradient(
+            135deg,
+            rgba(64, 169, 255, 0.3) 0%,
+            rgba(255, 175, 64, 0.2) 50%,
+            rgba(255, 122, 69, 0.25) 100%
+        );
+    }
+}

frontend/public/60sapi/热搜榜单/Hacker News 榜单/index.html

@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>🔥 HackerNews 热门榜单</title>
+    <link rel="stylesheet" href="css/background.css">
+    <link rel="stylesheet" href="css/style.css">
+</head>
+<body>
+    <div class="container">
+        <header class="header">
+            <div class="header-icon">🌈</div>
+            <h1 class="title">🔥 HackerNews 热门榜单 💻</h1>
+            <p class="subtitle">全球技术社区 · 实时热门话题</p>
+            
+            <div class="tab-container">
+                <button class="tab-btn active" data-type="top">
+                    <span class="tab-icon">🏆</span>
+                    热门榜
+                </button>
+                <button class="tab-btn" data-type="new">
+                    <span class="tab-icon">🆕</span>
+                    最新榜
+                </button>
+                <button class="tab-btn" data-type="best">
+                    <span class="tab-icon">⭐</span>
+                    最佳榜
+                </button>
+            </div>
+            
+            <div class="update-time">
+                <span class="time-icon">⏰</span>
+                <span id="updateTime">加载中...</span>
+            </div>
+            
+            <button id="refreshBtn" class="refresh-btn">
+                <span class="btn-icon">🔄</span>
+                刷新数据
+            </button>
+        </header>
+
+        <div class="loading" id="loading">
+            <div class="loading-content">
+                <div class="rainbow-spinner"></div>
+                <div class="loading-text">
+                    <span class="loading-emoji">🚀</span>
+                    <p>正在获取最新榜单...</p>
+                    <div class="loading-dots">
+                        <span></span>
+                        <span></span>
+                        <span></span>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="news-list" id="newsList">
+            <!-- 新闻列表将动态生成 -->
+        </div>
+
+        <div class="error-message" id="errorMessage" style="display: none;">
+            <div class="error-content">
+                <div class="error-icon">💥</div>
+                <h3>加载失败了</h3>
+                <p>网络连接出现问题，请稍后重试</p>
+                <button onclick="loadNewsList()" class="retry-btn">
+                    <span>🔄</span>
+                    重新加载
+                </button>
+            </div>
+        </div>
+    </div>
+
+    <script src="js/script.js"></script>
+</body>
+</html>

frontend/public/60sapi/热搜榜单/Hacker News 榜单/js/script.js

@@ -0,0 +1,349 @@
+// API接口列表
+const API_ENDPOINTS = [
+    "https://60s.api.shumengya.top",
+];
+
+// 当前使用的API索引
+let currentApiIndex = 0;
+let currentType = 'top';
+
+// DOM元素
+const loadingElement = document.getElementById('loading');
+const newsListElement = document.getElementById('newsList');
+const errorMessageElement = document.getElementById('errorMessage');
+const updateTimeElement = document.getElementById('updateTime');
+const refreshBtn = document.getElementById('refreshBtn');
+const tabBtns = document.querySelectorAll('.tab-btn');
+
+// 页面加载完成后自动加载数据
+document.addEventListener('DOMContentLoaded', function() {
+    loadNewsList();
+    initTabEvents();
+});
+
+// 初始化标签事件
+function initTabEvents() {
+    tabBtns.forEach(btn => {
+        btn.addEventListener('click', function() {
+            const type = this.getAttribute('data-type');
+            if (type !== currentType) {
+                currentType = type;
+                updateActiveTab(this);
+                loadNewsList();
+            }
+        });
+    });
+}
+
+// 更新活跃标签
+function updateActiveTab(activeBtn) {
+    tabBtns.forEach(btn => btn.classList.remove('active'));
+    activeBtn.classList.add('active');
+}
+
+// 刷新按钮点击事件
+refreshBtn.addEventListener('click', function() {
+    loadNewsList();
+});
+
+// 加载新闻列表
+async function loadNewsList() {
+    showLoading();
+    hideError();
+    
+    try {
+        const data = await fetchData();
+        displayNewsList(data.data);
+        updateRefreshTime();
+    } catch (error) {
+        console.error('加载失败:', error);
+        showError();
+    }
+    
+    hideLoading();
+}
+
+// 获取数据
+async function fetchData() {
+    for (let i = 0; i < API_ENDPOINTS.length; i++) {
+        const apiUrl = API_ENDPOINTS[currentApiIndex];
+        
+        try {
+            const response = await fetch(`${apiUrl}/v2/hacker-news/${currentType}`, {
+                method: 'GET',
+                headers: {
+                    'Accept': 'application/json',
+                },
+                timeout: 10000
+            });
+            
+            if (!response.ok) {
+                throw new Error(`HTTP ${response.status}`);
+            }
+            
+            const data = await response.json();
+            
+            if (data.code === 200 && data.data) {
+                return data;
+            } else {
+                throw new Error('数据格式错误');
+            }
+        } catch (error) {
+            console.error(`API ${apiUrl} 请求失败:`, error);
+            currentApiIndex = (currentApiIndex + 1) % API_ENDPOINTS.length;
+            
+            if (i === API_ENDPOINTS.length - 1) {
+                throw new Error('所有API接口都无法访问');
+            }
+        }
+    }
+}
+
+// 显示新闻列表
+function displayNewsList(newsData) {
+    newsListElement.innerHTML = '';
+    
+    newsData.forEach((item, index) => {
+        const newsItem = createNewsItem(item, index + 1);
+        newsListElement.appendChild(newsItem);
+    });
+}
+
+// 创建新闻项目
+function createNewsItem(item, rank) {
+    const newsItem = document.createElement('div');
+    newsItem.className = 'news-item';
+    
+    const rankClass = rank <= 3 ? `news-rank rank-${rank}` : 'news-rank';
+    const formattedScore = formatScore(item.score);
+    const formattedTime = formatTime(item.created);
+    
+    // 根据排名添加特殊标识
+    let rankEmoji = '';
+    if (rank === 1) rankEmoji = '🏆';
+    else if (rank === 2) rankEmoji = '🥈';
+    else if (rank === 3) rankEmoji = '🥉';
+    
+    // 根据评分添加热度指示
+    let heatLevel = '';
+    if (item.score >= 1000) heatLevel = '🔥🔥🔥';
+    else if (item.score >= 500) heatLevel = '🔥🔥';
+    else if (item.score >= 100) heatLevel = '🔥';
+    else heatLevel = '💫';
+    
+    newsItem.innerHTML = `
+        <div class="news-rank-container">
+            <div class="${rankClass}">
+                <span class="rank-number">${rank}</span>
+                <span class="rank-emoji">${rankEmoji}</span>
+            </div>
+        </div>
+        <div class="news-content-wrapper">
+            <h3 class="news-title">${escapeHtml(item.title)}</h3>
+            <div class="news-meta-row">
+                <div class="news-author">
+                    <span class="meta-icon">👤</span>
+                    <span class="meta-text">${escapeHtml(item.author)}</span>
+                </div>
+                <div class="news-time">
+                    <span class="meta-icon">🕒</span>
+                    <span class="meta-text">${formattedTime}</span>
+                </div>
+            </div>
+            <div class="news-stats-row">
+                <div class="news-score">
+                    <span class="heat-level">${heatLevel}</span>
+                    <span class="score-text">${formattedScore} 分</span>
+                </div>
+                <a href="${item.link}" target="_blank" class="news-link">
+                    <span class="link-icon">🚀</span>
+                    <span class="link-text">阅读全文</span>
+                </a>
+            </div>
+        </div>
+    `;
+    
+    return newsItem;
+}
+
+// 格式化评分
+function formatScore(score) {
+    if (score >= 1000) {
+        return (score / 1000).toFixed(1) + 'K';
+    } else {
+        return score.toString();
+    }
+}
+
+// 格式化时间
+function formatTime(timeStr) {
+    try {
+        const date = new Date(timeStr);
+        const now = new Date();
+        const diff = now - date;
+        const minutes = Math.floor(diff / (1000 * 60));
+        const hours = Math.floor(minutes / 60);
+        const days = Math.floor(hours / 24);
+        
+        if (days > 0) {
+            return `${days}天前`;
+        } else if (hours > 0) {
+            return `${hours}小时前`;
+        } else if (minutes > 0) {
+            return `${minutes}分钟前`;
+        } else {
+            return '刚刚';
+        }
+    } catch (error) {
+        return timeStr;
+    }
+}
+
+// HTML转义
+function escapeHtml(text) {
+    const div = document.createElement('div');
+    div.textContent = text;
+    return div.innerHTML;
+}
+
+// 更新刷新时间
+function updateRefreshTime() {
+    const now = new Date();
+    const timeStr = now.toLocaleString('zh-CN', {
+        year: 'numeric',
+        month: '2-digit',
+        day: '2-digit',
+        hour: '2-digit',
+        minute: '2-digit',
+        second: '2-digit'
+    });
+    updateTimeElement.textContent = `最后更新: ${timeStr}`;
+    
+    // 添加成功提示
+    showSuccessMessage('🌈 数据已更新');
+}
+
+// 显示成功消息
+function showSuccessMessage(message) {
+    // 移除之前的提示
+    const existingToast = document.querySelector('.success-toast');
+    if (existingToast) {
+        existingToast.remove();
+    }
+    
+    const toast = document.createElement('div');
+    toast.className = 'success-toast';
+    toast.textContent = message;
+    toast.style.cssText = `
+        position: fixed;
+        top: 20px;
+        right: 20px;
+        background: linear-gradient(135deg, #ff6b6b, #4ecdc4, #45b7d1);
+        color: white;
+        padding: 12px 20px;
+        border-radius: 25px;
+        box-shadow: 0 4px 20px rgba(255, 107, 107, 0.3);
+        z-index: 1000;
+        font-weight: 600;
+        font-size: 0.9em;
+        animation: rainbowToastSlide 0.5s ease-out;
+        backdrop-filter: blur(10px);
+    `;
+    
+    document.body.appendChild(toast);
+    
+    // 3秒后自动移除
+    setTimeout(() => {
+        toast.style.animation = 'rainbowToastSlideOut 0.5s ease-in forwards';
+        setTimeout(() => toast.remove(), 500);
+    }, 3000);
+}
+
+// 显示加载状态
+function showLoading() {
+    loadingElement.style.display = 'block';
+    newsListElement.style.display = 'none';
+}
+
+// 隐藏加载状态
+function hideLoading() {
+    loadingElement.style.display = 'none';
+    newsListElement.style.display = 'block';
+}
+
+// 显示错误信息
+function showError() {
+    errorMessageElement.style.display = 'block';
+    newsListElement.style.display = 'none';
+}
+
+// 隐藏错误信息
+function hideError() {
+    errorMessageElement.style.display = 'none';
+}
+
+// 添加CSS动画到页面
+if (!document.querySelector('#toast-styles')) {
+    const style = document.createElement('style');
+    style.id = 'toast-styles';
+    style.textContent = `
+        @keyframes rainbowToastSlide {
+            from {
+                opacity: 0;
+                transform: translateX(100px) scale(0.8);
+            }
+            to {
+                opacity: 1;
+                transform: translateX(0) scale(1);
+            }
+        }
+        
+        @keyframes rainbowToastSlideOut {
+            from {
+                opacity: 1;
+                transform: translateX(0) scale(1);
+            }
+            to {
+                opacity: 0;
+                transform: translateX(100px) scale(0.8);
+            }
+        }
+        
+        .success-toast {
+            background-size: 200% 200%;
+            animation: rainbowToastSlide 0.5s ease-out, toastRainbow 2s ease-in-out infinite !important;
+        }
+        
+        @keyframes toastRainbow {
+            0%, 100% { background-position: 0% 50%; }
+            50% { background-position: 100% 50%; }
+        }
+    `;
+    document.head.appendChild(style);
+}
+
+// 自动刷新 (每5分钟)
+setInterval(function() {
+    loadNewsList();
+}, 5 * 60 * 1000);
+
+// 键盘快捷键支持
+document.addEventListener('keydown', function(e) {
+    if (e.key === 'r' && (e.ctrlKey || e.metaKey)) {
+        e.preventDefault();
+        loadNewsList();
+    }
+    
+    // 数字键切换标签
+    if (e.key >= '1' && e.key <= '3') {
+        e.preventDefault();
+        const typeMap = { '1': 'top', '2': 'new', '3': 'best' };
+        const targetType = typeMap[e.key];
+        const targetBtn = document.querySelector(`[data-type="${targetType}"]`);
+        if (targetBtn && targetType !== currentType) {
+            currentType = targetType;
+            updateActiveTab(targetBtn);
+            loadNewsList();
+        }
+    }
+});

frontend/public/60sapi/热搜榜单/Hacker News 榜单/接口集合.json

@@ -0,0 +1,3 @@
+[
+    "https://60s.api.shumengya.top"
+]

frontend/public/60sapi/热搜榜单/Hacker News 榜单/返回接口.json

@@ -0,0 +1,87 @@
+{
+  "code": 200,
+  "message": "获取成功。数据来自官方/权威源头，以确保稳定与实时。开源地址 https://github.com/vikiboss/60s，反馈群 595941841",
+  "data": [
+    {
+      "id": 45087396,
+      "title": "We should have the ability to run any code we want on hardware we own",
+      "link": "https://hugotunius.se/2025/08/31/what-every-argument-about-sideloading-gets-wrong.html",
+      "score": 995,
+      "author": "K0nserv",
+      "created": "2025-08-31 21:46:26",
+      "created_at": 1756676786000
+    },
+    {
+      "id": 45053029,
+      "title": "Why countries trade with each other while fighting",
+      "link": "https://news.mit.edu/2025/why-countries-trade-each-other-while-fighting-mariya-grinberg-book-0828",
+      "score": 32,
+      "author": "LorenDB",
+      "created": "2025-08-28 14:58:28",
+      "created_at": 1756393108000
+    },
+    {
+      "id": 45086020,
+      "title": "Eternal Struggle",
+      "link": "https://yoavg.github.io/eternal/",
+      "score": 481,
+      "author": "yurivish",
+      "created": "2025-08-31 19:04:03",
+      "created_at": 1756667043000
+    },
+    {
+      "id": 45052960,
+      "title": "C++: Strongly Happens Before?",
+      "link": "https://nekrozqliphort.github.io/posts/happens-b4/",
+      "score": 16,
+      "author": "signa11",
+      "created": "2025-08-28 14:54:37",
+      "created_at": 1756392877000
+    },
+    {
+      "id": 45087971,
+      "title": "Nintendo Switch 2 Dock USB-C Compatibility",
+      "link": "https://www.lttlabs.com/blog/2025/08/30/nintendo-switch-2-dock",
+      "score": 192,
+      "author": "croes",
+      "created": "2025-08-31 23:21:46",
+      "created_at": 1756682506000
+    },
+    {
+      "id": 45082731,
+      "title": "“This telegram must be closely paraphrased before being communicated to anyone”",
+      "link": "https://history.stackexchange.com/questions/79371/this-telegram-must-be-closely-paraphrased-before-being-communicated-to-anyone",
+      "score": 645,
+      "author": "azeemba",
+      "created": "2025-08-31 12:39:47",
+      "created_at": 1756643987000
+    },
+    {
+      "id": 45089256,
+      "title": "What Is Complexity in Chess?",
+      "link": "https://lichess.org/@/Toadofsky/blog/what-is-complexity/pKo1swFh",
+      "score": 41,
+      "author": "fzliu",
+      "created": "2025-09-01 03:45:33",
+      "created_at": 1756698333000
+    },
+    {
+      "id": 45087815,
+      "title": "Lewis and Clark marked their trail with laxatives",
+      "link": "https://offbeatoregon.com/2501d1006d_biliousPills-686.077.html",
+      "score": 141,
+      "author": "toomuchtodo",
+      "created": "2025-08-31 22:54:26",
+      "created_at": 1756680866000
+    },
+    {
+      "id": 45083952,
+      "title": "Jujutsu for everyone",
+      "link": "https://jj-for-everyone.github.io/",
+      "score": 363,
+      "author": "Bogdanp",
+      "created": "2025-08-31 15:31:04",
+      "created_at": 1756654264000
+    }
+  ]
+}

frontend/public/60sapi/热搜榜单/哔哩哔哩热搜榜/css/background.css

@@ -0,0 +1,203 @@
+.background-container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: -1;
+    overflow: hidden;
+    background-color: #f0f7ff;
+}
+
+/* 太阳元素 */
+.sun {
+    position: absolute;
+    top: 50px;
+    right: 35%;
+    width: 60px;
+    height: 60px;
+    background: radial-gradient(circle, #ffeb3b 30%, #ff9800 70%);
+    border-radius: 50%;
+    box-shadow: 0 0 40px rgba(255, 152, 0, 0.6);
+    z-index: 0;
+    animation: sun-pulse 8s ease-in-out infinite;
+}
+
+/* 蓝色云元素 */
+.cloud {
+    position: absolute;
+    background: rgba(135, 206, 250, 0.8);
+    border-radius: 50px;
+    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
+    z-index: -1;
+}
+
+.cloud-1 {
+    top: 120px;
+    left: -150px;
+    width: 120px;
+    height: 40px;
+    animation: cloud-float 15s linear infinite;
+}
+
+.cloud-2 {
+    top: 180px;
+    right: -150px;
+    width: 160px;
+    height: 50px;
+    animation: cloud-float 20s linear infinite reverse;
+}
+
+.cloud-3 {
+    top: 60px;
+    left: -100px;
+    width: 100px;
+    height: 35px;
+    animation: cloud-float 12s linear infinite;
+}
+
+/* 云朵的伪元素，创建更自然的形状 */
+.cloud::before,
+.cloud::after {
+    content: '';
+    position: absolute;
+    background: rgba(135, 206, 250, 0.8);
+    border-radius: 50%;
+}
+
+.cloud::before {
+    width: 50px;
+    height: 50px;
+    top: -20px;
+    left: 15px;
+}
+
+.cloud::after {
+    width: 60px;
+    height: 60px;
+    top: -30px;
+    right: 15px;
+}
+
+@keyframes sun-pulse {
+    0%, 100% {
+        transform: scale(1);
+        box-shadow: 0 0 40px rgba(255, 152, 0, 0.6);
+    }
+    50% {
+        transform: scale(1.1);
+        box-shadow: 0 0 60px rgba(255, 152, 0, 0.8);
+    }
+}
+
+@keyframes cloud-float {
+    0% {
+        transform: translateX(-150px);
+    }
+    100% {
+        transform: translateX(calc(100vw + 150px));
+    }
+}
+
+.modern-gradient {
+    position: absolute;
+    top: -50%;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: linear-gradient(
+        135deg,
+        rgba(24, 144, 255, 0.6) 0%,
+        rgba(64, 169, 255, 0.5) 20%,
+        rgba(135, 208, 255, 0.4) 40%,
+        rgba(255, 175, 64, 0.4) 60%,
+        rgba(255, 122, 69, 0.5) 80%,
+        rgba(245, 85, 65, 0.6) 100%
+    );
+    animation: gradient-flow 25s ease-in-out infinite;
+    border-radius: 40% 60% 60% 40% / 40% 40% 60% 60%;
+    filter: blur(30px);
+}
+
+.modern-gradient::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: radial-gradient(
+        circle at 25% 65%,
+        rgba(24, 144, 255, 0.6) 0%,
+        transparent 60%
+    ), radial-gradient(
+        circle at 75% 35%,
+        rgba(245, 85, 65, 0.5) 0%,
+        transparent 60%
+    );
+    animation: pulse-effect 18s ease-in-out infinite alternate;
+    border-radius: 40% 60% 60% 40% / 40% 40% 60% 60%;
+    filter: blur(20px);
+}
+
+@keyframes gradient-flow {
+    0%, 100% {
+        transform: rotate(0deg) scale(1);
+        opacity: 0.8;
+    }
+    25% {
+        transform: rotate(90deg) scale(1.1);
+        opacity: 0.6;
+    }
+    50% {
+        transform: rotate(180deg) scale(0.9);
+        opacity: 0.9;
+    }
+    75% {
+        transform: rotate(270deg) scale(1.05);
+        opacity: 0.7;
+    }
+}
+
+@keyframes pulse-effect {
+    0% {
+        transform: scale(1) rotate(0deg);
+        opacity: 0.5;
+    }
+    50% {
+        transform: scale(1.2) rotate(180deg);
+        opacity: 0.8;
+    }
+    100% {
+        transform: scale(1) rotate(360deg);
+        opacity: 0.6;
+    }
+}
+
+/* 手机端背景优化 */
+@media (max-width: 768px) {
+    .modern-gradient {
+        animation-duration: 25s;
+    }
+    
+    .modern-gradient::before {
+        animation-duration: 18s;
+    }
+}
+
+/* 减少动画以节省电池 */
+@media (prefers-reduced-motion: reduce) {
+    .modern-gradient,
+    .modern-gradient::before {
+        animation: none;
+    }
+    
+    .modern-gradient {
+        background: linear-gradient(
+            135deg,
+            rgba(64, 169, 255, 0.3) 0%,
+            rgba(255, 175, 64, 0.2) 50%,
+            rgba(255, 122, 69, 0.25) 100%
+        );
+    }
+}

frontend/public/60sapi/热搜榜单/哔哩哔哩热搜榜/css/style.css

@@ -0,0 +1,352 @@
+/* 背景样式 */
+.background-container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: -1;
+    overflow: hidden;
+    background-color: #f8f9fa;
+}
+
+.modern-gradient {
+    position: absolute;
+    top: -50%;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: linear-gradient(
+        135deg,
+        rgba(64, 169, 255, 0.4) 0%,
+        rgba(120, 192, 255, 0.3) 25%,
+        rgba(255, 175, 64, 0.2) 50%,
+        rgba(255, 140, 50, 0.3) 75%,
+        rgba(255, 122, 69, 0.4) 100%
+    );
+    animation: gradient-flow 20s ease-in-out infinite;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+.modern-gradient::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: radial-gradient(
+        circle at 30% 70%,
+        rgba(64, 169, 255, 0.5) 0%,
+        transparent 50%
+    ), radial-gradient(
+        circle at 70% 30%,
+        rgba(255, 140, 50, 0.4) 0%,
+        transparent 50%
+    );
+    animation: pulse-effect 15s ease-in-out infinite alternate;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+@keyframes gradient-flow {
+    0%, 100% {
+        transform: rotate(0deg) scale(1);
+        opacity: 0.8;
+    }
+    25% {
+        transform: rotate(90deg) scale(1.1);
+        opacity: 0.6;
+    }
+    50% {
+        transform: rotate(180deg) scale(0.9);
+        opacity: 0.9;
+    }
+    75% {
+        transform: rotate(270deg) scale(1.05);
+        opacity: 0.7;
+    }
+}
+
+@keyframes pulse-effect {
+    0% {
+        transform: scale(1) rotate(0deg);
+        opacity: 0.5;
+    }
+    50% {
+        transform: scale(1.2) rotate(180deg);
+        opacity: 0.8;
+    }
+    100% {
+        transform: scale(1) rotate(360deg);
+        opacity: 0.6;
+    }
+}
+
+/* 主样式 */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+    font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
+    color: #333;
+    background-color: #f0f7ff;
+    position: relative;
+    min-height: 100vh;
+}
+
+.container {
+    max-width: 800px;
+    margin: 20px auto;
+    padding: 28px;
+    position: relative;
+    z-index: 1;
+    background-color: rgba(255, 255, 255, 0.8);
+    border-radius: 24px;
+    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
+    backdrop-filter: blur(15px);
+    border: 1px solid rgba(255, 255, 255, 0.6);
+}
+
+header {
+    text-align: center;
+    margin-bottom: 32px;
+    padding-bottom: 24px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
+}
+
+header h1 {
+    background: linear-gradient(135deg, #1890ff, #ff7a45);
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+    margin-bottom: 16px;
+    font-size: 2.6rem;
+    font-weight: 800;
+    letter-spacing: -0.5px;
+    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
+}
+
+.update-time {
+    color: #666;
+    font-size: 0.9rem;
+    background-color: rgba(255, 255, 255, 0.7);
+    padding: 10px 20px;
+    border-radius: 30px;
+    display: inline-block;
+    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
+    border: 1px solid rgba(255, 255, 255, 0.8);
+}
+
+.hot-list {
+    list-style: none;
+}
+
+.hot-item {
+    padding: 22px;
+    margin-bottom: 20px;
+    border-radius: 16px;
+    background-color: white;
+    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
+    transition: all 0.3s ease;
+    display: flex;
+    align-items: center;
+    border: 1px solid rgba(255, 255, 255, 0.8);
+}
+
+.hot-item:hover {
+    transform: translateY(-3px);
+    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
+    border-color: rgba(64, 169, 255, 0.3);
+}
+
+.hot-rank {
+    font-size: 1.2rem;
+    font-weight: bold;
+    color: #4096ff;
+    margin-right: 18px;
+    min-width: 38px;
+    text-align: center;
+    background-color: rgba(64, 169, 255, 0.1);
+    border-radius: 50%;
+    width: 38px;
+    height: 38px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.hot-rank.top-1 {
+    background: linear-gradient(135deg, #ff4d4f, #ff7a45);
+    color: white;
+}
+
+.hot-rank.top-2 {
+    background: linear-gradient(135deg, #ff7a45, #ffa940);
+    color: white;
+}
+
+.hot-rank.top-3 {
+    background: linear-gradient(135deg, #ffa940, #ffec3d);
+    color: white;
+}
+
+.hot-content {
+    flex: 1;
+}
+
+.hot-title {
+    font-size: 1.15rem;
+    margin-bottom: 8px;
+    color: #333;
+    text-decoration: none;
+    display: block;
+    line-height: 1.5;
+    font-weight: 500;
+    transition: color 0.2s ease;
+}
+
+.hot-title:hover {
+    color: #4096ff;
+    text-decoration: none;
+}
+
+.loading {
+    text-align: center;
+    padding: 40px;
+    color: #666;
+    font-size: 1.1rem;
+}
+
+footer {
+    text-align: center;
+    margin-top: 30px;
+    padding-top: 20px;
+    border-top: 1px solid rgba(0, 0, 0, 0.06);
+    color: #666;
+    font-size: 0.9rem;
+}
+
+/* 响应式设计 */
+@media (max-width: 1024px) and (min-width: 768px) {
+    .container {
+        max-width: 90%;
+        padding: 20px;
+    }
+    
+    header h1 {
+        font-size: 2.2rem;
+    }
+    
+    .hot-item {
+        padding: 18px;
+    }
+    
+    .hot-title {
+        font-size: 1.1rem;
+    }
+}
+
+@media (max-width: 768px) {
+    body {
+        background-color: #f8f9fa;
+    }
+    
+    .container {
+        max-width: 95%;
+        margin: 12px auto;
+        padding: 16px;
+        border-radius: 12px;
+    }
+    
+    header {
+        margin-bottom: 20px;
+        padding-bottom: 16px;
+    }
+    
+    header h1 {
+        font-size: 1.8rem;
+        margin-bottom: 10px;
+    }
+    
+    .update-time {
+        font-size: 0.85rem;
+        padding: 6px 12px;
+    }
+    
+    .hot-item {
+        padding: 16px;
+        margin-bottom: 12px;
+        border-radius: 10px;
+        flex-direction: row;
+        align-items: flex-start;
+    }
+    
+    .hot-rank {
+        font-size: 1.1rem;
+        margin-right: 14px;
+        min-width: 32px;
+        width: 32px;
+        height: 32px;
+        margin-top: 2px;
+    }
+    
+    .hot-title {
+        font-size: 1rem;
+        line-height: 1.5;
+        margin-bottom: 6px;
+    }
+    
+    footer {
+        margin-top: 24px;
+        padding-top: 16px;
+        font-size: 0.85rem;
+    }
+}
+
+@media (max-width: 480px) {
+    .container {
+        margin: 8px auto;
+        padding: 14px;
+    }
+    
+    header h1 {
+        font-size: 1.6rem;
+    }
+    
+    .hot-item {
+        padding: 14px;
+        margin-bottom: 10px;
+    }
+    
+    .hot-rank {
+        font-size: 1rem;
+        margin-right: 12px;
+        min-width: 30px;
+        width: 30px;
+        height: 30px;
+    }
+    
+    .hot-title {
+        font-size: 0.95rem;
+    }
+}
+
+/* 减少动画以节省电池 */
+@media (prefers-reduced-motion: reduce) {
+    .modern-gradient,
+    .modern-gradient::before {
+        animation: none;
+    }
+    
+    .modern-gradient {
+        background: linear-gradient(
+            135deg,
+            rgba(64, 169, 255, 0.3) 0%,
+            rgba(255, 175, 64, 0.2) 50%,
+            rgba(255, 122, 69, 0.25) 100%
+        );
+    }
+}

frontend/public/60sapi/热搜榜单/哔哩哔哩热搜榜/index.html

@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>哔哩哔哩热搜榜</title>
+    <link rel="stylesheet" href="./css/style.css">
+    <link rel="stylesheet" href="./css/background.css">
+</head>
+<body>
+    <div class="background-container">
+        <div class="modern-gradient"></div>
+    </div>
+    
+    <div class="container">
+        <header>
+            <h1>哔哩哔哩热搜榜</h1>
+            <div class="update-time" id="updateTime"></div>
+        </header>
+        
+        <main>
+            <div class="hot-list" id="hotList">
+                <div class="loading">加载中...</div>
+            </div>
+        </main>
+        
+        <footer>
+            <p>数据来源于哔哩哔哩热搜榜</p>
+        </footer>
+    </div>
+    
+    <script src="./js/main.js"></script>
+</body>
+</html>

frontend/public/60sapi/热搜榜单/哔哩哔哩热搜榜/js/main.js

@@ -0,0 +1,130 @@
+// API接口列表
+const API_ENDPOINTS = [
+    "https://60s.api.shumengya.top/v2/bili"
+];
+
+// 当前使用的API索引
+let currentApiIndex = 0;
+
+// DOM元素
+const hotListElement = document.getElementById('hotList');
+const updateTimeElement = document.getElementById('updateTime');
+
+// 格式化时间
+function formatDate(date) {
+    const year = date.getFullYear();
+    const month = String(date.getMonth() + 1).padStart(2, '0');
+    const day = String(date.getDate()).padStart(2, '0');
+    const hours = String(date.getHours()).padStart(2, '0');
+    const minutes = String(date.getMinutes()).padStart(2, '0');
+    const seconds = String(date.getSeconds()).padStart(2, '0');
+    
+    return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
+}
+
+// 渲染热搜列表
+function renderHotList(data) {
+    hotListElement.innerHTML = '';
+    
+    data.forEach((item, index) => {
+        const hotItem = document.createElement('div');
+        hotItem.className = 'hot-item';
+        
+        const rankClass = index < 3 ? `top-${index + 1}` : '';
+        
+        hotItem.innerHTML = `
+            <div class="hot-rank ${rankClass}">${index + 1}</div>
+            <div class="hot-content">
+                <a href="${item.link}" class="hot-title" target="_blank">${item.title}</a>
+            </div>
+        `;
+        
+        hotListElement.appendChild(hotItem);
+    });
+    
+    // 更新时间
+    updateTimeElement.textContent = `更新时间：${formatDate(new Date())}`;
+}
+
+// 显示加载状态
+function showLoading() {
+    hotListElement.innerHTML = '<div class="loading">加载中...</div>';
+}
+
+// 显示错误状态
+function showError(message) {
+    hotListElement.innerHTML = `<div class="loading">${message}</div>`;
+}
+
+// 获取哔哩哔哩热搜数据
+async function fetchBiliHotList() {
+    showLoading();
+    
+    try {
+        const response = await fetch(API_ENDPOINTS[currentApiIndex]);
+        
+        if (!response.ok) {
+            throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+        }
+        
+        const result = await response.json();
+        
+        if (result.code === 200 && result.data && Array.isArray(result.data)) {
+            if (result.data.length > 0) {
+                renderHotList(result.data);
+            } else {
+                showError('暂无热搜数据');
+            }
+        } else {
+            throw new Error('数据格式错误或无数据');
+        }
+    } catch (error) {
+        console.error('获取数据失败:', error);
+        
+        // 尝试切换到下一个API
+        const nextApiIndex = (currentApiIndex + 1) % API_ENDPOINTS.length;
+        
+        if (nextApiIndex !== 0) {
+            // 还有其他API可以尝试
+            currentApiIndex = nextApiIndex;
+            showError('获取数据失败，正在尝试其他接口...');
+            
+            // 延迟后重试
+            setTimeout(fetchBiliHotList, 2000);
+        } else {
+            // 所有API都尝试过了
+            currentApiIndex = 0;
+            showError('所有接口都无法访问，请稍后再试');
+        }
+    }
+}
+
+// 手动刷新数据
+function refreshData() {
+    currentApiIndex = 0; // 重置API索引
+    fetchBiliHotList();
+}
+
+// 页面加载完成后获取数据
+document.addEventListener('DOMContentLoaded', () => {
+    fetchBiliHotList();
+    
+    // 每隔5分钟刷新一次数据
+    setInterval(fetchBiliHotList, 5 * 60 * 1000);
+    
+    // 添加键盘快捷键支持（按R键刷新）
+    document.addEventListener('keydown', (event) => {
+        if (event.key === 'r' || event.key === 'R') {
+            event.preventDefault();
+            refreshData();
+        }
+    });
+});
+
+// 页面可见性变化时的处理
+document.addEventListener('visibilitychange', () => {
+    if (!document.hidden) {
+        // 页面重新可见时刷新数据
+        refreshData();
+    }
+});

frontend/public/60sapi/热搜榜单/哔哩哔哩热搜榜/接口集合.json

@@ -0,0 +1,3 @@
+[
+   "https://60s.api.shumengya.top"
+]

frontend/public/60sapi/热搜榜单/哔哩哔哩热搜榜/返回接口.json

@@ -0,0 +1,18 @@
+{
+  "code": 200,
+  "message": "获取成功。数据来自官方/权威源头，以确保稳定与实时。开源地址 https://github.com/vikiboss/60s，反馈群 595941841",
+  "data": [
+    {
+      "title": "18次阅兵76年逆袭路",
+      "link": "https://search.bilibili.com/all?keyword=18%E6%AC%A1%E9%98%85%E5%85%B576%E5%B9%B4%E9%80%86%E8%A2%AD%E8%B7%AF"
+    },
+    {
+      "title": "80年前的今天日本签署投降书",
+      "link": "https://search.bilibili.com/all?keyword=80%E5%B9%B4%E5%89%8D%E7%9A%84%E4%BB%8A%E5%A4%A9%E6%97%A5%E6%9C%AC%E7%AD%BE%E7%BD%B2%E6%8A%95%E9%99%8D%E4%B9%A6"
+    },
+    {
+      "title": "九三阅兵具体安排公布",
+      "link": "https://search.bilibili.com/all?keyword=%E4%B9%9D%E4%B8%89%E9%98%85%E5%85%B5%E5%85%B7%E4%BD%93%E5%AE%89%E6%8E%92%E5%85%AC%E5%B8%83"
+    }
+  ]
+}

frontend/public/60sapi/热搜榜单/头条热搜榜/css/background.css

@@ -0,0 +1,107 @@
+.background-container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: -1;
+    overflow: hidden;
+}
+
+.green-gradient {
+    position: absolute;
+    top: -50%;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: linear-gradient(
+        135deg,
+        rgba(240, 20, 20, 0.3) 0%,
+        rgba(255, 60, 60, 0.2) 25%,
+        rgba(255, 100, 100, 0.1) 50%,
+        rgba(255, 150, 150, 0.2) 75%,
+        rgba(240, 20, 20, 0.3) 100%
+    );
+    animation: green-flow 20s ease-in-out infinite;
+}
+
+.green-gradient::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: radial-gradient(
+        circle at 30% 70%,
+        rgba(255, 45, 45, 0.4) 0%,
+        transparent 50%
+    ), radial-gradient(
+        circle at 70% 30%,
+        rgba(255, 100, 100, 0.3) 0%,
+        transparent 50%
+    );
+    animation: green-pulse 15s ease-in-out infinite alternate;
+}
+
+@keyframes green-flow {
+    0%, 100% {
+        transform: rotate(0deg) scale(1);
+        opacity: 0.8;
+    }
+    25% {
+        transform: rotate(90deg) scale(1.1);
+        opacity: 0.6;
+    }
+    50% {
+        transform: rotate(180deg) scale(0.9);
+        opacity: 0.9;
+    }
+    75% {
+        transform: rotate(270deg) scale(1.05);
+        opacity: 0.7;
+    }
+}
+
+@keyframes green-pulse {
+    0% {
+        transform: scale(1) rotate(0deg);
+        opacity: 0.5;
+    }
+    50% {
+        transform: scale(1.2) rotate(180deg);
+        opacity: 0.8;
+    }
+    100% {
+        transform: scale(1) rotate(360deg);
+        opacity: 0.6;
+    }
+}
+
+/* 手机端背景优化 */
+@media (max-width: 768px) {
+    .green-gradient {
+        animation-duration: 25s;
+    }
+    
+    .green-gradient::before {
+        animation-duration: 18s;
+    }
+}
+
+/* 减少动画以节省电池 */
+@media (prefers-reduced-motion: reduce) {
+    .green-gradient,
+    .green-gradient::before {
+        animation: none;
+    }
+    
+    .green-gradient {
+        background: linear-gradient(
+            135deg,
+            rgba(76, 175, 80, 0.2) 0%,
+            rgba(165, 214, 167, 0.1) 50%,
+            rgba(200, 230, 201, 0.15) 100%
+        );
+    }
+}

frontend/public/60sapi/热搜榜单/头条热搜榜/css/style.css

@@ -0,0 +1,578 @@
+/* 背景样式 */
+.background-container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: -1;
+    overflow: hidden;
+    background-color: #f8f9fa;
+}
+
+.modern-gradient {
+    position: absolute;
+    top: -50%;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: linear-gradient(
+        135deg,
+        rgba(64, 169, 255, 0.4) 0%,
+        rgba(120, 192, 255, 0.3) 25%,
+        rgba(255, 175, 64, 0.2) 50%,
+        rgba(255, 140, 50, 0.3) 75%,
+        rgba(255, 122, 69, 0.4) 100%
+    );
+    animation: gradient-flow 20s ease-in-out infinite;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+.modern-gradient::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: radial-gradient(
+        circle at 30% 70%,
+        rgba(64, 169, 255, 0.5) 0%,
+        transparent 50%
+    ), radial-gradient(
+        circle at 70% 30%,
+        rgba(255, 140, 50, 0.4) 0%,
+        transparent 50%
+    );
+    animation: pulse-effect 15s ease-in-out infinite alternate;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+@keyframes gradient-flow {
+    0%, 100% {
+        transform: rotate(0deg) scale(1);
+        opacity: 0.8;
+    }
+    25% {
+        transform: rotate(90deg) scale(1.1);
+        opacity: 0.6;
+    }
+    50% {
+        transform: rotate(180deg) scale(0.9);
+        opacity: 0.9;
+    }
+    75% {
+        transform: rotate(270deg) scale(1.05);
+        opacity: 0.7;
+    }
+}
+
+@keyframes pulse-effect {
+    0% {
+        transform: scale(1) rotate(0deg);
+        opacity: 0.5;
+    }
+    50% {
+        transform: scale(1.2) rotate(180deg);
+        opacity: 0.8;
+    }
+    100% {
+        transform: scale(1) rotate(360deg);
+        opacity: 0.6;
+    }
+}
+
+/* 主样式 */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+    font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
+    color: #333;
+    background-color: #f8f9fa;
+    position: relative;
+    min-height: 100vh;
+}
+
+/* 几何装饰样式 */
+.title-container {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 10px;
+}
+
+.geometric-decoration {
+    font-size: 20px;
+    color: #f04040;
+    margin: 0 15px;
+    font-weight: bold;
+    letter-spacing: 5px;
+    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+    animation: float-effect 3s ease-in-out infinite alternate;
+}
+
+.geometric-decoration.left {
+    transform: rotate(-10deg);
+}
+
+.geometric-decoration.right {
+    transform: rotate(10deg);
+}
+
+@keyframes float-effect {
+    0% {
+        transform: translateY(0) rotate(-10deg);
+    }
+    100% {
+        transform: translateY(-5px) rotate(-8deg);
+    }
+}
+
+.update-time-container {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-top: 10px;
+}
+
+.time-decoration {
+    color: #f04040;
+    font-size: 18px;
+    margin: 0 10px;
+    animation: pulse 2s infinite;
+}
+
+@keyframes pulse {
+    0% {
+        opacity: 0.5;
+        transform: scale(0.8);
+    }
+    50% {
+        opacity: 1;
+        transform: scale(1.2);
+    }
+    100% {
+        opacity: 0.5;
+        transform: scale(0.8);
+    }
+}
+
+.geometric-header, .geometric-footer {
+    text-align: center;
+    color: #f04040;
+    margin: 15px 0;
+    font-size: 16px;
+    letter-spacing: 3px;
+    opacity: 0.8;
+}
+
+.geometric-header {
+    margin-bottom: 20px;
+}
+
+.geometric-footer {
+    margin-top: 20px;
+}
+
+.container {
+    max-width: 800px;
+    margin: 0 auto;
+    padding: 24px;
+    position: relative;
+    z-index: 1;
+    background-color: rgba(255, 255, 255, 0.85);
+    border-radius: 16px;
+    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
+    backdrop-filter: blur(10px);
+    border: 2px solid rgba(240, 64, 64, 0.3);
+    position: relative;
+}
+
+.container::before,
+.container::after {
+    content: '';
+    position: absolute;
+    width: 30px;
+    height: 30px;
+    border-color: #f04040;
+    opacity: 0.7;
+}
+
+.container::before {
+    top: 10px;
+    left: 10px;
+    border-top: 3px solid;
+    border-left: 3px solid;
+    border-radius: 10px 0 0 0;
+}
+
+.container::after {
+    bottom: 10px;
+    right: 10px;
+    border-bottom: 3px solid;
+    border-right: 3px solid;
+    border-radius: 0 0 10px 0;
+}
+
+header {
+    text-align: center;
+    margin-bottom: 28px;
+    padding-bottom: 20px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
+}
+
+header h1 {
+    background: linear-gradient(135deg, #4096ff, #ff7a45);
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+    margin-bottom: 14px;
+    font-size: 2.4rem;
+    font-weight: 700;
+    letter-spacing: -0.5px;
+}
+
+.update-time {
+    color: #666;
+    font-size: 0.9rem;
+    background-color: rgba(0, 0, 0, 0.03);
+    padding: 8px 16px;
+    border-radius: 24px;
+    display: inline-block;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
+    position: relative;
+    border: 1px dashed rgba(240, 64, 64, 0.3);
+}
+
+.update-time::before {
+    content: '';
+    position: absolute;
+    top: -5px;
+    left: -5px;
+    right: -5px;
+    bottom: -5px;
+    border: 1px solid rgba(240, 64, 64, 0.3);
+    border-radius: 28px;
+    animation: pulse-border 2s infinite;
+    pointer-events: none;
+}
+
+@keyframes pulse-border {
+    0% {
+        transform: scale(1);
+        opacity: 0.7;
+    }
+    50% {
+        transform: scale(1.05);
+        opacity: 0.3;
+    }
+    100% {
+        transform: scale(1);
+        opacity: 0.7;
+    }
+}
+
+.hot-list {
+    list-style: none;
+}
+
+.hot-item {
+    padding: 20px;
+    margin-bottom: 16px;
+    border-radius: 12px;
+    background-color: white;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
+    transition: all 0.3s ease;
+    display: flex;
+    align-items: center;
+    border: 1px solid rgba(0, 0, 0, 0.03);
+    position: relative;
+    overflow: hidden;
+}
+
+.hot-item::before {
+    content: '◆';
+    position: absolute;
+    top: 5px;
+    right: 10px;
+    color: #f04040;
+    opacity: 0.2;
+    font-size: 14px;
+}
+
+.hot-item::after {
+    content: '◆';
+    position: absolute;
+    bottom: 5px;
+    left: 10px;
+    color: #f04040;
+    opacity: 0.2;
+    font-size: 14px;
+}
+
+.even-item {
+    border-left: 3px solid #f04040;
+}
+
+.odd-item {
+    border-right: 3px solid #f04040;
+}
+
+.title-decoration {
+    color: #f04040;
+    font-weight: bold;
+    margin-right: 5px;
+    display: inline-block;
+    transform: translateY(1px);
+}
+
+.source-icon, .time-icon {
+    color: #f04040;
+    font-size: 14px;
+    margin-right: 3px;
+    opacity: 0.8;
+}
+
+.hot-title {
+    position: relative;
+    display: inline-flex;
+    align-items: center;
+}
+
+.hot-stats {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+    margin-top: 8px;
+}
+
+.hot-item:hover {
+    transform: translateY(-3px);
+    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
+    border-color: rgba(64, 169, 255, 0.3);
+}
+
+.hot-rank {
+    font-size: 1.2rem;
+    font-weight: bold;
+    color: #4096ff;
+    margin-right: 18px;
+    min-width: 38px;
+    text-align: center;
+    background-color: rgba(64, 169, 255, 0.1);
+    border-radius: 50%;
+    width: 38px;
+    height: 38px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.hot-rank.top-1 {
+    background: linear-gradient(135deg, #ff4d4f, #ff7a45);
+    color: white;
+}
+
+.hot-rank.top-2 {
+    background: linear-gradient(135deg, #ff7a45, #ffa940);
+    color: white;
+}
+
+.hot-rank.top-3 {
+    background: linear-gradient(135deg, #ffa940, #ffec3d);
+    color: white;
+}
+
+.hot-content {
+    flex: 1;
+}
+
+.hot-title {
+    font-size: 1.15rem;
+    margin-bottom: 8px;
+    color: #333;
+    text-decoration: none;
+    display: block;
+    line-height: 1.5;
+    font-weight: 500;
+    transition: color 0.2s ease;
+}
+
+.hot-title:hover {
+    color: #4096ff;
+    text-decoration: none;
+}
+
+.loading {
+    text-align: center;
+    padding: 40px;
+    color: #666;
+    font-size: 1.1rem;
+}
+
+footer {
+    text-align: center;
+    margin-top: 40px;
+    padding-top: 20px;
+    border-top: 1px solid rgba(0, 0, 0, 0.06);
+    color: #999;
+    font-size: 0.9rem;
+}
+
+.footer-decoration {
+    display: flex;
+    justify-content: center;
+    margin: 10px 0;
+    gap: 15px;
+}
+
+.geo-symbol {
+    color: #f04040;
+    font-size: 16px;
+    opacity: 0.7;
+    transition: all 0.3s ease;
+    animation: color-shift 5s infinite alternate;
+}
+
+.geo-symbol:hover {
+    opacity: 1;
+    transform: scale(1.2) rotate(15deg);
+}
+
+@keyframes color-shift {
+    0% {
+        color: #f04040;
+    }
+    50% {
+        color: #ff7a45;
+    }
+    100% {
+        color: #ff4d4f;
+    }
+}
+
+/* 响应式设计 */
+@media (max-width: 1024px) and (min-width: 768px) {
+    .container {
+        max-width: 90%;
+        padding: 20px;
+    }
+    
+    header h1 {
+        font-size: 2.2rem;
+    }
+    
+    .hot-item {
+        padding: 18px;
+    }
+    
+    .hot-title {
+        font-size: 1.1rem;
+    }
+}
+
+@media (max-width: 768px) {
+    body {
+        background-color: #f8f9fa;
+    }
+    
+    .container {
+        max-width: 95%;
+        margin: 12px auto;
+        padding: 16px;
+        border-radius: 12px;
+    }
+    
+    header {
+        margin-bottom: 20px;
+        padding-bottom: 16px;
+    }
+    
+    header h1 {
+        font-size: 1.8rem;
+        margin-bottom: 10px;
+    }
+    
+    .update-time {
+        font-size: 0.85rem;
+        padding: 6px 12px;
+    }
+    
+    .hot-item {
+        padding: 16px;
+        margin-bottom: 12px;
+        border-radius: 10px;
+        flex-direction: row;
+        align-items: flex-start;
+    }
+    
+    .hot-rank {
+        font-size: 1.1rem;
+        margin-right: 14px;
+        min-width: 32px;
+        width: 32px;
+        height: 32px;
+        margin-top: 2px;
+    }
+    
+    .hot-title {
+        font-size: 1rem;
+        line-height: 1.5;
+        margin-bottom: 6px;
+    }
+    
+    footer {
+        margin-top: 24px;
+        padding-top: 16px;
+        font-size: 0.85rem;
+    }
+}
+
+@media (max-width: 480px) {
+    .container {
+        margin: 8px auto;
+        padding: 14px;
+    }
+    
+    header h1 {
+        font-size: 1.6rem;
+    }
+    
+    .hot-item {
+        padding: 14px;
+        margin-bottom: 10px;
+    }
+    
+    .hot-rank {
+        font-size: 1rem;
+        margin-right: 12px;
+        min-width: 30px;
+        width: 30px;
+        height: 30px;
+    }
+    
+    .hot-title {
+        font-size: 0.95rem;
+    }
+}
+
+/* 减少动画以节省电池 */
+@media (prefers-reduced-motion: reduce) {
+    .modern-gradient,
+    .modern-gradient::before {
+        animation: none;
+    }
+    
+    .modern-gradient {
+        background: linear-gradient(
+            135deg,
+            rgba(64, 169, 255, 0.3) 0%,
+            rgba(255, 175, 64, 0.2) 50%,
+            rgba(255, 122, 69, 0.25) 100%
+        );
+    }
+}

frontend/public/60sapi/热搜榜单/头条热搜榜/index.html

@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>头条热搜榜</title>
+    <link rel="stylesheet" href="./css/style.css">
+    <link rel="stylesheet" href="./css/background.css">
+</head>
+<body>
+    <div class="background-container">
+        <div class="green-gradient"></div>
+    </div>
+    
+    <div class="container">
+        <header>
+            <div class="title-container">
+                <div class="geometric-decoration left">◢ ◣ ▲</div>
+                <h1>头条热搜榜</h1>
+                <div class="geometric-decoration right">▼ ◥ ◤</div>
+            </div>
+            <div class="update-time-container">
+                <span class="time-decoration">◇</span>
+                <div class="update-time" id="updateTime"></div>
+                <span class="time-decoration">◇</span>
+            </div>
+        </header>
+        
+        <main>
+            <div class="geometric-header">
+                <span>◆ ◆ ◆ ◆ ◆ ◆ ◆ ◆ ◆</span>
+            </div>
+            <div class="hot-list" id="hotList">
+                <div class="loading">加载中...</div>
+            </div>
+            <div class="geometric-footer">
+                <span>◆ ◆ ◆ ◆ ◆ ◆ ◆ ◆ ◆</span>
+            </div>
+        </main>
+        
+        <footer>
+            <div class="footer-decoration">
+                <span class="geo-symbol">◆</span>
+                <span class="geo-symbol">■</span>
+                <span class="geo-symbol">▲</span>
+                <span class="geo-symbol">●</span>
+                <span class="geo-symbol">★</span>
+            </div>
+            <p>数据来源于头条热搜榜</p>
+            <div class="footer-decoration">
+                <span class="geo-symbol">★</span>
+                <span class="geo-symbol">●</span>
+                <span class="geo-symbol">▲</span>
+                <span class="geo-symbol">■</span>
+                <span class="geo-symbol">◆</span>
+            </div>
+        </footer>
+    </div>
+    
+    <script src="./js/main.js"></script>
+</body>
+</html>

frontend/public/60sapi/热搜榜单/头条热搜榜/js/main.js

@@ -0,0 +1,171 @@
+// API接口列表
+const API_ENDPOINTS = [
+    "https://60s.api.shumengya.top/v2/toutiao",
+];
+
+// 当前使用的API索引
+let currentApiIndex = 0;
+
+// DOM元素
+const hotListElement = document.getElementById('hotList');
+const updateTimeElement = document.getElementById('updateTime');
+
+// 格式化时间
+function formatDate(date) {
+    const year = date.getFullYear();
+    const month = String(date.getMonth() + 1).padStart(2, '0');
+    const day = String(date.getDate()).padStart(2, '0');
+    const hours = String(date.getHours()).padStart(2, '0');
+    const minutes = String(date.getMinutes()).padStart(2, '0');
+    const seconds = String(date.getSeconds()).padStart(2, '0');
+    
+    return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
+}
+
+// 格式化数字
+function formatNumber(num) {
+    if (num >= 10000) {
+        return (num / 10000).toFixed(1) + '万';
+    }
+    return num.toString();
+}
+
+// 渲染热搜列表
+function renderHotList(data) {
+    hotListElement.innerHTML = '';
+    
+    // 几何装饰符号数组
+    const geometricSymbols = ['◆', '■', '▲', '●', '★', '◈', '◇', '□', '△', '○'];
+    
+    data.forEach((item, index) => {
+        const hotItem = document.createElement('div');
+        hotItem.className = 'hot-item';
+        
+        const rankClass = index < 3 ? `top-${index + 1}` : '';
+        
+        // 随机选择几何符号作为装饰
+        const randomSymbol = geometricSymbols[index % geometricSymbols.length];
+        
+        // 处理热度值显示
+        const hotValueDisplay = item.hot_value ? 
+            `<div class="stat-item"><span class="hot-value">${randomSymbol} ${formatNumber(item.hot_value)} 热度</span></div>` : '';
+        
+        // 处理标签显示
+        const tagDisplay = item.tag ? 
+            `<div class="stat-item"><span class="hot-tag">${randomSymbol} ${item.tag}</span></div>` : '';
+        
+        hotItem.innerHTML = `
+            <div class="hot-rank ${rankClass}">${index + 1}</div>
+            <div class="hot-content">
+                <a href="${item.link}" class="hot-title" target="_blank">
+                    <span class="title-decoration">${randomSymbol}</span> ${item.title}
+                </a>
+                <div class="hot-stats">
+                    ${hotValueDisplay}
+                    ${tagDisplay}
+                    ${item.source ? `<div class="stat-item"><span class="source-icon">${randomSymbol}</span> ${item.source}</div>` : ''}
+                    ${item.time ? `<div class="stat-item"><span class="time-icon">${randomSymbol}</span> ${item.time}</div>` : ''}
+                </div>
+            </div>
+        `;
+        
+        hotListElement.appendChild(hotItem);
+    });
+    
+    // 添加几何装饰到列表项
+    const hotItems = document.querySelectorAll('.hot-item');
+    hotItems.forEach((item, index) => {
+        // 为奇数和偶数项添加不同的装饰类
+        if (index % 2 === 0) {
+            item.classList.add('even-item');
+        } else {
+            item.classList.add('odd-item');
+        }
+    });
+    
+    // 更新时间
+    updateTimeElement.textContent = `更新时间：${formatDate(new Date())}`;
+}
+
+// 显示加载状态
+function showLoading() {
+    hotListElement.innerHTML = '<div class="loading">加载中...</div>';
+}
+
+// 显示错误状态
+function showError(message) {
+    hotListElement.innerHTML = `<div class="loading">${message}</div>`;
+}
+
+// 获取头条热搜数据
+async function fetchToutiaoHotList() {
+    showLoading();
+    
+    try {
+        const response = await fetch(API_ENDPOINTS[currentApiIndex]);
+        
+        if (!response.ok) {
+            throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+        }
+        
+        const result = await response.json();
+        
+        if (result.code === 200 && result.data && Array.isArray(result.data)) {
+            if (result.data.length > 0) {
+                renderHotList(result.data);
+            } else {
+                showError('暂无热搜数据');
+            }
+        } else {
+            throw new Error('数据格式错误或无数据');
+        }
+    } catch (error) {
+        console.error('获取数据失败:', error);
+        
+        // 尝试切换到下一个API
+        const nextApiIndex = (currentApiIndex + 1) % API_ENDPOINTS.length;
+        
+        if (nextApiIndex !== 0) {
+            // 还有其他API可以尝试
+            currentApiIndex = nextApiIndex;
+            showError('获取数据失败，正在尝试其他接口...');
+            
+            // 延迟后重试
+            setTimeout(fetchToutiaoHotList, 2000);
+        } else {
+            // 所有API都尝试过了
+            currentApiIndex = 0;
+            showError('所有接口都无法访问，请稍后再试');
+        }
+    }
+}
+
+// 手动刷新数据
+function refreshData() {
+    currentApiIndex = 0; // 重置API索引
+    fetchToutiaoHotList();
+}
+
+// 页面加载完成后获取数据
+document.addEventListener('DOMContentLoaded', () => {
+    fetchToutiaoHotList();
+    
+    // 每隔5分钟刷新一次数据
+    setInterval(fetchToutiaoHotList, 5 * 60 * 1000);
+    
+    // 添加键盘快捷键支持（按R键刷新）
+    document.addEventListener('keydown', (event) => {
+        if (event.key === 'r' || event.key === 'R') {
+            event.preventDefault();
+            refreshData();
+        }
+    });
+});
+
+// 页面可见性变化时的处理
+document.addEventListener('visibilitychange', () => {
+    if (!document.hidden) {
+        // 页面重新可见时刷新数据
+        refreshData();
+    }
+});

frontend/public/60sapi/热搜榜单/头条热搜榜/接口集合.json

@@ -0,0 +1,3 @@
+[
+    "https://60s.api.shumengya.top"
+]

frontend/public/60sapi/热搜榜单/头条热搜榜/返回接口.json

@@ -0,0 +1,30 @@
+{
+  "code": 200,
+  "message": "获取成功。数据来自官方/权威源头，以确保稳定与实时。开源地址 https://github.com/vikiboss/60s，反馈群 595941841",
+  "data": [
+    {
+      "title": "九三阅兵具体安排公布",
+      "hot_value": 11821633,
+      "tag": "热",
+      "source": "头条新闻",
+      "time": "2小时前",
+      "link": "https://www.toutiao.com/article/7404567890123456789/"
+    },
+    {
+      "title": "九月第一天",
+      "hot_value": 11327170,
+      "tag": "新",
+      "source": "今日头条",
+      "time": "1小时前",
+      "link": "https://www.toutiao.com/article/7404567890123456790/"
+    },
+    {
+      "title": "遇见上合共享津彩",
+      "hot_value": 11222444,
+      "tag": "推荐",
+      "source": "头条资讯",
+      "time": "3小时前",
+      "link": "https://www.toutiao.com/article/7404567890123456791/"
+    }
+  ]
+}

frontend/public/60sapi/热搜榜单/微博热搜榜/css/background.css

@@ -0,0 +1,37 @@
+.background-container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: -1;
+    overflow: hidden;
+    background-color: #f8f9fa;
+}
+
+.modern-gradient {
+    position: absolute;
+    top: -50%;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: linear-gradient(
+        135deg,
+        rgba(230, 22, 45, 0.4) 0%,
+        rgba(245, 80, 80, 0.3) 25%,
+        rgba(250, 120, 110, 0.2) 50%,
+        rgba(255, 140, 140, 0.3) 75%,
+        rgba(255, 90, 90, 0.4) 100%
+    );
+    animation: gradient-flow 20s ease-in-out infinite;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+@keyframes rainbow-rotate {
+    0% {
+        transform: rotate(0deg);
+    }
+    100% {
+        transform: rotate(360deg);
+    }
+}

frontend/public/60sapi/热搜榜单/微博热搜榜/css/style.css

@@ -0,0 +1,384 @@
+/* 背景样式 */
+.background-container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: -1;
+    overflow: hidden;
+    background-color: #f8f9fa;
+}
+
+.modern-gradient {
+    position: absolute;
+    top: -50%;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: linear-gradient(
+        135deg,
+        rgba(64, 169, 255, 0.4) 0%,
+        rgba(120, 192, 255, 0.3) 25%,
+        rgba(255, 175, 64, 0.2) 50%,
+        rgba(255, 140, 50, 0.3) 75%,
+        rgba(255, 122, 69, 0.4) 100%
+    );
+    animation: gradient-flow 20s ease-in-out infinite;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+.modern-gradient::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: radial-gradient(
+        circle at 30% 70%,
+        rgba(64, 169, 255, 0.5) 0%,
+        transparent 50%
+    ), radial-gradient(
+        circle at 70% 30%,
+        rgba(255, 140, 50, 0.4) 0%,
+        transparent 50%
+    );
+    animation: pulse-effect 15s ease-in-out infinite alternate;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+@keyframes gradient-flow {
+    0%, 100% {
+        transform: rotate(0deg) scale(1);
+        opacity: 0.8;
+    }
+    25% {
+        transform: rotate(90deg) scale(1.1);
+        opacity: 0.6;
+    }
+    50% {
+        transform: rotate(180deg) scale(0.9);
+        opacity: 0.9;
+    }
+    75% {
+        transform: rotate(270deg) scale(1.05);
+        opacity: 0.7;
+    }
+}
+
+@keyframes pulse-effect {
+    0% {
+        transform: scale(1) rotate(0deg);
+        opacity: 0.5;
+    }
+    50% {
+        transform: scale(1.2) rotate(180deg);
+        opacity: 0.8;
+    }
+    100% {
+        transform: scale(1) rotate(360deg);
+        opacity: 0.6;
+    }
+}
+
+/* 主样式 */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+    font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
+    color: #333;
+    background-color: #f8f9fa;
+    position: relative;
+    min-height: 100vh;
+}
+
+/* 微博Logo样式 */
+.title-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    margin-bottom: 10px;
+}
+
+.weibo-logo-container {
+    margin-top: 10px;
+}
+
+.weibo-logo {
+    background-color: #e6162d;
+    color: white;
+    font-weight: bold;
+    padding: 4px 10px;
+    border-radius: 15px;
+    font-size: 16px;
+    display: inline-block;
+    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
+}
+
+/* Q版眨眼动画样式 */
+.qeye-container {
+    display: flex;
+    justify-content: center;
+    margin-bottom: 10px;
+}
+
+.qeye {
+    width: 80px;
+    height: 48px;
+}
+
+.container {
+    max-width: 800px;
+    margin: 0 auto;
+    padding: 24px;
+    position: relative;
+    z-index: 1;
+    background-color: rgba(255, 255, 255, 0.85);
+    border-radius: 16px;
+    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
+    backdrop-filter: blur(10px);
+}
+
+header {
+    text-align: center;
+    margin-bottom: 28px;
+    padding-bottom: 20px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
+}
+
+header h1 {
+    background: linear-gradient(135deg, #4096ff, #ff7a45);
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+    margin-bottom: 14px;
+    font-size: 2.4rem;
+    font-weight: 700;
+    letter-spacing: -0.5px;
+}
+
+.update-time {
+    color: #666;
+    font-size: 0.9rem;
+    background-color: rgba(0, 0, 0, 0.03);
+    padding: 8px 16px;
+    border-radius: 24px;
+    display: inline-block;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
+}
+
+.hot-list {
+    list-style: none;
+}
+
+.hot-item {
+    padding: 20px;
+    margin-bottom: 16px;
+    border-radius: 12px;
+    background-color: white;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
+    transition: all 0.3s ease;
+    display: flex;
+    align-items: center;
+    border: 1px solid rgba(0, 0, 0, 0.03);
+}
+
+.hot-item:hover {
+    transform: translateY(-3px);
+    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
+    border-color: rgba(64, 169, 255, 0.3);
+}
+
+.hot-rank {
+    font-size: 1.2rem;
+    font-weight: bold;
+    color: #4096ff;
+    margin-right: 18px;
+    min-width: 38px;
+    text-align: center;
+    background-color: rgba(64, 169, 255, 0.1);
+    border-radius: 50%;
+    width: 38px;
+    height: 38px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.hot-rank.top-1 {
+    background: linear-gradient(135deg, #ff4d4f, #ff7a45);
+    color: white;
+}
+
+.hot-rank.top-2 {
+    background: linear-gradient(135deg, #ff7a45, #ffa940);
+    color: white;
+}
+
+.hot-rank.top-3 {
+    background: linear-gradient(135deg, #ffa940, #ffec3d);
+    color: white;
+}
+
+.hot-content {
+    flex: 1;
+}
+
+.hot-title {
+    font-size: 1.15rem;
+    margin-bottom: 8px;
+    color: #333;
+    text-decoration: none;
+    display: block;
+    line-height: 1.5;
+    font-weight: 500;
+    transition: color 0.2s ease;
+}
+
+.hot-title:hover {
+    color: #4096ff;
+    text-decoration: none;
+}
+
+.loading {
+    text-align: center;
+    padding: 40px;
+    color: #666;
+    font-size: 1.1rem;
+}
+
+footer {
+    text-align: center;
+    margin-top: 30px;
+    padding-top: 20px;
+    border-top: 1px solid rgba(0, 0, 0, 0.06);
+    color: #666;
+    font-size: 0.9rem;
+}
+
+/* 响应式设计 */
+@media (max-width: 1024px) and (min-width: 768px) {
+    .container {
+        max-width: 90%;
+        padding: 20px;
+    }
+    
+    header h1 {
+        font-size: 2.2rem;
+    }
+    
+    .hot-item {
+        padding: 18px;
+    }
+    
+    .hot-title {
+        font-size: 1.1rem;
+    }
+}
+
+@media (max-width: 768px) {
+    body {
+        background-color: #f8f9fa;
+    }
+    
+    .container {
+        max-width: 95%;
+        margin: 12px auto;
+        padding: 16px;
+        border-radius: 12px;
+    }
+    
+    header {
+        margin-bottom: 20px;
+        padding-bottom: 16px;
+    }
+    
+    header h1 {
+        font-size: 1.8rem;
+        margin-bottom: 10px;
+    }
+    
+    .update-time {
+        font-size: 0.85rem;
+        padding: 6px 12px;
+    }
+    
+    .hot-item {
+        padding: 16px;
+        margin-bottom: 12px;
+        border-radius: 10px;
+        flex-direction: row;
+        align-items: flex-start;
+    }
+    
+    .hot-rank {
+        font-size: 1.1rem;
+        margin-right: 14px;
+        min-width: 32px;
+        width: 32px;
+        height: 32px;
+        margin-top: 2px;
+    }
+    
+    .hot-title {
+        font-size: 1rem;
+        line-height: 1.5;
+        margin-bottom: 6px;
+    }
+    
+    footer {
+        margin-top: 24px;
+        padding-top: 16px;
+        font-size: 0.85rem;
+    }
+}
+
+@media (max-width: 480px) {
+    .container {
+        margin: 8px auto;
+        padding: 14px;
+    }
+    
+    header h1 {
+        font-size: 1.6rem;
+    }
+    
+    .hot-item {
+        padding: 14px;
+        margin-bottom: 10px;
+    }
+    
+    .hot-rank {
+        font-size: 1rem;
+        margin-right: 12px;
+        min-width: 30px;
+        width: 30px;
+        height: 30px;
+    }
+    
+    .hot-title {
+        font-size: 0.95rem;
+    }
+}
+
+/* 减少动画以节省电池 */
+@media (prefers-reduced-motion: reduce) {
+    .modern-gradient,
+    .modern-gradient::before {
+        animation: none;
+    }
+    
+    .modern-gradient {
+        background: linear-gradient(
+            135deg,
+            rgba(64, 169, 255, 0.3) 0%,
+            rgba(255, 175, 64, 0.2) 50%,
+            rgba(255, 122, 69, 0.25) 100%
+        );
+    }
+}

frontend/public/60sapi/热搜榜单/微博热搜榜/img/qeye.svg

@@ -0,0 +1,42 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="100" height="60" viewBox="0 0 100 60" xmlns="http://www.w3.org/2000/svg">
+  <!-- 脸部 -->
+  <circle cx="50" cy="30" r="25" fill="#FFD6A5" />
+  
+  <!-- 左眼 -->
+  <g id="left-eye">
+    <circle cx="40" cy="25" r="5" fill="white" />
+    <circle cx="40" cy="25" r="2.5" fill="#333" class="pupil" />
+    <!-- 眨眼动画 -->
+    <animate 
+      xlink:href="#left-eye"
+      attributeName="transform"
+      attributeType="XML"
+      type="scale"
+      values="1 1; 1 0.1; 1 1"
+      dur="3s"
+      repeatCount="indefinite" />
+  </g>
+  
+  <!-- 右眼 -->
+  <g id="right-eye">
+    <circle cx="60" cy="25" r="5" fill="white" />
+    <circle cx="60" cy="25" r="2.5" fill="#333" class="pupil" />
+    <!-- 眨眼动画 -->
+    <animate 
+      xlink:href="#right-eye"
+      attributeName="transform"
+      attributeType="XML"
+      type="scale"
+      values="1 1; 1 0.1; 1 1"
+      dur="3s"
+      repeatCount="indefinite" />
+  </g>
+  
+  <!-- 嘴巴 -->
+  <path d="M45,35 Q50,40 55,35" stroke="#FF9999" stroke-width="2" fill="none" />
+  
+  <!-- 腮红 -->
+  <circle cx="35" cy="30" r="3" fill="#FF9999" opacity="0.5" />
+  <circle cx="65" cy="30" r="3" fill="#FF9999" opacity="0.5" />
+</svg>

frontend/public/60sapi/热搜榜单/微博热搜榜/index.html

@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>微博热搜榜</title>
+    <link rel="stylesheet" href="./css/style.css">
+    <link rel="stylesheet" href="./css/background.css">
+</head>
+<body>
+    <div class="background-container">
+        <div class="modern-gradient"></div>
+    </div>
+    
+    <div class="container">
+        <header>
+            <h1>🌈 微博热搜榜 🌈</h1>
+            <div class="update-time" id="updateTime"></div>
+        </header>
+        
+        <main>
+            <div class="hot-list" id="hotList">
+                <div class="loading">加载中...</div>
+            </div>
+        </main>
+        
+        <footer>
+            <p>数据来源于微博热搜榜</p>
+        </footer>
+    </div>
+    
+    <script src="./js/main.js"></script>
+</body>
+</html>

frontend/public/60sapi/热搜榜单/微博热搜榜/js/main.js

@@ -0,0 +1,90 @@
+// API接口列表
+const API_ENDPOINTS = [
+    "https://60s.api.shumengya.top/v2/weibo",
+];
+
+// 当前使用的API索引
+let currentApiIndex = 0;
+
+// DOM元素
+const hotListElement = document.getElementById('hotList');
+const updateTimeElement = document.getElementById('updateTime');
+
+// 格式化时间
+function formatDate(date) {
+    const year = date.getFullYear();
+    const month = String(date.getMonth() + 1).padStart(2, '0');
+    const day = String(date.getDate()).padStart(2, '0');
+    const hours = String(date.getHours()).padStart(2, '0');
+    const minutes = String(date.getMinutes()).padStart(2, '0');
+    const seconds = String(date.getSeconds()).padStart(2, '0');
+    
+    return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
+}
+
+// 渲染热搜列表
+function renderHotList(data) {
+    hotListElement.innerHTML = '';
+    
+    data.forEach((item, index) => {
+        const hotItem = document.createElement('div');
+        hotItem.className = 'hot-item';
+        
+        const rankClass = index < 3 ? `top-${index + 1}` : '';
+        
+        hotItem.innerHTML = `
+            <div class="hot-rank ${rankClass}">${index + 1}</div>
+            <div class="hot-content">
+                <a href="${item.link}" class="hot-title" target="_blank">${item.title}</a>
+                ${item.hot_value ? `<div class="hot-value">${item.hot_value}</div>` : ''}
+            </div>
+        `;
+        
+        hotListElement.appendChild(hotItem);
+    });
+    
+    // 更新时间
+    updateTimeElement.textContent = `更新时间：${formatDate(new Date())}`;
+}
+
+// 获取微博热搜数据
+async function fetchWeiboHotList() {
+    try {
+        const response = await fetch(API_ENDPOINTS[currentApiIndex]);
+        
+        if (!response.ok) {
+            throw new Error('网络响应不正常');
+        }
+        
+        const result = await response.json();
+        
+        if (result.code === 200 && result.data) {
+            renderHotList(result.data);
+        } else {
+            throw new Error('数据格式错误');
+        }
+    } catch (error) {
+        console.error('获取数据失败:', error);
+        
+        // 尝试切换到下一个API
+        currentApiIndex = (currentApiIndex + 1) % API_ENDPOINTS.length;
+        
+        // 显示错误信息
+        hotListElement.innerHTML = `
+            <div class="loading">
+                获取数据失败，正在尝试其他接口...
+            </div>
+        `;
+        
+        // 延迟后重试
+        setTimeout(fetchWeiboHotList, 2000);
+    }
+}
+
+// 页面加载完成后获取数据
+document.addEventListener('DOMContentLoaded', () => {
+    fetchWeiboHotList();
+    
+    // 每隔5分钟刷新一次数据
+    setInterval(fetchWeiboHotList, 5 * 60 * 1000);
+});

frontend/public/60sapi/热搜榜单/微博热搜榜/接口集合.json

@@ -0,0 +1,3 @@
+[
+    "https://60s.api.shumengya.top"
+]

frontend/public/60sapi/热搜榜单/微博热搜榜/返回接口.json

@@ -0,0 +1,261 @@
+{
+  "code": 200,
+  "message": "获取成功。数据来自官方/权威源头，以确保稳定与实时。开源地址 https://github.com/vikiboss/60s，反馈群 595941841",
+  "data": [
+    {
+      "title": "00后男生0.6秒飞针采血惊呆患者",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=00%E5%90%8E%E7%94%B7%E7%94%9F0.6%E7%A7%92%E9%A3%9E%E9%92%88%E9%87%87%E8%A1%80%E6%83%8A%E5%91%86%E6%82%A3%E8%80%85"
+    },
+    {
+      "title": "普京带3位副总理10多位部长到中国",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E6%99%AE%E4%BA%AC%E5%B8%A63%E4%BD%8D%E5%89%AF%E6%80%BB%E7%90%8610%E5%A4%9A%E4%BD%8D%E9%83%A8%E9%95%BF%E5%88%B0%E4%B8%AD%E5%9B%BD"
+    },
+    {
+      "title": "始终高举上海精神旗帜",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%A7%8B%E7%BB%88%E9%AB%98%E4%B8%BE%E4%B8%8A%E6%B5%B7%E7%B2%BE%E7%A5%9E%E6%97%97%E5%B8%9C"
+    },
+    {
+      "title": "女生苦练化妆1年的变化",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%A5%B3%E7%94%9F%E8%8B%A6%E7%BB%83%E5%8C%96%E5%A6%861%E5%B9%B4%E7%9A%84%E5%8F%98%E5%8C%96"
+    },
+    {
+      "title": "香港1200架无人机重现日本投降矣",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E9%A6%99%E6%B8%AF1200%E6%9E%B6%E6%97%A0%E4%BA%BA%E6%9C%BA%E9%87%8D%E7%8E%B0%E6%97%A5%E6%9C%AC%E6%8A%95%E9%99%8D%E7%9F%A3"
+    },
+    {
+      "title": "尚公主全阵容官宣",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%B0%9A%E5%85%AC%E4%B8%BB%E5%85%A8%E9%98%B5%E5%AE%B9%E5%AE%98%E5%AE%A3"
+    },
+    {
+      "title": "真的可以永远相信刘宇舞台",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E7%9C%9F%E7%9A%84%E5%8F%AF%E4%BB%A5%E6%B0%B8%E8%BF%9C%E7%9B%B8%E4%BF%A1%E5%88%98%E5%AE%87%E8%88%9E%E5%8F%B0"
+    },
+    {
+      "title": "九三阅兵徒步方队铿锵步伐",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E4%B9%9D%E4%B8%89%E9%98%85%E5%85%B5%E5%BE%92%E6%AD%A5%E6%96%B9%E9%98%9F%E9%93%BF%E9%94%B5%E6%AD%A5%E4%BC%90"
+    },
+    {
+      "title": "唐朝诡事录",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%94%90%E6%9C%9D%E8%AF%A1%E4%BA%8B%E5%BD%95"
+    },
+    {
+      "title": "抗战胜利80周年第3场记者招待会",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E6%8A%97%E6%88%98%E8%83%9C%E5%88%A980%E5%91%A8%E5%B9%B4%E7%AC%AC3%E5%9C%BA%E8%AE%B0%E8%80%85%E6%8B%9B%E5%BE%85%E4%BC%9A"
+    },
+    {
+      "title": "王曼昱钱天一3比2蒯曼孙颖莎",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E7%8E%8B%E6%9B%BC%E6%98%B1%E9%92%B1%E5%A4%A9%E4%B8%803%E6%AF%942%E8%92%AF%E6%9B%BC%E5%AD%99%E9%A2%96%E8%8E%8E"
+    },
+    {
+      "title": "张维伊对96岁的姥姥说长命百岁",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%BC%A0%E7%BB%B4%E4%BC%8A%E5%AF%B996%E5%B2%81%E7%9A%84%E5%A7%A5%E5%A7%A5%E8%AF%B4%E9%95%BF%E5%91%BD%E7%99%BE%E5%B2%81"
+    },
+    {
+      "title": "孟子义李昀锐定妆照",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%AD%9F%E5%AD%90%E4%B9%89%E6%9D%8E%E6%98%80%E9%94%90%E5%AE%9A%E5%A6%86%E7%85%A7"
+    },
+    {
+      "title": "以为张艺兴穿的蓝色抹胸",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E4%BB%A5%E4%B8%BA%E5%BC%A0%E8%89%BA%E5%85%B4%E7%A9%BF%E7%9A%84%E8%93%9D%E8%89%B2%E6%8A%B9%E8%83%B8"
+    },
+    {
+      "title": "尚公主开机",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%B0%9A%E5%85%AC%E4%B8%BB%E5%BC%80%E6%9C%BA"
+    },
+    {
+      "title": "心动的信号8",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%BF%83%E5%8A%A8%E7%9A%84%E4%BF%A1%E5%8F%B78"
+    },
+    {
+      "title": "霍建华病娇疯批演爽了",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E9%9C%8D%E5%BB%BA%E5%8D%8E%E7%97%85%E5%A8%87%E7%96%AF%E6%89%B9%E6%BC%94%E7%88%BD%E4%BA%86"
+    },
+    {
+      "title": "普京抵达天津",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E6%99%AE%E4%BA%AC%E6%8A%B5%E8%BE%BE%E5%A4%A9%E6%B4%A5"
+    },
+    {
+      "title": "龚俊的体面只给旅游前几天",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E9%BE%9A%E4%BF%8A%E7%9A%84%E4%BD%93%E9%9D%A2%E5%8F%AA%E7%BB%99%E6%97%85%E6%B8%B8%E5%89%8D%E5%87%A0%E5%A4%A9"
+    },
+    {
+      "title": "开学焦虑更严重的另有其人",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%BC%80%E5%AD%A6%E7%84%A6%E8%99%91%E6%9B%B4%E4%B8%A5%E9%87%8D%E7%9A%84%E5%8F%A6%E6%9C%89%E5%85%B6%E4%BA%BA"
+    },
+    {
+      "title": "那英小发雷霆",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E9%82%A3%E8%8B%B1%E5%B0%8F%E5%8F%91%E9%9B%B7%E9%9C%86"
+    },
+    {
+      "title": "居然有演员一句台词背1小时",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%B1%85%E7%84%B6%E6%9C%89%E6%BC%94%E5%91%98%E4%B8%80%E5%8F%A5%E5%8F%B0%E8%AF%8D%E8%83%8C1%E5%B0%8F%E6%97%B6"
+    },
+    {
+      "title": "谁教魏哲鸣冷脸跳这些的",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E8%B0%81%E6%95%99%E9%AD%8F%E5%93%B2%E9%B8%A3%E5%86%B7%E8%84%B8%E8%B7%B3%E8%BF%99%E4%BA%9B%E7%9A%84"
+    },
+    {
+      "title": "朱孝天爆冷出局",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E6%9C%B1%E5%AD%9D%E5%A4%A9%E7%88%86%E5%86%B7%E5%87%BA%E5%B1%80"
+    },
+    {
+      "title": "俄军称掌握战略主动权",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E4%BF%84%E5%86%9B%E7%A7%B0%E6%8E%8C%E6%8F%A1%E6%88%98%E7%95%A5%E4%B8%BB%E5%8A%A8%E6%9D%83"
+    },
+    {
+      "title": "谈恋爱3个月定律",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E8%B0%88%E6%81%8B%E7%88%B13%E4%B8%AA%E6%9C%88%E5%AE%9A%E5%BE%8B"
+    },
+    {
+      "title": "沈腾说错了最怕人笨还不勤快",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E6%B2%88%E8%85%BE%E8%AF%B4%E9%94%99%E4%BA%86%E6%9C%80%E6%80%95%E4%BA%BA%E7%AC%A8%E8%BF%98%E4%B8%8D%E5%8B%A4%E5%BF%AB"
+    },
+    {
+      "title": "王菲最新状态",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E7%8E%8B%E8%8F%B2%E6%9C%80%E6%96%B0%E7%8A%B6%E6%80%81"
+    },
+    {
+      "title": "张紫宁转行当拉拉队经理人了",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%BC%A0%E7%B4%AB%E5%AE%81%E8%BD%AC%E8%A1%8C%E5%BD%93%E6%8B%89%E6%8B%89%E9%98%9F%E7%BB%8F%E7%90%86%E4%BA%BA%E4%BA%86"
+    },
+    {
+      "title": "金价大涨两大原因",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E9%87%91%E4%BB%B7%E5%A4%A7%E6%B6%A8%E4%B8%A4%E5%A4%A7%E5%8E%9F%E5%9B%A0"
+    },
+    {
+      "title": "陕西Shaanxi官方标准拼音",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E9%99%95%E8%A5%BFShaanxi%E5%AE%98%E6%96%B9%E6%A0%87%E5%87%86%E6%8B%BC%E9%9F%B3"
+    },
+    {
+      "title": "边伯贤跳刀马刀马",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E8%BE%B9%E4%BC%AF%E8%B4%A4%E8%B7%B3%E5%88%80%E9%A9%AC%E5%88%80%E9%A9%AC"
+    },
+    {
+      "title": "冷冻太久的肉就不要再吃了",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%86%B7%E5%86%BB%E5%A4%AA%E4%B9%85%E7%9A%84%E8%82%89%E5%B0%B1%E4%B8%8D%E8%A6%81%E5%86%8D%E5%90%83%E4%BA%86"
+    },
+    {
+      "title": "95后00后恋爱有代沟",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=95%E5%90%8E00%E5%90%8E%E6%81%8B%E7%88%B1%E6%9C%89%E4%BB%A3%E6%B2%9F"
+    },
+    {
+      "title": "易烊千玺抢票",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E6%98%93%E7%83%8A%E5%8D%83%E7%8E%BA%E6%8A%A2%E7%A5%A8"
+    },
+    {
+      "title": "孙闻被乒协处罚",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%AD%99%E9%97%BB%E8%A2%AB%E4%B9%92%E5%8D%8F%E5%A4%84%E7%BD%9A"
+    },
+    {
+      "title": "这居然是白举纲",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E8%BF%99%E5%B1%85%E7%84%B6%E6%98%AF%E7%99%BD%E4%B8%BE%E7%BA%B2"
+    },
+    {
+      "title": "纪凌尘出演孟子义新剧",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E7%BA%AA%E5%87%8C%E5%B0%98%E5%87%BA%E6%BC%94%E5%AD%9F%E5%AD%90%E4%B9%89%E6%96%B0%E5%89%A7"
+    },
+    {
+      "title": "外卖员妈妈暴雨中将孩子托付派出所",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%A4%96%E5%8D%96%E5%91%98%E5%A6%88%E5%A6%88%E6%9A%B4%E9%9B%A8%E4%B8%AD%E5%B0%86%E5%AD%A9%E5%AD%90%E6%89%98%E4%BB%98%E6%B4%BE%E5%87%BA%E6%89%80"
+    },
+    {
+      "title": "我点外卖没用上券就这样",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E6%88%91%E7%82%B9%E5%A4%96%E5%8D%96%E6%B2%A1%E7%94%A8%E4%B8%8A%E5%88%B8%E5%B0%B1%E8%BF%99%E6%A0%B7"
+    },
+    {
+      "title": "孙颖莎小时候真来过新疆",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%AD%99%E9%A2%96%E8%8E%8E%E5%B0%8F%E6%97%B6%E5%80%99%E7%9C%9F%E6%9D%A5%E8%BF%87%E6%96%B0%E7%96%86"
+    },
+    {
+      "title": "印尼首都交通瘫痪",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%8D%B0%E5%B0%BC%E9%A6%96%E9%83%BD%E4%BA%A4%E9%80%9A%E7%98%AB%E7%97%AA"
+    },
+    {
+      "title": "停狗位停满了小狗",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%81%9C%E7%8B%97%E4%BD%8D%E5%81%9C%E6%BB%A1%E4%BA%86%E5%B0%8F%E7%8B%97"
+    },
+    {
+      "title": "怪不得校服裤子屁股锃亮",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E6%80%AA%E4%B8%8D%E5%BE%97%E6%A0%A1%E6%9C%8D%E8%A3%A4%E5%AD%90%E5%B1%81%E8%82%A1%E9%94%83%E4%BA%AE"
+    },
+    {
+      "title": "这一幕幕中国浪漫看得心暖暖",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E8%BF%99%E4%B8%80%E5%B9%95%E5%B9%95%E4%B8%AD%E5%9B%BD%E6%B5%AA%E6%BC%AB%E7%9C%8B%E5%BE%97%E5%BF%83%E6%9A%96%E6%9A%96"
+    },
+    {
+      "title": "林书豪退役",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E6%9E%97%E4%B9%A6%E8%B1%AA%E9%80%80%E5%BD%B9"
+    },
+    {
+      "title": "小猫咪舔毛把自己累睡着",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%B0%8F%E7%8C%AB%E5%92%AA%E8%88%94%E6%AF%9B%E6%8A%8A%E8%87%AA%E5%B7%B1%E7%B4%AF%E7%9D%A1%E7%9D%80"
+    },
+    {
+      "title": "iPhone17国行预计涨价500元",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=iPhone17%E5%9B%BD%E8%A1%8C%E9%A2%84%E8%AE%A1%E6%B6%A8%E4%BB%B7500%E5%85%83"
+    },
+    {
+      "title": "土耳其总统埃尔多安抵达天津",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%9C%9F%E8%80%B3%E5%85%B6%E6%80%BB%E7%BB%9F%E5%9F%83%E5%B0%94%E5%A4%9A%E5%AE%89%E6%8A%B5%E8%BE%BE%E5%A4%A9%E6%B4%A5"
+    },
+    {
+      "title": "脱口秀和Ta的朋友们",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E8%84%B1%E5%8F%A3%E7%A7%80%E5%92%8CTa%E7%9A%84%E6%9C%8B%E5%8F%8B%E4%BB%AC"
+    },
+    {
+      "title": "孟子义暮晚摇",
+      "hot_value": 0,
+      "link": "https://s.weibo.com/weibo?q=%E5%AD%9F%E5%AD%90%E4%B9%89%E6%9A%AE%E6%99%9A%E6%91%87"
+    }
+  ]
+}

frontend/public/60sapi/热搜榜单/抖音热搜榜/css/background.css

@@ -0,0 +1,52 @@
+/* 背景相关样式 */
+body {
+    background: linear-gradient(135deg, #e8f5e8 0%, #c8e6c9 25%, #a5d6a7 50%, #81c784 75%, #66bb6a 100%);
+    background-attachment: fixed;
+    min-height: 100vh;
+    position: relative;
+}
+
+/* 背景装饰元素 */
+body::before {
+    content: '';
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-image: 
+        radial-gradient(circle at 20% 80%, rgba(120, 200, 120, 0.15) 0%, transparent 50%),
+        radial-gradient(circle at 80% 20%, rgba(100, 180, 100, 0.15) 0%, transparent 50%),
+        radial-gradient(circle at 40% 40%, rgba(140, 220, 140, 0.1) 0%, transparent 50%),
+        radial-gradient(circle at 60% 70%, rgba(160, 240, 160, 0.08) 0%, transparent 40%);
+    pointer-events: none;
+    z-index: -1;
+}
+
+/* 浮动装饰圆点 */
+body::after {
+    content: '';
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-image: 
+        radial-gradient(circle at 10% 10%, rgba(76, 175, 80, 0.1) 2px, transparent 2px),
+        radial-gradient(circle at 90% 90%, rgba(76, 175, 80, 0.08) 1px, transparent 1px),
+        radial-gradient(circle at 30% 80%, rgba(76, 175, 80, 0.06) 1.5px, transparent 1.5px),
+        radial-gradient(circle at 70% 20%, rgba(76, 175, 80, 0.05) 1px, transparent 1px);
+    background-size: 100px 100px, 150px 150px, 80px 80px, 120px 120px;
+    animation: float 20s ease-in-out infinite alternate;
+    pointer-events: none;
+    z-index: -1;
+}
+
+@keyframes float {
+    0% {
+        transform: translateY(0px) rotate(0deg);
+    }
+    100% {
+        transform: translateY(-10px) rotate(1deg);
+    }
+}

frontend/public/60sapi/热搜榜单/抖音热搜榜/css/style.css

@@ -0,0 +1,535 @@
+/* 背景样式 */
+.background-container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: -1;
+    overflow: hidden;
+    background-color: #f8f9fa;
+}
+
+.modern-gradient {
+    position: absolute;
+    top: -50%;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: linear-gradient(
+        135deg,
+        rgba(64, 169, 255, 0.4) 0%,
+        rgba(120, 192, 255, 0.3) 25%,
+        rgba(255, 175, 64, 0.2) 50%,
+        rgba(255, 140, 50, 0.3) 75%,
+        rgba(255, 122, 69, 0.4) 100%
+    );
+    animation: gradient-flow 20s ease-in-out infinite;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+.modern-gradient::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: radial-gradient(
+        circle at 30% 70%,
+        rgba(64, 169, 255, 0.5) 0%,
+        transparent 50%
+    ), radial-gradient(
+        circle at 70% 30%,
+        rgba(255, 140, 50, 0.4) 0%,
+        transparent 50%
+    );
+    animation: pulse-effect 15s ease-in-out infinite alternate;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+@keyframes gradient-flow {
+    0%, 100% {
+        transform: rotate(0deg) scale(1);
+        opacity: 0.8;
+    }
+    25% {
+        transform: rotate(90deg) scale(1.1);
+        opacity: 0.6;
+    }
+    50% {
+        transform: rotate(180deg) scale(0.9);
+        opacity: 0.9;
+    }
+    75% {
+        transform: rotate(270deg) scale(1.05);
+        opacity: 0.7;
+    }
+}
+
+@keyframes pulse-effect {
+    0% {
+        transform: scale(1) rotate(0deg);
+        opacity: 0.5;
+    }
+    50% {
+        transform: scale(1.2) rotate(180deg);
+        opacity: 0.8;
+    }
+    100% {
+        transform: scale(1) rotate(360deg);
+        opacity: 0.6;
+    }
+}
+
+/* 主样式 */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+    font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
+    color: #333;
+    background-color: #f8f9fa;
+    position: relative;
+    min-height: 100vh;
+}
+
+.container {
+    max-width: 800px;
+    margin: 0 auto;
+    padding: 24px;
+    position: relative;
+    z-index: 1;
+    background-color: rgba(255, 255, 255, 0.85);
+    border-radius: 16px;
+    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
+    backdrop-filter: blur(10px);
+}
+
+header {
+    text-align: center;
+    margin-bottom: 28px;
+    padding-bottom: 20px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
+}
+
+header h1 {
+    background: linear-gradient(135deg, #4096ff, #ff7a45);
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+    margin-bottom: 14px;
+    font-size: 2.4rem;
+    font-weight: 700;
+    letter-spacing: -0.5px;
+}
+
+.update-time {
+    color: #666;
+    font-size: 0.9rem;
+    background-color: rgba(0, 0, 0, 0.03);
+    padding: 8px 16px;
+    border-radius: 24px;
+    display: inline-block;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
+}
+
+/* 热搜列表 - 移动端优先设计 */
+.hot-list {
+    list-style: none;
+}
+
+.hot-item {
+    background: white;
+    border-radius: 16px;
+    padding: 16px;
+    margin-bottom: 12px;
+    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
+    transition: all 0.3s ease;
+    border: 1px solid rgba(0, 0, 0, 0.05);
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    position: relative;
+    overflow: hidden;
+}
+
+.hot-item:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
+    border-color: rgba(64, 169, 255, 0.2);
+}
+
+/* 排名容器 */
+.hot-rank-container {
+    flex-shrink: 0;
+    display: flex;
+    align-items: center;
+}
+
+.hot-rank {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    width: 48px;
+    height: 48px;
+    border-radius: 12px;
+    background: linear-gradient(135deg, #f0f0f0, #e8e8e8);
+    color: #666;
+    font-weight: 600;
+    position: relative;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+}
+
+.hot-rank.rank-1 {
+    background: linear-gradient(135deg, #ff4d4f, #ff7a45);
+    color: white;
+    box-shadow: 0 4px 12px rgba(255, 77, 79, 0.3);
+}
+
+.hot-rank.rank-2 {
+    background: linear-gradient(135deg, #ff7a45, #ffa940);
+    color: white;
+    box-shadow: 0 4px 12px rgba(255, 122, 69, 0.3);
+}
+
+.hot-rank.rank-3 {
+    background: linear-gradient(135deg, #ffa940, #ffec3d);
+    color: #333;
+    box-shadow: 0 4px 12px rgba(255, 169, 64, 0.3);
+}
+
+.rank-number {
+    font-size: 0.9rem;
+    font-weight: 700;
+    line-height: 1;
+}
+
+.rank-emoji {
+    font-size: 0.7rem;
+    line-height: 1;
+    margin-top: 1px;
+}
+
+/* 内容包装器 */
+.hot-content-wrapper {
+    flex: 1;
+    min-width: 0;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    gap: 8px;
+}
+
+/* 标题 */
+.hot-title {
+    font-size: 1rem;
+    font-weight: 600;
+    color: #333;
+    line-height: 1.3;
+    margin: 0;
+    display: -webkit-box;
+    -webkit-line-clamp: 1;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    cursor: pointer;
+    transition: color 0.2s ease;
+}
+
+.hot-title:hover {
+    color: #4096ff;
+}
+
+/* 底部行 */
+.hot-bottom-row {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    flex-wrap: nowrap;
+}
+
+.hot-time {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    color: #666;
+    font-size: 0.8rem;
+    flex-shrink: 0;
+}
+
+.meta-icon {
+    font-size: 0.9rem;
+    flex-shrink: 0;
+}
+
+.meta-text {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.hot-value {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    background: linear-gradient(135deg, #ff6b6b, #4ecdc4);
+    color: white;
+    padding: 4px 10px;
+    border-radius: 12px;
+    font-size: 0.75rem;
+    font-weight: 600;
+    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
+    flex-shrink: 0;
+}
+
+.heat-level {
+    font-size: 0.8rem;
+}
+
+.value-text {
+    font-size: 0.75rem;
+}
+
+/* 图片样式 */
+.hot-cover {
+    width: 80px;
+    height: 60px;
+    object-fit: cover;
+    border-radius: 8px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+    flex-shrink: 0;
+}
+
+.hot-link {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    background: linear-gradient(135deg, #4096ff, #40a9ff);
+    color: white;
+    text-decoration: none;
+    padding: 6px 12px;
+    border-radius: 12px;
+    font-size: 0.75rem;
+    font-weight: 600;
+    transition: all 0.3s ease;
+    box-shadow: 0 2px 6px rgba(64, 150, 255, 0.3);
+    flex-shrink: 0;
+}
+
+.hot-link:hover {
+    transform: translateY(-1px);
+    box-shadow: 0 4px 10px rgba(64, 150, 255, 0.4);
+    text-decoration: none;
+    color: white;
+}
+
+.link-icon {
+    font-size: 0.8rem;
+}
+
+.link-text {
+    font-size: 0.75rem;
+}
+
+.loading {
+    text-align: center;
+    padding: 40px;
+    color: #666;
+    font-size: 1.1rem;
+}
+
+footer {
+    text-align: center;
+    margin-top: 30px;
+    padding-top: 20px;
+    border-top: 1px solid rgba(0, 0, 0, 0.06);
+    color: #666;
+    font-size: 0.9rem;
+}
+
+/* 响应式设计 - 移动端优化 */
+@media (max-width: 1024px) and (min-width: 768px) {
+    .container {
+        max-width: 90%;
+        padding: 20px;
+    }
+    
+    header h1 {
+        font-size: 2.2rem;
+    }
+    
+    .hot-item {
+        padding: 18px;
+        gap: 14px;
+    }
+    
+    .hot-rank {
+        width: 52px;
+        height: 52px;
+    }
+    
+    .hot-title {
+        font-size: 1.1rem;
+    }
+}
+
+@media (max-width: 768px) {
+    .container {
+        max-width: 95%;
+        margin: 12px auto;
+        padding: 8px;
+        border-radius: 12px;
+    }
+    
+    header {
+        margin-bottom: 20px;
+        padding: 12px 0 16px 0;
+    }
+    
+    header h1 {
+        font-size: 1.8rem;
+        margin-bottom: 10px;
+    }
+    
+    .update-time {
+        font-size: 0.85rem;
+        padding: 6px 12px;
+    }
+    
+    .hot-item {
+        padding: 12px;
+        margin-bottom: 10px;
+        gap: 10px;
+    }
+    
+    .hot-rank {
+        width: 40px;
+        height: 40px;
+    }
+    
+    .rank-number {
+        font-size: 0.8rem;
+    }
+    
+    .rank-emoji {
+        font-size: 0.6rem;
+    }
+    
+    .hot-title {
+        font-size: 0.9rem;
+        line-height: 1.3;
+    }
+    
+    .hot-meta-row {
+        gap: 8px;
+    }
+    
+    .hot-time {
+        font-size: 0.75rem;
+    }
+    
+    .hot-value {
+        padding: 3px 8px;
+        font-size: 0.7rem;
+    }
+    
+    .hot-cover {
+        width: 70px;
+        height: 50px;
+    }
+    
+    .hot-link {
+        padding: 5px 10px;
+        font-size: 0.7rem;
+    }
+    
+    .link-text {
+        font-size: 0.7rem;
+    }
+    
+    footer {
+        margin-top: 24px;
+        padding-top: 16px;
+        font-size: 0.85rem;
+    }
+}
+
+@media (max-width: 480px) {
+    .container {
+        margin: 8px auto;
+        padding: 6px;
+    }
+    
+    header h1 {
+        font-size: 1.6rem;
+    }
+    
+    .hot-item {
+        padding: 10px;
+        margin-bottom: 8px;
+        gap: 8px;
+    }
+    
+    .hot-rank {
+        width: 36px;
+        height: 36px;
+    }
+    
+    .rank-number {
+        font-size: 0.75rem;
+    }
+    
+    .hot-title {
+        font-size: 0.85rem;
+    }
+    
+    .hot-meta-row {
+        flex-direction: column;
+        align-items: flex-start;
+        gap: 6px;
+    }
+    
+    .hot-media-row {
+        gap: 8px;
+    }
+    
+    .hot-time {
+        font-size: 0.7rem;
+    }
+    
+    .hot-value {
+        font-size: 0.65rem;
+    }
+    
+    .hot-cover {
+        width: 60px;
+        height: 45px;
+    }
+    
+    .hot-link {
+        font-size: 0.65rem;
+        padding: 4px 8px;
+    }
+}
+
+/* 减少动画以节省电池 */
+@media (prefers-reduced-motion: reduce) {
+    .modern-gradient,
+    .modern-gradient::before {
+        animation: none;
+    }
+    
+    .modern-gradient {
+        background: linear-gradient(
+            135deg,
+            rgba(64, 169, 255, 0.3) 0%,
+            rgba(255, 175, 64, 0.2) 50%,
+            rgba(255, 122, 69, 0.25) 100%
+        );
+    }
+}

frontend/public/60sapi/热搜榜单/抖音热搜榜/index.html

@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>抖音热搜榜</title>
+    <link rel="stylesheet" href="css/background.css">
+    <link rel="stylesheet" href="css/style.css">
+</head>
+<body>
+    <div class="container">
+        <header class="header">
+            <div class="header-icon">🔥</div>
+            <h1 class="title">📱 抖音热搜榜 🎵</h1>
+            <p class="subtitle">实时热门话题 · 紧跟潮流趋势</p>
+            <div class="update-time">
+                <span class="time-icon">⏰</span>
+                <span id="updateTime">加载中...</span>
+            </div>
+            <button id="refreshBtn" class="refresh-btn">
+                <span class="btn-icon">🔄</span>
+                刷新数据
+            </button>
+        </header>
+
+        <div class="loading" id="loading">
+            <div class="loading-content">
+                <div class="spinner"></div>
+                <div class="loading-text">
+                    <span class="loading-emoji">🎭</span>
+                    <p>正在获取最新热搜...</p>
+                    <div class="loading-dots">
+                        <span></span>
+                        <span></span>
+                        <span></span>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="hot-list" id="hotList">
+            <!-- 热搜列表将动态生成 -->
+        </div>
+
+        <div class="error-message" id="errorMessage" style="display: none;">
+            <div class="error-content">
+                <div class="error-icon">😵</div>
+                <h3>加载失败了</h3>
+                <p>网络连接出现问题，请稍后重试</p>
+                <button onclick="loadHotList()" class="retry-btn">
+                    <span>🔄</span>
+                    重新加载
+                </button>
+            </div>
+        </div>
+    </div>
+
+    <script src="js/script.js"></script>
+</body>
+</html>

frontend/public/60sapi/热搜榜单/抖音热搜榜/js/script.js

@@ -0,0 +1,332 @@
+// 本地后端API接口
+const LOCAL_API_BASE = 'https://infogenie.api.shumengya.top/api/60s';
+
+// API接口列表（备用）
+const API_ENDPOINTS = [
+    "https://60s.api.shumengya.top",
+];
+
+// 当前使用的API索引
+let currentApiIndex = 0;
+let useLocalApi = true;
+
+// DOM元素
+const loadingElement = document.getElementById('loading');
+const hotListElement = document.getElementById('hotList');
+const errorMessageElement = document.getElementById('errorMessage');
+const updateTimeElement = document.getElementById('updateTime');
+const refreshBtn = document.getElementById('refreshBtn');
+
+// 页面加载完成后自动加载数据
+document.addEventListener('DOMContentLoaded', function() {
+    loadHotList();
+});
+
+// 刷新按钮点击事件
+refreshBtn.addEventListener('click', function() {
+    loadHotList();
+});
+
+// 加载热搜列表
+async function loadHotList() {
+    showLoading();
+    hideError();
+    
+    try {
+        const data = await fetchData();
+        displayHotList(data.data);
+        updateRefreshTime();
+    } catch (error) {
+        console.error('加载失败:', error);
+        showError();
+    }
+    
+    hideLoading();
+}
+
+// 获取数据
+async function fetchData() {
+    // 优先尝试本地API
+    if (useLocalApi) {
+        try {
+            const response = await fetch(`${LOCAL_API_BASE}/douyin`, {
+                method: 'GET',
+                headers: {
+                    'Accept': 'application/json',
+                },
+                timeout: 10000
+            });
+            
+            if (response.ok) {
+                const data = await response.json();
+                if (data.code === 200 && data.data) {
+                    return data;
+                }
+            }
+        } catch (error) {
+            console.warn('本地API请求失败，切换到外部API:', error);
+            useLocalApi = false;
+        }
+    }
+    
+    // 使用外部API作为备用
+    for (let i = 0; i < API_ENDPOINTS.length; i++) {
+        const apiUrl = API_ENDPOINTS[currentApiIndex];
+        
+        try {
+            const response = await fetch(`${apiUrl}/v2/douyin`, {
+                method: 'GET',
+                headers: {
+                    'Accept': 'application/json',
+                },
+                timeout: 10000
+            });
+            
+            if (!response.ok) {
+                throw new Error(`HTTP ${response.status}`);
+            }
+            
+            const data = await response.json();
+            
+            if (data.code === 200 && data.data) {
+                return data;
+            } else {
+                throw new Error('数据格式错误');
+            }
+        } catch (error) {
+            console.error(`API ${apiUrl} 请求失败:`, error);
+            currentApiIndex = (currentApiIndex + 1) % API_ENDPOINTS.length;
+            
+            if (i === API_ENDPOINTS.length - 1) {
+                throw new Error('所有API接口都无法访问');
+            }
+        }
+    }
+}
+
+// 显示热搜列表
+function displayHotList(hotData) {
+    hotListElement.innerHTML = '';
+    
+    hotData.forEach((item, index) => {
+        const hotItem = createHotItem(item, index + 1);
+        hotListElement.appendChild(hotItem);
+    });
+}
+
+// 创建热搜项目
+function createHotItem(item, rank) {
+    const hotItem = document.createElement('div');
+    hotItem.className = 'hot-item';
+    
+    // 排名样式类
+    let rankClass = 'hot-rank';
+    if (rank === 1) rankClass += ' rank-1';
+    else if (rank === 2) rankClass += ' rank-2';
+    else if (rank === 3) rankClass += ' rank-3';
+    
+    const formattedHotValue = formatHotValue(item.hot_value);
+    const formattedTime = formatTime(item.event_time);
+    
+    // 根据排名添加特殊标识
+    let rankEmoji = '';
+    if (rank === 1) rankEmoji = '👑';
+    else if (rank === 2) rankEmoji = '🥈';
+    else if (rank === 3) rankEmoji = '🥉';
+    else if (rank <= 10) rankEmoji = '🔥';
+    
+    // 根据热度值添加火焰等级
+    let fireLevel = '';
+    if (item.hot_value >= 10000000) fireLevel = '🔥🔥🔥';
+    else if (item.hot_value >= 5000000) fireLevel = '🔥🔥';
+    else fireLevel = '🔥';
+    
+    hotItem.innerHTML = `
+        <div class="hot-rank-container">
+            <div class="${rankClass}">
+                <div class="rank-number">${rank}</div>
+                <div class="rank-emoji">${rankEmoji}</div>
+            </div>
+        </div>
+        <img src="${item.cover}" alt="${escapeHtml(item.title)}" class="hot-cover" onerror="handleImageError(this)">
+        <div class="hot-content-wrapper">
+            <div class="hot-title">${escapeHtml(item.title)}</div>
+            <div class="hot-bottom-row">
+                <div class="hot-time">
+                    <span class="meta-icon">⏰</span>
+                    <span class="meta-text">${formattedTime}</span>
+                </div>
+                <div class="hot-value">
+                    <span class="heat-level">${fireLevel}</span>
+                    <span class="value-text">${formattedHotValue}</span>
+                </div>
+                <a href="${item.link}" target="_blank" class="hot-link">
+                    <span class="link-icon">🎬</span>
+                    <span class="link-text">观看视频</span>
+                </a>
+            </div>
+        </div>
+    `;
+    
+    return hotItem;
+}
+
+// 格式化热度值
+function formatHotValue(value) {
+    if (value >= 100000000) {
+        return (value / 100000000).toFixed(1) + '亿';
+    } else if (value >= 10000) {
+        return (value / 10000).toFixed(1) + '万';
+    } else {
+        return value.toLocaleString();
+    }
+}
+
+// 格式化时间
+function formatTime(timeStr) {
+    try {
+        const formattedTime = timeStr.replace(/\//g, '-');
+        const date = new Date(formattedTime);
+        const now = new Date();
+        const diff = now - date;
+        const minutes = Math.floor(diff / (1000 * 60));
+        const hours = Math.floor(minutes / 60);
+        const days = Math.floor(hours / 24);
+        
+        if (days > 0) {
+            return `${days}天前`;
+        } else if (hours > 0) {
+            return `${hours}小时前`;
+        } else if (minutes > 0) {
+            return `${minutes}分钟前`;
+        } else {
+            return '刚刚';
+        }
+    } catch (error) {
+        return timeStr;
+    }
+}
+
+// HTML转义
+function escapeHtml(text) {
+    const div = document.createElement('div');
+    div.textContent = text;
+    return div.innerHTML;
+}
+
+// 图片加载错误处理
+function handleImageError(img) {
+    img.src = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAiIGhlaWdodD0iODAiIHZpZXdCb3g9IjAgMCA4MCA4MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjgwIiBoZWlnaHQ9IjgwIiBmaWxsPSIjZjVmNWY1Ii8+CjxwYXRoIGQ9Ik00MCAyMEM0NCAyMCA0NyAyMyA0NyAyN1Y1M0M0NyA1NyA0NCA2MCA0MCA2MEgxNkMxMiA2MCA5IDU3IDkgNTNWMjdDOSAyMyAxMiAyMCAxNiAyMEg0MFoiIHN0cm9rZT0iI2NjY2NjYyIgc3Ryb2tlLXdpZHRoPSIyIi8+CjxjaXJjbGUgY3g9IjMzIiBjeT0iMzIiIHI9IjMiIGZpbGw9IiNjY2NjY2MiLz4KPHBhdGggZD0iTTEzIDQ4TDIzIDM4TDMzIDQ4TDQzIDM4TDUzIDQ4IiBzdHJva2U9IiNjY2NjY2MiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=';
+    img.alt = '图片加载失败';
+}
+
+// 更新刷新时间
+function updateRefreshTime() {
+    const now = new Date();
+    const timeStr = now.toLocaleString('zh-CN', {
+        year: 'numeric',
+        month: '2-digit',
+        day: '2-digit',
+        hour: '2-digit',
+        minute: '2-digit',
+        second: '2-digit'
+    });
+    updateTimeElement.textContent = `最后更新: ${timeStr}`;
+    
+    // 添加成功提示
+    showSuccessMessage('🎉 数据已更新');
+}
+
+// 显示成功消息
+function showSuccessMessage(message) {
+    // 移除之前的提示
+    const existingToast = document.querySelector('.success-toast');
+    if (existingToast) {
+        existingToast.remove();
+    }
+    
+    const toast = document.createElement('div');
+    toast.className = 'success-toast';
+    toast.textContent = message;
+    toast.style.cssText = `
+        position: fixed;
+        top: 20px;
+        right: 20px;
+        background: linear-gradient(135deg, #4caf50, #66bb6a);
+        color: white;
+        padding: 12px 20px;
+        border-radius: 25px;
+        box-shadow: 0 4px 20px rgba(76, 175, 80, 0.3);
+        z-index: 1000;
+        font-weight: 600;
+        font-size: 0.9em;
+        animation: slideIn 0.3s ease-out;
+        backdrop-filter: blur(10px);
+    `;
+    
+    document.body.appendChild(toast);
+    
+    // 3秒后自动移除
+    setTimeout(() => {
+        toast.style.animation = 'slideOut 0.3s ease-in forwards';
+        setTimeout(() => toast.remove(), 300);
+    }, 3000);
+}
+
+// 添加CSS动画到页面
+if (!document.querySelector('#toast-styles')) {
+    const style = document.createElement('style');
+    style.id = 'toast-styles';
+    style.textContent = `
+        @keyframes slideIn {
+            from {
+                opacity: 0;
+                transform: translateX(100px);
+            }
+            to {
+                opacity: 1;
+                transform: translateX(0);
+            }
+        }
+        
+        @keyframes slideOut {
+            from {
+                opacity: 1;
+                transform: translateX(0);
+            }
+            to {
+                opacity: 0;
+                transform: translateX(100px);
+            }
+        }
+    `;
+    document.head.appendChild(style);
+}
+
+// 显示加载状态
+function showLoading() {
+    loadingElement.style.display = 'block';
+    hotListElement.style.display = 'none';
+}
+
+// 隐藏加载状态
+function hideLoading() {
+    loadingElement.style.display = 'none';
+    hotListElement.style.display = 'block';
+}
+
+// 显示错误信息
+function showError() {
+    errorMessageElement.style.display = 'block';
+    hotListElement.style.display = 'none';
+}
+
+// 隐藏错误信息
+function hideError() {
+    errorMessageElement.style.display = 'none';
+}
+
+// 自动刷新 (每5分钟)
+setInterval(function() {
+    loadHotList();
+}, 5 * 60 * 1000);

frontend/public/60sapi/热搜榜单/抖音热搜榜/接口集合.json

@@ -0,0 +1,3 @@
+[
+    "https://60s.api.shumengya.top"
+]

frontend/public/60sapi/热搜榜单/抖音热搜榜/返回接口.json

@@ -0,0 +1,496 @@
+{
+  "code": 200,
+  "message": "获取成功。数据来自官方/权威源头，以确保稳定与实时。开源地址 https://github.com/vikiboss/60s，反馈群 595941841",
+  "data": [
+    {
+      "title": "九三阅兵具体安排公布",
+      "hot_value": 11821633,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/oY1c972B7QzApGweaeQD3fGRo5aLIBrpCAuUSa~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=q01Se46GlLKYNv2klGKP1aM1cT0%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E4%B9%9D%E4%B8%89%E9%98%85%E5%85%B5%E5%85%B7%E4%BD%93%E5%AE%89%E6%8E%92%E5%85%AC%E5%B8%83",
+      "event_time": "2025/09/01 15:20:34",
+      "event_time_at": 1756711234,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "九月第一天",
+      "hot_value": 11327170,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/oofTvDaDRCSs4hBFEFVJlAI9BBs0faZAc7IpGf~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=otkowVCSglk%2BS3tPrmBQFq6rIDw%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E4%B9%9D%E6%9C%88%E7%AC%AC%E4%B8%80%E5%A4%A9",
+      "event_time": "2025/09/01 07:28:57",
+      "event_time_at": 1756682937,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "遇见上合共享津彩",
+      "hot_value": 11222444,
+      "cover": "https://p11-sign.douyinpic.com/tos-cn-p-0015/oIJeINhBDBAiHADD4gi9Ae0CGALg1BqWI7vg0i~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=K%2BaEx5p%2BDv%2B1h3RgNnH0Yb9WT%2B8%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E9%81%87%E8%A7%81%E4%B8%8A%E5%90%88%E5%85%B1%E4%BA%AB%E6%B4%A5%E5%BD%A9",
+      "event_time": "2025/09/01 11:46:59",
+      "event_time_at": 1756698419,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "2025年开学第一课铭记与奋斗",
+      "hot_value": 11078403,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/oA9NgVCRBABg7r70pQue8IzAUlfMaXf3hawOIB~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=3xYeXsD6JpXLDOVp6gYRxrvKFaM%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/2025%E5%B9%B4%E5%BC%80%E5%AD%A6%E7%AC%AC%E4%B8%80%E8%AF%BE%E9%93%AD%E8%AE%B0%E4%B8%8E%E5%A5%8B%E6%96%97",
+      "event_time": "2025/09/01 11:21:13",
+      "event_time_at": 1756696873,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "石宇奇首夺世锦赛男单冠军",
+      "hot_value": 10395092,
+      "cover": "https://p11-sign.douyinpic.com/tos-cn-p-0015/oAf9IAlEuyE3lFiogfBuQFl8gDFqAoAHtFDNkE~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=tamoorhMGYhajvpmVNdX0TuUuZM%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E7%9F%B3%E5%AE%87%E5%A5%87%E9%A6%96%E5%A4%BA%E4%B8%96%E9%94%A6%E8%B5%9B%E7%94%B7%E5%8D%95%E5%86%A0%E5%86%9B",
+      "event_time": "2025/09/01 07:47:03",
+      "event_time_at": 1756684023,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "告别信息裸奔 国家网络身份认证来了",
+      "hot_value": 10255200,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/oskNjrEUQIN9BBRCfeiDTGPE0geX0q6eAAyLr2~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=FrZQSxERPOBd6ktV8K%2Bt%2F3LgJ4A%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E5%91%8A%E5%88%AB%E4%BF%A1%E6%81%AF%E8%A3%B8%E5%A5%94%20%E5%9B%BD%E5%AE%B6%E7%BD%91%E7%BB%9C%E8%BA%AB%E4%BB%BD%E8%AE%A4%E8%AF%81%E6%9D%A5%E4%BA%86",
+      "event_time": "2025/09/01 10:28:41",
+      "event_time_at": 1756693721,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "记录我的开学第一天",
+      "hot_value": 9133236,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015c000-ce/owTXhhk40MlJDQHi8P2B07AviaBqAL0VI9EQi~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=pTEfiV%2FfsmGuQxNllsV8PqT0RYc%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E8%AE%B0%E5%BD%95%E6%88%91%E7%9A%84%E5%BC%80%E5%AD%A6%E7%AC%AC%E4%B8%80%E5%A4%A9",
+      "event_time": "2025/09/01 12:43:33",
+      "event_time_at": 1756701813,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "9月起这些新规开始施行",
+      "hot_value": 9105252,
+      "cover": "https://p26-sign.douyinpic.com/tos-cn-p-0015/oEE9BseGagtA7JRBmzYA1aRMoCMAeIxfLFY5gA~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=YgH%2BJdVPmi76okIWTRoyEEZ3iDg%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/9%E6%9C%88%E8%B5%B7%E8%BF%99%E4%BA%9B%E6%96%B0%E8%A7%84%E5%BC%80%E5%A7%8B%E6%96%BD%E8%A1%8C",
+      "event_time": "2025/09/01 11:48:01",
+      "event_time_at": 1756698481,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "李幼斌与李云龙跨时空对话",
+      "hot_value": 8998174,
+      "cover": "https://p26-sign.douyinpic.com/tos-cn-p-0015/oAarINBoAgRIPi9VTEMIfHeA11nDtF7hRDuGcA~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=3x7yTXHYKiIcnNJjznvZjCw%2FW94%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E6%9D%8E%E5%B9%BC%E6%96%8C%E4%B8%8E%E6%9D%8E%E4%BA%91%E9%BE%99%E8%B7%A8%E6%97%B6%E7%A9%BA%E5%AF%B9%E8%AF%9D",
+      "event_time": "2025/09/01 12:01:05",
+      "event_time_at": 1756699265,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "幼儿园第一天开学哀嚎一片",
+      "hot_value": 8962824,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/osbXMAQYgIwwpkDCfeiDpGaE0gb9MXfeAAuLV2~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=w1l8V4VvjuO%2BvOvuQkXiEuXYko0%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E5%B9%BC%E5%84%BF%E5%9B%AD%E7%AC%AC%E4%B8%80%E5%A4%A9%E5%BC%80%E5%AD%A6%E5%93%80%E5%9A%8E%E4%B8%80%E7%89%87",
+      "event_time": "2025/09/01 11:05:01",
+      "event_time_at": 1756695901,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "田汉把国歌歌词写烟盒上系谣传",
+      "hot_value": 8930615,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-i-0813c001/ogA2AoCCXZMEAGF9f9QAlSACKRgfsC2oAFtIgD~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=7%2F8qsoQJd6TgpAEylOW1VyQrqeY%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E7%94%B0%E6%B1%89%E6%8A%8A%E5%9B%BD%E6%AD%8C%E6%AD%8C%E8%AF%8D%E5%86%99%E7%83%9F%E7%9B%92%E4%B8%8A%E7%B3%BB%E8%B0%A3%E4%BC%A0",
+      "event_time": "2025/09/01 13:51:28",
+      "event_time_at": 1756705888,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "苏超联赛积分榜",
+      "hot_value": 8838219,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/o4vPLtWIQAaiggBRkQq5kw9ZlIVA0v1iDAILU~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=JJlPUPmWRzT3UPMenizW639pqVg%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E8%8B%8F%E8%B6%85%E8%81%94%E8%B5%9B%E7%A7%AF%E5%88%86%E6%A6%9C",
+      "event_time": "2025/08/31 22:01:53",
+      "event_time_at": 1756648913,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "一切正开始",
+      "hot_value": 8609507,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015c000-ce/o8wN0EuXoETsyMz0ADCFFaAsFFTQeQf9fAublW~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=5I8uLkfpNYrGArQm%2BXLBa81NhYY%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E4%B8%80%E5%88%87%E6%AD%A3%E5%BC%80%E5%A7%8B",
+      "event_time": "2025/09/01 11:56:50",
+      "event_time_at": 1756699010,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "张玉宁为与球迷起冲突致歉",
+      "hot_value": 8511631,
+      "cover": "https://p11-sign.douyinpic.com/tos-cn-p-0015/oMfoIAFMN5GEWOzpBCDAQfaj7yRArCdByaEUfE~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=59ipMtNxZ8W3R5NNAJamlSOEbPo%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E5%BC%A0%E7%8E%89%E5%AE%81%E4%B8%BA%E4%B8%8E%E7%90%83%E8%BF%B7%E8%B5%B7%E5%86%B2%E7%AA%81%E8%87%B4%E6%AD%89",
+      "event_time": "2025/09/01 07:53:39",
+      "event_time_at": 1756684419,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "这一口会很疯狂",
+      "hot_value": 8454971,
+      "cover": "https://p26-sign.douyinpic.com/tos-cn-p-0015/oUIozRIBqC0ahA7FimIAmFEBeqDFfZK3Qfo8PE~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=ZBSuTMuu4678gSfReaVIfdK22J8%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E8%BF%99%E4%B8%80%E5%8F%A3%E4%BC%9A%E5%BE%88%E7%96%AF%E7%8B%82",
+      "event_time": "2025/09/01 10:36:16",
+      "event_time_at": 1756694176,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "邓超鹿晗合唱超级英雄",
+      "hot_value": 8357197,
+      "cover": "https://p11-sign.douyinpic.com/tos-cn-p-0015/oUBPIdtyQx0j8THRZAmZbyATihavQHI0niLIP~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=%2F66dsj8evHN94wNNFCn%2Bfhagee0%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E9%82%93%E8%B6%85%E9%B9%BF%E6%99%97%E5%90%88%E5%94%B1%E8%B6%85%E7%BA%A7%E8%8B%B1%E9%9B%84",
+      "event_time": "2025/09/01 07:45:11",
+      "event_time_at": 1756683911,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "伊萨克加盟利物浦",
+      "hot_value": 7963081,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/ocAw2yaT4I99iDIPh9I3LaIiLBTnBASvH0Q1a~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=v4Gq0Iz87wyZ6lEYYOnKmaeur%2FM%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E4%BC%8A%E8%90%A8%E5%85%8B%E5%8A%A0%E7%9B%9F%E5%88%A9%E7%89%A9%E6%B5%A6",
+      "event_time": "2025/09/01 09:12:12",
+      "event_time_at": 1756689132,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "山东泰山6:0北京国安",
+      "hot_value": 7830358,
+      "cover": "https://p9-sign.douyinpic.com/tos-cn-p-0015/ogtA9BEEJZDJ9SgzBBLfFN0AflNDGoIAQ2I8A8~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=gu6O%2BhGDarr%2BHQe1P%2BHo9pUmBGU%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E5%B1%B1%E4%B8%9C%E6%B3%B0%E5%B1%B16%3A0%E5%8C%97%E4%BA%AC%E5%9B%BD%E5%AE%89",
+      "event_time": "2025/08/31 20:32:53",
+      "event_time_at": 1756643573,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "又到开学你包书皮了吗",
+      "hot_value": 7828995,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/oUAwaPjCIiLAQI6ADQMAm06TBJxPJFAkCpIIi~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=aUkYTtkfaUKbK2DhznXU69sg8SU%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E5%8F%88%E5%88%B0%E5%BC%80%E5%AD%A6%E4%BD%A0%E5%8C%85%E4%B9%A6%E7%9A%AE%E4%BA%86%E5%90%97",
+      "event_time": "2025/08/31 17:04:09",
+      "event_time_at": 1756631049,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "樊振东德甲首秀两连败",
+      "hot_value": 7754365,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/osOdEdibznClYwP0AABAIZW1eg0gbBmAzjiJfl~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=AyWBGXt%2FFFSp0QBM%2Bd5%2F9B4GPvo%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E6%A8%8A%E6%8C%AF%E4%B8%9C%E5%BE%B7%E7%94%B2%E9%A6%96%E7%A7%80%E4%B8%A4%E8%BF%9E%E8%B4%A5",
+      "event_time": "2025/09/01 07:16:58",
+      "event_time_at": 1756682218,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "为什么说00后的童年含金量高",
+      "hot_value": 7735122,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/ogOQEQsnAACDBICh7LeFWRGCjeZneIB9I3oVFy~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=Htnqu7SupC%2FmvQpF2DDsLDh5FYA%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E4%B8%BA%E4%BB%80%E4%B9%88%E8%AF%B400%E5%90%8E%E7%9A%84%E7%AB%A5%E5%B9%B4%E5%90%AB%E9%87%91%E9%87%8F%E9%AB%98",
+      "event_time": "2025/08/31 16:38:30",
+      "event_time_at": 1756629510,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "刘宇千年直拍",
+      "hot_value": 7734149,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015c000-ce/ostjBSmQ78E8estIXgFlHQxZQALRFfMepbTJWC~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=CPNw9h%2BpBB82qBykpuT11uMVFjo%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E5%88%98%E5%AE%87%E5%8D%83%E5%B9%B4%E7%9B%B4%E6%8B%8D",
+      "event_time": "2025/08/31 21:39:38",
+      "event_time_at": 1756647578,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "胡塞武装称将对以军袭击发起报复",
+      "hot_value": 7728698,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/oseWgjCRBAfgft7c3QUm8JGApnYMaWdJdGj0SB~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=fX6AvTWQvNrihcvEraPHjJIS9iY%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E8%83%A1%E5%A1%9E%E6%AD%A6%E8%A3%85%E7%A7%B0%E5%B0%86%E5%AF%B9%E4%BB%A5%E5%86%9B%E8%A2%AD%E5%87%BB%E5%8F%91%E8%B5%B7%E6%8A%A5%E5%A4%8D",
+      "event_time": "2025/09/01 09:40:13",
+      "event_time_at": 1756690813,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "手把手教你手机变车机",
+      "hot_value": 7725104,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/o47qAXUjDQN6KLr9AjFSCq92ZBf4okAQEfgSAp~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=OoNNciUVTOwZbl17IUYBOjFyBJ4%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E6%89%8B%E6%8A%8A%E6%89%8B%E6%95%99%E4%BD%A0%E6%89%8B%E6%9C%BA%E5%8F%98%E8%BD%A6%E6%9C%BA",
+      "event_time": "2025/09/01 11:15:15",
+      "event_time_at": 1756696515,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "莫迪与普京拥抱手拉手热聊",
+      "hot_value": 7723445,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/oIaWAojVPLRUILGIyvvg1Sd1ZiLAKiCB6zQIX~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=u1IGnKz%2FAckLe%2BYFCQulFw0ioB8%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E8%8E%AB%E8%BF%AA%E4%B8%8E%E6%99%AE%E4%BA%AC%E6%8B%A5%E6%8A%B1%E6%89%8B%E6%8B%89%E6%89%8B%E7%83%AD%E8%81%8A",
+      "event_time": "2025/09/01 15:38:27",
+      "event_time_at": 1756712307,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "原来猪猪侠搞抽象领先我20年",
+      "hot_value": 7706786,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/oINGyAfS2oFpfAgF2kYxEJAqTbSeEcgotfxeHv~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=S1Ve0ORP5%2BrHumx%2FK7uJbfm8PbM%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E5%8E%9F%E6%9D%A5%E7%8C%AA%E7%8C%AA%E4%BE%A0%E6%90%9E%E6%8A%BD%E8%B1%A1%E9%A2%86%E5%85%88%E6%88%9120%E5%B9%B4",
+      "event_time": "2025/09/01 10:52:59",
+      "event_time_at": 1756695179,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "北京国安就惨败道歉",
+      "hot_value": 7702358,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/oYiXICjfn7uEi3AeK6W04BiXu3iBjigAAs9W0B~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=hgh%2Bfy4Ul82LWgXAL2hkIBMEpJM%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E5%8C%97%E4%BA%AC%E5%9B%BD%E5%AE%89%E5%B0%B1%E6%83%A8%E8%B4%A5%E9%81%93%E6%AD%89",
+      "event_time": "2025/09/01 09:21:10",
+      "event_time_at": 1756689670,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "港姐冠军陈咏诗是博士生",
+      "hot_value": 7702059,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/okoRaMGvQBCI6KmVeBAAQ1eLEg1HK2foQuM7aB~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=5Lattu1v38oeQ8xGdXiDLcK4fwM%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E6%B8%AF%E5%A7%90%E5%86%A0%E5%86%9B%E9%99%88%E5%92%8F%E8%AF%97%E6%98%AF%E5%8D%9A%E5%A3%AB%E7%94%9F",
+      "event_time": "2025/09/01 10:47:23",
+      "event_time_at": 1756694843,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "王楚钦2:3徐瑛彬",
+      "hot_value": 7699514,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/o00BTIi1ogMR8LBAiQdLmSaIPAuEyIQv1IP48~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=2%2BI5KkQpEugBkQcVCrSLgOtC088%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E7%8E%8B%E6%A5%9A%E9%92%A62%3A3%E5%BE%90%E7%91%9B%E5%BD%AC",
+      "event_time": "2025/08/31 21:21:08",
+      "event_time_at": 1756646468,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "王源 高音",
+      "hot_value": 7693290,
+      "cover": "https://p26-sign.douyinpic.com/tos-cn-p-0015/oYzDIaQiavwPRBUpanIkjAIWzwLCIgPkAyiOj~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=uXVN6xfkB3tz3iVo0DQuxqeaGk0%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E7%8E%8B%E6%BA%90%20%E9%AB%98%E9%9F%B3",
+      "event_time": "2025/08/31 20:30:04",
+      "event_time_at": 1756643404,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "俄乌在苏贾前线展开阵地争夺",
+      "hot_value": 7691808,
+      "cover": "https://p9-sign.douyinpic.com/tos-cn-p-0015/oo7iATIG8vA5hIIQBILB4oCgvygsUNzBS1aPi~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=SNzQbbxAJqqtdIkck9kvtRUJnZg%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E4%BF%84%E4%B9%8C%E5%9C%A8%E8%8B%8F%E8%B4%BE%E5%89%8D%E7%BA%BF%E5%B1%95%E5%BC%80%E9%98%B5%E5%9C%B0%E4%BA%89%E5%A4%BA",
+      "event_time": "2025/09/01 12:56:05",
+      "event_time_at": 1756702565,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "范丞丞温柔版一个人的夜变装",
+      "hot_value": 7689433,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/oAPLWIAoR3CsXgVBuIQIRiTDyS14gaLPwELAi~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=yp9l95J9xlKf55IEP14P7sD7J%2F4%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E8%8C%83%E4%B8%9E%E4%B8%9E%E6%B8%A9%E6%9F%94%E7%89%88%E4%B8%80%E4%B8%AA%E4%BA%BA%E7%9A%84%E5%A4%9C%E5%8F%98%E8%A3%85",
+      "event_time": "2025/09/01 15:32:00",
+      "event_time_at": 1756711920,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "用美食致敬这场胜利",
+      "hot_value": 7681826,
+      "cover": "https://p11-sign.douyinpic.com/tos-cn-p-0015/oIFcUfHotAXxALhJEj2EK9SBNp0fQwKhAbCgQD~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=Dkuyg5REqCAMEIsp0Dr%2B%2BkAO%2BmQ%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E7%94%A8%E7%BE%8E%E9%A3%9F%E8%87%B4%E6%95%AC%E8%BF%99%E5%9C%BA%E8%83%9C%E5%88%A9",
+      "event_time": "2025/09/01 12:08:24",
+      "event_time_at": 1756699704,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "田曦薇猫猫本体藏不住了",
+      "hot_value": 7674729,
+      "cover": "https://p11-sign.douyinpic.com/tos-cn-p-0015c000-ce/oceyeLnbxAXFERxnPfLR2egAkYaXeRpHfhAQME~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=omEVZta%2FQeV%2FSBRNZ3%2BJF0iMXPQ%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E7%94%B0%E6%9B%A6%E8%96%87%E7%8C%AB%E7%8C%AB%E6%9C%AC%E4%BD%93%E8%97%8F%E4%B8%8D%E4%BD%8F%E4%BA%86",
+      "event_time": "2025/09/01 14:33:25",
+      "event_time_at": 1756708405,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "少年心气是不可再生之物",
+      "hot_value": 7673518,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-i-0813c001/oAUJIWFyAFCmtGpmAADAQis69JogkCFAA0Eqff~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=YHeldSJZXPEBMLF2i%2Bj%2Fc60oKsQ%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E5%B0%91%E5%B9%B4%E5%BF%83%E6%B0%94%E6%98%AF%E4%B8%8D%E5%8F%AF%E5%86%8D%E7%94%9F%E4%B9%8B%E7%89%A9",
+      "event_time": "2025/09/01 07:54:31",
+      "event_time_at": 1756684471,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "南通2:1战胜苏州",
+      "hot_value": 7670255,
+      "cover": "https://p11-sign.douyinpic.com/tos-cn-p-0015/o4WAaBigTGBaeBgrqm5Kir0Af6DGO0IAF6IQPA~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=uV2f%2FvbzU4Y9DfhXxnPBc3hOAxY%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E5%8D%97%E9%80%9A2%3A1%E6%88%98%E8%83%9C%E8%8B%8F%E5%B7%9E",
+      "event_time": "2025/08/31 18:02:42",
+      "event_time_at": 1756634562,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "起猛了差点以为入冬了",
+      "hot_value": 7669368,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015c000-ce/ogA5HPw1xiIwS2szhaBPMZvC1P0LAPPQAigEZ~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=UQNTgz2vyL2UMvzVj2gzBmPbM2A%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E8%B5%B7%E7%8C%9B%E4%BA%86%E5%B7%AE%E7%82%B9%E4%BB%A5%E4%B8%BA%E5%85%A5%E5%86%AC%E4%BA%86",
+      "event_time": "2025/09/01 14:23:50",
+      "event_time_at": 1756707830,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "终于轮到我围观军训了",
+      "hot_value": 7655201,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015c000-ce/oobwIeLUf4O7iiazJOGAQLZO7DRgCDCBLhI2ez~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=WQn5PvdzvIerbF%2B1iNjF3b6itqQ%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E7%BB%88%E4%BA%8E%E8%BD%AE%E5%88%B0%E6%88%91%E5%9B%B4%E8%A7%82%E5%86%9B%E8%AE%AD%E4%BA%86",
+      "event_time": "2025/08/31 13:09:34",
+      "event_time_at": 1756616974,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "金铲铲陪伴是李现最长情的告白",
+      "hot_value": 7653496,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015c000-ce/oYPAKIM2vpBnPULXOmBbAEac6KzbOhSiILiLP~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=rsA7DcONzMySFGRNa4PMk6ftyBk%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E9%87%91%E9%93%B2%E9%93%B2%E9%99%AA%E4%BC%B4%E6%98%AF%E6%9D%8E%E7%8E%B0%E6%9C%80%E9%95%BF%E6%83%85%E7%9A%84%E5%91%8A%E7%99%BD",
+      "event_time": "2025/08/31 22:58:48",
+      "event_time_at": 1756652328,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "张予曦妈妈不介意女儿谈姐弟恋",
+      "hot_value": 7650811,
+      "cover": "https://p11-sign.douyinpic.com/tos-cn-p-0015/oEB5A1NsLFeadA9HQoED9TfmQ8jHgUPxACzjw9~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=KF3nedfpt5iPcUZ%2Fv9SyYI0ZSWg%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E5%BC%A0%E4%BA%88%E6%9B%A6%E5%A6%88%E5%A6%88%E4%B8%8D%E4%BB%8B%E6%84%8F%E5%A5%B3%E5%84%BF%E8%B0%88%E5%A7%90%E5%BC%9F%E6%81%8B",
+      "event_time": "2025/08/31 17:44:23",
+      "event_time_at": 1756633463,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "边伯贤也来刀马刀马了",
+      "hot_value": 7650164,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/ogfBltLZDIGmRGCAseKAeaIBRnQH79gBGOb4kC~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=nLrGTCoyqEGU882IYRhJOStMdpg%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E8%BE%B9%E4%BC%AF%E8%B4%A4%E4%B9%9F%E6%9D%A5%E5%88%80%E9%A9%AC%E5%88%80%E9%A9%AC%E4%BA%86",
+      "event_time": "2025/08/31 13:44:44",
+      "event_time_at": 1756619084,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "金靖演绎甜美女孩",
+      "hot_value": 7649913,
+      "cover": "https://p11-sign.douyinpic.com/tos-cn-p-0015/o0cBcsRQjiGGFCOOArGzzeIfLBA7FEYojeKwGQ~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=9BY7gGsW39uBcs06t%2BrXTCQ5J5k%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E9%87%91%E9%9D%96%E6%BC%94%E7%BB%8E%E7%94%9C%E7%BE%8E%E5%A5%B3%E5%AD%A9",
+      "event_time": "2025/08/31 19:00:32",
+      "event_time_at": 1756638032,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "一口气看日本如何造出反华体制",
+      "hot_value": 7648850,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/oUoyIxcAADE55goYWdhBfFF4HACpRIpy9Xse6K~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=xjjRJGl0AzxkaEnOiVrzRx1hoZ8%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E4%B8%80%E5%8F%A3%E6%B0%94%E7%9C%8B%E6%97%A5%E6%9C%AC%E5%A6%82%E4%BD%95%E9%80%A0%E5%87%BA%E5%8F%8D%E5%8D%8E%E4%BD%93%E5%88%B6",
+      "event_time": "2025/08/30 21:50:31",
+      "event_time_at": 1756561831,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "张艺兴真空西装跳狼与美女",
+      "hot_value": 7646868,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015c000-ce/o4YKfLEIEEwo5stfDSFe0s2TFRjxXAAZDCE9Bl~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=gqBuLvszd8eew81uXP8rf7idtog%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E5%BC%A0%E8%89%BA%E5%85%B4%E7%9C%9F%E7%A9%BA%E8%A5%BF%E8%A3%85%E8%B7%B3%E7%8B%BC%E4%B8%8E%E7%BE%8E%E5%A5%B3",
+      "event_time": "2025/08/31 22:12:44",
+      "event_time_at": 1756649564,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "罗永浩对谈脱口秀新王何广智",
+      "hot_value": 7644688,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/okQ0qo1AKBQP3g981qQA1FEAzGDYjtFFdfYVeD~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=Mg24ss6tlv%2FY%2B%2B9PS5UdijEG1Dw%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E7%BD%97%E6%B0%B8%E6%B5%A9%E5%AF%B9%E8%B0%88%E8%84%B1%E5%8F%A3%E7%A7%80%E6%96%B0%E7%8E%8B%E4%BD%95%E5%B9%BF%E6%99%BA",
+      "event_time": "2025/09/01 13:56:14",
+      "event_time_at": 1756706174,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "周深的刀马刀马好可爱",
+      "hot_value": 7644052,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/osAPL0laAbWHtEmVBUIKMQDypItTiF3HI0PQi~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=qcK3K8uko38iBuRXDg4uCTaqEPc%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E5%91%A8%E6%B7%B1%E7%9A%84%E5%88%80%E9%A9%AC%E5%88%80%E9%A9%AC%E5%A5%BD%E5%8F%AF%E7%88%B1",
+      "event_time": "2025/08/31 18:31:56",
+      "event_time_at": 1756636316,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "杜克一哥的对话太好哭了",
+      "hot_value": 7639907,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/oofoeQ9VAPDsphKEAiFQbQwCAEwoQgBpLtBC0A~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=wulyNlwPrSoIJu1JKBdKpE142mA%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E6%9D%9C%E5%85%8B%E4%B8%80%E5%93%A5%E7%9A%84%E5%AF%B9%E8%AF%9D%E5%A4%AA%E5%A5%BD%E5%93%AD%E4%BA%86",
+      "event_time": "2025/08/30 21:17:58",
+      "event_time_at": 1756559878,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "外媒全景记录普京抵华现场",
+      "hot_value": 7637541,
+      "cover": "https://p3-sign.douyinpic.com/tos-cn-p-0015/oIGC9LxDIQ6QAI1fG1eEipfA2eZjiGInCHFFEJ~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=HiKj%2FiLGiaN2D5GdS5OlAISbGHo%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E5%A4%96%E5%AA%92%E5%85%A8%E6%99%AF%E8%AE%B0%E5%BD%95%E6%99%AE%E4%BA%AC%E6%8A%B5%E5%8D%8E%E7%8E%B0%E5%9C%BA",
+      "event_time": "2025/09/01 11:59:34",
+      "event_time_at": 1756699174,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    },
+    {
+      "title": "赵丽颖工作室明兰代班营业",
+      "hot_value": 7635755,
+      "cover": "https://p26-sign.douyinpic.com/tos-cn-p-0015c000-ce/oIhHELPBeI6Ieb0A9OpCuWXh0CAAgiuniEweIw~noop.jpeg?lk3s=bfd515bb&x-expires=1756735200&x-signature=xmQOeLdWN4FaeZjFBqtMQuctYv8%3D&from=3218412987",
+      "link": "https://www.douyin.com/search/%E8%B5%B5%E4%B8%BD%E9%A2%96%E5%B7%A5%E4%BD%9C%E5%AE%A4%E6%98%8E%E5%85%B0%E4%BB%A3%E7%8F%AD%E8%90%A5%E4%B8%9A",
+      "event_time": "2025/08/31 20:52:34",
+      "event_time_at": 1756644754,
+      "active_time": "2025-09-01 16:46:46",
+      "active_time_at": 1756745206000
+    }
+  ]
+}

frontend/public/60sapi/热搜榜单/猫眼票房排行榜/css/style.css

@@ -0,0 +1,582 @@
+/* 现代化猫眼票房排行榜样式 */
+
+/* 全局重置和基础样式 */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+:root {
+    /* 主色调 */
+    --primary-color: #667eea;
+    --primary-light: #764ba2;
+    --secondary-color: #f093fb;
+    --accent-color: #4facfe;
+    
+    /* 中性色 */
+    --text-primary: #2d3748;
+    --text-secondary: #4a5568;
+    --text-muted: #718096;
+    --bg-primary: #ffffff;
+    --bg-secondary: #f7fafc;
+    --bg-tertiary: #edf2f7;
+    
+    /* 状态色 */
+    --success-color: #48bb78;
+    --warning-color: #ed8936;
+    --error-color: #f56565;
+    
+    /* 阴影 */
+    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.1);
+    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
+    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
+    --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.15);
+    
+    /* 圆角 */
+    --radius-sm: 6px;
+    --radius-md: 12px;
+    --radius-lg: 16px;
+    --radius-xl: 24px;
+    
+    /* 间距 */
+    --space-xs: 4px;
+    --space-sm: 8px;
+    --space-md: 16px;
+    --space-lg: 24px;
+    --space-xl: 32px;
+    --space-2xl: 48px;
+}
+
+body {
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
+    line-height: 1.6;
+    color: var(--text-primary);
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    min-height: 100vh;
+    position: relative;
+    overflow-x: hidden;
+}
+
+/* 动态背景效果 */
+body::before {
+    content: '';
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: 
+        radial-gradient(circle at 20% 80%, rgba(120, 119, 198, 0.3) 0%, transparent 50%),
+        radial-gradient(circle at 80% 20%, rgba(255, 119, 198, 0.3) 0%, transparent 50%),
+        radial-gradient(circle at 40% 40%, rgba(120, 219, 255, 0.2) 0%, transparent 50%);
+    z-index: -1;
+    animation: backgroundShift 20s ease-in-out infinite;
+}
+
+@keyframes backgroundShift {
+    0%, 100% {
+        transform: scale(1) rotate(0deg);
+        opacity: 0.8;
+    }
+    50% {
+        transform: scale(1.1) rotate(180deg);
+        opacity: 0.6;
+    }
+}
+
+/* 主容器 */
+.container {
+    max-width: 900px;
+    margin: var(--space-lg) auto;
+    padding: var(--space-xl);
+    background: rgba(255, 255, 255, 0.95);
+    backdrop-filter: blur(20px);
+    border-radius: var(--radius-xl);
+    box-shadow: var(--shadow-xl);
+    border: 1px solid rgba(255, 255, 255, 0.2);
+    position: relative;
+    animation: slideUp 0.8s ease-out;
+}
+
+@keyframes slideUp {
+    from {
+        opacity: 0;
+        transform: translateY(30px);
+    }
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+/* 头部样式 */
+.header {
+    text-align: center;
+    margin-bottom: var(--space-2xl);
+    padding-bottom: var(--space-lg);
+    border-bottom: 2px solid var(--bg-tertiary);
+    position: relative;
+}
+
+.header::after {
+    content: '';
+    position: absolute;
+    bottom: -2px;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 60px;
+    height: 4px;
+    background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
+    border-radius: 2px;
+}
+
+.header h1 {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: var(--space-md);
+    margin-bottom: var(--space-md);
+    font-size: clamp(1.8rem, 4vw, 2.5rem);
+    font-weight: 700;
+    letter-spacing: -0.02em;
+    flex-wrap: wrap;
+}
+
+.header h1 .icon {
+    font-size: 1.2em;
+    animation: bounce 2s infinite;
+    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
+}
+
+@keyframes bounce {
+    0%, 20%, 50%, 80%, 100% {
+        transform: translateY(0);
+    }
+    40% {
+        transform: translateY(-8px);
+    }
+    60% {
+        transform: translateY(-4px);
+    }
+}
+
+.header h1 .title-text {
+    background: linear-gradient(135deg, var(--primary-color), var(--primary-light));
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+    position: relative;
+}
+
+.header h1 .update-badge {
+    font-size: 0.4em;
+    background: linear-gradient(135deg, var(--accent-color), var(--secondary-color));
+    color: white;
+    padding: var(--space-xs) var(--space-md);
+    border-radius: var(--radius-xl);
+    font-weight: 600;
+    box-shadow: var(--shadow-md);
+    animation: pulse 3s infinite;
+    white-space: nowrap;
+}
+
+@keyframes pulse {
+    0%, 100% {
+        transform: scale(1);
+        box-shadow: var(--shadow-md);
+    }
+    50% {
+        transform: scale(1.05);
+        box-shadow: var(--shadow-lg);
+    }
+}
+
+.header-desc {
+    color: var(--text-secondary);
+    font-size: 1.1rem;
+    font-weight: 500;
+    margin-top: var(--space-sm);
+}
+
+/* 加载状态 */
+.loading {
+    text-align: center;
+    padding: var(--space-2xl);
+    color: var(--text-secondary);
+}
+
+.spinner {
+    width: 40px;
+    height: 40px;
+    margin: 0 auto var(--space-md);
+    border: 3px solid var(--bg-tertiary);
+    border-top: 3px solid var(--primary-color);
+    border-radius: 50%;
+    animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+    0% { transform: rotate(0deg); }
+    100% { transform: rotate(360deg); }
+}
+
+/* 内容区域 */
+.content {
+    animation: fadeIn 0.6s ease-out 0.2s both;
+}
+
+@keyframes fadeIn {
+    from {
+        opacity: 0;
+        transform: translateY(20px);
+    }
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+.ranking-title {
+    font-size: 1.5rem;
+    font-weight: 600;
+    color: var(--text-primary);
+    margin-bottom: var(--space-lg);
+    text-align: center;
+    position: relative;
+}
+
+/* 电影列表 */
+.movie-list {
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-md);
+}
+
+.movie-item {
+    display: flex;
+    align-items: center;
+    gap: var(--space-md);
+    padding: var(--space-lg);
+    background: var(--bg-primary);
+    border-radius: var(--radius-lg);
+    box-shadow: var(--shadow-sm);
+    border: 1px solid rgba(0, 0, 0, 0.05);
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    position: relative;
+    overflow: hidden;
+}
+
+.movie-item::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(135deg, transparent 0%, rgba(102, 126, 234, 0.02) 100%);
+    opacity: 0;
+    transition: opacity 0.3s ease;
+}
+
+.movie-item:hover {
+    transform: translateY(-4px);
+    box-shadow: var(--shadow-lg);
+    border-color: rgba(102, 126, 234, 0.2);
+}
+
+.movie-item:hover::before {
+    opacity: 1;
+}
+
+/* 特殊排名样式 */
+.movie-item.top-1 {
+    background: linear-gradient(135deg, rgba(255, 215, 0, 0.1) 0%, var(--bg-primary) 100%);
+    border-color: rgba(255, 215, 0, 0.3);
+}
+
+.movie-item.top-2 {
+    background: linear-gradient(135deg, rgba(192, 192, 192, 0.1) 0%, var(--bg-primary) 100%);
+    border-color: rgba(192, 192, 192, 0.3);
+}
+
+.movie-item.top-3 {
+    background: linear-gradient(135deg, rgba(205, 127, 50, 0.1) 0%, var(--bg-primary) 100%);
+    border-color: rgba(205, 127, 50, 0.3);
+}
+
+/* 排名徽章 */
+.movie-rank {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 50px;
+    height: 50px;
+    border-radius: var(--radius-md);
+    font-size: 1.2rem;
+    font-weight: 700;
+    flex-shrink: 0;
+    transition: all 0.3s ease;
+    position: relative;
+}
+
+.movie-item:hover .movie-rank {
+    transform: scale(1.1);
+}
+
+.movie-rank.gold {
+    background: linear-gradient(135deg, #ffd700, #ffb700);
+    color: white;
+    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.4);
+}
+
+.movie-rank.silver {
+    background: linear-gradient(135deg, #c0c0c0, #a0a0a0);
+    color: white;
+    box-shadow: 0 4px 15px rgba(192, 192, 192, 0.4);
+}
+
+.movie-rank.bronze {
+    background: linear-gradient(135deg, #cd7f32, #b06728);
+    color: white;
+    box-shadow: 0 4px 15px rgba(205, 127, 50, 0.4);
+}
+
+.movie-rank.regular {
+    background: linear-gradient(135deg, var(--primary-color), var(--accent-color));
+    color: white;
+    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
+}
+
+/* 电影内容 */
+.movie-content {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    gap: var(--space-sm);
+    min-width: 0;
+}
+
+.movie-title {
+    font-size: 1.1rem;
+    font-weight: 600;
+    color: var(--text-primary);
+    line-height: 1.4;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.movie-meta {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--space-md);
+    flex-wrap: wrap;
+}
+
+.movie-year {
+    color: var(--text-muted);
+    font-size: 0.85rem;
+    background: var(--bg-tertiary);
+    padding: var(--space-xs) var(--space-sm);
+    border-radius: var(--radius-sm);
+    font-weight: 500;
+}
+
+.movie-boxoffice {
+    font-weight: 700;
+    color: var(--warning-color);
+    font-size: 1rem;
+    white-space: nowrap;
+}
+
+/* 更新时间 */
+.update-time {
+    text-align: center;
+    margin-top: var(--space-lg);
+    padding: var(--space-md);
+    background: var(--bg-secondary);
+    border-radius: var(--radius-md);
+    color: var(--text-secondary);
+    font-size: 0.9rem;
+    border: 1px solid var(--bg-tertiary);
+}
+
+/* 错误状态 */
+.error {
+    text-align: center;
+    padding: var(--space-2xl);
+    color: var(--error-color);
+}
+
+.error h3 {
+    font-size: 1.2rem;
+    margin-bottom: var(--space-md);
+}
+
+.error p {
+    margin-bottom: var(--space-sm);
+    color: var(--text-secondary);
+}
+
+/* 响应式设计 */
+@media (max-width: 768px) {
+    .container {
+        margin: var(--space-md);
+        padding: var(--space-lg);
+        border-radius: var(--radius-lg);
+    }
+    
+    .header {
+        margin-bottom: var(--space-lg);
+        padding-bottom: var(--space-md);
+    }
+    
+    .header h1 {
+        font-size: 1.8rem;
+        gap: var(--space-sm);
+    }
+    
+    .header h1 .update-badge {
+        font-size: 0.35em;
+        padding: 2px var(--space-sm);
+    }
+    
+    .movie-item {
+        padding: var(--space-md);
+        gap: var(--space-sm);
+    }
+    
+    .movie-rank {
+        width: 42px;
+        height: 42px;
+        font-size: 1rem;
+    }
+    
+    .movie-title {
+        font-size: 1rem;
+    }
+    
+    .movie-meta {
+        gap: var(--space-sm);
+    }
+    
+    .movie-year {
+        font-size: 0.8rem;
+    }
+    
+    .movie-boxoffice {
+        font-size: 0.9rem;
+    }
+}
+
+@media (max-width: 480px) {
+    .container {
+        margin: var(--space-sm);
+        padding: var(--space-md);
+    }
+    
+    .header h1 {
+        font-size: 1.6rem;
+        flex-direction: column;
+        gap: var(--space-xs);
+    }
+    
+    .movie-list {
+        gap: var(--space-sm);
+    }
+    
+    .movie-item {
+        padding: var(--space-sm);
+    }
+    
+    .movie-rank {
+        width: 38px;
+        height: 38px;
+        font-size: 0.9rem;
+    }
+    
+    .movie-title {
+        font-size: 0.95rem;
+    }
+    
+    .movie-meta {
+        flex-direction: column;
+        align-items: flex-start;
+        gap: var(--space-xs);
+    }
+}
+
+/* 减少动画以节省电池 */
+@media (prefers-reduced-motion: reduce) {
+    *,
+    *::before,
+    *::after {
+        animation-duration: 0.01ms !important;
+        animation-iteration-count: 1 !important;
+        transition-duration: 0.01ms !important;
+    }
+    
+    body::before {
+        animation: none;
+    }
+}
+
+/* 深色模式支持 */
+@media (prefers-color-scheme: dark) {
+    :root {
+        --text-primary: #f7fafc;
+        --text-secondary: #e2e8f0;
+        --text-muted: #a0aec0;
+        --bg-primary: #2d3748;
+        --bg-secondary: #4a5568;
+        --bg-tertiary: #718096;
+    }
+    
+    body {
+        background: linear-gradient(135deg, #2d3748 0%, #4a5568 100%);
+    }
+    
+    .container {
+        background: rgba(45, 55, 72, 0.95);
+        border-color: rgba(255, 255, 255, 0.1);
+    }
+    
+    .movie-item {
+        background: var(--bg-primary);
+        border-color: rgba(255, 255, 255, 0.1);
+    }
+    
+    .movie-item:hover {
+        border-color: rgba(102, 126, 234, 0.4);
+    }
+}
+
+/* 打印样式 */
+@media print {
+    body {
+        background: white;
+        color: black;
+    }
+    
+    body::before {
+        display: none;
+    }
+    
+    .container {
+        background: white;
+        box-shadow: none;
+        border: 1px solid #ccc;
+    }
+    
+    .movie-item {
+        break-inside: avoid;
+        box-shadow: none;
+        border: 1px solid #ddd;
+    }
+    
+    .header h1 .update-badge {
+        background: #666;
+    }
+}

frontend/public/60sapi/热搜榜单/猫眼票房排行榜/index.html

@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="猫眼票房排行榜 - 展示全球电影总票房排行榜">
+    <meta name="keywords" content="猫眼, 票房, 排行榜, 电影票房, 全球票房">
+    <title>猫眼票房排行榜 | 全球电影总票房</title>
+
+    <!-- 引入CSS样式 -->
+    <link rel="stylesheet" href="css/style.css">
+
+    <!-- 网站图标（SVG内联为data URL，避免外部依赖） -->
+    <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🎬</text></svg>">
+</head>
+<body>
+    <div class="container">
+        <!-- 页面头部 -->
+        <header class="header">
+            <h1>
+                <span class="icon">🎬</span>
+                <span class="title-text">猫眼票房排行榜</span>
+                <span class="update-badge">实时更新</span>
+            </h1>
+            <p class="header-desc">全球电影总票房榜单 | 权威数据 | 实时更新</p>
+        </header>
+
+        <!-- 加载状态 -->
+        <div id="loading" class="loading">
+            <div class="spinner"></div>
+            <p>正在加载票房数据...</p>
+        </div>
+
+        <!-- 内容区域 -->
+        <main id="ranking-content" class="content" style="display: none;"></main>
+    </div>
+
+    <!-- 引入JavaScript -->
+    <script src="js/script.js"></script>
+</body>
+</html>

frontend/public/60sapi/热搜榜单/猫眼票房排行榜/js/script.js

@@ -0,0 +1,266 @@
+// 猫眼票房排行榜 - JavaScript 实现
+
+const API = {
+    endpoints: [],
+    currentIndex: 0,
+    params: {
+        encoding: 'json'
+    },
+    localFallback: '返回接口.json',
+    // 初始化API接口列表
+    async init() {
+        try {
+            const res = await fetch('./接口集合.json');
+            const endpoints = await res.json();
+            this.endpoints = endpoints.map(endpoint => `${endpoint}/v2/maoyan`);
+        } catch (e) {
+            // 如果无法加载接口集合，使用默认接口
+            this.endpoints = ['https://60s.api.shumengya.top/v2/maoyan'];
+        }
+    },
+    // 获取当前接口URL
+    getCurrentUrl() {
+        if (this.endpoints.length === 0) return null;
+        const url = new URL(this.endpoints[this.currentIndex]);
+        Object.entries(this.params).forEach(([k, v]) => url.searchParams.append(k, v));
+        return url.toString();
+    },
+    // 切换到下一个接口
+    switchToNext() {
+        this.currentIndex = (this.currentIndex + 1) % this.endpoints.length;
+        return this.currentIndex < this.endpoints.length;
+    },
+    // 重置到第一个接口
+    reset() {
+        this.currentIndex = 0;
+    }
+};
+
+let elements = {};
+
+// 初始化
+window.addEventListener('DOMContentLoaded', () => {
+    initElements();
+    loadMaoyanList();
+});
+
+function initElements() {
+    elements = {
+        container: document.getElementById('ranking-content'),
+        loading: document.getElementById('loading'),
+        updateTime: document.getElementById('api-update-time'),
+        statsTotal: document.getElementById('stats-total'),
+        statsTop10: document.getElementById('stats-top10')
+    };
+}
+
+async function loadMaoyanList() {
+    try {
+        showLoading(true);
+
+        // 优先从线上API请求
+        let data = await fetchFromAPI();
+
+        // 如果线上失败，尝试从本地返回接口.json加载
+        if (!data) {
+            data = await fetchFromLocal();
+        }
+
+        if (!data || data.code !== 200 || !data.data) {
+            throw new Error(data && data.message ? data.message : '未能获取到有效数据');
+        }
+
+        renderRanking(data.data);
+    } catch (error) {
+        console.error('加载排行榜失败:', error);
+        showError(error.message || '加载失败，请稍后重试');
+    } finally {
+        showLoading(false);
+    }
+}
+
+async function fetchFromAPI() {
+    // 初始化API接口列表
+    await API.init();
+    
+    // 重置API索引到第一个接口
+    API.reset();
+    
+    // 尝试所有API接口
+    for (let i = 0; i < API.endpoints.length; i++) {
+        try {
+            const url = API.getCurrentUrl();
+            console.log(`尝试接口 ${i + 1}/${API.endpoints.length}: ${url}`);
+            
+            const resp = await fetch(url, { 
+                cache: 'no-store',
+                timeout: 10000 // 10秒超时
+            });
+            
+            if (!resp.ok) {
+                throw new Error(`HTTP ${resp.status}: ${resp.statusText}`);
+            }
+            
+            const data = await resp.json();
+            
+            if (data && data.code === 200) {
+                console.log(`接口 ${i + 1} 请求成功`);
+                return data;
+            }
+            
+            throw new Error(data && data.message ? data.message : '接口返回异常');
+            
+        } catch (e) {
+            console.warn(`接口 ${i + 1} 失败:`, e.message);
+            
+            // 如果不是最后一个接口，切换到下一个
+            if (i < API.endpoints.length - 1) {
+                API.switchToNext();
+                continue;
+            }
+            
+            // 所有接口都失败了
+            console.warn('所有远程接口都失败，尝试本地数据');
+            return null;
+        }
+    }
+}
+
+async function fetchFromLocal() {
+    try {
+        const resp = await fetch(API.localFallback + `?t=${Date.now()}`);
+        if (!resp.ok) throw new Error(`本地文件HTTP ${resp.status}`);
+        const data = await resp.json();
+        return data;
+    } catch (e) {
+        console.error('读取本地返回接口.json失败:', e);
+        return null;
+    }
+}
+
+function renderRanking(payload) {
+    const { list = [], tip = '', update_time = '', update_time_at } = payload || {};
+
+    // 更新时间
+    if (elements.updateTime) {
+        elements.updateTime.textContent = update_time ? `更新时间：${update_time}` : '';
+    }
+
+    // 统计信息
+    if (elements.statsTotal) {
+        elements.statsTotal.textContent = list.length;
+    }
+    if (elements.statsTop10) {
+        elements.statsTop10.textContent = Math.min(10, list.length);
+    }
+
+    // 渲染列表
+    const html = `
+        <section class="ranking-container">
+            <h2 class="ranking-title">全球电影总票房排行榜</h2>
+            <div class="movie-list">
+                ${list.map(item => renderMovieItem(item)).join('')}
+            </div>
+        </section>
+        ${tip ? `<div class="update-time">${escapeHtml(tip)}</div>` : ''}
+        ${update_time ? `<div class="update-time" id="api-update-time">更新时间：${escapeHtml(update_time)}</div>` : ''}
+    `;
+
+    elements.container.innerHTML = html;
+    elements.container.classList.add('fade-in');
+}
+
+// 格式化票房数据，将数字转换为更易读的形式
+function formatBoxOffice(value) {
+    if (!value) return '未知';
+    
+    // 将字符串转换为数字
+    const num = typeof value === 'string' ? parseFloat(value.replace(/[^0-9.]/g, '')) : value;
+    
+    if (isNaN(num)) return value;
+    
+    if (num >= 100000000) {
+        return (num / 100000000).toFixed(2) + ' 亿';
+    } else if (num >= 10000) {
+        return (num / 10000).toFixed(2) + ' 万';
+    } else {
+        return num.toLocaleString();
+    }
+}
+
+function renderMovieItem(item) {
+    const rank = item.rank;
+    const cls = rank === 1 ? 'top-1' : rank === 2 ? 'top-2' : rank === 3 ? 'top-3' : '';
+    const badgeCls = rank === 1 ? 'gold' : rank === 2 ? 'silver' : rank === 3 ? 'bronze' : 'regular';
+    
+    // 格式化票房数据
+    const boxOffice = formatBoxOffice(item.boxoffice || item.box_office);
+    
+    // 美化排名显示
+    let rankDisplay;
+    if (rank === 1) {
+        rankDisplay = '🏆';
+    } else if (rank === 2) {
+        rankDisplay = '🥈';
+    } else if (rank === 3) {
+        rankDisplay = '🥉';
+    } else {
+        rankDisplay = rank;
+    }
+
+    return `
+        <div class="movie-item ${cls}">
+            <div class="movie-rank ${badgeCls}">${rankDisplay}</div>
+            <div class="movie-content">
+                <div class="movie-title">${escapeHtml(item.movie_name)}</div>
+                <div class="movie-meta">
+                    <span class="movie-year">${escapeHtml(item.release_year || '未知')}</span>
+                    <span class="movie-boxoffice">¥${boxOffice}</span>
+                </div>
+            </div>
+        </div>`;
+}
+
+
+function formatCurrencyDesc(desc, num) {
+    if (desc && typeof desc === 'string' && desc.trim()) return desc;
+    if (typeof num === 'number') {
+        // 人民币按亿元显示
+        if (num >= 1e8) return (num / 1e8).toFixed(2) + '亿元';
+        if (num >= 1e4) return (num / 1e4).toFixed(2) + '万元';
+        return num.toLocaleString('zh-CN') + '元';
+    }
+    return '—';
+}
+
+function showLoading(show) {
+    if (elements.loading) elements.loading.style.display = show ? 'block' : 'none';
+    if (elements.container) elements.container.style.display = show ? 'none' : 'block';
+}
+
+function showError(message) {
+    if (!elements.container) return;
+    elements.container.innerHTML = `
+        <div class="error">
+            <h3>⚠️ 加载失败</h3>
+            <p>${escapeHtml(message)}</p>
+            <p>请稍后重试</p>
+        </div>
+    `;
+    elements.container.style.display = 'block';
+}
+
+function escapeHtml(text) {
+    if (text == null) return '';
+    const div = document.createElement('div');
+    div.textContent = String(text);
+    return div.innerHTML;
+}
+
+// 键盘刷新快捷键 Ctrl/Cmd + R 刷新数据区域（不刷新整页）
+window.addEventListener('keydown', (e) => {
+    if ((e.ctrlKey || e.metaKey) && e.key.toLowerCase() === 'r') {
+        e.preventDefault();
+        loadMaoyanList();
+    }
+});

frontend/public/60sapi/热搜榜单/猫眼票房排行榜/接口集合.json

@@ -0,0 +1,3 @@
+[
+    "https://60s.api.shumengya.top"
+]

frontend/public/60sapi/热搜榜单/猫眼票房排行榜/返回接口.json

@@ -0,0 +1,171 @@
+{
+  "code": 200,
+  "message": "获取成功。数据来自官方/权威源头，以确保稳定与实时。开源地址 https://github.com/vikiboss/60s，反馈群 595941841",
+  "data": {
+    "list": [
+      {
+        "rank": 1,
+        "maoyan_id": 243,
+        "movie_name": "阿凡达",
+        "release_year": "2009",
+        "box_office": 21200972239,
+        "box_office_desc": "212.01亿元"
+      },
+      {
+        "rank": 2,
+        "maoyan_id": 248172,
+        "movie_name": "复仇者联盟 4：终局之战",
+        "release_year": "2019",
+        "box_office": 20299852689,
+        "box_office_desc": "203亿元"
+      },
+      {
+        "rank": 3,
+        "maoyan_id": 78461,
+        "movie_name": "阿凡达：水之道",
+        "release_year": "2022",
+        "box_office": 16825062887,
+        "box_office_desc": "168.25亿元"
+      },
+      {
+        "rank": 4,
+        "maoyan_id": 267,
+        "movie_name": "泰坦尼克号",
+        "release_year": "1997",
+        "box_office": 16423064756,
+        "box_office_desc": "164.23亿元"
+      },
+      {
+        "rank": 5,
+        "maoyan_id": 1294273,
+        "movie_name": "哪吒之魔童闹海",
+        "release_year": "2025",
+        "box_office": 15908714214,
+        "box_office_desc": "159.09亿元"
+      },
+      {
+        "rank": 6,
+        "maoyan_id": 78536,
+        "movie_name": "星球大战：原力觉醒",
+        "release_year": "2015",
+        "box_office": 15019898914,
+        "box_office_desc": "150.2亿元"
+      },
+      {
+        "rank": 7,
+        "maoyan_id": 248170,
+        "movie_name": "复仇者联盟 3：无限战争",
+        "release_year": "2018",
+        "box_office": 14882882413,
+        "box_office_desc": "148.83亿元"
+      },
+      {
+        "rank": 8,
+        "maoyan_id": 1254435,
+        "movie_name": "蜘蛛侠：英雄无归",
+        "release_year": "2021",
+        "box_office": 14160042137,
+        "box_office_desc": "141.6亿元"
+      },
+      {
+        "rank": 9,
+        "maoyan_id": 1479534,
+        "movie_name": "头脑特工队 2",
+        "release_year": "2024",
+        "box_office": 12319141075,
+        "box_office_desc": "123.19亿元"
+      },
+      {
+        "rank": 10,
+        "maoyan_id": 78602,
+        "movie_name": "侏罗纪世界",
+        "release_year": "2015",
+        "box_office": 12120986621,
+        "box_office_desc": "121.21亿元"
+      },
+      {
+        "rank": 11,
+        "maoyan_id": 1189879,
+        "movie_name": "狮子王",
+        "release_year": "2019",
+        "box_office": 12051977766,
+        "box_office_desc": "120.52亿元"
+      },
+      {
+        "rank": 12,
+        "maoyan_id": 262,
+        "movie_name": "复仇者联盟",
+        "release_year": "2012",
+        "box_office": 11026033139,
+        "box_office_desc": "110.26亿元"
+      },
+      {
+        "rank": 13,
+        "maoyan_id": 78405,
+        "movie_name": "速度与激情 7",
+        "release_year": "2015",
+        "box_office": 10988354292,
+        "box_office_desc": "109.88亿元"
+      },
+      {
+        "rank": 14,
+        "maoyan_id": 341152,
+        "movie_name": "壮志凌云 2：独行侠",
+        "release_year": "2022",
+        "box_office": 10845892091,
+        "box_office_desc": "108.46亿元"
+      },
+      {
+        "rank": 15,
+        "maoyan_id": 247949,
+        "movie_name": "冰雪奇缘 2",
+        "release_year": "2019",
+        "box_office": 10541240357,
+        "box_office_desc": "105.41亿元"
+      },
+      {
+        "rank": 16,
+        "maoyan_id": 344942,
+        "movie_name": "芭比",
+        "release_year": "2023",
+        "box_office": 10493054406,
+        "box_office_desc": "104.93亿元"
+      },
+      {
+        "rank": 17,
+        "maoyan_id": 78429,
+        "movie_name": "复仇者联盟 2：奥创纪元",
+        "release_year": "2015",
+        "box_office": 10188347873,
+        "box_office_desc": "101.88亿元"
+      },
+      {
+        "rank": 18,
+        "maoyan_id": 1250896,
+        "movie_name": "超级马里奥兄弟大电影",
+        "release_year": "2023",
+        "box_office": 9868050757,
+        "box_office_desc": "98.68亿元"
+      },
+      {
+        "rank": 19,
+        "maoyan_id": 341138,
+        "movie_name": "黑豹",
+        "release_year": "2018",
+        "box_office": 9788853998,
+        "box_office_desc": "97.89亿元"
+      },
+      {
+        "rank": 20,
+        "maoyan_id": 916,
+        "movie_name": "哈利・波特与死亡圣器（下）",
+        "release_year": "2011",
+        "box_office": 9735002643,
+        "box_office_desc": "97.35亿元"
+      }
+    ],
+    "tip": "注：内地票房数据实时更新，包括点映及预售票房。港澳台及海外票房为统计数据，每小时更新。汇率采用 2025年1月31日市场汇率，1美元≈7.2514人民币",
+    "update_time": "2025/08/19 14:41:34",
+    "update_time_at": 1755585694385
+  }
+}

frontend/public/60sapi/热搜榜单/知乎热门话题/css/background.css

@@ -0,0 +1,108 @@
+.background-container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: -1;
+    overflow: hidden;
+}
+
+.green-gradient {
+    position: absolute;
+    top: -50%;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: linear-gradient(
+        135deg,
+        rgba(0, 132, 255, 0.4) 0%,
+        rgba(0, 132, 255, 0.3) 25%,
+        rgba(0, 132, 255, 0.2) 50%,
+        rgba(0, 132, 255, 0.3) 75%,
+        rgba(0, 132, 255, 0.4) 100%
+    );
+    animation: gradient-flow 20s ease-in-out infinite;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+.green-gradient::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: radial-gradient(
+        circle at 30% 70%,
+        rgba(139, 195, 74, 0.4) 0%,
+        transparent 50%
+    ), radial-gradient(
+        circle at 70% 30%,
+        rgba(102, 187, 106, 0.3) 0%,
+        transparent 50%
+    );
+    animation: green-pulse 15s ease-in-out infinite alternate;
+}
+
+@keyframes green-flow {
+    0%, 100% {
+        transform: rotate(0deg) scale(1);
+        opacity: 0.8;
+    }
+    25% {
+        transform: rotate(90deg) scale(1.1);
+        opacity: 0.6;
+    }
+    50% {
+        transform: rotate(180deg) scale(0.9);
+        opacity: 0.9;
+    }
+    75% {
+        transform: rotate(270deg) scale(1.05);
+        opacity: 0.7;
+    }
+}
+
+@keyframes green-pulse {
+    0% {
+        transform: scale(1) rotate(0deg);
+        opacity: 0.5;
+    }
+    50% {
+        transform: scale(1.2) rotate(180deg);
+        opacity: 0.8;
+    }
+    100% {
+        transform: scale(1) rotate(360deg);
+        opacity: 0.6;
+    }
+}
+
+/* 手机端背景优化 */
+@media (max-width: 768px) {
+    .green-gradient {
+        animation-duration: 25s;
+    }
+    
+    .green-gradient::before {
+        animation-duration: 18s;
+    }
+}
+
+/* 减少动画以节省电池 */
+@media (prefers-reduced-motion: reduce) {
+    .green-gradient,
+    .green-gradient::before {
+        animation: none;
+    }
+    
+    .green-gradient {
+        background: linear-gradient(
+            135deg,
+            rgba(76, 175, 80, 0.2) 0%,
+            rgba(165, 214, 167, 0.1) 50%,
+            rgba(200, 230, 201, 0.15) 100%
+        );
+    }
+}

frontend/public/60sapi/热搜榜单/知乎热门话题/css/style.css

@@ -0,0 +1,499 @@
+/* 背景样式 */
+.background-container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: -1;
+    overflow: hidden;
+    background-color: #f8f9fa;
+}
+
+.modern-gradient {
+    position: absolute;
+    top: -50%;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: linear-gradient(
+        135deg,
+        rgba(64, 169, 255, 0.4) 0%,
+        rgba(120, 192, 255, 0.3) 25%,
+        rgba(255, 175, 64, 0.2) 50%,
+        rgba(255, 140, 50, 0.3) 75%,
+        rgba(255, 122, 69, 0.4) 100%
+    );
+    animation: gradient-flow 20s ease-in-out infinite;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+.modern-gradient::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: radial-gradient(
+        circle at 30% 70%,
+        rgba(64, 169, 255, 0.5) 0%,
+        transparent 50%
+    ), radial-gradient(
+        circle at 70% 30%,
+        rgba(255, 140, 50, 0.4) 0%,
+        transparent 50%
+    );
+    animation: pulse-effect 15s ease-in-out infinite alternate;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+@keyframes gradient-flow {
+    0%, 100% {
+        transform: rotate(0deg) scale(1);
+        opacity: 0.8;
+    }
+    25% {
+        transform: rotate(90deg) scale(1.1);
+        opacity: 0.6;
+    }
+    50% {
+        transform: rotate(180deg) scale(0.9);
+        opacity: 0.9;
+    }
+    75% {
+        transform: rotate(270deg) scale(1.05);
+        opacity: 0.7;
+    }
+}
+
+@keyframes pulse-effect {
+    0% {
+        transform: scale(1) rotate(0deg);
+        opacity: 0.5;
+    }
+    50% {
+        transform: scale(1.2) rotate(180deg);
+        opacity: 0.8;
+    }
+    100% {
+        transform: scale(1) rotate(360deg);
+        opacity: 0.6;
+    }
+}
+
+/* 主样式 */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+    font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
+    color: #333;
+    background-color: #f8f9fa;
+    position: relative;
+    min-height: 100vh;
+    line-height: 1.6;
+}
+
+.container {
+    max-width: 800px;
+    margin: 0 auto;
+    padding: 24px;
+    position: relative;
+    z-index: 1;
+    background-color: rgba(255, 255, 255, 0.85);
+    border-radius: 16px;
+    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
+    backdrop-filter: blur(10px);
+}
+
+header {
+    text-align: center;
+    margin-bottom: 28px;
+    padding-bottom: 20px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
+}
+
+header h1 {
+    background: linear-gradient(135deg, #4096ff, #ff7a45);
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+    margin-bottom: 14px;
+    font-size: 2.4rem;
+    font-weight: 700;
+    letter-spacing: -0.5px;
+}
+
+.update-time {
+    color: #666;
+    font-size: 0.9rem;
+    background-color: rgba(0, 0, 0, 0.03);
+    padding: 8px 16px;
+    border-radius: 24px;
+    display: inline-block;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
+}
+
+.hot-list {
+    list-style: none;
+}
+
+.hot-item {
+    padding: 20px;
+    margin-bottom: 16px;
+    border-radius: 12px;
+    background-color: white;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
+    transition: all 0.3s ease;
+    display: flex;
+    align-items: center;
+    border: 1px solid rgba(0, 0, 0, 0.03);
+}
+
+.hot-item:hover {
+    transform: translateY(-3px);
+    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
+    border-color: rgba(64, 169, 255, 0.3);
+}
+
+.hot-rank {
+    font-size: 1.2rem;
+    font-weight: bold;
+    color: #4096ff;
+    margin-right: 18px;
+    min-width: 38px;
+    text-align: center;
+    background-color: rgba(64, 169, 255, 0.1);
+    border-radius: 50%;
+    width: 38px;
+    height: 38px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.hot-rank.top-1 {
+    background: linear-gradient(135deg, #ff4d4f, #ff7a45);
+    color: white;
+}
+
+.hot-rank.top-2 {
+    background: linear-gradient(135deg, #ff7a45, #ffa940);
+    color: white;
+}
+
+.hot-rank.top-3 {
+    background: linear-gradient(135deg, #ffa940, #ffec3d);
+    color: white;
+}
+
+.hot-content {
+    flex: 1;
+}
+
+.hot-title {
+    font-size: 1.15rem;
+    margin-bottom: 8px;
+    color: #333;
+    text-decoration: none;
+    display: block;
+    line-height: 1.5;
+    font-weight: 500;
+    transition: color 0.2s ease;
+}
+
+.hot-title:hover {
+    color: #4096ff;
+    text-decoration: none;
+}
+
+.loading {
+    text-align: center;
+    padding: 40px;
+    color: #666;
+    font-size: 1.1rem;
+}
+
+footer {
+    text-align: center;
+    margin-top: 30px;
+    padding-top: 20px;
+    border-top: 1px solid rgba(0, 0, 0, 0.06);
+    color: #666;
+    font-size: 0.9rem;
+}
+
+/* 新增样式 */
+.topic-header {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: flex-start;
+    width: 100%;
+}
+
+/* 短内容时的布局 - 图片在右侧 */
+.topic-header.short-content {
+    flex-direction: row;
+}
+
+/* 长内容时的布局 - 图片在下方 */
+.topic-header.long-content {
+    flex-direction: column;
+}
+
+.topic-rank {
+    font-size: 1.2rem;
+    font-weight: bold;
+    color: #4096ff;
+    margin-right: 16px;
+    min-width: 36px;
+    text-align: center;
+    background-color: rgba(64, 169, 255, 0.1);
+    border-radius: 50%;
+    width: 36px;
+    height: 36px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.topic-rank.top-1 {
+    background: linear-gradient(135deg, #ff4d4f, #ff7a45);
+    color: white;
+}
+
+.topic-rank.top-2 {
+    background: linear-gradient(135deg, #ff7a45, #ffa940);
+    color: white;
+}
+
+.topic-rank.top-3 {
+    background: linear-gradient(135deg, #ffa940, #ffec3d);
+    color: white;
+}
+
+.topic-content {
+    flex: 1;
+    padding-right: 16px;
+}
+
+.topic-title {
+    font-size: 1.15rem;
+    margin-bottom: 8px;
+    color: #333;
+    text-decoration: none;
+    display: block;
+    line-height: 1.5;
+    font-weight: 600;
+    transition: color 0.2s ease;
+}
+
+.topic-title:hover {
+    color: #4096ff;
+}
+
+.topic-detail {
+    color: #666;
+    font-size: 0.95rem;
+    line-height: 1.6;
+    margin-bottom: 10px;
+    text-align: justify;
+    text-indent: 2em;
+}
+
+.topic-stats {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 12px;
+    margin-top: 8px;
+    font-size: 0.85rem;
+    color: #666;
+}
+
+.stat-item {
+    display: flex;
+    align-items: center;
+}
+
+.hot-value {
+    color: #ff4d4f;
+    font-weight: 500;
+}
+
+/* 短内容时的图片样式 - 在右侧 */
+.short-content .topic-cover {
+    width: 120px;
+    height: 80px;
+    object-fit: cover;
+    border-radius: 8px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+    align-self: center;
+    margin-left: auto;
+}
+
+/* 长内容时的图片样式 - 在下方 */
+.long-content .topic-cover {
+    width: 100%;
+    height: auto;
+    max-height: none;
+    object-fit: contain;
+    border-radius: 8px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+    margin-top: 12px;
+    margin-left: 0;
+    margin-bottom: 8px;
+}
+
+.topic-item {
+    padding: 20px;
+    margin-bottom: 16px;
+    border-radius: 12px;
+    background-color: white;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
+    transition: all 0.3s ease;
+    border: 1px solid rgba(0, 0, 0, 0.03);
+}
+
+.topic-item:hover {
+    transform: translateY(-3px);
+    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
+    border-color: rgba(64, 169, 255, 0.3);
+}
+
+/* 响应式设计 */
+@media (max-width: 1024px) and (min-width: 768px) {
+    .container {
+        max-width: 90%;
+        padding: 20px;
+    }
+    
+    header h1 {
+        font-size: 2.2rem;
+    }
+    
+    .topic-item {
+        padding: 18px;
+    }
+    
+    .topic-title {
+        font-size: 1.1rem;
+    }
+    
+    .topic-cover {
+        width: 100px;
+        height: 70px;
+    }
+}
+
+@media (max-width: 768px) {
+    body {
+        background-color: #f8f9fa;
+    }
+    
+    .container {
+        max-width: 95%;
+        margin: 12px auto;
+        padding: 16px;
+        border-radius: 12px;
+    }
+    
+    header {
+        margin-bottom: 20px;
+        padding-bottom: 16px;
+    }
+    
+    header h1 {
+        font-size: 1.8rem;
+        margin-bottom: 10px;
+    }
+    
+    .update-time {
+        font-size: 0.85rem;
+        padding: 6px 12px;
+    }
+    
+    .topic-item {
+        padding: 16px;
+        margin-bottom: 12px;
+        border-radius: 10px;
+    }
+    
+    .topic-rank {
+        font-size: 1.1rem;
+        margin-right: 14px;
+        min-width: 32px;
+        width: 32px;
+        height: 32px;
+    }
+    
+    .topic-title {
+        font-size: 1rem;
+        line-height: 1.5;
+        margin-bottom: 6px;
+    }
+    
+    .topic-cover {
+        width: 90px;
+        height: 65px;
+    }
+    
+    footer {
+        margin-top: 24px;
+        padding-top: 16px;
+        font-size: 0.85rem;
+    }
+}
+
+@media (max-width: 480px) {
+    .container {
+        margin: 8px auto;
+        padding: 14px;
+    }
+    
+    header h1 {
+        font-size: 1.6rem;
+    }
+    
+    .topic-item {
+        padding: 14px;
+        margin-bottom: 10px;
+    }
+    
+    .topic-rank {
+        font-size: 1rem;
+        margin-right: 12px;
+        min-width: 30px;
+        width: 30px;
+        height: 30px;
+    }
+    
+    .topic-title {
+        font-size: 0.95rem;
+    }
+    
+    .topic-cover {
+        width: 80px;
+        height: 60px;
+    }
+}
+
+/* 减少动画以节省电池 */
+@media (prefers-reduced-motion: reduce) {
+    .modern-gradient,
+    .modern-gradient::before {
+        animation: none;
+    }
+    
+    .modern-gradient {
+        background: linear-gradient(
+            135deg,
+            rgba(64, 169, 255, 0.3) 0%,
+            rgba(255, 175, 64, 0.2) 50%,
+            rgba(255, 122, 69, 0.25) 100%
+        );
+    }
+}

frontend/public/60sapi/热搜榜单/知乎热门话题/img/zhihu-logo.svg

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="128" height="128" viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg">
+  <path d="M53.29,80.035l7.32.002 2.41 8.24 13.128-8.24h15.477v-67.98H53.29v67.978zM46.2,80.035v-67.98H7.065V80.035H46.2z" fill="#0084FF"/>
+  <path d="M46.2,80.035v-67.98H7.065V80.035H46.2z" fill="#0084FF"/>
+  <path d="M60.61,26.48H40.11c0-6.505,1.76-14.58,8.04-14.58V5.88H30.79c0,4.44-3.6,20.32-11.21,19.77v6.505h12.93v49.4H16.09v6.56h54.13v-6.56H53.75v-49.4h6.86V26.48z" fill="#FFF"/>
+</svg>

frontend/public/60sapi/热搜榜单/知乎热门话题/index.html

@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>知乎热门话题</title>
+    <link rel="stylesheet" href="./css/style.css">
+    <link rel="stylesheet" href="./css/background.css">
+</head>
+<body>
+    <div class="background-container">
+        <div class="green-gradient"></div>
+    </div>
+    
+    <div class="container">
+        <header>
+            <h1>知乎热门话题</h1>
+            <div class="update-time" id="updateTime"></div>
+        </header>
+        
+        <main>
+            <div class="topic-list" id="topicList">
+                <div class="loading">加载中...</div>
+            </div>
+        </main>
+        
+        <footer>
+            <p>数据来源于知乎热门话题</p>
+        </footer>
+    </div>
+    
+    <script src="./js/main.js"></script>
+</body>
+</html>

frontend/public/60sapi/热搜榜单/知乎热门话题/js/main.js

@@ -0,0 +1,159 @@
+// API接口列表
+const API_ENDPOINTS = [
+    "https://60s.api.shumengya.top/v2/zhihu",
+];
+
+// 当前使用的API索引
+let currentApiIndex = 0;
+
+// DOM元素
+const topicListElement = document.getElementById('topicList');
+const updateTimeElement = document.getElementById('updateTime');
+
+// 格式化时间
+function formatDate(date) {
+    const year = date.getFullYear();
+    const month = String(date.getMonth() + 1).padStart(2, '0');
+    const day = String(date.getDate()).padStart(2, '0');
+    const hours = String(date.getHours()).padStart(2, '0');
+    const minutes = String(date.getMinutes()).padStart(2, '0');
+    const seconds = String(date.getSeconds()).padStart(2, '0');
+    
+    return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
+}
+
+// 格式化数字
+function formatNumber(num) {
+    if (num >= 10000) {
+        return (num / 10000).toFixed(1) + '万';
+    }
+    return num.toString();
+}
+
+// 渲染话题列表
+function renderTopicList(data) {
+    topicListElement.innerHTML = '';
+    
+    data.forEach((item, index) => {
+        const topicItem = document.createElement('div');
+        topicItem.className = 'topic-item';
+        
+        const rankClass = index < 3 ? `top-${index + 1}` : '';
+        
+        // 处理封面图片
+        const coverImg = item.cover ? 
+            `<img src="${item.cover}" alt="话题封面" class="topic-cover" onerror="this.style.display='none'">` : '';
+        
+        // 判断文本内容长度，决定图片位置
+        // 如果detail存在且长度较长，或者没有detail但标题较长，则图片放在下方
+        const detailLength = item.detail ? item.detail.length : 0;
+        const titleLength = item.title ? item.title.length : 0;
+        const isLongContent = detailLength > 100 || (detailLength === 0 && titleLength > 30);
+        
+        // 根据内容长度决定布局类名
+        const layoutClass = isLongContent ? 'long-content' : 'short-content';
+        
+        topicItem.innerHTML = `
+            <div class="topic-header ${layoutClass}">
+                <div class="topic-rank ${rankClass}">${index + 1}</div>
+                <div class="topic-content">
+                    <a href="${item.link}" class="topic-title" target="_blank">🔥 ${item.title}</a>
+                    ${item.detail ? `<div class="topic-detail">${item.detail}</div>` : ''}
+                    <div class="topic-stats">
+                        ${item.hot_value_desc ? `<div class="stat-item"><span class="hot-value">🔥 ${item.hot_value_desc}</span></div>` : ''}
+                        ${item.answer_cnt ? `<div class="stat-item">💬 ${formatNumber(item.answer_cnt)} 回答</div>` : ''}
+                        ${item.follower_cnt ? `<div class="stat-item">👥 ${formatNumber(item.follower_cnt)} 关注</div>` : ''}
+                    </div>
+                </div>
+                ${coverImg}
+            </div>`;
+        
+        topicListElement.appendChild(topicItem);
+    });
+    
+    // 更新时间
+    updateTimeElement.textContent = `更新时间：${formatDate(new Date())}`;
+}
+
+// 显示加载状态
+function showLoading() {
+    topicListElement.innerHTML = '<div class="loading">加载中...</div>';
+}
+
+// 显示错误状态
+function showError(message) {
+    topicListElement.innerHTML = `<div class="loading">${message}</div>`;
+}
+
+// 获取知乎热门话题数据
+async function fetchZhihuTopics() {
+    showLoading();
+    
+    try {
+        const response = await fetch(API_ENDPOINTS[currentApiIndex]);
+        
+        if (!response.ok) {
+            throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+        }
+        
+        const result = await response.json();
+        
+        if (result.code === 200 && result.data && Array.isArray(result.data)) {
+            if (result.data.length > 0) {
+                renderTopicList(result.data);
+            } else {
+                showError('暂无热门话题数据');
+            }
+        } else {
+            throw new Error('数据格式错误或无数据');
+        }
+    } catch (error) {
+        console.error('获取数据失败:', error);
+        
+        // 尝试切换到下一个API
+        const nextApiIndex = (currentApiIndex + 1) % API_ENDPOINTS.length;
+        
+        if (nextApiIndex !== 0) {
+            // 还有其他API可以尝试
+            currentApiIndex = nextApiIndex;
+            showError('获取数据失败，正在尝试其他接口...');
+            
+            // 延迟后重试
+            setTimeout(fetchZhihuTopics, 2000);
+        } else {
+            // 所有API都尝试过了
+            currentApiIndex = 0;
+            showError('所有接口都无法访问，请稍后再试');
+        }
+    }
+}
+
+// 手动刷新数据
+function refreshData() {
+    currentApiIndex = 0; // 重置API索引
+    fetchZhihuTopics();
+}
+
+// 页面加载完成后获取数据
+document.addEventListener('DOMContentLoaded', () => {
+    fetchZhihuTopics();
+    
+    // 每隔5分钟刷新一次数据
+    setInterval(fetchZhihuTopics, 5 * 60 * 1000);
+    
+    // 添加键盘快捷键支持（按R键刷新）
+    document.addEventListener('keydown', (event) => {
+        if (event.key === 'r' || event.key === 'R') {
+            event.preventDefault();
+            refreshData();
+        }
+    });
+});
+
+// 页面可见性变化时的处理
+document.addEventListener('visibilitychange', () => {
+    if (!document.hidden) {
+        // 页面重新可见时刷新数据
+        refreshData();
+    }
+});

frontend/public/60sapi/热搜榜单/知乎热门话题/接口集合.json

@@ -0,0 +1,3 @@
+[
+    "https://60s.api.shumengya.top"
+]

frontend/public/60sapi/热搜榜单/知乎热门话题/返回接口.json

@@ -0,0 +1,30 @@
+{
+  "code": 200,
+  "message": "获取成功。数据来自官方/权威源头，以确保稳定与实时。开源地址 https://github.com/vikiboss/60s，反馈群 595941841",
+  "data": [
+    {
+      "title": "你是什么时候意识到抗日战争很艰难的？",
+      "detail": "就不像抗日神剧",
+      "cover": "https://picx.zhimg.com/v2-a07a53b2e23887c7a2440cc3f1984122.png",
+      "hot_value_desc": "1311 万热度",
+      "answer_cnt": 739,
+      "follower_cnt": 1739,
+      "comment_cnt": 0,
+      "created_at": 1622774952000,
+      "created": "2021/06/04 10:49:12",
+      "link": "https://api.zhihu.com/questions/463076881"
+    },
+    {
+      "title": "为什么中国在很多领域都要求自主研发？",
+      "detail": "中国在很多领域都要求自主研发，似乎确认很多东西都有个中国版本，真有这个必要吗？",
+      "cover": "https://pic3.zhimg.com/80/v2-bb4dfa56f138980078da003df436e661_hd.png",
+      "hot_value_desc": "816 万热度",
+      "answer_cnt": 2476,
+      "follower_cnt": 12545,
+      "comment_cnt": 0,
+      "created_at": 1352205751000,
+      "created": "2012/11/06 20:42:31",
+      "link": "https://api.zhihu.com/questions/20579464"
+    }
+  ]
+}

frontend/public/60sapi/热搜榜单/网易云榜单/css/background.css

@@ -0,0 +1,128 @@
+/* 网易云音乐特色背景样式 */
+body {
+    background: linear-gradient(135deg, #2b2b2b 0%, #1e1e1e 50%, #2b2b2b 100%);
+    background-size: 400% 400%;
+    animation: gradientShift 15s ease infinite;
+    position: relative;
+    color: #fff;
+}
+
+/* 背景渐变动画 */
+@keyframes gradientShift {
+    0% {
+        background-position: 0% 50%;
+    }
+    50% {
+        background-position: 100% 50%;
+    }
+    100% {
+        background-position: 0% 50%;
+    }
+}
+
+/* 网易云红色装饰元素 */
+body::before {
+    content: '';
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-image: 
+        radial-gradient(circle at 20% 80%, rgba(236, 65, 65, 0.15) 0%, transparent 50%),
+        radial-gradient(circle at 80% 20%, rgba(236, 65, 65, 0.1) 0%, transparent 50%),
+        radial-gradient(circle at 40% 40%, rgba(236, 65, 65, 0.08) 0%, transparent 50%);
+    pointer-events: none;
+    z-index: -2;
+}
+
+/* 音符装饰效果 */
+body::after {
+    content: '';
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-image: 
+        radial-gradient(2px 2px at 20px 30px, rgba(236, 65, 65, 0.4), transparent),
+        radial-gradient(2px 2px at 40px 70px, rgba(236, 65, 65, 0.3), transparent),
+        radial-gradient(1px 1px at 90px 40px, rgba(236, 65, 65, 0.4), transparent),
+        radial-gradient(1px 1px at 130px 80px, rgba(236, 65, 65, 0.3), transparent),
+        radial-gradient(2px 2px at 160px 30px, rgba(236, 65, 65, 0.4), transparent);
+    background-repeat: repeat;
+    background-size: 200px 100px;
+    animation: particleFloat 20s linear infinite;
+    pointer-events: none;
+    z-index: -1;
+    opacity: 0.6;
+}
+
+/* 音符浮动动画 */
+@keyframes particleFloat {
+    0% {
+        transform: translateY(0px);
+    }
+    100% {
+        transform: translateY(-100px);
+    }
+}
+
+/* 音符装饰 */
+.music-note {
+    position: absolute;
+    font-size: 24px;
+    color: rgba(236, 65, 65, 0.3);
+    animation: floatNote 15s linear infinite;
+    z-index: -1;
+}
+
+@keyframes floatNote {
+    0% {
+        transform: translateY(0) rotate(0deg);
+        opacity: 0;
+    }
+    10% {
+        opacity: 0.8;
+    }
+    90% {
+        opacity: 0.8;
+    }
+    100% {
+        transform: translateY(-100vh) rotate(360deg);
+        opacity: 0;
+    }
+}
+
+/* 响应式背景调整 */
+@media (max-width: 768px) {
+    body::after {
+        background-size: 150px 75px;
+        animation-duration: 25s;
+    }
+}
+
+@media (max-width: 480px) {
+    body::after {
+        background-size: 100px 50px;
+        animation-duration: 30s;
+        opacity: 0.4;
+    }
+}
+
+/* 高性能模式 - 减少动画 */
+@media (prefers-reduced-motion: reduce) {
+    body {
+        animation: none;
+        background: linear-gradient(135deg, #2b2b2b 0%, #1e1e1e 50%, #2b2b2b 100%);
+    }
+    
+    body::after {
+        animation: none;
+    }
+    
+    .music-note {
+        animation: none;
+        display: none;
+    }
+}

frontend/public/60sapi/热搜榜单/网易云榜单/css/responsive.css

@@ -0,0 +1,194 @@
+/* 响应式样式 - 适配不同设备 */
+
+/* 基础样式 - 移动设备优先 */
+.container {
+    width: 95%;
+    padding: 15px;
+    margin: 10px auto;
+}
+
+header h1 {
+    font-size: 1.5rem;
+}
+
+.update-time {
+    font-size: 0.8rem;
+    padding: 6px 12px;
+}
+
+.rank-list {
+    grid-template-columns: 1fr;
+    gap: 16px;
+    margin-top: 15px;
+}
+
+.rank-item {
+    border-radius: 10px;
+}
+
+.rank-cover {
+    height: 160px;
+}
+
+.rank-info {
+    padding: 12px;
+}
+
+.rank-name {
+    font-size: 1rem;
+    margin-bottom: 6px;
+}
+
+.rank-desc {
+    font-size: 0.85rem;
+    margin-bottom: 10px;
+    -webkit-line-clamp: 2;
+}
+
+.rank-meta {
+    font-size: 0.75rem;
+    margin-bottom: 10px;
+}
+
+.rank-link {
+    padding: 6px 14px;
+    font-size: 0.85rem;
+}
+
+/* 平板设备 */
+@media screen and (min-width: 768px) {
+    .container {
+        width: 90%;
+        padding: 20px;
+        margin: 15px auto;
+    }
+    
+    header h1 {
+        font-size: 1.8rem;
+    }
+    
+    .update-time {
+        font-size: 0.85rem;
+        padding: 7px 14px;
+    }
+    
+    .rank-list {
+        grid-template-columns: repeat(2, 1fr);
+        gap: 20px;
+        margin-top: 20px;
+    }
+    
+    .rank-cover {
+        height: 170px;
+    }
+    
+    .rank-info {
+        padding: 15px;
+    }
+    
+    .rank-name {
+        font-size: 1.1rem;
+        margin-bottom: 8px;
+    }
+    
+    .rank-desc {
+        font-size: 0.9rem;
+        margin-bottom: 12px;
+        -webkit-line-clamp: 3;
+    }
+    
+    .rank-meta {
+        font-size: 0.8rem;
+    }
+    
+    .rank-link {
+        padding: 7px 16px;
+        font-size: 0.9rem;
+    }
+    
+    .loading-spinner {
+        width: 60px;
+        height: 60px;
+    }
+}
+
+/* 桌面设备 */
+@media screen and (min-width: 1024px) {
+    .container {
+        width: 85%;
+        max-width: 1200px;
+        margin: 20px auto;
+    }
+    
+    header h1 {
+        font-size: 2.2rem;
+    }
+    
+    .update-time {
+        font-size: 0.9rem;
+        padding: 8px 16px;
+    }
+    
+    .rank-list {
+        grid-template-columns: repeat(3, 1fr);
+        gap: 24px;
+        margin-top: 25px;
+    }
+    
+    .rank-cover {
+        height: 180px;
+    }
+    
+    .rank-info {
+        padding: 18px;
+    }
+    
+    .rank-name {
+        font-size: 1.2rem;
+        margin-bottom: 10px;
+    }
+    
+    .rank-desc {
+        font-size: 0.95rem;
+        margin-bottom: 15px;
+    }
+    
+    .rank-meta {
+        font-size: 0.85rem;
+        margin-bottom: 15px;
+    }
+    
+    .rank-link {
+        padding: 8px 18px;
+        font-size: 0.95rem;
+    }
+}
+
+/* 大屏幕设备 */
+@media screen and (min-width: 1440px) {
+    .container {
+        max-width: 1400px;
+    }
+    
+    .rank-list {
+        grid-template-columns: repeat(4, 1fr);
+        gap: 30px;
+    }
+    
+    .rank-cover {
+        height: 200px;
+    }
+    
+    .rank-name {
+        font-size: 1.25rem;
+    }
+    
+    .rank-desc {
+        font-size: 1rem;
+    }
+    
+    .rank-link {
+        padding: 10px 20px;
+        font-size: 1rem;
+    }
+}

frontend/public/60sapi/热搜榜单/网易云榜单/css/style.css

@@ -0,0 +1,474 @@
+/* 背景样式 */
+.background-container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: -1;
+    overflow: hidden;
+    background-color: #f8f9fa;
+}
+
+.modern-gradient {
+    position: absolute;
+    top: -50%;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: linear-gradient(
+        135deg,
+        rgba(64, 169, 255, 0.4) 0%,
+        rgba(120, 192, 255, 0.3) 25%,
+        rgba(255, 175, 64, 0.2) 50%,
+        rgba(255, 140, 50, 0.3) 75%,
+        rgba(255, 122, 69, 0.4) 100%
+    );
+    animation: gradient-flow 20s ease-in-out infinite;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+.modern-gradient::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: radial-gradient(
+        circle at 30% 70%,
+        rgba(64, 169, 255, 0.5) 0%,
+        transparent 50%
+    ), radial-gradient(
+        circle at 70% 30%,
+        rgba(255, 140, 50, 0.4) 0%,
+        transparent 50%
+    );
+    animation: pulse-effect 15s ease-in-out infinite alternate;
+    border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+}
+
+@keyframes gradient-flow {
+    0%, 100% {
+        transform: rotate(0deg) scale(1);
+        opacity: 0.8;
+    }
+    25% {
+        transform: rotate(90deg) scale(1.1);
+        opacity: 0.6;
+    }
+    50% {
+        transform: rotate(180deg) scale(0.9);
+        opacity: 0.9;
+    }
+    75% {
+        transform: rotate(270deg) scale(1.05);
+        opacity: 0.7;
+    }
+}
+
+@keyframes pulse-effect {
+    0% {
+        transform: scale(1) rotate(0deg);
+        opacity: 0.5;
+    }
+    50% {
+        transform: scale(1.2) rotate(180deg);
+        opacity: 0.8;
+    }
+    100% {
+        transform: scale(1) rotate(360deg);
+        opacity: 0.6;
+    }
+}
+
+/* 主样式 */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+    font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
+    color: #333;
+    background-color: #f8f9fa;
+    position: relative;
+    min-height: 100vh;
+    overflow-x: hidden;
+    line-height: 1.6;
+}
+
+.container {
+    max-width: 800px;
+    margin: 0 auto;
+    padding: 24px;
+    position: relative;
+    z-index: 1;
+    background-color: rgba(255, 255, 255, 0.85);
+    border-radius: 16px;
+    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
+    backdrop-filter: blur(10px);
+    position: relative;
+}
+
+header {
+    text-align: center;
+    margin-bottom: 28px;
+    padding-bottom: 20px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
+}
+
+header h1 {
+    background: linear-gradient(135deg, #4096ff, #ff7a45);
+    -webkit-background-clip: text;
+    background-clip: text;
+    color: transparent;
+    margin-bottom: 14px;
+    font-size: 2.4rem;
+    font-weight: 700;
+    letter-spacing: -0.5px;
+}
+
+.update-time {
+    color: #666;
+    font-size: 0.9rem;
+    background-color: rgba(0, 0, 0, 0.03);
+    padding: 8px 16px;
+    border-radius: 24px;
+    display: inline-block;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
+}
+
+.rank-list {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
+    gap: 24px;
+    margin-top: 20px;
+}
+
+.rank-item {
+    background-color: white;
+    border-radius: 12px;
+    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
+    overflow: hidden;
+    transition: all 0.3s ease;
+    display: flex;
+    flex-direction: column;
+    border: 1px solid rgba(0, 0, 0, 0.05);
+}
+
+.rank-item:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
+    border-color: rgba(236, 65, 65, 0.3);
+}
+
+.rank-cover {
+    position: relative;
+    height: 180px;
+    overflow: hidden;
+}
+
+.rank-cover img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    transition: transform 0.5s ease;
+}
+
+.rank-item:hover .rank-cover img {
+    transform: scale(1.05);
+}
+
+.rank-update {
+    position: absolute;
+    bottom: 0;
+    right: 0;
+    background: rgba(236, 65, 65, 0.8);
+    color: white;
+    padding: 4px 10px;
+    font-size: 0.8rem;
+    border-top-left-radius: 8px;
+}
+
+.rank-info {
+    padding: 16px;
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+}
+
+.rank-name {
+    font-size: 1.2rem;
+    font-weight: 600;
+    margin-bottom: 8px;
+    color: #333;
+}
+
+.rank-desc {
+    font-size: 0.9rem;
+    color: #666;
+    margin-bottom: 12px;
+    display: -webkit-box;
+    -webkit-line-clamp: 3;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+    flex: 1;
+}
+
+.rank-meta {
+    font-size: 0.8rem;
+    color: #999;
+    margin-bottom: 12px;
+}
+
+.rank-link {
+    display: inline-block;
+    background: linear-gradient(135deg, #ec4141, #ff7a45);
+    color: white;
+    text-decoration: none;
+    padding: 8px 16px;
+    border-radius: 20px;
+    font-size: 0.9rem;
+    text-align: center;
+    transition: all 0.3s ease;
+    box-shadow: 0 2px 8px rgba(236, 65, 65, 0.3);
+}
+
+.rank-link:hover {
+    background: linear-gradient(135deg, #d73435, #f06937);
+    box-shadow: 0 4px 12px rgba(236, 65, 65, 0.4);
+    transform: translateY(-2px);
+}
+
+.hot-title {
+    font-size: 1.15rem;
+    margin-bottom: 8px;
+    color: #333;
+    text-decoration: none;
+    display: block;
+    line-height: 1.5;
+    font-weight: 500;
+    transition: color 0.2s ease;
+}
+
+.hot-title:hover {
+    color: #4096ff;
+    text-decoration: none;
+}
+
+.loading {
+    text-align: center;
+    padding: 40px;
+    color: #666;
+    font-size: 1.1rem;
+}
+
+.loading-spinner {
+    display: inline-block;
+    width: 50px;
+    height: 50px;
+    border: 3px solid rgba(236, 65, 65, 0.3);
+    border-radius: 50%;
+    border-top-color: #ec4141;
+    animation: spin 1s ease-in-out infinite;
+    margin-bottom: 16px;
+}
+
+@keyframes spin {
+    to { transform: rotate(360deg); }
+}
+
+.error-message {
+    text-align: center;
+    padding: 40px;
+    color: #ff4d4f;
+    font-size: 1.1rem;
+}
+
+.retry-button {
+    background: #ec4141;
+    color: white;
+    border: none;
+    padding: 8px 20px;
+    border-radius: 20px;
+    font-size: 0.9rem;
+    margin-top: 16px;
+    cursor: pointer;
+    transition: all 0.3s ease;
+}
+
+.retry-button:hover {
+    background: #d73435;
+    box-shadow: 0 2px 8px rgba(236, 65, 65, 0.4);
+}
+
+footer {
+    text-align: center;
+    margin-top: 30px;
+    padding-top: 20px;
+    border-top: 1px solid rgba(0, 0, 0, 0.06);
+    color: #666;
+    font-size: 0.9rem;
+}
+
+/* 音符装饰样式 */
+.music-note {
+    position: fixed;
+    font-size: 24px;
+    color: rgba(236, 65, 65, 0.6);
+    z-index: 0;
+    pointer-events: none;
+    animation: floatNote 20s linear infinite;
+    text-shadow: 0 0 5px rgba(255, 255, 255, 0.7);
+}
+
+@keyframes floatNote {
+    0% {
+        transform: translateY(0) rotate(0deg);
+        opacity: 0.7;
+    }
+    50% {
+        transform: translateY(-100px) rotate(180deg);
+        opacity: 0.9;
+    }
+    100% {
+        transform: translateY(-200px) rotate(360deg);
+        opacity: 0;
+    }
+}
+
+/* 响应式设计 */
+@media (max-width: 1024px) and (min-width: 768px) {
+    .container {
+        max-width: 90%;
+        padding: 20px;
+    }
+    
+    header h1 {
+        font-size: 2.2rem;
+    }
+    
+    .hot-item {
+        padding: 18px;
+    }
+    
+    .hot-title {
+        font-size: 1.1rem;
+    }
+    
+    .music-note {
+        font-size: 22px;
+    }
+}
+
+@media (max-width: 768px) {
+    body {
+        background-color: #f8f9fa;
+    }
+    
+    .container {
+        max-width: 95%;
+        margin: 12px auto;
+        padding: 16px;
+        border-radius: 12px;
+    }
+    
+    header {
+        margin-bottom: 20px;
+        padding-bottom: 16px;
+    }
+    
+    header h1 {
+        font-size: 1.8rem;
+        margin-bottom: 10px;
+    }
+    
+    .update-time {
+        font-size: 0.85rem;
+        padding: 6px 12px;
+    }
+    
+    .hot-item {
+        padding: 16px;
+        margin-bottom: 12px;
+        border-radius: 10px;
+        flex-direction: row;
+        align-items: flex-start;
+    }
+    
+    .hot-rank {
+        font-size: 1.1rem;
+        margin-right: 14px;
+        min-width: 32px;
+        width: 32px;
+        height: 32px;
+        margin-top: 2px;
+    }
+    
+    .hot-title {
+        font-size: 1rem;
+        line-height: 1.5;
+        margin-bottom: 6px;
+    }
+    
+    footer {
+        margin-top: 24px;
+        padding-top: 16px;
+        font-size: 0.85rem;
+    }
+    
+    .music-note {
+        font-size: 20px;
+    }
+}
+
+@media (max-width: 480px) {
+    .container {
+        margin: 8px auto;
+        padding: 14px;
+    }
+    
+    header h1 {
+        font-size: 1.6rem;
+    }
+    
+    .hot-item {
+        padding: 14px;
+        margin-bottom: 10px;
+    }
+    
+    .hot-rank {
+        font-size: 1rem;
+        margin-right: 12px;
+        min-width: 30px;
+        width: 30px;
+        height: 30px;
+    }
+    
+    .hot-title {
+        font-size: 0.95rem;
+    }
+    
+    .music-note {
+        font-size: 16px;
+    }
+}
+
+/* 减少动画以节省电池 */
+@media (prefers-reduced-motion: reduce) {
+    .modern-gradient,
+    .modern-gradient::before {
+        animation: none;
+    }
+    
+    .modern-gradient {
+        background: linear-gradient(
+            135deg,
+            rgba(64, 169, 255, 0.3) 0%,
+            rgba(255, 175, 64, 0.2) 50%,
+            rgba(255, 122, 69, 0.25) 100%
+        );
+    }
+}

frontend/public/60sapi/热搜榜单/网易云榜单/index.html

@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>网易云音乐榜单 - InfoGenie</title>
+    <meta name="description" content="网易云音乐各类榜单，包括飙升榜、热歌榜、新歌榜等">
+    <link rel="stylesheet" href="./css/background.css">
+    <link rel="stylesheet" href="./css/style.css">
+    <link rel="stylesheet" href="./css/responsive.css">
+</head>
+<body>
+    <!-- 背景效果 -->
+    <div class="background-container">
+        <div class="modern-gradient"></div>
+    </div>
+    
+    <!-- 音符装饰 -->
+    <div id="music-notes-container"></div>
+    
+    <div class="container">
+        <header>
+            <h1>网易云音乐榜单</h1>
+            <div class="update-time" id="update-time">加载中...</div>
+        </header>
+        
+        <main>
+            <div id="loading" class="loading">
+                <div class="loading-spinner"></div>
+                <p>正在加载榜单数据...</p>
+            </div>
+            
+            <div id="error-message" class="error-message" style="display: none;">
+                <p>加载失败，请稍后再试</p>
+                <button id="retry-button" class="retry-button">重试</button>
+            </div>
+            
+            <div id="rank-list" class="rank-list" style="display: none;"></div>
+        </main>
+        
+        <footer>
+            <p>数据来源：网易云音乐官方API</p>
+            <p>© 2024 InfoGenie - 网易云音乐榜单</p>
+        </footer>
+    </div>
+    
+    <script src="./js/app.js"></script>
+</body>
+</html>

frontend/public/60sapi/热搜榜单/网易云榜单/js/app.js

@@ -0,0 +1,252 @@
+/**
+ * 网易云音乐榜单 - 主应用脚本
+ * 功能：获取API数据、渲染榜单、处理错误、自动切换API接口
+ */
+
+// 全局变量
+const apiUrls = [];
+let currentApiIndex = 0;
+let rankData = null;
+
+// DOM元素
+const loadingElement = document.getElementById('loading');
+const errorElement = document.getElementById('error-message');
+const rankListElement = document.getElementById('rank-list');
+const updateTimeElement = document.getElementById('update-time');
+const retryButton = document.getElementById('retry-button');
+
+// 初始化函数
+async function init() {
+    try {
+        // 获取API接口列表
+        await loadApiUrls();
+        
+        // 获取榜单数据
+        await fetchRankData();
+        
+        // 添加音符装饰
+        createMusicNotes();
+    } catch (error) {
+        console.error('初始化失败:', error);
+        showError();
+    }
+}
+
+// 加载API接口列表
+async function loadApiUrls() {
+    try {
+        const response = await fetch('./接口集合.json');
+        if (!response.ok) {
+            throw new Error('无法加载API接口列表');
+        }
+        const data = await response.json();
+        if (Array.isArray(data) && data.length > 0) {
+            apiUrls.push(...data);
+            console.log('已加载API接口列表:', apiUrls);
+        } else {
+            throw new Error('API接口列表为空');
+        }
+    } catch (error) {
+        console.error('加载API接口列表失败:', error);
+        // 使用默认API
+        apiUrls.push('https://60s.api.shumengya.top/v2/ncm-rank');
+    }
+}
+
+// 获取榜单数据
+async function fetchRankData() {
+    showLoading();
+    
+    // 如果没有API接口，显示错误
+    if (apiUrls.length === 0) {
+        throw new Error('没有可用的API接口');
+    }
+    
+    try {
+        const apiUrl = apiUrls[currentApiIndex];
+        const response = await fetch(apiUrl);
+        
+        if (!response.ok) {
+            throw new Error(`API请求失败: ${response.status}`);
+        }
+        
+        const data = await response.json();
+        
+        if (data.code === 200 && data.data && Array.isArray(data.data)) {
+            rankData = data;
+            renderRankList(data.data);
+            updateLastUpdateTime(data);
+            hideLoading();
+        } else {
+            throw new Error('API返回数据格式错误');
+        }
+    } catch (error) {
+        console.error('获取榜单数据失败:', error);
+        // 尝试切换到下一个API
+        if (tryNextApi()) {
+            return fetchRankData();
+        } else {
+            showError();
+        }
+    }
+}
+
+// 尝试切换到下一个API
+function tryNextApi() {
+    if (currentApiIndex < apiUrls.length - 1) {
+        currentApiIndex++;
+        console.log(`切换到下一个API: ${apiUrls[currentApiIndex]}`);
+        return true;
+    }
+    return false;
+}
+
+// 渲染榜单列表
+function renderRankList(ranks) {
+    if (!Array.isArray(ranks) || ranks.length === 0) {
+        showError('没有榜单数据');
+        return;
+    }
+    
+    rankListElement.innerHTML = '';
+    
+    ranks.forEach(rank => {
+        const rankItem = document.createElement('div');
+        rankItem.className = 'rank-item';
+        
+        // 构建榜单项HTML
+        rankItem.innerHTML = `
+            <div class="rank-cover">
+                <img src="${rank.cover}" alt="${rank.name}" loading="lazy">
+                <div class="rank-update">${rank.update_frequency || '定期更新'}</div>
+            </div>
+            <div class="rank-info">
+                <h3 class="rank-name">${rank.name}</h3>
+                <p class="rank-desc">${rank.description || '暂无描述'}</p>
+                <div class="rank-meta">
+                    <span class="rank-updated">更新: ${formatDate(rank.updated)}</span>
+                </div>
+                <a href="${rank.link}" target="_blank" class="rank-link">查看详情</a>
+            </div>
+        `;
+        
+        rankListElement.appendChild(rankItem);
+    });
+    
+    rankListElement.style.display = 'grid';
+}
+
+// 更新最后更新时间
+function updateLastUpdateTime(data) {
+    if (data && data.data && data.data.length > 0) {
+        const latestRank = data.data.reduce((latest, current) => {
+            const latestDate = latest.updated_at || 0;
+            const currentDate = current.updated_at || 0;
+            return currentDate > latestDate ? current : latest;
+        }, data.data[0]);
+        
+        if (latestRank && latestRank.updated) {
+            updateTimeElement.textContent = `最近更新: ${formatDate(latestRank.updated)}`;
+        } else {
+            updateTimeElement.textContent = '数据已更新';
+        }
+    }
+}
+
+// 格式化日期
+function formatDate(dateStr) {
+    if (!dateStr) return '未知';
+    
+    try {
+        const date = new Date(dateStr.replace('2025-', '2024-'));
+        if (isNaN(date.getTime())) return dateStr;
+        
+        return date.toLocaleDateString('zh-CN', {
+            year: 'numeric',
+            month: '2-digit',
+            day: '2-digit',
+            hour: '2-digit',
+            minute: '2-digit'
+        }).replace(/\//g, '-');
+    } catch (e) {
+        return dateStr;
+    }
+}
+
+// 创建音符装饰
+function createMusicNotes() {
+    const notesContainer = document.getElementById('music-notes-container');
+    const notes = ['♪', '♫', '♬', '♩', '♭', '♮'];
+    const containerWidth = window.innerWidth;
+    const containerHeight = window.innerHeight;
+    
+    // 清空容器
+    notesContainer.innerHTML = '';
+    
+    // 创建15个音符
+    for (let i = 0; i < 15; i++) {
+        const note = document.createElement('div');
+        note.className = 'music-note';
+        note.textContent = notes[Math.floor(Math.random() * notes.length)];
+        
+        // 随机位置
+        const left = Math.random() * containerWidth;
+        const top = Math.random() * containerHeight;
+        
+        // 随机动画延迟
+        const delay = Math.random() * 20;
+        const duration = 15 + Math.random() * 15;
+        
+        // 设置样式
+        note.style.left = `${left}px`;
+        note.style.top = `${top}px`;
+        note.style.animationDelay = `${delay}s`;
+        note.style.animationDuration = `${duration}s`;
+        
+        notesContainer.appendChild(note);
+    }
+}
+
+// 显示加载中
+function showLoading() {
+    loadingElement.style.display = 'block';
+    errorElement.style.display = 'none';
+    rankListElement.style.display = 'none';
+}
+
+// 隐藏加载中
+function hideLoading() {
+    loadingElement.style.display = 'none';
+}
+
+// 显示错误信息
+function showError(message = '加载失败，请稍后再试') {
+    loadingElement.style.display = 'none';
+    errorElement.querySelector('p').textContent = message;
+    errorElement.style.display = 'block';
+}
+
+// 重试按钮点击事件
+retryButton.addEventListener('click', () => {
+    // 重置API索引
+    currentApiIndex = 0;
+    // 重新获取数据
+    fetchRankData();
+});
+
+// 窗口大小改变时重新创建音符
+window.addEventListener('resize', debounce(createMusicNotes, 300));
+
+// 防抖函数
+function debounce(func, wait) {
+    let timeout;
+    return function() {
+        const context = this;
+        const args = arguments;
+        clearTimeout(timeout);
+        timeout = setTimeout(() => func.apply(context, args), wait);
+    };
+}
+
+// 页面加载完成后初始化
+document.addEventListener('DOMContentLoaded', init);

frontend/public/60sapi/热搜榜单/网易云榜单/接口集合.json

@@ -0,0 +1,3 @@
+[
+    "https://60s.api.shumengya.top/v2/ncm-rank"
+]

frontend/public/60sapi/热搜榜单/网易云榜单/返回接口.json

@@ -0,0 +1,750 @@
+{
+    "code": 200,
+    "message": "获取成功。数据来自官方/权威源头，以确保稳定与实时。开源地址 https://github.com/vikiboss/60s，反馈群 595941841",
+    "data": [
+        {
+            "id": 19723756,
+            "name": "飙升榜",
+            "description": "云音乐中每天热度上升最快的100首单曲，每日更新。",
+            "cover": "https://p2.music.126.net/rIi7Qzy2i2Y_1QD7cd0MYA==/109951170048506929.jpg",
+            "update_frequency": "更新78首",
+            "updated": "2025-09-05 08:24:41",
+            "updated_at": 1757031881385,
+            "created": "2014-06-30 15:58:56",
+            "created_at": 1404115136883,
+            "link": "https://music.163.com/#/discover/toplist?id=19723756"
+        },
+        {
+            "id": 3779629,
+            "name": "新歌榜",
+            "description": "云音乐新歌榜：云音乐用户一周内收听所有新歌（一月内最新发行） 官方TOP排行榜，每天更新。",
+            "cover": "https://p2.music.126.net/5guhqPBTcIrrhLBotgaT6w==/109951170048511751.jpg",
+            "update_frequency": "刚刚更新",
+            "updated": "2025-09-05 08:24:50",
+            "updated_at": 1757031890587,
+            "created": "2013-09-09 18:09:58",
+            "created_at": 1378721398225,
+            "link": "https://music.163.com/#/discover/toplist?id=3779629"
+        },
+        {
+            "id": 2884035,
+            "name": "原创榜",
+            "description": "云音乐独立原创音乐人作品官方榜单，以推荐优秀原创作品为目的。每周四网易云音乐首发。申请网易音乐人：http://music.163.com/nmusician/",
+            "cover": "https://p2.music.126.net/BaP9nrocNTL3gGThysv4eQ==/109951170091896587.jpg",
+            "update_frequency": "每周四更新",
+            "updated": "2025-09-04 10:54:42",
+            "updated_at": 1756954482653,
+            "created": "2013-07-25 14:05:25",
+            "created_at": 1374732325894,
+            "link": "https://music.163.com/#/discover/toplist?id=2884035"
+        },
+        {
+            "id": 3778678,
+            "name": "热歌榜",
+            "description": "云音乐热歌榜：云音乐用户一周内收听所有线上歌曲官方TOP排行榜，每日更新。",
+            "cover": "https://p2.music.126.net/0SUEG8yDACfx0Bw2MYFv4Q==/109951170048519512.jpg",
+            "update_frequency": "更新14首",
+            "updated": "2025-09-05 08:25:03",
+            "updated_at": 1757031903733,
+            "created": "2013-09-09 18:10:06",
+            "created_at": 1378721406014,
+            "link": "https://music.163.com/#/discover/toplist?id=3778678"
+        },
+        {
+            "id": 991319590,
+            "name": "网易云中文说唱榜",
+            "description": "网易云原创说唱音乐人作品官方榜单，每周五更新。以网易云用户一周播放热度为主，收录2个月内发行的原创说唱作品，按照综合数据排名取前50名。申请网易音乐人：http://music.163.com/nmusician",
+            "cover": "https://p2.music.126.net/GgHbgDfGXHpE2YTchU7IvA==/109951171510498108.jpg",
+            "update_frequency": "每周五更新",
+            "updated": "2025-08-29 10:19:58",
+            "updated_at": 1756433998618,
+            "created": "2017-11-10 13:06:29",
+            "created_at": 1510290389440,
+            "link": "https://music.163.com/#/discover/toplist?id=991319590"
+        },
+        {
+            "id": 71384707,
+            "name": "网易云古典榜",
+            "description": "网易云用户一周内收听所有古典音乐官方TOP排行榜，每周四更新。",
+            "cover": "https://p2.music.126.net/urByD_AmfBDBrs7fA9-O8A==/109951167976973225.jpg",
+            "update_frequency": "每周四更新",
+            "updated": "2025-09-04 10:52:54",
+            "updated_at": 1756954374913,
+            "created": "2015-05-07 11:22:00",
+            "created_at": 1430968920537,
+            "link": "https://music.163.com/#/discover/toplist?id=71384707"
+        },
+        {
+            "id": 1978921795,
+            "name": "网易云电音榜",
+            "description": "网易云用户一周内收听电子音乐官方TOP排行榜，每周五更新。喜力星电音，用先锋电音带你解锁全新维度和体验！",
+            "cover": "https://p2.music.126.net/hXGObvXfsGtFjFvRhOYAkA==/109951170091888741.jpg",
+            "update_frequency": "每周五更新",
+            "updated": "2025-08-29 12:00:01",
+            "updated_at": 1756440001367,
+            "created": "2017-11-16 17:47:12",
+            "created_at": 1510825632233,
+            "link": "https://music.163.com/#/discover/toplist?id=1978921795"
+        },
+        {
+            "id": 14028249541,
+            "name": "网易云全球说唱榜",
+            "description": "想聆听世界的说唱节奏？全球说唱榜每周五更新，聚焦华语地区以外的优秀说唱作品。根据云音乐用户每周播放热度数据，按照综合数据排名取前 50 名。",
+            "cover": "https://p2.music.126.net/0hhFjP6WyIjHYDXKW5E7BA==/109951171535150782.jpg",
+            "update_frequency": "每周五更新",
+            "updated": "2025-08-29 11:51:16",
+            "updated_at": 1756439476712,
+            "created": "2025-07-24 14:09:26",
+            "created_at": 1753337366883,
+            "link": "https://music.163.com/#/discover/toplist?id=14028249541"
+        },
+        {
+            "id": 13372522766,
+            "name": "潮流风向榜",
+            "description": "精心挑选云音乐极具声量的音乐作品，呈现歌曲真实热度趋势，榜单每日更新。",
+            "cover": "https://p2.music.126.net/dIKA5e7jCncz2Br1Toxgaw==/109951170621574552.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-09-04 12:05:58",
+            "updated_at": 1756958758114,
+            "created": "2025-02-26 14:01:33",
+            "created_at": 1740549693794,
+            "link": "https://music.163.com/#/discover/toplist?id=13372522766"
+        },
+        {
+            "id": 12911403728,
+            "name": "音乐合伙人推荐榜",
+            "description": "音乐合伙人近一个月内推荐过的歌曲官方TOP排行榜，每周一更新。 跟随音乐合伙人的步伐，一起发现那些隐藏的音乐瑰宝。",
+            "cover": "https://p2.music.126.net/s6ITpmGjKbyDpi7DPkqd2w==/109951170187827373.jpg",
+            "update_frequency": "每周一更新",
+            "updated": "2025-09-01 12:06:04",
+            "updated_at": 1756699564013,
+            "created": "2024-11-25 15:14:30",
+            "created_at": 1732518870190,
+            "link": "https://music.163.com/#/discover/toplist?id=12911403728"
+        },
+        {
+            "id": 12911589513,
+            "name": "音乐合伙人热歌榜",
+            "description": "音乐合伙人近一周评定过的高分热歌官方TOP排行榜，每周一更新。 跟随音乐合伙人的步伐，一起发现那些隐藏的音乐瑰宝。",
+            "cover": "https://p2.music.126.net/RgYxQmB-ZUjkMRo2N1jWnQ==/109951170187823494.jpg",
+            "update_frequency": "每周一更新",
+            "updated": "2025-09-01 12:06:01",
+            "updated_at": 1756699561725,
+            "created": "2024-11-25 15:13:46",
+            "created_at": 1732518826543,
+            "link": "https://music.163.com/#/discover/toplist?id=12911589513"
+        },
+        {
+            "id": 12911619970,
+            "name": "音乐合伙人留名榜",
+            "description": "音乐合伙人近一个月内留名过的所有歌曲官方TOP排行榜，每周一更新。 跟随音乐合伙人的步伐，一起发现那些隐藏的音乐瑰宝。",
+            "cover": "https://p2.music.126.net/aJJzGIxhkVaD7dX0XBNUnw==/109951170187831145.jpg",
+            "update_frequency": "每周一更新",
+            "updated": "2025-09-01 12:05:49",
+            "updated_at": 1756699549550,
+            "created": "2024-11-25 15:12:50",
+            "created_at": 1732518770868,
+            "link": "https://music.163.com/#/discover/toplist?id=12911619970"
+        },
+        {
+            "id": 12911379734,
+            "name": "音乐合伙人高分新歌榜",
+            "description": "音乐合伙人近期评定过的所有新歌（一个月内最新发行）官方TOP排行榜，每周一更新。 跟随音乐合伙人的步伐，一起发现那些隐藏的音乐瑰宝。",
+            "cover": "https://p2.music.126.net/bfk15bvanhdPFU7yjPFgWA==/109951170187832038.jpg",
+            "update_frequency": "每周一更新",
+            "updated": "2025-09-01 12:05:54",
+            "updated_at": 1756699554077,
+            "created": "2024-11-25 15:11:53",
+            "created_at": 1732518713161,
+            "link": "https://music.163.com/#/discover/toplist?id=12911379734"
+        },
+        {
+            "id": 12768855486,
+            "name": "音乐合伙人高分榜",
+            "description": "音乐合伙人的高分歌曲官方榜单，收录近半年来获得音乐合伙人高分推荐的TOP100首歌曲，每日更新。跟随音乐合伙人的步伐，一起发现那些隐藏的音乐瑰宝。",
+            "cover": "https://p2.music.126.net/fPP5T0Z8Ac15qNvRTcHa6g==/109951170074028970.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-09-04 12:05:49",
+            "updated_at": 1756958749724,
+            "created": "2024-10-25 11:51:10",
+            "created_at": 1729828270342,
+            "link": "https://music.163.com/#/discover/toplist?id=12768855486"
+        },
+        {
+            "id": 5453912201,
+            "name": "黑胶VIP爱听榜",
+            "description": "云音乐站内会员播放热度TOP100的歌曲，每周四更新。\n黑胶们都爱听什么歌曲？\n热门好歌一站式收听，让你念念不忘~\n做尊贵黑胶，畅听品味好歌~",
+            "cover": "https://p2.music.126.net/qo6-o9n5AhMjNyejev38-A==/109951169743111905.jpg",
+            "update_frequency": "每周四更新",
+            "updated": "2025-09-04 18:05:01",
+            "updated_at": 1756980301317,
+            "created": "2021-01-08 14:30:24",
+            "created_at": 1610087424470,
+            "link": "https://music.163.com/#/discover/toplist?id=5453912201"
+        },
+        {
+            "id": 71385702,
+            "name": "网易云ACG榜",
+            "description": "网易云用户一周内收听所有ACG音乐官方TOP排行榜，每周四更新。",
+            "cover": "https://p2.music.126.net/na1kEeCS1iZEkzOrs9r_9g==/109951167976973667.jpg",
+            "update_frequency": "每周四更新",
+            "updated": "2025-09-04 10:19:13",
+            "updated_at": 1756952353409,
+            "created": "2015-05-07 11:22:15",
+            "created_at": 1430968935040,
+            "link": "https://music.163.com/#/discover/toplist?id=71385702"
+        },
+        {
+            "id": 745956260,
+            "name": "网易云韩语榜",
+            "description": "网易云用户一周内收听所有韩语歌曲官方TOP排行榜，每周四更新。",
+            "cover": "https://p2.music.126.net/5oN9YaFznwNGXkmi8i2Ytw==/109951167430864741.jpg",
+            "update_frequency": "每周四更新",
+            "updated": "2025-09-04 10:30:40",
+            "updated_at": 1756953040555,
+            "created": "2017-05-31 11:34:51",
+            "created_at": 1496201691281,
+            "link": "https://music.163.com/#/discover/toplist?id=745956260"
+        },
+        {
+            "id": 180106,
+            "name": "UK排行榜周榜",
+            "description": "UK排行榜",
+            "cover": "https://p2.music.126.net/fhAqiflLy3eU-ldmBQByrg==/109951165613082765.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-09-01 10:26:53",
+            "updated_at": 1756693613998,
+            "created": "2013-02-19 10:09:26",
+            "created_at": 1361239766844,
+            "link": "https://music.163.com/#/discover/toplist?id=180106"
+        },
+        {
+            "id": 60198,
+            "name": "美国Billboard榜",
+            "description": "美国Billboard排行榜",
+            "cover": "https://p2.music.126.net/rwRsVIJHQ68gglhA6TNEYA==/109951165611413732.jpg",
+            "update_frequency": "每周三更新",
+            "updated": "2025-09-03 10:40:27",
+            "updated_at": 1756867227129,
+            "created": "2013-01-22 10:51:16",
+            "created_at": 1358823076818,
+            "link": "https://music.163.com/#/discover/toplist?id=60198"
+        },
+        {
+            "id": 3812895,
+            "name": "Beatport全球电子舞曲榜",
+            "description": "Beatport全球电子舞曲排行榜TOP100（本榜每周三更新）",
+            "cover": "https://p2.music.126.net/oT-RHuPBJiD7WMoU7WG5Rw==/109951166093489621.jpg",
+            "update_frequency": "每周三更新",
+            "updated": "2025-09-03 10:51:47",
+            "updated_at": 1756867907849,
+            "created": "2013-09-11 16:03:09",
+            "created_at": 1378886589466,
+            "link": "https://music.163.com/#/discover/toplist?id=3812895"
+        },
+        {
+            "id": 21845217,
+            "name": "KTV唛榜",
+            "description": "KTV唛榜是目前国内首个以全国超过200家KTV点歌平台真实数据的当红歌曲榜单。所涉及的KTV店铺覆盖全国近100多个城市，囊括一、二、三线各级城市及地区。在综合全国各地KTV点唱数据的前提下进行汇总与统计。为了保证信息的及时性，唛榜每周五更新。提供给K迷们最新和最准确的数据。",
+            "cover": "https://p2.music.126.net/5wDP78s43ydVTKt62C8OjQ==/109951165613100063.jpg",
+            "update_frequency": "每周五更新",
+            "updated": "2021-11-26 17:56:43",
+            "updated_at": 1637920603975,
+            "created": "2014-07-18 11:11:33",
+            "created_at": 1405653093230,
+            "link": "https://music.163.com/#/discover/toplist?id=21845217"
+        },
+        {
+            "id": 60131,
+            "name": "日本Oricon榜",
+            "description": "日本Oricon数字单曲周榜，每周三更新，欢迎关注。",
+            "cover": "https://p2.music.126.net/aXUPgImt8hhf4cMUZEjP4g==/109951165611417794.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-08-29 10:20:10",
+            "updated_at": 1756434010126,
+            "created": "2013-01-08 16:51:24",
+            "created_at": 1357635084874,
+            "link": "https://music.163.com/#/discover/toplist?id=60131"
+        },
+        {
+            "id": 2809513713,
+            "name": "网易云欧美热歌榜",
+            "description": "网易云用户一周内收听所有欧美歌曲官方TOP排行榜，每周四更新。\nWestern Hit Chart (updated every Thursday)",
+            "cover": "https://p2.music.126.net/70_EO_Dc7NT_hhfvsapzcQ==/109951167430862162.jpg",
+            "update_frequency": "每周四更新",
+            "updated": "2025-09-04 09:44:52",
+            "updated_at": 1756950292193,
+            "created": "2019-05-22 10:49:33",
+            "created_at": 1558493373769,
+            "link": "https://music.163.com/#/discover/toplist?id=2809513713"
+        },
+        {
+            "id": 2809577409,
+            "name": "网易云欧美新歌榜",
+            "description": "网易云用户一周内收听所有欧美新歌（一月内最新发行）官方TOP排行榜，每天更新。\nWestern New Release Chart (new songs released in last 30 days, updated daily)\n",
+            "cover": "https://p2.music.126.net/0lPWpI9Ejn1OiW2LSbg-qw==/109951167430863224.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-09-04 09:44:27",
+            "updated_at": 1756950267625,
+            "created": "2019-05-22 10:46:54",
+            "created_at": 1558493214795,
+            "link": "https://music.163.com/#/discover/toplist?id=2809577409"
+        },
+        {
+            "id": 27135204,
+            "name": "法国 NRJ Vos Hits 周榜",
+            "description": "法国NRJ电台（national Radio de Jeunes）成立于1981年，总部位于法国巴黎。是法国最受欢迎的音乐电台和听众最多的广播电台之一。NRJ音乐奖素有法国的“格莱美”之称。此榜单针对NRJ电台法国本土热门歌曲排行。【每周五更新】",
+            "cover": "https://p2.music.126.net/-fyzrPWd06FfWl_0JDAxMQ==/109951165613108584.jpg",
+            "update_frequency": "每周五更新",
+            "updated": "2025-08-29 10:20:26",
+            "updated_at": 1756434026143,
+            "created": "2014-09-04 18:03:33",
+            "created_at": 1409825013948,
+            "link": "https://music.163.com/#/discover/toplist?id=27135204"
+        },
+        {
+            "id": 3001835560,
+            "name": "网易云ACG动画榜",
+            "description": "网易云中每天热度上升最快的100首ACG动画单曲，每日更新。",
+            "cover": "https://p2.music.126.net/SkGlKQ6acixthb77VlD9eQ==/109951164432300406.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-09-04 12:05:09",
+            "updated_at": 1756958709531,
+            "created": "2019-09-27 10:03:58",
+            "created_at": 1569549838610,
+            "link": "https://music.163.com/#/discover/toplist?id=3001835560"
+        },
+        {
+            "id": 3001795926,
+            "name": "网易云ACG游戏榜",
+            "description": "网易云中每天热度上升最快的100首ACG游戏单曲，每日更新。",
+            "cover": "https://p2.music.126.net/hivOOHMwEmnn9s_6rgZwEQ==/109951164432303700.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-09-04 12:05:17",
+            "updated_at": 1756958717981,
+            "created": "2019-09-27 10:04:56",
+            "created_at": 1569549896656,
+            "link": "https://music.163.com/#/discover/toplist?id=3001795926"
+        },
+        {
+            "id": 3001890046,
+            "name": "网易云ACG VOCALOID榜",
+            "description": "",
+            "cover": "https://p2.music.126.net/Ag7RyRCYiINcd9EtRXf6xA==/109951164432303690.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-09-04 12:05:25",
+            "updated_at": 1756958725790,
+            "created": "2019-09-27 10:05:25",
+            "created_at": 1569549925472,
+            "link": "https://music.163.com/#/discover/toplist?id=3001890046"
+        },
+        {
+            "id": 5059644681,
+            "name": "网易云日语榜",
+            "description": "网易云用户一周内收听所有日语歌曲官方TOP排行榜，每周二更新。",
+            "cover": "https://p2.music.126.net/YFBFNI2F-4BveUpv6FKFuw==/109951167430864069.jpg",
+            "update_frequency": "每周二更新",
+            "updated": "2025-09-02 10:57:27",
+            "updated_at": 1756781847266,
+            "created": "2020-06-11 16:10:00",
+            "created_at": 1591863000459,
+            "link": "https://music.163.com/#/discover/toplist?id=5059644681"
+        },
+        {
+            "id": 5059633707,
+            "name": "网易云摇滚榜",
+            "description": "网易云用户一周内收听所有摇滚歌曲官方TOP排行榜，每周五更新。",
+            "cover": "https://p2.music.126.net/LjkX2hktgFD1NXc3W6w0sA==/109951170048522513.jpg",
+            "update_frequency": "每周五更新",
+            "updated": "2025-08-29 17:02:04",
+            "updated_at": 1756458124397,
+            "created": "2020-06-11 16:13:33",
+            "created_at": 1591863213389,
+            "link": "https://music.163.com/#/discover/toplist?id=5059633707"
+        },
+        {
+            "id": 5059642708,
+            "name": "网易云国风榜",
+            "description": "网易云用户一周内收听所有国风歌曲官方TOP排行榜，每周五更新。",
+            "cover": "https://p2.music.126.net/kTJC5OBhg8I477X_ZmXyDQ==/109951168539740982.jpg",
+            "update_frequency": "每周五更新",
+            "updated": "2025-08-29 09:58:05",
+            "updated_at": 1756432685431,
+            "created": "2020-06-11 16:14:18",
+            "created_at": 1591863258438,
+            "link": "https://music.163.com/#/discover/toplist?id=5059642708"
+        },
+        {
+            "id": 5338990334,
+            "name": "潜力爆款榜",
+            "description": "全民一起PICK潜力好歌，每周二更新",
+            "cover": "https://p2.music.126.net/Mi4QPklg1mtbWAfq74tEqQ==/109951165498334721.jpg",
+            "update_frequency": "每周二更新",
+            "updated": "2025-09-02 12:05:33",
+            "updated_at": 1756785933871,
+            "created": "2020-11-17 14:24:34",
+            "created_at": 1605594274077,
+            "link": "https://music.163.com/#/discover/toplist?id=5338990334"
+        },
+        {
+            "id": 5059661515,
+            "name": "网易云民谣榜",
+            "description": "网易云用户一周内收听所有民谣歌曲官方TOP排行榜，每周五更新。",
+            "cover": "https://p2.music.126.net/Xe9qLTAqtBAWX_hPgFHMyw==/109951170048510929.jpg",
+            "update_frequency": "每周五更新",
+            "updated": "2025-08-29 17:00:41",
+            "updated_at": 1756458041706,
+            "created": "2020-06-11 16:10:52",
+            "created_at": 1591863052757,
+            "link": "https://music.163.com/#/discover/toplist?id=5059661515"
+        },
+        {
+            "id": 6688069460,
+            "name": "听歌识曲榜",
+            "description": "网易云音乐站内歌曲按用户“听歌识曲”次数排列，每周四更新",
+            "cover": "https://p2.music.126.net/wJVUAiUuykKk7yGbQxDBug==/109951167430857712.jpg",
+            "update_frequency": "更新24首",
+            "updated": "2025-09-04 23:35:03",
+            "updated_at": 1757000103145,
+            "created": "2021-03-31 16:45:54",
+            "created_at": 1617180354803,
+            "link": "https://music.163.com/#/discover/toplist?id=6688069460"
+        },
+        {
+            "id": 6723173524,
+            "name": "网络热歌榜",
+            "description": "网罗一周热门网络歌曲，反映云音乐用户近一周网络热歌收听趋势。每周五更新。",
+            "cover": "https://p2.music.126.net/_kSxOPqQ5J5etC5DKTFwNA==/109951170048519530.jpg",
+            "update_frequency": "每周五更新",
+            "updated": "2025-08-29 11:03:41",
+            "updated_at": 1756436621202,
+            "created": "2021-04-22 10:41:46",
+            "created_at": 1619059306654,
+            "link": "https://music.163.com/#/discover/toplist?id=6723173524"
+        },
+        {
+            "id": 6732051320,
+            "name": "俄语榜",
+            "description": "网易云音乐用户一周内收听所有俄罗斯语歌曲官方TOP排行榜，每周四更新。",
+            "cover": "https://p2.music.126.net/HbJ0BK5doY4I4pEMY6-FQw==/109951167430852698.jpg",
+            "update_frequency": "每周四更新",
+            "updated": "2025-09-04 10:21:42",
+            "updated_at": 1756952502045,
+            "created": "2021-04-28 12:05:12",
+            "created_at": 1619582712108,
+            "link": "https://music.163.com/#/discover/toplist?id=6732051320"
+        },
+        {
+            "id": 6732014811,
+            "name": "越南语榜",
+            "description": "网易云音乐用户一周内收听所有越南语歌曲官方TOP排行榜，每周四更新。",
+            "cover": "https://p2.music.126.net/N-Y5maLGWgrowt3TE6RtSg==/109951167430857045.jpg",
+            "update_frequency": "每周四更新",
+            "updated": "2025-09-04 10:28:52",
+            "updated_at": 1756952932171,
+            "created": "2021-04-28 12:05:49",
+            "created_at": 1619582749349,
+            "link": "https://music.163.com/#/discover/toplist?id=6732014811"
+        },
+        {
+            "id": 6886768100,
+            "name": "中文慢摇DJ榜",
+            "description": "搜索“DJ”，进入慢摇DJ专区，探索更多网络热歌！",
+            "cover": "https://p2.music.126.net/w_01BfDU012ojxnzLO6tYw==/109951167977358686.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-09-04 12:00:00",
+            "updated_at": 1756958400638,
+            "created": "2021-07-28 18:09:59",
+            "created_at": 1627466999260,
+            "link": "https://music.163.com/#/discover/toplist?id=6886768100"
+        },
+        {
+            "id": 6939992364,
+            "name": "俄罗斯top hit流行音乐榜",
+            "description": "top hit榜根据俄罗斯及全球400多个无线广播的音乐播放量和YouTube播放量计算得来，每周一更新。",
+            "cover": "https://p2.music.126.net/KLVO8PxVZzOoLdWQQNyprA==/109951166327316568.jpg",
+            "update_frequency": "每周五更新",
+            "updated": "2025-08-29 17:03:04",
+            "updated_at": 1756458184216,
+            "created": "2021-08-27 11:30:02",
+            "created_at": 1630035002268,
+            "link": "https://music.163.com/#/discover/toplist?id=6939992364"
+        },
+        {
+            "id": 7095271308,
+            "name": "泰语榜",
+            "description": "网易云音乐用户一周内收听所有泰语歌曲官方TOP排行榜，每周四更新。",
+            "cover": "https://p2.music.126.net/4W0WBHBgwYlYfRniuyL47A==/109951167430843284.jpg",
+            "update_frequency": "每周四更新",
+            "updated": "2025-09-04 10:41:26",
+            "updated_at": 1756953686280,
+            "created": "2021-11-29 14:22:17",
+            "created_at": 1638166937809,
+            "link": "https://music.163.com/#/discover/toplist?id=7095271308"
+        },
+        {
+            "id": 7356827205,
+            "name": "BEAT排行榜",
+            "description": "嘿~朋友，欢迎来到本周的Beat排行榜\n我们挑选了近一周内热门的Beat作品，一起来感受下大家近期的“口味”吧！\n每周都会更新哦，记得按下收藏，我每天都会在这里等你来与我交流！~\n\n关于Beat的必备小知识\nQ1.什么是Beat？\nBeat即节拍，特指嘻哈音乐中的伴奏，现在也可指所有流行音乐的伴奏\nQ2.Beat有什么用？\n在Beat的帮助下，你只需要填词演唱即可完成一首歌曲的创作，而且Beat也可以作为各种流媒体的背景音乐或是多场景现场演出的得力助手，不同风格的Beat还能为你的音乐创作提供灵感哦~\n搜索关注“BEATSOUL激灵”网易云官号，探索更多炸裂音乐内容～",
+            "cover": "https://p2.music.126.net/yhzlQJCJ9NcT4MvJBG_HgQ==/109951167977014958.jpg",
+            "update_frequency": "每周四更新",
+            "updated": "2025-09-04 20:05:00",
+            "updated_at": 1756987500926,
+            "created": "2022-03-29 19:39:58",
+            "created_at": 1648553998273,
+            "link": "https://music.163.com/#/discover/toplist?id=7356827205"
+        },
+        {
+            "id": 7325478166,
+            "name": "星云榜VOL.29 Addison Rae新专来袭，寻找最真实的自己",
+            "description": "精心评审，专业推荐。每周五更新，为你呈现宝藏新歌。\n1、《Aquamarinee》歌手：Addison Rae\n2、《羽毛剑》歌手：秦凡淇\n3、《Take me back》歌手：HAIM\n4、《妈妈的眼睛》歌手：张震岳\n5、《25岁永不停下》歌手：张醒婵\n6、《雨季症候》歌手：SHARK卫彬月\n7、《山东王FREESTYLE》歌手：华云龙KLE\n8、《LOVE I NEED》歌手：陈瑜Estelle\n9、《FFFFF》歌手：刘柏辛Lexie\n10、《Vipaśyanā》歌手：Namunong\n本期封面：Addison Rae，Aquamarine",
+            "cover": "https://p2.music.126.net/u440jFG0N5i06C9ejOeMCQ==/109951171381091309.jpg",
+            "update_frequency": "每周五更新",
+            "updated": "2025-06-30 16:17:26",
+            "updated_at": 1751271446032,
+            "created": "2022-03-09 11:24:46",
+            "created_at": 1646796286440,
+            "link": "https://music.163.com/#/discover/toplist?id=7325478166"
+        },
+        {
+            "id": 7603212484,
+            "name": "LOOK直播歌曲榜",
+            "description": "LOOK直播好歌共赏，专属你的声音聊愈场。榜单选取符合条件且近7日热度最高的前50首歌曲，每周二更新。",
+            "cover": "https://p1.music.126.net/u-RQC-LyY0aoeseRumJ14A==/109951167977730469.jpg",
+            "update_frequency": "每周二更新",
+            "updated": "2024-05-07 21:23:03",
+            "updated_at": 1715088183913,
+            "created": "2022-08-23 09:54:56",
+            "created_at": 1661219696017,
+            "link": "https://music.163.com/#/discover/toplist?id=7603212484"
+        },
+        {
+            "id": 7775163417,
+            "name": "赏音榜",
+            "description": "云音乐歌曲赏音榜，以让用户鉴赏到更多潜力好歌为目的，以用户对歌曲互动热度为核心，按照综合数据排名取前100名，每日更新",
+            "cover": "https://p1.music.126.net/m9hQzC-d5wefBipedNPaHg==/109951168178601971.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-09-04 12:05:36",
+            "updated_at": 1756958736108,
+            "created": "2022-11-28 14:46:19",
+            "created_at": 1669617979380,
+            "link": "https://music.163.com/#/discover/toplist?id=7775163417"
+        },
+        {
+            "id": 7785123708,
+            "name": "黑胶VIP新歌榜",
+            "description": "云音乐站内播放热度TOP50的7日内新晋会员歌曲，每日更新。\n更适合黑胶体质的新歌榜单来啦！\n耳机分你一只，新曲一起来听~\n成为尊贵黑胶，不错过每一首VIP新歌！",
+            "cover": "https://p1.music.126.net/vjitpkT9nXBCth6tvdDMWg==/109951169743115266.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-09-04 12:05:37",
+            "updated_at": 1756958737548,
+            "created": "2022-12-02 18:51:16",
+            "created_at": 1669978276103,
+            "link": "https://music.163.com/#/discover/toplist?id=7785123708"
+        },
+        {
+            "id": 7785066739,
+            "name": "黑胶VIP热歌榜",
+            "description": "云音乐站内播放和付费热度TOP50的会员歌曲，每日更新。\n更适合黑胶体质的热歌榜单来啦！\n哪首是你的单曲循环？\n成为尊贵黑胶，随心畅听热门好歌！",
+            "cover": "https://p1.music.126.net/Ay3mLgQ9weG_c8JjYrD-Bw==/109951169743106495.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-09-04 12:05:36",
+            "updated_at": 1756958736684,
+            "created": "2022-12-02 18:51:31",
+            "created_at": 1669978291024,
+            "link": "https://music.163.com/#/discover/toplist?id=7785066739"
+        },
+        {
+            "id": 7785091694,
+            "name": "黑胶VIP爱搜榜",
+            "description": "云音乐站内会员搜索播放热度TOP50的歌曲，每日更新。\n更适合黑胶体质的搜歌榜单来啦！\n热搜好歌一网打尽，只为有品位的你~\n成为尊贵黑胶，你搜我听畅听不停！",
+            "cover": "https://p1.music.126.net/R7DtZqNraesnsiaIKvzTHA==/109951169743112799.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-09-04 12:05:41",
+            "updated_at": 1756958741914,
+            "created": "2022-12-02 18:51:43",
+            "created_at": 1669978303210,
+            "link": "https://music.163.com/#/discover/toplist?id=7785091694"
+        },
+        {
+            "id": 8246775932,
+            "name": "实时热度榜",
+            "description": "每天9-23点为你精选当下歌曲热度最高的歌曲",
+            "cover": "https://p1.music.126.net/U7ZbdpWzRdmZVr6Khn_4ag==/109951168673982478.jpg",
+            "update_frequency": "更新65首",
+            "updated": "2025-09-05 09:30:07",
+            "updated_at": 1757035807371,
+            "created": "2023-03-20 10:39:59",
+            "created_at": 1679279999154,
+            "link": "https://music.163.com/#/discover/toplist?id=8246775932"
+        },
+        {
+            "id": 8537588450,
+            "name": "喜力®星电音派对潮音榜",
+            "description": "乐无界，越未来！《星电音联盟》歌曲官方榜单，每周一更新，让云村村民们随时随地躁起高燃派对氛围！喜力®星电音构建狂欢永不停歇的新奇电音宇宙，激活潮流基因，释放先锋灵感，跨维开启奇妙电音之旅！",
+            "cover": "https://p1.music.126.net/HVu2hGYvzN5XBuvFc_4Bgg==/109951168730309120.jpg",
+            "update_frequency": "每周五更新",
+            "updated": "2024-09-16 12:05:30",
+            "updated_at": 1726459530378,
+            "created": "2023-07-07 10:48:39",
+            "created_at": 1688698119437,
+            "link": "https://music.163.com/#/discover/toplist?id=8537588450"
+        },
+        {
+            "id": 8661209031,
+            "name": "乐夏榜",
+            "description": "听乐夏，上网易云，一头扎进爱音乐的人群！ 综艺《乐队的夏天3》官方榜单，每周一更新。和三星折叠屏手机一起畅听《乐队的夏天3》官方榜单，折叠看三星，五代更来劲。",
+            "cover": "https://p1.music.126.net/RlStCmE97y0xYFk7rS3Zww==/109951168864907822.jpg",
+            "update_frequency": "每周一更新",
+            "updated": "2025-09-01 12:05:41",
+            "updated_at": 1756699541864,
+            "created": "2023-08-16 17:47:27",
+            "created_at": 1692179247425,
+            "link": "https://music.163.com/#/discover/toplist?id=8661209031"
+        },
+        {
+            "id": 8703179781,
+            "name": "特斯拉车友爱听榜",
+            "description": null,
+            "cover": "https://p1.music.126.net/UL8dhobSa3TR6Wd1JmWe_g==/109951168924385363.jpg",
+            "update_frequency": "每周一更新",
+            "updated": "2025-09-01 16:05:08",
+            "updated_at": 1756713908385,
+            "created": "2023-08-31 12:29:59",
+            "created_at": 1693456199735,
+            "link": "https://music.163.com/#/discover/toplist?id=8703179781"
+        },
+        {
+            "id": 8703052295,
+            "name": "理想车友爱听榜",
+            "description": null,
+            "cover": "https://p1.music.126.net/U--PWdWupY1ER5cVSjr1jQ==/109951168928365496.jpg",
+            "update_frequency": "每周一更新",
+            "updated": "2025-09-01 16:05:09",
+            "updated_at": 1756713909830,
+            "created": "2023-08-31 12:38:29",
+            "created_at": 1693456709598,
+            "link": "https://music.163.com/#/discover/toplist?id=8703052295"
+        },
+        {
+            "id": 8702582160,
+            "name": "比亚迪车友爱听榜",
+            "description": null,
+            "cover": "https://p1.music.126.net/S1OG-OLTaofa3HfrHW48kA==/109951168924393585.jpg",
+            "update_frequency": "每周一更新",
+            "updated": "2025-09-01 16:05:07",
+            "updated_at": 1756713907323,
+            "created": "2023-08-31 12:38:42",
+            "created_at": 1693456722262,
+            "link": "https://music.163.com/#/discover/toplist?id=8702582160"
+        },
+        {
+            "id": 8703220480,
+            "name": "蔚来车友爱听榜",
+            "description": null,
+            "cover": "https://p1.music.126.net/r9kBQNsOro1EAB82Ol51WQ==/109951168924380971.jpg",
+            "update_frequency": "每周一更新",
+            "updated": "2025-09-01 16:05:04",
+            "updated_at": 1756713904286,
+            "created": "2023-08-31 12:38:56",
+            "created_at": 1693456736086,
+            "link": "https://music.163.com/#/discover/toplist?id=8703220480"
+        },
+        {
+            "id": 8702982391,
+            "name": "极氪车友爱听榜",
+            "description": null,
+            "cover": "https://p1.music.126.net/Cu0RXoKewSPM9Gyc7Cp8jw==/109951168924391596.jpg",
+            "update_frequency": "每周一更新",
+            "updated": "2025-09-01 16:05:06",
+            "updated_at": 1756713906978,
+            "created": "2023-08-31 12:39:19",
+            "created_at": 1693456759762,
+            "link": "https://music.163.com/#/discover/toplist?id=8702982391"
+        },
+        {
+            "id": 8532443277,
+            "name": "蛋仔派对听歌榜",
+            "description": "来自蛋仔岛的热播歌曲速递，网易《蛋仔派对》官方榜单，每周五更新。云村村民们，和蛋仔们一起随歌摇摆吧！",
+            "cover": "https://p1.music.126.net/TMb0be5QLMZKOFeuOKT4tg==/109951168717283910.jpg",
+            "update_frequency": "每周五更新",
+            "updated": "2025-08-29 12:05:43",
+            "updated_at": 1756440343562,
+            "created": "2023-07-05 10:32:04",
+            "created_at": 1688524324879,
+            "link": "https://music.163.com/#/discover/toplist?id=8532443277"
+        },
+        {
+            "id": 9651277674,
+            "name": "AI歌曲榜",
+            "description": "精心挑选每日最新最热AI生成歌曲，榜单每日更新，一起感受AI的独特魅力吧！",
+            "cover": "https://p1.music.126.net/M0m6GeZ1Y8Osz9jqxaW8Wg==/109951169462048035.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-09-04 12:05:43",
+            "updated_at": 1756958743415,
+            "created": "2024-04-02 18:25:12",
+            "created_at": 1712053512213,
+            "link": "https://music.163.com/#/discover/toplist?id=9651277674"
+        },
+        {
+            "id": 10131772880,
+            "name": "昊铂车友爱听榜",
+            "description": null,
+            "cover": "https://p1.music.126.net/EL7H4rkKejZY7Uv54EFNXg==/109951169655010112.jpg",
+            "update_frequency": "每周一更新",
+            "updated": "2025-09-01 16:05:03",
+            "updated_at": 1756713903085,
+            "created": "2024-06-04 16:50:00",
+            "created_at": 1717491000945,
+            "link": "https://music.163.com/#/discover/toplist?id=10131772880"
+        },
+        {
+            "id": 10162841534,
+            "name": "埃安车友爱听榜",
+            "description": "埃安车友平时都在听什么？？",
+            "cover": "https://p1.music.126.net/FcP1U6Bck0wPKqd0XgBwSQ==/109951169679731241.jpg",
+            "update_frequency": "每周一更新",
+            "updated": "2025-09-01 16:05:05",
+            "updated_at": 1756713905568,
+            "created": "2024-06-12 13:31:44",
+            "created_at": 1718170304691,
+            "link": "https://music.163.com/#/discover/toplist?id=10162841534"
+        },
+        {
+            "id": 12225155968,
+            "name": "欧美R&B榜",
+            "description": "云音乐用户一周内收听节奏布鲁斯（R&B）官方TOP排行榜，每周五更新。",
+            "cover": "https://p1.music.126.net/0E6MzYzyA5uvQ4CSoIG2mw==/109951169739660034.jpg",
+            "update_frequency": "每周五更新",
+            "updated": "2025-08-29 12:05:45",
+            "updated_at": 1756440345198,
+            "created": "2024-06-25 18:14:05",
+            "created_at": 1719310445382,
+            "link": "https://music.163.com/#/discover/toplist?id=12225155968"
+        },
+        {
+            "id": 12344472377,
+            "name": "黑胶VIP限免榜",
+            "description": "云音乐站内热度最高的限免播放歌曲TOP50，每日更新。\n人气旋律一听就会爱上！现在马上进入免费模式（点击云音乐首页左上角侧边栏，选择“免费听歌”）畅听全榜吧！",
+            "cover": "https://p1.music.126.net/WXCSf4ZNcDCdOTY5ixm3Bg==/109951169809318325.jpg",
+            "update_frequency": "每天更新",
+            "updated": "2025-09-04 12:05:45",
+            "updated_at": 1756958745487,
+            "created": "2024-07-23 16:08:37",
+            "created_at": 1721722117311,
+            "link": "https://music.163.com/#/discover/toplist?id=12344472377"
+        },
+        {
+            "id": 12717025277,
+            "name": "吉利车友爱听榜",
+            "description": null,
+            "cover": "https://p1.music.126.net/XVmZb3JSyrwMgqu9WVz61A==/109951170037568570.jpg",
+            "update_frequency": "每周一更新",
+            "updated": "2025-09-01 16:05:01",
+            "updated_at": 1756713901625,
+            "created": "2024-10-12 13:44:04",
+            "created_at": 1728711844151,
+            "link": "https://music.163.com/#/discover/toplist?id=12717025277"
+        }
+    ]
+}