/* Football, Explained: field green, chalk white, goal-post gold, scoreboard type */
:root{--field:#123D2A;--turf:#185236;--chalk:#F7F5EE;--ink:#14201A;--bark:#2C3832;--fog:#4A574F;--line:#DCD8CB;--line2:#E6E2D6;--gold:#F2C230;--green:#1D6B46;--link:#A63A06;--link-h:#7A2A03;
--display:Oswald,"Arial Narrow",sans-serif;--sans:Inter,system-ui,-apple-system,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--chalk);color:var(--ink);font:400 17px/1.6 var(--sans);cursor:url(/assets/football-cursor.svg) 16 16,auto}
a,button,summary,label,input,select{cursor:url(/assets/football-cursor.svg) 16 16,pointer}
input[type=search],input[type=text]{cursor:url(/assets/football-cursor.svg) 16 16,text}
a{color:var(--link);text-underline-offset:2px}a:hover{color:var(--link-h)}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
img{max-width:100%}
.skip{position:absolute;left:-999px;top:0;background:var(--gold);color:var(--ink);padding:10px 14px;z-index:20}.skip:focus{left:8px;top:8px}
.wrap{max-width:1160px;margin:0 auto;padding:0 20px}
/* header */
.top{background:var(--field);color:var(--chalk);border-bottom:6px solid var(--gold)}
.top .wrap{display:flex;flex-direction:column;gap:14px;padding-top:16px;padding-bottom:20px}
.top-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px}
.brand{display:flex;align-items:center;gap:10px;color:var(--chalk);text-decoration:none;font:700 26px/1 var(--display);letter-spacing:.02em;text-transform:uppercase}
.brand:hover{color:#fff}
.nav{display:flex;flex-wrap:wrap;gap:2px 18px;font:500 15px var(--display);letter-spacing:.08em;text-transform:uppercase}
.nav a{color:var(--chalk);text-decoration:none;padding:8px 0;border-bottom:3px solid transparent}
.nav a:hover,.nav a[aria-current=page]{border-bottom-color:var(--gold);color:#fff}
.search{position:relative}
.search label{display:block;font:600 12px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:#CFE3D6;margin-bottom:6px}
.search input{width:100%;min-height:50px;padding:12px 16px;font:500 17px var(--sans);color:var(--ink);background:#fff;border:2px solid var(--chalk);border-radius:10px}
.search-results{position:absolute;left:0;right:0;top:100%;margin-top:6px;background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.25);max-height:70vh;overflow:auto;z-index:30;padding:6px}
.search-results[hidden]{display:none}
.search-results a{display:block;padding:10px 12px;border-radius:8px;text-decoration:none;color:var(--ink)}
.search-results a:hover,.search-results a:focus{background:#F1EEE4}
.search-results .k{display:block;font:700 11px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--green)}
.search-results .t{display:block;font-weight:600}
.search-results .s{display:block;font-size:14px;color:var(--fog);line-height:1.45}
.search-results .none{padding:12px;color:var(--fog);font-size:15px}
/* content */
main{padding:28px 0 56px}
h1,h2,h3{font-family:var(--display);text-transform:uppercase;color:var(--field);line-height:1.1;letter-spacing:.01em}
h1{font-size:clamp(34px,6vw,54px);margin:12px 0 12px}
h2{font-size:30px;margin:40px 0 10px}
h3{font-size:20px;margin:24px 0 8px}
.lede{font-size:19px;color:var(--bark);max-width:760px;margin:0 0 20px}
.meta{font-size:14px;color:var(--fog)}
.crumb{font-size:14px;color:var(--fog);margin:0}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.card h3{margin:0 0 6px}
a.card{display:block;text-decoration:none;color:var(--ink)}a.card:hover{border-color:var(--green)}
a.card b{display:block;font:700 19px/1.2 var(--display);text-transform:uppercase;color:var(--field);margin-bottom:4px}
a.card span{font-size:15px;color:var(--bark)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:8px 0 8px}
.stat{background:var(--field);color:#E3EEE7;border-radius:12px;padding:14px 16px;font-size:14px;line-height:1.4}
.stat b{display:block;font:700 32px/1.1 var(--display);color:var(--gold)}
.game{display:flex;flex-direction:column;gap:6px}
.game .when{display:flex;justify-content:space-between;gap:8px;font-size:13px;color:var(--fog);font-weight:600}
.game .when em{font-style:normal;color:var(--green);font-weight:700}
.game .row{display:flex;justify-content:space-between;gap:8px;font-weight:600}
.game .row span{font-weight:400;color:var(--fog);font-variant-numeric:tabular-nums}
.score{font-size:15px}.score b{font-weight:700}
.qa{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 20px;margin:12px 0;scroll-margin-top:16px}
.qa h2{font:600 21px/1.3 var(--sans);text-transform:none;color:var(--ink);margin:0 0 8px;letter-spacing:0}
.qa p{margin:0 0 8px;color:var(--bark)}
.qa .src{font-size:13.5px;color:var(--fog);margin:0}
.qa:target{border-color:var(--gold);box-shadow:0 0 0 3px rgba(242,194,48,.35)}
.toc{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 4px;padding:0;list-style:none}
.toc a{display:inline-block;min-height:40px;padding:8px 14px;border:2px solid var(--field);border-radius:999px;font:600 14px var(--sans);text-decoration:none;color:var(--field);background:#fff}
.toc a:hover,.toc a[aria-current=page]{background:var(--field);color:var(--chalk)}
.div{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.div h3{margin:0;padding:10px 16px;background:var(--turf);color:var(--chalk);font-size:18px;letter-spacing:.06em}
.team{padding:10px 16px;border-top:1px solid #EEEBE1;display:flex;flex-direction:column;gap:2px}
.team .tr{display:flex;justify-content:space-between;gap:8px}
.team .tr a{font-weight:700;color:var(--ink);text-decoration:none}.team .tr a:hover{color:var(--link)}
.team .tr span{font:600 17px var(--display);color:var(--field);font-variant-numeric:tabular-nums}
.team small{font-size:13px;color:var(--fog)}
.quote{margin:0;background:var(--field);color:var(--chalk);border-radius:12px;padding:20px 22px;display:flex;flex-direction:column;gap:10px}
.quote blockquote{margin:0;font:500 21px/1.3 var(--display)}
.quote figcaption{font-size:13px;color:#CFE3D6}.quote a{color:var(--gold)}
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}
.steps li{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 18px;display:flex;flex-direction:column;gap:6px}
.steps .n{font:700 28px/1 var(--display);color:var(--green)}
.steps b{font-size:17px}.steps .src{font-size:13px}
.callout{display:inline-block;background:var(--gold);color:var(--ink);border-radius:10px;padding:12px 16px;font-weight:600;margin:4px 0 16px}
.callout a{color:var(--ink)}
dl.gloss{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:4px 28px;margin:0}
dl.gloss div{padding:10px 0;border-bottom:1px solid var(--line2);scroll-margin-top:16px}
dl.gloss dt{font-weight:700;color:var(--field)}dl.gloss dd{margin:4px 0 0;color:var(--bark);font-size:16px}
ul.sources{columns:2 320px;column-gap:32px;font-size:15px;padding-left:18px}
ul.sources li{break-inside:avoid;margin-bottom:6px}
table.t{width:100%;border-collapse:collapse;font-size:15px;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
table.t th,table.t td{padding:9px 12px;border-bottom:1px solid var(--line2);text-align:left}
table.t td.n{text-align:right;font-variant-numeric:tabular-nums}
.tw{overflow-x:auto}
footer{background:var(--field);color:#CFE3D6;font-size:14px}
footer .wrap{padding:28px 20px;display:flex;flex-direction:column;gap:6px}
footer b{font:700 20px var(--display);text-transform:uppercase;color:var(--chalk)}
footer a{color:var(--gold)}
footer nav{display:flex;flex-wrap:wrap;gap:4px 16px}
/* Simpler navigation (Oct 30): three doors, a short FAQ list, and a pager on section pages */
.doors{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin:8px 0 8px}
a.card.door{padding:22px 22px;border-width:2px}
a.card.door b{font-size:26px}
ul.faq{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:8px}
ul.faq a{display:block;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 16px;font-weight:600;text-decoration:none;color:var(--ink)}
ul.faq a:hover{border-color:var(--green);color:var(--link)}
.pager{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:28px 0 0;padding-top:16px;border-top:2px solid var(--line)}
.pager a{font-weight:700;text-decoration:none;padding:10px 0}
.pager a.next{margin-left:auto;background:var(--field);color:var(--chalk);padding:12px 18px;border-radius:10px}
.pager a.next:hover{background:var(--turf);color:#fff}