/* ===== 首页「社区排行」四栏模块（ranking）：1:1 复刻参考站 home-rank 卡片 ===== */
.pcgh-home-ranking-section{--rk-radius:8px;--rk-surface:var(--pcgh-surface,#181c25);--rk-line:var(--pcgh-border,#2c3342);--rk-text:var(--pcgh-text,#f3f5f7);--rk-muted:var(--pcgh-text-2,#8b93a7);--rk-media:var(--pcgh-surface-2,#0b0d12);--rk-shadow:0 8px 24px #00000059;position:relative;background:transparent;padding:44px 0 8px;margin:0 0 28px}
html[data-pcgh-theme-resolved=light] .pcgh-home-ranking-section{--rk-shadow:0 8px 24px #0f172a14}
html[data-pcgh-theme-resolved=light] .pcgh-ranking-board{--rank-ink:var(--rank-tone)}
@supports (color:color-mix(in srgb,red 50%,blue)){html[data-pcgh-theme-resolved=light] .pcgh-ranking-board{--rank-ink:color-mix(in srgb,var(--rank-tone) 82%,#111827)}}
.pcgh-home-ranking-section,.pcgh-home-ranking-section *,.pcgh-home-ranking-section *::before,.pcgh-home-ranking-section *::after{box-sizing:border-box}
.pcgh-home-ranking-section .pcgh-container{width:min(100%,var(--pcgh-container-w,1200px));max-width:var(--pcgh-container-w,1200px);margin-right:auto;margin-left:auto;padding-right:0;padding-left:0}
.pcgh-ranking-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;min-width:0;margin-bottom:16px;position:relative}
.pcgh-ranking-head h2{margin:0 0 4px;color:var(--rk-text);font-size:28px;font-weight:700;line-height:1.4}
.pcgh-ranking-head p{margin:0;color:var(--rk-muted);font-size:14px;line-height:1.5}
.pcgh-ranking-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:stretch;position:relative;z-index:1}
.pcgh-ranking-board{--rank-tone:#66c0f4;--rank-tone-soft:#66c0f41f;--rank-tone-chip:#66c0f42e;--rank-tone-ink:#cfe8fd;--rank-ink:var(--rank-tone-ink);--rank-foot-bg:none;display:grid;grid-template-rows:auto auto 1fr auto;gap:10px;min-width:0;min-height:100%;padding:14px 14px 0;border:1px solid var(--rk-line);border-radius:var(--rk-radius);background:var(--rk-surface);box-shadow:var(--rk-shadow);color:var(--rk-text);overflow:hidden}
.pcgh-ranking-board-head{display:flex;justify-content:space-between;align-items:center;gap:8px;min-width:0}
.pcgh-ranking-board-title{display:flex;align-items:center;gap:6px;min-width:0;padding-left:10px;position:relative}
.pcgh-ranking-board-title:before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:3px;border-radius:var(--rk-radius);background:var(--rank-tone)}
.pcgh-ranking-board-icon{display:grid;place-items:center;width:20px;height:28px;color:var(--rank-tone);font-size:16px;flex:none}
.pcgh-ranking-board-icon :where(i,svg){width:18px;height:18px}
.pcgh-ranking-board-copy{display:grid;gap:1px;min-width:0}
.pcgh-ranking-board-copy h3{margin:0;color:var(--rk-text);font-size:16px;font-weight:700;line-height:1.5}
.pcgh-ranking-board-copy p{margin:0;color:var(--rk-muted);font-size:12px;line-height:1.5}
.pcgh-ranking-more{display:inline-flex;align-items:center;gap:4px;flex:none;min-height:30px;padding:0 4px 0 8px;border:1px solid var(--rank-tone-chip);border-radius:var(--rk-radius);background:var(--rank-tone-soft);color:var(--rank-ink);font-size:12px;font-weight:700;white-space:nowrap;line-height:1;text-decoration:none;transition:color .15s,border-color .15s,background-color .15s,transform .15s}
.pcgh-ranking-more-ico{display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:var(--rank-tone);color:#fff;font-size:12px;transition:transform .15s}
.pcgh-ranking-more-ico :where(i,svg){width:12px;height:12px}
.pcgh-ranking-more:hover{border-color:var(--rank-tone);background:var(--rank-tone-chip);color:var(--rank-ink);transform:translateX(2px)}
.pcgh-ranking-more:hover .pcgh-ranking-more-ico{transform:translateX(1.6px)}
.pcgh-ranking-lead{display:block;min-width:0;color:inherit;text-decoration:none}
.pcgh-ranking-lead-media{display:block;position:relative;width:100%;aspect-ratio:16/9;border:1px solid var(--rk-line);border-radius:var(--rk-radius);background:var(--rk-media);box-shadow:0 1px 2px #00000059;overflow:hidden}
.pcgh-ranking-lead-media img{display:block;width:100%;height:100%;object-fit:cover;object-position:center center;transition:transform .3s}
.pcgh-ranking-lead:hover .pcgh-ranking-lead-media img{transform:scale(1.03)}
.pcgh-ranking-lead-badge{display:grid;place-items:center;position:absolute;z-index:2;top:8px;left:8px;min-width:32px;height:26px;padding:0 6px;border-radius:var(--rk-radius);background:var(--rank-tone);color:#fff;font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1;box-shadow:0 1px 2px #00000059}
.pcgh-ranking-lead-cap{display:flex;justify-content:space-between;align-items:center;gap:8px;min-width:0;margin-top:7px;padding:0 1px;background:0 0}
.pcgh-ranking-lead-copy{display:flex;align-items:center;gap:5px;min-width:0}
.pcgh-ranking-lead-copy strong{min-width:0;color:var(--rk-text);font-size:14px;font-weight:700;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pcgh-ranking-lead:hover .pcgh-ranking-lead-copy strong{color:var(--rank-tone)}
.pcgh-ranking-lead-score{display:inline-flex;align-items:center;gap:3px;flex:none;color:var(--rank-ink);font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;line-height:1}
.pcgh-ranking-lead-score :where(i,svg){color:var(--rank-tone);width:14px;height:14px}
.pcgh-ranking-track{display:grid;gap:3px;margin:0;padding:0;list-style:none;align-content:start}
.pcgh-ranking-item{display:grid;grid-template-columns:30px 60px minmax(0,1fr) auto;gap:8px;align-items:center;min-width:0;padding:4.5px 3px;border:1px solid transparent;border-radius:var(--rk-radius);color:inherit;text-decoration:none;transition:background-color .15s}
.pcgh-ranking-item:hover{background:var(--rank-tone-soft)}
.pcgh-ranking-item:hover .pcgh-ranking-meta strong{color:var(--rank-tone)}
.pcgh-ranking-no{display:grid;place-items:center;width:28px;height:28px;border-radius:var(--rk-radius);background:var(--rank-tone-chip);color:var(--rank-ink);font-size:13px;font-weight:700;text-align:center;font-variant-numeric:tabular-nums;line-height:1}
.pcgh-ranking-no[data-top=true]{background:var(--rank-tone);color:#fff}
.pcgh-ranking-art{display:grid;place-items:center;position:relative;width:60px;height:40px;flex-shrink:0;border:1px solid var(--rk-line);border-radius:var(--rk-radius);background:var(--rk-media);color:var(--rk-muted);font-size:13px;font-weight:700;overflow:hidden}
.pcgh-ranking-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:center center}
.pcgh-ranking-meta{display:flex;align-items:center;gap:5px;min-width:0}
.pcgh-ranking-meta strong{min-width:0;color:var(--rk-text);font-size:13px;font-weight:600;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pcgh-ranking-score{display:inline-flex;justify-content:flex-end;align-items:center;gap:3px;min-width:48px;color:var(--rank-ink);font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;line-height:1}
.pcgh-ranking-score :where(i,svg){color:var(--rank-tone);width:13px;height:13px}
.pcgh-ranking-board-foot{display:flex;justify-content:center;align-items:center;gap:6px;isolation:isolate;position:relative;min-height:64px;margin:2px -14px 0;padding:18px 12px 8px;color:var(--rank-ink);font-size:13px;font-weight:700;line-height:1.4}
.pcgh-ranking-board-foot:before{content:"";position:absolute;inset:-10px 0 0;z-index:-1;pointer-events:none;background-image:var(--rank-foot-bg);background-position:bottom;background-repeat:no-repeat;background-size:100% 100%}
.pcgh-ranking-board-foot-icon{display:grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;background:var(--rank-tone-chip);color:var(--rank-tone);font-size:13px}
.pcgh-ranking-board-foot-icon :where(i,svg){width:13px;height:13px}
@media (max-width:1399px){.pcgh-ranking-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:768px){.pcgh-home-ranking-section{padding-top:26px}.pcgh-home-ranking-section .pcgh-container{padding-right:16px;padding-left:16px}.pcgh-ranking-head h2{font-size:22px}.pcgh-ranking-grid{grid-template-columns:minmax(0,1fr);gap:12px}.pcgh-ranking-board{padding:12px 12px 0}.pcgh-ranking-board-foot{margin:2px -12px 0}.pcgh-ranking-item{grid-template-columns:24px 48px minmax(0,1fr) auto;gap:6px}.pcgh-ranking-no{width:24px;height:24px;font-size:12px}.pcgh-ranking-art{width:48px;height:34px}}