/* extracted verbatim 2026-08-28 estate speed sweep. New content = new filename. */

    /* ============================================================
       WPP = WTA Player Props namespace — built on the global Site.Master
       design system (electric-blue action, green-for-money, Geist + mono).
       All prop-card, promo-row, unlock, reasoning class names preserved
       exactly as ItemDataBound and JS toggleReasoning() depend on them.
       ============================================================ */
    .wpp-wrapper {
        width: 92%;
        max-width: 1140px;
        margin: 80px auto 0;
        content-visibility: auto;
        contain-intrinsic-size: 1px 900px;
    }

    /* --- BREADCRUMB --- */
    .wpp-breadcrumb {
        display: flex;
        flex-wrap: wrap;
        gap: 0.4em;
        align-items: center;
        margin-bottom: 1.5em;
        font-family: var(--mono);
        font-size: 0.72em;
        color: var(--ink-faint);
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }
    .wpp-breadcrumb a       { color: var(--ink-dim); text-decoration: none; transition: color 0.15s; }
    .wpp-breadcrumb a:hover { color: var(--action-hi); }
    .wpp-breadcrumb .sep    { color: var(--line-strong); }

    /* --- POP WRAP --- */
    .wpp-pop-wrap { margin-bottom: 1.5em; }

    /* --- PAGE HEADER --- */
    .wpp-page-header {
        margin-bottom: 1.5em;
    }
    .wpp-badges { display: flex; flex-wrap: wrap; gap: 0.5em; margin-bottom: 0.9em; }
    .wpp-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.4em;
        background: rgba(70,140,255,0.1);
        color: var(--accent-ink);
        font-family: var(--mono);
        font-size: 0.68em;
        font-weight: 700;
        padding: 0.35em 0.8em;
        border-radius: 2em;
        border: 1px solid var(--card-edge);
        text-transform: uppercase;
        letter-spacing: 0.06em;
    }
    .wpp-h1 {
        font-family: var(--display);
        font-size: clamp(1.7rem, 4.2vw, 2.5rem);
        font-weight: 900;
        color: var(--ink);
        letter-spacing: -0.025em;
        line-height: 1.1;
        margin: 0 0 0.45em;
    }
    .wpp-h1 .wpp-accent { color: var(--action-hi); }
    .wpp-desc {
        font-size: 1.02em;
        color: var(--ink-dim);
        max-width: 760px;
        line-height: 1.6;
        margin: 0 0 1.1em;
    }
    .wpp-desc strong { color: var(--ink); }
    .wpp-desc a { color: var(--action-hi); text-decoration: none; }

    /* --- PROOF STRIP + PRIMARY CTA ROW --- */
    .wpp-trust-row {
        display: flex;
        flex-wrap: wrap;
        gap: 0.75em;
        align-items: center;
    }
    .wpp-trust-row .bb-proof:hover { border-color: var(--card-edge); }

    /* --- AEO ANSWER CAPSULE --- */
    .wpp-aeo-panel {
        position: relative;
        background: var(--panel);
        border: 1px solid var(--card-edge);
        border-radius: 16px;
        padding: 1.4em;
        margin: 0 0 1.5em;
        box-shadow: 0 20px 42px -24px var(--accent-glow);
        overflow: hidden;
    }
    .wpp-aeo-panel::after {
        content: '';
        position: absolute;
        inset: 0;
        border-radius: inherit;
        background: radial-gradient(140% 85% at 50% -12%, rgba(70,140,255,0.12), transparent 62%);
        pointer-events: none;
    }
    .wpp-aeo-grid {
        display: grid;
        grid-template-columns: 1.2fr 0.8fr;
        gap: 1.25em;
        position: relative;
        z-index: 1;
    }
    @media (max-width: 900px) { .wpp-aeo-grid { grid-template-columns: 1fr; } }
    .wpp-kicker {
        font-family: var(--mono);
        font-size: 0.68em;
        text-transform: uppercase;
        letter-spacing: 0.09em;
        color: var(--ink-faint);
        margin: 0 0 0.5em;
        display: block;
    }
    .wpp-answer-title {
        font-family: var(--display);
        margin: 0 0 0.5em;
        font-size: 1.1em;
        font-weight: 800;
        color: var(--ink);
    }
    .wpp-answer-text {
        margin: 0 0 0.75em;
        color: var(--ink-dim);
        line-height: 1.65;
        font-size: 0.95em;
    }
    .wpp-answer-text strong { color: var(--ink); }
    .wpp-toc { display: flex; flex-wrap: wrap; gap: 0.5em; margin-top: 0.75em; }
    .wpp-toc a {
        font-family: var(--mono);
        font-size: 0.78em;
        color: var(--ink-dim);
        text-decoration: none;
        border: 1px solid var(--line-strong);
        border-radius: 2em;
        padding: 0.45em 0.8em;
        background: var(--panel-2);
        transition: border-color 0.15s, color 0.15s;
    }
    .wpp-toc a:hover { border-color: var(--card-edge); color: var(--ink); }
    .wpp-key-facts { display: grid; gap: 0.65em; }
    .wpp-fact {
        background: var(--panel-2);
        border: 1px solid var(--line);
        border-radius: 12px;
        padding: 0.8em;
    }
    .wpp-fact .label {
        font-size: 0.65em;
        text-transform: uppercase;
        color: var(--ink-faint);
        display: block;
        margin-bottom: 0.3em;
        font-family: var(--mono);
        letter-spacing: 0.07em;
    }
    .wpp-fact .value {
        font-family: var(--mono);
        font-weight: 700;
        color: var(--ink);
        font-size: 0.88em;
    }

    /* --- SECTION LEAD-IN --- */
    .wpp-section-head { margin: 0 0 1.1em; }
    .wpp-section-head h2 {
        font-family: var(--display);
        font-size: clamp(1.15rem, 2.5vw, 1.5rem);
        font-weight: 900;
        letter-spacing: -0.02em;
        color: var(--ink);
        margin: 0 0 0.3em;
    }
    .wpp-section-head p {
        color: var(--ink-dim);
        font-size: 0.95em;
        line-height: 1.55;
        margin: 0;
        max-width: 720px;
    }

    /* --- PERFORMANCE CARD (ambient-lift) --- */
    .performance-spotlight-container-single { margin-bottom: 1.5em; }
    .single-performance-card {
        position: relative;
        background: var(--panel);
        border: 1px solid var(--card-edge);
        border-radius: 16px;
        padding: 1.5em;
        overflow: hidden;
        box-shadow: 0 20px 42px -24px var(--accent-glow);
    }
    .single-performance-card::after {
        content: '';
        position: absolute;
        inset: 0;
        border-radius: inherit;
        background: radial-gradient(140% 85% at 50% -12%, rgba(70,140,255,0.12), transparent 62%);
        pointer-events: none;
    }
    .single-performance-card > * { position: relative; z-index: 1; }
    .performance-card-header-area { display: flex; align-items: center; gap: 0.6em; margin-bottom: 1.25em; }
    .main-card-title-single { font-family: var(--display); font-size: 1.15rem; font-weight: 800; margin: 0; color: var(--ink); }
    .performance-main-icon { color: var(--action-hi); }
    .main-performance-metrics-row { display: grid; grid-template-columns: 1fr 2fr; gap: 1.5em; }
    .metric-main-roi-panel { display: flex; flex-direction: column; justify-content: center; }
    .main-roi-value { font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 3.1rem; font-weight: 800; color: var(--model); line-height: 1; }
    .roi-label { font-size: 0.65rem; text-transform: uppercase; color: var(--ink-faint); font-family: var(--mono); letter-spacing: 0.08em; margin-bottom: 0.35em; }
    .metric-other-stats-panel { display: grid; grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); gap: 0.75em; }
    .sub-metric-item { background: var(--panel-2); border: 1px solid var(--line); padding: 0.8em; border-radius: 12px; }
    .sub-metric-label { font-size: 0.62rem; text-transform: uppercase; color: var(--ink-faint); display: block; margin-bottom: 0.3em; font-family: var(--mono); letter-spacing: 0.06em; }
    .sub-metric-value { font-family: var(--mono); font-variant-numeric: tabular-nums; font-weight: 700; color: var(--ink); font-size: 1.05rem; }

    /* --- PROP CARDS — ambient-lift; all class names preserved exactly for ItemDataBound + JS --- */
    .tip-row.player-prop-row {
        position: relative;
        background: var(--panel);
        border: 1px solid var(--card-edge);
        border-radius: 16px;
        padding: 1.4em;
        margin-bottom: 1.25em;
        box-shadow: 0 20px 42px -24px var(--accent-glow);
        overflow: hidden;
        transition: transform 0.18s, box-shadow 0.18s;
    }
    .tip-row.player-prop-row::after {
        content: '';
        position: absolute;
        inset: 0;
        border-radius: inherit;
        background: radial-gradient(140% 85% at 50% -12%, rgba(70,140,255,0.1), transparent 62%);
        pointer-events: none;
    }
    .tip-row.player-prop-row > * { position: relative; z-index: 1; }
    .tip-row.player-prop-row:hover { transform: translateY(-2px); box-shadow: 0 26px 50px -22px var(--accent-glow); }
    .game-details {
        padding-bottom: 0.75em;
        border-bottom: 1px solid var(--line);
        font-size: 0.85em;
        color: var(--ink-dim);
        margin-bottom: 1em;
        display: flex;
        justify-content: space-between;
        gap: 0.65em;
        flex-wrap: wrap;
        font-family: var(--mono);
    }
    .game-details a { color: var(--action-hi); text-decoration: none; }
    .game-details .starts-in { font-weight: 700; color: var(--action-hi); margin-left: auto; white-space: nowrap; }
    /* Player avatar slot — same rule as the ATP twin, so the two pages cannot drift.
       Replaces the old class-less inline-styled img (inline styles beat CSS). */
    .tennis-face { width: 22px; height: 22px; object-fit: contain; vertical-align: middle; margin: 0 4px; border-radius: 999px; border: 1px solid var(--line); background: var(--panel-2); }
    /* The monogram fallback (AthleteFaces.Img branch 3) is a span carrying this same class, so
       a player with no resolved face still occupies the identical 22px circle and the line never
       reflows. Initials styling comes from the shared .tlogo-ph / .bb-ph-22 rules in Site.Master. */
    span.tennis-face { display: inline-flex; align-items: center; justify-content: center; }
    .player-section { margin-bottom: 1em; }
    .player-info .player-name { font-family: var(--display); font-size: 1.1em; font-weight: 700; color: var(--ink); }
    .stats-body {
        display: flex;
        gap: 1.5em;
        align-items: center;
        margin-bottom: 1em;
        font-family: var(--mono);
        font-variant-numeric: tabular-nums;
        font-size: 0.9em;
        flex-wrap: wrap;
    }
    .stats-body strong { color: var(--ink-faint); margin-right: 5px; font-weight: 500; }
    .stats-body .probability span { color: var(--model); font-weight: 700; }
    .stats-body .edge { color: var(--model); font-weight: 700; }
    .tip-footer {
        display: flex;
        gap: 1.5em;
        padding-top: 1em;
        border-top: 1px solid var(--line);
        font-family: var(--mono);
        font-variant-numeric: tabular-nums;
        font-size: 0.9em;
        flex-wrap: wrap;
    }
    .tip-footer strong { color: var(--ink-faint); margin-right: 5px; font-weight: 500; }
    .tip-footer .decimal-odds, .tip-footer .american-odds { color: var(--ink); font-weight: 700; }
    .tip-reasoning { padding-top: 1em; border-top: 1px solid var(--line); margin-top: 1em; }
    .reason-toggle {
        display: flex;
        justify-content: space-between;
        padding: 0.6em 0.85em;
        background: var(--panel-2);
        border-radius: 12px;
        cursor: pointer;
        font-weight: 600;
        font-size: 0.9rem;
        color: var(--ink);
        border: 1px solid var(--line);
        transition: border-color 0.15s, background 0.15s;
    }
    .reason-toggle:hover { background: rgba(70,140,255,0.08); border-color: var(--card-edge); }
    .reason-text {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease;
        padding: 0 0.85em;
        font-size: 0.92rem;
        line-height: 1.65;
        color: var(--ink-dim);
    }
    .reason-text.expanded { max-height: 2000px; padding: 0.85em; }

    /* --- LOCKED-TEASE UNLOCK --- */
    .unlock-bet-container { text-align: center; padding: 0.65em 0 0; border-top: 1px solid var(--line); margin-top: 1em; }
    .btn-unlock {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 0.7em 1.3em;
        background: var(--accent-grad);
        color: #fff;
        border: none;
        border-radius: 12px;
        text-decoration: none;
        font-family: var(--ui);
        font-weight: 600;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 12px 26px -7px var(--accent-glow);
        transition: filter 0.18s, transform 0.18s;
    }
    .btn-unlock:hover { filter: brightness(1.07); transform: translateY(-1px); }

    /* --- IN-FEED PROMO ROW (ambient-lift) --- */
    .promo-row-container.item-as-promo {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 1.4em;
        background: var(--panel);
        border-radius: 16px;
        border: 1px solid var(--card-edge);
        box-shadow: 0 20px 42px -24px var(--accent-glow);
        gap: 1.25em;
        flex-wrap: wrap;
        overflow: hidden;
    }
    .promo-row-container.item-as-promo::after {
        content: '';
        position: absolute;
        inset: 0;
        border-radius: inherit;
        background: radial-gradient(140% 85% at 50% -12%, rgba(70,140,255,0.14), transparent 62%);
        pointer-events: none;
    }
    .promo-row-container.item-as-promo > * { position: relative; z-index: 1; }
    .promo-text-line1 { font-size: 0.85em; color: var(--ink-dim); font-family: var(--mono); text-transform: uppercase; letter-spacing: 0.05em; }
    .promo-text-line2 { font-family: var(--display); font-size: 1.2em; font-weight: 700; color: var(--ink); margin-top: 0.25em; }
    .all-access-pro-button {
        display: inline-flex;
        align-items: center;
        gap: 0.5em;
        padding: 0.8em 1.5em;
        background: var(--accent-grad);
        color: #fff;
        font-family: var(--ui);
        font-weight: 700;
        text-decoration: none;
        border-radius: 12px;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 12px 26px -7px var(--accent-glow);
        transition: filter 0.18s, transform 0.18s;
    }
    .all-access-pro-button:hover { filter: brightness(1.07); transform: translateY(-1px); }
    .bb-button-logo { height: 20px; }

    /* --- UPSELL / EMAIL SIGNUP (ambient-lift) --- */
    .wpp-email-section { margin: 2em 0 0; }
    .wpp-email-card {
        position: relative;
        background: var(--panel);
        border: 1px solid var(--card-edge);
        border-radius: 16px;
        padding: 2em;
        box-shadow: 0 20px 42px -24px var(--accent-glow);
        overflow: hidden;
    }
    .wpp-email-card::after {
        content: '';
        position: absolute;
        inset: 0;
        border-radius: inherit;
        background: radial-gradient(140% 85% at 50% -12%, rgba(70,140,255,0.12), transparent 62%);
        pointer-events: none;
    }
    .wpp-email-card > * { position: relative; z-index: 1; }

    /* --- SEO CONTENT SECTIONS --- */
    .wpp-seo { margin-top: 2.5em; }
    .wpp-seo-title {
        font-family: var(--display);
        font-size: 1.2em;
        font-weight: 900;
        letter-spacing: -0.015em;
        margin: 0 0 0.7em;
        border-bottom: 1px solid var(--line);
        padding-bottom: 0.75em;
        color: var(--ink);
    }
    .wpp-seo-desc {
        font-size: 0.95em;
        color: var(--ink-dim);
        max-width: 820px;
        margin-bottom: 1em;
        line-height: 1.7;
    }
    .wpp-seo-desc a { color: var(--action-hi); text-decoration: none; }
    .wpp-seo-desc p { margin-bottom: 0.75em; }

    /* --- TABLES --- */
    .bb-table {
        width: 100%;
        border-collapse: collapse;
        overflow: hidden;
        border-radius: 12px;
        border: 1px solid var(--line);
        background: var(--panel-2);
    }
    .bb-table th, .bb-table td {
        padding: 0.8em;
        border-bottom: 1px solid var(--line);
        vertical-align: top;
        font-size: 0.88em;
    }
    .bb-table th {
        text-align: left;
        font-size: 0.7em;
        text-transform: uppercase;
        letter-spacing: 0.08em;
        color: var(--ink-faint);
        background: var(--panel);
        font-family: var(--mono);
    }
    .bb-table td { color: var(--ink-dim); line-height: 1.6; }
    .bb-table tr:last-child td { border-bottom: none; }
    .bb-table code { font-family: var(--mono); color: var(--ink); }

    /* --- FAQ DETAILS --- */
    .bb-details {
        border: 1px solid var(--line);
        border-radius: 12px;
        background: var(--panel-2);
        padding: 0.85em;
        transition: border-color 0.15s;
    }
    .bb-details[open] { border-color: var(--card-edge); }
    .bb-details summary {
        cursor: pointer;
        font-weight: 700;
        font-size: 0.92em;
        color: var(--ink);
        padding: 0.25em 0;
        list-style: none;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 1em;
    }
    .bb-details summary::-webkit-details-marker { display: none; }
    .bb-details summary::after { content: '+'; font-family: var(--mono); color: var(--action-hi); font-size: 1.1em; }
    .bb-details[open] summary::after { content: '−'; }
    .bb-details .answer {
        color: var(--ink-dim);
        padding: 0.7em 0 0.25em;
        line-height: 1.7;
        font-size: 0.9em;
    }
    .bb-details + .bb-details { margin-top: 0.65em; }

    /* --- STATS CARDS --- */
    .persuasive-stats-container { margin: 2.5em 0; text-align: center; }
    .persuasive-stats-cards-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 1.25em;
    }
    .stat-card {
        background: var(--panel);
        border: 1px solid var(--line);
        border-radius: 16px;
        padding: 1.75em;
        transition: transform 0.25s, border-color 0.25s;
    }
    .stat-card:hover { transform: translateY(-4px); border-color: var(--card-edge); }
    .stat-icon-container { font-size: 2.4rem; color: var(--action-hi); margin-bottom: 0.65em; }
    .stat-number { font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 2.8rem; font-weight: 800; color: var(--ink); display: block; line-height: 1.15; }
    .stat-label  { font-family: var(--mono); font-size: 0.78rem; font-weight: 700; color: var(--action-hi); text-transform: uppercase; letter-spacing: 0.06em; display: block; margin: 0.5em 0; }
    .stat-text   { color: var(--ink-dim); line-height: 1.6; font-size: 0.92em; }

    /* --- PARTNERS BANNER --- */
    .partners-section { background-color: var(--void); padding: 30px 0; overflow: hidden; white-space: nowrap; margin-top: 2.5em; border-top: 1px solid var(--line); }
    .partners-logos-wrapper { display: inline-block; animation: wpp-scroll 40s linear infinite; }
    .partners-logos { display: inline-flex; gap: 60px; padding-right: 60px; }
    .partners-logos i { font-size: 40px; color: var(--ink-faint); transition: color 0.3s; vertical-align: middle; }
    .partners-logos i:hover { color: var(--action-hi); }
    @keyframes wpp-scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-100%); } }

    /* --- MOBILE --- */
    @media (max-width: 768px) {
        .main-performance-metrics-row { grid-template-columns: 1fr; }
        .metric-main-roi-panel { margin-bottom: 1em; }
        .stats-body, .tip-footer { flex-direction: column; align-items: flex-start; gap: 0.5em; }
        .promo-row-container.item-as-promo { flex-direction: column; align-items: stretch; text-align: center; }
        .game-details { flex-direction: column; gap: 5px; }
        .game-details .starts-in { margin-left: 0; }
        .all-access-pro-button, .btn-unlock { width: 100%; justify-content: center; }
    }

    /* --- ACCESSIBILITY --- */
    .wpp-quick-link:focus-visible,
    .wpp-toc a:focus-visible,
    .btn-unlock:focus-visible,
    .all-access-pro-button:focus-visible,
    .reason-toggle:focus-visible,
    .bb-details summary:focus-visible {
        outline: 2px solid var(--action-hi);
        outline-offset: 2px;
    }

    .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
    .noselect { user-select: none; }