/* Single match — tabbed detail (events / stats / pitch lineups / ratings) */
.ts-fx-mount {
    min-height: 0;
    margin: 0;
}
/* Background fetch: no dim / gray overlay — keep UI fully interactive */
.ts-fx-mount.is-loading .ts-fx-detail,
.ts-fx-detail.is-loading {
    opacity: 1;
    pointer-events: auto;
}
.ts-fx-detail {
    border-top: 1px solid #eef2f0;
    padding: 0.95rem 1rem 1.15rem;
    background: linear-gradient(180deg, #f7f9f8 0%, #fafbfa 35%, #fff 100%);
}
.ts-fx-detail--pending,
.ts-fx-detail--empty,
.ts-fx-detail--shell {
    min-height: 0;
}
.ts-fx-detail__loading {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin: 0.15rem 0 0;
    font-size: 0.85rem;
    color: #6b7280;
}
.ts-fx-detail--error .ts-fx-detail__loading {
    color: #6b7280;
}
.ts-fx-detail__empty-title {
    margin: 0.1rem 0 0.35rem;
    font-size: 0.95rem;
    font-weight: 700;
    color: #4b5563;
}
.ts-fx-detail--empty .ts-fx-detail__msg {
    margin: 0;
    max-width: 36rem;
    line-height: 1.45;
}
.ts-fx-detail__spinner {
    width: 0.85rem;
    height: 0.85rem;
    border: 2px solid #d1d5db;
    border-top-color: #1b4332;
    border-radius: 50%;
    animation: ts-fx-spin 0.7s linear infinite;
    flex: 0 0 auto;
}
@keyframes ts-fx-spin {
    to { transform: rotate(360deg); }
}
.ts-fx-detail__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    margin-bottom: 0.65rem;
}
.ts-fx-detail__title {
    margin: 0;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #1b4332;
}
.ts-fx-detail__live-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.7rem;
    font-weight: 600;
    color: #6b7280;
    white-space: nowrap;
}

/* Zero-state panels (defaults before API data) */
.ts-fx-blank {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.25rem;
    padding: 1.35rem 1rem 1.5rem;
    background: #fff;
    border: 1px dashed #d9e4dc;
    border-radius: 0.85rem;
}
.ts-fx-blank__icon {
    font-size: 1.35rem;
    line-height: 1;
    margin-bottom: 0.25rem;
    opacity: 0.7;
}
.ts-fx-blank__title {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 700;
    color: #374151;
}
.ts-fx-blank__hint {
    margin: 0.15rem 0 0;
    max-width: 22rem;
    font-size: 0.75rem;
    line-height: 1.45;
    color: #9ca3af;
}
.ts-fx-blank__sides {
    display: flex;
    justify-content: space-between;
    width: 100%;
    gap: 0.75rem;
    margin-bottom: 0.65rem;
    font-size: 0.72rem;
    font-weight: 800;
}
.ts-fx-blank__side--home { color: #1b4332; text-align: left; }
.ts-fx-blank__side--away { color: #1d4ed8; text-align: right; }
.ts-fx-blank__pitch {
    position: relative;
    width: 100%;
    max-width: 16rem;
    height: 5.5rem;
    margin: 0.15rem 0 0.55rem;
    border-radius: 0.65rem;
    background:
        linear-gradient(90deg, transparent 49.5%, rgba(255,255,255,0.25) 49.5%, rgba(255,255,255,0.25) 50.5%, transparent 50.5%),
        linear-gradient(180deg, #2d6a4f 0%, #1b4332 100%);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.12);
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(3, 1fr);
    place-items: center;
    padding: 0.45rem;
    gap: 0.15rem;
}
.ts-fx-blank__dot {
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.35);
}
.ts-ev--empty {
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
}
.ts-ev--empty .ts-ev__head {
    margin-bottom: 0.35rem;
    padding-bottom: 0.28rem;
}
.ts-ev--empty .ts-fx-blank {
    border-style: solid;
    border-color: #e8eeea;
}
.ts-fx-detail__h {
    margin: 0 0 0.7rem;
    font-size: 0.78rem;
    font-weight: 800;
    color: #374151;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.ts-fx-detail__msg {
    margin: 0.4rem 0 0;
    font-size: 0.8rem;
    color: #9ca3af;
}

/* ——— Tabs (modern pill segmented control) ——— */
.ts-fx-tabs {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.15rem;
    margin: 0 0 0.85rem;
    padding: 0.18rem;
    border-radius: 0.75rem;
    background: #eef3f0;
    border: 1px solid #dce6df;
    box-shadow: none;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.ts-fx-tabs::-webkit-scrollbar {
    display: none;
}
.ts-fx-tabs__btn {
    appearance: none;
    -webkit-appearance: none;
    flex: 1 1 0;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    margin: 0;
    padding: 0.48rem 0.65rem;
    border: 0;
    border-radius: 0.55rem;
    background: transparent;
    color: #5b6470;
    font: inherit;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.01em;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.ts-fx-tabs__btn:hover {
    color: #1b4332;
    background: rgba(255, 255, 255, 0.65);
}
.ts-fx-tabs__btn:focus-visible {
    outline: 2px solid #2d6a4f;
    outline-offset: 2px;
}
.ts-fx-tabs__btn.is-active {
    background: #1b4332;
    color: #fff;
    box-shadow: 0 2px 8px rgba(27, 67, 50, 0.22);
}
.ts-fx-tabs__btn.is-active:hover {
    color: #fff;
    background: #245c42;
}
.ts-fx-tabs__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.15rem;
    height: 1.15rem;
    padding: 0 0.3rem;
    border-radius: 999px;
    background: #e5e7eb;
    color: #4b5563;
    font-size: 0.65rem;
    font-weight: 800;
    line-height: 1;
}
.ts-fx-tabs__btn.is-active .ts-fx-tabs__count {
    background: rgba(255, 255, 255, 0.18);
    color: #ecfdf5;
}

.ts-fx-panels {
    min-width: 0;
}
.ts-fx-panel {
    margin: 0;
    min-width: 0;
}
.ts-fx-panel[hidden] {
    display: none !important;
}
.ts-fx-panel.is-active {
    display: block;
}

/* ——— Events: compact dual feed (minimal, dense rows) ——— */
.ts-ev {
    --ev-home: #1b4332;
    --ev-away: #1d4ed8;
    --ev-line: #e8ece9;
    background: #fff;
    border: 1px solid #e8eeea;
    border-radius: 0.65rem;
    padding: 0.4rem 0.35rem 0.45rem;
    box-shadow: none;
}

/* Period dividers */
.ts-ev__period {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin: 0.28rem 0 0.18rem;
    padding: 0 0.1rem;
}
.ts-ev__period:first-child {
    margin-top: 0.05rem;
}
.ts-ev__period-line {
    flex: 1 1 auto;
    height: 1px;
    background: linear-gradient(90deg, transparent, #dde5e0 12%, #dde5e0 88%, transparent);
    min-width: 0.75rem;
}
.ts-ev__period-lab {
    flex: 0 0 auto;
    font-size: 0.55rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #6b7280;
    background: #f4f6f5;
    border: 1px solid #e5ebe7;
    border-radius: 999px;
    padding: 0.1rem 0.4rem;
    line-height: 1.15;
    white-space: nowrap;
}
.ts-ev__period[data-period="et1"] .ts-ev__period-lab,
.ts-ev__period[data-period="et2"] .ts-ev__period-lab {
    color: #1e40af;
    background: #eff6ff;
    border-color: #bfdbfe;
}
.ts-ev__period[data-period="pen"] .ts-ev__period-lab {
    color: #92400e;
    background: #fffbeb;
    border-color: #fde68a;
}

/* Pen score fallback */
.ts-ev__row--pen-summary {
    list-style: none;
    margin: 0.1rem 0 0.15rem;
    padding: 0;
}
.ts-ev__row--pen-summary .ts-ev__box--pen-summary {
    width: 100%;
    display: block;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 0.5rem;
    padding: 0.4rem 0.55rem;
    box-shadow: none;
}
.ts-ev__pen-sum {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.2rem;
    text-align: center;
}
.ts-ev__pen-sum-label {
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #166534;
}
.ts-ev__pen-sum-score {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.25rem 0.35rem;
    width: 100%;
}
.ts-ev__pen-sum-side {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    min-width: 0;
    max-width: 42%;
}
.ts-ev__pen-sum-side--home { justify-content: flex-end; flex-direction: row; }
.ts-ev__pen-sum-side--away { justify-content: flex-start; flex-direction: row; }
.ts-ev__pen-sum-team {
    font-size: 0.68rem;
    font-weight: 700;
    color: #14532d;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}
.ts-ev__pen-sum-n {
    flex: 0 0 auto;
    min-width: 1.15rem;
    height: 1.15rem;
    padding: 0 0.22rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1;
    color: #fff;
    background: #15803d;
    border-radius: 0.28rem;
    box-shadow: none;
}
.ts-ev__pen-sum-sep {
    flex: 0 0 auto;
    font-size: 0.78rem;
    font-weight: 800;
    color: #4ade80;
    line-height: 1;
}
@media (max-width: 480px) {
    .ts-ev__pen-sum-side { max-width: 46%; }
    .ts-ev__pen-sum-team { font-size: 0.62rem; }
    .ts-ev__pen-sum-n { min-width: 1.05rem; height: 1.05rem; font-size: 0.72rem; }
}

.ts-ev__head {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 0.35rem;
    margin: 0 0 0.35rem;
    padding: 0 0.1rem 0.3rem;
    border-bottom: 1px solid #f1f5f3;
}
.ts-ev__head-home,
.ts-ev__head-away {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    min-width: 0;
    font-size: 0.62rem;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ts-ev__head-home { color: var(--ev-home); text-align: left; justify-content: flex-start; }
.ts-ev__head-away { color: var(--ev-away); text-align: right; justify-content: flex-end; }
.ts-ev__head-logo {
    width: 0.85rem;
    height: 0.85rem;
    object-fit: contain;
    flex-shrink: 0;
    border-radius: 0.1rem;
}
.ts-ev__head-vs { display: none; }

.ts-ev__feed {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.18rem;
}

.ts-ev__row {
    display: flex;
    width: 100%;
    margin: 0;
    position: relative;
    z-index: 1;
}

.ts-ev__tlogo {
    width: 0.9rem;
    height: 0.9rem;
    object-fit: contain;
    flex-shrink: 0;
    border-radius: 0.1rem;
    background: transparent;
}

.ts-ev__min {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    min-width: 1.7rem;
    margin: 0;
    padding: 0.06rem 0.22rem;
    font-size: 0.6rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.15;
    color: #4b5563;
    background: rgba(15, 23, 42, 0.05);
    border-radius: 0.28rem;
    border: 0;
    box-shadow: none;
}
.ts-ev__min--pen { display: none; }

/* Dense event row */
.ts-ev__box {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    width: 100%;
    max-width: 100%;
    min-height: 0;
    padding: 0.22rem 0.4rem;
    border-radius: 0.45rem;
    border: 1px solid #eef2f0;
    background: #fafbfa;
    box-sizing: border-box;
    box-shadow: none;
}

/* Face + icon cluster */
.ts-ev__player {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 1.45rem;
    height: 1.45rem;
}
.ts-ev__player .ts-ev__face {
    width: 1.3rem;
    height: 1.3rem;
}
.ts-ev__player .ts-ev__ico {
    position: absolute;
    right: -0.22rem;
    bottom: -0.18rem;
    z-index: 1;
    font-size: 0.58rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0.72rem;
    height: 0.72rem;
    padding: 0 0.04rem;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.08);
    opacity: 1;
}
.is-away .ts-ev__player .ts-ev__ico {
    right: auto;
    left: -0.22rem;
}

.is-home .ts-ev__box {
    justify-content: flex-start;
    text-align: left;
    background: #f6faf7;
    border-color: #e2ebe5;
    border-left: 2px solid var(--ev-home);
}
.is-home .ts-ev__txt { text-align: left; }
.is-home .ts-ev__primary { justify-content: flex-start; }

.is-away .ts-ev__box {
    justify-content: flex-end;
    text-align: right;
    background: #f7f9fd;
    border-color: #e4eaf6;
    border-right: 2px solid var(--ev-away);
}
.is-away .ts-ev__txt {
    text-align: right;
    flex: 0 1 auto;
    max-width: calc(100% - 5.2rem);
}
.is-away .ts-ev__primary {
    justify-content: flex-end;
    flex-wrap: wrap;
}
.is-away .ts-ev__secondary { text-align: right; }

.ts-ev__face {
    width: 1.3rem;
    height: 1.3rem;
    border-radius: 50%;
    object-fit: cover;
    object-position: center 15%;
    background: #e5e7eb;
    flex-shrink: 0;
    border: 1px solid #fff;
    box-shadow: none;
}
.ts-ev__face--ph {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.55rem;
    font-weight: 700;
    color: #6b7280;
}
.ts-ev__txt {
    min-width: 0;
    flex: 1 1 auto;
}
.ts-ev__primary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.1rem 0.22rem;
}
.ts-ev__primary strong {
    font-size: 0.7rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 11rem;
}
.ts-ev__tag {
    font-size: 0.48rem;
    font-weight: 700;
    padding: 0.04rem 0.22rem;
    border-radius: 999px;
    background: #eef2f0;
    color: #6b7280;
    white-space: nowrap;
    flex-shrink: 0;
    line-height: 1.2;
}
.ts-ev__score {
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.01em;
    padding: 0.04rem 0.28rem;
    border-radius: 0.25rem;
    background: #14532d;
    color: #ecfdf5;
    white-space: nowrap;
    flex-shrink: 0;
    line-height: 1.15;
}
.is-own .ts-ev__score { background: #7f1d1d; color: #fef2f2; }
.is-goal .ts-ev__tag { background: #dcfce7; color: #166534; }
.is-own .ts-ev__tag,
.is-red .ts-ev__tag { background: #fee2e2; color: #b91c1c; }
.is-yellow .ts-ev__tag { background: #fef9c3; color: #854d0e; }
.is-subst .ts-ev__tag { background: #dbeafe; color: #1d4ed8; }
.is-var .ts-ev__tag { background: #ede9fe; color: #6d28d9; }

/* Goals: color only — same density as other rows */
.is-goal .ts-ev__box {
    background: #f0fdf4;
    border-color: #bbf7d0;
}
.is-home.is-goal .ts-ev__box {
    border-left-color: #16a34a;
    background: #f0fdf4;
}
.is-away.is-goal .ts-ev__box {
    border-right-color: #16a34a;
    background: #f0fdf4;
}
.is-own .ts-ev__box { border-color: #fecaca; }
.is-home.is-own .ts-ev__box {
    border-left-color: #dc2626;
    background: #fef2f2;
}
.is-away.is-own .ts-ev__box {
    border-right-color: #dc2626;
    background: #fef2f2;
}
.is-goal .ts-ev__tag {
    background: #16a34a;
    color: #fff;
}
.is-own .ts-ev__tag {
    background: #dc2626;
    color: #fff;
}
.is-goal .ts-ev__min { color: #14532d; }
.is-own .ts-ev__min { color: #991b1b; }

.ts-ev__secondary {
    margin-top: 0.02rem;
    font-size: 0.58rem;
    color: #6b7280;
    font-weight: 500;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.is-goal .ts-ev__secondary {
    color: #15803d;
    font-weight: 600;
}
.ts-ev__ico {
    font-size: 0.72rem;
    line-height: 1;
    flex-shrink: 0;
    opacity: 0.9;
}

@media (max-width: 540px) {
    .ts-ev {
        padding: 0.32rem 0.28rem 0.38rem;
        border-radius: 0.55rem;
    }
    .ts-ev__head {
        margin-bottom: 0.28rem;
        padding-bottom: 0.24rem;
    }
    .ts-ev__head-home,
    .ts-ev__head-away {
        font-size: 0.58rem;
    }
    .ts-ev__feed { gap: 0.14rem; }
    .ts-ev__box {
        padding: 0.18rem 0.32rem;
        gap: 0.22rem;
        border-radius: 0.4rem;
    }
    .ts-ev__player {
        width: 1.25rem;
        height: 1.25rem;
    }
    .ts-ev__face,
    .ts-ev__player .ts-ev__face {
        width: 1.15rem;
        height: 1.15rem;
    }
    .ts-ev__player .ts-ev__ico {
        font-size: 0.52rem;
        min-width: 0.65rem;
        height: 0.65rem;
        right: -0.18rem;
        bottom: -0.12rem;
    }
    .is-away .ts-ev__player .ts-ev__ico {
        left: -0.18rem;
        right: auto;
    }
    .ts-ev__primary strong {
        font-size: 0.65rem;
        max-width: 8.5rem;
    }
    .ts-ev__tag {
        font-size: 0.45rem;
        padding: 0.03rem 0.18rem;
    }
    .ts-ev__secondary { font-size: 0.52rem; }
    .ts-ev__min {
        min-width: 1.45rem;
        font-size: 0.55rem;
        padding: 0.04rem 0.18rem;
    }
    .ts-ev__score {
        font-size: 0.52rem;
        padding: 0.03rem 0.22rem;
    }
    .is-away .ts-ev__txt {
        max-width: calc(100% - 4.6rem);
    }
    .ts-ev__tlogo {
        width: 0.8rem;
        height: 0.8rem;
    }
    .ts-ev__head-logo {
        width: 0.75rem;
        height: 0.75rem;
    }
}

/* ——— Modern stats comparison ——— */
.ts-st {
    --st-home: #1b4332;
    --st-away: #1d4ed8;
    --st-home-soft: #52b788;
    --st-away-soft: #60a5fa;
    --st-track: #eef2f0;
    background: #fff;
    border: 1px solid #e8eeea;
    border-radius: 1rem;
    padding: 0.95rem 0.95rem 1.05rem;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}
.ts-st__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin: 0 0 0.9rem;
    padding: 0 0.1rem 0.75rem;
    border-bottom: 1px solid #f1f5f3;
}
.ts-st__team {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    min-width: 0;
    max-width: 46%;
}
.ts-st__team--away {
    flex-direction: row;
    justify-content: flex-end;
    text-align: right;
}
.ts-st__dot {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 999px;
    flex-shrink: 0;
}
.ts-st__dot--home {
    background: var(--st-home);
    box-shadow: 0 0 0 3px rgba(27, 67, 50, 0.12);
}
.ts-st__dot--away {
    background: var(--st-away);
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.12);
}
.ts-st__name {
    font-size: 0.82rem;
    font-weight: 800;
    color: #111827;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ts-st__team--home .ts-st__name {
    color: var(--st-home);
}
.ts-st__team--away .ts-st__name {
    color: var(--st-away);
}

.ts-st__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}
.ts-st__row {
    margin: 0;
    padding: 0;
}
.ts-st__nums {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: baseline;
    gap: 0.5rem 0.65rem;
    margin-bottom: 0.35rem;
}
.ts-st__val {
    font-size: 0.95rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.15;
    color: #6b7280;
    transition: color 0.12s ease, transform 0.12s ease;
}
.ts-st__val--home {
    text-align: left;
    color: #4b5563;
}
.ts-st__val--away {
    text-align: right;
    color: #4b5563;
}
.ts-st__val.is-lead {
    font-weight: 800;
    font-size: 1.02rem;
    transform: none;
}
.is-lead-home .ts-st__val--home.is-lead {
    color: var(--st-home);
}
.is-lead-away .ts-st__val--away.is-lead {
    color: var(--st-away);
}
.is-lead-draw .ts-st__val--home,
.is-lead-draw .ts-st__val--away {
    color: #374151;
    font-weight: 750;
}
.ts-st__label {
    font-size: 0.68rem;
    font-weight: 700;
    color: #9ca3af;
    letter-spacing: 0.02em;
    text-align: center;
    white-space: nowrap;
    max-width: 9.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Dual track from center */
.ts-st__track {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3px;
    height: 8px;
}
.ts-st__half {
    position: relative;
    height: 100%;
    background: var(--st-track);
    overflow: hidden;
}
.ts-st__half--home {
    border-radius: 999px 2px 2px 999px;
    display: flex;
    justify-content: flex-end;
}
.ts-st__half--away {
    border-radius: 2px 999px 999px 2px;
    display: flex;
    justify-content: flex-start;
}
.ts-st__fill {
    display: block;
    height: 100%;
    max-width: 100%;
    min-width: 0;
    border-radius: inherit;
    transition: width 0.35s ease;
}
.ts-st__fill--home {
    background: linear-gradient(90deg, var(--st-home-soft), var(--st-home));
}
.ts-st__fill--away {
    background: linear-gradient(90deg, var(--st-away), #1e3a8a);
}
/* Soft glow on leading side */
.is-lead-home .ts-st__fill--home {
    box-shadow: 0 0 10px rgba(27, 67, 50, 0.28);
}
.is-lead-away .ts-st__fill--away {
    box-shadow: 0 0 10px rgba(29, 78, 216, 0.28);
}

/* Possession / cards slightly roomier */
.ts-st__row[data-stat*="possession"] .ts-st__track,
.ts-st__row[data-stat*="ball possession"] .ts-st__track {
    height: 10px;
}
.ts-st__row[data-stat*="possession"] .ts-st__val.is-lead,
.ts-st__row[data-stat*="ball possession"] .ts-st__val.is-lead {
    font-size: 1.08rem;
}

@media (max-width: 540px) {
    .ts-st {
        padding: 0.8rem 0.7rem 0.9rem;
    }
    .ts-st__name {
        font-size: 0.74rem;
    }
    .ts-st__val {
        font-size: 0.88rem;
    }
    .ts-st__val.is-lead {
        font-size: 0.95rem;
    }
    .ts-st__label {
        font-size: 0.62rem;
        max-width: 6.5rem;
    }
    .ts-st__list {
        gap: 0.75rem;
    }
    .ts-st__track {
        height: 7px;
    }
}

/* ——— Lineup: shared pitch (away top / home bottom) ——— */
.ts-lu--shared {
    background: #fff;
    border: 1px solid #e8eeea;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}
.ts-lu__body {
    display: flex;
    flex-direction: column;
}
/* Mobile/tablet: pitch first, bench below */
.ts-lu__pitch {
    order: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.ts-lu__bench {
    order: 2;
}
/* Team header sits on that team's half of the pitch (away top, home bottom) */
.ts-lu__side {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 0;
    padding: 0.55rem 0.75rem;
}
.ts-lu__side--away {
    justify-content: flex-start;
    background: linear-gradient(90deg, #eff6ff 0%, #f8fafc 100%);
    border-bottom: 1px solid #eef2f0;
}
.ts-lu__side--home {
    justify-content: flex-start;
    background: linear-gradient(90deg, #f0fdf4 0%, #f8fafc 100%);
    border-top: 1px solid #eef2f0;
}

/* Wide screens: bench left (3) · pitch right (9), same row height */
@media (min-width: 960px) {
    .ts-lu--shared.ts-lu--has-bench .ts-lu__body {
        display: grid;
        grid-template-columns: 3fr 9fr;
        align-items: stretch;
    }
    .ts-lu--shared.ts-lu--has-bench .ts-lu__bench {
        order: 0;
        display: flex;
        flex-direction: column;
        border-top: 0;
        border-right: 1px solid #f1f5f3;
        background: #fafbfa;
        min-width: 0;
        min-height: 0;
        max-height: 100%;
        overflow: hidden;
        align-self: stretch;
    }
    .ts-lu--shared.ts-lu--has-bench .ts-lu__pitch {
        order: 0;
        min-width: 0;
        min-height: 0;
        height: 100%;
    }
    .ts-lu--shared.ts-lu--has-bench .ts-lu__field--shared {
        max-width: none;
        width: 100%;
        flex: 1 1 auto;
        /* taller pitch on wide screens (avoid near-square look) */
        aspect-ratio: 3 / 5.35;
        min-height: 26rem;
        max-height: min(54rem, 80vh);
    }
    /* Split bench into two equal halves matching pitch halves; scroll if long */
    .ts-lu--shared.ts-lu--has-bench .ts-lu__subs {
        flex: 1 1 50%;
        min-height: 0;
        display: flex;
        flex-direction: column;
        padding: 0.4rem 0.45rem 0.45rem;
        overflow: hidden;
    }
    .ts-lu--shared.ts-lu--has-bench .ts-lu__subs--away {
        border-right: 0;
        border-bottom: 1px solid #eef2f0;
        background: linear-gradient(180deg, #eff6ff 0%, #fafbfa 40%);
    }
    .ts-lu--shared.ts-lu--has-bench .ts-lu__subs--home {
        background: linear-gradient(0deg, #f0fdf4 0%, #fafbfa 40%);
    }
    .ts-lu--shared.ts-lu--has-bench .ts-lu__subs-label {
        margin: 0 0 0.3rem;
        font-size: 0.58rem;
        flex-shrink: 0;
    }
    .ts-lu--shared.ts-lu--has-bench .ts-lu__subs-list {
        flex: 1 1 auto;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: stretch;
        gap: 0.22rem;
        min-height: 0;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }
    .ts-lu--shared.ts-lu--has-bench .ts-lu__sub {
        width: 100%;
        max-width: none;
        box-sizing: border-box;
        border-radius: 0.45rem;
        padding: 0.16rem 0.3rem 0.16rem 0.2rem;
        font-size: 0.62rem;
    }
    .ts-lu--shared.ts-lu--has-bench .ts-lu__sub-name {
        max-width: none;
        flex: 1 1 auto;
    }
    .ts-lu--shared.ts-lu--has-bench .ts-lu__side {
        padding: 0.45rem 0.7rem;
        flex-shrink: 0;
    }
    .ts-lu--shared.ts-lu--has-bench .ts-lu__side--away {
        border-radius: 0;
    }
}
.ts-lu__logo {
    width: 1.55rem;
    height: 1.55rem;
    object-fit: contain;
    flex-shrink: 0;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.06);
}
.ts-lu__team-text {
    min-width: 0;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
}
.ts-lu__name {
    font-size: 0.84rem;
    font-weight: 800;
    color: #111827;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 14rem;
}
.ts-lu__coach {
    font-size: 0.65rem;
    color: #6b7280;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 14rem;
}
.ts-lu__form {
    flex-shrink: 0;
    margin-left: auto;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    border-radius: 999px;
    padding: 0.18rem 0.5rem;
}
.ts-lu__form--home {
    color: #14532d;
    background: #ecfdf5;
    border: 1px solid #bbf7d0;
}
.ts-lu__form--away {
    color: #1e3a8a;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
}

.ts-lu__pitch .ts-lu__field--shared {
    margin: 0 auto;
}
.ts-lu__field--shared {
    position: relative;
    width: 100%;
    max-width: 40rem;
    margin: 0 auto;
    aspect-ratio: 3 / 4.35;
    min-height: 22rem;
    border-radius: 0;
    overflow: hidden;
    background:
        repeating-linear-gradient(
            0deg,
            rgba(255, 255, 255, 0.04) 0 10%,
            transparent 10% 20%
        ),
        linear-gradient(180deg, #1a8f52 0%, #157a46 50%, #0f6b3c 100%);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.2),
        0 10px 28px rgba(15, 23, 42, 0.12);
}
.ts-lu__mark {
    position: absolute;
    inset: 0;
    pointer-events: none;
}
.ts-lu__outline {
    position: absolute;
    inset: 2.8% 4%;
    border: 1.5px solid rgba(255, 255, 255, 0.5);
    border-radius: 2px;
}
.ts-lu__half {
    position: absolute;
    left: 4%;
    right: 4%;
    top: 50%;
    height: 1.5px;
    background: rgba(255, 255, 255, 0.5);
    transform: translateY(-50%);
}
.ts-lu__circle {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 24%;
    aspect-ratio: 1;
    border: 1.5px solid rgba(255, 255, 255, 0.48);
    border-radius: 999px;
    transform: translate(-50%, -50%);
}
.ts-lu__box {
    position: absolute;
    left: 50%;
    width: 50%;
    height: 12%;
    border: 1.5px solid rgba(255, 255, 255, 0.45);
    transform: translateX(-50%);
}
.ts-lu__box--top {
    top: 2.8%;
    border-top: 0;
}
.ts-lu__box--bot {
    bottom: 2.8%;
    border-bottom: 0;
}
.ts-lu__pen {
    position: absolute;
    left: 50%;
    width: 26%;
    height: 5%;
    border: 1.5px solid rgba(255, 255, 255, 0.38);
    transform: translateX(-50%);
}
.ts-lu__pen--top {
    top: 2.8%;
    border-top: 0;
}
.ts-lu__pen--bot {
    bottom: 2.8%;
    border-bottom: 0;
}
.ts-lu__dot {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 4px;
    height: 4px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.7);
    transform: translate(-50%, -50%);
}
/* Soft tint per half — helps read sides without clutter */
.ts-lu__zone {
    position: absolute;
    left: 0;
    right: 0;
    height: 50%;
    pointer-events: none;
}
.ts-lu__zone--away {
    top: 0;
    background: linear-gradient(180deg, rgba(30, 58, 95, 0.12), transparent 70%);
}
.ts-lu__zone--home {
    bottom: 0;
    background: linear-gradient(0deg, rgba(20, 83, 45, 0.12), transparent 70%);
}

/* Player tokens on pitch (circular photo + number badge) */
.ts-lu__player {
    position: absolute;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 4.1rem;
    z-index: 2;
    pointer-events: none;
}
.ts-lu__avatar {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.65rem;
    height: 2.65rem;
    flex-shrink: 0;
    border-radius: 50%;
}
.ts-lu__face {
    width: 2.65rem;
    height: 2.65rem;
    max-width: 2.65rem;
    max-height: 2.65rem;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    object-fit: cover;
    object-position: center 15%;
    display: block;
    flex-shrink: 0;
    box-sizing: border-box;
    background: #d1d5db;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.32);
    overflow: hidden;
}
.ts-lu__player--home .ts-lu__face {
    border: 2px solid #fff;
}
.ts-lu__player--away .ts-lu__face {
    border: 2px solid #93c5fd;
}
.ts-lu__shirt {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.65rem;
    height: 2.65rem;
    border-radius: 50%;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
    box-sizing: border-box;
}
.ts-lu__player--home .ts-lu__shirt {
    background: #fff;
    border: 1.5px solid #fff;
}
.ts-lu__player--away .ts-lu__shirt {
    background: #1e3a5f;
    border: 1.5px solid #93c5fd;
}
/* Rating badge on photo (replaces jersey number on avatar) */
.ts-lu__rating {
    position: absolute;
    right: -0.35rem;
    bottom: -0.28rem;
    min-width: 1.05rem;
    height: 0.9rem;
    padding: 0 0.18rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.5rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.9);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    background: #166534;
}

/* Event icons on pitch player — always a single horizontal row */
.ts-lu__ev {
    position: absolute;
    left: 50%;
    top: -0.42rem;
    transform: translateX(-50%);
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 0.08rem;
    max-width: none;
    white-space: nowrap;
    z-index: 4;
    pointer-events: auto;
    line-height: 1;
}
.ts-lu__ev-i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0.78rem;
    height: 0.78rem;
    padding: 0 0.12rem;
    border-radius: 0.2rem;
    font-size: 0.52rem;
    font-weight: 800;
    line-height: 1;
    background: rgba(15, 23, 42, 0.78);
    color: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
    white-space: nowrap;
}
.ts-lu__ev-i.is-goal {
    background: rgba(15, 23, 42, 0.82);
    font-size: 0.55rem;
}
.ts-lu__ev-i.is-assist {
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.12);
    padding: 0 0.1rem;
}
.ts-lu__ev-i.is-assist .ts-ev-boot {
    display: block;
    width: 0.72rem;
    height: 0.72rem;
}
.ts-lu__ev-i.is-assist .ts-ev-boot path {
    fill: #111;
}
.ts-lu__ev-i.is-yellow {
    background: rgba(15, 23, 42, 0.75);
    font-size: 0.5rem;
}
.ts-lu__ev-i.is-red {
    background: rgba(15, 23, 42, 0.75);
    font-size: 0.5rem;
}
.ts-lu__ev-i.is-sub-in {
    background: #15803d;
    color: #ecfdf5;
    font-size: 0.58rem;
    min-width: 0.72rem;
}
.ts-lu__ev-i.is-sub-out {
    background: #b45309;
    color: #fff7ed;
    font-size: 0.58rem;
    min-width: 0.72rem;
}
.ts-lu__player.has-events {
    z-index: 3;
}

/* Bench chip event icons — horizontal row */
.ts-lu__sub-ev {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.08rem;
    flex-shrink: 0;
    margin-left: 0.05rem;
    white-space: nowrap;
}
.ts-lu__sub-ev-i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0.85rem;
    height: 0.85rem;
    padding: 0 0.14rem;
    border-radius: 0.2rem;
    font-size: 0.55rem;
    font-weight: 800;
    line-height: 1;
    background: #f3f4f6;
    color: #111827;
}
.ts-lu__sub-ev-i.is-goal {
    background: #ecfdf5;
}
.ts-lu__sub-ev-i.is-assist {
    background: #fff;
    border: 1px solid #e5e7eb;
    padding: 0 0.12rem;
}
.ts-lu__sub-ev-i.is-assist .ts-ev-boot {
    display: block;
    width: 0.72rem;
    height: 0.72rem;
}
.ts-lu__sub-ev-i.is-assist .ts-ev-boot path {
    fill: #111;
}
.ts-lu__sub-ev-i.is-yellow,
.ts-lu__sub-ev-i.is-red {
    background: #fff;
}
.ts-lu__sub-ev-i.is-sub-in {
    background: #dcfce7;
    color: #166534;
}
.ts-lu__sub-ev-i.is-sub-out {
    background: #ffedd5;
    color: #9a3412;
}
.ts-lu__sub.has-events {
    padding-right: 0.32rem;
}
.ts-lu__rating--high {
    background: #15803d;
    color: #fff;
}
/* Mid rating: soft slate — not loud yellow */
.ts-lu__rating--mid {
    background: rgba(15, 23, 42, 0.82);
    color: #e5e7eb;
    border-color: rgba(255, 255, 255, 0.75);
}
.ts-lu__rating--low {
    background: #9a3412;
    color: #fff;
}
.ts-lu__player:not(.has-photo) .ts-lu__avatar {
    width: 2.65rem;
    height: 2.65rem;
}
/* Name line: jersey number + short name */
.ts-lu__pname {
    margin-top: 0.28rem;
    max-width: 4.1rem;
    padding: 0.08rem 0.26rem;
    border-radius: 0.24rem;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 0.54rem;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: 0.18rem;
}
.ts-lu__jnum {
    flex-shrink: 0;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    opacity: 0.9;
    color: #d8f3dc;
}
.ts-lu__player--away .ts-lu__jnum {
    color: #bfdbfe;
}
.ts-lu__jname {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Bench (below pitch on narrow; left of pitch on wide) */
.ts-lu__bench {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    border-top: 1px solid #f1f5f3;
    background: #fafbfa;
}
.ts-lu__subs {
    padding: 0.55rem 0.7rem 0.75rem;
    min-width: 0;
}
.ts-lu__subs--away {
    border-right: 1px solid #f1f5f3;
}
.ts-lu__subs-label {
    margin: 0 0 0.4rem;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #9ca3af;
}
.ts-lu__subs-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.28rem;
}
.ts-lu__sub {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    max-width: 100%;
    padding: 0.18rem 0.4rem 0.18rem 0.22rem;
    border-radius: 999px;
    background: #fff;
    border: 1px solid #e5e7eb;
    font-size: 0.68rem;
    line-height: 1.2;
}
.ts-lu__sub-face {
    width: 1rem;
    height: 1rem;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    object-fit: cover;
    object-position: center 15%;
    flex-shrink: 0;
    box-sizing: border-box;
    background: #e5e7eb;
}
.ts-lu__subs--home .ts-lu__sub-face {
    border: 1px solid #bbf7d0;
}
.ts-lu__subs--away .ts-lu__sub-face {
    border: 1px solid #bfdbfe;
}
.ts-lu__sub-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.1rem;
    height: 1.1rem;
    padding: 0 0.18rem;
    border-radius: 999px;
    background: #f3f4f6;
    color: #4b5563;
    font-size: 0.6rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}
.ts-lu__subs--home .ts-lu__sub-num {
    background: #ecfdf5;
    color: #166534;
}
.ts-lu__subs--away .ts-lu__sub-num {
    background: #eff6ff;
    color: #1d4ed8;
}
.ts-lu__sub-name {
    color: #374151;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 5.5rem;
}
/* Bench player rating (from players stats, when available) */
.ts-lu__sub-rating {
    flex-shrink: 0;
    margin-left: auto;
    min-width: 1.55rem;
    padding: 0.08rem 0.28rem;
    border-radius: 0.35rem;
    font-size: 0.62rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
    text-align: center;
    color: #374151;
    background: #f3f4f6;
}
.ts-lu__sub-rating--high {
    color: #14532d;
    background: #dcfce7;
}
.ts-lu__sub-rating--mid {
    color: #374151;
    background: #f3f4f6;
}
.ts-lu__sub-rating--low {
    color: #9a3412;
    background: #ffedd5;
}
.ts-lu__sub.has-rating .ts-lu__sub-name {
    max-width: 4.2rem;
}
.ts-lu--shared.ts-lu--has-bench .ts-lu__sub.has-rating .ts-lu__sub-name {
    max-width: none;
    flex: 1 1 auto;
}

/* Fallback list layout */
.ts-fx-lineups {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}
.ts-fx-lineup,
.ts-fx-players__col {
    border: 1px solid #e8eeea;
    border-radius: 0.95rem;
    padding: 0.8rem 0.85rem;
    background: #fff;
    min-width: 0;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
}
.ts-fx-lineup__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.35rem;
    font-size: 0.85rem;
}
.ts-fx-lineup__team {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    min-width: 0;
}
.ts-fx-lineup__team strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ts-fx-lineup__logo {
    width: 1.25rem;
    height: 1.25rem;
    object-fit: contain;
    flex-shrink: 0;
}
.ts-fx-lineup__form {
    font-size: 0.68rem;
    font-weight: 800;
    color: #2d6a4f;
    background: #ecfdf5;
    border: 1px solid #bbf7d0;
    border-radius: 999px;
    padding: 0.1rem 0.45rem;
    flex-shrink: 0;
}
.ts-fx-lineup__coach {
    margin: 0 0 0.45rem;
    font-size: 0.72rem;
    color: #6b7280;
}
.ts-fx-lineup__label {
    margin: 0.5rem 0 0.3rem;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #9ca3af;
}
.ts-fx-lineup__list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.ts-fx-lineup__list li,
.ts-fx-lineup__row {
    display: grid;
    grid-template-columns: 1.55rem minmax(0, 1fr) auto auto;
    gap: 0.3rem;
    align-items: center;
    font-size: 0.78rem;
    padding: 0.28rem 0;
    border-bottom: 1px dashed #eef2f0;
}
.ts-fx-lineup__list li:last-child,
.ts-fx-lineup__row:last-child {
    border-bottom: 0;
}
.ts-fx-lineup__face {
    width: 1.15rem;
    height: 1.15rem;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    object-fit: cover;
    object-position: center 15%;
    box-sizing: border-box;
    background: #e5e7eb;
}
.ts-fx-lineup__num {
    font-weight: 800;
    color: #6b7280;
    font-size: 0.72rem;
    font-variant-numeric: tabular-nums;
}
.ts-fx-lineup__name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #1f2937;
    font-weight: 600;
}
.ts-fx-lineup__pos {
    font-size: 0.62rem;
    font-weight: 800;
    color: #9ca3af;
    letter-spacing: 0.04em;
}
.ts-fx-lineup__list--subs .ts-fx-lineup__name {
    color: #4b5563;
    font-weight: 500;
}

/* List lineup event icons — horizontal row */
.ts-fx-lineup__ev {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.1rem;
    flex-shrink: 0;
    white-space: nowrap;
}
.ts-fx-lineup__ev-i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0.95rem;
    height: 0.95rem;
    padding: 0 0.16rem;
    border-radius: 0.22rem;
    font-size: 0.58rem;
    font-weight: 800;
    line-height: 1;
    background: #f3f4f6;
    color: #111827;
    white-space: nowrap;
}
.ts-fx-lineup__ev-i.is-goal {
    background: #ecfdf5;
}
.ts-fx-lineup__ev-i.is-assist {
    background: #fff;
    border: 1px solid #e5e7eb;
    padding: 0 0.14rem;
}
.ts-fx-lineup__ev-i.is-assist .ts-ev-boot {
    display: block;
    width: 0.78rem;
    height: 0.78rem;
}
.ts-fx-lineup__ev-i.is-assist .ts-ev-boot path {
    fill: #111;
}
.ts-fx-lineup__ev-i.is-yellow,
.ts-fx-lineup__ev-i.is-red {
    background: #fff;
    border: 1px solid #e5e7eb;
}
.ts-fx-lineup__ev-i.is-sub-in {
    background: #dcfce7;
    color: #166534;
}
.ts-fx-lineup__ev-i.is-sub-out {
    background: #ffedd5;
    color: #9a3412;
}

/* ——— Player ratings ——— */
.ts-fx-players {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}
.ts-fx-players__list {
    list-style: none;
    margin: 0.35rem 0 0;
    padding: 0;
}
.ts-fx-players__row {
    display: grid;
    grid-template-columns: 1.2rem auto 2.35rem minmax(0, 1fr) auto;
    gap: 0.35rem;
    align-items: center;
    font-size: 0.78rem;
    padding: 0.32rem 0;
    border-bottom: 1px dashed #eef2f0;
}
.ts-fx-players__face {
    width: 1.2rem;
    height: 1.2rem;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    object-fit: cover;
    object-position: center 15%;
    box-sizing: border-box;
    background: #e5e7eb;
}
.ts-fx-players__row:last-child {
    border-bottom: 0;
}
.ts-fx-players__rank {
    font-size: 0.68rem;
    font-weight: 700;
    color: #9ca3af;
    text-align: center;
}
.ts-fx-players__rating {
    font-weight: 800;
    border-radius: 0.4rem;
    text-align: center;
    padding: 0.15rem 0.2rem;
    font-size: 0.72rem;
    font-variant-numeric: tabular-nums;
}
.ts-fx-players__rating--high {
    color: #14532d;
    background: #dcfce7;
}
.ts-fx-players__rating--mid {
    color: #374151;
    background: #f3f4f6;
}
.ts-fx-players__rating--low {
    color: #9a3412;
    background: #ffedd5;
}
.ts-fx-players__name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
    color: #1f2937;
}
.ts-fx-players__min {
    font-size: 0.68rem;
    color: #9ca3af;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

@media (max-width: 640px) {
    .ts-fx-detail {
        padding: 1rem 0.95rem 1.2rem;
    }
    .ts-lu__side {
        padding: 0.45rem 0.65rem;
    }
    .ts-lu__name,
    .ts-lu__coach {
        max-width: none;
    }
    .ts-lu__field--shared {
        max-width: none;
        aspect-ratio: 3 / 4.5;
        min-height: 22rem;
    }
    .ts-lu__player {
        width: 3.55rem;
    }
    .ts-lu__avatar,
    .ts-lu__face,
    .ts-lu__player:not(.has-photo) .ts-lu__avatar,
    .ts-lu__shirt {
        width: 2.25rem;
        height: 2.25rem;
        max-width: 2.25rem;
        max-height: 2.25rem;
    }
    .ts-lu__rating {
        font-size: 0.48rem;
        min-width: 1rem;
        height: 0.88rem;
    }
    .ts-lu__pname {
        max-width: 3.55rem;
        font-size: 0.5rem;
    }
    .ts-lu__bench {
        grid-template-columns: 1fr;
    }
    .ts-lu__subs--away {
        border-right: 0;
        border-bottom: 1px solid #f1f5f3;
    }
}
@media (max-width: 540px) {
    .ts-fx-lineups,
    .ts-fx-players {
        grid-template-columns: 1fr;
    }
}

/* Lazy lineups: placeholder until tab opened */
.ts-fx-lineups-lazy:not(.is-hydrated) {
    min-height: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 0.75rem;
    border-radius: 0.75rem;
    background: #f3f6f4;
    border: 1px dashed #d1ddd6;
}
.ts-fx-lineups-lazy__hint {
    margin: 0;
    font-size: 0.82rem;
    color: #6b7280;
    text-align: center;
}
.ts-fx-lineups-lazy.is-hydrated {
    min-height: 0;
    display: block;
    padding: 0;
    border: 0;
    background: transparent;
}