/* Generated article match artwork grows with the complete match lineup. */
.news-article-match-cover { height: auto; max-height: none; }
.news-article-match-cover .news-artwork--article { position: relative; inset: auto; }
.news-article-match-cover .news-artwork::after { background: none; }
.news-detail-match {
    position: relative; z-index: 3; display: grid;
    grid-template-columns: repeat(var(--news-detail-columns), minmax(0, 1fr));
    gap: clamp(12px, 2vw, 24px); padding: clamp(16px, 3vw, 32px);
    align-items: stretch;
}
.news-detail-side { min-width: 0; display: flex; flex-direction: column; border: 1px solid #ffffff12; border-radius: 10px; overflow: hidden; background: #090e1699; }
.news-detail-members { display: grid; flex: 1; grid-template-columns: repeat(var(--news-detail-members), minmax(0, 1fr)); }
.news-detail-match[data-news-sides="5"]:not(.news-detail-match--teams) { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.news-detail-match[data-news-sides="5"]:not(.news-detail-match--teams) > .news-detail-side { grid-column: span 2; }
.news-detail-match[data-news-sides="5"]:not(.news-detail-match--teams) > .news-detail-side:nth-child(4) { grid-column: 2 / span 2; }
.news-detail-match[data-news-sides="5"]:not(.news-detail-match--teams) > .news-detail-side:nth-child(5) { grid-column: 4 / span 2; }
.news-detail-competitor { min-width: 0; display: flex; flex-direction: column; }
.news-detail-render {
    position: relative; flex: none; height: clamp(170px, 27vw, 310px); overflow: hidden; container-type: size;
    background: radial-gradient(ellipse at 50% 65%, color-mix(in srgb, var(--news-accent) 12%, transparent), transparent 75%);
}
.news-detail-match[data-news-sides="1"] .news-detail-side { width: min(100%, 560px); justify-self: center; }
.news-detail-match[data-news-sides="1"] .news-detail-render,
.news-detail-match[data-news-sides="2"]:not(.news-detail-match--teams) .news-detail-render { height: clamp(200px, 31vw, 360px); }
.news-detail-render img {
    position: absolute; top: 0; left: 50%; width: auto; max-width: none; height: 245%;
    object-fit: contain; object-position: center top; transform: translateX(-50%);
    mask-image: none; -webkit-mask-image: none;
}
@supports (height: 1cqw) { .news-detail-render img { height: min(245%, 650cqw); } }
.news-detail-render::after { position: absolute; z-index: 2; inset: 78% 0 0; content: ""; background: linear-gradient(transparent, #0a1019); pointer-events: none; }
.news-detail-name {
    position: relative; flex: 1; display: flex; align-items: center; justify-content: center; min-height: 3.2em;
    padding: 10px 8px; background: #0a1019; color: #f5f6f9; font-family: var(--display);
    font-size: clamp(14px, 1.6vw, 21px); line-height: 1.15; font-weight: 800;
    text-align: center; text-transform: uppercase; overflow-wrap: anywhere;
}
.news-detail-team-name { display: block; padding: 12px; border-bottom: 1px solid #ffffff12; color: color-mix(in srgb, var(--news-accent) 65%, white); font-family: var(--display); font-size: clamp(15px, 1.8vw, 22px); line-height: 1.2; text-align: center; overflow-wrap: anywhere; }
.news-detail-versus { position: absolute; z-index: 4; top: 44%; left: 50%; display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--news-accent); border-radius: 50%; background: #080d15; color: white; font-family: var(--display); font-size: 18px; font-style: italic; transform: translate(-50%, -50%); }
.news-article-match-cover .news-artwork--article .news-artwork-caption {
    position: relative; inset: auto; width: auto; max-width: none; padding: 18px clamp(16px, 3vw, 32px);
    border: 0; border-top: 1px solid color-mix(in srgb, var(--news-accent) 35%, transparent);
    background: #080d15e6;
}
.news-article-match-cover .news-artwork--article .news-artwork-caption strong { white-space: normal; overflow: visible; overflow-wrap: anywhere; font-size: clamp(20px, 2.4vw, 28px); line-height: 1.15; }
@media (max-width: 900px) and (min-width: 601px) {
    .news-detail-match--large { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .news-detail-match { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 12px; }
    .news-detail-match[data-news-sides="1"] { grid-template-columns: minmax(0, 1fr); }
    .news-detail-match[data-news-sides="3"] { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
    .news-detail-match[data-news-sides="5"]:not(.news-detail-match--teams) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .news-detail-match[data-news-sides="5"]:not(.news-detail-match--teams) > .news-detail-side:nth-child(n) { grid-column: auto; }
    .news-detail-match[data-news-sides="5"]:not(.news-detail-match--teams) > .news-detail-side:last-child { grid-column: 1 / -1; width: calc(50% - 6px); justify-self: center; }
    .news-detail-match--teams { grid-template-columns: minmax(0, 1fr); }
    .news-detail-render { height: 185px; }
    .news-detail-match[data-news-sides="3"]:not(.news-detail-match--teams) .news-detail-render { height: 160px; }
    .news-detail-match--teams .news-detail-render { height: clamp(150px, 45vw, 240px); }
    .news-detail-name { font-size: 14px; padding: 8px 5px; }
    .news-detail-match[data-news-sides="3"] .news-detail-name,
    .news-detail-match--teams .news-detail-name { font-size: 12px; }
    .news-detail-match:not(.news-detail-match--teams) .news-detail-versus { width: 30px; height: 30px; font-size: 14px; }
    .news-detail-match--teams .news-detail-versus { position: static; justify-self: center; transform: none; margin: -4px 0; }
    .news-detail-match--teams[data-news-sides="3"] { grid-template-columns: minmax(0, 1fr); }
}