/*
 * Approved V4 interaction components layered into Claude's Figma layout.
 * These selectors are intentionally limited to the requested hybrid pieces.
 */

.approved-v5 {
    --figma-night: #0a0f08;
    --figma-gold: #edcb81;
    --figma-gold-soft: #e5c178;
    --figma-white: #eefffa;
    color: var(--figma-white);
    direction: rtl;
    font-family: 'Lama Sans', Tahoma, Arial, sans-serif;
}

/* v45: database-backed poll, Media Kit and unbroken English labels. */
.lp [lang="en"],
.hybrid-english .lp button,
.hybrid-english .lp strong,
.hybrid-english .lp p,
.hybrid-english .lp span,
.hybrid-english .media-kit-card h2 {
    hyphens: none !important;
    -webkit-hyphens: none !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

.responsive-match-card__mvp-poll {
    margin: 22px 18px 0;
    padding: 20px;
    border: 1px solid rgba(237, 203, 129, .35);
    background: rgba(5, 10, 6, .86);
}
.responsive-match-card__mvp-poll h3 { margin: 0 0 14px; color: #edcb81; text-align: center; font-size: 20px; }
.responsive-match-card__mvp-poll > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.responsive-match-card__mvp-poll button {
    min-width: 0; min-height: 46px; padding: 8px 10px; border: 1px solid rgba(238, 255, 250, .18);
    background: #0c1411; color: #fff; display: flex; align-items: center; justify-content: space-between; gap: 8px;
    font: 800 13px/1.1 "Lama Sans Condensed", Arial, sans-serif; cursor: pointer;
}
.responsive-match-card__mvp-poll button span { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.responsive-match-card__mvp-poll button strong { flex: none; color: #edcb81; font: 900 14px/1 "Lama Sans Condensed", Arial, sans-serif; }
.responsive-match-card__mvp-poll button.is-selected { color: #edcb81; background: transparent; border-color: #edcb81; text-shadow: 0 0 14px rgba(237, 203, 129, .65); box-shadow: 0 0 18px 1px rgba(237, 203, 129, .38); }
.responsive-match-card__mvp-poll button.is-selected strong { color: #edcb81; }
.responsive-match-card__mvp-poll p { min-height: 18px; margin: 12px 0 0; color: #eefffa; text-align: center; font-size: 12px; }
.desktop-database-mvp-poll { position: absolute; z-index: 20; left: calc(var(--u) * 485); top: calc(var(--u) * 350); width: calc(var(--u) * 710); margin: 0; box-sizing: border-box; }
.desktop-database-mvp-poll > div { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.media-kit-surface { min-height: 100vh; height: auto !important; background: radial-gradient(circle at 16% 8%, rgba(64, 92, 40, .38), transparent 34%), #080d07; color: #eefffa; font-family: "HT Rakik", Arial, sans-serif; }
.media-kit-desktop { padding: 190px 6.25vw 90px; box-sizing: border-box; }
.media-kit-hero { max-width: 1180px; margin: 0 auto 72px; text-align: center; }
.media-kit-hero > span { display: block; margin-bottom: 26px; color: #edcb81; font: 900 18px/1 "Lama Sans Condensed", Arial, sans-serif; letter-spacing: .22em; }
.media-kit-hero h1 { margin: 0 0 18px; color: #edcb81; font-size: clamp(64px, 6.5vw, 126px); line-height: .95; }
.media-kit-hero p { max-width: 760px; margin: 0 auto; color: rgba(238, 255, 250, .72); font-size: 22px; line-height: 1.7; }
.media-kit-desktop main { max-width: 1680px; margin: auto; }
.media-category-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.media-category-card { position: relative; min-width: 0; min-height: 360px; padding: 34px; border: 1px solid rgba(237, 203, 129, .24); background: linear-gradient(145deg, rgba(17, 28, 20, .96), rgba(8, 14, 9, .96)); color: #eefffa; font-family: inherit; text-align: inherit; cursor: pointer; overflow: hidden; }
.media-category-card__visual { display: grid; width: 116px; height: 116px; margin-bottom: 42px; border: 1px solid rgba(237, 203, 129, .32); color: #edcb81; place-items: center; }
.media-category-card__visual :is(img, svg) { width: 72px; height: 72px; object-fit: contain; fill: none; stroke: currentColor; stroke-width: 1.2; }
.media-category-card h2 { margin: 0 0 12px; color: #edcb81; font-size: 34px; line-height: 1.08; }
.media-category-card p { margin: 0; color: rgba(238, 255, 250, .68); font-size: 17px; line-height: 1.55; }
/* Batch-6 item 4: the open arrow sits at the reading-end corner — LEFT on
   the Arabic site, right on the English one — clear of the description. */
.media-category-card > b { position: absolute; bottom: 24px; inset-inline-end: auto; inset-inline-start: 28px; color: #edcb81; font: 900 24px/1 Arial, sans-serif; }
html:not(.hybrid-english) .media-category-card > b { right: auto; left: 28px; }
.hybrid-english .media-category-card > b { left: auto; right: 28px; }
.media-assets-panel > header { margin-bottom: 36px; }
.media-assets-panel > header h2 { margin: 0; color: #edcb81; font-size: 54px; line-height: 1.05; }
.media-assets-panel > header p { max-width: 720px; color: rgba(238, 255, 250, .68); font-size: 18px; line-height: 1.6; }
.media-category-back { margin-bottom: 32px; padding: 12px 0; border: 0; background: transparent; color: #edcb81; font-family: inherit; font-size: 17px; cursor: pointer; }
.media-kit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.media-kit-card { min-width: 0; overflow: hidden; border: 1px solid rgba(237, 203, 129, .18); background: linear-gradient(145deg, rgba(17, 28, 20, .96), rgba(8, 14, 9, .96)); }
.media-kit-card__preview { aspect-ratio: 16/10; display: grid; place-items: center; overflow: hidden; background: #11190f; color: rgba(237, 203, 129, .18); font: 900 48px/1 "Lama Sans Condensed", Arial, sans-serif; }
.media-kit-card__preview img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.media-kit-card:hover .media-kit-card__preview img { transform: scale(1.035); }
.media-kit-card__body { padding: 24px; }
.media-kit-card__body small { color: #edcb81; font: 900 12px/1 "Lama Sans Condensed", Arial, sans-serif; letter-spacing: .12em; }
.media-kit-card__body h2 { min-height: 2.2em; margin: 11px 0 8px; font-size: 27px; line-height: 1.1; }
.media-kit-card__body p { min-height: 3.2em; margin: 0 0 20px; color: rgba(238, 255, 250, .64); line-height: 1.6; }
.media-kit-card__body a { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #071009; background: #edcb81; padding: 13px 16px; text-decoration: none; font-weight: 800; }
.media-kit-empty { grid-column: 1/-1; min-height: 280px; display: grid; place-items: center; border: 1px dashed rgba(237, 203, 129, .3); color: rgba(238, 255, 250, .6); }
/* Media Kit desktop is a flow layout, so the shared Figma footer sits in flow at the scaled 1920x575 size. */
.media-kit-desktop { padding-bottom: 0; }
.media-kit-shared-footer .approved-footer-root {
    position: relative;
    top: auto;
    left: auto;
    width: calc(100% + 12.5vw);
    height: calc(280px * var(--hybrid-scale, 1));
    margin: 90px -6.25vw 0;
}
.media-kit-mobile { padding: 112px 20px 0; box-sizing: border-box; }
.media-kit-mobile .media-kit-hero { margin-bottom: 42px; }
.media-kit-mobile .media-kit-hero h1 { font-size: 52px; }
.media-kit-mobile .media-kit-hero p { font-size: 16px; line-height: 1.6; }
.media-kit-mobile .media-category-grid { grid-template-columns: 1fr; gap: 18px; }
.media-kit-mobile .media-category-card { min-height: 280px; padding: 26px; }
.media-kit-mobile .media-category-card__visual { width: 88px; height: 88px; margin-bottom: 28px; }
.media-kit-mobile .media-category-card__visual :is(img, svg) { width: 56px; height: 56px; }
.media-kit-mobile .media-kit-grid { grid-template-columns: 1fr; gap: 18px; }
.media-kit-mobile .media-kit-card__body h2 { min-height: 0; font-size: 24px; }
.media-kit-mobile .media-kit-card__body p { min-height: 0; }
.media-kit-mobile .responsive-mobile-footer { margin-inline: -20px; margin-top: 70px; }

@media (min-width: 1024px) and (max-width: 1350px) { :is(.media-category-grid, .media-kit-grid) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 1023.98px), html.hybrid-force-mobile { .desktop-database-mvp-poll { display: none !important; } }

/* ---------- V42: linked match state, Figma-faithful mobile cards, names-only history ---------- */

.history-roster-legacy { display: none !important; }

@media (min-width: 1024px) {
    [data-lp-page="matches"] .matches-desktop-empty-state {
        position: absolute;
        z-index: 8;
        top: calc(var(--u) * 1993);
        left: calc(var(--u) * 118);
        display: grid;
        width: calc(var(--u) * 1681);
        min-height: calc(var(--u) * 120);
        margin: 0;
        box-sizing: border-box;
        border: 1px solid #edcb8136;
        background: #081008a6;
        color: #eefffaa8;
        font-family: 'Lama Sans', Arial, sans-serif;
        font-size: calc(var(--u) * 20);
        line-height: 1.55;
        text-align: center;
        place-items: center;
    }

    [data-lp-page="matches"] .match-result-label {
        --x: 846.5 !important;
        --y: 184 !important;
        width: calc(var(--u) * 132) !important;
        font-size: calc(var(--u) * 15) !important;
        font-weight: 700 !important;
        line-height: 1.02 !important;
        white-space: pre-line !important;
        text-align: center !important;
        text-align-last: center !important;
    }

    [data-lp-page="matches"] .matches-record-title {
        right: auto !important;
        left: 50% !important;
        width: calc(var(--u) * 1500) !important;
        font-size: calc(var(--u) * 60) !important;
        text-align: center !important;
        text-align-last: center !important;
        transform: translateX(-50%) !important;
    }

    [data-lp-page="fan-zone"] :is(.fan-desktop-form-title, .fan-desktop-quiz-title) {
        right: auto !important;
        left: 50% !important;
        width: calc(var(--u) * 1680) !important;
        transform: translateX(-50%) !important;
    }
    [data-lp-page="fan-zone"] :is(.fan-desktop-form-title, .fan-desktop-quiz-title) h2 {
        width: 100% !important;
        font-size: calc(var(--u) * 64) !important;
        line-height: 1.04 !important;
        white-space: nowrap !important;
        text-align: center !important;
        text-align-last: center !important;
        transform: none !important;
    }
    .hybrid-english [data-lp-page="fan-zone"] :is(.fan-desktop-form-title, .fan-desktop-quiz-title) h2 {
        font-size: calc(var(--u) * 54) !important;
        letter-spacing: -.015em;
        white-space: nowrap !important;
    }
    .hybrid-english [data-lp-page="fan-zone"] .hybrid-quiz-v8 h3 {
        width: 100% !important;
        min-height: calc(var(--u) * 62) !important;
        font-size: calc(var(--u) * 31) !important;
        line-height: 1.25 !important;
        white-space: nowrap !important;
        text-align: center !important;
        text-align-last: center !important;
    }

    [data-lp-page^="history-"] .history-roster-desktop {
        position: absolute;
        z-index: 7;
        top: calc(var(--u) * 5276);
        left: calc(var(--u) * 140);
        display: grid;
        width: calc(var(--u) * 1640);
        min-height: calc(var(--u) * 850);
        color: #eefffa;
        direction: ltr;
        grid-template-columns: calc(var(--u) * 620) minmax(0, 1fr);
        align-items: center;
        gap: calc(var(--u) * 90);
    }
    .history-roster-desktop__title {
        margin: 0;
        color: var(--figma-gold);
        direction: rtl;
        font-family: 'HT Rakik', 'Lama Sans', sans-serif;
        font-size: calc(var(--u) * 84);
        font-weight: 750;
        line-height: 1.15;
        text-align: right;
        text-wrap: balance;
    }
    .hybrid-english .history-roster-desktop__title {
        direction: ltr;
        font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif;
        font-size: calc(var(--u) * 68);
        font-weight: 900;
        line-height: 1.05;
        text-align: left;
    }
    .history-name-roster--desktop { display: grid; align-content: center; gap: calc(var(--u) * 68); }
    .history-name-roster--desktop .history-name-group { display: grid; gap: calc(var(--u) * 24); }
    .history-name-roster--desktop .history-name-group h3 {
        margin: 0;
        color: var(--figma-gold);
        direction: rtl;
        font-family: 'HT Rakik', 'Lama Sans', sans-serif;
        font-size: calc(var(--u) * 24);
        line-height: 1.2;
        text-align: center;
    }
    .hybrid-english .history-name-roster--desktop .history-name-group h3 { direction: ltr; font-family: 'Lama Sans', Arial, sans-serif; }
    .history-name-roster--desktop .history-name-group > div {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: calc(var(--u) * 26) calc(var(--u) * 78);
    }
    .history-name-roster--desktop .history-name-card {
        min-width: 0;
        color: #fff;
        direction: ltr;
        font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif;
        font-size: calc(var(--u) * 39);
        font-style: italic;
        line-height: 1.05;
        text-align: center;
        text-transform: uppercase;
        white-space: nowrap;
    }
}

/* V43: mobile team cards are literal scaled copies of the desktop model. */
.responsive-team-page .responsive-person-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: center;
    gap: 34px !important;
}
.desktop-team-card-mobile {
    --u: calc((min(100vw, 402px) - 40px) / 396.87);
    position: relative;
    display: block;
    width: calc(var(--u) * 396.87);
    height: calc(var(--u) * 769.08);
    margin: 0 auto;
    flex: none;
    overflow: visible;
}
.desktop-team-card-mobile .lp-pcard-body { border-radius: calc(var(--u) * 20); }
.desktop-team-card-mobile .lp-platform { pointer-events: auto; }
.desktop-team-card-mobile .team-card-role-icon { top: calc(var(--u) * 492) !important; }
/* The handle centres against the real card box in both directions: the
   over-constrained left/right pair with width:auto resolves to the centre
   whatever the page direction, and visible overflow ends the glyph-top
   clipping; the text-fit pass shrinks anything wider than 92%. */
.desktop-team-card-mobile > p.f-num[dir="ltr"].team-card-name {
    position: absolute;
    left: 0 !important;
    right: 0 !important;
    width: auto !important;
    max-width: 92% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.18 !important;
    text-align: center !important;
    white-space: nowrap;
    transform: none !important;
}
.desktop-team-card-mobile > .team-card-caption {
    position: absolute;
    left: 0 !important;
    right: 0 !important;
    width: auto !important;
    max-width: 92% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
}
.desktop-team-card-mobile .team-card-caption {
    max-height: calc(var(--u) * 68);
    overflow: hidden;
}

@media (max-width: 1023.98px) {
    .responsive-match-card__meta {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        justify-items: center;
        gap: 6px;
        line-height: 1.3;
        text-align: center;
    }
    .responsive-match-card__meta > strong {
        min-width: 0;
        font-weight: 700;
        text-align: center !important;
    }
    .responsive-match-card__mvp {
        display: grid;
        direction: rtl;
        grid-template-columns: auto minmax(0, 1fr);
        justify-content: stretch;
        flex-wrap: nowrap;
    }
    .hybrid-english .responsive-match-card__mvp { direction: ltr; }
    .responsive-match-card__mvp span { text-align: start !important; }
    .responsive-match-card__mvp strong { min-width: 0; text-align: end !important; }

    .responsive-history-detail .responsive-mobile-hero {
        min-height: 540px;
        gap: 14px;
    }
    .responsive-history-detail .responsive-mobile-hero__eyebrow {
        position: relative;
        z-index: 2;
        margin: 0;
        line-height: 1.35;
    }
    .responsive-history-detail .responsive-mobile-hero h1 {
        position: relative;
        z-index: 1;
        margin: 0;
        font-size: clamp(88px, 28vw, 126px);
        line-height: .92;
    }
    .responsive-history-detail .responsive-mobile-hero p {
        margin: 8px 0 0;
    }
    .hybrid-english .responsive-history-detail .responsive-mobile-hero h1 {
        font-size: clamp(82px, 26vw, 116px);
        line-height: .94;
    }
    .responsive-participant-grid { row-gap: 18px; }
}

/* The forced 402px QA view uses a wide browser viewport, so mirror the same
   match and history flow rules without changing production breakpoints. */
html.hybrid-force-mobile .responsive-match-card__meta {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: center !important;
    gap: 6px !important;
    line-height: 1.3 !important;
    text-align: center !important;
}
html.hybrid-force-mobile .responsive-match-card__mvp {
    display: grid !important;
    direction: rtl !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
}
html.hybrid-force-mobile.hybrid-english .responsive-match-card__mvp { direction: ltr !important; }
html.hybrid-force-mobile .responsive-history-detail .responsive-mobile-hero { min-height: 540px !important; gap: 14px !important; }
html.hybrid-force-mobile .responsive-history-detail .responsive-mobile-hero__eyebrow { position: relative !important; z-index: 2 !important; margin: 0 !important; line-height: 1.35 !important; }
html.hybrid-force-mobile .responsive-history-detail .responsive-mobile-hero h1 { position: relative !important; z-index: 1 !important; margin: 0 !important; font-size: 112px !important; line-height: .92 !important; }
html.hybrid-force-mobile.hybrid-english .responsive-history-detail .responsive-mobile-hero h1 { font-size: 104px !important; line-height: .94 !important; }
html.hybrid-force-mobile .responsive-history-detail .responsive-mobile-hero p { margin: 8px 0 0 !important; }

/* V42 visual-QA parity: ?mobileqa=1 keeps a wide browser viewport, so mirror
   the real mobile card and form rules under the force-mobile root as well. */
html.hybrid-force-mobile .responsive-team-page .responsive-person-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 28px !important;
}
html.hybrid-force-mobile .responsive-team-page .responsive-person-card {
    position: relative !important;
    width: 100% !important;
    border-color: #edcb8170 !important;
    background: linear-gradient(155deg, #101a10, #060b07 72%) !important;
    box-shadow: inset 0 0 60px #edcb8108 !important;
    overflow: hidden !important;
}
html.hybrid-force-mobile .responsive-team-page .responsive-person-card__image,
html.hybrid-force-mobile .responsive-team-page .responsive-person-card.is-staff .responsive-person-card__image {
    height: 500px !important;
    background: radial-gradient(circle at 50% 25%, #243324 0, #0b130c 54%, #050906 100%) !important;
}
html.hybrid-force-mobile .responsive-team-page .responsive-person-card__image > img:first-child {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: 50% 12% !important;
    filter: saturate(.92) contrast(1.04);
}
html.hybrid-force-mobile .responsive-team-page .responsive-person-card__shade {
    z-index: 2 !important;
    background: linear-gradient(180deg, transparent 49%, #0710096e 71%, #071009 100%) !important;
}
html.hybrid-force-mobile .responsive-team-page .responsive-person-card__corner {
    z-index: 3 !important;
    width: 86px !important;
    height: 86px !important;
    opacity: .84 !important;
}
html.hybrid-force-mobile .responsive-team-page .responsive-person-card__role {
    z-index: 4 !important;
    right: 18px !important;
    bottom: 18px !important;
    left: auto !important;
    min-height: 38px !important;
    padding: 7px 10px !important;
    border: 1px solid #edcb814e !important;
    background: #071009cf !important;
    font-size: 13px !important;
}
html.hybrid-force-mobile.hybrid-english .responsive-team-page .responsive-person-card__role {
    right: auto !important;
    left: 18px !important;
}
html.hybrid-force-mobile .responsive-team-page .responsive-person-card__role img {
    width: 22px !important;
    height: 22px !important;
}
html.hybrid-force-mobile .responsive-team-page .responsive-person-card__content,
html.hybrid-force-mobile .responsive-team-page .responsive-person-card.is-staff .responsive-person-card__content {
    min-height: 174px !important;
    padding: 24px 22px 20px !important;
}
html.hybrid-force-mobile .responsive-team-page .responsive-person-card h3 {
    font-size: 46px !important;
    line-height: .95 !important;
    text-align: center !important;
}
html.hybrid-force-mobile .responsive-team-page .responsive-person-card p,
html.hybrid-force-mobile .responsive-team-page .responsive-person-card.is-staff p {
    min-height: 0 !important;
    margin-top: 12px !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
    text-align: center !important;
}
html.hybrid-force-mobile .responsive-team-page .responsive-person-card__social {
    margin-top: 19px !important;
    justify-content: center !important;
    gap: 9px !important;
}
html.hybrid-force-mobile .responsive-team-page .responsive-person-card__social span {
    display: grid !important;
    width: 30px !important;
    height: 30px !important;
    border: 1px solid #edcb8160 !important;
    border-radius: 50% !important;
    color: var(--mobile-gold) !important;
    font-size: 9px !important;
    place-items: center !important;
}
html.hybrid-force-mobile .responsive-fan-page .responsive-mobile-hero::before {
    background:
        linear-gradient(180deg, #05100724, #041008a8 68%, #071009 100%),
        url('/v43/embedded-assets/hero-wallpaper-flat-6865726f2d.webp') 50% 0 / auto 520px repeat-x !important;
    opacity: .9 !important;
}
html.hybrid-force-mobile .responsive-mobile-page .fan-message-form-v5 label {
    position: static !important;
    display: grid !important;
    gap: 9px !important;
}
html.hybrid-force-mobile .responsive-mobile-page .fan-message-form-v5 label > span {
    position: static !important;
    display: block !important;
    color: var(--mobile-gold) !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
}
html.hybrid-force-mobile .responsive-mobile-page .fan-message-form-v5 :is(input, textarea) {
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 14px 13px !important;
    background: #081008b3 !important;
    font-family: inherit !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
}
html.hybrid-force-mobile .responsive-mobile-page .fan-message-form-v5 textarea {
    min-height: 150px !important;
    resize: vertical !important;
}

@media (max-width: 1023.98px) {
    /* One substantial Figma-style card per row; mobile gets more height, not fewer details. */
    .responsive-team-page .responsive-person-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 28px !important;
    }
    .responsive-team-page .responsive-person-card {
        position: relative;
        width: 100%;
        border-color: #edcb8170;
        background: linear-gradient(155deg, #101a10, #060b07 72%);
        box-shadow: inset 0 0 60px #edcb8108;
        overflow: hidden;
    }
    .responsive-team-page .responsive-person-card__image,
    .responsive-team-page .responsive-person-card.is-staff .responsive-person-card__image {
        height: clamp(410px, 118vw, 500px);
        background: radial-gradient(circle at 50% 25%, #243324 0, #0b130c 54%, #050906 100%);
        overflow: hidden;
    }
    .responsive-team-page .responsive-person-card__image > img:first-child {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: 50% 12%;
        filter: saturate(.92) contrast(1.04);
    }
    .responsive-person-card__shade {
        position: absolute;
        z-index: 2;
        inset: 0;
        background: linear-gradient(180deg, transparent 49%, #0710096e 71%, #071009 100%);
        pointer-events: none;
    }
    .responsive-team-page .responsive-person-card__corner {
        position: absolute;
        z-index: 3;
        width: 86px;
        height: 86px;
        opacity: .84;
        object-fit: contain;
        pointer-events: none;
    }
    .responsive-person-card__corner--tl { top: -1px !important; right: auto !important; bottom: auto !important; left: -1px !important; transform: rotate(180deg); }
    .responsive-person-card__corner--tr { top: -1px !important; right: -1px !important; bottom: auto !important; left: auto !important; transform: rotate(-90deg); }
    .responsive-person-card__corner--bl { top: auto !important; right: auto !important; bottom: -1px !important; left: -1px !important; transform: rotate(90deg); }
    .responsive-person-card__corner--br { top: auto !important; right: -1px !important; bottom: -1px !important; left: auto !important; }
    .responsive-team-page .responsive-person-card__role {
        position: absolute;
        z-index: 4;
        right: 18px;
        bottom: 18px;
        display: flex;
        min-height: 38px;
        padding: 7px 10px;
        border: 1px solid #edcb814e;
        background: #071009cf;
        color: var(--mobile-gold);
        font-size: 13px;
        align-items: center;
        gap: 8px;
    }
    .hybrid-english .responsive-team-page .responsive-person-card__role { right: auto; left: 18px; }
    .responsive-team-page .responsive-person-card__role img { width: 22px; height: 22px; object-fit: contain; }
    .responsive-team-page .responsive-person-card__content,
    .responsive-team-page .responsive-person-card.is-staff .responsive-person-card__content {
        position: relative;
        min-height: 174px;
        padding: 24px 22px 20px;
    }
    .responsive-team-page .responsive-person-card h3 {
        margin: 0;
        color: #fff;
        font-size: clamp(38px, 11vw, 52px);
        line-height: .95;
        text-align: center !important;
        text-transform: uppercase;
        text-wrap: balance;
    }
    .responsive-team-page .responsive-person-card p,
    .responsive-team-page .responsive-person-card.is-staff p {
        min-height: 0;
        margin: 12px 0 0;
        color: #eeffface;
        font-size: 16px;
        line-height: 1.45;
        text-align: center !important;
    }
    .responsive-team-page .responsive-person-card__social {
        display: flex;
        margin-top: 19px;
        direction: ltr;
        justify-content: center;
        gap: 9px;
    }
    .responsive-team-page .responsive-person-card__social span {
        display: grid;
        width: 30px;
        height: 30px;
        border: 1px solid #edcb8160;
        border-radius: 50%;
        color: var(--mobile-gold);
        font-family: Arial, sans-serif;
        font-size: 9px;
        place-items: center;
    }

    /* History deliberately uses names only; no team-card imagery leaks into this section. */
    .history-name-roster--mobile { display: grid; margin-top: 32px; gap: 38px; }
    .history-name-roster--mobile .history-name-group { display: grid; gap: 17px; }
    .history-name-roster--mobile .history-name-group h3 {
        margin: 0;
        color: var(--mobile-gold);
        font-family: 'HT Rakik', 'Lama Sans', sans-serif;
        font-size: 25px;
        line-height: 1.25;
    }
    .history-name-roster--mobile .history-name-group > div {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }
    .history-name-roster--mobile .history-name-card {
        display: grid;
        min-height: 72px;
        padding: 12px 10px;
        border: 1px solid #edcb813f;
        background: linear-gradient(145deg, #101910, #070c08);
        color: #fff;
        font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif;
        font-size: 20px;
        font-style: italic;
        line-height: 1.05;
        text-align: center !important;
        text-transform: uppercase;
        place-items: center;
        overflow-wrap: normal;
    }

    .responsive-fan-page .responsive-mobile-hero::before {
        background:
            linear-gradient(180deg, #05100724, #041008a8 68%, #071009 100%),
            url('/v43/embedded-assets/hero-wallpaper-flat-6865726f2d.webp') 50% 0 / auto 520px repeat-x !important;
        opacity: .9;
    }

    /* The enhancement class is shared with desktop; reset its absolute labels on mobile. */
    .responsive-mobile-page .fan-message-form-v5 label {
        position: static !important;
        display: grid !important;
        gap: 9px !important;
    }
    .responsive-mobile-page .fan-message-form-v5 label > span {
        position: static !important;
        display: block !important;
        color: var(--mobile-gold) !important;
        font-size: 13px !important;
        line-height: 1.25 !important;
    }
    .responsive-mobile-page .fan-message-form-v5 :is(input, textarea) {
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 14px 13px !important;
        background: #081008b3 !important;
        font-family: inherit !important;
        font-size: 16px !important;
        line-height: 1.5 !important;
    }
    .responsive-mobile-page .fan-message-form-v5 textarea { min-height: 150px !important; resize: vertical !important; }
    .responsive-mobile-page .fan-message-form-v5 :is(input, textarea)::placeholder {
        color: #eefffa5f !important;
        opacity: 1 !important;
        direction: inherit;
        text-align: start;
        unicode-bidi: plaintext;
    }
}

.hybrid-original-nav {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.hybrid-ready [data-loader] { display: none !important; }
[data-lp-page][hidden] { display: none !important; }

/* Visual-QA switch used only with ?mobileqa=1; normal visitors are unaffected. */
.hybrid-force-mobile body { width: 402px !important; margin: 0 auto !important; overflow-x: hidden !important; }
.hybrid-force-mobile .lp { width: 402px !important; max-width: 402px !important; margin: 0 auto !important; }
.hybrid-force-mobile .lp-d { display: none !important; }
.hybrid-force-mobile .lp-m { display: block !important; width: 402px !important; }
.hybrid-force-mobile .approved-nav-desktop { display: none !important; }
.hybrid-force-mobile .approved-nav-mobile { display: block !important; }
.hybrid-force-mobile .approved-subpage-mobile { display: block !important; }

/* ---------- V4 desktop navigation ---------- */

.approved-nav-desktop {
    position: absolute;
    z-index: 80;
    top: 0;
    left: 0;
    width: 1920px;
    height: 128px;
    transform: scale(var(--hybrid-scale, 1));
    transform-origin: 0 0;
    pointer-events: none;
}

.approved-nav-desktop .figma-nav {
    position: absolute;
    z-index: 21;
    inset: 0;
    color: var(--figma-gold-soft);
    font-family: 'HT Rakik', 'Lama Sans', sans-serif;
    font-size: 18.577px;
    font-variation-settings: 'wght' 600;
    font-feature-settings: 'swsh' 1, 'dlig' 1;
    pointer-events: none;
}

.approved-nav-desktop .figma-nav a {
    position: absolute;
    color: inherit;
    line-height: normal;
    text-decoration: none;
    white-space: nowrap;
    transition: color .18s, text-shadow .18s, transform .18s;
    pointer-events: auto;
}

.approved-nav-desktop .figma-nav a span { display: block; }
.approved-nav-desktop .figma-nav a:hover,
.approved-nav-desktop .figma-nav a:focus-visible,
.approved-nav-desktop .figma-nav a.is-active {
    color: #fff1c0;
    text-shadow: 0 0 18px #edcb8180;
}
.approved-nav-desktop .figma-nav a.is-active { color: var(--figma-gold); }
.approved-nav-desktop .nav-design { width: 76px; top: 47px; left: 216px; }
.approved-nav-desktop .nav-fans { top: 54px; left: 385px; }
.approved-nav-desktop .nav-team { top: 54px; left: 731px; }
.approved-nav-desktop .nav-home { top: 54px; left: 1112px; }
.approved-nav-desktop .nav-matches { top: 54px; left: 1404px; font-variation-settings: 'wght' 740; }
.approved-nav-desktop .nav-history { width: 50px; top: 43px; left: 1623px; text-align: center; }
.approved-nav-desktop .nav-language {
    display: grid;
    place-items: center;
    width: 28px;
    height: 25px;
    top: 58px;
    left: 1755px;
    border-radius: 2px;
    transform-origin: 50%;
    transition: background-color .18s, box-shadow .18s, transform .18s !important;
}
.approved-nav-desktop .nav-language img { width: 28px; height: 25px; object-fit: fill; }
.approved-nav-desktop .nav-language:hover,
.approved-nav-desktop .nav-language:focus-visible {
    background: #edcb811f;
    box-shadow: 0 0 20px #edcb8138;
    transform: scale(1.12);
}
.approved-nav-desktop .nav-language:active { transform: scale(.94); }
.approved-nav-desktop .figma-logo {
    position: absolute;
    z-index: 22;
    top: 16px;
    left: 907px;
    width: 97px;
    height: 97px;
    pointer-events: auto;
}
.approved-nav-desktop .figma-logo img { width: 97px; height: 97px; object-fit: contain; }

/* ---------- V4 mobile navigation ---------- */

.approved-nav-mobile {
    position: absolute;
    z-index: 95;
    top: 0;
    left: 0;
    width: 402px;
    height: 760px;
    transform: scale(var(--hybrid-scale, 1));
    transform-origin: 0 0;
    pointer-events: none;
}
.approved-subpage-mobile { display: none; }
.approved-nav-mobile .mobile-brand,
.approved-subpage-mobile .mobile-brand {
    position: absolute;
    z-index: 40;
    top: 43px;
    left: 171.389px;
    width: 70.129px;
    height: 70.129px;
    pointer-events: auto;
}
.approved-nav-mobile .mobile-brand img,
.approved-subpage-mobile .mobile-brand img { width: 100%; height: 100%; object-fit: contain; }
.approved-nav-mobile .mobile-nav-toggle,
.approved-subpage-mobile .mobile-nav-toggle {
    appearance: none;
    position: absolute;
    z-index: 75;
    top: 70px;
    right: 18px;
    display: flex;
    width: 34px;
    height: 15px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    flex-direction: column;
    justify-content: space-between;
    pointer-events: auto;
    -webkit-tap-highlight-color: transparent;
    transition: top .3s cubic-bezier(.16,1,.3,1), right .3s cubic-bezier(.16,1,.3,1), width .3s cubic-bezier(.16,1,.3,1), height .3s cubic-bezier(.16,1,.3,1);
}
.approved-nav-mobile .mobile-nav-toggle span,
.approved-subpage-mobile .mobile-nav-toggle span {
    display: block;
    width: 34px;
    height: 3px;
    border-radius: 3px 0 0 3px;
    background: var(--figma-gold);
    box-shadow: 0 0 12px #edcb8133;
    transform-origin: 50%;
    transition: opacity .22s, transform .32s cubic-bezier(.16,1,.3,1);
}
.mobile-nav-toggle.is-open span:first-child { transform: translateY(6px) rotate(45deg); }
.mobile-nav-toggle.is-open span:nth-child(2) { opacity: 0; }
.mobile-nav-toggle.is-open span:last-child { transform: translateY(-6px) rotate(-45deg); }
.mobile-nav-panel {
    position: fixed;
    z-index: 70;
    top: 0;
    right: 0;
    display: flex;
    width: 402px;
    height: max(100svh, 640px);
    padding: 0 42px;
    border: 0;
    border-right: 2px solid #eff4efe6;
    background: radial-gradient(circle at 50% 5%, #edcb8109, transparent 30%), #010703fe;
    color: var(--figma-gold);
    font-family: 'HT Rakik', 'Lama Sans', sans-serif;
    font-size: 23px;
    line-height: 32px;
    font-variation-settings: 'wght' 600;
    font-feature-settings: 'swsh' 1, 'dlig' 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 17px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    overflow: hidden;
    transition: opacity .34s, visibility 0s linear .34s;
    box-sizing: border-box;
}
.mobile-nav-panel.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition-delay: 0s;
}
.mobile-nav-panel > a {
    position: relative;
    display: block;
    flex: none;
    padding: 0;
    border: 0;
    color: var(--figma-gold) !important;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 0 20px #edcb8114;
    opacity: 0;
    transform: translateY(12px);
    transition: color .18s, opacity .42s, text-shadow .22s, transform .48s cubic-bezier(.16,1,.3,1);
}
.mobile-nav-panel.open > a:not(.mobile-language-link) { opacity: 1; transform: none; }
.mobile-nav-panel.open > a:nth-child(1) { transition-delay: 80ms; }
.mobile-nav-panel.open > a:nth-child(2) { transition-delay: .12s; }
.mobile-nav-panel.open > a:nth-child(3) { transition-delay: .16s; }
.mobile-nav-panel.open > a:nth-child(4) { transition-delay: .2s; }
.mobile-nav-panel.open > a:nth-child(5) { transition-delay: .24s; }
.mobile-nav-panel.open > a:nth-child(6) { transition-delay: .28s; }
.mobile-nav-panel > a:hover,
.mobile-nav-panel > a:focus-visible,
.mobile-nav-panel > a.is-active { color: #fff1c0 !important; text-shadow: 0 0 22px #edcb817a; }
.mobile-nav-panel > a.is-active::after {
    position: absolute;
    right: 50%;
    bottom: -4px;
    width: 28px;
    height: 1px;
    background: var(--figma-gold);
    box-shadow: 0 0 10px #edcb818c;
    content: '';
    transform: translateX(50%);
}
.mobile-nav-panel .mobile-language-link {
    position: absolute;
    top: 25px;
    left: 24px;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    padding: 3px;
    opacity: 0;
}
.mobile-nav-panel.open .mobile-language-link { opacity: .78; transition-delay: .22s; }
.mobile-language-link img { width: 28px; height: 25px; }
/* English moves the burger/close control to the left, so the language link mirrors to the right. */
.hybrid-english .mobile-nav-panel .mobile-language-link { right: 24px; left: auto; }
.approved-subpage-mobile { display: none; }

/* ---------- V4 Next Match ---------- */

.approved-match-desktop-scale {
    position: absolute;
    top: 0;
    right: auto;
    bottom: auto;
    left: 0;
    width: 516.681px;
    height: 410px;
    transform: scale(var(--hybrid-scale, 1));
    transform-origin: 0 0;
}
.approved-match-desktop-scale .hero-match {
    position: absolute;
    z-index: 13;
    top: 0;
    left: 0;
    width: 516.681px;
    height: 410px;
    pointer-events: none;
}
.match-information-line {
    position: absolute;
    top: -7px;
    left: 50%;
    display: grid;
    width: 456px;
    height: 22px;
    grid-template-columns: repeat(3, minmax(0,1fr));
    direction: ltr;
    transform: translateX(-50%);
}
.information-item {
    position: relative;
    display: flex;
    width: auto;
    height: 22px;
    color: #ffffffe6;
    font-family: 'Lama Sans', sans-serif;
    font-size: 14.5px;
    line-height: 22px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    white-space: nowrap;
    overflow: visible;
}
.information-item + .information-item::before { position: absolute; top: 2px; left: 0; width: 1px; height: 18px; background: #ffffff6b; content: ''; }
.information-item svg { flex: none; width: 15px; height: 15px; fill: none; stroke: var(--figma-gold-soft); stroke-width: 1.8px; stroke-linecap: round; stroke-linejoin: round; }
.information-item span { display: block; overflow: hidden; text-overflow: ellipsis; }
.hero-team-logo { position: absolute; top: 44.339px; width: 129.538px; height: 150.044px; object-fit: contain; }
.hero-team-logo--saudi { left: 0; }
.hero-team-logo--opponent { left: 387.143px; }
.match-stage {
    position: absolute;
    z-index: 3;
    top: 26px;
    left: 50%;
    width: 200px;
    margin: 0;
    color: #ffffff3d;
    font-family: 'Lama Sans', sans-serif;
    font-size: 16.568px;
    font-weight: 300;
    line-height: normal;
    letter-spacing: .45px;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap;
    transform: translateX(-50%);
}
.match-title-composition { position: absolute; z-index: 2; top: 48px; left: 50%; display: flex; flex-direction: column; gap: 0; align-items: center; justify-content: flex-start; width: max-content; height: auto; direction: rtl; text-align: center; transform: translateX(-50%); }
.match-title-composition span { position: static; display: block; margin: 0; white-space: nowrap; }
.match-title-arabic { z-index: 2; height: auto; color: var(--figma-gold-soft); font-family: 'Noto Nastaliq Urdu', serif; font-size: 27px; font-weight: 500; line-height: 1.75; text-align: center; }
.match-title-composition .match-title-arabic--first { order: 1; position: static; width: auto; transform: none; }
.match-title-composition .match-title-arabic--second { order: 2; position: static; width: auto; transform: none; }
.match-title-english { position: static; z-index: 3; width: auto; transform: none; color: var(--figma-white); font-family: 'Lama Sans Condensed', sans-serif; font-size: 30px; font-style: italic; font-weight: 900; line-height: 1.06; letter-spacing: .7px; text-align: center; text-transform: uppercase; }
.hero-countdown { position: absolute; top: 228.941px; left: 50%; width: 445.678px; height: 101.136px; direction: ltr; transform: translateX(-50%); }
.countdown-unit { position: absolute; top: 0; width: 97.393px; height: 101.136px; text-align: center; }
.countdown-unit:first-of-type { left: 0; width: 70px; }
.countdown-unit:nth-of-type(2) { left: 97.833px; }
.countdown-unit:nth-of-type(3) { left: 223.059px; }
.countdown-unit:nth-of-type(4) { left: 348.285px; }
.countdown-unit strong { display: block; height: 84px; color: #fff; font-family: 'Lama Sans Condensed', sans-serif; font-size: 56.749px; font-weight: 900; line-height: 84px; letter-spacing: -4px; }
.countdown-unit span:not(.digit) { display: block; color: #ffffff75; font-family: 'Lama Sans', sans-serif; font-size: 17.04px; line-height: 20px; }
.hero-countdown > i { position: absolute; top: 16.142px; width: 1px; height: 60.167px; background: #ffffff57; }
.hero-countdown > i:first-of-type { left: 97.833px; }
.hero-countdown > i:nth-of-type(2) { left: 223.059px; }
.hero-countdown > i:nth-of-type(3) { left: 348.285px; }
.figma-button {
    appearance: none;
    position: absolute;
    z-index: 30;
    display: flex;
    width: 251.439px;
    height: 51.219px;
    padding: 0;
    border: .672px solid var(--figma-gold);
    border-radius: 1px;
    background: transparent;
    color: var(--figma-gold) !important;
    font-family: 'HT Rakik', 'Lama Sans', sans-serif;
    font-size: 24.975px;
    font-variation-settings: 'wght' 740;
    font-feature-settings: 'swsh' 1, 'dlig' 1;
    line-height: normal;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transition: color .21s, background-color .21s, box-shadow .21s, transform .21s;
}
.figma-button::after { position: absolute; inset: 0; background: linear-gradient(108deg, transparent 30%, #ffffff73 50%, transparent 70%); content: ''; pointer-events: none; transform: translateX(130%); transition: transform .52s; }
.figma-button span, .figma-button b { position: relative; z-index: 2; }
.figma-button b { position: absolute; top: 50%; font-family: Arial, sans-serif; font-size: 17px; font-weight: 400; line-height: 1; transform: translateY(-50%); }
.figma-button b:first-child { left: 12px; }
.figma-button b:last-child { right: 12px; }
/* Batch-11 item 2: the filled state belongs to a REAL hover only. Keyboard
   focus draws a ring instead, and focus left behind by an SPA click never
   fills the button — that stuck gold block was the reported glitch. */
.figma-button:hover { background: var(--figma-gold); box-shadow: 0 4px 22px #edcb8145; color: #0c120a !important; }
.figma-button:hover :is(span, b) { color: #0c120a !important; }
.figma-button:focus-visible { outline: 2px solid var(--figma-gold); outline-offset: 3px; }
.figma-button:focus:not(:focus-visible) { background: transparent; box-shadow: none; color: var(--figma-gold) !important; }
.figma-button:hover::after { transform: translateX(-130%); }
.figma-button:active { transform: scale(.975); box-shadow: 0 0 18px #edcb8129; }
.approved-match-desktop-scale .figma-button--hero { z-index: 1000; top: 371.902px; left: 169px; width: 187.027px; height: 38.098px; border-width: .5px; font-size: 18.577px; pointer-events: auto; }
.approved-match-desktop-scale .figma-button--hero b { font-size: 13px; }
.approved-match-desktop-scale .figma-button--hero b:first-child { left: 9px; }
.approved-match-desktop-scale .figma-button--hero b:last-child { right: 9px; }

.approved-match-mobile-scale { position: absolute; top: 0; right: auto; bottom: auto; left: 0; width: 264.892px; height: 216.568px; transform: scale(var(--hybrid-scale, 1)); transform-origin: 0 0; }
.approved-match-mobile-scale .mobile-match-card { position: absolute; z-index: 20; top: 0; left: 0; width: 264.892px; height: 216.568px; }
.mobile-match-meta { position: absolute; top: 0; left: 62.628px; display: grid; width: 144.395px; height: 6px; color: #eefffae0; font-family: 'Lama Sans', sans-serif; font-size: 4.55px; line-height: 6px; direction: ltr; grid-template-columns: 1fr 1px 1fr 1px 1fr; align-items: center; }
.mobile-match-meta > span { display: flex; min-width: 0; align-items: center; justify-content: center; gap: 1.6px; white-space: nowrap; }
.mobile-match-meta b { font-weight: 500; }
.mobile-match-meta svg { flex: none; width: 4.7px; height: 4.7px; fill: none; stroke: var(--figma-gold-soft); stroke-width: 1.65px; stroke-linecap: round; stroke-linejoin: round; }
.mobile-match-meta > i { width: 1px; height: 4.4px; background: #edcb818c; }
.mobile-team-mark { position: absolute; top: 22.732px; width: 66.412px; height: 76.925px; object-fit: contain; filter: drop-shadow(0 9px 18px #0000008c); }
.mobile-team-mark--saudi { left: 0; }
.mobile-team-mark--opponent { left: 198.48px; }
.mobile-match-stage { position: absolute; top: 13px; left: 50%; transform: translateX(-50%); width: max-content; max-width: 140px; margin: 0; color: #eefffa42; font-family: 'Lama Sans', sans-serif; font-size: 8.494px; font-weight: 200; line-height: 13px; text-align: center; white-space: nowrap; }
.mobile-match-title { position: absolute; top: 30px; left: 50%; display: flex; flex-direction: column; gap: 0; align-items: center; justify-content: flex-start; width: max-content; height: auto; direction: rtl; text-align: center; white-space: nowrap; transform: translateX(-50%); }
.mobile-match-title-first, .mobile-match-title-second { z-index: 2; display: block; height: auto; color: var(--figma-gold-soft); font-family: 'Noto Nastaliq Urdu', serif; font-size: 14.5px; font-weight: 500; line-height: 1.75; text-align: center; }
.mobile-match-title .mobile-match-title-first { order: 1; position: static; width: auto; transform: none; }
.mobile-match-title .mobile-match-title-second { order: 2; position: static; width: auto; transform: none; }
.mobile-match-title-english { position: static; z-index: 3; width: auto; transform: none; color: var(--figma-white); font-family: 'Lama Sans Condensed', sans-serif; font-size: 15.5px; font-style: italic; font-weight: 900; line-height: 1.06; letter-spacing: .35px; text-align: center; text-transform: uppercase; }

/* The two Arabic fragments around the English match state are the only
   Arabic copy in this composition that uses the Figma Nastaliq face. */
.lp :is(.match-title-arabic, .mobile-match-title-first, .mobile-match-title-second)[lang="ar"] {
    font-family: 'Noto Nastaliq Urdu', 'Urdu Typesetting', serif !important;
    font-style: normal !important;
    font-weight: 500 !important;
}
.lp :is(.match-title-english, .mobile-match-title-english)[lang="en"] {
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    font-style: italic !important;
    font-weight: 900 !important;
}
.home-match-mvp-prompt { position: absolute; z-index: 4; top: 158px; left: 50%; width: 360px; margin: 0; color: var(--figma-gold-soft); font-family: 'HT Rakik', 'Lama Sans', sans-serif; font-size: 16px; line-height: 1.2; text-align: center; transform: translateX(-50%); }
.mobile-match-card .home-match-mvp-prompt { top: 86px; width: 190px; font-size: 9px; }
.hybrid-english .home-match-mvp-prompt { font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif; }
.mobile-countdown { position: absolute; top: 117.374px; left: 20.412px; display: grid; width: 228.603px; height: 52.135px; color: var(--figma-white); direction: ltr; grid-template-columns: 1fr 1px 1fr 1px 1fr 1px 1fr; align-items: center; }
.mobile-countdown > div { display: grid; height: 52.135px; place-items: start center; }
.mobile-countdown strong { height: 42px; font-family: 'Lama Sans Condensed', sans-serif; font-size: 29.094px; font-weight: 900; line-height: 42px; letter-spacing: -2px; }
.mobile-countdown span:not(.digit) { margin-top: -1px; color: #eefffab8; font-family: 'Lama Sans', sans-serif; font-size: 8.735px; line-height: 10px; }
.mobile-countdown > i { width: 1px; height: 30.847px; background: #eefffa38; }
.mobile-outline-button { position: absolute; z-index: 15; display: grid; border: .55px solid var(--figma-gold); border-radius: 1px; background: transparent; color: var(--figma-gold) !important; font-family: 'HT Rakik', sans-serif; text-align: center; text-decoration: none; grid-template-columns: 13px minmax(0,1fr) 13px; align-items: center; transition: color .24s, background .24s, box-shadow .3s, transform .24s; }
.mobile-outline-button b { color: inherit; font-family: Arial, sans-serif; font-size: 13px; font-weight: 400; line-height: 1; }
.mobile-outline-button span { color: inherit; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mobile-outline-button:hover, .mobile-outline-button:focus-visible, .mobile-outline-button:active { background: var(--figma-gold); color: var(--figma-night) !important; box-shadow: 0 0 30px #edcb813d; transform: translateY(-1px); }
.mobile-match-center-button { top: 187px; left: 62.009px; width: 145.152px; height: 29.568px; font-size: 14.418px; }

.approved-v4-cta { isolation: isolate; }
.approved-v4-cta::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(108deg, transparent 30%, #ffffff73 50%, transparent 70%);
    content: '';
    pointer-events: none;
    transform: translateX(130%);
    transition: transform .52s cubic-bezier(.16,1,.3,1);
}
.approved-v4-cta:hover::after, .approved-v4-cta:focus-visible::after { transform: translateX(-130%); }
.approved-v4-cta:active { transform: scale(.975); }

/* ---------- V4 footer ---------- */

/* Compact columned desktop footer — matches the owner's reference: four
   right-to-left zones (brand · روابط سريعة · تواصل معنا · تابع المنتخب) each with
   its heading, over a thin copyright/legal bar. Reshaped from the original
   575px Figma footer to ~280px so it stays tight under the media-kit teaser.
   The narrow-screen responsive block below still overrides all of this. */
.approved-footer-root { position: absolute; z-index: 90; top: calc(var(--u) * var(--footer-y)); left: 0; width: 100%; height: calc(var(--u) * 280); pointer-events: none; }
.approved-footer-scale { position: absolute; top: 0; left: 0; width: 1920px; height: 280px; transform: scale(var(--hybrid-scale, 1)); transform-origin: 0 0; }
.figma-footer { position: absolute; inset: 0; width: 1920px; height: 280px; color: #11170f; background: var(--figma-gold); overflow: hidden; pointer-events: auto; }
.figma-footer::before { position: absolute; inset: 0; background: radial-gradient(circle at 80% 18%, #ffffff2b, transparent 28%), linear-gradient(115deg, #ffffff14, transparent 35%, #090e080f); content: ''; pointer-events: none; }
.figma-footer::after { position: absolute; right: -10px; bottom: -46px; color: #0b10090e; font-family: 'Lama Sans', sans-serif; font-size: 190px; font-style: italic; font-weight: 900; line-height: 1; letter-spacing: -16px; content: 'OWWC'; pointer-events: none; }
.figma-footer .footer-brand, .figma-footer .footer-links, .figma-footer .footer-contact, .figma-footer .footer-socials, .figma-footer .footer-bottom { position: absolute; z-index: 2; }
.figma-footer .footer-brand { top: 46px; right: 118px; width: 360px; text-align: right; }
.figma-footer .footer-brand img { width: 54px; height: 54px; object-fit: contain; filter: brightness(.13); }
.figma-footer .footer-brand p { margin: 12px 0 4px; font-family: 'HT Rakik', sans-serif; font-size: 26px; line-height: 1.2; font-variation-settings: 'wght' 740; }
.figma-footer .footer-brand > span { font-size: 12px; font-weight: 800; letter-spacing: 1.8px; opacity: .8; }
.figma-footer .footer-links, .figma-footer .footer-contact, .figma-footer .footer-socials { top: 54px; }
.figma-footer .footer-links { right: 760px; width: 210px; }
.figma-footer .footer-contact { right: 1120px; width: 270px; }
.figma-footer .footer-socials { right: 1510px; width: 260px; }
.figma-footer .footer-links h2, .figma-footer .footer-contact h2, .figma-footer .footer-socials h2 { display: block; margin: 0 0 18px; font-size: 20px; font-weight: 900; }
.figma-footer .footer-links a, .figma-footer .footer-contact p, .figma-footer .footer-contact a { display: block; margin: 0 0 11px; color: inherit; font-size: 16px; text-decoration: none; opacity: .8; }
.figma-footer .footer-links a, .figma-footer .footer-contact a { transition: opacity .18s, transform .18s; }
.figma-footer .footer-links a:hover, .figma-footer .footer-links a:focus-visible, .figma-footer .footer-contact a:hover, .figma-footer .footer-contact a:focus-visible { opacity: 1; transform: translateX(-4px); }
.figma-footer .footer-socials > div { display: flex; gap: 12px; }
.figma-footer .footer-socials a, .approved-mobile-footer .footer-socials a { display: grid; width: 44px; height: 44px; border: 1px solid #090e0873; color: inherit; place-items: center; transition: color .18s, background-color .18s, transform .18s; }
.figma-footer .footer-socials a:hover, .figma-footer .footer-socials a:focus-visible { color: var(--figma-gold); background: var(--figma-night); transform: translateY(-3px); }
.figma-footer .footer-socials svg, .approved-mobile-footer .footer-socials svg { width: 19px; height: 19px; fill: currentColor; }
.figma-footer .footer-socials svg rect, .figma-footer .footer-socials svg circle:not(.fill-dot), .approved-mobile-footer svg rect, .approved-mobile-footer svg circle:not(.fill-dot) { fill: none; stroke: currentColor; stroke-width: 1.7px; }
.figma-footer .footer-bottom { right: 118px; bottom: 0; left: 118px; display: flex; height: 52px; border-top: 1px solid #090e0833; font-size: 13px; align-items: center; justify-content: space-between; }
.figma-footer .footer-bottom p { margin: 0; opacity: .7; }
.figma-footer .footer-bottom div { display: flex; gap: 28px; }
.figma-footer .footer-bottom :is(a, span) { color: inherit; text-decoration: none; opacity: .7; }
.figma-footer .footer-bottom a:hover { opacity: 1; }

/* Mobile footer: the copyright used to sit on one line beside the icons and
   crowd them, with a sliver of dead space beneath. It is now a centred stack —
   social icons over the copyright line — filling the band with clear
   separation. */
.approved-mobile-footer { position: absolute; z-index: 100; top: calc(var(--u) * 3758); left: calc(var(--u) * 1); width: calc(var(--u) * 401); height: calc(var(--u) * 65); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: calc(var(--u) * 9); color: #0b1009; background: var(--figma-gold); overflow: hidden; pointer-events: auto; text-align: center; }
.approved-mobile-footer::before { position: absolute; inset: 0; background: radial-gradient(circle at 78% 20%, #fff3, transparent 32%), linear-gradient(110deg, #ffffff1a, transparent 42%, #090e0814); content: ''; pointer-events: none; }
.approved-mobile-footer .footer-socials { position: static; z-index: 2; }
.approved-mobile-footer .footer-socials > div { display: flex; gap: calc(var(--u) * 8); }
.approved-mobile-footer .footer-socials a { width: calc(var(--u) * 24); height: calc(var(--u) * 24); }
.approved-mobile-footer .footer-socials svg { width: calc(var(--u) * 10); height: calc(var(--u) * 10); }
.approved-mobile-footer .footer-bottom { position: static; z-index: 2; display: block; width: 100%; height: auto; font-size: calc(var(--u) * 8); text-align: center; }
.approved-mobile-footer .footer-bottom p { margin: 0; }

/* ---------- V4 fan interactions ---------- */

.fan-marquee-v5 { overflow: hidden; direction: ltr; background: #0c120ac2; border-top: 1px solid #edcb816b; border-bottom: 1px solid #edcb816b; pointer-events: auto; }
.fan-marquee-v5 > div { display: flex; width: max-content; height: 100%; align-items: center; animation: fan-marquee-v5 34s linear infinite; will-change: transform; }
.fan-marquee-v5 p { display: flex; padding: 0 calc(var(--u) * 36); direction: rtl; align-items: center; gap: calc(var(--u) * 22); white-space: nowrap; }
.fan-marquee-v5 strong { color: var(--figma-gold); font-size: calc(var(--u) * 16); }
.fan-marquee-v5 span { color: #eefffab8; font-family: 'HT Rakik', sans-serif; font-size: calc(var(--u) * 18); }
.fan-marquee-v5 i { color: #edcb8170; font-style: normal; }
@keyframes fan-marquee-v5 { to { transform: translateX(-50%); } }

.fan-message-form-v5 { pointer-events: auto; }
.fan-message-form-v5 label { position: relative; display: block; }
.fan-message-form-v5 label > span { position: absolute; z-index: 2; top: calc(var(--u) * 24); right: calc(var(--u) * 28); color: var(--figma-gold); font-size: calc(var(--u) * 13); font-weight: 700; }
.fan-message-form-v5 input, .fan-message-form-v5 textarea {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #edcb8173;
    outline: 0;
    background: #080e08a6;
    color: #effff9;
    font-family: 'HT Rakik', sans-serif;
    font-size: calc(var(--u) * 21);
    transition: border-color .18s, box-shadow .18s;
    pointer-events: auto;
}
.fan-message-form-v5 input { height: calc(var(--u) * 75); padding: calc(var(--u) * 15) calc(var(--u) * 130) calc(var(--u) * 15) calc(var(--u) * 28); }
.fan-message-form-v5 textarea { height: calc(var(--u) * 250); margin-top: calc(var(--u) * 28); padding: calc(var(--u) * 58) calc(var(--u) * 28) calc(var(--u) * 24); resize: none; }
.fan-message-form-v5 input:focus, .fan-message-form-v5 textarea:focus { border-color: var(--figma-gold); box-shadow: inset 0 0 calc(var(--u) * 28) #edcb810a; }
.fan-message-form-v5 [data-form-feedback] { color: #eefffaad; font-size: calc(var(--u) * 13); }

.header-maker-v5 input, .header-maker-v5 select, .header-maker-v5 button, .header-maker-v5 canvas { pointer-events: auto; }
.header-maker-v5__controls label { display: grid; min-height: calc(var(--u) * 72); border-bottom: 1px solid #edcb8166; grid-template-columns: calc(var(--u) * 110) 1fr; align-items: center; }
.header-maker-v5__controls label > span { color: var(--figma-gold); font-size: calc(var(--u) * 13); font-weight: 700; }
.header-maker-v5__controls input, .header-maker-v5__controls select { width: 100%; border: 0; outline: 0; background: transparent; color: #effff9; font-family: 'HT Rakik', sans-serif; font-size: calc(var(--u) * 21); }
.header-maker-v5__controls select { direction: ltr; cursor: pointer; }
.header-maker-v5__preview { border: 1px solid #edcb815c; background: #080d08; overflow: hidden; }
.header-maker-v5__preview > canvas { width: 100%; height: 100%; }
.header-maker-v5__sources { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; pointer-events: none; }
.header-maker-v5__sources img { width: auto; height: auto; max-width: none; }

/* Input descendants must stay interactive inside Claude's pointer-blocking art layers. */
.lp-layer form, .lp-layer input, .lp-layer textarea, .lp-layer select { pointer-events: auto; }

.mobile-team-backdrop {
    z-index: 0;
    border: 1px solid #edcb8120;
    border-radius: calc(var(--u) * 5);
    background:
        radial-gradient(circle at 50% 20%, #edcb8128, transparent 42%),
        linear-gradient(155deg, #142115 0%, #080d08 72%);
    box-shadow: inset 0 0 calc(var(--u) * 65) #0008, 0 0 calc(var(--u) * 35) #edcb810d;
}
.mobile-team-design-bg { z-index: 1; opacity: 1; filter: brightness(1.14) contrast(1.08); }
.mobile-team-players { z-index: 2; mix-blend-mode: lighten; }
.mobile-team-figma-card { isolation: isolate; }
#media-mobile .approved-v4-cta { z-index: 20; }

@media (prefers-reduced-motion: reduce) {
    .fan-marquee-v5 > div { animation: none; }
}

@media (max-width: 1023.98px) {
    .approved-nav-desktop { display: none; }
    .approved-subpage-mobile {
        position: sticky;
        z-index: 160;
        top: 0;
        display: block;
        width: 100%;
        height: 78px;
        border-bottom: 1px solid #edcb813f;
        background: #081008ed;
        backdrop-filter: blur(16px);
        pointer-events: none;
    }
    .approved-subpage-mobile .mobile-brand { top: 12px; right: 18px; left: auto; width: 52px; height: 52px; }
    .approved-subpage-mobile .mobile-nav-toggle { top: 31px; right: auto; left: 18px; }
    .approved-subpage-mobile .mobile-nav-panel { width: 100vw; }

    .approved-footer-root.is-responsive { position: relative; top: auto; left: auto; width: 100%; height: auto; }
    .approved-footer-root.is-responsive .approved-footer-scale { position: relative; width: 100%; height: auto; transform: none; }
    .approved-footer-root.is-responsive .figma-footer {
        position: relative;
        inset: auto;
        display: grid;
        width: 100%;
        height: auto;
        min-height: 370px;
        padding: 42px 22px 74px;
        grid-template-columns: 1fr 1fr;
        gap: 32px 18px;
        box-sizing: border-box;
    }
    .approved-footer-root.is-responsive .figma-footer::after { right: -10px; bottom: -20px; font-size: 130px; letter-spacing: -8px; }
    .approved-footer-root.is-responsive .figma-footer .footer-brand,
    .approved-footer-root.is-responsive .figma-footer .footer-links,
    .approved-footer-root.is-responsive .figma-footer .footer-contact,
    .approved-footer-root.is-responsive .figma-footer .footer-socials,
    .approved-footer-root.is-responsive .figma-footer .footer-bottom { position: relative; inset: auto; width: auto; height: auto; }
    .approved-footer-root.is-responsive .figma-footer .footer-brand { grid-column: 1 / -1; }
    .approved-footer-root.is-responsive .figma-footer .footer-brand img { width: 58px; height: 58px; }
    .approved-footer-root.is-responsive .figma-footer .footer-brand p { margin: 14px 0 4px; font-size: 25px; }
    .approved-footer-root.is-responsive .figma-footer .footer-socials { grid-column: 1 / -1; }
    .approved-footer-root.is-responsive .figma-footer .footer-bottom { display: flex; padding-top: 20px; border-top: 1px solid #090e0833; grid-column: 1 / -1; font-size: 9px; justify-content: space-between; }
}

/* ---------- Verified V8 acceptance fixes ---------- */

.approved-nav-desktop .figma-nav a:not(.nav-language)::after { display: none !important; content: none !important; }
.approved-nav-desktop .figma-nav a:not(.nav-language):hover,
.approved-nav-desktop .figma-nav a:not(.nav-language):focus-visible,
.approved-nav-desktop .figma-nav a:not(.nav-language).is-active {
    text-shadow: 0 0 8px #edcb81, 0 0 24px #edcb8199, 0 0 48px #edcb814d;
}

/* Gold quote marks bracket the caption only; they never collide with the player name. */
[data-lp-page="team"] .hybrid-card-quote-open,
[data-lp-page="team"] .hybrid-card-quote-close {
    z-index: 24 !important;
    filter: brightness(0) saturate(100%) invert(88%) sepia(27%) saturate(721%) hue-rotate(347deg) brightness(98%) contrast(89%) !important;
    opacity: 1 !important;
}
[data-lp-page="team"] .hybrid-card-quote-open { top: calc(var(--u) * 616) !important; left: calc(var(--u) * 39) !important; }
[data-lp-page="team"] .hybrid-card-quote-close {
    top: calc(var(--u) * 684) !important;
    left: calc(var(--u) * 361.43) !important;
    transform: rotate(180deg) !important;
    transform-origin: center;
}

/* The supplied 16:9 trophy film is cropped into the Figma portrait mask without stretching. */
.hybrid-trophy-v8 { overflow: hidden !important; background: transparent !important; isolation: isolate; }
.hybrid-trophy-v8 .lp-trophy-poster { z-index: 1; opacity: 1 !important; transition: opacity .28s ease; }
.hybrid-trophy-v8 .hybrid-trophy-v8__video {
    z-index: 2 !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: 50% 50% !important;
    mix-blend-mode: normal;
    opacity: 0 !important;
    transform: none !important;
    transition: opacity .28s ease !important;
}
.hybrid-trophy-v8.is-video-ready .hybrid-trophy-v8__video { opacity: 1 !important; }
.hybrid-trophy-v8.is-video-ready .lp-trophy-poster { opacity: 0 !important; }

/* Exact V4 quiz component, replacing Claude's absolute blank option rectangles. */
.hybrid-quiz-v8 {
    position: absolute;
    z-index: 26;
    top: calc(var(--u) * 2430);
    left: calc(var(--u) * 290);
    width: calc(var(--u) * 1340);
    min-height: calc(var(--u) * 430);
    color: #eefffa;
    direction: rtl;
    pointer-events: auto;
    transform: none !important;
    clip-path: none !important;
    filter: none !important;
    visibility: visible !important;
}
.hybrid-quiz-v8__card { width: 100%; min-height: calc(var(--u) * 410); box-sizing: border-box; }
.hybrid-quiz-v8 header { display: flex; color: var(--figma-gold); font-size: calc(var(--u) * 15); align-items: end; justify-content: space-between; }
.hybrid-quiz-v8 header strong { direction: ltr; font-family: 'Lama Sans Condensed', sans-serif; font-size: calc(var(--u) * 31); font-style: italic; }
.hybrid-quiz-v8__progress { width: 100%; height: calc(var(--u) * 2); margin-top: calc(var(--u) * 16); direction: ltr; background: #edcb8129; overflow: hidden; }
.hybrid-quiz-v8__progress i { display: block; width: 10%; height: 100%; background: var(--figma-gold); box-shadow: 0 0 calc(var(--u) * 15) #edcb8173; transition: width .36s; }
.hybrid-quiz-v8 h3 { position: relative !important; z-index: 3; display: block !important; min-height: calc(var(--u) * 82); margin: calc(var(--u) * 37) 0 0; color: #eefffa !important; font-family: 'HT Rakik', sans-serif; font-size: calc(var(--u) * 34); font-weight: 650; line-height: 1.5; text-align: center; opacity: 1 !important; visibility: visible !important; transform: none !important; clip-path: none !important; }
.hybrid-quiz-v8__options { display: grid; margin-top: calc(var(--u) * 32); grid-template-columns: repeat(2, minmax(0,1fr)); gap: calc(var(--u) * 18); }
.hybrid-quiz-v8__options button {
    min-width: 0;
    min-height: calc(var(--u) * 68);
    padding: calc(var(--u) * 10) calc(var(--u) * 18);
    border: 1px solid #edcb8173;
    background: #0810088c;
    color: var(--figma-gold);
    font-family: 'HT Rakik', sans-serif;
    font-size: calc(var(--u) * 20);
    cursor: pointer;
    transition: color .18s, border-color .18s, background .18s, opacity .18s, transform .18s;
}
.hybrid-quiz-v8__options button:hover,
.hybrid-quiz-v8__options button:focus-visible { color: var(--figma-gold); border-color: var(--figma-gold); background: #edcb8118; transform: translateY(calc(var(--u) * -2)); }
.hybrid-quiz-v8__options button.is-correct,
.hybrid-quiz-v8__options button.is-correct:hover { color: #061009 !important; border-color: #7fd89a !important; background: #7fd89a !important; opacity: 1 !important; transform: translateY(calc(var(--u) * -2)); }
.hybrid-quiz-v8__options button.is-wrong,
.hybrid-quiz-v8__options button.is-wrong:hover { color: #fff !important; border-color: #ff6767 !important; background: #8e2929 !important; opacity: 1 !important; }
.hybrid-quiz-v8__options button:disabled { cursor: default; }
.hybrid-quiz-v8 [data-quiz-feedback] { min-height: calc(var(--u) * 24); margin: calc(var(--u) * 18) 0 0; color: #eefffaa3; font-size: calc(var(--u) * 13); text-align: center; }
.hybrid-quiz-v8__restart { display: block; min-width: calc(var(--u) * 210); height: calc(var(--u) * 52); margin: calc(var(--u) * 20) auto 0; border: 1px solid var(--figma-gold); background: transparent; color: var(--figma-gold); font-family: 'HT Rakik', sans-serif; font-size: calc(var(--u) * 18); cursor: pointer; }
.hybrid-quiz-v8__restart[hidden] { display: none; }

/* Stable match-center replacement: fixed columns and clipped names in every state. */
.hybrid-matches-v8 {
    position: absolute;
    z-index: 55;
    top: calc(var(--u) * 174);
    left: 0;
    width: 100%;
    height: calc(var(--u) * 3200);
    color: #eefffa;
    direction: rtl;
    background: radial-gradient(circle at 50% 0, #20301c80, transparent 31%), #0f130c;
    overflow: hidden;
}
.hybrid-matches-v8__intro { position: absolute; top: calc(var(--u) * 92); right: 0; left: 0; text-align: center; }
.hybrid-matches-v8__intro h1 { margin: 0; color: var(--figma-gold); font-family: 'HT Rakik', sans-serif; font-size: calc(var(--u) * 110); line-height: 1.2; }
.hybrid-matches-v8__intro p { width: calc(var(--u) * 650); margin: calc(var(--u) * 25) auto 0; color: #eefffac0; font-size: calc(var(--u) * 22); line-height: 1.7; }
.hybrid-match-card { position: absolute; top: calc(var(--u) * 530); left: calc(var(--u) * 120); width: calc(var(--u) * 1680); height: calc(var(--u) * 620); border: 1px solid #edcb8170; background: linear-gradient(110deg,#080e08f7,#152212dc,#080e08f7); box-shadow: inset 0 0 calc(var(--u) * 90) #edcb8108; overflow: hidden; box-sizing: border-box; }
.hybrid-match-card::after { position: absolute; inset: calc(var(--u) * 13); border: 1px solid #edcb8115; content: ''; pointer-events: none; }
.hybrid-match-card__meta { position: absolute; z-index: 3; top: calc(var(--u) * 38); right: calc(var(--u) * 70); left: calc(var(--u) * 70); display: grid; direction: ltr; grid-template-columns: minmax(220px,1fr) auto minmax(290px,1fr); gap: calc(var(--u) * 28); align-items: center; }
.hybrid-match-card__meta span, .hybrid-match-card__meta small { color: #edcb81b3; font-family: 'Lama Sans', sans-serif; font-size: calc(var(--u) * 16); letter-spacing: calc(var(--u) * 1.7); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hybrid-match-card__meta strong { color: var(--figma-gold); font-family: 'HT Rakik', sans-serif; font-size: calc(var(--u) * 27); text-align: center; white-space: nowrap; }
.hybrid-match-card__meta small { text-align: right; }
.hybrid-match-card__versus { position: absolute; z-index: 3; top: calc(var(--u) * 104); right: calc(var(--u) * 150); left: calc(var(--u) * 150); display: grid; direction: ltr; grid-template-columns: minmax(0,1fr) calc(var(--u) * 190) minmax(0,1fr); align-items: center; }
.hybrid-match-card__team { display: grid; min-width: 0; justify-items: center; align-content: center; overflow: hidden; }
.hybrid-match-card__team img, .hybrid-opponent-mark { width: calc(var(--u) * 118); height: calc(var(--u) * 118); object-fit: contain; }
.hybrid-opponent-mark { display: grid; border: 1px solid #edcb8170; border-radius: 50%; color: var(--figma-gold); font-family: 'Lama Sans Condensed', sans-serif; font-size: calc(var(--u) * 35); font-weight: 900; place-items: center; }
.hybrid-match-card__team h2 { max-width: 100%; margin: calc(var(--u) * 8) 0 0; padding: 0 calc(var(--u) * 14); font-family: 'Lama Sans Condensed', sans-serif; font-size: calc(var(--u) * 30); font-style: italic; text-align: center; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.hybrid-match-card__team > span:last-child { color: #eefffa70; font-size: calc(var(--u) * 11); letter-spacing: calc(var(--u) * 3); }
.hybrid-match-card__score { display: flex; color: var(--figma-gold); font-family: 'Lama Sans Condensed', sans-serif; font-style: italic; direction: ltr; justify-content: center; align-items: center; gap: calc(var(--u) * 16); }
.hybrid-match-card__score b { font-size: calc(var(--u) * 70); }
.hybrid-match-card__score i { color: #edcb8173; font-size: calc(var(--u) * 35); font-style: normal; }
.hybrid-match-card__mvp { position: absolute; z-index: 3; right: calc(var(--u) * 70); bottom: calc(var(--u) * 32); left: calc(var(--u) * 70); padding-top: calc(var(--u) * 24); border-top: 1px solid #eefffa1f; text-align: center; }
.hybrid-match-card__mvp h3 { margin: 0 0 calc(var(--u) * 27); color: var(--figma-gold); font-family: 'HT Rakik', sans-serif; font-size: calc(var(--u) * 31); }
.hybrid-match-card__mvp h3 span { direction: ltr; }
.hybrid-match-card__mvp > div { display: grid; direction: ltr; grid-template-columns: repeat(7,minmax(0,1fr)); gap: calc(var(--u) * 13); }
.hybrid-match-card__mvp button { min-width: 0; padding: calc(var(--u) * 9) calc(var(--u) * 4); border: 1px solid transparent; background: transparent; color: #eefffa88; font-family: 'Lama Sans Condensed', sans-serif; font-size: calc(var(--u) * 20); font-style: italic; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; cursor: pointer; }
.hybrid-match-card__mvp button:hover, .hybrid-match-card__mvp button.is-selected { border-color: var(--figma-gold); color: var(--figma-gold); background: #edcb8110; }
.hybrid-match-card__mvp p { min-height: calc(var(--u) * 18); margin: calc(var(--u) * 12) 0 0; color: #eefffa80; font-size: calc(var(--u) * 12); }
.hybrid-record-v8 { position: absolute; top: calc(var(--u) * 1390); left: calc(var(--u) * 120); width: calc(var(--u) * 1680); }
.hybrid-record-v8 header { margin-bottom: calc(var(--u) * 70); text-align: right; }
.hybrid-record-v8 header small { color: #eefffa70; font-family: 'Lama Sans Condensed', sans-serif; font-size: calc(var(--u) * 17); letter-spacing: calc(var(--u) * 3); }
.hybrid-record-v8 header h2 { margin: calc(var(--u) * 8) 0 0; color: var(--figma-gold); font-family: 'HT Rakik', sans-serif; font-size: calc(var(--u) * 62); }
.hybrid-record-v8 article { display: grid; min-height: calc(var(--u) * 94); border-bottom: 1px solid #eefffa20; direction: ltr; grid-template-columns: 180px 250px 1fr 150px 1fr 220px 110px; gap: calc(var(--u) * 24); align-items: center; }
.hybrid-record-v8 article > * { min-width: 0; margin: 0; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.hybrid-record-v8 article time, .hybrid-record-v8 article span { color: #eefffa72; font-size: calc(var(--u) * 16); }
.hybrid-record-v8 article b, .hybrid-record-v8 article strong { font-family: 'Lama Sans Condensed', sans-serif; font-size: calc(var(--u) * 24); font-style: italic; }
.hybrid-record-v8 article strong { color: var(--figma-gold); text-align: center; }
.hybrid-record-v8 article small { padding: calc(var(--u) * 7); border: 1px solid currentColor; text-align: center; }
.hybrid-record-v8 article small.win { color: #7bd5a9; }
.hybrid-record-v8 article small.loss { color: #d58c7b; }

/* Reusable section reveal used on every route, including content injected after Claude's shell. */
.hybrid-reveal-v8 { opacity: 0 !important; filter: blur(6px) brightness(.72); translate: 0 calc(var(--u, 1px) * 48); transition: opacity .85s var(--hybrid-reveal-delay,0ms), filter .95s var(--hybrid-reveal-delay,0ms), translate 1s cubic-bezier(.16,1,.3,1) var(--hybrid-reveal-delay,0ms) !important; will-change: opacity, translate, filter; }
.hybrid-reveal-v8.is-visible { opacity: 1 !important; filter: none; translate: none; }

/* The desktop hero title keeps Claude's sheen, but never leaves glyphs clipped after reveal. */
.hybrid-ready [data-lp-page="home"] .lp-d h1 .rv-mask.in-view {
    clip-path: inset(-1.1em -0.28em) !important;
    opacity: 1 !important;
}

/* Keep the paired hero words legible without changing Figma's line breaks. */
.hybrid-ready [data-lp-page="home"] h1 { word-spacing: .055em; }

.hybrid-english [data-lp-page] { direction: ltr !important; }
.hybrid-english [data-lp-page] :is(.approved-nav-mobile, .approved-subpage-mobile) { direction: ltr !important; }
.hybrid-english [data-lp-page] :is(p, h1, h2, h3, h4, li, a, button, span, strong, label, input, textarea, select) {
    direction: ltr !important;
}
.hybrid-english [data-lp-page] [style*="text-align:right"] { text-align: left !important; }
.hybrid-english [data-lp-page] [style*="text-align-last:right"] { text-align-last: left !important; }
.hybrid-english [data-lp-page] [style*="text-align:center"] { text-align: center !important; text-align-last: center !important; }
.hybrid-english [data-lp-page] :is(.approved-match-desktop-scale, .approved-match-mobile-scale, .hybrid-matches-v8, .hybrid-quiz-v8),
.hybrid-english [data-lp-page] :is(.approved-match-desktop-scale, .approved-match-mobile-scale, .hybrid-matches-v8, .hybrid-quiz-v8) * {
    text-align: center !important;
    text-align-last: center !important;
}
.hybrid-english [data-lp-page] :is(.lp-btn, .figma-button, .mobile-outline-button, .lp-send-btn),
.hybrid-english [data-lp-page] :is(.lp-btn, .figma-button, .mobile-outline-button, .lp-send-btn) * {
    text-align: center !important;
    text-align-last: center !important;
}
.hybrid-english .approved-mobile-footer { direction: ltr; }
.hybrid-english .approved-mobile-footer .footer-bottom { right: calc(var(--u) * 14); left: calc(var(--u) * 80); }
.hybrid-english .approved-nav-mobile .mobile-nav-toggle,
.hybrid-english .approved-subpage-mobile .mobile-nav-toggle { right: auto; left: 18px; }
.hybrid-english .figma-nav, .hybrid-english .mobile-nav-panel, .hybrid-english .figma-footer { font-family: 'Lama Sans', Arial, sans-serif; }
.hybrid-english .approved-nav-desktop .figma-nav { font-size: 22px; font-weight: 800; letter-spacing: .025em; }
.hybrid-english .approved-nav-desktop .nav-design { left: 135px; width: 230px; }
/* THE GREEN LEGION is two words too wide for a single line here: at left 440
   it ran right into the × sparkle at 619. Wrap it in its own centred box, the
   way OUR HISTORY already is, so it clears the sparkle and its neighbour. */
.hybrid-english .approved-nav-desktop .nav-fans { left: 464px; width: 138px; white-space: normal; }
.hybrid-english .approved-nav-desktop .nav-team { left: 701px; }
.hybrid-english .approved-nav-desktop .nav-home { left: 1104px; }
/* THE GREEN’S SHOWDOWNS used to be squeezed onto one tiny 15px line. It now
   wraps to two lines in a fixed box like OUR HISTORY — same size as the other
   links, centred, and wide enough that no letter is ever clipped. */
.hybrid-english .approved-nav-desktop .nav-matches { left: 1290px; width: 172px; font-size: 18px; letter-spacing: .2px; white-space: normal; }
.hybrid-english .approved-nav-desktop .nav-history { top: 47px; left: 1560px; width: 105px; line-height: 1.05; }
.hybrid-english .approved-nav-desktop .nav-language { left: 1749px; }
.hybrid-english .hybrid-matches-v8, .hybrid-english .hybrid-quiz-v8 { direction: ltr; }

/* English keeps the Figma composition, but long Latin labels wrap within it. */
.hybrid-english .approved-nav-desktop .figma-nav a:not(.nav-language) {
    top: 42px;
    display: flex;
    min-height: 44px;
    line-height: 1.08;
    text-align: center !important;
    text-align-last: center !important;
    align-items: center;
    justify-content: center;
}
.hybrid-english [data-lp-page="home"] .home-desktop-media-eyebrow {
    top: calc(var(--u) * 5698) !important;
    left: calc(var(--u) * 960) !important;
    transform: translateX(-50%) !important;
    text-align: center !important;
    text-align-last: center !important;
}
.hybrid-english [data-lp-page="home"] .home-desktop-media-title {
    left: calc(var(--u) * 960) !important;
}
/* Media Kit: the English side copy is a different length than the Arabic, so
   pin both blocks so their centre lines up with the «KIT» word instead of
   floating at the Arabic offsets. */
.hybrid-english [data-lp-page="home"] .lp-d .home-desktop-media-copy {
    top: calc(var(--u) * 5858) !important;
}
.hybrid-english [data-lp-page="home"] .lp-d .home-desktop-media-tag {
    top: calc(var(--u) * 5836) !important;
}
/* English media kit: owner wants the little × sparkle above MEDIA gone. */
.hybrid-english [data-lp-page="home"] .lp-d .home-desktop-media-sparkle { display: none !important; }
/* The Arabic layout nudges the media cluster (incl. the CTA) to the right so
   its side paragraphs stay symmetric; English keeps the CTA centred under KIT. */
.hybrid-english [data-lp-page="home"] .lp-d .home-desktop-media-cta { left: calc(var(--u) * 834) !important; }
/* The Green Legion teaser (English): the copy is pinned into the dark column
   left of the hood; its box position and width live in the Batch-16 block
   further down (top/left/width). Here we only set the type. The quote glyphs
   frame the copy the way Arabic does — they ride the copy box, so they stay
   put as long as the box hugs the text. */
.hybrid-english [data-lp-page="home"] .lp-d .home-legion-copy p.fs.f-body {
    font-size: calc(var(--u) * 16.5) !important;
    line-height: 1.4 !important;
    text-align: left !important;
    text-align-last: left !important;
    text-wrap: pretty;
}
/* English: the opening quote sits at the top-LEFT of the copy and the closing
   quote at the bottom-RIGHT (mirror of the Arabic framing). */
.hybrid-english [data-lp-page="home"] .lp-d .home-legion-copy .home-legion-quote--open { right: auto !important; left: 0 !important; }
.hybrid-english [data-lp-page="home"] .lp-d .home-legion-copy .home-legion-quote--close { left: auto !important; right: calc(var(--u) * 26) !important; }
.hybrid-english [data-lp-page="home"] .lp-d p.fs.f-body {
    text-align: center !important;
    text-align-last: center !important;
    word-spacing: normal !important;
    text-wrap: balance;
}
.hybrid-english [data-lp-page="matches"] .match-team-region {
    width: calc(var(--u) * 430) !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    overflow-wrap: normal;
    text-align: center !important;
    text-align-last: center !important;
    transform: translateX(-50%) !important;
}
.hybrid-english [data-lp-page="matches"] .match-team-region-left { left: calc(var(--u) * 342) !important; }
.hybrid-english [data-lp-page="matches"] .match-team-region-right { left: calc(var(--u) * 1434) !important; }
.hybrid-english .home-desktop-community-title > p {
    font-size: calc(var(--u) * 95) !important;
    text-align: center !important;
    text-align-last: center !important;
}
.hybrid-english .history-selector-title {
    top: calc(var(--u) * 1152) !important;
    left: calc(var(--u) * 410) !important;
    width: calc(var(--u) * 1100) !important;
    font-size: calc(var(--u) * 64) !important;
    line-height: 1.06 !important;
    white-space: normal !important;
    text-align: center !important;
    text-align-last: center !important;
    transform: none !important;
}
.hybrid-english .history-detail-hero-title {
    top: calc(var(--u) * 665) !important;
    left: calc(var(--u) * 310) !important;
    width: calc(var(--u) * 1300) !important;
    font-size: calc(var(--u) * 62) !important;
    line-height: 1.06 !important;
    white-space: normal !important;
    text-align: center !important;
    text-align-last: center !important;
    transform: none !important;
}
.hybrid-english .history-detail-about-title {
    --x: 1060 !important;
}
.hybrid-english .history-detail-about-title > h2 {
    font-size: calc(var(--u) * 66) !important;
    line-height: calc(var(--u) * 92) !important;
    white-space: normal !important;
    text-align: left !important;
    text-align-last: left !important;
}
.hybrid-english .history-detail-standings-title > p {
    font-size: calc(var(--u) * 115) !important;
    line-height: 1.08 !important;
    white-space: normal !important;
    text-align: left !important;
    text-align-last: left !important;
}
.hybrid-english .history-detail-matches-title > h2 {
    font-size: calc(var(--u) * 100) !important;
    line-height: calc(var(--u) * 126) !important;
    white-space: normal !important;
    text-align: left !important;
    text-align-last: left !important;
}
.hybrid-english .history-detail-representatives-title {
    --w: 650 !important;
}
.hybrid-english .history-detail-representatives-title > h2 {
    font-size: calc(var(--u) * 62) !important;
    line-height: calc(var(--u) * 90) !important;
    white-space: normal !important;
    text-align: left !important;
    text-align-last: left !important;
}
.hybrid-english :is(.history-detail-representatives-label, .history-detail-coaching-label) {
    --x: 1347 !important;
    --w: 200 !important;
}
.hybrid-english :is(.history-detail-representatives-label, .history-detail-coaching-label) > p {
    font-size: calc(var(--u) * 20) !important;
    line-height: 1.15 !important;
    white-space: normal !important;
    overflow-wrap: normal;
    text-align: center !important;
    text-align-last: center !important;
}
.hybrid-english .fan-desktop-watermark {
    left: 0 !important;
    width: calc(var(--u) * 1920) !important;
    font-size: calc(var(--u) * 280) !important;
    text-align: center !important;
    text-align-last: center !important;
    overflow: hidden;
}
.hybrid-english :is(.fan-desktop-hero-title, .fan-desktop-form-title, .fan-desktop-quiz-title) {
    left: calc(var(--u) * 960) !important;
}
.hybrid-english .fan-desktop-hero-title > h1 {
    width: calc(var(--u) * 1400) !important;
    font-size: calc(var(--u) * 96) !important;
    line-height: 1.04 !important;
    white-space: normal !important;
    text-align: center !important;
    text-align-last: center !important;
    transform: translateX(-50%) !important;
}
.hybrid-english .fan-desktop-form-title > h2 {
    width: calc(var(--u) * 1500) !important;
    font-size: calc(var(--u) * 72) !important;
    line-height: 1.08 !important;
    white-space: normal !important;
    text-align: center !important;
    text-align-last: center !important;
    transform: translateX(-50%) !important;
}
.hybrid-english .fan-desktop-quiz-title > h2 {
    width: calc(var(--u) * 1500) !important;
    font-size: calc(var(--u) * 72) !important;
    line-height: 1.12 !important;
    white-space: normal !important;
    text-align: center !important;
    text-align-last: center !important;
    transform: translateX(-50%) !important;
}
.hybrid-english .fan-desktop-header-title > h2 {
    font-size: calc(var(--u) * 112) !important;
    line-height: 1.08 !important;
    white-space: normal !important;
    text-align: left !important;
    text-align-last: left !important;
}
.hybrid-english .team-desktop-players-title {
    --x: 916 !important;
    --w: 897 !important;
}
.hybrid-english .team-desktop-players-title > h1 {
    font-size: calc(var(--u) * 80) !important;
    line-height: calc(var(--u) * 130) !important;
    white-space: normal !important;
    text-align: left !important;
    text-align-last: left !important;
}
.hybrid-english .team-desktop-staff-title {
    --w: 850 !important;
}
.hybrid-english .team-desktop-staff-title > h2 {
    font-size: calc(var(--u) * 96) !important;
    line-height: calc(var(--u) * 140) !important;
    white-space: normal !important;
    text-align: left !important;
    text-align-last: left !important;
}
.hybrid-english [data-lp-page="fan-zone"] :is(.fan-message-form-v5 input, .fan-message-form-v5 textarea, [data-header-name], [data-header-player]) {
    direction: ltr !important;
    text-align: left !important;
}
.hybrid-english [data-lp-page="fan-zone"] :is(.fan-message-form-v5 input, .fan-message-form-v5 textarea, [data-header-name])::placeholder {
    direction: ltr;
    text-align: left;
}
.hybrid-english [data-lp-page="fan-zone"] [data-header-download] {
    width: calc(var(--u) * 320) !important;
    height: calc(var(--u) * 56) !important;
    font-size: calc(var(--u) * 20) !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

/* The mobile home page is the only mobile surface in this approval phase. */
.hybrid-english [data-lp-page="home"] .home-mobile-title {
    left: calc(var(--u) * 201) !important;
    /* Batch-18.1: DEFENDERS OF measures 385.5u at a 50u font — at 47u in a
       372u box it holds one line, so the title reads as the owner's two
       lines, never three. */
    width: calc(var(--u) * 372) !important;
    font-size: calc(var(--u) * 47) !important;
    line-height: calc(var(--u) * 38) !important;
    letter-spacing: -.015em;
    white-space: normal !important;
    text-align: center !important;
    text-align-last: center !important;
    transform: translateX(-50%) !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-title > span {
    width: 100%;
    text-align: center !important;
    text-align-last: center !important;
}
.home-team-title-root { overflow: visible; }
/* Batch-12: the legacy TEAM overlay is retired — the bilingual admin title
   owns the zone; the template art stays hidden in English too. */
.home-team-title-english { display: none !important; }
.hybrid-english [data-lp-page="home"] .home-team-title-arabic { opacity: 0 !important; visibility: hidden !important; }
.hybrid-english [data-lp-page="home"] :is(.home-mobile-community-eyebrow, .home-mobile-media-eyebrow) {
    left: calc(var(--u) * 30) !important;
    transform: none !important;
    text-align: left !important;
    text-align-last: left !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-community-eyebrow { top: calc(var(--u) * 2930) !important; }
.hybrid-english [data-lp-page="home"] .home-mobile-community-title {
    top: calc(var(--u) * 2950) !important;
    left: calc(var(--u) * 30) !important;
    width: calc(var(--u) * 342) !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-community-title > p {
    width: 100%;
    font-size: calc(var(--u) * 34) !important;
    line-height: 1.08 !important;
    white-space: normal !important;
    text-align: left !important;
    text-align-last: left !important;
    transform: none !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-community-copy {
    top: calc(var(--u) * 2998) !important;
    left: calc(var(--u) * 30) !important;
    width: calc(var(--u) * 220) !important;
    text-align: left !important;
    text-align-last: left !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-community-cta {
    top: calc(var(--u) * 3052) !important;
    left: calc(var(--u) * 258) !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-media-eyebrow { top: calc(var(--u) * 3460) !important; }
.hybrid-english [data-lp-page="home"] .home-mobile-media-title {
    top: calc(var(--u) * 3487) !important;
    left: calc(var(--u) * 30) !important;
    width: calc(var(--u) * 342) !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-media-title > p {
    width: 100%;
    font-size: calc(var(--u) * 64) !important;
    line-height: 1 !important;
    white-space: normal !important;
    text-align: left !important;
    text-align-last: left !important;
    transform: none !important;
}
/* Batch-12 item 5: the English media-kit block aligns as one column with
   the same inset as its neighbours, full-width text, CTA on the right. */
.hybrid-english [data-lp-page="home"] .home-mobile-media-caption {
    top: calc(var(--u) * 3580) !important;
    left: calc(var(--u) * 46) !important;
    width: calc(var(--u) * 320) !important;
    line-height: 1.22 !important;
    white-space: normal !important;
    text-align: left !important;
    text-align-last: left !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-media-copy {
    top: calc(var(--u) * 3648) !important;
    left: calc(var(--u) * 46) !important;
    width: calc(var(--u) * 320) !important;
    line-height: 1.55 !important;
    text-align: left !important;
    text-align-last: left !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-media-cta {
    top: calc(var(--u) * 3724) !important;
    left: calc(var(--u) * 212) !important;
}

@media (max-width: 767.98px) {
    [data-lp-page="home"] .lp-m { height: calc(var(--u) * 3810) !important; min-height: calc(var(--u) * 3810) !important; }
    [data-lp-page="home"] .lp-m .hybrid-trophy-v8 { --y: 183.35 !important; }
    [data-lp-page="home"] .mobile-team-backdrop { display: none !important; }
    [data-lp-page="home"] .mobile-team-design-bg { opacity: 1 !important; }
    [data-lp-page="home"] .mobile-team-players {
        object-fit: cover;
        transform: none !important;
        transform-origin: center;
    }
    [data-lp-page="home"] .lp-m p.tx-end[style*="--y:1437"],
    [data-lp-page="home"] .lp-m p.tx-end[style*="--y: 1437"] { z-index: 12 !important; }
    [data-lp-page="home"] .lp-m img[data-asset="s2-title-muntakhab.svg"] {
        z-index: 12 !important;
        clip-path: none !important;
        opacity: 1 !important;
    }
    .hybrid-quiz-v8__options { grid-template-columns: 1fr; }
}

.hybrid-fan-marquee .lp-marquee-track { display: flex; width: max-content; gap: 0 !important; }
.hybrid-fan-marquee .hybrid-marquee-group { display: flex; flex: none; width: max-content; }

/* The 402px visual-QA mode must exercise the same mobile title rule on a wide test viewport. */
.hybrid-force-mobile [data-lp-page="home"] .lp-m p.tx-end[style*="--y:1437"],
.hybrid-force-mobile [data-lp-page="home"] .lp-m p.tx-end[style*="--y: 1437"] { z-index: 12 !important; }
.hybrid-force-mobile [data-lp-page="home"] .lp-m img[data-asset="s2-title-muntakhab.svg"] { z-index: 12 !important; clip-path: none !important; opacity: 1 !important; }
.hybrid-force-mobile [data-lp-page="home"] .lp-m .hybrid-trophy-v8 { --y: 183.35 !important; }
.hybrid-force-mobile [data-lp-page="home"] .lp-m { height: 3810px !important; min-height: 3810px !important; }
.hybrid-force-mobile [data-lp-page="home"] .mobile-team-players { transform: none !important; transform-origin: center; }

.approved-match-mobile-scale { z-index: 55 !important; }
.mobile-match-center-button { z-index: 65 !important; isolation: isolate; pointer-events: auto; }

@media (prefers-reduced-motion: reduce) {
    .hybrid-reveal-v8 { opacity: 1 !important; filter: none !important; translate: none !important; transition: none !important; }
}


/* Artifact-only wiring for the shareable hybrid build. */
.hybrid-original-nav { display: none !important; visibility: hidden !important; pointer-events: none !important; }
.hybrid-menu-open { overflow: hidden; }
[data-hybrid-nav], [data-hybrid-mobile-nav] { will-change: transform, opacity; }
.hybrid-fan-marquee .lp-marquee-track {
    animation: none !important;
    will-change: transform;
}
.hybrid-fan-marquee { --hybrid-marquee-duration: 34s; }
.hybrid-fan-marquee .lp-marquee-track.is-loop-ready { animation: hybrid-fan-strip var(--hybrid-marquee-duration) linear infinite !important; }
.hybrid-fan-marquee .hybrid-marquee-group { display: flex; flex: none; width: max-content; }
@keyframes hybrid-fan-strip { from { transform: translate3d(0,0,0); } to { transform: translate3d(-33.333333%,0,0); } }
.hybrid-fan-marquee,
.hybrid-fan-marquee .lp-marquee-track,
.hybrid-fan-marquee .hybrid-marquee-group { direction: ltr !important; }
.hybrid-fan-marquee .lp-marquee-item[lang="ar"] {
    direction: rtl;
    text-align: right;
    font-family: 'HT Rakik', 'Noto Nastaliq Urdu', Tahoma, sans-serif;
}
.hybrid-fan-marquee .lp-marquee-item[lang="en"] {
    direction: ltr;
    text-align: left;
    font-family: 'Lama Sans', Arial, sans-serif;
}
.hybrid-fan-marquee .lp-marquee-item strong { display: block; color: #edcb81; font-size: calc(var(--u) * 15); }
.hybrid-fan-marquee .lp-marquee-item span { display: block; margin-top: calc(var(--u) * 8); color: #eefffac4; }
.fan-message-form-v5 { z-index: 30 !important; }
.fan-message-form-v5 [data-form-feedback] { min-height: calc(var(--u) * 22); margin: calc(var(--u) * 12) 0 0; text-align: center; }
.header-maker-v5 { pointer-events: auto !important; }
.header-maker-v5__preview canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.header-maker-v5__preview canvas.header-maker-v5__export { display: none !important; }
.header-maker-v5 [data-header-download] { pointer-events: auto !important; }
.mobile-team-backdrop { pointer-events: none; }
.approved-mobile-footer { direction: rtl; }
.hybrid-english .figma-nav, .hybrid-english .mobile-nav-panel { font-family: 'Lama Sans', Arial, sans-serif; font-size: 22px; letter-spacing: .025em; }
.hybrid-english .mobile-nav-panel { font-size: 21px; }
@media (prefers-reduced-motion: reduce) {
    .hybrid-fan-marquee .lp-marquee-track { animation-duration: 1ms !important; animation-iteration-count: 1 !important; }
}

/* ---------- V40: exact homepage corrections + responsive inner pages ---------- */

html, body { max-width: 100%; overflow-x: clip; }
[data-lp-page="team"] .lp-d .lp-platform.is-unavailable-profile {
    opacity: .34;
    pointer-events: none;
    transform: none !important;
}

/* The mobile hero uses the same Figma wallpaper, contrast, and spotlight stack. */
[data-lp-page="home"] .mobile-home-hero .lp-hero-bg::before {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 402px;
    height: 714px;
    background:
        radial-gradient(circle at 50% 4%, #edcb8122 0, transparent 28%),
        linear-gradient(180deg, #0710091f 0%, #0710092e 55%, #071009 100%),
        url('/v43/embedded-assets/hero-wallpaper-flat-6865726f2d.webp') 50% 0 / auto 714px repeat-x;
    content: '';
    opacity: .68;
    pointer-events: none;
}
[data-lp-page="home"] .mobile-home-hero .lp-wallpaper {
    opacity: .42 !important;
    -webkit-mask-image: linear-gradient(#000 0 68%, transparent 100%) !important;
    mask-image: linear-gradient(#000 0 68%, transparent 100%) !important;
    filter: saturate(.9) contrast(1.08);
}
[data-lp-page="home"] .mobile-home-hero .lp-glow { opacity: .96 !important; }
[data-lp-page="home"] .mobile-home-hero .lp-spot { opacity: .88 !important; }
[data-lp-page="home"] .mobile-team-design-bg { filter: none !important; opacity: 1 !important; }
[data-lp-page="home"] .mobile-team-players {
    mix-blend-mode: normal !important;
    filter: none !important;
    opacity: 1 !important;
    object-position: 50% 50% !important;
}

/* Media Kit keeps the title centered; its CTA follows the reading side. */
[data-lp-page="home"] .home-mobile-media-eyebrow,
[data-lp-page="home"] .home-mobile-media-title {
    right: auto !important;
    left: calc(var(--u) * 76) !important;
    width: calc(var(--u) * 250) !important;
    transform: none !important;
    text-align: center !important;
    text-align-last: center !important;
}
[data-lp-page="home"] .home-mobile-media-title .lp-glint,
[data-lp-page="history"] .history-selector-title .lp-glint { display: none !important; }
[data-lp-page="home"] .home-mobile-media-title > p {
    width: 100% !important;
    white-space: normal !important;
    text-align: center !important;
    text-align-last: center !important;
    transform: none !important;
}
[data-lp-page="home"] .home-mobile-media-eyebrow { top: calc(var(--u) * 3454) !important; }
[data-lp-page="home"] .home-mobile-media-title { top: calc(var(--u) * 3484) !important; }
[data-lp-page="home"] .home-mobile-media-cta {
    top: calc(var(--u) * 3688) !important;
    right: calc(var(--u) * 20) !important;
    left: auto !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-media-cta {
    right: auto !important;
    left: calc(var(--u) * 20) !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-media-eyebrow,
.hybrid-english [data-lp-page="home"] .home-mobile-media-title {
    left: calc(var(--u) * 76) !important;
    width: calc(var(--u) * 250) !important;
    text-align: center !important;
    text-align-last: center !important;
}

.responsive-mobile-page { display: none; }

@media (min-width: 0px) {
    .responsive-mobile-page {
        --mobile-gold: #edcb81;
        --mobile-mint: #eefffa;
        --mobile-night: #071009;
        position: relative !important;
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 100svh !important;
        max-width: none !important;
        color: var(--mobile-mint);
        background:
            radial-gradient(circle at 10% 4%, #edcb8112, transparent 24rem),
            linear-gradient(180deg, #08110a 0, #040905 100%);
        font-family: 'Lama Sans', Tahoma, Arial, sans-serif;
        overflow: hidden;
        isolation: isolate;
    }
    .responsive-mobile-page::before {
        position: absolute;
        z-index: -1;
        inset: 0;
        background-image: url('/v43/embedded-assets/wallpaper-77616c6c70.png');
        background-position: center top;
        background-size: 620px auto;
        opacity: .06;
        content: '';
        pointer-events: none;
    }
    .responsive-mobile-page, .responsive-mobile-page * { box-sizing: border-box; }
    .responsive-mobile-page :is(h1, h2, h3, p, span, strong, small, a, button, label) {
        max-width: 100%;
        overflow-wrap: normal;
    }
    .responsive-mobile-page > .approved-nav-mobile {
        position: sticky !important;
        z-index: 300 !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 78px !important;
        border-bottom: 1px solid #edcb813b;
        background: #061008e8;
        -webkit-backdrop-filter: blur(15px);
        backdrop-filter: blur(15px);
        transform: none !important;
        pointer-events: none;
    }
    .responsive-mobile-page > .approved-nav-mobile .mobile-brand {
        top: 11px !important;
        right: auto !important;
        left: 50% !important;
        width: 54px !important;
        height: 54px !important;
        transform: translateX(-50%);
    }
    .responsive-mobile-page > .approved-nav-mobile .mobile-nav-toggle {
        top: 31px !important;
        right: 19px !important;
        left: auto !important;
    }
    .hybrid-english .responsive-mobile-page > .approved-nav-mobile .mobile-nav-toggle {
        right: auto !important;
        left: 19px !important;
    }
    .responsive-mobile-page > .approved-nav-mobile .mobile-nav-panel {
        right: 0 !important;
        left: 0 !important;
        width: 100vw !important;
        max-width: 100% !important;
        transform: none !important;
    }
    .responsive-mobile-page main { position: relative; z-index: 2; padding: 0 20px 72px; }

    .responsive-mobile-hero {
        position: relative;
        display: flex;
        min-height: 500px;
        padding: 118px 24px 72px;
        border-bottom: 1px solid #edcb812d;
        flex-direction: column;
        justify-content: flex-end;
        overflow: hidden;
    }
    .responsive-mobile-hero::before,
    .responsive-mobile-hero::after {
        position: absolute;
        z-index: -1;
        content: '';
        pointer-events: none;
    }
    .responsive-mobile-hero::before {
        inset: 0;
        background:
            linear-gradient(180deg, #05100730, #041008a8 68%, #071009 100%),
            url('/v43/embedded-assets/hero-wallpaper-flat-6865726f2d.webp') 50% 0 / auto 520px repeat-x;
        opacity: .86;
    }
    .responsive-mobile-hero::after {
        top: -260px;
        left: 50%;
        width: 520px;
        height: 620px;
        background: radial-gradient(ellipse at center, #edcb813d 0, #edcb810d 34%, transparent 72%);
        transform: translateX(-50%);
    }
    .responsive-mobile-hero__wallpaper { position: absolute; inset: 0; pointer-events: none; }
    .responsive-mobile-hero__eyebrow {
        margin-bottom: 11px;
        color: var(--mobile-gold);
        font-size: 13px;
        font-weight: 700;
        letter-spacing: .06em;
    }
    .responsive-mobile-hero h1 {
        width: min(100%, 590px);
        margin: 0;
        color: var(--mobile-gold);
        font-family: 'HT Rakik', 'Lama Sans', sans-serif;
        font-size: clamp(46px, 14vw, 74px);
        font-weight: 750;
        line-height: .98;
        text-wrap: balance;
    }
    /* Batch-9: the year description under the hero title. */
    .responsive-mobile-hero p.responsive-mobile-hero__summary {
        margin-top: 12px;
        color: #eefffab3;
        font-size: clamp(13px, 3.6vw, 16px);
        line-height: 1.65;
    }
    .responsive-mobile-hero p {
        width: min(100%, 610px);
        margin: 25px 0 0;
        color: #eefffaed;
        font-size: clamp(16px, 4.4vw, 20px);
        line-height: 1.8;
        text-wrap: pretty;
    }

    .responsive-mobile-section { position: relative; padding: 72px 0 8px; }
    .responsive-mobile-section + .responsive-mobile-section { margin-top: 40px; border-top: 1px solid #edcb812b; }
    .responsive-mobile-section-heading { display: grid; width: 100%; max-width: 680px; min-width: 0; gap: 10px; }
    .responsive-mobile-section-heading > * { width: 100%; min-width: 0; }
    .responsive-mobile-section-heading__eyebrow { color: #eefffa82; font-size: 12px; font-weight: 700; letter-spacing: .12em; }
    .responsive-mobile-section-heading h2 {
        margin: 0;
        color: var(--mobile-gold);
        font-family: 'HT Rakik', 'Lama Sans', sans-serif;
        font-size: clamp(35px, 10vw, 54px);
        line-height: 1.08;
        text-wrap: balance;
    }
    .responsive-mobile-section-heading p {
        width: min(100%, 620px);
        margin: 5px 0 0;
        color: #eefffae0;
        font-size: 16px;
        line-height: 1.75;
        text-wrap: pretty;
    }

    .responsive-mobile-button {
        appearance: none;
        display: inline-grid;
        min-width: 164px;
        min-height: 48px;
        padding: 8px 14px;
        border: 1px solid var(--mobile-gold);
        background: transparent;
        color: var(--mobile-gold) !important;
        font-family: 'HT Rakik', 'Lama Sans', sans-serif;
        font-size: 17px;
        text-decoration: none;
        grid-template-columns: 14px minmax(0, 1fr) 14px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        cursor: pointer;
    }
    .responsive-mobile-button > span { text-align: center !important; }

    /* Match center */
    .responsive-match-grid { display: grid; margin-top: 30px; gap: 18px; }
    .responsive-match-card {
        padding: 18px 14px 20px;
        border: 1px solid #edcb8154;
        background: linear-gradient(145deg, #111b11e8, #070d08f5);
        box-shadow: inset 0 0 48px #edcb8108;
    }
    .responsive-match-card.is-live { border-color: #8be0a0; box-shadow: inset 0 0 45px #3ecf6a12, 0 0 18px #3ecf6a0d; }
    .responsive-match-card__meta { display: grid; color: var(--mobile-gold); font-size: 13px; justify-items: center; gap: 6px; text-align: center; }
    .responsive-match-card__meta > strong { min-width: 0; font-weight: 700; text-align: center !important; }
    .responsive-match-card__teams { display: grid; margin-top: 24px; direction: ltr; grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr); align-items: center; gap: 8px; }
    .responsive-match-team { display: grid; min-width: 0; text-align: center; justify-items: center; gap: 5px; }
    .responsive-match-team img { width: 70px; height: 80px; object-fit: contain; }
    .responsive-match-team strong { width: 100%; color: #f6fff9; font-family: 'Lama Sans Condensed', 'Lama Sans', sans-serif; font-size: 18px; font-style: italic; line-height: 1.05; text-align: center !important; text-wrap: balance; }
    .responsive-match-team__region { width: 100%; color: #eefffa68; font-size: 9px; line-height: 1.25; letter-spacing: .04em; text-align: center !important; text-wrap: balance; }
    .responsive-match-card__score { color: var(--mobile-gold); font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: 26px; font-style: italic; text-align: center; white-space: nowrap; }
    .responsive-match-card__date { color: var(--mobile-gold); font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: 18px; font-weight: 900; text-align: center; white-space: nowrap; }
    .responsive-match-card__mvp { display: flex; margin-top: 20px; padding-top: 14px; border-top: 1px solid #eefffa1c; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap; }
    .responsive-match-card__mvp span { color: var(--mobile-gold); font-size: 13px; }
    .responsive-match-card__mvp strong { font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: 18px; font-style: italic; }
    .responsive-record-list { margin-top: 27px; border-top: 1px solid #eefffa22; }
    .responsive-record-list > div { display: grid; min-height: 72px; padding: 12px 0; border-bottom: 1px solid #eefffa18; direction: ltr; grid-template-columns: 69px minmax(0, 1fr) 46px minmax(0, 1fr); align-items: center; gap: 8px; }
    .responsive-record-list time { color: #eefffa6e; font-size: 9px; }
    .responsive-record-list span { min-width: 0; }
    .responsive-record-list b { display: block; font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: 13px; font-style: italic; line-height: 1.1; text-align: center !important; text-wrap: balance; }
    .responsive-record-list > div > strong { color: var(--mobile-gold); font-size: 16px; text-align: center; white-space: nowrap; }

    /* Team and representatives */
    .responsive-person-grid { display: grid; margin-top: 30px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 12px; }
    .responsive-person-card { min-width: 0; border: 1px solid #edcb813d; background: #09110a; overflow: hidden; }
    .responsive-person-card__image { position: relative; height: 215px; background: linear-gradient(145deg, #172218, #080d08); overflow: hidden; }
    .responsive-person-card__image > img:first-child { width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; }
    .responsive-person-card__shade { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 42%, #050a06d9 100%); pointer-events: none; }
    .responsive-person-card__corner { position: absolute; width: 58px; height: 58px; opacity: .58; pointer-events: none; }
    .responsive-person-card__corner--tl { top: -1px; left: -1px; transform: rotate(180deg); }
    .responsive-person-card__corner--tr { top: -1px; right: -1px; transform: rotate(-90deg); }
    .responsive-person-card__corner--bl { bottom: -1px; left: -1px; transform: rotate(90deg); }
    .responsive-person-card__corner--br { right: -1px; bottom: -1px; }
    .responsive-person-card__content { min-height: 142px; padding: 14px 11px 12px; }
    .responsive-person-card h3 { margin: 0; font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: 22px; font-style: italic; line-height: 1; }
    .responsive-person-card p { min-height: 38px; margin: 7px 0 0; color: #eefffac7; font-size: 11px; line-height: 1.35; }
    .responsive-person-card__role { position: absolute; z-index: 2; right: 10px; bottom: 10px; left: 10px; display: flex; min-width: 0; margin: 0; color: var(--mobile-gold); font-size: 11px; align-items: center; gap: 7px; }
    .responsive-person-card__role img { width: 18px; height: 18px; object-fit: contain; }
    .responsive-person-card__social { display: flex; margin-top: 12px; color: #eefffa60; font-family: Arial, sans-serif; font-size: 10px; direction: ltr; gap: 9px; }
    .responsive-person-card.is-staff .responsive-person-card__image { height: 188px; }
    .responsive-person-card.is-staff .responsive-person-card__content { min-height: 102px; }
    .responsive-person-card.is-staff p { min-height: 28px; }
    .history-name-roster--mobile { display: grid; margin-top: 32px; gap: 38px; }
    .history-name-group > h3 { margin: 0 0 15px; color: var(--mobile-gold); font-family: 'HT Rakik', 'Lama Sans', sans-serif; font-size: 25px; line-height: 1.25; }
    .history-name-group > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .history-name-card { display: flex; min-width: 0; min-height: 64px; padding: 11px 10px; border-top: 1px solid #edcb8147; background: #0810088c; font-family: 'Lama Sans Condensed', 'Lama Sans', sans-serif; font-size: 17px; font-style: italic; line-height: 1.2; align-items: center; overflow-wrap: normal; }

    /* History selector */
    .responsive-year-tabs { display: grid; width: 100%; margin-bottom: 28px; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .responsive-year-tabs button { height: 48px; border: 1px solid #edcb813d; background: #071008; color: #eefffa75; font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: 22px; cursor: pointer; }
    .responsive-year-tabs button[aria-selected="true"] { border-color: var(--mobile-gold); background: #edcb8110; color: var(--mobile-gold); box-shadow: 0 0 18px #edcb8114; }
    .responsive-history-feature { position: relative; min-height: 610px; border: 1px solid #edcb813c; background: linear-gradient(160deg, #111a10, #050a06); overflow: hidden; }
    .responsive-history-feature > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .29; }
    .responsive-history-feature__content { position: relative; z-index: 2; display: flex; min-height: 610px; padding: 48px 24px 28px; flex-direction: column; justify-content: flex-end; }
    .responsive-history-feature__eyebrow { color: var(--mobile-gold); font-size: 14px; }
    .responsive-history-feature h2 { margin: 10px 0 0; color: var(--mobile-gold); font-family: 'HT Rakik', sans-serif; font-size: clamp(36px, 10vw, 52px); line-height: 1.05; text-wrap: balance; }
    .responsive-history-feature p { margin: 22px 0 0; color: #eefffae0; font-size: 15px; line-height: 1.75; }
    .responsive-history-feature__meta { display: grid; margin-top: 25px; padding-top: 18px; border-top: 1px solid #eefffa1f; grid-template-columns: 1fr 1fr; gap: 12px; }
    .responsive-history-feature__meta > span { display: grid; gap: 4px; }
    .responsive-history-feature__meta small { color: #eefffa65; font-size: 10px; }
    .responsive-history-feature__meta strong { color: var(--mobile-gold); font-size: 15px; }
    .responsive-history-feature__button { margin-top: 26px; }

    /* History detail */
    .responsive-history-detail .responsive-mobile-hero h1 { font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: clamp(92px, 30vw, 140px); font-style: italic; line-height: .8; }
    .responsive-history-facts { display: grid; margin-top: 28px; padding: 20px 0; border-top: 1px solid #edcb813b; border-bottom: 1px solid #edcb813b; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .responsive-history-facts > div { display: grid; min-width: 0; gap: 6px; }
    .responsive-history-facts small { color: #eefffa65; font-size: 9px; }
    .responsive-history-facts strong { color: var(--mobile-gold); font-size: 13px; line-height: 1.25; }
    .responsive-participant-grid { display: grid; margin-top: 26px; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px 8px; }
    .responsive-participant-grid > div { display: grid; min-width: 0; text-align: center; justify-items: center; gap: 5px; }
    .responsive-participant-grid img { width: 50px; height: 58px; object-fit: contain; }
    .responsive-participant-grid span { font-size: 9px; line-height: 1.2; text-align: center !important; }
    .responsive-standings { margin-top: 26px; border-top: 1px solid #eefffa26; }
    .responsive-standings > div { display: grid; min-height: 56px; border-bottom: 1px solid #eefffa18; direction: ltr; grid-template-columns: minmax(88px, auto) minmax(0, 1fr) 82px; align-items: center; gap: 8px; }
    .responsive-standings > div > strong { min-width: 0; color: var(--mobile-gold); font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: 18px; white-space: nowrap; }
    .responsive-standings > div > span { font-size: 14px; text-align: center !important; }
    .responsive-standings > div > b { color: #eefffa83; font-size: 11px; text-align: end; }
    .responsive-history-phase { margin-top: 28px; padding: 18px 14px; border: 1px solid #edcb8136; background: #09110a; }
    .responsive-history-phase h3 { margin: 0 0 14px; color: var(--mobile-gold); font-family: 'HT Rakik', sans-serif; font-size: 24px; }
    .responsive-history-rounds { display: grid; gap: 8px; }
    .responsive-history-round { padding: 11px 10px; border-top: 1px solid #eefffa16; }
    .responsive-history-round header { display: flex; color: #eefffa85; font-size: 11px; justify-content: space-between; gap: 8px; }
    .responsive-history-round header time { direction: ltr; }
    .responsive-history-round > div { display: grid; margin-top: 9px; direction: ltr; grid-template-columns: minmax(0, 1fr) 52px minmax(0, 1fr); align-items: center; gap: 6px; }
    .responsive-history-round b { font-size: 12px; text-align: center !important; text-wrap: balance; }
    /* Batch-9: the gold score's glyphs hang ~2.5px above the two team
       names' ink — pinned onto the names' line (measured in Chromium and
       WebKit at ≤0.3px after the shift), every year. */
    .responsive-history-round > div > strong { transform: translateY(2.5px); }
    .responsive-history-round strong { color: var(--mobile-gold); font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: 19px; text-align: center; }
    .responsive-empty-state {
        width: 100%;
        margin: 22px 0 0;
        padding: 22px 16px;
        border: 1px solid #edcb8136;
        background: #081008a6;
        color: #eefffaa8;
        font-size: 13px;
        line-height: 1.65;
        text-align: center !important;
    }
    .responsive-participant-grid > .responsive-empty-state { grid-column: 1 / -1; }
    .responsive-standings > .responsive-empty-state { margin-top: 0; }
    .responsive-history-rounds > .responsive-empty-state { margin-top: 0; }
    .hybrid-english .responsive-history-round > div { grid-template-columns: minmax(0, 1fr) 44px minmax(0, 1fr); gap: 8px; }
    .hybrid-english .responsive-history-round b { text-align: left !important; }

    /* Fan Zone, form, quiz, and header maker */
    .responsive-fan-page .responsive-mobile-hero::before { background: linear-gradient(180deg, #05100730, #041008bf 72%, #071009 100%), url('/v43/embedded-assets/fan-header-66616e2d68.jpg') center / cover; }
    .responsive-fan-marquee { width: calc(100% + 40px); margin: 28px -20px 0; border-top: 1px solid #edcb8132; border-bottom: 1px solid #edcb8132; overflow: hidden; }
    .hybrid-fan-marquee { --hybrid-marquee-duration: 22s; }
    .responsive-fan-marquee .lp-marquee-track { display: flex; width: max-content; }
    .responsive-fan-marquee .lp-marquee-item { flex: none; width: min(82vw, 330px); min-height: 142px; padding: 26px 22px; border-inline-end: 1px solid #edcb812d; background: #081008d6; }
    .responsive-fan-marquee .lp-marquee-item strong { color: var(--mobile-gold); font-size: 13px; }
    .responsive-fan-marquee .lp-marquee-item span { display: block; margin-top: 10px; color: #eefffabc; font-size: 14px; line-height: 1.55; }
    .responsive-fan-form { display: grid; margin-top: 27px; gap: 18px; }
    .responsive-fan-form label, .responsive-header-maker__controls label { display: grid; color: var(--mobile-gold); font-size: 13px; gap: 9px; }
    .responsive-fan-form :is(input, textarea), .responsive-header-maker__controls :is(input, select) { width: 100%; padding: 14px 13px; border: 1px solid #edcb8145; border-radius: 0; outline: 0; background: #081008b3; color: #eefffa; font: inherit; font-size: 16px; }
    .responsive-fan-form textarea { min-height: 132px; resize: vertical; }
    .responsive-submit-button { width: 100%; margin-top: 2px; }
    .responsive-mobile-page .hybrid-quiz-v8 {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        width: 100% !important;
        min-height: 410px !important;
        margin-top: 28px;
        direction: inherit;
    }
    .responsive-mobile-page .hybrid-quiz-v8__card { min-height: 410px; }
    .responsive-mobile-page .hybrid-quiz-v8 header { font-size: 13px; }
    .responsive-mobile-page .hybrid-quiz-v8 header strong { font-size: 28px; }
    .responsive-mobile-page .hybrid-quiz-v8__progress { height: 2px; margin-top: 14px; }
    .responsive-mobile-page .hybrid-quiz-v8 h3 { min-height: 82px; margin-top: 28px; font-size: 24px; line-height: 1.45; }
    .responsive-mobile-page .hybrid-quiz-v8__options { margin-top: 22px; grid-template-columns: 1fr; gap: 11px; }
    .responsive-mobile-page .hybrid-quiz-v8__options button { min-height: 54px; padding: 9px 12px; font-size: 16px; }
    .responsive-header-maker__controls { display: grid; margin-top: 27px; gap: 16px; }
    .responsive-header-maker__preview { position: relative; width: 100%; margin-top: 22px; border: 1px solid #edcb814f; aspect-ratio: 2048 / 682; overflow: hidden; }
    .responsive-header-maker__preview > img, .responsive-header-maker__preview > canvas { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
    .responsive-header-download { width: 100%; margin-top: 16px; }
    .responsive-header-maker.header-maker-v5 { position: relative; }

    /* Shared mobile footer */
    .responsive-mobile-footer { position: relative; z-index: 2; display: grid; min-height: 390px; padding: 54px 24px 34px; background: linear-gradient(145deg, #f1d394, #dcb96f); color: #11170f; text-align: center; place-items: center; }
    .responsive-mobile-footer > img { width: 62px; height: 62px; object-fit: contain; filter: brightness(0); }
    .responsive-mobile-footer__tagline { margin: 14px 0 0; font-family: 'HT Rakik', sans-serif; font-size: 22px; }
    .responsive-mobile-footer nav { display: flex; margin-top: 22px; justify-content: center; gap: 12px 18px; flex-wrap: wrap; }
    .responsive-mobile-footer nav a { color: #11170f; font-size: 13px; text-decoration: none; }
    .responsive-mobile-footer__socials { display: flex; margin-top: 26px; gap: 12px; }
    .responsive-mobile-footer__socials a { display: grid; width: 34px; height: 34px; border: 1px solid #11170f75; border-radius: 50%; color: #11170f; font-family: Arial, sans-serif; font-size: 10px; text-decoration: none; place-items: center; }
    .responsive-mobile-footer small { margin-top: 26px; font-size: 10px; line-height: 1.5; }

    .hybrid-english .responsive-mobile-page { font-family: 'Lama Sans', Arial, sans-serif; }
    .hybrid-english .responsive-mobile-page :is(.responsive-mobile-hero, .responsive-mobile-section-heading, .responsive-history-feature__content) { text-align: left; }
    .hybrid-english .responsive-mobile-page :is(.responsive-mobile-hero h1, .responsive-mobile-section-heading h2, .responsive-history-feature h2) { font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif; font-weight: 900; letter-spacing: -.015em; }
}

/* V41 responsive root contract: a route renders one surface, never desktop and mobile together. */
@media (max-width: 1023.98px) {
    [data-lp-page] .lp-d,
    [data-lp-page] .lp-d.lp-solo,
    [data-lp-page] .approved-nav-desktop { display: none !important; }
    [data-lp-page] .lp-m,
    [data-lp-page] .approved-nav-mobile { display: block !important; }
}

@media (min-width: 1024px) {
    [data-lp-page] .lp-d { display: block !important; }
    [data-lp-page] .lp-m,
    [data-lp-page] .approved-nav-mobile,
    .responsive-mobile-page { display: none !important; }
}

html.hybrid-force-mobile [data-lp-page] .lp-d,
html.hybrid-force-mobile [data-lp-page] .lp-d.lp-solo,
html.hybrid-force-mobile [data-lp-page] .approved-nav-desktop { display: none !important; }
html.hybrid-force-mobile [data-lp-page] .lp-m,
html.hybrid-force-mobile [data-lp-page] .approved-nav-mobile,
html.hybrid-force-mobile .responsive-mobile-page { display: block !important; }

/* Long content wraps as phrases; it must not split every English word arbitrarily. */
.responsive-mobile-page :is(h1, h2, h3, p, span, strong, small, a, button, label) {
    overflow-wrap: break-word;
    word-break: normal;
    hyphens: none;
}
.responsive-mobile-page :is(h1, h2, h3) { text-wrap: balance; }
.responsive-mobile-page :is(p, label) { text-wrap: pretty; }
.responsive-mobile-button { width: fit-content; max-width: 100%; white-space: normal; }
.responsive-mobile-button > span { min-width: 0; overflow-wrap: break-word; }

/* Desktop history receives the knockout sequence as its own full-width phase. */
@media (min-width: 1024px) {
    [data-lp-page^="history-"] .history-roster-legacy { display: none !important; }
    .history-roster-desktop {
        position: absolute;
        z-index: 24;
        top: calc(var(--u) * 5270);
        left: calc(var(--u) * 120);
        display: grid;
        width: calc(var(--u) * 1680);
        color: #eefffa;
        grid-template-columns: calc(var(--u) * 610) minmax(0, 1fr);
        align-items: start;
        gap: calc(var(--u) * 170);
        box-sizing: border-box;
    }
    .history-roster-desktop__title {
        margin: 0;
        /* Centred against the roster column's real height, so the title sits
           against the whole composition — two groups or three, six support
           names or twelve — instead of against a coordinate chosen when the
           page had only Players and Management & Coaching Staff. */
        align-self: center;
        color: #edcb81;
        font-family: 'HT Rakik', 'Lama Sans', sans-serif;
        font-size: calc(var(--u) * 76);
        line-height: 1.08;
        text-align: right;
        text-wrap: balance;
    }
    .history-name-roster--desktop { display: grid; gap: calc(var(--u) * 28); }
    .history-name-roster--desktop .history-name-group + .history-name-group { padding-top: calc(var(--u) * 23); border-top: 1px solid #edcb812b; }
    .history-name-roster--desktop .history-name-group > h3 { margin: 0 0 calc(var(--u) * 13); color: #edcb81; font-family: 'HT Rakik', 'Lama Sans', sans-serif; font-size: calc(var(--u) * 24); line-height: 1.25; text-align: right; }
    .history-name-roster--desktop .history-name-group > div { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: calc(var(--u) * 9); }
    /* Addressed by group, not by position. This used to be :last-child, which
       meant «the staff grid» only for as long as staff happened to be last —
       adding Support Staff would silently have re-flowed the existing staff
       list from three columns to four. */
    .history-name-roster--desktop [data-admin-source="history-staff"] > div,
    .history-name-roster--desktop [data-admin-source="history-support"] > div { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .history-name-roster--desktop .history-name-card {
        display: flex;
        min-width: 0;
        min-height: calc(var(--u) * 68);
        padding: calc(var(--u) * 10) calc(var(--u) * 9);
        border-top: 1px solid #edcb8147;
        background: #0810088c;
        font-family: 'Lama Sans Condensed', 'Lama Sans', sans-serif;
        font-size: calc(var(--u) * 17);
        font-style: italic;
        line-height: 1.15;
        align-items: center;
        overflow-wrap: normal;
        box-sizing: border-box;
    }
    .hybrid-english .history-roster-desktop__title { font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: calc(var(--u) * 61); text-align: left; }
    .hybrid-english .history-name-roster--desktop .history-name-group > h3 { font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: calc(var(--u) * 22); text-align: left; }

    .history-playoffs-desktop {
        position: absolute;
        z-index: 20;
        top: calc(var(--u) * 4910);
        left: calc(var(--u) * 120);
        width: calc(var(--u) * 1680);
        min-height: calc(var(--u) * 205);
        padding: calc(var(--u) * 20) 0;
        border-top: 1px solid #edcb8138;
        border-bottom: 1px solid #edcb8128;
        color: #eefffa;
        box-sizing: border-box;
    }
    .history-playoffs-desktop > h3 {
        margin: 0 0 calc(var(--u) * 16);
        color: #edcb81;
        font-family: 'HT Rakik', sans-serif;
        font-size: calc(var(--u) * 25);
        text-align: center;
    }
    /* Batch-11 item 9: fewer rounds than the four grid columns left the row
       hanging to one side — the cards now centre themselves whatever the
       count, at the same card width. */
    .history-playoffs-desktop > div { display: flex; flex-wrap: wrap; justify-content: center; gap: calc(var(--u) * 14); }
    .history-playoffs-desktop article { flex: 0 0 calc(var(--u) * 406); min-width: 0; padding: calc(var(--u) * 11); border: 1px solid #edcb8142; background: #081008ba; }
    .history-playoffs-desktop article > span { display: block; min-height: calc(var(--u) * 30); color: #edcb81; font-size: calc(var(--u) * 13); line-height: 1.25; text-align: center; }
    .history-playoffs-desktop article > div { display: grid; margin-top: calc(var(--u) * 6); direction: ltr; grid-template-columns: 1fr auto 1fr; align-items: center; justify-items: center; gap: calc(var(--u) * 6); }
    .history-playoffs-desktop img { width: calc(var(--u) * 42); height: calc(var(--u) * 48); object-fit: contain; }
    .history-playoffs-desktop strong { color: #edcb81; font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: calc(var(--u) * 21); white-space: nowrap; }
    .history-playoffs-desktop .responsive-empty-state { grid-column: 1 / -1; margin: 0; }
    .history-desktop-empty {
        position: absolute;
        z-index: 22;
        left: calc(var(--u) * 560);
        width: calc(var(--u) * 800);
        margin: 0;
        padding: calc(var(--u) * 24);
        border: 1px solid #edcb8136;
        background: #081008d9;
        color: #eefffaa8;
        font-size: calc(var(--u) * 17);
        line-height: 1.55;
        text-align: center !important;
        box-sizing: border-box;
    }
    .history-desktop-empty[data-history-empty="participants"] { top: calc(var(--u) * 2520); }
    /* Below the side title+description block (batch-12 sweep). */
    .history-desktop-empty[data-history-empty="standings"] { top: calc(var(--u) * 3720); }
    .history-desktop-empty[data-history-empty="matches"] { top: calc(var(--u) * 4520); }

    /* Arabic editorial pairs: title right, supporting copy left, aligned as one band. */
    [data-lp-page="team"] :is(.team-desktop-players-title, .team-desktop-staff-title) { --x:1040 !important; --w:700 !important; }
    [data-lp-page="team"] .team-desktop-players-title { --y:276 !important; }
    [data-lp-page="team"] .team-desktop-staff-title { --y:2950 !important; }
    [data-lp-page="team"] :is(.team-desktop-players-title, .team-desktop-staff-title) :is(h1, h2) {
        width: 100% !important;
        font-size: calc(var(--u) * 108) !important;
        line-height: 1.05 !important;
        white-space: normal !important;
        text-align: right !important;
        text-align-last: right !important;
        text-wrap: balance;
    }
    [data-lp-page="team"] :is(.team-desktop-players-copy, .team-desktop-staff-copy) { --x:180 !important; --w:650 !important; }
    [data-lp-page="team"] .team-desktop-players-copy { --y:405 !important; }
    [data-lp-page="team"] .team-desktop-staff-copy { --y:3085 !important; }
    [data-lp-page="team"] .team-desktop-players-quote { --x:120 !important; --y:375 !important; }
    [data-lp-page="team"] .team-desktop-staff-quote { --x:120 !important; --y:3055 !important; }
    [data-lp-page="team"] :is(.team-desktop-players-copy, .team-desktop-staff-copy) p {
        text-align: right !important;
        text-align-last: right !important;
        line-height: 1.6 !important;
        white-space: normal !important;
        text-wrap: pretty;
    }

    [data-lp-page="matches"] .matches-desktop-title { --x:1040 !important; --y:310 !important; width: calc(var(--u) * 700) !important; }
    [data-lp-page="matches"] .matches-desktop-title h1 {
        width: 100% !important;
        font-size: calc(var(--u) * 104) !important;
        line-height: 1.04 !important;
        white-space: normal !important;
        text-align: right !important;
        transform: none !important;
        text-wrap: balance;
    }
    [data-lp-page="matches"] .matches-desktop-copy { --x:180 !important; --y:330 !important; --w:650 !important; text-align: right !important; text-align-last: right !important; line-height: 1.6 !important; }
    [data-lp-page="matches"] .lp-d p[data-fit] { font-size: calc(var(--u) * 58) !important; }
    [data-lp-page="matches"] .match-result-label {
        --x:843 !important;
        --y:92 !important;
        width: calc(var(--u) * 210) !important;
        font-family: 'HT Rakik', 'Lama Sans', sans-serif !important;
        font-size: calc(var(--u) * 18) !important;
        line-height: 1.15 !important;
        white-space: normal !important;
        text-align: center !important;
    }

    /* Batch-11 item 8: the selector copy rises to the middle of the big
       year numeral (y303–1153 → centre ≈728) so nothing needs a scroll. */
    [data-lp-page="history"] .history-selector-title {
        --x:1040 !important;
        --y:660 !important;
        position: absolute !important;
        width: calc(var(--u) * 700) !important;
        font-size: calc(var(--u) * 64) !important;
        line-height: 1.08 !important;
        white-space: normal !important;
        text-align: right !important;
        text-align-last: right !important;
        transform: none !important;
        text-wrap: balance;
    }
    [data-lp-page="history"] .history-selector-summary {
        --x:180 !important;
        --y:690 !important;
        --w:650 !important;
        text-align: right !important;
        text-align-last: right !important;
        line-height: 1.6 !important;
    }
    [data-lp-page="history"] .history-selector-cta { --x:380 !important; --y:900 !important; }

    /* Batch-11 item 8: the year hero rises to the numeral's midline and the
       description (admin summary) sits on the left on EVERY year. */
    [data-lp-page^="history-"] .history-detail-hero-title {
        --x:1040 !important;
        --y:420 !important;
        position: absolute !important;
        width: calc(var(--u) * 700) !important;
        font-size: calc(var(--u) * 62) !important;
        line-height: 1.08 !important;
        white-space: normal !important;
        text-align: right !important;
        text-align-last: right !important;
        transform: none !important;
        text-wrap: balance;
    }
    [data-lp-page^="history-"] .history-detail-hero-copy { --x:180 !important; --y:440 !important; --w:680 !important; position: absolute !important; text-align: right !important; text-align-last: right !important; line-height: 1.6 !important; }
    [data-lp-page^="history-"] .history-detail-about-title { --x:1040 !important; --y:1450 !important; --w:700 !important; }
    [data-lp-page^="history-"] .history-detail-about-copy { --x:180 !important; --y:1480 !important; --w:680 !important; text-align: right !important; text-align-last: right !important; line-height: 1.6 !important; }
    /* Batch-11 item 10: «الترتيب» sits to the LEFT of the standings table
       with its description right under it (English mirrors to the right). */
    [data-lp-page^="history-"] .history-detail-standings-title { --x:180 !important; --y:3400 !important; --w:700 !important; }
    [data-lp-page^="history-"] .history-detail-standings-copy { --x:180 !important; --y:3560 !important; --w:640 !important; text-align: right !important; text-align-last: right !important; line-height: 1.6 !important; }
    [data-lp-page^="history-"] :is(.history-detail-about-title, .history-detail-standings-title) h2 {
        width: 100% !important;
        font-size: calc(var(--u) * 100) !important;
        line-height: 1.04 !important;
        white-space: normal !important;
        text-align: right !important;
        text-wrap: balance;
    }

    [data-lp-page="fan-zone"] .fan-desktop-hero-title { --x:1040 !important; --y:475 !important; width: calc(var(--u) * 700) !important; }
    [data-lp-page="fan-zone"] .fan-desktop-hero-title h1 {
        width: 100% !important;
        font-size: calc(var(--u) * 104) !important;
        line-height: 1.04 !important;
        white-space: normal !important;
        text-align: right !important;
        transform: none !important;
        text-wrap: balance;
    }
    [data-lp-page="fan-zone"] .fan-desktop-hero-copy { --x:180 !important; --y:520 !important; --w:680 !important; text-align: right !important; text-align-last: right !important; line-height: 1.65 !important; }
    [data-lp-page="fan-zone"] :is(.fan-desktop-form-title, .fan-desktop-quiz-title) { --x:460 !important; width: calc(var(--u) * 1000) !important; }
    [data-lp-page="fan-zone"] :is(.fan-desktop-form-title, .fan-desktop-quiz-title) h2 {
        width: 100% !important;
        font-size: calc(var(--u) * 70) !important;
        line-height: 1.08 !important;
        white-space: normal !important;
        text-align: center !important;
        transform: none !important;
        text-wrap: balance;
    }
    [data-lp-page="fan-zone"] .fan-desktop-header-title { --x:130 !important; --y:3335 !important; --w:900 !important; }
    [data-lp-page="fan-zone"] .fan-desktop-header-title h2 {
        width: 100% !important;
        font-size: calc(var(--u) * 76) !important;
        line-height: 1.02 !important;
        white-space: normal !important;
        text-align: right !important;
        text-wrap: balance;
    }
    [data-lp-page="fan-zone"] .lp-d [data-header-download] {
        top: calc(var(--u) * 3488) !important;
        left: calc(var(--u) * 1330) !important;
        display: flex !important;
        width: calc(var(--u) * 482) !important;
        height: calc(var(--u) * 52) !important;
        color: #171a10 !important;
        font-size: calc(var(--u) * 22) !important;
        font-weight: 750 !important;
        line-height: 1.2 !important;
        text-decoration: none !important;
        white-space: normal !important;
        align-items: center;
        justify-content: center;
    }
    /* Batch-11: the fan-art section shifts the whole tail by 860u — these
       two are CSS-pinned (not template --y) and must carry the same shift. */
    [data-lp-page="fan-zone"] .fan-art-inserted .fan-desktop-header-title { top: calc(var(--u) * (3335 + var(--fan-tail-shift, 860))) !important; }
    .hybrid-english [data-lp-page="fan-zone"] .fan-art-inserted .fan-desktop-header-title { top: calc(var(--u) * (3318 + var(--fan-tail-shift, 860))) !important; }
    [data-lp-page="fan-zone"] .lp-d.fan-art-inserted [data-header-download] { top: calc(var(--u) * (3488 + var(--fan-tail-shift, 860))) !important; }

    /* English mirrors the editorial grid: title left, copy right. */
    .hybrid-english [data-lp-page="team"] :is(.team-desktop-players-title, .team-desktop-staff-title) { --x:160 !important; --w:780 !important; }
    .hybrid-english [data-lp-page="team"] .team-desktop-players-title { --y:250 !important; }
    .hybrid-english [data-lp-page="team"] .team-desktop-staff-title { --y:2920 !important; }
    .hybrid-english [data-lp-page="team"] :is(.team-desktop-players-title, .team-desktop-staff-title) :is(h1, h2) {
        font-size: calc(var(--u) * 82) !important;
        line-height: 1.02 !important;
        text-align: left !important;
        text-align-last: left !important;
    }
    .hybrid-english [data-lp-page="team"] :is(.team-desktop-players-copy, .team-desktop-staff-copy) { --x:1070 !important; --w:670 !important; }
    .hybrid-english [data-lp-page="team"] .team-desktop-players-copy { --y:300 !important; }
    .hybrid-english [data-lp-page="team"] .team-desktop-staff-copy { --y:2980 !important; }
    .hybrid-english [data-lp-page="team"] .team-desktop-players-quote { --x:1010 !important; --y:270 !important; }
    .hybrid-english [data-lp-page="team"] .team-desktop-staff-quote { --x:1010 !important; --y:2950 !important; }
    .hybrid-english [data-lp-page="team"] :is(.team-desktop-players-copy, .team-desktop-staff-copy) p { text-align: left !important; text-align-last: left !important; }

    .hybrid-english [data-lp-page="matches"] .matches-desktop-title { --x:160 !important; --y:310 !important; width: calc(var(--u) * 780) !important; }
    .hybrid-english [data-lp-page="matches"] .matches-desktop-title h1 { font-size: calc(var(--u) * 92) !important; text-align: left !important; }
    .hybrid-english [data-lp-page="matches"] .matches-desktop-copy { --x:1070 !important; --y:330 !important; --w:670 !important; text-align: left !important; text-align-last: left !important; }
    .hybrid-english [data-lp-page="matches"] .match-result-label { font-family: 'Lama Sans', Arial, sans-serif !important; font-size: calc(var(--u) * 15) !important; font-weight: 700; letter-spacing: .03em; }

    .hybrid-english [data-lp-page="history"] .history-selector-title { --x:160 !important; --y:660 !important; top: calc(var(--u) * 660) !important; left: calc(var(--u) * 160) !important; width: calc(var(--u) * 780) !important; font-size: calc(var(--u) * 64) !important; text-align: left !important; text-align-last: left !important; }
    .hybrid-english [data-lp-page="history"] .history-selector-summary { --x:1050 !important; --y:690 !important; --w:680 !important; text-align: left !important; text-align-last: left !important; }
    .hybrid-english [data-lp-page="history"] .history-selector-cta { --x:1264 !important; --y:900 !important; }

    .hybrid-english [data-lp-page^="history-"] .history-detail-hero-title { --x:160 !important; --y:420 !important; top: calc(var(--u) * 420) !important; left: calc(var(--u) * 160) !important; width: calc(var(--u) * 780) !important; text-align: left !important; text-align-last: left !important; }
    .hybrid-english [data-lp-page^="history-"] .history-detail-hero-copy { --x:1050 !important; --y:440 !important; --w:680 !important; text-align: left !important; text-align-last: left !important; }
    .hybrid-english [data-lp-page^="history-"] .history-detail-about-title { --x:160 !important; --y:1450 !important; --w:780 !important; }
    .hybrid-english [data-lp-page^="history-"] .history-detail-about-copy { --x:1050 !important; --y:1480 !important; --w:680 !important; text-align: left !important; text-align-last: left !important; }
    /* English mirrors right, and both clear the fixed column headers
       (batch-12 item 13: the description sat on RECORD/THE TEAM). */
    .hybrid-english [data-lp-page^="history-"] .history-detail-standings-title { --x:1100 !important; --y:3240 !important; --w:700 !important; }
    .hybrid-english [data-lp-page^="history-"] .history-detail-standings-copy { --x:1100 !important; --y:3378 !important; --w:620 !important; line-height: 1.45 !important; text-align: left !important; text-align-last: left !important; }
    .hybrid-english [data-lp-page^="history-"] :is(.history-detail-about-title, .history-detail-standings-title) h2 { font-size: calc(var(--u) * 76) !important; text-align: left !important; }

    .hybrid-english [data-lp-page="fan-zone"] .fan-desktop-hero-title { --x:160 !important; --y:475 !important; left: calc(var(--u) * 160) !important; width: calc(var(--u) * 780) !important; }
    .hybrid-english [data-lp-page="fan-zone"] .fan-desktop-hero-title h1 { font-size: calc(var(--u) * 88) !important; text-align: left !important; }
    .hybrid-english [data-lp-page="fan-zone"] .fan-desktop-hero-copy { --x:1050 !important; --y:520 !important; --w:680 !important; text-align: left !important; text-align-last: left !important; }
    .hybrid-english [data-lp-page="fan-zone"] .fan-desktop-header-title { --x:130 !important; --y:3318 !important; --w:900 !important; }
    .hybrid-english [data-lp-page="fan-zone"] .fan-desktop-header-title h2 { font-family: 'Lama Sans Condensed', Arial, sans-serif !important; font-size: calc(var(--u) * 72) !important; line-height: 1.02 !important; text-align: left !important; }
    .hybrid-english [data-lp-page="fan-zone"] :is(.fan-desktop-form-title, .fan-desktop-quiz-title) h2 { font-family: 'Lama Sans Condensed', Arial, sans-serif !important; font-size: calc(var(--u) * 62) !important; }
}

/* V42 final cascade guards for rules that intentionally supersede the V41 audit. */
@media (min-width: 1024px) {
    [data-lp-page="matches"] .match-result-label {
        --x: 846.5 !important;
        --y: 184 !important;
        width: calc(var(--u) * 132) !important;
        font-size: calc(var(--u) * 15) !important;
        line-height: 1.02 !important;
        white-space: pre-line !important;
        text-align: center !important;
        text-align-last: center !important;
    }
    [data-lp-page="matches"] .matches-record-title {
        right: auto !important;
        left: 50% !important;
        width: calc(var(--u) * 1500) !important;
        text-align: center !important;
        text-align-last: center !important;
        transform: translateX(-50%) !important;
    }
    [data-lp-page="fan-zone"] :is(.fan-desktop-form-title, .fan-desktop-quiz-title) {
        right: auto !important;
        left: 50% !important;
        width: calc(var(--u) * 1680) !important;
        transform: translateX(-50%) !important;
    }
    [data-lp-page="fan-zone"] :is(.fan-desktop-form-title, .fan-desktop-quiz-title) h2 {
        width: 100% !important;
        font-size: calc(var(--u) * 64) !important;
        line-height: 1.04 !important;
        white-space: nowrap !important;
        text-align: center !important;
        text-align-last: center !important;
        transform: none !important;
    }
    .hybrid-english [data-lp-page="fan-zone"] :is(.fan-desktop-form-title, .fan-desktop-quiz-title) h2 {
        font-size: calc(var(--u) * 54) !important;
        letter-spacing: -.015em;
        white-space: nowrap !important;
    }
    .hybrid-english [data-lp-page="fan-zone"] .hybrid-quiz-v8 h3 {
        width: 100% !important;
        min-height: calc(var(--u) * 62) !important;
        font-size: calc(var(--u) * 31) !important;
        line-height: 1.25 !important;
        white-space: nowrap !important;
        text-align: center !important;
        text-align-last: center !important;
    }
}

/* V43 final mobile cascade guard. */
@media (max-width: 1023.98px) {
    .responsive-matches-page .responsive-match-card__meta {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        justify-items: center !important;
        gap: 6px !important;
        line-height: 1.3 !important;
        text-align: center !important;
    }
    .responsive-matches-page .responsive-match-card__meta > strong { min-width: 0; font-weight: 700; text-align: center !important; }
    .responsive-matches-page .responsive-match-card__mvp {
        display: grid !important;
        direction: rtl !important;
        grid-template-columns: auto minmax(0, 1fr) !important;
        justify-content: stretch !important;
    }
    .hybrid-english .responsive-matches-page .responsive-match-card__mvp { direction: ltr !important; }
    .responsive-matches-page .responsive-match-card__mvp span { text-align: start !important; }
    .responsive-matches-page .responsive-match-card__mvp strong { min-width: 0; text-align: end !important; }

    .responsive-history-detail .responsive-mobile-hero { min-height: 540px !important; gap: 14px !important; }
    .responsive-history-detail .responsive-mobile-hero__eyebrow { position: relative !important; z-index: 2 !important; margin: 0 !important; line-height: 1.35 !important; }
    .responsive-history-detail .responsive-mobile-hero h1 { position: relative !important; z-index: 1 !important; margin: 0 !important; font-size: clamp(88px, 28vw, 126px) !important; line-height: .92 !important; }
    .hybrid-english .responsive-history-detail .responsive-mobile-hero h1 { font-size: clamp(82px, 26vw, 116px) !important; line-height: .94 !important; }
    .responsive-history-detail .responsive-mobile-hero p { margin: 8px 0 0 !important; }
}

/* V44 targeted mobile fixes: seven MVP choices and phrase-safe English boxes.
   These classes exist only on the mobile surface, so keeping the rules outside
   the media query also makes the 402px forced-QA surface visually identical. */
    .responsive-match-card__mvp-poll {
        margin-top: 20px;
        padding-top: 16px;
        border-top: 1px solid #eefffa1c;
    }
    .responsive-match-card__mvp-poll h3 {
        margin: 0 0 13px;
        color: var(--mobile-gold);
        font-family: 'HT Rakik', 'Lama Sans', sans-serif;
        font-size: 19px;
        line-height: 1.2;
        text-align: center !important;
    }
    .hybrid-english .responsive-match-card__mvp-poll h3 {
        font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif;
        font-size: 18px;
    }
    .responsive-match-card__mvp-poll > div {
        display: grid;
        direction: rtl;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }
    .hybrid-english .responsive-match-card__mvp-poll > div { direction: ltr; }
    .responsive-match-card__mvp-poll button {
        min-width: 0;
        min-height: 42px;
        padding: 8px 7px;
        border: 1px solid #edcb8138;
        background: #071008a8;
        color: #eefffab5;
        font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif;
        font-size: 14px;
        font-style: italic;
        line-height: 1.1;
        white-space: nowrap;
        text-align: center !important;
        overflow: hidden;
        cursor: pointer;
    }
    .responsive-match-card__mvp-poll button:last-child:nth-child(odd) {
        width: calc(50% - 4px);
        grid-column: 1 / -1;
        justify-self: center;
    }
    .responsive-match-card__mvp-poll button:hover,
    .responsive-match-card__mvp-poll button:focus-visible,
    .responsive-match-card__mvp-poll button.is-selected {
        border-color: var(--mobile-gold);
        background: #edcb8115;
        color: var(--mobile-gold);
        outline: none;
    }
    .responsive-match-card__mvp-poll p {
        min-height: 18px;
        margin: 10px 0 0;
        color: #eefffa82;
        font-size: 11px;
        line-height: 1.35;
        text-align: center !important;
    }

    .hybrid-english .responsive-mobile-page :is(
        .history-name-card,
        .responsive-participant-grid span,
        .responsive-history-round b,
        .responsive-standings span,
        .responsive-standings b,
        .responsive-record-list b,
        .responsive-match-team strong,
        .responsive-person-card h3,
        [data-mobile-mvp-option]
    ) {
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }
    .history-name-roster--mobile .history-name-card {
        height: 72px;
        min-height: 72px;
        overflow: hidden;
    }
    .responsive-participant-grid span,
    .responsive-history-round b,
    .responsive-record-list b,
    .responsive-match-team strong {
        overflow: hidden;
    }

    .responsive-match-card__mvp-poll [data-mvp-option] span,
    .history-name-card,
    .responsive-participant-grid span,
    .responsive-history-round b,
    .responsive-record-list b {
        white-space: nowrap;
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }

    .responsive-match-card__mvp-poll [data-mvp-option] {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
    }

    .responsive-match-card__mvp-poll [data-mvp-percentage] {
        display: inline !important;
        flex: none;
    }

/* V46: one database state, a clean first paint, and phrase-safe responsive text. */
[data-lp-page] [hidden] { display: none !important; }

.hybrid-route-screen {
    position: fixed;
    z-index: 2147483646;
    inset: 0;
    display: grid;
    place-items: center;
    color: #edcb81;
    background: radial-gradient(circle at 50% 44%, #172619 0, #071009 42%, #020503 100%);
    opacity: 0;
    animation: hybrid-route-screen-in .12s ease-out forwards;
}
.hybrid-route-screen > div { display: grid; justify-items: center; gap: 18px; width: min(240px, 62vw); }
.hybrid-route-screen img { width: 88px; height: 88px; object-fit: contain; }
.hybrid-route-screen span { width: 100%; height: 2px; overflow: hidden; background: #edcb8128; }
.hybrid-route-screen span::after {
    content: '';
    display: block;
    width: 45%;
    height: 100%;
    background: #edcb81;
    animation: hybrid-route-progress .85s ease-in-out infinite;
}
.hybrid-route-screen p { margin: 0; font: 700 13px/1.2 'HT Rakik', 'Lama Sans', sans-serif; letter-spacing: .08em; }
.hybrid-english .hybrid-route-screen p { font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif; }
html.hybrid-navigating, html.hybrid-navigating body { overflow: hidden !important; }
@keyframes hybrid-route-screen-in { to { opacity: 1; } }
@keyframes hybrid-route-progress { from { transform: translateX(-110%); } to { transform: translateX(245%); } }

html:not(.hybrid-english) [data-lp-page="matches"] :is(
    .responsive-match-card,
    .responsive-mobile-hero,
    .matches-desktop-title,
    .matches-desktop-copy,
    .match-result-label,
    .matches-record-title,
    .responsive-match-card__mvp-poll h3,
    .responsive-match-card__mvp-poll p
) {
    font-family: 'HT Rakik', 'Lama Sans', Tahoma, sans-serif !important;
    font-weight: 300;
}

@media (max-width: 1023.98px) {
    .responsive-mobile-hero h1,
    .responsive-mobile-section-heading h2 {
        width: 100% !important;
        height: auto !important;
        min-height: 1.15em !important;
        padding-block: .08em !important;
        overflow: visible !important;
        line-height: 1.08 !important;
        text-wrap: balance;
    }
    .responsive-mobile-hero__eyebrow,
    .responsive-mobile-hero p,
    .responsive-mobile-section-heading p {
        height: auto !important;
        min-height: 1.35em !important;
        overflow: visible !important;
        line-height: 1.5 !important;
    }
    .hybrid-english .responsive-team-page .responsive-mobile-hero h1 {
        font-size: clamp(46px, 14vw, 66px) !important;
        line-height: 1.02 !important;
    }
    .hybrid-english .responsive-team-page .responsive-mobile-section-heading h2 {
        font-size: clamp(34px, 10.8vw, 48px) !important;
        line-height: 1.04 !important;
    }
    .desktop-team-card-mobile p.f-num[dir="ltr"] {
        width: calc(var(--u) * 250) !important;
        font-size: clamp(29px, 10vw, 42px) !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis;
    }
    .hybrid-english .responsive-match-card__mvp-poll button span {
        min-width: 0;
        overflow: hidden !important;
        text-overflow: ellipsis;
        white-space: nowrap !important;
    }
}

html.hybrid-force-mobile .responsive-mobile-hero h1,
html.hybrid-force-mobile .responsive-mobile-section-heading h2 {
    width: 100% !important;
    height: auto !important;
    min-height: 1.15em !important;
    overflow: visible !important;
    line-height: 1.08 !important;
}
html.hybrid-force-mobile.hybrid-english .responsive-team-page .responsive-mobile-hero h1 { font-size: 58px !important; line-height: 1.02 !important; }
html.hybrid-force-mobile.hybrid-english .responsive-team-page .responsive-mobile-section-heading h2 { font-size: 43px !important; line-height: 1.04 !important; }

.hybrid-english .lp :is(h1, h2, h3, p, strong, span, button, a, label, small, time) {
    hyphens: none !important;
    -webkit-hyphens: none !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

.hybrid-route-screen.is-leaving { opacity: 0; transition: opacity .16s ease-in; }

.approved-nav-desktop .nav-crown-star {
    position: absolute;
    z-index: 5;
    top: 55px;
    width: 15px;
    height: 15px;
    object-fit: contain;
    filter: drop-shadow(0 0 calc(var(--u) * 7) #edcb8170);
    pointer-events: none;
}
/* The two header × separators used to be baked into the homepage side-strip
   SVGs (the inner Vector_4 mark), so the injected crown-stars were hidden on
   the home route to avoid doubling. Those inner marks were removed from the
   SVGs, so the crown-stars now render on every route — identical glyph, same
   spot. Arabic keeps the original positions; English nudges the two marks into
   the gaps the owner asked for (left between MEDIA KIT and THE GREEN LEGION,
   right between THE GREEN'S SHOWDOWNS and OUR HISTORY). */
.approved-nav-desktop .nav-crown-star { top: 59px; width: 15px; height: 15px; }
.approved-nav-desktop .nav-crown-star--left { left: 618.84px; }
.approved-nav-desktop .nav-crown-star--right { left: 1280px; }
/* English home nav: the owner wants no × separators here. Arabic keeps them. */
.hybrid-english [data-lp-page="home"] .approved-nav-desktop .nav-crown-star { display: none; }

html:not(.hybrid-english) .lp {
    font-family: 'HT Rakik', 'Lama Sans', Tahoma, sans-serif !important;
}
html:not(.hybrid-english) .lp :is(h1, h2, h3, [class*="title"], [class*="heading"]) {
    font-family: 'HT Rakik', 'Lama Sans', Tahoma, sans-serif !important;
    font-weight: 800;
}
html:not(.hybrid-english) .lp :is(p, small, label, input, textarea, select, button) {
    font-family: 'HT Rakik', 'Lama Sans', Tahoma, sans-serif !important;
    font-weight: 300;
}
.hybrid-english .lp {
    font-family: 'Lama Sans', Arial, sans-serif !important;
}
.hybrid-english .lp :is(h1, h2, h3, [class*="title"], [class*="heading"]) {
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    font-weight: 900;
}
.hybrid-english .lp :is(p, small, label, input, textarea, select, button) {
    font-family: 'Lama Sans', Arial, sans-serif !important;
    font-weight: 400;
}

.home-current-match-score {
    position: absolute;
    z-index: 8;
    left: 50%;
    top: 58%;
    color: #edcb81;
    font: 900 calc(var(--u) * 76)/1 'Lama Sans Condensed', Arial, sans-serif;
    transform: translate(-50%, -50%);
}
.mobile-match-card .home-current-match-score { top: 63%; font-size: calc(var(--u) * 46); }


/* V46.2: unified bilingual typography, symmetric match labels and single-line box fitting. */
html:not(.hybrid-english) .lp {
    font-family: 'HT Rakik', 'Lama Sans', Tahoma, sans-serif !important;
    font-style: normal !important;
}
html:not(.hybrid-english) .lp :is(p, small, label, input, textarea, select, button, a, span) {
    font-family: 'HT Rakik', 'Lama Sans', Tahoma, sans-serif !important;
    font-style: normal !important;
    font-weight: 400;
}
html:not(.hybrid-english) .lp :is(h1, h2, h3, strong, b, [class*="title"], [class*="heading"]) {
    font-family: 'HT Rakik', 'Lama Sans', Tahoma, sans-serif !important;
    font-style: normal !important;
    font-weight: 740 !important;
}
html:not(.hybrid-english) .lp .f-num[dir="ltr"] {
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    font-style: normal !important;
    font-weight: 900 !important;
}

.hybrid-english .lp {
    font-family: 'Lama Sans', Arial, sans-serif !important;
    font-style: normal !important;
}
.hybrid-english .lp :is(p, small, label, input, textarea, select, button, a, span) {
    font-family: 'Lama Sans', Arial, sans-serif !important;
    font-style: normal !important;
    font-weight: 400;
}
.hybrid-english .lp :is(h1, h2, h3, strong, b, .f-num, [class*="title"], [class*="heading"]) {
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    font-style: normal !important;
    font-weight: 900 !important;
}

[data-lp-page="matches"] .responsive-match-team strong {
    font-style: normal !important;
    font-weight: 900 !important;
    /* Batch-8: a two-word name (SAUDI ARABIA) breaks into two balanced
       lines under its logo instead of overflowing sideways. */
    white-space: normal !important;
    text-wrap: balance !important;
    line-height: 1.15 !important;
}
html:not(.hybrid-english) [data-lp-page="matches"] .responsive-match-team strong {
    font-family: 'HT Rakik', 'Lama Sans', Tahoma, sans-serif !important;
    font-weight: 740 !important;
}
.hybrid-english [data-lp-page="matches"] .responsive-match-team strong {
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
}

@media (min-width: 1024px) {
    [data-lp-page="matches"] .lp-d div.px.sz[style*="--x:133"][style*="--y:750"] > p.px.f-num[style*="--y:162"] {
        width: calc(var(--u) * 330) !important;
        font-style: normal !important;
        font-weight: 900 !important;
        transform: none !important;
        transform-origin: center !important;
    }
    [data-lp-page="matches"] .lp-d div.px.sz[style*="--x:133"][style*="--y:750"] > p.px.f-num[style*="--x:127"] {
        left: calc(var(--u) * 145) !important;
        text-align: right !important;
        text-align-last: right !important;
    }
    [data-lp-page="matches"] .lp-d div.px.sz[style*="--x:133"][style*="--y:750"] > p.px.f-num[style*="--x:1219"] {
        left: calc(var(--u) * 1211) !important;
        text-align: left !important;
        text-align-last: left !important;
    }
    html:not(.hybrid-english) [data-lp-page="matches"] .lp-d div.px.sz[style*="--x:133"][style*="--y:750"] > p.px.f-num[style*="--y:162"] {
        font-family: 'HT Rakik', 'Lama Sans', Tahoma, sans-serif !important;
        font-weight: 740 !important;
    }
    .hybrid-english [data-lp-page="matches"] .lp-d div.px.sz[style*="--x:133"][style*="--y:750"] > p.px.f-num[style*="--y:162"] {
        font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    }
    [data-lp-page="matches"] .match-team-region {
        width: calc(var(--u) * 330) !important;
        transform: none !important;
        overflow-wrap: normal !important;
        white-space: nowrap !important;
    }
    [data-lp-page="matches"] .match-team-region-left {
        left: calc(var(--u) * 145) !important;
        text-align: right !important;
        text-align-last: right !important;
    }
    [data-lp-page="matches"] .match-team-region-right {
        left: calc(var(--u) * 1211) !important;
        text-align: left !important;
        text-align-last: left !important;
    }
}

@media (max-width: 1023.98px) {
    :is(
        .history-name-card,
        .responsive-participant-grid span,
        .responsive-history-round b,
        .responsive-standings span,
        .responsive-standings b,
        .responsive-record-list b,
        .responsive-person-card h3,
        [data-mvp-option] span,
        .media-kit-card h2,
        .desktop-team-card-mobile p.f-num[dir="ltr"],
        .responsive-mobile-button
    ) {
        white-space: nowrap !important;
        text-wrap: nowrap !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        hyphens: none !important;
    }
    .desktop-team-card-mobile p.f-num[dir="ltr"] {
        text-overflow: clip !important;
    }
}

html.hybrid-force-mobile :is(
    .history-name-card,
    .responsive-participant-grid span,
    .responsive-history-round b,
    .responsive-standings span,
    .responsive-standings b,
    .responsive-record-list b,
    .responsive-person-card h3,
    [data-mvp-option] span,
    .media-kit-card h2,
    .desktop-team-card-mobile p.f-num[dir="ltr"],
    .responsive-mobile-button
) {
    white-space: nowrap !important;
    text-wrap: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
}


/* V46.3: database removals stay removed on every responsive surface. */
[data-empty-image],
img[data-empty-image] {
    display: none !important;
}

/* V47 desktop acceptance: the match card consumes the same record semantics as
   mobile, while keeping the desktop Figma geometry. */
@media (min-width: 1024px) {
    [data-lp-page="matches"] .desktop-match-stage {
        left: 50% !important;
        top: calc(var(--u) * 72) !important;
        width: calc(var(--u) * 430) !important;
        font-family: 'HT Rakik', 'Lama Sans', sans-serif !important;
        font-size: calc(var(--u) * 25) !important;
        line-height: 1.2 !important;
        text-align: center !important;
        white-space: nowrap !important;
        transform: translateX(-50%) !important;
    }
    .hybrid-english [data-lp-page="matches"] .desktop-match-stage {
        font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    }
    [data-lp-page="matches"] .desktop-match-date {
        position: absolute;
        top: calc(var(--u) * 146);
        left: 50%;
        width: calc(var(--u) * 260);
        color: #edcb81;
        font-size: calc(var(--u) * 56);
        font-style: normal;
        font-weight: 900;
        line-height: 1;
        text-align: center;
        white-space: nowrap;
        transform: translateX(-50%);
    }

    [data-lp-page^="history-"] .history-detail-matches-title {
        left: calc(var(--u) * 1150) !important;
        top: calc(var(--u) * 4250) !important;
        width: calc(var(--u) * 570) !important;
    }
    [data-lp-page^="history-"] .history-detail-matches-title > h2 {
        width: 100% !important;
        font-size: calc(var(--u) * 122) !important;
        line-height: 1.04 !important;
        white-space: normal !important;
        text-align: right !important;
        text-wrap: balance;
    }
    .hybrid-english [data-lp-page^="history-"] .history-detail-matches-title > h2 {
        font-size: calc(var(--u) * 94) !important;
        text-align: left !important;
    }
}


/* V46.3.3: stable bilingual match names; selectors no longer depend on serialized inline styles. */
@media (min-width: 1024px) {
    [data-lp-page="matches"] .match-team-name {
        width: calc(var(--u) * 330) !important;
        font-style: normal !important;
        font-weight: 900 !important;
        transform: none !important;
        overflow-wrap: normal !important;
        white-space: nowrap !important;
    }
    [data-lp-page="matches"] .match-team-name-left {
        left: calc(var(--u) * 145) !important;
        text-align: right !important;
        text-align-last: right !important;
    }
    [data-lp-page="matches"] .match-team-name-right {
        left: calc(var(--u) * 1211) !important;
        text-align: left !important;
        text-align-last: left !important;
    }
    html:not(.hybrid-english) [data-lp-page="matches"] .match-team-name {
        font-family: 'HT Rakik', 'Lama Sans', Tahoma, sans-serif !important;
        font-weight: 740 !important;
    }
    html.hybrid-english [data-lp-page="matches"] .match-team-name {
        font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
        font-weight: 900 !important;
    }
}

/* V47.2: preserve the typography encoded by the approved Figma home shell.
   Later bilingual safety rules must not flatten its variable font weights. */
html:not(.hybrid-english) [data-lp-page="home"] .f-title {
    font-family: var(--font-title) !important;
    font-style: normal !important;
    font-weight: 700 !important;
}
html:not(.hybrid-english) [data-lp-page="home"] .f-title-sb {
    font-family: var(--font-title) !important;
    font-style: normal !important;
    font-weight: 600 !important;
}
html:not(.hybrid-english) [data-lp-page="home"] .f-body {
    font-family: var(--font-body) !important;
    font-style: normal !important;
    font-weight: 300 !important;
}
html:not(.hybrid-english) [data-lp-page="home"] .f-num {
    font-family: var(--font-num) !important;
    font-weight: 900 !important;
}
html:not(.hybrid-english) [data-lp-page="home"] .f-thin {
    font-family: var(--font-latin-thin) !important;
    font-weight: 100 !important;
}
html:not(.hybrid-english) [data-lp-page="home"] .f-nastaliq,
html:not(.hybrid-english) [data-lp-page="home"] :is(.match-title-arabic, .mobile-match-title-first, .mobile-match-title-second) {
    font-family: var(--font-nastaliq) !important;
    font-style: normal !important;
    font-weight: 500 !important;
}
html:not(.hybrid-english) [data-lp-page="home"] .lp-year {
    font-family: var(--font-num) !important;
    font-style: italic !important;
    font-weight: 900 !important;
}
html:not(.hybrid-english) [data-lp-page="home"] :is(.match-title-english, .mobile-match-title-english) {
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    font-style: italic !important;
    font-weight: 900 !important;
}


/* V47.3: preserve whole words, then shrink constrained labels before allowing overflow. */
.lp :is(.match-title-composition, .mobile-match-title) span,
.lp-marquee-item :is(strong, span) {
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    -webkit-hyphens: none !important;
}


/* V47.4 urgent delivery: centered mobile handles, one-row MVP choices and alpha-safe mobile trophy. */
.responsive-match-tabs {
    display: grid;
    margin: 0 20px 22px;
    padding: 4px;
    border: 1px solid #edcb8138;
    background: #071009c9;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px;
}
.responsive-match-tabs button {
    min-width: 0;
    min-height: 46px;
    padding: 9px 8px;
    border: 0;
    background: transparent;
    color: #eefffa91;
    font-family: 'HT Rakik', 'Lama Sans', Tahoma, sans-serif;
    font-size: 14px;
    white-space: nowrap;
    cursor: pointer;
}
.hybrid-english .responsive-match-tabs button {
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif;
}
.responsive-match-tabs button[aria-selected="true"] {
    background: #edcb81;
    color: #071009;
}
.responsive-matches-page [data-match-panel][hidden] { display: none !important; }

.responsive-match-card__mvp-poll > div,
.desktop-database-mvp-poll > div {
    display: flex !important;
    direction: rtl;
    overflow-x: auto;
    overflow-y: hidden;
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: 18px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}
.hybrid-english .responsive-match-card__mvp-poll > div,
.hybrid-english .desktop-database-mvp-poll > div { direction: ltr; }
.responsive-match-card__mvp-poll > div::-webkit-scrollbar,
.desktop-database-mvp-poll > div::-webkit-scrollbar { display: none; }
.responsive-match-card__mvp-poll button,
.responsive-match-card__mvp-poll button:last-child:nth-child(odd) {
    display: inline-flex !important;
    width: auto !important;
    min-width: max-content;
    min-height: 38px;
    padding: 6px 2px;
    border: 0 !important;
    background: transparent !important;
    color: #eeffface;
    flex: 0 0 auto;
    grid-column: auto !important;
    justify-self: auto !important;
    gap: 7px;
    border-radius: 10px;
}
.responsive-match-card__mvp-poll button:is(:hover, :focus-visible) {
    background: transparent !important;
    color: var(--mobile-gold, #edcb81);
}
/* The chosen option carries a refined golden glow around the name and its
   percentage — no underline, no circle, no marks; every other option stays
   fully visible without the glow. */
.responsive-match-card__mvp-poll button.is-selected {
    background: transparent !important;
    color: var(--mobile-gold, #edcb81);
    text-shadow: 0 0 14px rgba(237, 203, 129, .65);
    box-shadow: 0 0 18px 1px rgba(237, 203, 129, .38), inset 0 0 14px rgba(237, 203, 129, .14);
}
.responsive-match-card__mvp-poll button span {
    max-width: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
}

.desktop-team-card-mobile .team-card-name-row {
    left: 0 !important;
    width: 100% !important;
    padding-inline: calc(var(--u) * 24);
    box-sizing: border-box;
    overflow: visible !important;
}
.desktop-team-card-mobile .team-card-name {
    position: relative !important;
    left: 0 !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    transform: none !important;
    text-align: center !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
}
@media (max-width: 1023.98px) {
    .responsive-team-page .responsive-person-card h3 {
        width: 100%;
        overflow: hidden;
        text-overflow: clip;
        white-space: nowrap !important;
        text-wrap: nowrap !important;
    }
    .hybrid-trophy-v8.is-mobile-alpha-fallback {
        background: transparent !important;
    }
    .hybrid-trophy-v8.is-mobile-alpha-fallback .lp-trophy-poster {
        z-index: 3 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: 50% 50% !important;
        opacity: 1 !important;
    }
}
html.hybrid-force-mobile .hybrid-trophy-v8.is-mobile-alpha-fallback .lp-trophy-poster {
    z-index: 3 !important;
    object-fit: cover !important;
    opacity: 1 !important;
}


/* V47.5.2: English keeps the match-state geometry but shows only the English
   state; the Nastaliq fragments are Arabic artwork and stay hidden in English.
   The English hero title keeps the Arabic title's box so it never runs into
   the trophy case. */
.hybrid-english .lp :is(.match-title-arabic, .mobile-match-title-first, .mobile-match-title-second) {
    visibility: hidden !important;
}
.hybrid-english [data-lp-page="home"] .lp-d .home-desktop-title {
    /* Batch-18.1: DEFENDERS OF at 80u ran to x817 — the trophy-case
       contract caps the title at 780, and the box height must equal the
       Arabic title's (line-height 70 stays LOCKED to the shell h1). */
    font-size: calc(var(--u) * 72) !important;
    line-height: calc(var(--u) * 70) !important;
    letter-spacing: -.01em;
}

/* V47.5.2 Match Center mobile: the seven MVP chips are nowrap, and as the
   card is a grid item with min-width:auto their max-content width used to
   set the card width (755-782px at a 402px viewport), pushing one team and
   part of the score off screen. The card now never exceeds its column and
   the chips wrap into rows on mobile; desktop keeps its single row. */
.responsive-match-grid > * { min-width: 0; max-width: 100%; }
.responsive-match-card,
.responsive-match-card__mvp-poll,
.responsive-match-card__mvp-poll > div { min-width: 0; max-width: 100%; box-sizing: border-box; }
@media (max-width: 1023.98px) {
    .responsive-match-card__mvp-poll > div {
        flex-wrap: wrap !important;
        justify-content: center !important;
        overflow: visible !important;
        gap: 10px 18px;
    }
    .responsive-match-card__mvp-poll button { min-width: 0; }
    /* The chosen chip has a transparent background since V47.4, so its
       percentage must stay gold instead of the old dark-on-gold ink. */
    .responsive-match-card__mvp-poll button.is-selected strong { color: var(--mobile-gold, #edcb81); }
    [data-lp-page="matches"] .responsive-match-team strong {
        overflow: visible !important;
        line-height: 1.2 !important;
        padding-bottom: .08em;
    }
    .responsive-record-list b { line-height: 1.25; padding-bottom: .06em; }
}
html.hybrid-force-mobile .responsive-match-card__mvp-poll > div {
    flex-wrap: wrap !important;
    justify-content: center !important;
    overflow: visible !important;
    gap: 10px 18px;
}

/* V47.4.1: preserve the exact Figma typography for the three match-state layers. */
.lp :is(.match-title-arabic, .mobile-match-title-first, .mobile-match-title-second)[lang="ar"] {
    font-family: 'Noto Nastaliq Urdu', 'Urdu Typesetting', serif !important;
    font-style: normal !important;
    font-weight: 500 !important;
}
.lp :is(.match-title-english, .mobile-match-title-english)[lang="en"] {
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    font-style: italic !important;
    font-weight: 900 !important;
}
.hybrid-trophy-v8.is-mobile-alpha-video,
.hybrid-trophy-v8.is-mobile-alpha-video .hybrid-trophy-v8__video {
    background: transparent !important;
}


/* V47.5.0: render the supplied MOV as a lightweight colour + alpha composite on Apple mobile. */
.hybrid-trophy-v8.is-mobile-alpha-composite {
    background: transparent !important;
}
.hybrid-trophy-v8.is-mobile-alpha-composite .hybrid-trophy-alpha-source {
    position: absolute !important;
    width: 2px !important;
    height: 2px !important;
    inset: auto 0 0 auto !important;
    opacity: 0.001 !important;
    pointer-events: none !important;
}
.hybrid-trophy-v8.is-mobile-alpha-composite .hybrid-trophy-alpha-canvas {
    position: absolute;
    z-index: 4;
    top: 50%;
    left: 50%;
    display: block;
    width: 100%;
    height: auto;
    max-height: 100%;
    transform: translate(-50%, -50%);
    background: transparent;
    opacity: 0;
    pointer-events: none;
    transition: opacity 160ms ease;
}
.hybrid-trophy-v8.is-mobile-alpha-composite.is-video-ready .hybrid-trophy-alpha-canvas {
    opacity: 1;
}
.hybrid-trophy-v8.is-mobile-alpha-composite.is-video-ready .lp-trophy-poster {
    opacity: 0 !important;
    visibility: hidden !important;
}

/* Review 8: when the browser refuses autoplay (iPhone Low Power Mode, data
   saver) or the film errors out, the still stays and a tappable control lets
   the visitor start the trophy film. Hidden while the film plays. */
.hybrid-trophy-v8 .hybrid-trophy-play {
    display: none;
    position: absolute;
    left: 50%;
    bottom: 14%;
    z-index: 5;
    transform: translateX(-50%);
    min-width: 96px;
    padding: 10px 22px;
    border: 1px solid rgba(237, 203, 129, .85);
    border-radius: 999px;
    background: rgba(9, 14, 8, .78);
    color: #edcb81;
    font: 600 14px/1 inherit;
    letter-spacing: .08em;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.hybrid-trophy-v8.is-autoplay-blocked .hybrid-trophy-play:not([hidden]) { display: inline-flex; align-items: center; justify-content: center; }
.hybrid-trophy-v8 .hybrid-trophy-play:focus-visible { outline: 2px solid #edcb81; outline-offset: 2px; }

/* Review batch 2: the match score is a number, not Arabic display copy. The
   Arabic typography override above puts every <strong> in 'HT Rakik', which
   made the Arabic score 3 px wider than the English one and broke the
   pixel-parity contract between /  and /en. Both languages keep the Figma
   numeric face. */
html .lp .lp-d .home-current-match-score,
html .lp .lp-m .home-current-match-score {
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    font-weight: 900 !important;
}

/* Hotfix item 2: the public ballot and its archive show names and shares
   only — no raw vote counts, no leader line. */
.responsive-match-card__mvp-final .mvp-final-winner { margin: 6px 0 12px; color: var(--figma-gold-soft, #edcb81); font-weight: 700; text-align: center; }
.responsive-match-card__mvp-final .mvp-final-winner--empty { color: #eefffab3; font-weight: 400; }
.mvp-final-rows { display: grid; gap: 6px; }
.mvp-final-row { display: flex; gap: 14px; align-items: baseline; justify-content: space-between; padding: 4px 10px; }
.mvp-final-row b { min-width: 3em; color: var(--figma-gold-soft, #edcb81); text-align: end; }
.mvp-final-row.is-winner { border: 1px solid #edcb8155; border-radius: 8px; background: #edcb8114; }
.home-match-mvp-winner { font-weight: 600; }

/* Post-PR71 fix 3: the record archive names the MVP with votes and share. */
/* rows are a 4-column grid; the MVP line spans the full width beneath. */
/* Batch-6 item 2: the MVP line reads «رجل المباراة: NAME» and centres on
   the score column axis, not on the whole row. */
/* Batch-8: the label and the name are two separate elements in a flex
   row, so «رجل المباراة:» always comes first in reading order and the
   colon can never migrate toward the Latin name — no BiDi resolution
   involved at all. Centred with auto inline margins (Safari drifts
   `justify-self: center` + max-content in RTL grids). */
/* Extra class in the selector: the mobile page's blanket
   `:is(span, small, …) { max-width: 100% }` rule outranks a lone class
   and was clamping the line to its 46px score column. */
.record-mvp-line, .responsive-record-list .record-mvp-line { grid-column: 3; justify-self: center; display: flex; gap: .35em; align-items: baseline; width: max-content; max-width: none; margin-top: 2px; margin-inline: 0; color: var(--figma-gold-soft, #edcb81); font-size: .82em; white-space: nowrap; opacity: .9; }
/* The record row grid is direction:ltr even on the Arabic page, and its
   `span { min-width: 0 }` rule crushes the label to 0 — both flex items
   keep their content width, and the line takes the page language so the
   label always comes FIRST in reading order. */
.responsive-record-list .record-mvp-line > *, .record-mvp-line > * { flex: 0 0 auto; width: max-content; min-width: max-content; }
html:not(.hybrid-english) .record-mvp-line { direction: rtl; }
html.hybrid-english .record-mvp-line { direction: ltr; }

/* Post-PR71 fix 6: empty social links leave no button and no gap. */
.lp-platform[hidden] { display: none !important; }

/* Post-PR75 item 2: one language at a time in the state stack — the two
   words sit on two centred lines between the logos; the other language
   collapses entirely so the stack stays centred. */
html:not(.hybrid-english) .lp .match-state-stack [lang="en"] { display: none !important; }
.hybrid-english .lp .match-state-stack [lang="ar"] { display: none !important; visibility: hidden !important; }

/* Item 2 (hotfix batch 3): the home match card is one vertical flow —
   stage, state SVG flanked by the logos, MVP question (finished + open
   ballot only), score/countdown, button. Layout gaps, not per-state
   hand-tuned offsets; nothing may overlap its neighbour. */
.home-match-flow {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    height: auto !important;
    min-height: 100%;
    box-sizing: border-box;
    padding: 12px 10px 14px;
}
.home-match-flow > * {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    margin: 0 !important;
    flex: none;
}
.home-match-flow .home-match-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    width: 100%;
}
.home-match-flow .home-match-row > img { position: static !important; inset: auto !important; transform: none !important; display: block; }
.home-match-flow .match-state-art { position: static !important; transform: none !important; }
.home-match-flow .match-state-art img { width: auto; max-width: 46%; height: auto; }
.home-match-flow .home-current-match-score { position: static !important; width: auto; text-align: center; }
/* Sided score: one element per team in badge order, laid out by the same
   direction as the logo row beside it — the two are siblings in the card, so
   inheriting from the card guarantees the Saudi digits share the Saudi
   badge's side whatever the language. Specificity beats the English
   «every strong is LTR» rule, which would otherwise flip the score alone. */
.home-match-flow .home-current-match-score.home-current-match-score--sided { display: inline-flex; align-items: baseline; justify-content: center; gap: 0.22em; direction: inherit !important; }
/* The digits keep the score's own face: the English shell restyles every
   <span> to the text font, which would set the numbers in a lighter face
   than the Arabic page and break the home-block parity between languages. */
.home-match-flow .home-current-match-score.home-current-match-score--sided > * { font: inherit !important; letter-spacing: inherit !important; color: inherit; }
.home-match-flow .home-current-match-score.home-current-match-score--sided > i { font-style: normal !important; }
.home-match-flow .home-match-mvp-prompt, .home-match-flow .home-match-mvp-winner { position: static !important; width: auto; text-align: center; }
.home-match-flow .mobile-match-center-button, .home-match-flow .figma-button--hero { position: relative !important; inset: auto !important; }
.hero-match.home-match-flow { gap: 18px; padding: 26px 24px; }
.hero-match.home-match-flow .home-match-row { gap: 64px; }
.approved-match-desktop-scale .home-match-flow .figma-button--hero { position: relative !important; inset: auto !important; width: 187.027px; height: 38.098px; }

/* Post-PR75 item 1 (desktop Match Center): the ballot uses the full Figma
   card, not a small boxed widget. The state sits between the two scores on
   two lines, the big question returns above the options, and the seven
   nicknames run as one large, high-contrast row across the card. After a
   vote the chosen candidate lifts and turns gold while every candidate
   shows its votes and share. */
[data-lp-page="matches"] .lp-d .desktop-match-stage {
    top: 190px !important;
    left: 50% !important;
    width: min-content !important;
    line-height: 1.45 !important;
    text-wrap: balance;
    transform: translateX(-50%);
    text-align: center !important;
}
.desktop-database-mvp-poll {
    position: absolute;
    top: calc(var(--u) * 470);
    left: calc(var(--u) * 58);
    width: calc(var(--u) * 1563);
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
}
.desktop-database-mvp-poll h3 { display: none; }
.desktop-database-mvp-poll > div[role="radiogroup"] {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    gap: calc(var(--u) * 18);
}
.desktop-database-mvp-poll button[data-mvp-option] {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    align-items: center;
    gap: calc(var(--u) * 10);
    padding: calc(var(--u) * 14) calc(var(--u) * 6);
    border: 0;
    background: none;
    color: #fff;
    cursor: pointer;
    transition: transform .22s ease;
}
.desktop-database-mvp-poll button[data-mvp-option] span {
    font-family: 'Lama Sans Condensed', Arial, sans-serif;
    /* Batch-8: a notch smaller per the owner. */
    font-size: calc(var(--u) * 22);
    font-style: italic;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}
/* Voting affordance: a clickable candidate always shows the hand. */
.desktop-database-mvp-poll button[data-mvp-option]:not([disabled]),
.responsive-match-card__mvp-poll [data-mvp-option]:not([disabled]),
[data-mobile-mvp-option]:not([disabled]) { cursor: pointer !important; }
.desktop-database-mvp-poll button[data-mvp-option] [data-mvp-percentage] {
    color: var(--figma-gold-soft, #edcb81);
    font-size: calc(var(--u) * 34);
    line-height: 1;
}
.desktop-database-mvp-poll button[data-mvp-option] .mvp-vote-count {
    margin: 0;
    color: #eefffab3;
    font-size: calc(var(--u) * 16);
}
.desktop-database-mvp-poll button[data-mvp-option]:not(.is-selected):hover { transform: translateY(calc(var(--u) * -4)); }
.desktop-database-mvp-poll button.is-selected {
    transform: translateY(calc(var(--u) * -12));
}
.desktop-database-mvp-poll button.is-selected span { color: var(--figma-gold-soft, #edcb81); text-shadow: 0 0 22px #edcb8166; }
.desktop-database-mvp-poll button[data-mvp-option]:disabled { cursor: default; opacity: 1; }
.desktop-database-mvp-poll button[data-mvp-option],
.desktop-database-mvp-poll button[data-mvp-option] * {
    border: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    background: none !important;
    text-decoration: none !important;
}
.desktop-database-mvp-poll button.is-selected { background: none !important; color: inherit; }
.desktop-database-mvp-poll [data-mvp-feedback] { margin: calc(var(--u) * 16) 0 0; color: #eefffacc; font-size: calc(var(--u) * 18); text-align: center; }
.desktop-database-mvp-poll [data-mvp-feedback]:empty { display: none; }
.desktop-database-mvp-poll .mvp-leader-line { margin-top: calc(var(--u) * 18); font-size: calc(var(--u) * 20); }
/* The desktop card also hosts the closed final results at the same slot. */
.desktop-database-mvp-poll.responsive-match-card__mvp-final { top: calc(var(--u) * 400); }
.desktop-database-mvp-poll .mvp-final-rows { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(var(--u) * 8) calc(var(--u) * 40); direction: rtl; }
.hybrid-english .desktop-database-mvp-poll .mvp-final-rows { direction: ltr; }

/* Post-PR75 item 1 (Match Center card): the two-line state inside the card
   and a large, high-contrast ballot instead of the tiny chips. */
.responsive-match-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 6px 0 2px;
    text-align: center;
}
.responsive-match-state [lang="ar"] {
    color: var(--figma-gold-soft, #edcb81);
    font-family: 'Noto Nastaliq Urdu', 'Urdu Typesetting', serif;
    font-size: 19px;
    font-weight: 500;
    line-height: 1.7;
}
.responsive-match-state [lang="en"] {
    color: #fff;
    font-family: 'Lama Sans Condensed', Arial, sans-serif;
    font-size: 20px;
    font-style: italic;
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: .04em;
    text-transform: uppercase;
}
@media (max-width: 1023.98px) {
    .responsive-match-card__mvp-poll:not(.desktop-database-mvp-poll) > div[role="radiogroup"] {
        display: grid !important;
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .responsive-match-card__mvp-poll:not(.desktop-database-mvp-poll) button[data-mvp-option] {
        display: flex !important;
        min-height: 54px;
        padding: 10px 16px;
        border: 1px solid #eefffa2e;
        border-radius: 10px;
        background: #0c1411;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        transition: transform .2s ease, border-color .2s ease;
    }
    .responsive-match-card__mvp-poll:not(.desktop-database-mvp-poll) button[data-mvp-option] span {
        overflow: visible;
        font: 900 17px/1.15 'Lama Sans Condensed', Arial, sans-serif;
        font-style: italic;
        letter-spacing: .03em;
        text-transform: uppercase;
    }
    .responsive-match-card__mvp-poll:not(.desktop-database-mvp-poll) button[data-mvp-option] strong { font-size: 18px; }
    .responsive-match-card__mvp-poll:not(.desktop-database-mvp-poll) button.is-selected {
        border-color: var(--figma-gold-soft, #edcb81);
        background: #edcb810f;
        color: var(--figma-gold-soft, #edcb81);
        text-shadow: 0 0 14px rgba(237, 203, 129, .65);
        box-shadow: 0 0 20px 2px rgba(237, 203, 129, .38), inset 0 0 16px rgba(237, 203, 129, .12);
    }
    .responsive-match-card__mvp-poll:not(.desktop-database-mvp-poll) [data-mvp-feedback] { font-size: 14px; }
}

/* Hotfix item 1: the match state is the supplied artwork, never re-drawn
   text. The image keeps its native aspect ratio (55px tall art) on mobile
   and scales up proportionally on desktop; screen readers get hidden text
   in the active language instead of the image. */
.match-state-art { display: flex; flex-direction: column; align-items: center; justify-content: center; }
.match-state-art img { display: block; width: auto; height: 55px; max-width: 100%; margin: 0 auto; }
.match-title-composition.match-state-art img { height: 68px; }
.responsive-match-state.match-state-art { margin: 10px 0 6px; }
.match-state-art .sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; white-space: nowrap; border: 0; clip: rect(0, 0, 0, 0); }
/* Match Center state — real HTML text, never the home artwork: two stacked
   words, Noto Nastaliq in Arabic and Lama Sans Black Condensed in English,
   gold, centred between the score digits (or between the logos before
   kick-off, with the date/countdown below the row). */
.match-state-text { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.match-state-text [lang="ar"] { color: var(--figma-gold-soft, #edcb81); font-family: 'Noto Nastaliq Urdu', 'Urdu Typesetting', serif !important; font-size: 19px; font-weight: 500 !important; line-height: 1.75; white-space: nowrap; }
.match-state-text [lang="en"] { color: var(--figma-gold-soft, #edcb81); font-family: 'Lama Sans Condensed', 'Arial Narrow', Arial, sans-serif !important; font-size: 20px; font-style: italic; font-weight: 900 !important; line-height: 1.05; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
/* The global per-language font swaps carry !important, so the state stack
   re-asserts its two families with higher specificity in both directions. */
html .lp .match-state-text [lang="ar"],
html:not(.hybrid-english) .lp .match-state-text [lang="ar"] { font-family: 'Noto Nastaliq Urdu', 'Urdu Typesetting', serif !important; font-weight: 500 !important; }
html .lp .match-state-text [lang="en"],
html.hybrid-english .lp .match-state-text [lang="en"] { font-family: 'Lama Sans Condensed', 'Arial Narrow', Arial, sans-serif !important; font-weight: 900 !important; }
.responsive-live-flag { color: #ff2e2e; font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: 13px; font-style: italic; font-weight: 900; letter-spacing: .06em; }
.responsive-match-card__score--left, .responsive-match-card__score--right { flex: none; }
.responsive-match-card__date { display: block; margin: 10px auto 0; text-align: center; }
@media (min-width: 1024px) {
    [data-lp-page="matches"] .lp-d .desktop-match-stage {
        top: calc(var(--u) * 56) !important;
    }
    [data-lp-page="matches"] .desktop-match-state-stack {
        position: absolute;
        top: calc(var(--u) * 174);
        left: 50%;
        transform: translateX(-50%);
    }
    [data-lp-page="matches"] .desktop-match-state-stack [lang="ar"] { font-size: calc(var(--u) * 26); }
    [data-lp-page="matches"] .desktop-match-state-stack [lang="en"] { font-size: calc(var(--u) * 27); }
    /* The two fonts sit ~6px apart at the same top; each language gets its
       own measured offset so both centres land on the digits centre. */
    .hybrid-english [data-lp-page="matches"] .desktop-match-state-stack { top: calc(var(--u) * 180); }
    [data-lp-page="matches"] .desktop-match-date { top: calc(var(--u) * 200) !important; }
    /* Batch-11 item 6: before kick-off the state words and the big date share
       the card's centre — stack the state ABOVE and the date BELOW so neither
       paints over the other (both languages). */
    /* Batch-12 item 12: before kick-off the state reads as ONE line, lifted
       a little, with the date keeping its own row beneath. */
    [data-lp-page="matches"] [data-match-status="scheduled"] .desktop-match-state-stack { top: calc(var(--u) * 96) !important; display: flex !important; flex-direction: row !important; justify-content: center; gap: .32em; white-space: nowrap; transform: translateX(-50%) !important; }
    [data-lp-page="matches"] [data-match-status="scheduled"] .desktop-match-date { top: calc(var(--u) * 168) !important; }
    /* Batch-11 item 7: record badges flank the score — Saudi's beside its
       name (right of the score), the opponent's beside its own. */
    [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] .record-badge { position: absolute; top: 50%; width: calc(var(--u) * 48); height: calc(var(--u) * 48); object-fit: contain; transform: translateY(-50%); filter: drop-shadow(0 4px 9px #00000066); }
    [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] .record-badge--saudi { left: calc(var(--u) * 700); }
    [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] .record-badge--opp { left: calc(var(--u) * 540); }
    [data-lp-page="matches"] .desktop-live-flag {
        position: absolute;
        top: calc(var(--u) * 40);
        inset-inline-end: calc(var(--u) * 48);
        color: #ff2e2e;
        font-family: 'Lama Sans Condensed', Arial, sans-serif;
        font-size: calc(var(--u) * 24);
        font-style: italic;
        font-weight: 900;
        letter-spacing: .06em;
    }
    [data-lp-page="matches"] .desktop-live-flag[hidden] { display: none !important; }
}

/* Item 1 sizes: the SVG shows at its delivered scale — 55px tall art on
   mobile, 98px tall on desktop — never squeezed by older art rules. */
.home-match-flow .match-state-art img { width: auto !important; max-width: none !important; height: 55px !important; }
.hero-match.home-match-flow .match-state-art img { height: 98px !important; }
.mobile-match-card.home-match-flow { gap: 8px; padding: 8px 8px 10px; }

/* Item 4: the score row holds five cells — team, digit, state, digit,
   team — and the state's vertical centre matches the digits' centre. */
.responsive-match-card[data-match-state="live"] .responsive-match-card__teams,
.responsive-match-card[data-match-state="finished"] .responsive-match-card__teams {
    grid-template-columns: minmax(0, 1fr) auto minmax(84px, auto) auto minmax(0, 1fr) !important;
    align-items: center;
}
.responsive-match-card__score--left, .responsive-match-card__score--right { align-self: center; }
.responsive-match-card .match-state-text { align-self: center; }

/* Item 10: back-to-top — a small gold rounded square with a dark up arrow,
   fixed near the screen edge, clear of the site's own controls. */
.back-to-top {
    position: fixed;
    bottom: 22px;
    inset-inline-start: 18px;
    z-index: 1200;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: linear-gradient(100deg, #edcb81 70%, #f5dfae 100%);
    color: #171a10;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .45);
    transition: transform .2s ease, filter .2s ease;
}
.back-to-top svg { width: 22px; height: 22px; }
.back-to-top:hover { filter: brightness(1.06); transform: translateY(-2px); }
.back-to-top:focus-visible { outline: 2px solid #f5dfae; outline-offset: 2px; }
.back-to-top[hidden] { display: none !important; }
@media (prefers-reduced-motion: reduce) { .back-to-top { transition: none; } }

/* Item 9: nested Media Kit folders on the public site. */
.media-subfolder { margin-top: 26px; padding-inline-start: 14px; border-inline-start: 1px solid #edcb8138; }
.media-subfolder__title { margin: 0 0 4px; color: var(--figma-gold-soft, #edcb81); font-size: 20px; }
.media-subfolder .media-subfolder__title { font-size: 17px; }
.media-subfolder__description { margin: 0 0 10px; color: #eefffab3; font-size: 13px; }

/* Batch-5: the delivered SVGs carry asymmetric transparent padding around
   the ink (desktop: 31px above / 12px below; mobile: 17/7 — measured per
   pixel), which made the state look far from the stage and glued to the
   score. The image margins cancel that padding so its box hugs the ink,
   and the row pull is recomputed from the ink so the stage above and the
   question below sit at the same real distance (~16px desktop, ~10px
   mobile) from the letters themselves. */
/* Batch-8 (owner's word: «خليها صورة زي ماهي»): the delivered bilingual
   composition IS the artwork, one img, exactly the batch-6 ink margins
   the owner approved. */
.hero-match.home-match-flow .match-state-art img { margin: -31px 0 -12px !important; }
.mobile-match-card.home-match-flow .match-state-art img { margin: -17px 0 -7px !important; }
/* Batch-6 row pull, owner-approved, restored verbatim; the only batch-8
   change kept is the score/countdown sitting slightly lower («نزل
   النتيجة شوي»: 6px mobile / 8px desktop). */
.hero-match.home-match-flow .home-match-row { margin: -19px 0 -37px !important; }
.mobile-match-card.home-match-flow .home-match-row { margin: -4px 0 -14px !important; }
.hero-match.home-match-flow :is(.home-current-match-score, .hero-countdown) { margin-top: 8px !important; }
/* Batch-10: the flow forces children static, which let the countdown's
   ABSOLUTE units escape to the hero's top (the digits the owner saw on
   the date bar). Relative keeps the flow slot AND contains the units. */
.hero-match.home-match-flow .hero-countdown { position: relative !important; }
.mobile-match-card.home-match-flow :is(.home-current-match-score, .mobile-countdown) { margin-top: 6px !important; }

/* Batch-6 items 1+6: the top date/time bar grows to a readable size, the
   stage drops onto the state artwork and the MVP question rises onto it —
   both by pure transform, so the artwork, the score and the button never
   move from their places. */
.home-match-flow .mobile-match-meta { width: 100% !important; height: auto !important; font-size: 9.5px !important; line-height: 1.5 !important; }
.home-match-flow .mobile-match-meta svg { width: 10px !important; height: 10px !important; }
.hero-match.home-match-flow .information-item { font-size: 18px !important; }
.hero-match.home-match-flow .information-item svg { width: 18px !important; height: 18px !important; }
/* Batch-11 item 1: at the 18px home size the three fixed 152px columns
   ellipsised the date to «SAT, 12 SEPT 2.» — size every column to its own
   text and keep the dividers centred in the gaps instead. */
/* Fixed 620u box (language parity) — the columns inside size to their
   own text so nothing ellipsises. */
.hero-match.home-match-flow .match-information-line { width: calc(var(--u) * 620) !important; grid-template-columns: repeat(3, max-content) !important; justify-content: center; column-gap: 34px !important; }
.hero-match.home-match-flow .information-item + .information-item::before { left: -17px; }
.hero-match.home-match-flow .information-item span { overflow: visible; text-overflow: clip; }
.home-match-flow .mobile-match-meta { justify-content: center; column-gap: 6px; grid-template-columns: max-content 1px max-content 1px max-content !important; }
.mobile-match-card.home-match-flow .mobile-match-stage { transform: translateY(6px) !important; }
.hero-match.home-match-flow .match-stage { transform: translateY(9px) !important; }
.mobile-match-card.home-match-flow .home-match-mvp-prompt { transform: translateY(-5px) !important; }
.hero-match.home-match-flow .home-match-mvp-prompt { transform: translateY(-8px) !important; }

/* Batch-7 (supersedes batch-6 item 7): one VISUAL centreline for the whole
   Match Center row — aligned on each element's ink (glyph bounds), not its
   box, anchored on the logo centres. Per language, because the Arabic and
   Latin faces hang their ink differently inside the same box. */
/* Batch-8: the names' vertical offset is measured at runtime per word
   (alignDesktopNameInk) — no fixed transform can fit every opponent —
   and a two-word Latin name breaks into two balanced lines instead of
   running into its badge. */
[data-lp-page="matches"] .lp-d .match-team-name-left,
[data-lp-page="matches"] .lp-d .match-team-name-right { white-space: normal !important; text-wrap: balance !important; line-height: 1.05 !important; }
[data-lp-page="matches"] .lp-d .desktop-match-score { transform: translateY(27px) !important; }
/* The stack is absolutely centred with translateX(-50%) — keep it. */
html:not(.hybrid-english) [data-lp-page="matches"] .lp-d .desktop-match-state-stack { transform: translateX(-50%) translateY(-3px) !important; }
html.hybrid-english [data-lp-page="matches"] .lp-d .desktop-match-state-stack { transform: translateX(-50%) translateY(6px) !important; }
/* Batch-8: the mobile row reads as ONE line — score digits and the state
   text ink-centred on the LOGO centreline (they previously floated ~28px
   below it), and a two-word team name may break into two balanced lines
   under its logo instead of overflowing sideways. */
.responsive-match-card__score--left, .responsive-match-card__score--right { transform: translateY(-14px); }
html.hybrid-english .responsive-match-card :is(.responsive-match-card__score--left, .responsive-match-card__score--right) { transform: translateY(-18px); }
.responsive-match-card .match-state-text { transform: translateY(-16px); }
html.hybrid-english .responsive-match-card .match-state-text { transform: translateY(-23px); }

/* Batch-8: «قصة الأخضر» replaces the baked history-title artwork — a
   real, admin-editable heading styled like the shell's own titles. */
/* Batch-9 (owner's sketch): «قصة» on its own line, and the last word
   stretched with kashida so it runs BEHIND the 3D badge —
   «الاخضــــ الشعار ــر». The badge (later in source) paints on top. */
.home-story-title { display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 0; font-family: var(--font-title); font-weight: 740; color: var(--gold, #e5c178); white-space: nowrap; }
.home-story-title .home-story-title__lead { display: block; }
.home-story-title .home-story-title__word { display: block; line-height: .9; }
.lp-d .home-story-title .home-story-title__lead { font-size: calc(var(--u) * 120); align-self: flex-start; margin-inline-start: calc(var(--u) * 80); }
/* Batch-11 item 4: the stretched word slides further right until its «الأ…ضـ»
   opening shares the right boundary with «قصة» above it (owner: «ترجع يمين
   اكثر الين نهاية حد الضـ»). */
.lp-d .home-story-title .home-story-title__word { font-size: calc(var(--u) * 220); letter-spacing: calc(var(--u) * -4); padding-inline: calc(var(--u) * 60); transform: translateX(calc(var(--u) * 504)); }
.lp-m .home-story-title .home-story-title__lead { font-size: calc(var(--u) * 32); align-self: flex-start; margin-inline-start: calc(var(--u) * 40); }
.lp-m .home-story-title .home-story-title__word { font-size: calc(var(--u) * 56); padding-inline: calc(var(--u) * 10); }

/* Batch-9/10: «حاملو الراية» — HT Rakik at its heaviest, the site gold,
   hero-scale. The selectors outrank the home typography blocks that pin
   .f-body at weight 300 !important. */
html [data-lp-page="home"] .lp-d .home-team-title,
html [data-lp-page="home"] .lp-m .home-team-title,
.home-team-title { font-family: var(--font-title) !important; font-weight: 740 !important; color: var(--gold, #e5c178) !important; }
/* Batch-11 item 3 + batch-12 items 1/4: the ARABIC DESKTOP title keeps the
   two-line hero stack; everywhere else (mobile both languages, English
   desktop) the title is ONE line auto-fitted by fitHomeTeamTitle so long
   names never crash into the quote, the template word or the CTA. */
html:not(.hybrid-english) [data-lp-page="home"] .lp-d .home-team-title:not(.home-team-title--one-line) { font-size: calc(var(--u) * 130) !important; line-height: 1.08 !important; white-space: normal !important; inline-size: min-content; transform: translate(-100%, calc(var(--u) * -80)) !important; }
html [data-lp-page="home"] .home-team-title.home-team-title--one-line { white-space: nowrap !important; line-height: 1.15 !important; inline-size: max-content; }
html [data-lp-page="home"] .lp-d .home-team-title.home-team-title--one-line { transform: translate(-100%, calc(var(--u) * -20)) !important; }

/* Batch-10: the record's stage cell is right-anchored and a long stage
   («دور المجموعات — المجموعة B») grew left into «السعودية» — the
   Saudi/score/opponent trio moves left to clear it (owner's call). */
[data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(3) { --x: 905 !important; }
[data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(4) { --x: 610 !important; }
[data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(5) { --x: 517 !important; }

/* Batch-10: the complete participant grid on year pages — every team,
   the logo-less ones on the blank badge with their gold name. */
.history-participants-grid { position: absolute; left: 4%; width: 92%; top: calc(var(--u) * var(--zone-top, 2050)); display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: calc(var(--u) * 34) calc(var(--u) * 18); justify-items: center; z-index: 5; }
.history-participants-grid img { width: calc(var(--u) * 96); height: calc(var(--u) * 112); object-fit: contain; }
.participant-blank { position: relative; display: inline-flex; align-items: center; justify-content: center; }
.participant-blank img { width: calc(var(--u) * 96); height: calc(var(--u) * 112); object-fit: contain; }
.participant-blank b { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 14%; color: var(--gold, #e5c178); font-family: var(--font-title); font-weight: 700; font-size: calc(var(--u) * 15); line-height: 1.2; text-align: center; text-wrap: balance; white-space: normal; }
.responsive-participant-grid .participant-blank img { width: 56px; height: 66px; }
.responsive-participant-grid .participant-blank b { font-size: 10px; }

/* Batch-6 item 14: sub-folder cards inside a panel. */
.media-subfolder-grid { margin-top: 26px; }
.media-folder-card .media-category-card__visual img { width: 100%; height: 100%; object-fit: cover; }

/* ============================================================= */
/* Batch-11 item 12: the fan wall — form beside three shuffled    */
/* crowd messages (two dark green with gold text, one gold with  */
/* black text, star/shield/trophy icons, redrawn every refresh). */
/* Owner's sketch: the form on the LEFT, the wall on the RIGHT (Arabic);
   English mirrors. Texts keep their own direction inside. */
.fan-wall-v11 { display: grid; grid-template-columns: calc(var(--u) * 560) 1fr; gap: calc(var(--u) * 40); direction: ltr; align-items: stretch; }
.hybrid-english .fan-wall-v11 { direction: rtl; }
.fan-wall-form { direction: rtl; }
.hybrid-english .fan-wall-form { direction: ltr; }
.fan-wall-board { direction: rtl; }
.hybrid-english .fan-wall-board { direction: ltr; }
.fan-wall-form { display: flex; flex-direction: column; gap: calc(var(--u) * 18); padding: calc(var(--u) * 34); border: 1px solid #edcb8138; background: #071009e8; }
.fan-wall-form__title { margin: 0 0 calc(var(--u) * 6); color: var(--figma-gold, #edcb81); font-family: 'HT Rakik', 'Lama Sans', sans-serif; font-size: calc(var(--u) * 34); font-variation-settings: 'wght' 700; }
.fan-wall-form label { display: flex; flex-direction: column; gap: calc(var(--u) * 8); color: #eefffab8; font-family: 'Lama Sans', sans-serif; font-size: calc(var(--u) * 15); }
.fan-wall-form input, .fan-wall-form textarea { padding: calc(var(--u) * 12) calc(var(--u) * 14); border: 1px solid #edcb812e; background: #0c1810; color: #eefffa; font-family: 'Lama Sans', sans-serif; font-size: calc(var(--u) * 16); resize: none; }
.fan-wall-form input:focus, .fan-wall-form textarea:focus { border-color: #edcb8180; outline: none; }
.fan-wall-form button { display: flex; align-items: center; justify-content: center; gap: 10px; position: relative; margin-top: calc(var(--u) * 4); padding: calc(var(--u) * 13) 0; border: 1px solid var(--figma-gold, #edcb81); background: transparent; color: var(--figma-gold, #edcb81); font-family: 'HT Rakik', 'Lama Sans', sans-serif; font-size: calc(var(--u) * 20); font-variation-settings: 'wght' 700; cursor: pointer; transition: background-color .2s, color .2s; }
.fan-wall-form button:hover { background: var(--figma-gold, #edcb81); color: #0c120a; }
.fan-wall-form button b { font-family: Arial, sans-serif; font-weight: 400; }
.fan-wall-form [data-form-feedback] { min-height: 1.4em; margin: 0; color: #edcb81; font-family: 'Lama Sans', sans-serif; font-size: calc(var(--u) * 14); }
.fan-wall-board { display: flex; flex-direction: column; gap: calc(var(--u) * 22); }
/* Batch-12 item 8: the wall heading sits centred over its own cards, not
   glued to the screen edge. */
.fan-wall-board__title { margin: 0; color: var(--figma-gold, #edcb81); font-family: 'HT Rakik', 'Lama Sans', sans-serif; font-size: calc(var(--u) * 34); font-variation-settings: 'wght' 700; text-align: center; }
.fan-wall-board__cards { display: grid; flex: 1; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(var(--u) * 26); align-items: center; padding-inline: calc(var(--u) * 18); }
.fan-wall-card { position: relative; display: flex; flex-direction: column; gap: calc(var(--u) * 14); min-height: calc(var(--u) * 300); padding: calc(var(--u) * 26); box-shadow: 0 18px 40px #00000059; }
.fan-wall-card:nth-child(1) { transform: rotate(-2.2deg); }
.fan-wall-card:nth-child(2) { transform: rotate(1.6deg) translateY(calc(var(--u) * 18)); }
.fan-wall-card:nth-child(3) { transform: rotate(-1.2deg); }
.fan-wall-card--green { background: #0d2b1d; border: 1px solid #e5c17833; }
.fan-wall-card--green p, .fan-wall-card--green footer { color: #edcb81; }
.fan-wall-card--green .fan-wall-card__icon svg { fill: #edcb81; }
.fan-wall-card--gold { background: #e5c178; }
.fan-wall-card--gold p, .fan-wall-card--gold footer { color: #121408; }
.fan-wall-card--gold .fan-wall-card__icon svg { fill: #14351f; }
.fan-wall-card__icon svg { width: calc(var(--u) * 26); height: calc(var(--u) * 26); }
.fan-wall-card p { margin: 0; flex: 1; font-family: 'Lama Sans', sans-serif; font-size: calc(var(--u) * 18); font-weight: 600; line-height: 1.7; }
.fan-wall-card footer { font-family: 'Lama Sans', sans-serif; font-size: calc(var(--u) * 13.5); opacity: .82; }
.fan-wall-board__empty { grid-column: 1 / -1; margin: 0; color: #eefffab0; font-family: 'Lama Sans', sans-serif; font-size: calc(var(--u) * 17); text-align: center; }

/* Batch-11 item 13: fan art — three tilted artworks with artist names,  */
/* fed from the admin media library ('fan-art': image + artist title).   */
.fan-art-v11__title { margin: 0 0 calc(var(--u) * 46); color: var(--figma-gold, #edcb81); font-family: 'HT Rakik', 'Lama Sans', sans-serif; font-size: calc(var(--u) * 52); font-variation-settings: 'wght' 740, 'swsh' 1; text-align: center; }
.fan-art-v11__cards { display: flex; justify-content: center; gap: calc(var(--u) * 70); align-items: flex-start; }
.fan-art-card { position: relative; margin: 0; width: calc(var(--u) * 420); }
.fan-art-card::before { content: ''; position: absolute; inset: calc(var(--u) * -14) calc(var(--u) * -14) calc(var(--u) * -58) calc(var(--u) * -14); z-index: -1; background: #e5c178; transform: rotate(3.4deg); }
.fan-art-card--1 { transform: rotate(-2.4deg); }
.fan-art-card--2 { transform: rotate(1.8deg) translateY(calc(var(--u) * -26)); }
.fan-art-card--3 { transform: rotate(-1.4deg); }
.fan-art-card img { display: block; width: 100%; height: auto; background: #0c1810; box-shadow: 0 22px 48px #00000073; }
/* Batch-14 item 9: the caption lives ON the polaroid's gold strip — dark
   ink, one clean row, instead of white text bleeding over the frame edge. */
.fan-art-card figcaption { display: flex; flex-direction: row; align-items: baseline; justify-content: center; gap: calc(var(--u) * 8); margin-top: calc(var(--u) * 12); padding-inline: calc(var(--u) * 18); font-family: 'Lama Sans', sans-serif; white-space: nowrap; }
.fan-art-card figcaption span { color: #10150c99; font-size: calc(var(--u) * 13); }
.fan-art-card figcaption strong { color: #10150c; font-size: calc(var(--u) * 17); overflow: hidden; text-overflow: ellipsis; }

/* Mobile variants: single column flow. */
.fan-wall-v11--mobile { display: flex; flex-direction: column; gap: 22px; }
.fan-wall-v11--mobile .fan-wall-form__title, .fan-wall-v11--mobile .fan-wall-board__title { font-size: 22px; }
.fan-wall-v11--mobile .fan-wall-form input, .fan-wall-v11--mobile .fan-wall-form textarea { font-size: 15px; padding: 11px 12px; }
.fan-wall-v11--mobile .fan-wall-form button { font-size: 16px; padding: 11px 0; }
.fan-wall-v11--mobile .fan-wall-board__cards { grid-template-columns: 1fr; gap: 16px; }
.fan-wall-v11--mobile .fan-wall-card { min-height: 0; padding: 18px; }
.fan-wall-v11--mobile .fan-wall-card p { font-size: 14.5px; }
.fan-art-v11--mobile .fan-art-v11__title { font-size: 26px; margin-bottom: 26px; }
.fan-art-v11--mobile .fan-art-v11__cards { flex-direction: column; align-items: center; gap: 34px; }
.fan-art-v11--mobile .fan-art-card { width: min(78vw, 320px); }
.fan-art-v11--mobile .fan-art-card--2 { transform: rotate(1.8deg); }
/* The art section pushes the CSS-positioned quiz down with everything else. */
.fan-art-inserted .hybrid-quiz-v8 { top: calc(var(--u) * (2430 + var(--fan-tail-shift, 860))); }
/* Caption glyph boxes are taller than their line — pin the line height so
   the الفنان label and the name never report as overlapping. */
.fan-art-card figcaption span { line-height: 1.1; }
.fan-art-card figcaption strong { line-height: 1.15; }

/* Batch-11 items 15+16: the knockout bracket between the match card and  */
/* the record. Decided matches show the real result; open ones take the   */
/* fan's pick + score, and a completed bracket offers a clean share CTA.  */
.bracket-v11__inner { display: flex; flex-direction: column; gap: calc(var(--u) * 22); }
.bracket-v11__title { margin: 0; color: var(--figma-gold, #edcb81); font-family: 'HT Rakik', 'Lama Sans', sans-serif; font-size: calc(var(--u) * 44); font-variation-settings: 'wght' 740; text-align: center; }
.bracket-v11__hint { margin: 0; color: #eefffa9c; font-family: 'Lama Sans', sans-serif; font-size: calc(var(--u) * 16); text-align: center; }
.bracket-v11__rounds { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: calc(var(--u) * 34); direction: rtl; align-items: stretch; }
.hybrid-english .bracket-v11__rounds { direction: ltr; }
.bracket-v11__rounds[data-round-count="2"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bracket-v11__rounds[data-round-count="1"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.bracket-round { display: flex; flex-direction: column; min-height: 0; }
.bracket-round h4 { margin: 0 0 calc(var(--u) * 14); color: #edcb81; font-family: 'Lama Sans', sans-serif; font-size: calc(var(--u) * 17); font-weight: 700; letter-spacing: .4px; text-align: center; }
/* flex:1 (not height:100%) — a column with the third-place block must not
   overflow the section box (batch-12 sweep: the record sat on TBD). */
.bracket-round__slots { display: flex; flex: 1; flex-direction: column; justify-content: space-around; gap: calc(var(--u) * 18); min-height: 0; }
.bracket-round--champion { display: flex; flex-direction: column; }
.bracket-slot { display: flex; flex-direction: column; gap: calc(var(--u) * 6); padding: calc(var(--u) * 10); border: 1px solid #edcb812e; background: #081008d9; }
.bracket-slot.is-decided { border-color: #edcb8160; }
.bracket-team { display: flex; align-items: center; gap: calc(var(--u) * 10); padding: calc(var(--u) * 8) calc(var(--u) * 10); border: 1px solid transparent; background: #0d1c12; color: #eefffa; font-family: 'Lama Sans', sans-serif; font-size: calc(var(--u) * 16.5); text-align: start; cursor: default; }
.bracket-team.is-pickable { cursor: pointer; transition: border-color .15s, background-color .15s; }
.bracket-team.is-pickable:hover { border-color: #edcb8180; }
.bracket-team.is-winner { background: #e5c178; color: #10150c; font-weight: 700; }
.bracket-team img { width: calc(var(--u) * 30); height: calc(var(--u) * 34); object-fit: contain; flex: none; }
.bracket-team__blank { width: calc(var(--u) * 30); height: calc(var(--u) * 34); flex: none; background: #16261b; clip-path: polygon(50% 0, 93% 22%, 100% 62%, 50% 100%, 0 62%, 7% 22%); }
.bracket-team span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bracket-team__tbd { color: #eefffa66; }
.bracket-score { font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: calc(var(--u) * 19); }
.bracket-score--guess { opacity: .85; }
/* The score row is height-reserved (see bracketSlotMarkup): an empty reserved
   row and the filled button row are the same height, so picking a team never
   changes the slot height and the column never jumps. */
.bracket-scores { display: flex; flex-wrap: wrap; justify-content: center; gap: calc(var(--u) * 8); min-height: calc(var(--u) * 32); }
.bracket-scores.is-reserved { pointer-events: none; }
.bracket-scores button { padding: calc(var(--u) * 5) calc(var(--u) * 14); border: 1px solid #edcb81; background: transparent; color: #edcb81; font-family: 'Lama Sans Condensed', Arial, sans-serif; font-size: calc(var(--u) * 16); cursor: pointer; }
.bracket-scores button:hover { background: #e5c178; color: #10150c; }
.bracket-champion { display: flex; flex: 1; flex-direction: column; align-items: center; justify-content: center; gap: calc(var(--u) * 14); border: 1px dashed #edcb8155; background: #08100880; padding: calc(var(--u) * 22); }
.bracket-champion.is-set { border-style: solid; border-color: #e5c178; }
.bracket-champion img { width: calc(var(--u) * 86); height: calc(var(--u) * 98); object-fit: contain; }
.bracket-champion strong { color: #e5c178; font-family: 'HT Rakik', 'Lama Sans', sans-serif; font-size: calc(var(--u) * 26); font-variation-settings: 'wght' 740; text-align: center; }
.bracket-v11__actions { display: flex; justify-content: center; gap: calc(var(--u) * 18); min-height: calc(var(--u) * 8); }
.bracket-share { display: inline-flex; align-items: center; gap: 10px; padding: calc(var(--u) * 13) calc(var(--u) * 40); border: 1px solid var(--figma-gold, #edcb81); background: transparent; color: var(--figma-gold, #edcb81); font-family: 'HT Rakik', 'Lama Sans', sans-serif; font-size: calc(var(--u) * 21); font-variation-settings: 'wght' 720; cursor: pointer; transition: background-color .2s, color .2s; }
.bracket-share:hover { background: var(--figma-gold, #edcb81); color: #0c120a; }
.bracket-share b { font-family: Arial, sans-serif; font-weight: 400; }
.bracket-reset { border: none; background: transparent; color: #eefffa8c; font-family: 'Lama Sans', sans-serif; font-size: calc(var(--u) * 14.5); text-decoration: underline; cursor: pointer; }
.bracket-reset:hover { color: #eefffa; }

/* Mobile bracket: stacked rounds in the page flow. */
.bracket-v11--mobile .bracket-v11__title { font-size: 24px; }
.bracket-v11--mobile .bracket-v11__hint { font-size: 13.5px; }
.bracket-v11--mobile .bracket-v11__rounds { grid-template-columns: 1fr; gap: 22px; }
.bracket-v11--mobile .bracket-team { font-size: 15px; padding: 9px 10px; }
.bracket-v11--mobile .bracket-team img, .bracket-v11--mobile .bracket-team__blank { width: 26px; height: 30px; }
.bracket-v11--mobile .bracket-scores button { font-size: 14px; padding: 5px 12px; }
.bracket-v11--mobile .bracket-champion img { width: 64px; height: 74px; }
.bracket-v11--mobile .bracket-champion strong { font-size: 20px; }
.bracket-v11--mobile .bracket-share { font-size: 17px; padding: 11px 28px; }

/* Batch-12 item 10: the third-place match sits under the grand final. */
.bracket-third { margin-top: calc(var(--u) * 26); }
.bracket-third h4 { margin: 0 0 calc(var(--u) * 10); color: #edcb81b0; font-family: 'Lama Sans', sans-serif; font-size: calc(var(--u) * 14); font-weight: 700; text-align: center; }
.bracket-v11--mobile .bracket-third h4 { font-size: 13px; }

/* Batch-12 items 3+13: the ENGLISH story title has no kashida trick — both
   lines render fully, right-aligned beside the badge, never behind it. */
.hybrid-english [data-lp-page="home"] .home-story-title { align-items: flex-end !important; }
.hybrid-english [data-lp-page="home"] .lp-d .home-story-title .home-story-title__lead { align-self: flex-end !important; margin-inline: 0 calc(var(--u) * 40) !important; font-size: calc(var(--u) * 84) !important; text-align: right; }
.hybrid-english [data-lp-page="home"] .lp-d .home-story-title .home-story-title__word { transform: none !important; padding-inline: 0 calc(var(--u) * 40) !important; letter-spacing: 0 !important; font-size: calc(var(--u) * 150) !important; text-align: right; }
.hybrid-english [data-lp-page="home"] .lp-m .home-story-title .home-story-title__lead { align-self: flex-end !important; margin-inline: 0 calc(var(--u) * 16) !important; font-size: calc(var(--u) * 26) !important; text-align: right; }
.hybrid-english [data-lp-page="home"] .lp-m .home-story-title .home-story-title__word { transform: none !important; padding-inline: 0 calc(var(--u) * 16) !important; font-size: calc(var(--u) * 44) !important; text-align: right; }

/* Batch-12 sweep: the English mobile hero title lines reached the quote —
   the quote steps down clear of DEFENDERS OF THE TITLE. Batch-18.1: the
   shift moves the whole quote BOX (text + closing mark together), so the
   mark stays under the last line whatever the admin text length. */
.hybrid-english [data-lp-page="home"] .lp-m .home-hero-quote-box { transform: translateY(calc(var(--u) * 48)) !important; }

/* Fan-art placeholder slot: branded frame until the admin uploads the work. */
.fan-art-card__empty { display: flex; width: 100%; aspect-ratio: 1 / 1; align-items: center; justify-content: center; background: #0c1810; box-shadow: 0 22px 48px #00000073; }
.fan-art-card__empty img { width: 34%; height: auto; opacity: .22; filter: grayscale(.2); }
.fan-art-card--placeholder figcaption strong { color: #10150c8c; }

/* Batch-13 item 4: the ENGLISH team title is two Lama Sans ExtraBold
   Condensed Italic lines on both layouts. */
.hybrid-english [data-lp-page="home"] .home-team-title.home-team-title--en-stack {
    font-family: 'Lama Sans Condensed', 'Arial Narrow', sans-serif !important;
    font-style: italic !important;
    font-weight: 800 !important;
    font-variation-settings: normal !important;
    font-feature-settings: normal !important;
    letter-spacing: .5px;
    text-transform: uppercase;
    white-space: normal !important;
    text-align: right;
}
.hybrid-english [data-lp-page="home"] .lp-d .home-team-title.home-team-title--en-stack {
    font-size: calc(var(--u) * 88) !important;
    line-height: 1.04 !important;
    inline-size: calc(var(--u) * 600);
    transform: translate(-100%, calc(var(--u) * -46)) !important;
}
.hybrid-english [data-lp-page="home"] .lp-m .home-team-title.home-team-title--en-stack {
    font-size: calc(var(--u) * 30) !important;
    line-height: 1.08 !important;
    inline-size: calc(var(--u) * 220);
}

/* Batch-13 item 5: THE GREEN and LEGION open on the same left edge. */
.hybrid-english [data-lp-page="fan-zone"] .fan-desktop-hero-title,
.hybrid-english [data-lp-page="fan-zone"] .fan-desktop-hero-title * {
    text-align: left !important;
    text-align-last: left !important;
}
.hybrid-english [data-lp-page="fan-zone"] .fan-desktop-hero-title > * { display: block; margin-inline-start: 0 !important; transform: none !important; }

/* Current edition's playoffs placeholder note. */
.history-playoffs-upcoming-note { margin: 0 auto; max-width: calc(var(--u) * 760); padding: calc(var(--u) * 22); border: 1px dashed #edcb8150; background: #08100880; color: #eefffaa8; font-family: 'Lama Sans', sans-serif; font-size: calc(var(--u) * 17); text-align: center; }

/* Batch-13 item 7: the English standings table mirrors to the LEFT while
   the title/description hold the right — a true mirror of the Arabic. */
.hybrid-english [data-lp-page^="history-"] .standings-zone { left: calc(var(--u) * (var(--x, 0) - 1020)) !important; }

/* Batch-13 item 10: the ENGLISH record row is a full mirror — date on the
   left, then stage, opponent (badge then name), score, Saudi (badge then
   name), W on the right; clean spacing, no glued badges. */
@media (min-width: 1024px) {
    .hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p { transform: none !important; text-align: left !important; }
    .hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(1) { --x:120 !important; }
    .hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(2) { --x:430 !important; }
    .hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(3) { --x:1225 !important; max-width: calc(var(--u) * 230); overflow: hidden; text-overflow: ellipsis; white-space: nowrap !important; }
    .hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(4) { --x:1030 !important; }
    .hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(5) { --x:815 !important; max-width: calc(var(--u) * 205); overflow: hidden; text-overflow: ellipsis; white-space: nowrap !important; }
    .hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(7) { --x:1845 !important; }
    .hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] .record-badge--opp { left: calc(var(--u) * 752); }
    .hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] .record-badge--saudi { left: calc(var(--u) * 1148); }
}

/* ============================================================
   Batch-13.1 — production visual sweep fixes
   ============================================================ */
/* The floating 50-unit «×» sparkles read as stray marks inside content
   bands (matches record, year heroes, the fan-zone hero) — hidden site-wide;
   the small 15-unit divider pairs stay. */
.lp-d img[data-asset^="sparkle"][style*="--w: 50"],
.lp-d img[data-asset^="sparkle"][style*="--w:50"],
.lp-d img[src*="sparkle"][style*="--w: 50"],
.lp-d img[src*="sparkle"][style*="--w:50"] { display: none !important; }

/* English story title: «THE STORY OF THE» must stay readable next to the 3D
   badge. Desktop: the lead wraps into two right-aligned lines inside the free
   column right of the badge. Mobile: the badge fills the band, so the whole
   title moves ABOVE it as a centered heading. */
.hybrid-english [data-lp-page="home"] .lp-d .home-story-title .home-story-title__lead {
    font-size: calc(var(--u) * 60) !important;
    white-space: normal !important;
    inline-size: calc(var(--u) * 400);
    line-height: 1.05;
    text-align: right;
}
.hybrid-english [data-lp-page="home"] .lp-m .home-story-title {
    align-items: center !important;
    transform: translateY(calc(var(--u) * -185));
}
.hybrid-english [data-lp-page="home"] .lp-m .home-story-title .home-story-title__lead {
    font-size: calc(var(--u) * 22) !important;
    align-self: center !important;
    margin-inline: 0 !important;
}
.hybrid-english [data-lp-page="home"] .lp-m .home-story-title .home-story-title__word {
    padding-inline: 0 !important;
    text-align: center;
}

/* English mobile hero CTA: THE GREEN'S SHOWDOWNS gets the width it needs
   instead of an ellipsis. */
.hybrid-english .mobile-match-center-button { width: auto; min-width: 145.152px; padding-inline: 8px; font-size: 12px; }

/* The mobile community title (الأخضر / LEGION) sits over the jersey photo —
   it needs the gold identity weight to be legible at all. */
.home-mobile-community-title { z-index: 6; }
.home-mobile-community-title, .home-mobile-community-title * {
    color: var(--figma-gold, #e5c178) !important;
    font-family: 'HT Rakik', 'Lama Sans', sans-serif !important;
    font-size: calc(var(--u) * 30) !important;
    font-variation-settings: 'wght' 740;
    line-height: 1.1;
    text-shadow: 0 1px 14px #05130a99;
}
.hybrid-english .home-mobile-community-title, .hybrid-english .home-mobile-community-title * {
    font-family: 'Lama Sans Condensed', 'Arial Narrow', sans-serif !important;
    font-style: italic;
    font-weight: 800;
    font-variation-settings: normal;
    letter-spacing: .5px;
}

/* ============================================================
   Batch-14 — mobile story + community, standings, LEGION
   ============================================================ */
/* Item 1: on mobile the badge fills the band, so the Arabic story title
   lifts above it the way the English one does — «الأخضر» fully readable,
   the kashida tail clipping off the left edge. */
html:not(.hybrid-english) [data-lp-page="home"] .lp-m .home-story-title {
    transform: translateY(calc(var(--u) * -140));
}

/* Item 2: the mobile community block regroups — the identity pair rises
   onto the jersey, the body sits directly under it, and the CTA moves to
   the opposite side where the body used to be. */
html:not(.hybrid-english) [data-lp-page="home"] .lp-m .home-mobile-community-eyebrow,
html:not(.hybrid-english) [data-lp-page="home"] .lp-m .home-mobile-community-title {
    transform: translateY(calc(var(--u) * -140));
}
html:not(.hybrid-english) [data-lp-page="home"] .lp-m .home-mobile-community-copy {
    transform: translate(calc(var(--u) * 142), calc(var(--u) * -112));
    text-align: right !important;
}
html:not(.hybrid-english) [data-lp-page="home"] .lp-m .home-mobile-community-cta {
    transform: translateY(calc(var(--u) * -45));
}

/* Item 5: LEGION opens on the same left edge as THE GREEN. */
.hybrid-english [data-lp-page="home"] .lp-d .home-desktop-community-title {
    transform: translateX(calc(var(--u) * -135));
}

/* Item 7: the Arabic standings description sits a clear step under the
   «الترتيب» glyphs and closes on the same right edge. */
html:not(.hybrid-english) [data-lp-page^="history-"] .lp-d .history-detail-standings-copy {
    /* Batch-15: the description's RIGHT edge closes exactly on the last
       glyph of «الترتيب» (615u). Batch-19: the old 640u box started 25u
       OFF-SCREEN left and clipped long lines (2019) — 545u keeps the same
       right edge with the whole text on screen. */
    width: calc(var(--u) * 545) !important;
    transform: translate(calc(var(--u) * -110), calc(var(--u) * 40));
    text-align: right !important;
}

/* Batch-14 item 6: the state artwork's two language layers — each language
   sees only its own (gold Arabic / white English), no more overlap. */
.match-state-stack .match-state-art__layer[data-state-lang="en"] { display: none !important; }
.hybrid-english .match-state-stack .match-state-art__layer[data-state-lang="ar"] { display: none !important; }
.hybrid-english .match-state-stack .match-state-art__layer[data-state-lang="en"] { display: block !important; }

/* ============================================================
   Batch-15 — desktop story/hero alignment, fan-art, wall
   ============================================================ */
/* EN story: the wrapped lead lines share ONE left edge, GREEN steps down
   clear of THE, and the CTA drops below the closing quote mark. */
.hybrid-english [data-lp-page="home"] .lp-d .home-story-title .home-story-title__lead { text-align: left; }
.hybrid-english [data-lp-page="home"] .lp-d .home-story-title .home-story-title__word { margin-top: calc(var(--u) * 16); }
.hybrid-english [data-lp-page="home"] .lp-d a.home-story-cta { transform: translateY(calc(var(--u) * 30)); }

/* --- Batch-15 mobile bands: stacked identity → body → CTA, off the edges --- */
/* EN story: wrapped lead lines share one LEFT edge; GREEN steps clear of
   THE; the CTA drops below the closing quote mark. */
.hybrid-english [data-lp-page="home"] .lp-m .home-story-title .home-story-title__lead { text-align: left !important; align-self: center; }
.hybrid-english [data-lp-page="home"] .lp-m .home-story-title .home-story-title__word { margin-top: calc(var(--u) * 10); }
[data-lp-page="home"] .lp-m a.home-story-cta { transform: translateY(calc(var(--u) * 26)); }

/* Community band: the CTA sits UNDER the body in both languages. */
.hybrid-english [data-lp-page="home"] .home-mobile-community-cta {
    top: calc(var(--u) * 3075) !important;
    left: calc(var(--u) * 33) !important;
}
html:not(.hybrid-english) [data-lp-page="home"] .lp-m .home-mobile-community-cta {
    transform: translate(calc(var(--u) * 222), calc(var(--u) * -111)) !important;
}

/* EN media band: MEDIA + KIT high on the left, body under them, CTA under
   the body — everything holding a clear left margin. */
.hybrid-english [data-lp-page="home"] .home-mobile-media-eyebrow {
    top: calc(var(--u) * 3395) !important;
    left: calc(var(--u) * 48) !important;
    transform: none !important;
    text-align: left !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-media-title {
    top: calc(var(--u) * 3423) !important;
    left: calc(var(--u) * 48) !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-media-caption {
    top: calc(var(--u) * 3512) !important;
    left: calc(var(--u) * 48) !important;
    width: calc(var(--u) * 300) !important;
    text-align: left !important;
    text-align-last: left !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-media-copy {
    top: calc(var(--u) * 3572) !important;
    left: calc(var(--u) * 48) !important;
    width: calc(var(--u) * 300) !important;
    text-align: left !important;
    text-align-last: left !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-media-cta {
    top: calc(var(--u) * 3636) !important;
    left: calc(var(--u) * 48) !important;
}

/* EN match band: MATCH + CENTER rise and close on one RIGHT edge, body
   beneath them, CTA beneath the body. */
.hybrid-english [data-lp-page="home"] .lp-m p[style*="--y: 2580"],
.hybrid-english [data-lp-page="home"] .lp-m p[style*="--y:2580"] {
    top: calc(var(--u) * 2490) !important;
    left: calc(var(--u) * 366) !important;
}
.hybrid-english [data-lp-page="home"] .lp-m div[style*="--y:2599"],
.hybrid-english [data-lp-page="home"] .lp-m div[style*="--y: 2599"] {
    top: calc(var(--u) * 2516) !important;
}
.hybrid-english [data-lp-page="home"] .lp-m p[style*="--y: 2667"],
.hybrid-english [data-lp-page="home"] .lp-m p[style*="--y:2667"] {
    top: calc(var(--u) * 2600) !important;
    left: calc(var(--u) * 176) !important;
    text-align: right !important;
    text-align-last: right !important;
}

/* Match-band CTA under its body (EN mobile). */
.hybrid-english [data-lp-page="home"] .lp-m a.lp-btn[href$="/matches"] {
    top: calc(var(--u) * 2672) !important;
    left: calc(var(--u) * 229) !important;
}

/* --- Batch-15 desktop: the crowd wall and fan-art own their declared
   width — without it the grid sizes to content and glues itself to the
   screen edge (the wall) or packs left (the art row). --- */
/* Desktop only — on mobile these classes ride the responsive sections and
   a 1620-unit width is four screens wide (batch-16 item 4). */
.lp-d .fan-wall-v11 { width: calc(var(--u) * 1620); }
.lp-d .fan-art-v11 { width: calc(var(--u) * 1654); }

/* Fan-art: a hairline divider separates it from the crowd wall above, and
   the heading keeps clear air before the frames. */
.fan-art-v11::before {
    content: '';
    position: absolute;
    top: calc(var(--u) * -52);
    left: calc(var(--u) * 40);
    right: calc(var(--u) * 40);
    height: 1px;
    background: #edcb813d;
}
.fan-art-v11__title { margin-bottom: calc(var(--u) * 58); }
.fan-art-v11 .fan-art-card--2 { transform: rotate(1.8deg) translateY(calc(var(--u) * -8)); }
.hybrid-english [data-lp-page="home"] .lp-m div[style*="--y:2599"],
.hybrid-english [data-lp-page="home"] .lp-m div[style*="--y: 2599"] {
    left: calc(var(--u) * 366) !important;
    transform: translateX(-100%) !important;
}
.hybrid-english [data-lp-page="home"] .lp-m div[style*="--y:2599"] > p,
.hybrid-english [data-lp-page="home"] .lp-m div[style*="--y: 2599"] > p {
    width: 100% !important;
    transform: none !important;
    text-align: right !important;
}
.hybrid-english [data-lp-page="home"] .home-mobile-media-eyebrow,
.hybrid-english [data-lp-page="home"] .home-mobile-media-eyebrow * {
    width: auto !important;
    text-align: left !important;
    text-align-last: left !important;
    transform: none !important;
    letter-spacing: .12em;
}

/* Batch-16 item 1 / owner review: EN Green Legion reads THE GREEN → LEGION →
   body (with quotes) → CTA on one left edge. The whole cluster is nudged down
   and right a touch, the body sits a clear step below the title, and the CTA a
   clear step below the body — all still inside the photo box. */
.hybrid-english [data-lp-page="home"] .lp-d .home-desktop-community-title {
    transform: translate(calc(var(--u) * -135), calc(var(--u) * 14));
}
.hybrid-english [data-lp-page="home"] .lp-d div[style*="--y:5243"],
.hybrid-english [data-lp-page="home"] .lp-d div[style*="--y: 5243"] {
    top: calc(var(--u) * 5060) !important;
    left: calc(var(--u) * 170) !important;
    width: calc(var(--u) * 300) !important;
}
.hybrid-english [data-lp-page="home"] .lp-d div[style*="--y:5243"] p,
.hybrid-english [data-lp-page="home"] .lp-d div[style*="--y: 5243"] p {
    text-align: left !important;
    text-align-last: left !important;
    width: 100% !important;
}
.hybrid-english [data-lp-page="home"] .lp-d a.lp-btn[href$="/fan-zone"] {
    top: calc(var(--u) * 5215) !important;
    left: calc(var(--u) * 170) !important;
    transform: none !important;
}

/* Batch-16 item 3: three social icons need more clearance than the strip
   reserved for two — the copyright line stops before them (both languages),
   and the desktop contact email aligns with its own column. */
.approved-mobile-footer .footer-bottom { right: calc(var(--u) * 104); }
.hybrid-english .approved-mobile-footer .footer-bottom { right: calc(var(--u) * 14); left: calc(var(--u) * 104); }
html:not(.hybrid-english) .figma-footer .footer-contact { text-align: right; }
html:not(.hybrid-english) .figma-footer .footer-contact a { text-align: right; }
.hybrid-english .figma-footer .footer-contact, .hybrid-english .figma-footer .footer-contact a { text-align: left; }
/* English footer columns read left-to-right: the social icons flow from the
   left so they sit directly under the FOLLOW THE TEAM heading, and the link and
   heading text align left. The brand column keeps its own right alignment. */
.hybrid-english .figma-footer .footer-socials,
.hybrid-english .figma-footer .footer-links { direction: ltr; text-align: left; }
.hybrid-english .figma-footer .footer-socials h2,
.hybrid-english .figma-footer .footer-links h2,
.hybrid-english .figma-footer .footer-contact h2 { text-align: left; }
.hybrid-english .figma-footer .footer-socials > div { justify-content: flex-start; }

/* Batch-16 review: THE GREEN'S SHOWDOWNS needs a wider hero button than the
   Arabic label's 187px — the arrows were sitting on the text. The box is
   SHARED across languages (the parity contract compares it 1:1); the flow
   layout keeps it centered, and only the English type size differs. */
.approved-match-desktop-scale .figma-button--hero,
.approved-match-desktop-scale .home-match-flow .figma-button--hero {
    width: 280px !important;
}
.hybrid-english .approved-match-desktop-scale .figma-button--hero { font-size: 15px; padding-inline: 30px; }

/* External-link category cards render as anchors — same look as the
   button variant. */
a.media-category-card { text-decoration: none; color: inherit; display: block; }

/* Folder monogram: the folder-name initial as the card's face when no
   icon was uploaded. */
.media-folder-letter {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    color: var(--figma-gold, #e5c178);
    font-family: 'HT Rakik', 'Lama Sans Condensed', sans-serif;
    font-size: calc(var(--u) * 52);
    font-variation-settings: 'wght' 740;
    font-feature-settings: normal; /* no swash flourishes on the monogram */
    letter-spacing: .02em;
    line-height: 1;
}
.hybrid-english .media-folder-letter { font-family: 'Lama Sans Condensed', Arial, sans-serif; font-weight: 800; }

/* Batch-18 item 3: the year's two admin thumbnails (16:9) — desktop shows
   one under the standings description (mirrored for English) and one under
   the «المباريات والنتائج» heading; phones show them inside the section. */
[data-lp-page^="history-"] .lp-d .history-media-thumb {
    position: absolute;
    display: block;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: calc(var(--u) * 14);
    border: 1px solid #edcb8142;
    background: #081008;
    z-index: 18;
}
html:not(.hybrid-english) [data-lp-page^="history-"] .lp-d .history-standings-thumb {
    left: calc(var(--u) * 55);
    top: calc(var(--u) * 3745);
    width: calc(var(--u) * 760);
}
.hybrid-english [data-lp-page^="history-"] .lp-d .history-standings-thumb {
    left: calc(var(--u) * 1100);
    top: calc(var(--u) * 3540);
    width: calc(var(--u) * 760);
}
/* The matches thumb closes on the heading's visual right edge; the playoffs
   band and the roster step down to clear it only when the thumb exists. */
[data-lp-page^="history-"] .lp-d .history-matches-thumb {
    /* Match-row cards end at 966u — the thumb starts clear of them. */
    left: calc(var(--u) * 990);
    top: calc(var(--u) * 4560);
    width: calc(var(--u) * 730);
}
[data-lp-page^="history-"] .lp-d:has(.history-matches-thumb) .history-playoffs-desktop {
    top: calc(var(--u) * 5040);
}
[data-lp-page^="history-"] .lp-d:has(.history-matches-thumb) .history-roster-desktop {
    top: calc(var(--u) * 5400);
}
.responsive-history-thumb {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: calc(var(--u) * 5);
    border: 1px solid #edcb8142;
    background: #081008;
    margin: calc(var(--u) * 14) 0 calc(var(--u) * 12);
    box-sizing: border-box;
}

/* With a standings thumbnail present, the «no verified table» note narrows
   into the free lane on the thumb's other side (AR thumb ends at 815u, the
   EN thumb starts at 1100u). */
html:not(.hybrid-english) [data-lp-page^="history-"] .lp-d:has(.history-standings-thumb) .history-desktop-empty[data-history-empty="standings"] {
    left: calc(var(--u) * 880);
    width: calc(var(--u) * 420);
}
.hybrid-english [data-lp-page^="history-"] .lp-d:has(.history-standings-thumb) .history-desktop-empty[data-history-empty="standings"] {
    left: calc(var(--u) * 320);
    width: calc(var(--u) * 420);
}

/* ============================================================
   Batch-19 — final polish
   ============================================================ */
/* The mobile hero description shift (--hero-shift, set by
   settleMobileHeroQuote) moves the inline --y sections — every CSS-pinned
   English coordinate below the hero rides the same variable, and the page
   grows with it. */
.hybrid-english [data-lp-page="home"] .lp-m p[style*="--y: 2580"],
.hybrid-english [data-lp-page="home"] .lp-m p[style*="--y:2580"] { top: calc(var(--u) * 2490 + var(--u) * var(--hero-shift, 0)) !important; }
.hybrid-english [data-lp-page="home"] .lp-m div[style*="--y:2599"],
.hybrid-english [data-lp-page="home"] .lp-m div[style*="--y: 2599"] { top: calc(var(--u) * 2516 + var(--u) * var(--hero-shift, 0)) !important; }
.hybrid-english [data-lp-page="home"] .lp-m p[style*="--y: 2667"],
.hybrid-english [data-lp-page="home"] .lp-m p[style*="--y:2667"] { top: calc(var(--u) * 2600 + var(--u) * var(--hero-shift, 0)) !important; }
.hybrid-english [data-lp-page="home"] .lp-m a.lp-btn[href$="/matches"] { top: calc(var(--u) * 2672 + var(--u) * var(--hero-shift, 0)) !important; }
.hybrid-english [data-lp-page="home"] .home-mobile-community-eyebrow { top: calc(var(--u) * 2930 + var(--u) * var(--hero-shift, 0)) !important; }
.hybrid-english [data-lp-page="home"] .home-mobile-community-title { top: calc(var(--u) * 2950 + var(--u) * var(--hero-shift, 0)) !important; }
.hybrid-english [data-lp-page="home"] .home-mobile-community-copy { top: calc(var(--u) * 2998 + var(--u) * var(--hero-shift, 0)) !important; }
.hybrid-english [data-lp-page="home"] .home-mobile-community-cta { top: calc(var(--u) * 3075 + var(--u) * var(--hero-shift, 0)) !important; }
.hybrid-english [data-lp-page="home"] .home-mobile-media-eyebrow { top: calc(var(--u) * 3395 + var(--u) * var(--hero-shift, 0)) !important; }
.hybrid-english [data-lp-page="home"] .home-mobile-media-title { top: calc(var(--u) * 3423 + var(--u) * var(--hero-shift, 0)) !important; }
.hybrid-english [data-lp-page="home"] .home-mobile-media-caption { top: calc(var(--u) * 3512 + var(--u) * var(--hero-shift, 0)) !important; }
.hybrid-english [data-lp-page="home"] .home-mobile-media-copy { top: calc(var(--u) * 3572 + var(--u) * var(--hero-shift, 0)) !important; }
.hybrid-english [data-lp-page="home"] .home-mobile-media-cta { top: calc(var(--u) * 3636 + var(--u) * var(--hero-shift, 0)) !important; }
@media (max-width: 767.98px) {
    [data-lp-page="home"] .lp-m {
        height: calc(var(--u) * 3810 + var(--u) * var(--hero-shift, 0)) !important;
        min-height: calc(var(--u) * 3810 + var(--u) * var(--hero-shift, 0)) !important;
    }
}

/* «قصة الأخضر» EN mobile: the title sits BEHIND the 3D badge — lower,
   right-aligned and readable past the badge's right edge (the badge paints
   above it), instead of floating above the band. */
.hybrid-english [data-lp-page="home"] .lp-m .home-story-title {
    align-items: flex-end !important;
    transform: translateY(calc(var(--u) * 96)) !important;
}
.hybrid-english [data-lp-page="home"] .lp-m .home-story-title .home-story-title__lead {
    align-self: flex-end !important;
    margin-inline: 0 calc(var(--u) * 6) !important;
    font-size: calc(var(--u) * 24) !important;
    text-align: right !important;
}
.hybrid-english [data-lp-page="home"] .lp-m .home-story-title .home-story-title__word {
    padding-inline: 0 calc(var(--u) * 6) !important;
    font-size: calc(var(--u) * 50) !important;
    text-align: right !important;
}

/* «حاملو الراية» desktop: a step off the right screen edge. */
html:not(.hybrid-english) [data-lp-page="home"] .lp-d .home-team-title:not(.home-team-title--one-line) {
    transform: translate(calc(-100% - (var(--u) * 70)), calc(var(--u) * -80)) !important;
}

/* MATCH / CENTER desktop EN: both lines close on one right edge (1755u,
   MATCH's tx-end anchor). */
.hybrid-english [data-lp-page="home"] .lp-d div[style*="--y:3825"],
.hybrid-english [data-lp-page="home"] .lp-d div[style*="--y: 3825"] { left: calc(var(--u) * 1755) !important; }
.hybrid-english [data-lp-page="home"] .lp-d div[style*="--y:3825"] p,
.hybrid-english [data-lp-page="home"] .lp-d div[style*="--y: 3825"] p { transform: translateX(-100%) !important; }

/* The match band's EN mobile layout, re-anchored on data-base-y (the
   original template row) so it survives the hero shift rewriting --y. */
.hybrid-english [data-lp-page="home"] .lp-m p[data-base-y="2580"] {
    top: calc(var(--u) * 2490 + var(--u) * var(--hero-shift, 0)) !important;
    left: calc(var(--u) * 366) !important;
}
.hybrid-english [data-lp-page="home"] .lp-m div[data-base-y="2599"] {
    top: calc(var(--u) * 2516 + var(--u) * var(--hero-shift, 0)) !important;
    left: calc(var(--u) * 366) !important;
    transform: translateX(-100%) !important;
}
.hybrid-english [data-lp-page="home"] .lp-m div[data-base-y="2599"] > p {
    width: 100% !important;
    transform: none !important;
    text-align: right !important;
}
.hybrid-english [data-lp-page="home"] .lp-m p[data-base-y="2667"] {
    top: calc(var(--u) * 2600 + var(--u) * var(--hero-shift, 0)) !important;
    left: calc(var(--u) * 176) !important;
    text-align: right !important;
    text-align-last: right !important;
}

/* Batch-19: the standings RECORD column is gone from every year — the
   «السجل» header, each row's record cell, and the divider line after it
   (x928). The remaining lines close the two-column table cleanly. */
[data-lp-page^="history-"] .lp-d p[style*="--x:1205"][style*="--y:3484"],
[data-lp-page^="history-"] .lp-d p[style*="--x: 1205"][style*="--y: 3484"],
[data-lp-page^="history-"] .lp-d p[style*="--x:1205"][style*="--y:3573"],
[data-lp-page^="history-"] .lp-d p[style*="--x: 1205"][style*="--y: 3573"],
[data-lp-page^="history-"] .lp-d p[style*="--x:1205"][style*="--y:3678"],
[data-lp-page^="history-"] .lp-d p[style*="--x: 1205"][style*="--y: 3678"],
[data-lp-page^="history-"] .lp-d p[style*="--x:1205"][style*="--y:3783"],
[data-lp-page^="history-"] .lp-d p[style*="--x: 1205"][style*="--y: 3783"],
[data-lp-page^="history-"] .lp-d div[style*="--x:928"][style*="--y:3469"],
[data-lp-page^="history-"] .lp-d div[style*="--x: 928"][style*="--y: 3469"] {
    display: none !important;
}
.responsive-standings [role="row"] > b { display: none !important; }

/* Bot trap: present in the DOM, impossible for a person to see or reach. */
.fan-form-trap {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Year-to-year navigation on the year pages: the older edition on the left,
   the newer on the right, sized like the rest of the page's small type. */
.year-jump { display: flex; align-items: center; justify-content: space-between; }
.year-jump__spacer { display: block; }
.year-jump__link {
    display: inline-flex;
    align-items: center;
    gap: calc(var(--u) * 6);
    color: var(--figma-gold, #e5c178);
    font-family: 'Lama Sans Condensed', 'Arial Narrow', sans-serif;
    font-style: italic;
    text-decoration: none;
    transition: color .25s, transform .25s;
}
.year-jump__link:hover { color: #f5dfae; transform: translateY(calc(var(--u) * -2)); }
.year-jump__link b { font-weight: 800; }

/* Desktop: pinned across the top of the year page, clear of the crest. */
[data-lp-page^="history-"] .lp-d .year-jump {
    position: absolute;
    z-index: 24;
    top: calc(var(--u) * 250);
    left: calc(var(--u) * 132);
    width: calc(var(--u) * 1656);
}
[data-lp-page^="history-"] .lp-d .year-jump__link { font-size: calc(var(--u) * 30); }

/* Phone: inside the hero, above the edition eyebrow. */
.responsive-mobile-hero .year-jump {
    position: relative;
    z-index: 3;
    margin: 0 0 14px;
    padding: 0 2px;
}
.responsive-mobile-hero .year-jump__link { font-size: 19px; gap: 5px; }

/* ---------- Desktop visual polish (2026-09-09) ---------- */

/* Green Legion (home fan-zone teaser): the photo box had hard top and bottom
   edges that cut a seam into the dark page. A vertical fade mask dissolves the
   top and bottom into the background so the section reads as seamless. */
@media (min-width: 1024px) {
    [data-lp-page="home"] .lp-d .home-legion-photo {
        -webkit-mask-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.35) 15%, #000 34%, #000 66%, rgba(0,0,0,.35) 85%, transparent 100%);
        mask-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.35) 15%, #000 34%, #000 66%, rgba(0,0,0,.35) 85%, transparent 100%);
    }
}

/* Premium «matches & results» panel on the desktop history editions — one
   elegant row per match, grouped by phase, stretching to fill the left column
   beside the photo. Rows flex so any match count fills the height cleanly. */
.history-matches-showcase { display: flex; flex-direction: column; gap: calc(var(--u) * 26); z-index: 4; }
.history-matches-showcase .hm-phase { display: flex; flex-direction: column; gap: calc(var(--u) * 13); flex: 1 1 0; min-height: 0; }
.history-matches-showcase .hm-phase__label { display: inline-flex; align-items: center; gap: calc(var(--u) * 10); align-self: flex-start; color: var(--gold-bright, #edcb81); font-family: 'Lama Sans Condensed', 'Lama Sans', sans-serif; font-size: calc(var(--u) * 22); font-weight: 900; letter-spacing: .08em; }
.history-matches-showcase .hm-phase__label::before { content: ''; width: calc(var(--u) * 26); height: 2px; background: var(--gold-bright, #edcb81); }
.history-matches-showcase .hm-phase__rows { display: flex; flex-direction: column; justify-content: center; gap: calc(var(--u) * 12); flex: 1 1 0; min-height: 0; }
/* Rows flex to fill the column, but a max cap keeps a single match from
   ballooning to full height, and centring keeps 1–2 matches balanced beside
   the photo; 6–9 matches shrink toward the min and still fit. */
.history-matches-showcase .hm-row { position: relative; flex: 1 1 0; min-height: calc(var(--u) * 52); max-height: calc(var(--u) * 176); display: flex; align-items: center; justify-content: space-between; gap: calc(var(--u) * 16); padding: calc(var(--u) * 10) calc(var(--u) * 28); border: 1px solid rgba(237, 203, 129, .2); border-radius: calc(var(--u) * 12); background: linear-gradient(115deg, rgba(237, 203, 129, .09), rgba(255, 255, 255, .02) 45%, rgba(9, 14, 8, .12)); overflow: hidden; }
.history-matches-showcase .hm-row::before { position: absolute; top: 0; right: 0; bottom: 0; width: calc(var(--u) * 4); background: var(--gold-bright, #edcb81); content: ''; }
.hybrid-english .history-matches-showcase .hm-row::before { right: auto; left: 0; }
.history-matches-showcase .hm-row__side { display: flex; flex: 1 1 0; min-width: 0; align-items: center; gap: calc(var(--u) * 14); }
.history-matches-showcase .hm-row__side--opp { flex-direction: row-reverse; }
.history-matches-showcase .hm-row__flag { width: calc(var(--u) * 46); height: calc(var(--u) * 52); flex: none; object-fit: contain; }
.history-matches-showcase .hm-row__flag--empty { width: calc(var(--u) * 42); height: calc(var(--u) * 48); border: 1px dashed rgba(237, 203, 129, .3); border-radius: calc(var(--u) * 6); }
.history-matches-showcase .hm-row__side b { overflow: hidden; font-family: 'HT Rakik', 'Lama Sans', sans-serif; font-size: calc(var(--u) * 26); font-weight: 700; color: #fff; text-overflow: ellipsis; white-space: nowrap; }
.history-matches-showcase .hm-row__score { display: flex; flex: none; flex-direction: column; align-items: center; gap: calc(var(--u) * 6); }
.history-matches-showcase .hm-row__digits { font-family: 'Lama Sans', sans-serif; font-size: calc(var(--u) * 40); font-weight: 900; line-height: 1; letter-spacing: .06em; color: var(--gold-bright, #edcb81); }
.history-matches-showcase .hm-row__result { padding: calc(var(--u) * 3) calc(var(--u) * 11); border-radius: 999px; font-size: calc(var(--u) * 12); font-weight: 800; letter-spacing: .12em; }
.history-matches-showcase .hm-row__result--win { color: #0b1a0e; background: var(--gold-bright, #edcb81); }
.history-matches-showcase .hm-row__result--loss { color: #ffd9d0; background: rgba(200, 60, 40, .3); }
.history-matches-showcase .hm-row__result--draw { color: #eee; background: rgba(255, 255, 255, .14); }

/* MATCH-CENTER-FIXES:START */
/* ============================================================
   Match Center visual fixes — the finished card's MVP vote and the
   match record. Every selector is scoped to the Match Center: the
   desktop canvas through [data-lp-page="matches"] .lp-d and the mobile
   shell through .responsive-matches-page. Nothing reaches another page.
   ============================================================ */

/* --- A. Desktop finished card: seven readable candidates in one even
   row, first candidate on the reading-start side (right in Arabic,
   left in English), sitting close under the MVP question. --- */
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll {
    top: calc(var(--u) * 452);
    left: calc(var(--u) * 58);
    width: calc(var(--u) * 1563);
}
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll > div[role="radiogroup"],
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll .mvp-final-rows {
    display: grid !important;
    direction: rtl;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: calc(var(--u) * 12);
    justify-content: stretch;
    overflow: visible;
}
html.hybrid-english [data-lp-page="matches"] .lp-d .desktop-database-mvp-poll > div[role="radiogroup"],
html.hybrid-english [data-lp-page="matches"] .lp-d .desktop-database-mvp-poll .mvp-final-rows { direction: ltr; }
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll button[data-mvp-option],
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll .mvp-final-row {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: calc(var(--u) * 6);
    width: auto !important;
    min-width: 0;
    min-height: 0;
    margin: 0;
    padding: calc(var(--u) * 10) calc(var(--u) * 8) !important;
    border: 0;
    border-radius: calc(var(--u) * 12);
    background: none;
    color: #eefffa;
    opacity: 1;
    transform: none;
    transition: transform .22s ease, background-color .22s ease, box-shadow .22s ease, opacity .22s ease;
}
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll button[data-mvp-option] span,
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll .mvp-final-row span {
    display: block;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: inherit;
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    font-size: calc(var(--u) * 32);
    font-style: italic !important;
    font-weight: 900 !important;
    /* The condensed italic caps stand 1.25em tall — a 1.15 line box clipped
       their tops under overflow:hidden. */
    line-height: 1.35;
    letter-spacing: .03em;
    text-transform: uppercase;
}
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll button[data-mvp-option] [data-mvp-percentage],
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll .mvp-final-row b {
    display: block;
    min-width: 0;
    color: var(--figma-gold-soft, #edcb81);
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    font-size: calc(var(--u) * 46);
    font-style: normal !important;
    font-weight: 900 !important;
    line-height: 1;
    text-align: center;
}
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll button[data-mvp-option]:not([disabled]):hover {
    color: var(--figma-gold-soft, #edcb81);
    transform: translateY(calc(var(--u) * -3));
}
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll button[data-mvp-option]:focus-visible {
    box-shadow: inset 0 0 0 1px rgba(237, 203, 129, .6) !important;
}
/* After voting the visitor's own choice is highlighted — a soft gold panel
   with a hairline ring — and the others step back; it is never presented
   as the official winner. */
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll.has-voted button[data-mvp-option]:not(.is-selected) { opacity: .55; }
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll button[data-mvp-option].is-selected,
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll .mvp-final-row.is-winner {
    background: rgba(237, 203, 129, .1) !important;
    box-shadow: inset 0 0 0 1px rgba(237, 203, 129, .6), 0 0 calc(var(--u) * 22) rgba(237, 203, 129, .16) !important;
    color: var(--figma-gold-soft, #edcb81);
    opacity: 1;
    transform: translateY(calc(var(--u) * -4));
}
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll button[data-mvp-option].is-selected span,
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll .mvp-final-row.is-winner span {
    color: var(--figma-gold-soft, #edcb81);
    text-shadow: 0 0 calc(var(--u) * 18) rgba(237, 203, 129, .45);
}
/* Closed ballot: voting disabled, the chips settle and dim. */
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll.is-closed button[data-mvp-option] { cursor: default !important; transform: none; }
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll.is-closed button[data-mvp-option]:not(.is-selected) { opacity: .6; }
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll [data-mvp-feedback] { margin-top: calc(var(--u) * 10); font-size: calc(var(--u) * 18); }
/* Final results (the administrator closed the poll): «رجل المباراة: NAME» /
   «MATCH MVP: NAME» heads the same seven-chip row with the final shares. */
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll.responsive-match-card__mvp-final { top: calc(var(--u) * 392); }
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll .mvp-final-winner {
    margin: 0 0 calc(var(--u) * 16);
    color: var(--figma-gold-soft, #edcb81);
    font-family: 'HT Rakik', 'Lama Sans', sans-serif;
    font-size: calc(var(--u) * 37);
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
}
html.hybrid-english [data-lp-page="matches"] .lp-d .desktop-database-mvp-poll .mvp-final-winner {
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    font-weight: 900 !important;
}
[data-lp-page="matches"] .lp-d .desktop-database-mvp-poll .mvp-final-winner--empty { color: #eefffab3; font-size: calc(var(--u) * 26); font-weight: 400; }

/* --- A. Mobile finished card: an orderly two-column candidate grid (the
   seventh chip centred on its own row) — the page never widens. --- */
/* The boxed panel keeps its border and ground but spans the card's content
   width (the base rule's 18px margins + 20px padding left the grid 221px at
   a 402px viewport). */
.responsive-matches-page .responsive-match-card__mvp-poll { margin: 18px 0 0; padding: 14px 12px 12px; }
.responsive-matches-page .responsive-match-card__mvp-poll h3 { margin: 0 0 12px; }
.responsive-matches-page .responsive-match-card__mvp-poll > div[role="radiogroup"],
.responsive-matches-page .responsive-match-card__mvp-poll .mvp-final-rows {
    display: grid !important;
    direction: rtl;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    justify-content: stretch !important;
    overflow: visible !important;
}
html.hybrid-english .responsive-matches-page .responsive-match-card__mvp-poll > div[role="radiogroup"],
html.hybrid-english .responsive-matches-page .responsive-match-card__mvp-poll .mvp-final-rows { direction: ltr; }
.responsive-matches-page .responsive-match-card__mvp-poll button[data-mvp-option],
.responsive-matches-page .responsive-match-card__mvp-poll .mvp-final-row {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    width: auto !important;
    min-width: 0;
    min-height: 58px;
    margin: 0;
    padding: 8px 6px;
    border: 1px solid #eefffa2e !important;
    border-radius: 10px;
    background: #0c1411 !important;
    color: #eefffa;
    grid-column: auto !important;
    justify-self: stretch !important;
    text-align: center;
    transition: border-color .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.responsive-matches-page .responsive-match-card__mvp-poll button[data-mvp-option]:last-child:nth-child(odd),
.responsive-matches-page .responsive-match-card__mvp-poll .mvp-final-row:last-child:nth-child(odd) {
    grid-column: 1 / -1 !important;
    width: calc(50% - 4px) !important;
    justify-self: center !important;
}
.responsive-matches-page .responsive-match-card__mvp-poll button[data-mvp-option] span,
.responsive-matches-page .responsive-match-card__mvp-poll .mvp-final-row span {
    display: block;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: inherit;
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    font-size: 16px;
    font-style: italic !important;
    font-weight: 900 !important;
    line-height: 1.35;
    letter-spacing: .03em;
    text-transform: uppercase;
}
.responsive-matches-page .responsive-match-card__mvp-poll button[data-mvp-option] [data-mvp-percentage],
.responsive-matches-page .responsive-match-card__mvp-poll .mvp-final-row b {
    display: block !important;
    min-width: 0;
    color: var(--mobile-gold, #edcb81);
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    font-size: 20px;
    font-style: normal !important;
    font-weight: 900 !important;
    line-height: 1;
    text-align: center;
}
.responsive-matches-page .responsive-match-card__mvp-poll button[data-mvp-option]:not([disabled]):hover,
.responsive-matches-page .responsive-match-card__mvp-poll button[data-mvp-option]:focus-visible {
    border-color: #edcb8199 !important;
    color: var(--mobile-gold, #edcb81);
    outline: none;
}
.responsive-matches-page .responsive-match-card__mvp-poll.has-voted button[data-mvp-option]:not(.is-selected) { opacity: .6; }
.responsive-matches-page .responsive-match-card__mvp-poll button[data-mvp-option].is-selected,
.responsive-matches-page .responsive-match-card__mvp-poll .mvp-final-row.is-winner {
    border-color: var(--mobile-gold, #edcb81) !important;
    background: #edcb8114 !important;
    color: var(--mobile-gold, #edcb81);
    box-shadow: 0 0 18px 1px rgba(237, 203, 129, .3), inset 0 0 14px rgba(237, 203, 129, .12);
    text-shadow: 0 0 14px rgba(237, 203, 129, .5);
    opacity: 1;
}
.responsive-matches-page .responsive-match-card__mvp-poll.is-closed button[data-mvp-option] { cursor: default !important; }
.responsive-matches-page .responsive-match-card__mvp-poll.is-closed button[data-mvp-option]:not(.is-selected) { opacity: .6; }
.responsive-matches-page .responsive-match-card__mvp-poll .mvp-final-winner { margin: 0 0 12px; font-size: 16px; }
.responsive-matches-page .responsive-match-card__mvp-poll [data-mvp-feedback] { margin-top: 10px; font-size: 13px; }

/* --- B. Mobile match record: a meta line (date · stage · result), the
   two teams around the score, and the MVP cell beneath — team names wrap
   at word boundaries inside their column instead of shrinking. --- */
.responsive-matches-page .responsive-record-list > div {
    grid-template-columns: minmax(0, 1fr) 46px minmax(0, 1fr);
    grid-template-areas: "meta meta meta" "saudi score opp" "mvp mvp mvp";
    align-items: center;
    gap: 6px 8px;
}
.responsive-matches-page .responsive-record-list > div > .record-row__meta { grid-area: meta; }
.responsive-matches-page .responsive-record-list > div > span:first-of-type { grid-area: saudi; }
.responsive-matches-page .responsive-record-list > div > strong { grid-area: score; }
.responsive-matches-page .responsive-record-list > div > span:last-of-type { grid-area: opp; }
.responsive-matches-page .responsive-record-list .record-row__meta {
    display: flex;
    direction: rtl;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
}
html.hybrid-english .responsive-matches-page .responsive-record-list .record-row__meta { direction: ltr; }
.responsive-matches-page .responsive-record-list .record-row__meta time {
    flex: 0 0 auto;
    color: #eefffa8c;
    font-size: 10px;
    letter-spacing: .04em;
}
.responsive-matches-page .responsive-record-list .record-stage {
    flex: 1 1 auto;
    min-width: 0;
    color: var(--mobile-gold, #edcb81);
    font-size: 11px;
    line-height: 1.25;
    text-align: center;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
}
.responsive-matches-page .responsive-record-list .record-result {
    flex: 0 0 auto;
    padding: 2px 8px;
    border: 1px solid currentColor;
    border-radius: 999px;
    color: var(--mobile-gold, #edcb81);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: .06em;
    text-transform: uppercase;
    white-space: nowrap;
}
html.hybrid-english .responsive-matches-page .responsive-record-list .record-result {
    font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
    font-weight: 900;
}
/* (0,3,3): the mobile nowrap blanket is an :is() list whose most specific
   entry weighs (0,3,1), so a plain class chain could not lift it. */
.responsive-matches-page .responsive-record-list [role="row"] > span > b {
    white-space: normal !important;
    text-wrap: balance !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
    -webkit-hyphens: none !important;
    line-height: 1.2;
}
.responsive-matches-page .responsive-record-list .record-mvp-line {
    grid-area: mvp;
    grid-column: 1 / -1;
    justify-self: center;
    max-width: 100%;
    margin-top: 0;
    font-size: 12px;
}
.responsive-matches-page .responsive-record-list .record-mvp-line--empty { opacity: .55; }

/* --- B. Desktop match record: the MVP and the result are their own cells
   in BOTH languages. Arabic (right-anchored cells, reading right→left):
   date · stage · Saudi · score · opponent · MVP · result. English mirrors
   it left→right; its MVP cell had kept the Arabic anchor (--x:357) beside
   the stage at --x:430 («ZIYADQUARTERFINAL») and its result cell sat at
   --x:1845, past the 1681-unit row. --- */
[data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(2) { max-width: calc(var(--u) * 290); overflow: hidden; text-overflow: ellipsis; white-space: nowrap !important; }
[data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(5) { max-width: calc(var(--u) * 200); overflow: hidden; text-overflow: ellipsis; white-space: nowrap !important; }
[data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(6) {
    --x: 290 !important;
    max-width: calc(var(--u) * 195);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap !important;
    direction: ltr;
    font-family: var(--font-num, 'Lama Sans Condensed', 'Arial Narrow', sans-serif) !important;
    font-style: normal !important;
    font-weight: 700;
    letter-spacing: .02em;
}
[data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(7) { --x: 5 !important; }
html:not(.hybrid-english) [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(7) {
    font-family: var(--font-body, 'HT Rakik', 'Tahoma', sans-serif);
    font-weight: 700;
}
/* --- C. English record (owner, 2026-09-13): no stage/group cell at all —
   the field is removed and the row re-spaced, not hidden with a gap — and
   the result is a one-letter badge (W / L / D) in its own cell. Reading
   left→right: date · opponent (badge, name) · score · Saudi (badge, name)
   · MVP · result. --- */
@media (min-width: 1024px) {
    html.hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(2) { display: none !important; }
    html.hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] .record-badge--opp { left: calc(var(--u) * 400); }
    html.hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(5) { --x: 465 !important; max-width: calc(var(--u) * 250); }
    html.hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(4) { --x: 780 !important; }
    html.hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] .record-badge--saudi { left: calc(var(--u) * 930); }
    html.hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(3) { --x: 995 !important; max-width: calc(var(--u) * 230); }
    html.hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(6) { --x: 1290 !important; max-width: calc(var(--u) * 320); }
    html.hybrid-english [data-lp-page="matches"] .lp-d [data-admin-repeat="match-records"] > p:nth-child(7) {
        --x: 1676 !important;
        transform: translate(-100%) !important;
        min-width: calc(var(--u) * 44);
        text-align: center !important;
        font-family: 'Lama Sans Condensed', 'Lama Sans', Arial, sans-serif !important;
        font-weight: 900 !important;
        letter-spacing: .04em;
    }
}
html.hybrid-english .responsive-matches-page .responsive-record-list .record-stage { display: none !important; }
/* MATCH-CENTER-FIXES:END */
