.skip-link{position:fixed;z-index:1000;top:10px;left:10px;transform:translateY(-160%);padding:9px 12px;border-radius:5px;background:var(--ink);color:#fff;font-size:12px;text-decoration:none}.skip-link:focus{transform:translateY(0)}
@media(min-width:768px){.national{display:grid;grid-template-columns:150px minmax(0,1fr) 120px;grid-template-areas:"kind kind kind" "team team team" "when opponent viewing" "when competition viewing";column-gap:16px;align-items:center}.national>p{grid-area:kind}.national>h3{grid-area:team}.national>div:first-of-type{grid-area:when}.national>strong{grid-area:opponent;margin-top:0}.national>small{grid-area:competition;margin-top:3px}.national>.viewing-list{grid-area:viewing;margin-top:0}}
@media(max-width:767px){.national{display:block}.row{overflow:hidden}.row>*{min-width:0}.when{justify-self:end;width:104px}.when .time{white-space:nowrap}}
.player.has-media,.club.has-media{display:flex;align-items:center;gap:8px}.player-media,.club-media{width:28px;height:28px;flex:0 0 auto;object-fit:cover}.club-media{object-fit:contain}

/* Final CTA alignment against the approved V3 composition, using V2 color/radius language. */
.header-tagline{display:grid;justify-items:end;line-height:1.45;white-space:nowrap}.primary-nav a,.primary-nav a[aria-current=page]{border-bottom:0;color:var(--ink)}
.columns,.row{grid-template-columns:1.05fr 1.45fr .95fr 1.35fr 1.15fr .85fr 1.35fr}
.player h3{font-size:15px}.club b{font-size:12px}
.viewing-list{align-items:center;gap:8px}
.cta{min-height:37px;display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:8px 16px;border-radius:5px;font-size:12px;font-weight:650;line-height:1;white-space:nowrap;overflow-wrap:normal}
.cta.vbtv{width:auto;min-width:92px}
.availability{margin-top:5px;font-size:9px;line-height:1.3}

@media(max-width:767px){
  .header-tagline{justify-items:start;white-space:normal}
  .national{display:grid;grid-template-columns:112px minmax(0,1fr);grid-template-areas:"kind kind" "team team" "when opponent" "competition competition" "viewing viewing";column-gap:10px;padding:9px}
  .national>p{grid-area:kind}.national>h3{grid-area:team;margin-bottom:6px}.national>div:first-of-type{grid-area:when}.national>strong{grid-area:opponent;align-self:end;margin:0 0 2px}.national>small{grid-area:competition;margin-top:6px;padding-top:6px;border-top:1px solid #edf2f7}.national>.viewing-list{grid-area:viewing;margin-top:6px}
  .national-grid{gap:6px}.row{display:grid;grid-template-columns:minmax(0,1fr) 104px;grid-template-areas:"player when" "club club" "opponent opponent" "competition competition" "stage stage" "viewing viewing"}
  .player h3{font-size:16px;overflow-wrap:normal}.club b{font-size:12px}.cta{min-height:42px;padding:7px 14px;font-size:12px}.cta.vbtv{min-width:92px}.row>div:nth-child(7){margin-top:7px}.availability{margin-top:4px}
}
/* Approved mock proportion pass */
.site-frame{max-width:1232px}.header-tagline{display:grid;font-size:11px;line-height:1.5;justify-items:end}.primary-nav a{font-size:13px}.brand-wordmark{color:var(--ink)}
.hero{padding:28px 0 24px}.hero p{font-size:12px;font-weight:500}.hero h1{font-size:42px;line-height:1.3;margin:7px 0}.hero span{font-size:18px}
section{padding:22px 0 8px}section header{display:flex;align-items:baseline;gap:14px;padding-bottom:10px}section header h2{order:-1;margin:0;font-size:24px}section header p{font-size:12px;font-weight:500;letter-spacing:.02em}section header:after{display:none}
.national{display:grid;grid-template-columns:130px minmax(0,1fr) auto;grid-template-areas:"team team team" "when opponent viewing" "when competition viewing";column-gap:14px;padding:14px;border-radius:4px}.national>p{display:none}.national>h3{grid-area:team;font-size:18px;margin:0 0 12px}.national>div:first-of-type{grid-area:when}.national>strong{grid-area:opponent;font-size:15px;margin:0}.national>small{grid-area:competition;font-size:12px;line-height:1.5;margin-top:4px;padding:0;border:0}.national>.viewing-list{grid-area:viewing;align-self:center}.national span{font-size:12px;margin-bottom:5px}.national b,.when b{font-size:24px;font-weight:600}.national b:after,.when b:after{content:' JST';font-size:10px;font-weight:400}
.columns,.row{grid-template-columns:100px minmax(145px,1.3fr) 112px minmax(135px,1.2fr) minmax(110px,1fr) 86px 100px;gap:14px}.columns{font-size:12px;min-height:36px}.row{min-height:78px;font-size:13px;padding:12px 7px;line-height:1.4}.row>*{min-width:0;overflow-wrap:anywhere}.player h3{font-size:16px;font-weight:600;margin:0}.club b{font-size:13px;font-weight:600}.club small,.when small{font-size:11px;line-height:1.5}.row>div:nth-child(4){font-weight:500}.row>div:nth-child(5){font-size:12px}.row>div:nth-child(6){font-size:11px;color:#52627b}
.viewing-list{gap:6px}.cta{min-height:37px;padding:8px 15px;font-size:13px;font-weight:600;line-height:1;white-space:nowrap;overflow-wrap:normal;border-radius:4px;background:white;flex:none}.cta.vbtv{min-width:94px;background:#081f49;border-color:#081f49}.cta span{display:inline;color:inherit;font:inherit;margin:0;flex:none}.availability{font-size:11px;line-height:1.4;margin-top:5px}.footer-inner{font-size:11px}
@media(min-width:768px) and (max-width:1100px){.columns,.row{grid-template-columns:80px minmax(105px,1fr) 100px minmax(100px,1fr) minmax(90px,1fr) 70px 94px;gap:8px}.national{grid-template-columns:110px minmax(0,1fr);grid-template-areas:"team team" "when opponent" "when competition" "viewing viewing"}.national>.viewing-list{margin-top:8px}}
@media(max-width:767px){
.header-inner{min-height:80px;padding-top:12px;padding-bottom:10px}.brand-wordmark{font-size:25px}.header-tagline{font-size:10px;justify-items:start;line-height:1.4;margin-top:3px}.hero{padding:18px 0}.hero p{display:none}.hero h1{font-size:25px;line-height:1.3;margin:0 0 5px}.hero span{font-size:13px}section{padding:18px 0 4px}section header{gap:9px;padding-bottom:8px}section header h2{font-size:22px}section header p{font-size:10px}.national-grid{gap:8px;padding-top:8px}
.national{grid-template-columns:112px minmax(0,1fr);grid-template-areas:"team team" "when opponent" "when competition" "viewing competition";padding:10px;column-gap:10px;min-height:142px}.national>h3{font-size:16px;margin:0 0 7px}.national>strong{font-size:14px;align-self:start}.national>small{font-size:11px;line-height:1.4;margin:3px 0 0;align-self:start}.national span{font-size:11px;margin-bottom:3px}.national b{font-size:22px}.national>.viewing-list{margin-top:7px}.cta{min-height:40px;padding:8px 12px;font-size:12px}.cta.vbtv{min-width:86px}
.columns{display:none}.row{grid-template-columns:minmax(0,1fr) 91px 86px;grid-template-areas:"player when viewing" "club when viewing" "opponent opponent opponent" "competition competition competition" "stage stage stage";column-gap:8px;row-gap:0;min-height:0;padding:11px 0;font-size:12px;overflow:visible}.player h3{font-size:17px;line-height:1.3}.row>div:nth-child(2){margin-top:3px}.club b{font-size:12px;line-height:1.35}.club small{font-size:10px}.when{width:auto;align-self:start;justify-self:start}.when small{font-size:10px;white-space:nowrap}.when b{font-size:21px;line-height:1.3}.when b:after{font-size:8px}.row>div:nth-child(4){margin-top:4px;font-size:11px}.row>div:nth-child(5){margin-top:4px;padding:0;border:0;font-size:11px}.row>div:nth-child(6){font-size:10px}.row>div:nth-child(7){margin-top:0;align-self:start}.row .viewing-list{gap:5px}.row .cta:not(.vbtv){padding-inline:10px}.availability{font-size:10px}.footer-inner{gap:12px;font-size:10px}
}
@media(min-width:1101px){.columns,.row{grid-template-columns:100px minmax(145px,1.2fr) 112px minmax(125px,1fr) minmax(110px,1fr) 80px 196px;gap:10px}.row{min-height:72px}.viewing-list{flex-wrap:nowrap}}
@media(max-width:767px){.row{grid-template-areas:"player when viewing" "club when viewing" "opponent opponent viewing" "competition competition viewing" "stage stage viewing";align-items:start}.row>div:nth-child(7){max-width:100%}.row:has(.cta:nth-child(3)),.row:has(.availability){grid-template-areas:"player when when" "club club club" "opponent opponent opponent" "competition competition competition" "stage stage stage" "viewing viewing viewing"}.row:has(.cta:nth-child(3)) .viewing-list{margin-top:6px}.row .cta{max-width:none}}
 .edge-fixture .when b{font-size:14px;overflow-wrap:anywhere}.edge-fixture .when b:after{content:none}.edge-fixture .viewing-list{flex-wrap:wrap}.edge-fixture .row{grid-template-columns:minmax(0,1fr) 100px;grid-template-areas:"player when" "club club" "opponent opponent" "competition competition" "stage stage" "viewing viewing"}.edge-fixture .row>div:nth-child(1){grid-area:player}.edge-fixture .row>div:nth-child(2){grid-area:club}.edge-fixture .row>div:nth-child(3){grid-area:when}.edge-fixture .row>div:nth-child(4){grid-area:opponent}.edge-fixture .row>div:nth-child(5){grid-area:competition}.edge-fixture .row>div:nth-child(6){grid-area:stage}.edge-fixture .row>div:nth-child(7){grid-area:viewing}
/* Latest approved mock: compact mobile metadata and derived Today badge. */
.today{display:inline-block;font-style:normal;font-size:11px;font-weight:600;line-height:16px;padding:0 4px;color:#fff;background:#0876de;border-radius:3px;margin:0 5px 3px 0;vertical-align:baseline}
.when:has(.today)>small{display:inline}.national .today{color:white;font-size:11px}
.mobile-stage{display:none}.viewing-status{font-size:11px;color:var(--muted);line-height:1.4}
.national{grid-template-areas:"kind kind kind" "team team team" "when opponent viewing" "when competition viewing";min-height:160px}.national>p{display:block;margin-bottom:4px}
@media(max-width:767px){
.header-inner{min-height:78px}.hero{padding:16px 0}.hero h1{font-size:25px}.national{grid-template-columns:24px 88px minmax(0,1fr);grid-template-areas:"kind team team" "when when opponent" "when when competition" "viewing viewing competition";min-height:142px}.national>p{font-size:10px;align-self:start;margin:3px 0 0}.national>h3{font-size:15px;margin-bottom:6px}.national>.viewing-list{margin-top:5px}.national>small{font-size:12px}.national .today{margin-bottom:2px}
.row,.row:has(.availability){grid-template-columns:minmax(0,1fr) 102px;grid-template-areas:"player when" "club when" "opponent opponent" "competition competition" "viewing viewing";padding:10px 0;gap:0 10px}.row>div:nth-child(6){display:none}.row>div:nth-child(5){font-size:12px;line-height:1.4;margin-top:2px}.mobile-stage{display:inline}.row>div:nth-child(4){font-size:13px;margin-top:3px}.club b{font-size:13px}.club small{font-size:11px}.row>div:nth-child(7){margin-top:5px}.row .viewing-list{gap:8px}.when{justify-self:start}.when:has(.today)>small{display:block}.today{font-size:10px;line-height:14px}.when .today{float:right;margin-right:0}
.cta{min-height:36px;padding:7px 12px;position:relative}.cta:before{content:"";position:absolute;inset:-4px 0}.cta:focus-visible{outline:2px solid var(--blue);outline-offset:3px}.cta.vbtv{min-width:86px}.national .viewing-list{padding-block:4px}.row .viewing-list{padding-block:4px}.viewing-status{display:block;padding:4px 0}.edge-fixture .row>div:nth-child(6){display:none}
}
.when b{white-space:nowrap}.when:has(.today){display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:4px}.when:has(.today)>.today{float:none;margin:0}.when:has(.today)>b{grid-column:1/-1}
.national{align-content:start}
@media(max-width:767px){.row:not(.edge-fixture .row){position:relative;grid-template-areas:"player player" "club club" "opponent opponent" "competition competition" "viewing viewing"}.row:not(.edge-fixture .row)>.when{position:absolute;top:10px;right:0;width:102px;grid-area:auto}.row:not(.edge-fixture .row)>.player{padding-right:110px}.row:not(.edge-fixture .row)>.club{min-height:36px}.row:not(.edge-fixture .row)>.when:has(.today){padding-top:0}.row:not(.edge-fixture .row) .when .today{right:0;top:0;transform:translateY(-2px)}.row:not(.edge-fixture .row) .when:has(.today)>small{padding-top:15px}.national:has(.today){min-height:150px}}
@media(min-width:1101px){.columns,.row{grid-template-columns:100px minmax(140px,1.2fr) 145px minmax(120px,1fr) minmax(105px,1fr) 80px 196px;gap:10px}}
@media(max-width:767px){.when:has(.today){display:block;position:relative;padding-top:16px}.when .today{position:absolute;top:0;right:0}.row{grid-template-areas:"player when" "club club" "opponent opponent" "competition competition" "viewing viewing";align-items:start}.row>div:nth-child(2){margin-top:2px}.row .when{grid-row:1/3}.row .club{padding-right:108px}.row>div:nth-child(7){margin-top:3px}.national:has(.today){min-height:150px}.national .viewing-list{padding-block:2px}}

/* Safety notes and long provider names use the same grid in both build modes. */
.viewing-list:has(.availability),.viewing-list:has(.long-label){flex-wrap:wrap}
.viewing-list>.availability{flex-basis:100%;min-width:0;overflow-wrap:anywhere}
.national>.viewing-list{min-width:0}
.viewing-list>.cta.long-label{min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere}
.national>.viewing-list:has(.long-label){width:120px;max-width:100%}