/* Full-season Pro previews, isolated from the illustrative product walkthrough. */
.audience-section .audience-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.audience-section .audience-card { padding: 28px 25px 22px; display: flex; flex-direction: column; }
.audience-section .audience-card h3 { font-size: 24px; }
.audience-section .audience-card > p { font-size: 13px; }
.audience-section .audience-tags { margin-top: auto; padding-top: 22px; }
.audience-section .audience-card .text-link { font-size: 12px; }
.audience-section .section-heading > p { max-width: 435px; }
.audience-note { color: #9bb0c7; font-size: 12px; margin-top: 24px; line-height: 1.8; }
.pro-teasers { padding-top: 0; }
.pro-teasers .section-heading { margin-bottom: 30px; }
.pro-season-bar { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 15px 19px; margin-bottom: 22px; border: 1px solid #2c4b62; background: #102334; border-radius: 7px; }
.season-choice { color: #c9f4f7; font-size: 13px; font-weight: 600; display: flex; align-items: center; gap: 10px; }
.season-choice svg { width: 18px; height: 18px; color: var(--cyan); }
.season-scope { font-size: 11px; color: #a2bad0; text-align: right; }
.tier-board-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.tier-board { min-width: 0; background: #0e1b2b; border: 1px solid #30465c; border-radius: 11px; overflow: hidden; }
.tier-board-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 25px 24px 22px; }
.tier-board-header .tiny-label { color: #80bdce; font-size: 9px; margin-bottom: 10px; }
.tier-board h3 { font-size: 23px; line-height: 1.25; }
.tier-board-header > svg { color: #70afc3; margin-top: 3px; }
.pairings-board .tier-board-header .tiny-label { color: #e6a5b4; }
.pairings-board .tier-board-header > svg { color: #e6a5b4; }
.tier-rows { margin: 0 16px; border-top: 1px solid #2d4056; }
.tier-row { display: grid; grid-template-columns: 46px minmax(0, 1fr); align-items: stretch; min-height: 134px; border-bottom: 1px solid #293c52; }
.tier-letter { display: grid; place-items: center; width: 46px; font-size: 26px; font-weight: 750; border-right: 1px solid #344b60; color: var(--tier-color); background: var(--tier-bg); }
.tier-s { --tier-color: #ffabb9; --tier-bg: #522c3a55; }
.tier-a { --tier-color: #f5c28f; --tier-bg: #57422b55; }
.tier-b { --tier-color: #eddd91; --tier-bg: #534e2b44; }
.tier-c { --tier-color: #8be0d2; --tier-bg: #25544d44; }
.tier-picks { display: flex; align-items: center; justify-content: space-evenly; gap: 10px; padding: 16px 10px; min-width: 0; overflow: hidden; }
.teaser-champion { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; width: 67px; flex: 0 0 67px; }
.teaser-portrait { position: relative; width: 54px; height: 54px; padding: 2px; border: 1px solid #65899f; border-radius: 6px; background: #172b3e; overflow: hidden; }
.teaser-portrait img { width: 100%; height: 100%; object-fit: cover; border-radius: 3px; }
.teaser-champion strong { font-size: 11px; font-weight: 600; line-height: 1.35; white-space: nowrap; color: #deebf6; }
.teaser-champion small { font-size: 9px; line-height: 1.2; color: #91a9c1; }
.teaser-champion.concealed { user-select: none; pointer-events: none; }
.teaser-champion.concealed .teaser-portrait { border-color: #34566e; background: #122b3e; }
.teaser-champion.concealed .teaser-portrait img { filter: blur(18px) grayscale(1); transform: scale(1.8); opacity: .12; }
.teaser-champion.concealed .teaser-portrait::before { content: ""; position: absolute; inset: 0; background: #08111eb8; z-index: 1; }
.teaser-champion.concealed .teaser-portrait::after { content: "?"; position: absolute; inset: 0; display: grid; place-items: center; z-index: 2; color: #b2d8e7; font-size: 25px; font-weight: 600; line-height: 1; }
.teaser-champion.concealed strong { display: block; background: #6a7f99; border-radius: 4px; width: 45px; height: 7px; margin-top: 4px; filter: blur(4px); opacity: .3; }
.teaser-champion.concealed small { display: block; background: #40546c; border-radius: 4px; width: 28px; height: 5px; filter: blur(3px); opacity: .25; }
.pair-preview { display: flex; gap: 8px; align-items: flex-start; padding-right: 12px; border-right: 1px solid #2c4056; }
.pair-preview:last-child { border-right: 0; padding-right: 0; }
.pair-preview .teaser-champion { width: 62px; flex-basis: 62px; }
.pair-preview .teaser-portrait { width: 49px; height: 49px; }
.pairings-board .tier-picks { gap: 12px; }
.pairings-board .teaser-champion.revealed .teaser-portrait { border-color: #a87889; }
.tier-board-bottom { padding: 16px 24px; display: flex; justify-content: flex-end; gap: 14px; align-items: center; }
.tier-board-bottom .text-link { color: #abedf3; font-size: 11px; flex-shrink: 0; }
.pairings-board .tier-board-bottom .text-link { color: #f0bac5; }
.ranking-context { margin-top: 23px; padding: 17px 20px; border: 1px solid #293f55; border-radius: 6px; }
.ranking-context summary { font-size: 12px; color: #c2d3e5; cursor: pointer; min-height: 25px; }
.ranking-context p { color: #9fb4cb; font-size: 12px; line-height: 1.85; max-width: 960px; padding-top: 14px; }
.pro-teasers > .evidence-note { max-width: none; margin-top: 22px; }
@media(max-width:1100px) {
  .audience-section .audience-card { padding: 25px 21px 20px; }
  .audience-section .audience-card h3 { font-size: 21px; }
  .tier-board-grid { gap: 18px; }
  .tier-board-header, .tier-board-bottom { padding-inline: 18px; }
  .tier-board h3 { font-size: 21px; }
  .tier-picks { gap: 6px; padding-inline: 8px; }
  .teaser-champion { width: 58px; flex-basis: 58px; }
  .teaser-portrait { width: 48px; height: 48px; }
  .pair-preview { gap: 4px; padding-right: 7px; }
  .pair-preview .teaser-champion { width: 48px; flex-basis: 48px; }
  .pair-preview .teaser-portrait { width: 44px; height: 44px; }
  .pairings-board .tier-picks { gap: 8px; }
  .tier-board-bottom { flex-direction: column; align-items: flex-start; gap: 7px; }
}
@media(max-width:900px) {
  .audience-section .audience-grid { grid-template-columns: 1fr; }
  .audience-section .audience-card h3 { font-size: 25px; }
  .audience-section .audience-card > p { max-width: 650px; }
  .tier-board-grid { grid-template-columns: 1fr; }
  .tier-board-header { padding: 25px 24px 19px; }
  .tier-board h3 { font-size: 25px; }
  .tier-letter { width: 52px; }
  .tier-row { grid-template-columns: 52px minmax(0, 1fr); min-height: 134px; }
  .teaser-champion { width: 74px; flex-basis: 74px; }
  .teaser-portrait { width: 58px; height: 58px; }
  .pair-preview { gap: 22px; padding-right: 22px; }
  .pair-preview .teaser-champion { width: 65px; flex-basis: 65px; }
  .pair-preview .teaser-portrait { width: 54px; height: 54px; }
  .tier-board-bottom { flex-direction: row; align-items: center; padding-inline: 24px; }
}
@media(max-width:500px) {
  .pro-season-bar { flex-direction: column; align-items: flex-start; gap: 5px; padding: 15px; }
  .season-scope { text-align: left; font-size: 10px; }
  .tier-board-header { padding: 23px 18px 17px; }
  .tier-board h3 { font-size: 23px; }
  .tier-rows { margin-inline: 10px; }
  .tier-letter { width: 36px; font-size: 23px; }
  .tier-row { grid-template-columns: 36px minmax(0, 1fr); min-height: 112px; }
  .tier-picks { gap: 5px; padding: 14px 7px; }
  .teaser-champion { width: 52px; flex-basis: 52px; }
  .teaser-portrait { width: 43px; height: 43px; }
  .teaser-champion strong { font-size: 10px; }
  .teaser-champion small { font-size: 8px; }
  .pair-preview { gap: 3px; padding-right: 5px; }
  .pair-preview .teaser-champion { width: 46px; flex-basis: 46px; }
  .pair-preview .teaser-portrait { width: 40px; height: 40px; }
  .pairings-board .tier-picks { gap: 6px; }
  .tier-board-bottom { padding-inline: 18px; gap: 10px; flex-direction: column; align-items: flex-start; }
  .ranking-context { padding-inline: 16px; }
  .ranking-context p { font-size: 11px; }
}
@media(max-width:360px) {
  .tier-picks { gap: 3px; padding-inline: 4px; }
  .teaser-champion { width: 44px; flex-basis: 44px; }
  .teaser-portrait { width: 39px; height: 39px; }
  .pair-preview .teaser-champion { width: 39px; flex-basis: 39px; }
  .pair-preview .teaser-portrait { width: 35px; height: 35px; }
  .pair-preview { gap: 2px; padding-right: 4px; }
  .pairings-board .tier-picks { gap: 4px; }
}
