@font-face{font-family:'Big Shoulders Display';font-style:normal;font-weight:800 900;font-display:swap;src:url(/assets/fonts/big-shoulders-display-variable-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Public Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/fonts/public-sans-variable-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Public Sans';font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/public-sans-400-italic-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
:root{color-scheme:light;--paper:#f6f3ea;--ink:#121212;--muted:#4f566b;--link:#1c3fae;--rule:#d8d6cc;--surface:#ffffff;--tint:#fde5b3;--head-bg:#1c3fae;--head-ink:#ffffff;--head-mark:#f2b300;--foot-bg:#0e1534;--foot-ink:#ffffff;--accent:#f2b300;--accent-ink:#121212;--badge-bg:#f2b300;--badge-ink:#121212;--head-rule:#f2b300;--foot-rule:#e03a2c;--warn-bg:#ffffff;--warn-ink:#c62d20;--focus:#1c3fae;--tint-rule:#d8d6cc;--tile-bg:#fde5b3;--tile-ink:#121212;--status-bg:#f2b300;--status-ink:#121212;--ok-bg:#fde5b3;--ok-ink:#121212;--claim-bg:#fde5b3;--claim-ink:#121212;--display:"Big Shoulders Display", "Arial Narrow", Impact, sans-serif;--body:"Public Sans", system-ui, "Segoe UI", sans-serif;--ui:"Public Sans", system-ui, "Segoe UI", sans-serif;--mono:"Public Sans", system-ui, "Segoe UI", sans-serif;--radius:0px;--display-weight:800}

/* site */
/* UK Esports Betting, Grand Final: the 1990s stadium final poster (owner's choice, 15 Oct 2026, concept B; mocks in
   output/esports-betting-concepts-2026-10-14/b-final). The site's own stylesheet on its own layout (layout own): no shared
   layout styles come before it. Every colour is a token of docs/sites/esports-betting/brand/final/tokens.css. */
:root{--blue:#1c3fae;--blue-deep:#142f86;--navy:#0e1534;--navy-2:#18214a;--red:#e03a2c;--red-ink:#c62d20;--gold:#f2b300;--gold-soft:#fde5b3;--chalk:#f6f3ea;--white:#ffffff;--ink:#121212;--muted:#4f566b;--line:#d8d6cc;--np-bg:#ecebe4;--np-ink:#4f566b;--on-navy-soft:#c8cfe8;--on-blue-soft:#dfe5ff;
 --head:"Big Shoulders Display","Arial Narrow",Impact,sans-serif;--dots:radial-gradient(rgba(255,255,255,.11) 1.4px,transparent 1.6px) 0 0/10px 10px}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:84px}
body{margin:0;background:var(--chalk);color:var(--ink);font:17px/1.62 var(--body);overflow-wrap:break-word}
img{max-width:100%;height:auto;display:block}
a{color:var(--blue);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--ink);text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.site-head :focus-visible,.band :focus-visible,.ft :focus-visible,.bracket :focus-visible,.gf-hero :focus-visible{outline-color:var(--gold)}
h1,h2,.lbl-h,.label.block-label,.fh{font-family:var(--head);font-weight:900;text-transform:uppercase;letter-spacing:.01em;line-height:.98}
h1{font-size:clamp(40px,6vw,78px);margin:.12em 0 .22em}
h2{font-size:clamp(30px,3.4vw,44px);margin:0 0 .45em}
h3{font-size:19px;line-height:1.3;margin:1.2em 0 .35em}
p{margin:0 0 1em}
ul,ol{margin:0 0 1.1em;padding-left:1.3em}
li{margin:.25em 0}
strong,b{font-weight:700}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--gold);color:var(--ink);padding:8px 14px;font-weight:700;border:3px solid var(--ink)}
.skip:focus{top:10px}
.kicker{display:inline-block;margin:0;background:var(--red-ink);color:var(--white);font:800 15px/1.4 var(--head);text-transform:uppercase;letter-spacing:.12em;padding:3px 12px}
.eyebrow{margin:0 0 6px;font:800 16px/1.2 var(--head);text-transform:uppercase;letter-spacing:.12em;color:var(--red-ink)}
.byline,.meta{margin:0;color:var(--muted);font-size:15px}
.byline a{font-weight:700}

/* header: the royal blue bar with the gold rule, fixed at the top */
.site-head{position:sticky;top:0;z-index:50;background:var(--blue);color:var(--white);border-bottom:6px solid var(--gold)}
.hd-in{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:62px}
.head-logo,.wm-foot{display:inline-flex;align-items:center;gap:10px;color:var(--white);text-decoration:none;font:900 24px/1 var(--head);text-transform:uppercase;letter-spacing:.03em}
.head-logo:hover,.wm-foot:hover{color:var(--white)}
.head-logo svg,.wm-foot svg{width:40px;height:40px;flex:none}
.head-nav{display:none}
.nav{display:flex;list-style:none;margin:0;padding:0}
.nav>li{margin:0;position:relative}
.nav a,.nav-more summary{display:flex;align-items:center;gap:6px;padding:20px 11px 18px;color:var(--white);text-decoration:none;font:800 17px/1 var(--head);text-transform:uppercase;letter-spacing:.06em;cursor:pointer;list-style:none}
.nav-more summary::-webkit-details-marker,.head-menu>summary::-webkit-details-marker{display:none}
.nav a:hover,.nav a[aria-current],.nav-more summary:hover,.nav-more summary[data-current],.nav-more details[open]>summary{background:var(--red-ink);color:var(--white)}
.nav-more ul{position:absolute;right:0;top:100%;width:300px;max-height:70vh;overflow:auto;list-style:none;margin:0;padding:8px 0;background:var(--navy);border:3px solid var(--ink);border-top:0;border-bottom:6px solid var(--gold)}
.nav-more li{margin:0}
.nav-more ul a{display:block;padding:9px 16px;font:600 15px/1.35 var(--body);text-transform:none;letter-spacing:0}
.nav-more ul a:hover,.nav-more ul a[aria-current]{background:var(--blue)}
.chev{flex:none}
.head-menu{position:static}
.head-menu>summary{min-height:44px;display:flex;align-items:center;gap:10px;cursor:pointer;list-style:none;padding:8px 14px;background:var(--red-ink);color:var(--white);font:800 17px/1 var(--head);text-transform:uppercase;letter-spacing:.06em;border:3px solid var(--ink)}
.menu-i{display:inline-block;width:18px;height:12px;position:relative;border-top:2px solid currentColor;border-bottom:2px solid currentColor}
.menu-i i{position:absolute;left:0;right:0;top:3px;border-top:2px solid currentColor}
.head-menu>nav{position:absolute;left:0;right:0;top:100%;max-height:calc(100vh - 70px);overflow:auto;background:var(--navy);border-bottom:6px solid var(--gold);padding:8px 16px 14px}
.head-menu ul{list-style:none;margin:0 auto;padding:0;max-width:1200px}
.head-menu li{margin:0}
.head-menu a{display:block;color:var(--white);padding:10px 4px;text-decoration:none;font:800 19px/1.2 var(--head);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--navy-2)}
.head-menu li.minor a{font:600 15px/1.35 var(--body);text-transform:none;letter-spacing:0;padding:8px 4px}
.head-menu a[aria-current]{color:var(--gold)}
@media (min-width:1024px){.head-nav{display:block}.head-menu{display:none}}

/* home: the stadium poster with the bookmakers' real logos on the banners, and the title card over it */
.gf-hero{background:var(--navy);padding:0 0 30px}
.gf-hero-img{margin:0;border-bottom:6px solid var(--gold);background:var(--navy)}
.gf-hero-img img{width:100%;aspect-ratio:2/1;max-height:min(560px,62vh);object-fit:cover;object-position:50% 0}
.hero-card{position:relative;margin-top:-96px;background:var(--chalk);color:var(--ink);padding:22px 26px;border:4px solid var(--ink);box-shadow:10px 10px 0 var(--red);max-width:880px}
.glance{margin-top:34px}
.facts{border-top:6px solid var(--ink);border-bottom:2px solid var(--ink);padding:12px 0}
.label.block-label{margin:0 0 6px;font-size:17px;font-weight:800;letter-spacing:.1em;color:var(--red-ink)}
.facts dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin:0}
.facts dl>div{padding:6px 16px 6px 0;border-right:2px solid var(--line)}
.facts dl>div:last-child{border-right:0}
.facts dt{font:800 15px/1.3 var(--head);text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.facts dd{margin:0;font-weight:700;font-size:18px;line-height:1.4}
.facts-source,.card-source,.src{font-size:14px;color:var(--muted);margin:8px 0 0}

/* the draw: seeded by our rating, on the blue bracket board */
.draw-sec{padding:64px 0 10px}
.intro{max-width:none}
.bracket{display:grid;grid-template-columns:1fr;gap:18px;align-items:center;background:var(--blue) var(--dots);color:var(--white);padding:22px;border:4px solid var(--ink);box-shadow:10px 10px 0 var(--gold)}
.semi-l{font:800 15px/1.2 var(--head);text-transform:uppercase;letter-spacing:.12em;color:var(--gold);margin:0 0 8px}
.slot{display:grid;grid-template-columns:92px minmax(0,1fr) auto;align-items:center;gap:10px;background:var(--chalk);color:var(--ink);border:3px solid var(--ink);margin:0 0 8px;padding-right:12px}
.slot-n{font:800 20px/1.1 var(--head);text-transform:uppercase}
.slot b{font:900 34px/1 var(--head)}
.slot.win{box-shadow:6px 6px 0 var(--red)}
.slot.win b{color:var(--red-ink)}
.slot.level{border-style:dashed}
.semi-n{font-size:15px;margin:0 0 4px;color:var(--on-blue-soft)}
.pair{color:var(--white);font-weight:700;font-size:16px;text-decoration-thickness:2px}
.pair:hover{color:var(--gold)}
.final{background:var(--navy);border:3px solid var(--gold);padding:16px;text-align:center}
.final p{margin:0 0 12px;font-size:15px}
.btn{display:inline-block;background:var(--gold);color:var(--ink);font:900 18px/1.2 var(--head);text-transform:uppercase;letter-spacing:.06em;padding:9px 18px;text-decoration:none;border:3px solid var(--ink)}
.btn:hover{background:var(--white);color:var(--ink)}

/* the bookmakers' own logos on their header colours */
.lp{display:flex;align-items:center;justify-content:center;background:var(--white)}
.lp img{width:auto;height:auto;max-width:86%;min-width:0}
.panel-betway{background:#000000}
.panel-unibet{background:#111111}
.panel-williamhill{background:#060a2a}
.slot-logo{height:52px;border-right:3px solid var(--ink)}
.slot-logo img{max-height:20px}
.row-b{display:inline-flex;align-items:center;gap:10px}
.row-logo{width:74px;height:30px;flex:none;border:2px solid var(--ink)}
.row-logo img{max-height:14px}

/* cards: each bookmaker as a team banner, rating badge top right */
.cards-sec{padding:56px 0 0}
.md-cards .label.block-label{font-size:clamp(26px,3vw,36px);font-weight:900;color:var(--ink);letter-spacing:.01em;margin:0 0 18px}
.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;list-style:none;margin:0 0 26px;padding:0}
.cards>li{margin:0;display:flex}
.card{background:var(--white);border:4px solid var(--ink);position:relative;padding:0 0 14px;width:100%}
.flag{display:block;filter:drop-shadow(0 4px 0 var(--ink))}
.card-logo{height:96px;clip-path:polygon(0 0,100% 0,100% 80%,50% 100%,0 80%);padding:0 96px 20px}
.card-logo img{max-height:36px;max-width:100%}
.card>*:not(.flag):not(.badge){margin-left:18px;margin-right:18px}
.badge{position:absolute;top:10px;right:10px;margin:0;background:var(--gold);color:var(--ink);border:3px solid var(--ink);padding:2px 10px;font:800 14px/1.1 var(--head);text-transform:uppercase}
.badge b{font-size:26px;font-weight:900;margin-left:2px}
.card h3{font:900 30px/1 var(--head);text-transform:uppercase;margin:12px 0 2px}
.card h3 a{color:var(--ink);text-decoration:none}
.card h3 a::after{content:"";position:absolute;inset:0}
.badge{z-index:1}
.card:focus-within,.card:hover{box-shadow:8px 8px 0 var(--gold)}
.card h3 a:focus-visible{outline:0}
.card:focus-within{outline:3px solid var(--blue);outline-offset:2px}
.card h3 a:hover{color:var(--blue);text-decoration:underline}
.domain{margin:0;color:var(--muted);font-size:14px}
.seed{font:800 15px/1.2 var(--head);text-transform:uppercase;letter-spacing:.1em;color:var(--red-ink);margin-top:6px;margin-bottom:8px}
.card dl{margin:0}
.card dl>div{display:flex;justify-content:space-between;gap:12px;border-top:2px solid var(--line);padding:7px 0}
.card dt{font-weight:700;font-size:14px}
.card dd{margin:0;text-align:right}

/* the series card: any two, area by area */
.series-sec{padding:64px 0 10px}
.series{background:var(--white);border:4px solid var(--ink);padding:20px 22px 18px;box-shadow:10px 10px 0 var(--red)}
.pick{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin:8px 0 16px}
.pk{display:grid;gap:4px}
.pk label{font:800 14px/1.2 var(--head);text-transform:uppercase;letter-spacing:.08em}
.pk select{font:600 16px/1.3 var(--body);color:var(--ink);padding:9px 10px;border:3px solid var(--ink);background:var(--chalk);min-width:180px;border-radius:0}
.pick .v{font:900 30px/1 var(--head);color:var(--red-ink);padding-bottom:8px}
.sc-hd{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:14px;align-items:center;background:var(--navy) var(--dots);color:var(--white);padding:14px;border:3px solid var(--ink)}
.sc-side{max-width:300px;justify-self:center;width:100%}
.sc-logo{height:64px;border:3px solid var(--gold)}
.sc-logo img{max-height:24px}
.sc-side p{margin:6px 0 0;font:800 20px/1.1 var(--head);text-transform:uppercase;text-align:center}
.sc-side small{display:block;color:var(--gold);font-size:14px;letter-spacing:.08em}
.sc-score{display:flex;gap:8px;align-items:center;margin:0;font:900 72px/1 var(--head);color:var(--gold)}
.sc-score span{color:var(--white)}
.tw{overflow-x:auto;margin:14px 0}
.sc-t{border-collapse:collapse;width:100%;background:var(--white);border:4px solid var(--ink);font-size:15px}
.sc-t th,.sc-t td{padding:8px 10px;border:1px solid var(--line);text-align:left;vertical-align:middle}
.sc-t thead th{background:var(--ink);color:var(--white);font:800 15px/1.2 var(--head);text-transform:uppercase;letter-spacing:.06em}
.sc-t td b{font:900 22px/1 var(--head)}
.sc-t .res{font-weight:700}
.r-a td:first-child,.r-b td:nth-child(3){background:var(--gold-soft)}
.r-np td,.r-np th{color:var(--np-ink);background:var(--np-bg)}
.r-np .res{font-style:italic;font-weight:400}
.sc-sum{font-size:14.5px;color:var(--muted);margin:0}

/* the sections: poster icons beside the headings */
.book{padding-top:10px}
.prose{max-width:none}
.wrap.prose{max-width:1200px}
.sec{margin-top:44px}
.sec-h{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.sec-h h2{margin:0}
.h-ic{width:48px;height:48px;flex:none}
body.justify .prose p,body.justify .doc-body p{text-align:justify;hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:8 4 4;text-wrap:pretty}
.lead-in{margin-top:28px;font-size:18px}
.sec-pic{margin:34px 0 0;border:4px solid var(--ink);box-shadow:10px 10px 0 var(--blue)}
.sec-pic img{width:100%}
.tablewrap{overflow-x:auto;margin:16px 0 18px}
.tablewrap table,.doc-body table{border-collapse:collapse;width:100%;min-width:520px;background:var(--white);border:4px solid var(--ink);font-size:15.5px}
.tablewrap.narrow table{min-width:0}
.tablewrap th,.tablewrap td{padding:9px 12px;border:1px solid var(--line);text-align:left;vertical-align:top}
.tablewrap thead th{background:var(--ink);color:var(--white);font:800 15px/1.2 var(--head);text-transform:uppercase;letter-spacing:.06em}
.tablewrap tbody th{font-weight:700}
.tablewrap td{color:var(--muted)}
.faq-list{margin:6px 0 0}
.faq-item{border:3px solid var(--ink);background:var(--white);margin:10px 0;padding:8px 16px}
.faq-item>summary{cursor:pointer;padding:4px 0}
.faq-item>summary h3{display:inline;font-size:18px;margin:0}
.faq-item[open]>summary{margin-bottom:6px}
.faq-item p:last-child{margin-bottom:6px}
.sources{font-size:14px;overflow-wrap:anywhere;color:var(--muted)}
.sources li{margin:.35em 0}
.panel{border:4px solid var(--ink);background:var(--white);padding:14px 18px;margin:18px 0}
.panel-warning{border-color:var(--red);box-shadow:8px 8px 0 var(--red)}
.panel-label{margin:0 0 6px;font:900 20px/1.1 var(--head);text-transform:uppercase;color:var(--red-ink)}
.panel p:last-child{margin-bottom:0}
.author{margin-top:40px;border-top:6px solid var(--ink);padding-top:14px;font-size:15px}

/* hubs, guides and reviews: the navy band */
.band,.page-hero{background:var(--navy) var(--dots);color:var(--white);padding:40px 0 34px;border-bottom:6px solid var(--gold)}
.band h1,.page-hero h1{color:var(--white)}
.band .byline,.band .meta,.page-hero .byline,.page-hero .lead{color:var(--on-navy-soft)}
.band a,.page-hero a{color:var(--gold)}
.page-hero .lead{font-size:18px;max-width:70ch;margin:0}
.band-t{min-width:0}
.rv-top{display:grid;grid-template-columns:280px minmax(0,1fr);gap:32px;align-items:center}
.banner-w{filter:drop-shadow(4px 0 0 var(--ink)) drop-shadow(-4px 0 0 var(--ink)) drop-shadow(0 4px 0 var(--ink)) drop-shadow(0 -4px 0 var(--ink))}
.banner{background:var(--white);clip-path:polygon(0 0,100% 0,100% 84%,50% 100%,0 84%);padding:0 0 40px}
.lp.big{height:124px}
.lp.big img{max-height:44px}
.seedtag{text-align:center;margin:0;font:900 22px/1.2 var(--head);text-transform:uppercase;color:var(--red-ink);letter-spacing:.08em}
.rv-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;align-items:start}
.rv-grid>.prose{grid-column:1;grid-row:1}
.sheet{grid-column:2;grid-row:1;position:sticky;top:84px;margin-top:30px;max-height:calc(100vh - 100px);overflow:auto}
.sheet-in{background:var(--white);border:4px solid var(--ink);padding:14px 16px;box-shadow:8px 8px 0 var(--gold)}
.lbl{margin:14px 0 6px;font:800 16px/1.2 var(--head);text-transform:uppercase;letter-spacing:.1em;color:var(--red-ink)}
.sheet-in>.lbl:first-child{margin-top:0}
.big-r{margin:0 0 2px;font:900 64px/1 var(--head)}
.big-r small{font-size:18px;margin-left:6px;color:var(--muted)}
.seed-l{margin:0 0 10px;font-size:14px;color:var(--muted)}
.sheet .facts{border-top:4px solid var(--ink);border-bottom:0;padding:8px 0 0}
.sheet .label.block-label{font-size:15px}
.sheet .facts dl{display:block}
.sheet .facts dl>div{border-right:0;border-top:2px solid var(--line);padding:5px 0}
.sheet .facts dt{font-size:14px;letter-spacing:.07em}
.sheet .facts dd{font-size:15px;font-weight:400}
.ascore,.rec{list-style:none;margin:0 0 10px;padding:0}
.ascore li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:10px;border-top:2px solid var(--line);padding:5px 0;margin:0;font-size:15px}
.ascore b{font:900 20px/1 var(--head)}
.ascore .bar{grid-column:1/3;display:flex;gap:3px;margin-top:4px}
.ascore .bar i{flex:1;height:6px;background:var(--np-bg)}
.ascore .bar i.on{background:var(--blue)}
.ascore small{grid-column:1/3;color:var(--np-ink);font-size:13px;line-height:1.4}
.ascore .np b{color:var(--np-ink)}
.rec li{display:grid;grid-template-columns:74px minmax(0,1fr) auto;gap:2px 10px;align-items:center;border:3px solid var(--ink);margin:0 0 6px}
.rec-logo{height:36px;border-right:3px solid var(--ink)}
.rec-logo img{max-height:14px}
.rec-n{font-weight:700;font-size:15px}
.rec b{font:900 24px/1 var(--head);padding-right:10px}
.rec small{grid-column:2/4;font-size:13px;color:var(--muted);padding-bottom:4px}
.sheet-more{margin:10px 0 0;font-weight:700;font-size:15px}

/* hubs and guides: the line-up beside the text */
.hub-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:48px;align-items:start}
.hub-grid>.prose{min-width:0}
.lineup{position:sticky;top:90px;margin-top:40px}
.lineup-in{background:var(--white);border:4px solid var(--ink);padding:14px 16px 12px;box-shadow:8px 8px 0 var(--red)}
.lineup .eyebrow{font-size:14px;margin:0}
.lineup-h{font:900 30px/1 var(--head);text-transform:uppercase;margin:2px 0 10px}
.lu{list-style:none;margin:0;padding:0}
.lu li{margin:0 0 6px}
.lu a{display:grid;grid-template-columns:26px 70px minmax(0,1fr) auto;align-items:center;gap:8px;border:3px solid var(--ink);background:var(--chalk);color:var(--ink);text-decoration:none;padding-right:10px}
.lu a:hover{background:var(--gold-soft)}
.lu-seed{align-self:stretch;display:flex;align-items:center;justify-content:center;background:var(--ink);color:var(--gold);font:900 20px/1 var(--head)}
.lu-logo{height:34px;border-right:3px solid var(--ink)}
.lu-logo img{max-height:13px}
.lu-n{font:800 18px/1.1 var(--head);text-transform:uppercase}
.lu b{font:900 24px/1 var(--head)}
.lu-more{margin:8px 0 0;font-size:15px;font-weight:700}

/* site pages (about, how we rate, legal): the shared Doc part on the band */
.doc-grid{display:grid;grid-template-columns:250px minmax(0,1fr);gap:44px;align-items:start;padding-top:34px}
.doc-toc{position:sticky;top:90px;background:var(--white);border:4px solid var(--ink);padding:12px 16px;box-shadow:8px 8px 0 var(--gold)}
.doc-toc .label{margin:0 0 6px;font:800 16px/1.2 var(--head);text-transform:uppercase;letter-spacing:.1em;color:var(--red-ink)}
.doc-toc ol{margin:0;padding-left:1.2em;font-size:15px}
.doc-toc ol.own-numbers{list-style:none;padding-left:0}
.doc-body{min-width:0}
.doc-sec{margin-bottom:36px}
.doc-sec h2{padding-top:6px;border-top:6px solid var(--ink)}
.help-links{list-style:none;padding:0}
.help-links a{display:inline-flex;align-items:center;gap:8px;font-weight:700}
.src-team{font-weight:600}

/* the 404 page */
.nf{padding:64px 0}
.nf .btn{display:inline-flex;align-items:center;gap:8px;margin-top:10px}
.nf-alt{margin-left:16px;font-weight:700}

/* footer: the navy stand */
.ft{background:var(--navy);color:var(--white);margin-top:80px;padding:34px 0 24px;border-top:8px solid var(--red)}
.ft a{color:var(--white)}
.ft a:hover{color:var(--gold)}
.ft-cols{display:grid;grid-template-columns:1.2fr repeat(4,minmax(0,1fr));gap:24px}
.fh{font-size:18px;font-weight:800;letter-spacing:.08em;color:var(--gold);margin:0 0 8px}
.ft ul{list-style:none;padding:0;margin:0}
.ft li{margin:0;font-size:15px}
.ft li>a{display:inline-block;padding:5px 0}
.ft .area{display:block;color:var(--on-navy-soft);font-size:13px}
.ft .tel{display:block;color:var(--gold);font-weight:700}
.ft-note{font-size:14px;color:var(--on-navy-soft);max-width:90ch;margin:24px 0 8px}
.age{background:var(--red-ink);color:var(--white);padding:1px 6px;margin-right:4px;font-weight:700}
.ft-bottom{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px;color:var(--on-navy-soft);margin:0}
.aff{border:2px solid var(--gold);color:var(--gold);padding:0 6px;font-weight:700}

/* tablet and phone */
@media (min-width:900px){.bracket.two{grid-template-columns:1fr minmax(200px,.8fr) 1fr}}
@media (min-width:561px) and (max-width:1060px){.sheet .facts dl{display:grid;grid-template-columns:1fr 1fr;column-gap:20px}.ascore{display:grid;grid-template-columns:1fr 1fr;column-gap:20px}}
@media (max-width:1060px){.rv-grid{grid-template-columns:1fr;gap:0}.rv-grid>.prose,.sheet{grid-column:1;grid-row:auto}.sheet{position:static;max-height:none;overflow:visible}
 .ft-cols{grid-template-columns:repeat(3,minmax(0,1fr))}.ft-brand{grid-column:1/-1}}
@media (max-width:1060px){.hub-grid{grid-template-columns:1fr;gap:0}.lineup{position:static;max-width:520px}}
@media (max-width:860px){.doc-grid{grid-template-columns:1fr;gap:24px}.doc-toc{position:static}}
@media (max-width:760px){
 body{font-size:16px}
 .wrap{padding:0 16px}
 .head-logo{font-size:20px}
 .head-logo svg{width:34px;height:34px}
 .gf-hero-img img{aspect-ratio:3/2;max-height:none;object-position:50% 50%}
 .card-logo{padding:0 104px 20px}
 .sc-t .res{white-space:nowrap}
 .hero-card{margin-top:-28px;padding:14px 16px;box-shadow:6px 6px 0 var(--red)}
 h1{font-size:clamp(36px,10.5vw,52px)}
 h2{font-size:clamp(28px,8vw,36px)}
 .facts dl{grid-template-columns:1fr}
 .facts dl>div{border-right:0;border-bottom:2px solid var(--line)}
 .facts dl>div:last-child{border-bottom:0}
 .bracket{padding:14px;box-shadow:6px 6px 0 var(--gold)}
 .slot{grid-template-columns:78px minmax(0,1fr) auto}
 .cards{grid-template-columns:1fr}
 .series{padding:14px 14px 14px;box-shadow:6px 6px 0 var(--red)}
 .pk{flex:1 1 140px}
 .pk select{min-width:0;width:100%}
 .pick .v{display:none}
 .sc-hd{padding:10px;gap:8px}
 .sc-logo{height:44px}
 .sc-logo img{max-height:16px}
 .sc-side p{font-size:16px}
 .sc-score{font-size:44px}
 .sc-t{font-size:13.5px}
 .sc-t th,.sc-t td{padding:6px}
 .sc-t thead th{font-size:13px;letter-spacing:.03em}
 .sc-t td b{font-size:18px}
 .rv-top{grid-template-columns:1fr;gap:18px}
 .banner{max-width:240px}
 .lp.big{height:88px}
 .lp.big img{max-height:32px}
 .band,.page-hero{padding:28px 0 26px}
 .ft-cols{grid-template-columns:1fr 1fr}
 .sec{margin-top:36px}
 .h-ic{width:40px;height:40px}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* heroes: the text is centred in the container (owner, 15 Oct); text fills the container width on every page */
.band,.page-hero{text-align:center}
.page-hero .lead{margin-left:auto;margin-right:auto}
.hero-card{margin-left:auto;margin-right:auto;text-align:center}
.rv-top{grid-template-columns:1fr;justify-items:center;gap:20px}
.banner{width:280px;max-width:100%}
.hub-grid>.prose,.rv-grid>.prose{max-width:none}

/* the games' own logos (publisher files, manifest records each source) on a dark plate */
.gl{display:inline-flex;align-items:center;justify-content:center;background:var(--navy-2);border:3px solid var(--gold);padding:14px 26px}
.gl img{width:auto;height:var(--gh);max-width:100%;object-fit:contain}
.gl-w{margin:0 0 14px}
.gl-s{width:100%;padding:12px 14px;border-width:3px}
.gpick-w{padding:40px 0 0}
.gpick{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.gpick li{margin:0}
.gpick a{display:flex;flex-direction:column;gap:8px;text-decoration:none;color:var(--ink);font:800 19px/1.1 var(--head);text-transform:uppercase;letter-spacing:.04em;text-align:center}
.gpick a:hover .gl,.gpick a:focus-visible .gl{background:var(--blue);box-shadow:6px 6px 0 var(--red)}
.gpick .gl-s{min-height:96px}
@media (max-width:760px){.gpick{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.gl{padding:12px 18px}}
.cards:has(>li:only-child){grid-template-columns:1fr}
.gl-light{background:var(--white)}
.gpick a:hover .gl-light,.gpick a:focus-visible .gl-light{background:var(--gold-soft)}
.gpick .gl-s{height:116px}
.gpick{align-items:start}

/* review pages: a wide comparison table scrolls inside its wrapper instead of widening the grid column (V4, 20 Oct 2026) */
.rv-grid>*{min-width:0}