/* Weather pages, v7 design (docs/mockups/weather-pages-mock-v7.html, build spec docs/specs/weather-pages-build-specs-2026-10-13.md section 0).
   One stylesheet for every v7 weather page: tokens, headline pattern, sub-nav, underlined controls, dot charts (weather_records/dots.py), slider, heat rows, hero fact row, doors, tables.
   Everything is scoped under .wx7 so the site header and footer keep their own styles. Archivo only, sentence case, flat (no shadows), radius 3px or less, light only.
   Score ramp: darker blue is a more pleasant score (Comfortable and Ideal #124a78, Mixed #4f86b4, Rough hatched with a ring, Harsh darkest hatch). Temperature has its own scale
   (grey #bdbdb7 45 to 79, cool #2f7f98 at 44 and below, warm #b7812f at 80 and above); the two never share a chart. */
/* the page body's margin and background are set by each page (the stadium page inlines them), so this file can sit inside another page (the game page) without restyling it */
.wx7{--ink:#222;--ink0:#191919;--ink2:#45453f;--mute:#686862;--rule:#d9d9d3;--faint:#e7e7e2;--bg:#fff;--tint:#f8f8f5;
 --c:#124a78;--m:#4f86b4;--hz:#0b2a44;--band:rgba(29,104,163,.08);--cool:#2f7f98;--neu:#bdbdb7;--hot:#b7812f;
 max-width:720px;margin:0 auto;padding:0 16px 56px;background:var(--bg);color:var(--ink);font:400 16px/1.45 "Archivo","Helvetica Neue",Arial,sans-serif;font-variant-numeric:tabular-nums lining-nums}
.wx7 *{box-sizing:border-box}
.wx7 h1,.wx7 h2,.wx7 h3{font-family:"Archivo","Arial Narrow",Arial,sans-serif;font-stretch:78%;font-weight:800;color:var(--ink0);text-wrap:balance;margin:0;overflow-wrap:break-word}
.wx7 h1{font-size:clamp(30px,8.4vw,34px);line-height:1.06;margin:0 0 10px}
.wx7 h2{font-size:24px;line-height:1.1;margin:28px 0 8px}
.wx7 h3{font-size:19px;line-height:1.15;margin:16px 0 6px}
.wx7 p{margin:0 0 10px}
.wx7 a{color:inherit}
.wx7 button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;text-align:left}
.wx7 :focus-visible{outline:2px solid #222;outline-offset:2px}
.wx7 p,.wx7 h1,.wx7 h2,.wx7 h3,.wx7 ul,.wx7 ol,.wx7 .filters,.wx7 .facts,.wx7 details{max-width:640px}
.wx7 .chart,.wx7 .tw{max-width:none}
.wx7 .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* headline pattern (polish standard 1): a 17px name line, then the answer */
.wx7 .nameline{font-weight:700;font-size:17px;line-height:1.2;color:var(--ink0);margin:14px 0 4px}
.wx7 .sub{font-size:16px;color:var(--ink2);margin:0 0 10px}
.wx7 .small{font-size:14px;color:var(--mute)}
.wx7 .note{font-size:14px;color:var(--ink2)}
.wx7 .dateline{font-size:14px;color:var(--ink2);margin:6px 0 10px}
.wx7 .answer{font-size:20px;line-height:1.3;color:var(--ink0);font-weight:600;margin:8px 0 6px}
.wx7 .bw{font-size:17px;margin:6px 0 4px}
.wx7 .major{border-top:2px solid var(--ink0);padding-top:12px;margin-top:22px}
.wx7 .major>h2:first-child{margin-top:0}
/* sub-nav: one line, sideways scroll with a fade (standard 3) */
.wx7 .subnav{margin:0 -16px;border-bottom:1px solid var(--faint)}
.wx7 .subscroll{display:flex;gap:22px;overflow-x:auto;padding:0 16px;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 34px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 34px),transparent)}
.wx7 .subscroll::-webkit-scrollbar{display:none}
.wx7 .subscroll.end{-webkit-mask-image:none;mask-image:none}
.wx7 .subscroll.lead{-webkit-mask-image:linear-gradient(90deg,transparent,#000 34px,#000 calc(100% - 34px),transparent);mask-image:linear-gradient(90deg,transparent,#000 34px,#000 calc(100% - 34px),transparent)}
.wx7 .subscroll.lead.end{-webkit-mask-image:linear-gradient(90deg,transparent,#000 34px);mask-image:linear-gradient(90deg,transparent,#000 34px)}
.wx7 .subscroll a{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap;text-decoration:none;font-weight:500;color:var(--ink2);border-bottom:3px solid transparent;flex:none}
.wx7 .subscroll a[aria-current]{color:var(--ink0);font-weight:800;border-bottom-color:var(--ink0)}
/* controls: underlined text, never pills */
.wx7 .ub,.wx7 .lnk{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;display:inline-flex;align-items:center;min-height:44px;font-weight:500}
.wx7 .ub[aria-pressed="true"]{font-weight:800;text-decoration-thickness:3px}
.wx7 .filters{display:flex;flex-wrap:wrap;align-items:center;gap:0 20px;margin:0}
.wx7 .filters .fl{color:var(--ink2);font-weight:700}
.wx7 .jsonly{display:none}
.wx7.js .jsonly{display:block}
.wx7.js .filters.jsonly{display:flex}
.wx7.js .nojs{display:none}
.wx7 .pl{font-size:14px;font-weight:700;color:var(--ink2);margin:14px 0 0}
.wx7 .det{border-top:1px solid var(--faint);margin-top:14px}
.wx7 .det summary{min-height:44px;display:flex;align-items:center;cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;font-weight:500;list-style:none}
.wx7 .det summary::-webkit-details-marker{display:none}
.wx7 .det p,.wx7 .det li{font-size:14px;color:var(--ink2)}
/* hero fact row (standard 8): number 24px/800, label 13.5px */
.wx7 .facts{list-style:none;padding:0;margin:8px 0 6px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px 10px}
.wx7 .facts li{display:flex;flex-direction:column;min-width:0}
.wx7 .fn{font-stretch:78%;font-weight:800;font-size:24px;line-height:1.1;color:var(--ink0);display:flex;align-items:center;gap:5px;white-space:nowrap}
.wx7 .fl{font-size:13.5px;line-height:1.25;color:var(--ink2)}
.wx7 .gloss{font-size:16px;color:var(--ink0);margin:2px 0 0}
/* dots: five-band marks (standard 4) and the temperature scale (standard 5) */
.wx7 .dv{display:block;width:13px;height:13px;border-radius:50%;flex:none;forced-color-adjust:none}
.wx7 .dv.chip{width:12px;height:12px;display:inline-block}
.wx7 .dv-ideal,.wx7 .dv-comf{background:var(--c)}
.wx7 .dv-mixed{background:var(--m)}
.wx7 .dv-rough{background:repeating-linear-gradient(0deg,var(--c) 0 1.6px,#fff 1.6px 3.4px);border:2px solid var(--c)}
.wx7 .dv-harsh{background:repeating-linear-gradient(0deg,var(--hz) 0 2.4px,#9db3c6 2.4px 3.4px);border:2px solid var(--hz)}
.wx7 .dv-cold{background:var(--cool)}
.wx7 .dv-mid{background:var(--neu);border:1px solid #6f6f69}
.wx7 .dv-hot{background:var(--hot)}
/* charts (weather_records/dots.py) */
.wx7 .chart{position:relative;margin:10px 0 4px;container-type:inline-size}
.wx7 .plot,.wx7 .vplot{position:relative}
.wx7 .band{position:absolute;top:0;bottom:0;border-left:1px solid var(--faint)}
.wx7 .band:first-child{border-left:0}
.wx7 .band.tint,.wx7 .vband.tint{background:var(--band)}
.wx7 .bl{position:absolute;font-size:14px;line-height:18px;color:var(--ink2);white-space:nowrap}
.wx7 .co{position:absolute;font-size:14px;font-weight:700;color:var(--ink0);white-space:nowrap;line-height:20px}
.wx7 .co.l{transform:translateX(-14px)}
.wx7 .co.r{transform:translateX(calc(-100% + 14px))}
.wx7 .co.c{transform:translateX(-50%)}
.wx7 .ld{position:absolute;width:1px;background:var(--ink0);transform:translateX(-.5px)}
.wx7 .dot{position:absolute;width:44px;height:44px;display:flex;align-items:center;justify-content:center;padding:0;background:none;z-index:2}
.wx7 .dot i{pointer-events:none}
.wx7 .dot[aria-pressed="true"] i{outline:2px solid var(--ink0);outline-offset:2px}
.wx7 .dot.me i{outline:2px solid var(--ink0);outline-offset:2px}
.wx7 .dot.mine i{outline:1px solid var(--ink0);outline-offset:5px}
.wx7 .dot:focus-visible{outline:2px solid #222;outline-offset:-4px}
.wx7 .axis{height:0;border-top:1px solid #8b8b85}
.wx7 .axis.fc{border-top-style:dashed}
.wx7 .ticks{position:relative;height:24px}
.wx7 .tk{position:absolute;top:4px;transform:translateX(-50%);font-size:13.5px;line-height:18px;color:var(--ink2);white-space:nowrap}
.wx7 .readline{min-height:2.9em;font-size:15px;color:var(--ink0);margin:4px 0 6px}
.wx7 .vt .vplot{margin-top:22px}
.wx7 .vband{position:absolute;left:0;right:0}
.wx7 .vband:not(.tint){border-top:1px solid var(--faint)}
.wx7 .vbl{position:absolute;left:6px;font-size:14px;line-height:18px;color:var(--ink2);white-space:nowrap}
.wx7 .vband .vbl{top:2px}
.wx7 .gl{position:absolute;bottom:0;width:1px;background:var(--rule)}
.wx7 .gl.on{width:2px;background:var(--ink0)}
.wx7 .vl{position:absolute;transform:translateX(-50%);text-align:center;font-size:14px;line-height:18px;color:var(--ink0);white-space:nowrap;z-index:1}
.wx7 .vl b{display:block;font-weight:800;font-size:15px}
.wx7 .vl .w{display:block;font-weight:500;color:var(--ink2)}
.wx7 .vl.on b{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.wx7 .vlist,.wx7 .vlistnote{display:none}
.wx7 .vlist{list-style:none;padding:0;margin:6px 0;font-size:15px}
.wx7 .vlist li.me{font-weight:800}
@container (max-width:340px){.wx7 .vl .w{display:none}}
@container (max-width:259px){.wx7 .hs .band.last .bl{display:none}.wx7 .plot,.wx7 .vplot,.wx7 .chart .axis,.wx7 .chart .ticks{display:none}.wx7 .vlist,.wx7 .vlistnote{display:block}.wx7 .co,.wx7 .ld{display:none}}
/* hour slider: three real stops, lined up with the columns of the chart above. Columns sit at 12%, 50% and 88% of the plot (dots.GUT 92px gutter, dots.PAD 22px ends, plot = 100% - 136px);
   the thumb's centre runs from margin-left + 22px to the right edge - margin-right - 22px, so these margins put its three stops on the three columns. */
.wx7 .slider{position:relative;margin:0 calc((100% - 136px) * .12) 0 calc(92px + (100% - 136px) * .12)}
.wx7 .slider input{display:block;width:100%;height:44px;margin:0;background:none;-webkit-appearance:none;appearance:none;background:linear-gradient(var(--rule),var(--rule)) center/calc(100% - 44px) 2px no-repeat}
.wx7 .slider input::-webkit-slider-runnable-track{height:44px;background:none}
.wx7 .slider input::-moz-range-track{height:44px;background:none}
.wx7 .slider input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:44px;height:44px;border:0;border-radius:50%;background:radial-gradient(circle,#fff 0 4px,var(--ink0) 5px 9px,transparent 10px)}
.wx7 .slider input::-moz-range-thumb{width:44px;height:44px;border:0;border-radius:50%;background:radial-gradient(circle,#fff 0 4px,var(--ink0) 5px 9px,transparent 10px)}
@container (max-width:259px){.wx7 .slider{margin:0}}
/* heat rows: share of Saturdays that feel hot (warm) or cold (cool) */
.wx7 .heat .hrow{display:grid;grid-template-columns:minmax(52px,70px) minmax(0,1fr) auto;gap:10px;align-items:center;min-height:30px}
.wx7 .hl{font-size:14px}
.wx7 .htr{display:block;height:14px;background:var(--faint)}
.wx7 .hfill{display:block;height:14px;background:var(--hot);forced-color-adjust:none}
.wx7 .hfill.cold{background:var(--cool)}
.wx7 .hv{font-size:14px;font-weight:700;text-align:right;white-space:nowrap}
.wx7 .hrow.on .hl,.wx7 .hrow.on .hv{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.wx7 .heat h3{font-size:16px;font-stretch:100%;font-weight:700;margin:10px 0 2px}
/* tables */
.wx7 .tw{overflow-x:auto;margin:6px 0 10px}
.wx7 .tbl{width:100%;border-collapse:collapse;font-size:14px}
.wx7 .tbl th,.wx7 .tbl td{padding:6px 10px 6px 0;text-align:left;border-top:1px solid var(--faint);vertical-align:top;font-weight:400}
.wx7 .tbl thead th{font-weight:700;color:var(--mute);border-top:0;border-bottom:1px solid var(--ink0)}
.wx7 .tbl tbody th{font-weight:700}
.wx7 .tbl td.n,.wx7 .tbl th.n{text-align:right}
.wx7 .tbl caption{text-align:left;padding:4px 0;color:var(--mute)}
.wx7 td.on,.wx7 th.on{font-weight:800;color:var(--ink0)}
/* doors: a list of places to go next */
.wx7 ul.doors{list-style:none;padding:0;margin:6px 0 10px}
.wx7 .doors li{border-top:1px solid var(--faint)}
.wx7 .doors li>a,.wx7 .doors li>div{display:block;padding:10px 0;text-decoration:none;min-height:56px}
.wx7 .doors li b{display:block}
.wx7 .doors li>a b{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.wx7 .doors li span{display:block;font-size:14px;color:var(--ink2)}
@media(hover:hover){.wx7 .subscroll a:hover,.wx7 .doors li>a:hover,.wx7 .ub:hover,.wx7 .lnk:hover{opacity:.7}}
@media(max-width:359px){.wx7 .facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:760px){.wx7 h1{font-size:34px}}
@media(forced-colors:active){.wx7 .subscroll a[aria-current]{text-decoration:underline}.wx7 .dot[aria-pressed="true"] i,.wx7 .dot.me i,.wx7 .dot.mine i{outline-color:CanvasText}.wx7 .band.tint,.wx7 .vband.tint{background:none}}
@media(prefers-reduced-motion:reduce){.wx7 *{scroll-behavior:auto!important}}
/* inside another page (the game page's "Weather at kickoff", build spec 3): no page column of its own, the host page's gutter and background */
.wx7.wx7-in{max-width:none;margin:0;padding:0;background:transparent}
.wx7 h2.nameline{font-stretch:100%;font-size:17px;font-weight:700;margin:14px 0 4px}
.wx7 .ans{font-stretch:78%;font-weight:800;font-size:clamp(26px,7.4vw,30px);line-height:1.08;color:var(--ink0);margin:0 0 10px;text-wrap:balance}
/* a day of kickoff times: numbers without words, every other time label set lower, and a list on a narrow screen when there are more than five times */
.wx7 .ticks.st{height:50px}
.wx7 .nw .vl .w{display:none}
@container (max-width:520px){.wx7 .many .vplot,.wx7 .many .axis,.wx7 .many .ticks{display:none}.wx7 .many .vlist,.wx7 .many .vlistnote{display:block}}
/* Team page Game-day weather block (team_pages/weather_block.py): inside the drawer the chart is narrower than on the stadium page, so below 300px the middle kickoff time drops a line instead of touching its neighbours */
@container (max-width:300px){.wx7-team .vt .ticks{height:50px}.wx7-team .vt .tk:nth-child(2){top:28px}}

/* Front door (weather_records/week_v7.py, build spec 2): game lists, the two-column best/lowest block, a team select, door sub-links */
.wx7 .lab{margin:0 0 4px;font-size:14px;color:var(--ink2)}
.wx7 .sel{display:block;width:100%;max-width:640px;min-height:44px;font:inherit;font-size:16px;color:var(--ink);background:#fff;border:1px solid var(--rule);border-radius:2px;padding:0 10px}
.wx7 ul.glist{list-style:none;padding:0;margin:6px 0 10px}
.wx7 .grow{display:grid;grid-template-columns:1fr auto;gap:0 12px;padding:10px 0;border-top:1px solid var(--faint);text-decoration:none;min-height:56px;color:inherit}
.wx7 .gname{grid-column:1;font-weight:700}
.wx7 a.grow .gname{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.wx7 .gmeta{grid-column:1;font-size:14px;color:var(--ink2)}
.wx7 .gmeta .dv.chip{width:11px;height:11px;margin-right:3px;vertical-align:-1px}
.wx7 .gscore{grid-column:2;grid-row:1/3;display:flex;align-items:center;gap:6px;font-stretch:78%;font-weight:800;font-size:26px;color:var(--ink0)}
.wx7 .two{display:grid;gap:4px 28px;max-width:none}
@media(min-width:760px){.wx7 .two{grid-template-columns:1fr 1fr}}
.wx7 .doors li .inl{display:flex;align-items:center;min-height:44px;font-size:14px;color:var(--ink2);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;padding-bottom:6px}
.wx7 .dot.mine{z-index:3}
.wx7 tr.mine th,.wx7 tr.mine td{font-weight:800;color:var(--ink0)}
.wx7 .readline[hidden]{display:none}
.wx7 .det .filters{margin-top:6px}

/* Stadiums by game-day temperature and Best and worst (weather_records/stadiums_v7.py, best_worst_v7.py; build spec 5).
   Temperature is on its own scale (cool / grey / warm dots, grey bars, ink numbers); nothing here uses the blue score ramp for a temperature. */
.wx7 .filters a.ub{text-decoration-color:var(--mute)}
.wx7 .filters a.ub[aria-current="page"]{font-weight:800;text-decoration-thickness:3px;text-decoration-color:currentColor}
.wx7 .find{margin:4px 0 6px}
.wx7 .sbox{font:inherit;font-size:16px;min-height:44px;width:100%;max-width:360px;border:1px solid #8b8b85;border-radius:3px;background:#fff;color:var(--ink);padding:0 10px;-webkit-appearance:none;appearance:none}
.wx7 .find .note{margin:8px 0 0}
.wx7 .stop h2,.wx7 .all>h2{margin-top:22px}
.wx7 .slist{list-style:none;padding:0;margin:4px 0 8px}
.wx7 .srow{border-top:1px solid var(--faint)}
.wx7 .srow[hidden],.wx7 .sletter[hidden],.wx7 [data-top][hidden]{display:none}
.wx7 .srow summary{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:8px 24px 8px 0;min-height:56px;cursor:pointer;list-style:none;position:relative;align-items:baseline}
.wx7 .srow summary::-webkit-details-marker{display:none}
.wx7 .srow summary::after{content:"";position:absolute;right:6px;top:24px;width:7px;height:7px;border-right:2px solid var(--mute);border-bottom:2px solid var(--mute);transform:rotate(45deg)}
.wx7 .srow details[open]>summary::after{transform:rotate(-135deg);top:28px}
.wx7 .sn{font-weight:700;font-size:16px;line-height:1.25;overflow-wrap:anywhere}
.wx7 .sp{font-weight:500;font-size:14px;color:var(--mute)}
.wx7 .sv{display:flex;align-items:center;gap:7px;font-stretch:78%;font-weight:800;font-size:22px;line-height:1.1;color:var(--ink0)}
.wx7 .sm{grid-column:1/-1;font-size:14px;color:var(--ink2)}
.wx7 .srow.mine .dv{outline:1px solid var(--ink0);outline-offset:5px}
.wx7 .srow:target .sn{text-decoration:underline}
.wx7 .so{padding:0 0 14px;font-size:15px;line-height:1.5;color:var(--ink2)}
.wx7 .so p{margin:0 0 6px}
.wx7 .so a{display:inline-block;padding:14px 10px;margin:-14px -10px;min-width:44px;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--mute)}
.wx7 .so .small{font-size:14px}
.wx7 .ext b,.wx7 .wxs-next b{color:var(--ink0);font-weight:700}
.wx7 .sletter{list-style:none;border-top:1px solid var(--rule);padding:12px 0 0}
.wx7 .sletter h3{margin:0;font-size:22px}
.wx7 .sletter+.srow{border-top:0}
.wx7 .az{display:flex;flex-wrap:wrap;gap:0 2px;margin:0 0 8px;font-size:15px;max-width:none}
.wx7 .az a,.wx7 .az span{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}
.wx7 .az a{text-decoration:underline;text-underline-offset:3px}
.wx7 .az span{color:var(--neu)}
.wx7 .mo{display:grid;grid-template-columns:3.4em minmax(0,1fr) 4.6em;gap:6px 10px;align-items:center;max-width:440px;margin:10px 0 12px}
.wx7 .mlab{font-size:14px;color:var(--mute)}
.wx7 .mtr{position:relative;display:block;height:12px;background:linear-gradient(var(--rule),var(--rule)) center/100% 2px no-repeat}
.wx7 .mband{position:absolute;top:2px;height:8px;background:#8b8b85}
.wx7 .mmed{position:absolute;top:0;height:12px;width:2px;margin-left:-1px;background:var(--ink0)}
.wx7 .mval{font-size:15px;font-weight:800;color:var(--ink0);text-align:right;line-height:1.1}
.wx7 .mval small{display:block;font-size:13.5px;font-weight:500;color:var(--mute)}
.wx7 .maxis{position:relative;display:block;height:18px;font-size:13.5px;color:var(--mute)}
.wx7 .maxis span{position:absolute;top:0;transform:translateX(-50%)}
.wx7 .maxis span:first-child{transform:none}
.wx7 .maxis span:last-child{transform:translateX(-100%)}
.wx7 .wx-credit{font-size:14px;line-height:1.45;color:var(--mute)}
.wx7 .wx-credit a{color:var(--mute)}
/* the compare box (drawn by js/weather-stadiums.js) */
.wx7 .wxs-cmp{border-top:1px solid var(--faint);margin:14px 0 0;max-width:640px}
.wx7 .wxs-cmp>summary{min-height:44px;display:flex;align-items:center;cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;font-weight:500;list-style:none}
.wx7 .wxs-cmp>summary::-webkit-details-marker{display:none}
.wx7 .wxs-cpick{display:grid;gap:8px;margin:6px 0 4px}
.wx7 .wxs-cpick label{display:block;font-size:14px;color:var(--mute);margin:0 0 3px}
.wx7 .wxs-cpick select{font:inherit;font-size:16px;min-height:44px;width:100%;border:1px solid #8b8b85;border-radius:3px;background:#fff;color:var(--ink);padding:0 8px}
.wx7 .wxs-csay{font-size:16px;line-height:1.45;color:var(--ink2);margin:12px 0 8px}
.wx7 .wxs-small{font-size:14px;color:var(--mute)}
.wx7 .wxs-ckey{font-size:14px;color:var(--ink2);margin:0 0 6px}
.wx7 .wxs-ckey .k{display:block}
.wx7 .wxs-sw{display:inline-block;width:12px;height:8px;margin-right:6px;background:#45453f;vertical-align:baseline}
.wx7 .wxs-sw.b{background:#bdbdb7;outline:1px solid #6f6f69}
.wx7 .wxs-cg{display:grid;grid-template-columns:3.6rem minmax(0,1fr) 4.4rem;gap:5px 10px;align-items:center;padding:10px 0;border-top:1px solid var(--faint)}
.wx7 .wxs-cl{grid-row:1/span 2;font-size:14px;color:var(--mute);align-self:start;line-height:1.25}
.wx7 .wxs-cl b{display:block;font-size:14px;color:var(--ink0)}
.wx7 .wxs-bar{display:block;width:100%;height:12px}
.wx7 .wxs-bar .t-track{fill:var(--rule)}
.wx7 .wxs-bar.wxs-a .t-band{fill:#45453f}
.wx7 .wxs-bar.wxs-a .t-med{stroke:#fff;stroke-width:2;fill:none}
.wx7 .wxs-bar.wxs-b .t-band{fill:#bdbdb7}
.wx7 .wxs-bar.wxs-b .t-med{stroke:#191919;stroke-width:2;fill:none}
.wx7 .wxs-cv{font-size:15px;font-weight:800;color:var(--ink0);text-align:right;line-height:1.1}
.wx7 .wxs-cv small{display:block;font-size:13.5px;font-weight:500;color:var(--mute)}
.wx7 .wxs-cn{font-size:14px;color:var(--mute);grid-column:2/span 2}
.wx7 .wxs-cax{position:relative;height:18px;margin:0 calc(4.4rem + 10px) 0 calc(3.6rem + 10px);font-size:13.5px;color:var(--mute)}
.wx7 .wxs-cax span{position:absolute;top:0;transform:translateX(-50%)}
.wx7 .wxs-cax span:first-child{transform:none}
.wx7 .wxs-cax span:last-child{transform:translateX(-100%)}
/* best and worst: ranked rows that are links, and one details per measure */
.wx7 .blist{list-style:none;padding:0;margin:4px 0 10px}
.wx7 .brow{display:grid;grid-template-columns:2.7em minmax(0,1fr) auto;gap:0 10px;align-items:center;min-height:56px;padding:6px 0;border-top:1px solid var(--faint);text-decoration:none;color:inherit}
.wx7 .brow .br{font-size:14px;color:var(--mute)}
.wx7 .brow .bn{min-width:0;overflow-wrap:anywhere}
.wx7 .brow .bn b{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.wx7 .brow .bn small{display:block;font-size:14px;color:var(--mute)}
.wx7 .brow .bv{text-align:right;font-stretch:78%;font-weight:800;font-size:22px;line-height:1.1;color:var(--ink0)}
.wx7 .brow .bv small{display:block;font-size:14px;font-weight:500;font-stretch:100%;color:var(--mute)}
.wx7 .mdet{border-top:1px solid var(--faint);margin-top:0}
.wx7 .mdet>summary{font-weight:700}
.wx7 .mdet p.small{margin:0 0 4px}
.wx7 .mdet .note{margin:4px 0 6px}
/* the older list pages (hub, month, conference, rivalries) carry only the shared sub-nav in this stylesheet's scope */
.wx7.wx7-in .subnav{margin:0 0 14px}
.wx7.wx7-in .subscroll{padding:0}
@media(hover:hover){.wx7 .brow:hover .bn b{opacity:.7}.wx7 .srow summary:hover{opacity:.8}}
.wx7 #stadium-temps .band.tint{background:rgba(139,139,133,.14)}