* { margin: 0; padding: 0; box-sizing: border-box; }
        :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
        /* ===== 主题系统：默认「晨曦」，<html data-theme="..."> 切换 ===== */
        :root {
            --r-lg: 16px; --r: 12px; --r-sm: 8px;
            /* 晨曦（浅色 · 蓝）— 默认 */
            color-scheme: light;
            --ink: #0f172a; --ink-2: #475569; --ink-3: #5f6f85;
            --line: #e6ebf2; --line-strong: #cfd9e6; --bg: #f7f9fc;
            --surface: #ffffff; --surface-2: #ffffff;
            --input-bg: #ffffff; --hover: #f1f5f9; --hover-2: #e2e8f0;
            --tray: #eef3fa; --btn-ghost: #ffffff;
            --nav-bg: rgba(255,255,255,.88); --nav-stuck: rgba(255,255,255,.82);
            --toast-bg: #0f172a;
            --brand: #1d4ed8; --brand-dark: #1e40af; --brand-soft: #eef3fd;
            --danger: #b91c1c; --danger-soft: #fdecec; --on-danger: #ffffff;
            --ok: #15803d; --ok-soft: #e8f7ee;
            --sh: 0 1px 2px rgba(15,23,42,.04);
            --sh-md: 0 8px 28px rgba(15,23,42,.07);
            --slider-shadow: 0 22px 48px -14px rgba(15,23,42,.34), 0 0 0 1px rgba(15,23,42,.07);
            --brand-glow: none;
            --mesh: none;
        }
        /* 深空（深色 · 蓝紫） */
        :root[data-theme="dark"] {
            color-scheme: dark;
            --ink: #eaf0fa; --ink-2: #aebbd0; --ink-3: #8b9ab3;
            --line: rgba(140,175,225,.18); --line-strong: rgba(140,175,225,.34); --bg: #101a2c;
            --surface: #1e2a42; --surface-2: #1a2438;
            --input-bg: rgba(14,22,38,.85); --hover: rgba(255,255,255,.07); --hover-2: rgba(255,255,255,.12);
            --tray: #0c1424; --btn-ghost: rgba(255,255,255,.05);
            --nav-bg: rgba(24,34,56,.72); --nav-stuck: rgba(20,28,48,.90);
            --toast-bg: #24314c;
            --brand: #4d8dff; --brand-dark: #3b7bf0; --brand-soft: rgba(77,141,255,.14);
            --danger: #f87171; --danger-soft: rgba(248,113,113,.14); --on-danger: #2a1215;
            --ok: #4ade80; --ok-soft: rgba(74,222,128,.12);
            --sh: 0 1px 2px rgba(0,0,0,.40);
            --sh-md: 0 20px 48px -22px rgba(0,0,0,.85);
            --slider-shadow: 0 0 0 1px rgba(120,165,255,.20), 0 30px 70px -26px rgba(0,0,0,.95), 0 0 70px -18px rgba(77,141,255,.45);
            --brand-glow: 0 0 26px rgba(77,141,255,.45);
            --mesh: radial-gradient(900px 520px at 12% -8%, rgba(70,140,255,.26), transparent 68%), radial-gradient(760px 460px at 88% -6%, rgba(140,95,255,.18), transparent 70%), radial-gradient(1100px 620px at 50% 108%, rgba(45,115,230,.16), transparent 72%);
        }
        /* 暗夜（深色 · 中性灰） */
        :root[data-theme="midnight"] {
            color-scheme: dark;
            --ink: #e6e9ef; --ink-2: #9aa3b2; --ink-3: #8a93a2;
            --line: rgba(160,175,200,.14); --line-strong: rgba(160,175,200,.30); --bg: #0a0d13;
            --surface: #151a23; --surface-2: #1a202b;
            --input-bg: rgba(10,13,19,.90); --hover: rgba(255,255,255,.06); --hover-2: rgba(255,255,255,.11);
            --tray: #06090e; --btn-ghost: rgba(255,255,255,.045);
            --nav-bg: rgba(20,26,35,.75); --nav-stuck: rgba(15,20,28,.92);
            --toast-bg: #1d2430;
            --brand: #6ea8fe; --brand-dark: #4d8dff; --brand-soft: rgba(110,168,254,.13);
            --danger: #f87171; --danger-soft: rgba(248,113,113,.14); --on-danger: #2a1215;
            --ok: #4ade80; --ok-soft: rgba(74,222,128,.12);
            --sh: 0 1px 2px rgba(0,0,0,.50);
            --sh-md: 0 20px 48px -22px rgba(0,0,0,.90);
            --slider-shadow: 0 0 0 1px rgba(160,175,200,.14), 0 30px 70px -26px rgba(0,0,0,1);
            --brand-glow: 0 0 26px rgba(110,168,254,.40);
            --mesh: radial-gradient(800px 460px at 50% -10%, rgba(110,168,254,.14), transparent 68%), radial-gradient(900px 500px at 50% 106%, rgba(60,90,140,.12), transparent 72%);
        }
        /* 雾青（浅色 · 青绿） */
        :root[data-theme="mint"] {
            color-scheme: light;
            --ink: #0d2430; --ink-2: #40606e; --ink-3: #52707c;
            --line: #dceaf0; --line-strong: #c5dde7; --bg: #f3f9fb;
            --surface: #ffffff; --surface-2: #ffffff;
            --input-bg: #ffffff; --hover: #e9f4f7; --hover-2: #dbeef4;
            --tray: #e4f2f7; --btn-ghost: #ffffff;
            --nav-bg: rgba(255,255,255,.88); --nav-stuck: rgba(255,255,255,.82);
            --toast-bg: #0d2430;
            --brand: #0f766e; --brand-dark: #0b5f59; --brand-soft: #e2f4f1;
            --danger: #b91c1c; --danger-soft: #fdecec; --on-danger: #ffffff;
            --ok: #15803d; --ok-soft: #e8f7ee;
            --sh: 0 1px 2px rgba(13,36,48,.04);
            --sh-md: 0 8px 28px rgba(13,36,48,.07);
            --slider-shadow: 0 22px 48px -14px rgba(13,36,48,.30), 0 0 0 1px rgba(13,36,48,.07);
            --brand-glow: none;
            --mesh: radial-gradient(800px 460px at 50% -8%, rgba(15,118,110,.09), transparent 68%);
        }
        body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Microsoft YaHei', '微软雅黑', sans-serif; background-color: var(--bg); background-image: var(--mesh, none); background-attachment: fixed; min-height: 100vh; color: var(--ink); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
        .container { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
        .header { text-align: center; padding: 36px 0 22px; }
        .logo { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 13px; background: var(--brand); color: #fff; margin-bottom: 14px; text-decoration: none; box-shadow: 0 6px 16px rgba(29,78,216,.22), var(--brand-glow); box-shadow: 0 6px 16px color-mix(in srgb, var(--brand) 30%, transparent), var(--brand-glow); }
        .logo svg { width: 24px; height: 24px; }
        h1 { font-size: 1.9rem; font-weight: 700; letter-spacing: -.02em; color: var(--ink); margin-bottom: 8px; }
        .subtitle { font-size: .98rem; color: var(--ink-2); }
        .navbar { background: var(--nav-bg); backdrop-filter: blur(12px); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 8px 14px; margin-bottom: 22px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; box-shadow: var(--sh);
            position: sticky; top: 10px; z-index: 900;
            transition: background .22s, box-shadow .22s, border-color .22s; }
        .navbar.is-stuck { background: var(--nav-stuck); box-shadow: 0 10px 34px rgba(15,23,42,.13); border-color: var(--line); }
        .nav-brand { display: none; flex: 1 1 auto; font-weight: 600; font-size: .95rem; color: var(--ink); letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .nav-toggle { display: none; flex: 0 0 auto; align-items: center; justify-content: center; width: 38px; height: 38px; padding: 0; background: transparent; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); cursor: pointer; }
        .nav-toggle:hover { background: var(--hover); }
        .nav-toggle svg { width: 20px; height: 20px; }
        .theme-toggle { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; margin-left: auto; padding: 0; background: transparent; border: 1px solid transparent; border-radius: var(--r-sm); color: var(--ink-2); cursor: pointer; transition: background .15s, color .15s; }
        .theme-toggle:hover { background: var(--hover); color: var(--ink); }
        .theme-toggle svg { width: 17px; height: 17px; }
        /* 窄屏导航会折成两行，吸顶会遮太多，关掉 */
        @media (max-width: 768px) { .navbar { position: static; } }
        .nav-links { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; flex: 1 1 auto; }
        .nav-links a { text-decoration: none; color: var(--ink-2); font-weight: 500; font-size: .92rem; padding: 8px 13px; border-radius: var(--r-sm); transition: background .15s, color .15s; cursor: pointer; }
        .nav-links a:hover { color: var(--ink); background: var(--hover); }
        .nav-links a.active { color: var(--brand); background: var(--brand-soft); }
        .nav-links .user-link { color: var(--brand); }
        .nav-links .user-link:hover { background: var(--brand-soft); }
                .nav-avatar { width: 28px; height: 28px; border-radius: 50%; vertical-align: middle; margin-right: 6px; object-fit: cover; }
                .nav-avatar-fallback { display: inline-flex; align-items: center; justify-content: center; background: var(--brand); color: #fff; font-size: 12px; font-weight: 600; }
                .nav-user-name { max-width: 9em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
                .nav-user-area { display: inline-flex; align-items: center; gap: 8px; background: transparent; border: 0; font-family: inherit; text-decoration: none; color: var(--brand); font-weight: 500; font-size: .92rem; padding: 8px 13px; border-radius: var(--r-sm); cursor: pointer; transition: background .15s; }
                .nav-user-area:hover { background: var(--brand-soft); }
        #navUserArea { display: inline-flex; align-items: center; gap: 8px; }
        /* ===== 用户菜单：桌面悬停 / 点击、键盘都能开（触屏只认点击） ===== */
        .nav-user-trigger { position: relative; display: inline-block; }
        .nav-user-trigger .arrow { font-size: 10px; margin-left: 2px; opacity: 0.7; }
        .nav-user-dropdown {
            position: absolute;
            top: calc(100% + 6px);
            right: 0;
            background: var(--surface-2);
            border: 1px solid var(--line);
            border-radius: 10px;
            min-width: 200px;
            padding: 6px 0;
            box-shadow: 0 10px 32px rgba(15,23,42,.10);
            opacity: 0;
            visibility: hidden;
            transform: translateY(-6px);
            transition: all 0.2s;
            z-index: 200;
        }
        @media (hover: hover) {
            .nav-user-trigger:hover .nav-user-dropdown { opacity: 1; visibility: visible; transform: translateY(0); }
        }
        .nav-user-trigger.open .nav-user-dropdown { opacity: 1; visibility: visible; transform: translateY(0); }
        .nav-user-dropdown .dropdown-item {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 10px 16px;
            color: var(--ink);
            text-decoration: none;
            font-size: 14px;
            transition: background 0.15s;
            cursor: pointer;
        }
        .nav-user-dropdown .dropdown-item:hover, .nav-user-dropdown .dropdown-item:focus-visible { background: var(--hover); }
        .nav-user-dropdown .dropdown-item.danger { color: var(--danger); }
        .nav-user-dropdown .dropdown-item.danger:hover { background: var(--danger-soft); }
        .nav-user-dropdown .dropdown-divider { height: 1px; background: var(--line); margin: 4px 0; }
        /* 退出登录按钮（用户名旁边直接显示） */
        .nav-logout-btn {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            padding: 6px 12px;
            background: transparent;
            color: var(--danger);
            text-decoration: none;
            font-size: 13px;
            border-radius: 6px;
            border: 1px solid var(--danger);
            transition: all 0.2s;
            cursor: pointer;
        }
        .nav-logout-btn:hover { background: var(--danger-soft); color: var(--danger); }
        .hero-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 32px 36px; text-align: center; margin-bottom: 0; box-shadow: var(--sh); display: flex; flex-direction: column; justify-content: center; }
        .version-badge { display: inline-block; align-self: center; width: fit-content; margin-left: auto; margin-right: auto; background: var(--brand-soft); color: var(--brand); padding: 5px 14px; border-radius: 999px; font-size: .78rem; font-weight: 600; letter-spacing: .02em; margin-bottom: 14px; }
        .version-number { font-size: 2.4rem; font-weight: 700; color: var(--ink); letter-spacing: -.02em; margin-bottom: 6px; font-variant-numeric: tabular-nums; min-height: 1.2em; line-height: 1.2; }
        .version-number.is-loading { display: flex; align-items: center; justify-content: center; }
        .skeleton { display: inline-block; width: 148px; height: 1.05em; border-radius: 8px; background: linear-gradient(90deg, var(--hover-2) 25%, var(--hover) 50%, var(--hover-2) 75%); background-size: 200% 100%; animation: skl 1.4s ease-in-out infinite; }
        @keyframes skl { from { background-position: 200% 0; } to { background-position: -200% 0; } }
        .release-date { color: var(--ink-3); font-size: .84rem; margin-bottom: 20px; line-height: 1.7; }
        .download-buttons { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; margin-bottom: 0; }
        .btn-primary { background: var(--brand); color: #fff; padding: 13px 26px; font-size: .95rem; font-weight: 600; border-radius: var(--r); text-decoration: none; display: inline-flex; align-items: center; gap: 8px; transition: background .15s, box-shadow .15s; box-shadow: 0 1px 2px rgba(29,78,216,.22); box-shadow: 0 1px 2px color-mix(in srgb, var(--brand) 35%, transparent); border: none; cursor: pointer; }
        .btn-primary:hover { background: var(--brand-dark); }
        .btn-outline { background: var(--btn-ghost); color: var(--ink); padding: 13px 26px; font-size: .95rem; font-weight: 600; border-radius: var(--r); text-decoration: none; display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line); cursor: pointer; transition: background .15s, border-color .15s; }
        .btn-outline:hover { background: var(--hover); border-color: var(--line-strong); }
        .stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; margin-bottom: 0; }
        .stat-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 22px 18px; text-align: center; transition: border-color .18s, box-shadow .18s; box-shadow: var(--sh); }
        .stat-card:hover { border-color: var(--line-strong); box-shadow: var(--sh-md); }
        .stat-number { font-size: 1.7rem; font-weight: 700; color: var(--ink); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
        .stat-label { color: var(--ink-3); font-size: .82rem; margin-top: 6px; }
        /* ===== 版本与授权：一行三列细横条（替代原来的大卡片） ===== */
        .license-bar { display: grid; grid-template-columns: repeat(3, 1fr); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--sh); margin-bottom: 0; overflow: hidden; }
        .license-item { display: flex; align-items: flex-start; gap: 12px; padding: 20px 24px; }
        .license-item + .license-item { border-left: 1px solid var(--line); }
        .license-ico { width: 34px; height: 34px; flex: 0 0 34px; display: flex; align-items: center; justify-content: center; border-radius: 9px; background: var(--brand-soft); color: var(--brand); }
        .license-ico svg { width: 18px; height: 18px; }
        .license-title { font-size: .93rem; font-weight: 600; color: var(--ink); margin-bottom: 4px; letter-spacing: -.005em; }
        .license-desc { font-size: .81rem; color: var(--ink-2); line-height: 1.55; }
        @media (max-width: 860px) {
            .license-bar { grid-template-columns: 1fr; }
            .license-item + .license-item { border-left: none; border-top: 1px solid var(--line); }
        }
        .card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 34px; margin-bottom: 22px; box-shadow: var(--sh); }
        .promo-inner { display: flex; gap: 14px; align-items: flex-start; }
        .promo-card { background: linear-gradient(135deg, var(--brand-soft) 0%, var(--surface) 46%); }
        .promo-title { font-size: 1.02rem; font-weight: 700; margin-bottom: 6px; color: var(--ink); letter-spacing: -.01em; }
        .promo-desc { color: var(--ink-2); font-size: .9rem; line-height: 1.8; }
        .promo-link { margin-top: 10px; }
        .promo-link a { color: var(--brand); font-weight: 600; font-size: .9rem; text-decoration: none; }
        .promo-link a:hover { text-decoration: underline; }
        .hero-meta { margin-top: 14px; font-size: .85rem; color: var(--ink-3); }
        .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
        .section-title { font-size: 1.22rem; font-weight: 600; margin-bottom: 24px; color: var(--ink); display: flex; align-items: center; gap: 10px; letter-spacing: -.01em; }
        .section-title span { background: var(--brand); width: 3px; height: 17px; border-radius: 2px; }
        .features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(288px, 1fr)); gap: 12px; }
        .feature-item { display: flex; gap: 14px; padding: 18px; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r); transition: border-color .18s, background .18s, box-shadow .18s; cursor: pointer; }
        .feature-item:hover, .feature-item:focus-visible { border-color: var(--line-strong); background: var(--hover); box-shadow: var(--sh); }
        .feature-item:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
        .feature-item:not([onclick]) { cursor: default; }
        .feature-icon { width: 38px; height: 38px; flex: 0 0 38px; display: flex; align-items: center; justify-content: center; border-radius: 10px; background: var(--brand-soft); color: var(--brand); }
        .feature-icon svg { width: 20px; height: 20px; }
        .feature-item h3 { font-size: .95rem; font-weight: 600; margin-bottom: 5px; color: var(--ink); }
        .feature-item p { color: var(--ink-2); font-size: .82rem; line-height: 1.6; }
        .feedback-form { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
        .form-group-full { grid-column: span 2; }
        .form-group label { display: block; margin-bottom: 8px; font-weight: 500; font-size: .85rem; color: var(--ink-2); }
        .form-group input, .form-group select, .form-group textarea { width: 100%; padding: 11px 14px; border: 1px solid var(--line); border-radius: var(--r-sm); font-size: .9rem; font-family: inherit; color: var(--ink); background: var(--input-bg); transition: border-color .15s, box-shadow .15s; }
        .form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
        .btn-submit { background: var(--brand); color: #fff; padding: 12px 26px; border: none; border-radius: var(--r); font-size: .92rem; font-weight: 600; cursor: pointer; transition: background .15s; }
        .btn-submit:hover { background: var(--brand-dark); }
        .changelog-item { padding: 22px 0; border-bottom: 1px solid var(--line); }
        .changelog-version { font-size: 1.05rem; font-weight: 600; color: var(--ink); }
        .changelog-date { color: var(--ink-3); font-size: .82rem; margin-left: 12px; }
        /* ★ 2026-11-06：日志正文原来没设 white-space，content 里的 \n 全被当空格 ⇒ 每条日志挤成一整段 */
        .changelog-body { margin-top: 10px; color: var(--ink-2); font-size: .9rem; line-height: 1.95; white-space: pre-line; }
        .version-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
        .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
        .table-wrap .version-table { min-width: 560px; }
        .table-empty { text-align: center; color: var(--ink-3); padding: 20px; }
        .dl-count { color: var(--ink-3); font-size: .8rem; }
        .version-table th, .version-table td { padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--line); }
        .version-table th { background: var(--hover); font-weight: 600; font-size: .8rem; color: var(--ink-2); letter-spacing: .02em; }
        .download-link { background: var(--brand-soft); color: var(--brand); padding: 6px 14px; border-radius: 7px; text-decoration: none; font-size: .8rem; font-weight: 600; transition: background .15s, color .15s; }
        .download-link:hover { background: var(--brand); color: #fff; }
        .toast { position: fixed; bottom: 28px; right: 28px; background: var(--toast-bg); color: #fff; padding: 12px 20px; border-radius: 10px; font-size: .88rem; z-index: 1000; animation: slideIn .3s ease; box-shadow: 0 12px 32px rgba(15,23,42,.24); }
        .toast.error { background: var(--danger); color: var(--on-danger); }
        @keyframes slideIn { from { transform: translateX(100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
        .footer { text-align: left; padding: 44px 0 30px; color: var(--ink-3); border-top: 1px solid var(--line); margin-top: 6px; font-size: .85rem; }
        .footer a { color: var(--ink-2); text-decoration: none; }
        .footer a:hover { color: var(--brand); }
        .footer-top { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.1fr; gap: 28px; padding-bottom: 28px; }
        .footer-brand { display: flex; align-items: flex-start; gap: 12px; }
        .footer-logo { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; flex: 0 0 40px; border-radius: 11px; background: var(--brand); color: #fff; }
        /* 提高优先级：否则会被 .footer a 的 --ink-2 覆盖，图标在青底上发灰 */
        .footer a.footer-logo, .footer a.footer-logo:hover { color: #fff; }
        .footer-logo svg { width: 20px; height: 20px; }
        .footer-name { font-size: .95rem; font-weight: 600; color: var(--ink); margin-bottom: 4px; }
        .footer-slogan { font-size: .82rem; color: var(--ink-3); line-height: 1.7; }
        .footer-title { font-size: .78rem; font-weight: 600; color: var(--ink-3); letter-spacing: .04em; margin-bottom: 6px; }
        .footer-col a { display: block; padding: 5px 0; font-size: .86rem; }
        .footer-tip { margin-top: 8px; font-size: .78rem; color: var(--ink-3); line-height: 1.7; }
        .footer-bottom { display: flex; justify-content: space-between; align-items: center; gap: 8px 20px; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: 16px; font-size: .8rem; color: var(--ink-3); }
        @media (max-width: 900px) {
            .footer-top { grid-template-columns: 1fr 1fr; }
            .footer-brand { grid-column: 1 / -1; }
        }
        @media (max-width: 560px) {
            .footer-top { grid-template-columns: 1fr; gap: 20px; }
            .footer-bottom { flex-direction: column; align-items: flex-start; }
        }
        /* 卡片里再套一条 .license-bar 时去掉投影，避免“卡中卡” */
        .card > .license-bar { box-shadow: none; }
        /* ===== 首屏界面预览（真实截图轮播） ===== */
        .ui-preview { background: var(--tray); border: 1px solid var(--line); border-radius: 18px; padding: 20px; margin-bottom: 0; display: flex; flex-direction: column; justify-content: center; }
        /* 首屏两栏：左 = 下载信息，右 = 界面轮播；各卡不再自带下边距，间距统一交给 grid gap */
        #home.section-page:not(.hidden) {
            display: grid;
            grid-template-columns: 480px 1fr;
            gap: 24px;
            align-items: stretch;
        }
        #home > .hero-card { grid-column: 1; }
        #home > .ui-preview { grid-column: 2; }
        #home > .stats-grid, #home > .card, #home > .license-bar { grid-column: 1 / -1; margin: 0; }
        /* 左栏两按钮各占一半宽，避免换行把 hero 撑高（480px 栏内可用仅 400px） */
        #home > .hero-card .download-buttons { flex-wrap: nowrap; gap: 10px; }
        #home > .hero-card .download-buttons a { flex: 1 1 0; justify-content: center; padding-left: 10px; padding-right: 10px; font-size: 1rem; }
        @media (max-width: 1180px) {
            #home.section-page:not(.hidden) { grid-template-columns: 1fr; }
            /* 必须重置列位置：否则 ui-preview 的 grid-column:2 会生成隐式列，页面又变两栏并横向溢出 */
            #home > .hero-card, #home > .ui-preview { grid-column: 1; }
        }
        /* ===== 轮播：真实截图淡入淡出（每张 5 秒，可暂停） ===== */
        .ui-slider { position: relative; height: auto; aspect-ratio: 1400 / 763; border-radius: 10px; overflow: hidden; box-shadow: var(--slider-shadow); background: #f3f3f3; }
        .ui-slide { position: absolute; inset: 0; opacity: 0; animation: uiFade 15s infinite; }
        .ui-slide:nth-child(1) { animation-delay: 0s; }
        .ui-slide:nth-child(2) { animation-delay: 5s; }
        .ui-slide:nth-child(3) { animation-delay: 10s; }
        @keyframes uiFade {
            0%   { opacity: 0; }
            2%   { opacity: 1; }
            31%  { opacity: 1; }
            33%  { opacity: 0; }
            100% { opacity: 0; }
        }
        /* 第三张截图是 1400×890，比容器高：contain 后两侧留白，用同色底让留白融进画面 */
        .ui-slide img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; background: #f3f3f3; }
        /* 还没拿到地址（data-src）时不要露出 alt 文字 */
        .ui-slide img:not([src]) { visibility: hidden; }
        .ui-pager { display: flex; align-items: center; justify-content: center; gap: 7px; padding-top: 12px; }
        .ui-dots { display: flex; align-items: center; gap: 7px; }
        .ui-pager .dot { width: 24px; height: 4px; border-radius: 2px; background: var(--line-strong); }
        .ui-pager .dot:nth-child(1) { animation: uiPg 15s infinite 0s; }
        .ui-pager .dot:nth-child(2) { animation: uiPg 15s infinite 5s; }
        .ui-pager .dot:nth-child(3) { animation: uiPg 15s infinite 10s; }
        @keyframes uiPg { 0%, 31% { background: var(--brand); } 33%, 100% { background: var(--line-strong); } }
        .ui-pause { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; margin-left: 6px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: var(--surface); color: var(--ink-2); cursor: pointer; }
        .ui-pause:hover { color: var(--ink); border-color: var(--line-strong); }
        .ui-pause svg { width: 12px; height: 12px; }
        .ui-pause .icon-play { display: none; }
        .ui-preview.is-paused .ui-pause .icon-play { display: block; }
        .ui-preview.is-paused .ui-pause .icon-pause { display: none; }
        /* 悬停 / 聚焦 / 手动暂停时停住轮播 */
        .ui-preview:hover .ui-slide, .ui-preview:hover .ui-pager .dot,
        .ui-preview:focus-within .ui-slide, .ui-preview:focus-within .ui-pager .dot,
        .ui-preview.is-paused .ui-slide, .ui-preview.is-paused .ui-pager .dot { animation-play-state: paused; }
        /* 系统开启「减少动态效果」时完全停住（只显示第一张） */
        @media (prefers-reduced-motion: reduce) {
            .ui-slide { animation: none; opacity: 0; }
            .ui-slide:nth-child(1) { opacity: 1; }
            .ui-pager .dot { animation: none; background: var(--line-strong); }
            .ui-pager .dot:nth-child(1) { background: var(--brand); }
        }
        .hidden { display: none; }
        .modal-overlay { display: none; position: fixed; inset: 0; background: rgba(8,15,30,.55); backdrop-filter: blur(2px); z-index: 9998; justify-content: center; align-items: center; padding: 16px; }
        .modal-overlay.active { display: flex; }
        .modal-box, .feature-modal-box { animation: modalIn .18s cubic-bezier(.22,.61,.36,1) both; }
        @keyframes modalIn { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: none; } }
        @media (prefers-reduced-motion: reduce) { .modal-box, .feature-modal-box { animation: none; } }
        html { scrollbar-gutter: stable; }
        html.modal-open, body.modal-open { overflow: hidden; }
        .modal-box { background: var(--surface-2); border: 1px solid var(--line); border-radius: 16px; padding: 0; width: 90%; max-width: 460px; max-height: 90vh; display: flex; flex-direction: column; box-shadow: 0 24px 64px rgba(15,23,42,.20); position: relative; }
        .modal-close { position: absolute; top: 16px; right: 16px; background: var(--hover); border: none; width: 32px; height: 32px; border-radius: 8px; cursor: pointer; font-size: 1.1rem; color: var(--ink-2); display: flex; align-items: center; justify-content: center; z-index: 10; transition: background .15s; }
        .modal-close:hover { background: var(--hover-2); color: var(--ink); }
        .modal-content { flex: 1; overflow-y: auto; padding: 34px 30px; }
        .modal-title { text-align: center; margin-bottom: 26px; }
        .modal-title .icon { display: none; }
        .modal-title h2 { margin: 0 0 8px; color: var(--ink); font-size: 1.32rem; font-weight: 700; letter-spacing: -.01em; }
        .modal-title p { color: var(--ink-2); font-size: .88rem; margin-bottom: 4px; }
        .form-group-modal { margin-bottom: 18px; }
        .form-group-modal label { display: block; margin-bottom: 7px; font-weight: 500; font-size: .85rem; color: var(--ink-2); }
        .form-group-modal input { width: 100%; padding: 11px 14px; border: 1px solid var(--line); border-radius: var(--r-sm); font-size: .92rem; color: var(--ink); background: var(--input-bg); transition: border-color .15s, box-shadow .15s; }
        .form-group-modal input:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
        .btn-modal { width: 100%; padding: 13px; margin-top: 4px; background: var(--brand); color: white; border: none; border-radius: var(--r); font-size: .95rem; cursor: pointer; font-weight: 600; transition: background .15s; }
        .btn-modal:hover { background: var(--brand-dark); }
        .modal-message { margin-top: 16px; padding: 12px; border-radius: var(--r-sm); text-align: center; display: none; font-size: .88rem; }
        .modal-message.ok { background: var(--ok-soft); color: var(--ok); border: 1px solid color-mix(in srgb, var(--ok) 28%, transparent); }
        .modal-message.error { background: var(--danger-soft); color: var(--danger); border: 1px solid color-mix(in srgb, var(--danger) 28%, transparent); }
        .modal-link { text-align: center; margin-top: 20px; font-size: .86rem; color: var(--ink-2); }
        .modal-link a { color: var(--brand); text-decoration: none; font-weight: 600; }
        .modal-link a:hover { text-decoration: underline; }
        .code-row { display: flex; gap: 10px; align-items: center; }
        .code-row input { flex: 1; }
        .code-row button { background: var(--hover); color: var(--ink); border: 1px solid var(--line); padding: 11px 18px; border-radius: var(--r-sm); cursor: pointer; font-size: .84rem; white-space: nowrap; font-weight: 500; transition: background .15s; }
        .code-row button:hover { background: var(--hover-2); }
        .code-row button:disabled { opacity: 0.55; cursor: default; }

        .password-wrapper { position: relative; display: flex; align-items: center; }
        .password-wrapper input { padding-right: 40px; }
        .password-toggle { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); background: none; border: none; cursor: pointer; font-size: 18px; padding: 4px; line-height: 1; color: var(--ink-3); z-index: 1;  display:flex; align-items:center; justify-content:center; }
        .password-toggle:hover { color: var(--brand); }

        @media (max-width: 768px) {
            .container { padding: 0 16px; }
            h1 { font-size: 1.65rem; }
            .hero-card { padding: 26px 18px; }
            .version-number { font-size: 1.95rem; }
            .card { padding: 24px 20px; }
            .navbar { border-radius: 14px; padding: 10px 12px; }
            .nav-brand, .nav-toggle { display: inline-flex; }
            .nav-links { display: none; flex-basis: 100%; flex-direction: column; align-items: stretch; gap: 2px; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line); }
            .navbar.nav-open .nav-links { display: flex; }
            .nav-links a { padding: 11px 12px; }
            .theme-toggle { margin-left: 0; align-self: flex-start; width: auto; height: 40px; padding: 0 12px; gap: 8px; justify-content: flex-start; }
            .theme-toggle::after { content: '切换外观'; font-size: .92rem; font-weight: 500; }
            .nav-user-trigger { position: relative; }
            .nav-user-dropdown { left: 0; right: auto; }
            #navUserArea { margin-left: 0; padding-top: 8px; border-top: 1px solid var(--line); }
            .feedback-form { grid-template-columns: 1fr; }
            .form-group-full { grid-column: span 1; }
            .modal-content, .feature-modal-box .modal-content { padding: 30px 22px; }
            .form-group input, .form-group select, .form-group textarea, .form-group-modal input { font-size: 16px; }
        }
        /* 很窄的机型：两个下载按钮改为上下铺满，避免文字换行挤在按钮里 */
        @media (max-width: 380px) {
            #home > .hero-card .download-buttons { flex-wrap: wrap; }
            #home > .hero-card .download-buttons a { flex: 1 1 100%; }
        }
        .feature-modal-box { background: var(--surface-2); border: 1px solid var(--line); border-radius: 16px; padding: 0; width: 90%; max-width: 620px; max-height: 90vh; display: flex; flex-direction: column; box-shadow: 0 24px 64px rgba(15,23,42,.20); position: relative; }
        .feature-modal-box .modal-content { padding: 36px 32px; }
        .feature-detail-icon { width: 46px; height: 46px; margin: 0 auto 14px; border-radius: 12px; background: var(--brand-soft); color: var(--brand); display: flex; align-items: center; justify-content: center; }
        .feature-detail-icon svg { width: 24px; height: 24px; }
        .feature-detail-list { list-style: none; padding: 0; margin: 22px 0 0; }
        .feature-detail-list li { padding: 13px 16px; margin-bottom: 8px; background: var(--hover); border: 1px solid var(--line); border-radius: 10px; font-size: .89rem; color: var(--ink-2); line-height: 1.65; display: flex; align-items: flex-start; gap: 11px; }
        .feature-detail-list li::before { content: ''; flex: 0 0 5px; width: 5px; height: 5px; margin-top: 8px; border-radius: 50%; background: var(--brand); }
    
/* 2026-10-29 修复“密码框出现两个眼睛”：隐藏 Edge/IE 自带的密码显示按钮，只保留页面自己的切换按钮 */
input[type="password"]::-ms-reveal,
input[type="password"]::-ms-clear { display: none; }

/* ===== 2026-10-31 滚动入场 / 页面切换动效（克制版） =====
   只有「淡入 + 12px 上移」，不做弹跳、不做视差；
   系统开了「减少动态效果」时整段失效（元素直接可见）。 */
@media (prefers-reduced-motion: no-preference) {
    .reveal { opacity: 0; transform: translateY(22px); }
    .reveal.in {
        opacity: 1;
        transform: none;
        transition: opacity .6s cubic-bezier(.22,.61,.36,1), transform .6s cubic-bezier(.22,.61,.36,1);
    }
    .section-page.pg-in { animation: smfPageIn .3s cubic-bezier(.22,.61,.36,1) both; }

    /* 首屏逐级入场：打开页面就能看到，不用滚动 */
    .header       { animation: smfIn .5s cubic-bezier(.22,.61,.36,1) both; }
    .navbar       { animation: smfIn .5s cubic-bezier(.22,.61,.36,1) .07s both; }
    .hero-card    { animation: smfIn .58s cubic-bezier(.22,.61,.36,1) .12s both; }
    .ui-preview   { animation: smfIn .58s cubic-bezier(.22,.61,.36,1) .20s both; }
    .stats-grid   { animation: smfIn .58s cubic-bezier(.22,.61,.36,1) .28s both; }
}
@keyframes smfIn {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: none; }
}
@keyframes smfPageIn {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: none; }
}

/* 放在最后：避免被后面定义的基础 padding 覆盖 */
@media (max-width: 768px) {
    .feature-modal-box .modal-content { padding: 30px 22px; }
}
@media (prefers-reduced-motion: reduce) {
    .skeleton { animation: none; }
}