/* 랭커픽(/top3) V2 — podium cards, dark tables, two-column hit-rate cards. Scoped to .pd-hub-v2 (ranking_hub.html only).
   Remove the loadFile() line in dispPredictionRankingTop() to restore the previous look. */
.pd-pick-hub.pd-hub-v2 { --hv-gold-a:#ffe38a; --hv-gold-b:#d9a21f; --hv-silver-a:#e8edf8; --hv-silver-b:#9aa6bf; --hv-bronze-a:#f0b184; --hv-bronze-b:#a8653a; --hv-line:rgba(var(--rt-brand-rgb),.3); --hv-mint:#2ee6a6; --hv-purple:#a77bff; }
.pd-hub-v2 .pd-hub-defs { position:absolute; width:0; height:0; overflow:hidden; }

/* header */
.pd-hub-v2 .pd-hub-head { position:relative; display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:84px; padding:14px 22px; overflow:hidden; border:1px solid var(--hv-line); border-radius:16px;
  background:radial-gradient(60% 140% at 78% 0%,rgba(var(--rt-brand-rgb),.34),transparent 62%),radial-gradient(40% 90% at 8% 100%,rgba(70,120,255,.14),transparent 70%),linear-gradient(120deg,#171a42,#0b1030 62%); }
.pd-hub-v2 .pd-hub-head h1 { font-size:26px; font-weight:900; letter-spacing:-.3px; }
.pd-hub-v2 .pd-hub-head p { font-size:14px; }
.pd-hub-v2 .pd-hub-title-icon { flex-basis:56px; width:56px; height:56px; border:1px solid var(--hv-line); border-radius:14px; background:linear-gradient(145deg,rgba(var(--rt-brand-rgb),.34),rgba(var(--rt-brand-rgb),.1)); box-shadow:0 0 22px rgba(var(--rt-brand-rgb),.28); color:#d8c6ff; }
.pd-hub-v2 .pd-hub-title-icon svg { width:28px; height:28px; }
.pd-hub-v2 .pd-hub-tagline { display:flex; align-items:center; gap:10px; margin:0; color:#cfd6f5; font-size:13px; line-height:1.5; text-align:center; }
.pd-hub-v2 .pd-hub-tagline svg { flex:none; width:26px; height:38px; fill:#d9a21f; opacity:.85; }
.pd-hub-v2 .pd-hub-tagline svg.is-flip { transform:scaleX(-1); }

/* podium cards */
.pd-hub-v2 .pd-hub-featured { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:end; gap:20px; margin:46px 0 20px; }
.pd-hub-v2 .pd-hub-feature-card { --pod-rgb:160,176,226; --pod-a:var(--hv-silver-a); --pod-b:var(--hv-silver-b);
  position:relative; display:grid; grid-template-columns:112px minmax(0,1fr); grid-template-areas:"art body" "pick pick"; column-gap:14px; align-items:center; min-width:0; box-sizing:border-box; overflow:visible;
  padding:20px 20px 18px; border:1px solid rgba(var(--pod-rgb),.5); border-radius:16px; color:var(--rt-text); text-decoration:none;
  background:radial-gradient(130% 70% at 20% 0%,rgba(var(--pod-rgb),.22),transparent 62%),radial-gradient(circle at 90% 18%,rgba(255,255,255,.5) 0 1px,transparent 1.6px),radial-gradient(circle at 56% 8%,rgba(var(--pod-rgb),.5) 0 1.2px,transparent 1.8px),linear-gradient(180deg,#151a3a,#0a1028);
  box-shadow:0 0 0 1px rgba(var(--pod-rgb),.12),0 16px 36px rgba(var(--pod-rgb),.12); transition:transform .16s ease,box-shadow .16s ease; }
.pd-hub-v2 .pd-hub-feature-card::before { content:none; }
.pd-hub-v2 .pd-hub-feature-card:hover { transform:translateY(-2px); }
.pd-hub-v2 .pd-hub-feature-card.is-rank1 { --pod-rgb:240,190,60; --pod-a:var(--hv-gold-a); --pod-b:var(--hv-gold-b); order:2; grid-template-columns:136px minmax(0,1fr); padding:30px 22px 20px; border-width:2px; box-shadow:0 0 0 1px rgba(var(--pod-rgb),.22),0 22px 52px rgba(var(--pod-rgb),.22); }
.pd-hub-v2 .pd-hub-feature-card.is-rank2 { order:1; }
.pd-hub-v2 .pd-hub-feature-card.is-rank3 { order:3; --pod-rgb:226,140,88; --pod-a:var(--hv-bronze-a); --pod-b:var(--hv-bronze-b); }
.pd-hub-v2 .pd-hub-art { grid-area:art; position:relative; width:112px; height:112px; }
.pd-hub-v2 .is-rank1 .pd-hub-art { width:136px; height:136px; }
.pd-hub-v2 .pd-hub-laurel { position:absolute; inset:0; width:100%; height:100%; fill:var(--pod-b); opacity:.92; filter:drop-shadow(0 0 6px rgba(var(--pod-rgb),.4)); }
.pd-hub-v2 .pd-hub-laurel use { fill:inherit; }
.pd-hub-v2 .pd-hub-art .pd-hub-crown { position:absolute; left:50%; top:-40px; width:64px; height:50px; transform:translateX(-50%); fill:var(--pod-a); stroke:none; filter:drop-shadow(0 2px 8px rgba(var(--pod-rgb),.6)); }
.pd-pick-hub.pd-hub-v2 .pd-hub-art .pd-rank-no.pd-hub-rank { position:absolute; left:50%; top:50%; display:grid; place-items:center; width:54px; height:54px; min-width:0; transform:translate(-50%,-50%); border:2px solid rgba(255,255,255,.6); border-radius:50%; background:linear-gradient(160deg,var(--pod-a),var(--pod-b)); color:#2a1d05; font-size:28px; font-weight:900; box-shadow:0 5px 16px rgba(0,0,0,.5),0 0 0 4px rgba(var(--pod-rgb),.2); }
.pd-pick-hub.pd-hub-v2 .is-rank1 .pd-hub-art .pd-rank-no.pd-hub-rank { width:68px; height:68px; font-size:36px; }
.pd-hub-v2 .pd-hub-feature-body { grid-area:body; min-width:0; text-align:left; }
.pd-hub-v2 .pd-hub-feature-name { display:block; margin:0; overflow:hidden; color:#fff; font-size:21px; font-weight:800; text-align:left; text-overflow:ellipsis; white-space:nowrap; }
.pd-hub-v2 .is-rank1 .pd-hub-feature-name { font-size:25px; }
.pd-hub-v2 .pd-hub-feature-profit { margin:6px 0 0; text-align:left; }
.pd-hub-v2 .pd-hub-feature-profit small { display:block; margin:0 0 1px; color:var(--rt-text-2); font-size:13px; font-weight:600; }
.pd-hub-v2 .pd-hub-feature-profit b { display:block; font-size:36px; font-weight:900; letter-spacing:-.4px; line-height:1.1; font-variant-numeric:tabular-nums; }
.pd-hub-v2 .is-rank1 .pd-hub-feature-profit b { font-size:44px; }
.pd-hub-v2 .pd-hub-feature-profit b.pd-profit-up { color:var(--hv-mint); text-shadow:0 0 20px rgba(46,230,166,.26); }
.pd-hub-v2 .pd-hub-feature-rate { margin:6px 0 0; text-align:left; color:var(--rt-text-2); font-size:14px; }
.pd-hub-v2 .pd-hub-feature-rate b { color:#fff; font-weight:800; }
.pd-hub-v2 .pd-hub-feature-pick { grid-area:pick; display:grid; grid-template-columns:auto minmax(0,1fr); grid-template-rows:auto auto auto; column-gap:12px; margin-top:16px; padding:11px 14px 12px; border:1px solid rgba(var(--pod-rgb),.34); border-radius:12px; background:rgba(4,9,26,.62); }
.pd-hub-v2 .pd-hub-feature-meta { grid-column:1 / -1; }
.pd-hub-v2 .pd-hub-feature-meta small { color:#fff; font-size:14px; font-weight:700; }
.pd-hub-v2 .pd-hub-event { grid-column:1 / -1; margin-top:6px; overflow:hidden; color:var(--rt-text-2); font-size:13px; text-align:center; text-overflow:ellipsis; white-space:nowrap; }
.pd-hub-v2 .pd-hub-pick-title { grid-column:1; margin-top:4px; max-width:100%; justify-self:end; overflow:hidden; color:#fff; font-size:15px; font-weight:800; text-align:right; text-overflow:ellipsis; white-space:nowrap; }
.pd-hub-v2 .pd-hub-pick-odds { grid-column:2; margin-top:4px; padding-left:12px; border-left:1px solid rgba(255,255,255,.18); color:var(--hv-purple); font-size:14px; font-weight:800; white-space:nowrap; }
.pd-hub-v2 .pd-hub-no-pick { grid-area:pick; margin:16px 0 0; }

/* sections */
.pd-hub-v2 .pd-hub-sections { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.pd-hub-v2 .pd-hub-section[data-hub-sort="total_profit"], .pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_100"] { grid-column:1 / -1; }
/* PC(≥1024px): 부문 섹션을 모두 가로 100% 한 줄씩 쌓고, 헤더 오른쪽 문구(월계수 장식 포함)와 상단 월계수 TOP3 카드(.pd-hub-featured, 아래 수익순 표와 중복)는 뺀다. */
@media (min-width:1024px) { .pd-hub-v2 .pd-hub-sections { grid-template-columns:minmax(0,1fr); } .pd-hub-v2 .pd-hub-tagline { display:none; } .pd-hub-v2 .pd-hub-featured { display:none; } }
.pd-hub-v2 .pd-hub-section { min-width:0; overflow:hidden; border:1px solid var(--hv-line); border-radius:16px; background:linear-gradient(180deg,rgba(13,19,46,.96),rgba(8,13,34,.98)); }
.pd-hub-v2 .pd-hub-section-head { gap:12px; padding:14px 18px 12px; }
.pd-hub-v2 .pd-hub-section-icon { flex:0 0 40px; width:40px; height:40px; border:1px solid var(--hv-line); border-radius:11px; background:linear-gradient(145deg,rgba(var(--rt-brand-rgb),.3),rgba(var(--rt-brand-rgb),.08)); font-size:18px; }
.pd-hub-v2 .pd-hub-section[data-hub-sort="total_profit"] .pd-hub-section-icon { color:var(--hv-mint); border-color:rgba(46,230,166,.35); background:rgba(46,230,166,.1); }
.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_100"] .pd-hub-section-icon { color:#ffd25e; border-color:rgba(255,210,94,.4); background:rgba(255,210,94,.1); }
.pd-hub-v2 .pd-hub-section-head h2 { font-size:19px; font-weight:800; }
.pd-hub-v2 .pd-hub-section-head p { font-size:13px; color:var(--rt-text-2); }
.pd-hub-v2 .pd-hub-list-head { background:rgba(var(--rt-brand-rgb),.07); border-block:1px solid var(--hv-line); color:var(--rt-text-2); font-size:13px; }
.pd-hub-v2 .pd-hub-pick-list { padding:0 10px 8px; }
.pd-hub-v2 .pd-hub-pick-row { min-height:50px; border-bottom:1px solid rgba(var(--rt-brand-rgb),.14); }
.pd-hub-v2 .pd-hub-row-rank .pd-rank-no { width:30px; height:30px; min-width:30px; border:2px solid var(--hv-silver-b); background:rgba(255,255,255,.03); color:#e6ebf7; font-size:13px; font-weight:800; }
.pd-hub-v2 .pd-hub-row-rank .pd-rank-no.is-top1 { border-color:var(--hv-gold-b); color:var(--hv-gold-a); box-shadow:0 0 10px rgba(240,190,60,.35); }
.pd-hub-v2 .pd-hub-row-rank .pd-rank-no.is-top2 { border-color:var(--hv-silver-b); color:var(--hv-silver-a); }
.pd-hub-v2 .pd-hub-row-rank .pd-rank-no.is-top3 { border-color:var(--hv-bronze-b); color:var(--hv-bronze-a); box-shadow:0 0 10px rgba(226,140,88,.3); }
.pd-hub-v2 .pd-hub-row-tipster { font-size:15px; font-weight:800; }
.pd-hub-v2 .pd-hub-row-profit b { font-size:15px; font-weight:800; }
.pd-hub-v2 .pd-hub-row-profit b.pd-profit-up { color:var(--hv-mint); }
.pd-hub-v2 .pd-hub-row-rate b { color:var(--hv-purple); font-size:15px; font-weight:800; }
.pd-hub-v2 .pd-hub-row-event b, .pd-hub-v2 .pd-hub-row-pick b { font-weight:600; }
.pd-hub-v2 .pd-hub-row-pick b { color:#fff; font-weight:700; }
.pd-hub-v2 .pd-hub-row-result b { display:inline-flex; align-items:center; justify-content:center; min-width:46px; height:26px; padding:0 10px; border:1px solid rgba(110,150,255,.55); border-radius:999px; background:rgba(60,100,230,.14); color:#7fa5ff; font-size:12px; font-weight:800; }
.pd-hub-v2 .pd-hub-pick-row.pd-pick-win .pd-hub-row-result b { border-color:rgba(46,230,166,.55); background:rgba(46,230,166,.12); color:var(--hv-mint); }
.pd-hub-v2 .pd-hub-pick-row:is(.pd-pick-lose,.pd-pick-lost) .pd-hub-row-result b { border-color:rgba(239,71,111,.5); background:rgba(239,71,111,.12); color:#ff8da4; }
.pd-hub-v2 .pd-hub-feature-card .pd-hub-result { display:inline-flex; align-items:center; justify-content:center; min-width:44px; height:26px; padding:0 11px; border:1px solid rgba(110,150,255,.55); border-radius:999px; background:rgba(60,100,230,.14); color:#7fa5ff; font-size:12px; font-weight:800; }
.pd-hub-v2 .pd-hub-feature-card.pd-pick-win .pd-hub-result { border-color:rgba(46,230,166,.55); background:rgba(46,230,166,.12); color:var(--hv-mint); }
.pd-hub-v2 .pd-hub-feature-card:is(.pd-pick-lose,.pd-pick-lost) .pd-hub-result { border-color:rgba(239,71,111,.5); background:rgba(239,71,111,.12); color:#ff8da4; }

/* empty state */
.pd-hub-v2 .pd-hub-compact-empty { display:flex; flex-direction:column; align-items:center; gap:6px; margin:4px 14px 14px; padding:30px 16px; border:1px solid rgba(var(--rt-brand-rgb),.2); border-radius:12px; background:rgba(5,10,28,.5); text-align:center; }
.pd-hub-v2 .pd-hub-empty-ico { width:44px; height:44px; margin-bottom:4px; fill:none; stroke:#9fb2ff; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; opacity:.85; }
.pd-hub-v2 .pd-hub-compact-empty strong { color:#fff; font-size:16px; font-weight:700; }
.pd-hub-v2 .pd-hub-compact-empty span { color:var(--rt-text-2); font-size:13px; }
.pd-hub-v2 .pd-hub-featured > .pd-hub-compact-empty { grid-column:1 / -1; }

/* half-width hit-rate cards: stacked row layout — 가로 100%인 PC(≥1024px)는 수익순과 같은 표를 쓰므로 901~1023px 에서만 쓴다. */
@media (min-width:901px) and (max-width:1023px) {
 .pd-hub-v2 .pd-hub-section[data-hub-sort^="percentage_pick"] .pd-hub-list-head { display:none; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort^="percentage_pick"] .pd-hub-row-rank { grid-area:rank; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort^="percentage_pick"] .pd-hub-row-tipster { grid-area:tip; text-align:left; padding:0; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort^="percentage_pick"] .pd-hub-row-profit { grid-area:profit; text-align:right; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort^="percentage_pick"] .pd-hub-row-rate { grid-area:rate; text-align:right; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort^="percentage_pick"] .pd-hub-row-event { grid-area:event; text-align:left; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort^="percentage_pick"] .pd-hub-row-pick { grid-area:pick; text-align:left; padding:0; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort^="percentage_pick"] .pd-hub-row-odds { grid-area:odds; text-align:right; padding:0; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort^="percentage_pick"] .pd-hub-row-result { grid-area:result; text-align:right; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort^="percentage_pick"] .pd-hub-row-event b { color:var(--rt-text-2); font-size:12.5px; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort^="percentage_pick"] .pd-hub-pick-row { display:grid; grid-template-columns:34px minmax(0,1fr) auto auto; grid-template-areas:"rank tip profit rate" ". event event event" ". pick odds result"; gap:4px 12px; align-items:center; padding:10px 6px; }
}
@media (max-width:1100px) { .pd-hub-v2 .pd-hub-featured { gap:12px; } .pd-hub-v2 .pd-hub-feature-card { grid-template-columns:84px minmax(0,1fr); padding:16px 14px; } .pd-hub-v2 .pd-hub-art { width:84px; height:84px; } .pd-hub-v2 .is-rank1 .pd-hub-art { width:104px; height:104px; } .pd-hub-v2 .pd-hub-feature-card.is-rank1 { grid-template-columns:104px minmax(0,1fr); } .pd-pick-hub.pd-hub-v2 .pd-hub-art .pd-rank-no.pd-hub-rank { width:42px; height:42px; font-size:22px; } .pd-pick-hub.pd-hub-v2 .is-rank1 .pd-hub-art .pd-rank-no.pd-hub-rank { width:52px; height:52px; font-size:28px; } .pd-hub-v2 .pd-hub-feature-profit b { font-size:26px; } .pd-hub-v2 .is-rank1 .pd-hub-feature-profit b { font-size:32px; } .pd-hub-v2 .pd-hub-feature-name { font-size:17px; } .pd-hub-v2 .is-rank1 .pd-hub-feature-name { font-size:20px; } }
@media (max-width:900px) {
 .pd-hub-v2 .pd-hub-tagline { display:none; }
 .pd-hub-v2 .pd-hub-sections { grid-template-columns:1fr; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort] { grid-column:auto; }
}
/* 모바일(≤767px): 상단 소개 카드와 TOP3 시상대를 숨긴다. 마크업은 PC·태블릿 공용이라 지우지 않는다. */
@media (max-width:767px) { .pd-hub-v2 .pd-hub-head, .pd-hub-v2 .pd-hub-featured { display:none; } }
@media (max-width:640px) {
 .pd-hub-v2 .pd-hub-head { min-height:0; padding:12px 14px; }
 .pd-hub-v2 .pd-hub-head h1 { font-size:21px; }
 .pd-hub-v2 .pd-hub-featured { grid-template-columns:1fr 1fr; gap:64px 10px; margin-top:88px; }
 .pd-hub-v2 .pd-hub-feature-card, .pd-hub-v2 .pd-hub-feature-card.is-rank1 { grid-template-columns:minmax(0,1fr); grid-template-areas:"art" "body" "pick"; justify-items:center; row-gap:6px; padding:0 10px 12px; }
 .pd-hub-v2 .pd-hub-feature-card.is-rank1 { grid-column:1 / -1; order:1; }
 .pd-hub-v2 .pd-hub-art, .pd-hub-v2 .is-rank1 .pd-hub-art { position:relative; width:92px; height:92px; margin-top:-48px; }
 .pd-hub-v2 .is-rank1 .pd-hub-art { width:124px; height:124px; margin-top:-62px; }
 .pd-hub-v2 .pd-hub-art .pd-hub-crown { width:46px; height:36px; top:-30px; }
 .pd-hub-v2 .pd-hub-feature-body { width:100%; text-align:center; }
 .pd-hub-v2 .pd-hub-feature-name, .pd-hub-v2 .pd-hub-feature-profit, .pd-hub-v2 .pd-hub-feature-rate { text-align:center; }
 .pd-hub-v2 .pd-hub-feature-profit b { font-size:24px; } .pd-hub-v2 .is-rank1 .pd-hub-feature-profit b { font-size:34px; }
 .pd-hub-v2 .pd-hub-feature-name { font-size:16px; } .pd-hub-v2 .is-rank1 .pd-hub-feature-name { font-size:21px; }
 .pd-pick-hub.pd-hub-v2 .pd-hub-art .pd-rank-no.pd-hub-rank { width:38px; height:38px; font-size:20px; } .pd-pick-hub.pd-hub-v2 .is-rank1 .pd-hub-art .pd-rank-no.pd-hub-rank { width:54px; height:54px; font-size:29px; }
 .pd-hub-v2 .pd-hub-feature-pick { width:100%; margin-top:8px; padding:8px 8px 9px; }
 .pd-hub-v2 .pd-hub-feature-card:not(.is-rank1) .pd-hub-feature-pick { grid-template-columns:1fr; }
 .pd-hub-v2 .pd-hub-feature-card:not(.is-rank1) .pd-hub-pick-title { grid-column:1; justify-self:center; text-align:center; }
 .pd-hub-v2 .pd-hub-feature-card:not(.is-rank1) .pd-hub-pick-odds { grid-column:1; justify-self:center; padding-left:0; border-left:0; }
 .pd-hub-v2 .pd-hub-event { font-size:11.5px; }
 .pd-hub-v2 .pd-hub-section-head { padding:12px 13px 10px; } .pd-hub-v2 .pd-hub-section-head h2 { font-size:16px; } .pd-hub-v2 .pd-hub-section-head p { font-size:11.5px; }
}

/* 팀 로고: 경기명 앞에 확인된 로고만 그린다. 없으면 팀명만 남는다. */
.pd-hub-v2 .pd-hub-team { display:inline-flex; align-items:center; gap:6px; min-width:0; }
.pd-hub-v2 .pd-hub-logo { flex:none; display:inline-flex; width:18px; height:18px; }
.pd-hub-v2 .pd-hub-logo img { width:18px; height:18px; object-fit:contain; }
.pd-hub-v2 .pd-hub-vs { flex:none; color:var(--rt-text-2); font-size:11px; font-weight:600; }
.pd-hub-v2 .pd-hub-tname { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }
html:root .pd-hub-v2 .pd-hub-row-event > b { font-size:14px; } /* 팀 정보가 없을 때의 경기명 대체 표시도 팀명과 같은 14px */
.pd-hub-v2 .pd-hub-row-match { display:flex; align-items:center; flex-wrap:wrap; gap:2px 8px; min-width:0; font-weight:600; }
.pd-hub-v2 .pd-hub-event-teams { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:3px 10px; white-space:normal; }
.pd-hub-v2 .pd-hub-event-teams .pd-hub-logo, .pd-hub-v2 .pd-hub-event-teams .pd-hub-logo img { width:22px; height:22px; }
.pd-hub-v2 .pd-hub-section[data-hub-sort^="percentage_pick"] .pd-hub-row-match { color:var(--rt-text-2); font-size:12.5px; }

/* 경기 컬럼: 로고+팀명+vs+로고+팀명 한 그룹을 칸의 가로 중앙에 둔다(헤더 중앙축과 일치). */
html:root .pd-hub-v2 .pd-hub-row-event { min-width:0; text-align:center; }
html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-row-match { width:100%; justify-content:center; }
html:root .pd-hub-v2 .pd-hub-section[data-hub-sort^="percentage_pick"] .pd-hub-row-event { text-align:center; }
/* PC(≥1024px): 적중률순 두 섹션도 수익순과 같은 표라서 경기 칸 글자 크기·색을 수익순과 같게 되돌린다. */
@media (min-width:1024px) { html:root .pd-hub-v2 .pd-hub-section[data-hub-sort^="percentage_pick"] .pd-hub-row-match { color:inherit; font-size:inherit; } }

/* 시상대 최근 픽: 1줄 라벨/결과 · 2줄 경기 · 3줄 선택 픽+배당, 모두 카드 가로 중앙. */
html:root .pd-hub-v2 .pd-hub-feature-card .pd-hub-feature-pick { grid-template-columns:minmax(0,1fr); justify-items:center; }
html:root .pd-hub-v2 .pd-hub-feature-card .pd-hub-feature-meta { width:100%; display:flex; align-items:center; justify-content:space-between; }
html:root .pd-hub-v2 .pd-hub-feature-card .pd-hub-event { width:100%; text-align:center; }
html:root .pd-hub-v2 .pd-hub-feature-card .pd-hub-event-teams { white-space:normal; }
html:root .pd-hub-v2 .pd-hub-feature-card .pd-hub-pick-line { grid-column:1; width:100%; margin-top:6px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:4px 12px; min-width:0; }
html:root .pd-hub-v2 .pd-hub-feature-card .pd-hub-pick-line .pd-hub-pick-title { grid-column:auto; margin:0; max-width:100%; justify-self:auto; text-align:center; white-space:normal; overflow-wrap:anywhere; }
html:root .pd-hub-v2 .pd-hub-feature-card .pd-hub-pick-line .pd-hub-pick-odds { grid-column:auto; margin:0; padding-left:12px; border-left:1px solid rgba(255,255,255,.18); justify-self:auto; }

/* 결과 색 통일(랭커픽·피드·팁스터 성적·프로필 보기 공통 값): 적중 #0D2728 / 실패 #251925, 대기·취소·무효는 기존 네이비.
   시상대 카드는 순위 디자인을 지키려 최근 픽 박스에 적용한다. */
html:root .pd-pick-hub.pd-hub-v2 .pd-hub-pick-row.pd-pick-win, html:root .pd-pick-hub.pd-hub-v2 .pd-hub-pick-row.pd-pick-win:hover, html:root .pd-pick-hub.pd-hub-v2 .pd-hub-feature-card.pd-pick-win .pd-hub-feature-pick { background:#0D2728; }
html:root .pd-pick-hub.pd-hub-v2 .pd-hub-pick-row:is(.pd-pick-lose,.pd-pick-lost), html:root .pd-pick-hub.pd-hub-v2 .pd-hub-pick-row:is(.pd-pick-lose,.pd-pick-lost):hover, html:root .pd-pick-hub.pd-hub-v2 .pd-hub-feature-card:is(.pd-pick-lose,.pd-pick-lost) .pd-hub-feature-pick { background:#251925; }
html:root .pd-pick-hub.pd-hub-v2 .pd-hub-row-result b, html:root .pd-pick-hub.pd-hub-v2 .pd-hub-feature-card .pd-hub-result { border-color:rgba(110,150,255,.55); background:rgba(60,100,230,.16); color:#7fa5ff; }
html:root .pd-pick-hub.pd-hub-v2 .pd-hub-pick-row.pd-pick-win .pd-hub-row-result b, html:root .pd-pick-hub.pd-hub-v2 .pd-hub-feature-card.pd-pick-win .pd-hub-result { border-color:rgba(46,230,166,.6); background:rgba(46,230,166,.14); color:#2ee6a6; }
html:root .pd-pick-hub.pd-hub-v2 .pd-hub-pick-row:is(.pd-pick-lose,.pd-pick-lost) .pd-hub-row-result b, html:root .pd-pick-hub.pd-hub-v2 .pd-hub-feature-card:is(.pd-pick-lose,.pd-pick-lost) .pd-hub-result { border-color:rgba(255,92,124,.6); background:rgba(255,92,124,.14); color:#ff8da4; }
html:root .pd-pick-hub.pd-hub-v2 .pd-hub-pick-row.pd-pick-void .pd-hub-row-result b, html:root .pd-pick-hub.pd-hub-v2 .pd-hub-feature-card.pd-pick-void .pd-hub-result { border-color:rgba(160,170,196,.4); background:rgba(160,170,196,.1); color:#b6bdd0; }

/* 대기(PENDING)·취소·무효 배경은 피드 행과 같은 네이비 그라데이션으로 통일한다. */
html:root .pd-pick-hub.pd-hub-v2 .pd-hub-pick-row:is(.pd-pick-pending,.pd-pick-void), html:root .pd-pick-hub.pd-hub-v2 .pd-hub-feature-card:is(.pd-pick-pending,.pd-pick-void) .pd-hub-feature-pick { background:linear-gradient(180deg,rgba(16,22,52,.98),rgba(10,15,38,.98)); }

/* 적중률: 숫자는 사이트 기본 글자색(시상대 값과 표의 적중률 열). */
html:root .pd-pick-hub.pd-hub-v2 .pd-hub-row-rate b, html:root .pd-pick-hub.pd-hub-v2 .pd-hub-feature-rate b { color:var(--rt-text, #f7f7fa); }

/* 픽 텍스트: 4개 화면 공통(14px · 700 · #fff · 행간 1.35). 배당·결과 배지는 그대로. */
html:root .pd-pick-hub.pd-hub-v2 .pd-hub-row-pick b, html:root .pd-pick-hub.pd-hub-v2 .pd-hub-pick-title { font-size:14px; font-weight:700; color:#fff; line-height:1.35; }

/* 모바일 하단 픽 목록 (≤767px) — 회원별 독립 카드.
   ① 메달·닉네임 / 결과  ② 적중률 / 순수익  ─ 구분선 ─  ③ 경기  ④ 예측 / 배당
   템플릿은 그대로이고 CSS 격자만 다시 배치한다. 라벨은 ::before 로 붙인다. */
@media (max-width:767px) {
 /* 섹션별 고유 색(--sc = 포인트 색 RGB): 수익순 에메랄드 · 적중률 10~20픽 퍼플 · 21픽 이상 블루 · 100% 골드.
    외곽 테두리(1px)·제목 아이콘·헤더 배경이 같은 색 계열이다. 카드 안쪽(메달·수익·결과 배지)은 건드리지 않는다. */
 .pd-hub-v2 .pd-hub-section[data-hub-sort="total_profit"] { --sc: 50, 211, 160; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_10_to_20"] { --sc: 177, 138, 255; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_more_20"] { --sc: 89, 182, 249; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_100"] { --sc: 227, 188, 101; }
 html:root .pd-hub-v2 .pd-hub-section { border-color: rgba(var(--sc), .4); }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-section-head { background: rgba(var(--sc), .1); }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-section-icon { border-color: rgba(var(--sc), .4); background: rgba(var(--sc), .14); color: rgb(var(--sc)); }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-section-head h2 { color: #fff; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-pick-list { display:grid; gap:8px; padding:2px 10px 10px; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-pick-row { display:grid; grid-template-columns:26px minmax(0,1fr) auto; grid-template-areas:none; grid-template-rows:auto; gap:0; align-items:center; min-height:0; padding:11px 12px 10px; border:1px solid rgba(var(--rt-brand-rgb),.28); border-radius:12px; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-pick-row:last-child { border-bottom:1px solid rgba(var(--rt-brand-rgb),.28); }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-rank { grid-column:1; grid-row:1; justify-content:flex-start; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-rank .pd-rank-no { width:26px; height:26px; min-width:26px; font-size:12px; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-tipster { grid-column:2; grid-row:1; min-width:0; padding:0 8px 0 8px; overflow:hidden; text-align:left; text-overflow:ellipsis; white-space:nowrap; font-size:14px; font-weight:800; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-profit { grid-column:3; grid-row:2; padding:8px 0 9px; border-bottom:1px solid rgba(var(--rt-brand-rgb),.2); text-align:right; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-profit b { font-size:15px; font-weight:900; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-rate { grid-column:1 / 3; grid-row:2; padding:8px 0 9px; border-bottom:1px solid rgba(var(--rt-brand-rgb),.2); text-align:left; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-rate b { display:inline; font-size:13px; font-weight:800; color:#fff; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-event { grid-column:1 / 4; grid-row:3; padding:9px 0 0; border:0; text-align:left; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-row-match { justify-content:flex-start; gap:2px 6px; width:100%; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-team { gap:5px; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-tname { white-space:normal; overflow:visible; overflow-wrap:anywhere; font-size:13px; font-weight:800; color:#fff; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-vs { font-size:13px; font-weight:800; color:#fff; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-event > b { white-space:normal; overflow-wrap:anywhere; font-size:13px; font-weight:800; color:#fff; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-result { grid-column:3; grid-row:1; align-self:center; padding:0; text-align:right; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-result b { box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; flex:none; width:auto; min-width:0; height:24px; padding:0 10px; border-width:1px; border-radius:999px; font-size:11px; font-weight:600; line-height:1; white-space:nowrap; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-pick { grid-column:1 / 3; grid-row:4; min-width:0; padding:6px 0 0; text-align:left; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-odds { grid-column:3; grid-row:4; padding:6px 0 0; text-align:right; white-space:nowrap; }
 .pd-hub-v2 .pd-hub-row-pick::before, .pd-hub-v2 .pd-hub-row-odds::before, .pd-hub-v2 .pd-hub-row-rate::before { margin-right:6px; color:var(--rt-text-2); font-size:12px; font-weight:500; }
 .pd-hub-v2 .pd-hub-row-pick::before { content:"예측"; } .pd-hub-v2 .pd-hub-row-odds::before { content:"배당"; } .pd-hub-v2 .pd-hub-row-rate::before { content:"적중률"; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-pick b { display:inline; white-space:normal; overflow:visible; font-size:13px; font-weight:700; overflow-wrap:anywhere; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-odds b { display:inline; font-size:13px; font-weight:800; color:#fff; }
}
/* PC(≥1024px) 섹션별 포인트 색(--sc = RGB): 수익순 민트 · 적중률 10~20픽 레드코랄 · 21픽 이상 블루 · 100% 골드.
   외곽 테두리 · 제목 아이콘 · 헤더 배경 · 헤더 하단 구분선(레이아웃에 영향 없는 안쪽 그림자)만 칠한다. 표 · 순위 배지 · 결과 상태색은 건드리지 않는다. */
@media (min-width:1024px) {
 .pd-hub-v2 .pd-hub-section[data-hub-sort="total_profit"] { --sc: 46, 230, 166; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_10_to_20"] { --sc: 231, 125, 145; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_more_20"] { --sc: 96, 165, 250; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_100"] { --sc: 231, 185, 79; }
 /* PC 랭커픽: 외곽선·표 구분선은 홈 D안과 같은 블루그레이(148,163,200), 섹션 헤더 배경은 홈과 같은 퍼플 인디고(149,107,255). 섹션색(--sc)은 제목 아이콘에만 남긴다. 제목 카드의 퍼플 글로우(배경)는 그대로. */
 html:root .pd-hub-v2 .pd-hub-section { border-color: rgba(148, 163, 200, .22); }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-section-head { background: linear-gradient(90deg, rgba(149, 107, 255, .13), rgba(149, 107, 255, .03)); border-bottom-color: rgba(148, 163, 200, .16); box-shadow: inset 0 -1px 0 rgba(148, 163, 200, .16); }
 html:root .pd-wrap.pd-top.pd-pick-hub.pd-hub-v2, html:root .pd-hub-v2 .pd-hub-head { border-color: rgba(148, 163, 200, .22); }  /* 바깥 래퍼는 prediction.css 의 공용 퍼플 테두리 규칙보다 깊게 */
 html:root .pd-hub-v2 .pd-hub-list-head { background: rgba(148, 163, 200, .06); border-block-color: rgba(148, 163, 200, .2); }
 html:root .pd-hub-v2 .pd-hub-pick-row { border-bottom-color: rgba(148, 163, 200, .1); }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-section-icon { border-color: rgba(var(--sc), .4); background: rgba(var(--sc), .12); color: rgb(var(--sc)); }
}

/* ── 랭커픽 '픽 값' 칩 (.rt-pick-chip, 기본 모양은 prediction.css) ──────
   최근 픽 카드(.pd-hub-pick-title)와 목록 줄(.pd-hub-row-pick b)이 같은 칩을 쓴다.
   기존 규칙이 깊어 같은 깊이로 다시 적는다. 결과 색은 따르지 않는다. */
html:root .pd-hub-v2 .rt-pick-chip { display:inline-block; max-width:100%; box-sizing:border-box; margin:0; padding:5px 12px; overflow:hidden; border:1px solid rgba(125,140,255,.42); border-radius:10px; background:rgba(76,92,190,.18); color:#eef0ff; font-size:13px; font-weight:700; line-height:1.35; text-align:center; text-overflow:ellipsis; white-space:nowrap; overflow-wrap:normal; }
html:root .pd-hub-v2 .pd-hub-feature-card .pd-hub-pick-line .rt-pick-chip { justify-self:center; white-space:nowrap; }
html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-pick b.rt-pick-chip { display:inline-block; vertical-align:middle; white-space:nowrap; overflow:hidden; font-size:13px; }
html:root .pd-hub-v2 .pd-hub-pick-row:hover .rt-pick-chip, html:root .pd-hub-v2 .pd-hub-feature-card:hover .rt-pick-chip { border-color:rgba(150,165,255,.7); background:rgba(76,92,190,.28); }
@media (max-width:767px) { html:root .pd-hub-v2 .rt-pick-chip { padding:4px 10px; font-size:12.5px; } }
html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-pick:has(.rt-pick-chip)::before { vertical-align:middle; }
/* 결과 배지 안의 최종 스코어(적중·실패)만 스코어보드 모양으로 — 피드와 같은 값. 배지 색·테두리·높이는 위 규칙 그대로다. */
html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-result b.is-score, html:root .pd-pick-hub.pd-hub-v2 .pd-hub-row-result b.is-score, html:root .pd-hub-v2 .pd-hub-feature-card .pd-hub-result.is-score, html:root .pd-pick-hub.pd-hub-v2 .pd-hub-feature-card .pd-hub-result.is-score { font-size:16px; font-weight:800; letter-spacing:.3px; font-variant-numeric:tabular-nums; white-space:nowrap; }

/* 모바일 다크 랭커픽: 섹션색(--sc: 에메랄드·퍼플·블루·골드)은 그대로 두고, 인디고 배경에 맞게 외곽선 .4→.3, 헤더는 평면색 대신 은은한 가로 그라데이션,
   헤더 하단선(청록 #142c40)·진행 중 픽 카드·빈 상태 상자의 퍼플 테두리는 PC 와 같은 블루그레이로. 적중·미적중·무효 카드의 결과색은 그대로. PC·태블릿·라이트는 건드리지 않는다. */
@media (max-width:767px) {
 html:root:not([data-theme="light"]) .pd-hub-v2 .pd-hub-section { border-color: rgba(var(--sc), .3); }
 html:root:not([data-theme="light"]) .pd-hub-v2 .pd-hub-section .pd-hub-section-head { background: linear-gradient(90deg, rgba(var(--sc), .06), rgba(var(--sc), .015)); border-bottom-color: rgba(148, 163, 200, .16); }
 html:root:not([data-theme="light"]) .pd-hub-v2 .pd-hub-section .pd-hub-pick-row:not(.pd-pick-win):not(.pd-pick-lose):not(.pd-pick-lost):not(.pd-pick-void) { border-color: rgba(148, 163, 200, .2); }
 html:root:not([data-theme="light"]) .pd-hub-v2 .pd-hub-section .pd-hub-compact-empty { border-color: rgba(148, 163, 200, .2); }
}

/* 모바일(≤767px) 랭커픽 카드 간소화 — 피드 카드와 같은 틀에 통계 한 줄(적중률 / 수익)만 더한다.
   ① 메달·닉네임 / 결과  ② 적중률 / 수익  ③ 로고+경기명 ─ 구분선(경기명 아래) ─ ④ 픽 / 배당.
   섹션색(--sc)·카드 배경·결과색·메달 색은 위 규칙 그대로이고, 여기서는 배치·크기만 덮어쓴다. */
@media (max-width:767px) {
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-pick-row { grid-template-columns:24px minmax(0,1fr) auto; padding:9px 12px 8px; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-rank .pd-rank-no { width:24px; height:24px; min-width:24px; font-size:11px; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-tipster { padding:0 8px; font-size:13px; font-weight:700; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-result b { height:22px; }
 /* 통계 줄: 프로필 아래 선 없음 */
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-rate { padding:6px 0 0; border:0; font-size:12px; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-rate b { font-size:12px; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-profit { padding:6px 0 0; border:0; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-profit b { font-size:13px; font-weight:800; }
 /* 경기: 구분선은 경기명 아래(전체 폭) */
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-event { margin-top:8px; padding:0 0 6px; border:0; border-bottom:1px solid rgba(var(--rt-brand-rgb),.2); }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-tname, html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-vs, html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-event > b { font-size:12px; font-weight:600; line-height:1.3; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-vs { font-size:11px; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-logo, html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-logo img { width:16px; height:16px; }
 /* 픽·배당: 칩 없이 일반 텍스트 */
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-pick { padding-top:3px; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-odds { padding-top:3px; }
 .pd-hub-v2 .pd-hub-row-pick::before { content:"픽"; }
 .pd-hub-v2 .pd-hub-row-pick::before, .pd-hub-v2 .pd-hub-row-odds::before { font-size:11px; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-pick b:not(.rt-pick-chip) { display:inline; font-size:12px; font-weight:600; line-height:1.3; }
 /* 픽 칩은 기존 모양(색·테두리·모서리 10px)을 그대로 두고 크기만 줄인다. 긴 값은 말줄임 대신 줄바꿈해 잘리지 않게 한다. */
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-pick b.rt-pick-chip { padding:3px 9px; font-size:12px; font-weight:700; line-height:1.3; white-space:normal; overflow:visible; overflow-wrap:anywhere; text-align:left; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-odds b { font-size:12px; font-weight:700; }
}

/* 모바일 다크 랭커픽 섹션색 통일 — 수익순(에메랄드)·10~20픽(퍼플)·21픽 이상(블루)·100%(골드) 네 가지 포인트색을 브랜드 퍼플 하나(#B18AFF = 177,138,255)로 맞춘다.
   테두리·헤더 그라데이션·아이콘은 위 규칙이 --sc 로 그리므로 값만 바꾼다. 메달·결과·수익 색은 --sc 를 쓰지 않아 그대로다. 라이트·PC·태블릿은 이 블록 밖. */
@media (max-width:767px) {
 html:root:not([data-theme="light"]) .pd-hub-v2 .pd-hub-section[data-hub-sort] { --sc: 177, 138, 255; } /* 헤더 아이콘(상자·글리프)만 원래 섹션색으로 되돌린다: 수익순 에메랄드 · 10~20픽 퍼플 · 21픽 이상 블루 · 100% 골드. */
 .pd-hub-v2 .pd-hub-section[data-hub-sort="total_profit"] { --ic: 50, 211, 160; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_10_to_20"] { --ic: 177, 138, 255; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_more_20"] { --ic: 89, 182, 249; }
 .pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_100"] { --ic: 227, 188, 101; }
 html:root:not([data-theme="light"]) .pd-hub-v2 .pd-hub-section[data-hub-sort] .pd-hub-section-icon { border-color: rgba(var(--ic), .4); background: rgba(var(--ic), .14); color: rgb(var(--ic)); }
}

/* 모바일(≤767px) 섹션 헤더 ↔ 첫 카드 간격 — 원인은 카드 목록(.pd-hub-pick-list)의 위 여백이 2px 뿐이라 헤더 하단선에 첫 카드가 붙던 것. 위 여백만 7px 로 늘린다(섹션 사이·카드 안 여백은 그대로). */
@media (max-width:767px) {
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-pick-list { padding-top:7px; }
}

/* 모바일 다크 비적중 카드 — 플럼 와인(D안). 피드(feed_v2.css 끝 블록)와 같은 값이다. 적중·대기·무효 색과 라이트·PC·태블릿은 이 블록 밖. */
@media (max-width:767px) {
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row:is(.pd-pick-lose,.pd-pick-lost), html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row:is(.pd-pick-lose,.pd-pick-lost):hover { background:#241A30; border-color:rgba(214,112,146,.34); }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row:is(.pd-pick-lose,.pd-pick-lost) .pd-hub-row-result b { background:rgba(236,100,135,.13); border-color:rgba(236,122,152,.5); color:#FFA0B8; }
}

/* 모바일 다크 적중 카드 — 테두리만 민트 계열(배경 #0D2728·배지 색은 위 규칙 그대로). 피드·픽내역과 같은 값이다. */
@media (max-width:767px) {
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row.pd-pick-win, html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row.pd-pick-win:hover { border-color:rgba(70,214,168,.32); }
}

/* 모바일(≤767px) 섹션 헤더 컴팩트 — 설명 문구는 숨기고(마크업은 PC·태블릿 공용이라 지우지 않는다) 아이콘 28px · 제목 14px 한 줄로 둔다.
   헤더 배경·테두리·섹션색은 위 규칙 그대로이고, 첫 카드와의 간격(.pd-hub-pick-list 위 여백 12px)도 그대로다. */
@media (max-width:767px) {
 .pd-hub-v2 .pd-hub-section-head { align-items:center; gap:9px; min-height:0; padding:7px 13px 8px; }
 /* 섹션과 섹션 사이 바깥 간격(.pd-hub-sections 의 grid gap) 16px → 9px. 첫 섹션 위·마지막 섹션 아래 여백은 이 gap 과 무관해 그대로다. */
 .pd-hub-v2 .pd-hub-sections { gap:9px; }
 .pd-hub-v2 .pd-hub-section-head p { display:none; }
 .pd-hub-v2 .pd-hub-section-head h2 { margin:0; font-size:14px; line-height:1.3; }
 .pd-hub-v2 .pd-hub-section-icon { flex:0 0 28px; width:28px; height:28px; border-radius:8px; font-size:14px; }
}

/* 섹션 빈 상태 문구가 길어져 단어 중간에서 줄이 바뀌지 않도록(글꼴·색·여백은 그대로). */
.pd-hub-v2 .pd-hub-section .pd-hub-compact-empty :is(strong, span) { text-align: center; word-break: keep-all; }

/* 모바일(≤767px) 랭커픽 섹션 색·아이콘을 모바일 홈과 동일하게 — 섹션색(--sc)·외곽 테두리 투명도·상단 7% 색조·헤더(색조 없음)·아이콘 상자(색 40% 테두리 · 12% 배경)·아이콘 모양. 제목·여백·높이·카드는 그대로. */
.pd-hub-ico-m { display: none; }
@media (max-width: 767px) {
 html:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="total_profit"][data-hub-sort] { --sc: 229, 168, 75; --ic: 229, 168, 75; border-color: rgba(229, 168, 75, .26); }
 html:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_10_to_20"][data-hub-sort] { --sc: 242, 123, 181; --ic: 242, 123, 181; border-color: rgba(242, 123, 181, .30); }
 html:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_more_20"][data-hub-sort] { --sc: 94, 168, 255; --ic: 94, 168, 255; border-color: rgba(94, 168, 255, .29); }
 html:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_100"][data-hub-sort] { --sc: 46, 230, 166; --ic: 46, 230, 166; border-color: rgba(46, 230, 166, .25); }
 html:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort][data-hub-sort] { background: linear-gradient(180deg, rgba(var(--sc), .07), rgba(var(--sc), 0) 110px), linear-gradient(rgba(13, 19, 46, .96), rgba(8, 13, 34, .98)); }
 html:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort] .pd-hub-section-head { background: none; }
 html:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort] .pd-hub-section-icon { border-color: rgba(var(--sc), .4); background: rgba(var(--sc), .12); color: rgb(var(--sc)); font-size: 0; }
 .pd-hub-v2 .pd-hub-section-icon .pd-hub-ico-m { display: block; width: 16px; height: 16px; }
}

/* ── 모바일(≤767px) 다크 랭커픽 — 모바일 홈 TOP3 와 같은 섹션·카드 디자인 ─────────────────────────────────────────
   섹션: 섹션색 틴트 없이 기본 다크 인디고 면 + 기본 퍼플 외곽선, 헤더는 14px 흰 제목 · 26px 아이콘 박스(인디고·퍼플 테두리) · 헤더 하단선 없음.
   카드: 홈 카드와 같은 면·테두리·여백, 적중(#0D2728)·미적중(#241A30)·대기(중립 인디고) 상태색, 18px 채움 메달, 24px 프로필, 닉네임 14px/700, 경기명 12px/600 · 로고 16px,
   픽 값은 박스 없이 11px/700, 배당 11px/700 은 오른쪽 끝, 결과 배지 22px/11px. 랭커픽 고유의 적중률·수익 줄(2번째 줄: 좌 적중률 / 우 수익)은 위치·수치·색 그대로.
   프로필 사진은 이 판(모바일 다크)에서만 보인다. PC·태블릿·라이트는 이 블록 밖. */
.pd-hub-v2 .pd-hub-row-ava { display: none; }
@media (max-width: 767px) {
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section, html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort] { border-color: rgba(149, 107, 255, .3); border-radius: 14px; background: linear-gradient(180deg, rgba(13, 19, 46, .96), rgba(8, 13, 34, .98)); box-shadow: none; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-section-head { gap: 8px; padding: 7px 12px; border-bottom: 0; background: none; box-shadow: none; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort] .pd-hub-section-icon { flex: 0 0 26px; width: 26px; height: 26px; border: 1px solid rgba(149, 107, 255, .3); border-radius: 8px; background: rgba(149, 107, 255, .12); color: #e6e9f5; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-section-icon .pd-hub-ico-m { width: 16px; height: 16px; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-section-head h2 { color: #fff; font-size: 14px; line-height: 1.25; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-list { gap: 8px; padding: 0 8px 12px; }
 /* 카드 면 · 테두리 · 여백 */
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row, html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row:is(.pd-pick-win, .pd-pick-lose, .pd-pick-lost, .pd-pick-pending, .pd-pick-void):hover, html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row:not(.pd-pick-win):not(.pd-pick-lose):not(.pd-pick-lost):not(.pd-pick-void), html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row:not(.pd-pick-win):not(.pd-pick-lose):not(.pd-pick-lost):not(.pd-pick-void):hover { grid-template-columns: auto minmax(0, 1fr) auto; padding: 10px 12px 9px; border: 1px solid rgba(149, 107, 255, .16); border-radius: 12px; background: linear-gradient(180deg, rgba(16, 22, 52, .98), rgba(10, 15, 38, .98)); box-shadow: none; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row.pd-pick-win, html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row.pd-pick-win:hover { border-color: rgba(46, 230, 166, .3); background: #0D2728; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row:is(.pd-pick-lose, .pd-pick-lost), html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row:is(.pd-pick-lose, .pd-pick-lost):hover { border-color: rgba(214, 112, 146, .34); background: #241A30; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row.pd-pick-void { border-color: rgba(160, 170, 196, .22); }
 /* 1줄: 메달 + 프로필 + 닉네임 / 결과 배지 */
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-rank { display: flex; align-items: center; gap: 8px; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-rank .pd-rank-no { width: 18px; height: 18px; min-width: 18px; border: 1px solid #4a5476; border-radius: 6px; background: none; box-shadow: none; color: #aab3cb; font-size: 10px; font-weight: 800; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-rank .pd-rank-no.is-top1 { border-color: #d9a21f; background: linear-gradient(145deg, #ffe38a, #d9a21f); color: #3a2a00; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-rank .pd-rank-no.is-top2 { border-color: #9aa6bf; background: linear-gradient(145deg, #e8edf8, #9aa6bf); color: #1f2433; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-rank .pd-rank-no.is-top3 { border-color: #a8653a; background: linear-gradient(145deg, #f0b184, #a8653a); color: #301a0b; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-ava { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 24px; height: 24px; overflow: hidden; border: 1.5px solid rgba(149, 107, 255, .55); border-radius: 50%; background: rgba(149, 107, 255, .14); color: #8f78e0; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-ava img, html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-ava svg { display: block; width: 100%; height: 100%; object-fit: cover; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-tipster { padding: 0 8px; font-size: 14px; font-weight: 700; line-height: 1.2; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-result b, html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-result b.is-score { height: 22px; min-width: 0; padding: 0 10px; font-size: 11px; font-weight: 600; line-height: 1; }
 /* 3줄: 경기 */
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-event { margin-top: 8px; padding: 0 0 7px; border-bottom: 1px solid rgba(149, 107, 255, .2); }
 /* 4줄: 픽 / 배당 — 박스 없는 픽 값 */
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-pick, html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-odds { display: flex; align-items: center; padding-top: 5px; line-height: 1.3; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-odds { justify-content: flex-end; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-pick b.rt-pick-chip, html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row:hover .rt-pick-chip { display: inline-block; box-sizing: border-box; width: auto; max-width: 100%; margin: 0; padding: 3px 10px; vertical-align: middle; overflow: visible; border: 1px solid rgba(125, 140, 255, .42); border-radius: 10px; background: rgba(76, 92, 190, .18); color: #eef0ff; font-size: 11px; font-weight: 700; line-height: 1.3; text-align: left; white-space: normal; overflow-wrap: anywhere; text-overflow: clip; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-pick b:not(.rt-pick-chip) { font-size: 11px; font-weight: 700; }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-odds b { font-size: 11px; font-weight: 700; }
}

/* 모바일 다크: 픽 박스가 길어져도 우측 '배당'과 붙지 않게 여백만 둔다(박스 모양은 위 규칙). */
@media (max-width:767px) {
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-pick { min-width:0; margin-right:8px; }
}

/* ── 모바일(≤767px) 랭커픽 헤더 아이콘 — 홈 사이드 섹션(수익순 · 적중률순 · 적중률 100% 순)과 같은 상자·색 ──
   모양은 템플릿의 `.pd-hub-ico-m` SVG 가 홈 것과 같아졌고(적중률 · 100% 는 홈 사이드 것으로 교체), 여기서는
   상자 색만 홈과 맞춘다: 색 40% 테두리 · 12% 배경 · 아이콘은 그 색. 수익순은 홈의 금색(241,196,91), 적중률순은
   분홍(242,123,181), 100% 는 민트(46,230,166). 상자·아이콘 크기(26/16px)와 헤더 높이는 그대로다.
   적중률 TOP3(21픽 이상)은 홈에 짝이 없어 건드리지 않는다. PC·태블릿에서는 이 SVG 가 그려지지 않는다. */
@media (max-width: 767px) {
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="total_profit"] .pd-hub-section-icon,
 html:root[data-theme="light"] .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="total_profit"] .pd-hub-section-icon { border-color: rgba(241, 196, 91, .4); background: rgba(241, 196, 91, .12); color: rgb(241, 196, 91); }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_10_to_20"] .pd-hub-section-icon,
 html:root[data-theme="light"] .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_10_to_20"] .pd-hub-section-icon { border-color: rgba(242, 123, 181, .4); background: rgba(242, 123, 181, .12); color: rgb(242, 123, 181); }
 html:root:not([data-theme="light"]) .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_100"] .pd-hub-section-icon,
 html:root[data-theme="light"] .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_100"] .pd-hub-section-icon { border-color: rgba(46, 230, 166, .4); background: rgba(46, 230, 166, .12); color: rgb(46, 230, 166); }
}

/* PC·태블릿(≥768px) 랭커픽 섹션 헤더 아이콘: 글자(↗ % ▥ ✓) 대신 모바일·홈과 같은 SVG, 상자·색도 홈 섹션 아이콘(.hm-head-icon)과 같은 규칙이다 —
   섹션색(--sc) 40% 테두리 · 12% 배경, 다크는 아이콘이 섹션색 그대로, 라이트는 섹션색 52% + #141a30 (홈 라이트와 같은 color-mix).
   섹션색은 홈 TOP3와 같다: 수익 금색 · 적중률(10~20픽) 분홍 · 적중률(21픽 이상) 파랑 · 100% 민트. 모바일(≤767px)은 위 규칙 그대로. */
@media (min-width: 768px) {
 html:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="total_profit"] { --sc: 229, 168, 75; }
 html:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_10_to_20"] { --sc: 242, 123, 181; }
 html:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_more_20"] { --sc: 94, 168, 255; }
 html:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_100"] { --sc: 46, 230, 166; }
 html:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort] .pd-hub-section-icon { font-size: 0; border-color: rgba(var(--sc), .4); background: rgba(var(--sc), .12); color: rgb(var(--sc)); }
 html:root[data-theme="light"] .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort] .pd-hub-section-icon { color: color-mix(in srgb, rgb(var(--sc)) 52%, #141a30); }
 html:root .pd-pick-hub.pd-hub-v2 .pd-hub-section-icon .pd-hub-ico-m { display: block; width: 22px; height: 22px; }
}

/* ── 모바일(≤767px) 랭커픽 B안 카드 — 모바일 홈 TOP3 픽 카드와 같은 구성 ─────────────────────────────────────────────
   ① 메달·아바타·닉네임 / 결과  ② 적중률 | 월 수익 (닉네임 아래 한 줄)  ③ 홈팀 · VS · 원정팀(VS 정중앙, 좌 우측정렬·우 좌측정렬)
   ④ 경기 일시 | 리그  ⑤ PICK 라벨 + 선택 박스 / 배당 박스. 마크업·데이터는 ranking_hub.html 그대로(통계·일시·라벨 칸만 모바일에서 보인다). */
html:root:root .pd-hub-v2 .pd-hub-pick-row .pd-hub-row-stats,
html:root:root .pd-hub-v2 .pd-hub-pick-row .pd-hub-row-when,
html:root:root .pd-hub-v2 .pd-hub-pick-row .pd-hub-pick-lbl,
html:root:root .pd-hub-v2 .pd-hub-pick-row .pd-hub-odds-lbl { display: none; }
@media (max-width: 767px) {
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="total_profit"] { --sc: 241, 196, 91; --ic: 241, 196, 91; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_10_to_20"] { --sc: 149, 107, 255; --ic: 149, 107, 255; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section:is([data-hub-sort="total_profit"], [data-hub-sort="percentage_pick_10_to_20"]) { border-color: rgba(var(--sc), .4); }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section:is([data-hub-sort="total_profit"], [data-hub-sort="percentage_pick_10_to_20"]) .pd-hub-section-icon { border-color: rgba(var(--sc), .5); background: rgba(var(--sc), .14); color: rgb(var(--sc)); }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section:is([data-hub-sort="total_profit"], [data-hub-sort="percentage_pick_10_to_20"]) .pd-hub-more, html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section-head a { color: rgb(var(--sc)); }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-list { display: grid; gap: 8px; padding: 2px 10px 10px; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "rank tip res" "rank stats stats" "event event event" "when when when" "pick pick odds"; gap: 0 8px; align-items: center; padding: 9px 10px 10px; border-radius: 13px; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-rank { grid-area: rank; display: flex; align-items: center; gap: 6px; padding: 0; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-ava { width: 30px; height: 30px; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-ava img, html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-ava svg { width: 30px; height: 30px; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-tipster { grid-area: tip; padding: 0; font-size: 14.5px; line-height: 1.3; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-profit, html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-rate { display: none; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-stats { grid-area: stats; display: flex; flex-wrap: wrap; gap: 4px 6px; min-width: 0; margin-top: 3px; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-chip { display: inline-flex; align-items: center; gap: 4px; box-sizing: border-box; height: 22px; padding: 0 8px; border: 1px solid; border-radius: 7px; font-size: 11px; line-height: 1; white-space: nowrap; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-chip svg { flex: none; width: 12px; height: 12px; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-chip em { color: var(--rt-text-2, #b7bfd8); font-size: 10.5px; font-style: normal; font-weight: 500; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-chip b { display: inline; font-size: 12px; font-weight: 850; font-variant-numeric: tabular-nums; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-chip.is-rate { border-color: rgba(149, 107, 255, .45); background: rgba(149, 107, 255, .12); color: #b79cff; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-chip.is-rate b { color: #e3d9ff; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-chip.is-profit { border-color: rgba(46, 230, 166, .4); background: rgba(46, 230, 166, .1); color: #2ee6a6; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-chip.is-profit b { color: #2ee6a6; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-chip.is-profit b.pd-profit-down { color: #ff8b8b; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-result { grid-area: res; align-self: start; padding: 0; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-event { grid-area: event; padding: 9px 0 0; border: 0; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-row-match { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; column-gap: 8px; width: 100%; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-team { display: flex; align-items: center; justify-content: flex-end; gap: 5px; min-width: 0; text-align: right; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-team:last-child { flex-direction: row-reverse; text-align: left; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-logo, html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-logo img { flex: none; width: 28px; height: 28px; object-fit: contain; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-tname { min-width: 0; font-size: 13px; line-height: 1.25; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-event .pd-hub-vs { font-size: 11px; font-weight: 700; text-transform: uppercase; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-when { grid-area: when; display: flex; align-items: center; justify-content: center; gap: 6px; min-width: 0; margin-top: 4px; color: var(--rt-text-2, #b7bfd8); font-size: 11px; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-when b { min-width: 0; overflow: hidden; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-when u { text-decoration: none; opacity: .5; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-pick { grid-area: pick; display: grid; grid-template-columns: auto minmax(0, 1fr); min-width: 0; margin-top: 8px; padding: 0; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-pick::before, html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-odds::before { content: none; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-lbl { display: flex; align-items: center; min-height: 36px; padding: 0 9px; border-radius: 9px 0 0 9px; background: rgba(var(--sc), .3); color: #fff; font-size: 11px; font-style: normal; font-weight: 800; letter-spacing: .5px; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-pick .rt-pick-chip { display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 100%; min-height: 36px; margin: 0; padding: 4px 8px; border: 1px solid rgba(var(--sc), .55); border-left: 0; border-radius: 0 9px 9px 0; background: rgba(var(--sc), .1); color: #fff; font-size: 14px; font-weight: 850; line-height: 1.25; text-align: center; white-space: normal; overflow-wrap: anywhere; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-odds { grid-area: odds; display: flex; flex-direction: column; align-items: center; justify-content: center; box-sizing: border-box; min-width: 64px; min-height: 36px; margin-top: 8px; padding: 2px 10px; border: 1px solid rgba(148, 163, 200, .3); border-radius: 9px; background: rgba(8, 13, 34, .6); line-height: 1.15; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-odds-lbl { display: block; color: var(--rt-text-2, #b7bfd8); font-size: 10px; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-odds b { display: block; color: #fff; font-size: 15px; font-weight: 850; font-variant-numeric: tabular-nums; }
 html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="total_profit"] .pd-hub-row-odds b { color: #f1c45b; }
}
@media (max-width: 767px) {   /* 라이트: 섹션 틀·헤더가 어두운 채로 남지 않게(카드는 위 규칙이 파생 라이트 색을 받는다) */
 html:root:root:root[data-theme="light"] .pd-pick-hub.pd-hub-v2 .pd-hub-section { background: linear-gradient(180deg, #edeef4, #f2f3f7); }
 html:root:root:root[data-theme="light"] .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-section-head { background: rgba(var(--sc), .1); }
 html:root:root:root[data-theme="light"] .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-section-head h2 { color: #141414; }
}

/* 모바일(≤767px) 랭커픽: 카드의 회원 아바타 아이콘은 보이지 않는다(메달·레벨 아이콘·닉네임은 그대로). */
@media (max-width:767px) { html:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-ava { display:none; } }

@media (max-width: 767px) {   /* 모바일 랭커픽 헤더 아이콘 색 = PC /top3 같은 섹션 아이콘의 최종 computed color(다크 rgb · 라이트 color(srgb)). 박스 크기·배치·제목·테두리는 그대로 */
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="total_profit"] .pd-hub-section-icon { color: rgb(229, 168, 75); }
 html:root:root:root:root[data-theme="light"] .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="total_profit"] .pd-hub-section-icon { color: color(srgb 0.504627 0.391529 0.243294); }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_10_to_20"] .pd-hub-section-icon { color: rgb(89, 182, 249); }
 html:root:root:root:root[data-theme="light"] .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_10_to_20"] .pd-hub-section-icon { color: #0662a4; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_more_20"] .pd-hub-section-icon { color: rgb(163, 214, 92); }
 html:root:root:root:root[data-theme="light"] .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_more_20"] .pd-hub-section-icon { color: #496a1b; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_100"] .pd-hub-section-icon { color: rgb(46, 230, 166); }
 html:root:root:root:root[data-theme="light"] .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_100"] .pd-hub-section-icon { color: color(srgb 0.131451 0.517961 0.428863); }
}

/* TOP10 확대(PC·태블릿): 공식 조회는 부문마다 10명을 주고, 모바일(≤767px)은 기존처럼 앞의 3명만 보인다. 제목은 PC 'TOP10' · 모바일 'TOP3'. */
.pd-hub-v2 .pd-hub-t-m { display:none; }
@media (max-width:767px) {
 .pd-hub-v2 .pd-hub-t-pc { display:none; }
 .pd-hub-v2 .pd-hub-t-m { display:inline; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-list > .pd-hub-pick-row:nth-child(n+4) { display:none; }
}

/* 태블릿(768~900px): 8열 표가 카드 폭보다 넓어 오른쪽 열이 잘렸다 — 카드 안에서 가로로 밀어 볼 수 있게 하고 표 최소 폭을 둔다(모바일 ≤767px·PC ≥901px 은 그대로). */
@media (min-width:768px) and (max-width:900px) {
 html:root .pd-hub-v2 .pd-hub-section { overflow-x:auto; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-list-head, html:root .pd-hub-v2 .pd-hub-section .pd-hub-pick-list { min-width:880px; }
 html:root .pd-hub-v2 .pd-hub-section .pd-hub-row-rank .pd-rank-no { display:inline-flex; align-items:center; justify-content:center; line-height:1; }
}
@media (min-width:768px) {
 html:root .pd-hub-v2 .pd-hub-row-rank .pd-rank-no { display:inline-flex; align-items:center; justify-content:center; line-height:1; }
}

@media (max-width: 767px) {   /* ── 모바일 랭커픽 섹션 헤더·외곽: 모바일 홈 TOP3 픽 섹션과 같은 규칙(포인트색 변수만 부문별). 카드 내부는 건드리지 않는다 ── */
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="total_profit"] { --sc: 241, 196, 91; --hd: #E9C16D; --hd-rgb: 233, 193, 109; --ic: 229, 168, 75; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_10_to_20"] { --sc: 89, 182, 249; --hd: #59B6F9; --hd-rgb: 89, 182, 249; --ic: 89, 182, 249; }   /* 블루 #59B6F9 — 모바일 홈 같은 섹션과 같은 값 */
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_more_20"] { --sc: 163, 214, 92; --hd: #A3D65C; --hd-rgb: 163, 214, 92; --ic: 163, 214, 92; }   /* 라임그린 #A3D65C */
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_100"] { --sc: 46, 230, 166; --hd: #50C8B0; --hd-rgb: 80, 200, 176; --ic: 46, 230, 166; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section { overflow: hidden; border: 1px solid rgba(var(--sc), .38); border-radius: 16px; background: linear-gradient(180deg, rgba(var(--sc), .09), rgba(var(--sc), 0) 90px), #0a1030; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-section-head { display: flex; align-items: center; gap: 8px; min-height: 0; margin: 10px 10px 0; padding: 2px; border: 0; border-bottom: 1px solid rgba(var(--hd-rgb), .35); background: none; box-shadow: none; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-section-head > div { flex: 1 1 auto; min-width: 0; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-section-head p { display: none; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-section-icon { display: inline-flex; flex: none; align-items: center; justify-content: center; box-sizing: border-box; width: 30px; height: 30px; min-width: 30px; border: 1px solid rgba(var(--ic), .5); border-radius: 10px; background: rgba(var(--ic), .14); color: rgb(var(--ic)); }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-section-icon .pd-hub-ico-m { width: 22px; height: 22px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-section-head h2 { margin: 0; overflow: visible; color: #fff; font-size: 17px; font-weight: 800; letter-spacing: -.4px; line-height: 1.5; text-overflow: clip; white-space: normal; overflow-wrap: break-word; }   /* 긴 번역은 줄임표 대신 두 줄까지 허용(한국어는 한 줄) */
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-acc { color: var(--hd); font-weight: inherit; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-list { padding: 8px 10px 10px; }
}

@media (max-width: 767px) {   /* ── 모바일 랭커픽 간결형 카드: 경기·선택 픽이 먼저 보이게, 통계 칩은 작게, 여백 축소. 헤더·외곽·색은 그대로 ── */
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row { padding: 7px 10px 8px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-tipster { font-size: 14px; line-height: 1.25; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-rank .pd-rank-no { width: 24px; height: 24px; min-width: 24px; font-size: 12px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-result b { height: 22px; padding: 0 9px; font-size: 11px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-row-stats { gap: 3px 5px; margin-top: 2px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-chip { height: 19px; gap: 3px; padding: 0 6px; border-radius: 6px; font-size: 10.5px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-chip svg { width: 11px; height: 11px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-chip em { font-size: 10px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-chip b { font-size: 11.5px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event { padding: 6px 0 0; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event .pd-hub-row-match { column-gap: 6px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event .pd-hub-team { gap: 4px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event .pd-hub-tname { font-size: 13.5px; font-weight: 800; line-height: 1.2; color: #fff; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event .pd-hub-logo, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event .pd-hub-logo img { width: 22px; height: 22px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event .pd-hub-vs { font-size: 10.5px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when { margin-top: 2px; font-size: 10.5px; line-height: 1.25; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-pick { margin-top: 6px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-pick-lbl { min-height: 32px; padding: 0 8px; font-size: 10.5px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-pick .rt-pick-chip { min-height: 32px; padding: 3px 8px; font-size: 14px; line-height: 1.2; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-odds { min-width: 58px; min-height: 32px; margin-top: 6px; padding: 1px 8px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-odds-lbl { font-size: 9.5px; line-height: 1.1; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-odds b { font-size: 14px; line-height: 1.1; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-list { gap: 7px; }
}

@media (max-width: 767px) {   /* ── 모바일 랭커픽 간결형: 상단(메달·닉네임/결과) ─ 구분선 ─ 경기 ─ 보조 정보 한 줄(리그 | 일시 | 적중률 | 수익) ─ 통합 PICK·배당 행 ── */
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "rank tip res" "event event event" "when when when" "pick pick odds"; gap: 0 8px; padding: 7px 10px 8px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-stats, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-chip { display: none; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event { margin-top: 6px; padding: 6px 0 0; border-top: 1px solid rgba(148, 163, 200, .18); }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event .pd-hub-tname { font-size: 14px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when { grid-area: when; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 1px 6px; margin-top: 3px; color: var(--rt-text-2, #b7bfd8); font-size: 11px; line-height: 1.45; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when b { overflow: visible; font-weight: 500; white-space: normal; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when u { text-decoration: none; opacity: .35; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when .pd-hub-st { white-space: nowrap; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when .pd-hub-st b { color: #fff; font-size: 11.5px; font-weight: 700; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when .pd-hub-st.is-profit b { color: #2ee6a6; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when .pd-hub-st.is-profit b.pd-profit-down { color: #ff8b8b; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-pick { margin-top: 6px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-pick .rt-pick-chip { border-right: 0; border-radius: 0; justify-content: flex-start; padding-left: 12px; text-align: left; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-odds { flex-direction: row; gap: 6px; min-width: 0; margin: 6px 0 0 -8px; padding: 1px 12px; border: 1px solid rgba(var(--sc), .55); border-left: 1px solid rgba(148, 163, 200, .35); border-radius: 0 9px 9px 0; background: rgba(var(--sc), .1); }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-odds-lbl { font-size: 10.5px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-odds b { font-size: 15px; }
}
@media (max-width: 767px) {   /* 간결형 보정: 보조 정보 한 줄 안에서 라벨·값이 붙어 있게(inline), 여백·로고를 더 줄여 카드 높이 축소 */
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row { padding: 6px 10px 7px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when b, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when .pd-hub-st b { display: inline; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when { margin-top: 2px; gap: 0 5px; font-size: 10.5px; line-height: 1.4; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when .pd-hub-st b { font-size: 11px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event { margin-top: 5px; padding-top: 5px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event .pd-hub-logo, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event .pd-hub-logo img { width: 20px; height: 20px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-pick { margin-top: 5px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-odds { margin-top: 5px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-pick-lbl, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-pick .rt-pick-chip, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-odds { min-height: 30px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-list { gap: 6px; }
}

@media (max-width: 767px) {   /* ── 보조 정보에서 리그명 제거: 일시 | 적중률 | 수익. 구분자는 요소 왼쪽 선(border)으로 그려, 줄바꿈 시 줄 맨 앞 선은 컨테이너(overflow)가 잘라 단독으로 남지 않는다 ── */
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > b, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > u { display: none; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when { gap: 1px 0; margin-left: -6px; overflow: hidden; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > time, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > .pd-hub-st { margin-left: -1px; padding: 0 6px; border-left: 1px solid rgba(148, 163, 200, .35); }
}

@media (max-width: 767px) {   /* ── PICK·배당 한 덩어리 박스 + 보조 정보 중앙 정렬 ──
   끊겨 보이던 원인: ① 기존 규칙(.pd-hub-row-pick margin-right:8px)이 선택 픽 박스와 배당 박스 사이를 8px 벌렸고, ② PICK 라벨만 테두리가 없어 선택 픽 박스(위·아래 1px 선)와 높이·선이 어긋났다. */
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-pick { margin-right: 0; align-items: stretch; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-odds { align-self: stretch; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-pick-lbl { box-sizing: border-box; border: 1px solid rgba(var(--sc), .55); border-right: 0; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-pick .rt-pick-chip { box-sizing: border-box; border: 1px solid rgba(var(--sc), .55); border-width: 1px 0; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-odds { box-sizing: border-box; border-color: rgba(var(--sc), .55); border-left-color: rgba(148, 163, 200, .35); }
 /* 보조 정보: 한 줄 묶음을 카드 가운데로. 구분선은 항목 사이에만(한 줄이라 줄 끝·줄 시작에 홀로 남지 않음) */
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when { flex-wrap: nowrap; justify-content: center; margin: 2px 0 0; overflow: visible; white-space: nowrap; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > time, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > .pd-hub-st { margin-left: 0; padding: 0 7px; border-left: 0; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > time ~ .pd-hub-st, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > .pd-hub-st ~ .pd-hub-st { border-left: 1px solid rgba(148, 163, 200, .35); }
}
@media (max-width: 360px) {   /* 좁은 폰: 글자를 한 단계 줄여 한 줄을 지킨다 */
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when { font-size: 10px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > time, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > .pd-hub-st { padding: 0 5px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when .pd-hub-st b { font-size: 10.5px; }
}
@media (max-width: 330px) {   /* 아주 좁은 폰: 줄바꿈을 허용하되 구분선은 없애(홀로 남는 선 방지) 각 줄을 가운데 정렬 */
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when { flex-wrap: wrap; white-space: normal; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > time ~ .pd-hub-st, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > .pd-hub-st ~ .pd-hub-st { border-left: 0; }
}

@media (max-width: 767px) {   /* ── 랭커픽 카드(홈 TOP3 · /top3 공용): 경기명 한 줄 좌측 정렬(홈팀 로고·팀명 · VS · 원정팀 로고·팀명), 일시|적중률|수익도 같은 좌측 기준선. 홈 최신 픽·피드와 같은 방식 ── */
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event .pd-hub-row-match { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 2px 8px; width: 100%; text-align: left; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event .pd-hub-team, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-event .pd-hub-team:last-child { flex: 0 1 auto; flex-direction: row; justify-content: flex-start; min-width: 0; text-align: left; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when { justify-content: flex-start; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > time, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > .pd-hub-st { padding: 0 7px 0 0; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > time ~ .pd-hub-st, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > .pd-hub-st ~ .pd-hub-st { padding-left: 7px; }
}
@media (max-width: 360px) {
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > time, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > .pd-hub-st { padding-right: 5px; }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > time ~ .pd-hub-st, html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section .pd-hub-pick-row .pd-hub-row-when > .pd-hub-st ~ .pd-hub-st { padding-left: 5px; }
}


/* PC(≥1024px) 랭커픽 TOP3 부문 아이콘 색 — 모바일에서 확정한 색 체계(골드 · 블루 · 라임그린 · 민트). 박스 투명도(테두리 .4 · 배경 .12)·크기·모서리는 기존 그대로 */
@media (min-width: 1024px) {
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_10_to_20"] .pd-hub-section-icon { color: rgb(89, 182, 249); border-color: rgba(89, 182, 249, .4); background: rgba(89, 182, 249, .12); }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_pick_more_20"] .pd-hub-section-icon { color: rgb(163, 214, 92); border-color: rgba(163, 214, 92, .4); background: rgba(163, 214, 92, .12); }
 html:root:root:root:root .pd-pick-hub.pd-hub-v2 .pd-hub-section[data-hub-sort="percentage_100"] .pd-hub-section-icon { color: rgb(80, 200, 176); border-color: rgba(80, 200, 176, .4); background: rgba(80, 200, 176, .12); }
}