/* ============================================================
   software_detail.html 专属样式（PC 端 only）
   ============================================================ */

/* --- 主卡片 --- */
.detail-main-card { padding: 0; overflow: hidden; }

/* --- 顶部标题栏 --- */
.detail-title-bar { padding-bottom: 0; }
.detail-title-row {
  display: flex; align-items: baseline; gap: 10px;
  min-width: 0; flex-wrap: nowrap;
}
.detail-h1 {
  font-size: 22px; font-weight: bold; flex: 0 1 auto; margin: 0;
}
.detail-cat-label { font-size: 13px; color: #999; flex: 0 0 auto; }

/* --- Logo 区 --- */
.logo-original { width: 100%; height: 100%; }
.logo-img { width: 100%; height: 100%; border-radius: 12px; background: #f5f7fa; }
.logo-cover { object-fit: cover; }
.logo-contain { object-fit: contain; }
.logo-placeholder {
  width: 100%; height: 100%; background: #e8f0fe; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 48px; color: #94a3b8;
}
.logo-qr {
  display: none; position: absolute; top: 0; left: 0;
  width: 100%; height: 100%; object-fit: contain;
  border-radius: 12px; background: #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1); z-index: 10;
}

/* --- 右侧信息区 --- */
.detail-info { flex: 1; min-width: 0; }
.detail-info-row {
  display: flex; flex-wrap: wrap; gap: 8px 32px;
  margin-bottom: 12px; font-size: 14px;
}
.detail-info-row:last-of-type { margin-bottom: 0; }
.detail-info-label { color: #94a3b8; }
.detail-info-value { color: #333; }
.detail-md5 {
  font-size: 13px; color: #333; background: #f1f5f9;
  padding: 1px 6px; border-radius: 4px;
}
.detail-safe-360 { color: #2e7d32; }
.detail-safe-qq { color: #1565c0; }

/* --- 评分区 --- */
.vote-stars-row { display: flex; align-items: center; gap: 6px; white-space: nowrap; }

/* --- 下载按钮区 --- */
.detail-download-row {
  padding: 0 30px 24px; display: flex; align-items: center;
  flex-wrap: wrap; gap: 8px;
}
.detail-download-btn {
  display: inline-block !important; padding: 12px 40px !important; font-size: 16px; font-weight: 700;
  background: #f97316 !important; color: #fff !important; text-decoration: none;
  border-radius: 8px !important; transition: all 0.2s;
  box-shadow: 0 4px 12px rgba(249, 115, 22, 0.3);
  border: none;
}
.detail-download-btn:hover {
  background: #ea580c !important; transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(249, 115, 22, 0.4);
}

/* --- 夸克按钮文案切换 --- */
.text-quark { display: none; }
.btn.is-quark .text-normal { display: inline; }
.btn.is-quark .text-quark { display: none; }
@media (min-width: 769px) {
    .btn.is-quark .text-normal { display: none !important; }
    .btn.is-quark .text-quark { display: inline !important; }
}

/* --- 顶部 SEO 描述：单行省略 --- */
.seo-desc-line {
    font-size: 13px; color: #888;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    flex: 1 1 0; min-width: 0;
}

/* --- 详情页 chip（环境属性 / 安卓无广告）--- */
.detail-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.detail-chip {
    display: inline-block; padding: 4px 10px; font-size: 12px;
    background: #f0f4f8; color: #555; border-radius: 4px; line-height: 1.6;
}
.detail-chip--green { background: #e8f5e9; color: #2e7d32; }
.detail-chip--blue { background: #e3f2fd; color: #1565c0; }
.detail-chip--orange { background: #fff3e0; color: #e65100; }

/* --- 详情页评分卡（紧凑横向布局）--- */
.detail-vote-card {
    margin-top: 10px; padding: 8px 12px;
    background: #fafbfc; border-radius: 6px; border: 1px solid #eee;
    display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px;
    max-width: 640px;
}
.vote-stars { font-size: 16px; color: #ddd; letter-spacing: 1px; line-height: 1; }
.vote-stars .star.filled { color: #ffb400; }
.vote-meta { font-size: 12px; color: #666; }
.vote-score { font-size: 16px; font-weight: bold; color: #ffb400; margin-right: 2px; }
.vote-bar { flex: 1; min-width: 80px; max-width: 200px; height: 4px; background: #eee; border-radius: 2px; overflow: hidden; }
.vote-bar-fill { height: 100%; background: linear-gradient(90deg, #ffb400, #ff8a00); transition: width .3s; }
.vote-actions { display: flex; gap: 6px; margin-left: auto; }
.vote-btn {
    padding: 4px 10px; font-size: 12px; cursor: pointer;
    border: 1px solid #ddd; background: #fff; border-radius: 4px;
    transition: all .15s;
}
.vote-btn--up:hover { border-color: #4caf50; color: #4caf50; }
.vote-btn--down:hover { border-color: #f44336; color: #f44336; }
.vote-btn.is-active { opacity: .5; cursor: not-allowed; }
.vote-btn.is-active.vote-btn--up { background: #e8f5e9; border-color: #4caf50; color: #4caf50; }
.vote-btn.is-active.vote-btn--down { background: #ffebee; border-color: #f44336; color: #f44336; }
.vote-msg { margin-top: 6px; font-size: 12px; color: #f44336; flex-basis: 100%; }
.vote-msg.is-hidden { display: none; }

/* 正文H3小标题增强（放此处确保优先级高于base.css的.card h3） */
.detail-main-card .detail-section-body h3 {
    font-size: 15px !important; font-weight: 700; color: #1f2937;
    margin: 20px 0 10px; padding-left: 10px;
    border-left: 3px solid #2563eb;
}

/* --- 截图滚动展示区 --- */
.screenshot-carousel { position: relative; margin-bottom: 8px; }
.screenshot-arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 40px; height: 40px; border-radius: 50%;
  background: rgba(255,255,255,0.9); border: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15); z-index: 10;
  opacity: 0; transition: opacity 0.2s;
}
.screenshot-arrow-left { left: 8px; }
.screenshot-arrow-right { right: 8px; }
.screenshot-scroll-container {
  display: flex; overflow-x: auto; overflow-y: hidden; gap: 12px;
  padding: 0 60px 16px; -webkit-overflow-scrolling: touch;
  cursor: grab; scroll-behavior: auto;
}
.screenshot-scroll-container::-webkit-scrollbar { display: none; }
.screenshot-item {
  flex: 0 0 auto; scroll-snap-align: center;
  position: relative; display: inline-block;
}
.screenshot-img {
  width: 260px; height: 480px; object-fit: cover;
  border-radius: 16px; box-shadow: 0 2px 16px rgba(0,0,0,0.15);
  background: #f0f0f0; cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s;
  -webkit-user-drag: none; user-select: none;
}
.screenshot-item img:hover { transform: scale(1.02); box-shadow: 0 4px 24px rgba(0,0,0,0.25); }
#screenshot-carousel:hover .screenshot-arrow { opacity: 1; }
.screenshot-arrow:hover { background: #fff !important; }
.screenshot-scrollbar {
  position: relative; height: 12px; background: #eee;
  margin: 0 60px 16px; border-radius: 6px; cursor: pointer;
  display: flex; align-items: center;
}
.screenshot-scrollbar-thumb {
  position: absolute; height: 100%; width: 80%;
  background: #f97316; border-radius: 6px; left: 0;
  cursor: grab; transition: background 0.2s;
}
.screenshot-scrollbar-thumb:hover { background: #ea580c !important; }

/* --- 图片查看器 --- */
.screenshot-viewer {
  display: none; position: fixed; top: 0; left: 0;
  width: 100%; height: 100%; background: rgba(0,0,0,0.9);
  z-index: 9999; justify-content: center; align-items: center;
  flex-direction: column;
}
.viewer-close {
  position: absolute; top: 20px; right: 20px;
  width: 40px; height: 40px; border-radius: 50%;
  background: rgba(255,255,255,0.2); border: none;
  color: #fff; font-size: 24px; cursor: pointer;
}
.viewer-image {
  max-width: 90%; max-height: 85%; object-fit: contain;
  border-radius: 8px; cursor: default;
  -webkit-user-drag: none; user-select: none; backface-visibility: hidden;
}
.viewer-counter { color: #fff; margin-top: 16px; font-size: 14px; }

/* --- 移动端：隐藏 PC 专属元素 --- */
@media (max-width: 768px) {
    .detail-chips,
    .detail-vote-card,
    .detail-chip,
    .screenshot-item img { width: 200px; height: 360px; }
    .screenshot-arrow,
    .screenshot-scrollbar { display: none !important; }
}

/* ============================================================
   Software Detail Sidebar — 卡片式推荐 + 排行手风琴
   ============================================================ */

/* 覆盖 base.css 的全局 .sidebar .card sticky，只让第 4 模块 sticky */
body.software-detail-page .sidebar .card {
    position: static;
}

/* --- 所有 sidebar 模块通用 --- */
.sidebar-module { margin-bottom: 16px; }
.sidebar-module .card-body { padding: 18px 16px; }

.sidebar-module h4 {
    font-size: 15px;
    font-weight: 700;
    color: #1f2937;
    border-bottom: 2px solid #2563eb;
    padding-bottom: 10px;
    margin-bottom: 14px;
}

/* --- 前 3 个模块：卡片式列表 --- */
.sidebar-card-grid {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.sidebar-mini-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    border: 1px solid #f0f2f5;
    background: #fff;
    transition: all 0.15s ease;
    min-width: 0;
}

.sidebar-mini-card:hover {
    border-color: #dbeafe;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.08);
    transform: translateY(-1px);
}

.sidebar-mini-logo {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
    font-size: 20px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

.sidebar-mini-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.sidebar-mini-info {
    flex: 1;
    min-width: 0;
}

.sidebar-mini-name {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 2px;
}

.sidebar-mini-name:hover { color: #2563eb; }

.sidebar-mini-meta {
    font-size: 11px;
    color: #94a3b8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
}
.sidebar-mini-meta {
    font-size: 11px;
    color: #999;
}

/* --- 相关合集 list --- */
.sidebar-collection-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.sidebar-collection-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px;
    border-radius: 8px;
    text-decoration: none;
    color: inherit;
    transition: background 0.15s;
}
.sidebar-collection-item:hover { background: #f5f7fa; }

.sidebar-collection-cover {
    width: 48px;
    height: 36px;
    border-radius: 6px;
    object-fit: cover;
    flex-shrink: 0;
}
.sidebar-collection-cover-placeholder {
    width: 48px;
    height: 36px;
    border-radius: 6px;
    background: #f0f4f8;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 18px;
}

.sidebar-collection-info {
    flex: 1;
    min-width: 0;
}
.sidebar-collection-name {
    display: block;
    font-size: 13px;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sidebar-collection-count {
    font-size: 11px;
    color: #999;
}

/* --- 相关资讯 list --- */
.sidebar-news-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.sidebar-news-item {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 6px 0;
    text-decoration: none;
    color: inherit;
    border-bottom: 1px dashed #eee;
}
.sidebar-news-item:last-child { border-bottom: none; }
.sidebar-news-title {
    flex: 1;
    font-size: 13px;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sidebar-news-item:hover .sidebar-news-title { color: #2563eb; }
.sidebar-news-date {
    font-size: 11px;
    color: #999;
    flex-shrink: 0;
}

/* --- Empty state --- */
.sidebar-empty {
    text-align: center;
    color: #94a3b8;
    font-size: 13px;
    padding: 16px 0;
    list-style: none;
}

/* --- Mobile: sidebar already goes below content via base.css --- */
/* base.css line 575-582 handles sidebar width:100% + position:static */
/* homepage.css line 1522 only applies sticky at min-width:769px */
/* No additional mobile overrides needed */

/* ============================================================
   Resource detail V2 — explicit visual shell, independent of legacy .card
   ============================================================ */
.resource-detail { overflow: hidden; }
.resource-hero {
    position: relative;
    overflow: hidden;
    padding: 30px;
    border: 1px solid #294a78;
    border-radius: 14px;
    background:
        radial-gradient(circle at 83% 12%, rgba(65, 131, 240, .38), transparent 31%),
        linear-gradient(120deg, #0d1b31 0%, #152b4b 54%, #0f213b 100%);
    box-shadow: 0 18px 45px rgba(15, 32, 58, .18);
}
.resource-hero::after {
    content: "RESOURCE LIBRARY";
    position: absolute;
    right: 28px;
    bottom: 18px;
    color: rgba(191, 218, 255, .12);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .2em;
}
.resource-hero-title { padding: 0 0 20px !important; border-bottom: 1px solid rgba(184, 212, 248, .2); }
.resource-hero .detail-title-row { gap: 12px; align-items: center; }
.resource-hero .detail-h1 { color: #fff; font-size: clamp(24px, 2.2vw, 34px); line-height: 1.2; }
.resource-hero .detail-cat-label { color: #b7d2f7; border: 1px solid rgba(183, 210, 247, .4); border-radius: 999px; padding: 4px 10px; }
.resource-hero .seo-desc-line { display: block; order: 5; flex-basis: 100%; color: #b8c8dc; }
.detail-topic-link { margin-left: auto; color: #ffce72; font-weight: 700; white-space: nowrap; }
.resource-hero-body { display: flex; gap: 24px; align-items: center; padding: 24px 0 18px; }
.resource-hero .detail-logo { width: 156px; height: 202px; flex: none; border: 1px solid rgba(255,255,255,.35); border-radius: 10px; box-shadow: 0 14px 30px rgba(0,0,0,.35); overflow: hidden; }
.resource-hero .detail-info { color: #e6effc; }
.resource-hero .detail-info-row { gap: 10px; margin-bottom: 10px; }
.resource-hero .detail-info-item { border: 1px solid rgba(180, 209, 245, .2); border-radius: 6px; padding: 7px 10px; background: rgba(9, 23, 44, .26); }
.resource-hero .detail-info-label { color: #93b4df; }
.resource-hero .detail-info-value, .resource-hero .detail-md5 { color: #f4f8ff; background: transparent; }
.resource-hero .detail-vote-card { background: rgba(4, 16, 34, .32); border-color: rgba(180, 209, 245, .22); }
.resource-hero .vote-meta { color: #b8c8dc; }
.resource-hero .vote-btn { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.2); color: #e6effc; }
.resource-hero .detail-download-row { position: relative; z-index: 1; padding: 0; }
.resource-hero .detail-download-btn { min-width: 190px; text-align: center; background: linear-gradient(135deg, #ffb12b, #f77a24) !important; color: #182235 !important; box-shadow: 0 10px 20px rgba(243, 128, 35, .26); }
.resource-detail .detail-anchor-nav { margin: 20px 0; border: 1px solid #e2e8f0; border-radius: 9px; background: #fff; padding: 0 18px; }
.resource-detail .detail-section { margin: 0 0 18px; padding: 26px 30px; border: 1px solid #e2e8f0; border-radius: 12px; background: #fff; box-shadow: 0 5px 18px rgba(15, 23, 42, .04); }
.resource-detail .detail-section-title { color: #172b4d; font-size: 19px; font-weight: 800; }
.resource-detail .detail-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:16px; }
.resource-detail .detail-section-head p { margin:5px 0 0; color:#7a8ca1; font-size:12px; line-height:1.55; }
.resource-detail .detail-section-head .similar-reset-btn { flex:none; }
.resource-detail .detail-section-body { color: #334155; font-size: 15px; line-height: 1.9; }
.resource-detail .detail-section-body h3 { color: #15396b; border-left-color: #ff922b; }
.resource-detail .detail-card { border-radius: 9px; border-color: #e3eaf3; }
/* PC game resources share the same shell as the game topic, rather than a white download-page sidebar. */
body.detail-family-game { background: #0b1220; }
body.detail-family-game .content { width: 100%; }
body.detail-family-game .sidebar { display: none; }
body.detail-family-game .breadcrumb-bar { background: transparent; border: 0; }
body.detail-family-game .breadcrumb-inner { color: #9fb0c8; }
body.detail-family-game .breadcrumb-inner a { color: #8db8ff; }
body.detail-family-game .resource-detail { max-width: 1180px; margin: 0 auto; }
body.detail-family-game .resource-hero { border-color: var(--gh-line, rgba(148,163,184,.2)); background: radial-gradient(circle at 80% 16%, #274b8d 0, transparent 37%), linear-gradient(125deg,#101b31,#172c4d); }
body.detail-family-game .resource-hero-title { border-color: rgba(255,255,255,.15); }
body.detail-family-game .resource-detail .detail-anchor-nav { border-color: var(--gh-line, rgba(148,163,184,.2)); background: #121c2d; }
body.detail-family-game .resource-detail .detail-anchor-nav a { color: #a9b8cc; }
body.detail-family-game .resource-detail .detail-anchor-nav .anchor-active { color: #fff; }
body.detail-family-game .resource-detail .detail-section { border-color: var(--gh-line, rgba(148,163,184,.2)); background: #121c2d; box-shadow: none; }
body.detail-family-game .resource-detail .detail-section-title { color: #eff6ff; }
body.detail-family-game .resource-detail .detail-section-body { color: #d6e2f2; }
body.detail-family-game .resource-detail .detail-section-body h3 { color: #eff6ff; border-left-color: #ffb22c; }
body.detail-family-game .resource-detail .detail-card { border-color: #ffffff12; background: #19263a; }
body.detail-family-game .resource-detail .detail-card-name { color: #eff6ff; }
body.detail-family-game .resource-detail .detail-card-meta { color: #9fb0c8; }
@media (max-width: 768px) {
    .resource-hero { padding: 20px 16px 24px; border-radius: 0; }
    .resource-hero .detail-title-row { align-items: flex-start; flex-wrap: wrap; }
    .resource-hero .detail-h1 { font-size: 24px; }
    .detail-topic-link { margin-left: 0; }
    .resource-hero-body { gap: 14px; align-items: flex-start; }
    .resource-hero .detail-logo { width: 88px; height: 116px; }
    .resource-hero .detail-info-row { gap: 6px; }
    .resource-hero .detail-info-item { font-size: 12px; padding: 5px 7px; }
    .resource-detail .detail-section { margin: 0 0 12px; padding: 20px 16px; border-radius: 0; }
}

/* ====== 第 4 模块：本类排行（sticky + 手风琴） ====== */
.sidebar-rank-sticky {
    position: sticky;
    top: calc(var(--header-h, 100px) + 8px);
    height: fit-content;
}

.detail-rank-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.detail-rank-item {
    border-bottom: 1px solid #f8fafc;
    min-width: 0;
}

.detail-rank-item:last-child {
    border-bottom: none;
}

.detail-rank-main {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 0;
}

.detail-rank-item--expanded .detail-rank-main {
    padding: 10px 0 4px;
}

.detail-rank-num {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    color: #94a3b8;
    background: #f1f5f9;
    border-radius: 6px;
}

.detail-rank-item:nth-child(1) .detail-rank-num {
    background: linear-gradient(135deg, #f59e0b, #eab308);
    color: #fff;
}

.detail-rank-item:nth-child(2) .detail-rank-num {
    background: linear-gradient(135deg, #94a3b8, #cbd5e1);
    color: #fff;
}

.detail-rank-item:nth-child(3) .detail-rank-num {
    background: linear-gradient(135deg, #d97706, #f59e0b);
    color: #fff;
}

.detail-rank-name {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    font-weight: 600;
    color: #1f2937;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.detail-rank-ver {
    font-size: 12px;
    color: #94a3b8;
    font-weight: 400;
}

.detail-rank-expand {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease;
}

.detail-rank-item--expanded .detail-rank-expand {
    max-height: 80px;
}

.detail-rank-expand-inner {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 0 10px 32px;
}

.detail-rank-expand-logo {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
    background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

.detail-rank-expand-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.detail-rank-expand-info {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.detail-rank-expand-size {
    font-size: 12px;
    color: #94a3b8;
    white-space: nowrap;
}

.detail-rank-expand-btn {
    display: inline-block;
    padding: 5px 20px;
    font-size: 12px;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(135deg, #2563eb, #3b82f6);
    border-radius: 6px;
    text-decoration: none;
    text-align: center;
    transition: all 0.15s ease;
    align-self: flex-start;
}

.detail-rank-expand-btn:hover {
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.35);
    transform: translateY(-1px);
}

/* 其它版本：纵向信息列表，前三条直接可见，余下项使用原生展开控件。 */
.detail-versions-stack { display: grid; grid-template-columns: 1fr; gap: 10px; }
.detail-versions-stack .detail-card { width: 100%; min-height: 68px; }
.detail-versions-more { margin-top: 10px; border: 1px solid #dce7f4; border-radius: 9px; background: #f8fbff; }
.detail-versions-more summary { padding: 11px 14px; color: #2767b4; font-size: 13px; font-weight: 700; cursor: pointer; list-style: none; }
.detail-versions-more summary::-webkit-details-marker { display: none; }
.detail-versions-more summary::after { content: '⌄'; float: right; font-size: 16px; transition: transform .18s ease; }
.detail-versions-more[open] summary { border-bottom: 1px solid #dce7f4; }
.detail-versions-more[open] summary::after { transform: rotate(180deg); }
.detail-versions-stack--more { padding: 10px; }
body.detail-family-game .detail-versions-more { border-color: #ffffff24; background: #19263a; }
body.detail-family-game .detail-versions-more summary { color: #c8ddff; }
body.detail-family-game .detail-versions-more[open] summary { border-color: #ffffff24; }

/* Game resources are transactional download pages, deliberately distinct from dark game-topic hubs. */
body.detail-family-game { background: #eff4fa; color: #20364f; }
body.detail-family-game .content { width: 100%; }
body.detail-family-game .sidebar { display: none; }
body.detail-family-game .breadcrumb-bar { background: transparent; border: 0; }
body.detail-family-game .breadcrumb-inner { color: #71839a; }
body.detail-family-game .breadcrumb-inner a { color: #2665b0; }
body.detail-family-game .resource-detail { max-width: 1180px; margin: 0 auto; }
body.detail-family-game .resource-hero { border-color: #d8e4f1; background: #fff; box-shadow: 0 12px 28px rgba(38, 78, 128, .08); }
body.detail-family-game .resource-hero::after { content: "GAME DOWNLOAD"; color: rgba(37, 98, 177, .09); }
body.detail-family-game .resource-hero-title { border-color: #e2ebf4; }
body.detail-family-game .resource-hero .detail-h1 { color: #173b68; }
body.detail-family-game .resource-hero .detail-cat-label { border-color: #b9d1ef; color: #2968b4; }
body.detail-family-game .resource-hero .seo-desc-line { color: #6c8099; }
body.detail-family-game .detail-topic-link { color: #2563b3; }
body.detail-family-game .resource-hero .detail-logo { border-color: #d5e2f0; box-shadow: 0 10px 22px rgba(35, 73, 117, .15); }
body.detail-family-game .resource-hero .detail-info { color: #2a405b; }
body.detail-family-game .resource-hero .detail-info-item { border-color: #dce7f2; background: #f7faff; }
body.detail-family-game .resource-hero .detail-info-label { color: #7a8da3; }
body.detail-family-game .resource-hero .detail-info-value, body.detail-family-game .resource-hero .detail-md5 { color: #294762; }
body.detail-family-game .resource-hero .detail-vote-card { border-color: #dbe7f2; background: #f8fbff; }
body.detail-family-game .resource-hero .vote-meta, body.detail-family-game .resource-hero .vote-btn { color: #617690; }
body.detail-family-game .resource-hero .vote-btn { border-color: #d5e1ee; background: #fff; }
body.detail-family-game .resource-detail .detail-anchor-nav { border-color: #dbe6f1; background: #fff; }
body.detail-family-game .resource-detail .detail-anchor-nav a { color: #63768d; }
body.detail-family-game .resource-detail .detail-anchor-nav .anchor-active { color: #2265ba; }
body.detail-family-game .resource-detail .detail-section { border-color: #dce7f2; background: #fff; box-shadow: 0 5px 18px rgba(30, 70, 115, .04); }
body.detail-family-game .resource-detail .detail-section-title { color: #193e6b; }
body.detail-family-game .resource-detail .detail-section-body { color: #3b536f; }
body.detail-family-game .resource-detail .detail-section-body h3 { color: #1c4779; border-left-color: #f59e0b; }
body.detail-family-game .resource-detail .detail-card { border-color: #dfe8f2; background: #fff; }
body.detail-family-game .resource-detail .detail-card-name { color: #254563; }
body.detail-family-game .resource-detail .detail-card-meta { color: #768aa1; }
body.detail-family-game .detail-versions-more { border-color: #dbe6f2; background: #f8fbff; }
body.detail-family-game .detail-versions-more summary { color: #2868b4; }
body.detail-family-game .detail-versions-more[open] summary { border-color: #dbe6f2; }

/* Compact desktop game-download header: metadata and the primary action have distinct columns. */
body.detail-family-game .resource-hero { display: flex; flex-wrap: wrap; gap: 22px 28px; padding: 26px 30px; }
body.detail-family-game .resource-hero-title { flex: 0 0 100%; padding-bottom: 16px !important; }
body.detail-family-game .resource-hero-body { flex: 1 1 0; min-width: 0; padding: 0; align-items: flex-start; }
body.detail-family-game .resource-hero .detail-logo { width: 128px; height: 166px; }
body.detail-family-game .resource-hero .detail-info-row { display: flex; gap: 8px; margin-bottom: 8px; }
body.detail-family-game .resource-hero .detail-info-item { padding: 8px 10px; }
body.detail-family-game .detail-version-badge { display: inline-flex; align-items: center; padding: 5px 9px; border: 1px solid #bfd4ed; border-radius: 6px; color: #2b68ac; font-size: 13px; font-weight: 700; white-space: nowrap; }
body.detail-family-game .detail-download-row { flex: 0 0 210px; align-self: center; margin: 0; padding: 18px; border: 1px solid #d9e6f2; border-radius: 12px; background: #f7fbff; }
body.detail-family-game .resource-hero .detail-download-row { padding: 18px; }
body.detail-family-game .resource-hero .detail-download-btn { display: flex; width: 100%; min-height: 52px; align-items: center; justify-content: center; border-radius: 9px; }
body.detail-family-game .resource-hero .detail-vote-card { margin-top: 12px; }
@media (max-width: 768px) {
  body.detail-family-game .resource-hero { display: block; padding: 18px 16px 20px; }
  body.detail-family-game .resource-hero-body { margin-top: 18px; }
  body.detail-family-game .detail-download-row { margin-top: 16px; padding: 0; border: 0; background: transparent; }
  body.detail-family-game .resource-hero .detail-download-btn { min-height: 48px; }
  body.detail-family-game .detail-version-badge { margin-top: 6px; }
}

/* Desktop software is a practical product page, not a game-like promotional hero. */
body.detail-family-market { background: #f4f7fb; color: #24334a; }
body.detail-family-market .resource-detail { overflow: visible; }
body.detail-family-market .resource-hero {
  display: grid; grid-template-columns: minmax(0, 1fr) 238px; gap: 24px 32px;
  padding: 30px 32px; border: 1px solid #dbe5f0; border-radius: 16px;
  background: linear-gradient(135deg, #fff 0%, #f7faff 66%, #edf5ff 100%);
  box-shadow: 0 14px 34px rgba(36, 70, 112, .08);
}
body.detail-family-market .resource-hero::after { content: none; }
body.detail-family-market .resource-hero-title { grid-column: 1 / -1; padding-bottom: 19px !important; border-color: #e6edf5; }
body.detail-family-market .detail-title-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
body.detail-family-market .desktop-app-kicker { order:-1; flex:0 0 100%; color:#3877c9; font-size:11px; font-weight:800; letter-spacing:.12em; }
body.detail-family-market .resource-hero .detail-h1 { color:#172d4b; font-size:clamp(28px, 2.4vw, 36px); font-weight:800; letter-spacing:-.035em; }
body.detail-family-market .detail-version-badge { display:inline-flex; align-items:center; padding:5px 9px; color:#276bb5; background:#edf5ff; border:1px solid #c9dff6; border-radius:6px; font-size:13px; font-weight:800; white-space:nowrap; }
body.detail-family-market .resource-hero .detail-cat-label { color:#5e7490; border:0; border-left:1px solid #d8e2ee; border-radius:0; padding:2px 0 2px 10px; }
body.detail-family-market .resource-hero .seo-desc-line { flex:0 0 100%; order:5; color:#637891; font-size:14px; line-height:1.65; white-space:normal; }
body.detail-family-market .resource-hero-body { min-width:0; gap:20px; padding:0; align-items:flex-start; }
body.detail-family-market .resource-hero .detail-logo { width:108px; height:108px; border:1px solid #d9e4ef; border-radius:18px; background:#fff; box-shadow:0 10px 22px rgba(35, 66, 105, .12); }
body.detail-family-market .resource-hero .logo-img { border-radius:17px; }
body.detail-family-market .detail-info { padding-top:2px; }
body.detail-family-market .detail-info-row { gap:8px; margin-bottom:8px; }
body.detail-family-market .detail-info-item { display:inline-flex; align-items:center; padding:7px 10px; border:1px solid #e1e9f2; border-radius:7px; background:#fff; font-size:13px; }
body.detail-family-market .detail-info-label { color:#8294a9; }
body.detail-family-market .detail-info-value { color:#304762; font-weight:600; }
body.detail-family-market .detail-vote-card { max-width:100%; margin-top:12px; padding:9px 11px; background:#fff; border-color:#e0e9f2; }
body.detail-family-market .detail-download-row { align-self:stretch; display:flex; flex-direction:column; justify-content:center; gap:11px; margin:0; padding:20px; border:1px solid #cedfee; border-radius:13px; background:#f9fcff; }
body.detail-family-market .desktop-download-heading span { display:block; color:#183b61; font-size:16px; font-weight:800; }
body.detail-family-market .desktop-download-heading small { display:block; margin-top:5px; color:#71869e; font-size:12px; line-height:1.45; }
body.detail-family-market .resource-hero .detail-download-btn { display:flex; align-items:center; justify-content:center; min-height:52px; width:100%; padding:12px 16px !important; border-radius:9px !important; background:linear-gradient(135deg,#216fcb,#398de8) !important; box-shadow:0 9px 18px rgba(37,111,203,.24); }
body.detail-family-market .resource-hero .detail-download-btn:hover { background:linear-gradient(135deg,#165fae,#287ed7) !important; box-shadow:0 12px 22px rgba(37,111,203,.32); }
body.detail-family-market .desktop-download-note { margin:0; color:#8394a8; font-size:11px; line-height:1.55; text-align:center; }
body.detail-family-market .screenshot-carousel { margin:22px 0; padding:20px 0 4px; border:1px solid #e0e8f1; border-radius:14px; background:#fff; box-shadow:0 5px 18px rgba(37,65,98,.035); }
body.detail-family-market .screenshot-scroll-container { gap:16px; padding:0 28px 16px; }
body.detail-family-market .screenshot-img { width:360px; height:224px; padding:5px; object-fit:contain; border:1px solid #e2eaf3; border-radius:10px; background:#f6f8fb; box-shadow:0 5px 14px rgba(31,53,81,.10); }
body.detail-family-market .screenshot-arrow { opacity:1; width:34px; height:34px; background:#fff; }.detail-family-market .screenshot-arrow-left{left:10px}.detail-family-market .screenshot-arrow-right{right:10px}
body.detail-family-market .screenshot-scrollbar { margin:0 28px 10px; background:#edf2f7; }.detail-family-market .screenshot-scrollbar-thumb { background:#4d8fda; }
body.detail-family-market .resource-detail .detail-anchor-nav { margin:20px 0; padding:7px 10px; border-radius:11px; border-color:#dfe8f1; box-shadow:0 4px 13px rgba(33,59,91,.035); }
body.detail-family-market .resource-detail .detail-anchor-nav a { padding:8px 10px; border-radius:7px; color:#70849b; }.detail-family-market .resource-detail .detail-anchor-nav .anchor-active { color:#236db9; background:#edf5ff; }
body.detail-family-market .resource-detail .detail-section { border-color:#e0e8f0; border-radius:14px; box-shadow:0 5px 18px rgba(30,58,92,.04); }.detail-family-market .resource-detail .detail-section-title { color:#203d60; }
@media (max-width: 768px) {
  body.detail-family-market .resource-hero { display:block; padding:20px 16px; border-radius:0; }
  body.detail-family-market .resource-hero-title { padding-bottom:15px !important; }.detail-family-market .resource-hero .detail-h1 { font-size:26px; }
  body.detail-family-market .resource-hero-body { margin-top:17px; }.detail-family-market .resource-hero .detail-logo { width:82px; height:82px; border-radius:14px; }
  body.detail-family-market .detail-info-item { font-size:12px; padding:6px 8px; }.detail-family-market .detail-download-row { margin-top:18px; padding:16px; }
  body.detail-family-market .screenshot-carousel { border-radius:0; margin:14px -12px; }.detail-family-market .screenshot-scroll-container { padding:0 16px 14px; }.detail-family-market .screenshot-img { width:280px; height:175px; }
}

/* 移动端：排行 sticky 解除 */
@media (max-width: 768px) {
    .sidebar-rank-sticky {
        position: static;
    }
}


/* 猜您喜欢 — 同标签/同分类提示文字 */
.similar-tag-hint { display:none; font-size:12px; font-weight:400; color:#94a3b8; margin-left:8px; }
.similar-default-hint { font-size:12px; font-weight:400; color:#94a3b8; margin-left:8px; }
.similar-reset-btn { display:none; margin-left:auto; font-size:12px; color:#00bcd4; background:none; border:none; cursor:pointer; padding:4px 8px; }
.similar-reset-btn:hover { color:#0097a7; }
/* Modern product breadcrumb */
.detail-breadcrumb {
  border: 0;
  background: transparent;
}

.detail-breadcrumb .breadcrumb-inner {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  padding-top: 16px;
  padding-bottom: 16px;
  list-style: none;
}

.detail-breadcrumb .breadcrumb-inner li {
  display: flex;
  align-items: center;
  min-width: 0;
}

.detail-breadcrumb .breadcrumb-inner li + li::before {
  width: 6px;
  height: 6px;
  margin: 0 9px 0 5px;
  flex: none;
  border-top: 1.5px solid #a8b4c2;
  border-right: 1.5px solid #a8b4c2;
  content: "";
  transform: rotate(45deg);
}

.detail-breadcrumb .breadcrumb-inner a,
.detail-breadcrumb .breadcrumb-current span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border-radius: 9px;
  color: #64748b;
  font-size: 13px;
  font-weight: 650;
  line-height: 1;
  text-decoration: none;
  transition: color .18s ease, background .18s ease;
}

.detail-breadcrumb .breadcrumb-inner a:hover {
  background: #edf3fa;
  color: #1e5fa9;
  text-decoration: none;
}

.detail-breadcrumb .breadcrumb-home {
  gap: 6px;
  background: #edf4ff;
  color: #2563a9 !important;
}

.detail-breadcrumb .breadcrumb-home svg {
  width: 14px;
  height: 14px;
  fill: currentColor;
}

.detail-breadcrumb .breadcrumb-current {
  overflow: hidden;
}

.detail-breadcrumb .breadcrumb-current span {
  max-width: 360px;
  overflow: hidden;
  background: #f1f4f7;
  color: #34465a;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 768px) {
  .detail-breadcrumb { overflow-x: auto; scrollbar-width: none; }
  .detail-breadcrumb::-webkit-scrollbar { display: none; }
  .detail-breadcrumb .breadcrumb-inner { width: max-content; padding: 10px 12px; }
  .detail-breadcrumb .breadcrumb-inner a,
  .detail-breadcrumb .breadcrumb-current span { min-height: 28px; padding: 0 8px; font-size: 12px; }
  .detail-breadcrumb .breadcrumb-current span { max-width: 210px; }
}