
/* ==========================================================
   Mobile Template M1
   目的：手机端单独排版，不再把桌面端强行压缩
   适用：iOS / Android / 375px / 390px / 414px / 430px / 768px
   ========================================================== */

@media (max-width: 860px) {
  html, body {
    max-width: 100%;
    overflow-x: hidden;
  }

  body {
    background:
      radial-gradient(circle at 18% 0%, rgba(14,77,43,.22), transparent 34%),
      linear-gradient(180deg, #070a0e 0%, #080c12 48%, #050608 100%);
  }

  .container {
    width: calc(100% - 24px);
  }

  .topbar {
    display: none !important;
  }

  .header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(7,10,14,.96);
    border-bottom: 1px solid rgba(212,175,55,.14);
    box-shadow: 0 10px 26px rgba(0,0,0,.26);
    backdrop-filter: blur(14px);
  }

  .header-inner {
    min-height: 58px !important;
    padding: 9px 0 !important;
    gap: 10px;
  }

  .logo-img {
    width: 34px !important;
    height: 34px !important;
    border-radius: 11px;
  }

  .logo-text {
    max-width: 58vw !important;
    font-size: 16px !important;
    line-height: 1.1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .search {
    display: none !important;
  }

  .menu-toggle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    min-height: 42px;
    padding: 0 12px;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
    border: 1px solid rgba(212,175,55,.18);
    color: #fff;
    font-weight: 900;
  }

  .nav {
    display: none;
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    top: calc(62px + env(safe-area-inset-top, 0px)) !important;
    max-height: calc(100dvh - 84px);
    overflow-y: auto;
    padding: 12px !important;
    border-radius: 20px;
    background: rgba(8,12,18,.98);
    border: 1px solid rgba(212,175,55,.16);
    box-shadow: 0 24px 90px rgba(0,0,0,.55);
    backdrop-filter: blur(18px);
    flex-direction: column !important;
    gap: 8px !important;
    align-items: stretch !important;
  }

  .nav.open {
    display: flex !important;
  }

  .nav a {
    width: 100%;
    min-height: 46px;
    padding: 0 14px !important;
    border-radius: 14px;
    display: flex !important;
    align-items: center;
    border: 1px solid rgba(255,255,255,.08) !important;
    background: rgba(255,255,255,.045);
    font-size: 15px;
  }

  .nav a:hover {
    background: rgba(212,175,55,.10);
    color: #f1d584;
  }

  /* 首页首屏：图片上、内容下，避免桌面压缩造成半图和文字压图 */
  .hero {
    padding: 12px 0 8px !important;
  }

  .hero-grid {
    display: block !important;
  }

  .hero .sidebar {
    display: none !important;
  }

  .hero-card {
    min-height: 520px !important;
    aspect-ratio: auto !important;
    border-radius: 24px !important;
    overflow: hidden;
    border: 1px solid rgba(212,175,55,.16);
    box-shadow: 0 24px 70px rgba(0,0,0,.44);
  }

  .hero-slide {
    position: absolute;
    inset: 0;
  }

  .slide-image-link {
    inset: 0 0 auto 0 !important;
    height: 50% !important;
    z-index: 1;
  }

  .slide-image-link img,
  .hero-slide img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  .hero-overlay {
    inset: 50% 0 0 0 !important;
    padding: 18px !important;
    background:
      linear-gradient(180deg, rgba(8,12,18,.96), rgba(5,7,10,.98)) !important;
    justify-content: flex-start !important;
    pointer-events: none;
  }

  .hero-overlay .kicker {
    width: auto;
    max-width: 100%;
    white-space: normal;
    font-size: 12px;
    margin-bottom: 9px;
  }

  .hero h1,
  .hero-overlay h2 {
    font-size: 24px !important;
    line-height: 1.25 !important;
    margin-bottom: 9px !important;
    letter-spacing: -.02em;
  }

  .hero p {
    font-size: 15px !important;
    line-height: 1.62 !important;
    max-width: 100%;
    color: rgba(255,255,255,.80);
  }

  .hero-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
    margin-top: 12px !important;
    width: 100%;
  }

  .hero-actions .btn {
    width: 100%;
    min-height: 44px;
    pointer-events: auto;
  }

  .carousel-control {
    display: none !important;
  }

  .carousel-dots {
    left: 18px !important;
    bottom: calc(50% + 12px) !important;
  }

  .carousel-dots button {
    height: 8px !important;
    width: 8px !important;
  }

  .carousel-dots button.active {
    width: 24px !important;
  }

  .hotbox {
    margin-top: 12px;
    padding: 14px !important;
    border-radius: 20px;
  }

  .hotbox .side-title {
    font-size: 17px;
    margin-bottom: 9px;
  }

  .match-list {
    display: grid;
    gap: 8px;
  }

  .match {
    padding: 10px 12px;
    border-radius: 14px;
  }

  .section {
    padding: 17px 0 !important;
  }

  .section::before {
    display: none;
  }

  .section-head {
    display: block !important;
    margin-bottom: 12px !important;
  }

  .section-head h2 {
    font-size: 22px !important;
    line-height: 1.28;
  }

  .section-head p {
    margin-top: 6px;
    font-size: 14px;
    line-height: 1.62;
  }

  .keyword-map,
  .home-intro {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    padding: 16px !important;
    border-radius: 20px !important;
  }

  .keyword-map h2,
  .intro-panel h2,
  .disclaimer-panel h2 {
    font-size: 21px !important;
    line-height: 1.28 !important;
  }

  .keyword-tags {
    justify-content: flex-start !important;
    gap: 8px !important;
  }

  .keyword-tags a {
    padding: 8px 10px !important;
    font-size: 13px !important;
  }

  .intro-panel,
  .disclaimer-panel {
    padding: 16px !important;
    border-radius: 18px !important;
  }

  .intro-list {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }

  .intro-list span {
    padding: 9px 10px !important;
    font-size: 13px;
    text-align: center;
  }

  .intent-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .intent-card {
    padding: 15px !important;
    border-radius: 18px !important;
    display: grid;
    grid-template-columns: 42px 1fr;
    column-gap: 11px;
    align-items: start;
  }

  .intent-card .intent-mark {
    grid-row: span 3;
    width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
  }

  .intent-card strong {
    font-size: 16px !important;
    margin-bottom: 4px !important;
  }

  .intent-card p {
    font-size: 14px !important;
    line-height: 1.58 !important;
    margin-bottom: 6px !important;
  }

  .intent-card a {
    font-size: 14px;
  }

  /* 正式资讯目录：手机端文章卡改为规整列表 */
  .grid-3,
  .grid-4 {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 11px !important;
  }

  .article-card {
    display: grid !important;
    grid-template-columns: 118px minmax(0,1fr);
    min-height: 132px;
    border-radius: 18px !important;
    overflow: hidden;
  }

  .article-card > a {
    width: 118px;
    min-height: 132px;
    height: 100%;
    line-height: 0;
  }

  .article-card img {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  .article-body {
    padding: 11px 12px !important;
    gap: 5px !important;
    min-width: 0;
  }

  .article-body .meta {
    font-size: 11px;
    gap: 5px;
  }

  .tag {
    font-size: 11px !important;
    padding: 2px 7px !important;
  }

  .article-body h3 {
    font-size: 15.5px !important;
    line-height: 1.38 !important;
    margin: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }

  .article-body p {
    font-size: 13px !important;
    line-height: 1.48 !important;
    color: #aeb6c3 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    margin: 0 !important;
  }

  .readmore {
    font-size: 13px;
    margin-top: 2px !important;
  }

  /* 球员排名：手机端改为列表卡，避免大卡片堆叠杂乱 */
  .rank-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .player-card {
    display: grid !important;
    grid-template-columns: 94px minmax(0,1fr);
    min-height: 112px;
    border-radius: 18px !important;
    overflow: hidden;
  }

  .player-card .player-photo-wrap,
  .player-card > a {
    width: 94px !important;
    height: 112px !important;
    aspect-ratio: auto !important;
  }

  .player-card .player-photo-real,
  .player-card img {
    width: 94px !important;
    height: 112px !important;
    object-fit: cover !important;
    object-position: center top !important;
  }

  .player-card-body {
    padding: 11px 12px !important;
    min-width: 0;
    gap: 5px !important;
  }

  .player-rank {
    font-size: 11px !important;
    padding: 2px 8px !important;
  }

  .player-card h3 {
    font-size: 16px !important;
    line-height: 1.24 !important;
    margin: 0 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .player-meta {
    font-size: 12.5px !important;
    line-height: 1.48 !important;
  }

  .rank-summary {
    grid-template-columns: 1fr 1fr !important;
    gap: 9px !important;
  }

  .info-item {
    padding: 12px 10px !important;
    border-radius: 15px !important;
  }

  .info-item strong {
    font-size: 18px !important;
  }

  .info-item span {
    font-size: 12px;
  }

  .ranking-note {
    padding: 13px !important;
    border-radius: 16px !important;
    font-size: 13px;
    line-height: 1.62;
  }

  /* 球员详情页 */
  .profile-hero {
    display: block !important;
  }

  .profile-photo-panel {
    position: static !important;
    border-radius: 20px !important;
    margin-bottom: 12px;
  }

  .profile-photo-panel .player-photo-wrap {
    aspect-ratio: 4/3 !important;
  }

  .profile-photo-panel .player-photo-real {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
  }

  .profile-facts {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }

  .fact-box {
    padding: 11px !important;
    border-radius: 14px !important;
  }

  .fact-box strong {
    font-size: 16px !important;
  }

  .article-main {
    padding: 17px !important;
    border-radius: 20px !important;
  }

  .article-main h1 {
    font-size: 24px !important;
    line-height: 1.28 !important;
  }

  .article-main h2 {
    font-size: 20px !important;
    margin-top: 23px !important;
  }

  .article-main p,
  .article-main li {
    font-size: 15.5px !important;
    line-height: 1.78 !important;
  }

  .article-main .lead {
    font-size: 15.8px !important;
    padding: 13px !important;
    border-radius: 0 14px 14px 0 !important;
  }

  .player-quick-links {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .player-quick-links a {
    min-height: 42px;
    align-items: center;
    justify-content: center;
  }

  /* FAQ / 分页 / 风险提示 / 页脚 */
  .faq {
    gap: 9px !important;
  }

  .faq details {
    padding: 13px !important;
    border-radius: 15px !important;
  }

  .faq summary {
    font-size: 15px !important;
    line-height: 1.45 !important;
  }

  .faq p {
    font-size: 14px !important;
    line-height: 1.68 !important;
  }

  .pagination {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 8px !important;
    margin: 18px 0 !important;
  }

  .pagination a,
  .pagination span {
    min-height: 44px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    font-size: 14px;
  }

  .risk-banner {
    padding: 16px !important;
    border-radius: 18px !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .risk-banner h2 {
    font-size: 20px !important;
    margin: 0 0 5px;
  }

  .risk-banner p {
    font-size: 14px !important;
    line-height: 1.65 !important;
  }

  .risk-banner .btn {
    width: 100% !important;
  }

  .footer {
    margin-top: 18px !important;
  }

  .footer-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    padding: 24px 0 !important;
  }

  .footer a {
    min-height: 32px;
  }

  .copyright {
    padding-bottom: calc(15px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

@media (max-width: 430px) {
  .container { width: calc(100% - 22px); }
  .hero-card { min-height: 535px !important; }
  .hero h1, .hero-overlay h2 { font-size: 23px !important; }
  .intro-list { grid-template-columns: 1fr !important; }
}

@media (max-width: 380px) {
  .container { width: calc(100% - 20px); }
  .logo-text { max-width: 50vw !important; }
  .hero-card { min-height: 560px !important; }
  .article-card { grid-template-columns: 104px minmax(0,1fr); }
  .article-card > a { width: 104px; }
  .player-card { grid-template-columns: 86px minmax(0,1fr); }
  .player-card .player-photo-wrap,
  .player-card > a,
  .player-card .player-photo-real,
  .player-card img {
    width: 86px !important;
  }
  .profile-facts,
  .rank-summary {
    grid-template-columns: 1fr !important;
  }
}

@media (min-width: 861px) {
  .mobile-only { display: none !important; }
}


/* Mobile M1 final visual correction */
@media (max-width: 860px) {
  .hero-overlay .kicker{display:none!important}
  .article-card{
    display:flex!important;
    flex-direction:row!important;
    align-items:stretch!important;
  }
  .article-card>a{
    flex:0 0 118px!important;
    width:118px!important;
    min-height:132px!important;
  }
  .article-body{
    flex:1 1 auto!important;
  }
  .player-card{
    display:flex!important;
    flex-direction:row!important;
    align-items:stretch!important;
  }
  .player-card>a,
  .player-card .player-photo-wrap{
    flex:0 0 94px!important;
    width:94px!important;
    height:112px!important;
    display:block!important;
  }
  .player-card-body{
    flex:1 1 auto!important;
  }
}
@media (max-width: 380px) {
  .article-card>a{flex-basis:104px!important;width:104px!important}
  .player-card>a,
  .player-card .player-photo-wrap{flex-basis:86px!important;width:86px!important}
}


/* Mobile homepage image correction */
@media (max-width: 860px) {
  body.home-page .hero-card{
    min-height: 540px!important;
  }
  body.home-page .slide-image-link{
    height: 48%!important;
  }
  body.home-page .hero-overlay{
    inset: 48% 0 0 0!important;
  }
  body.home-page .article-card{
    display:flex!important;
    flex-direction:column!important;
    min-height:0!important;
  }
  body.home-page .article-card>a{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    flex:0 0 auto!important;
  }
  body.home-page .article-card img{
    width:100%!important;
    height:auto!important;
    aspect-ratio:16/10!important;
    object-fit:cover!important;
    object-position:center center!important;
  }
  body.home-page .article-body{
    padding:14px!important;
  }
  body.home-page .article-body h3{
    font-size:17px!important;
    -webkit-line-clamp:2!important;
  }
  body.home-page .article-body p{
    font-size:14px!important;
    -webkit-line-clamp:2!important;
  }
  body.home-page .player-card{
    display:flex!important;
    flex-direction:row!important;
  }
}
@media (max-width:430px){
  body.home-page .hero-card{min-height:560px!important}
}
@media (max-width:380px){
  body.home-page .hero-card{min-height:585px!important}
}


/* ==========================================================
   Mobile M1 hard visual fix
   修复重点：首屏黑屏/大空白/标题竖排/菜单过宽/图片不可见
   ========================================================== */
@media (max-width: 860px) {
  .header-inner{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    min-height:58px!important;
    padding:9px 0!important;
  }
  .logo{
    flex:1 1 auto!important;
    min-width:0!important;
    max-width:calc(100% - 74px)!important;
  }
  .logo-text{
    max-width:100%!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-size:16px!important;
  }
  .menu-toggle{
    flex:0 0 auto!important;
    width:auto!important;
    min-width:58px!important;
    max-width:72px!important;
    margin-left:10px!important;
    padding:0 12px!important;
  }

  /* 首屏轮播改为移动端稳定文档流 */
  .hero-card{
    min-height:0!important;
    aspect-ratio:auto!important;
    display:block!important;
    overflow:hidden!important;
    border-radius:22px!important;
    background:#080c12!important;
  }
  .hero-carousel{
    display:block!important;
    position:relative!important;
  }
  .hero-slide{
    display:none!important;
    position:relative!important;
    inset:auto!important;
    opacity:1!important;
    pointer-events:auto!important;
    min-height:0!important;
  }
  .hero-slide.active{
    display:block!important;
  }
  .slide-image-link{
    position:relative!important;
    inset:auto!important;
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    line-height:0!important;
    z-index:1!important;
  }
  .slide-image-link img,
  .hero-slide img{
    width:100%!important;
    height:auto!important;
    aspect-ratio:16/10!important;
    object-fit:cover!important;
    object-position:center center!important;
    display:block!important;
  }
  .hero-overlay{
    position:relative!important;
    inset:auto!important;
    display:block!important;
    padding:18px!important;
    background:linear-gradient(180deg,rgba(11,17,24,.98),rgba(6,9,14,.99))!important;
    pointer-events:auto!important;
    z-index:2!important;
  }
  .hero-overlay .kicker{
    display:inline-flex!important;
    width:auto!important;
    max-width:100%!important;
    white-space:normal!important;
    font-size:12px!important;
    line-height:1.35!important;
    margin:0 0 10px!important;
    padding:5px 10px!important;
  }
  .hero h1,
  .hero-overlay h2{
    font-size:24px!important;
    line-height:1.24!important;
    margin:0 0 10px!important;
    max-width:100%!important;
    word-break:normal!important;
    overflow-wrap:break-word!important;
    writing-mode:horizontal-tb!important;
  }
  .hero p{
    font-size:15px!important;
    line-height:1.65!important;
    margin:0!important;
    max-width:100%!important;
  }
  .hero-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:9px!important;
    margin-top:13px!important;
    width:100%!important;
  }
  .hero-actions .btn{
    width:100%!important;
    min-height:44px!important;
  }
  .carousel-dots{
    position:relative!important;
    left:auto!important;
    bottom:auto!important;
    padding:12px 18px 16px!important;
    display:flex!important;
    gap:8px!important;
    background:#060a0f!important;
  }

  /* 首页文章图片区：保持大图卡，不要小图挤压 */
  body.home-page .article-card{
    display:flex!important;
    flex-direction:column!important;
    min-height:0!important;
  }
  body.home-page .article-card>a{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    flex:0 0 auto!important;
  }
  body.home-page .article-card img{
    width:100%!important;
    height:auto!important;
    aspect-ratio:16/10!important;
    object-fit:cover!important;
    object-position:center center!important;
  }
  body.home-page .article-body{
    padding:14px!important;
  }

  /* 列表卡稳定化 */
  body:not(.home-page) .article-card{
    display:flex!important;
    flex-direction:row!important;
    align-items:stretch!important;
  }
  body:not(.home-page) .article-card>a{
    flex:0 0 118px!important;
    width:118px!important;
    min-height:132px!important;
  }
  body:not(.home-page) .article-card img{
    height:100%!important;
    aspect-ratio:auto!important;
  }
  .player-card{
    display:flex!important;
    flex-direction:row!important;
    align-items:stretch!important;
  }
  .player-card>a,
  .player-card .player-photo-wrap{
    flex:0 0 96px!important;
    width:96px!important;
    height:116px!important;
    display:block!important;
  }
  .player-card .player-photo-real,
  .player-card img{
    width:96px!important;
    height:116px!important;
    object-fit:cover!important;
    object-position:center top!important;
  }
  .player-card-body{
    flex:1 1 auto!important;
    min-width:0!important;
  }
}

@media (max-width:430px){
  .hero-overlay .kicker{font-size:11px!important}
  .hero h1,.hero-overlay h2{font-size:23px!important}
}

@media (max-width:380px){
  .hero h1,.hero-overlay h2{font-size:22px!important}
  body:not(.home-page) .article-card>a{flex-basis:104px!important;width:104px!important}
  .player-card>a,
  .player-card .player-photo-wrap,
  .player-card .player-photo-real,
  .player-card img{flex-basis:88px!important;width:88px!important}
}


/* ==========================================================
   Mobile UX Compact Layer
   目标：减少长滚动、增强视觉层次、避免区块单一
   ========================================================== */
@media (max-width: 860px) {
  body.home-page .mobile-hide-heavy{
    display:none!important;
  }

  .mobile-hub{
    display:block!important;
    padding-top:10px!important;
  }

  .mobile-hub-card{
    background:
      radial-gradient(circle at 84% 10%, rgba(212,175,55,.12), transparent 32%),
      linear-gradient(180deg, rgba(17,24,33,.96), rgba(8,12,18,.96));
    border:1px solid rgba(212,175,55,.18);
    border-radius:22px;
    box-shadow:0 24px 70px rgba(0,0,0,.38);
    padding:16px;
  }

  .mobile-hub-head h2{
    margin:8px 0 6px;
    color:#fff;
    font-size:22px;
    line-height:1.28;
  }

  .mobile-hub-head p{
    margin:0;
    color:#aeb6c3;
    font-size:14px;
    line-height:1.6;
  }

  .mobile-shortcuts{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:9px;
    margin-top:13px;
  }

  .mobile-shortcuts a{
    min-height:74px;
    border-radius:16px;
    background:rgba(255,255,255,.045);
    border:1px solid rgba(255,255,255,.08);
    padding:11px;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }

  .mobile-shortcuts strong{
    color:#f1d584;
    font-size:17px;
    line-height:1.2;
  }

  .mobile-shortcuts span{
    color:#b4bcc9;
    font-size:12px;
    margin-top:4px;
  }

  .mobile-readpath{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:7px;
    margin-top:12px;
  }

  .mobile-readpath div{
    border-radius:14px;
    background:rgba(14,77,43,.18);
    border:1px solid rgba(14,77,43,.34);
    padding:9px 4px;
    text-align:center;
  }

  .mobile-readpath b{
    display:block;
    width:24px;
    height:24px;
    line-height:24px;
    border-radius:50%;
    margin:0 auto 5px;
    background:rgba(212,175,55,.16);
    color:#f1d584;
    font-size:13px;
  }

  .mobile-readpath span{
    font-size:11.5px;
    color:#d6dbe5;
    white-space:nowrap;
  }

  .mobile-section-tip{
    display:block!important;
    margin:-6px 0 10px!important;
    color:#8f98a8;
    font-size:12.5px;
    line-height:1.5;
  }

  body.home-page .section-head{
    display:flex!important;
    align-items:flex-end!important;
    justify-content:space-between!important;
    gap:10px!important;
  }

  body.home-page .section-head h2{
    font-size:21px!important;
  }

  body.home-page .section-head p{
    display:none!important;
  }

  body.home-page .section-head .readmore{
    flex:0 0 auto;
    font-size:12px;
    white-space:nowrap;
    padding-bottom:2px;
  }

  /* 首页球员与文章改为横向内容带，减少垂直长度 */
  body.home-page .rank-grid,
  body.home-page .grid-3{
    display:flex!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    gap:12px!important;
    padding:2px 2px 12px!important;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
  }

  body.home-page .rank-grid::-webkit-scrollbar,
  body.home-page .grid-3::-webkit-scrollbar{
    height:4px;
  }

  body.home-page .rank-grid::-webkit-scrollbar-thumb,
  body.home-page .grid-3::-webkit-scrollbar-thumb{
    background:rgba(212,175,55,.28);
    border-radius:999px;
  }

  body.home-page .article-card{
    flex:0 0 82%!important;
    scroll-snap-align:start;
    display:flex!important;
    flex-direction:column!important;
    min-height:0!important;
    border-radius:20px!important;
  }

  body.home-page .article-card img{
    aspect-ratio:16/9!important;
    object-fit:cover!important;
    object-position:center!important;
  }

  body.home-page .player-card{
    flex:0 0 82%!important;
    scroll-snap-align:start;
    min-height:116px!important;
    border-radius:20px!important;
  }

  body.home-page .player-card>a,
  body.home-page .player-card .player-photo-wrap,
  body.home-page .player-card .player-photo-real,
  body.home-page .player-card img{
    width:104px!important;
    height:124px!important;
    flex-basis:104px!important;
  }

  /* 首页 FAQ 减少一次性展开的长度 */
  body.home-page .faq details:nth-of-type(n+4){
    display:none!important;
  }

  body.home-page .risk-banner{
    margin-top:4px!important;
  }

  body.home-page .footer-grid{
    padding-top:20px!important;
  }
}

@media (max-width: 430px){
  body.home-page .article-card,
  body.home-page .player-card{
    flex-basis:86%!important;
  }
}

@media (max-width: 380px){
  .mobile-shortcuts{grid-template-columns:1fr!important}
  .mobile-readpath{grid-template-columns:1fr 1fr!important}
  body.home-page .article-card,
  body.home-page .player-card{
    flex-basis:90%!important;
  }
}
