/* PacketUP HUB — бренды товаров: цвета обложек (.bc-<ключ>) и знак бренда (.bm, из brands.go).
   Обложка с брендом заменяет хэш-градиент .cv-*; без бренда остаётся он. Работает и в кабинете, и на лендинге. */

.bm { width: 24px; height: 24px; flex: none; fill: currentColor; }

/* Обложка товара в кабинете: знак справа внизу, на квадратных миниатюрах — по центру */
.cover > .bm { position: absolute; right: 12px; bottom: 12px; width: 34px; height: 34px; z-index: 1;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,.3)); }
.cover.sm > .bm { width: 26px; height: 26px; right: 10px; bottom: 10px; }
.cover.icon > .bm, .thumb > .bm { position: absolute; inset: 0; margin: auto; width: 58%; height: 58%; }
.thumb.bc { position: relative; overflow: hidden; }
.cover.icon::after { display: none; }

/* Плитка-карточка на иллюстрациях: знак сверху, бренд и номинал снизу */
.bc { color: #fff; }
.cat .tiles .bc, .lp-hero .lp-tiles .bc { flex-direction: column; align-items: flex-start; justify-content: space-between; position: relative; overflow: hidden; }
.cat .tiles .bc::before, .lp-hero .lp-tiles .bc::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(125deg, rgba(255,255,255,.22), transparent 38%); }
.tiles .bc .bm { width: 22px; height: 22px; }
.lp-tiles .bc .bm { width: 30px; height: 30px; }
.bc-l { display: flex; flex-direction: column; gap: 3px; font-style: normal; position: relative; }
.bc-l small { font: 600 8px/1.1 var(--font-ui); letter-spacing: .06em; text-transform: uppercase; opacity: .78; white-space: nowrap; }
.lp-tiles .bc-l small { font-size: 9.5px; }
.bc-l b { font: inherit; white-space: nowrap; }

.bc-steam { background: radial-gradient(circle at 82% 12%, rgba(102,192,244,.6) 0, transparent 52%), linear-gradient(150deg, #1B2838, #2A475E); }
.bc-playstation { background: radial-gradient(circle at 80% 15%, #3EA6FF 0, transparent 50%), linear-gradient(150deg, #00439C, #0070D1); }
.bc-apple { color: #F5F5F7; background: radial-gradient(circle at 78% 14%, rgba(255,255,255,.28) 0, transparent 48%), linear-gradient(150deg, #3A3A3E, #0E0E10); }
.bc-googleplay { background: radial-gradient(circle at 80% 14%, rgba(66,133,244,.45) 0, transparent 50%), radial-gradient(circle at 10% 95%, rgba(52,168,83,.35) 0, transparent 45%), linear-gradient(150deg, #23272F, #12151B); }
.bc-nintendo { background: radial-gradient(circle at 80% 14%, rgba(255,255,255,.25) 0, transparent 48%), linear-gradient(150deg, #FF2D3A, #C4000F); }
.bc-razer { color: #44D62C; background: radial-gradient(circle at 80% 16%, rgba(68,214,44,.4) 0, transparent 50%), linear-gradient(150deg, #1B1F1B, #050605); }
.bc-razer .bc-l, .cover.bc-razer { color: #fff; }
.bc-roblox { background: radial-gradient(circle at 80% 14%, rgba(255,255,255,.22) 0, transparent 48%), linear-gradient(150deg, #393B3D, #111214); }
.bc-valorant { background: radial-gradient(circle at 80% 14%, rgba(255,255,255,.25) 0, transparent 46%), linear-gradient(150deg, #FF4655, #A8222F); }
.bc-pubg { color: #1A1205; text-shadow: none; background: radial-gradient(circle at 80% 14%, rgba(255,255,255,.45) 0, transparent 48%), linear-gradient(150deg, #FFC02E, #D98A00); }
.cover.bc-pubg::after { background: linear-gradient(180deg, transparent 50%, rgba(80,40,0,.25)); }
.bc-mlbb { color: #FFD36A; background: radial-gradient(circle at 80% 14%, rgba(255,201,60,.45) 0, transparent 48%), linear-gradient(150deg, #1F4FBF, #0B2160); }
.bc-mlbb .bc-l, .cover.bc-mlbb { color: #fff; }
.bc-genshin { color: #EAF6FF; background: radial-gradient(circle at 80% 14%, rgba(159,227,255,.55) 0, transparent 50%), linear-gradient(150deg, #3E5FA8, #1A2648); }
.bc-freefire { background: radial-gradient(circle at 80% 14%, rgba(255,214,90,.5) 0, transparent 48%), linear-gradient(150deg, #FF7A00, #C4001A); }
.bc-xbox { background: radial-gradient(circle at 80% 14%, rgba(255,255,255,.25) 0, transparent 48%), linear-gradient(150deg, #1DB31D, #0B5D0B); }
