/* The PC (Rejuvenation's), the Pokédex (Uranium's) and the Mart (Infinite Fusion's), gui-a.js.
 * Every size is in game pixels × --k, so the screens stay crisp at every whole-number size. The player's font only
 * changes the letters (--fz evens out its width), never a box's size; nothing in here scrolls. */

/* ---------- shared ---------- */
:root.bw .ds.ga { color: #f8f8f8; image-rendering: pixelated; background-size: 100% 100%; overflow: hidden; }
:root.bw .ds.ga.hastabs { overflow: visible; }
:root.bw .ds.ga > * { position: absolute; }
:root.bw .ds.ga :is(button, select, input) { margin: 0; border: 0 !important; border-image: none !important; box-shadow: none !important; min-height: 0 !important; border-radius: 0 !important; outline: none; font-family: var(--bwfont) !important; letter-spacing: 0; padding: 0 !important; transform: none !important; animation: none; }
:root.bw .ds.ga :is(span, b, i, em, div, p) { font-style: normal; }
:root.bw .ds.ga button { cursor: pointer; }
:root.bw .ds.ga button:disabled { cursor: default; }
:root.bw .ds.ga .fitname { display: block; min-width: 0; white-space: nowrap; overflow: hidden; }
:root.bw .ds.ga .ga-wait { left: 0; right: 0; top: calc(var(--k) * 90); text-align: center; font-size: calc(var(--k) * 12 * var(--fz, 1)) !important; line-height: calc(var(--k) * 16) !important; text-shadow: var(--k) var(--k) 0 #000; }
/* A type: its colour, a dark edge, white capitals (Rejuvenation and Uranium both draw them this way). */
:root.bw .ds.ga .ga-type { flex: none; display: inline-grid; place-items: center; height: calc(var(--k) * 10); min-width: calc(var(--k) * 32); padding: 0 calc(var(--k) * 2); margin-right: calc(var(--k) * 2); background: var(--tc); color: #f8f8f8; box-shadow: inset 0 0 0 var(--k) rgba(0, 0, 0, .5), inset 0 0 0 calc(var(--k) * 2) rgba(255, 255, 255, .25); border-radius: calc(var(--k) * 2); font-size: calc(var(--k) * 7 * var(--fz, 1)) !important; line-height: calc(var(--k) * 10) !important; text-shadow: var(--k) var(--k) 0 rgba(0, 0, 0, .5); }
/* The arrows that turn pages: ◀ ▶ ▲ ▼. */
:root.bw .ds.ga .ga-arrow { width: calc(var(--k) * 14); height: calc(var(--k) * 14); background: none !important; color: #f8f8f8 !important; font-size: calc(var(--k) * 10) !important; line-height: calc(var(--k) * 14) !important; text-shadow: var(--k) var(--k) 0 #000 !important; text-align: center; }
:root.bw .ds.ga .ga-arrow:disabled { opacity: .3; }
:root.bw .ds.ga .ga-arrow:is(:hover, :focus-visible):not(:disabled) { background: rgba(255, 255, 255, .2) !important; }
/* A small button in a bar. */
:root.bw .ds.ga .ga-pill { height: calc(var(--k) * 16); padding: 0 calc(var(--k) * 5) !important; background: #303038 !important; box-shadow: inset 0 0 0 var(--k) #000, inset 0 0 0 calc(var(--k) * 2) #686874 !important; color: #f8f8f8 !important; font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 16) !important; text-shadow: var(--k) var(--k) 0 #000 !important; white-space: nowrap; }
:root.bw .ds.ga .ga-pill:is(:hover, :focus-visible) { background: #4a4a58 !important; box-shadow: inset 0 0 0 var(--k) #000, inset 0 0 0 calc(var(--k) * 2) #f8b048 !important; }
:root.bw .ds.ga .ga-pill[aria-pressed="true"] { background: #b05030 !important; }
/* Keys: the orange cursor frame is for the buttons; rows and cells bring their own cursor (lit, the red hand). */
:root.bw .ds.ga :is(button, select, input):focus-visible { outline: calc(var(--k) * 1) solid #f8a030 !important; outline-offset: 0 !important; animation: bwcursor 1s steps(1) infinite; }
:root.bw .ds.ga :is(.ga-cell, .ga-drow, .ga-mrow):focus-visible { outline: 0 !important; animation: none; }
:root[data-input="mouse"] .ds.ga :is(button, select, input):focus-visible { outline: none !important; }

/* =====================================================================================================
 * the PC: Rejuvenation's navy panels down the left, the box with its wallpaper on the right
 * ===================================================================================================== */
:root.bw .ds.ga-pc { --nv: #16223e; --nvl: #7f9fd4; --nvd: #0a1226; }
/* A Rejuvenation panel: black edge, a light blue line inside it, deep navy. */
:root.bw .ds.ga-pc :is(.ga-pcname, .ga-pcstage, .ga-pcrow, .ga-pchead .ga-pcbox, .ga-pcwall, .ga-pccmd) { background-color: var(--nv); box-shadow: inset 0 0 0 var(--k) #000, inset 0 0 0 calc(var(--k) * 2) var(--nvl), inset 0 0 0 calc(var(--k) * 3) var(--nvd); }
:root.bw .ds.ga-pc .ga-pcside { left: calc(var(--k) * 2); top: calc(var(--k) * 2); width: calc(var(--k) * 104); height: calc(var(--k) * 178); }
:root.bw .ds.ga-pc .ga-pcside > * { position: absolute; left: 0; width: 100%; }
:root.bw .ds.ga-pc .ga-pcname { top: 0; height: calc(var(--k) * 16); display: flex; align-items: center; gap: calc(var(--k) * 2); padding: 0 calc(var(--k) * 5); box-sizing: border-box; }
:root.bw .ds.ga-pc .ga-pcname b { flex: 1; font-size: calc(var(--k) * 11 * var(--fz, 1)) !important; line-height: calc(var(--k) * 14) !important; font-weight: 400; text-shadow: var(--k) var(--k) 0 #000; }
:root.bw .ds.ga .ga-sex { flex: none; font-size: calc(var(--k) * 10) !important; line-height: 1; text-shadow: var(--k) var(--k) 0 #000; }
:root.bw .ds.ga .ga-sex.m { color: #68a8f8; } :root.bw .ds.ga .ga-sex.f { color: #f87890; }
/* The stage behind the Pokémon: darker navy, the orange corner studs Rejuvenation puts on it. */
:root.bw .ds.ga-pc .ga-pcstage { top: calc(var(--k) * 18); height: calc(var(--k) * 98); display: grid; place-items: end center; padding-bottom: calc(var(--k) * 2); box-sizing: border-box; background: radial-gradient(ellipse at 50% 80%, #24365e 0 35%, #101a32 70%) !important; overflow: hidden; }
:root.bw .ds.ga-pc .ga-pcstage::before, :root.bw .ds.ga-pc .ga-pcstage::after { content: ""; position: absolute; width: calc(var(--k) * 3); height: calc(var(--k) * 3); background: #e07028; }
:root.bw .ds.ga-pc .ga-pcstage::before { left: calc(var(--k) * 2); top: calc(var(--k) * 2); }
:root.bw .ds.ga-pc .ga-pcstage::after { right: calc(var(--k) * 2); bottom: calc(var(--k) * 2); }
:root.bw .ds.ga .dsa-spr { image-rendering: pixelated; display: block; }
:root.bw .ds.ga-pc .ga-pcstage.egg { place-items: center; }
:root.bw .ds.ga-pc .ga-pcstage.egg img { width: calc(var(--k) * 48) !important; height: calc(var(--k) * 48) !important; }
:root.bw .ds.ga-pc .ga-pcrow { height: calc(var(--k) * 14); display: flex; align-items: center; justify-content: center; gap: calc(var(--k) * 2); padding: 0 calc(var(--k) * 4); box-sizing: border-box; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; text-shadow: var(--k) var(--k) 0 #000; overflow: hidden; white-space: nowrap; }
:root.bw .ds.ga-pc .ga-pcrow.r1 { top: calc(var(--k) * 118); justify-content: space-between; }
:root.bw .ds.ga-pc .ga-pcrow.r2 { top: calc(var(--k) * 133); }
:root.bw .ds.ga-pc .ga-pcrow.r3 { top: calc(var(--k) * 148); }
:root.bw .ds.ga-pc .ga-pcrow.r4 { top: calc(var(--k) * 163); font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; color: #c8d8f8; }
:root.bw .ds.ga-pc .ga-pcrow.r3 img { flex: none; width: calc(var(--k) * 12); height: calc(var(--k) * 12); object-fit: contain; image-rendering: pixelated; }
:root.bw .ds.ga-pc .ga-pcrow.egg .ga-small { font-size: calc(var(--k) * 7 * var(--fz, 1)) !important; overflow: hidden; text-overflow: ellipsis; }
:root.bw .ds.ga .ga-dim { color: #8898b8; }
:root.bw .ds.ga-pc .ga-pcrow .ga-type { min-width: calc(var(--k) * 30); }
/* Rejuvenation's markings: ● ★ ✦ ■, lit when they apply. */
:root.bw .ds.ga-pc .ga-marks { display: flex; gap: calc(var(--k) * 2); }
:root.bw .ds.ga-pc .ga-mk { font-size: calc(var(--k) * 8) !important; line-height: 1; color: #46567a; text-shadow: none; }
:root.bw .ds.ga-pc .ga-mk.lit { text-shadow: var(--k) var(--k) 0 #000; }
:root.bw .ds.ga-pc .ga-mk.pt.lit { color: #58e070; } :root.bw .ds.ga-pc .ga-mk.fv.lit { color: #f8d038; }
:root.bw .ds.ga-pc .ga-mk.sh.lit { color: #f878c8; } :root.bw .ds.ga-pc .ga-mk.lk.lit { color: #f8f8f8; }
:root.bw .ds.ga .ga-grade { flex: none; width: calc(var(--k) * 11); height: calc(var(--k) * 10); display: inline-grid; place-items: center; margin-left: calc(var(--k) * 2); background: #f8f8f8; color: #202028; font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: 1; text-shadow: none; box-shadow: inset 0 0 0 var(--k) #000; }
:root.bw .ds.ga :is(.ga-grade, .ga-cg).g-S { background: #f8c838; } :root.bw .ds.ga :is(.ga-grade, .ga-cg).g-A { background: #78d870; }
:root.bw .ds.ga :is(.ga-grade, .ga-cg).g-B { background: #78b8f8; } :root.bw .ds.ga :is(.ga-grade, .ga-cg).g-C { background: #d8d8e0; }
:root.bw .ds.ga :is(.ga-grade, .ga-cg).g-D { background: #c8a888; } :root.bw .ds.ga :is(.ga-grade, .ga-cg).g-E { background: #a8a8b0; }

/* The box's name over its wallpaper, with ◀ ▶. */
:root.bw .ds.ga-pc .ga-pchead { left: calc(var(--k) * 110); top: calc(var(--k) * 2); width: calc(var(--k) * 232); height: calc(var(--k) * 20); }
:root.bw .ds.ga-pc .ga-pchead > * { position: absolute; top: 0; }
:root.bw .ds.ga-pc .ga-pchead .ga-arrow { width: calc(var(--k) * 18); height: calc(var(--k) * 20); line-height: calc(var(--k) * 20) !important; background: var(--nv) !important; box-shadow: inset 0 0 0 var(--k) #000, inset 0 0 0 calc(var(--k) * 2) var(--nvl) !important; color: #78c8f8 !important; }
:root.bw .ds.ga-pc .ga-pchead .ga-arrow:is(:hover, :focus-visible):not(:disabled) { background: #2c4472 !important; color: #f8f8f8 !important; }
:root.bw .ds.ga-pc .ga-pchead .ga-arrow.l { left: 0; } :root.bw .ds.ga-pc .ga-pchead .ga-arrow.r { right: 0; }
:root.bw .ds.ga-pc .ga-pcbox { left: calc(var(--k) * 20); width: calc(var(--k) * 192); height: calc(var(--k) * 20); display: flex; align-items: center; justify-content: center; gap: calc(var(--k) * 6); background-size: calc(var(--k) * 228) calc(var(--k) * 140); background-position: 0 calc(var(--k) * -60); }
:root.bw .ds.ga-pc .ga-pcbox b { font-size: calc(var(--k) * 11 * var(--fz, 1)) !important; line-height: calc(var(--k) * 14) !important; font-weight: 400; padding: 0 calc(var(--k) * 6); background: rgba(10, 18, 38, .78); text-shadow: var(--k) var(--k) 0 #000; }
:root.bw .ds.ga-pc .ga-pcbox span { font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; padding: 0 calc(var(--k) * 3); background: rgba(10, 18, 38, .78); color: #c8d8f8; }
:root.bw .ds.ga-pc .ga-pcwall { left: calc(var(--k) * 110); top: calc(var(--k) * 24); width: calc(var(--k) * 232); height: calc(var(--k) * 144); background-origin: content-box; padding: calc(var(--k) * 2); box-sizing: border-box; background-size: calc(var(--k) * 228) calc(var(--k) * 140); background-repeat: no-repeat; }
:root.bw .ds.ga-pc .ga-pcwall::after { content: ""; position: absolute; inset: 0; box-shadow: inset 0 0 0 var(--k) #000, inset 0 0 0 calc(var(--k) * 2) var(--nvl); pointer-events: none; }
:root.bw .ds.ga-pc .ga-cells { position: absolute; left: calc(var(--k) * 2); top: calc(var(--k) * 2); width: calc(var(--k) * 228); height: calc(var(--k) * 140); }
:root.bw .ds.ga-pc .ga-cell { position: absolute; width: calc(var(--k) * 38); height: calc(var(--k) * 28); background: none !important; overflow: visible; }
:root.bw .ds.ga-pc .ga-cell > * { position: absolute; pointer-events: none; }
:root.bw .ds.ga-pc .ga-cell span.ga-ic { left: calc(var(--k) * -1); top: calc(var(--k) * -2); width: 40px; height: 30px; transform-origin: 0 0; image-rendering: pixelated; }
:root.bw .ds.ga-pc .ga-cell img.ga-ic { left: calc(var(--k) * 3); top: calc(var(--k) * -3); width: calc(var(--k) * 32); height: calc(var(--k) * 32); image-rendering: pixelated; transform: none; }
/* The mouse over one: a soft light, and the left side shows it; the current one: a brighter light and the red hand. */
:root.bw .ds.ga-pc .ga-cell:hover:not(.on) { background: rgba(255, 255, 255, .18) !important; box-shadow: inset 0 0 0 var(--k) rgba(255, 255, 255, .45) !important; }
:root.bw .ds.ga-pc .ga-cell.on { background: rgba(255, 255, 255, .32) !important; box-shadow: inset 0 0 0 var(--k) #f8f8f8, inset 0 0 0 calc(var(--k) * 2) rgba(0, 0, 0, .35) !important; z-index: 2; }
:root.bw .ds.ga-pc .ga-cell.on::after { content: ""; position: absolute; left: calc(var(--k) * 24); top: calc(var(--k) * -8); width: calc(var(--k) * 13); height: calc(var(--k) * 13); background: var(--hand) 0 0 / 100% 100% no-repeat; image-rendering: pixelated; animation: ga-bob .8s steps(2) infinite; }
@keyframes ga-bob { 50% { translate: 0 var(--k); } }
:root.reduce-motion .ds.ga-pc .ga-cell.on::after { animation: none; }
:root.bw .ds.ga-pc .ga-cdot { left: calc(var(--k) * 2); bottom: calc(var(--k) * 2); width: calc(var(--k) * 4); height: calc(var(--k) * 4); border-radius: 50%; background: #58e070; box-shadow: 0 0 0 var(--k) #000; }
:root.bw .ds.ga-pc .ga-cst { left: calc(var(--k) * 1); top: 0; font-size: calc(var(--k) * 8) !important; line-height: 1; color: #f8d038; text-shadow: var(--k) 0 0 #000, 0 var(--k) 0 #000, calc(var(--k) * -1) 0 0 #000; }
:root.bw .ds.ga-pc .ga-cst.sh { color: #f878c8; }
:root.bw .ds.ga-pc .ga-cg { right: calc(var(--k) * 1); bottom: calc(var(--k) * 1); width: calc(var(--k) * 7); height: calc(var(--k) * 8); display: grid; place-items: center; color: #202028; font-size: calc(var(--k) * 6 * var(--fz, 1)) !important; line-height: 1; box-shadow: inset 0 0 0 calc(var(--k) * .5) #000; }
:root.bw .ds.ga-pc .ga-cs { right: calc(var(--k) * 1); top: 0; font-size: calc(var(--k) * 7) !important; line-height: 1; text-shadow: var(--k) 0 0 #000, 0 var(--k) 0 #000; }
:root.bw .ds.ga-pc .ga-cs.m { color: #78b8f8; } :root.bw .ds.ga-pc .ga-cs.f { color: #f88898; }
:root.bw .ds.ga-pc .ga-cell.on .ga-cs { display: none; }
:root.bw .ds.ga .ga-none { position: absolute; left: 0; right: 0; top: calc(var(--k) * 60); text-align: center; font-size: calc(var(--k) * 10 * var(--fz, 1)) !important; line-height: calc(var(--k) * 16) !important; background: rgba(10, 18, 38, .8); text-shadow: var(--k) var(--k) 0 #000; }

/* The tools under the box: filters, type, sort, find. */
:root.bw .ds.ga-pc .ga-pctools { left: calc(var(--k) * 110); top: calc(var(--k) * 170); width: calc(var(--k) * 232); height: calc(var(--k) * 13); display: flex; gap: calc(var(--k) * 2); }
:root.bw .ds.ga-pc .ga-filt { display: flex; gap: calc(var(--k) * 1); flex: none; }
:root.bw .ds.ga-pc .ga-filt button, :root.bw .worldwin.game .ds.ga-pc .ga-sel, :root.bw .worldwin.game .ds.ga-pc .ga-find { height: calc(var(--k) * 13); background: var(--nv) !important; box-shadow: inset 0 0 0 var(--k) #000, inset 0 0 0 calc(var(--k) * 2) #3e5682 !important; color: #f8f8f8 !important; font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 13) !important; text-shadow: var(--k) var(--k) 0 #000 !important; }
:root.bw .ds.ga-pc .ga-filt button { min-width: calc(var(--k) * 13); padding: 0 calc(var(--k) * 2) !important; }
:root.bw .ds.ga-pc .ga-filt button[aria-pressed="true"] { background: #2878c8 !important; box-shadow: inset 0 0 0 var(--k) #000, inset 0 0 0 calc(var(--k) * 2) #98d0f8 !important; }
:root.bw .ds.ga-pc .ga-filt button:hover:not([aria-pressed="true"]), :root.bw .worldwin.game .ds.ga-pc :is(.ga-sel, .ga-find):hover { background: #24365e !important; }
:root.bw .worldwin.game .ds.ga-pc .ga-sel { flex: none; width: calc(var(--k) * 52); padding: 0 calc(var(--k) * 8) 0 calc(var(--k) * 3) !important; appearance: none; -webkit-appearance: none; text-overflow: ellipsis; background-image: linear-gradient(135deg, transparent 50%, #f8f8f8 50%) !important; background-size: calc(var(--k) * 3) calc(var(--k) * 3) !important; background-position: right calc(var(--k) * 3) center !important; background-repeat: no-repeat !important; }
:root.bw .worldwin.game .ds.ga-pc .ga-sel option { background: #16223e; color: #f8f8f8; }
:root.bw .worldwin.game .ds.ga-pc .ga-find { flex: 1; min-width: 0; padding: 0 calc(var(--k) * 3) !important; border-image: none !important; border-width: 0 !important; }
:root.bw .worldwin.game .ds.ga-pc .ga-find::placeholder { color: #7888a8; }

/* Rejuvenation's command list, over the corner of the box. */
:root.bw .ds.ga-pc .ga-pccmd { left: calc(var(--k) * 244); top: calc(var(--k) * 60); width: calc(var(--k) * 96); padding: calc(var(--k) * 4) calc(var(--k) * 3); box-sizing: border-box; display: flex; flex-direction: column; gap: calc(var(--k) * 1); z-index: 5; background-color: rgba(18, 28, 54, .97) !important; }
:root.bw .ds.ga-pc .ga-pccmd[hidden] { display: none; }
:root.bw .ds.ga-pc .ga-pccmd.left { left: calc(var(--k) * 114); }
:root.bw .ds.ga-pc .ga-cmdb { position: relative; height: calc(var(--k) * 13); padding: 0 calc(var(--k) * 2) 0 calc(var(--k) * 9) !important; background: none !important; color: #f8f8f8 !important; text-align: left; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 13) !important; text-shadow: var(--k) var(--k) 0 #000 !important; white-space: nowrap; overflow: hidden; }
:root.bw .ds.ga-pc .ga-cmdb:is(:hover, :focus-visible):not(:disabled) { background: rgba(127, 159, 212, .28) !important; outline: none !important; }
:root.bw .ds.ga-pc .ga-cmdb:focus-visible::before, :root.bw .ds.ga-pc .ga-cmdb:focus::before { content: "▶"; position: absolute; left: calc(var(--k) * 1); font-size: calc(var(--k) * 7) !important; color: #f8f8f8; }
:root.bw .ds.ga-pc .ga-cmdb:disabled { color: #6a7898 !important; }
:root.bw .ds.ga-pc .ga-cmdb.red { color: #ff9080 !important; }
:root.bw .ds.ga-pc .ga-cmdq { position: static; font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 10) !important; padding: 0 calc(var(--k) * 2) calc(var(--k) * 2); color: #f8d878; text-shadow: var(--k) var(--k) 0 #000; white-space: normal; }
/* The bar along the bottom: PARTY PKMN, what's happening (Rejuvenation's message line), ✕ and the U-turn. */
:root.bw .ds.ga .ga-partybtn { left: calc(var(--k) * 4); top: calc(var(--k) * 188); width: calc(var(--k) * 62); height: calc(var(--k) * 16); background: #20304e !important; box-shadow: inset 0 0 0 var(--k) #000, inset 0 0 0 calc(var(--k) * 2) var(--nvl, #7f9fd4) !important; color: #f8f8f8 !important; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 16) !important; text-shadow: var(--k) var(--k) 0 #000 !important; white-space: nowrap; }
:root.bw .ds.ga .ga-partybtn span { font-size: calc(var(--k) * 7 * var(--fz, 1)) !important; vertical-align: calc(var(--k) * -1); }
:root.bw .ds.ga .ga-partybtn:is(:hover, :focus-visible) { background: #2c4472 !important; }
:root.bw .ds.ga-pc .ga-msg { left: calc(var(--k) * 70); top: calc(var(--k) * 188); width: calc(var(--k) * 216); height: calc(var(--k) * 16); padding: 0 calc(var(--k) * 4); box-sizing: border-box; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 16) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-shadow: var(--k) var(--k) 0 #000; }

/* =====================================================================================================
 * the Pokédex: Uranium's teal pages, its white card, the dark band
 * ===================================================================================================== */
:root.bw .ds.ga-dex .ga-dtitle { left: 0; top: 0; width: 100%; height: calc(var(--k) * 15); display: flex; align-items: center; justify-content: space-between; padding: 0 calc(var(--k) * 6) 0 calc(var(--k) * 24); box-sizing: border-box; }
:root.bw .ds.ga-dex .ga-dtitle b { font-size: calc(var(--k) * 10 * var(--fz, 1)) !important; line-height: calc(var(--k) * 14) !important; font-weight: 400; text-shadow: var(--k) var(--k) 0 #000; white-space: nowrap; }
:root.bw .ds.ga-dex .ga-dtitle span { font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; color: #a8e8d8; white-space: nowrap; }
:root.bw .ds.ga-dex em { color: #f8f8f8; }
/* Uranium's white card: light grey paper with a faint grid, a dark edge and a light one inside it, the three slashes on top. */
:root.bw .ds.ga-dex :is(.ga-dcard, .ga-dlist, .ga-ecard, .ga-tcol) { background-color: #ececec; background-image: linear-gradient(#dcdcdc var(--k), transparent var(--k)), linear-gradient(90deg, #dcdcdc var(--k), transparent var(--k)); background-size: calc(var(--k) * 8) calc(var(--k) * 8); box-shadow: inset 0 0 0 var(--k) #484848, inset 0 0 0 calc(var(--k) * 2) #f8f8f8, inset 0 0 0 calc(var(--k) * 3) #b8b8b8; color: #404040; }
:root.bw .ds.ga-dex :is(.ga-dcard, .ga-ecard)::before { content: ""; position: absolute; right: calc(var(--k) * 6); top: calc(var(--k) * -4); width: calc(var(--k) * 20); height: calc(var(--k) * 4); background: repeating-linear-gradient(115deg, #58c8b8 0 calc(var(--k) * 2), transparent 0 calc(var(--k) * 4)); }
:root.bw .ds.ga-dex .ga-dleft { left: calc(var(--k) * 4); top: calc(var(--k) * 18); width: calc(var(--k) * 136); height: calc(var(--k) * 100); }
:root.bw .ds.ga-dex .ga-dleft > * { position: absolute; }
:root.bw .ds.ga-dex .ga-dstage { inset: 0; display: grid; place-items: end center; }
:root.bw .ds.ga .ga-shadow img { filter: brightness(0) opacity(.55); }
:root.bw .ds.ga-dex .ga-dball { right: calc(var(--k) * 2); top: calc(var(--k) * 4); width: calc(var(--k) * 9); height: calc(var(--k) * 9); background: var(--ball) 0 0 / 100% 100%; image-rendering: pixelated; }
:root.bw .ds.ga-dex .ga-dball.own { background-image: var(--ballon); }
:root.bw .ds.ga-dex .ga-dcard { left: calc(var(--k) * 4); top: calc(var(--k) * 120); width: calc(var(--k) * 136); height: calc(var(--k) * 61); }
:root.bw .ds.ga-dex :is(.ga-dcard, .ga-ecard, .ga-tcol) * { text-shadow: var(--k) var(--k) 0 #d4d4d4 !important; }
:root.bw .ds.ga-dex :is(.ga-dcard, .ga-ecard) .ga-type { text-shadow: var(--k) var(--k) 0 rgba(0, 0, 0, .5) !important; }
:root.bw .ds.ga-dex :is(.ga-dcard, .ga-ecard) > * { position: absolute; left: calc(var(--k) * 5); right: calc(var(--k) * 5); display: flex; align-items: center; gap: calc(var(--k) * 4); white-space: nowrap; overflow: hidden; }
:root.bw .ds.ga-dex .ga-dc1, :root.bw .ds.ga-dex .ga-ec1 { top: calc(var(--k) * 4); height: calc(var(--k) * 13); font-size: calc(var(--k) * 10 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; border-bottom: var(--k) solid #c0c0c0; }
:root.bw .ds.ga-dex :is(.ga-dc1, .ga-ec1) span { flex: none; color: #607070; }
:root.bw .ds.ga-dex :is(.ga-dc1, .ga-ec1) span::before { content: "•"; margin-right: calc(var(--k) * 1); color: #58a898; }
:root.bw .ds.ga-dex :is(.ga-dc1, .ga-ec1) b { flex: 1; font-weight: 400; color: #303030; }
:root.bw .ds.ga-dex :is(.ga-dc2, .ga-ec2) { top: calc(var(--k) * 18); height: calc(var(--k) * 12); font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; color: #505050; }
:root.bw .ds.ga-dex :is(.ga-dc3, .ga-ec3) { top: calc(var(--k) * 31); height: calc(var(--k) * 12); }
:root.bw .ds.ga-dex .ga-dc4 { top: calc(var(--k) * 45); height: calc(var(--k) * 12); font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; color: #406860; }
/* The list: Uranium's white card down the right, a row each, a page at a time. */
:root.bw .ds.ga-dex .ga-dlist { left: calc(var(--k) * 144); top: calc(var(--k) * 18); width: calc(var(--k) * 152); height: calc(var(--k) * 164); }
:root.bw .ds.ga-dex .ga-drows { position: absolute; left: calc(var(--k) * 3); top: calc(var(--k) * 3); width: calc(var(--k) * 146); height: calc(var(--k) * 144); }
:root.bw .ds.ga-dex .ga-drow { display: flex; align-items: center; gap: calc(var(--k) * 3); width: 100%; height: calc(var(--k) * 12); padding: 0 calc(var(--k) * 3) !important; background: none !important; color: #383838 !important; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; text-align: left; text-shadow: var(--k) var(--k) 0 #d0d0d0 !important; box-sizing: border-box; }
:root.bw .ds.ga-dex .ga-drow.no { color: #8a8a8a !important; }
:root.bw .ds.ga-dex .ga-drow b { flex: 1; font-weight: 400; }
:root.bw .ds.ga-dex .ga-dn { flex: none; color: #607070; }
:root.bw .ds.ga-dex .ga-db { flex: none; width: calc(var(--k) * 9); height: calc(var(--k) * 9); background: var(--ball) 0 0 / 100% 100%; image-rendering: pixelated; }
:root.bw .ds.ga-dex .ga-db.own { background-image: var(--ballon); }
:root.bw .ds.ga-dex .ga-drow:hover:not(.on) { background: rgba(88, 200, 184, .22) !important; }
:root.bw .ds.ga-dex .ga-drow.on { background: #58c8b8 !important; color: #f8f8f8 !important; text-shadow: var(--k) var(--k) 0 #207060 !important; box-shadow: inset 0 0 0 var(--k) #207060 !important; }
:root.bw .ds.ga-dex .ga-drow.on .ga-dn { color: #e8fff8; }
:root.bw .ds.ga-dex .ga-dpage { position: absolute; left: 0; right: 0; bottom: calc(var(--k) * 3); height: calc(var(--k) * 14); display: flex; align-items: center; justify-content: center; gap: calc(var(--k) * 8); border-top: var(--k) solid #c0c0c0; }
:root.bw .ds.ga-dex .ga-dpage span { min-width: calc(var(--k) * 34); text-align: center; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 14) !important; color: #404040; }
:root.bw .ds.ga-dex .ga-dpage .ga-arrow { position: static; color: #2a8a7a !important; text-shadow: none !important; }
:root.bw .ds.ga-dex .ga-dpage .ga-arrow:is(:hover, :focus-visible):not(:disabled) { background: rgba(88, 200, 184, .3) !important; }
:root.bw .ds.ga-dex .ga-dfoot { left: calc(var(--k) * 4); top: calc(var(--k) * 188); width: calc(var(--k) * 128); height: calc(var(--k) * 16); display: flex; gap: calc(var(--k) * 6); align-items: center; font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 16) !important; color: #a8e8d8; white-space: nowrap; overflow: hidden; }
:root.bw .ds.ga-dex .ga-rank { left: calc(var(--k) * 136); top: calc(var(--k) * 188); }
:root.bw .ds.ga-dex .ga-open { left: calc(var(--k) * 196); top: calc(var(--k) * 188); }
:root.bw .ds.ga-dex.ga-top .ga-rank { left: calc(var(--k) * 4); }
:root.bw .ds.ga-dex .ga-pill { background: #1c3434 !important; box-shadow: inset 0 0 0 var(--k) #000, inset 0 0 0 calc(var(--k) * 2) #58c8b8 !important; }
:root.bw .ds.ga-dex .ga-pill:is(:hover, :focus-visible) { background: #2a5050 !important; }
:root.bw .ds.ga-dex .ga-pill[aria-pressed="true"] { background: #2a8a7a !important; }

/* the rankings page */
:root.bw .ds.ga-top .ga-ttabs { left: calc(var(--k) * 4); top: calc(var(--k) * 19); width: calc(var(--k) * 292); height: calc(var(--k) * 14); display: flex; gap: calc(var(--k) * 2); }
:root.bw .ds.ga-top .ga-ttabs button { flex: 1; height: calc(var(--k) * 14); background: #1c3434 !important; box-shadow: inset 0 0 0 var(--k) #000, inset 0 0 0 calc(var(--k) * 2) #58c8b8 !important; color: #f8f8f8 !important; font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 14) !important; text-shadow: var(--k) var(--k) 0 #000 !important; }
:root.bw .ds.ga-top .ga-ttabs button[aria-pressed="true"] { background: #f8f8f8 !important; color: #204040 !important; text-shadow: none !important; }
:root.bw .ds.ga-top .ga-ttabs button:hover:not([aria-pressed="true"]) { background: #2a5050 !important; }
:root.bw .ds.ga-top .ga-tcols { left: calc(var(--k) * 4); top: calc(var(--k) * 37); width: calc(var(--k) * 292); height: calc(var(--k) * 142); display: flex; gap: calc(var(--k) * 4); }
:root.bw .ds.ga-top .ga-tcol { position: relative; flex: 1; min-width: 0; padding: calc(var(--k) * 4); box-sizing: border-box; }
:root.bw .ds.ga-top .ga-th { height: calc(var(--k) * 13); font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 13) !important; color: #2a8a7a; border-bottom: var(--k) solid #c0c0c0; margin-bottom: calc(var(--k) * 2); }
:root.bw .ds.ga-top .ga-tr { display: flex; gap: calc(var(--k) * 3); align-items: center; height: calc(var(--k) * 15); font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 15) !important; }
:root.bw .ds.ga-top .ga-tr i { flex: none; width: calc(var(--k) * 10); color: #607070; text-align: center; }
:root.bw .ds.ga-top .ga-tr b { flex: 1; font-weight: 400; }
:root.bw .ds.ga-top .ga-tr em { flex: none; color: #303030; }
:root.bw .ds.ga-top .ga-tr.me { background: #c8f0e8; }
:root.bw .ds.ga-top .ga-tr.none { color: #808080; }

/* the entry */
:root.bw .ds.ga-entry .ga-estage { left: calc(var(--k) * 4); top: calc(var(--k) * 18); width: calc(var(--k) * 108); height: calc(var(--k) * 100); display: grid; place-items: end center; }
:root.bw .ds.ga-entry .ga-eup { left: calc(var(--k) * 114); top: calc(var(--k) * 20); }
:root.bw .ds.ga-entry .ga-edn { left: calc(var(--k) * 114); top: calc(var(--k) * 98); }
:root.bw .ds.ga-entry .ga-eball { left: calc(var(--k) * 117); top: calc(var(--k) * 62); }
:root.bw .ds.ga-entry .ga-ecard { left: calc(var(--k) * 132); top: calc(var(--k) * 22); width: calc(var(--k) * 164); height: calc(var(--k) * 94); }
:root.bw .ds.ga-entry .ga-ec4 { top: calc(var(--k) * 48); height: calc(var(--k) * 14); justify-content: space-between; font-size: calc(var(--k) * 10 * var(--fz, 1)) !important; line-height: calc(var(--k) * 13) !important; border-bottom: var(--k) dotted #a8a8a8; }
:root.bw .ds.ga-entry .ga-ec4 + .ga-ec4 { top: calc(var(--k) * 66); }
:root.bw .ds.ga-entry .ga-ec4 i { color: #607070; padding: 0 calc(var(--k) * 4); background: #dcdcdc; }
:root.bw .ds.ga-entry .ga-ec4 b { font-weight: 400; color: #303030; }
:root.bw .ds.ga-entry .ga-ec3 { justify-content: center; }
:root.bw .ds.ga-entry .ga-ewhere { left: calc(var(--k) * 4); top: calc(var(--k) * 121); width: calc(var(--k) * 292); height: calc(var(--k) * 27); padding: calc(var(--k) * 1) calc(var(--k) * 5); box-sizing: border-box; background: rgba(16, 48, 46, .55); box-shadow: inset 0 0 0 var(--k) rgba(168, 232, 216, .4); font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; text-shadow: var(--k) var(--k) 0 #000; }
:root.bw .ds.ga-entry .ga-ewhere b { font-weight: 400; color: #f8e888; }
/* Uranium's dark band along the bottom with the words. */
:root.bw .ds.ga-entry .ga-etext { left: 0; top: calc(var(--k) * 150); width: 100%; height: calc(var(--k) * 34); padding: calc(var(--k) * 1) calc(var(--k) * 8); box-sizing: border-box; background: rgba(20, 40, 40, .88); font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 11) !important; text-shadow: var(--k) var(--k) 0 #000; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
:root.bw .ds.ga-entry .ga-ebar { left: calc(var(--k) * 4); top: calc(var(--k) * 188); height: calc(var(--k) * 16); display: flex; align-items: center; gap: calc(var(--k) * 3); }
:root.bw .ds.ga-entry .ga-ebar > * { position: static; }
:root.bw .ds.ga-entry .ga-epg { font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 16) !important; color: #a8e8d8; white-space: nowrap; min-width: calc(var(--k) * 52); text-align: center; }
:root.bw .ds.ga-entry .ga-eshiny { margin-left: calc(var(--k) * 6); }

/* =====================================================================================================
 * the Mart: Infinite Fusion's money box, its cream list in a gold frame with the red frame on your row, the pink words
 * ===================================================================================================== */
:root.bw .ds.ga-mart :is(.ga-mmoney, .ga-mside) { background: rgba(28, 28, 34, .94); box-shadow: inset 0 0 0 var(--k) #000, inset 0 0 0 calc(var(--k) * 2) #8c8c98, inset 0 0 0 calc(var(--k) * 3) #3a3a44; border-radius: calc(var(--k) * 3); }
:root.bw .ds.ga-mart .ga-mmoney { left: calc(var(--k) * 4); top: calc(var(--k) * 4); width: calc(var(--k) * 104); height: calc(var(--k) * 28); padding: calc(var(--k) * 3) calc(var(--k) * 6); box-sizing: border-box; display: flex; flex-direction: column; text-shadow: var(--k) var(--k) 0 #000; }
:root.bw .ds.ga-mart .ga-mmoney span { font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 10) !important; color: #c8c8d0; }
:root.bw .ds.ga-mart .ga-mmoney b { font-weight: 400; text-align: right; font-size: calc(var(--k) * 10 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; white-space: nowrap; }
:root.bw .ds.ga-mart .ga-mside { left: calc(var(--k) * 4); top: calc(var(--k) * 36); width: calc(var(--k) * 104); height: calc(var(--k) * 110); }
:root.bw .ds.ga-mart .ga-mside > * { position: absolute; left: calc(var(--k) * 5); right: calc(var(--k) * 5); }
:root.bw .ds.ga-mart .ga-mpic { top: calc(var(--k) * 3); height: calc(var(--k) * 46); display: grid; place-items: center; }
:root.bw .ds.ga-mart .ga-mpic img { image-rendering: pixelated; }
:root.bw .ds.ga-mart .ga-mpic .dnaicon { width: calc(var(--k) * 28); height: calc(var(--k) * 28); }
:root.bw .ds.ga-mart .ga-mhave { top: calc(var(--k) * 49); height: calc(var(--k) * 11); text-align: center; font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 11) !important; text-shadow: var(--k) var(--k) 0 #000; }
:root.bw .ds.ga-mart .ga-mstock { top: calc(var(--k) * 4); left: auto !important; right: calc(var(--k) * 6) !important; font-size: calc(var(--k) * 7 * var(--fz, 1)) !important; line-height: calc(var(--k) * 9) !important; color: #98e8a0; text-shadow: var(--k) var(--k) 0 #000; white-space: nowrap; }
:root.bw .ds.ga-mart .ga-mstock.out { color: #ff8070; }
:root.bw .ds.ga-mart :is(.ga-mbulk, .ga-mqty) { display: flex; gap: calc(var(--k) * 3); justify-content: center; align-items: center; height: calc(var(--k) * 13); }
:root.bw .ds.ga-mart .ga-mbulk { top: calc(var(--k) * 62); }
:root.bw .ds.ga-mart .ga-mqty { top: calc(var(--k) * 77); }
:root.bw .ds.ga-mart :is(.ga-mbulk, .ga-mqty) button { min-width: calc(var(--k) * 22); height: calc(var(--k) * 13); background: #3a3a46 !important; box-shadow: inset 0 0 0 var(--k) #000, inset 0 0 0 calc(var(--k) * 2) #6a6a78 !important; color: #f8f8f8 !important; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 13) !important; text-shadow: var(--k) var(--k) 0 #000 !important; }
:root.bw .ds.ga-mart :is(.ga-mbulk, .ga-mqty) button:hover:not(:disabled) { background: #50505e !important; }
:root.bw .ds.ga-mart .ga-mbulk button[aria-pressed="true"] { background: #c84850 !important; box-shadow: inset 0 0 0 var(--k) #000, inset 0 0 0 calc(var(--k) * 2) #f8a0a8 !important; }
:root.bw .ds.ga-mart :is(.ga-mbulk, .ga-mqty) button:disabled { color: #70707c !important; background: #2a2a32 !important; }
:root.bw .ds.ga-mart .ga-mqty span { min-width: calc(var(--k) * 26); text-align: center; font-size: calc(var(--k) * 10 * var(--fz, 1)) !important; line-height: calc(var(--k) * 13) !important; text-shadow: var(--k) var(--k) 0 #000; }
:root.bw .ds.ga-mart .ga-buy, :root.bw .ds.ga-mart .ga-mowned { top: calc(var(--k) * 92); height: calc(var(--k) * 15); background: #e8d060 !important; box-shadow: inset 0 0 0 var(--k) #604808, inset 0 0 0 calc(var(--k) * 2) #f8f0b0 !important; color: #403010 !important; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 15) !important; text-shadow: none !important; text-align: center; white-space: nowrap; overflow: hidden; }
:root.bw .ds.ga-mart .ga-buy:is(:hover, :focus-visible):not(:disabled) { background: #f8e070 !important; box-shadow: inset 0 0 0 var(--k) #e02020, inset 0 0 0 calc(var(--k) * 2) #f8f0b0 !important; }
:root.bw .ds.ga-mart .ga-buy:disabled { background: #5a5a62 !important; color: #a0a0a8 !important; box-shadow: inset 0 0 0 var(--k) #000, inset 0 0 0 calc(var(--k) * 2) #707078 !important; }
:root.bw .ds.ga-mart .ga-mowned { background: #3a5a40 !important; color: #c8f8c8 !important; box-shadow: inset 0 0 0 var(--k) #000 !important; }
/* While the mouse is over another item, its picture and words show, but its buying buttons don't (they're for the picked one). */
:root.bw .ds.ga-mart .ga-mside.peek :is(.ga-mbulk, .ga-mqty, .ga-buy, .ga-mowned) { visibility: hidden; }
:root.bw .ds.ga-mart .ga-mnone { top: calc(var(--k) * 40); text-align: center; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; }
/* the list: cream paper in a gold frame */
:root.bw .ds.ga-mart .ga-mlist { left: calc(var(--k) * 112); top: calc(var(--k) * 4); width: calc(var(--k) * 184); height: calc(var(--k) * 142); background: #f8f8f0; box-shadow: inset 0 0 0 var(--k) #806010, inset 0 0 0 calc(var(--k) * 3) #e8d060, inset 0 0 0 calc(var(--k) * 4) #b89830; border-radius: calc(var(--k) * 4); }
:root.bw .ds.ga-mart .ga-mlist > * { position: absolute; }
:root.bw .ds.ga-mart .ga-marr { left: calc(var(--k) * 82); width: calc(var(--k) * 20); height: calc(var(--k) * 9); background: none !important; color: #f07818 !important; font-size: calc(var(--k) * 8) !important; line-height: calc(var(--k) * 9) !important; text-shadow: 0 var(--k) 0 #a04008 !important; }
:root.bw .ds.ga-mart .ga-marr.up { top: calc(var(--k) * 3); } :root.bw .ds.ga-mart .ga-marr.dn { top: calc(var(--k) * 130); }
:root.bw .ds.ga-mart .ga-marr:disabled { visibility: hidden; }
:root.bw .ds.ga-mart .ga-marr:is(:hover, :focus-visible):not(:disabled) { background: rgba(240, 120, 24, .18) !important; }
:root.bw .ds.ga-mart .ga-mpg { right: calc(var(--k) * 8); top: calc(var(--k) * 3); font-size: calc(var(--k) * 7 * var(--fz, 1)) !important; line-height: calc(var(--k) * 9) !important; color: #8a7a40; }
:root.bw .ds.ga-mart .ga-mrows { left: calc(var(--k) * 6); top: calc(var(--k) * 12); width: calc(var(--k) * 172); height: calc(var(--k) * 117); }
:root.bw .ds.ga-mart .ga-mrow { display: flex; align-items: center; gap: calc(var(--k) * 4); width: 100%; height: calc(var(--k) * 13); padding: 0 calc(var(--k) * 4) !important; box-sizing: border-box; background: none !important; color: #404040 !important; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 13) !important; text-shadow: var(--k) var(--k) 0 #d8d8c8 !important; text-align: left; }
:root.bw .ds.ga-mart .ga-mrow b { flex: 1; font-weight: 400; }
:root.bw .ds.ga-mart .ga-mrow em { flex: none; color: #404040; }
:root.bw .ds.ga-mart .ga-mrow.out { color: #a0a0a0 !important; } :root.bw .ds.ga-mart .ga-mrow.out em { color: #d04030; }
:root.bw .ds.ga-mart .ga-mrow.own em { color: #308040; }
/* Too dear for what you have: the price in red. */
:root.bw .ds.ga-mart .ga-mrow.poor:not(.out, .own) em { color: #c03838; }
:root.bw .ds.ga-mart .ga-mrow:hover:not(.on) { background: rgba(232, 208, 96, .3) !important; }
/* Infinite Fusion's cursor: a red frame around the row, its name in green. */
:root.bw .ds.ga-mart .ga-mrow.on { box-shadow: inset 0 0 0 var(--k) #e02020, inset 0 0 0 calc(var(--k) * 2) #f8b0a8 !important; color: #208838 !important; }
:root.bw .ds.ga-mart .ga-mrow.on b::before { content: "* "; }
/* the pink words along the bottom */
:root.bw .ds.ga-mart .ga-mwords { left: calc(var(--k) * 4); top: calc(var(--k) * 150); width: calc(var(--k) * 292); height: calc(var(--k) * 34); background: #a8406c; box-shadow: inset 0 0 0 var(--k) #401028, inset 0 0 0 calc(var(--k) * 2) #e8a0c0, inset 0 0 0 calc(var(--k) * 3) #78284c; border-radius: calc(var(--k) * 2); }
:root.bw .ds.ga-mart .ga-mwords > * { position: absolute; }
:root.bw .ds.ga-mart .ga-mframe { left: calc(var(--k) * 4); top: calc(var(--k) * 4); width: calc(var(--k) * 26); height: calc(var(--k) * 26); display: grid; place-items: center; background: #e8e8f8; box-shadow: inset 0 0 0 var(--k) #401028, inset 0 0 0 calc(var(--k) * 2) #b8b8c8; }
:root.bw .ds.ga-mart .ga-mframe img { max-width: calc(var(--k) * 22); max-height: calc(var(--k) * 22); image-rendering: pixelated; }
:root.bw .ds.ga-mart .ga-mframe .dnaicon { width: calc(var(--k) * 18); height: calc(var(--k) * 18); }
:root.bw .ds.ga-mart .ga-mwords p { left: calc(var(--k) * 34); top: calc(var(--k) * 2); width: calc(var(--k) * 254); height: calc(var(--k) * 30); margin: 0; font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 10) !important; color: #f8f8f8; text-shadow: var(--k) var(--k) 0 #501830; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
:root.bw .ds.ga-mart .ga-mwords p b { font-weight: 400; color: #f8e070; }
:root.bw .ds.ga-mart .ga-mfoot { left: calc(var(--k) * 6); top: calc(var(--k) * 190); width: calc(var(--k) * 230); height: calc(var(--k) * 14); font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 14) !important; color: #e8d060; text-shadow: var(--k) var(--k) 0 #000; }

/* =====================================================================================================
 * "Added to the Pokédex!" (dexnew.js): the first of a kind, after the catch, as a page of the Pokédex above (it takes
 * the entry's layout, .ga-entry). One screen, never scrolling (dexnew.js shrinks a long entry's letters); the message
 * box takes the player's frame.
 * ===================================================================================================== */
.dxnveil { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; background: rgba(0, 0, 0, .5); cursor: pointer; }
:root.bw .ds.ga.dxn { position: relative; box-shadow: 0 0 0 var(--k) #000, 0 0 0 calc(var(--k) * 2) #58c8b8, 0 0 0 calc(var(--k) * 3) #000; animation: dxnin .35s cubic-bezier(.3, 1.4, .5, 1); }
@keyframes dxnin { from { transform: scale(.85); opacity: 0; } }
/* NEW, in the stage's corner, the games' red. */
:root.bw .ds.dxn .dxn-new { left: calc(var(--k) * 5); top: calc(var(--k) * 20); z-index: 2; height: calc(var(--k) * 11); padding: 0 calc(var(--k) * 3); background: #e83828; box-shadow: 0 0 0 var(--k) #681810; color: #f8f8f8; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 11) !important; text-shadow: var(--k) var(--k) 0 #902010; animation: dxnblink 1s steps(2) infinite; }
@keyframes dxnblink { 50% { opacity: .55; } }
/* The games' words, in Uranium's dark band (shrunk to fit by dexNewFit, never scrolled). */
:root.bw .ds.dxn .dxn-page { left: 0; top: calc(var(--k) * 121); width: 100%; height: calc(var(--k) * 40); box-sizing: border-box; padding: calc(var(--k) * 2) calc(var(--k) * 8); overflow: hidden; background: rgba(20, 40, 40, .88); box-shadow: inset 0 var(--k) 0 rgba(168, 232, 216, .4), inset 0 calc(var(--k) * -1) 0 rgba(168, 232, 216, .4); }
:root.bw .ds.dxn .dxn-entry { margin: 0; color: #f8f8f8; font-size: calc(var(--k) * 9 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; text-shadow: var(--k) var(--k) 0 #000; }
/* What happened, in the message box (the player's frame), and OK to carry on. */
:root.bw .ds.dxn .dxn-msg { left: calc(var(--k) * 4); right: calc(var(--k) * 4); top: calc(var(--k) * 164); height: calc(var(--k) * 40); box-sizing: border-box; display: flex; align-items: center; gap: calc(var(--k) * 4); padding: 0 calc(var(--k) * 4) 0 calc(var(--k) * 6); overflow: hidden;
  background: #f8f8f8; box-shadow: inset 0 0 0 var(--k) #606068, inset 0 0 0 calc(var(--k) * 2) #e0e0e8; color: #505050; text-shadow: var(--k) 0 0 #c8c8d0, 0 var(--k) 0 #c8c8d0; }
:root.bw[data-frame] .ds.dxn .dxn-msg { border-style: solid; border-width: calc(var(--k) * 8); border-image: var(--gframe) 16 fill / calc(var(--k) * 8) stretch; image-rendering: pixelated; background: none; box-shadow: none; padding: 0 calc(var(--k) * 2); }
:root.bw .ds.dxn .dxn-msg span { flex: 1; min-width: 0; overflow: hidden; font-size: calc(var(--k) * 10 * var(--fz, 1)) !important; line-height: calc(var(--k) * 12) !important; }
:root.bw .ds.dxn .dxn-msg span b { color: #208878; font-weight: 400; font-size: inherit !important; }
:root.bw .ds.dxn .dxn-go { position: static; flex: none; height: calc(var(--k) * 16); padding: 0 calc(var(--k) * 5) !important; background: #2a8a7a !important; box-shadow: inset 0 0 0 var(--k) #103830 !important; color: #f8f8f8 !important; font-size: calc(var(--k) * 10 * var(--fz, 1)) !important; line-height: calc(var(--k) * 16) !important; text-shadow: var(--k) var(--k) 0 #103830; white-space: nowrap; }
:root.bw .ds.dxn .dxn-go:is(:hover, :focus-visible) { background: #38a898 !important; outline: var(--k) solid #f8a030 !important; animation: none; }
/* A milestone: a gold ribbon over the picture; every 100, light rays behind it too, and a gold edge. */
:root.bw .ds.dxn .dxn-ribbon { left: calc(var(--k) * 32); top: calc(var(--k) * 19); z-index: 3; width: calc(var(--k) * 82); padding: calc(var(--k) * 2) 0; display: grid; justify-items: center; background: linear-gradient(#f8e078, #e8a820); box-shadow: 0 0 0 var(--k) #684808, 0 calc(var(--k) * 2) 0 calc(var(--k) * 1) rgba(0, 0, 0, .35); color: #483000; text-shadow: var(--k) var(--k) 0 #f8f0c0; animation: dxnribbon .6s cubic-bezier(.3, 1.6, .5, 1) .3s both; }
:root.bw .ds.dxn .dxn-ribbon b { font-weight: 400; font-size: calc(var(--k) * 12 * var(--fz, 1)) !important; line-height: calc(var(--k) * 14) !important; white-space: nowrap; }
:root.bw .ds.dxn .dxn-ribbon span { font-size: calc(var(--k) * 8 * var(--fz, 1)) !important; line-height: calc(var(--k) * 10) !important; white-space: nowrap; }
@keyframes dxnribbon { from { transform: scale(0) rotate(-8deg); } }
:root.bw .ds.dxn .dxn-rays { left: 0; top: calc(var(--k) * 16); width: calc(var(--k) * 130); height: calc(var(--k) * 105); overflow: hidden; pointer-events: none; }
:root.bw .ds.dxn .dxn-rays::before { content: ""; position: absolute; left: 50%; top: 65%; width: 300%; aspect-ratio: 1; translate: -50% -50%; background: repeating-conic-gradient(rgba(248, 224, 120, .55) 0 10deg, transparent 10deg 20deg); animation: dxnspin 6s linear infinite; }
@keyframes dxnspin { to { rotate: 360deg; } }
:root.bw .ds.dxn.mile-big { box-shadow: 0 0 0 var(--k) #000, 0 0 0 calc(var(--k) * 2) #e8a820, 0 0 0 calc(var(--k) * 3) #000, 0 0 calc(var(--k) * 24) rgba(248, 208, 64, .6); }
:root.bw .ds.dxn.mile-big .ga-dtitle span { color: #f8e078; }
/* Calm animations: the game's option (app.css stops every animation then) and the computer's own setting. */
:root[data-motion="calm"] .ds.dxn, :root[data-motion="calm"] .ds.dxn *, :root[data-motion="calm"] .ds.dxn .dxn-rays::before { animation: none !important; }
@media (prefers-reduced-motion: reduce) { :root.bw .ds.dxn, :root.bw .ds.dxn .dxn-ribbon, :root.bw .ds.dxn .dxn-rays::before, :root.bw .ds.dxn .dxn-new { animation: none; } }
/* BUY's second press: "OK? ₽2,000", red-edged like the games' confirm. */
:root.bw .ds.ga-mart .ga-buy.sure { background: #f87070 !important; color: #fff !important; box-shadow: inset 0 0 0 var(--k) #601010, inset 0 0 0 calc(var(--k) * 2) #f8c0c0 !important; }