/* board-page.css: the full SPEEDRUN BOARD (board.html). A cardboard noticeboard pinned up at the parade: the painted
   scene, blurred and dimmed, behind; the KCC crest + ribbon and cut-board lettering on top; the same kit as the sign
   (style.css cb-*), the verified mark from board.css (.kv). Light: the low sun is behind-right, so shadows fall down-left.
   One page that scrolls: laptops get the board + a side column, phones get one column. */

/* style.css locks the parade page to the viewport: this page scrolls */
html.bp-page,html.bp-page body{height:auto;min-height:100%;overflow-x:hidden;overflow-y:auto}
html.bp-page body{background:#120c08;color:#f4e7c8;font:500 15px/1.4 'Zilla Slab',Georgia,serif;-webkit-text-size-adjust:100%}
html.bp-page{scrollbar-color:#8a6234 #1a110a}

/* the parade behind: scene.jpg, out of focus and dimmed like the lights went down for the results */
.bp-sky{position:fixed;inset:-30px;z-index:0;pointer-events:none;
  background:radial-gradient(120% 90% at 50% 30%,rgba(18,12,8,0) 30%,rgba(18,12,8,.75) 100%),url(scene.jpg) 50% 38%/cover no-repeat #2a1a10;
  filter:blur(9px) brightness(.5) saturate(1.1)}
/* the page frame: header + board + footer strip, one group centered in the window (it scrolls once it outgrows it) */
.bp-wrap{position:relative;z-index:1;max-width:1260px;min-height:100vh;min-height:100dvh;margin:0 auto;padding:18px 28px 22px;display:flex;flex-direction:column;justify-content:center}

/* ---- header: crest, ribbon, cut-board title, live stubs ---- */
.bp-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:6px 22px;margin-bottom:18px}
.bp-crest{display:block;width:118px;filter:drop-shadow(-6px 9px 8px rgba(0,0,0,.55));transition:rotate .25s,translate .25s}
.bp-crest:hover{rotate:-3deg;translate:0 -2px}
.bp-crest:focus-visible{outline:2px solid var(--cb-kick);outline-offset:4px;border-radius:8px}
.bp-crest img{display:block;width:100%;height:auto}
.bp-titles{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.bp-titles .badge.kcc-badge{font-size:15px;margin:0 0 6px 2.4em}
.bp-h1{font:clamp(34px,5vw,66px)/1 'Homecoming Reference','Alfa Slab One',Georgia,serif;letter-spacing:.03em;margin:.12em 0 .14em;white-space:nowrap}
.bp-h1 .cb-l-face{--cb-lface:#2b7a3f}
.bp-h1 .cb-l-face .cb-alt{--cb-lface:var(--cb-red)}
.bp-kicker{margin:.1em 0 0;font:700 15px/1.2 'Barlow Condensed',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#f0d9a8;text-shadow:0 1px 3px rgba(0,0,0,.7)}
.bp-kicker span{color:var(--cb-kick)}

/* live numbers: three ticket stubs, like the HERE NOW tab on the parade */
.bp-live{display:flex;gap:10px;margin:0;align-self:center}
.bp-live[hidden]{display:none}
.bp-stub{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:92px;padding:.62em 1.05em .55em;border-radius:2px;color:#22160b;
  background:var(--cb-fiber),var(--cb-grain),var(--cb-light),var(--cb-kraft);
  box-shadow:0 3px 0 var(--cb-edge),-5px 7px 7px rgba(0,0,0,.45),inset -1.5px 0 0 rgba(255,214,150,.45);
  -webkit-mask:radial-gradient(circle at 0 50%,#0000 .32em,#000 .35em) left/51% 100% no-repeat,radial-gradient(circle at 100% 50%,#0000 .32em,#000 .35em) right/51% 100% no-repeat;
  mask:radial-gradient(circle at 0 50%,#0000 .32em,#000 .35em) left/51% 100% no-repeat,radial-gradient(circle at 100% 50%,#0000 .32em,#000 .35em) right/51% 100% no-repeat}
.bp-stub:nth-child(1){rotate:-2deg}.bp-stub:nth-child(2){rotate:1.2deg;--cb-kraft:#e3b37a}.bp-stub:nth-child(3){rotate:-.6deg}
.bp-stub dt{display:flex;align-items:center;gap:.4em;font:11px/1 'Homecoming Parade','NOC Varsity',sans-serif;letter-spacing:.12em;color:#5a3314}
.bp-stub dd{margin:0;font:700 26px/1 'Barlow Condensed',sans-serif;font-variant-numeric:tabular-nums;color:#1d140b}
.bp-now dd{color:#1f5a2f}

/* ---- the grid: board + side column ---- */
.bp-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:26px;align-items:start}

/* the noticeboard: cream board, corrugated cut rim, two brass brads, pinned a hair crooked */
.bp-board{position:relative;container-type:inline-size;padding:18px 22px 20px;color:#22160b;rotate:-.25deg;
  background:var(--cb-fiber) padding-box,var(--cb-grain) padding-box,var(--cb-light) padding-box,radial-gradient(130% 90% at 30% 10%,#f8ebcf,#ecd3a8) padding-box,var(--cb-flutes) border-box;
  border:6px solid transparent;border-radius:6px;box-shadow:-12px 16px 22px rgba(0,0,0,.55),inset -2px 0 0 rgba(255,214,150,.5)}
.bp-brad{position:absolute;top:9px;width:18px;height:18px;border-radius:50%;
  background:radial-gradient(circle at 38% 34%,#fff2c0 0 8%,#d9a441 30%,#6b4a16 62%,#3a2408 72%,transparent 76%);filter:drop-shadow(-1.5px 2px 1px rgba(40,16,4,.5))}
.bp-brad.l{left:9px}.bp-brad.r{right:9px}

/* round tabs: little die-cut boards in a pressed tray */
.bp-tabs{display:flex;flex-wrap:wrap;gap:10px 10px;padding:10px 12px 14px;margin:0 14px 14px;border-radius:8px;background:var(--cb-fiber),rgba(120,70,25,.13);
  box-shadow:inset -3px 4px 6px rgba(60,28,6,.38),inset 2px -2px 0 rgba(255,244,220,.55),0 0 0 1px rgba(110,64,24,.22)}
.bp-tabs[hidden]{display:none}
.bp-tab{display:inline-flex;align-items:center;gap:.45em;font:15px/1 'Homecoming Parade','Roboto Slab',serif;letter-spacing:.08em;padding:.62em 1em .5em;--e:3px}
.bp-tab[aria-selected="true"]{--rot:-1.2deg}
.bp-tab .vt-dot{width:.6em;height:.6em}
.bp-tab-now{font:700 11px/1 'Barlow Condensed',sans-serif;letter-spacing:.1em;padding:.25em .4em .2em;border-radius:2px;color:#0f220b;background:var(--cb-kick);box-shadow:0 1.5px 0 #1d5c10}
.bp-tab.cb-green .bp-tab-now{box-shadow:0 1.5px 0 #0b2412}

.bp-bhead{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0 2px 10px;padding:0 4px}
.bp-bhead h2{margin:0;font:clamp(22px,3cqw,30px)/1 'Homecoming Parade','NOC Varsity',sans-serif;letter-spacing:.08em;color:var(--cb-laurel);padding-top:.1em}
.bp-chip{font:700 12px/1 'Barlow Condensed',sans-serif;letter-spacing:.1em;color:#2a1806;padding:.38em .6em .32em;border-radius:2px;rotate:3deg;
  background:var(--cb-fiber),var(--cb-light),var(--cb-mustard);box-shadow:0 2px 0 var(--cb-mustard-dk)}
.bp-n{margin-left:auto;font:italic 500 14px/1.2 'Zilla Slab',serif;color:#6b4a2a}
.bp-msg{margin:4px 6px 12px;font:600 16px/1.35 'Zilla Slab',serif;color:#4a3420}
.bp-msg:empty{display:none}
.bp-msg.warn{color:#8a3e0c}

/* the podium: three boxes, 1st in the middle and tallest (brass), 2nd (silver board), 3rd (bronze board) */
.bp-podium{list-style:none;margin:6px 0 14px;padding:0 4px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:14px}
.bp-podium:empty{display:none}
.bp-pod{--f:#d8d4cc;--fe:#6d6a63;position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0;padding:16px 12px 14px;border-radius:4px;text-align:center;
  background:var(--cb-fiber),var(--cb-grain),var(--cb-light),var(--f);color:#1d140b;
  box-shadow:0 5px 0 var(--fe),-6px 10px 10px rgba(45,18,4,.35),inset -2px 0 0 rgba(255,240,200,.5);outline:1.5px dashed rgba(45,24,8,.28);outline-offset:-6px}
.bp-pod.p1{--f:var(--cb-mustard);--fe:var(--cb-mustard-dk);order:2;padding-top:24px;padding-bottom:22px;rotate:.6deg}
.bp-pod.p2{order:1;rotate:-1.2deg}
.bp-pod.p3{--f:#d99a5c;--fe:#7a4a1c;order:3;rotate:1deg}
.bp-podium:has(.bp-pod:only-child){grid-template-columns:minmax(0,320px);justify-content:center}
.bp-place{position:absolute;top:-12px;left:50%;translate:-50% 0;rotate:-3deg;font:15px/1 'Homecoming Parade','NOC Varsity',sans-serif;letter-spacing:.1em;
  padding:.4em .7em .3em;border-radius:2px;color:var(--cb-kick);background:var(--cb-fiber),linear-gradient(170deg,rgba(255,255,255,.08),transparent 45%,rgba(0,0,0,.25)),#0f1115;
  box-shadow:inset 0 0 0 2px #0f1115,inset 0 0 0 3px rgba(233,223,196,.55),0 0 0 1.5px #b98a52,-3px 4px 4px rgba(30,12,2,.4)}
.bp-pod.p1 .bp-place{font-size:18px}
.bp-face{display:block;margin-top:4px}
.bp-pav{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 3px #f6e8c8,0 0 0 5px rgba(45,24,8,.55),-3px 4px 5px rgba(30,12,2,.4)}
.bp-pod.p1 .bp-pav{width:74px;height:74px}
.bp-pav-x{font:30px/1 'Homecoming Reference','Alfa Slab One',serif;color:#f3dc9a;padding-top:.08em;background:var(--cb-fiber),var(--cb-laurel)}
.bp-pod.p1 .bp-pav-x{font-size:38px}
.bp-pwho{display:flex;align-items:center;justify-content:center;gap:.35em;max-width:100%;min-width:0;font:700 21px/1.1 'Barlow Condensed',sans-serif}
.bp-pod.p1 .bp-pwho{font-size:24px}
.bp-pscore{font:700 34px/1 'Barlow Condensed',sans-serif;font-variant-numeric:tabular-nums;color:#1f5a2f}
.bp-pod.p1 .bp-pscore{font-size:42px}
.bp-ptime{font:600 16px/1 'Barlow Condensed',sans-serif;letter-spacing:.04em;font-variant-numeric:tabular-nums;color:#3a2614;
  padding:.3em .55em .25em;border-radius:3px;background:rgba(45,24,8,.12);box-shadow:inset 0 1px 2px rgba(45,24,8,.3)}
.bp-pod.me{box-shadow:0 5px 0 var(--fe),0 0 0 4px var(--cb-kick),-6px 10px 10px rgba(45,18,4,.35),inset -2px 0 0 rgba(255,240,200,.5)}

/* 4-50: a results sheet, two columns when the board is wide */
.bp-list{list-style:none;margin:0;padding:0 4px;font:600 17px/1.1 'Barlow Condensed',sans-serif}
.bp-list[hidden]{display:none}
.bp-list li{display:grid;grid-template-columns:2.2em minmax(0,1fr) auto 4.4em;align-items:center;gap:.6em;padding:.42em .45em .38em;border-bottom:1.5px dashed rgba(110,70,30,.3);break-inside:avoid}
.bp-list li:nth-child(odd){background:rgba(120,70,25,.06)}
@container (min-width:760px){.bp-list{columns:2;column-gap:28px;column-rule:1.5px dashed rgba(110,70,30,.25)}}
.bp-pos{display:inline-grid;place-items:center;width:1.9em;height:1.55em;border-radius:2px;font:700 15px/1 'Barlow Condensed',sans-serif;color:#2a1806;
  background:var(--cb-fiber),var(--cb-light),#e9d7b2;box-shadow:0 1.5px 0 #8a6234}
.bp-who,.bp-pwho{display:flex;align-items:center;gap:.4em;min-width:0;color:#1d140b}
.bp-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.bp-av{width:1.4em;height:1.4em;border-radius:50%;object-fit:cover;flex:none;box-shadow:0 0 0 1.5px #1d5c10}
.bp-s{font-variant-numeric:tabular-nums;color:#1f5a2f}
.bp-t{font-variant-numeric:tabular-nums;text-align:right;color:#2a1d10}
.bp-you{flex:none;font:700 11px/1 'Barlow Condensed',sans-serif;letter-spacing:.1em;color:#0f220b;padding:.28em .4em .22em;border-radius:2px;background:var(--cb-fiber),var(--cb-kick);box-shadow:0 1.5px 0 #1d5c10}
/* your row: Kick-green marker */
.bp-list li.me{background:linear-gradient(100deg,rgba(83,252,24,0) 0 1%,rgba(83,252,24,.42) 3% 96%,rgba(83,252,24,0) 99%)}
.bp-me{margin:12px 6px 0;font:500 15px/1.35 'Zilla Slab',serif;color:#2a1d10}
.bp-me:empty{display:none}
.bp-k{font:12px/1 'Homecoming Parade','NOC Varsity',sans-serif;letter-spacing:.1em;color:#b02a15;margin-right:.2em}

/* ---- side column: stays in view while the board scrolls ---- */
.bp-side{position:sticky;top:16px;display:flex;flex-direction:column;gap:16px}
.bp-go{display:block;text-align:center;white-space:nowrap;text-decoration:none;font:26px/1 'Homecoming Parade','Alfa Slab One',serif;letter-spacing:.06em;padding:.66em 1em .56em;--e:5px;--rot:-1deg}
.bp-card{position:relative;padding:14px 16px 15px;color:#22160b;border-radius:5px;
  background:var(--cb-fiber) padding-box,var(--cb-grain) padding-box,var(--cb-light) padding-box,linear-gradient(#f6e8c8,#efdcb4) padding-box,var(--cb-flutes) border-box;
  border:4px solid transparent;box-shadow:-7px 10px 12px rgba(0,0,0,.45)}
.bp-card[hidden],.bp-in[hidden],.bp-outbox[hidden]{display:none}
.bp-card h3{margin:0 0 .35em;font:13px/1 'Homecoming Parade','NOC Varsity',sans-serif;letter-spacing:.12em;color:#b02a15}
.bp-card p{margin:0 0 .7em;font:500 14.5px/1.35 'Zilla Slab',serif;color:#2a1d10}
.bp-card p:last-child{margin-bottom:0}
.bp-card p b{font-weight:700}
.bp-kick{rotate:.8deg}
.bp-in{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.35em .6em}
.bp-k,.bp-in .bp-k{grid-column:1/-1}
.bp-who{font:700 21px/1.1 'Barlow Condensed',sans-serif;color:#14243f}
.bp-who .bp-av{width:1.5em;height:1.5em}
.bp-who .bp-av[hidden]{display:none}
.bp-out{justify-self:end;border:0;background:none;padding:.1em 0;cursor:pointer;font:italic 500 13.5px/1.2 'Zilla Slab',Georgia,serif;color:#6b4a2a;
  text-decoration:underline dashed;text-underline-offset:2px}
.bp-out:hover{color:#b02a15}.bp-out:focus-visible{outline:2px solid var(--cb-laurel);outline-offset:2px}
.bp-say{font-size:14px!important;margin-bottom:.6em!important}
.bp-login{display:flex;width:100%;font-size:17px;--rot:-.6deg}
.bp-kmsg{margin:.6em 0 0!important;font:600 13.5px/1.3 'Zilla Slab',serif!important;color:#4a3420}
.bp-kmsg:empty{display:none}
.bp-kmsg.good{color:#1f5a2f}.bp-kmsg.warn{color:#8a3e0c}
.bp-copywrap{position:relative}
.bp-copy{width:100%;font:16px/1 'Homecoming Parade','Roboto Slab',serif;letter-spacing:.08em;--e:4px;--rot:.6deg}
.bp-stamp{position:absolute;right:10px;top:-14px;font-size:15px;color:var(--cb-laurel);background:rgba(246,232,200,.85);pointer-events:none;opacity:0}
.bp-stamp.on{opacity:1;animation:cb-slam .45s cubic-bezier(.3,1.4,.5,1) both}
.bp-copymsg{margin:-6px 4px 0;font:600 13.5px/1.3 'Zilla Slab',serif;color:#f0d9a8;text-shadow:0 1px 2px rgba(0,0,0,.7);overflow-wrap:anywhere}
.bp-copymsg:empty{display:none}
.bp-rules{rotate:-.6deg}
/* brands & collabs: a small sky-blue label tacked under the side column */
.bp-collab{align-self:flex-start;margin:2px 0 0 6px;text-decoration:none;font:700 13px/1.1 'Barlow Condensed',sans-serif;letter-spacing:.06em;--rot:-1.5deg;transition:translate .14s}
.bp-collab span{font:11.5px/1 'Homecoming Parade','NOC Varsity',sans-serif;letter-spacing:.1em;margin-right:.2em}
.bp-collab b{font-weight:700;color:#14243f}
.bp-collab:hover{translate:0 -2px}
.bp-collab:focus-visible{outline:2px solid var(--cb-kick);outline-offset:2px}
.bp-fine{font-size:12.5px!important;color:#5a4128!important}
.bp-fine a{color:#1f5a2f;font-weight:600}

/* ---- footer ---- */
/* ---- the footer strip: a KCC felt patch tacked under the board (depth.css: felt, gold satin rim, cream running stitch),
   the fan-made line stitched on, and a black sponsor plate with brass brads carrying Kick's own logo (as on the parade's
   float apron). Shared by /board, /rules, /about and /stats. ---- */
.bp-foot{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 22px;margin:22px 4px 0;padding:10px 12px 10px 22px;
  border:3px solid transparent;border-radius:6px;rotate:-.25deg;color:#efe0b8;
  background:var(--dp-felt) padding-box,var(--dp-felt-light) padding-box,linear-gradient(#1f5a2f,#1f5a2f) padding-box,
    linear-gradient(100deg,rgba(0,0,0,.28),transparent 45%,rgba(255,240,200,.25)) border-box,
    repeating-linear-gradient(58deg,#fff0b8 0 .7px,#d9a441 .7px 1.7px,#6e4a14 1.7px 2.4px) border-box;
  box-shadow:var(--dp-shadow-hang,-4px 6px 6px rgba(26,10,2,.42)),var(--dp-pillow,inset 0 0 0 transparent)}
.bp-foot::after{content:'';position:absolute;inset:3px;border:1.4px dashed #f3e6c4;border-radius:4px;pointer-events:none;opacity:.85;
  filter:drop-shadow(-.5px .8px 0 rgba(0,0,0,.5)) drop-shadow(.35px -.35px 0 rgba(255,255,255,.22))}
.bp-foot p{position:relative;z-index:1;margin:0;max-width:70ch;font:600 13.5px/1.3 'Barlow Condensed','Roboto Slab',sans-serif;letter-spacing:.03em;color:#efe0b8;
  text-shadow:-.6px .8px 0 rgba(0,0,0,.5),.4px -.4px 0 rgba(255,255,255,.12)}
.bp-follow{position:relative;z-index:1;flex:none;display:inline-flex;align-items:center;gap:8px;padding:7px 22px 6px 23px;border-radius:2px;text-decoration:none;rotate:.8deg;
  color:#f3dc9a;font:700 12.5px/1 'Barlow Condensed','Roboto Slab',sans-serif;letter-spacing:.07em;text-transform:uppercase;
  background:var(--cb-brad) 9px 50%/13px 13px no-repeat,var(--cb-brad) calc(100% - 9px) 50%/13px 13px no-repeat,
    var(--cb-fiber),linear-gradient(100deg,rgba(0,0,0,.25),transparent 45%,rgba(255,200,120,.1)),#141b12;
  box-shadow:0 2.5px 0 #050805,-5px 7px 7px rgba(10,4,0,.5),inset -1.5px 0 0 rgba(200,255,160,.18),inset 0 1px 0 rgba(255,255,255,.08);transition:translate .14s,rotate .2s}
.bp-follow:hover{translate:0 -2px;rotate:0deg}
.bp-follow:focus-visible{outline:2px solid var(--cb-kick);outline-offset:3px}
.bp-follow b{color:var(--cb-kick);text-transform:none;letter-spacing:.02em;font-size:1.06em}
.bp-follow img{display:block;height:17px;width:auto}

/* ---- laptops a bit narrower ---- */
@media (max-width:1180px){
  .bp-grid{grid-template-columns:minmax(0,1fr) 270px;gap:20px}
  .bp-live{flex-direction:column;gap:8px}
  .bp-stub{flex-direction:row;justify-content:space-between;min-width:150px;padding:.5em 1.05em .45em}
  .bp-stub dd{font-size:22px}
  .bp-go{font-size:22px}
}
/* ---- tablets / phones: one column, the side cards under the board ---- */
@media (max-width:860px){
  .bp-wrap{padding:14px 16px 24px}
  .bp-head{grid-template-columns:auto minmax(0,1fr);gap:10px 14px}
  .bp-crest{width:78px}
  .bp-live{grid-column:1/-1;flex-direction:row;justify-content:center;gap:8px}
  .bp-stub{flex:1;flex-direction:column;justify-content:center;min-width:0;padding:.55em .5em .5em}
  .bp-grid{grid-template-columns:minmax(0,1fr)}
  .bp-side{position:static}
}
@media (max-width:560px){
  html.bp-page body{font-size:14px}
  .bp-wrap{padding:12px 16px 22px}
  /* the ribbon gets its own row across the top; crest beside the title under it */
  .bp-head{grid-template-areas:"badge badge" "crest h1" "crest kick" "live live";gap:4px 12px;margin-bottom:14px}
  .bp-titles{display:contents}
  .bp-titles .badge.kcc-badge{grid-area:badge;justify-self:center;font-size:13px;margin:2px 0 8px}
  .bp-crest{grid-area:crest;width:68px;align-self:center}
  .bp-h1{grid-area:h1;align-self:end;font-size:clamp(28px,8.4vw,40px);margin:0}
  .bp-kicker{grid-area:kick;align-self:start;font-size:12px;letter-spacing:.08em}
  .bp-live{grid-area:live;margin-top:8px}
  .bp-stub dt{font-size:10px;letter-spacing:.08em}
  .bp-stub dd{font-size:22px}
  .bp-board{padding:28px 10px 14px;border-width:5px;rotate:0deg}
  .bp-brad{top:6px;width:15px;height:15px}.bp-brad.l{left:6px}.bp-brad.r{right:6px}
  .bp-tabs{margin:0 2px 12px;padding:8px 8px 12px;gap:10px 8px}
  .bp-tab{font-size:13px;padding:.6em .8em .5em}
  .bp-n{flex-basis:100%;margin-left:0}
  /* the podium stacks: three wide boxes, 1st on top */
  .bp-podium{grid-template-columns:minmax(0,1fr);gap:16px;margin-top:14px}
  .bp-pod{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"face who score" "face time score";align-items:center;justify-items:start;
    gap:4px 12px;padding:16px 14px 12px;text-align:left;rotate:0deg!important}
  .bp-pod.p1{order:1;padding:20px 14px 14px}.bp-pod.p2{order:2}.bp-pod.p3{order:3}
  .bp-place{left:14px;translate:0 0;font-size:13px!important}
  .bp-face{grid-area:face;margin:0}
  .bp-pav{width:46px;height:46px}.bp-pod.p1 .bp-pav{width:54px;height:54px}
  .bp-pav-x{font-size:24px}.bp-pod.p1 .bp-pav-x{font-size:28px}
  .bp-pwho{grid-area:who;justify-content:flex-start;max-width:100%;font-size:18px}.bp-pod.p1 .bp-pwho{font-size:20px}
  .bp-ptime{grid-area:time;font-size:14px}
  .bp-pscore{grid-area:score;font-size:26px}.bp-pod.p1 .bp-pscore{font-size:30px}
  .bp-list{font-size:16px;padding:0}
  .bp-list li{grid-template-columns:2em minmax(0,1fr) auto 3.9em;gap:.45em;padding:.45em .3em .4em}
  .bp-go{font-size:22px}
  .bp-foot{flex-direction:column;align-items:flex-start;padding:10px 12px 12px 16px}
  .bp-foot p{font-size:13px}
  /* the round tabs: two by two, so no tab wraps alone */
  .bp-tabs{display:grid;grid-template-columns:1fr 1fr}
  .bp-tab{justify-content:center}
}
/* big screens: the whole group grows with the window (zoom also scales vh inside it, hence the divided min-height) */
@media (min-width:1700px) and (min-height:960px){
  .bp-wrap{zoom:1.16;min-height:calc(100vh / 1.16)}
}
@media (prefers-reduced-motion:reduce){
  .bp-follow{transition:none}
  .vt-dot,.bp-stamp.on{animation:none}
  .bp-crest,.bp-tab{transition:none}
}
