/* RankTipster Match Detail V2 renewal. Presentation only: source odds and forms stay intact. */
html { scroll-behavior:smooth; }
html:root .pd-md-v5 { --v5-radius:14px; color:var(--rt-text); }
html:root .pd-md-v5 :is(#pd-predict,#pd-analysis,#pd-toon,#pd-h2h) { scroll-margin-top:76px; }

html:root .pd-md-v5 .pd-md-back { margin:0 0 10px; }
html:root .pd-md-v5 .pd-md-back-link { color:var(--rt-muted); font-size:12px; }
html:root .pd-md-v5 .pd-md-hero {
 display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px 24px;
 position:relative; overflow:hidden; margin:0; padding:22px 26px 20px;
 border-radius:var(--v5-radius); background:
 radial-gradient(circle at 50% 0,rgba(117,83,255,.18),transparent 48%),
 linear-gradient(135deg,var(--rt-surface-1),var(--rt-surface-2));
}
html:root .pd-md-v5 .pd-md-hero::before {
 content:""; position:absolute; inset:0; pointer-events:none;
 background:linear-gradient(90deg,rgba(72,139,255,.05),transparent 35%,transparent 65%,rgba(139,92,246,.06));
}
html:root .pd-md-v5 .pd-md-hero>* { position:relative; }
html:root .pd-md-v5 .pd-md-hero-top { grid-area:1/1; justify-content:flex-start; align-self:center; min-width:0; }
html:root .pd-md-v5 .pd-md-hero-meta { grid-area:1/2; margin:0; align-self:center; }
html:root .pd-md-v5 .pd-md-hero-teams { grid-area:2/1/3/-1; grid-template-columns:minmax(0,1fr) 52px minmax(0,1fr); gap:20px; margin:2px auto 0; width:100%; max-width:920px; }
html:root .pd-md-v5 .pd-md-hero-team { flex-direction:column; gap:10px; min-width:0; }
html:root .pd-md-v5 .pd-md-hero-team.is-away { flex-direction:column; }
html:root .pd-md-v5 .pd-md-hero .rt-team-logo { width:56px; height:56px; flex:0 0 56px; }
html:root .pd-md-v5 .pd-md-hero .rt-team-logo img { width:56px; height:56px; object-fit:contain; }
html:root .pd-md-v5 .pd-md-hero .rt-team-initial { font-size:16px; }
html:root .pd-md-v5 .pd-md-hero-team .pd-md-hero-name,
html:root .pd-md-v5 .pd-md-hero-team.is-away .pd-md-hero-name { margin:0; text-align:center; font-size:25px; line-height:1.3; }
html:root .pd-md-v5 .pd-md-hero-vs { align-self:center; font-size:24px; font-weight:800; color:var(--rt-brand); }
html:root .pd-md-v5 .pd-md-hero-solo { grid-area:2/1/3/-1; }

/* The one and only representative market probability now belongs to the Hero. */
html:root .pd-md-v5 .pd-md-hero>.pd-md-probability {
 grid-area:3/1/4/-1; margin:6px 0 0; padding:16px 0 0; border:0; border-top:1px solid var(--rt-border);
 border-radius:0; background:transparent;
}
html:root .pd-md-v5 .pd-md-hero>.pd-md-probability>.pd-md-panel-head { justify-content:center; margin:0 0 12px; }
html:root .pd-md-v5 .pd-md-hero .pd-md-panel-title { font-size:13px; }
html:root .pd-md-v5 .pd-md-hero .pd-md-panel-note { font-size:11px; }
html:root .pd-md-v5 .pd-md-hero .pd-md-prob-choices { max-width:920px; margin:0 auto; gap:18px; }
html:root .pd-md-v5 .pd-md-hero .pd-md-prob-choice { grid-template-columns:minmax(0,1fr) auto; grid-template-rows:auto 7px; min-height:0; gap:7px 10px; }
html:root .pd-md-v5 .pd-md-hero .pd-md-prob-label { min-height:0; text-align:left; font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
html:root .pd-md-v5 .pd-md-hero .pd-md-prob-choice strong { grid-area:1/2; font-size:22px; line-height:1; }
html:root .pd-md-v5 .pd-md-hero .pd-md-prob-bar { grid-area:2/1/3/-1; height:7px; margin:0; }
html:root .pd-md-v5 .pd-md-hero .pd-md-prob-pending { min-height:36px; }

html:root .pd-md-v5 .pd-md-grid { margin:0; }
html:root .pd-md-v5 .pd-md-side>.pd-md-panel { border-radius:var(--v5-radius); }
html:root .pd-md-v5 .pd-md-side .pd-md-panel-head { padding-bottom:12px; border-bottom:1px solid var(--rt-border); }
html:root .pd-md-v5 .pd-v3-tabs { display:flex; gap:0; padding:3px; border:1px solid var(--rt-border); border-radius:10px; background:var(--rt-surface-2); }
html:root .pd-md-v5 .pd-v3-tabs button { flex:1 1 0; min-width:90px; border:0; background:transparent; }
html:root .pd-md-v5 .pd-v3-tabs button[aria-selected="true"] { background:linear-gradient(135deg,var(--rt-data-blue),var(--rt-brand)); }
html:root .pd-md-v5 .pd-v3-pick { min-height:96px; }
html:root .pd-md-v5 .pd-md-cta:not(:disabled) { background:linear-gradient(135deg,var(--rt-data-blue),var(--rt-brand)); }

html:root .pd-md-v5 .pd-v5-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin:26px 0 12px; }
html:root .pd-md-v5 .pd-v5-section-head h2 { margin:0; color:var(--rt-text); font-size:20px; line-height:1.35; }
html:root .pd-md-v5 .pd-v5-section-head p { margin:0; color:var(--rt-muted); font-size:12px; }
html:root .pd-md-v5 .pd-v3-data { margin:0; }
html:root .pd-md-v5 .pd-v3-data>.pd-v5-section-head { grid-column:1/-1; width:100%; }
html:root .pd-md-v5 .pd-v5-analysis-empty { grid-column:1/3; align-self:stretch; display:flex; align-items:center; justify-content:center; }
html:root .pd-md-v5 .pd-v3-data :is(.pd-md-form-col,.pd-md-h2h),
html:root .pd-md-v5 .pd-v5-toon { border-radius:var(--v5-radius); }
html:root .pd-md-v5 .pd-md-form-col { border-top:3px solid var(--rt-data-blue); }
html:root .pd-md-v5 .pd-md-form-col:nth-child(2) { border-top-color:var(--rt-brand); }
html:root .pd-md-v5 .pd-md-h2h { border-top:3px solid var(--rt-text-2); }

html:root .pd-md-v5 .pd-v5-toon { margin:14px 0 0; padding:18px 20px; border:1px solid var(--rt-border); background:var(--rt-surface-1); }
html:root .pd-md-v5 .pd-v5-toon .pd-v5-section-head { margin:0 0 12px; }
html:root .pd-md-v5 .pd-v5-empty { margin:0; padding:24px 16px; border:1px dashed var(--rt-border); border-radius:10px; background:var(--rt-surface-2); color:var(--rt-muted); font-size:13px; text-align:center; }
html:root .pd-md-v5 .pd-md-talk { margin-top:26px; border-radius:var(--v5-radius); }

@media(max-width:700px) {
 html:root .pd-md.pd-md-v5 { width:100%; margin:0; }
 html:root .pd-md-v5 .pd-md-hero { grid-template-columns:minmax(0,1fr); gap:10px; padding:16px 12px; }
 html:root .pd-md-v5 .pd-md-hero-top { grid-area:1/1; justify-content:center; }
 html:root .pd-md-v5 .pd-md-hero-meta { grid-area:2/1; justify-content:center; }
 html:root .pd-md-v5 .pd-md-hero-teams { grid-area:3/1; grid-template-columns:minmax(0,1fr) 30px minmax(0,1fr); gap:5px; }
 html:root .pd-md-v5 .pd-md-hero-solo { grid-area:3/1; }
 html:root .pd-md-v5 .pd-md-hero>.pd-md-probability { grid-area:4/1; padding-top:13px; }
 html:root .pd-md-v5 .pd-md-hero .rt-team-logo,
 html:root .pd-md-v5 .pd-md-hero .rt-team-logo img { width:44px; height:44px; }
 html:root .pd-md-v5 .pd-md-hero .rt-team-logo { flex-basis:44px; }
 html:root .pd-md-v5 .pd-md-hero-team .pd-md-hero-name,
 html:root .pd-md-v5 .pd-md-hero-team.is-away .pd-md-hero-name { font-size:15px; line-height:1.35; }
 html:root .pd-md-v5 .pd-md-hero-vs { font-size:17px; }
 html:root .pd-md-v5 .pd-md-hero .pd-md-prob-choices { gap:8px; }
 html:root .pd-md-v5 .pd-md-hero .pd-md-prob-choice { grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(32px,auto) auto 6px; gap:4px; }
 html:root .pd-md-v5 .pd-md-hero .pd-md-prob-label { white-space:normal; text-align:center; font-size:10px; line-height:1.3; }
 html:root .pd-md-v5 .pd-md-hero .pd-md-prob-choice strong { grid-area:2/1; text-align:center; font-size:20px; }
 html:root .pd-md-v5 .pd-md-hero .pd-md-prob-bar { grid-area:3/1; height:6px; }
 html:root .pd-md-v5 .pd-v3-tabs button { min-width:0; }
 html:root .pd-md-v5 .pd-v5-section-head { align-items:flex-start; flex-direction:column; gap:3px; margin:22px 0 10px; }
 html:root .pd-md-v5 .pd-v5-section-head h2 { font-size:18px; }
 html:root .pd-md-v5 .pd-v5-toon { padding:14px; }
}

@media(max-width:350px) {
 html:root .pd-md-v5 .pd-md-hero { padding-left:9px; padding-right:9px; }
 html:root .pd-md-v5 .pd-md-hero-teams { grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr); gap:3px; }
 html:root .pd-md-v5 .pd-md-hero-team .pd-md-hero-name,
 html:root .pd-md-v5 .pd-md-hero-team.is-away .pd-md-hero-name { font-size:14px; word-break:break-word; }
}

/* Visual V2 second pass: stronger hierarchy without changing any data owner. */
html:root .pd-md-v5 .pd-md-hero { padding:18px 24px 16px; gap:9px 22px; }
html:root .pd-md-v5 .pd-md-hero-teams { max-width:820px; gap:14px; margin-top:0; }
html:root .pd-md-v5 .pd-md-hero-team { display:grid; grid-template-columns:auto minmax(0,1fr); grid-template-rows:auto auto; align-items:center; justify-content:center; column-gap:14px; row-gap:3px; }
html:root .pd-md-v5 .pd-md-hero-team.is-away { grid-template-columns:minmax(0,1fr) auto; }
html:root .pd-md-v5 .pd-md-hero-team .pd-v5-team-side { grid-area:1/2; }
html:root .pd-md-v5 .pd-md-hero-team .rt-team-logo { grid-area:1/1/3/2; }
html:root .pd-md-v5 .pd-md-hero-team .pd-md-hero-name { grid-area:2/2; text-align:left; }
html:root .pd-md-v5 .pd-md-hero-team.is-away .pd-v5-team-side { grid-area:1/1; text-align:right; }
html:root .pd-md-v5 .pd-md-hero-team.is-away .rt-team-logo { grid-area:1/2/3/3; }
html:root .pd-md-v5 .pd-md-hero-team.is-away .pd-md-hero-name { grid-area:2/1; text-align:right; }
html:root .pd-md-v5 .pd-v5-team-side { color:var(--rt-muted); font-size:10px; font-weight:800; letter-spacing:.16em; }
html:root .pd-md-v5 .pd-md-hero-vs { width:44px; height:44px; display:flex; align-items:center; justify-content:center; border:1px solid var(--rt-border); border-radius:50%; background:var(--rt-surface-2); font-size:17px; }
html:root .pd-md-v5 .pd-md-hero>.pd-md-probability { margin-top:3px; padding-top:13px; }
html:root .pd-md-v5 .pd-md-hero .pd-md-prob-choices { max-width:820px; }
html:root .pd-md-v5 .pd-md-hero .pd-md-prob-choice { padding:0 10px; }
html:root .pd-md-v5 .pd-md-hero .pd-md-prob-choice+.pd-md-prob-choice { border-left:1px solid var(--rt-border); }

html:root .pd-md-v5 .pd-md-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(290px,.75fr); gap:14px; align-items:stretch; }
html:root .pd-md-v5 .pd-md-grid>.pd-md-side { grid-column:1; min-width:0; }
html:root .pd-md-v5 .pd-md-grid>.pd-v5-match-info { grid-column:2; min-width:0; }
html:root .pd-md-v5 .pd-md-side>.pd-md-panel { box-sizing:border-box; height:100%; padding:22px; background:linear-gradient(145deg,var(--rt-surface-1),color-mix(in srgb,var(--rt-surface-2) 66%,var(--rt-surface-1))); }
html:root .pd-md-v5 .pd-v5-title-group { display:flex; align-items:baseline; gap:10px; }
html:root .pd-md-v5 .pd-v5-eyebrow { color:var(--rt-data-blue); font-size:10px; font-weight:800; letter-spacing:.13em; }

html:root .pd-md-v5 .pd-v3-pick { min-height:108px; border-color:color-mix(in srgb,var(--rt-border) 72%,var(--rt-data-blue)); background:linear-gradient(180deg,var(--rt-surface-2),var(--rt-surface-1)); }
html:root .pd-md-v5 .pd-v3-pick:hover:not(:disabled):not(.is-ineligible) { transform:translateY(-2px); border-color:var(--rt-data-blue); box-shadow:0 8px 18px rgba(4,12,30,.16); }
html:root .pd-md-v5 .pd-v3-pick .pd-md-out-odds { display:block; color:var(--rt-text); font-size:24px; font-weight:800; line-height:1; }
html:root .pd-md-v5 .pd-v3-pick .pd-v3-out-prob { color:var(--rt-muted); font-size:11px; }
html:root .pd-md-v5 .pd-v3-pick .pd-v3-out-prob b { font-size:12px; font-weight:600; color:var(--rt-muted); }
html:root .pd-md-v5 .pd-v3-pick .pd-v3-out-prob b::before { content:'시장 확률 '; font-weight:500; }
html:root .pd-md-v5 .pd-md-stake { border-color:var(--rt-border); background:var(--rt-surface-2); font-weight:700; }
html:root .pd-md-v5 .pd-md-stake:hover:not(:disabled) { border-color:var(--rt-data-blue); }

html:root .pd-md-v5 .pd-v5-match-info { display:flex; flex-direction:column; padding:22px; border:1px solid var(--rt-border); border-radius:var(--v5-radius); background:linear-gradient(180deg,color-mix(in srgb,var(--rt-surface-2) 64%,var(--rt-surface-1)),var(--rt-surface-1)); }
html:root .pd-md-v5 .pd-v5-info-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:14px; border-bottom:1px solid var(--rt-border); }
html:root .pd-md-v5 .pd-v5-info-head h2 { margin:4px 0 0; font-size:18px; }
html:root .pd-md-v5 .pd-v5-info-state { padding:5px 9px; border:1px solid color-mix(in srgb,var(--rt-positive) 45%,transparent); border-radius:999px; color:var(--rt-positive); background:color-mix(in srgb,var(--rt-positive) 9%,transparent); font-size:10px; font-weight:800; }
html:root .pd-md-v5 .pd-v5-info-list { margin:8px 0 0; }
html:root .pd-md-v5 .pd-v5-info-row { display:grid; grid-template-columns:74px minmax(0,1fr); gap:10px; padding:10px 0; border-bottom:1px solid var(--rt-border-soft); }
html:root .pd-md-v5 .pd-v5-info-row dt { color:var(--rt-muted); font-size:12px; }
html:root .pd-md-v5 .pd-v5-info-row dd { min-width:0; margin:0; color:var(--rt-text); font-size:13px; font-weight:600; text-align:right; overflow-wrap:anywhere; }
html:root .pd-md-v5 .pd-v5-info-note { margin:auto 0 0; padding-top:14px; color:var(--rt-muted); font-size:10px; line-height:1.5; }

html:root .pd-md-v5 .pd-v3-data { gap:14px; }
html:root .pd-md-v5 .pd-v3-data .pd-md-form-col { display:flex; flex-direction:column; padding:18px; background:linear-gradient(180deg,var(--rt-surface-1),color-mix(in srgb,var(--rt-surface-2) 42%,var(--rt-surface-1))); }
html:root .pd-md-v5 .pd-md-form-col .pd-md-form-team { order:1; }
html:root .pd-md-v5 .pd-md-form-col .pd-md-form-sum { order:2; margin:0 0 10px; padding:10px 12px; border:0; border-radius:9px; background:var(--rt-surface-2); }
html:root .pd-md-v5 .pd-md-form-col .pd-md-form-list,
html:root .pd-md-v5 .pd-md-form-col>.pd-md-form-empty { order:3; }
html:root .pd-md-v5 .pd-md-form-col .pd-md-more { order:4; }
html:root .pd-md-v5 .pd-md-form-wdl b { padding:3px 6px; border-radius:5px; background:var(--rt-surface-1); }
html:root .pd-md-v5 .pd-md-form-gd { width:100%; margin-top:4px; color:var(--rt-muted); }
html:root .pd-md-v5 .pd-md-h2h { padding:18px; background:var(--rt-surface-1); box-shadow:inset 0 1px 0 rgba(255,255,255,.02); }
html:root .pd-md-v5 .pd-md-h2h .pd-md-form-empty { padding:20px 8px; }

html:root .pd-md-v5 .pd-v5-toon { display:flex; align-items:center; gap:20px; min-height:0; padding:13px 18px; background:color-mix(in srgb,var(--rt-surface-2) 48%,var(--rt-surface-1)); }
html:root .pd-md-v5 .pd-v5-toon .pd-v5-section-head { flex:0 0 auto; margin:0; }
html:root .pd-md-v5 .pd-v5-toon .pd-v5-section-head h2 { font-size:16px; }
html:root .pd-md-v5 .pd-v5-toon .pd-v5-empty { flex:1 1 auto; padding:0; border:0; background:transparent; text-align:right; }
html:root .pd-md-v5 .pd-md-talk { padding:20px 22px; background:linear-gradient(180deg,var(--rt-surface-1),color-mix(in srgb,var(--rt-surface-2) 38%,var(--rt-surface-1))); }
html:root .pd-md-v5 .pd-md-talk>.pd-md-panel-head { padding-bottom:12px; border-bottom:1px solid var(--rt-border); }

@media(max-width:900px) {
 html:root .pd-md-v5 .pd-md-grid { grid-template-columns:minmax(0,1fr); }
 html:root .pd-md-v5 .pd-md-grid>.pd-md-side,
 html:root .pd-md-v5 .pd-md-grid>.pd-v5-match-info { grid-column:1; }
 html:root .pd-md-v5 .pd-md-grid>.pd-md-side { order:1; }
 html:root .pd-md-v5 .pd-md-grid>.pd-v5-match-info { order:2; }
 html:root .pd-md-v5 .pd-v5-match-info { padding:18px; }
}

@media(max-width:700px) {
 html:root .pd-md-v5 .pd-md-hero { padding:14px 11px 13px; }
 html:root .pd-md-v5 .pd-md-hero-team,
 html:root .pd-md-v5 .pd-md-hero-team.is-away { display:flex; flex-direction:column; gap:5px; }
 html:root .pd-md-v5 .pd-md-hero-team .pd-v5-team-side,
 html:root .pd-md-v5 .pd-md-hero-team.is-away .pd-v5-team-side { order:1; text-align:center; }
 html:root .pd-md-v5 .pd-md-hero-team .rt-team-logo,
 html:root .pd-md-v5 .pd-md-hero-team.is-away .rt-team-logo { order:2; }
 html:root .pd-md-v5 .pd-md-hero-team .pd-md-hero-name,
 html:root .pd-md-v5 .pd-md-hero-team.is-away .pd-md-hero-name { order:3; text-align:center; }
 html:root .pd-md-v5 .pd-md-hero-vs { width:30px; height:30px; font-size:13px; }
 html:root .pd-md-v5 .pd-md-hero .pd-md-prob-choice { padding:0 4px; }
 html:root .pd-md-v5 .pd-md-side>.pd-md-panel { padding:16px 13px; }
 html:root .pd-md-v5 .pd-v5-title-group { display:block; }
 html:root .pd-md-v5 .pd-v5-title-group .pd-v5-eyebrow { display:block; margin-bottom:3px; }
 html:root .pd-md-v5 .pd-v3-pick { min-height:76px; }
 html:root .pd-md-v5 .pd-v3-pick .pd-md-out-odds { font-size:21px; }
 html:root .pd-md-v5 .pd-v5-match-info { padding:16px 14px; }
 html:root .pd-md-v5 .pd-v3-data .pd-md-form-col,
 html:root .pd-md-v5 .pd-md-h2h { padding:15px; }
 html:root .pd-md-v5 .pd-v5-toon { align-items:flex-start; flex-direction:column; gap:5px; padding:12px 14px; }
 html:root .pd-md-v5 .pd-v5-toon .pd-v5-empty { width:100%; text-align:left; font-size:11px; }
 html:root .pd-md-v5 .pd-md-talk { padding:16px 14px; }
}