/* ========================================
   Liquid Glass 设计系统 — 阅读下载中心
   基于 EduGo / Apple Liquid Glass 2025
   ======================================== */

/* --- 亮色主题 --- */
:root {
    --bg-body: #eef3fb;
    --bg-bento: rgba(255, 255, 255, 0.82);
    --text-main: #0b1220;
    --text-dim: #687588;
    --text-subtle: #46566b;

    --accent-brand: #4f8cff;
    --accent-light: rgba(79, 140, 255, 0.13);
    --accent-secondary: #8b7cff;
    --accent-secondary-light: rgba(139, 124, 255, 0.16);

    --border-bento: rgba(160, 174, 196, 0.2);
    --glass-bg: rgba(255, 255, 255, 0.68);
    --glass-border: rgba(255, 255, 255, 0.76);
    --glass-highlight: rgba(255, 255, 255, 0.84);

    --body-dots: rgba(148, 163, 184, 0.16);
    --pill-bg: rgba(255, 255, 255, 0.74);
    --pill-active-bg: rgba(255, 255, 255, 0.96);
    --code-bg: rgba(0, 0, 0, 0.04);

    --surface-shadow: 0 24px 60px -30px rgba(15, 23, 42, 0.22);
    --shadow-hover: 0 34px 90px -38px rgba(15, 23, 42, 0.24);
    --inner-light: inset 0 1px 0 rgba(255, 255, 255, 0.92);

    --card-nested-bg: rgba(255, 255, 255, 0.5);
    --card-nested-border: rgba(160, 174, 196, 0.18);
    --card-nested-shadow: 0 2px 8px -2px rgba(15, 23, 42, 0.06);
    --card-inset-bg: rgba(0, 0, 0, 0.02);
    --card-inset-border: rgba(160, 174, 196, 0.12);

    --success: #10b981;
    --warning: #f59e0b;
    --danger: #f87171;
    --info: #06b6d4;

    --radius-huge: 32px;
    --radius-large: 24px;
    --radius-medium: 18px;
    --radius-small: 12px;

    --stage-bg: linear-gradient(180deg, rgba(255,255,255,0.34) 0%, rgba(244,248,255,0.78) 100%);
    --stage-border: rgba(255,255,255,0.58);
    --stage-shadow: 0 36px 96px -54px rgba(15,23,42,0.18), inset 0 1px 0 rgba(255,255,255,0.8);
}

/* --- 暗色主题 --- */
[data-theme="dark"] {
    --bg-body: #060a12;
    --bg-bento: rgba(16, 23, 42, 0.92);
    --text-main: #f5f5f7;
    --text-dim: #9fabc0;
    --text-subtle: #c7d2e5;

    --accent-brand: #8ab8ff;
    --accent-secondary: #aa95ff;

    --glass-bg: rgba(14, 21, 38, 0.62);
    --glass-border: rgba(255, 255, 255, 0.14);
    --glass-highlight: rgba(255, 255, 255, 0.16);
    --body-dots: rgba(255, 255, 255, 0.06);
    --code-bg: rgba(255, 255, 255, 0.06);
    --border-bento: rgba(255, 255, 255, 0.1);

    --surface-shadow: 0 38px 90px -40px rgba(0,0,0,0.64), inset 0 1px 0 rgba(255,255,255,0.08);
    --shadow-hover: 0 38px 96px -42px rgba(0,0,0,0.72), inset 0 1px 0 rgba(255,255,255,0.12);

    --card-nested-bg: rgba(255, 255, 255, 0.03);
    --card-nested-border: rgba(255, 255, 255, 0.08);
    --card-inset-bg: rgba(0, 0, 0, 0.15);
    --card-inset-border: rgba(255, 255, 255, 0.05);

    --pill-bg: rgba(255, 255, 255, 0.08);
    --pill-active-bg: rgba(255, 255, 255, 0.16);

    --stage-bg: linear-gradient(180deg, rgba(13,20,33,0.48) 0%, rgba(10,16,28,0.78) 100%);
    --stage-border: rgba(255,255,255,0.1);
    --stage-shadow: 0 36px 96px -54px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.07), inset 0 -1px 0 rgba(255,255,255,0.03);
}

/* 自动跟随系统（data-theme="auto" 或无 data-theme 时） */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --bg-body: #060a12;
        --bg-bento: rgba(16, 23, 42, 0.92);
        --text-main: #f5f5f7;
        --text-dim: #9fabc0;
        --text-subtle: #c7d2e5;
        --accent-brand: #8ab8ff;
        --accent-secondary: #aa95ff;
        --glass-bg: rgba(14, 21, 38, 0.62);
        --glass-border: rgba(255, 255, 255, 0.14);
        --glass-highlight: rgba(255, 255, 255, 0.16);
        --body-dots: rgba(255, 255, 255, 0.06);
        --code-bg: rgba(255, 255, 255, 0.06);
        --border-bento: rgba(255, 255, 255, 0.1);
        --surface-shadow: 0 38px 90px -40px rgba(0,0,0,0.64), inset 0 1px 0 rgba(255,255,255,0.08);
        --shadow-hover: 0 38px 96px -42px rgba(0,0,0,0.72), inset 0 1px 0 rgba(255,255,255,0.12);
        --card-nested-bg: rgba(255, 255, 255, 0.03);
        --card-nested-border: rgba(255, 255, 255, 0.08);
        --card-inset-bg: rgba(0, 0, 0, 0.15);
        --card-inset-border: rgba(255, 255, 255, 0.05);
        --pill-bg: rgba(255, 255, 255, 0.08);
        --pill-active-bg: rgba(255, 255, 255, 0.16);
        --stage-bg: linear-gradient(180deg, rgba(13,20,33,0.48) 0%, rgba(10,16,28,0.78) 100%);
        --stage-border: rgba(255,255,255,0.1);
        --stage-shadow: 0 36px 96px -54px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.07), inset 0 -1px 0 rgba(255,255,255,0.03);
    }
}

/* --- 重置与基础 --- */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

body {
    background: var(--bg-body);
    min-height: 100vh;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: var(--text-main);
    line-height: 1.6;
    overflow-x: hidden;
}

h1, h2, h3, h4 {
    font-family: 'Outfit', 'Inter', system-ui, -apple-system, sans-serif;
    letter-spacing: -0.02em;
}

/* --- 背景系统 --- */
.bg-dots {
    position: fixed; inset: 0; z-index: -2;
    background-image: radial-gradient(var(--body-dots) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none;
}

.bg-orb {
    position: fixed; border-radius: 50%; z-index: -1;
    filter: blur(100px); opacity: 0.45;
    animation: orbDrift 22s ease-in-out infinite;
    pointer-events: none;
}
.bg-orb.a { width: 600px; height: 600px; top: -8%; left: -4%;
            background: radial-gradient(circle, rgba(79,140,255,0.25), transparent 70%); }
.bg-orb.b { width: 500px; height: 500px; bottom: -10%; right: -6%;
            background: radial-gradient(circle, rgba(139,92,246,0.2), transparent 70%);
            animation-delay: 8s; animation-direction: reverse; }
.bg-orb.c { width: 400px; height: 400px; top: 45%; left: 55%;
            background: radial-gradient(circle, rgba(236,72,153,0.14), transparent 70%);
            animation-delay: 14s; }

@keyframes orbDrift {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(30px, -20px) scale(1.05); }
    66% { transform: translate(-20px, 15px) scale(0.95); }
}

/* --- 容器 --- */
.container-custom {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

/* --- 外层大面板 .home-stage --- */
.home-stage {
    border-radius: 42px;
    backdrop-filter: blur(28px) saturate(165%);
    -webkit-backdrop-filter: blur(28px) saturate(165%);
    background: var(--stage-bg);
    border: 1px solid var(--stage-border);
    box-shadow: var(--stage-shadow);
    padding: 2rem;
    margin: 1.5rem auto;
    max-width: 1100px;
    animation: slideUpFade 0.65s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    opacity: 0;
    animation-delay: 0.1s;
}

/* --- 毛玻璃卡片 .bento-box --- */
.bento-box {
    background: var(--glass-bg);
    backdrop-filter: blur(30px) saturate(185%);
    -webkit-backdrop-filter: blur(30px) saturate(185%);
    border-radius: var(--radius-huge);
    border: 1px solid var(--glass-border);
    box-shadow: var(--surface-shadow);
    overflow: hidden;
    position: relative;
    padding: 1.5rem;
    margin-bottom: 1.25rem;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    animation: slideUpFade 0.65s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    opacity: 0;
}

.bento-box::before {
    content: "";
    position: absolute; inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background:
        linear-gradient(180deg, var(--glass-highlight) 0%, rgba(255,255,255,0.08) 18%, transparent 40%),
        linear-gradient(135deg, rgba(79,140,255,0.05), transparent 40%, rgba(139,92,246,0.04) 100%);
    z-index: 0;
}

.bento-box::after {
    content: "";
    position: absolute;
    top: -50%; left: -60%;
    width: 40%; height: 200%;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.06), transparent);
    transform: rotate(25deg);
    opacity: 0;
    transition: opacity 0.4s, left 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    z-index: 0;
}

.bento-box:hover::after {
    opacity: 1;
    left: 120%;
}

.bento-box:hover {
    transform: translateY(-4px) scale(1.003);
    box-shadow: var(--shadow-hover);
}

.bento-box > * { position: relative; z-index: 1; }

/* --- 嵌套卡片 .glass-card --- */
.glass-card {
    background: var(--card-nested-bg);
    border: 1px solid var(--card-nested-border);
    border-radius: var(--radius-large);
    padding: 1.25rem;
    box-shadow: var(--card-nested-shadow);
    position: relative;
    overflow: hidden;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.35s, box-shadow 0.35s;
}

.glass-card:hover {
    transform: translateY(-2px);
    border-color: rgba(79, 140, 255, 0.18);
    box-shadow: var(--card-nested-shadow), 0 0 0 1px rgba(79, 140, 255, 0.08);
}

/* --- 内嵌分区 .glass-inset --- */
.glass-inset {
    background: var(--card-inset-bg);
    border: 1px solid var(--card-inset-border);
    border-radius: var(--radius-small);
    padding: 1rem;
}

/* --- 分区标题 --- */
.section-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.85rem;
    padding-bottom: 0.6rem;
    border-bottom: 1px solid var(--border-bento);
}
.section-header h3 { font-size: 0.92rem; font-weight: 700; color: var(--text-main); }
.section-header .section-icon { color: var(--accent-brand); transition: transform 0.3s; }
.glass-card:hover .section-header .section-icon { transform: scale(1.15) rotate(-5deg); }

/* --- 头部 --- */
.header-section {
    text-align: center;
    padding: 2.5rem 0 1.5rem;
    position: relative;
    z-index: 1;
}

.app-title {
    font-size: 2rem;
    font-weight: 700;
    color: var(--text-main);
    margin-bottom: 0.5rem;
}

.app-subtitle {
    font-size: 0.95rem;
    color: var(--text-dim);
    margin-bottom: 1.25rem;
}

/* --- 主题切换按钮 --- */
.theme-toggle {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 100;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid var(--glass-border);
    background: var(--glass-bg);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    color: var(--text-main);
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}
.theme-toggle:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 24px rgba(0,0,0,0.15);
}

/* --- 徽章 --- */
.badge {
    padding: 4px 10px;
    border-radius: var(--radius-small);
    font-size: 0.8rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.35;
    text-align: left;
}
.badge i { flex: 0 0 auto; }
.badge-primary { background: var(--accent-light); color: var(--accent-brand); }
.badge-success { background: rgba(16, 185, 129, 0.12); color: var(--success); }
.badge-warning { background: rgba(245, 158, 11, 0.12); color: var(--warning); }
.badge-danger { background: rgba(248, 113, 113, 0.12); color: var(--danger); }
.badge-info { background: rgba(6, 182, 212, 0.12); color: var(--info); }
.badge-light {
    background: var(--pill-bg);
    color: var(--text-main);
    backdrop-filter: blur(10px);
    border: 1px solid var(--border-bento);
}

/* --- 按钮 — pill 风格 --- */
.btn-download, .btn-back, .btn-outline, .btn-refresh {
    padding: 0.5rem 1.1rem;
    border-radius: var(--radius-medium);
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    border: 1px solid var(--border-bento);
    cursor: pointer;
    position: relative;
    overflow: hidden;
    background: var(--pill-bg);
    color: var(--text-main);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.55), 0 10px 22px -18px rgba(15,23,42,0.16);
}

.btn-download:hover, .btn-back:hover, .btn-outline:hover, .btn-refresh:hover {
    transform: translateY(-2px);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.55), 0 14px 30px -20px rgba(15,23,42,0.24);
}

.btn-primary {
    background: linear-gradient(135deg, #4f8cff, #2563eb);
    color: #fff;
    border-color: transparent;
}
.btn-primary:hover { color: #fff; background: linear-gradient(135deg, #6ba0ff, #3b7aff); }

.btn-success {
    background: linear-gradient(135deg, #10b981, #059669);
    color: #fff;
    border-color: transparent;
}
.btn-success:hover { color: #fff; background: linear-gradient(135deg, #34d399, #10b981); }

.btn-back {
    background: linear-gradient(135deg, #4f8cff, #2563eb);
    color: white;
    border-color: transparent;
    padding: 0.6rem 1.4rem;
}
.btn-back:hover { color: white; }

.btn-outline {
    background: transparent;
    color: var(--accent-brand);
    border: 1px solid var(--accent-brand);
    padding: 0.6rem 1.4rem;
}
.btn-outline:hover { background: var(--accent-light); color: var(--accent-brand); }

.btn-refresh {
    background: transparent;
    color: var(--info);
    border: 1px solid rgba(6, 182, 212, 0.3);
    padding: 0.6rem 1.4rem;
}
.btn-refresh:hover { background: rgba(6, 182, 212, 0.1); color: var(--info); }

.btn-disabled {
    background: var(--card-inset-bg);
    color: var(--text-dim);
    cursor: not-allowed;
    opacity: 0.5;
    border-color: var(--card-inset-border);
}
.btn-disabled:hover { transform: none; box-shadow: none; }

/* 按钮涟漪 */
.btn-ripple {
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.3);
    transform: scale(0);
    animation: btnRipple 0.5s ease-out forwards;
    pointer-events: none;
}
@keyframes btnRipple {
    to { transform: scale(2.5); opacity: 0; }
}

/* 下载中：按钮加载状态 */
.btn-download-loading { opacity: 0.85; cursor: wait !important; }
.spin-icon { display: inline-block; animation: spin 0.8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.btn-online-read {
    background: linear-gradient(135deg, #10b981, #059669);
    color: white;
    border: none;
    padding: 0.75rem 2rem;
    border-radius: var(--radius-medium);
    font-weight: 600;
    font-size: 0.95rem;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: 0 10px 30px -10px rgba(16, 185, 129, 0.4);
}
.btn-online-read:hover {
    color: white;
    transform: translateY(-3px);
    box-shadow: 0 16px 40px -12px rgba(16, 185, 129, 0.5);
}

/* --- 版本卡片 --- */
.version-card {
    background: var(--glass-bg);
    backdrop-filter: blur(30px) saturate(185%);
    -webkit-backdrop-filter: blur(30px) saturate(185%);
    border-radius: var(--radius-huge);
    border: 1px solid var(--glass-border);
    box-shadow: var(--surface-shadow);
    overflow: hidden;
    position: relative;
    padding: 1.5rem;
    margin-bottom: 1.25rem;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s;
    animation: slideUpFade 0.65s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    opacity: 0;
}
.version-card::before {
    content: "";
    position: absolute; inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background:
        linear-gradient(180deg, var(--glass-highlight) 0%, rgba(255,255,255,0.08) 18%, transparent 40%),
        linear-gradient(135deg, rgba(79,140,255,0.05), transparent 40%, rgba(139,92,246,0.04) 100%);
    z-index: 0;
}
.version-card > * { position: relative; z-index: 1; }

.version-header {
    border-bottom: 1px solid var(--border-bento);
    padding-bottom: 1rem;
    margin-bottom: 1rem;
}
.version-title { font-size: 1.2rem; font-weight: 700; color: var(--text-main); margin-bottom: 4px; min-width: 0; overflow-wrap: anywhere; word-break: break-word; line-height: 1.3; }
.version-header-main {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.9rem;
    min-width: 0;
}
.version-title-line {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    min-width: 0;
    flex: 1 1 auto;
}
.version-title-line .repo-icon {
    flex: 0 0 auto;
    margin-top: 0.15rem;
}
.version-heading-text {
    min-width: 0;
    flex: 1 1 auto;
    display: grid;
    gap: 0.45rem;
}
.version-badges {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.45rem;
    min-width: 0;
}
.version-actions-row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.55rem;
    flex: 0 1 auto;
    min-width: 0;
    flex-wrap: wrap;
}
.version-actions-row .badge-light {
    max-width: 220px;
}
.version-meta {
    display: flex; gap: 12px; flex-wrap: wrap;
    font-size: 0.85rem; color: var(--text-dim);
}
.version-meta span { display: flex; align-items: center; gap: 5px; }
.version-meta a { color: var(--accent-brand); text-decoration: none; }
.version-meta a:hover { text-decoration: underline; }

/* --- 文件列表 --- */
.file-list { display: flex; flex-direction: column; gap: 0.75rem; }
.file-item {
    background: var(--card-nested-bg);
    border: 1px solid var(--card-nested-border);
    border-radius: var(--radius-large);
    padding: 1rem 1.25rem;
    position: relative;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.file-item.dropdown-open {
    z-index: 10030;
}
.file-item:hover {
    transform: translateX(4px);
    border-color: rgba(79, 140, 255, 0.18);
    box-shadow: inset 3px 0 0 var(--accent-brand);
}
.file-info-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.file-name-section { flex: 1; min-width: 0; }
.file-name { font-size: 0.95rem; font-weight: 600; color: var(--text-main); margin-bottom: 4px; overflow-wrap: break-word; word-break: break-word; }
.file-meta-info { display: flex; gap: 12px; flex-wrap: wrap; font-size: 0.8rem; color: var(--text-dim); }
.file-meta-info span { display: flex; align-items: center; gap: 4px; }
.file-actions { display: flex; gap: 8px; flex-wrap: wrap; flex-shrink: 0; align-items: stretch; }
.files-title { font-size: 0.95rem; font-weight: 700; color: var(--text-main); margin-bottom: 1rem; display: flex; align-items: center; gap: 8px; }

/* --- 快捷链接 --- */
.quick-links-card {
    background: var(--glass-bg);
    backdrop-filter: blur(30px) saturate(185%);
    -webkit-backdrop-filter: blur(30px) saturate(185%);
    border-radius: var(--radius-huge);
    border: 1px solid var(--glass-border);
    box-shadow: var(--surface-shadow);
    overflow: hidden;
    position: relative;
    padding: 1.5rem;
    margin-bottom: 1.25rem;
    animation: slideUpFade 0.65s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    opacity: 0;
}
.quick-links-card::before {
    content: "";
    position: absolute; inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(180deg, var(--glass-highlight) 0%, rgba(255,255,255,0.08) 18%, transparent 40%);
    z-index: 0;
}
.quick-links-card > * { position: relative; z-index: 1; }
.quick-links-title { font-size: 0.95rem; font-weight: 700; color: var(--text-main); margin-bottom: 1rem; display: flex; align-items: center; gap: 8px; }
.quick-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.quick-link {
    display: flex; align-items: center; gap: 8px;
    padding: 0.7rem 1rem;
    background: var(--card-nested-bg);
    border: 1px solid var(--card-nested-border);
    border-radius: var(--radius-medium);
    text-decoration: none; color: var(--text-main);
    font-size: 0.85rem; font-weight: 500;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.quick-link:hover {
    color: var(--accent-brand);
    transform: translateY(-2px);
    border-color: rgba(79, 140, 255, 0.18);
    box-shadow: 0 6px 20px -8px rgba(79, 140, 255, 0.2);
}
.quick-link i { font-size: 1.1rem; color: var(--accent-brand); }

/* --- 代理开关 --- */
.proxy-switch-card {
    background: var(--glass-bg);
    backdrop-filter: blur(30px) saturate(185%);
    -webkit-backdrop-filter: blur(30px) saturate(185%);
    border-radius: var(--radius-huge);
    border: 1px solid var(--glass-border);
    box-shadow: var(--surface-shadow);
    overflow: hidden;
    position: relative;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.25rem;
    animation: slideUpFade 0.65s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    opacity: 0;
}
.proxy-switch-card > * { position: relative; z-index: 1; }
.proxy-switch-content { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.proxy-switch-label { display: flex; align-items: center; gap: 10px; font-size: 0.9rem; font-weight: 500; color: var(--text-dim); }
.proxy-switch-label i { font-size: 1.2rem; color: var(--accent-brand); }

/* 自定义 Switch */
.form-check-input:checked { background-color: var(--accent-brand); border-color: var(--accent-brand); }

/* --- 发布说明 --- */
.release-notes-title { font-size: 0.92rem; font-weight: 700; color: var(--text-main); margin-bottom: 0.5rem; display: flex; align-items: center; gap: 8px; }
.release-notes {
    background: var(--card-inset-bg);
    border: 1px solid var(--card-inset-border);
    border-radius: var(--radius-small);
    padding: 1rem;
    margin-bottom: 1.25rem;
    font-size: 0.85rem; color: var(--text-dim); line-height: 1.7;
}

/* --- info-card（子页面通用） --- */
.info-card {
    background: var(--glass-bg);
    backdrop-filter: blur(30px) saturate(185%);
    -webkit-backdrop-filter: blur(30px) saturate(185%);
    border-radius: var(--radius-huge);
    border: 1px solid var(--glass-border);
    box-shadow: var(--surface-shadow);
    overflow: hidden;
    position: relative;
    padding: 1.5rem;
    margin-bottom: 1.25rem;
    animation: slideUpFade 0.65s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    opacity: 0;
}
.info-card::before {
    content: "";
    position: absolute; inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(180deg, var(--glass-highlight) 0%, rgba(255,255,255,0.08) 18%, transparent 40%);
    z-index: 0;
}
.info-card > * { position: relative; z-index: 1; }

.card-title {
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--text-main);
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 8px;
}
.card-title i { color: var(--accent-brand); }

/* --- stat-card --- */
.stat-card {
    background: var(--glass-bg);
    backdrop-filter: blur(30px) saturate(185%);
    -webkit-backdrop-filter: blur(30px) saturate(185%);
    border-radius: var(--radius-huge);
    border: 1px solid var(--glass-border);
    box-shadow: var(--surface-shadow);
    overflow: hidden;
    position: relative;
    padding: 1.5rem;
    margin-bottom: 1.25rem;
    text-align: center;
    animation: slideUpFade 0.65s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    opacity: 0;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s;
}
.stat-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); }
.stat-number { font-size: 2rem; font-weight: 800; color: var(--accent-brand); font-family: 'Outfit', sans-serif; }
.stat-label { color: var(--text-dim); font-size: 0.8rem; margin-top: 0.25rem; font-weight: 500; }
.stat-value { font-size: 1rem; font-weight: 600; color: var(--text-main); }

/* --- 表格 --- */
.table { margin-bottom: 0; color: var(--text-main); background: transparent; }
.table th {
    border-top: none; font-weight: 600; color: var(--text-dim); font-size: 0.8rem;
    border-color: var(--border-bento); background: transparent;
    text-transform: uppercase; letter-spacing: 0.05em;
}
.table td { font-size: 0.85rem; vertical-align: middle; border-color: var(--border-bento); background: transparent; }
.table thead { background: transparent; }
.table tbody { background: transparent; }
.table tr { background: transparent; transition: all 0.2s; }
.table tbody tr:hover { background: var(--card-inset-bg); }
.table tbody tr:hover td:first-child { box-shadow: inset 3px 0 0 var(--accent-brand); }
.table-responsive { background: transparent; }

/* Bootstrap 表格暗色覆盖 */
[data-theme="dark"] .table, [data-theme="dark"] .table th, [data-theme="dark"] .table td,
[data-theme="dark"] .table tr, [data-theme="dark"] .table thead, [data-theme="dark"] .table tbody,
[data-theme="dark"] .table-responsive {
    background-color: transparent !important;
    color: var(--text-main) !important;
    --bs-table-bg: transparent !important;
    --bs-table-striped-bg: transparent !important;
    --bs-table-hover-bg: rgba(255,255,255,0.03) !important;
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .table, :root:not([data-theme="light"]) .table th,
    :root:not([data-theme="light"]) .table td, :root:not([data-theme="light"]) .table tr,
    :root:not([data-theme="light"]) .table thead, :root:not([data-theme="light"]) .table tbody,
    :root:not([data-theme="light"]) .table-responsive {
        background-color: transparent !important;
        color: var(--text-main) !important;
        --bs-table-bg: transparent !important;
    }
    :root:not([data-theme="light"]) .table th { color: var(--text-dim) !important; }
}

/* --- 延迟指示 --- */
.latency-good { color: var(--success); }
.latency-warning { color: var(--warning); }
.latency-bad { color: var(--danger); }
.latency-value { font-size: 2rem; font-weight: 800; margin: 0.25rem 0; font-family: 'Outfit', sans-serif; }
.latency-label { color: var(--text-dim); font-size: 0.85rem; }

/* --- 进度条 --- */
.progress {
    height: 6px;
    border-radius: 3px;
    background: var(--card-inset-bg);
    overflow: hidden;
    margin-top: 0.5rem;
}
.progress-bar { border-radius: 3px; transition: width 0.6s cubic-bezier(0.16, 1, 0.3, 1); }
.bg-success { background: var(--success) !important; }
.bg-warning { background: var(--warning) !important; }
.bg-danger { background: var(--danger) !important; }

/* --- 状态边框 --- */
.status-healthy { border-left: 4px solid var(--success); }
.status-warning { border-left: 4px solid var(--warning); }
.status-unhealthy { border-left: 4px solid var(--danger); }

/* --- 空状态 --- */
.empty-state { text-align: center; padding: 3rem 1.5rem; color: var(--text-dim); }
.empty-state i { font-size: 3rem; margin-bottom: 1rem; opacity: 0.3; display: block; }
.empty-state h5 { color: var(--text-subtle); margin-bottom: 0.5rem; font-weight: 600; }

/* --- 版本头部渐变（缓存页面） --- */
.version-header-gradient {
    background: linear-gradient(135deg, rgba(79,140,255,0.15), rgba(139,92,246,0.12));
    border: 1px solid rgba(79,140,255,0.15);
    color: var(--text-main);
    border-radius: var(--radius-large);
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.version-name { font-size: 1rem; font-weight: 700; }

/* --- 子页面返回按钮 --- */
.btn-back-top {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--text-dim);
    text-decoration: none;
    font-size: 0.85rem;
    font-weight: 500;
    margin-bottom: 0.75rem;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    padding: 0.3rem 0;
}
.btn-back-top:hover { color: var(--accent-brand); transform: translateX(-4px); }

/* --- 页脚 --- */
.footer {
    text-align: center;
    padding: 2rem 0;
    margin-top: 2rem;
    position: relative;
    z-index: 1;
}
.footer-links { display: flex; justify-content: center; gap: 20px; margin-bottom: 1rem; flex-wrap: wrap; }
.footer-link {
    color: var(--text-dim);
    text-decoration: none;
    font-size: 0.85rem;
    font-weight: 500;
    transition: color 0.2s;
    display: inline-flex;
    align-items: center;
}
.footer-link:hover { color: var(--accent-brand); }
.copyright { color: var(--text-dim); font-size: 0.8rem; opacity: 0.7; }

/* --- 折叠动画 --- */
.card-content { overflow: hidden; transition: max-height 0.35s cubic-bezier(0.16, 1, 0.3, 1); }
.card-content.collapsed { max-height: 0 !important; }
/* 完全展开（动画结束、max-height:none）时放开溢出，避免下拉节点菜单被卡片裁切（问题①） */
.card-content.expanded { overflow: visible; }
/* 下拉「选择加速节点」菜单打开瞬间，由 JS 给两层祖先挂上此类，放开 overflow，
   彻底解决「第一次被裁、第二次才正常」——根因是 .version-card 与 .card-content 都 overflow:hidden */
.version-card.allow-overflow,
.card-content.allow-overflow { overflow: visible !important; }
.version-card.allow-overflow { z-index: 10020; }
.toggle-icon { transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1); }
.toggle-icon.rotated { transform: rotate(180deg); }

/* --- 入场动画 --- */
@keyframes slideUpFade {
    from { opacity: 0; transform: translateY(30px) scale(0.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

/* 交错延迟 */
.stagger-1 { animation-delay: 0.05s; }
.stagger-2 { animation-delay: 0.10s; }
.stagger-3 { animation-delay: 0.15s; }
.stagger-4 { animation-delay: 0.20s; }
.stagger-5 { animation-delay: 0.25s; }
.stagger-6 { animation-delay: 0.30s; }
.stagger-7 { animation-delay: 0.35s; }

/* --- 下载中全局提示 toast --- */
.download-toast {
    position: fixed;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0.75rem 1.5rem;
    background: var(--glass-bg);
    backdrop-filter: blur(30px) saturate(185%);
    -webkit-backdrop-filter: blur(30px) saturate(185%);
    color: var(--text-main);
    border-radius: var(--radius-medium);
    box-shadow: var(--surface-shadow);
    border: 1px solid var(--glass-border);
    z-index: 9999;
    font-size: 0.9rem;
    font-weight: 500;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s, transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.download-toast-show { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(-8px); }
.download-toast-hide { opacity: 0; visibility: hidden; transform: translateX(-50%); }
.download-toast-icon { font-size: 1.2rem; color: var(--accent-brand); }

/* --- 文本辅助 --- */
.text-muted { color: var(--text-dim) !important; }
.text-success { color: var(--success) !important; }
.text-warning { color: var(--warning) !important; }
.text-danger { color: var(--danger) !important; }
.text-primary-color { color: var(--text-main) !important; }
.text-ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.text-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.min-w-0 { min-width: 0; }
.break-word { overflow-wrap: break-word; word-break: break-word; }

/* --- 减少动画偏好 --- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* --- 响应式：平板 ≤960px --- */
@media (max-width: 960px) {
    .quick-links { grid-template-columns: repeat(2, 1fr); }
    .home-stage { padding: 1.5rem; }
}

/* --- 响应式：手机 ≤640px --- */
@media (max-width: 640px) {
    .home-stage {
        border-radius: 28px;
        padding: 1rem;
        margin: 1rem 0.5rem;
    }
    .bento-box, .version-card, .info-card, .stat-card, .proxy-switch-card, .quick-links-card {
        border-radius: var(--radius-large);
        padding: 1.2rem;
    }
    .container-custom { padding: 0 1rem; }
    .header-section { padding: 1.5rem 0 1rem; }
    .app-title { font-size: 1.5rem; }
    .app-subtitle { font-size: 0.85rem; }

    .file-info-row { flex-direction: column; align-items: flex-start; }
    .file-actions { width: 100%; }
    .btn-download { flex: 1; justify-content: center; }

    .quick-links { grid-template-columns: repeat(2, 1fr); }

    .version-meta { flex-direction: column; gap: 6px; }
    .version-header-main {
        flex-direction: column;
        align-items: stretch;
        gap: 0.8rem;
    }
    .version-title-line {
        width: 100%;
    }
    .version-heading-text {
        width: 100%;
    }
    .version-badges {
        width: 100%;
    }
    .version-actions-row {
        justify-content: flex-start;
        width: 100%;
    }
    .version-actions-row .badge-light {
        max-width: 100%;
    }
    .version-header-gradient { flex-direction: column; align-items: flex-start; }

    .stat-number { font-size: 1.5rem; }
    .stat-value { font-size: 0.9rem; }
    .stat-label { font-size: 0.75rem; }
    .latency-value { font-size: 1.5rem; }

    .footer-links { gap: 12px; }
    .footer-link { font-size: 0.8rem; }

    .table { font-size: 0.78rem; }
    .table th, .table td { padding: 0.5rem; }

    .btn-back, .btn-outline, .btn-refresh { padding: 0.5rem 1rem; font-size: 0.82rem; }
    .d-flex.justify-content-between { flex-wrap: wrap; gap: 8px; }

    .theme-toggle { top: 0.5rem; right: 0.5rem; width: 36px; height: 36px; font-size: 0.95rem; }
    .glass-card { padding: 1rem; border-radius: var(--radius-medium); }
}

@media (max-width: 480px) {
    .quick-links { grid-template-columns: 1fr; }
    .footer-links { flex-direction: column; gap: 8px; }
    .proxy-switch-content { flex-direction: column; align-items: flex-start; }
}

/* ====== 新功能样式 ====== */

/* --- 搜索/筛选栏 --- */
.search-filter-card {
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-medium);
    padding: 1rem 1.2rem;
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
}
.search-input-wrap {
    position: relative;
    flex: 1;
}
.search-input-wrap i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-dim);
    font-size: 0.9rem;
}
.search-input {
    width: 100%;
    padding: 0.55rem 0.8rem 0.55rem 2.2rem;
    border: 1px solid var(--border-bento);
    border-radius: var(--radius-small);
    background: var(--bg-bento);
    color: var(--text-main);
    font-size: 0.88rem;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.search-input:focus {
    border-color: var(--accent-brand);
    box-shadow: 0 0 0 3px var(--accent-light);
}
.search-input::placeholder {
    color: var(--text-dim);
}
.platform-filters {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.platform-btn {
    padding: 0.35rem 0.75rem;
    border-radius: var(--radius-small);
    border: 1px solid var(--border-bento);
    background: var(--pill-bg);
    color: var(--text-dim);
    font-size: 0.8rem;
    cursor: pointer;
    transition: all 0.2s;
}
.platform-btn:hover {
    border-color: var(--accent-brand);
    color: var(--accent-brand);
}
.platform-btn.active {
    background: var(--accent-brand);
    color: #fff;
    border-color: var(--accent-brand);
}

/* --- SHA256 展示 --- */
.sha256-row {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
    font-size: 0.72rem;
    color: var(--text-dim);
    font-family: 'SF Mono', 'Fira Code', monospace;
}
.sha256-row .sha256-value {
    word-break: break-all;
    cursor: pointer;
    padding: 2px 6px;
    border-radius: 4px;
    transition: background 0.15s;
}
.sha256-row .sha256-value:hover {
    background: var(--accent-light);
}
.sha256-copy-tip {
    font-size: 0.68rem;
    color: var(--success);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s, visibility 0.2s;
}
.sha256-copy-tip.show {
    opacity: 1;
    visibility: visible;
}

/* --- QR Code 弹窗 --- */
.qr-modal-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(6px);
    z-index: 9999;
    align-items: center;
    justify-content: center;
}
.qr-modal-overlay.show {
    display: flex;
}
.qr-modal {
    background: var(--bg-bento);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-large);
    padding: 2rem;
    text-align: center;
    max-width: 320px;
    box-shadow: var(--surface-shadow);
    color: var(--text-main);
}
.qr-modal h4 {
    margin-bottom: 1rem;
    font-family: 'Outfit', sans-serif;
    font-weight: 600;
    color: var(--text-main);
}
.qr-modal img, .qr-modal svg {
    width: 200px;
    height: 200px;
    margin: 0.5rem auto;
    display: block;
    background: #ffffff;
    padding: 8px;
    border-radius: 12px;
    box-sizing: content-box;
}
.qr-modal .qr-filename {
    font-size: 0.82rem;
    color: var(--text-dim);
    margin-top: 0.5rem;
    word-break: break-all;
}
.qr-modal .btn-close-qr {
    margin-top: 1rem;
    padding: 0.45rem 1.4rem;
    border-radius: var(--radius-small);
    border: 1px solid var(--border-bento);
    background: var(--pill-bg);
    color: var(--text-main);
    cursor: pointer;
    font-size: 0.85rem;
    transition: all 0.2s;
}
.qr-modal .btn-close-qr:hover {
    background: var(--accent-brand);
    color: #fff;
}
.btn-qr {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: auto;
    align-self: stretch;
    min-height: 32px;
    border-radius: var(--radius-small);
    border: 1px solid var(--border-bento);
    background: var(--pill-bg);
    color: var(--text-dim);
    cursor: pointer;
    transition: all 0.2s;
    flex-shrink: 0;
}
.btn-qr:hover {
    border-color: var(--accent-brand);
    color: var(--accent-brand);
    background: var(--accent-light);
}

/* --- 下载进度条 --- */
.download-progress-bar {
    display: none;
    margin-top: 8px;
    background: var(--card-inset-bg);
    border-radius: 6px;
    overflow: hidden;
    height: 22px;
    position: relative;
    border: 1px solid var(--card-inset-border);
}
.download-progress-bar.active {
    display: block;
}
.download-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--accent-brand), var(--accent-secondary));
    border-radius: 6px;
    transition: width 0.3s ease;
    min-width: 0;
}
.download-progress-text {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--text-main);
    mix-blend-mode: difference;
}

/* --- Markdown 渲染 --- */
.release-notes-md {
    font-size: 0.85rem;
    line-height: 1.7;
    color: var(--text-main);
    padding: 0.8rem 1rem;
    background: var(--card-inset-bg);
    border: 1px solid var(--card-inset-border);
    border-radius: var(--radius-small);
    max-height: 300px;
    overflow-y: auto;
    scrollbar-width: thin;
}
.release-notes-md, .release-notes-md * {
    overflow-wrap: anywhere;
    word-break: break-word;
}
.release-notes-md img, .release-notes-md video {
    max-width: 100%;
    height: auto;
}
.release-notes-md h1, .release-notes-md h2, .release-notes-md h3 {
    font-family: 'Outfit', sans-serif;
    font-weight: 600;
    margin: 0.8rem 0 0.4rem;
}
.release-notes-md h1 { font-size: 1.1rem; }
.release-notes-md h2 { font-size: 1rem; }
.release-notes-md h3 { font-size: 0.92rem; }
.release-notes-md p { margin: 0.4rem 0; }
.release-notes-md ul, .release-notes-md ol {
    padding-left: 1.4rem;
    margin: 0.4rem 0;
}
.release-notes-md li { margin: 0.15rem 0; }
.release-notes-md code {
    background: var(--code-bg);
    padding: 0.15rem 0.4rem;
    border-radius: 4px;
    font-size: 0.82rem;
}
.release-notes-md pre {
    background: var(--code-bg);
    padding: 0.8rem;
    border-radius: var(--radius-small);
    overflow-x: auto;
    font-size: 0.8rem;
    white-space: pre-wrap;
}
.release-notes-md pre code {
    background: transparent;
    padding: 0;
}
.release-notes-md a {
    color: var(--accent-brand);
    text-decoration: none;
}
.release-notes-md a:hover {
    text-decoration: underline;
}
.release-notes-md table {
    width: 100%;
    border-collapse: collapse;
    margin: 0.5rem 0;
    font-size: 0.82rem;
    display: block;
    overflow-x: auto;
}
.release-notes-md th, .release-notes-md td {
    border: 1px solid var(--border-bento);
    padding: 0.4rem 0.6rem;
    text-align: left;
}
.release-notes-md th {
    background: var(--card-nested-bg);
    font-weight: 600;
}

/* --- 代理健康状态（健康页用）--- */
.proxy-health-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 0.8rem;
}
.proxy-health-item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.6rem 0.8rem;
    background: var(--card-nested-bg);
    border: 1px solid var(--card-nested-border);
    border-radius: var(--radius-small);
    font-size: 0.82rem;
}
.proxy-main {
    min-width: 0;
    flex: 1 1 auto;
    display: grid;
    gap: 6px;
}
.proxy-state-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    min-width: 0;
}
.proxy-health-grid-compact {
    grid-template-columns: 1fr;
}
.proxy-health-item-compact {
    align-items: flex-start;
}
.proxy-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}
.proxy-dot.ok { background: var(--success); }
.proxy-dot.fail { background: var(--danger); }
.proxy-dot.unknown { background: var(--text-dim); }
.proxy-url { flex: 1; word-break: break-all; color: var(--text-main); }
.proxy-latency { font-weight: 600; white-space: nowrap; }

/* --- 速率限制仪表盘（健康页用）--- */
.rate-limit-bar {
    height: 24px;
    background: var(--card-inset-bg);
    border-radius: 12px;
    overflow: hidden;
    margin-top: 0.5rem;
    border: 1px solid var(--card-inset-border);
    position: relative;
}
.rate-limit-fill {
    height: 100%;
    border-radius: 12px;
    transition: width 0.4s;
}
.rate-limit-fill.ok { background: var(--success); }
.rate-limit-fill.warning { background: var(--warning); }
.rate-limit-fill.danger { background: var(--danger); }
.rate-limit-text {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--text-main);
}

/* --- 搜索结果空状态 --- */
.search-empty {
    text-align: center;
    padding: 2rem;
    color: var(--text-dim);
    display: none;
}
.search-empty i { font-size: 2rem; display: block; margin-bottom: 0.5rem; }

/* --- 最近下载移动端卡片 --- */
.recent-dl-card {
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--border-bento);
}
.recent-dl-card:last-child { border-bottom: none; }
.recent-dl-name {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-main);
    word-break: break-all;
    overflow-wrap: anywhere;
    margin-bottom: 6px;
}
.recent-dl-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 12px;
    align-items: center;
    font-size: 0.75rem;
    color: var(--text-dim);
}

/* === 全局溢出保护 === */
html, body {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    overflow-x: hidden;
}
.version-card, .file-list, .file-item, .file-info-row,
.file-name-section, .release-notes-md, .info-card, .glass-card {
    max-width: 100%;
    box-sizing: border-box;
    overflow-wrap: anywhere;
    word-break: break-word;
}
/* 进度条全局默认隐藏 */
.download-progress-bar { display: none; }
.download-progress-bar.active { display: block; }
/* "已复制"提示全局默认隐藏 */
.sha256-copy-tip { visibility: hidden; opacity: 0; }
.sha256-copy-tip.show { visibility: visible; opacity: 1; }

/* ========== 移动端适配 (≤768px) ========== */
@media (max-width: 768px) {
    /* --- 搜索/筛选栏 --- */
    .search-filter-card { padding: 0.8rem !important; }
    .search-filter-card .d-flex,
    .search-filter-card > .d-flex,
    .search-filter-card > div {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
    }
    .search-input-wrap {
        width: 100% !important;
    }
    .search-input-wrap input {
        width: 100% !important;
    }
    .platform-filters {
        width: 100% !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
        margin-top: 0 !important;
    }
    .platform-btn {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        text-align: center !important;
        padding: 0.4rem 0.7rem !important;
        font-size: 0.8rem !important;
    }

    /* --- 文件项：信息区和按钮区竖向排列 --- */
    .file-info-row {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
    }
    .file-name-section {
        width: 100% !important;
        min-width: 0 !important;
    }
    .file-name {
        font-size: 0.85rem !important;
        line-height: 1.4 !important;
        word-break: break-all !important;
        overflow-wrap: anywhere !important;
    }
    .file-meta-info {
        flex-wrap: wrap !important;
        gap: 6px 10px !important;
        font-size: 0.72rem !important;
    }

    /* --- SHA256 压缩 --- */
    .sha256-row {
        flex-wrap: wrap !important;
        gap: 4px !important;
    }
    .sha256-row .sha256-label { font-size: 0.7rem !important; }
    .sha256-row .sha256-value {
        font-size: 0.62rem !important;
        max-width: 100% !important;
        word-break: break-all !important;
    }

    /* --- 下载按钮组：QR 独立一行 + 两按钮平分 --- */
    .file-actions {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
        width: 100% !important;
    }
    .file-actions .btn-qr {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        height: auto !important;
        padding: 0.5rem !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        font-size: 0.8rem !important;
        border-radius: 10px !important;
        background: var(--card-nested-bg) !important;
        border: 1px solid var(--card-nested-border) !important;
        color: var(--text-main) !important;
    }
    .file-actions .btn-qr::after {
        content: "扫码下载" !important;
        font-size: 0.8rem !important;
    }
    .file-actions .btn-download {
        padding: 0.55rem 0.4rem !important;
        font-size: 0.78rem !important;
        text-align: center !important;
        justify-content: center !important;
        white-space: nowrap !important;
        min-width: 0 !important;
    }
    .file-actions .btn-group {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
    }
    .file-actions .btn-group .main-download-btn {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        padding-left: 0.8rem !important;
        padding-right: 0.8rem !important;
    }
    .file-actions .btn-group .dropdown-toggle-split {
        flex: 0 0 54px !important;
        width: 54px !important;
        max-width: 54px !important;
    }

    /* --- 隐藏未激活的进度条和已复制提示 --- */
    .download-progress-bar:not(.active) { display: none !important; }
    .sha256-copy-tip:not(.show) { display: none !important; }

    /* --- Markdown 更新说明：限制高度 --- */
    .release-notes-md {
        max-height: 220px !important;
        font-size: 0.82rem !important;
        overflow: auto !important;
    }

    .version-title {
        font-size: 1.08rem !important;
    }

    .version-title-line {
        gap: 0.55rem !important;
    }

    .version-badges .badge {
        max-width: 100%;
    }

    /* --- QR 弹窗 --- */
    .qr-modal { max-width: 92vw !important; padding: 1.5rem 1rem !important; }
    .qr-modal img, .qr-modal svg { width: 180px !important; height: 180px !important; }
    .qr-modal h4 { font-size: 1rem !important; }

    /* --- 代理健康网格 --- */
    .proxy-health-grid { grid-template-columns: 1fr !important; }

    /* --- 全局容器边距缩小 --- */
    .main-content { padding: 0 8px !important; }
}

/* ========== 超窄屏适配 (≤380px, iPhone SE 等) ========== */
@media (max-width: 380px) {
    .platform-btn { font-size: 0.72rem !important; padding: 0.35rem 0.5rem !important; }
    .file-actions .btn-download { font-size: 0.72rem !important; padding: 0.5rem 0.3rem !important; }
    .file-name { font-size: 0.8rem !important; }
}

/* ========================================
   优化新增样式 (卡片强刷、折叠日志、分体按钮)
   ======================================== */

.refresh-card-icon {
    font-size: 0.95rem;
    color: var(--text-dim);
    cursor: pointer;
    transition: transform 0.4s ease, color 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    border-radius: 50%;
    background: var(--card-nested-bg);
    border: 1px solid var(--card-nested-border);
}
.refresh-card-icon:hover {
    transform: rotate(180deg);
    color: var(--accent-brand);
    background: var(--accent-light);
}

.release-notes-wrapper {
    position: relative;
    max-height: 10000px;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.release-notes-wrapper.collapsed {
    max-height: 140px;
}
.release-notes-wrapper.collapsed::after {
    content: "";
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 45px;
    background: linear-gradient(to top, var(--bg-bento) 0%, transparent 100%);
    pointer-events: none;
}
[data-theme="dark"] .release-notes-wrapper.collapsed::after {
    background: linear-gradient(to top, rgba(16, 23, 42, 0.95) 0%, transparent 100%);
}

.expand-notes-btn {
    background: var(--pill-bg);
    border: 1px solid var(--border-bento);
    color: var(--accent-brand);
    font-size: 0.78rem;
    font-weight: 600;
    padding: 4px 12px;
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin: 8px auto 0;
}
.expand-notes-btn:hover {
    background: var(--accent-light);
    transform: translateY(-1px);
}

/* 分体按钮与下拉选单 */
.btn-group {
    display: inline-flex;
    position: relative;
    vertical-align: middle;
    z-index: 2;
    min-width: 0;
}
.btn-group .main-download-btn { min-width: 0; }
.btn-group .dropdown-toggle-split { flex: 0 0 auto; }
.btn-group.dropdown-open {
    z-index: 10040;
}
.glass-dropdown {
    background: var(--bg-bento) !important;
    backdrop-filter: blur(25px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(25px) saturate(180%) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--radius-medium) !important;
    box-shadow: var(--surface-shadow) !important;
    padding: 6px 0 !important;
    z-index: 10050 !important;
    min-width: 290px !important;
    max-width: min(92vw, 420px) !important;
    max-height: min(60vh, 420px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
}
.glass-dropdown .dropdown-item {
    color: var(--text-main) !important;
    font-size: 0.82rem !important;
    padding: 6px 16px !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    transition: background 0.25s, color 0.25s;
    background: transparent !important;
}
.glass-dropdown .dropdown-item:hover {
    background: var(--accent-light) !important;
    color: var(--accent-brand) !important;
}
.glass-dropdown .dropdown-divider {
    border-top: 1px solid var(--border-bento) !important;
    margin: 4px 0 !important;
}
.proxy-badge {
    font-size: 0.7rem;
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 600;
}

/* --- 设置面板：仓库 / 代理池 编辑 --- */
.settings-modal { width: 92vw; }
.settings-modal {
    background: color-mix(in srgb, var(--bg-bento) 88%, var(--bg-body) 12%) !important;
    border: 1px solid color-mix(in srgb, var(--glass-border) 65%, var(--accent-brand) 35%) !important;
}
.settings-modal .form-select.settings-input,
.settings-modal select.settings-input,
.settings-modal .form-select {
    color-scheme: dark;
    background-color: color-mix(in srgb, var(--card-inset-bg) 72%, var(--bg-body) 28%) !important;
    color: var(--text-main) !important;
}
.settings-modal select option {
    background: #111827;
    color: #f8fafc;
}
.settings-section {
    margin-bottom: 1.1rem;
    padding-bottom: 1.1rem;
    border-bottom: 1px solid var(--border-bento);
}
.settings-section:last-of-type { border-bottom: none; }
.settings-section-title {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--text-main);
    margin-bottom: 0.6rem;
}
.settings-sublabel {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-dim);
    margin-bottom: 4px;
}
.settings-hint {
    font-size: 0.74rem;
    color: var(--text-dim);
    margin-top: 4px;
    line-height: 1.5;
}
.settings-help-box {
    display: grid;
    gap: 8px;
    padding: 12px 14px;
    margin-bottom: 14px;
    border: 1px solid var(--card-inset-border);
    border-radius: var(--radius-small);
    background: var(--card-inset-bg);
    color: var(--text-dim);
    font-size: 0.78rem;
    line-height: 1.5;
}
.settings-help-box strong { color: var(--text-main); }
.settings-help-box code {
    padding: 1px 5px;
    border-radius: 5px;
    background: var(--card-nested-bg);
    color: var(--accent-brand);
}
.settings-input {
    background: color-mix(in srgb, var(--card-inset-bg) 82%, #ffffff 18%) !important;
    border: 1px solid color-mix(in srgb, var(--card-inset-border) 72%, var(--text-dim) 28%) !important;
    color: var(--text-main) !important;
    font-size: 0.84rem !important;
    border-radius: var(--radius-small);
    margin-bottom: 8px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
}
.settings-input::placeholder { color: color-mix(in srgb, var(--text-dim) 78%, var(--text-main) 22%) !important; opacity: 1; }
.settings-input:disabled {
    opacity: 0.82;
    color: var(--text-dim) !important;
    background: color-mix(in srgb, var(--card-inset-bg) 90%, #000 10%) !important;
}
.settings-input:focus {
    border-color: var(--accent-brand) !important;
    box-shadow: 0 0 0 2px var(--accent-light) !important;
}
.settings-edit-list { display: flex; flex-direction: column; gap: 8px; }
.settings-edit-row { display: flex; gap: 8px; align-items: center; }
.settings-add-row { display: flex; gap: 8px; align-items: center; margin-top: 8px; }
.btn-settings-add {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 7px 14px;
    font-size: 0.8rem;
    font-weight: 600;
    border-radius: var(--radius-small);
    border: 1px solid var(--accent-brand);
    background: var(--accent-light);
    color: var(--accent-brand);
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
}
.btn-settings-add:hover { background: var(--accent-brand); color: #fff; }
.btn-settings-del {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: var(--radius-small);
    border: 1px solid var(--border-bento);
    background: var(--pill-bg);
    color: #ef4444;
    cursor: pointer;
    transition: all 0.2s;
}
.btn-settings-del:hover { background: #ef4444; color: #fff; border-color: #ef4444; }
.settings-empty {
    font-size: 0.8rem;
    color: var(--text-dim);
    padding: 10px 12px;
    text-align: center;
    background: var(--card-inset-bg);
    border-radius: var(--radius-small);
}
.settings-repo-card {
    border: 1px solid var(--border-bento);
    border-radius: var(--radius-medium);
    padding: 10px 12px;
    background: var(--card-inset-bg);
}
.settings-repo-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}
.settings-repo-idx {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--accent-brand);
}
.settings-repo-grid { display: flex; flex-direction: column; gap: 0; }
.settings-repo-grid .settings-input { margin-bottom: 8px; }
.settings-field-label {
    display: block;
    margin: 6px 0 4px;
    color: var(--text-subtle);
    font-size: 0.76rem;
    font-weight: 700;
}
.settings-field-help {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin: 8px 0 10px;
    padding: 10px 12px;
    border-radius: var(--radius-small);
    background: color-mix(in srgb, var(--accent-light) 34%, var(--card-inset-bg) 66%);
    border: 1px dashed color-mix(in srgb, var(--accent-brand) 45%, transparent);
    color: var(--text-dim);
    font-size: 0.74rem;
    line-height: 1.35;
}
.settings-field-help span::before {
    content: "• ";
    color: var(--accent-brand);
    font-weight: 700;
}
.settings-marquee-card .settings-input { margin-bottom: 8px !important; }
.settings-prerelease {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    color: var(--text-main);
    cursor: pointer;
    user-select: none;
}
.settings-prerelease input { width: 16px; height: 16px; cursor: pointer; }
.settings-toggle-row { margin-bottom: 8px; }

/* --- 首页公告跑马灯 --- */
.marquee-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border: 1px solid color-mix(in srgb, var(--accent-brand) 32%, var(--border-bento) 68%);
    border-radius: var(--radius-medium);
    background: linear-gradient(135deg, color-mix(in srgb, var(--accent-light) 58%, transparent), var(--card-inset-bg));
    color: var(--text-main);
    overflow: hidden;
}
.marquee-card > i {
    color: var(--accent-brand);
    flex: 0 0 auto;
}
.marquee-track-wrap {
    overflow: hidden;
    flex: 1;
}
.marquee-track {
    display: inline-flex;
    gap: 28px;
    white-space: nowrap;
    animation: marqueeScroll 24s linear infinite;
}
.marquee-track a {
    color: inherit;
    text-decoration: none;
}
.marquee-track a:hover { color: var(--accent-brand); }
.marquee-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.84rem;
    font-weight: 650;
}
.marquee-item i { color: var(--accent-brand); }
@keyframes marqueeScroll {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

/* --- 订阅中心 --- */
.subscribe-release-card {
    min-height: 260px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.subscribe-release-card h5 {
    color: var(--text-main);
    line-height: 1.35;
}
.subscribe-release-card .badge {
    max-width: 100%;
    overflow-wrap: anywhere;
}
.subscribe-assets {
    min-width: 0;
    max-width: 100%;
}
.subscribe-asset-badge {
    flex: 1 1 100%;
    align-items: flex-start;
    justify-content: flex-start;
}

/* --- 设置面板：关闭按钮 / 退出登录 / 布局精修 --- */
.settings-modal { position: relative; padding-top: 1.6rem; }
.btn-close-settings {
    position: absolute;
    top: 14px; right: 14px;
    width: 32px; height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid var(--border-bento);
    background: var(--pill-bg);
    color: var(--text-dim);
    cursor: pointer;
    transition: all 0.2s;
    z-index: 2;
}
.btn-close-settings:hover {
    background: #ef4444;
    border-color: #ef4444;
    color: #fff;
    transform: rotate(90deg);
}
.settings-logout-link {
    background: none;
    border: none;
    color: var(--accent-brand);
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    padding: 0 0 0 6px;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.settings-logout-link:hover { color: #ef4444; }

/* 分区卡片化：每个 section 包一层浅色卡片，层次更清晰 */
.settings-section {
    background: var(--card-inset-bg);
    border: 1px solid var(--card-inset-border);
    border-radius: var(--radius-medium);
    padding: 14px 16px !important;
    margin-bottom: 14px !important;
}
.settings-section:last-of-type { border-bottom: 1px solid var(--card-inset-border); }
.settings-section-title { margin-bottom: 10px; font-size: 0.92rem; }
.settings-section-title i { color: var(--accent-brand); }

/* 代理行：输入框与删除键基线对齐，输入框去掉底部多余间距 */
.settings-edit-row .settings-input,
.settings-add-row .settings-input { margin-bottom: 0 !important; }
.settings-edit-row .settings-input { flex: 1; }
.settings-add-row .settings-input { flex: 1; }

/* 仓库卡片：内部输入两列网格，更紧凑美观 */
.settings-repo-card { padding: 12px 14px; margin-bottom: 2px; }
.settings-repo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.settings-repo-grid .settings-input { margin-bottom: 0 !important; }
/* 名称、描述占整行；owner/repo 各半行 */
.settings-repo-grid > input:nth-child(1),
.settings-repo-grid > input:nth-child(4) { grid-column: 1 / -1; }
.settings-repo-grid > select { grid-column: 1 / -1; }
.settings-prerelease { grid-column: 1 / -1; padding-top: 2px; }

/* 首选代理下拉与代理节点之间留白 */
#proxySelect.settings-input { margin-bottom: 12px !important; }

@media (max-width: 560px) {
    .settings-repo-grid { grid-template-columns: 1fr; }
    .settings-field-help { grid-template-columns: 1fr; }
}