/* Single-column product content flow for Android apps and PC software. */
body.detail-family-mobile .container,
body.detail-family-market .container { max-width: 1180px; display: block; }
body.detail-family-mobile .content,
body.detail-family-market .content { width: 100%; min-width: 0; }
body.detail-family-mobile .sidebar,
body.detail-family-market .sidebar { display: none !important; }
body.detail-family-mobile .resource-detail,
body.detail-family-market .resource-detail { max-width: none; }

body.detail-family-mobile .detail-anchor-nav,
body.detail-family-market .detail-anchor-nav { position: static; display: flex; flex-wrap: wrap; gap: 5px; margin: 20px 0; padding: 7px; border: 1px solid #e2e9e5; border-radius: 14px; background: #fff; }
body.detail-family-mobile .detail-anchor-nav a,
body.detail-family-market .detail-anchor-nav a { padding: 8px 12px; border-radius: 9px; }

body.detail-family-mobile .detail-section,
body.detail-family-market .detail-section { padding: 28px; border-radius: 20px; background: #fff; }
body.detail-family-mobile .detail-related-grid,
body.detail-family-market .detail-related-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
body.detail-family-mobile .detail-related-grid .detail-card,
body.detail-family-market .detail-related-grid .detail-card { min-width: 0; min-height: 76px; padding: 11px; border: 1px solid #e5ebe8; border-radius: 15px; background: #fff; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
body.detail-family-market .detail-related-grid .detail-card { border-color: #e2e8f0; }
body.detail-family-mobile .detail-related-grid .detail-card:hover,
body.detail-family-market .detail-related-grid .detail-card:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(30, 60, 48, .07); }
body.detail-family-mobile .detail-related-grid .detail-card-logo,
body.detail-family-market .detail-related-grid .detail-card-logo { width: 50px; height: 50px; flex: 0 0 50px; border-radius: 13px; }
body.detail-family-mobile .detail-related-grid .detail-card-name,
body.detail-family-market .detail-related-grid .detail-card-name { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 900px) {
  body.detail-family-mobile .detail-related-grid,
  body.detail-family-market .detail-related-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  body.detail-family-mobile .detail-section,
  body.detail-family-market .detail-section { padding: 18px 15px; border-radius: 15px; }
  body.detail-family-mobile .detail-related-grid,
  body.detail-family-market .detail-related-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  body.detail-family-mobile .detail-related-grid .detail-card,
  body.detail-family-market .detail-related-grid .detail-card { min-height: 68px; padding: 8px; }
  body.detail-family-mobile .detail-related-grid .detail-card-logo,
  body.detail-family-market .detail-related-grid .detail-card-logo { width: 44px; height: 44px; flex-basis: 44px; }
}