/* aahl.beer public site: the Broadcast design (operator pick, 2026-10-29) with the Team colours
   split cards and ghost logos. Phone first; the Game TV board (board/) is the 42-inch sibling.
   CSP allows no inline styles, so team colours are .tm-<slug> classes and per-element values
   (stagger, ticker length) are set through the CSSOM by site.js. */
@font-face{font-family:'Barlow Condensed';font-weight:600;font-display:swap;src:url(/fonts/BarlowCondensed-SemiBold.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-weight:700;font-display:swap;src:url(/fonts/BarlowCondensed-Bold.woff2) format('woff2')}
@font-face{font-family:'Barlow Condensed';font-weight:800;font-display:swap;src:url(/fonts/BarlowCondensed-ExtraBold.woff2) format('woff2')}
@font-face{font-family:'Barlow';font-weight:600;font-display:swap;src:url(/fonts/Barlow-SemiBold.woff2) format('woff2')}

:root{
  color-scheme:dark;
  --bg:oklch(17% 0.025 220);--bg2:oklch(22% 0.03 215);--card:oklch(25% 0.035 215);--card2:oklch(31% 0.04 213);
  --line:oklch(100% none none / .13);--ink:oklch(100% none none);--dim:oklch(82% 0.02 200);
  --acc:oklch(70% 0.16 42);--acc2:oklch(65% 0.17 38);--on-acc:oklch(18% 0.02 60);--pen:oklch(51% 0.18 25);
  --disp:'Barlow Condensed','Arial Narrow',sans-serif;--body:'Barlow',system-ui,sans-serif;
  --pad:clamp(14px,4vw,32px);--bar:calc(58px + env(safe-area-inset-top));--nav-size:clamp(.675rem,.125rem + 3.125vw,1.1875rem);
  --ease-out:cubic-bezier(.23,1,.32,1);
}
/* Panel fill and text colour per team (the Team colours concept). */
.tm-maltby-sports{--tbg:oklch(48% 0.16 42);--tfg:oklch(100% none none)}
.tm-ultramar{--tbg:oklch(45% 0.17 262);--tfg:oklch(100% none none)}
.tm-super-8-amherst{--tbg:oklch(90% 0.17 100);--tfg:oklch(22% 0.02 30)}
.tm-gr-mitchell-welding{--tbg:oklch(36% 0.015 240);--tfg:oklch(100% none none)}
.tm-coldwell-banker-performance-realty{--tbg:oklch(30% 0.12 265);--tfg:oklch(100% none none)}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--bg);scroll-padding-block-start:calc(var(--bar) + 70px)}
body{margin:0;min-block-size:100dvh;color:var(--ink);font:600 1rem/1.35 var(--body);
  background:radial-gradient(120vmax 80vmax at 85% -10%,oklch(32% 0.045 215),var(--bg) 60%) no-repeat var(--bg);padding-block-end:calc(32px + env(safe-area-inset-bottom));padding-inline:env(safe-area-inset-left) env(safe-area-inset-right)}
img{display:block;max-inline-size:100%}
button{font:inherit;color:inherit}
a{color:inherit}
:where(button,a):focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.num{font-variant-numeric:tabular-nums}
[hidden]{display:none!important}
.skip{position:absolute;inset-inline-start:8px;inset-block-start:-60px;z-index:9;background:var(--acc);color:var(--on-acc);padding:10px 14px;font:800 1rem/1 var(--disp)}
.skip:focus-visible{inset-block-start:8px}

/* bar + tabs */
.bar{position:sticky;inset-block-start:0;z-index:3;display:flex;align-items:stretch;block-size:var(--bar);padding-block-start:env(safe-area-inset-top);
  background:linear-gradient(90deg,oklch(28% 0.04 215),oklch(21% 0.03 215));border-block-end:3px solid var(--acc2)}
.brand{display:flex;align-items:center;gap:10px;padding-inline:var(--pad) 34px;background:var(--acc2);color:oklch(20% 0.02 200);text-decoration:none;
  clip-path:polygon(0 0,100% 0,calc(100% - 22px) 100%,0 100%)}
.brand b{font:800 2.25rem/1 var(--disp);letter-spacing:.02em}
.brand span{font:800 0.9375rem/1 var(--disp);letter-spacing:.07em;text-transform:uppercase}
.season{margin-inline-start:auto;align-self:center;padding-inline-end:var(--pad);font:700 1.125rem/1 var(--disp);letter-spacing:.12em;color:var(--dim);white-space:nowrap}
@media (max-width:460px){ .brand span{display:none} .brand{padding-inline-end:28px} }
.tabs{position:sticky;inset-block-start:var(--bar);z-index:2;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;padding-block:8px;padding-inline:8px;background:oklch(17% 0.025 220 / .92);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow-x:auto;scrollbar-width:none;overscroll-behavior-inline:contain}
.tabs a{min-inline-size:0;display:grid;place-items:center;padding-block:10px 8px;padding-inline:2px;min-block-size:44px;text-decoration:none;
  font:800 var(--nav-size)/1 var(--disp);letter-spacing:.01em;text-transform:uppercase;color:var(--dim);border-block-end:3px solid transparent}
.tabs a[aria-current=page]{color:var(--ink);border-block-end-color:var(--acc)}
.tabs a:active{opacity:.75}

/* page */
.pane{padding-inline:var(--pad);max-inline-size:1100px;margin-inline:auto;container-type:inline-size}
.hd{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px;margin-block:22px 14px}
.slab{margin:0;font:800 1.75rem/2.75rem var(--disp);letter-spacing:.04em;background:var(--card2);block-size:44px;padding-inline:14px 34px;
  clip-path:polygon(0 0,100% 0,calc(100% - 16px) 100%,0 100%);border-inline-start:6px solid var(--acc);white-space:nowrap}
.sub{font:700 1.125rem/1 var(--disp);color:var(--dim);letter-spacing:.05em}
@container (min-width:860px){ .two{display:grid;grid-template-columns:1.05fr 1fr;gap:28px;align-items:start} }
.foot{margin-block-start:26px;font:700 0.9375rem/1.3 var(--disp);color:var(--dim);letter-spacing:.06em}
.note{margin-block-start:14px;background:var(--bg2);border-inline-start:4px solid var(--line);padding:12px 14px;font:600 0.9375rem/1.45 var(--body);color:var(--dim)}
.note a{color:var(--acc)}
.link{text-decoration:none}
.link:active{opacity:.75}
.back{display:inline-flex;align-items:center;gap:6px;margin-block-start:16px;min-block-size:44px;font:800 1rem/1 var(--disp);letter-spacing:.1em;text-transform:uppercase;color:var(--dim);text-decoration:none}
@media (prefers-reduced-motion:no-preference){
  .rise{animation:rise .38s var(--ease-out) both;animation-delay:calc(var(--i,0) * 45ms)}
  @keyframes rise{from{opacity:0;translate:0 14px}}
}

/* ticker */
.ticker{display:flex;align-items:stretch;margin-block-start:14px;background:var(--bg2);border-block:1px solid var(--line);overflow:clip}
.ticker b{flex:none;position:relative;z-index:1;display:grid;place-items:center;padding-inline:10px 22px;background:var(--acc2);color:var(--on-acc);font:800 1rem/1 var(--disp);letter-spacing:.1em;
  clip-path:polygon(0 0,100% 0,calc(100% - 12px) 100%,0 100%)}
.ticker .run{display:flex;inline-size:max-content;min-inline-size:200%;justify-content:space-around;gap:40px;padding-block:11px;white-space:nowrap;font:700 1.1875rem/1 var(--disp);padding-inline:20px}
.ticker .run span{flex:none}
.ticker .run span::before{content:'';display:inline-block;inline-size:7px;block-size:7px;background:var(--acc);margin-inline-end:10px;vertical-align:middle;rotate:45deg}
@media (prefers-reduced-motion:no-preference){ .ticker .run{animation:crawl var(--dur,60s) linear infinite} }
@keyframes crawl{to{translate:-50% 0}}

/* next-game split card (Team colours) + comparison rows */
.split{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto auto;min-block-size:250px;overflow:clip;border-block-start:4px solid var(--acc)}
.next-card{display:block}
.next-card + .next-card{margin-block-start:16px}
.next-card:focus-visible{outline-offset:-4px}
.next-card:active{opacity:.85}
.split .half{position:relative;display:grid;grid-template-rows:subgrid;grid-row:1/3;background:var(--tbg);color:var(--tfg);overflow:clip;isolation:isolate;text-decoration:none}
.split .half:first-of-type{grid-column:1}
.split .half:nth-of-type(2){grid-column:2;text-align:end}
.half-content{grid-row:1;display:grid;align-content:start;gap:4px;padding-block:38px 18px;padding-inline:16px}
.half:nth-of-type(2) .half-content{justify-items:end}
.ghost{position:absolute;z-index:-1;max-inline-size:none;pointer-events:none}
.split .ghost{inline-size:190%;inset-block-start:50%;opacity:.17;filter:grayscale(1) contrast(1.4);mix-blend-mode:luminosity;translate:0 -50%;rotate:-12deg}
.split .half:first-of-type .ghost{inset-inline-end:-35%}
.split .half:nth-of-type(2) .ghost{inset-inline-start:-35%}
.tile{inline-size:76px;block-size:76px;display:grid;place-items:center;background:var(--tbg);box-shadow:0 6px 18px oklch(0% none none / .3)}
.tile.dark{background:oklch(20% 0.015 240)}
.tile img{inline-size:82%;block-size:82%;object-fit:contain}
.split .nm{font:800 1.625rem/.95 var(--disp);margin-block-start:12px}
.split .ha{font:800 0.875rem/1 var(--disp);letter-spacing:.12em}
.split .vs{position:absolute;inset-block-start:16px;inset-inline:0;margin-inline:auto;inline-size:max-content;font:800 0.9375rem/1 var(--disp);letter-spacing:.12em;
  background:oklch(0% none none / .55);color:oklch(100% none none);padding:6px 10px 5px}
.split .when{grid-row:2;z-index:1;grid-column:1/-1;justify-self:center;margin-block:12px 16px;max-inline-size:100%;display:grid;justify-items:center;
  background:oklch(100% none none);color:oklch(20% 0.02 255);padding:10px 18px 9px;box-shadow:0 8px 24px oklch(0% none none / .3);clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%)}
.split .when .d,.split .when .r{font:800 0.875rem/1 var(--disp);letter-spacing:.1em;text-transform:uppercase;color:oklch(45% 0.02 255)}
.split .when .r{font-weight:700;font-size:0.8125rem}
.split .when .t{font:800 2.25rem/1 var(--disp);margin-block:3px}
@container (min-width:860px){ .split{min-block-size:320px} .split .tile{inline-size:104px;block-size:104px} .split .nm{font-size:2.125rem} }
.cmp{display:grid;grid-template-columns:1fr auto 1fr;background:var(--card);padding:4px 12px 8px;font:700 1.25rem/1 var(--disp)}
.cmp>*{padding-block:9px;border-block-start:1px solid var(--line)}
.cmp>:nth-child(-n+3){border-block-start:0}
.cmp .k{color:var(--dim);font-size:0.9375rem;letter-spacing:.1em;text-transform:uppercase;text-align:center;padding-inline:8px;display:grid;place-items:center}
.cmp .r{text-align:end}

/* team tiles: the big ghost logos in team colours */
.teams{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.teams>:last-child:nth-child(odd){grid-column:1/-1}
@container (min-width:52rem){.teams{grid-template-columns:repeat(5,minmax(0,1fr))}.teams>:last-child:nth-child(odd){grid-column:auto}}
.team-tile{position:relative;display:grid;align-content:end;gap:6px;min-block-size:130px;padding:12px;background:var(--tbg);color:var(--tfg);overflow:clip;isolation:isolate;text-decoration:none}
.team-tile .ghost{inline-size:150%;inset-inline-end:-55%;inset-block-start:-25%;opacity:.2;filter:grayscale(1) contrast(1.4);mix-blend-mode:luminosity;rotate:-12deg}
.team-tile .tile{inline-size:52px;block-size:52px;position:relative}
.team-tile b{font:800 1.375rem/1 var(--disp)}
.team-tile span{font:800 0.875rem/1 var(--disp);letter-spacing:.1em}
.team-tile:active{scale:.98}

/* score bugs */
.bugs{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr))}
.bug{display:grid;grid-template-columns:1fr auto;background:var(--card);border-inline-start:6px solid var(--tbg,var(--card2))}
.bug .rows{padding:6px 0}
.bug .row{display:grid;grid-template-columns:40px 1fr auto;align-items:center;gap:10px;padding:5px 12px;font:700 1.4375rem/1 var(--disp);color:var(--dim)}
.bug .row span:nth-child(2){min-inline-size:0;overflow:clip;text-overflow:ellipsis;white-space:nowrap}
.bug .row.w{color:var(--ink)}
.bug .row img{inline-size:34px;block-size:34px;object-fit:contain}
.bug .row .s{font:800 2rem/1 var(--disp);min-inline-size:1.2ch;text-align:end}
.bug .row.w .s{color:var(--acc)}
.bug .meta{display:grid;align-content:center;justify-items:end;gap:6px;padding-inline:12px;background:var(--bg2);font:700 0.9375rem/1 var(--disp);letter-spacing:.08em;color:var(--dim);text-transform:uppercase}
.bug .meta b{font-weight:800;color:var(--ink);background:oklch(100% none none / .14);padding:4px 7px 3px}
.bug .meta .rc{color:var(--acc);font-weight:800}

/* stories */
.story{display:block;background:var(--card);padding:16px;border-inline-start:6px solid var(--acc);text-decoration:none}
.story .kick{font:800 0.9375rem/1 var(--disp);letter-spacing:.12em;color:var(--acc);text-transform:uppercase}
.story h3{margin:8px 0 6px;font:800 1.6875rem/1.05 var(--disp);text-wrap:balance}
.story p{margin:0;color:var(--dim);font:600 1rem/1.45 var(--body);text-wrap:pretty}
.story .go{margin-block-start:12px;font:800 1rem/1 var(--disp);letter-spacing:.1em;text-transform:uppercase}
.rows{display:grid;gap:8px}
.nrow{display:grid;grid-template-columns:34px 1fr auto;gap:12px;align-items:center;background:var(--card);padding:10px 12px;text-decoration:none}
.nrow .lg{display:grid;gap:3px}
.nrow .lg img{inline-size:26px;block-size:26px;object-fit:contain}
.nrow .hl{font:800 1.25rem/1.1 var(--disp);text-wrap:balance}
.nrow .sm{display:block;margin-block-start:4px;font:600 0.875rem/1.35 var(--body);color:var(--dim)}
.nrow .mt{display:grid;justify-items:end;gap:4px;font:700 0.8125rem/1 var(--disp);letter-spacing:.1em;color:var(--dim);text-transform:uppercase}
.nrow .mt b{color:var(--acc)}

/* schedule */
.seg{display:flex;gap:6px;margin-block-end:6px}
.seg button{flex:1;min-block-size:44px;border:1px solid var(--line);background:transparent;cursor:pointer;font:800 1.0625rem/1 var(--disp);letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}
.seg button[aria-pressed=true]{background:var(--card2);color:var(--ink);border-color:var(--acc)}
.seg button:active{scale:.98}
.month{position:sticky;inset-block-start:calc(var(--bar) + 64px);z-index:1;margin-block:26px 0;padding:10px 0 8px;background:var(--bg);
  font:800 1.5rem/1 var(--disp);letter-spacing:.06em;text-transform:uppercase;border-block-end:2px solid var(--acc2)}
.day{font:800 1.0625rem/1 var(--disp);letter-spacing:.12em;text-transform:uppercase;color:var(--acc);margin-block:18px 8px}
.sched{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;background:var(--card);padding:12px;margin-block-end:6px;font:700 1.3125rem/1.05 var(--disp)}
.sched.final{background:var(--bg2)}
.sched .tm{font:800 1.375rem/1 var(--disp);min-inline-size:4.6ch}
.sched.final .tm{font-size:0.9375rem;letter-spacing:.1em;color:var(--dim)}
.sched .vs{display:grid;gap:6px;min-inline-size:0}
.sched .vs span{flex-wrap:wrap;display:flex;align-items:center;gap:8px}
.sched .vs b{margin-inline-start:auto;font-weight:800;font-size:1.5rem;color:var(--acc);padding-inline-start:12px}
.sched .vs .lo,.sched .vs .lo b{color:var(--dim)}
.sched img{inline-size:26px;block-size:26px;object-fit:contain}
.sched .rk{grid-column:2;font:700 0.875rem/1 var(--disp);letter-spacing:.1em;color:var(--dim);text-transform:uppercase}
.sched .vs small{font:700 .75rem/1 var(--disp);color:var(--dim)}
.sched .mv{grid-column:1/-1;justify-self:start;font:700 0.875rem/1 var(--disp);letter-spacing:.08em;color:var(--dim);padding-block:5px 4px}

/* standings + leaders */
.table{table-layout:fixed;inline-size:100%;border-collapse:collapse;font:700 1.25rem/1 var(--disp)}
.table th{font:700 0.875rem/1 var(--disp);letter-spacing:.12em;color:var(--dim);text-align:end;padding:8px 6px;text-transform:uppercase}
.table th:nth-child(2){text-align:start}
.table td{padding:10px 6px;text-align:end;border-block-start:1px solid var(--line)}
.table td.tm{text-align:start}
.table th:nth-child(2){inline-size:40%}
.table td.tm a{min-inline-size:0;display:flex;align-items:center;gap:10px;white-space:nowrap;text-decoration:none}
.table td.tm a span{min-inline-size:0;overflow:clip;text-overflow:ellipsis}
.table td.tm img{flex:none;inline-size:30px;block-size:30px;object-fit:contain}
.table td.pts{font-size:1.625rem;font-weight:800;color:var(--acc)}
.table tbody tr:first-child td{border-block-start:0}
.table tbody tr:first-child{background:oklch(100% none none / .05)}
.table .rk{color:var(--dim);inline-size:1.6em}
@container (max-width:420px){ .table .wide{display:none} }
@container (max-width:22.5rem){.table .record{display:none}.table th:nth-child(2){inline-size:60%}.table td.tm img{inline-size:24px;block-size:24px}}
.ld{inline-size:100%;border-collapse:collapse;font:700 1.25rem/1.15 var(--disp)}
.ld caption{text-align:start}
.ld th{font:700 .875rem/1 var(--disp);color:var(--dim)}
.ld th,.ld td{padding-block:8px;padding-inline:4px;text-align:end;border-block-end:1px solid var(--line)}
.ld th:nth-child(2){text-align:start}
.ld .rk{color:var(--dim)}
.ld .name{text-align:start}
.ld tr{position:relative}
.ld .nm{display:flex;flex-direction:column;justify-content:center;min-block-size:44px;text-decoration:none}
.ld .nm::after{content:'';position:absolute;inset:0}
.ld .nm:focus-visible{outline-offset:-2px}
.ld .nm small{display:block;font-size:.875rem;color:var(--dim);margin-block-start:3px}
.ld .p{color:var(--acc);font-weight:800}
.ld tbody tr:active{background:var(--card2)}

/* game page */
.score{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;background:var(--card);padding:18px 12px;border-block-start:4px solid var(--acc)}
.score .sd{display:grid;justify-items:center;gap:6px;text-align:center;text-decoration:none}
.score .sd:last-child{grid-column:3;grid-row:1}
.score .sd img{inline-size:64px;block-size:64px;object-fit:contain}
.score .sd span{font:800 1.25rem/1 var(--disp)}
.score .sd.lo{opacity:.62}
.score .mid{grid-column:2;grid-row:1;display:grid;justify-items:center}
.score .mid .s{font:800 3.375rem/1 var(--disp)}
.score .mid .s.t{font-size:2.5rem}
.score .mid .k{font:800 0.9375rem/1 var(--disp);letter-spacing:.12em;color:var(--acc);margin-block-start:6px}
.score .mid .w{font:700 0.875rem/1.3 var(--disp);letter-spacing:.08em;color:var(--dim);text-align:center;margin-block-start:4px;text-transform:uppercase}
.periods{inline-size:100%;border-collapse:collapse;margin-block-start:10px;font:700 1.125rem/1 var(--disp)}
.periods th,.periods td{padding:8px 6px;text-align:center;border-block-start:1px solid var(--line)}
.periods th{font-size:0.8125rem;letter-spacing:.12em;color:var(--dim)}
.periods :is(td,th):first-child{text-align:start}
.periods td:last-child{color:var(--acc);font-weight:800}
.article h1{margin:0 0 10px;font:800 clamp(1.875rem,8vw,2.75rem)/1.02 var(--disp);text-wrap:balance}
.article p{margin:0 0 14px;font:600 1.0625rem/1.55 var(--body);color:oklch(93% 0.01 200);max-inline-size:62ch;text-wrap:pretty}
.byline{display:flex;flex-wrap:wrap;gap:6px 12px;margin-block:4px 16px;font:700 0.8125rem/1.2 var(--disp);letter-spacing:.1em;color:var(--dim);text-transform:uppercase}
.byline b{color:var(--acc)}
.events{display:grid;gap:6px}
.ev{display:grid;grid-template-columns:36px 26px minmax(0,1fr) auto;gap:10px;align-items:center;background:var(--card);padding:9px 12px;font:700 1.125rem/1.15 var(--disp);text-decoration:none}
.ev .p{font:800 0.875rem/1 var(--disp);letter-spacing:.1em;color:var(--dim)}
.ev img{inline-size:26px;block-size:26px;object-fit:contain}
.ev a{text-decoration:none}
.ev small{display:block;font:700 0.875rem/1.2 var(--disp);color:var(--dim);margin-block-start:3px}
.ev .tag{font:800 0.8125rem/1 var(--disp);letter-spacing:.08em;padding:4px 6px 3px;background:oklch(100% none none / .12);color:var(--dim);white-space:nowrap}
.ev .tag.hot{background:var(--acc);color:var(--on-acc)}
.ev.pen .tag{background:var(--pen);color:oklch(100% none none)}

/* team + player headers */
.team-head{position:relative;overflow:clip;isolation:isolate;display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;margin-block-start:16px;
  padding:22px 16px;min-block-size:140px;background:var(--tbg);color:var(--tfg)}
.team-head .ghost{inline-size:min(90%,560px);inset-inline-end:-10%;inset-block-start:50%;translate:0 -50%;rotate:-12deg;opacity:.2;filter:grayscale(1) contrast(1.4);mix-blend-mode:luminosity}
.team-head h1{margin:0;font:800 clamp(1.875rem,8vw,3rem)/1 var(--disp)}
.team-head .rec{margin-block-start:6px;font:800 1.0625rem/1 var(--disp);letter-spacing:.08em}
@container (min-width:860px){ .team-head .tile{inline-size:104px;block-size:104px} }
.roster{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:6px}
.pl{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:10px;background:var(--card);padding:8px 12px;text-decoration:none;font:700 1.1875rem/1.1 var(--disp)}
.pl .pos{display:grid;place-items:center;inline-size:36px;block-size:36px;background:var(--tbg);color:var(--tfg);font:800 0.9375rem/1 var(--disp)}
.pl small{display:block;margin-block-start:.25rem;font:700 0.8125rem/1 var(--disp);letter-spacing:.08em;color:var(--dim);text-transform:uppercase}
.pl .c{font:800 0.8125rem/1 var(--disp);letter-spacing:.08em;background:var(--acc);color:var(--on-acc);padding:4px 6px 3px}
.player{position:relative;overflow:clip;isolation:isolate;display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;margin-block-start:16px;
  background:var(--card);padding:16px;border-block-start:4px solid var(--tbg)}
.player .plate{inline-size:92px;block-size:92px;display:grid;place-items:center;background:var(--tbg);color:var(--tfg);font:800 3rem/1 var(--disp)}
.player .ghost{inline-size:220px;inset-inline-end:-50px;inset-block-start:50%;translate:0 -50%;rotate:-12deg;opacity:.12;filter:grayscale(1)}
.player:has(.plate[hidden]){grid-template-columns:1fr}
.team-games .ev{grid-template-columns:minmax(0,1fr);min-block-size:44px}
.player h1{margin:0;font:800 2rem/1 var(--disp)}
.player .tmlink{display:inline-flex;align-items:center;gap:8px;margin-block-start:8px;font:700 1rem/1 var(--disp);letter-spacing:.06em;color:var(--dim);text-transform:uppercase;text-decoration:none}
.player .tmlink img{inline-size:24px;block-size:24px;object-fit:contain}
.stats{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;margin-block-start:10px;background:var(--card)}
.stats div{min-inline-size:0;display:grid;justify-items:center;align-content:center;gap:6px;padding:12px 4px;border-inline-start:1px solid var(--line)}
.stats div:first-child{border-inline-start:0}
.stats b{font:800 2.125rem/1 var(--disp)}
.stats b.sm{font-size:1.375rem;text-align:center}
.stats b.acc{color:var(--acc)}
.stats span{max-inline-size:100%;text-align:center;font:700 0.8125rem/1 var(--disp);letter-spacing:.12em;color:var(--dim)}

@media (hover:hover) and (pointer:fine){
  .link:hover .hl,.story:hover h3,.pl:hover,.ld .nm:hover,.table td.tm a:hover{color:var(--acc)}
  .tabs a:hover{color:var(--ink)}
  .bug:hover{background:var(--card2)}
}

/* Keyboard focus, ticker controls and platform accessibility. */
.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:clip;clip-path:inset(50%);white-space:nowrap;border:0}
#view:focus:not(:focus-visible){outline-color:transparent}
#view:focus-visible{outline:2px solid var(--acc);outline-offset:-2px}
:is(a,button):active{opacity:.85}
.ticker-window{flex:1;min-inline-size:0;overflow:clip;mask-image:linear-gradient(to right,transparent,black 16px,black calc(100% - 16px),transparent)}
.ticker-window:focus-visible{outline:2px solid var(--acc);outline-offset:-2px}
.ticker button{flex:none;max-inline-size:5rem;min-block-size:44px;border:0;border-inline-start:1px solid var(--line);padding-inline:8px;background:var(--bg2);font:700 .875rem/1.1 var(--disp);cursor:pointer}
.ticker.paused .run,.ticker-window:focus-visible .run{animation-play-state:paused}
@media (hover:hover) and (pointer:fine){.ticker-window:hover .run{animation-play-state:paused}.ticker button:hover{color:var(--acc)}}
@media (prefers-reduced-motion:reduce){.ticker button{display:none}.ticker-window{overflow-x:auto;scrollbar-width:thin}.ticker .run{min-inline-size:100%}.ticker .run span[aria-hidden]{display:none}}
@media (forced-colors:active){
  .half,.team-tile,.team-head,.plate{background:Canvas;color:CanvasText;border:1px solid CanvasText}
  .ghost{display:none}
  .tile{background:Canvas}
  .next-card:focus-visible{outline-color:Highlight}
}

/* History uses the game-screen blue, with sponsor logos only where the team matches. */
.history-head{display:flex;align-items:center;gap:1rem;padding-block:1rem 1.5rem}
.history-head>div{min-inline-size:0}
.history-head h1{font:800 clamp(2rem,7vw,3.5rem)/1.1 var(--disp);margin-block:.3rem;overflow-wrap:break-word}
.history-link{display:inline-flex;align-items:center;flex-wrap:wrap;gap:.4rem;min-block-size:44px;padding:.6rem .8rem;margin-block:.3rem;border:1px solid var(--line);background:var(--card2);text-decoration:none}
.history-link:active{background:var(--card)}
@media (hover:hover) and (pointer:fine){.history-link:hover{background:color-mix(in oklch,var(--card2),var(--ink) 10%)}}
.history-seasons{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,24rem),1fr));gap:1rem;margin-block-end:1.5rem}
.history-season,.history-total{min-inline-size:0;padding:clamp(.8rem,3vw,1.3rem);background:var(--card);border-block-start:3px solid oklch(65% .1 235);overflow-wrap:break-word}
.history-total{margin-block-end:1.5rem}
.history-season h3{font:700 1.5rem/1.2 var(--disp);margin-block:0 .5rem}
.history-season h4{margin-block:1rem .5rem}
.history-season p{margin-block:.5rem}
.history-season a{display:inline-block;padding-block:.5rem}
.history-numbers{display:flex;flex-wrap:wrap;gap:.8rem 1.5rem;margin-block:.8rem 0}
.history-numbers div{display:flex;flex-direction:column-reverse}
.history-numbers dt{font-size:.875rem;color:var(--dim)}
.history-numbers dd{margin:0;font:800 2rem/1.2 var(--disp)}
.history-record{color:var(--dim);line-height:1.7}
.history-title{font:800 1.5rem var(--disp);color:var(--acc)}
.history-leader+.history-leader{border-block-start:1px solid var(--line);margin-block-start:1rem}
.history-choices{display:grid;gap:.75rem}
.history-choices a{display:grid;justify-content:start}
.history-page .slab{white-space:normal;max-inline-size:100%;block-size:auto;line-height:1.25;padding-block:.5rem;overflow-wrap:anywhere}
.history-page .tile{flex:none}
.history-head{flex-wrap:wrap}
/* Keep the brand and season together when phone text is enlarged. */
.brand b{font-size:min(2.25rem,14vw)}
.season{font-size:min(1.125rem,7vw)}

/* Historical sponsor names keep their own plain name plates. */
.history-directory{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr));gap:.75rem;margin-block-end:1.5rem}
.history-nameplate{display:flex;align-items:center;gap:.8rem;min-inline-size:0;min-block-size:76px;padding:1rem;background:var(--card);border-inline-start:3px solid oklch(65% .1 235);text-decoration:none;overflow-wrap:anywhere}
.history-nameplate b{flex:1;min-inline-size:0;font:700 1.5rem/1.2 var(--disp)}
.history-nameplate .tile{flex:none;inline-size:3rem;block-size:3rem}
.history-nameplate:active{background:var(--card2)}
@media (hover:hover) and (pointer:fine){.history-nameplate:hover{background:var(--card2)}}
.history-choices{margin-block-end:1.5rem}
.history-versus{font-size:.7em;color:var(--dim)}
.history-count{font-weight:700}
.history-games{list-style:none;padding:0;display:grid;gap:1rem}
.history-game{min-inline-size:0;background:var(--card);padding:clamp(.8rem,3vw,1.3rem);border-block-start:3px solid oklch(65% .1 235)}
.history-game-date{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem;margin-block:0 .8rem;color:var(--dim)}
.history-game-date b{color:var(--ink)}
.history-game-side{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:1rem;padding-block:.3rem}
.history-game-side small{display:block;color:var(--dim);font-size:.75rem}
.history-game-side a{display:inline-block;padding-block:.4rem;overflow-wrap:anywhere}
.history-game-side strong{font:800 2rem/1.1 var(--disp)}
.history-extra{border-block-start:1px solid var(--line);padding-block-start:.75rem;color:var(--dim);overflow-wrap:anywhere}

.history-picker{display:grid;gap:.5rem;margin-block:1rem 1.5rem;font-weight:700}
.history-picker select{inline-size:100%;max-inline-size:100%;min-block-size:44px;padding:.7rem;color:var(--ink);background:var(--card);border:1px solid var(--line);font:inherit}
.history-picker select:active{background:var(--card2)}
.history-head h1 a{color:inherit}

/* Account forms use the game board blue and the site's existing type and spacing. */
.portal-entry{font-size:.85rem;margin-inline-start:auto;padding:.65rem .25rem;text-decoration:none}
.portal-entry:not([hidden]) + .season{margin-inline-start:0}
.portal-page{max-inline-size:44rem}
.portal-page h1{font:800 clamp(2rem,7vw,3rem)/1 var(--disp);margin-block:1rem}
.portal-page h2{font:700 1.6rem/1.2 var(--disp)}
.portal-page form,.portal-page details{display:grid;gap:1rem;padding:clamp(1rem,4vw,1.5rem);margin-block:1rem;border:1px solid var(--line);border-radius:.5rem;background:var(--bg2);min-inline-size:0}
.portal-page label{display:grid;gap:.5rem;min-inline-size:0}
.portal-page :is(input,textarea,select){inline-size:100%;min-inline-size:0;padding:.8rem;border:1px solid var(--line);border-radius:.25rem;background:var(--bg);color:var(--ink);font:inherit;font-size:1rem}
.portal-page :is(input,textarea,select):focus-visible{outline:2px solid oklch(75% .13 240);outline-offset:3px}
.portal-page button{padding:.85rem 1rem;min-block-size:48px;background:oklch(43% .14 250);border:1px solid oklch(70% .1 240);border-radius:.3rem;cursor:pointer}
.portal-page button:disabled{opacity:.65;cursor:wait}
.portal-page button[data-portal^="reply-name-"][aria-pressed=true]{opacity:1;background:var(--bg2);color:var(--ink);border-color:var(--acc);cursor:default}
.portal-page .portal-check{display:flex;align-items:start;gap:.75rem}
.portal-check input{inline-size:1.4rem;block-size:1.4rem;flex:none;margin:0;accent-color:oklch(65% .15 250)}
.portal-page summary{cursor:pointer;min-block-size:44px;padding-block:.6rem}
.portal-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-block:1rem}
.portal-message{color:oklch(85% .09 240);white-space:pre-line;overflow-wrap:anywhere}
.portal-message:empty{display:none}
.portal-page .history-choices{max-block-size:55dvh;overflow:auto}
.portal-page p,.portal-bio{overflow-wrap:anywhere}
.portal-bio p{white-space:pre-wrap}
/* Keep enlarged account/history navigation legible; inert public layout is unchanged. */
.portal-enabled .tabs{grid-template-columns:repeat(auto-fit,minmax(min(100%,4rem),1fr));column-gap:.5rem}
.portal-page button[data-portal=resend]:disabled{opacity:1;background:var(--bg2);color:var(--dim);border-color:var(--line);cursor:default}

/* Own takes use the same blue board as account/game screens. */
.take-card{padding:clamp(1rem,4vw,1.5rem);margin-block:1rem;background:var(--bg2);border-block-start:3px solid oklch(65% .1 235);min-inline-size:0}
.take-body{white-space:pre-wrap;overflow-wrap:anywhere}
[data-take-form] textarea{resize:vertical;min-block-size:10rem}
.portal-page button:active{background:oklch(35% .12 250)}
.portal-page button:focus-visible{outline:2px solid oklch(80% .12 240);outline-offset:3px}

/* P8 follows: local to the enabled portal; inert public layout stays identical. */
.portal-page fieldset{display:grid;gap:.75rem;min-inline-size:0;margin:0;padding:0;border:0}
.portal-page legend{font:700 1.6rem/1.2 var(--disp);padding-block:.75rem}
.portal-page .alert-choice,.portal-page .alert-category{min-block-size:48px;align-items:center;padding-block:.5rem;border-block-end:1px solid var(--line)}
.portal-page small{display:block;color:var(--dim);font:inherit;font-size:.9rem}
.alert-players{max-block-size:45dvh;overflow:auto;overscroll-behavior:contain}
.portal-page .alert-choice[hidden]{display:none}
.portal-page .portal-check:has(input:disabled){color:var(--dim)}
.portal-page [data-alert-stop]{background:var(--bg2)}
.portal-page [data-alert-stop]:active{background:oklch(35% .12 250)}
/* Let the brand, account link and season reflow; the sticky offset scales with text. */
.portal-enabled{--bar:calc(3.625rem + env(safe-area-inset-top))}
.portal-enabled .bar{block-size:auto;min-block-size:var(--bar);flex-wrap:wrap;align-content:center;column-gap:.35rem;row-gap:.2rem}
.portal-page [data-alert-show]{background:var(--bg2);color:var(--dim)}

/* Named operators: the stop switch precedes account recovery and deletion. */
.operator-mail{display:grid;gap:1rem;padding:clamp(1rem,4vw,1.5rem);margin-block:1rem;border:1px solid var(--line);border-block-start:4px solid oklch(65% .15 250);border-radius:.5rem;background:var(--bg2);min-inline-size:0}
.operator-mail > *{margin-block:0}
.operator-mail h3{margin-block-start:.75rem}
.operator-mail-state{font-weight:700;color:oklch(85% .09 240)}
.operator-mail strong{font-variant-numeric:tabular-nums}
.operator-mail button{justify-self:start}
.operator-mail button:active{background:oklch(35% .14 250)}
.operator-mail button:focus-visible{outline:2px solid oklch(85% .09 240);outline-offset:3px}

.operator-mail-state:empty{display:none}
/* Enlarged portal journeys keep headings and essential team names readable. */
.portal-enabled .slab{block-size:auto;min-block-size:2.75rem;max-inline-size:100%;white-space:normal;overflow-wrap:break-word}
.portal-enabled .portal-check{min-block-size:44px;align-items:center}
@container (max-width:18rem){
  .portal-enabled .bug{grid-template-columns:minmax(0,1fr)}
  .portal-enabled .bug .row{grid-template-columns:40px minmax(0,1fr) auto}
  .portal-enabled .bug .row span:nth-child(2){white-space:normal;overflow:visible;overflow-wrap:break-word}
  .portal-enabled .bug .meta{display:flex;flex-wrap:wrap;justify-content:space-between;padding-block:8px}
  .portal-enabled .table .rk{inline-size:1.2em}
  .portal-enabled .table th:nth-child(2){inline-size:55%}
  .portal-enabled .table td.tm a{white-space:normal;align-items:start;gap:.3em}
  .portal-enabled .table td.tm a span{overflow:visible;overflow-wrap:break-word}
  .portal-enabled .score{grid-template-columns:repeat(2,minmax(0,1fr))}
  .portal-enabled .score .mid{grid-column:1/-1;grid-row:1;min-inline-size:0}
  .portal-enabled .score .mid .s{white-space:nowrap}
  .portal-enabled .score .sd{grid-column:1;grid-row:2;min-inline-size:0;overflow-wrap:break-word}
  .portal-enabled .score .sd:last-child{grid-column:2;grid-row:2}
  .portal-enabled .events .ev{grid-template-columns:auto minmax(0,1fr)}
  .portal-enabled .events .ev > :nth-child(3){grid-column:1/-1;min-inline-size:0;overflow-wrap:break-word}
  .portal-enabled .events .ev img{justify-self:end}
  .portal-enabled .events .ev .tag{grid-column:1/-1;justify-self:start;white-space:normal}
  .portal-enabled .pl{grid-template-columns:auto minmax(0,1fr)}
  .portal-enabled .pl > :nth-child(2){min-inline-size:0;overflow-wrap:break-word}
  .portal-enabled .pl .pos{inline-size:auto;min-inline-size:36px;block-size:auto;min-block-size:36px;padding:.2em}
  .portal-enabled .pl .c{grid-column:2;justify-self:start}
  .portal-enabled .stats{grid-auto-flow:row;grid-template-columns:repeat(auto-fit,minmax(min(100%,5rem),1fr))}
  .portal-enabled .split .half-content{min-inline-size:0;padding-inline:10px}
  .portal-enabled .split .nm{max-inline-size:100%;overflow-wrap:break-word}
}
/* Shots on goal and goalies (#132) */
.innet{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));gap:8px}
.innet li{display:flex;align-items:center;gap:10px;min-inline-size:0;background:var(--card);padding:10px 12px;font:700 1.0625rem/1.2 var(--disp)}
.innet img{flex:none;inline-size:28px;block-size:28px;object-fit:contain}
.innet span{min-inline-size:0;overflow-wrap:anywhere}
.innet small{display:block;margin-block-start:3px;font:600 .875rem/1.3 var(--body);color:var(--dim)}
.innet a{color:inherit}
.ld.goalies{margin-block-start:10px}
.ld.goalies .nm small{font-family:var(--body)}
.shotstats + .note{margin-block-start:8px}
.ld.goalies th{white-space:nowrap}
