/* The party (Radical Red's), the summary and teaching moves (Insurgence's) and the bag (Unbound's): gui-b.js.
 * Each is one 320×240 screen in game pixels; --k is one game pixel (a whole number of real pixels, DS.fit).
 * Text sizes follow the player's font (--fz) and never the screen's layout, so every font fits the same boxes. */

/* ---------- shared ---------- */
:root.bw .worldwin .ds.gb { position: relative; overflow: hidden; color: #202028; font-family: var(--bwfont); font-size: calc(var(--k) * 11 * var(--fz, 1)); line-height: calc(var(--k) * 14); image-rendering: pixelated; box-shadow: 0 calc(var(--k) * 4) calc(var(--k) * 16) rgba(0, 0, 0, .55); }
:root.bw .worldwin .ds.gb * { box-sizing: border-box; }
:root.bw .worldwin .ds.gb :is(button, select) { appearance: none; -webkit-appearance: none; margin: 0; padding: 0 !important; border: 0 !important; border-image: none !important; border-radius: 0 !important; min-height: 0 !important; background: none; box-shadow: none !important; color: inherit; font: inherit !important; text-shadow: none; text-align: left; letter-spacing: 0; transform: none !important; cursor: pointer; }
:root.bw .worldwin .ds.gb :is(button, select)::before, :root.bw .worldwin .ds.gb :is(button, select)::after { content: none; }
:root.bw .worldwin .ds.gb button:disabled { cursor: default; }
:root.bw .worldwin .ds.gb :is(b, small, span, i, em, p, div) { font-size: inherit; line-height: inherit; }
:root.bw .worldwin .ds.gb small { font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; text-shadow: none; }
:root.bw .worldwin .ds.gb .fitname { display: block; min-width: 0; overflow: hidden; white-space: nowrap; }
/* The cursor: the window's orange frame with the keys; a red arrow on the row it's on, like the games. */
:root.bw .worldwin .ds.gb :is(button, select):focus-visible { outline: calc(var(--k) * 1) solid #f08030 !important; outline-offset: 0 !important; }
:root.bw .worldwin .ds.gb .gb-wait { position: absolute; inset: 0; display: grid; place-items: center; margin: 0; color: #505058; }
/* ✕ and ↩ */
:root.bw .worldwin .ds.gb .gb-exits { position: absolute; right: calc(var(--k) * 3); top: calc(var(--k) * 3); display: flex; gap: calc(var(--k) * 2); z-index: 3; }
:root.bw .worldwin .ds.gb :is(.gb-x, .gb-u) { width: calc(var(--k) * 18); height: calc(var(--k) * 16); background: rgba(16, 20, 28, .82) center / calc(var(--k) * 14) calc(var(--k) * 14) no-repeat !important; box-shadow: inset 0 0 0 calc(var(--k) * 1) #607080 !important; }
:root.bw .worldwin .ds.gb .gb-x { background-image: var(--icon-x) !important; }
:root.bw .worldwin .ds.gb .gb-u { background-image: var(--icon-back) !important; }
:root.bw .worldwin .ds.gb :is(.gb-x, .gb-u):hover { background-color: #3a4656 !important; }
/* ♂ ♀, type labels, grades */
:root.bw .worldwin .ds.gb .gb-sex { font-style: normal; flex: none; }
:root.bw .worldwin .ds.gb .gb-sex.m { color: #3890f8; } :root.bw .worldwin .ds.gb .gb-sex.f { color: #f05878; }
:root.bw .worldwin .ds.gb .gb-type { display: inline-block; flex: none; min-width: calc(var(--k) * 38); height: calc(var(--k) * 12); margin-right: calc(var(--k) * 2); padding: 0 calc(var(--k) * 2); background: var(--tc); box-shadow: inset 0 0 0 calc(var(--k) * 1) rgba(0, 0, 0, .35), inset 0 calc(var(--k) * 1) 0 calc(var(--k) * 1) rgba(255, 255, 255, .25); color: #fff; font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; text-align: center; text-shadow: calc(var(--k) * 1) calc(var(--k) * 1) 0 rgba(0, 0, 0, .45); vertical-align: middle; }
:root.bw .worldwin .ds.gb .grade { position: static !important; right: auto !important; bottom: auto !important; border-radius: 0 !important; display: inline-grid !important; place-items: center; display: inline-block; min-width: calc(var(--k) * 10); height: calc(var(--k) * 10); padding: 0 !important; font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 10) !important; text-align: center; vertical-align: middle; }
:root.bw .worldwin .ds.gb :is(.gb-fav) { color: #f8c030; font-style: normal; }
:root.bw .worldwin .ds.gb :is(.gb-shiny) { color: #f05050; font-style: normal; }
:root.bw .worldwin .ds.gb .gb-lock { color: #707888; font-style: normal; }
/* The little command box (party and bag): white, a red arrow on the one you're on. */
:root.bw .worldwin .ds.gb .gb-cmd { position: absolute; z-index: 5; display: flex; flex-direction: column; padding: calc(var(--k) * 3) calc(var(--k) * 3) calc(var(--k) * 3) calc(var(--k) * 3); background: #f8f8f8; box-shadow: inset 0 0 0 calc(var(--k) * 1) #303040, inset 0 0 0 calc(var(--k) * 2) #a8b0c0, 0 calc(var(--k) * 2) 0 rgba(0, 0, 0, .35) !important; }
:root.bw .worldwin .ds.gb .gb-cmd button { height: calc(var(--k) * 15); padding: 0 calc(var(--k) * 6) 0 calc(var(--k) * 12) !important; color: #303038; white-space: nowrap; position: relative; }
:root.bw .worldwin .ds.gb .gb-cmd button:is(:hover) { background: #e4ecf4; }
:root.bw .worldwin .ds.gb .gb-cmd button:focus-visible, :root.bw .worldwin .ds.gb .gb-cmd button:focus { outline: none !important; background: #dfe8f8; }
:root.bw .worldwin .ds.gb .gb-cmd button:focus::before { content: ""; position: absolute; left: calc(var(--k) * 3); top: calc(var(--k) * 3); border-left: calc(var(--k) * 6) solid #e03030; border-top: calc(var(--k) * 4) solid transparent; border-bottom: calc(var(--k) * 4) solid transparent; }

/* ======================= THE PARTY (Radical Red) ======================= */
:root.bw .worldwin .ds.gb.gb-party {
  background:
    linear-gradient(90deg, rgba(120, 150, 190, .10) calc(var(--k) * 1), transparent calc(var(--k) * 1)) 0 0 / calc(var(--k) * 16) calc(var(--k) * 16),
    linear-gradient(rgba(120, 150, 190, .10) calc(var(--k) * 1), transparent calc(var(--k) * 1)) 0 0 / calc(var(--k) * 16) calc(var(--k) * 16),
    linear-gradient(#1a2230, #141a26);
  color: #f8f8f8; }
:root.bw .worldwin .ds.gb .gb-ptitle { position: absolute; left: calc(var(--k) * 8); top: calc(var(--k) * 2); color: #a8c8e8; font-size: calc(var(--k) * 10 * var(--fz, 1)); line-height: calc(var(--k) * 14); letter-spacing: calc(var(--k) * 1); text-shadow: calc(var(--k) * 1) calc(var(--k) * 1) 0 #000; }
/* A panel: a rounded blue card with a cyan edge; the one you're on is light blue. */
:root.bw .worldwin .ds.gb .gb-pp { position: absolute; width: calc(var(--k) * 152); height: calc(var(--k) * 50); border-radius: calc(var(--k) * 8) !important;
  background: linear-gradient(#2c6cb0, #1f4f8c 60%, #1a4378) !important;
  box-shadow: inset 0 0 0 calc(var(--k) * 1) #0a1830, inset 0 0 0 calc(var(--k) * 2) #58d0f8, inset 0 0 0 calc(var(--k) * 3) #1c3c68, 0 calc(var(--k) * 2) 0 rgba(0, 0, 0, .45) !important; color: #f8f8f8; text-shadow: calc(var(--k) * 1) calc(var(--k) * 1) 0 #102038; }
:root.bw .worldwin .ds.gb .gb-pp > * { position: absolute; }
:root.bw .worldwin .ds.gb .gb-pp:hover:not(.on) { background: linear-gradient(#3878c0, #2a5c9c 60%, #224c88) !important; }
:root.bw .worldwin .ds.gb .gb-pp.on { background: linear-gradient(#78c8f8, #4aa0e0 60%, #3a88cc) !important; box-shadow: inset 0 0 0 calc(var(--k) * 1) #0a1830, inset 0 0 0 calc(var(--k) * 2) #f8f8f8, inset 0 0 0 calc(var(--k) * 3) #3070b0, 0 calc(var(--k) * 2) 0 rgba(0, 0, 0, .45) !important; }
:root.bw .worldwin .ds.gb .gb-pp.from { box-shadow: inset 0 0 0 calc(var(--k) * 1) #0a1830, inset 0 0 0 calc(var(--k) * 2) #f8c030, inset 0 0 0 calc(var(--k) * 3) #a07010, 0 calc(var(--k) * 2) 0 rgba(0, 0, 0, .45) !important; }
:root.bw .worldwin .ds.gb .gb-pp:focus-visible { outline-offset: calc(var(--k) * 1) !important; }
:root.bw .worldwin .ds.gb .gb-pp.empty { background: rgba(20, 28, 40, .7) !important; box-shadow: inset 0 0 0 calc(var(--k) * 1) #0a1830, inset 0 0 0 calc(var(--k) * 2) #38506c !important; }
:root.bw .worldwin .ds.gb .gb-add { left: 0; right: 0; top: calc(var(--k) * 18); text-align: center; color: #8aa8c8; }
:root.bw .worldwin .ds.gb .gb-pic { left: calc(var(--k) * 2); top: calc(var(--k) * 2); width: 40px; height: 30px; transform-origin: 0 0; image-rendering: pixelated; }
:root.bw .worldwin .ds.gb .gb-held { left: calc(var(--k) * 30); top: calc(var(--k) * 24); width: calc(var(--k) * 12); height: calc(var(--k) * 12); object-fit: contain; image-rendering: pixelated; filter: drop-shadow(calc(var(--k) * 1) calc(var(--k) * 1) 0 rgba(0, 0, 0, .5)); }
:root.bw .worldwin .ds.gb .gb-pp .gb-nm { left: calc(var(--k) * 44); top: calc(var(--k) * 4); width: calc(var(--k) * 82); font-size: calc(var(--k) * 11 * var(--fz, 1)); line-height: calc(var(--k) * 14); }
:root.bw .worldwin .ds.gb .gb-pp .gb-sex { left: calc(var(--k) * 128); top: calc(var(--k) * 4); line-height: calc(var(--k) * 14); }
:root.bw .worldwin .ds.gb .gb-pp .gb-marks { left: calc(var(--k) * 136); top: calc(var(--k) * 4); line-height: calc(var(--k) * 14); }
:root.bw .worldwin .ds.gb .gb-pp .gb-marks i + i { margin-left: calc(var(--k) * -2); }
:root.bw .worldwin .ds.gb .gb-hp { left: calc(var(--k) * 44); top: calc(var(--k) * 20); width: calc(var(--k) * 102); height: calc(var(--k) * 8); display: flex; align-items: center; gap: calc(var(--k) * 2); }
:root.bw .worldwin .ds.gb .gb-hp b { flex: none; color: #f8d030; font-size: calc(var(--k) * 7 * var(--fz, 1)) !important; line-height: calc(var(--k) * 8) !important; text-shadow: calc(var(--k) * 1) calc(var(--k) * 1) 0 #303000; }
:root.bw .worldwin .ds.gb .gb-hp i { flex: 1; height: calc(var(--k) * 5); background: linear-gradient(90deg, var(--hpc) calc(var(--hp) * 100%), #404850 0); box-shadow: 0 0 0 calc(var(--k) * 1) #101820; }
:root.bw .worldwin .ds.gb .gb-lv { left: calc(var(--k) * 6); top: calc(var(--k) * 34); line-height: calc(var(--k) * 14); }
:root.bw .worldwin .ds.gb .gb-lead { left: calc(var(--k) * 46); top: calc(var(--k) * 36); height: calc(var(--k) * 10); padding: 0 calc(var(--k) * 2); background: #f8c030; color: #382800; font-size: calc(var(--k) * 7 * var(--fz, 1)) !important; line-height: calc(var(--k) * 10) !important; text-shadow: none; }
:root.bw .worldwin .ds.gb .gb-pp .grade { position: absolute !important; left: calc(var(--k) * 76); top: calc(var(--k) * 36); }
:root.bw .worldwin .ds.gb .gb-hpn { right: calc(var(--k) * 6); top: calc(var(--k) * 34); line-height: calc(var(--k) * 14); text-align: right; }
:root.bw .worldwin .ds.gb .gb-egg { left: calc(var(--k) * 44); top: calc(var(--k) * 20); width: calc(var(--k) * 104); white-space: nowrap; overflow: hidden; }
:root.bw .worldwin .ds.gb .gb-eggsub { left: calc(var(--k) * 6); top: calc(var(--k) * 35); width: calc(var(--k) * 142); font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; color: #c8e0f8; white-space: nowrap; overflow: hidden; }
/* Exp. Share: a chip with a switch, like Rejuvenation's. */
:root.bw .worldwin .ds.gb .gb-chip { position: absolute; left: calc(var(--k) * 6); top: calc(var(--k) * 179); height: calc(var(--k) * 13); display: flex; align-items: center; gap: calc(var(--k) * 4); padding: 0 calc(var(--k) * 5) !important; background: #262e3c; box-shadow: inset 0 0 0 calc(var(--k) * 1) #58687c !important; color: #e0e8f0; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 13) !important; }
:root.bw .worldwin .ds.gb .gb-chip:hover { background: #303a4a; }
:root.bw .worldwin .ds.gb .gb-sw { width: calc(var(--k) * 14); height: calc(var(--k) * 7); background: #485464; position: relative; }
:root.bw .worldwin .ds.gb .gb-sw i { position: absolute; left: 0; top: 0; width: calc(var(--k) * 7); height: calc(var(--k) * 7); background: #c8d0d8; }
:root.bw .worldwin .ds.gb .gb-chip.lit .gb-sw { background: #30b060; } :root.bw .worldwin .ds.gb .gb-chip.lit .gb-sw i { left: calc(var(--k) * 7); background: #f8f8f8; }
/* The message box and Cancel. */
:root.bw .worldwin .ds.gb .gb-msg { position: absolute; left: calc(var(--k) * 4); top: calc(var(--k) * 194); width: calc(var(--k) * 240); height: calc(var(--k) * 44); padding: calc(var(--k) * 6) calc(var(--k) * 8); font-size: calc(var(--k) * 10 * var(--fz, 1)); line-height: calc(var(--k) * 14); background: #f8f8f8; box-shadow: inset 0 0 0 calc(var(--k) * 1) #303038, inset 0 0 0 calc(var(--k) * 2) #c8c8d0; color: #383840; text-shadow: calc(var(--k) * 1) calc(var(--k) * 1) 0 #d0d0d8; overflow: hidden; }
:root.bw[data-frame] .worldwin .ds.gb .gb-msg { border-style: solid; border-width: calc(var(--k) * 8); border-image: var(--gframe) 16 fill / calc(var(--k) * 8) stretch; background: none; box-shadow: none; padding: 0 calc(var(--k) * 2); }
:root.bw .worldwin .ds.gb .gb-cancel { position: absolute; left: calc(var(--k) * 250); top: calc(var(--k) * 204); width: calc(var(--k) * 66); height: calc(var(--k) * 24); text-align: center !important; background: linear-gradient(#3c78e8, #2050c0) !important; box-shadow: inset 0 0 0 calc(var(--k) * 1) #0c2060, inset 0 0 0 calc(var(--k) * 2) #a8c8f8 !important; color: #f8f8f8; text-shadow: calc(var(--k) * 1) calc(var(--k) * 1) 0 #102060; }
:root.bw .worldwin .ds.gb .gb-cancel:hover { background: linear-gradient(#5088f0, #2c5cd0) !important; }
:root.bw .worldwin .ds.gb.gb-party .gb-cmd { right: calc(var(--k) * 4); bottom: calc(var(--k) * 4); min-width: calc(var(--k) * 96); }

/* ======================= THE SUMMARY and TEACHING MOVES (Insurgence) ======================= */
:root.bw .worldwin .ds.gb.gb-sum {
  background: repeating-linear-gradient(135deg, rgba(255, 255, 255, .28) 0 calc(var(--k) * 2), transparent calc(var(--k) * 2) calc(var(--k) * 6)), linear-gradient(#c8f0d8, #b8e8cc);
  color: #283830; }
/* The arrow tabs on the left: dark green with a light top line and an arrow end. */
:root.bw .worldwin .ds.gb .gb-tab { position: absolute; left: 0; display: flex; align-items: center; gap: calc(var(--k) * 3); padding: 0 calc(var(--k) * 12) 0 calc(var(--k) * 6); background: linear-gradient(#2a7c62 0 calc(var(--k) * 2), #11503e calc(var(--k) * 2)); color: #f8f8f8; text-shadow: calc(var(--k) * 1) calc(var(--k) * 1) 0 #0a2a20;
  clip-path: polygon(0 0, calc(100% - calc(var(--k) * 8)) 0, 100% 50%, calc(100% - calc(var(--k) * 8)) 100%, 0 100%); white-space: nowrap; }
:root.bw .worldwin .ds.gb .gb-tab::after { content: ""; position: absolute; right: calc(var(--k) * 1); top: 0; bottom: 0; width: calc(var(--k) * 4); background: #58c890; clip-path: polygon(0 0, 100% 50%, 0 100%); }
:root.bw .worldwin .ds.gb .gb-title { top: calc(var(--k) * 4); width: calc(var(--k) * 124); height: calc(var(--k) * 18); font-size: calc(var(--k) * 12 * var(--fz, 1)); letter-spacing: calc(var(--k) * 1); }
:root.bw .worldwin .ds.gb .gb-name { top: calc(var(--k) * 28); width: calc(var(--k) * 130); height: calc(var(--k) * 18); }
:root.bw .worldwin .ds.gb .gb-name .fitname { flex: 0 1 auto; max-width: calc(var(--k) * 94); }
:root.bw .worldwin .ds.gb .gb-ball { width: calc(var(--k) * 12); height: calc(var(--k) * 12); object-fit: contain; flex: none; }
:root.bw .worldwin .ds.gb .gb-level { top: calc(var(--k) * 47); width: calc(var(--k) * 130); height: calc(var(--k) * 15); background: linear-gradient(#e8f4ee 0 calc(var(--k) * 1), #d4ece0 calc(var(--k) * 1)); color: #203028; text-shadow: none; }
:root.bw .worldwin .ds.gb .gb-level::after { background: #2a7c62; }
:root.bw .worldwin .ds.gb .gb-level small { color: #11503e; letter-spacing: calc(var(--k) * 1); margin-right: calc(var(--k) * 2); }
:root.bw .worldwin .ds.gb .gb-gr { margin-left: auto; }
/* The Pokémon in its circle. */
:root.bw .worldwin .ds.gb .gb-ring { position: absolute; left: calc(var(--k) * 14); top: calc(var(--k) * 68); width: calc(var(--k) * 100); height: calc(var(--k) * 100); border-radius: 50%; display: grid; place-items: center; overflow: visible;
  background: radial-gradient(circle, #f0fff6 0 calc(var(--k) * 36), #d8f4e4 calc(var(--k) * 36) calc(var(--k) * 44), #f8fffa calc(var(--k) * 44) calc(var(--k) * 46), #a8dcc0 calc(var(--k) * 46) calc(var(--k) * 50)); }
:root.bw .worldwin .ds.gb .gb-spr { image-rendering: pixelated; max-width: none; }
:root.bw .worldwin .ds.gb .gb-nav { position: absolute; left: calc(var(--k) * 116); width: calc(var(--k) * 14); height: calc(var(--k) * 14); text-align: center !important; background: #11503e !important; color: #f8f8f8; font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 14) !important; box-shadow: inset 0 0 0 calc(var(--k) * 1) #58c890 !important; }
:root.bw .worldwin .ds.gb .gb-nav.up { top: calc(var(--k) * 92); } :root.bw .worldwin .ds.gb .gb-nav.dn { top: calc(var(--k) * 110); }
:root.bw .worldwin .ds.gb .gb-nav:hover { background: #1b6b55 !important; }
:root.bw .worldwin .ds.gb .gb-markrow { top: calc(var(--k) * 172); width: calc(var(--k) * 130); height: calc(var(--k) * 15); background: linear-gradient(#e8f4ee 0 calc(var(--k) * 1), #d4ece0 calc(var(--k) * 1)); color: #203028; text-shadow: none; font-size: calc(var(--k) * 9 * var(--fz, 1)); }
:root.bw .worldwin .ds.gb.gb-sum .gb-markrow::after { background: #2a7c62; }
:root.bw .worldwin .ds.gb .gb-markrow small { color: #5a7068; }
:root.bw .worldwin .ds.gb .gb-itemk { top: calc(var(--k) * 192); width: calc(var(--k) * 70); height: calc(var(--k) * 15); }
:root.bw .worldwin .ds.gb .gb-itemv { position: absolute; left: calc(var(--k) * 4); top: calc(var(--k) * 210); width: calc(var(--k) * 124); height: calc(var(--k) * 26); display: flex; align-items: center; gap: calc(var(--k) * 3); padding: 0 calc(var(--k) * 4); background: rgba(248, 255, 250, .8); box-shadow: inset 0 0 0 calc(var(--k) * 1) #2a7c62; color: #203028; }
:root.bw .worldwin .ds.gb .gb-itemv img { width: calc(var(--k) * 16); height: calc(var(--k) * 16); object-fit: contain; flex: none; image-rendering: pixelated; }
:root.bw .worldwin .ds.gb .gb-itemv .fitname { flex: 1 1 auto; }
:root.bw .worldwin .ds.gb .gb-itemv small { flex: none; color: #8a5020; }
/* The round page buttons along the top right (Insurgence's), with the page's name on the title tab. */
:root.bw .worldwin .ds.gb .gb-pages { position: absolute; left: calc(var(--k) * 152); top: calc(var(--k) * 3); display: flex; gap: calc(var(--k) * 4); z-index: 2; }
:root.bw .worldwin .ds.gb .gb-pg { position: static !important; width: calc(var(--k) * 18) !important; height: calc(var(--k) * 18) !important; flex: none !important; border-radius: 50% !important; display: grid; place-items: center; text-align: center !important;
  background: radial-gradient(circle at 35% 30%, #fff 0 calc(var(--k) * 2), #f0f0f0 calc(var(--k) * 2) calc(var(--k) * 6), #c8d0cc calc(var(--k) * 9)) !important; box-shadow: inset 0 0 0 calc(var(--k) * 1) #406050, 0 calc(var(--k) * 1) 0 rgba(0, 0, 0, .3) !important; color: #2a4038 !important; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 18) !important; overflow: visible; text-shadow: none !important; }
:root.bw .worldwin .ds.gb .gb-pg:hover { background: radial-gradient(circle at 35% 30%, #fff 0 calc(var(--k) * 2), #f8fff8 calc(var(--k) * 2) calc(var(--k) * 6), #b8e8cc calc(var(--k) * 9)) !important; }
:root.bw .worldwin .ds.gb .gb-pg.on { background: radial-gradient(circle at 35% 30%, #a8f0c8 0 calc(var(--k) * 2), #38b070 calc(var(--k) * 2) calc(var(--k) * 6), #18804a calc(var(--k) * 9)) !important; color: #f8f8f8 !important; box-shadow: inset 0 0 0 calc(var(--k) * 1) #0a3a20, 0 0 0 calc(var(--k) * 1) #f8f8f8, 0 calc(var(--k) * 1) 0 calc(var(--k) * 1) rgba(0, 0, 0, .3) !important; }
:root.bw .worldwin .ds.gb .gb-pg span { display: block; transform: translateY(calc(var(--k) * -1)); }
:root.bw .worldwin .ds.gb.gb-sum .gb-exits { top: calc(var(--k) * 4); }
/* The page, on the right: rows with coloured label pills. */
:root.bw .worldwin .ds.gb .gb-right { position: absolute; left: calc(var(--k) * 136); top: calc(var(--k) * 28); width: calc(var(--k) * 180); height: calc(var(--k) * 150); }
:root.bw .worldwin .ds.gb .gb-rows { display: flex; flex-direction: column; gap: calc(var(--k) * 2); }
:root.bw .worldwin .ds.gb .gb-row { display: flex; align-items: center; height: calc(var(--k) * 15); background: rgba(248, 255, 250, .78); box-shadow: inset 0 calc(var(--k) * -1) 0 rgba(42, 124, 98, .35); }
:root.bw .worldwin .ds.gb .gb-lab { flex: none; width: calc(var(--k) * 58); height: 100%; padding: 0 calc(var(--k) * 10) 0 calc(var(--k) * 5); background: var(--lc); color: #f8f8f8; text-shadow: calc(var(--k) * 1) calc(var(--k) * 1) 0 rgba(0, 0, 0, .35); font-size: calc(var(--k) * 10 * var(--fz, 1)); line-height: calc(var(--k) * 15); white-space: nowrap; overflow: hidden;
  clip-path: polygon(0 0, calc(100% - calc(var(--k) * 6)) 0, 100% 50%, calc(100% - calc(var(--k) * 6)) 100%, 0 100%); }
:root.bw .worldwin .ds.gb .gb-val { flex: 1; min-width: 0; display: flex; align-items: center; gap: calc(var(--k) * 3); padding: 0 calc(var(--k) * 4); white-space: nowrap; overflow: hidden; }
:root.bw .worldwin .ds.gb .gb-val .fitname { flex: 1 1 auto; }
:root.bw .worldwin .ds.gb .gb-val small { color: #506058; }
:root.bw .worldwin .ds.gb :is(.gb-blue, .blue) { color: #2860c8; }
:root.bw .worldwin .ds.gb .gb-up { color: #d83040; } :root.bw .worldwin .ds.gb .gb-dn { color: #2860c8; }
:root.bw .worldwin .ds.gb .gb-stars { color: #c89010 !important; letter-spacing: 0; }
:root.bw .worldwin .ds.gb .gb-exp { display: flex; align-items: center; gap: calc(var(--k) * 2); margin-left: auto; }
:root.bw .worldwin .ds.gb .gb-exp b { color: #d0a018; font-size: calc(var(--k) * 7 * var(--fz, 1)); line-height: calc(var(--k) * 8); }
:root.bw .worldwin .ds.gb .gb-exp i { width: calc(var(--k) * 48); height: calc(var(--k) * 4); background: #304038; box-shadow: 0 0 0 calc(var(--k) * 1) #203028; }
:root.bw .worldwin .ds.gb .gb-exp u { display: block; height: 100%; background: #40a8f8; }
/* STATS */
:root.bw .worldwin .ds.gb .gb-stats { display: flex; flex-direction: column; gap: calc(var(--k) * 3); }
:root.bw .worldwin .ds.gb .gb-st { display: flex; align-items: center; height: calc(var(--k) * 17); background: rgba(248, 255, 250, .78); box-shadow: inset 0 calc(var(--k) * -1) 0 rgba(42, 124, 98, .35); }
:root.bw .worldwin .ds.gb .gb-st .gb-lab { width: calc(var(--k) * 62); line-height: calc(var(--k) * 17); font-size: calc(var(--k) * 11 * var(--fz, 1)); }
:root.bw .worldwin .ds.gb .gb-st .gb-val b { width: calc(var(--k) * 26); text-align: right; flex: none; }
:root.bw .worldwin .ds.gb .gb-st .gb-val em { width: calc(var(--k) * 30); flex: none; font-style: normal; text-align: right; color: #384840; font-size: calc(var(--k) * 9 * var(--fz, 1)); }
:root.bw .worldwin .ds.gb .gb-boost { color: #b83098 !important; flex: none; }
:root.bw .worldwin .ds.gb .gb-judge { margin-left: auto; font-size: calc(var(--k) * 8 * var(--fz, 1)); color: #607068; }
:root.bw .worldwin .ds.gb .gb-judge.j5 { color: #d83040; } :root.bw .worldwin .ds.gb .gb-judge.j4 { color: #c86020; } :root.bw .worldwin .ds.gb .gb-judge.j3 { color: #2a8a50; }
:root.bw .worldwin .ds.gb .gb-note { margin: calc(var(--k) * 3) 0 0; color: #3a5048; font-size: calc(var(--k) * 8 * var(--fz, 1)); line-height: calc(var(--k) * 11); }
/* MOVES: four move plates. */
:root.bw .worldwin .ds.gb .gb-mvs { display: flex; flex-direction: column; gap: calc(var(--k) * 4); }
:root.bw .worldwin .ds.gb .gb-mv { position: relative; display: flex; align-items: center; gap: calc(var(--k) * 3); height: calc(var(--k) * 22); padding: 0 calc(var(--k) * 5) 0 calc(var(--k) * 12) !important; width: 100%; background: rgba(248, 255, 250, .85) !important; box-shadow: inset 0 0 0 calc(var(--k) * 1) #2a7c62 !important; color: #203028; }
:root.bw .worldwin .ds.gb .gb-mv .fitname { flex: 1 1 auto; }
:root.bw .worldwin .ds.gb .gb-mv.empty { color: #8aa098; box-shadow: inset 0 0 0 calc(var(--k) * 1) rgba(42, 124, 98, .4) !important; background: rgba(248, 255, 250, .4) !important; }
:root.bw .worldwin .ds.gb button.gb-mv:hover { background: #f0fff6 !important; }
:root.bw .worldwin .ds.gb .gb-mv.on { background: #fff !important; box-shadow: inset 0 0 0 calc(var(--k) * 1) #11503e, inset 0 0 0 calc(var(--k) * 2) #58c890 !important; }
:root.bw .worldwin .ds.gb :is(.gb-mv, .gb-mlrow, .gb-brow).on::before, :root.bw .worldwin .ds.gb :is(.gb-mv, .gb-mlrow, .gb-brow):focus::before { content: ""; position: absolute; left: calc(var(--k) * 3); top: 50%; margin-top: calc(var(--k) * -4); border-left: calc(var(--k) * 6) solid #e03030; border-top: calc(var(--k) * 4) solid transparent; border-bottom: calc(var(--k) * 4) solid transparent; }

:root.bw .worldwin .ds.gb .gb-mv .gb-mpp { position: static; flex: none; white-space: nowrap; margin-left: auto; color: #405048; font-size: calc(var(--k) * 9 * var(--fz, 1)); width: auto; height: auto; background: none !important; box-shadow: none !important; border-radius: 0 !important; text-shadow: none; }
:root.bw .worldwin .ds.gb .gb-mvacts { display: flex; flex-direction: column; gap: calc(var(--k) * 3); margin-top: calc(var(--k) * 6); }
/* Action buttons (ITEMS, OPTIONS): light strips with a green edge, two to a row. */
:root.bw .worldwin .ds.gb .gb-acts { display: grid; grid-template-columns: 1fr 1fr; gap: calc(var(--k) * 4); }
:root.bw .worldwin .ds.gb .gb-acts.one { grid-template-columns: 1fr; margin-top: calc(var(--k) * 4); }
:root.bw .worldwin .ds.gb.gb.gb :is(.gb-act, .gb-sel) { position: relative; display: flex; align-items: center; justify-content: center; height: calc(var(--k) * 20); padding: 0 calc(var(--k) * 4) !important; text-align: center !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  background: linear-gradient(#ffffff, #e4f4ea) !important; box-shadow: inset 0 0 0 calc(var(--k) * 1) #2a7c62, inset 0 calc(var(--k) * -2) 0 calc(var(--k) * 1) #c4e4d0 !important; color: #203028 !important; font-size: calc(var(--k) * 10 * var(--fz, 1)) !important; }
:root.bw .worldwin .ds.gb.gb.gb :is(.gb-act, .gb-sel):hover:not(:disabled) { background: linear-gradient(#ffffff, #d0f0dc) !important; }
:root.bw .worldwin .ds.gb.gb.gb .gb-sel { grid-column: 1 / -1; display: block; line-height: calc(var(--k) * 20) !important; text-align-last: center; padding-right: calc(var(--k) * 12) !important;
  background: linear-gradient(135deg, transparent 50%, #2a7c62 50%) right calc(var(--k) * 5) center / calc(var(--k) * 5) calc(var(--k) * 5) no-repeat, linear-gradient(#ffffff, #e4f4ea) !important; }
:root.bw .worldwin .ds.gb.gb.gb .gb-sel option { background: #f8fff8; color: #203028; }
:root.bw .worldwin .ds.gb .gb-act.main { background: linear-gradient(#3cae80, #1b6b55) !important; color: #f8f8f8 !important; text-shadow: calc(var(--k) * 1) calc(var(--k) * 1) 0 #0a3a28; box-shadow: inset 0 0 0 calc(var(--k) * 1) #0a3a28 !important; }
:root.bw .worldwin .ds.gb .gb-act.red { background: linear-gradient(#f07070, #c83040) !important; color: #f8f8f8 !important; text-shadow: calc(var(--k) * 1) calc(var(--k) * 1) 0 #500818; box-shadow: inset 0 0 0 calc(var(--k) * 1) #500818 !important; }
:root.bw .worldwin .ds.gb .gb-act.lit { box-shadow: inset 0 0 0 calc(var(--k) * 1) #c88010, inset 0 0 0 calc(var(--k) * 2) #f8d070 !important; }
:root.bw .worldwin .ds.gb .gb-act:disabled, :root.bw .worldwin .ds.gb .gb-act.off { background: rgba(240, 248, 244, .6) !important; color: #90a098 !important; text-shadow: none; box-shadow: inset 0 0 0 calc(var(--k) * 1) #a8c4b8 !important; }
:root.bw .worldwin .ds.gb .gb-act.off { cursor: default; }
/* The box at the bottom right: a label pill and what it says (the ability, a move, how it evolves). */
:root.bw .worldwin .ds.gb .gb-box { position: absolute; left: calc(var(--k) * 132); top: calc(var(--k) * 180); width: calc(var(--k) * 184); height: calc(var(--k) * 56); padding: 0 calc(var(--k) * 5) calc(var(--k) * 3) 0; display: flex; flex-wrap: wrap; align-content: flex-start; column-gap: calc(var(--k) * 4); background: rgba(248, 255, 250, .9); box-shadow: inset 0 0 0 calc(var(--k) * 1) #2a7c62; color: #203028; overflow: hidden; }
:root.bw .worldwin .ds.gb .gb-boxk { position: relative; flex: none; height: calc(var(--k) * 14); padding: 0 calc(var(--k) * 12) 0 calc(var(--k) * 5); display: flex; align-items: center; gap: calc(var(--k) * 3); background: linear-gradient(#2a7c62 0 calc(var(--k) * 2), #11503e calc(var(--k) * 2)); color: #f8f8f8; text-shadow: calc(var(--k) * 1) calc(var(--k) * 1) 0 #0a2a20; white-space: nowrap; clip-path: polygon(0 0, calc(100% - calc(var(--k) * 6)) 0, 100% 50%, calc(100% - calc(var(--k) * 6)) 100%, 0 100%); font-size: calc(var(--k) * 10 * var(--fz, 1)); line-height: calc(var(--k) * 14); }
:root.bw .worldwin .ds.gb .gb-boxk.red { background: #c83040; }
:root.bw .worldwin .ds.gb .gb-boxn { flex: 1 1 0; min-width: 0; height: calc(var(--k) * 14); white-space: nowrap; overflow: hidden; color: #11503e; line-height: calc(var(--k) * 13); }
:root.bw .worldwin .ds.gb .gb-boxn small { color: #506058; }
:root.bw .worldwin .ds.gb .gb-boxv { flex: 0 0 100%; padding: calc(var(--k) * 2) 0 0 calc(var(--k) * 6); font-size: calc(var(--k) * 9 * var(--fz, 1)); line-height: calc(var(--k) * 12); }
:root.bw .worldwin .ds.gb .gb-boxv.gb-evo div { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
:root.bw .worldwin .ds.gb .gb-hid { color: #b03070 !important; }
:root.bw .worldwin .ds.gb .gb-confirm { position: absolute; left: calc(var(--k) * 4); right: calc(var(--k) * 4); bottom: calc(var(--k) * 3); display: grid; grid-template-columns: 2fr 1fr; gap: calc(var(--k) * 4); }
:root.bw .worldwin .ds.gb .gb-confirm .gb-act { height: calc(var(--k) * 16); }
:root.bw .worldwin .ds.gb .gb-eggtext { margin: calc(var(--k) * 6) 0 0; padding: calc(var(--k) * 4); background: rgba(248, 255, 250, .78); box-shadow: inset 0 0 0 calc(var(--k) * 1) rgba(42, 124, 98, .5); font-size: calc(var(--k) * 10 * var(--fz, 1)); line-height: calc(var(--k) * 13); }
:root.bw .worldwin .ds.gb .gb-say { margin: calc(var(--k) * 4) 0; color: #304840; }
:root.bw .worldwin .ds.gb .gb-say.dark { color: #a8b0c0; padding: calc(var(--k) * 8); }
/* Teaching moves: its four down the left under the tabs; the list on the right, a page at a time. */
:root.bw .worldwin .ds.gb .gb-four { position: absolute; left: calc(var(--k) * 4); top: calc(var(--k) * 70); width: calc(var(--k) * 126); gap: calc(var(--k) * 5); }
:root.bw .worldwin .ds.gb .gb-four .gb-mv { height: calc(var(--k) * 24); }
:root.bw .worldwin .ds.gb .gb-four .gb-type { min-width: calc(var(--k) * 34); }
:root.bw .worldwin .ds.gb .gb-mv.add { color: #2a7c62; }
:root.bw .worldwin .ds.gb .gb-restore { position: absolute !important; left: calc(var(--k) * 4); top: calc(var(--k) * 190); width: calc(var(--k) * 126); }
:root.bw .worldwin .ds.gb .gb-hows { display: flex; gap: calc(var(--k) * 3); height: calc(var(--k) * 15); margin-bottom: calc(var(--k) * 3); }
:root.bw .worldwin .ds.gb .gb-how { position: static !important; flex: 1 1 0 !important; width: auto !important; height: calc(var(--k) * 15) !important; padding: 0 !important; text-align: center !important; background: rgba(248, 255, 250, .8) !important; box-shadow: inset 0 0 0 calc(var(--k) * 1) #2a7c62 !important; color: #203028 !important; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 15) !important; text-shadow: none !important; }
:root.bw .worldwin .ds.gb .gb-how:hover { background: #f0fff6 !important; }
:root.bw .worldwin .ds.gb .gb-how.on { background: linear-gradient(#2a7c62 0 calc(var(--k) * 2), #11503e calc(var(--k) * 2)) !important; color: #f8f8f8 !important; }
:root.bw .worldwin .ds.gb .gb-ml { display: flex; flex-direction: column; gap: calc(var(--k) * 1); }
:root.bw .worldwin .ds.gb .gb-mlrow { position: relative; display: flex; align-items: center; gap: calc(var(--k) * 4); height: calc(var(--k) * 16); padding: 0 calc(var(--k) * 5) 0 calc(var(--k) * 12) !important; background: rgba(248, 255, 250, .78) !important; box-shadow: inset 0 calc(var(--k) * -1) 0 rgba(42, 124, 98, .35) !important; color: #203028; }
:root.bw .worldwin .ds.gb .gb-mlrow:hover { background: #f4fff8 !important; }
:root.bw .worldwin .ds.gb .gb-mlrow.on { background: #fff !important; box-shadow: inset 0 0 0 calc(var(--k) * 1) #11503e !important; }
:root.bw .worldwin .ds.gb .gb-mlrow[aria-disabled="true"] { color: #8a9890; }
:root.bw .worldwin .ds.gb .gb-mlrow i { flex: none; width: calc(var(--k) * 8); height: calc(var(--k) * 8); border-radius: 50%; box-shadow: inset 0 0 0 calc(var(--k) * 1) rgba(0, 0, 0, .3); }
:root.bw .worldwin .ds.gb .gb-mlrow .fitname { flex: 1 1 auto; }
:root.bw .worldwin .ds.gb .gb-mlrow small { flex: none; color: #506058; }
:root.bw .worldwin .ds.gb .gb-pager { position: absolute; right: 0; bottom: calc(var(--k) * -2); display: flex; align-items: center; gap: calc(var(--k) * 3); color: #304840; font-size: calc(var(--k) * 9 * var(--fz, 1)); }
:root.bw .worldwin .ds.gb .gb-pager button { width: calc(var(--k) * 14); height: calc(var(--k) * 12); text-align: center !important; background: #11503e !important; color: #f8f8f8; font-size: calc(var(--k) * 7 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; }
:root.bw .worldwin .ds.gb .gb-pager button:disabled { background: #a8c4b8 !important; }

/* ======================= THE BAG (Unbound) ======================= */
:root.bw .worldwin .ds.gb.gb-bag {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .03) calc(var(--k) * 1), transparent calc(var(--k) * 1)) 0 0 / calc(var(--k) * 8) calc(var(--k) * 8),
    linear-gradient(rgba(255, 255, 255, .03) calc(var(--k) * 1), transparent calc(var(--k) * 1)) 0 0 / calc(var(--k) * 8) calc(var(--k) * 8),
    linear-gradient(#2a2d38, #22252e);
  color: #f0f0f4; }
:root.bw .worldwin .ds.gb .gb-bhead { position: absolute; left: 0; top: calc(var(--k) * 4); width: calc(var(--k) * 112); height: calc(var(--k) * 17); padding: 0 calc(var(--k) * 6); background: linear-gradient(#e8eaee, #d0d4dc); box-shadow: inset 0 calc(var(--k) * -1) 0 #9098a8; color: #383c48; text-align: center; line-height: calc(var(--k) * 17); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
:root.bw .worldwin .ds.gb .gb-sort { position: absolute; left: calc(var(--k) * 4); top: calc(var(--k) * 25); height: calc(var(--k) * 12); padding: 0 calc(var(--k) * 4) !important; background: #40b888 !important; color: #f8f8f8; font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; text-shadow: calc(var(--k) * 1) calc(var(--k) * 1) 0 #105030; box-shadow: inset 0 0 0 calc(var(--k) * 1) #186848 !important; }
:root.bw .worldwin .ds.gb .gb-sort:hover { background: #50c898 !important; }
/* The pocket's picture: a dark grid in a green frame, ◀ ▶ either side. */
:root.bw .worldwin .ds.gb .gb-pocket { position: absolute; left: calc(var(--k) * 4); top: calc(var(--k) * 40); width: calc(var(--k) * 106); height: calc(var(--k) * 84); display: grid; place-items: center;
  background: linear-gradient(90deg, rgba(64, 192, 136, .12) calc(var(--k) * 1), transparent calc(var(--k) * 1)) 0 0 / calc(var(--k) * 10) calc(var(--k) * 10), linear-gradient(rgba(64, 192, 136, .12) calc(var(--k) * 1), transparent calc(var(--k) * 1)) 0 0 / calc(var(--k) * 10) calc(var(--k) * 10), #1a1c22;
  box-shadow: inset 0 0 0 calc(var(--k) * 1) #0c0e12, inset 0 0 0 calc(var(--k) * 2) #40c088, inset 0 0 0 calc(var(--k) * 3) #186848, inset 0 0 0 calc(var(--k) * 4) #0c0e12; }
:root.bw .worldwin .ds.gb .gb-pocketpic { image-rendering: pixelated; filter: drop-shadow(calc(var(--k) * 2) calc(var(--k) * 2) 0 rgba(0, 0, 0, .5)); }
:root.bw .worldwin .ds.gb .gb-parrow { position: absolute; top: calc(var(--k) * 32); width: calc(var(--k) * 14); height: calc(var(--k) * 20); text-align: center !important; color: #40d090; font-size: calc(var(--k) * 12 * var(--fz, 1)) !important; line-height: calc(var(--k) * 20) !important; text-shadow: calc(var(--k) * 1) calc(var(--k) * 1) 0 #000; }
:root.bw .worldwin .ds.gb .gb-parrow.l { left: calc(var(--k) * 4); } :root.bw .worldwin .ds.gb .gb-parrow.r { right: calc(var(--k) * 4); }
:root.bw .worldwin .ds.gb .gb-parrow:hover { color: #a8f8d0; }
:root.bw .worldwin .ds.gb .gb-pcount { position: absolute; left: 0; right: 0; bottom: calc(var(--k) * 5); text-align: center; color: #88a098; font-size: calc(var(--k) * 8 * var(--fz, 1)); line-height: calc(var(--k) * 10); }
/* The pocket buttons: each pocket's own item picture. */
:root.bw .worldwin .ds.gb .gb-pockets { position: absolute; left: calc(var(--k) * 4); top: calc(var(--k) * 128); width: calc(var(--k) * 106); display: flex; justify-content: space-between; }
:root.bw .worldwin .ds.gb .gb-pk { position: static !important; flex: none !important; width: calc(var(--k) * 19) !important; height: calc(var(--k) * 15) !important; padding: 0 !important; display: grid; place-items: center; background: #1a1c22 !important; box-shadow: inset 0 0 0 calc(var(--k) * 1) #3a4050 !important; }
:root.bw .worldwin .ds.gb .gb-pk img { width: calc(var(--k) * 13); height: calc(var(--k) * 13); object-fit: contain; image-rendering: pixelated; opacity: .7; }
:root.bw .worldwin .ds.gb .gb-pk:hover { background: #262a34 !important; }
:root.bw .worldwin .ds.gb .gb-pk.on { background: #186848 !important; box-shadow: inset 0 0 0 calc(var(--k) * 1) #40c088 !important; }
:root.bw .worldwin .ds.gb .gb-pk.on img { opacity: 1; }
/* The list: dark, with lines, the red arrow on the one you're on. */
:root.bw .worldwin .ds.gb .gb-list { position: absolute; left: calc(var(--k) * 116); top: calc(var(--k) * 2); width: calc(var(--k) * 200); height: calc(var(--k) * 144); background: #2e3140; box-shadow: inset 0 0 0 calc(var(--k) * 1) #0c0e14, inset 0 0 0 calc(var(--k) * 2) #4a5064; }
:root.bw .worldwin .ds.gb .gb-rowsb { position: absolute; left: calc(var(--k) * 3); right: calc(var(--k) * 3); top: calc(var(--k) * 8); display: flex; flex-direction: column; }
:root.bw .worldwin .ds.gb .gb-brow { position: relative; display: flex; align-items: center; gap: calc(var(--k) * 4); height: calc(var(--k) * 16); padding: 0 calc(var(--k) * 6) 0 calc(var(--k) * 14) !important; box-shadow: inset 0 calc(var(--k) * -1) 0 #3c4152 !important; color: #f0f0f4; text-shadow: calc(var(--k) * 1) calc(var(--k) * 1) 0 #101218; }
:root.bw .worldwin .ds.gb .gb-brow .fitname { flex: 1 1 auto; }
:root.bw .worldwin .ds.gb .gb-brow:hover { background: rgba(255, 255, 255, .06) !important; }
:root.bw .worldwin .ds.gb .gb-brow.on { background: rgba(255, 255, 255, .12) !important; }
:root.bw .worldwin .ds.gb .gb-brow.on::before, :root.bw .worldwin .ds.gb .gb-brow:focus::before { left: calc(var(--k) * 4); border-left-color: #f04040; }
:root.bw .worldwin .ds.gb .gb-cnt { flex: none; color: #d8dce8; }
:root.bw .worldwin .ds.gb .gb-tmdot { flex: none; width: calc(var(--k) * 8); height: calc(var(--k) * 8); border-radius: 50%; box-shadow: inset 0 0 0 calc(var(--k) * 1) rgba(0, 0, 0, .35); }
:root.bw .worldwin .ds.gb .gb-lpg { position: absolute; left: 50%; width: calc(var(--k) * 20); height: calc(var(--k) * 8); margin-left: calc(var(--k) * -10); text-align: center !important; background: #40c088 !important; color: #10301e; font-size: calc(var(--k) * 6 * var(--fz, 1)) !important; line-height: calc(var(--k) * 8) !important; clip-path: polygon(15% 0, 85% 0, 100% 100%, 0 100%); z-index: 1; }
:root.bw .worldwin .ds.gb .gb-lpg.up { top: 0; } :root.bw .worldwin .ds.gb .gb-lpg.dn { bottom: 0; clip-path: polygon(0 0, 100% 0, 85% 100%, 15% 100%); }
:root.bw .worldwin .ds.gb .gb-lpg:disabled { background: #3c4152 !important; color: #3c4152; }
:root.bw .worldwin .ds.gb .gb-lpn { position: absolute; right: calc(var(--k) * 5); bottom: calc(var(--k) * -1); color: #88909c; font-size: calc(var(--k) * 8 * var(--fz, 1)); line-height: calc(var(--k) * 10); }
:root.bw .worldwin .ds.gb.gb-bag .gb-cmd { right: calc(var(--k) * 6); bottom: calc(var(--k) * 10); min-width: calc(var(--k) * 80); }
/* The card along the bottom: its picture in a white box, its name and what it does. */
:root.bw .worldwin .ds.gb .gb-desc { position: absolute; left: 0; right: 0; top: calc(var(--k) * 150); bottom: 0; display: flex; gap: calc(var(--k) * 8); padding: calc(var(--k) * 8) calc(var(--k) * 46) calc(var(--k) * 6) calc(var(--k) * 10);
  background: linear-gradient(#383c4c 0 calc(var(--k) * 1), #262935 calc(var(--k) * 1)); box-shadow: inset 0 calc(var(--k) * 2) 0 #40c088; }
:root.bw[data-frame] .worldwin .ds.gb .gb-desc .gb-dtext { border-style: solid; border-width: calc(var(--k) * 6); border-image: var(--gframe) 16 fill / calc(var(--k) * 6) stretch; padding: 0 calc(var(--k) * 2); color: #303038; text-shadow: none; }
:root.bw[data-frame] .worldwin .ds.gb .gb-desc .gb-dname { color: #303038; }
:root.bw .worldwin .ds.gb .gb-dpic { flex: none; width: calc(var(--k) * 44); height: calc(var(--k) * 44); margin-top: calc(var(--k) * 8); display: grid; place-items: center; background: #f8f8f8; border-radius: calc(var(--k) * 4); box-shadow: inset 0 0 0 calc(var(--k) * 1) #b8bcc8, 0 calc(var(--k) * 1) 0 #000; }
:root.bw .worldwin .ds.gb .gb-dpic img { image-rendering: pixelated; }
:root.bw .worldwin .ds.gb .gb-dpic i { width: calc(var(--k) * 32) !important; height: calc(var(--k) * 32) !important; }
:root.bw .worldwin .ds.gb .gb-dtext { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: calc(var(--k) * 2); overflow: hidden; }
:root.bw .worldwin .ds.gb .gb-dname { color: #90f0c0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
:root.bw .worldwin .ds.gb .gb-dsay { font-size: calc(var(--k) * 10 * var(--fz, 1)); line-height: calc(var(--k) * 13); }
:root.bw .worldwin .ds.gb .gb-bexits { top: auto; bottom: calc(var(--k) * 4); }