/* Zarba — Front dvigateli uslubi (/front/style.css) ustidan faqat brend: logotip, guruh ranglari (Lochin — ko'k, Qoplon — to'q sariq), yuklash chizig'i.
   Sahifa tuzilmasi va HUD — /front/ui.js va /front/style.css (nusxalanmaydi). --brand — to'plamdan (packs/modern.js brand.accent, app.js qo'yadi). */
body.zarba { --z0: #7db6ec; --z1: #eda54d; }
body.zarba .brand .logo { font-weight: 900; letter-spacing: .22em; font-size: clamp(54px, 8.4vw, 98px); }
body.zarba .brand .logo::after { width: 86px; height: 5px; border-radius: 1px; transform: skewX(-24deg); background: linear-gradient(90deg, var(--z1) 0 50%, var(--z0) 50% 100%); }
body.zarba .t0 i { background: var(--z0); } body.zarba .t1 i { background: var(--z1); }
body.zarba #load u { background: var(--brand); }
body.zarba .rankc { border-radius: 14px; }
body.zarba #score .mine i { background: var(--tc-me, var(--z0)); } body.zarba #score .foe i { background: var(--tc-foe, var(--z1)); }
/* menyu fonida shahar: chap tomon biroz quyuqroq (matn o'qilishi) */
body.zarba[data-screen="menu"] #shade { background: linear-gradient(90deg, rgba(7,9,12,.82) 0%, rgba(7,9,12,.5) 40%, rgba(7,9,12,.06) 74%), radial-gradient(120% 100% at 62% 40%, transparent 48%, rgba(7,9,12,.5) 100%); }
:root[data-theme="light"] body.zarba[data-screen="menu"] #shade { background: linear-gradient(90deg, rgba(244,245,248,.86) 0%, rgba(244,245,248,.55) 42%, rgba(244,245,248,.05) 76%), radial-gradient(120% 100% at 60% 40%, transparent 55%, rgba(30,26,20,.22) 100%); }
@media (max-width: 560px) and (orientation: portrait) {
  body.zarba .brand .logo { font-size: 58px; }
  body.zarba[data-screen="menu"] #shade { background: linear-gradient(0deg, rgba(7,9,12,.88) 0%, rgba(7,9,12,.56) 45%, rgba(7,9,12,.14) 100%); }
}
/* «Bomba» sotib olish menyusi telefonda (yotiq ekran, balandligi ≤ 430 px): oltita bo'lim bitta qatorda, har narsa — ixcham kartochka (rasm, nom,
   narx). Hammasi aylantirmasdan bir ekranda ko'rinadi: jilet va granatalar ham (Front uslubida ular ikkinchi qatorda — pastda qolib ketardi) */
@media (max-height: 430px) {
  body.zarba #buy .bx { width: calc(100% - 16px); max-height: calc(100% - 12px); padding: 8px 10px 8px; gap: 6px; }
  body.zarba #buy .bh b { font-size: 17px; } body.zarba #buyMoney { font-size: 18px; }
  body.zarba #buy .bc { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px 7px; }
  body.zarba #buy h4 { font-size: 9.5px; letter-spacing: .02em; margin-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  body.zarba #buy .bl { gap: 5px; }
  body.zarba #buy .bi { grid-template-columns: 1fr; justify-items: center; text-align: center; min-height: 0; padding: 4px 4px 5px; gap: 1px; border-radius: 10px; }
  body.zarba #buy .bi .ic svg { width: 52px; height: 17px; }
  body.zarba #buy .bi .nm { font-size: 11px; line-height: 1.12; font-weight: 650; overflow-wrap: anywhere; }
  body.zarba #buy .bi b { grid-column: 1; font-size: 12px; }
}