/* ===== 全局重置 ===== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html,
body {
    height: 100%;
}

html {
    scrollbar-gutter: stable;
}

body {
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    color: #fff;
    min-height: 100vh;
    background: #0a0e1a;
    transition: background 0.3s ease;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

/* ===== 自定义背景层 ===== */
.custom-bg-layer {
    position: fixed;
    inset: 0;
    z-index: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.6s ease;
}
.custom-bg-layer.active {
    opacity: 1;
}
.custom-bg-layer::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.35);
    pointer-events: none;
}
body.light-theme .custom-bg-layer::after {
    background: rgba(255, 255, 255, 0.25);
}

/* ===== 鼠标发光特效 ===== */
.glow-effect {
    position: fixed;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    pointer-events: none;
    z-index: 9999;
    background: radial-gradient(circle, rgba(120, 180, 255, 0.12) 0%, rgba(80, 140, 255, 0.03) 40%, transparent 70%);
    transform: translate(-50%, -50%);
    transition: opacity 0.4s ease;
    opacity: 0;
    will-change: transform, opacity;
}

.glow-effect.active {
    opacity: 1;
}

/* ===== 澎湃3 光效（性能优化） ===== */
.bg-aurora {
    position: fixed;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    background: radial-gradient(ellipse at 20% 50%, #0d1a2e 0%, #080c18 100%);
    pointer-events: none;
    transition: opacity 0.6s ease;
}
.bg-aurora.hidden {
    opacity: 0;
    pointer-events: none;
}

.aurora-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    opacity: 0.5;
    mix-blend-mode: screen;
    will-change: transform;
    backface-visibility: hidden;
    transform: translateZ(0);
}

.blob-1 {
    width: 450px;
    height: 450px;
    top: -10%;
    left: -5%;
    background: radial-gradient(circle, rgba(60, 120, 255, 0.4), rgba(30, 60, 200, 0.08));
    animation: drift1 25s ease-in-out infinite alternate;
}
.blob-2 {
    width: 380px;
    height: 380px;
    bottom: -5%;
    right: -5%;
    background: radial-gradient(circle, rgba(200, 80, 255, 0.3), rgba(120, 30, 200, 0.08));
    animation: drift2 28s ease-in-out infinite alternate;
}
.blob-3 {
    width: 300px;
    height: 300px;
    top: 40%;
    left: 30%;
    background: radial-gradient(circle, rgba(0, 200, 255, 0.25), rgba(0, 100, 200, 0.05));
    animation: drift3 22s ease-in-out infinite alternate;
}
.blob-4 {
    width: 280px;
    height: 280px;
    top: 10%;
    right: 20%;
    background: radial-gradient(circle, rgba(255, 100, 200, 0.2), rgba(200, 30, 150, 0.05));
    animation: drift4 26s ease-in-out infinite alternate;
}
.blob-5 {
    width: 320px;
    height: 320px;
    bottom: 20%;
    left: 10%;
    background: radial-gradient(circle, rgba(100, 200, 255, 0.25), rgba(30, 100, 200, 0.05));
    animation: drift5 24s ease-in-out infinite alternate;
}

@keyframes drift1 {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(60px, -40px) scale(1.06); }
}
@keyframes drift2 {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(-50px, 30px) scale(0.94); }
}
@keyframes drift3 {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(40px, 25px) scale(1.04); }
}
@keyframes drift4 {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(-35px, -25px) scale(0.96); }
}
@keyframes drift5 {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(25px, -30px) scale(1.04); }
}

.aurora-overlay {
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at center, rgba(10, 14, 26, 0.2) 0%, rgba(10, 14, 26, 0.5) 100%);
    pointer-events: none;
}

/* ===== 顶栏 ===== */
.topbar {
    position: fixed;
    top: 12px;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 32px);
    max-width: 1200px;
    z-index: 1000;
    padding: 4px 18px;
    border-radius: 40px;
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    border: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.topbar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px 16px;
    flex-wrap: nowrap;
    min-height: 32px;
}

.topbar-brand {
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.9);
    flex-shrink: 0;
}
.topbar-brand img {
    width: 20px;
    height: 20px;
    display: block;
    flex-shrink: 0;
}
.topbar-brand span {
    background: linear-gradient(135deg, #f0f8ff, #b6d6ff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.topbar-nav {
    display: flex;
    align-items: center;
    gap: 2px;
    list-style: none;
}
.nav-link {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 3px 12px;
    border-radius: 30px;
    font-size: 0.78rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.55);
    text-decoration: none;
    background: transparent;
    border: none;
    transition: color 0.2s ease, background 0.2s ease;
    white-space: nowrap;
    cursor: pointer;
}
.nav-link i {
    font-size: 0.7rem;
    opacity: 0.7;
}
.nav-link.home {
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
    padding: 3px 14px;
    font-weight: 600;
}
.nav-link.home i {
    color: #7bbdff;
    opacity: 1;
}
.nav-link:not(.home):hover {
    color: rgba(255, 255, 255, 0.85);
    background: rgba(255, 255, 255, 0.04);
}
.nav-link.home:hover {
    background: rgba(255, 255, 255, 0.10);
}

.topbar-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

/* ===== 手机端底部导航（桌面隐藏） ===== */
.mobile-bottom-nav {
    display: none;
}

/* ===== 今日人品 ===== */
.fortune-wrap {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 2px 10px 2px 8px;
    border-radius: 30px;
    font-size: 0.7rem;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.04);
    color: rgba(255, 255, 255, 0.65);
    cursor: pointer;
    user-select: none;
    transition: background 0.2s ease, border-color 0.2s ease;
    white-space: nowrap;
}
.fortune-wrap:hover {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.06);
}
.fortune-label {
    opacity: 0.6;
    font-size: 0.6rem;
}
.fortune-value {
    font-weight: 700;
    font-size: 0.75rem;
    min-width: 20px;
    text-align: center;
    color: #fff;
}
.fortune-value.tier-1 {
    color: #ffd700;
}
.fortune-value.tier-2 {
    color: #7ecfff;
}
.fortune-value.tier-3 {
    color: #ff7b7b;
}
.fortune-emojis {
    font-size: 0.75rem;
    line-height: 1;
}

.app-btn {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 3px 12px 3px 10px;
    border-radius: 30px;
    font-size: 0.72rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.7);
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.04);
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    cursor: pointer;
    font-family: inherit;
}
.app-btn i {
    font-size: 0.75rem;
    color: #8bc1ff;
}
.app-btn:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.08);
    color: #fff;
}
.lang-toggle {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 2px 4px 2px 10px;
    border-radius: 30px;
    font-size: 0.7rem;
    color: rgba(255, 255, 255, 0.55);
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.03);
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    user-select: none;
    font-family: inherit;
}
.lang-toggle span {
    padding: 1px 6px;
    border-radius: 20px;
    background: transparent;
    transition: background 0.15s ease, color 0.15s ease;
}
.lang-toggle .active {
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
}
.lang-toggle i {
    font-size: 0.6rem;
    opacity: 0.4;
}
.lang-toggle:hover {
    border-color: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.8);
}

/* ===== 设置弹窗 ===== */
.modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 2000;
    display: none;
    align-items: center;
    justify-content: center;
}
.modal-overlay.open {
    display: flex;
}
.modal-card {
    background: rgba(30, 35, 50, 0.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 24px;
    padding: 28px 32px 20px;
    max-width: 440px;
    width: 90%;
    border: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.6);
    transform: scale(0.95) translateY(10px);
    opacity: 0;
    transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.25s ease;
    max-height: 88vh;
    overflow-y: auto;
}
.modal-overlay.open .modal-card {
    transform: scale(1) translateY(0);
    opacity: 1;
}
.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}
.modal-header h3 {
    font-size: 1.1rem;
    font-weight: 600;
    color: #fff;
}
.modal-header h3 i {
    margin-right: 8px;
    color: #8bc1ff;
}
.modal-close {
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.4);
    font-size: 1.2rem;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 8px;
    transition: background 0.2s ease, color 0.2s ease;
}
.modal-close:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
}
.modal-body {
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.setting-item {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.setting-item label {
    font-size: 0.85rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.7);
}
.setting-options {
    display: flex;
    gap: 8px;
}
.opt-btn {
    flex: 1;
    padding: 6px 12px;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(255, 255, 255, 0.02);
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.78rem;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    text-align: center;
    font-family: inherit;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.opt-btn.active {
    background: #4a7acc;
    color: #fff;
    border-color: #4a7acc;
}
.opt-btn:not(.active):hover {
    background: rgba(255, 255, 255, 0.04);
    color: rgba(255, 255, 255, 0.7);
}
.modal-footer {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    display: flex;
    justify-content: flex-end;
}
.modal-btn {
    padding: 8px 28px;
    border-radius: 30px;
    border: none;
    background: #4a7acc;
    color: #fff;
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.15s ease;
    font-family: inherit;
}
.modal-btn:hover {
    background: #3a6abc;
    transform: scale(1.02);
}

/* ===== 自定义背景设置项 ===== */
.custom-bg-preview {
    position: relative;
    width: 100%;
    height: 110px;
    border-radius: 14px;
    border: 1px dashed rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.02);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.custom-bg-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.custom-bg-empty {
    font-size: 0.78rem;
    color: rgba(255, 255, 255, 0.25);
}
.custom-bg-actions {
    display: flex;
    gap: 8px;
}
.custom-bg-actions .opt-btn {
    flex: 1;
}
.custom-bg-hint {
    font-size: 0.68rem;
    color: rgba(255, 255, 255, 0.25);
    line-height: 1.5;
    margin-top: -2px;
}

.device-info .info-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 10px;
    padding: 6px 10px;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.04);
    font-size: 0.7rem;
    color: rgba(255, 255, 255, 0.5);
    min-height: 28px;
    align-items: center;
}
.device-info .info-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.device-info .info-item .badge {
    display: inline-block;
    padding: 0 6px;
    border-radius: 4px;
    font-size: 0.6rem;
    font-weight: 600;
}
.device-info .info-item .badge.good {
    background: rgba(80, 200, 120, 0.2);
    color: #50c878;
}
.device-info .info-item .badge.warn {
    background: rgba(255, 200, 50, 0.2);
    color: #ffc832;
}
.device-info .info-item .badge.poor {
    background: rgba(255, 80, 80, 0.2);
    color: #ff5050;
}

/* ============================================================
   页面容器
   ============================================================ */
.page-container {
    position: relative;
    z-index: 1;
    margin-top: 72px;
}

/* ============================================================
   页面切换过渡动画
   ============================================================ */
.page-content {
    padding: 40px 24px;
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
    opacity: 0;
    transform: translateY(20px);
    transition: 
        opacity 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),
        transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    pointer-events: none;
    position: relative;
    will-change: transform, opacity;
}
.page-content.active {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.page-content.active .windownload-header,
.page-content.active .changelog-header-section,
.page-content.active .resources-header,
.page-content.active .details-header,
.page-content.active .wincategory-header {
    animation: fadeSlideUp 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

.page-content.active .windownload-grid,
.page-content.active .changelog-card-full,
.page-content.active .resources-list,
.page-content.active .details-card,
.page-content.active .wincategory-body {
    animation: fadeSlideUp 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.06s forwards;
    opacity: 0;
}

.page-content.active .win-card,
.page-content.active .file-item,
.page-content.active .official-item,
.page-content.active .seekos-item {
    animation: fadeSlideUp 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
    opacity: 0;
}

.page-content.active .win-card:nth-child(1) { animation-delay: 0.03s; }
.page-content.active .win-card:nth-child(2) { animation-delay: 0.06s; }
.page-content.active .win-card:nth-child(3) { animation-delay: 0.09s; }
.page-content.active .win-card:nth-child(4) { animation-delay: 0.12s; }

.page-content.active .file-item:nth-child(1) { animation-delay: 0.03s; }
.page-content.active .file-item:nth-child(2) { animation-delay: 0.06s; }
.page-content.active .file-item:nth-child(3) { animation-delay: 0.09s; }

.page-content.active .official-item:nth-child(1) { animation-delay: 0.03s; }
.page-content.active .official-item:nth-child(2) { animation-delay: 0.06s; }
.page-content.active .official-item:nth-child(3) { animation-delay: 0.09s; }
.page-content.active .official-item:nth-child(4) { animation-delay: 0.12s; }
.page-content.active .official-item:nth-child(5) { animation-delay: 0.15s; }
.page-content.active .official-item:nth-child(6) { animation-delay: 0.18s; }

.page-content.active .seekos-item:nth-child(1) { animation-delay: 0.03s; }
.page-content.active .seekos-item:nth-child(2) { animation-delay: 0.06s; }
.page-content.active .seekos-item:nth-child(3) { animation-delay: 0.09s; }
.page-content.active .seekos-item:nth-child(4) { animation-delay: 0.12s; }
.page-content.active .seekos-item:nth-child(5) { animation-delay: 0.15s; }

@keyframes fadeSlideUp {
    0% {
        opacity: 0;
        transform: translateY(12px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ============================================================
   首页
   ============================================================ */
#page-home {
    padding: 0;
    max-width: 100%;
    overflow: hidden;
    min-height: 100vh;
    position: relative;
}

.home-inner {
    position: relative;
    z-index: 2;
    max-width: 900px;
    margin: 0 auto;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 30px 24px 0;
}

.page-content h1 {
    font-family: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', monospace;
    font-size: 2.8rem;
    font-weight: 400;
    letter-spacing: 0.04em;
    background: linear-gradient(135deg, #e8f0ff, #8ab4ff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    margin-bottom: 20px;
}

.welcome-text {
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.4);
    margin-bottom: 4px;
    letter-spacing: 0.06em;
}

/* ===== B站按钮 ===== */
.btn-bilibili {
    display: inline-block;
    align-self: center;
    padding: 10px 32px;
    margin-bottom: 30px;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 30px;
    color: #fff;
    font-size: 0.95rem;
    font-weight: 500;
    text-decoration: none;
    letter-spacing: 0.5px;
    transition: background 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
}
.btn-bilibili:hover {
    background: #fb7299;
    border-color: #fb7299;
    transform: scale(1.04);
    box-shadow: 0 8px 28px rgba(251, 114, 153, 0.3);
}

/* ===== 介绍区（背景图片） ===== */
.intro-section {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    margin-top: 40px;
    min-height: 420px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.06);
}

.intro-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('https://i.postimg.cc/bY2d6Ryk/img24.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 0;
    filter: brightness(0.45) saturate(0.9);
}

.intro-content {
    position: relative;
    z-index: 1;
    font-family: 'Microsoft YaHei', '微软雅黑', 'Segoe UI', sans-serif;
    color: rgba(255, 255, 255, 0.92);
    line-height: 2.2;
    letter-spacing: 0.04em;
    text-align: center;
    padding: 50px 40px;
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.6);
    width: 100%;
}

.intro-title {
    font-size: 1.3rem;
    color: rgba(255, 255, 255, 0.35);
    margin-bottom: 16px;
    letter-spacing: 0.2em;
}

.intro-text {
    font-size: 1.15rem;
    margin-bottom: 4px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.85);
}
.intro-text:last-of-type {
    margin-bottom: 0;
}

/* ============================================================
   资源库页（网盘风格）
   ============================================================ */
.page-resources {
    max-width: 820px;
    padding: 20px 24px 60px;
    text-align: left;
}

.resources-header {
    margin-bottom: 28px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}
.resources-header h2 {
    font-size: 1.6rem;
    font-weight: 600;
    color: #f0f6ff;
    margin-bottom: 4px;
}
.resources-header h2 i {
    color: #8bc1ff;
    margin-right: 10px;
}
.resources-subtitle {
    color: rgba(255, 255, 255, 0.3);
    font-size: 0.9rem;
    margin-left: 34px;
}

.resources-list {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    border-radius: 20px;
    padding: 16px 20px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.file-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    transition: background 0.2s ease, transform 0.2s ease;
    border-radius: 10px;
    gap: 12px;
}
.file-item:last-child {
    border-bottom: none;
}
.file-item:hover {
    background: rgba(255, 255, 255, 0.04);
    transform: translateX(3px);
}

.file-info {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1;
    min-width: 0;
}

.file-icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    font-size: 1.3rem;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.3);
}

.file-name {
    font-size: 0.95rem;
    color: rgba(255, 255, 255, 0.85);
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.file-actions {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.file-size {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.25);
}

/* ============================================================
   公告页
   ============================================================ */
.page-changelog {
    max-width: 820px;
    padding: 20px 24px 60px;
    text-align: left;
}

.changelog-header-section {
    margin-bottom: 28px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}
.changelog-header-section h2 {
    font-size: 1.6rem;
    font-weight: 600;
    color: #f0f6ff;
    margin-bottom: 4px;
}
.changelog-header-section h2 i {
    color: #8bc1ff;
    margin-right: 10px;
}
.changelog-subtitle {
    color: rgba(255, 255, 255, 0.3);
    font-size: 0.9rem;
    margin-left: 34px;
}

.changelog-card-full {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    border-radius: 20px;
    padding: 32px 36px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.changelog-version {
    font-size: 1.5rem;
    font-weight: 700;
    color: #f0f6ff;
    margin-bottom: 4px;
    letter-spacing: -0.02em;
}
.changelog-version .tag {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 2px 12px;
    border-radius: 20px;
    background: rgba(80, 200, 120, 0.12);
    color: #50c878;
    margin-left: 10px;
    vertical-align: middle;
    letter-spacing: 0.02em;
}
.changelog-date {
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.3);
    margin-bottom: 20px;
}

.changelog-release:first-child .changelog-version .tag {
    background: rgba(40, 60, 120, 0.25);
    color: #6a8fc4;
    border: 1px solid rgba(40, 60, 120, 0.15);
}

.changelog-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.changelog-list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03);
    font-size: 0.95rem;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.75);
}
.changelog-list li:last-child {
    border-bottom: none;
}
.changelog-list .bullet {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.6rem;
    margin-top: 1px;
}
.changelog-list .bullet.added {
    background: rgba(80, 200, 120, 0.12);
    color: #50c878;
}
.changelog-list .bullet.fixed {
    background: rgba(255, 200, 50, 0.12);
    color: #ffc832;
}
.changelog-list .bullet.changed {
    background: rgba(100, 180, 255, 0.12);
    color: #7bbdff;
}
.changelog-list .bullet.removed {
    background: rgba(255, 80, 80, 0.12);
    color: #ff5050;
}
.changelog-list .bullet.optimized {
    background: rgba(100, 180, 255, 0.12);
    color: #7bbdff;
}
.changelog-list .item-text {
    flex: 1;
}

/* ============================================================
   Win下载页
   ============================================================ */
.page-windownload {
    max-width: 1000px;
    padding: 20px 24px 60px;
    text-align: left;
}

.windownload-container {
    max-width: 1000px;
    margin: 0 auto;
}

.windownload-header {
    margin-bottom: 32px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}
.windownload-header h2 {
    font-size: 1.6rem;
    font-weight: 600;
    color: #f0f6ff;
    margin-bottom: 4px;
}
.windownload-header h2 i {
    color: #8bc1ff;
    margin-right: 10px;
}
.windownload-subtitle {
    color: rgba(255, 255, 255, 0.3);
    font-size: 0.9rem;
    margin-left: 34px;
}

.windownload-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 24px;
}

.win-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.35s ease, border-color 0.3s ease;
    display: flex;
    flex-direction: column;
    will-change: transform;
}
.win-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.35);
    border-color: rgba(255, 255, 255, 0.08);
}

.win-card-image {
    width: 100%;
    height: 160px;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.3);
    flex-shrink: 0;
}
.win-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
    will-change: transform;
}
.win-card:hover .win-card-image img {
    transform: scale(1.04);
}

.win-card-body {
    padding: 20px 20px 18px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.win-card-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 6px;
}
.win-card-desc {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.45);
    line-height: 1.5;
    flex: 1;
    margin-bottom: 14px;
}

.win-card-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: auto;
}

.btn-goto {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 18px 6px 16px;
    border-radius: 30px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.78rem;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
    cursor: pointer;
    font-family: inherit;
}
.btn-goto:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.15);
    color: #fff;
    transform: scale(1.03);
}
.btn-goto .arrow {
    transition: transform 0.25s ease;
    font-size: 1rem;
}
.btn-goto:hover .arrow {
    transform: translateX(4px);
}

.win-card.coming .win-card-image {
    filter: brightness(0.6);
}
.win-card.coming .win-card-footer {
    justify-content: center;
}
.win-card .coming-badge {
    display: inline-block;
    padding: 4px 14px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.04);
    color: rgba(255, 255, 255, 0.25);
    font-size: 0.7rem;
    font-weight: 500;
    letter-spacing: 0.05em;
}

.win-card.developing .win-card-image {
    filter: brightness(0.6);
}
.win-card.developing .win-card-footer {
    justify-content: center;
}
.win-card .developing-badge {
    display: inline-block;
    padding: 4px 14px;
    border-radius: 20px;
    background: rgba(100, 180, 255, 0.12);
    color: #7bbdff;
    font-size: 0.7rem;
    font-weight: 500;
    letter-spacing: 0.05em;
    border: 1px solid rgba(100, 180, 255, 0.2);
}
.win-card .developing-badge i {
    margin-right: 4px;
}

/* ============================================================
   Win下载 - 分类页
   ============================================================ */
.page-wincategory {
    max-width: 1000px;
    padding: 20px 24px 60px;
    text-align: left;
}

.wincategory-container {
    max-width: 1000px;
    margin: 0 auto;
}

.wincategory-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 28px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    flex-wrap: wrap;
}
.wincategory-header h2 {
    font-size: 1.6rem;
    font-weight: 600;
    color: #f0f6ff;
    margin-bottom: 0;
    flex: 1;
}
.wincategory-header h2 i {
    color: #8bc1ff;
    margin-right: 10px;
}
.wincategory-subtitle {
    color: rgba(255, 255, 255, 0.3);
    font-size: 0.9rem;
    margin-left: 0;
    width: 100%;
    padding-left: 50px;
}

.btn-back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 18px;
    border-radius: 30px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(255, 255, 255, 0.03);
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
    font-family: inherit;
    flex-shrink: 0;
}
.btn-back:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.12);
    color: #fff;
    transform: translateX(-3px);
}
.btn-back i {
    transition: transform 0.25s ease;
}
.btn-back:hover i {
    transform: translateX(-3px);
}

.wincategory-body {
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    border-radius: 20px;
    padding: 20px 20px;
    border: 1px solid rgba(255, 255, 255, 0.04);
    min-height: 200px;
}

/* ============================================================
   官方Windows下载 - 列表样式
   ============================================================ */
.official-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    transition: background 0.2s ease, transform 0.2s ease;
    border-radius: 12px;
}
.official-item:last-child {
    border-bottom: none;
}
.official-item:hover {
    background: rgba(255, 255, 255, 0.03);
    transform: translateX(3px);
}

.official-item-icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.04);
}

.official-item-info {
    flex: 1;
    min-width: 0;
}
.official-item-title {
    font-size: 1rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
}
.official-item-subtitle {
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.35);
    margin-top: 2px;
}

.official-item-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.btn-download-official {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 18px;
    border-radius: 30px;
    border: 1px solid rgba(80, 200, 120, 0.15);
    background: rgba(80, 200, 120, 0.05);
    color: #50c878;
    font-size: 0.8rem;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
    font-family: inherit;
}
.btn-download-official:hover {
    background: rgba(80, 200, 120, 0.12);
    border-color: rgba(80, 200, 120, 0.3);
    transform: scale(1.03);
}
.btn-download-official i {
    transition: transform 0.25s ease;
}
.btn-download-official:hover i {
    transform: translateY(-2px);
}

.btn-detail-official {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 14px;
    border-radius: 30px;
    border: 1px solid rgba(100, 180, 255, 0.15);
    background: rgba(100, 180, 255, 0.05);
    color: #7bbdff;
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
    font-family: inherit;
}
.btn-detail-official:hover {
    background: rgba(100, 180, 255, 0.10);
    border-color: rgba(100, 180, 255, 0.25);
    transform: scale(1.03);
}

.official-extract {
    font-size: 0.7rem;
    color: rgba(255, 255, 255, 0.2);
    letter-spacing: 0.02em;
}

/* ============================================================
   SeekOS 列表样式
   ============================================================ */
.seekos-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    transition: background 0.2s ease, transform 0.2s ease;
    border-radius: 12px;
}
.seekos-item:last-child {
    border-bottom: none;
}
.seekos-item:hover {
    background: rgba(255, 255, 255, 0.03);
    transform: translateX(3px);
}

.seekos-item-icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.04);
    color: #7bbdff;
}

.seekos-item-info {
    flex: 1;
    min-width: 0;
}
.seekos-item-title {
    font-size: 1rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
}
.seekos-item-desc {
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.45);
    margin-top: 2px;
}

.seekos-item-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.btn-download-seekos {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 18px;
    border-radius: 30px;
    border: 1px solid rgba(80, 200, 120, 0.15);
    background: rgba(80, 200, 120, 0.05);
    color: #50c878;
    font-size: 0.8rem;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
    font-family: inherit;
}
.btn-download-seekos:hover {
    background: rgba(80, 200, 120, 0.12);
    border-color: rgba(80, 200, 120, 0.3);
    transform: scale(1.03);
}
.btn-download-seekos i {
    transition: transform 0.25s ease;
}
.btn-download-seekos:hover i {
    transform: translateY(-2px);
}

.seekos-extract {
    font-size: 0.7rem;
    color: rgba(255, 255, 255, 0.25);
    letter-spacing: 0.02em;
}

.seekos-author-note {
    padding: 16px 20px;
    margin-bottom: 16px;
    background: rgba(255, 255, 255, 0.02);
    border-radius: 12px;
    border-left: 3px solid rgba(100, 180, 255, 0.3);
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.9rem;
    line-height: 1.6;
}
.seekos-author-note strong {
    color: rgba(255, 255, 255, 0.85);
}

.wincategory-placeholder {
    text-align: center;
    color: rgba(255, 255, 255, 0.2);
    padding: 40px 20px;
}
.wincategory-placeholder i {
    font-size: 4rem;
    color: rgba(255, 255, 255, 0.04);
    display: block;
    margin-bottom: 16px;
}
.wincategory-placeholder p {
    font-size: 1.2rem;
    color: rgba(255, 255, 255, 0.15);
    margin-bottom: 6px;
}
.wincategory-placeholder span {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.08);
}

/* ============================================================
   下载按钮
   ============================================================ */
.btn-download {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 18px;
    border-radius: 30px;
    border: 1px solid rgba(80, 200, 120, 0.15);
    background: rgba(80, 200, 120, 0.05);
    color: #50c878;
    font-size: 0.78rem;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
    cursor: pointer;
    font-family: inherit;
}
.btn-download:hover {
    background: rgba(80, 200, 120, 0.12);
    border-color: rgba(80, 200, 120, 0.3);
    transform: scale(1.03);
}
.btn-download i {
    transition: transform 0.25s ease;
}
.btn-download:hover i {
    transform: translateY(-2px);
}

/* ============================================================
   详情弹窗
   ============================================================ */
.detail-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
    padding: 20px;
}
.detail-modal-overlay.active {
    opacity: 1;
}

.detail-modal {
    background: rgba(24, 28, 40, 0.92);
    backdrop-filter: blur(16px) saturate(160%);
    -webkit-backdrop-filter: blur(16px) saturate(160%);
    border-radius: 24px;
    max-width: 520px;
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    transform: scale(0.94) translateY(16px);
    opacity: 0;
    transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.3s ease;
    overflow: hidden;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
}
.detail-modal-overlay.active .detail-modal {
    transform: scale(1) translateY(0);
    opacity: 1;
}

.detail-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    flex-shrink: 0;
}
.detail-modal-title {
    font-size: 1rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    display: flex;
    align-items: center;
    gap: 10px;
}
.detail-modal-close {
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.3);
    font-size: 1.1rem;
    cursor: pointer;
    padding: 4px 10px;
    border-radius: 8px;
    transition: background 0.2s ease, color 0.2s ease;
}
.detail-modal-close:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
}

.detail-modal-body {
    padding: 28px 24px 24px;
    text-align: center;
    overflow-y: auto;
    flex: 1;
}
.detail-modal-icon {
    margin-bottom: 12px;
}
.detail-modal-subtitle {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.35);
    margin-bottom: 16px;
}
.detail-modal-description {
    font-size: 0.92rem;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.7);
    text-align: left;
    padding: 0 4px;
    white-space: pre-line;
}
.detail-modal-footer {
    margin-top: 24px;
    display: flex;
    justify-content: center;
}
.detail-modal-close-btn {
    padding: 8px 32px;
    border-radius: 30px;
    border: none;
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
    font-family: inherit;
}
.detail-modal-close-btn:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

/* ============================================================
   详情页
   ============================================================ */
.page-details {
    max-width: 860px;
    padding: 20px 24px 60px;
    text-align: left;
}

.details-header {
    margin-bottom: 28px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}
.details-header h2 {
    font-size: 1.6rem;
    font-weight: 600;
    color: #f0f6ff;
    margin-bottom: 4px;
}
.details-header h2 i {
    color: #8bc1ff;
    margin-right: 10px;
}
.details-subtitle {
    color: rgba(255, 255, 255, 0.3);
    font-size: 0.9rem;
    margin-left: 34px;
}

.details-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    border-radius: 20px;
    padding: 32px 36px;
    border: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.details-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2px 24px;
}

.detail-item {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 8px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03);
    font-size: 0.88rem;
    gap: 12px;
}
.detail-item:last-child {
    border-bottom: none;
}

.detail-key {
    color: rgba(255, 255, 255, 0.45);
    font-weight: 400;
    flex-shrink: 0;
    font-size: 0.82rem;
}
.detail-value {
    color: rgba(255, 255, 255, 0.88);
    text-align: right;
    word-break: break-all;
    font-family: 'JetBrains Mono', 'Fira Code', monospace;
    font-size: 0.78rem;
    max-width: 55%;
}

.detail-key[class*="🍪"] {
    color: rgba(255, 200, 100, 0.6);
}

.detail-value pre {
    background: rgba(0, 0, 0, 0.3);
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 0.7rem;
    color: rgba(255, 255, 255, 0.8);
    overflow-x: auto;
    white-space: pre-wrap;
    word-break: break-all;
    margin: 0;
    font-family: 'JetBrains Mono', 'Fira Code', monospace;
    max-height: 200px;
    overflow-y: auto;
}

.details-footer {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}
.details-timestamp {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.25);
}
.details-refresh {
    padding: 6px 18px;
    border-radius: 30px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.75rem;
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    font-family: inherit;
}
.details-refresh:hover {
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.15);
}
.details-refresh i {
    margin-right: 6px;
}

/* ============================================================
   浅色主题适配
   ============================================================ */
body.light-theme {
    color: #1a1f2e;
}
body.light-theme .bg-aurora {
    background: radial-gradient(ellipse at 20% 50%, #dce4f0 0%, #c8d0e0 100%);
}
body.light-theme .aurora-blob {
    opacity: 0.2;
    mix-blend-mode: multiply;
}
body.light-theme .blob-1 {
    background: radial-gradient(circle, rgba(60, 120, 255, 0.25), rgba(30, 60, 200, 0.04));
}
body.light-theme .blob-2 {
    background: radial-gradient(circle, rgba(200, 80, 255, 0.15), rgba(120, 30, 200, 0.03));
}
body.light-theme .blob-3 {
    background: radial-gradient(circle, rgba(0, 200, 255, 0.15), rgba(0, 100, 200, 0.03));
}
body.light-theme .blob-4 {
    background: radial-gradient(circle, rgba(255, 100, 200, 0.12), rgba(200, 30, 150, 0.03));
}
body.light-theme .blob-5 {
    background: radial-gradient(circle, rgba(100, 200, 255, 0.15), rgba(30, 100, 200, 0.03));
}
body.light-theme .aurora-overlay {
    background: radial-gradient(ellipse at center, rgba(220, 228, 240, 0.2) 0%, rgba(200, 210, 225, 0.5) 100%);
}
body.light-theme .topbar {
    background: rgba(255, 255, 255, 0.5);
    border-color: rgba(0, 0, 0, 0.08);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
}
body.light-theme .topbar-brand span {
    background: linear-gradient(135deg, #2a3a5e, #4a6a9e);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
body.light-theme .nav-link {
    color: rgba(0, 0, 0, 0.5);
}
body.light-theme .nav-link.home {
    color: #1a1f2e;
    background: rgba(0, 0, 0, 0.06);
}
body.light-theme .nav-link.home i {
    color: #4a7acc;
}
body.light-theme .nav-link:not(.home):hover {
    color: rgba(0, 0, 0, 0.8);
    background: rgba(0, 0, 0, 0.04);
}
body.light-theme .app-btn {
    color: rgba(0, 0, 0, 0.6);
    border-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .app-btn:hover {
    background: rgba(0, 0, 0, 0.04);
    color: #1a1f2e;
}
body.light-theme .lang-toggle {
    color: rgba(0, 0, 0, 0.5);
    border-color: rgba(0, 0, 0, 0.04);
}
body.light-theme .lang-toggle .active {
    background: rgba(0, 0, 0, 0.06);
    color: #1a1f2e;
}
body.light-theme .fortune-wrap {
    background: rgba(0, 0, 0, 0.03);
    border-color: rgba(0, 0, 0, 0.04);
    color: rgba(0, 0, 0, 0.6);
}
body.light-theme .fortune-wrap:hover {
    background: rgba(0, 0, 0, 0.05);
}
body.light-theme .fortune-value.tier-1 {
    color: #b8860b;
}
body.light-theme .fortune-value.tier-2 {
    color: #0066aa;
}
body.light-theme .fortune-value.tier-3 {
    color: #cc3333;
}
body.light-theme .page-content h1 {
    background: linear-gradient(135deg, #2a3a5e, #4a7acc);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
body.light-theme .welcome-text {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .intro-bg {
    filter: brightness(0.7) saturate(0.9);
}
body.light-theme .intro-content {
    color: rgba(255, 255, 255, 0.95);
}
body.light-theme .intro-text {
    color: rgba(255, 255, 255, 0.9);
}
body.light-theme .intro-title {
    color: rgba(255, 255, 255, 0.5);
}
body.light-theme .btn-bilibili {
    background: rgba(255, 255, 255, 0.7);
    color: #1a1f2e;
    border-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .btn-bilibili:hover {
    background: #fb7299;
    color: #fff;
    border-color: #fb7299;
}
body.light-theme .modal-card {
    background: rgba(255, 255, 255, 0.85);
    color: #1a1f2e;
    border-color: rgba(0, 0, 0, 0.08);
}
body.light-theme .modal-card h3 {
    color: #1a1f2e;
}
body.light-theme .modal-close {
    color: rgba(0, 0, 0, 0.5);
}
body.light-theme .modal-close:hover {
    color: #1a1f2e;
}
body.light-theme .setting-item label {
    color: rgba(0, 0, 0, 0.7);
}
body.light-theme .opt-btn {
    color: rgba(0, 0, 0, 0.5);
    border-color: rgba(0, 0, 0, 0.08);
}
body.light-theme .opt-btn.active {
    background: #4a7acc;
    color: #fff;
    border-color: #4a7acc;
}
body.light-theme .opt-btn:not(.active):hover {
    background: rgba(0, 0, 0, 0.04);
}
body.light-theme .modal-footer {
    border-top-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .modal-btn {
    background: #4a7acc;
    color: #fff;
}
body.light-theme .modal-btn:hover {
    background: #3a6abc;
}
body.light-theme .custom-bg-preview {
    border-color: rgba(0, 0, 0, 0.1);
    background: rgba(0, 0, 0, 0.02);
}
body.light-theme .custom-bg-empty {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .custom-bg-hint {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .device-info .info-grid {
    background: rgba(0, 0, 0, 0.03);
    border-color: rgba(0, 0, 0, 0.06);
    color: rgba(0, 0, 0, 0.5);
}
body.light-theme .resources-header {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .resources-header h2 {
    color: #1a1f2e;
}
body.light-theme .resources-subtitle {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .resources-list {
    background: rgba(255, 255, 255, 0.5);
    border-color: rgba(0, 0, 0, 0.06);
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.06);
}
body.light-theme .file-item {
    border-bottom-color: rgba(0, 0, 0, 0.04);
}
body.light-theme .file-item:hover {
    background: rgba(0, 0, 0, 0.03);
}
body.light-theme .file-icon {
    background: rgba(0, 0, 0, 0.03);
    border-color: rgba(0, 0, 0, 0.06);
    color: rgba(0, 0, 0, 0.25);
}
body.light-theme .file-name {
    color: rgba(0, 0, 0, 0.8);
}
body.light-theme .file-size {
    color: rgba(0, 0, 0, 0.2);
}
body.light-theme .changelog-header-section {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .changelog-header-section h2 {
    color: #1a1f2e;
}
body.light-theme .changelog-subtitle {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .changelog-card-full {
    background: rgba(255, 255, 255, 0.5);
    border-color: rgba(0, 0, 0, 0.06);
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.06);
}
body.light-theme .changelog-version {
    color: #1a1f2e;
}
body.light-theme .changelog-date {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .changelog-list li {
    border-bottom-color: rgba(0, 0, 0, 0.04);
    color: rgba(0, 0, 0, 0.7);
}
body.light-theme .changelog-version .tag {
    background: rgba(45, 138, 78, 0.1);
    color: #2d8a4e;
}
body.light-theme .changelog-release:first-child .changelog-version .tag {
    background: rgba(40, 60, 120, 0.08);
    color: #3a5a8a;
    border: 1px solid rgba(40, 60, 120, 0.12);
}
body.light-theme .windownload-header {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .windownload-header h2 {
    color: #1a1f2e;
}
body.light-theme .windownload-subtitle {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .win-card {
    background: rgba(255, 255, 255, 0.5);
    border-color: rgba(0, 0, 0, 0.06);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
}
body.light-theme .win-card:hover {
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.1);
    border-color: rgba(0, 0, 0, 0.08);
}
body.light-theme .win-card-title {
    color: rgba(0, 0, 0, 0.85);
}
body.light-theme .win-card-desc {
    color: rgba(0, 0, 0, 0.4);
}
body.light-theme .btn-goto {
    border-color: rgba(0, 0, 0, 0.06);
    color: rgba(0, 0, 0, 0.5);
}
body.light-theme .btn-goto:hover {
    background: rgba(0, 0, 0, 0.04);
    border-color: rgba(0, 0, 0, 0.12);
    color: #1a1f2e;
}
body.light-theme .win-card .coming-badge {
    background: rgba(0, 0, 0, 0.03);
    color: rgba(0, 0, 0, 0.2);
}
body.light-theme .win-card .developing-badge {
    background: rgba(60, 120, 255, 0.08);
    color: #4a7acc;
    border-color: rgba(60, 120, 255, 0.18);
}
body.light-theme .wincategory-header {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .wincategory-header h2 {
    color: #1a1f2e;
}
body.light-theme .wincategory-subtitle {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .btn-back {
    border-color: rgba(0, 0, 0, 0.06);
    color: rgba(0, 0, 0, 0.5);
}
body.light-theme .btn-back:hover {
    background: rgba(0, 0, 0, 0.04);
    border-color: rgba(0, 0, 0, 0.12);
    color: #1a1f2e;
}
body.light-theme .wincategory-body {
    background: rgba(255, 255, 255, 0.4);
    border-color: rgba(0, 0, 0, 0.04);
}
body.light-theme .official-item {
    border-bottom-color: rgba(0, 0, 0, 0.04);
}
body.light-theme .official-item:hover {
    background: rgba(0, 0, 0, 0.02);
}
body.light-theme .official-item-icon {
    background: rgba(0, 0, 0, 0.02);
    border-color: rgba(0, 0, 0, 0.04);
}
body.light-theme .official-item-title {
    color: rgba(0, 0, 0, 0.85);
}
body.light-theme .official-item-subtitle {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .btn-download-official {
    border-color: rgba(45, 138, 78, 0.15);
    background: rgba(45, 138, 78, 0.04);
    color: #2d8a4e;
}
body.light-theme .btn-download-official:hover {
    background: rgba(45, 138, 78, 0.08);
    border-color: rgba(45, 138, 78, 0.25);
}
body.light-theme .btn-detail-official {
    border-color: rgba(60, 120, 255, 0.12);
    background: rgba(60, 120, 255, 0.04);
    color: #4a7acc;
}
body.light-theme .btn-detail-official:hover {
    background: rgba(60, 120, 255, 0.08);
}
body.light-theme .official-extract {
    color: rgba(0, 0, 0, 0.15);
}
body.light-theme .btn-download {
    border-color: rgba(45, 138, 78, 0.15);
    background: rgba(45, 138, 78, 0.04);
    color: #2d8a4e;
}
body.light-theme .btn-download:hover {
    background: rgba(45, 138, 78, 0.08);
}
body.light-theme .detail-modal {
    background: rgba(240, 245, 255, 0.92);
    border-color: rgba(0, 0, 0, 0.04);
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.12);
}
body.light-theme .detail-modal-title {
    color: rgba(0, 0, 0, 0.85);
}
body.light-theme .detail-modal-close {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .detail-modal-close:hover {
    color: #1a1f2e;
    background: rgba(0, 0, 0, 0.04);
}
body.light-theme .detail-modal-subtitle {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .detail-modal-description {
    color: rgba(0, 0, 0, 0.65);
}
body.light-theme .detail-modal-close-btn {
    background: rgba(0, 0, 0, 0.04);
    color: rgba(0, 0, 0, 0.5);
}
body.light-theme .detail-modal-close-btn:hover {
    background: rgba(0, 0, 0, 0.08);
    color: #1a1f2e;
}
body.light-theme .details-header {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .details-header h2 {
    color: #1a1f2e;
}
body.light-theme .details-subtitle {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .details-card {
    background: rgba(255, 255, 255, 0.5);
    border-color: rgba(0, 0, 0, 0.06);
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.06);
}
body.light-theme .detail-item {
    border-bottom-color: rgba(0, 0, 0, 0.04);
}
body.light-theme .detail-key {
    color: rgba(0, 0, 0, 0.45);
}
body.light-theme .detail-value {
    color: rgba(0, 0, 0, 0.8);
}
body.light-theme .detail-value pre {
    background: rgba(0, 0, 0, 0.06);
    color: rgba(0, 0, 0, 0.7);
}
body.light-theme .details-footer {
    border-top-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .details-timestamp {
    color: rgba(0, 0, 0, 0.25);
}
body.light-theme .details-refresh {
    border-color: rgba(0, 0, 0, 0.08);
    color: rgba(0, 0, 0, 0.5);
}
body.light-theme .details-refresh:hover {
    background: rgba(0, 0, 0, 0.04);
    color: #1a1f2e;
    border-color: rgba(0, 0, 0, 0.15);
}

/* ============================================================
   Win下载 - 加载界面
   ============================================================ */
.win-loading-overlay {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 24px;
    background: radial-gradient(ellipse at 50% 50%, #0d1a2e 0%, #080c18 100%);
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
}

.win-loading-overlay.active {
    opacity: 1;
    pointer-events: auto;
}

.win-loading-overlay.hidden {
    opacity: 0;
    pointer-events: none;
}

.win-loading-spinner {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    border: 3px solid rgba(120, 180, 255, 0.15);
    border-top-color: #7bbdff;
    border-right-color: #4a9ee8;
    animation: winSpin 0.9s linear infinite;
}

@keyframes winSpin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.win-loading-text {
    font-size: 0.95rem;
    color: rgba(255, 255, 255, 0.6);
    letter-spacing: 0.1em;
    display: flex;
    align-items: center;
    gap: 2px;
}

.win-loading-text .dot {
    animation: winDot 1.4s ease-in-out infinite;
    opacity: 0.3;
}

.win-loading-text .dot:nth-child(2) { animation-delay: 0.2s; }
.win-loading-text .dot:nth-child(3) { animation-delay: 0.4s; }

@keyframes winDot {
    0%, 60%, 100% { opacity: 0.3; }
    30% { opacity: 1; }
}

.win-loading-icon {
    font-size: 2.4rem;
    color: #7bbdff;
    margin-bottom: 4px;
    opacity: 0.9;
    animation: winIconPulse 1.6s ease-in-out infinite;
}

@keyframes winIconPulse {
    0%, 100% { transform: scale(1); opacity: 0.85; }
    50% { transform: scale(1.08); opacity: 1; }
}

body.light-theme .win-loading-overlay {
    background: radial-gradient(ellipse at 50% 50%, #dce4f0 0%, #c8d0e0 100%);
}
body.light-theme .win-loading-text {
    color: rgba(0, 0, 0, 0.5);
}
body.light-theme .win-loading-icon {
    color: #4a7acc;
}
body.light-theme .win-loading-spinner {
    border-color: rgba(74, 122, 204, 0.15);
    border-top-color: #4a7acc;
    border-right-color: #3a6abc;
}

/* ============================================================
   响应式 - 桌面 / 平板
   ============================================================ */
@media (max-width: 820px) {
    .topbar {
        top: 8px;
        padding: 3px 12px;
        width: calc(100% - 16px);
        border-radius: 30px;
    }
    .topbar-inner {
        min-height: 28px;
        gap: 4px 10px;
    }
    .nav-link {
        padding: 2px 8px;
        font-size: 0.7rem;
    }
    .nav-link i {
        font-size: 0.6rem;
    }
    .nav-link.home {
        padding: 2px 10px;
    }
    .topbar-brand {
        font-size: 0.75rem;
    }
    .topbar-brand img {
        width: 16px;
        height: 16px;
    }
    .app-btn {
        padding: 2px 8px 2px 6px;
        font-size: 0.65rem;
    }
    .app-btn i {
        font-size: 0.65rem;
    }
    .lang-toggle {
        font-size: 0.6rem;
        padding: 1px 3px 1px 6px;
    }
    .lang-toggle span {
        padding: 1px 4px;
    }
    .fortune-wrap {
        font-size: 0.6rem;
        padding: 1px 6px 1px 4px;
    }
    .fortune-value {
        font-size: 0.65rem;
        min-width: 16px;
    }
    .fortune-emojis {
        font-size: 0.65rem;
    }
    .page-container {
        margin-top: 60px;
    }
    #page-home {
        padding: 0;
    }
    .home-inner {
        padding: 20px 16px 0;
        min-height: 100vh;
    }
    .page-content h1 {
        font-size: 2.2rem;
    }
    .welcome-text {
        font-size: 0.95rem;
    }
    .btn-bilibili {
        padding: 8px 24px;
        font-size: 0.85rem;
        margin-bottom: 20px;
    }
    .intro-section {
        min-height: 320px;
        margin-top: 30px;
    }
    .intro-content {
        padding: 30px 24px;
    }
    .intro-title {
        font-size: 1.1rem;
    }
    .intro-text {
        font-size: 0.95rem;
    }
    .page-resources {
        padding: 16px 16px 40px;
    }
    .resources-header h2 {
        font-size: 1.3rem;
    }
    .resources-list {
        padding: 12px 14px;
    }
    .file-item {
        padding: 10px 12px;
        flex-wrap: wrap;
    }
    .file-info {
        gap: 10px;
    }
    .file-icon {
        width: 34px;
        height: 34px;
        font-size: 1rem;
    }
    .file-name {
        font-size: 0.85rem;
    }
    .file-size {
        font-size: 0.65rem;
    }
    .page-changelog {
        padding: 16px 16px 40px;
    }
    .changelog-header-section h2 {
        font-size: 1.3rem;
    }
    .changelog-card-full {
        padding: 24px 20px;
    }
    .changelog-version {
        font-size: 1.25rem;
    }
    .changelog-list li {
        font-size: 0.85rem;
        padding: 8px 0;
    }
    .page-windownload { padding: 16px 16px 40px; }
    .windownload-header h2 { font-size: 1.3rem; }
    .windownload-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 16px; }
    .win-card-image { height: 130px; }
    .win-card-body { padding: 16px 16px 14px; }
    .win-card-title { font-size: 0.95rem; }
    .win-card-desc { font-size: 0.78rem; }
    .page-wincategory { padding: 16px 16px 40px; }
    .wincategory-header h2 { font-size: 1.3rem; }
    .wincategory-body { padding: 16px; min-height: 160px; }
    .official-item { padding: 14px 16px; gap: 12px; flex-wrap: wrap; }
    .official-item-icon { width: 36px; height: 36px; font-size: 1.5rem; }
    .official-item-title { font-size: 0.92rem; }
    .official-item-subtitle { font-size: 0.72rem; }
    .official-item-actions { flex: 1 1 100%; flex-direction: row; justify-content: flex-end; align-items: center; gap: 12px; }
    .btn-download-official { font-size: 0.72rem; padding: 4px 14px; }
    .btn-detail-official { font-size: 0.68rem; padding: 4px 10px; }
    .official-extract { font-size: 0.65rem; }
    .btn-download { font-size: 0.72rem; padding: 4px 14px; }
    .modal-card {
        padding: 20px 20px 16px;
        max-width: 400px;
    }
    .detail-modal {
        max-width: 460px;
    }
    .glow-effect {
        width: 160px;
        height: 160px;
    }
    .device-info .info-grid {
        font-size: 0.65rem;
    }
    .page-details { padding: 16px 16px 40px; }
    .details-header h2 { font-size: 1.3rem; }
    .details-card { padding: 24px 20px; }
    .details-grid { grid-template-columns: 1fr; gap: 0; }
    .detail-item { font-size: 0.82rem; padding: 7px 0; }
    .detail-value { font-size: 0.75rem; max-width: 50%; }
}

/* ============================================================
   响应式 - 手机（≤600px）
   顶部精简 + 底部导航
   ============================================================ */
@media (max-width: 600px) {
    /* ===== 顶部精简条 ===== */
    .topbar {
        top: 0;
        left: 0;
        transform: none;
        width: 100%;
        max-width: none;
        border-radius: 0;
        padding: 8px 12px calc(8px + env(safe-area-inset-top, 0px)) 12px;
        padding-top: calc(8px + env(safe-area-inset-top, 0px));
        background: rgba(20, 25, 40, 0.75);
        backdrop-filter: blur(16px) saturate(160%);
        -webkit-backdrop-filter: blur(16px) saturate(160%);
        border: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
        box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
    }
    body.light-theme .topbar {
        background: rgba(255, 255, 255, 0.75);
        border-bottom: 1px solid rgba(0, 0, 0, 0.06);
        box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
    }

    .topbar-inner {
        min-height: 40px;
        gap: 8px;
        flex-wrap: nowrap;
        justify-content: space-between;
    }

    /* 手机上隐藏顶栏导航链接（改用底部导航） */
    .topbar-nav {
        display: none;
    }

    .topbar-brand {
        font-size: 0.95rem;
        gap: 8px;
        flex: 1;
        min-width: 0;
    }
    .topbar-brand img {
        width: 26px;
        height: 26px;
    }

    .topbar-actions {
        gap: 8px;
        flex-shrink: 0;
    }

    /* 手机上功能按钮放大，图标为主 */
    .app-btn {
        padding: 0;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        font-size: 1rem;
        justify-content: center;
        background: rgba(255, 255, 255, 0.06);
        border-color: rgba(255, 255, 255, 0.08);
    }
    .app-btn i {
        font-size: 1rem;
        margin: 0;
    }
    /* 隐藏按钮文字，只留图标 */
    .app-btn {
        font-size: 0;
    }
    .app-btn i {
        font-size: 1.05rem;
    }
    body.light-theme .app-btn {
        background: rgba(0, 0, 0, 0.05);
        border-color: rgba(0, 0, 0, 0.06);
    }

    /* 语言切换按钮简化 */
    .lang-toggle {
        width: 40px;
        height: 40px;
        padding: 0;
        justify-content: center;
        border-radius: 50%;
        font-size: 0;
        background: rgba(255, 255, 255, 0.06);
        border-color: rgba(255, 255, 255, 0.08);
    }
    .lang-toggle span {
        display: none;
    }
    .lang-toggle i {
        display: none;
    }
    .lang-toggle::after {
        content: '🌐';
        font-size: 1.1rem;
    }
    body.light-theme .lang-toggle {
        background: rgba(0, 0, 0, 0.05);
        border-color: rgba(0, 0, 0, 0.06);
    }

    /* 今日人品简化 */
    .fortune-wrap {
        padding: 0 10px;
        height: 40px;
        border-radius: 20px;
        gap: 4px;
        font-size: 0.75rem;
    }
    .fortune-label {
        display: none;
    }
    .fortune-value {
        font-size: 0.9rem;
        min-width: 20px;
    }
    .fortune-emojis {
        font-size: 0.9rem;
    }

    /* ===== 底部导航栏 ===== */
    .mobile-bottom-nav {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 1500;
        background: rgba(18, 23, 38, 0.92);
        backdrop-filter: blur(20px) saturate(160%);
        -webkit-backdrop-filter: blur(20px) saturate(160%);
        border-top: 1px solid rgba(255, 255, 255, 0.08);
        box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.4);
        padding-bottom: env(safe-area-inset-bottom, 0px);
        justify-content: space-around;
        align-items: stretch;
    }
    body.light-theme .mobile-bottom-nav {
        background: rgba(255, 255, 255, 0.94);
        border-top: 1px solid rgba(0, 0, 0, 0.08);
        box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.08);
    }

    .mbn-item {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        padding: 10px 4px;
        min-height: 60px;
        text-decoration: none;
        color: rgba(255, 255, 255, 0.5);
        font-size: 0.68rem;
        font-weight: 500;
        transition: color 0.2s ease, background 0.2s ease;
        -webkit-tap-highlight-color: transparent;
        cursor: pointer;
        position: relative;
    }
    .mbn-item i {
        font-size: 1.25rem;
        transition: transform 0.2s ease;
    }
    .mbn-item:active {
        background: rgba(255, 255, 255, 0.06);
    }
    .mbn-item.active {
        color: #7bbdff;
    }
    .mbn-item.active i {
        transform: scale(1.1);
    }
    .mbn-item.active::before {
        content: '';
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 28px;
        height: 3px;
        border-radius: 0 0 3px 3px;
        background: #7bbdff;
    }
    body.light-theme .mbn-item {
        color: rgba(0, 0, 0, 0.5);
    }
    body.light-theme .mbn-item:active {
        background: rgba(0, 0, 0, 0.04);
    }
    body.light-theme .mbn-item.active {
        color: #4a7acc;
    }
    body.light-theme .mbn-item.active::before {
        background: #4a7acc;
    }

    /* ===== 页面容器与底部留白 ===== */
    .page-container {
        margin-top: 60px;
        padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px));
    }

    #page-home {
        padding: 0;
    }
    .home-inner {
        padding: 20px 16px 0;
        min-height: auto;
    }

    .page-content h1 {
        font-size: 1.9rem;
    }
    .welcome-text {
        font-size: 0.9rem;
    }

    /* 首页按钮放大 */
    .home-buttons-row {
        flex-direction: column;
        gap: 14px;
        margin-bottom: 24px;
    }
    .btn-bilibili {
        padding: 14px 28px;
        font-size: 1rem;
        margin-bottom: 0;
        width: 100%;
        max-width: 320px;
        text-align: center;
    }
    .btn-sponsor {
        padding: 14px 28px;
        font-size: 1rem;
        width: 100%;
        max-width: 320px;
        justify-content: center;
    }

    .intro-section {
        min-height: 280px;
        margin-top: 20px;
        border-radius: 16px;
    }
    .intro-content {
        padding: 24px 18px;
    }
    .intro-title {
        font-size: 1rem;
        margin-bottom: 12px;
    }
    .intro-text {
        font-size: 0.9rem;
        line-height: 2;
    }

    /* ===== 各页面手机适配（放大按钮） ===== */
    .page-resources {
        padding: 16px 14px 30px;
    }
    .resources-header h2 {
        font-size: 1.3rem;
    }
    .resources-subtitle {
        font-size: 0.8rem;
        margin-left: 0;
    }
    .resources-list {
        padding: 10px 12px;
        border-radius: 18px;
    }
    .file-item {
        padding: 14px 12px;
        flex-wrap: wrap;
        gap: 10px;
    }
    .file-info {
        gap: 12px;
        flex: 1 1 100%;
    }
    .file-icon {
        width: 40px;
        height: 40px;
        font-size: 1.15rem;
        border-radius: 10px;
    }
    .file-name {
        font-size: 0.95rem;
    }
    .file-actions {
        flex: 1 1 100%;
        justify-content: flex-end;
        gap: 10px;
    }
    .btn-download {
        padding: 10px 20px;
        font-size: 0.85rem;
    }
    .btn-detail-official {
        padding: 10px 16px;
        font-size: 0.8rem;
    }
    .file-size {
        font-size: 0.7rem;
    }

    .page-changelog {
        padding: 16px 14px 30px;
    }
    .changelog-header-section h2 {
        font-size: 1.3rem;
    }
    .changelog-subtitle {
        font-size: 0.8rem;
        margin-left: 0;
    }
    .changelog-card-full {
        padding: 20px 16px;
        border-radius: 18px;
    }
    .changelog-version {
        font-size: 1.2rem;
    }
    .changelog-version .tag {
        font-size: 0.6rem;
        padding: 2px 10px;
    }
    .changelog-date {
        font-size: 0.72rem;
    }
    .changelog-list li {
        font-size: 0.88rem;
        padding: 10px 0;
        gap: 10px;
    }
    .changelog-list .bullet {
        width: 22px;
        height: 22px;
        font-size: 0.6rem;
    }

    .page-windownload {
        padding: 16px 14px 30px;
    }
    .windownload-header h2 {
        font-size: 1.3rem;
    }
    .windownload-subtitle {
        font-size: 0.8rem;
        margin-left: 0;
    }
    /* 手机端 Win下载卡片单列，更大更清晰 */
    .windownload-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .win-card-image {
        height: 160px;
    }
    .win-card-body {
        padding: 18px 16px 16px;
    }
    .win-card-title {
        font-size: 1.05rem;
    }
    .win-card-desc {
        font-size: 0.85rem;
        margin-bottom: 14px;
    }
    .btn-goto {
        padding: 12px 22px;
        font-size: 0.9rem;
        gap: 8px;
    }
    .btn-goto .arrow {
        font-size: 1rem;
    }
    .win-card .coming-badge,
    .win-card .developing-badge {
        padding: 8px 18px;
        font-size: 0.8rem;
    }

    .page-wincategory {
        padding: 16px 14px 30px;
    }
    .wincategory-header {
        gap: 10px;
    }
    .wincategory-header h2 {
        font-size: 1.2rem;
    }
    .wincategory-subtitle {
        font-size: 0.8rem;
        padding-left: 0;
    }
    .btn-back {
        padding: 12px 20px;
        font-size: 0.9rem;
        gap: 6px;
    }
    .wincategory-body {
        padding: 14px;
        border-radius: 18px;
    }
    .official-item {
        padding: 16px 14px;
        gap: 12px;
        flex-wrap: wrap;
    }
    .official-item-icon {
        width: 42px;
        height: 42px;
        font-size: 1.6rem;
        border-radius: 10px;
    }
    .official-item-title {
        font-size: 0.98rem;
    }
    .official-item-subtitle {
        font-size: 0.78rem;
    }
    .official-item-actions {
        gap: 8px;
        flex: 1 1 100%;
        justify-content: flex-end;
    }
    .btn-download-official {
        padding: 10px 20px;
        font-size: 0.85rem;
        gap: 6px;
    }
    .btn-detail-official {
        padding: 10px 16px;
        font-size: 0.8rem;
    }
    .official-extract {
        font-size: 0.72rem;
    }

    .detail-modal {
        border-radius: 20px;
        max-width: 100%;
    }
    .detail-modal-header {
        padding: 16px 18px;
    }
    .detail-modal-title {
        font-size: 1rem;
    }
    .detail-modal-close {
        font-size: 1.3rem;
        padding: 6px 12px;
    }
    .detail-modal-body {
        padding: 22px 18px 20px;
    }
    .detail-modal-description {
        font-size: 0.92rem;
        line-height: 1.8;
    }
    .detail-modal-close-btn {
        padding: 12px 36px;
        font-size: 0.9rem;
    }

    /* 设置弹窗放大 */
    .modal-card {
        padding: 22px 18px 16px;
        max-width: 94%;
        border-radius: 20px;
    }
    .modal-header h3 {
        font-size: 1.05rem;
    }
    .modal-close {
        font-size: 1.4rem;
        padding: 6px 10px;
    }
    .setting-item label {
        font-size: 0.9rem;
    }
    .opt-btn {
        padding: 12px 14px;
        font-size: 0.9rem;
        border-radius: 24px;
        min-height: 44px;
    }
    .modal-btn {
        padding: 12px 32px;
        font-size: 0.95rem;
        width: 100%;
    }
    .custom-bg-preview {
        height: 130px;
        border-radius: 16px;
    }
    .custom-bg-actions {
        flex-direction: column;
        gap: 10px;
    }
    .custom-bg-actions .opt-btn {
        width: 100%;
    }
    .custom-bg-hint {
        font-size: 0.72rem;
    }
    .device-info .info-grid {
        font-size: 0.7rem;
        gap: 4px 8px;
        padding: 8px 10px;
    }

    .page-details {
        padding: 16px 14px 30px;
    }
    .details-header h2 {
        font-size: 1.3rem;
    }
    .details-subtitle {
        font-size: 0.8rem;
        margin-left: 0;
    }
    .details-card {
        padding: 20px 16px;
        border-radius: 18px;
    }
    .details-grid {
        grid-template-columns: 1fr;
        gap: 0;
    }
    .detail-item {
        font-size: 0.82rem;
        padding: 10px 0;
        gap: 8px;
        flex-wrap: wrap;
    }
    .detail-value {
        font-size: 0.78rem;
        text-align: left;
        max-width: 100%;
        width: 100%;
        padding-left: 0;
    }
    .detail-value pre {
        font-size: 0.68rem;
        padding: 10px;
        max-height: 180px;
    }
    .details-footer {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
        gap: 10px;
    }
    .details-refresh {
        padding: 12px 20px;
        font-size: 0.85rem;
        width: 100%;
    }

    .glow-effect {
        width: 120px;
        height: 120px;
        background: radial-gradient(circle, rgba(120, 180, 255, 0.08) 0%, rgba(80, 140, 255, 0.02) 40%, transparent 70%);
    }

    .win-loading-spinner {
        width: 48px;
        height: 48px;
        border-width: 3px;
    }
    .win-loading-icon {
        font-size: 2.4rem;
    }
    .win-loading-text {
        font-size: 0.95rem;
    }

    /* 首页赞赏弹窗手机适配 */
    .sponsor-modal {
        max-width: 94%;
    }
    .sponsor-qrcode img {
        max-height: 260px;
    }
    .sponsor-modal-body {
        padding: 22px 18px 18px;
    }
    .sponsor-modal-btn {
        padding: 12px 36px;
        font-size: 0.9rem;
    }
}

/* ============================================================
   赞赏按钮（首页）
   ============================================================ */
.home-buttons-row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 30px;
}

.btn-sponsor {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 28px;
    background: rgba(255, 107, 107, 0.15);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255, 107, 107, 0.25);
    border-radius: 30px;
    color: #fff;
    font-size: 0.95rem;
    font-weight: 500;
    text-decoration: none;
    letter-spacing: 0.5px;
    transition: background 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(255, 107, 107, 0.15);
    font-family: inherit;
}
.btn-sponsor:hover {
    background: rgba(255, 107, 107, 0.25);
    transform: scale(1.04);
    box-shadow: 0 8px 28px rgba(255, 107, 107, 0.25);
}

#sponsorBtn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 12px 3px 10px;
    border-radius: 30px;
    font-size: 0.72rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.7);
    background: rgba(255, 107, 107, 0.08);
    border: 1px solid rgba(255, 107, 107, 0.12);
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    cursor: pointer;
    font-family: inherit;
}
#sponsorBtn i {
    font-size: 0.75rem;
}
#sponsorBtn:hover {
    background: rgba(255, 107, 107, 0.18);
    border-color: rgba(255, 107, 107, 0.25);
    color: #fff;
}

.sponsor-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 10001;
    display: none;
    align-items: center;
    justify-content: center;
    animation: fadeIn 0.3s ease;
}

.sponsor-modal {
    background: rgba(20, 25, 40, 0.95);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border-radius: 24px;
    max-width: 440px;
    width: 92%;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.5);
    overflow: hidden;
    animation: sponsorPop 0.35s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

@keyframes sponsorPop {
    0% { opacity: 0; transform: scale(0.92) translateY(12px); }
    100% { opacity: 1; transform: scale(1) translateY(0); }
}

.sponsor-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.sponsor-modal-title {
    font-size: 1.05rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    display: flex;
    align-items: center;
    gap: 10px;
}

.sponsor-modal-close {
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.3);
    font-size: 1.2rem;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 8px;
    transition: all 0.2s ease;
}
.sponsor-modal-close:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
}

.sponsor-modal-body {
    padding: 28px 24px 20px;
    text-align: center;
}

.sponsor-modal-desc {
    font-size: 0.95rem;
    color: rgba(255, 255, 255, 0.55);
    margin-bottom: 20px;
    letter-spacing: 0.5px;
}

.sponsor-qrcode {
    display: flex;
    justify-content: center;
    margin-bottom: 16px;
}

.sponsor-qrcode img {
    max-width: 100%;
    max-height: 320px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    background: #fff;
    padding: 8px;
    box-sizing: border-box;
}

.sponsor-modal-tip {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.35);
    margin-top: 4px;
}

.sponsor-modal-footer {
    padding: 12px 24px 20px;
    display: flex;
    justify-content: center;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
}

.sponsor-modal-btn {
    padding: 8px 32px;
    border-radius: 30px;
    border: none;
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.25s ease;
    font-family: inherit;
}
.sponsor-modal-btn:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}

body.light-theme .sponsor-modal {
    background: rgba(240, 245, 255, 0.95);
    border-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .sponsor-modal-title {
    color: rgba(0, 0, 0, 0.85);
}
body.light-theme .sponsor-modal-close {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .sponsor-modal-close:hover {
    color: #1a1f2e;
    background: rgba(0, 0, 0, 0.04);
}
body.light-theme .sponsor-modal-desc {
    color: rgba(0, 0, 0, 0.5);
}
body.light-theme .sponsor-modal-tip {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .sponsor-modal-footer {
    border-top-color: rgba(0, 0, 0, 0.04);
}
body.light-theme .sponsor-modal-btn {
    background: rgba(0, 0, 0, 0.04);
    color: rgba(0, 0, 0, 0.5);
}
body.light-theme .sponsor-modal-btn:hover {
    background: rgba(0, 0, 0, 0.08);
    color: #1a1f2e;
}
body.light-theme #sponsorBtn {
    color: rgba(0, 0, 0, 0.6);
    border-color: rgba(255, 107, 107, 0.2);
}
body.light-theme #sponsorBtn:hover {
    background: rgba(255, 107, 107, 0.12);
    color: #1a1f2e;
}
body.light-theme .btn-sponsor {
    background: rgba(255, 107, 107, 0.08);
    color: #1a1f2e;
    border-color: rgba(255, 107, 107, 0.15);
}
body.light-theme .btn-sponsor:hover {
    background: rgba(255, 107, 107, 0.18);
}
/* ============================================================
   跳转确认弹窗
   ============================================================ */
.jump-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 12000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    animation: jumpFadeIn 0.3s ease;
}
@keyframes jumpFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.jump-modal {
    background: rgba(22, 27, 42, 0.95);
    backdrop-filter: blur(24px) saturate(160%);
    -webkit-backdrop-filter: blur(24px) saturate(160%);
    border-radius: 24px;
    max-width: 420px;
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    overflow: hidden;
    animation: jumpPop 0.38s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}
@keyframes jumpPop {
    0% { opacity: 0; transform: scale(0.92) translateY(16px); }
    100% { opacity: 1; transform: scale(1) translateY(0); }
}

.jump-modal-body {
    padding: 32px 28px 24px;
    text-align: center;
}

.jump-stage {
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* ===== 通用图标 ===== */
.jump-icon {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: #7bbdff;
    background: rgba(100, 180, 255, 0.1);
    border: 1px solid rgba(100, 180, 255, 0.2);
    margin-bottom: 16px;
}

.jump-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.92);
    margin-bottom: 6px;
}

.jump-subtitle {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.4);
    margin-bottom: 22px;
}

/* ===== 阶段一：打开方式选项 ===== */
.jump-choice-options {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.jump-choice-btn {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 14px 18px;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.92rem;
    font-weight: 500;
    cursor: pointer;
    text-align: left;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
    font-family: inherit;
    -webkit-tap-highlight-color: transparent;
}
.jump-choice-btn:hover {
    background: rgba(100, 180, 255, 0.1);
    border-color: rgba(100, 180, 255, 0.3);
    transform: translateY(-1px);
}
.jump-choice-btn:active {
    transform: scale(0.98);
}
.jump-choice-btn > i:first-child {
    font-size: 1.1rem;
    color: #7bbdff;
    flex-shrink: 0;
    width: 24px;
    text-align: center;
}
.jump-choice-label {
    flex: 1;
    font-weight: 600;
}
.jump-choice-hint {
    font-size: 0.72rem;
    color: rgba(255, 255, 255, 0.35);
    flex-shrink: 0;
}

/* ===== 阶段二：倒计时 ===== */
.jump-spinner {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    border: 3px solid rgba(120, 180, 255, 0.12);
    border-top-color: #7bbdff;
    border-right-color: #4a9ee8;
    animation: jumpSpin 1s linear infinite;
    margin-bottom: 18px;
}
@keyframes jumpSpin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.jump-countdown-text {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 16px;
    letter-spacing: 0.02em;
}
.jump-countdown-text #jumpCountdownNum {
    font-size: 1.4rem;
    font-weight: 700;
    color: #7bbdff;
    margin-right: 4px;
}
.jump-countdown-unit {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.5);
}

.jump-progress-track {
    width: 100%;
    height: 6px;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.06);
    overflow: hidden;
    margin-bottom: 20px;
}
.jump-progress-bar {
    height: 100%;
    width: 0%;
    border-radius: 4px;
    background: linear-gradient(90deg, #4a9ee8, #7bbdff);
    transition: width 0.1s linear;
}

.jump-ready-text {
    font-size: 0.95rem;
    font-weight: 600;
    color: #7bbdff;
    margin-bottom: 16px;
    animation: jumpFadeIn 0.4s ease;
}

.jump-cancel-btn {
    padding: 10px 32px;
    border-radius: 30px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.04);
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.88rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    font-family: inherit;
    -webkit-tap-highlight-color: transparent;
}
.jump-cancel-btn:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.2);
}
.jump-cancel-btn:active {
    transform: scale(0.97);
}

/* ===== 底部小字 ===== */
.jump-modal-footer {
    padding: 12px 20px 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    text-align: center;
}
.jump-footer-hint {
    font-size: 0.72rem;
    color: rgba(255, 255, 255, 0.32);
    letter-spacing: 0.02em;
}

/* ===== 浅色主题 ===== */
body.light-theme .jump-modal {
    background: rgba(245, 248, 255, 0.96);
    border-color: rgba(0, 0, 0, 0.06);
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.15);
}
body.light-theme .jump-icon {
    background: rgba(60, 120, 255, 0.08);
    border-color: rgba(60, 120, 255, 0.18);
    color: #4a7acc;
}
body.light-theme .jump-title {
    color: #1a1f2e;
}
body.light-theme .jump-subtitle {
    color: rgba(0, 0, 0, 0.4);
}
body.light-theme .jump-choice-btn {
    border-color: rgba(0, 0, 0, 0.08);
    background: rgba(0, 0, 0, 0.02);
    color: rgba(0, 0, 0, 0.8);
}
body.light-theme .jump-choice-btn:hover {
    background: rgba(60, 120, 255, 0.08);
    border-color: rgba(60, 120, 255, 0.25);
}
body.light-theme .jump-choice-btn > i:first-child {
    color: #4a7acc;
}
body.light-theme .jump-choice-hint {
    color: rgba(0, 0, 0, 0.35);
}
body.light-theme .jump-spinner {
    border-color: rgba(74, 122, 204, 0.15);
    border-top-color: #4a7acc;
    border-right-color: #3a6abc;
}
body.light-theme .jump-countdown-text {
    color: rgba(0, 0, 0, 0.65);
}
body.light-theme .jump-countdown-text #jumpCountdownNum {
    color: #4a7acc;
}
body.light-theme .jump-countdown-unit {
    color: rgba(0, 0, 0, 0.45);
}
body.light-theme .jump-progress-track {
    background: rgba(0, 0, 0, 0.06);
}
body.light-theme .jump-progress-bar {
    background: linear-gradient(90deg, #3a6abc, #4a7acc);
}
body.light-theme .jump-ready-text {
    color: #4a7acc;
}
body.light-theme .jump-cancel-btn {
    border-color: rgba(0, 0, 0, 0.1);
    background: rgba(0, 0, 0, 0.03);
    color: rgba(0, 0, 0, 0.6);
}
body.light-theme .jump-cancel-btn:hover {
    background: rgba(0, 0, 0, 0.06);
    color: #1a1f2e;
    border-color: rgba(0, 0, 0, 0.15);
}
body.light-theme .jump-modal-footer {
    border-top-color: rgba(0, 0, 0, 0.05);
}
body.light-theme .jump-footer-hint {
    color: rgba(0, 0, 0, 0.35);
}

/* ===== 手机端 ===== */
@media (max-width: 600px) {
    .jump-modal {
        max-width: 94%;
        border-radius: 20px;
    }
    .jump-modal-body {
        padding: 26px 20px 20px;
    }
    .jump-icon {
        width: 50px;
        height: 50px;
        font-size: 1.3rem;
    }
    .jump-title {
        font-size: 1.05rem;
    }
    .jump-choice-btn {
        padding: 16px 16px;
        font-size: 0.95rem;
        border-radius: 18px;
    }
    .jump-choice-btn > i:first-child {
        font-size: 1.15rem;
    }
    .jump-spinner {
        width: 50px;
        height: 50px;
    }
    .jump-cancel-btn {
        padding: 14px 36px;
        font-size: 0.95rem;
        width: 100%;
    }
    .jump-footer-hint {
        font-size: 0.7rem;
    }
}
/* ============================================================
   V1.5.0 新增：主题风格（默认液态玻璃 / 特调液态玻璃）
   ============================================================ */

/* ===== 特调液态玻璃：卡片按钮玻璃感变弱，更实、更突出 ===== */
body.theme-special .btn-download,
body.theme-special .btn-detail-official,
body.theme-special .btn-download-official,
body.theme-special .btn-goto,
body.theme-special .btn-back,
body.theme-special .app-btn,
body.theme-special .opt-btn,
body.theme-special .modal-btn,
body.theme-special .jump-choice-btn,
body.theme-special .jump-cancel-btn,
body.theme-special .details-refresh,
body.theme-special .sponsor-modal-btn,
body.theme-special .btn-sponsor {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: rgba(40, 70, 130, 0.35) !important;
    border: 1px solid rgba(120, 180, 255, 0.35) !important;
    box-shadow:
        0 2px 10px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(120, 180, 255, 0.08) inset !important;
    color: #eaf3ff !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em;
}

body.theme-special .btn-download:hover,
body.theme-special .btn-detail-official:hover,
body.theme-special .btn-download-official:hover,
body.theme-special .btn-goto:hover,
body.theme-special .btn-back:hover,
body.theme-special .app-btn:hover,
body.theme-special .opt-btn:not(.active):hover,
body.theme-special .jump-choice-btn:hover,
body.theme-special .jump-cancel-btn:hover,
body.theme-special .details-refresh:hover,
body.theme-special .sponsor-modal-btn:hover,
body.theme-special .btn-sponsor:hover {
    background: rgba(70, 120, 210, 0.55) !important;
    border-color: rgba(160, 210, 255, 0.6) !important;
    box-shadow:
        0 6px 22px rgba(80, 140, 255, 0.35),
        0 0 0 1px rgba(160, 210, 255, 0.15) inset !important;
    transform: translateY(-2px) scale(1.02) !important;
}

body.theme-special .opt-btn.active,
body.theme-special .nav-link.home {
    background: rgba(90, 150, 240, 0.6) !important;
    border-color: rgba(160, 210, 255, 0.6) !important;
    box-shadow: 0 4px 16px rgba(90, 150, 240, 0.4) !important;
}

/* 特调：卡片本身玻璃感减弱，边界更清晰 */
body.theme-special .resources-list,
body.theme-special .changelog-card-full,
body.theme-special .win-card,
body.theme-special .wincategory-body,
body.theme-special .details-card,
body.theme-special .modal-card {
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
    background: rgba(255, 255, 255, 0.02) !important;
    border: 1px solid rgba(255, 255, 255, 0.10) !important;
}

/* 特调：浅色主题下的适配 */
body.light-theme.theme-special .btn-download,
body.light-theme.theme-special .btn-detail-official,
body.light-theme.theme-special .btn-download-official,
body.light-theme.theme-special .btn-goto,
body.light-theme.theme-special .btn-back,
body.light-theme.theme-special .app-btn,
body.light-theme.theme-special .opt-btn,
body.light-theme.theme-special .modal-btn,
body.light-theme.theme-special .jump-choice-btn,
body.light-theme.theme-special .jump-cancel-btn,
body.light-theme.theme-special .details-refresh,
body.light-theme.theme-special .sponsor-modal-btn,
body.light-theme.theme-special .btn-sponsor {
    background: rgba(70, 120, 210, 0.14) !important;
    border: 1px solid rgba(70, 120, 210, 0.35) !important;
    color: #2a4a80 !important;
    box-shadow: 0 2px 10px rgba(70, 120, 210, 0.12) !important;
}
body.light-theme.theme-special .btn-download:hover,
body.light-theme.theme-special .btn-detail-official:hover,
body.light-theme.theme-special .btn-download-official:hover,
body.light-theme.theme-special .btn-goto:hover,
body.light-theme.theme-special .btn-back:hover,
body.light-theme.theme-special .app-btn:hover,
body.light-theme.theme-special .opt-btn:not(.active):hover,
body.light-theme.theme-special .jump-choice-btn:hover,
body.light-theme.theme-special .jump-cancel-btn:hover,
body.light-theme.theme-special .details-refresh:hover,
body.light-theme.theme-special .sponsor-modal-btn:hover,
body.light-theme.theme-special .btn-sponsor:hover {
    background: rgba(70, 120, 210, 0.28) !important;
    border-color: rgba(70, 120, 210, 0.6) !important;
    box-shadow: 0 6px 22px rgba(70, 120, 210, 0.22) !important;
    transform: translateY(-2px) scale(1.02) !important;
}

/* ============================================================
   V1.5.0 新增：主题风格（默认液态玻璃 / 特调液态玻璃）
   ============================================================ */

/* ===== 默认液态玻璃：保持玻璃感（什么都不用改，就是现有默认） ===== */
/* 这里故意留空，默认样式就是"像液态玻璃"的那个 */

/* ===== 特调液态玻璃：玻璃感变弱，按钮更实、更突出 ===== */
body.theme-special .btn-download,
body.theme-special .btn-detail-official,
body.theme-special .btn-download-official,
body.theme-special .btn-goto,
body.theme-special .btn-back,
body.theme-special .app-btn,
body.theme-special .opt-btn,
body.theme-special .modal-btn,
body.theme-special .jump-choice-btn,
body.theme-special .jump-cancel-btn,
body.theme-special .details-refresh,
body.theme-special .sponsor-modal-btn,
body.theme-special .btn-sponsor {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: rgba(40, 70, 130, 0.35) !important;
    border: 1px solid rgba(120, 180, 255, 0.35) !important;
    box-shadow:
        0 2px 10px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(120, 180, 255, 0.08) inset !important;
    color: #eaf3ff !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em;
}

body.theme-special .btn-download:hover,
body.theme-special .btn-detail-official:hover,
body.theme-special .btn-download-official:hover,
body.theme-special .btn-goto:hover,
body.theme-special .btn-back:hover,
body.theme-special .app-btn:hover,
body.theme-special .opt-btn:not(.active):hover,
body.theme-special .jump-choice-btn:hover,
body.theme-special .jump-cancel-btn:hover,
body.theme-special .details-refresh:hover,
body.theme-special .sponsor-modal-btn:hover,
body.theme-special .btn-sponsor:hover {
    background: rgba(70, 120, 210, 0.55) !important;
    border-color: rgba(160, 210, 255, 0.6) !important;
    box-shadow:
        0 6px 22px rgba(80, 140, 255, 0.35),
        0 0 0 1px rgba(160, 210, 255, 0.15) inset !important;
    transform: translateY(-2px) scale(1.02) !important;
}

/* ★ 关键修复：特调下选中项要能看出来，最后一条覆盖，保留高亮 */
body.theme-special .opt-btn.active {
    background: #4a7acc !important;
    border-color: #4a7acc !important;
    color: #fff !important;
    box-shadow: 0 4px 16px rgba(74, 122, 204, 0.45) !important;
    font-weight: 600 !important;
}

body.theme-special .nav-link.home {
    background: rgba(90, 150, 240, 0.6) !important;
    border-color: rgba(160, 210, 255, 0.6) !important;
    box-shadow: 0 4px 16px rgba(90, 150, 240, 0.4) !important;
}

/* 特调：卡片本身玻璃感减弱，边界更清晰 */
body.theme-special .resources-list,
body.theme-special .changelog-card-full,
body.theme-special .win-card,
body.theme-special .wincategory-body,
body.theme-special .details-card,
body.theme-special .modal-card {
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
    background: rgba(255, 255, 255, 0.02) !important;
    border: 1px solid rgba(255, 255, 255, 0.10) !important;
}

/* 特调：浅色主题下的适配 */
body.light-theme.theme-special .btn-download,
body.light-theme.theme-special .btn-detail-official,
body.light-theme.theme-special .btn-download-official,
body.light-theme.theme-special .btn-goto,
body.light-theme.theme-special .btn-back,
body.light-theme.theme-special .app-btn,
body.light-theme.theme-special .opt-btn,
body.light-theme.theme-special .modal-btn,
body.light-theme.theme-special .jump-choice-btn,
body.light-theme.theme-special .jump-cancel-btn,
body.light-theme.theme-special .details-refresh,
body.light-theme.theme-special .sponsor-modal-btn,
body.light-theme.theme-special .btn-sponsor {
    background: rgba(70, 120, 210, 0.14) !important;
    border: 1px solid rgba(70, 120, 210, 0.35) !important;
    color: #2a4a80 !important;
    box-shadow: 0 2px 10px rgba(70, 120, 210, 0.12) !important;
}
body.light-theme.theme-special .btn-download:hover,
body.light-theme.theme-special .btn-detail-official:hover,
body.light-theme.theme-special .btn-download-official:hover,
body.light-theme.theme-special .btn-goto:hover,
body.light-theme.theme-special .btn-back:hover,
body.light-theme.theme-special .app-btn:hover,
body.light-theme.theme-special .opt-btn:not(.active):hover,
body.light-theme.theme-special .jump-choice-btn:hover,
body.light-theme.theme-special .jump-cancel-btn:hover,
body.light-theme.theme-special .details-refresh:hover,
body.light-theme.theme-special .sponsor-modal-btn:hover,
body.light-theme.theme-special .btn-sponsor:hover {
    background: rgba(70, 120, 210, 0.28) !important;
    border-color: rgba(70, 120, 210, 0.6) !important;
    box-shadow: 0 6px 22px rgba(70, 120, 210, 0.22) !important;
    transform: translateY(-2px) scale(1.02) !important;
}

/* ★ 浅色 + 特调下选中项也要能看出来 */
body.light-theme.theme-special .opt-btn.active {
    background: #4a7acc !important;
    border-color: #4a7acc !important;
    color: #fff !important;
    box-shadow: 0 4px 16px rgba(74, 122, 204, 0.4) !important;
}
/* ============================================================
   V1.5.0 新增：资源库分类卡片 + Android 区
   ============================================================ */

/* 资源库分类卡片容器 */
.resources-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 24px;
}

/* 资源库分类卡片（复用 win-card 样式逻辑） */
.res-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.35s ease, border-color 0.3s ease;
    display: flex;
    flex-direction: column;
    will-change: transform;
    cursor: pointer;
}
.res-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.35);
    border-color: rgba(255, 255, 255, 0.08);
}

.res-card-image {
    width: 100%;
    height: 160px;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.3);
    flex-shrink: 0;
}
.res-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
    will-change: transform;
}
.res-card:hover .res-card-image img {
    transform: scale(1.04);
}

.res-card-body {
    padding: 20px 20px 18px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.res-card-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.res-card-title i {
    font-size: 1.15rem;
}
.res-card-desc {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.45);
    line-height: 1.5;
    flex: 1;
    margin-bottom: 14px;
}
.res-card-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: auto;
}

/* 敬请期待卡片 */
.res-card.coming {
    cursor: default;
    opacity: 0.7;
}
.res-card.coming:hover {
    transform: none;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    border-color: rgba(255, 255, 255, 0.05);
}
.res-card.coming .res-card-image {
    filter: brightness(0.6);
}
.res-card.coming .res-card-footer {
    justify-content: center;
}
.res-card .coming-badge {
    display: inline-block;
    padding: 4px 14px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.04);
    color: rgba(255, 255, 255, 0.25);
    font-size: 0.7rem;
    font-weight: 500;
    letter-spacing: 0.05em;
}

/* ===== Android 区页面内容 ===== */
.android-developing {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px 60px;
    text-align: center;
    gap: 20px;
}
.android-developing-img {
    max-width: 100%;
    max-height: 260px;
    border-radius: 16px;
    object-fit: contain;
    border: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}
.android-developing-text {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.65);
    line-height: 1.6;
    letter-spacing: 0.02em;
}
.android-sponsor-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 32px;
    border-radius: 30px;
    border: 1px solid rgba(255, 107, 107, 0.3);
    background: rgba(255, 107, 107, 0.12);
    color: #fff;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.25s ease, border-color 0.25s ease, transform 0.2s ease, box-shadow 0.25s ease;
    font-family: inherit;
    box-shadow: 0 4px 16px rgba(255, 107, 107, 0.15);
}
.android-sponsor-btn:hover {
    background: rgba(255, 107, 107, 0.22);
    border-color: rgba(255, 107, 107, 0.5);
    transform: scale(1.04);
    box-shadow: 0 8px 28px rgba(255, 107, 107, 0.3);
}
.android-sponsor-btn:active {
    transform: scale(0.98);
}

/* ===== 浅色主题适配 ===== */
body.light-theme .res-card {
    background: rgba(255, 255, 255, 0.5);
    border-color: rgba(0, 0, 0, 0.06);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
}
body.light-theme .res-card:hover {
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.1);
    border-color: rgba(0, 0, 0, 0.08);
}
body.light-theme .res-card-title {
    color: rgba(0, 0, 0, 0.85);
}
body.light-theme .res-card-desc {
    color: rgba(0, 0, 0, 0.4);
}
body.light-theme .res-card .coming-badge {
    background: rgba(0, 0, 0, 0.03);
    color: rgba(0, 0, 0, 0.2);
}
body.light-theme .android-developing-text {
    color: rgba(0, 0, 0, 0.55);
}
body.light-theme .android-sponsor-btn {
    color: #1a1f2e;
    background: rgba(255, 107, 107, 0.1);
    border-color: rgba(255, 107, 107, 0.25);
}

/* ===== 特调液态玻璃下的适配 ===== */
body.theme-special .res-card {
    background: rgba(30, 40, 65, 0.35);
    backdrop-filter: blur(24px) saturate(200%);
    -webkit-backdrop-filter: blur(24px) saturate(200%);
    border: 1px solid rgba(160, 210, 255, 0.16);
    box-shadow:
        0 8px 40px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(180, 220, 255, 0.10) !important;
}
body.theme-special .android-sponsor-btn {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: rgba(40, 70, 130, 0.35);
    border: 1px solid rgba(120, 180, 255, 0.35);
    box-shadow:
        0 2px 10px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(120, 180, 255, 0.08) inset;
}
body.theme-special .android-sponsor-btn:hover {
    background: rgba(70, 120, 210, 0.55);
    border-color: rgba(160, 210, 255, 0.6);
    box-shadow: 0 6px 22px rgba(80, 140, 255, 0.35);
    transform: translateY(-2px) scale(1.02);
}

/* ===== 手机端适配 ===== */
@media (max-width: 600px) {
    .resources-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .res-card-image {
        height: 160px;
    }
    .res-card-body {
        padding: 18px 16px 16px;
    }
    .res-card-title {
        font-size: 1.05rem;
    }
    .res-card-desc {
        font-size: 0.85rem;
        margin-bottom: 14px;
    }
    .res-card .btn-goto {
        padding: 12px 22px;
        font-size: 0.9rem;
    }
    .android-developing {
        padding: 24px 14px 40px;
        gap: 16px;
    }
    .android-developing-img {
        max-height: 200px;
    }
    .android-developing-text {
        font-size: 0.95rem;
    }
    .android-sponsor-btn {
        padding: 14px 36px;
        font-size: 1rem;
        width: 100%;
        max-width: 320px;
        justify-content: center;
    }
}
/* ============================================================
   V1.7.0 新增：反馈系统
   ============================================================ */

/* 首页反馈按钮 */
.btn-feedback {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 28px;
    background: rgba(100, 180, 255, 0.12);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(100, 180, 255, 0.25);
    border-radius: 30px;
    color: #fff;
    font-size: 0.95rem;
    font-weight: 500;
    letter-spacing: 0.5px;
    transition: background 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(100, 180, 255, 0.12);
    font-family: inherit;
}
.btn-feedback:hover {
    background: rgba(100, 180, 255, 0.22);
    transform: scale(1.04);
    box-shadow: 0 8px 28px rgba(100, 180, 255, 0.25);
}
.btn-feedback:active {
    transform: scale(0.98);
}

/* 反馈弹窗遮罩 */
.feedback-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 10002;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    transition: opacity 250ms ease;
}
.feedback-modal-overlay.open {
    opacity: 1;
}

/* 反馈弹窗主体 */
.feedback-modal {
    background: rgba(22, 27, 42, 0.95);
    backdrop-filter: blur(24px) saturate(160%);
    -webkit-backdrop-filter: blur(24px) saturate(160%);
    border-radius: 24px;
    max-width: 480px;
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.6);
    overflow: hidden;
    transform: scale(0.92) translateY(12px);
    opacity: 0;
    transition: transform 250ms cubic-bezier(0.34, 1.56, 0.64, 1), opacity 250ms ease;
}
.feedback-modal-overlay.open .feedback-modal {
    transform: scale(1) translateY(0);
    opacity: 1;
}

.feedback-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.feedback-modal-title {
    font-size: 1.05rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    display: flex;
    align-items: center;
    gap: 10px;
}
.feedback-modal-title i {
    color: #7bbdff;
}
.feedback-modal-close {
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.3);
    font-size: 1.2rem;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 8px;
    transition: all 0.2s ease;
}
.feedback-modal-close:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
}

.feedback-modal-body {
    padding: 24px 24px 8px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-height: 60vh;
    overflow-y: auto;
}

.feedback-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.feedback-field label {
    font-size: 0.85rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.7);
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.feedback-count {
    font-size: 0.72rem;
    color: rgba(255, 255, 255, 0.35);
    font-family: 'JetBrains Mono', 'Fira Code', monospace;
}

.feedback-select,
.feedback-input,
.feedback-textarea {
    width: 100%;
    padding: 10px 14px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.9rem;
    font-family: inherit;
    transition: border-color 0.2s ease, background 0.2s ease;
    outline: none;
    box-sizing: border-box;
}
.feedback-select:focus,
.feedback-input:focus,
.feedback-textarea:focus {
    border-color: rgba(100, 180, 255, 0.5);
    background: rgba(255, 255, 255, 0.05);
}
.feedback-select option {
    background: #1a1f2e;
    color: #fff;
}
.feedback-textarea {
    min-height: 100px;
    resize: vertical;
    line-height: 1.6;
}

.feedback-msg {
    font-size: 0.8rem;
    min-height: 18px;
    color: #ff7b7b;
}
.feedback-msg.ok {
    color: #50c878;
}

.feedback-modal-footer {
    padding: 12px 24px 22px;
    display: flex;
    justify-content: center;
}
.feedback-submit-btn {
    padding: 12px 40px;
    border-radius: 30px;
    border: none;
    background: #4a7acc;
    color: #fff;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.15s ease;
    font-family: inherit;
    width: 100%;
}
.feedback-submit-btn:hover {
    background: #3a6abc;
    transform: scale(1.02);
}
.feedback-submit-btn:active {
    transform: scale(0.98);
}
.feedback-submit-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

/* 浅色主题 */
body.light-theme .feedback-modal {
    background: rgba(245, 248, 255, 0.96);
    border-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .feedback-modal-title {
    color: #1a1f2e;
}
body.light-theme .feedback-modal-close {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .feedback-modal-close:hover {
    color: #1a1f2e;
    background: rgba(0, 0, 0, 0.04);
}
body.light-theme .feedback-field label {
    color: rgba(0, 0, 0, 0.7);
}
body.light-theme .feedback-count {
    color: rgba(0, 0, 0, 0.35);
}
body.light-theme .feedback-select,
body.light-theme .feedback-input,
body.light-theme .feedback-textarea {
    border-color: rgba(0, 0, 0, 0.1);
    background: rgba(0, 0, 0, 0.02);
    color: #1a1f2e;
}
body.light-theme .feedback-select option {
    background: #fff;
    color: #1a1f2e;
}
body.light-theme .btn-feedback {
    color: #1a1f2e;
    background: rgba(74, 122, 204, 0.1);
    border-color: rgba(74, 122, 204, 0.25);
}

/* 手机端 */
@media (max-width: 600px) {
    .btn-feedback {
        padding: 14px 28px;
        font-size: 1rem;
        width: 100%;
        max-width: 320px;
        justify-content: center;
    }
    .feedback-modal {
        max-width: 94%;
        border-radius: 20px;
    }
    .feedback-modal-body {
        padding: 20px 18px 6px;
        max-height: 65vh;
    }
    .feedback-select,
    .feedback-input,
    .feedback-textarea {
        padding: 12px 14px;
        font-size: 0.95rem;
    }
    .feedback-textarea {
        min-height: 90px;
    }
    .feedback-submit-btn {
        padding: 14px 36px;
        font-size: 1rem;
    }
}

/* ============================================================
   V1.7.x 新增：AI 测试平台入口 + 密码弹窗
   ============================================================ */

/* 设置里的 AI 入口按钮 */
.ai-entry-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 12px 16px;
    border-radius: 16px;
    border: 1px solid rgba(100, 180, 255, 0.2);
    background: rgba(100, 180, 255, 0.08);
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.25s ease, border-color 0.25s ease, transform 0.2s ease;
    font-family: inherit;
    text-align: left;
}
.ai-entry-btn:hover {
    background: rgba(100, 180, 255, 0.18);
    border-color: rgba(100, 180, 255, 0.4);
    transform: translateY(-1px);
}
.ai-entry-btn i:first-child {
    color: #7bbdff;
    font-size: 1.05rem;
}
.ai-entry-btn .ai-entry-arrow {
    margin-left: auto;
    font-size: 0.8rem;
    opacity: 0.5;
    transition: transform 0.25s ease;
}
.ai-entry-btn:hover .ai-entry-arrow {
    transform: translateX(4px);
    opacity: 1;
}

/* 密码弹窗遮罩 */
.ai-pass-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 10002;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    transition: opacity 0.25s ease;
}
.ai-pass-overlay.open {
    display: flex;
    opacity: 1;
}

/* 密码弹窗主体 */
.ai-pass-card {
    background: rgba(22, 27, 42, 0.95);
    backdrop-filter: blur(24px) saturate(160%);
    -webkit-backdrop-filter: blur(24px) saturate(160%);
    border-radius: 24px;
    max-width: 380px;
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.6);
    overflow: hidden;
    transform: scale(0.92) translateY(12px);
    opacity: 0;
    transition: transform 0.28s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.25s ease;
}
.ai-pass-overlay.open .ai-pass-card {
    transform: scale(1) translateY(0);
    opacity: 1;
}

.ai-pass-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 22px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.ai-pass-title {
    font-size: 0.98rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    display: flex;
    align-items: center;
    gap: 10px;
}
.ai-pass-title i {
    color: #7bbdff;
}
.ai-pass-close {
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.3);
    font-size: 1.1rem;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 8px;
    transition: background 0.2s ease, color 0.2s ease;
}
.ai-pass-close:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
}

.ai-pass-body {
    padding: 22px 22px 8px;
}
.ai-pass-desc {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: 12px;
}
.ai-pass-input {
    width: 100%;
    padding: 12px 16px;
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.04);
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.95rem;
    font-family: inherit;
    outline: none;
    transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}
.ai-pass-input::placeholder {
    color: rgba(255, 255, 255, 0.25);
}
.ai-pass-input:focus {
    border-color: rgba(100, 180, 255, 0.5);
    background: rgba(255, 255, 255, 0.06);
    box-shadow: 0 0 0 4px rgba(100, 180, 255, 0.1);
}
.ai-pass-msg {
    min-height: 18px;
    font-size: 0.8rem;
    color: #ff7b7b;
    margin-top: 8px;
}

.ai-pass-footer {
    padding: 14px 22px 20px;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}
.ai-pass-cancel {
    padding: 10px 22px;
    border-radius: 30px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.88rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
    font-family: inherit;
}
.ai-pass-cancel:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
}
.ai-pass-submit {
    padding: 10px 26px;
    border-radius: 30px;
    border: none;
    background: #4a7acc;
    color: #fff;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.15s ease;
    font-family: inherit;
}
.ai-pass-submit:hover {
    background: #3a6abc;
    transform: scale(1.03);
}
.ai-pass-submit:active {
    transform: scale(0.97);
}

/* 浅色主题适配 */
body.light-theme .ai-entry-btn {
    color: rgba(0, 0, 0, 0.75);
    background: rgba(74, 122, 204, 0.08);
    border-color: rgba(74, 122, 204, 0.22);
}
body.light-theme .ai-entry-btn:hover {
    background: rgba(74, 122, 204, 0.16);
    border-color: rgba(74, 122, 204, 0.4);
}
body.light-theme .ai-entry-btn i:first-child {
    color: #4a7acc;
}
body.light-theme .ai-pass-card {
    background: rgba(245, 248, 255, 0.96);
    border-color: rgba(0, 0, 0, 0.06);
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.15);
}
body.light-theme .ai-pass-title {
    color: #1a1f2e;
}
body.light-theme .ai-pass-title i {
    color: #4a7acc;
}
body.light-theme .ai-pass-close {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .ai-pass-close:hover {
    color: #1a1f2e;
    background: rgba(0, 0, 0, 0.04);
}
body.light-theme .ai-pass-desc {
    color: rgba(0, 0, 0, 0.5);
}
body.light-theme .ai-pass-input {
    border-color: rgba(0, 0, 0, 0.1);
    background: rgba(0, 0, 0, 0.02);
    color: #1a1f2e;
}
body.light-theme .ai-pass-input:focus {
    border-color: rgba(74, 122, 204, 0.5);
    background: rgba(0, 0, 0, 0.04);
}
body.light-theme .ai-pass-cancel {
    border-color: rgba(0, 0, 0, 0.1);
    background: rgba(0, 0, 0, 0.03);
    color: rgba(0, 0, 0, 0.55);
}
body.light-theme .ai-pass-cancel:hover {
    background: rgba(0, 0, 0, 0.07);
    color: #1a1f2e;
}

/* 手机端适配 */
@media (max-width: 600px) {
    .ai-entry-btn {
        padding: 14px 16px;
        font-size: 0.95rem;
        min-height: 44px;
    }
    .ai-pass-card {
        max-width: 94%;
        border-radius: 20px;
    }
    .ai-pass-body {
        padding: 20px 18px 6px;
    }
    .ai-pass-input {
        padding: 14px 16px;
        font-size: 1rem;
    }
    .ai-pass-footer {
        padding: 12px 18px 18px;
    }
    .ai-pass-cancel,
    .ai-pass-submit {
        flex: 1;
        padding: 12px 20px;
        font-size: 0.92rem;
        min-height: 44px;
    }
}

/* ============================================================
   V1.7.x 新增：关于我们按钮 + 弹窗
   ============================================================ */

/* 详情页底部的「关于我们」按钮 */
.about-trigger-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    margin-top: 16px;
    padding: 12px 20px;
    border-radius: 30px;
    border: 1px solid rgba(100, 180, 255, 0.18);
    background: rgba(100, 180, 255, 0.06);
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.88rem;
    font-weight: 500;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.2s ease;
}
.about-trigger-btn:hover {
    background: rgba(100, 180, 255, 0.15);
    border-color: rgba(100, 180, 255, 0.4);
    color: #fff;
    transform: translateY(-1px);
}
.about-trigger-btn:active {
    transform: scale(0.98);
}
.about-trigger-btn i {
    color: #7bbdff;
}

/* 关于弹窗遮罩 */
.about-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 10003;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    transition: opacity 0.25s ease;
}
.about-modal-overlay.open {
    display: flex;
    opacity: 1;
}

/* 关于弹窗主体 */
.about-modal {
    background: rgba(22, 27, 42, 0.95);
    backdrop-filter: blur(24px) saturate(160%);
    -webkit-backdrop-filter: blur(24px) saturate(160%);
    border-radius: 24px;
    max-width: 460px;
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.6);
    overflow: hidden;
    transform: scale(0.92) translateY(12px);
    opacity: 0;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.25s ease;
    max-height: 88vh;
    display: flex;
    flex-direction: column;
}
.about-modal-overlay.open .about-modal {
    transform: scale(1) translateY(0);
    opacity: 1;
}

.about-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 22px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    flex-shrink: 0;
}
.about-modal-title {
    font-size: 1rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    display: flex;
    align-items: center;
    gap: 10px;
}
.about-modal-title i {
    color: #7bbdff;
}
.about-modal-close {
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.3);
    font-size: 1.1rem;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 8px;
    transition: background 0.2s ease, color 0.2s ease;
}
.about-modal-close:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.06);
}

.about-modal-body {
    padding: 24px 24px 8px;
    overflow-y: auto;
    flex: 1;
}

/* Logo + 站名 */
.about-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    padding: 8px 0 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    margin-bottom: 20px;
}
.about-logo img {
    width: 56px;
    height: 56px;
    display: block;
    filter: drop-shadow(0 4px 16px rgba(100, 180, 255, 0.35));
}
.about-name {
    font-size: 1.5rem;
    font-weight: 700;
    background: linear-gradient(135deg, #e8f0ff, #8ab4ff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    letter-spacing: 0.03em;
}
.about-tagline {
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.4);
    letter-spacing: 0.02em;
}

/* 内容区块 */
.about-section {
    margin-bottom: 18px;
}
.about-section-title {
    font-size: 0.85rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.about-section-title i {
    color: #7bbdff;
    font-size: 0.8rem;
}
.about-text {
    font-size: 0.85rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.6);
    margin: 0;
}
.about-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.about-list li {
    font-size: 0.82rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.55);
    padding: 4px 0 4px 18px;
    position: relative;
}
.about-list li::before {
    content: '·';
    position: absolute;
    left: 6px;
    color: #7bbdff;
    font-weight: 700;
    font-size: 1.2rem;
    line-height: 1.2;
}

/* 底部链接按钮 */
.about-links {
    display: flex;
    gap: 10px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.about-link {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 11px 14px;
    border-radius: 30px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.85rem;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.about-link:hover {
    background: rgba(100, 180, 255, 0.12);
    border-color: rgba(100, 180, 255, 0.3);
    color: #fff;
}
.about-link i {
    color: #7bbdff;
}

/* 底部版本信息 */
.about-footer {
    text-align: center;
    padding: 20px 0 8px;
    margin-top: 16px;
}
.about-version {
    font-size: 0.75rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.35);
    letter-spacing: 0.05em;
}
.about-copy {
    font-size: 0.7rem;
    color: rgba(255, 255, 255, 0.22);
    margin-top: 4px;
}

.about-modal-footer {
    padding: 12px 22px 20px;
    display: flex;
    justify-content: center;
    flex-shrink: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.about-modal-btn {
    padding: 10px 40px;
    border-radius: 30px;
    border: none;
    background: #4a7acc;
    color: #fff;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.2s ease, transform 0.15s ease;
}
.about-modal-btn:hover {
    background: #3a6abc;
    transform: scale(1.02);
}
.about-modal-btn:active {
    transform: scale(0.98);
}

/* 浅色主题适配 */
body.light-theme .about-trigger-btn {
    color: rgba(0, 0, 0, 0.75);
    background: rgba(74, 122, 204, 0.08);
    border-color: rgba(74, 122, 204, 0.22);
}
body.light-theme .about-trigger-btn:hover {
    background: rgba(74, 122, 204, 0.16);
    border-color: rgba(74, 122, 204, 0.4);
    color: #1a1f2e;
}
body.light-theme .about-trigger-btn i {
    color: #4a7acc;
}
body.light-theme .about-modal {
    background: rgba(245, 248, 255, 0.96);
    border-color: rgba(0, 0, 0, 0.06);
    box-shadow: 0 32px 80px rgba(0, 0, 0, 0.15);
}
body.light-theme .about-modal-title {
    color: #1a1f2e;
}
body.light-theme .about-modal-title i {
    color: #4a7acc;
}
body.light-theme .about-modal-close {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .about-modal-close:hover {
    color: #1a1f2e;
    background: rgba(0, 0, 0, 0.04);
}
body.light-theme .about-logo {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .about-name {
    background: linear-gradient(135deg, #2a3a5e, #4a7acc);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
body.light-theme .about-tagline {
    color: rgba(0, 0, 0, 0.4);
}
body.light-theme .about-section-title {
    color: rgba(0, 0, 0, 0.75);
}
body.light-theme .about-section-title i {
    color: #4a7acc;
}
body.light-theme .about-text {
    color: rgba(0, 0, 0, 0.6);
}
body.light-theme .about-list li {
    color: rgba(0, 0, 0, 0.55);
}
body.light-theme .about-list li::before {
    color: #4a7acc;
}
body.light-theme .about-links {
    border-top-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .about-link {
    border-color: rgba(0, 0, 0, 0.08);
    background: rgba(0, 0, 0, 0.02);
    color: rgba(0, 0, 0, 0.65);
}
body.light-theme .about-link:hover {
    background: rgba(74, 122, 204, 0.1);
    border-color: rgba(74, 122, 204, 0.3);
    color: #1a1f2e;
}
body.light-theme .about-link i {
    color: #4a7acc;
}
body.light-theme .about-version {
    color: rgba(0, 0, 0, 0.4);
}
body.light-theme .about-copy {
    color: rgba(0, 0, 0, 0.3);
}
body.light-theme .about-modal-footer {
    border-top-color: rgba(0, 0, 0, 0.06);
}

/* 手机端适配 */
@media (max-width: 600px) {
    .about-trigger-btn {
        padding: 14px 20px;
        font-size: 0.95rem;
        min-height: 44px;
    }
    .about-modal {
        max-width: 94%;
        border-radius: 20px;
    }
    .about-modal-body {
        padding: 20px 18px 6px;
    }
    .about-logo img {
        width: 48px;
        height: 48px;
    }
    .about-name {
        font-size: 1.35rem;
    }
    .about-links {
        flex-direction: column;
        gap: 8px;
    }
    .about-link {
        padding: 13px 16px;
        min-height: 44px;
    }
    .about-modal-footer {
        padding: 12px 18px 18px;
    }
    .about-modal-btn {
        width: 100%;
        padding: 13px 36px;
        min-height: 44px;
    }
}

/* ============================================================
   V1.7.x 新增：首页视频区（B站视频）
   ============================================================ */
.video-section {
    margin-top: 40px;
    border-radius: 20px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    border: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
    padding: 16px;
}

.video-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 12px;
    padding-left: 4px;
}
.video-label i {
    color: #fb7299;
    font-size: 1rem;
}

.video-frame {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 14px;
    overflow: hidden;
    background: #000;
}
.video-frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: none;
    display: block;
}

/* 浅色主题适配 */
body.light-theme .video-section {
    background: rgba(255, 255, 255, 0.5);
    border-color: rgba(0, 0, 0, 0.06);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
}
body.light-theme .video-label {
    color: rgba(0, 0, 0, 0.7);
}

/* 手机端适配 */
@media (max-width: 600px) {
    .video-section {
        margin-top: 24px;
        padding: 12px;
        border-radius: 16px;
    }
    .video-label {
        font-size: 0.85rem;
        margin-bottom: 10px;
    }
    .video-frame {
        border-radius: 12px;
    }
}

/* ============================================================
   V1.7.x 新增：通知浮层（右侧滑入 · 读 cor.txt）
   ============================================================ */
.notice-toast {
    position: fixed;
    top: 50%;
    right: 24px;
    transform: translate(calc(100% + 40px), -50%);
    width: 340px;
    max-width: calc(100vw - 32px);
    background: rgba(28, 33, 48, 0.88);
    backdrop-filter: blur(24px) saturate(180%);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 18px;
    box-shadow:
        0 20px 60px rgba(0, 0, 0, 0.5),
        0 0 0 1px rgba(255, 255, 255, 0.04) inset,
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    z-index: 99999;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.35s ease;
    will-change: transform, opacity;
}
.notice-toast.show {
    transform: translate(0, -50%);
    opacity: 1;
    pointer-events: auto;
}

.notice-toast-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 14px 16px 10px;
}
.notice-toast-title-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    flex: 1;
}
.notice-toast-icon {
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.78rem;
    color: #fff;
    background: linear-gradient(135deg, #4a7acc, #6a8fd8);
    box-shadow: 0 2px 8px rgba(74, 122, 204, 0.4);
}
.notice-toast-title {
    font-size: 0.92rem;
    font-weight: 600;
    color: #f0f6ff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.notice-toast-close {
    flex-shrink: 0;
    background: rgba(255, 255, 255, 0.06);
    border: none;
    color: rgba(255, 255, 255, 0.5);
    width: 26px;
    height: 26px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 0.72rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s, color 0.2s, transform 0.15s;
    font-family: inherit;
}
.notice-toast-close:hover {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    transform: scale(1.1);
}
.notice-toast-close:active {
    transform: scale(0.92);
}

.notice-toast-body {
    padding: 0 16px 14px;
    font-size: 0.85rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.75);
    word-break: break-word;
    white-space: pre-wrap;
    max-height: 40vh;
    overflow-y: auto;
}
.notice-toast-body::-webkit-scrollbar { width: 4px; }
.notice-toast-body::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.12);
    border-radius: 2px;
}

.notice-toast-progress {
    height: 3px;
    width: 100%;
    background: rgba(255, 255, 255, 0.06);
    overflow: hidden;
}
.notice-toast-progress-bar {
    height: 100%;
    width: 100%;
    background: linear-gradient(90deg, #4a7acc, #7bbdff);
    transform-origin: left center;
    transform: scaleX(1);
}
.notice-toast.show .notice-toast-progress-bar {
    animation: noticeProgress 5s linear forwards;
}
@keyframes noticeProgress {
    from { transform: scaleX(1); }
    to { transform: scaleX(0); }
}

/* 浅色主题 */
body.light-theme .notice-toast {
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(0, 0, 0, 0.08);
    box-shadow:
        0 20px 60px rgba(0, 0, 0, 0.15),
        0 0 0 1px rgba(0, 0, 0, 0.02) inset,
        inset 0 1px 0 rgba(255, 255, 255, 0.6);
}
body.light-theme .notice-toast-title {
    color: #1a1f2e;
}
body.light-theme .notice-toast-close {
    background: rgba(0, 0, 0, 0.05);
    color: rgba(0, 0, 0, 0.4);
}
body.light-theme .notice-toast-close:hover {
    background: rgba(0, 0, 0, 0.1);
    color: #1a1f2e;
}
body.light-theme .notice-toast-body {
    color: rgba(0, 0, 0, 0.7);
}
body.light-theme .notice-toast-progress {
    background: rgba(0, 0, 0, 0.06);
}

/* 手机端 */
@media (max-width: 600px) {
    .notice-toast {
        top: auto;
        bottom: calc(90px + env(safe-area-inset-bottom, 0px));
        right: 12px;
        left: 12px;
        width: auto;
        max-width: none;
        transform: translateY(calc(100% + 40px));
    }
    .notice-toast.show {
        transform: translateY(0);
    }
    .notice-toast-title {
        font-size: 0.9rem;
    }
    .notice-toast-body {
        font-size: 0.82rem;
        max-height: 30vh;
    }
}
/* ============================================================
   V1.7.x 新增：页面加载遮罩
   ============================================================ */
.page-loader {
    position: fixed;
    inset: 0;
    z-index: 999999;
    background: #0a0e1a;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    opacity: 1;
    transition: opacity 0.6s ease;
    pointer-events: all;
}
body.light-theme .page-loader {
    background: #e8eef7;
}
.page-loader.hidden {
    opacity: 0;
    pointer-events: none;
}

.loader-spinner {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 3px solid rgba(120, 180, 255, 0.15);
    border-top-color: #7bbdff;
    border-right-color: #4a9ee8;
    animation: loaderSpin 0.8s linear infinite;
}
body.light-theme .loader-spinner {
    border-color: rgba(74, 122, 204, 0.15);
    border-top-color: #4a7acc;
    border-right-color: #3a6abc;
}

@keyframes loaderSpin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loader-text {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.6);
    letter-spacing: 0.1em;
}
body.light-theme .loader-text {
    color: rgba(0, 0, 0, 0.5);
}

/* 降低透明度进行加载时的状态（通过 JS 加类） */
body.page-loading .page-container,
body.page-loading .topbar,
body.page-loading .mobile-bottom-nav {
    opacity: 0.6;
    pointer-events: none;
    transition: opacity 0.4s ease;
}

/* ===== 彩蛋按钮 ===== */
.easter-egg-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 10px auto 0;
    padding: 6px 18px;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.04);
    color: rgba(255, 255, 255, 0.4);
    font-size: 0.72rem;
    font-weight: 500;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.3s ease;
    letter-spacing: 0.05em;
}
.easter-egg-btn:hover {
    color: #ffd700;
    border-color: rgba(255, 215, 0, 0.5);
    background: rgba(255, 215, 0, 0.08);
    transform: scale(1.05);
    box-shadow: 0 0 12px rgba(255, 215, 0, 0.3);
}
.easter-egg-btn:active {
    transform: scale(0.95);
}
.easter-egg-btn i {
    font-size: 0.8rem;
}

/* 浅色主题适配 */
body.light-theme .easter-egg-btn {
    color: rgba(0, 0, 0, 0.35);
    border-color: rgba(0, 0, 0, 0.1);
    background: rgba(0, 0, 0, 0.03);
}
body.light-theme .easter-egg-btn:hover {
    color: #b8860b;
    border-color: rgba(184, 134, 11, 0.4);
    background: rgba(255, 215, 0, 0.1);
}

/* ===== 烟花 Canvas ===== */
#fireworksCanvas {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 99999;
    display: none;
}

/* ============================================================
   低配设备性能优化模式
   ============================================================ */
body.low-performance .aurora-blob {
    animation: none !important;
    filter: blur(30px) !important;
    opacity: 0.3 !important;
}
body.low-performance .aurora-overlay {
    background: rgba(10, 14, 26, 0.6) !important;
}
body.low-performance .bg-aurora {
    background: #0a0e1a !important;
}
body.low-performance .topbar,
body.low-performance .modal-card,
body.low-performance .about-modal,
body.low-performance .detail-modal,
body.low-performance .jump-modal,
body.low-performance .win-loading-overlay {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
body.low-performance * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
}
body.low-performance .loader-spinner {
    animation: loaderSpin 1.2s linear infinite !important;
}
body.low-performance .glow-effect {
    display: none !important;
}
body.low-performance .custom-bg-layer {
    opacity: 0.3 !important;
}
body.low-performance .page-container,
body.low-performance .topbar,
body.low-performance .mobile-bottom-nav {
    will-change: auto !important;
}

/* 减少重排：常用元素提升为独立渲染层 */
.topbar,
.page-container,
.mobile-bottom-nav,
.modal-overlay,
.about-modal-overlay,
.detail-modal-overlay {
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* 图片懒加载占位优化 */
img {
    content-visibility: auto;
}

/* 滚动性能优化 */
.page-content,
.details-card,
.about-modal-body {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}
/* ============================================================
   V1.7.x 终极修复：桌面端出现滚动条时，固定顶栏向右偏移且被截断
   原理：强制网页宽度不包含滚动条，防止 body 出现横向溢出被截断
   ============================================================ */
html {
    overflow-x: hidden;
    /* 为滚动条预留空间，保证 fixed 元素和内容区基准一致 */
    scrollbar-gutter: stable; 
}

/* 强制顶栏的宽度计算包含滚动条占用的空间，并居中 */
.topbar {
    width: calc(100vw - 32px) !important;
    max-width: 1200px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
}

/* 针对 Windows 桌面端（非手机）做微调，防止右侧被截断 */
@media (min-width: 601px) {
    .topbar {
        /* 动态计算真正的 100vw 减去滚动条和边距 */
        width: calc(100% - 32px) !important; 
        margin: 0 auto;
    }
}
/* ============================================================
   V1.8.0 手机端 UI/UX 深度优化补丁
   适用：≤ 600px 设备（重点优化触控、排版、阅读体验）
   ============================================================ */
@media (max-width: 600px) {
    /* 1. 全局触控手感优化 */
    html, body {
        -webkit-tap-highlight-color: transparent; /* 去掉安卓默认点击高亮 */
        scroll-behavior: smooth;
    }
    
    button, a, .mbn-item, .app-btn, .fortune-wrap {
        touch-action: manipulation; /* 避免双击缩放延迟 */
    }

    /* 2. 顶栏图标间距与比例微调 */
    .topbar-inner {
        padding: 0 4px;
    }
    .topbar-actions {
        gap: 6px !important;
    }
    .app-btn, .lang-toggle {
        width: 42px !important;
        height: 42px !important;
    }
    .fortune-wrap {
        height: 42px !important;
        padding: 0 12px !important;
        border-radius: 21px !important;
    }
    
    /* 3. 底部导航栏手感与安全性 */
    .mobile-bottom-nav {
        padding-bottom: max(env(safe-area-inset-bottom, 0px), 8px) !important;
        box-shadow: 0 -2px 20px rgba(0, 0, 0, 0.2);
    }
    .mbn-item {
        min-height: 52px !important;
        padding: 6px 4px 8px !important;
    }
    .mbn-item i {
        font-size: 1.3rem !important;
        margin-bottom: 2px;
    }
    .mbn-item span {
        font-size: 0.65rem !important;
    }

    /* 4. 页面容器底部留白加大，防止全面屏小白条遮挡 */
    .page-container {
        padding-bottom: calc(90px + env(safe-area-inset-bottom, 0px)) !important;
    }

    /* 5. 首页按钮与介绍区 */
    .home-buttons-row {
        flex-direction: column;
        gap: 12px;
    }
    .btn-bilibili, .btn-sponsor, .btn-feedback {
        width: 100%;
        max-width: 100%;
        height: 48px; /* 更大的点击区域 */
        justify-content: center;
        font-size: 1rem !important;
        border-radius: 24px;
    }
    .intro-content {
        padding: 24px 16px;
    }
    .intro-text {
        line-height: 1.8 !important;
        font-size: 0.95rem !important;
    }

    /* 6. Win下载 / 资源库 卡片压缩（一屏多看一点） */
    .windownload-grid, .resources-grid {
        gap: 12px !important;
    }
    .win-card-image, .res-card-image {
        height: 140px !important; /* 原来 160px 有点太高 */
    }
    .win-card-body, .res-card-body {
        padding: 16px 14px 14px !important;
    }
    .win-card-title, .res-card-title {
        font-size: 1.05rem !important;
        margin-bottom: 4px !important;
    }
    .win-card-desc, .res-card-desc {
        font-size: 0.8rem !important;
        line-height: 1.4 !important;
        margin-bottom: 12px !important;
    }
    .btn-goto {
        width: 100%;
        justify-content: center;
        height: 44px;
        background: rgba(255, 255, 255, 0.05) !important;
    }

    /* 7. 资源列表（文件项）美化 */
    .file-item, .official-item, .seekos-item {
        padding: 16px 14px !important;
        gap: 12px !important;
    }
    .file-actions {
        width: 100% !important;
        justify-content: space-between !important;
        margin-top: 4px;
    }
    .official-item-actions {
        width: 100% !important;
        display: flex;
        justify-content: flex-end;
        gap: 8px !important;
    }
    /* 放大下载按钮高度，更好点 */
    .btn-download, .btn-download-official, .btn-detail-official, .btn-back {
        height: 44px !important;
        padding: 0 18px !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 0.88rem !important;
    }

    /* 8. 弹窗（设置 / 关于 / 反馈）优化 */
    .modal-card, .about-modal, .feedback-modal {
        width: 92% !important;
        max-width: 92% !important;
        border-radius: 20px !important;
    }
    .opt-btn, .ai-entry-btn, .about-link {
        min-height: 48px !important; /* 设置里的选项加大 */
        border-radius: 14px !important;
    }
    /* 滑块加大，方便手指拖动 */
    .aether-slider {
        height: 6px !important;
        margin: 16px 0;
    }
    .aether-slider::-webkit-slider-thumb {
        width: 22px !important;
        height: 22px !important;
    }

    /* 9. 隐藏手机端烦人的原生滚动条，视觉更干净 */
    ::-webkit-scrollbar {
        width: 0px;
        background: transparent;
    }
}
/* ============================================================
   V1.8.1 手机端 Bug 修复 + 深度体验优化
   ============================================================ */

/* 1. 修复：解除首页的高度锁定，防止滑不动 */
#page-home {
    overflow: visible !important; 
}

/* 2. 优化：全局开启物理惯性滚动，更接近原生 APP 手感 */
.page-content, .modal-card, .about-modal-body, .details-card {
    -webkit-overflow-scrolling: touch;
}

/* 3. 修复：解决 B站视频在手机上可能撑破屏幕宽度的问题 */
.video-frame {
    width: 100%;
    aspect-ratio: 16 / 9;
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    background: #000;
}
.video-frame iframe {
    position: absolute;
    top: 0; left: 0;
    width: 100% !important;
    height: 100% !important;
    border: 0;
}

@media (max-width: 600px) {
    /* 4. 弹窗滑动优化：手机上弹窗过长时，内部滚动，不卡顿 */
    .modal-card, .about-modal, .jump-modal, .feedback-modal {
        max-height: 85vh !important;
        display: flex;
        flex-direction: column;
    }
    .modal-body, .about-modal-body, .feedback-modal-body {
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        flex: 1;
    }

    /* 5. 细节手感：防止小字和图标在安卓上过小 */
    .nav-link span, .mbn-item span {
        font-size: 0.7rem !important;
    }
    
    /* 6. 首页输入框/按钮点击时的反馈 */
    .btn-bilibili:active, .btn-sponsor:active, .btn-feedback:active, 
    .mbn-item:active, .opt-btn:active, .btn-goto:active {
        transform: scale(0.96) !important;
        transition: transform 0.1s !important;
    }

    /* 7. 首页介绍区域的边距修正 */
    .intro-section {
        margin-top: 16px !important;
    }
}
/* ============================================================
   V1.9.3 纯流光特效追加（高对比度扫光 + 卡片反光 + 低配降级）
   ============================================================ */

/* 1. 标题高光扫射 */
#pageTitle {
    background: linear-gradient(
        90deg, 
        #8ab4ff 0%, 
        #4a7acc 45%, 
        #ffffff 50%, /* 刺眼的纯白高光 */
        #4a7acc 55%, 
        #8ab4ff 100%
    ) !important;
    background-size: 200% auto !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    animation: titleSweep 2.5s linear infinite !important;
}

@keyframes titleSweep {
    0% { background-position: 100% center; }
    100% { background-position: -100% center; }
}

/* 2. 卡片白光扫射反光 */
.win-card, .res-card {
    position: relative;
    overflow: hidden;
}

.win-card::after, .res-card::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(
        90deg, 
        transparent 0%, 
        rgba(255, 255, 255, 0.15) 50%, 
        transparent 100%
    );
    transform: skewX(-25deg);
    transition: none;
    pointer-events: none;
    z-index: 10;
}

/* 鼠标悬停时白光扫过 */
.win-card:hover::after, .res-card:hover::after {
    left: 150%;
    transition: left 0.7s ease-in-out;
}

/* 3. 低配设备（JS 检测后会自动打上 low-performance 标签）性能兜底 */
body.low-performance #pageTitle {
    animation: none !important;
    background: linear-gradient(135deg, #e8f0ff, #8ab4ff) !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
}

body.low-performance .win-card::after, 
body.low-performance .res-card::after {
    display: none !important;
}
/* ============================================================
   V1.9.4 苹果风边框跑马灯特效（低配降级）
   ============================================================ */

/* 为支持的角度属性定义动画 */
@property --marquee-angle {
    syntax: '<angle>';
    initial-value: 0deg;
    inherits: false;
}

/* 1. 准备卡片容器 */
.win-card, .res-card, .changelog-card-full, .details-card {
    position: relative !important;
    /* 隐去原有边框，改用伪元素绘制 */
    border-color: transparent !important;
    background-clip: padding-box !important;
}

/* 2. 跑马灯伪元素 */
.win-card::before, 
.res-card::before, 
.changelog-card-full::before, 
.details-card::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1.5px; /* 边框光束的粗细 */
    /* 光束：大部分透明，只有一小段白色和蓝色高光 */
    background: conic-gradient(
        from var(--marquee-angle), 
        transparent 65%, 
        rgba(120, 180, 255, 0.6) 85%, 
        #ffffff 92%, 
        transparent 100%
    );
    /* 使用 mask 掏空中间，只留边框 */
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    /* 动画：每 3.5 秒转一圈 */
    animation: appleMarquee 3.5s linear infinite;
    pointer-events: none;
    z-index: 10;
}

@keyframes appleMarquee {
    to { --marquee-angle: 360deg; }
}

/* 兼容性回退（如果浏览器不支持 @property） */
@supports not (background: paint(something)) {
    .win-card::before, 
    .res-card::before, 
    .changelog-card-full::before, 
    .details-card::before {
        background: linear-gradient(90deg, transparent, rgba(120, 180, 255, 0.8), transparent);
        background-size: 200% 100%;
        animation: fallbackMarquee 2s linear infinite;
    }
    @keyframes fallbackMarquee {
        0% { background-position: 100% 0; }
        100% { background-position: -100% 0; }
    }
}

/* ============================================================
   ⚡ 低配设备强制关闭（防止老旧设备掉帧）
   ============================================================ */
body.low-performance .win-card::before,
body.low-performance .res-card::before,
body.low-performance .changelog-card-full::before,
body.low-performance .details-card::before {
    display: none !important;
}
/* 低配设备恢复原样边框 */
body.low-performance .win-card,
body.low-performance .res-card,
body.low-performance .changelog-card-full,
body.low-performance .details-card {
    border-color: rgba(255, 255, 255, 0.08) !important;
}
/* ============================================================
   V1.9.5 新增：顶部阅读进度条 + 滚动进场浮现 + 液态玻璃滚动条
   ============================================================ */

/* 1. 顶部阅读进度条（纯 CSS，无需 JS） */
body::after {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, #4a7acc, #7bbdff, #ffffff);
    transform-origin: 0 50%;
    transform: scaleX(0);
    z-index: 99999;
    animation: scrollProgress linear;
    animation-timeline: scroll(root);
    pointer-events: none;
}

@keyframes scrollProgress {
    to { transform: scaleX(1); }
}

/* 浏览器不支持滚动动画时自动隐藏，防排版错乱 */
@supports not (animation-timeline: scroll()) {
    body::after { display: none; }
}

/* 2. 滚动进场浮现动画 (Scroll Reveal) */
@keyframes revealUp {
    from { opacity: 0; transform: translateY(40px) scale(0.95); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

/* 给卡片和列表加滚动浮现效果 */
.win-card, .res-card, .file-item, .official-item {
    animation: revealUp linear both;
    animation-timeline: view();
    animation-range: entry 10% cover 30%;
}

/* 低配兜底（不支持的浏览器直接静态显示，不影响内容） */
@supports not (animation-timeline: view()) {
    .win-card, .res-card, .file-item, .official-item {
        animation: none; 
        opacity: 1; 
        transform: none;
    }
}

/* 3. 液态玻璃滚动条美化（仅桌面端生效） */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-track {
    background: rgba(10, 14, 26, 0.5);
}

::-webkit-scrollbar-thumb {
    background: rgba(120, 180, 255, 0.3);
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(120, 180, 255, 0.6);
}

/* 浅色主题滚动条适配 */
body.light-theme ::-webkit-scrollbar-track {
    background: rgba(220, 228, 240, 0.5);
}

body.light-theme ::-webkit-scrollbar-thumb {
    background: rgba(74, 122, 204, 0.4);
}

body.light-theme ::-webkit-scrollbar-thumb:hover {
    background: rgba(74, 122, 204, 0.7);
}
/* ============================================================
   V1.9.6 纯 CSS 进阶交互与细节补丁
   ============================================================ */

/* 1. 卡片 3D 悬浮手感 (悬停时随鼠标倾斜) */
.win-card, .res-card {
    /* 开启 3D 空间 */
    transform-style: preserve-3d;
    perspective: 1000px;
    transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.3s ease !important;
}
.win-card:hover, .res-card:hover {
    /* 在原有的上浮基础上，增加 3D 翻转倾斜 */
    transform: translateY(-6px) rotateX(4deg) rotateY(-4deg) !important;
    box-shadow: -4px 12px 32px rgba(0, 0, 0, 0.4), 
                4px -4px 20px rgba(120, 180, 255, 0.1) !important;
}
/* 手机端点击时不倾斜，防止错位 */
@media (max-width: 600px) {
    .win-card:hover, .res-card:hover {
        transform: translateY(-4px) !important;
    }
}
/* 低配关闭 3D */
body.low-performance .win-card:hover, body.low-performance .res-card:hover {
    transform: translateY(-2px) !important;
}

/* 2. 输入框聚焦高级发光 (反馈、设置里的输入框) */
.feedback-input, .feedback-textarea, .feedback-select, .ai-pass-input, .custom-bg-input {
    transition: all 0.3s ease !important;
}
.feedback-input:focus, .feedback-textarea:focus, .feedback-select:focus, .ai-pass-input:focus {
    border-color: rgba(120, 180, 255, 0.8) !important;
    box-shadow: 0 0 0 3px rgba(120, 180, 255, 0.2), 
                0 0 15px rgba(120, 180, 255, 0.2) !important;
    background: rgba(255, 255, 255, 0.06) !important;
    outline: none !important;
}
body.light-theme .feedback-input:focus, body.light-theme .feedback-textarea:focus {
    box-shadow: 0 0 0 3px rgba(74, 122, 204, 0.15), 
                0 0 15px rgba(74, 122, 204, 0.1) !important;
}

/* 3. 全局平滑滚动（安卓/PC点导航丝滑滚到顶） */
html {
    scroll-behavior: smooth;
}

/* 4. 禁止移动端长按图片弹出菜单（防误触） */
img {
    -webkit-touch-callout: none; /* 禁用 iOS/Android 长按菜单 */
    user-select: none;
    -webkit-user-drag: none;
}

/* 5. 极简自定义文字选中颜色 */
::selection {
    background: rgba(120, 180, 255, 0.4); /* 淡蓝色选中背景 */
    color: #fff;
}
body.light-theme ::selection {
    background: rgba(74, 122, 204, 0.3);
    color: #1a1f2e;
}

/* 6. 顶栏下拉阴影（当页面滚动时，顶栏底下会有淡淡的阴影，增加层次感） */
@supports (animation-timeline: scroll()) {
    .topbar {
        animation: topbarShadow linear both;
        animation-timeline: scroll(root);
        animation-range: 0px 100px;
    }
    @keyframes topbarShadow {
        to { box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.1); }
    }
}
/* ============================================================
   V1.9.7 纯 CSS 炫技特效包（水波纹 + 左侧光轨 + 灵动岛 + 星空 + 聚光灯）
   ============================================================ */

/* ==========================================
   5. 按钮点击“水波纹”涟漪
   ========================================== */
.btn-bilibili, .btn-sponsor, .btn-feedback, 
.btn-download, .btn-download-official, .btn-detail-official, 
.btn-goto, .btn-back, .app-btn, .opt-btn, .modal-btn {
    position: relative;
    overflow: hidden;
}

.btn-bilibili::after, .btn-sponsor::after, .btn-feedback::after, 
.btn-download::after, .btn-download-official::after, .btn-detail-official::after, 
.btn-goto::after, .btn-back::after, .app-btn::after, .opt-btn::after, .modal-btn::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    width: 100px; height: 100px;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    transform: translate(-50%, -50%) scale(0);
    opacity: 0;
    pointer-events: none;
}

/* 按下时瞬间向外扩散 */
.btn-bilibili:active::after, .btn-sponsor:active::after, .btn-feedback:active::after, 
.btn-download:active::after, .btn-download-official:active::after, .btn-detail-official:active::after, 
.btn-goto:active::after, .btn-back:active::after, .app-btn:active::after, .opt-btn:active::after, .modal-btn:active::after {
    transform: translate(-50%, -50%) scale(2.5);
    opacity: 1;
    transition: transform 0s, opacity 0s;
}

/* ==========================================
   6. 列表悬停“左边缘发光轨道”
   ========================================== */
.file-item, .official-item {
    position: relative;
}

.file-item::before, .official-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%) scaleY(0);
    width: 3px;
    height: 60%;
    background: #7bbdff;
    border-radius: 0 4px 4px 0;
    box-shadow: 0 0 12px rgba(123, 189, 255, 0.8);
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    pointer-events: none;
}

.file-item:hover::before, .official-item:hover::before {
    transform: translateY(-50%) scaleY(1);
}

/* ==========================================
   7. 顶栏滑动“灵动岛收缩” (纯滚动驱动)
   ========================================== */
@supports (animation-timeline: scroll()) {
    .topbar {
        animation: dynamicIslandShrink linear both;
        animation-timeline: scroll(root);
        animation-range: 0px 150px;
    }

    @keyframes dynamicIslandShrink {
        0% { 
            width: calc(100% - 32px); 
            max-width: 1200px; 
            padding: 4px 18px; 
            top: 12px; 
            background: rgba(255, 255, 255, 0.05);
            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
        }
        100% { 
            width: calc(100% - 120px); 
            max-width: 800px; 
            padding: 2px 12px; 
            top: 6px; 
            background: rgba(20, 25, 40, 0.85); /* 变深，更具隔离感 */
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.7);
        }
    }
    body.light-theme .topbar {
        animation-name: dynamicIslandShrinkLight;
    }
    @keyframes dynamicIslandShrinkLight {
        0% { width: calc(100% - 32px); max-width: 1200px; top: 12px; background: rgba(255,255,255,0.5); }
        100% { width: calc(100% - 120px); max-width: 800px; top: 6px; background: rgba(255,255,255,0.9); }
    }
}
/* 手机端不收缩，保持全宽 */
@media (max-width: 600px) {
    .topbar { animation: none !important; width: 100% !important; max-width: none !important; top: 0 !important; }
}

/* ==========================================
   9. 深色模式下的“星轨背景”
   ========================================== */
body::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    /* 用多层径向渐变画出错落有致的星星 */
    background-image: 
        radial-gradient(1.5px 1.5px at 10% 20%, rgba(255,255,255,0.8), transparent),
        radial-gradient(1px 1px at 30% 60%, rgba(255,255,255,0.6), transparent),
        radial-gradient(2px 2px at 50% 15%, rgba(255,255,255,0.9), transparent),
        radial-gradient(1px 1px at 70% 80%, rgba(255,255,255,0.5), transparent),
        radial-gradient(1.5px 1.5px at 90% 40%, rgba(255,255,255,0.7), transparent),
        radial-gradient(1px 1px at 20% 90%, rgba(255,255,255,0.4), transparent),
        radial-gradient(2px 2px at 80% 10%, rgba(255,255,255,0.8), transparent);
    background-size: 400px 400px;
    opacity: 0.4;
    animation: starDrift 80s linear infinite;
}

@keyframes starDrift {
    from { background-position: 0 0; }
    to { background-position: 400px 400px; }
}

body.light-theme::before {
    display: none; /* 浅色模式隐藏星空 */
}

/* ==========================================
   10. 文字悬停“聚光灯”
   ========================================== */
/* 首页欢迎文字与介绍文字 */
.welcome-text, .intro-text, .intro-title {
    transition: color 0.3s ease, text-shadow 0.3s ease, transform 0.3s ease;
    cursor: default;
}

.welcome-text:hover, .intro-text:hover {
    color: #ffffff;
    text-shadow: 0 0 12px rgba(120, 180, 255, 0.9), 0 0 24px rgba(120, 180, 255, 0.4);
    transform: scale(1.02);
}

body.light-theme .welcome-text:hover, 
body.light-theme .intro-text:hover {
    color: #1a1f2e;
    text-shadow: 0 0 12px rgba(74, 122, 204, 0.6);
}


/* ============================================================
   ⚡ 低配设备（自动降级关闭重特效）
   ============================================================ */
body.low-performance::before {
    display: none !important; /* 关星空 */
}
body.low-performance .topbar {
    animation: none !important; /* 关灵动岛，保持原样 */
}
body.low-performance .file-item::before,
body.low-performance .official-item::before {
    display: none !important; /* 关光轨 */
}
body.low-performance .welcome-text:hover,
body.low-performance .intro-text:hover {
    text-shadow: none !important; /* 关聚光灯发光，只用缩放反馈 */
}
/* ============================================================
   V2.0.0 新增：纯深色模式与禁用样式（直接追加在文件末尾）
   ============================================================ */

/* 变灰禁用的按钮样式（设置里的浅色按钮用） */
.opt-btn.disabled {
    opacity: 0.35 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
    background: rgba(255, 255, 255, 0.02) !important;
    color: rgba(255, 255, 255, 0.5) !important;
    border-color: rgba(255, 255, 255, 0.06) !important;
}

/* ===== 纯深色极简模式 ===== */
body.theme-pure-dark {
    background: #050505 !important;
    color: #e0e0e0 !important;
}

/* 隐藏所有背景特效层（澎湃光效、鼠标发光、星空、进度条等） */
body.theme-pure-dark .bg-aurora,
body.theme-pure-dark .glow-effect,
body.theme-pure-dark::before,
body.theme-pure-dark::after {
    display: none !important;
}

/* 彻底关闭所有液态玻璃（毛玻璃滤镜），替换为实心暗色 */
body.theme-pure-dark .topbar,
body.theme-pure-dark .modal-card,
body.theme-pure-dark .about-modal,
body.theme-pure-dark .feedback-modal,
body.theme-pure-dark .jump-modal,
body.theme-pure-dark .sponsor-modal,
body.theme-pure-dark .ai-pass-card,
body.theme-pure-dark .win-card,
body.theme-pure-dark .res-card,
body.theme-pure-dark .resources-list,
body.theme-pure-dark .changelog-card-full,
body.theme-pure-dark .details-card,
body.theme-pure-dark .custom-bg-layer,
body.theme-pure-dark .win-loading-overlay {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: #121212 !important;
    border-color: #333 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.5) !important;
}

/* 关闭所有特效（跑马灯、扫光、灵动岛、水波纹等） */
body.theme-pure-dark .win-card::before,
body.theme-pure-dark .res-card::before,
body.theme-pure-dark .changelog-card-full::before,
body.theme-pure-dark .details-card::before,
body.theme-pure-dark .win-card::after,
body.theme-pure-dark .res-card::after,
body.theme-pure-dark .btn-bilibili::after,
body.theme-pure-dark .btn-sponsor::after,
body.theme-pure-dark .btn-feedback::after,
body.theme-pure-dark .file-item::before,
body.theme-pure-dark .official-item::before,
body.theme-pure-dark .topbar::before {
    display: none !important;
}

/* 关闭所有动画 */
body.theme-pure-dark *,
body.theme-pure-dark *::before,
body.theme-pure-dark *::after {
    animation: none !important;
    transition: none !important;
    text-shadow: none !important;
}

/* 首页标题回归纯白静态 */
body.theme-pure-dark #pageTitle {
    background: none !important;
    -webkit-text-fill-color: #ffffff !important;
    color: #ffffff !important;
    animation: none !important;
}
body.theme-pure-dark .welcome-text,
body.theme-pure-dark .intro-text,
body.theme-pure-dark .intro-title {
    color: #888 !important;
}
body.theme-pure-dark .btn-bilibili,
body.theme-pure-dark .btn-sponsor,
body.theme-pure-dark .btn-feedback {
    background: #1a1a1a !important;
    border: 1px solid #333 !important;
    color: #ccc !important;
}
body.theme-pure-dark .win-card:hover,
body.theme-pure-dark .res-card:hover {
    transform: none !important; 
    border-color: #555 !important;
}

/* 处理纯深色下的浅色主题标签 */
body.theme-pure-dark .theme-light-btn {
    pointer-events: none;
    opacity: 0.4;
}