/* Theme-only rules: things the static design boards did not need (menus, search, WordPress content, states). */
html{scroll-behavior:smooth}
body{margin:0;background:#F4F6FA}
.v2 [hidden]{display:none!important}
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:#FFB81C;color:#0B1630;padding:10px 16px;font-weight:700;border-radius:8px}
.skip:focus{left:12px;top:12px}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important}
.v2 a:focus-visible,.v2 button:focus-visible,.v2 input:focus-visible,.v2 summary:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* header: Teams dropdown */
.navdrop{position:relative;display:inline-flex}
.ddm{position:absolute;top:100%;left:0;z-index:30;display:none;min-width:260px;padding:8px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 40px rgba(6,14,34,.22)}
.navdrop:hover .ddm,.navdrop:focus-within .ddm{display:block}
.menu2 .ddm a{display:flex;align-items:center;gap:10px;height:auto;padding:8px 10px;border-radius:10px;color:var(--ink);font-weight:600;font-size:15px;box-shadow:none}
.menu2 .ddm a:hover{background:var(--gold-soft)}
.ddm img{width:28px;height:28px;border-radius:7px;flex:none}

/* search panel and mobile menu */
.hsearch{background:var(--night2);border-bottom:1px solid #1C2B52}
.hsearch .in{padding-top:14px;padding-bottom:14px}
.hsearch form,.psearch{display:flex;gap:10px}
.hsearch input,.psearch input{flex:1;min-width:0;height:48px;padding:0 16px;border-radius:12px;border:1px solid #2A3D6E;background:var(--night);color:#fff;font-family:var(--body);font-weight:500;font-size:16px}
.psearch{margin-top:18px;max-width:640px}
.psearch input{background:#fff;color:var(--ink);border-color:var(--line)}
.hsearch .b2,.psearch .b2{height:48px;border:0;cursor:pointer;font-family:var(--body)}
.mnav{background:var(--night);border-bottom:1px solid #1C2B52}
.mnav .in{display:flex;flex-direction:column;padding-top:6px;padding-bottom:18px}
.mnav .in>a{display:flex;align-items:center;min-height:48px;border-bottom:1px solid #1C2B52;color:#DCE4F2;font-weight:600;font-size:17px}
.mnav .in>a.on{color:#fff;box-shadow:inset 3px 0 0 var(--gold);padding-left:12px}
.mlab{margin-top:16px;font-family:var(--disp);font-weight:800;font-size:14px;letter-spacing:1px;text-transform:uppercase;color:var(--gold)}
.mteams{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px}
.mteams a{display:flex;align-items:center;gap:10px;min-height:48px;padding:6px 10px;border-radius:12px;background:var(--night2);color:#fff;font-weight:600;font-size:14.5px;line-height:1.2}
.mteams img{width:32px;height:32px;border-radius:8px;flex:none}
@media (min-width:1001px){.mnav{display:none!important}}

/* hero video buttons */
.vctl .v-paused,.vctl .v-unmuted{display:none}
.vctl .v-playing,.vctl .v-muted{display:contents}
.pic.is-paused .v-playing{display:none}
.pic.is-paused .v-paused{display:contents}
.pic.has-sound .v-muted{display:none}
.pic.has-sound .v-unmuted{display:contents}

/* news and blog lists: filters are links on the live site */
.npills a{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;background:#fff;border:1px solid var(--line);font-weight:700;font-size:14.5px;color:var(--ink)}
.npills a:hover{border-color:var(--gold)}
.npills a.on{background:var(--night);border-color:var(--night);color:#fff}
@media (max-width:640px){
 .v2 .npills{flex-wrap:nowrap;overflow-x:auto;margin:0 -16px;padding:0 16px 4px;scrollbar-width:none}
 .v2 .npills a{flex:none;min-height:38px;padding:0 14px;font-size:14px}
 .v2 .nteams{gap:4px;justify-content:space-between}
 .v2 .nteams>span,.v2 .ntm small{display:none}
 .v2 .ntm{width:auto;padding:4px 0}
 .v2 .ntm img{width:46px;height:46px;border-radius:10px}
}
a.nclr{text-decoration:none}
.bimg.lg,.fimg.lg{position:relative;display:block;background:var(--night)}
.fimg.lg{min-height:340px}
.bimg.lg img,.fimg.lg img{position:absolute;top:50%;left:50%;width:auto;height:58%;aspect-ratio:1/1;min-height:0;transform:translate(-50%,-50%);border-radius:14px;object-fit:cover}
.relg2 .rimg{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:var(--night)}
.relg2 .rimg img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;aspect-ratio:auto}
.relg2 .rimg.lg img{top:50%;left:50%;width:auto;height:58%;aspect-ratio:1/1;transform:translate(-50%,-50%);border-radius:14px}
.ntop.one{grid-template-columns:minmax(0,1fr)}
.ntop.one .nlead{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
.ntop.one .nlead .nimg{aspect-ratio:auto;min-height:380px}
.ntop.one .nlead .ntx{justify-content:center;padding:30px 32px}
@media (max-width:760px){.ntop.one .nlead{display:flex}.ntop.one .nlead .nimg{aspect-ratio:16/10;min-height:0}.ntop.one .nlead .ntx{padding:16px 16px 18px}}
.news2.one{grid-template-columns:minmax(0,1fr)}
.news2.one .lead2{min-height:480px}
.lead2 img.lgimg{object-fit:contain;padding:40px 40px 190px;background:var(--night)}
.bhead .nstat{margin-top:14px}

/* ad slots (empty until ads are switched on) */
.adslot{display:block;margin:0 auto;text-align:center;overflow:hidden}
.adslot-lb{max-width:970px;min-height:90px}
.adslot-mr{min-height:250px}
.adwrap .adslot{margin:30px auto 0}
.ntop~.adslot,.bfeat~.adslot{margin-top:30px}
.nwlist .adslot{margin:6px auto 18px}
.art2 .adslot{margin-top:28px}

/* article and page content written in WordPress */
.kpoints ul{list-style:disc}
.art2>ul:not([class]),.art2>ol:not([class]){margin:18px 0 0;padding-left:24px;font-size:18px;line-height:1.65}
.art2>ul:not([class]){list-style:disc}
.art2>ol:not([class]){list-style:decimal}
.art2>ul:not([class]) li,.art2>ol:not([class]) li{margin-top:8px}
.art2 li a{color:var(--link);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.art2>h3{font-size:24px;font-weight:800;color:var(--night);margin-top:30px}
.art2>blockquote{margin:24px 0 0;padding:4px 0 4px 20px;border-left:4px solid var(--gold);font-size:20px;line-height:1.6}
.art2>figure,.art2>.wp-block-image,.art2>.wp-block-embed{margin:26px 0 0}
.art2 img{max-width:100%;height:auto}
.art2>figure img,.art2>.wp-block-image img{border-radius:14px}
.art2 figcaption,.art2 .wp-element-caption{display:none}
.art2 iframe{max-width:100%}
.art2>.wp-block-table,.art2>table{margin-top:22px;width:100%;border-collapse:collapse;font-size:16px}
.art2>.wp-block-table table{width:100%;border-collapse:collapse}
.art2 table:not(.fxt) th,.art2 table:not(.fxt) td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left}
.pagebody{max-width:760px;margin-bottom:10px}
.pagebody>p:first-child{margin-top:22px}
.pagebody a{color:var(--link);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.bexl.nf{margin-top:24px}
.bexl.nf a{background:#fff;color:var(--ink);border-color:var(--line)}

/* narrow phones (under 400px): keep the site name on one line */
.logo .n{white-space:nowrap}
@media (max-width:400px){
 .v2 .hd .in{gap:8px}
 .v2 .logo{gap:9px}
 .v2 .logo svg{width:34px;height:34px}
 .v2 .logo .n{font-size:17px}
 .v2 .logo .s{font-size:10.5px}
 .v2 .ic{width:40px;height:40px}
}
@media (max-width:350px){.v2 .logo .s{display:none}}

/* headline ticker (top bar) */
.tick .in{gap:14px}
.tk{position:relative;flex:1;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%)}
.tk-track{display:flex;width:max-content}
.tk-list{display:flex;flex:none;margin:0;padding:0;list-style:none}
.tk-item{display:inline-flex;align-items:center;padding-right:36px;white-space:nowrap}
.tk-item::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);margin-right:10px;flex:none}
.tk-item a{display:inline-flex;align-items:center;gap:8px;color:#fff;font-weight:600}
.tk-item a:hover{color:var(--gold);text-decoration:underline;text-underline-offset:3px}
.tk-fact a{color:#D7DEEA;font-weight:500;gap:5px}
.tk-fact b{color:#fff;font-weight:600}
.tk-brk{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:4px;background:#D92D20;color:#fff;font-family:var(--disp);font-weight:800;font-size:12px;letter-spacing:.8px;text-transform:uppercase}
.tk.tk-on .tk-track{animation:tk-scroll var(--tk-dur,60s) linear infinite;will-change:transform}
.tk.tk-on:hover .tk-track,.tk.tk-on:focus-within .tk-track,.tk.tk-hold .tk-track,.tk.is-paused .tk-track{animation-play-state:paused}
@keyframes tk-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tk-btn{flex:none;width:28px;height:28px;padding:0;border-radius:50%;border:1px solid #2A3D6E;background:transparent;color:#D7DEEA;display:inline-grid;place-items:center;cursor:pointer}
.tk-btn:hover{border-color:var(--gold);color:#fff}
.tk-btn .i{width:14px;height:14px}
.tk-btn .tk-ico-play,.tk-btn[aria-pressed="true"] .tk-ico-pause{display:none}
.tk-btn[aria-pressed="true"] .tk-ico-play{display:block}
@media (max-width:640px){.tick .in{gap:10px}.tk-item{padding-right:28px;font-size:13px}}
@media (prefers-reduced-motion:reduce){.tk{overflow-x:auto;scrollbar-width:none;-webkit-mask-image:none;mask-image:none}.tk.tk-on .tk-track{animation:none}}

/* ===== responsive: every width from small phones to large screens ===== */
/* never let a wide block push the page sideways */
.v2 .tw{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.v2 img,.v2 video{max-width:100%}
.v2 .art2 p,.v2 .art2 li,.v2 .abox2 p,.v2 .pagebody p,.v2 .amail a{overflow-wrap:anywhere}

/* short team names, phone-only blocks and hidden columns (set by the theme builder from the mobile designs) */
.tshort,.m-only{display:none}
.fxlist{flex-direction:column;gap:10px}
@media (max-width:720px){
 .v2 .tfull{display:none}
 .v2 .tshort{display:inline}
 .v2 .fxt .mh,.v2 .tbl2 .mh{display:none}
 .v2 .thx{display:none}
 .v2 .fxt th,.v2 .fxt td{padding:11px 8px}
 .v2 .fxt td{font-size:14.5px}
 .v2 .fxt .tm,.v2 .tbl2 .tm{gap:8px}
 .v2 .fxt .tm img,.v2 .tbl2 .tm img{width:24px;height:24px;border-radius:6px}
 .v2 .tbl2 th,.v2 .tbl2 td{padding:10px 6px}
 /* team season-by-season table: season and finish on one line, how it ended underneath */
 .v2 .seasons thead{display:none}
 .v2 .seasons,.v2 .seasons tbody{display:block;width:100%}
 .v2 .seasons tr{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;row-gap:4px;align-items:baseline;padding:12px 10px;border-bottom:1px solid var(--line)}
 .v2 .seasons td{display:block;border:0;padding:0;background:none}
 .v2 .seasons td:nth-child(3){grid-column:1/-1;font-size:14.5px;color:var(--ink2)}
 .v2 .seasons tr.win{background:var(--gold-soft);border-radius:10px}
 .v2 .seasons tr.win td{background:none}
 /* stacked tables: one block per row, each value with its column name */
 .v2 table.stack thead{display:none}
 .v2 table.stack,.v2 table.stack tbody,.v2 table.stack tr{display:block;width:100%}
 .v2 table.stack tr{padding:12px 0;border-bottom:1px solid var(--line)}
 .v2 table.stack td{display:flex;gap:12px;border:0;padding:3px 0}
 .v2 table.stack td::before{content:attr(data-label);flex:0 0 104px;font-size:12px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);padding-top:3px}
 /* blog winners table (in the post itself): the runner-up column is left out, as in the mobile design */
 .v2 .art2 .wtab .fxt th:nth-child(3),.v2 .art2 .wtab .fxt td:nth-child(3){display:none}
}

/* tile grids */
.ptiles.p4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1180px){.v2 .ptiles.p4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){
 .v2 .ptile{padding:14px 10px}
 .v2 .ptile b{font-size:36px}
 .v2 .ptile span{font-size:13.5px}
}

/* schedule: league stage and playoff bracket stack while the side column is beside them */
@media (max-width:1180px){
 .v2 .fmt{grid-template-columns:minmax(0,1fr)}
 .v2 .brk{grid-template-columns:minmax(0,1fr)}
}

/* team pages and squads */
@media (max-width:640px){
 .v2 .kbrow{grid-template-columns:repeat(2,minmax(0,1fr))}
 .v2 .sqh{grid-template-columns:64px minmax(0,1fr);gap:14px;padding:16px}
 .v2 .sqh img{width:64px;height:77px}
 .v2 .sqh h3{font-size:24px}
 .v2 .sqh>*:nth-child(n+3){grid-column:1/-1}
}
@media (max-width:480px){
 .v2 .tjump{grid-template-columns:repeat(2,minmax(0,1fr))}
 .v2 .vgrid{grid-template-columns:minmax(0,1fr)}
 .v2 .vcard{aspect-ratio:16/9}
 .v2.v2 .vcard .cap small{display:block}
}
@media (max-width:360px){.v2 .kbrow{grid-template-columns:minmax(0,1fr)}}
@media (max-width:1180px){.v2 .stand .cbadge{display:none}}

/* header on small phones */
@media (max-width:420px){
 .v2 .logo .n{font-size:16px}
 .v2 .logo .s{font-size:10px}
}
@media (max-width:360px){
 .v2 .hd .in{gap:6px}
 .v2 .logo{gap:7px}
 .v2 .logo svg{width:30px;height:30px}
 .v2 .logo .n{font-size:15px}
 .v2 .logo .s{display:none}
 .v2 .ic{width:38px;height:38px}
 .v2 .tick .lab{padding:3px 7px;font-size:12px}
}

/* squad lists on phones: keep side padding (the mobile design had them inside a padded box) */
@media (max-width:640px){
 .v2.v2 .roles .rg{padding:12px 16px 6px}
 .v2.v2 .roles.in-panel{margin:16px -18px -18px}
}
/* net run rate example: each bar grows with its text, with room between the rows */
@media (max-width:640px){
 .v2 .nbars{gap:14px}
 .v2.v2 .nbar{gap:6px}
 .v2 .nbar b{height:auto;min-height:34px;padding:7px 12px;line-height:1.3;font-size:14px}
 .v2 .nbars+.result-line{margin-top:16px}
}

/* phone-only fixture cards up to 900px wide */
@media (max-width:900px){.v2 .m-only{display:flex}.v2 .d-only{display:none}}
/* owner and staff boxes: one per row on narrow phones */
@media (max-width:420px){.v2.v2 .facts{grid-template-columns:minmax(0,1fr)}}
/* smallest phones: the site name may wrap onto two lines */
@media (max-width:340px){.v2 .logo .n{white-space:normal;line-height:1.05}}
/* squad lists: two role columns on tablets and small laptops */
@media (min-width:641px) and (max-width:1180px){
 .v2 .roles{grid-template-columns:repeat(2,minmax(0,1fr))}
 .v2 .roles .rg:nth-child(3){border-left:0}
 .v2 .roles .rg:nth-child(n+3){border-top:1px solid var(--line)}
}
/* big tile numbers fit narrower tiles */
@media (min-width:641px) and (max-width:1180px){.v2 .ptile b{font-size:40px}}

/* team names in tables: smaller logos so the names fit; on the smallest phones the names stand alone */
.v2 .plist .tm,.v2 .sqt .tm{gap:8px}
.v2 .plist .tm img,.v2 .sqt .tm img{width:24px;height:24px}
@media (max-width:400px){.v2 .fxt .tm img{display:none}}
/* owner and staff boxes stack while the two-column layout is narrow */
@media (min-width:641px) and (max-width:1180px){.v2 .two .facts{grid-template-columns:minmax(0,1fr)}}
/* tablets and laptops: team columns wide enough for a team name on one or two lines */
@media (min-width:721px){
 .v2 .sqt th:first-child,.v2 .sqt td:first-child{min-width:150px}
}
@media (min-width:721px) and (max-width:1180px){.v2 .sqt .tfull,.v2 .plist .tfull{display:none}.v2 .sqt .tshort,.v2 .plist .tshort{display:inline}}
/* table headings may wrap below desktop width (long headings were forcing tables wider than the screen) */
@media (max-width:1180px){.v2 .fxt th{white-space:normal}}
/* tablets and small laptops: leave out the least important columns */
@media (min-width:721px) and (max-width:1180px){
 .v2 .plist th:nth-child(1),.v2 .plist td:nth-child(1),.v2 .plist th:nth-child(5),.v2 .plist td:nth-child(5){display:none}
 .v2 .stand th:nth-child(6),.v2 .stand td:nth-child(6),.v2 .stand th:nth-child(9),.v2 .stand td:nth-child(9){display:none}
}
/* auction spending table on tablets: team, purse, spent and biggest buy; small side-column tables show names without logos */
@media (min-width:721px) and (max-width:1180px){.v2 .purse th:nth-child(2),.v2 .purse td:nth-child(2),.v2 .purse th:nth-child(5),.v2 .purse td:nth-child(5){display:none}}
.v2 .panel>table.fxt .tm img{display:none}

/* news lists on the auction and team pages: published stories (links) first, then the short briefs; five rows at most */
.nlist .nrow:nth-child(n+6){display:none}
.nrow.nb:hover b{color:inherit}

/* main images that are graphics with text ("Main image is a graphic with text" in the editor box): shown whole, never
   cropped, with the headline below the image instead of on top of it */
.v2.v2 .lead.gfx{aspect-ratio:auto}
.v2.v2 .lead.gfx img{height:auto;object-fit:contain}
.v2.v2 .lead2.gfx{display:flex;flex-direction:column;min-height:0}
.v2.v2 .lead2.gfx img{position:static;height:auto;aspect-ratio:16/10;object-fit:contain}
.v2.v2 .lead2.gfx .ov{position:static;background:var(--night);border-top:1px solid rgba(255,255,255,.1)}
.v2.v2 .ntop.one .nlead.gfx .nimg{aspect-ratio:16/10;min-height:0;align-self:center}
.v2.v2 .nlead.gfx .nimg img{object-fit:contain;background:var(--night)}
.v2.v2 .bfeat.gfx .fimg{display:flex;align-items:center;background:var(--night)}
.v2.v2 .bfeat.gfx .fimg img{height:auto;min-height:0;aspect-ratio:16/10;object-fit:contain}
.v2.v2 .nsec.gfx .nimg img{object-fit:contain}

/* author box: initials and name only */
.v2 .abox2{align-items:center}
