/* 客户端下载页（Home/DownloadClient）。所有选择器都挂在 .dl 下，不影响站点其它页面。 */
.dl {
    --dl-primary: #4f5bd5; --dl-primary-2: #7c5cff; --dl-success: #12a373; --dl-warning: #e8930c; --dl-danger: #e5484d;
    --dl-text: #1f2a44; --dl-muted: #7a869f; --dl-border: #e6e9f2; --dl-soft: #f5f6fb;
    --dl-radius: 16px; --dl-shadow: 0 1px 2px rgba(20, 30, 60, .04), 0 8px 24px rgba(20, 30, 60, .06);
    color: var(--dl-text);
}
.dl .text-muted-2 { color: var(--dl-muted) !important; }
.dl .num { font-variant-numeric: tabular-nums; }
.dl .mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.dl h2.sec { font-size: 1.25rem; font-weight: 750; margin: 2.2rem 0 1rem; }

/* ---------- Hero ---------- */
.dl-hero {
    position: relative; overflow: hidden; border-radius: 22px; padding: 2.2rem 2rem; color: #fff;
    background: linear-gradient(120deg, var(--dl-primary) 0%, var(--dl-primary-2) 60%, #a06bff 100%);
    box-shadow: 0 16px 38px rgba(79, 91, 213, .35);
}
.dl-hero::before, .dl-hero::after { content: ""; position: absolute; border-radius: 50%; background: rgba(255, 255, 255, .09); }
.dl-hero::before { width: 320px; height: 320px; right: -80px; top: -140px; }
.dl-hero::after { width: 200px; height: 200px; right: 160px; bottom: -130px; }
.dl-hero > * { position: relative; z-index: 1; }
.dl-hero h1 { font-size: 1.9rem; font-weight: 800; margin: 0 0 .5rem; color: #fff; letter-spacing: -.3px; }
.dl-hero .lead { opacity: .92; font-size: 1rem; max-width: 640px; }
.dl-hero .btn-hero { background: #fff; color: var(--dl-primary); font-weight: 700; border: 0; border-radius: 14px; padding: .8rem 1.5rem; box-shadow: 0 8px 20px rgba(15, 23, 42, .18); }
.dl-hero .btn-hero:hover { background: #f1f2ff; }
.dl-hero .btn-ghost { background: rgba(255, 255, 255, .16); color: #fff; border: 1px solid rgba(255, 255, 255, .38); border-radius: 14px; padding: .8rem 1.3rem; font-weight: 600; }
.dl-hero .btn-ghost:hover { background: rgba(255, 255, 255, .26); color: #fff; }
.dl-hero .meta { font-size: .82rem; opacity: .85; }

/* ---------- 系统切换 ---------- */
.dl-tabs { display: inline-flex; gap: .4rem; background: #eef0f6; padding: 5px; border-radius: 14px; flex-wrap: wrap; }
.dl-tabs button { border: 0; background: transparent; padding: .55rem 1.15rem; border-radius: 10px; font-weight: 650; font-size: .92rem; color: #5b6784; display: inline-flex; align-items: center; gap: .45rem; }
.dl-tabs button.active { background: #fff; color: var(--dl-text); box-shadow: 0 2px 8px rgba(20, 30, 60, .12); }
.dl-tabs button .cnt { font-size: .7rem; font-weight: 700; background: #e3f6ef; color: var(--dl-success); border-radius: 999px; padding: .05rem .5rem; }

/* ---------- 下载卡片 ---------- */
.dl-card { background: #fff; border: 1px solid var(--dl-border); border-radius: var(--dl-radius); box-shadow: var(--dl-shadow); height: 100%; display: flex; flex-direction: column; }
.dl-card .body { padding: 1.4rem 1.5rem; flex: 1; display: flex; flex-direction: column; }
.dl-ico { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; font-size: 1.4rem; flex: none; }
.dl-ico.gui { background: #eceefd; color: var(--dl-primary); }
.dl-ico.cli { background: #1f2a44; color: #7ce3c0; }
.dl-card h3 { font-size: 1.1rem; font-weight: 750; margin: 0; }
.dl-chip { display: inline-flex; align-items: center; gap: .3rem; padding: .22rem .6rem; border-radius: 999px; font-size: .74rem; font-weight: 650; background: var(--dl-soft); color: #4a5670; }
.dl-chip.new { background: #e3f6ef; color: var(--dl-success); }
.dl-chip.warn { background: #fdf1dc; color: #b56f00; }
.dl-arch { display: inline-flex; gap: .35rem; flex-wrap: wrap; }
.dl-arch button { border: 1px solid var(--dl-border); background: #fff; border-radius: 10px; padding: .28rem .75rem; font-size: .8rem; font-weight: 650; color: #4a5670; }
.dl-arch button.active { border-color: var(--dl-primary); background: #eceefd; color: var(--dl-primary); }
.dl-ver { font-size: 1.7rem; font-weight: 800; letter-spacing: -.5px; line-height: 1.1; }
.dl .btn-dl { background: var(--dl-primary); color: #fff; border: 0; border-radius: 12px; font-weight: 700; padding: .7rem 1.2rem; }
.dl .btn-dl:hover { background: #4048c4; color: #fff; }
.dl .btn-dl.disabled { background: #cfd3e6; }
.dl .btn-soft { background: var(--dl-soft); color: #3a4560; border: 0; border-radius: 12px; font-weight: 650; padding: .7rem 1rem; }
.dl .btn-soft:hover { background: #eceefd; }
.dl-sha { display: flex; align-items: center; gap: .5rem; background: var(--dl-soft); border-radius: 10px; padding: .4rem .65rem; font-size: .74rem; }
.dl-sha code { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #4a5670; background: transparent; }
.dl-notes { white-space: pre-line; font-size: .86rem; color: #3a4560; background: var(--dl-soft); border-radius: 12px; padding: .8rem 1rem; }
.dl-empty { text-align: center; color: var(--dl-muted); padding: 2rem 1rem; }
.dl-empty i { font-size: 2.2rem; display: block; margin-bottom: .4rem; opacity: .55; }
.dl-hist { font-size: .84rem; }
.dl-hist td { padding: .35rem .5rem; vertical-align: middle; }

/* ---------- 安装说明 ---------- */
.dl-seg { display: inline-flex; background: #eef0f6; border-radius: 12px; padding: 4px; }
.dl-seg button { border: 0; background: transparent; padding: .45rem 1.1rem; border-radius: 9px; font-size: .88rem; font-weight: 650; color: #66728c; }
.dl-seg button.active { background: #fff; color: var(--dl-text); box-shadow: 0 1px 4px rgba(20, 30, 60, .14); }
.dl-steps { counter-reset: st; list-style: none; padding: 0; margin: 0; }
.dl-steps > li { counter-increment: st; position: relative; padding: 0 0 1.1rem 2.6rem; }
.dl-steps > li::before { content: counter(st); position: absolute; left: 0; top: -.05rem; width: 1.85rem; height: 1.85rem; border-radius: 50%; background: #eceefd; color: var(--dl-primary); font-weight: 800; font-size: .85rem; display: grid; place-items: center; }
.dl-steps > li:not(:last-child)::after { content: ""; position: absolute; left: .92rem; top: 1.9rem; bottom: .1rem; width: 2px; background: #eceefd; }
.dl-steps h4 { font-size: .98rem; font-weight: 700; margin: 0 0 .25rem; }
.dl-steps p { margin: 0 0 .4rem; color: #3a4560; font-size: .9rem; }
.dl-code { position: relative; background: #111827; color: #d7e2f3; border-radius: 12px; padding: .9rem 1rem; margin: .4rem 0 .7rem; font-size: .82rem; overflow-x: auto; }
.dl-code pre { margin: 0; color: inherit; white-space: pre; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.dl-code .cap { font-size: .7rem; color: #7f8fa8; margin-bottom: .35rem; display: block; }
.dl-code .copy { position: absolute; right: .55rem; top: .5rem; border: 0; border-radius: 8px; background: rgba(255, 255, 255, .12); color: #d7e2f3; font-size: .72rem; padding: .18rem .6rem; }
.dl-code .copy:hover { background: rgba(255, 255, 255, .22); }
.dl-note { border-left: 4px solid var(--dl-warning); background: #fdf6e8; border-radius: 0 12px 12px 0; padding: .7rem 1rem; font-size: .86rem; margin: .5rem 0 1rem; }
.dl-note.info { border-left-color: var(--dl-primary); background: #eef0ff; }
.dl-faq details { background: #fff; border: 1px solid var(--dl-border); border-radius: 12px; padding: .8rem 1.1rem; margin-bottom: .6rem; }
.dl-faq summary { font-weight: 650; cursor: pointer; }
.dl-faq p { margin: .6rem 0 0; color: #3a4560; font-size: .9rem; }
.dl-panel { background: #fff; border: 1px solid var(--dl-border); border-radius: var(--dl-radius); box-shadow: var(--dl-shadow); padding: 1.5rem; }
.dl-toast { position: fixed; bottom: 22px; left: 50%; transform: translateX(-50%); background: #1f2a44; color: #fff; padding: .55rem 1.1rem; border-radius: 12px; font-size: .86rem; z-index: 2000; box-shadow: 0 10px 30px rgba(15, 23, 42, .3); }
@media (max-width: 575.98px) { .dl-hero { padding: 1.5rem 1.25rem; } .dl-hero h1 { font-size: 1.45rem; } }
