/* Final stability layer. Loaded last on purpose.
   It owns only the fragile cross-screen fixes: shop/profile backgrounds,
   glass cards, and shared readable typography. */

:root{
  --app-text-sm:13px;
  --app-text:14px;
  --app-title:17px;
  --app-title-lg:18px;
  --app-line:1.48;
}

.phone.screen-shop-bg,
.phone.screen-profile-bg{
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(120% 60% at 50% -6%, rgba(111,198,238,.10), transparent 60%),
    linear-gradient(180deg, #0a1828, #060e18 60%) !important;
}

.phone.screen-shop-bg::before,
.phone.screen-profile-bg::before{
  background-image:
    radial-gradient(1px 1px at 20% 18%, rgba(207,227,240,.68) 60%, transparent),
    radial-gradient(1px 1px at 70% 12%, rgba(207,227,240,.62) 60%, transparent),
    radial-gradient(1.4px 1.4px at 42% 30%, rgba(234,244,251,.68) 60%, transparent),
    radial-gradient(1px 1px at 85% 38%, rgba(207,227,240,.60) 60%, transparent),
    radial-gradient(1px 1px at 32% 52%, rgba(185,214,232,.58) 60%, transparent),
    radial-gradient(1px 1px at 60% 60%, rgba(207,227,240,.60) 60%, transparent) !important;
  background-attachment:initial !important;
  filter:none !important;
  opacity:.48 !important;
}

.phone.screen-shop-bg .screen-fixed-bg,
.phone.screen-profile-bg .screen-fixed-bg{
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  opacity:1 !important;
  pointer-events:none !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center top !important;
  background-attachment:initial !important;
  filter:blur(7px) brightness(.92) !important;
  transform:scale(1.045) translateZ(0) !important;
  will-change:auto !important;
}

.phone.screen-shop-bg .screen-fixed-bg{
  background-image:
    linear-gradient(180deg,rgba(5,11,20,.38),rgba(5,11,20,.70) 48%,rgba(5,11,20,.94)),
    url('public/universe/shop/shop-bg.webp?v=49') !important;
}

.phone.screen-profile-bg .screen-fixed-bg{
  background-image:
    linear-gradient(180deg,rgba(5,11,20,.36),rgba(5,11,20,.68) 48%,rgba(5,11,20,.94)),
    url('public/universe/profile-bg.webp?v=59') !important;
}

.phone.screen-shop-bg #scr-shop,
.phone.screen-profile-bg #scr-profile,
.phone.screen-shop-bg .shop-content,
.phone.screen-profile-bg .profile-content,
.phone.screen-profile-bg .profile-hero2,
body.tg-webapp .phone.screen-shop-bg #scr-shop,
body.tg-webapp .phone.screen-profile-bg #scr-profile,
body.phone-scaled .phone.screen-shop-bg #scr-shop,
body.phone-scaled .phone.screen-profile-bg #scr-profile{
  background:none !important;
  background-image:none !important;
  background-color:transparent !important;
  background-attachment:initial !important;
}

.phone.screen-shop-bg .shop-bg,
.phone.screen-profile-bg .profile-bg{
  display:none !important;
  background:none !important;
  background-image:none !important;
}

.phone.screen-shop-bg .scroll,
.phone.screen-profile-bg .scroll{
  background:transparent !important;
}

.phone.screen-shop-bg .shop-card,
.phone.screen-profile-bg .streak2,
.phone.screen-profile-bg .next-card,
.phone.screen-profile-bg .chat-card,
.phone.screen-profile-bg .card,
.phone.screen-shop-bg .card.shop-card,
.phone.screen-shop-bg .topbar,
.phone.screen-profile-bg .topbar,
.phone.screen-shop-bg .nav,
.phone.screen-profile-bg .nav{
  background:
    linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,255,255,.055)) !important;
  border-color:rgba(225,238,247,.22) !important;
  -webkit-backdrop-filter:blur(24px) saturate(155%) !important;
  backdrop-filter:blur(24px) saturate(155%) !important;
  box-shadow:
    0 16px 42px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(255,255,255,.04) !important;
}

body.tg-desktop .phone.screen-shop-bg .shop-card,
body.tg-desktop .phone.screen-profile-bg .streak2,
body.tg-desktop .phone.screen-profile-bg .next-card,
body.tg-desktop .phone.screen-profile-bg .chat-card,
body.tg-desktop .phone.screen-profile-bg .card,
body.tg-desktop .phone.screen-shop-bg .card.shop-card,
body.tg-desktop .phone.screen-shop-bg .topbar,
body.tg-desktop .phone.screen-profile-bg .topbar,
body.tg-desktop .phone.screen-shop-bg .nav,
body.tg-desktop .phone.screen-profile-bg .nav{
  background:
    linear-gradient(180deg,rgba(18,36,56,.82),rgba(8,18,31,.72)) !important;
  -webkit-backdrop-filter:blur(0px) !important;
  backdrop-filter:blur(0px) !important;
}

.phone .shop-card .muted,
.phone .shop-card p,
.phone .streak2-sub,
.phone .next-text,
.phone .chat-meta small,
.phone .acad-card-sub,
.phone .acad-card-desc,
.phone .trenazal-desc,
.phone .ch-desc,
.phone .ch-cur-text,
.phone .drill-card2 .drill-sit,
.phone .cmod-sub,
.phone .cmod-lrow,
.phone .omod-sub,
.phone .omod-meta,
.phone .lib2-desc{
  font-family:var(--sans) !important;
  font-size:var(--app-text) !important;
  line-height:var(--app-line) !important;
  letter-spacing:0 !important;
}

.phone .acad-card-title,
.phone .chat-meta b,
.phone .cmod-title,
.phone .drill-card2 .drill-name,
.phone .lib2-title{
  font-family:var(--sans) !important;
  font-size:var(--app-title) !important;
  line-height:1.24 !important;
  font-weight:800 !important;
  letter-spacing:0 !important;
}

.phone .streak2-title,
.phone .section-title,
.phone .profile-section-title,
.phone .next-label{
  font-family:var(--sans) !important;
  font-size:var(--app-text-sm) !important;
  line-height:1.25 !important;
  font-weight:800 !important;
  letter-spacing:.8px !important;
}

.phone .acad-title,
.phone .trenazal-title,
.phone .ch-title{
  font-size:24px !important;
  line-height:1.12 !important;
}

.phone .acad-desc{
  font-size:var(--app-text) !important;
  line-height:var(--app-line) !important;
}

.phone .acad-card2{
  gap:15px !important;
  padding:16px !important;
}

.phone .acad-thumb{
  flex-basis:90px !important;
  width:90px !important;
}

.phone .acad-btn{
  font-size:14px !important;
  line-height:1.18 !important;
  padding:8px 14px !important;
}

/* v2: strongest overrides for Telegram/web scaled mode. The older mobile block
   used body.tg-webapp.phone-scaled selectors, so these must match that weight. */
body.screen-shop-bg,
body.screen-profile-bg{
  background:#060e18 !important;
  overflow:hidden !important;
}

body.screen-shop-bg .phone,
body.screen-profile-bg .phone,
body.tg-webapp.phone-scaled.screen-shop-bg .phone,
body.tg-webapp.phone-scaled.screen-profile-bg .phone{
  isolation:isolate !important;
  background:#060e18 !important;
  overflow:hidden !important;
}

body.screen-shop-bg .phone .screen-fixed-bg,
body.screen-profile-bg .phone .screen-fixed-bg,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .screen-fixed-bg,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .screen-fixed-bg{
  position:fixed !important;
  left:0 !important;
  right:0 !important;
  top:0 !important;
  bottom:0 !important;
  width:100vw !important;
  height:100vh !important;
  height:100dvh !important;
  z-index:0 !important;
  pointer-events:none !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center top !important;
  background-attachment:fixed !important;
  filter:blur(8px) brightness(.9) !important;
  transform:scale(1.05) translateZ(0) !important;
  opacity:1 !important;
}

body.screen-shop-bg .phone .screen-fixed-bg,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .screen-fixed-bg{
  background-image:linear-gradient(180deg,rgba(5,11,20,.42),rgba(5,11,20,.72) 50%,rgba(5,11,20,.96)),url('public/universe/shop/shop-bg.webp?v=49') !important;
}

body.screen-profile-bg .phone .screen-fixed-bg,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .screen-fixed-bg{
  background-image:linear-gradient(180deg,rgba(5,11,20,.42),rgba(5,11,20,.72) 50%,rgba(5,11,20,.96)),url('public/universe/profile-bg.webp?v=59') !important;
}

body.screen-shop-bg .phone .scroll,
body.screen-profile-bg .phone .scroll,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .scroll,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .scroll{
  position:relative !important;
  z-index:1 !important;
  background:transparent !important;
}

body.screen-shop-bg .phone #scr-shop,
body.screen-profile-bg .phone #scr-profile,
body.screen-shop-bg .phone .shop-content,
body.screen-profile-bg .phone .profile-content,
body.tg-webapp.phone-scaled.screen-shop-bg .phone #scr-shop,
body.tg-webapp.phone-scaled.screen-profile-bg .phone #scr-profile,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-content,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-content{
  background:none !important;
  background-image:none !important;
  background-color:transparent !important;
}

body.screen-shop-bg .phone .shop-bg,
body.screen-profile-bg .phone .profile-bg,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-bg,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-bg,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-bg::before,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-bg::after,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-bg::before,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-bg::after{
  display:none !important;
  content:none !important;
  background:none !important;
  background-image:none !important;
}

body.screen-shop-bg .phone .shop-card,
body.screen-profile-bg .phone .streak2,
body.screen-profile-bg .phone .next-card,
body.screen-profile-bg .phone .chat-card,
body.screen-profile-bg .phone .card,
body.screen-shop-bg .phone .card.shop-card,
body.screen-shop-bg .phone .topbar,
body.screen-profile-bg .phone .topbar,
body.screen-shop-bg .phone .nav,
body.screen-profile-bg .phone .nav,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-card,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .streak2,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .next-card,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .chat-card,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .card,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .card.shop-card,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .topbar,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .topbar,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .nav,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .nav{
  background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.065)) !important;
  border-color:rgba(225,238,247,.24) !important;
  -webkit-backdrop-filter:blur(26px) saturate(160%) !important;
  backdrop-filter:blur(26px) saturate(160%) !important;
  box-shadow:0 16px 42px rgba(0,0,0,.40),inset 0 1px 0 rgba(255,255,255,.18),inset 0 -1px 0 rgba(255,255,255,.05) !important;
}

body.tg-desktop.screen-shop-bg .phone .shop-card,
body.tg-desktop.screen-profile-bg .phone .streak2,
body.tg-desktop.screen-profile-bg .phone .next-card,
body.tg-desktop.screen-profile-bg .phone .chat-card,
body.tg-desktop.screen-profile-bg .phone .card,
body.tg-desktop.screen-shop-bg .phone .card.shop-card,
body.tg-desktop.screen-shop-bg .phone .topbar,
body.tg-desktop.screen-profile-bg .phone .topbar,
body.tg-desktop.screen-shop-bg .phone .nav,
body.tg-desktop.screen-profile-bg .phone .nav{
  background:linear-gradient(180deg,rgba(18,36,56,.86),rgba(8,18,31,.76)) !important;
  -webkit-backdrop-filter:blur(0) !important;
  backdrop-filter:blur(0) !important;
}

body.phone-scaled .phone .shop-card .muted,
body.phone-scaled .phone .shop-card p,
body.phone-scaled .phone .streak2-sub,
body.phone-scaled .phone .next-text,
body.phone-scaled .phone .chat-meta small,
body.phone-scaled .phone .acad-card-sub,
body.phone-scaled .phone .acad-card-desc,
body.phone-scaled .phone .trenazal-desc,
body.phone-scaled .phone .ch-desc,
body.phone-scaled .phone .ch-cur-text,
body.phone-scaled .phone .drill-card2 .drill-sit,
body.phone-scaled .phone .cmod-sub,
body.phone-scaled .phone .cmod-lrow,
body.phone-scaled .phone .omod-sub,
body.phone-scaled .phone .omod-meta,
body.phone-scaled .phone .lib2-desc,
body.tg-webapp.phone-scaled .phone .shop-card .muted,
body.tg-webapp.phone-scaled .phone .shop-card p,
body.tg-webapp.phone-scaled .phone .streak2-sub,
body.tg-webapp.phone-scaled .phone .next-text,
body.tg-webapp.phone-scaled .phone .chat-meta small,
body.tg-webapp.phone-scaled .phone .acad-card-sub,
body.tg-webapp.phone-scaled .phone .acad-card-desc,
body.tg-webapp.phone-scaled .phone .trenazal-desc,
body.tg-webapp.phone-scaled .phone .ch-desc,
body.tg-webapp.phone-scaled .phone .ch-cur-text,
body.tg-webapp.phone-scaled .phone .drill-card2 .drill-sit,
body.tg-webapp.phone-scaled .phone .cmod-sub,
body.tg-webapp.phone-scaled .phone .cmod-lrow,
body.tg-webapp.phone-scaled .phone .omod-sub,
body.tg-webapp.phone-scaled .phone .omod-meta,
body.tg-webapp.phone-scaled .phone .lib2-desc{
  font-size:14px !important;
  line-height:1.48 !important;
  letter-spacing:0 !important;
}

body.phone-scaled .phone .acad-card-title,
body.phone-scaled .phone .chat-meta b,
body.phone-scaled .phone .cmod-title,
body.phone-scaled .phone .drill-card2 .drill-name,
body.phone-scaled .phone .lib2-title,
body.tg-webapp.phone-scaled .phone .acad-card-title,
body.tg-webapp.phone-scaled .phone .chat-meta b,
body.tg-webapp.phone-scaled .phone .cmod-title,
body.tg-webapp.phone-scaled .phone .drill-card2 .drill-name,
body.tg-webapp.phone-scaled .phone .lib2-title{
  font-size:17px !important;
  line-height:1.24 !important;
  font-weight:800 !important;
  letter-spacing:0 !important;
}

/* v3: same strong fixes without relying on the new body screen classes. */
body.tg-webapp.phone-scaled .phone.screen-shop-bg .screen-fixed-bg,
body.tg-webapp.phone-scaled .phone.screen-profile-bg .screen-fixed-bg,
body.phone-scaled .phone.screen-shop-bg .screen-fixed-bg,
body.phone-scaled .phone.screen-profile-bg .screen-fixed-bg,
.phone.screen-shop-bg .screen-fixed-bg,
.phone.screen-profile-bg .screen-fixed-bg{
  position:fixed !important;
  left:0 !important;
  right:0 !important;
  top:0 !important;
  bottom:0 !important;
  width:100vw !important;
  height:100vh !important;
  height:100dvh !important;
  background-attachment:fixed !important;
  transform:scale(1.05) translateZ(0) !important;
  z-index:0 !important;
}

body.tg-webapp.phone-scaled .phone.screen-shop-bg .screen-fixed-bg,
body.phone-scaled .phone.screen-shop-bg .screen-fixed-bg,
.phone.screen-shop-bg .screen-fixed-bg{
  background-image:linear-gradient(180deg,rgba(5,11,20,.42),rgba(5,11,20,.72) 50%,rgba(5,11,20,.96)),url('public/universe/shop/shop-bg.webp?v=49') !important;
}

body.tg-webapp.phone-scaled .phone.screen-profile-bg .screen-fixed-bg,
body.phone-scaled .phone.screen-profile-bg .screen-fixed-bg,
.phone.screen-profile-bg .screen-fixed-bg{
  background-image:linear-gradient(180deg,rgba(5,11,20,.42),rgba(5,11,20,.72) 50%,rgba(5,11,20,.96)),url('public/universe/profile-bg.webp?v=59') !important;
}

body.tg-webapp.phone-scaled .phone.screen-shop-bg .shop-bg,
body.tg-webapp.phone-scaled .phone.screen-profile-bg .profile-bg,
body.phone-scaled .phone.screen-shop-bg .shop-bg,
body.phone-scaled .phone.screen-profile-bg .profile-bg,
.phone.screen-shop-bg .shop-bg,
.phone.screen-profile-bg .profile-bg{
  display:none !important;
}

body.tg-webapp.phone-scaled .phone.screen-shop-bg .shop-card,
body.tg-webapp.phone-scaled .phone.screen-profile-bg .streak2,
body.tg-webapp.phone-scaled .phone.screen-profile-bg .next-card,
body.tg-webapp.phone-scaled .phone.screen-profile-bg .chat-card,
body.tg-webapp.phone-scaled .phone.screen-profile-bg .card,
body.tg-webapp.phone-scaled .phone.screen-shop-bg .nav,
body.tg-webapp.phone-scaled .phone.screen-profile-bg .nav,
body.phone-scaled .phone.screen-shop-bg .shop-card,
body.phone-scaled .phone.screen-profile-bg .streak2,
body.phone-scaled .phone.screen-profile-bg .next-card,
body.phone-scaled .phone.screen-profile-bg .chat-card,
body.phone-scaled .phone.screen-profile-bg .card,
body.phone-scaled .phone.screen-shop-bg .nav,
body.phone-scaled .phone.screen-profile-bg .nav{
  background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.065)) !important;
  border-color:rgba(225,238,247,.24) !important;
  -webkit-backdrop-filter:blur(26px) saturate(160%) !important;
  backdrop-filter:blur(26px) saturate(160%) !important;
}

/* v4: the shop/profile picture lives on the viewport, never inside the
   scrolling screen. This neutralizes older screen-level background rules. */
body.screen-shop-bg,
body.screen-profile-bg,
body.tg-webapp.screen-shop-bg,
body.tg-webapp.screen-profile-bg,
body.phone-scaled.screen-shop-bg,
body.phone-scaled.screen-profile-bg{
  background:#06101d !important;
  overflow:hidden !important;
}

body.screen-shop-bg::before,
body.screen-profile-bg::before{
  content:"" !important;
  position:fixed !important;
  inset:-18px !important;
  z-index:0 !important;
  pointer-events:none !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center top !important;
  filter:blur(8px) brightness(.9) !important;
  transform:scale(1.045) translateZ(0) !important;
  opacity:1 !important;
  will-change:auto !important;
}

body.screen-shop-bg::before{
  background-image:
    linear-gradient(180deg,rgba(5,11,20,.42),rgba(5,11,20,.72) 50%,rgba(5,11,20,.96)),
    url('public/universe/shop/shop-bg.webp?v=49') !important;
}

body.screen-profile-bg::before{
  background-image:
    linear-gradient(180deg,rgba(5,11,20,.42),rgba(5,11,20,.72) 50%,rgba(5,11,20,.96)),
    url('public/universe/profile-bg.webp?v=59') !important;
}

body.screen-shop-bg .phone,
body.screen-profile-bg .phone,
body.tg-webapp.screen-shop-bg .phone,
body.tg-webapp.screen-profile-bg .phone,
body.phone-scaled.screen-shop-bg .phone,
body.phone-scaled.screen-profile-bg .phone{
  position:relative !important;
  z-index:1 !important;
  isolation:isolate !important;
  background:transparent !important;
  overflow:hidden !important;
}

body.screen-shop-bg .phone::before,
body.screen-profile-bg .phone::before,
body.screen-shop-bg .phone .screen-fixed-bg,
body.screen-profile-bg .phone .screen-fixed-bg{
  background-image:
    radial-gradient(1px 1px at 20% 18%, rgba(207,227,240,.68) 60%, transparent),
    radial-gradient(1px 1px at 70% 12%, rgba(207,227,240,.62) 60%, transparent),
    radial-gradient(1.4px 1.4px at 42% 30%, rgba(234,244,251,.68) 60%, transparent),
    radial-gradient(1px 1px at 85% 38%, rgba(207,227,240,.60) 60%, transparent),
    radial-gradient(1px 1px at 32% 52%, rgba(185,214,232,.58) 60%, transparent),
    radial-gradient(1px 1px at 60% 60%, rgba(207,227,240,.60) 60%, transparent) !important;
  background-color:transparent !important;
  filter:none !important;
}

body.screen-shop-bg .phone .screen-fixed-bg,
body.screen-profile-bg .phone .screen-fixed-bg{
  position:absolute !important;
  inset:0 !important;
  width:auto !important;
  height:auto !important;
  z-index:0 !important;
  transform:none !important;
  opacity:.46 !important;
}

body.screen-shop-bg .phone .scroll,
body.screen-profile-bg .phone .scroll,
body.screen-shop-bg .phone #scr-shop,
body.screen-profile-bg .phone #scr-profile,
body.screen-shop-bg .phone .shop-content,
body.screen-profile-bg .phone .profile-content,
body.screen-profile-bg .phone .profile-hero2,
body.tg-webapp .phone.screen-shop-bg #scr-shop,
body.tg-webapp .phone.screen-profile-bg #scr-profile,
body.phone-scaled .phone.screen-shop-bg #scr-shop,
body.phone-scaled .phone.screen-profile-bg #scr-profile{
  background:none !important;
  background-image:none !important;
  background-color:transparent !important;
  background-attachment:initial !important;
}

body.screen-shop-bg .phone #scr-shop *,
body.screen-profile-bg .phone #scr-profile *{
  background-attachment:initial !important;
}

/* v5: keep the fixed picture inside the app frame. The v4 body-wide layer
   made Telegram show the background outside the old composition. */
body.screen-shop-bg::before,
body.screen-profile-bg::before{
  content:none !important;
  display:none !important;
  background:none !important;
  background-image:none !important;
}

body.screen-shop-bg .phone,
body.screen-profile-bg .phone,
body.tg-webapp.screen-shop-bg .phone,
body.tg-webapp.screen-profile-bg .phone,
body.phone-scaled.screen-shop-bg .phone,
body.phone-scaled.screen-profile-bg .phone{
  background:
    radial-gradient(120% 60% at 50% -6%, rgba(111,198,238,.10), transparent 60%),
    linear-gradient(180deg,#0a1828,#060e18 60%) !important;
}

body.screen-shop-bg .phone .screen-fixed-bg,
body.screen-profile-bg .phone .screen-fixed-bg,
body.tg-webapp.screen-shop-bg .phone .screen-fixed-bg,
body.tg-webapp.screen-profile-bg .phone .screen-fixed-bg,
body.phone-scaled.screen-shop-bg .phone .screen-fixed-bg,
body.phone-scaled.screen-profile-bg .phone .screen-fixed-bg{
  position:absolute !important;
  inset:-18px !important;
  width:auto !important;
  height:auto !important;
  z-index:0 !important;
  pointer-events:none !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center top !important;
  filter:blur(7px) brightness(.92) !important;
  transform:none !important;
  opacity:1 !important;
  will-change:auto !important;
}

body.screen-shop-bg .phone .screen-fixed-bg,
body.tg-webapp.screen-shop-bg .phone .screen-fixed-bg,
body.phone-scaled.screen-shop-bg .phone .screen-fixed-bg{
  background-image:
    linear-gradient(180deg,rgba(5,11,20,.38),rgba(5,11,20,.70) 48%,rgba(5,11,20,.94)),
    url('public/universe/shop/shop-bg.webp?v=49') !important;
}

body.screen-profile-bg .phone .screen-fixed-bg,
body.tg-webapp.screen-profile-bg .phone .screen-fixed-bg,
body.phone-scaled.screen-profile-bg .phone .screen-fixed-bg{
  background-image:
    linear-gradient(180deg,rgba(5,11,20,.36),rgba(5,11,20,.68) 48%,rgba(5,11,20,.94)),
    url('public/universe/profile-bg.webp?v=59') !important;
}

body.screen-shop-bg .phone .scroll,
body.screen-profile-bg .phone .scroll{
  position:relative !important;
  z-index:1 !important;
  background:transparent !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone.screen-shop-bg .screen-fixed-bg,
body.tg-webapp.phone-scaled.screen-profile-bg .phone.screen-profile-bg .screen-fixed-bg,
body.phone-scaled.screen-shop-bg .phone.screen-shop-bg .screen-fixed-bg,
body.phone-scaled.screen-profile-bg .phone.screen-profile-bg .screen-fixed-bg{
  position:absolute !important;
  inset:-18px !important;
  width:auto !important;
  height:auto !important;
  transform:none !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone.screen-shop-bg .screen-fixed-bg,
body.phone-scaled.screen-shop-bg .phone.screen-shop-bg .screen-fixed-bg{
  background-image:
    linear-gradient(180deg,rgba(5,11,20,.38),rgba(5,11,20,.70) 48%,rgba(5,11,20,.94)),
    url('public/universe/shop/shop-bg.webp?v=49') !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone.screen-profile-bg .screen-fixed-bg,
body.phone-scaled.screen-profile-bg .phone.screen-profile-bg .screen-fixed-bg{
  background-image:
    linear-gradient(180deg,rgba(5,11,20,.36),rgba(5,11,20,.68) 48%,rgba(5,11,20,.94)),
    url('public/universe/profile-bg.webp?v=59') !important;
}

/* v6: shop/profile must be true Telegram fullscreen, like the mascot screen.
   The old 432px phone scene was still being centered/scaled on these tabs. */
body.tg-webapp.phone-scaled.screen-shop-bg,
body.tg-webapp.phone-scaled.screen-profile-bg{
  width:100vw !important;
  min-width:100vw !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone,
body.tg-webapp.phone-scaled.screen-profile-bg .phone{
  left:0 !important;
  right:0 !important;
  top:0 !important;
  width:100vw !important;
  max-width:none !important;
  height:var(--tg-viewport-height, 100vh) !important;
  min-height:var(--tg-viewport-height, 100vh) !important;
  max-height:none !important;
  transform:none !important;
  transform-origin:top left !important;
  border-radius:0 !important;
  border:0 !important;
  box-shadow:none !important;
  overflow:hidden !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .scroll,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .scroll,
body.tg-webapp.phone-scaled.screen-shop-bg .phone #scr-shop,
body.tg-webapp.phone-scaled.screen-profile-bg .phone #scr-profile{
  width:100vw !important;
  max-width:none !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .screen-fixed-bg,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .screen-fixed-bg{
  left:-18px !important;
  right:-18px !important;
  top:-18px !important;
  bottom:-18px !important;
  width:auto !important;
  height:auto !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .nav,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .nav{
  left:0 !important;
  right:0 !important;
  width:100vw !important;
  max-width:none !important;
  border-radius:0 !important;
  background:linear-gradient(180deg,rgba(10,22,36,.46),rgba(5,11,20,.88)) !important;
  -webkit-backdrop-filter:blur(18px) saturate(145%) !important;
  backdrop-filter:blur(18px) saturate(145%) !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-content{
  width:100% !important;
  padding-left:10px !important;
  padding-right:10px !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-content{
  width:100% !important;
  padding-left:10px !important;
  padding-right:10px !important;
}

/* v7: shop/profile keep the fixed fullscreen background, but use the same
   visual scale as the mascot/map screens. v6 removed the phone transform and
   exposed oversized Telegram-specific typography/card rules. */
body.tg-webapp.phone-scaled.screen-shop-bg .phone .topbar,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .topbar{
  min-height:56px !important;
  padding:12px 18px 10px !important;
  background:linear-gradient(180deg,rgba(10,22,36,.58),rgba(7,16,28,.30)) !important;
  border-bottom:1px solid rgba(207,227,240,.14) !important;
  box-shadow:0 10px 28px rgba(0,0,0,.18) !important;
  -webkit-backdrop-filter:blur(18px) saturate(140%) !important;
  backdrop-filter:blur(18px) saturate(140%) !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .ico,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .ico{
  width:38px !important;
  height:38px !important;
  font-size:15px !important;
  background:rgba(255,255,255,.045) !important;
  border-color:rgba(207,227,240,.16) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08) !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .topbar-eyebrow,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .topbar-eyebrow{
  font-size:11px !important;
  line-height:1.18 !important;
  letter-spacing:2.6px !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-balance,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .shop-balance,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .tb-coins,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .tb-coins{
  font-size:12.5px !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .nav,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .nav{
  padding:9px 8px calc(12px + env(safe-area-inset-bottom)) !important;
  background:linear-gradient(180deg,rgba(8,18,31,.20),rgba(5,11,20,.92)) !important;
  border-top:1px solid rgba(207,227,240,.12) !important;
  -webkit-backdrop-filter:blur(14px) saturate(135%) !important;
  backdrop-filter:blur(14px) saturate(135%) !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .nav button,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .nav button{
  font-size:11px !important;
  line-height:1.12 !important;
  gap:5px !important;
  padding:6px 2px !important;
  letter-spacing:.2px !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .nav button svg,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .nav button svg{
  width:23px !important;
  height:23px !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone #scr-shop,
body.tg-webapp.phone-scaled.screen-profile-bg .phone #scr-profile{
  padding-left:0 !important;
  padding-right:0 !important;
  background:transparent !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-content{
  padding:76px 14px 108px !important;
  max-width:none !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .grid.c2{
  gap:12px !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-card{
  min-width:0 !important;
  min-height:258px !important;
  padding:13px !important;
  border-radius:18px !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-card .asset,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-card .gift-thumb{
  margin-bottom:9px !important;
  border-radius:14px !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-card h3,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-card .t,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-card .title,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-card > b{
  font-size:16px !important;
  line-height:1.15 !important;
  letter-spacing:0 !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-card p,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-card .muted,
body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-card .sub{
  font-size:13px !important;
  line-height:1.36 !important;
  letter-spacing:0 !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-card .shop-btn{
  min-height:44px !important;
  padding:9px 8px !important;
  border-radius:11px !important;
  font-size:13px !important;
  line-height:1.12 !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-content{
  padding:86px 16px 108px !important;
  max-width:none !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-hero2{
  margin-top:0 !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-ava{
  width:104px !important;
  height:104px !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-hi{
  font-size:26px !important;
  line-height:1.08 !important;
  letter-spacing:0 !important;
  margin-top:18px !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-title,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-lvl-label,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-balance{
  font-size:13.5px !important;
  line-height:1.25 !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-lvl-row{
  width:min(360px,88vw) !important;
  margin-top:17px !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-balance{
  padding:7px 16px !important;
  margin-top:18px !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .streak2,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .next-card,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .chat-card,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .card{
  border-radius:20px !important;
  padding:15px 16px !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .streak2-title,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .section-title,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-section-title,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .next-label{
  font-size:13px !important;
  line-height:1.24 !important;
  letter-spacing:1.9px !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .streak2-sub,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .next-text,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .chat-meta small{
  font-size:14px !important;
  line-height:1.42 !important;
  letter-spacing:0 !important;
}

/* v8: align shop/profile chrome with the rest of the app and tighten profile chats. */
body.tg-webapp.phone-scaled.screen-shop-bg .phone .topbar,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .topbar{
  min-height:54px !important;
  padding:15px 16px 11px !important;
  background:rgba(6,14,24,.42) !important;
  border-bottom:1px solid rgba(207,227,240,.10) !important;
  box-shadow:none !important;
  -webkit-backdrop-filter:blur(12px) saturate(130%) !important;
  backdrop-filter:blur(12px) saturate(130%) !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .ico,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .ico{
  width:36px !important;
  height:36px !important;
  background:rgba(255,255,255,.045) !important;
  border-color:rgba(207,227,240,.14) !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .nav,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .nav{
  padding:10px 10px 16px !important;
  background:linear-gradient(180deg, rgba(6,14,24,.20), rgba(6,14,24,.96)) !important;
  border-top:1px solid rgba(207,227,240,.14) !important;
  -webkit-backdrop-filter:blur(12px) saturate(130%) !important;
  backdrop-filter:blur(12px) saturate(130%) !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .nav button,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .nav button{
  font-size:10.5px !important;
  gap:5px !important;
  padding:6px 2px !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .nav button svg,
body.tg-webapp.phone-scaled.screen-profile-bg .phone .nav button svg{
  width:23px !important;
  height:23px !important;
}

body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-content{
  padding-top:62px !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .chat-card{
  gap:10px !important;
  min-height:72px !important;
  padding:13px 15px !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .chat-ico{
  font-size:20px !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .chat-meta{
  gap:1px !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .chat-meta b{
  font-size:14.5px !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  letter-spacing:0 !important;
}

body.tg-webapp.phone-scaled.screen-profile-bg .phone .chat-meta small{
  font-size:12.5px !important;
  line-height:1.28 !important;
  letter-spacing:0 !important;
}

/* v9: same polish as v8, but with stronger selectors because Jino may prepend
   hotfixes before older rules instead of appending them. */
html body.tg-webapp.phone-scaled.screen-shop-bg .phone .topbar,
html body.tg-webapp.phone-scaled.screen-profile-bg .phone .topbar{
  min-height:54px !important;
  padding:15px 16px 11px !important;
  background:rgba(6,14,24,.42) !important;
  background-image:none !important;
  border-bottom:1px solid rgba(207,227,240,.10) !important;
  box-shadow:none !important;
  -webkit-backdrop-filter:blur(12px) saturate(130%) !important;
  backdrop-filter:blur(12px) saturate(130%) !important;
}

html body.tg-webapp.phone-scaled.screen-shop-bg .phone .ico,
html body.tg-webapp.phone-scaled.screen-profile-bg .phone .ico{
  width:36px !important;
  height:36px !important;
}

html body.tg-webapp.phone-scaled.screen-shop-bg .phone .nav,
html body.tg-webapp.phone-scaled.screen-profile-bg .phone .nav{
  padding:10px 10px 16px !important;
  background:linear-gradient(180deg, rgba(6,14,24,.20), rgba(6,14,24,.96)) !important;
  border-top:1px solid rgba(207,227,240,.14) !important;
  -webkit-backdrop-filter:blur(12px) saturate(130%) !important;
  backdrop-filter:blur(12px) saturate(130%) !important;
}

html body.tg-webapp.phone-scaled.screen-shop-bg .phone .nav button,
html body.tg-webapp.phone-scaled.screen-profile-bg .phone .nav button{
  font-size:10.5px !important;
  gap:5px !important;
  padding:6px 2px !important;
}

html body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-content{
  padding-top:62px !important;
}

html body.tg-webapp.phone-scaled.screen-profile-bg .phone .chat-card{
  gap:10px !important;
  min-height:72px !important;
  padding:13px 15px !important;
}

html body.tg-webapp.phone-scaled.screen-profile-bg .phone .chat-ico{
  font-size:20px !important;
}

html body.tg-webapp.phone-scaled.screen-profile-bg .phone .chat-meta{
  gap:1px !important;
}

html body.tg-webapp.phone-scaled.screen-profile-bg .phone .chat-meta b{
  font-size:14.5px !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  letter-spacing:0 !important;
}

html body.tg-webapp.phone-scaled.screen-profile-bg .phone .chat-meta small{
  font-size:12.5px !important;
  line-height:1.28 !important;
  letter-spacing:0 !important;
}

/* v10: Telegram Desktop/browser must keep the same centered phone scene as the
   map/mascot screens. Fullscreen shop/profile is only for narrow mobile views. */
@media (min-width: 721px){
  html body.tg-webapp.phone-scaled.screen-shop-bg,
  html body.tg-webapp.phone-scaled.screen-profile-bg{
    width:auto !important;
    min-width:0 !important;
    height:auto !important;
    min-height:100vh !important;
    margin:0 !important;
    padding:22px 10px !important;
    overflow:hidden !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  html body.tg-webapp.phone-scaled.screen-shop-bg .phone,
  html body.tg-webapp.phone-scaled.screen-profile-bg .phone{
    left:auto !important;
    right:auto !important;
    top:auto !important;
    width:100% !important;
    max-width:432px !important;
    height:880px !important;
    min-height:0 !important;
    max-height:94vh !important;
    transform:none !important;
    border-radius:40px !important;
    border:1px solid rgba(207,227,240,.10) !important;
    box-shadow:0 30px 80px rgba(0,0,0,.6), inset 0 0 0 1px rgba(255,255,255,.02), 0 0 50px rgba(47,127,176,.10) !important;
    overflow:hidden !important;
  }

  html body.tg-webapp.phone-scaled.screen-shop-bg .phone .scroll,
  html body.tg-webapp.phone-scaled.screen-profile-bg .phone .scroll,
  html body.tg-webapp.phone-scaled.screen-shop-bg .phone #scr-shop,
  html body.tg-webapp.phone-scaled.screen-profile-bg .phone #scr-profile{
    width:100% !important;
    max-width:432px !important;
  }

  html body.tg-webapp.phone-scaled.screen-shop-bg .phone .nav,
  html body.tg-webapp.phone-scaled.screen-profile-bg .phone .nav,
  html body.tg-webapp.phone-scaled.screen-shop-bg .phone .topbar,
  html body.tg-webapp.phone-scaled.screen-profile-bg .phone .topbar{
    left:0 !important;
    right:0 !important;
    width:auto !important;
    max-width:none !important;
  }

  html body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-content{
    padding:72px 14px 108px !important;
  }

  html body.tg-webapp.phone-scaled.screen-profile-bg .phone .profile-content{
    padding:86px 16px 108px !important;
  }

  html body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-card{
    min-height:258px !important;
  }

  html body.tg-webapp.phone-scaled.screen-profile-bg .phone .streak2,
  html body.tg-webapp.phone-scaled.screen-profile-bg .phone .next-card,
  html body.tg-webapp.phone-scaled.screen-profile-bg .phone .chat-card,
  html body.tg-webapp.phone-scaled.screen-profile-bg .phone .card{
    width:100% !important;
  }

  html body.tg-webapp.phone-scaled .phone .welcome-pre{
    font-size:16px !important;
    line-height:1.18 !important;
  }

  html body.tg-webapp.phone-scaled .phone .welcome-island{
    font-size:42px !important;
    line-height:.96 !important;
  }

  html body.tg-webapp.phone-scaled .phone .welcome-desc{
    max-width:292px !important;
    font-size:13.5px !important;
    line-height:1.42 !important;
  }

  html body.tg-webapp.phone-scaled .phone .btn-welcome{
    font-size:13.5px !important;
    min-height:46px !important;
  }
}

/* v11: readable card copy + stable bottom navigation across main tabs. */
html body.tg-webapp.phone-scaled .phone .mascot-hint-text,
html body.tg-webapp.phone-scaled .phone .ios-notif-text,
html body.tg-webapp.phone-scaled .phone .lesson-tool-sub,
html body.tg-webapp.phone-scaled .phone .tool-why-text,
html body.tg-webapp.phone-scaled .phone .qst-anon-tx,
html body.tg-webapp.phone-scaled .phone .qst-foot,
html body.tg-webapp.phone-scaled .phone .qst-sent-hint,
html body.tg-webapp.phone-scaled .phone .trenazal-desc,
html body.tg-webapp.phone-scaled .phone .drill-card2 .drill-sit,
html body.tg-webapp.phone-scaled .phone .ch-desc,
html body.tg-webapp.phone-scaled .phone .ch-cur-text,
html body.tg-webapp.phone-scaled .phone .acad-card-desc,
html body.tg-webapp.phone-scaled .phone .acad-card-sub,
html body.tg-webapp.phone-scaled .phone .cmod-sub,
html body.tg-webapp.phone-scaled .phone .cmod-lrow,
html body.tg-webapp.phone-scaled .phone .omod-sub,
html body.tg-webapp.phone-scaled .phone .omod-meta,
html body.tg-webapp.phone-scaled .phone .lib2-desc,
html body.tg-webapp.phone-scaled .phone .next-text,
html body.tg-webapp.phone-scaled .phone .streak2-sub,
html body.tg-webapp.phone-scaled .phone .note,
html body.tg-webapp.phone-scaled .phone .cap-form-sub,
html body.tg-webapp.phone-scaled .phone .cap-bottom-note,
html body.tg-webapp.phone-scaled .phone .trip-lead,
html body.tg-webapp.phone-scaled .phone .trip-p,
html body.tg-webapp.phone-scaled .phone .trip-li,
html body.tg-webapp.phone-scaled .phone .trip-saved,
html body.tg-webapp.phone-scaled .phone .trip-dash-hint{
  font-size:14px !important;
  line-height:1.45 !important;
  letter-spacing:0 !important;
}

html body.tg-webapp.phone-scaled .phone .mascot-hint-title{
  font-size:18px !important;
  line-height:1.18 !important;
}

html body.tg-webapp.phone-scaled .phone:not(.welcome-open) .nav,
html body.tg-webapp.phone-scaled .phone.screen-shop-bg .nav,
html body.tg-webapp.phone-scaled .phone.screen-profile-bg .nav,
html body.tg-webapp.phone-scaled.screen-shop-bg .phone .nav,
html body.tg-webapp.phone-scaled.screen-profile-bg .phone .nav{
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  width:auto !important;
  max-width:none !important;
  min-height:78px !important;
  padding:10px 10px 16px !important;
  border-radius:0 !important;
  background:linear-gradient(180deg, rgba(6,14,24,.20), rgba(6,14,24,.96)) !important;
  border-top:1px solid rgba(207,227,240,.14) !important;
  -webkit-backdrop-filter:blur(12px) saturate(130%) !important;
  backdrop-filter:blur(12px) saturate(130%) !important;
  transition:none !important;
  transform:none !important;
}

html body.tg-webapp.phone-scaled .phone:not(.welcome-open) .nav button,
html body.tg-webapp.phone-scaled .phone.screen-shop-bg .nav button,
html body.tg-webapp.phone-scaled .phone.screen-profile-bg .nav button,
html body.tg-webapp.phone-scaled.screen-shop-bg .phone .nav button,
html body.tg-webapp.phone-scaled.screen-profile-bg .phone .nav button{
  min-height:52px !important;
  font-size:10.5px !important;
  line-height:1.12 !important;
  gap:5px !important;
  padding:6px 2px !important;
  transition:color .12s ease, filter .12s ease !important;
}

html body.tg-webapp.phone-scaled .phone:not(.welcome-open) .nav button svg,
html body.tg-webapp.phone-scaled .phone.screen-shop-bg .nav button svg,
html body.tg-webapp.phone-scaled .phone.screen-profile-bg .nav button svg,
html body.tg-webapp.phone-scaled.screen-shop-bg .phone .nav button svg,
html body.tg-webapp.phone-scaled.screen-profile-bg .phone .nav button svg{
  width:23px !important;
  height:23px !important;
}

@media (max-width:720px){
  html body.tg-webapp.phone-scaled.screen-shop-bg .phone .shop-content,
  html body.tg-webapp.phone-scaled .phone.screen-shop-bg .shop-content,
  html body.tg-webapp.phone-scaled.screen-shop-bg .phone.screen-shop-bg #scr-shop .shop-content,
  html body.tg-webapp.phone-scaled .phone.screen-shop-bg #scr-shop .shop-content{
    padding-top:50px !important;
  }
}

/* v12: mobile Telegram polish for shop spacing and stable shared nav. */
html body.tg-webapp.phone-scaled.screen-shop-bg .phone #scr-shop .shop-content,
html body.tg-webapp.phone-scaled .phone.screen-shop-bg #scr-shop .shop-content{
  padding-top:50px !important;
}

@media (max-width:720px){
  html body.tg-webapp.phone-scaled .phone:not(.welcome-open) .nav{
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    /* The 432px scene is scaled to the Telegram viewport by its parent.
       100vw gets scaled again and visibly shortens the menu on the right. */
    width:100% !important;
    max-width:none !important;
    min-height:78px !important;
    padding:10px 10px 16px !important;
    border-radius:0 !important;
    transform:none !important;
    transition:none !important;
  }
}

/* v13: tighter shop cards start under the header. */
html body.tg-webapp.phone-scaled.screen-shop-bg .phone #scr-shop.active,
html body.tg-webapp.phone-scaled .phone.screen-shop-bg #scr-shop.active{
  padding-top:70px !important;
}

html body.tg-webapp.phone-scaled.screen-shop-bg .phone #scr-shop .shop-content,
html body.tg-webapp.phone-scaled .phone.screen-shop-bg #scr-shop .shop-content{
  padding-top:18px !important;
}