/* =====================================================================
   GoDartsPro : Dart Invaders (app 139)                         v1.0.0
   /wp-content/themes/dart/assets/css/gdp-game-dartinvaders.css

   On top of gdp-game.css. Everything is under .gdp-bi, so nothing here
   reaches the theme or another game. Retro arcade: a starfield, Press
   Start 2P for labels, Bungee for the numbers on the bricks (both self
   hosted, SIL Open Font License, assets/fonts/dartinvaders/).
   Brick colours: yellow singles, red doubles, green trebles, purple
   score bricks, white bulls.
   ===================================================================== */

@font-face{font-family:'GDP Press Start';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/dartinvaders/press-start-2p-latin-400.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:'GDP Press Start';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/dartinvaders/press-start-2p-latin-ext-400.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'GDP Bungee';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/dartinvaders/bungee-latin-400.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:'GDP Bungee';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/dartinvaders/bungee-latin-ext-400.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}

.gdp-bi{
  --bi-ink:#f4f1ff; --bi-dim:#958ebd; --bi-amber:#ffa400; --bi-green:#3ddc84; --bi-red:#ff3b4a;
  --bi-yellow:#ffd23f; --bi-violet:#a46bff; --bi-cyan:#4cc9ff;
  --bi-pix:'GDP Press Start','Courier New',monospace; --bi-brick:'GDP Bungee','Oswald',Impact,sans-serif;
  --bi-cw:60px; --bi-rh:38px;
}
/* The frame: a night sky instead of the photo band. One step more
   specific than the theme's .container-main-graphic. Never clipped (the
   Scolia badge sits across its top border); the sky layer clips itself. */
.gdp .gdp-wrap.js-bi-wrap{
  position:relative;color:var(--bi-ink);font-family:Oswald,system-ui,sans-serif;
  background:radial-gradient(120% 60% at 50% 115%,#1d0b3a 0%,transparent 60%) no-repeat,radial-gradient(80% 50% at 8% 0%,#0d1a3f 0%,transparent 60%) no-repeat,#05020e;
  background-size:100% 100%,100% 100%;
  min-height:640px;padding:18px 18px 22px;user-select:none;-webkit-user-select:none;
}
.gdp-bi *,.gdp-bi *::before,.gdp-bi *::after{box-sizing:border-box;}
.gdp-bi button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;}
.gdp-bi button:focus-visible,.gdp-bi a:focus-visible,.gdp-bi summary:focus-visible{outline:2px solid var(--bi-amber);outline-offset:2px;}
.gdp-bi .is-hidden{display:none !important;}
.gdp-bi-sky{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none;z-index:0;}
.gdp-bi-stars{position:absolute;inset:0;width:100%;height:100%;}
.gdp-bi-scan{position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.16) 0 1px,transparent 1px 3px);opacity:.5;
  box-shadow:inset 0 0 120px 20px rgba(0,0,0,.7);}
.gdp-bi > section{position:relative;z-index:2;}
.gdp-bi .gdp-fsbtn{z-index:40;}
/* The site's dart boxes stay hidden: the game draws its own. */
.gdp-bi .js-score-details-container{display:none !important;}
.gdp-bi .dart-retrieve-container{left:0;right:0;width:auto;max-width:100%;}

/* ---------- shared bits ---------- */
.gdp-bi-eyebrow{font-family:var(--bi-pix);font-size:11px;letter-spacing:.18em;color:var(--bi-amber);margin-bottom:18px;text-transform:uppercase;}
.gdp-bi .gdp-bi-start{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--bi-pix);font-size:17px;line-height:1.2;padding:19px 30px;border-radius:14px;
  background:var(--bi-green) !important;color:#03210f !important;box-shadow:0 6px 0 #18834b,0 0 36px rgba(61,220,132,.42);transition:transform .08s,box-shadow .08s;text-decoration:none !important;text-transform:uppercase;}
.gdp-bi .gdp-bi-start:hover{filter:brightness(1.06);}
.gdp-bi .gdp-bi-start:active{transform:translateY(4px);box-shadow:0 2px 0 #18834b;}
.gdp-bi .gdp-bi-start.is-small{font-size:12px;padding:13px 18px;box-shadow:0 4px 0 #18834b;}
.gdp-bi-quiet{display:inline-flex;align-items:center;gap:8px;padding:11px 15px;border-radius:12px;background:rgba(255,255,255,.05) !important;border:1px solid rgba(255,255,255,.13) !important;font-size:15px;color:#ddd7fb !important;text-decoration:none !important;}
.gdp-bi-quiet:hover{border-color:rgba(255,255,255,.3) !important;}
.gdp-bi-quiet svg{width:16px;height:16px;fill:currentColor;}
.gdp-bi-linkbtn{color:var(--bi-dim) !important;text-decoration:underline;font-size:14px;padding:8px 4px;}
.gdp-bi-linkbtn.is-danger{color:#ff8b95 !important;}
.gdp-bi-x{width:34px;height:34px;border-radius:9px;font-size:22px;line-height:1;color:#cfc8f5 !important;background:rgba(255,255,255,.06) !important;}
.js-bi-snd svg{width:18px;height:18px;fill:#fff;stroke:#fff;stroke-width:0;}
.js-bi-snd svg .w{fill:none;stroke-width:2;}
.js-bi-snd .off{display:none;}
.js-bi-snd.is-off .on{display:none;}
.js-bi-snd.is-off .off{display:inline;}
.gdp-bi-quiet.is-confirm,.gdp-bi-linkbtn.is-confirm{color:#fff !important;background:rgba(255,59,74,.25) !important;border-color:var(--bi-red) !important;}

/* ---------- setup ---------- */
.gdp-bi-setup{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:34px;align-items:start;padding:26px 16px 10px;}
.gdp-bi-logo{font-family:var(--bi-pix);line-height:1.12;margin:0 0 16px;font-size:clamp(30px,5.2vw,62px);text-transform:uppercase;letter-spacing:0;}
.gdp-bi-logo span{display:block;}
.gdp-bi-logo .l1{color:var(--bi-yellow);text-shadow:4px 4px 0 #b3361a,8px 8px 0 #3a0f4e,0 0 30px rgba(255,210,63,.45);}
.gdp-bi-logo .l2{color:var(--bi-green);text-shadow:4px 4px 0 #0d5c38,8px 8px 0 #3a0f4e,0 0 30px rgba(61,220,132,.45);margin-top:.16em;}
.gdp-bi-lede{font-size:clamp(17px,1.9vw,20px);color:#ddd7fb;max-width:560px;margin:0 0 22px;line-height:1.45;}
.gdp-bi-best{margin:0 0 20px;}
.gdp-bi-best-l{display:flex;align-items:baseline;gap:12px;}
.gdp-bi-best-l span{font-family:var(--bi-pix);font-size:10px;color:var(--bi-dim);letter-spacing:.08em;text-transform:uppercase;line-height:1.6;}
.gdp-bi-best-l b{font-family:var(--bi-pix);font-size:24px;color:var(--bi-yellow);text-shadow:0 0 16px rgba(255,210,63,.35);}
.gdp-bi-best p,.gdp-bi-first{margin:6px 0 0;color:#cfc8f5;font-size:15px;}
.gdp-bi-startrow{margin:0 0 14px;}
/* Level picker: a segmented pill with a sliding thumb. */
.gdp-bi-lvlwrap{margin:0 0 18px;}
.gdp-bi-lvlwrap .gdp-bi-lab{display:block;font-family:var(--bi-pix);font-size:10px;color:var(--bi-dim);letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px;}
.gdp-bi-lvls{position:relative;display:inline-flex;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.13);border-radius:999px;padding:4px;max-width:100%;}
.gdp-bi-lvls button{position:relative;z-index:1;padding:11px 18px;border-radius:999px;font-size:16px;font-weight:600;color:#c9c2ee !important;transition:color .2s;white-space:nowrap;}
.gdp-bi-lvls button.is-on{color:#140b00 !important;}
.gdp-bi-lvls button em{position:absolute;top:-10px;right:4px;font-style:normal;font-size:10px;font-weight:600;background:var(--bi-green);color:#03210f;border-radius:6px;padding:1px 6px;}
.gdp-bi-lvlthumb{position:absolute;top:4px;bottom:4px;left:4px;border-radius:999px;background:var(--bi-amber);box-shadow:0 0 18px rgba(255,164,0,.45);transition:left .25s,width .25s;}
.gdp-bi-lvlsub{margin:8px 0 0;font-size:15px;color:#cfc8f5;min-height:22px;}
/* Level set by a playlist or a Virtual Coach task */
.gdp-bi-lvls button:disabled{opacity:.38;cursor:not-allowed;}
.gdp-bi-lvllock{display:flex;align-items:center;gap:8px;margin:6px 0 0;font-size:14px;font-weight:600;color:var(--bi-amber,#ffa400);}
.gdp-bi-lvllock svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
.gdp-bi-lvlname{align-self:center;font-family:var(--bi-pix);font-size:9px;color:var(--bi-amber);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;margin-right:4px;}
.gdp-bi-trial{font-size:14px;color:var(--bi-dim);margin:4px 0 14px;}
.gdp-bi-trial a{color:var(--bi-amber);}
.gdp-bi-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;}
/* Voice choice: Caller / Simple voice / No voice */
.gdp-bi-voicewrap{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:18px;}
.gdp-bi-voicewrap .gdp-bi-lab{font-family:var(--bi-pix);font-size:10px;color:var(--bi-dim);letter-spacing:.08em;text-transform:uppercase;}
.gdp-bi-voice{display:inline-flex;gap:2px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:3px;max-width:100%;}
.gdp-bi-voice button{padding:7px 14px;border-radius:999px;font-size:14px;font-weight:600;color:#c9c2ee !important;white-space:nowrap;transition:background .2s,color .2s;}
.gdp-bi-voice button:hover{background:rgba(255,255,255,.07);}
.gdp-bi-voice button.is-on{background:var(--bi-cyan);color:#04162a !important;box-shadow:0 0 14px rgba(76,201,255,.4);}
.gdp-bi-voice button.is-hidden{display:none;}
.gdp-bi-voice button:focus-visible{outline:2px solid var(--bi-yellow);outline-offset:2px;}
@media (max-width:420px){.gdp-bi-voice button{padding:7px 10px;font-size:13px;}}
.gdp-bi-more{margin:4px 0 0;color:var(--bi-dim);font-size:14px;max-width:420px;}
.gdp-bi-more summary{cursor:pointer;padding:6px 0;}
.gdp-bi-darts-setup{padding:8px 0 4px;}
.gdp-bi-darts-setup select{max-width:280px;background:#120a2a;color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:6px 8px;}
.gdp-bi-teaser{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:18px;margin:0 0 16px;max-width:520px;}
.gdp-bi-teaser h2{text-transform:uppercase;font-family:var(--bi-pix);font-size:14px;line-height:1.5;color:var(--bi-yellow);margin:0 0 10px;}
.gdp-bi-teaser p{color:#ddd7fb;margin:0 0 14px;}
.gdp-bi-resume{background:linear-gradient(180deg,rgba(255,164,0,.12),rgba(255,164,0,.04));border:1px solid rgba(255,164,0,.5);border-radius:14px;padding:16px 18px;margin:0 0 18px;max-width:520px;}
.gdp-bi-resume-h{font-family:var(--bi-pix);font-size:11px;color:var(--bi-amber);margin-bottom:8px;text-transform:uppercase;}
.gdp-bi-resume p{margin:0 0 12px;color:#eee9ff;}
.gdp-bi-resume-b{display:flex;gap:10px;flex-wrap:wrap;align-items:center;}

.gdp-bi-setup-side{display:grid;gap:18px;}
.gdp-bi-lbcard,.gdp-bi-how{background:rgba(10,6,30,.72);border:1px solid rgba(164,107,255,.28);border-radius:16px;padding:16px 16px 14px;box-shadow:0 0 40px rgba(80,40,160,.2);}
.gdp-bi-lbhead{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px;}
.gdp-bi-lbhead h2,.gdp-bi-how h2{font-family:var(--bi-pix);font-size:13px;color:var(--bi-cyan);margin:0;text-transform:uppercase;letter-spacing:.04em;}
.gdp-bi-lbhead span{font-size:13px;color:var(--bi-dim);}
.gdp-bi-lb{list-style:none;margin:0;padding:0;max-height:430px;overflow:auto;}
.gdp-bi-lb li,.gdp-bi-lbme{display:grid;grid-template-columns:30px 26px minmax(0,1fr) auto 70px;gap:10px;align-items:center;padding:7px 8px;border-radius:9px;font-size:15px;}
.gdp-bi-lb li:nth-child(odd){background:rgba(255,255,255,.03);}
.gdp-bi-lb li.is-empty{display:block;color:var(--bi-dim);padding:14px 8px;}
.gdp-bi-lb .rk,.gdp-bi-lbme .rk{font-family:var(--bi-pix);font-size:11px;color:var(--bi-dim);text-align:right;}
.gdp-bi-lb .nm,.gdp-bi-lbme .nm{display:flex;align-items:center;gap:8px;min-width:0;}
.gdp-bi-lb .nm span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gdp-bi-lb .wv{font-size:12px;color:var(--bi-dim);white-space:nowrap;}
.gdp-bi-lb .sc,.gdp-bi-lbme .sc{font-family:var(--bi-pix);font-size:12px;text-align:right;color:#fff;}
.gdp-bi-lb li.is-top1 .rk{color:var(--bi-yellow);}.gdp-bi-lb li.is-top1 .sc{color:var(--bi-yellow);}
.gdp-bi-lb li.is-top2 .rk{color:#c9d1e0;}.gdp-bi-lb li.is-top3 .rk{color:#cd7f32;}
.gdp-bi-lb li.is-me,.gdp-bi-lbme{background:rgba(61,220,132,.13) !important;box-shadow:inset 0 0 0 1px rgba(61,220,132,.5);}
.gdp-bi-lbme{margin-top:8px;grid-template-columns:30px 26px minmax(0,1fr) 70px;}
/* Flag cell: the site's 'sm' flag, centred, so its own margins and baseline don't move it. */
.gdp-bi-lb .fl,.gdp-bi-lbme .fl{display:flex;align-items:center;justify-content:center;min-width:0;line-height:1;}
.gdp-bi-lb .fl > *,.gdp-bi-lbme .fl > *{display:block;margin:0;max-width:100%;}
.gdp-bi-lbnote{font-size:13px;color:var(--bi-dim);margin:10px 0 0;}
.gdp-bi-legend{list-style:none;margin:12px 0 14px;padding:0;display:grid;gap:8px;}
.gdp-bi-legend li{display:flex;align-items:center;gap:12px;font-size:15px;color:#ddd7fb;}
.gdp-bi-legend .gdp-bi-brick{position:relative;transform:none;flex:none;width:64px;height:38px;margin:0;font-size:20px;cursor:default;}
.gdp-bi-legend .gdp-bi-brick.is-small{font-size:17px;}
.gdp-bi-legend .gdp-bi-brick.is-xs{font-size:13px;}
.gdp-bi-legend .gdp-bi-brick .gdp-bi-sub{font-size:6px;}
.gdp-bi-rules{margin:0;padding:0 0 0 22px;display:grid;gap:7px;color:#e6e1ff;font-size:15px;line-height:1.4;}
.gdp-bi-rules li::marker{color:var(--bi-amber);font-family:var(--bi-pix);font-size:10px;}

/* ---------- play ---------- */
.gdp-bi-play{display:grid;grid-template-columns:minmax(0,1fr) 330px;grid-template-rows:auto 1fr;gap:0 18px;align-content:start;align-items:start;}
.gdp-bi-hud{grid-column:1/-1;display:flex;align-items:stretch;gap:8px;padding-right:46px;margin-bottom:10px;flex-wrap:nowrap;}
.gdp-bi-stat{background:rgba(10,6,30,.75);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:6px 12px 7px;min-width:92px;}
.gdp-bi-stat span,.gdp-bi-combo span{display:block;font-family:var(--bi-pix);font-size:8px;color:var(--bi-dim);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;}
.gdp-bi-stat b{display:block;font-family:var(--bi-pix);font-size:20px;font-weight:400;margin-top:6px;color:#fff;white-space:nowrap;}
.gdp-bi-stat.is-score{min-width:148px;}.gdp-bi-stat.is-score b{color:var(--bi-yellow);}
.gdp-bi-stat.is-wave b{color:var(--bi-cyan);}
.gdp-bi-stat.is-bricks b{color:var(--bi-green);}
.gdp-bi-combo{display:flex;align-items:center;gap:8px;padding:6px 12px;border-radius:10px;background:rgba(10,6,30,.75);border:1px solid rgba(255,255,255,.1);min-width:112px;}
.gdp-bi-combo b{display:block;font-family:var(--bi-pix);font-size:20px;font-weight:400;color:#6b6490;margin-top:5px;transition:color .2s;}
.gdp-bi-combo.lv2 b{color:var(--bi-yellow);}.gdp-bi-combo.lv3 b{color:var(--bi-amber);}.gdp-bi-combo.lv4 b{color:var(--bi-red);text-shadow:0 0 14px rgba(255,59,74,.8);}
.gdp-bi-pips{display:flex;gap:3px;}
.gdp-bi-pips i{width:7px;height:16px;border-radius:2px;background:#2a2450;}
.gdp-bi-pips i.on{background:var(--bi-amber);}
.gdp-bi-power{display:none;align-items:center;gap:10px;padding:6px 12px;border-radius:10px;background:rgba(76,201,255,.14);border:1px solid rgba(76,201,255,.5);font-family:var(--bi-pix);font-size:10px;color:var(--bi-cyan);white-space:nowrap;animation:gdpBiGlowC 1s ease-in-out infinite alternate;}
.gdp-bi-power.is-on{display:flex;}
.gdp-bi-power-d{display:flex;gap:4px;}.gdp-bi-power-d i{width:10px;height:10px;border-radius:50%;background:var(--bi-cyan);}.gdp-bi-power-d i.off{background:#1b3a4f;}
@keyframes gdpBiGlowC{to{box-shadow:0 0 20px rgba(76,201,255,.5);}}
.gdp-bi-sp{flex:1;}
.gdp-bi-icon{width:44px;min-height:44px;border-radius:10px;background:rgba(255,255,255,.05) !important;border:1px solid rgba(255,255,255,.13) !important;display:grid;place-items:center;}
.gdp-bi-icon svg{width:20px;height:20px;fill:#fff;}
.gdp-bi-savedot{align-self:center;width:10px;height:10px;border-radius:50%;background:transparent;transition:background .2s;}
.gdp-bi-savedot.is-wait{background:var(--bi-amber);box-shadow:0 0 8px var(--bi-amber);}
.gdp-bi-savedot.is-bad{background:var(--bi-red);box-shadow:0 0 8px var(--bi-red);}

.gdp-bi-fieldwrap{position:relative;display:flex;justify-content:center;align-items:flex-start;min-width:0;}
.gdp-bi-field{position:relative;border-radius:14px;background:linear-gradient(180deg,rgba(8,4,26,.45),rgba(18,6,40,.6));border:1px solid rgba(164,107,255,.28);box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),0 0 40px rgba(80,40,160,.25);overflow:hidden;}
.gdp-bi-field.is-shake1{animation:gdpBiShk1 .35s;}.gdp-bi-field.is-shake2{animation:gdpBiShk2 .6s;}
@keyframes gdpBiShk1{20%{transform:translate(-4px,2px);}40%{transform:translate(4px,-2px);}60%{transform:translate(-3px,1px);}80%{transform:translate(2px,0);}}
@keyframes gdpBiShk2{10%{transform:translate(-9px,4px);}25%{transform:translate(8px,-5px);}40%{transform:translate(-7px,3px);}55%{transform:translate(6px,-2px);}70%{transform:translate(-4px,2px);}85%{transform:translate(2px,-1px);}}
.gdp-bi-lane{position:absolute;left:0;right:0;top:0;height:var(--bi-rh);background:linear-gradient(180deg,rgba(255,59,74,.07),transparent);border-bottom:1px dashed rgba(255,255,255,.06);}
.gdp-bi-guide{position:absolute;top:var(--bi-rh);bottom:0;width:var(--bi-cw);background:linear-gradient(180deg,transparent,rgba(255,255,255,.025));pointer-events:none;}
.gdp-bi-deadline{position:absolute;left:0;right:0;height:2px;background:repeating-linear-gradient(90deg,rgba(255,59,74,.75) 0 10px,transparent 10px 18px);opacity:.55;}
.gdp-bi-dzone{position:absolute;left:0;right:0;background:linear-gradient(180deg,transparent,rgba(255,59,74,.3));opacity:0;transition:opacity .3s;pointer-events:none;}
.gdp-bi-field.is-danger1 .gdp-bi-dzone{opacity:.45;}
.gdp-bi-field.is-danger2 .gdp-bi-dzone{opacity:1;animation:gdpBiDz .7s ease-in-out infinite alternate;}
@keyframes gdpBiDz{to{opacity:.4;}}
.gdp-bi-dtag{position:absolute;left:10px;bottom:8px;font-family:var(--bi-pix);font-size:10px;color:var(--bi-red);opacity:0;letter-spacing:.1em;z-index:6;pointer-events:none;}
.gdp-bi-field.is-danger2 .gdp-bi-dtag{opacity:1;animation:gdpBiBlink .6s steps(1) infinite;}
@keyframes gdpBiBlink{50%{opacity:0;}}

/* bricks */
.gdp-bi-brick{position:absolute;left:0;top:0;width:calc(var(--bi-cw) - 6px);height:calc(var(--bi-rh) - 6px);margin:3px;border-radius:6px;
  display:flex;align-items:center;justify-content:center;white-space:nowrap;
  font-family:var(--bi-brick);font-size:calc(var(--bi-rh) * .62);line-height:1;letter-spacing:.01em;
  transition:transform .14s steps(2,end);will-change:transform;cursor:pointer;
  box-shadow:inset 0 3px 0 rgba(255,255,255,.55),inset 0 -4px 0 rgba(0,0,0,.35),inset 0 0 0 2px rgba(0,0,0,.25),0 0 14px var(--glow),0 3px 0 rgba(0,0,0,.6);}
.gdp-bi-brick.is-small{font-size:calc(var(--bi-rh) * .52);}
.gdp-bi-brick.is-xs{font-size:calc(var(--bi-rh) * .4);}
/* D and T on their own dark tag: in the brick font a small T beside a
   number reads like a 1 (T5 like 15) from the oche. The tag keeps the
   letter apart from the number at 2.5 m. */
.gdp-bi-pfx{font-size:.62em;line-height:1;padding:.12em .2em .06em;margin-right:.14em;border-radius:.22em;
  background:rgba(0,0,0,.5);color:#fff;text-shadow:none;flex:none;}
.gdp-bi-sub{font-family:var(--bi-pix);position:absolute;bottom:calc(var(--bi-rh) * .05);font-size:calc(var(--bi-rh) * .15);opacity:.85;letter-spacing:.05em;text-transform:uppercase;}
.gdp-bi-brick.k-S{background:linear-gradient(180deg,#ffe479,#ffc61a 55%,#e3a400);color:#2a1700;--glow:rgba(255,210,63,.35);}
.gdp-bi-brick.k-D{background:linear-gradient(180deg,#ff7b86,#ff3247 55%,#c4142b);color:#fff;--glow:rgba(255,59,74,.45);text-shadow:0 2px 0 rgba(0,0,0,.35);}
.gdp-bi-brick.k-T{background:linear-gradient(180deg,#7df0ae,#2fd27a 55%,#139a52);color:#032312;--glow:rgba(61,220,132,.42);}
.gdp-bi-brick.k-V{background:linear-gradient(180deg,#c9a6ff,#9257ff 55%,#6a2fe0);color:#fff;--glow:rgba(164,107,255,.5);text-shadow:0 2px 0 rgba(0,0,0,.35);font-size:calc(var(--bi-rh) * .52);}
.gdp-bi-brick.k-V .gdp-bi-num{transform:translateY(-16%);}
.gdp-bi-brick.k-B{background:linear-gradient(180deg,#fff,#d6dbe8 55%,#9aa3b8);color:#141826;--glow:rgba(255,255,255,.45);}
.gdp-bi-bull{display:inline-block;width:.62em;height:.62em;border-radius:50%;margin-right:.18em;flex:none;background:radial-gradient(circle,#e8233a 0 32%,#159a4b 33% 70%,#141826 71%);}
/* Idle hover: the wall floats a few pixels while it waits for a dart, a
   slow bob with a hint of sway. Each brick starts at its own point of the
   loop (--hd, from where it was built), so a ripple runs across the wall.
   Uses the translate and rotate properties, so the step moves (transform)
   and the hit animations (later rules, same weight) are untouched. */
.gdp-bi-bricklayer .gdp-bi-brick{animation:gdpBiHover 3.2s ease-in-out var(--hd,0s) infinite;}
@keyframes gdpBiHover{
  0%,100%{translate:0 0;rotate:0deg;}
  25%{translate:0 calc(var(--bi-rh) * -.05);rotate:-.7deg;}
  50%{translate:0 calc(var(--bi-rh) * -.085);rotate:0deg;}
  75%{translate:0 calc(var(--bi-rh) * -.035);rotate:.7deg;}
}
@media (prefers-reduced-motion:reduce){.gdp-bi-bricklayer .gdp-bi-brick{animation:none;}}
.gdp-bi-brick.is-spawn{animation:gdpBiSpawn .5s cubic-bezier(.2,1.4,.4,1) backwards;}
@keyframes gdpBiSpawn{from{opacity:0;translate:0 calc(var(--bi-rh) * -3);}}
.gdp-bi-brick.is-boom{animation:gdpBiBoom .32s ease-out forwards;pointer-events:none;}
@keyframes gdpBiBoom{40%{filter:brightness(3);scale:1.15;}100%{opacity:0;scale:1.5;filter:brightness(4) blur(2px);}}
.has-board .gdp-bi-brick{cursor:default;}
/* Intermediate and Advanced: a brick with another below it is blocked. */
.gdp-bi-brick{transition:transform .14s steps(2,end),filter .25s,opacity .25s;}
.gdp-bi-brick.is-blocked{filter:saturate(.45) brightness(.5);box-shadow:inset 0 3px 0 rgba(255,255,255,.25),inset 0 -4px 0 rgba(0,0,0,.35),inset 0 0 0 2px rgba(0,0,0,.35),0 3px 0 rgba(0,0,0,.6);}
.gdp-bi-brick.is-denied{animation:gdpBiDenied .5s;}
@keyframes gdpBiDenied{15%{translate:-4px 0;}35%{translate:4px 0;}55%{translate:-3px 0;}75%{translate:2px 0;}}
.gdp-bi-brick.is-shield{animation:gdpBiShield .45s;}
/* Advanced: armoured bricks. A steel frame with rivets and a badge (x3, x2).
   Each hit: the brick flinches and flashes, the old badge flies off, the
   new one punches in, cracks appear. The last layer shatters to the plain
   brick, which then needs one more hit. */
.gdp-bi-brick.is-armor{outline:none;}
.gdp-bi-brick.is-armor::before{content:"";position:absolute;inset:-2px;border-radius:8px;pointer-events:none;
  border:3px solid #cfd8ea;box-shadow:inset 0 0 0 1px rgba(0,0,0,.45),0 0 10px rgba(207,216,234,.55);
  background:
    radial-gradient(circle,#f4f7fc 0 1.6px,#59627a 2.2px,transparent 2.8px) 3px 3px/6px 6px no-repeat,
    radial-gradient(circle,#f4f7fc 0 1.6px,#59627a 2.2px,transparent 2.8px) calc(100% - 3px) 3px/6px 6px no-repeat,
    radial-gradient(circle,#f4f7fc 0 1.6px,#59627a 2.2px,transparent 2.8px) 3px calc(100% - 3px)/6px 6px no-repeat,
    radial-gradient(circle,#f4f7fc 0 1.6px,#59627a 2.2px,transparent 2.8px) calc(100% - 3px) calc(100% - 3px)/6px 6px no-repeat,
    linear-gradient(115deg,transparent 30%,rgba(255,255,255,.28) 45%,transparent 60%);}
.gdp-bi-brick.is-armor.h3::before{border-width:4px;border-style:double;border-color:#e6ecf7;box-shadow:inset 0 0 0 2px rgba(0,0,0,.4),0 0 16px rgba(230,236,247,.75);}
.gdp-bi-brick.is-cracked::after{content:"";position:absolute;inset:0;border-radius:6px;pointer-events:none;opacity:.75;
  background:no-repeat center/100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 60' preserveAspectRatio='none' fill='none' stroke='%23141020' stroke-width='2.2' stroke-linejoin='round'%3E%3Cpath d='M8 4 L22 20 L16 30 L30 44 L26 58'/%3E%3Cpath d='M22 20 L36 16'/%3E%3Cpath d='M92 6 L80 18 L86 28 L72 40'/%3E%3Cpath d='M80 18 L66 14'/%3E%3C/svg%3E");}
.gdp-bi-armor{position:absolute;top:calc(var(--bi-rh) * -.2);right:calc(var(--bi-cw) * -.06);z-index:2;
  font-family:var(--bi-pix);font-size:max(9px,calc(var(--bi-rh) * .24));line-height:1;letter-spacing:0;color:#fff;
  background:linear-gradient(180deg,#3a4258,#1a1f2e);border:2px solid #e6ecf7;border-radius:6px;padding:3px 4px 3px 5px;
  box-shadow:0 2px 0 rgba(0,0,0,.6),0 0 10px rgba(230,236,247,.6);text-shadow:0 1px 0 #000;pointer-events:none;}
.gdp-bi-brick.h3 .gdp-bi-armor{background:linear-gradient(180deg,#ff7b86,#c4142b);border-color:#ffe3e6;box-shadow:0 2px 0 rgba(0,0,0,.6),0 0 12px rgba(255,59,74,.75);}
.gdp-bi-armor.is-new{animation:gdpBiBadgeIn .42s cubic-bezier(.2,1.6,.4,1);}
@keyframes gdpBiBadgeIn{0%{transform:scale(2.2) rotate(-12deg);opacity:0;}60%{opacity:1;}100%{transform:scale(1) rotate(0);}}
.gdp-bi-armor.is-fly{position:absolute;right:auto;z-index:7;animation:gdpBiBadgeFly .65s ease-in forwards;}
@keyframes gdpBiBadgeFly{0%{transform:translate(0,0) rotate(0);opacity:1;}100%{transform:translate(26px,-46px) rotate(38deg) scale(.6);opacity:0;}}
.gdp-bi-brick.is-hitarmor{animation:gdpBiHitArmor .4s ease-out;}
@keyframes gdpBiHitArmor{0%{filter:brightness(2.4);}20%{translate:0 -4px;scale:1.06;}45%{translate:0 2px;scale:.97;}100%{filter:none;translate:0 0;scale:1;}}
.gdp-bi-brick.is-bare{animation:gdpBiBare .55s ease-out;}
@keyframes gdpBiBare{0%{filter:brightness(3) saturate(0);}30%{scale:1.12;}100%{filter:none;scale:1;}}
.gdp-bi-legend .gdp-bi-brick .gdp-bi-armor{font-size:9px;top:-8px;right:-6px;}
@keyframes gdpBiShield{30%{filter:brightness(1.8);box-shadow:0 0 0 3px #cfd8ea,0 0 24px #cfd8ea;}}

/* Bonus target: a small dartboard and its double. Pops in, a ring counts
   down the darts it stays, blinks for the last two, fades out. */
.gdp-bi-target{position:absolute;top:0;left:0;width:calc(var(--bi-cw) * 1.7);height:var(--bi-rh);display:flex;align-items:center;gap:calc(var(--bi-cw) * .06);cursor:pointer;z-index:3;}
.gdp-bi-tgsvg{width:calc(var(--bi-rh) * .96);height:calc(var(--bi-rh) * .96);flex:none;overflow:visible;filter:drop-shadow(0 0 8px rgba(255,210,63,.55));animation:gdpBiTgSpin 6s linear infinite;}
@keyframes gdpBiTgSpin{to{transform:rotate(360deg);}}
.gdp-bi-tgring{fill:none;stroke:#ffd23f;stroke-width:6;stroke-linecap:round;stroke-dasharray:var(--tg-left,100) 100;transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dasharray .3s;}
.gdp-bi-tglab{font-family:var(--bi-brick);font-size:calc(var(--bi-rh) * .5);color:#fff;-webkit-text-stroke:1.5px #2a0008;paint-order:stroke fill;
  text-shadow:0 2px 0 #000,0 0 10px #ff3b4a;background:linear-gradient(180deg,#ff7b86,#c4142b);border:2px solid #ffe3e6;border-radius:7px;padding:1px 6px;line-height:1.1;}
.gdp-bi-target.is-in{animation:gdpBiTgIn .6s cubic-bezier(.2,1.5,.4,1);}
@keyframes gdpBiTgIn{0%{opacity:0;scale:.2;filter:brightness(3);}60%{opacity:1;}100%{scale:1;filter:none;}}
.gdp-bi-target.is-last .gdp-bi-tgsvg,.gdp-bi-target.is-last .gdp-bi-tglab{animation:gdpBiTgBlink .5s steps(2) infinite;}
@keyframes gdpBiTgBlink{50%{opacity:.35;}}
.gdp-bi-target.is-out{animation:gdpBiTgOut .5s ease-in forwards;pointer-events:none;}
@keyframes gdpBiTgOut{to{opacity:0;scale:.6;filter:blur(3px);}}
.has-board .gdp-bi-target{cursor:default;}

/* ship */
.gdp-bi-ship{position:absolute;left:0;width:var(--bi-cw);height:calc(var(--bi-rh) * 1.35);transition:transform .16s cubic-bezier(.3,.9,.3,1);pointer-events:none;}
.gdp-bi-ship svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 0 10px rgba(255,164,0,.5));transition:transform .15s ease-out;transform-origin:50% 70%;}
/* The ship leans into a slide, then kicks back when it fires. */
.gdp-bi-ship.is-tilt-l svg{transform:rotate(-14deg) scaleX(.94);}
.gdp-bi-ship.is-tilt-r svg{transform:rotate(14deg) scaleX(.94);}
.gdp-bi-ship.is-tilt-l .flame,.gdp-bi-ship.is-tilt-r .flame{animation-duration:.1s;}
.gdp-bi-ship.is-fire svg{animation:gdpBiRecoil .26s ease-out;}
@keyframes gdpBiRecoil{0%{transform:translateY(0) scaleY(1);}25%{transform:translateY(9%) scaleY(.9);}100%{transform:translateY(0) scaleY(1);}}
.gdp-bi-ship .flame{animation:gdpBiFlame .25s ease-in-out infinite alternate;transform-origin:30px 70px;}
@keyframes gdpBiFlame{to{transform:scaleY(1.35);}}
.gdp-bi-ship.is-spread svg{filter:drop-shadow(0 0 14px rgba(76,201,255,.95));}
.gdp-bi-ship.is-dead{animation:gdpBiShipDead .9s forwards;}
@keyframes gdpBiShipDead{30%{filter:brightness(4);}100%{opacity:0;scale:1.8;}}
.gdp-bi-fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:5;}
.gdp-bi-pop{text-transform:uppercase;position:absolute;font-family:var(--bi-pix);font-size:calc(var(--bi-rh) * .34);pointer-events:none;z-index:6;white-space:nowrap;transform:translate(-50%,-50%);animation:gdpBiPop 1s ease-out forwards;text-shadow:0 2px 0 #000;}
@keyframes gdpBiPop{0%{opacity:0;translate:0 6px;scale:.6;}15%{opacity:1;scale:1.15;}100%{opacity:0;translate:0 calc(var(--bi-rh) * -1.4);}}
.gdp-bi-banner{text-transform:uppercase;position:absolute;left:50%;top:60%;transform:translate(-50%,-50%);z-index:8;text-align:center;pointer-events:none;font-family:var(--bi-pix);white-space:nowrap;max-width:96%;}
.gdp-bi-banner .b1{font-size:clamp(15px,calc(var(--bi-cw) * .4),34px);color:#fff;text-shadow:3px 3px 0 #3a0f4e,0 0 24px currentColor;}
.gdp-bi-banner .b2{font-size:clamp(9px,calc(var(--bi-cw) * .18),15px);margin-top:12px;color:var(--bi-amber);white-space:normal;}
.gdp-bi-banner.is-in{animation:gdpBiBan 1.7s ease-out forwards;}
@keyframes gdpBiBan{0%{opacity:0;scale:2.2;}12%{opacity:1;scale:1;}80%{opacity:1;}100%{opacity:0;scale:.9;}}
.gdp-bi-banner.gold .b1{color:var(--bi-yellow);}.gdp-bi-banner.cyan .b1{color:var(--bi-cyan);}.gdp-bi-banner.red .b1{color:var(--bi-red);}.gdp-bi-banner.green .b1{color:var(--bi-green);}

/* panel */
.gdp-bi-panel{display:flex;flex-direction:column;gap:10px;min-width:0;}
.gdp-bi-darts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.gdp-bi-dbox{position:relative;height:74px;border-radius:12px;background:rgba(10,6,30,.8) !important;border:1px solid rgba(255,255,255,.13) !important;display:grid;place-items:center;color:#4d4673 !important;transition:border-color .2s,background .2s;cursor:default !important;}
.gdp-bi-dbox b{font-family:var(--bi-brick);font-weight:400;font-size:28px;}
.gdp-bi-dbox .n{position:absolute;top:6px;left:8px;font-family:var(--bi-pix);font-size:8px;color:var(--bi-dim);text-transform:uppercase;}
.gdp-bi-dbox .pts{position:absolute;bottom:5px;right:8px;font-family:var(--bi-pix);font-size:9px;color:var(--bi-green);}
.gdp-bi-dbox.is-cur{border-color:var(--bi-amber) !important;box-shadow:inset 0 0 0 1px var(--bi-amber),0 0 18px rgba(255,164,0,.3);}
.gdp-bi-dbox.is-hit{color:#fff !important;background:rgba(61,220,132,.16) !important;border-color:rgba(61,220,132,.6) !important;}
.gdp-bi-dbox.is-miss{color:#ff8b95 !important;background:rgba(255,59,74,.12) !important;border-color:rgba(255,59,74,.5) !important;}
.gdp-bi-dbox.is-fixable{cursor:pointer !important;}
.gdp-bi-dbox.is-fixable::after{content:"";position:absolute;top:6px;right:7px;width:12px;height:12px;opacity:.75;
  background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4'%3E%3Cpath d='M4 20h4L19 9l-4-4L4 16z'/%3E%3C/svg%3E");}
.gdp-bi-mult{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.gdp-bi-mult button{height:50px;border-radius:12px;font-family:var(--bi-pix);font-size:12px;background:rgba(255,255,255,.05) !important;border:1px solid rgba(255,255,255,.14) !important;color:#c9c2ee !important;text-transform:uppercase;}
.gdp-bi-mult button.on[data-m="1"]{background:var(--bi-yellow) !important;color:#2a1700 !important;border-color:transparent !important;box-shadow:0 0 16px rgba(255,210,63,.45);}
.gdp-bi-mult button.on[data-m="2"]{background:var(--bi-red) !important;color:#fff !important;border-color:transparent !important;box-shadow:0 0 16px rgba(255,59,74,.5);}
.gdp-bi-mult button.on[data-m="3"]{background:#2fd27a !important;color:#032312 !important;border-color:transparent !important;box-shadow:0 0 16px rgba(61,220,132,.5);}
.gdp-bi-nums{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:8px;}
.gdp-bi-nums button{height:52px;border-radius:10px;font-family:var(--bi-brick);font-size:22px;background:rgba(255,255,255,.06) !important;border:1px solid rgba(255,255,255,.12) !important;position:relative;transition:background .15s,transform .06s;}
.gdp-bi-nums button:active,.gdp-bi-extra button:active{transform:scale(.94);}
.gdp-bi-nums button.has::after{content:"";position:absolute;top:5px;right:5px;width:6px;height:6px;border-radius:50%;background:var(--mc,var(--bi-yellow));box-shadow:0 0 6px var(--mc,var(--bi-yellow));}
.gdp-bi-pad.m2 .gdp-bi-nums button,.gdp-bi-sheet-card.m2 .gdp-bi-nums button{--mc:var(--bi-red);background:rgba(255,59,74,.1) !important;}
.gdp-bi-pad.m3 .gdp-bi-nums button,.gdp-bi-sheet-card.m3 .gdp-bi-nums button{--mc:var(--bi-green);background:rgba(61,220,132,.1) !important;}
.gdp-bi-extra{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:6px;}
.gdp-bi-extra button{height:50px;border-radius:10px;font-family:var(--bi-pix);font-size:11px;background:rgba(255,255,255,.06) !important;border:1px solid rgba(255,255,255,.12) !important;text-transform:uppercase;}
.gdp-bi-extra .b25{color:#7df0ae !important;}.gdp-bi-extra .b50{color:#ff7b86 !important;}.gdp-bi-extra .miss{color:#ff8b95 !important;}.gdp-bi-extra .undo{color:#c9c2ee !important;}
.gdp-bi-hint{position:relative;padding:11px 44px 11px 13px;border-radius:12px;background:rgba(255,164,0,.09);border:1px solid rgba(255,164,0,.35);font-size:14px;line-height:1.4;color:#ffe3b0;}
.gdp-bi-hint p{margin:0;}
.gdp-bi-hint .gdp-bi-x{position:absolute;top:6px;right:6px;width:30px;height:30px;font-size:18px;}
.gdp-bi-boardnote,.gdp-bi-demonote{display:none;padding:12px 14px;border-radius:12px;background:rgba(76,201,255,.08);border:1px solid rgba(76,201,255,.35);font-size:15px;line-height:1.4;color:#cfefff;}
.gdp-bi.has-board .gdp-bi-boardnote{display:block;}
.gdp-bi.has-board .gdp-bi-pad,.gdp-bi.has-board .gdp-bi-hint{display:none;}
.gdp-bi.has-board .gdp-bi-dbox{height:110px;}
.gdp-bi.has-board .gdp-bi-dbox b{font-size:40px;}
.gdp-bi.is-demo .gdp-bi-demonote{display:block;}
.gdp-bi.is-demo .gdp-bi-pad,.gdp-bi.is-demo .gdp-bi-hint{opacity:.45;pointer-events:none;}

.gdp-bi-flash{position:absolute;left:50%;top:14px;z-index:30;transform:translate(-50%,-20px);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;
  background:#1a1040;border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:10px;padding:10px 16px;font-size:15px;box-shadow:0 8px 30px rgba(0,0,0,.5);max-width:90%;text-align:center;}
.gdp-bi-flash.is-on{opacity:1;transform:translate(-50%,0);}
.gdp-bi-flash.bad{border-color:var(--bi-red);}

/* ---------- result ---------- */
.gdp-bi-result{padding-top:44px;display:flex;justify-content:center;}
.gdp-bi-card{width:min(580px,100%);background:linear-gradient(180deg,#140b30,#0a0619);border:1px solid rgba(164,107,255,.35);border-radius:18px;padding:28px 24px 24px;text-align:center;box-shadow:0 0 60px rgba(120,60,220,.35);}
.gdp-bi-card.is-in{animation:gdpBiCardIn .45s cubic-bezier(.2,1.2,.4,1);}
@keyframes gdpBiCardIn{from{opacity:0;transform:translateY(16px) scale(.96);}}
.gdp-bi-rtitle{font-family:var(--bi-pix);text-transform:uppercase;font-size:clamp(20px,4vw,32px);margin:0 0 8px;color:var(--bi-red);text-shadow:4px 4px 0 #3a0f4e;line-height:1.2;}
.gdp-bi-rtitle.is-ended{color:var(--bi-amber);}
.gdp-bi-rsub{color:#d8d2f5;margin:0;font-size:16px;}
.gdp-bi-bigscore{font-family:var(--bi-pix);font-size:clamp(30px,7vw,52px);color:var(--bi-yellow);margin:18px 0 6px;text-shadow:0 0 24px rgba(255,210,63,.45);}
.gdp-bi-pbs{min-height:26px;}
.gdp-bi-pbs:empty,.gdp-bi-rank:empty{display:none;}
.gdp-bi-pb{display:inline-block;font-family:var(--bi-pix);text-transform:uppercase;font-size:10px;padding:6px 10px;border-radius:6px;background:var(--bi-green);color:#03210f;}
.gdp-bi-pbgap{font-size:14px;color:var(--bi-dim);}
.gdp-bi-medals{display:flex;justify-content:center;gap:10px;margin:10px 0 4px;}
.gdp-bi-medal{width:56px;text-align:center;font-size:12px;color:var(--bi-dim);opacity:.35;}
.gdp-bi-medal.is-on{opacity:1;color:#fff;}
.gdp-bi-medal svg{width:42px;height:42px;display:block;margin:0 auto 3px;}
.gdp-bi-medals.is-mini{justify-content:flex-start;gap:6px;margin:8px 0 0;}
.gdp-bi-medals.is-mini .gdp-bi-medal{width:46px;font-size:11px;}
.gdp-bi-medals.is-mini svg{width:32px;height:32px;}
.gdp-bi-next{font-size:15px;color:#d8d2f5;margin:6px 0 4px;}
.gdp-bi-rank{min-height:22px;margin:8px 0 0;font-size:16px;color:#cfefff;}
.gdp-bi-rankpill{display:inline-block;font-family:var(--bi-pix);font-size:12px;background:var(--bi-cyan);color:#04202e;border-radius:6px;padding:5px 8px;margin-right:4px;}
.gdp-bi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0;}
.gdp-bi-grid div{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:10px 6px;}
.gdp-bi-grid b{display:block;font-family:var(--bi-pix);font-weight:400;font-size:15px;color:#fff;margin-bottom:6px;}
.gdp-bi-grid span{font-size:13px;color:var(--bi-dim);}
.gdp-bi-saved{display:flex;align-items:center;justify-content:center;gap:8px;min-height:24px;font-size:14px;color:var(--bi-dim);margin:0 0 16px;}
.gdp-bi-saved svg{width:16px;height:16px;fill:none;stroke:var(--bi-green);stroke-width:3;}
.gdp-bi-saved.is-ok{color:#bdf5d4;}.gdp-bi-saved.is-bad{color:#ff8b95;}.gdp-bi-saved.is-wait{color:#ffd9a0;}
.gdp-bi-spin{width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,255,255,.2);border-top-color:var(--bi-amber);animation:gdpBiSpin .8s linear infinite;}
@keyframes gdpBiSpin{to{transform:rotate(360deg);}}
.gdp-bi-ractions{display:flex;flex-direction:column;align-items:center;gap:12px;}

/* ---------- exit dialog, correction sheet ---------- */
.gdp-bi-modal,.gdp-bi-sheet{position:fixed;inset:0;z-index:1190;display:grid;place-items:center;background:rgba(3,1,10,.8);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);padding:16px;visibility:visible;}
.gdp-bi-sheet{z-index:1195;}
.gdp-bi-modal .gdp-bi-card h2{text-transform:uppercase;font-family:var(--bi-pix);font-size:20px;color:var(--bi-yellow);margin:0 0 10px;}
.gdp-bi-exitsum{color:#ddd7fb;margin:0 0 18px;}
.gdp-bi-exitopts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px;}
.gdp-bi-exitopt{text-align:left;padding:14px;border-radius:12px;background:rgba(255,255,255,.05) !important;border:1px solid rgba(255,255,255,.13) !important;}
.gdp-bi-exitopt b{display:block;font-size:17px;color:#fff;margin-bottom:4px;}
.gdp-bi-exitopt span{font-size:14px;color:var(--bi-dim);line-height:1.35;}
.gdp-bi-exitopt.is-end b{color:var(--bi-amber);}
.gdp-bi-exitempty,.gdp-bi-exitleave{display:none !important;}
.gdp-bi-modal.is-empty .gdp-bi-exitopts{display:none;}
.gdp-bi-modal.is-empty .gdp-bi-exitempty{display:block !important;color:var(--bi-dim);margin:14px 0 0;}
.gdp-bi-modal.is-empty .gdp-bi-exitleave{display:inline-block !important;}
.gdp-bi-sheet-card{width:min(440px,100%);background:linear-gradient(180deg,#160d34,#0a0619);border:1px solid rgba(76,201,255,.45);border-radius:16px;padding:16px;box-shadow:0 0 50px rgba(76,201,255,.25);}
.gdp-bi-sheet-h{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.gdp-bi-sheet-h b{text-transform:uppercase;font-family:var(--bi-pix);font-size:12px;color:var(--bi-cyan);}
.gdp-bi-sheet-h span{flex:1;color:#ddd7fb;font-size:15px;}
.gdp-bi-sheet-sug{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px;}
.gdp-bi-sheet-sug button{padding:10px 16px;border-radius:10px;font-family:var(--bi-brick);font-size:20px;background:rgba(76,201,255,.15) !important;border:1px solid rgba(76,201,255,.5) !important;}
.gdp-bi-sheet .gdp-bi-extra{grid-template-columns:repeat(3,1fr);}
.gdp-bi-sheet .gdp-bi-linkbtn{display:block;margin:10px auto 0;}

/* ---------- phones and narrow screens ---------- */
@media (max-width:1100px){ .gdp-bi-stat.is-hi{display:none;} }
@media (max-width:900px){
  .gdp-bi-setup{grid-template-columns:1fr;gap:22px;padding:18px 4px 6px;}
}
@media (max-width:860px),(max-aspect-ratio:1/1){
  .gdp .gdp-wrap.js-bi-wrap{padding:12px 8px 14px;}
  .gdp-bi-play{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;gap:8px;}
  .gdp-bi-hud{gap:6px;padding-right:44px;margin-bottom:0;}
  .gdp-bi-stat{min-width:0;padding:5px 8px 6px;flex:1;}
  .gdp-bi-stat.is-score{min-width:0;flex:1.5;}
  .gdp-bi-stat span,.gdp-bi-combo span{font-size:6px;letter-spacing:0;}
  .gdp-bi-stat b{font-size:14px;margin-top:4px;}
  .gdp-bi-combo{min-width:0;padding:4px 8px;}.gdp-bi-combo b{font-size:14px;}.gdp-bi-pips{display:none;}
  /* The Spread pill sits over the top of the field instead of in the row:
     in the row it pushed the whole play screen sideways on phones. */
  .gdp-bi-hud{position:relative;}
  .gdp-bi-power{position:absolute;left:50%;top:calc(100% + 14px);transform:translateX(-50%);z-index:6;padding:5px 10px;font-size:9px;
    background:rgba(8,20,34,.88);box-shadow:0 4px 14px rgba(0,0,0,.5);}
  .gdp-bi-lvlname{display:none;}
  .gdp-bi-lvls button{padding:10px 12px;font-size:15px;}
  .gdp-bi-panel{gap:7px;}
  .gdp-bi-dbox{height:48px;}.gdp-bi-dbox b{font-size:20px;}
  .gdp-bi.has-board .gdp-bi-dbox{height:72px;}.gdp-bi.has-board .gdp-bi-dbox b{font-size:30px;}
  .gdp-bi-mult button{height:40px;font-size:10px;}
  .gdp-bi-nums{gap:5px;margin-top:6px;}.gdp-bi-nums button{height:42px;font-size:19px;}
  .gdp-bi-extra button{height:42px;font-size:10px;}
  .gdp-bi-hint{font-size:13px;}
}
@media (max-width:860px) and (min-aspect-ratio:1/1){ .gdp-bi-play{grid-template-columns:minmax(0,1fr) 290px;grid-template-rows:auto 1fr;} }
@media (max-width:520px){
  .gdp-bi-hud .gdp-bi-icon.js-bi-snd{display:none;}
  .gdp-bi-icon{width:38px;}
  .gdp-bi-grid{grid-template-columns:repeat(2,1fr);}
  .gdp-bi-exitopts{grid-template-columns:1fr;}
  .gdp-bi-lb li{grid-template-columns:26px 24px minmax(0,1fr) 64px;gap:8px;}
  .gdp-bi-lbme{grid-template-columns:26px 24px minmax(0,1fr) 64px;gap:8px;}
  .gdp-bi-lb .wv{display:none;}
}
/* Full screen: the frame fills the screen; the field sizes itself to it. */
html.gdp-fs:not(.gdp-fs-plain) .gdp .gdp-wrap.js-bi-wrap{min-height:100vh;}
/* The play screen may use the whole width: the field is read from the oche. */
html.gdp-fs:not(.gdp-fs-plain) .gdp .gdp-wrap.js-bi-wrap > section.gdp-bi-play{max-width:none;}
/* Short phones: a tighter pad so the whole game fits one screen. */
@media (max-height:700px) and (max-aspect-ratio:1/1){
  .gdp .gdp-wrap.js-bi-wrap{padding-top:8px;}
  .gdp-bi-hud{margin-bottom:0;}
  .gdp-bi-stat,.gdp-bi-combo{padding-top:3px;padding-bottom:4px;}
  .gdp-bi-stat b,.gdp-bi-combo b{font-size:12px;margin-top:3px;}
  .gdp-bi-icon{min-height:36px;}
  .gdp-bi-panel{gap:5px;}
  .gdp-bi-dbox{height:36px;}.gdp-bi-dbox b{font-size:16px;}.gdp-bi-dbox .n{display:none;}.gdp-bi-dbox .pts{bottom:2px;font-size:7px;}
  .gdp-bi-mult{gap:5px;}.gdp-bi-mult button{height:32px;font-size:9px;}
  .gdp-bi-nums{gap:4px;margin-top:4px;}.gdp-bi-nums button{height:34px;font-size:16px;}
  .gdp-bi-extra{gap:4px;margin-top:4px;}.gdp-bi-extra button{height:34px;font-size:9px;}
  .gdp-bi-hint{display:none;}
}

@media (prefers-reduced-motion:reduce){
  .gdp-bi *,.gdp-bi *::before,.gdp-bi *::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
}

/* =====================================================================
   YOUR STATS. The shared tab and layer (gdp-game.css), dressed for the
   arcade: night sky, pixel headings, the brick colours.
   ===================================================================== */
.gdp-bi.is-playing .gdp-bi-statstab{display:none;}
.gdp-bi .gdp-bi-statstab{font-family:var(--bi-pix);font-size:10px;letter-spacing:.12em;background:var(--bi-amber);color:#1b0f00;}
.gdp-bi.is-stats-open .gdp-bi-statstab{visibility:hidden;}
.gdp-bi-stats .gdp-stats-panel{background:radial-gradient(900px 420px at 50% -10%,rgba(90,45,180,.55),rgba(10,6,30,0) 65%),linear-gradient(#0d0826,#060312);color:var(--bi-ink);}
.gdp-bi-st-head{gap:14px;flex-wrap:wrap;border-bottom:1px solid rgba(164,107,255,.25);}
.gdp-bi-st-head h2{font-family:var(--bi-pix) !important;font-size:15px !important;letter-spacing:.06em;color:var(--bi-yellow);text-transform:uppercase;text-shadow:0 3px 0 #8a4a00;margin:0;}
.gdp-bi-st-lvls{display:inline-flex;gap:2px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:3px;margin-left:auto;}
.gdp-bi-st-lvls button{padding:7px 14px;border-radius:999px;font-size:14px;font-weight:600;color:#c9c2ee !important;white-space:nowrap;}
.gdp-bi-st-lvls button:hover{background:rgba(255,255,255,.07);}
.gdp-bi-st-lvls button.is-on{background:var(--bi-amber);color:#140b00 !important;box-shadow:0 0 14px rgba(255,164,0,.4);}
.gdp-bi-st-x{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.14);flex:0 0 auto;}
.gdp-bi-st-x svg{width:18px;height:18px;stroke:#e6e0ff;stroke-width:2.4;stroke-linecap:round;fill:none;}
.gdp-bi-st-x:hover{border-color:var(--bi-amber);}
.gdp-bi-stats button:focus-visible,.gdp-bi-stats [tabindex]:focus-visible{outline:2px solid var(--bi-yellow);outline-offset:2px;}
.gdp-bi-st-body{padding:20px 22px 34px;}
.gdp-bi-st-msg{display:flex;align-items:center;justify-content:center;gap:12px;min-height:220px;color:#cfc8f5;font-size:16px;text-align:center;flex-wrap:wrap;}
.gdp-bi-st-spin{width:22px;height:22px;border-radius:50%;border:3px solid rgba(255,255,255,.15);border-top-color:var(--bi-amber);animation:gdpBiSpin .8s linear infinite;}
@keyframes gdpBiSpin{to{transform:rotate(360deg);}}
.gdp-bi-st-teaser{max-width:520px;margin:50px auto;text-align:center;color:#d9d3ff;}
.gdp-bi-st-teaser svg{width:54px;height:54px;color:var(--bi-yellow);filter:drop-shadow(0 0 12px rgba(255,210,63,.4));}
.gdp-bi-st-teaser h3{font-family:var(--bi-pix);font-size:13px;line-height:1.6;color:var(--bi-yellow);text-transform:uppercase;margin:14px 0 10px;}
.gdp-bi-st-teaser p{font-size:16px;margin:0 0 20px;}

/* headline */
.gdp-bi-st-figs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;}
.gdp-bi-st-fig{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09);border-radius:12px;padding:12px 12px 10px;}
.gdp-bi-st-fig b{display:block;font-family:var(--bi-brick);font-weight:400;font-size:26px;line-height:1.1;color:var(--bi-yellow);}
.gdp-bi-st-fig b small{font-size:.55em;margin-left:1px;}
.gdp-bi-st-fig span{display:block;font-size:13px;color:var(--bi-dim);margin-top:2px;}
.gdp-bi-st-fig em{display:block;font-style:normal;font-size:12px;color:#8f86c0;}
.gdp-bi-st-medals{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 4px;}
.gdp-bi-st-medal{display:flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09);}
.gdp-bi-st-medal svg{width:30px;height:30px;}
.gdp-bi-st-medal b{font-family:var(--bi-brick);font-weight:400;font-size:19px;}
.gdp-bi-st-medal span{font-size:13px;color:var(--bi-dim);}
.gdp-bi-st-medal.is-none{opacity:.45;}

/* cards */
.gdp-bi-st-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,400px);gap:16px;margin-top:16px;align-items:start;}
.gdp-bi-st-col{display:flex;flex-direction:column;gap:16px;min-width:0;}
.gdp-bi-st-card{background:rgba(20,14,48,.72);border:1px solid rgba(164,107,255,.22);border-radius:16px;padding:16px 16px 14px;}
.gdp-bi-st-card h3{font-family:var(--bi-pix);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--bi-amber);margin:0 0 10px;}
.gdp-bi-st-sub{font-size:13px;color:var(--bi-dim);margin:0 0 10px;}
.gdp-bi-st-sub.is-right{text-align:right;margin:6px 0 0;}
.gdp-bi-st-tip{min-height:22px;font-size:14px;color:#a8a0d6;margin-top:8px;}
.gdp-bi-st-tip.is-on{color:var(--bi-ink);font-weight:600;}

/* trend */
.gdp-bi-st-trend{position:relative;height:170px;margin-top:22px;border-bottom:1px solid rgba(255,255,255,.18);}
.gdp-bi-st-bar{position:absolute;bottom:0;height:100%;padding:0 2px;display:flex;align-items:flex-end;}
.gdp-bi-st-bar i{display:block;width:100%;border-radius:4px 4px 0 0;background:#6b5fb0;transition:filter .15s;}
.gdp-bi-st-bar.m1 i{background:#cd7f32;}.gdp-bi-st-bar.m2 i{background:#c9d1e0;}.gdp-bi-st-bar.m3 i{background:#ffd23f;}.gdp-bi-st-bar.m4 i{background:#4cc9ff;}
.gdp-bi-st-bar.is-ended i{background:repeating-linear-gradient(135deg,rgba(255,255,255,.22) 0 4px,rgba(255,255,255,.08) 4px 8px);}
.gdp-bi-st-bar.is-last i{box-shadow:0 0 0 2px var(--bi-ink);}
.gdp-bi-st-bar:hover i,.gdp-bi-st-bar.is-picked i{filter:brightness(1.25);box-shadow:0 0 12px rgba(255,210,63,.5);}
.gdp-bi-st-bar .tr{position:absolute;top:-22px;left:50%;transform:translateX(-50%);width:18px;height:18px;color:var(--bi-yellow);}
.gdp-bi-st-bar .tr svg{width:18px;height:18px;}
.gdp-bi-st-avg{position:absolute;left:0;right:0;border-top:2px dashed rgba(255,255,255,.4);pointer-events:none;z-index:1;}
.gdp-bi-st-avg span{position:absolute;right:0;top:-20px;font-size:12px;color:#d6d0f5;background:rgba(13,8,38,.85);padding:0 6px;border-radius:6px;}

/* records */
.gdp-bi-st-recs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
.gdp-bi-st-rec{background:rgba(255,255,255,.04);border-radius:12px;padding:10px 12px;border:1px solid rgba(255,255,255,.08);}
.gdp-bi-st-rec span{display:block;font-size:12.5px;color:var(--bi-dim);}
.gdp-bi-st-rec b{display:block;font-family:var(--bi-brick);font-weight:400;font-size:22px;color:var(--bi-green);line-height:1.2;}
.gdp-bi-st-rec em{display:block;font-style:normal;font-size:12px;color:#8f86c0;}

/* the board */
.gdp-bi-st-board{max-width:340px;margin:0 auto;}
.gdp-bi-st-board svg{display:block;width:100%;height:auto;}
.gdp-bi-st-board .rim{fill:#0b0720;stroke:rgba(164,107,255,.35);stroke-width:2;}
.gdp-bi-st-board path,.gdp-bi-st-board circle:not(.rim){stroke:rgba(255,255,255,.16);stroke-width:.8;cursor:pointer;transition:filter .15s;}
.gdp-bi-st-board path:hover,.gdp-bi-st-board circle:not(.rim):hover,.gdp-bi-st-board .is-picked{stroke:var(--bi-yellow);stroke-width:2;filter:brightness(1.25);}
.gdp-bi-st-board text{fill:#cfc8f5;font:600 15px/1 'Oswald',sans-serif;text-anchor:middle;pointer-events:none;}
.gdp-bi-st-nums{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px;}
.gdp-bi-st-nums > div{display:flex;flex-wrap:wrap;align-items:center;gap:6px;}
.gdp-bi-st-nums em{flex:0 0 100%;font-style:normal;font-size:12.5px;color:var(--bi-dim);}
.gdp-bi-st-nums span{display:inline-flex;align-items:baseline;gap:6px;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.06);font-size:13px;color:#cfc8f5;}
.gdp-bi-st-nums span b{font-family:var(--bi-brick);font-weight:400;font-size:17px;color:var(--bi-ink);}
.gdp-bi-st-nums > div:first-child span b{color:var(--bi-yellow);}

/* the games */
.gdp-bi-st-games{margin-top:16px;}
.gdp-bi-st-thead,.gdp-bi-st-row{display:grid;grid-template-columns:minmax(120px,1.3fr) minmax(110px,1fr) 56px minmax(120px,1fr) minmax(170px,1.4fr) 18px;gap:10px;align-items:center;}
.gdp-bi-st-thead{padding:0 12px 6px;font-size:12px;color:var(--bi-dim);text-transform:uppercase;letter-spacing:.06em;}
.gdp-bi-st-list{list-style:none;margin:0;padding:0;}
.gdp-bi-st-list > li{border-top:1px solid rgba(255,255,255,.07);}
.gdp-bi-st-row{width:100%;text-align:left;padding:11px 12px;border-radius:10px;color:var(--bi-ink) !important;transition:background .15s;}
.gdp-bi-st-row:hover,.gdp-bi-st-row[aria-expanded="true"]{background:rgba(164,107,255,.12);}
.gdp-bi-st-row .dt{font-size:14px;color:#d6d0f5;}
.gdp-bi-st-row .sc{display:flex;align-items:center;gap:8px;}
.gdp-bi-st-row .sc b{font-family:var(--bi-brick);font-weight:400;font-size:20px;color:var(--bi-yellow);}
.gdp-bi-st-mini svg{width:22px;height:22px;display:block;}
.gdp-bi-st-tag{font-style:normal;font-size:11px;font-weight:600;padding:2px 8px;border-radius:6px;background:rgba(255,255,255,.1);color:#cfc8f5;}
.gdp-bi-st-row .wv{font-family:var(--bi-brick);font-size:17px;color:var(--bi-cyan);}
.gdp-bi-st-row .sdt{display:flex;gap:5px;}
.gdp-bi-st-row .sdt i{font-style:normal;min-width:32px;text-align:center;padding:2px 6px;border-radius:6px;font-weight:700;font-size:14px;}
.gdp-bi-st-row .sdt .s{background:rgba(255,210,63,.16);color:#ffe27a;}
.gdp-bi-st-row .sdt .d{background:rgba(255,59,74,.18);color:#ff8b95;}
.gdp-bi-st-row .sdt .t{background:rgba(61,220,132,.16);color:#7df0ae;}
.gdp-bi-st-row .bn{display:flex;gap:6px;flex-wrap:wrap;}
.gdp-bi-st-bn{display:inline-flex;align-items:center;gap:4px;font-size:14px;font-weight:700;}
.gdp-bi-st-bn svg{width:17px;height:17px;}
.gdp-bi-st-bn.is-t{color:#ff7b86;}.gdp-bi-st-bn.is-sp{color:var(--bi-cyan);}.gdp-bi-st-bn.is-bo{color:var(--bi-amber);}.gdp-bi-st-bn.is-a{color:#e6ecf7;}
.gdp-bi-st-bn.is-zero{opacity:.32;}
.gdp-bi-st-bn .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
.gdp-bi-st-row .chev{width:10px;height:10px;border-right:2px solid #a8a0d6;border-bottom:2px solid #a8a0d6;transform:rotate(45deg);justify-self:end;transition:transform .2s;}
.gdp-bi-st-row[aria-expanded="true"] .chev{transform:rotate(-135deg);}
.gdp-bi-st-detail{padding:6px 12px 16px;}
.gdp-bi-st-dfigs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:14px;}
.gdp-bi-st-dfigs div{background:rgba(255,255,255,.04);border-radius:10px;padding:8px 10px;}
.gdp-bi-st-dfigs span{display:block;font-size:12px;color:var(--bi-dim);}
.gdp-bi-st-dfigs b{font-size:17px;font-weight:700;}
.gdp-bi-st-dcols{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:18px;}
.gdp-bi-st-dcols h4{font-family:var(--bi-pix);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--bi-violet);margin:0 0 8px;}
.gdp-bi-st-fbar{display:grid;grid-template-columns:96px minmax(0,1fr) 36px 70px;gap:8px;align-items:center;font-size:13.5px;margin-bottom:6px;}
.gdp-bi-st-fbar > span{color:#d6d0f5;}
.gdp-bi-st-fbar > div{height:12px;background:rgba(255,255,255,.05);border-radius:6px;overflow:hidden;}
.gdp-bi-st-fbar i{display:block;height:100%;border-radius:6px;background:rgba(255,255,255,.25);}
.gdp-bi-st-fbar u{display:block;height:100%;border-radius:6px;text-decoration:none;}
.gdp-bi-st-fbar.is-S u{background:var(--bi-yellow);}.gdp-bi-st-fbar.is-D u{background:#ff5a67;}.gdp-bi-st-fbar.is-T u{background:var(--bi-green);}.gdp-bi-st-fbar.is-B u{background:#fff;}
.gdp-bi-st-fbar b{text-align:right;}
.gdp-bi-st-fbar em{font-style:normal;font-size:12.5px;color:var(--bi-dim);}
.gdp-bi-st-bfull{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.gdp-bi-st-bfull .gdp-bi-st-bn{background:rgba(255,255,255,.04);border-radius:10px;padding:8px 10px;font-size:17px;flex-wrap:wrap;}
.gdp-bi-st-bfull .gdp-bi-st-bn em{flex:0 0 100%;font-style:normal;font-size:12px;font-weight:400;color:var(--bi-dim);}
.gdp-bi-st-bfull .gdp-bi-st-bn.is-zero{opacity:.55;}

@media (max-width:980px){
  .gdp-bi-st-figs{grid-template-columns:repeat(3,minmax(0,1fr));}
  .gdp-bi-st-grid{grid-template-columns:1fr;}
  .gdp-bi-st-board{max-width:380px;}
}
@media (max-width:760px){
  .gdp-bi-st-body{padding:14px 12px 28px;}
  .gdp-bi-st-head{padding:14px 12px 12px;}
  .gdp-bi-st-lvls{order:3;margin-left:0;width:100%;justify-content:space-between;}
  .gdp-bi-st-lvls button{flex:1;padding:8px 6px;font-size:13px;}
  .gdp-bi-st-x{margin-left:auto;}
  .gdp-bi-st-fig b{font-size:22px;}
  .gdp-bi-st-recs{grid-template-columns:1fr 1fr;}
  .gdp-bi-st-thead{display:none;}
  .gdp-bi-st-row{grid-template-columns:minmax(0,1fr) auto 14px;grid-template-areas:"dt sc chev" "sdt bn chev";row-gap:8px;}
  .gdp-bi-st-row .dt{grid-area:dt;}.gdp-bi-st-row .sc{grid-area:sc;justify-self:end;}
  .gdp-bi-st-row .wv{display:none;}
  .gdp-bi-st-row .sdt{grid-area:sdt;}.gdp-bi-st-row .bn{grid-area:bn;justify-self:end;}
  .gdp-bi-st-row .chev{grid-area:chev;}
  .gdp-bi-st-dfigs{grid-template-columns:1fr 1fr;}
  .gdp-bi-st-dcols{grid-template-columns:1fr;}
  .gdp-bi-st-fbar{grid-template-columns:80px minmax(0,1fr) 32px 60px;}
}
@media (prefers-reduced-motion:reduce){.gdp-bi-st-spin{animation:none;}.gdp-bi-stats .gdp-stats-panel{transition:none;}}
@media (max-width:760px){
  .gdp-bi-st-medals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;}
  .gdp-bi-st-medal{flex-direction:column;gap:2px;padding:8px 4px;border-radius:12px;text-align:center;}
  .gdp-bi-st-medal span{font-size:12px;}
}
/* Phones: the tab sits higher, beside the logo, and the lede keeps clear of it. */
@media (max-width:760px){
  .gdp-bi .gdp-bi-statstab{top:64px;}
  .gdp-bi-lede{padding-right:34px;}
}