/* Content-width reflow also works when content is enlarged independently of viewport queries. */
body{container-type:inline-size;container-name:site}
@container site (max-width:1000px){
 .header{flex-wrap:wrap;gap:0;padding-top:14px}.header .languages{margin-left:auto;margin-right:10px}.header .header-save{width:36px;height:36px;padding:4px;font-size:18px}.header .header-save span{display:none}
 .header nav{order:3;flex-basis:100%;width:100%;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;margin:13px 0 11px;height:auto;overflow:visible}.header nav a{height:40px;min-height:40px;font-size:11px;padding:0 3px;justify-content:center}.header nav a.active:after{left:22%;right:22%}
 #standings-root .portal-two{grid-template-columns:minmax(0,1fr)}
}
@container site (max-width:760px){
 .wrap{padding-left:16px;padding-right:16px}.header .logo{font-size:30px}.header .languages button{padding:5px 7px;min-width:30px;font-size:9px}.header nav a{font-size:10px}
 main .layout,main .news-layout,main .detail-layout,main .portal-two{display:flex;flex-direction:column;align-items:stretch;gap:18px}
 main .layout>.primary,main .layout>aside,main .news-layout>div,main .news-layout>aside,main .detail-layout>article,main .detail-layout>aside,main .portal-two>section,main .portal-two>article,main .portal-two>aside{width:100%;min-width:0;max-width:100%}
 main aside,#standings-root .portal-two>aside{display:flex;flex-direction:column;align-items:stretch}
 .intro{flex-direction:column;align-items:flex-start;gap:18px}.day-stats{border:0;padding-left:0}.spotlight{grid-template-columns:1fr}.spotlight-tip{display:block}.spotlight-score{grid-template-columns:1fr 110px 1fr}
 .portal-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.lead-story{grid-template-columns:1fr}.news-intro{display:block}.edition{display:none}.article-heading{padding:22px 20px}.article-prose{padding:22px 20px}.related-grid{grid-template-columns:1fr}.related-card{display:grid;grid-template-columns:110px minmax(0,1fr)}.related-card .editorial-art{height:100%;min-height:130px}.related-card .art-type{font-size:15px}
 .select-row{flex-wrap:wrap}.select-row input{flex-basis:100%}.select-row select{max-width:none;flex:1}.score-panel .section-head{flex-direction:column;align-items:flex-start}
 .news-strip{display:block}.news-strip #news-cards{display:flex;flex-direction:column;margin-top:10px;gap:10px}.footer{flex-wrap:wrap}.footer>div:nth-child(2){flex-wrap:wrap;margin:0}.footer small{width:100%}
 .table-detail-toggle{display:inline-flex;min-height:36px;align-items:center;background:white;border:1px solid #c4d5ef;border-radius:4px;color:var(--blue);font-size:12px;padding:7px 12px;margin-bottom:12px}
 .standings-page:not(.show-details) .rank-table{min-width:0;width:100%}.standings-page:not(.show-details) .rank-table :is(th,td):is(:nth-child(4),:nth-child(5),:nth-child(6),:nth-child(7),:nth-child(8),:nth-child(11)){display:none}.standings-page:not(.show-details) .rank-club{min-width:0;font-size:12px;gap:6px}.standings-page:not(.show-details) .rank-club span{overflow-wrap:anywhere}.standings-page:not(.show-details) .rank-table :is(th,td){padding:12px 5px}.standings-page.show-details .rank-table{min-width:690px}
}
@container site (max-width:600px){
 .portal-cards,#analysis-cards.tips-grid{grid-template-columns:1fr}.portal-cards>.live-page-card:only-child{display:block}.portal-cards>.live-page-card:only-child>.stream-preview{height:180px;min-height:0;margin-bottom:18px}
 .full-score h2{font-size:15px;overflow-wrap:anywhere}.score-middle>b{font-size:32px}.full-score .crest{width:48px;height:55px;min-width:48px}.full-score{gap:10px}.quick-links{gap:7px}.quick-links>a{font-size:11px;padding:9px 10px}.match-hero{padding:18px 14px}
 #matches .match{grid-template-columns:36px minmax(0,1fr) 34px minmax(0,1fr) 19px;gap:5px}#matches .row-actions{order:6;grid-column:2/5;justify-content:flex-start}#matches .star{order:5;grid-column:5}#matches .club{font-size:11px;gap:5px}#matches .club .crest{width:23px;height:27px;min-width:23px}
 .fixture-link{grid-template-columns:38px minmax(0,1fr) 35px minmax(0,1fr);gap:5px}.fixture-club{font-size:11px;gap:5px}.fixture-club .crest{width:23px;height:27px;min-width:23px}.fixture-save{min-width:26px;width:26px}.fixture-time{font-size:10px}
 .news-feed .story-row{grid-template-columns:90px minmax(0,1fr);gap:13px}.story-row p{display:none}.story-row h3{font-size:16px}.story-row .art-type{font-size:14px}.story-arrow{display:none}.lead-copy h2{font-size:25px}.article-heading h1{font-size:28px}.news-intro h1,.portal-heading h1{font-size:28px}.news-controls .chips{max-width:100%}.news-controls input{width:100%}
 .overview-grid{gap:10px}.overview-grid>div{padding:12px}.overview-grid b{font-size:12px}.author-line{flex-wrap:wrap}.author-line button{margin-left:0}.article-contents{display:none}
}
@container site (max-width:400px){
 .header nav a{font-size:9px}.header nav a[data-i=analysis]:before,.header nav a[data-i=watch]:before{display:none}.header .logo{font-size:27px}.header .languages{margin-right:7px}.header .languages button{min-width:27px;padding:4px 5px}.utility{font-size:8px}.day-stats{gap:25px}
 #watch .home-stream-preview{grid-template-columns:46px 40px 46px;gap:18px;padding-left:10px;padding-right:10px}#watch .home-stream-preview>.club-badge{width:46px;min-width:46px;height:54px}
 .fixture-link{grid-template-columns:34px minmax(0,1fr) 32px minmax(0,1fr);gap:4px}.fixture-club{font-size:10px}.fixture-club .crest{width:21px;min-width:21px}.live-tabs{flex-wrap:wrap}
}
@container site (max-width:340px){.header nav a{font-size:8px;padding-left:2px;padding-right:2px}}
@container site (max-width:340px){.header nav a[data-i=navStandings]{letter-spacing:-.2px}}
/* Align related content navigation with its panel edges. */
.portal-controls .chips{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));width:100%;gap:7px;overflow:visible}
.match-tabs,.news-controls .chips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;gap:7px;overflow:visible}
.portal-controls .chips button,.match-tabs button,.news-controls .chips button{display:flex;align-items:center;justify-content:center;text-align:center;width:100%;min-width:0;margin:0;padding:10px 5px;white-space:normal;overflow-wrap:anywhere;line-height:1.5;min-height:38px}
.standings-page .table-tabs{max-width:none;width:100%}
.table-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}
.table-tabs button{min-width:0;white-space:normal;text-align:center}
@container site (max-width:500px){.portal-controls .chips,.match-tabs,.news-controls .chips{gap:5px}.portal-controls .chips button,.match-tabs button,.news-controls .chips button{font-size:10px;padding:8px 3px;min-height:40px}}
main .chips button:focus-visible,.table-tabs button:focus-visible,.dates button:focus-visible,.score-shortcuts button:focus-visible{outline:2px solid #155eef;outline-offset:2px}
