/* ==========================================================================
   Маркет NFT-подарков
   ========================================================================== */
/* Нижнее меню — только иконки */
.tabbar-inner { max-width: 290px; height: 60px; }
.tab { gap: 0; }
.tab .ic { width: 27px; height: 27px; }
.view.has-tabbar .page.mk-has-cart { padding-bottom: 190px; }

/* ---------- Шапка: балансы и баннер ---------- */
.mk-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 16px 0; }
.mk-bal {
  display: inline-flex; align-items: center; gap: 7px; min-width: 0; height: 38px; padding: 0 14px 0 6px; border-radius: 19px;
  background: var(--card); font-size: 16px; font-variant-numeric: tabular-nums; white-space: nowrap;
}
.mk-bal b { font-weight: 700; overflow: hidden; text-overflow: ellipsis; }
.mk-bal i { font-style: normal; font-weight: 600; font-size: 13.5px; color: var(--hint); }
.mk-bal:active { transform: scale(.97); }

.mk-banner {
  position: relative; overflow: hidden; margin: 12px 16px 0; min-height: 118px; padding: 18px 18px 16px; border-radius: 24px; color: #fff;
  display: flex; align-items: center;
  background: linear-gradient(118deg, #2a6be0 0%, #3f9eea 52%, #7a5cf0 100%);
  box-shadow: 0 12px 30px rgba(45, 110, 212, .26);
}
.mk-banner-glow {
  position: absolute; inset: -40%; pointer-events: none;
  background: radial-gradient(circle at 70% 40%, rgba(255, 255, 255, .32), transparent 34%), radial-gradient(circle at 20% 80%, rgba(140, 220, 255, .28), transparent 30%);
  animation: glow 9s ease-in-out infinite alternate;
}
.mk-banner-text { position: relative; max-width: 64%; }
.mk-banner-text b { display: block; font-size: 27px; font-weight: 800; line-height: 1.02; letter-spacing: -.02em; }
.mk-banner-text span { display: block; margin-top: 7px; font-size: 13px; line-height: 1.3; opacity: .9; }
.mk-banner-art { position: absolute; right: 8px; top: 11px; animation: floaty 3.4s ease-in-out infinite; }

/* ---------- Разделы ---------- */
.mk-cats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 16px 12px 0; }
.mk-cat { display: flex; flex-direction: column; align-items: center; gap: 7px; font-size: 14px; font-weight: 600; color: var(--hint); }
.mk-cat-ic {
  width: 64px; height: 64px; border-radius: 20px; background: var(--card); color: var(--hint2);
  display: flex; align-items: center; justify-content: center; transition: background .15s, color .15s, transform .1s;
}
.mk-cat-ic .ic { width: 30px; height: 30px; }
.mk-cat.on { color: var(--text); }
.mk-cat.on .mk-cat-ic { background: var(--accent-soft); color: var(--accent); }
.mk-cat.off { opacity: .45; }
.mk-cat:active .mk-cat-ic { transform: scale(.94); }

/* ---------- Поиск и фильтры ---------- */
.mk-search { display: flex; align-items: center; gap: 8px; padding: 16px 16px 0; }
.mk-field {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 14px; border-radius: 22px;
  background: var(--card); color: var(--hint); border: 1px solid transparent; transition: border-color .15s;
}
.mk-field:focus-within { border-color: var(--accent); }
.mk-field .ic { width: 20px; height: 20px; }
.mk-field input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font-size: 16px; color: var(--text); }
.mk-field input::placeholder { color: var(--hint); }
.mk-field input::-webkit-search-cancel-button { display: none; }
.mk-rb {
  width: 44px; height: 44px; border-radius: 50%; flex: none; background: var(--card); color: var(--text2);
  display: flex; align-items: center; justify-content: center;
}
.mk-rb .ic { width: 21px; height: 21px; }
.mk-rb.on { background: var(--accent-soft); color: #f5b301; }
.mk-rb.small { width: 36px; height: 36px; background: var(--bg2); color: var(--hint); }
.mk-rb.small .ic { width: 19px; height: 19px; }
.mk-rb:active { transform: scale(.93); }

.mk-filters { display: flex; align-items: center; gap: 8px; padding: 12px 16px 0; overflow-x: auto; scrollbar-width: none; }
.mk-filters::-webkit-scrollbar { display: none; }
.mk-fbtn {
  flex: none; display: inline-flex; align-items: center; justify-content: center; gap: 5px; height: 40px; padding: 0 12px 0 14px;
  border-radius: 20px; background: var(--card); color: var(--text); font-size: 15px; font-weight: 600; white-space: nowrap;
}
.mk-fbtn.round { width: 40px; padding: 0; }
.mk-fbtn .ic { width: 18px; height: 18px; color: var(--hint); }
.mk-fbtn.on { background: var(--accent-soft); color: var(--link); }
.mk-fbtn.on .ic { color: var(--link); }
.mk-fbtn:active { transform: scale(.96); }
.mk-sep { flex: none; width: 1px; height: 22px; background: var(--input-border); }

.mk-count { display: flex; justify-content: space-between; padding: 14px 18px 0; font-size: 13.5px; color: var(--hint); }

/* ---------- Картинка подарка ---------- */
.mk-art {
  position: relative; overflow: hidden; aspect-ratio: 1; border-radius: 16px;
  background: radial-gradient(circle at 50% 46%, var(--c1) 0%, var(--c2) 88%);
}
.mk-art.plain { background: none; overflow: visible; }
.mk-pat { position: absolute; inset: 0; opacity: 0; transition: opacity .5s; }
.mk-pat.on { opacity: 1; }
.mk-pat i {
  position: absolute; aspect-ratio: 1; transform: translate(-50%, -50%) rotate(var(--r, 0deg));
  background-color: var(--pc);
  -webkit-mask: var(--mask) center / contain no-repeat; mask: var(--mask) center / contain no-repeat;
}
.mk-model { position: absolute; inset: 13%; opacity: 0; transform: scale(.92); transition: opacity .35s, transform .45s cubic-bezier(.2, 1.4, .4, 1); }
.mk-model.on { opacity: 1; transform: none; }
.mk-model svg { display: block; width: 100% !important; height: 100% !important; }
.mk-badges { position: absolute; top: 7px; left: 7px; right: 7px; display: flex; gap: 5px; }
.mk-badge {
  display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 11px;
  background: rgba(0, 0, 0, .2); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  color: #fff; font-size: 12px; font-weight: 700;
}
.mk-badge.mine { margin-left: auto; background: rgba(255, 255, 255, .85); color: #2a2a2e; }
.mk-art-title { position: absolute; left: 0; right: 0; bottom: 16px; display: flex; flex-direction: column; align-items: center; color: var(--tc); text-shadow: 0 1px 10px rgba(0, 0, 0, .12); }
.mk-art-title b { font-size: 23px; font-weight: 800; letter-spacing: -.01em; }
.mk-art-title span { font-size: 14.5px; font-weight: 600; opacity: .8; }

/* ---------- Сетка ---------- */
.mk-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 10px 16px 0; }
.mk-card { min-width: 0; display: flex; flex-direction: column; padding: 8px 8px 10px; border-radius: 22px; background: var(--card); cursor: pointer; transition: transform .12s; }
.mk-card:active { transform: scale(.98); }
.mk-info { min-width: 0; padding: 9px 6px 0; }
.mk-info b { display: block; font-size: 16.5px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mk-info span { font-size: 13.5px; color: var(--hint); font-variant-numeric: tabular-nums; }
.mk-acts { display: flex; gap: 6px; margin-top: 9px; }
.mk-price {
  flex: 1; min-width: 0; display: inline-flex; align-items: center; justify-content: center; gap: 4px; height: 38px; padding: 0 10px; border-radius: 19px;
  background: var(--accent); color: #fff; font-size: 15.5px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap;
}
.mk-price .ic { width: 15px; height: 15px; }
.mk-price.mine { background: var(--accent-soft); color: var(--link); }
.mk-price:active { transform: scale(.96); filter: brightness(.95); }
.mk-cart {
  flex: none; width: 38px; height: 38px; border-radius: 50%; background: var(--round-btn); color: var(--text2);
  display: flex; align-items: center; justify-content: center; transition: background .15s, color .15s;
}
.mk-cart .ic { width: 20px; height: 20px; }
.mk-cart.on { background: var(--green); color: #fff; }
.mk-cart:active { transform: scale(.92); }

/* ---------- Список ---------- */
.mk-list { display: flex; flex-direction: column; gap: 8px; padding: 10px 16px 0; }
.mk-row { display: flex; align-items: center; gap: 12px; padding: 8px 10px 8px 8px; border-radius: 18px; background: var(--card); cursor: pointer; }
.mk-row > .mk-art { width: 60px; flex: none; border-radius: 14px; }
.mk-row-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.mk-row-main b { font-size: 16px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mk-row-main > span { font-size: 13.5px; color: var(--hint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mk-row .mk-price { flex: none; }
.mk-row.small { cursor: default; background: none; padding: 6px 0; border-radius: 0; }
.mk-row.small > .mk-art { width: 46px; border-radius: 12px; }
.mk-row.small + .mk-row.small { border-top: 1px solid var(--sep); }
.mk-act-price { display: inline-flex; align-items: center; gap: 3px; font-size: 15.5px; font-variant-numeric: tabular-nums; color: var(--link); }
.mk-act-price .ic { width: 14px; height: 14px; }
.mk-more { display: flex; justify-content: center; padding: 18px 0 4px; min-height: 20px; }

/* ---------- Коллекции ---------- */
.mk-table { margin: 14px 16px 0; padding: 4px 0 8px; border-radius: 22px; background: var(--card); }
.mk-th, .mk-tr { display: grid; grid-template-columns: minmax(0, 1fr) 66px 60px; gap: 6px; align-items: center; padding: 0 12px 0 8px; }
.mk-th { padding-top: 10px; padding-bottom: 6px; }
.mk-th button { display: inline-flex; align-items: center; gap: 1px; font-size: 14px; font-weight: 600; color: var(--hint); white-space: nowrap; }
.mk-th button:nth-child(n+2) { justify-content: flex-end; }
.mk-th button.on { color: var(--text); }
.mk-th .ic { width: 15px; height: 15px; }
.mk-tr { padding-top: 9px; padding-bottom: 9px; cursor: pointer; }
.mk-tr:active { background: color-mix(in srgb, var(--text) 4%, transparent); }
.mk-col { display: flex; align-items: center; gap: 7px; min-width: 0; }
.mk-fav { flex: none; width: 20px; color: var(--hint2); display: flex; }
.mk-fav .ic { width: 19px; height: 19px; }
.mk-fav.on { color: #f5b301; }
.mk-col-ic { position: relative; flex: none; width: 50px; height: 50px; border-radius: 15px; background: var(--bg2); }
:root[data-theme="dark"] .mk-col-ic { background: var(--bg2); }
.mk-col-ic > .mk-art { position: absolute; inset: 0; aspect-ratio: auto; }
.mk-col-ic > .mk-art .mk-model { inset: 9%; }
.mk-col-ic > i {
  position: absolute; left: 50%; bottom: -7px; transform: translateX(-50%); z-index: 1;
  display: inline-flex; align-items: center; gap: 2px; height: 18px; padding: 0 6px; border-radius: 9px;
  background: var(--sheet-bg); box-shadow: 0 0 0 1px var(--sep); color: var(--hint);
  font-size: 11px; font-weight: 700; font-style: normal; white-space: nowrap;
}
.mk-col-ic > i .ic { width: 11px; height: 11px; }
.mk-col-name { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.mk-col-name b {
  font-size: 15.5px; font-weight: 600; line-height: 1.2; overflow: hidden; word-break: break-word;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
}
.mk-col-sub { display: flex; align-items: center; gap: 5px; font-size: 13px; color: var(--hint); white-space: nowrap; }
.mk-new {
  display: inline-flex; align-items: center; height: 17px; padding: 0 5px; border-radius: 5px;
  background: var(--green-soft); color: var(--green); font-size: 10.5px; font-weight: 800; letter-spacing: .03em;
}
.mk-num { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; font-variant-numeric: tabular-nums; }
.mk-num b { font-size: 15.5px; font-weight: 700; }
.mk-num i { font-style: normal; font-size: 12.5px; font-weight: 600; }
.mk-num i.flat { color: var(--hint); }

/* ---------- Корзина ---------- */
.mk-cartbar {
  position: fixed; z-index: 41; left: 50%; transform: translateX(-50%); bottom: calc(90px + env(safe-area-inset-bottom));
  width: calc(100% - 32px); max-width: 448px; display: flex; align-items: center; gap: 12px; padding: 8px 8px 8px 12px; border-radius: 22px;
  background: var(--accent); color: #fff; box-shadow: 0 10px 30px color-mix(in srgb, var(--accent) 40%, transparent);
  animation: mkUp .25s ease-out;
}
@keyframes mkUp { from { transform: translate(-50%, 20px); opacity: 0; } to { transform: translateX(-50%); opacity: 1; } }
.mk-cartbar-ic { position: relative; width: 40px; height: 40px; border-radius: 50%; background: rgba(255, 255, 255, .2); display: flex; align-items: center; justify-content: center; flex: none; }
.mk-cartbar-ic .ic { width: 21px; height: 21px; }
.mk-cartbar-ic em { position: absolute; top: -3px; right: -3px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: #fff; color: var(--accent-dark); font-size: 11px; font-weight: 800; font-style: normal; display: flex; align-items: center; justify-content: center; }
.mk-cartbar-main { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
.mk-cartbar-main b { font-size: 15.5px; }
.mk-cartbar-main span { font-size: 13.5px; opacity: .88; font-variant-numeric: tabular-nums; }
.mk-cartbar > button { flex: none; height: 42px; padding: 0 20px; border-radius: 15px; background: #fff; color: var(--accent-dark); font-weight: 700; font-size: 16px; }
.mk-cartbar > button:active { transform: scale(.96); }

/* ---------- Шторки ---------- */
.mk-detail-art .mk-art { border-radius: 22px; }
.mk-rar { font-style: normal; margin-left: 4px; padding: 1px 7px; border-radius: 8px; background: var(--accent-soft); color: var(--link); font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.mk-buybox { display: flex; flex-direction: column; gap: 10px; }
.mk-sum { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.mk-sum > div { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border-radius: 14px; background: var(--card); }
.mk-sum span { font-size: 13px; color: var(--hint); }
.mk-sum b { font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums; }
.mk-sum small { font-size: 12.5px; color: var(--hint); }
.mk-buybox .btn-lg, .mk-sheet [data-ck-foot] .btn-lg { height: 52px; border-radius: 16px; }
.mk-sheet [data-ck-foot] { display: flex; flex-direction: column; gap: 10px; }
.mk-hint { text-align: center; padding: 0 12px; line-height: 1.35; }
.mk-ck-list, .mk-acts-list { display: flex; flex-direction: column; }

.mk-opts { display: flex; flex-direction: column; background: var(--card); border-radius: 16px; overflow: hidden; }
.mk-opt { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 8px 14px; text-align: left; }
.mk-opt + .mk-opt { border-top: 1px solid var(--sep); }
.mk-opt:active { background: color-mix(in srgb, var(--text) 5%, transparent); }
.mk-opt-art { position: relative; width: 40px; height: 40px; flex: none; border-radius: 12px; background: var(--bg); }
.mk-opt-art > .mk-art { position: absolute; inset: 0; aspect-ratio: auto; }
.mk-opt-art .mk-model { inset: 6%; }
.mk-swatch { position: absolute; inset: 0; border-radius: 12px; }
.mk-opt-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.mk-opt-main b { font-size: 16px; font-weight: 500; }
.mk-opt-main span { font-size: 13.5px; color: var(--hint); }
.mk-opt.on .mk-opt-main b { color: var(--link); font-weight: 600; }
.mk-opt-check { width: 22px; flex: none; color: var(--link); display: flex; }
.mk-opt-check .ic { width: 22px; height: 22px; }
.mk-flist { margin: 0; }
.mk-flist .cell-right b { color: var(--text); font-weight: 500; }

/* Окно успешной покупки */
.mk-win { padding: 16px 16px 22px; width: min(320px, calc(100vw - 48px)); }
.mk-win-art { width: 100%; margin-bottom: 8px; }
.mk-win-art .mk-art { border-radius: 20px; }
.mk-win-name { font-size: 17px; font-weight: 700; }

/* ==========================================================================
   Юзернеймы
   ========================================================================== */
.mk-rb.on-blue { background: var(--accent-soft); color: var(--accent); }
.mk-mych {
  flex: none; display: inline-flex; align-items: center; gap: 6px; height: 44px; padding: 0 14px 0 12px; border-radius: 22px;
  background: var(--accent); color: #fff; font-size: 15px; font-weight: 600; white-space: nowrap;
}
.mk-mych .ic { width: 20px; height: 20px; }
.mk-mych:active { transform: scale(.96); }
.un-intro {
  display: flex; align-items: flex-start; gap: 10px; margin: 12px 16px 0; padding: 12px 14px; border-radius: 16px;
  background: var(--accent-soft); color: var(--text2); font-size: 14px; line-height: 1.35;
}
.un-intro .ic { width: 20px; height: 20px; color: var(--link); flex: none; margin-top: 1px; }

/* Картинка юзернейма */
.un-art {
  container-type: inline-size; position: relative; overflow: hidden; aspect-ratio: 1; border-radius: 16px;
  background: radial-gradient(120% 95% at 50% 18%, hsl(var(--h) 28% 30%) 0%, hsl(var(--h) 34% 15%) 62%, hsl(var(--h) 38% 10%) 100%);
}
.un-glow {
  position: absolute; left: 50%; top: 37%; width: 90cqw; height: 90cqw; transform: translate(-50%, -50%); pointer-events: none;
  background: radial-gradient(circle, color-mix(in srgb, var(--p) 45%, transparent) 0%, transparent 60%);
  opacity: .55;
}
.un-app {
  position: absolute; left: 50%; top: 37%; width: 37cqw; height: 37cqw; transform: translate(-50%, -50%);
  border-radius: 27%; background: #fff; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 3cqw 9cqw rgba(0, 0, 0, .35);
}
.un-app svg { width: 80%; height: 80%; display: block; }
.un-pill {
  position: absolute; left: 50%; top: 73%; transform: translate(-50%, -50%); max-width: 90%;
  padding: .32em .62em .36em; border-radius: .5em; background: var(--p); color: #fff;
  font-weight: 800; letter-spacing: -.01em; line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  box-shadow: 0 2cqw 6cqw color-mix(in srgb, var(--p) 45%, transparent);
}
.un-link {
  position: absolute; left: 6%; right: 6%; bottom: 4.5cqw; text-align: center; font-size: 5.2cqw; font-weight: 500;
  color: rgba(255, 255, 255, .3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mk-detail-art .un-art, .mk-win-art .un-art { border-radius: 22px; }

/* Мои каналы */
.un-rows { display: flex; flex-direction: column; gap: 10px; }
.un-row { display: flex; flex-direction: column; gap: 10px; padding: 12px; border-radius: 18px; background: var(--card); }
.un-row-top { display: flex; align-items: center; gap: 12px; min-width: 0; }
.un-mini { width: 54px; flex: none; }
.un-mini .un-art { border-radius: 14px; }
.un-mini.big { width: 64px; }
.un-row-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.un-row-main b { font-size: 16px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.un-row-main > span { font-size: 13.5px; color: var(--hint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.un-st { align-self: flex-start; margin-top: 3px; padding: 2px 8px; border-radius: 8px; background: color-mix(in srgb, var(--hint) 14%, transparent); color: var(--hint) !important; font-size: 12.5px !important; font-weight: 600; }
.un-st.on { background: var(--green-soft); color: var(--green) !important; }
.un-st.nft { background: var(--accent-soft); color: var(--link) !important; }
.un-row-acts { display: flex; gap: 8px; }
.un-btn {
  flex: 1; min-width: 0; display: inline-flex; align-items: center; justify-content: center; gap: 5px; height: 40px; padding: 0 10px;
  border-radius: 12px; background: var(--accent-soft); color: var(--link); font-size: 14.5px; font-weight: 600; white-space: nowrap;
}
.un-btn .ic { width: 17px; height: 17px; }
.un-btn.primary { background: var(--accent); color: #fff; }
.un-btn:disabled { opacity: .5; }
.un-btn:active { transform: scale(.97); }
.un-list-head { display: flex; align-items: center; gap: 12px; }
.un-list-head > span:last-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.un-list-head b { font-size: 18px; }
.un-done { display: flex; flex-direction: column; gap: 4px; text-align: center; padding: 0 6px; }
.un-done b { font-size: 18px; }
.un-done span { font-size: 14.5px; color: var(--hint); line-height: 1.4; }
.un-warn { background: var(--red-soft); }
.un-warn .ic { color: var(--red); }
.un-agree { display: flex; align-items: center; gap: 10px; font-size: 15px; padding: 2px 4px; cursor: pointer; }
.un-agree input { width: 20px; height: 20px; accent-color: var(--accent); flex: none; }
.un-badge {
  position: absolute; top: 5cqw; right: 5cqw; z-index: 1; padding: .3em .6em; border-radius: .6em;
  background: rgba(255, 255, 255, .16); color: #fff; font-size: 5.4cqw; font-weight: 800; letter-spacing: .04em;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}

/* ==========================================================================
   Профиль
   ========================================================================== */
.pf-loading { padding-top: 120px; }
.pf-hero { position: relative; margin: 12px 16px 0; padding: 0 16px 18px; border-radius: 26px; background: var(--card); display: flex; flex-direction: column; align-items: center; text-align: center; overflow: hidden; }
.pf-cover {
  position: absolute; left: 0; right: 0; top: 0; height: 96px; overflow: hidden;
  background: linear-gradient(125deg, hsl(var(--h) 72% 58%), hsl(calc(var(--h) + 40) 70% 50%) 60%, hsl(calc(var(--h) + 80) 66% 56%));
}
.pf-cover i { position: absolute; border-radius: 50%; background: rgba(255, 255, 255, .16); }
.pf-cover i:nth-child(1) { width: 140px; height: 140px; right: -30px; top: -60px; }
.pf-cover i:nth-child(2) { width: 70px; height: 70px; left: 24px; top: 38px; background: rgba(255, 255, 255, .1); }
.pf-cover i:nth-child(3) { width: 26px; height: 26px; left: 46%; top: 14px; background: rgba(255, 255, 255, .22); }
.pf-ava { position: relative; margin-top: 46px; padding: 4px; border-radius: 50%; background: var(--card); }
.pf-ava .avatar { font-size: 36px !important; font-weight: 700; }
.pf-name { position: relative; display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 10px; font-size: 24px; font-weight: 800; letter-spacing: -.02em; max-width: 100%; }
.pf-name > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf-name .ic { width: 22px; height: 22px; }
.pf-verified { color: var(--accent); display: flex; }
.pf-premium { color: #a970f5; display: flex; }
.pf-handle { margin-top: 2px; color: var(--link); font-size: 16px; font-weight: 500; }
.pf-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 14px; }
.pf-chip {
  display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 11px 0 9px; border-radius: 15px;
  background: var(--bg); color: var(--text2); font-size: 13px; font-weight: 500; white-space: nowrap; font-variant-numeric: tabular-nums;
}
.pf-chip .ic { width: 16px; height: 16px; color: var(--hint); }
.pf-chip.gold { background: color-mix(in srgb, #a970f5 14%, var(--bg)); color: #8a52e0; }
.pf-chip.gold .ic { color: #a970f5; }
button.pf-chip:active { transform: scale(.96); }

.pf-bals { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 10px 16px 0; }
.pf-bal { display: flex; align-items: center; gap: 10px; padding: 12px; border-radius: 18px; background: var(--card); min-width: 0; }
.pf-bal > span { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.pf-bal small { font-size: 12.5px; color: var(--hint); }
.pf-bal b { font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pf-bal:active { transform: scale(.98); }

.pf-about { margin: 10px 16px 0; padding: 12px 14px; border-radius: 18px; background: var(--card); }
.pf-about span { font-size: 12.5px; font-weight: 600; color: var(--hint); text-transform: uppercase; letter-spacing: .03em; }
.pf-about p { margin-top: 3px; font-size: 15px; line-height: 1.4; white-space: pre-line; word-break: break-word; }

.pf-stats { display: grid; grid-template-columns: repeat(3, 1fr); margin: 10px 16px 0; border-radius: 18px; background: var(--card); }
.pf-stats > div { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 12px 6px; text-align: center; }
.pf-stats > div + div { border-left: 1px solid var(--sep); }
.pf-stats b { font-size: 20px; font-weight: 800; font-variant-numeric: tabular-nums; }
.pf-stats span { font-size: 12.5px; color: var(--hint); }

.pf-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin: 18px 16px 0; padding: 4px; border-radius: 16px; background: var(--card); }
.pf-tabs button { display: flex; align-items: center; justify-content: center; gap: 6px; height: 40px; border-radius: 12px; font-size: 15px; font-weight: 600; color: var(--hint); }
.pf-tabs button .ic { width: 19px; height: 19px; }
.pf-tabs button.on { background: var(--bg); color: var(--text); box-shadow: 0 1px 4px rgba(0, 0, 0, .06); }
:root[data-theme="dark"] .pf-tabs button.on { background: var(--bg2); }
.pf-body { min-height: 120px; }
.pf-filter { display: flex; gap: 8px; padding: 12px 16px 0; }
.pf-filter button { height: 32px; padding: 0 12px; border-radius: 16px; background: var(--card); color: var(--hint); font-size: 14px; font-weight: 600; }
.pf-filter button.on { background: var(--accent-soft); color: var(--link); }
.pf-gift-st { padding: 7px 6px 0; }
.pf-st { display: inline-flex; align-items: center; gap: 3px; padding: 3px 9px; border-radius: 9px; background: color-mix(in srgb, var(--hint) 14%, transparent); color: var(--hint); font-size: 12.5px; font-weight: 600; font-variant-numeric: tabular-nums; }
.pf-st .ic { width: 12px; height: 12px; }
.pf-st.on { background: var(--green-soft); color: var(--green); }
.pf-st.star { background: color-mix(in srgb, #f5b301 16%, transparent); color: #c28a00; }
.pf-where { font-size: 14.5px !important; }
.pf-sub { padding: 18px 20px 8px; font-size: 13px; font-weight: 700; color: var(--hint); text-transform: uppercase; letter-spacing: .03em; }
.profile-page .un-rows { padding: 0 16px; }
.pf-hint { padding: 12px 24px 0; }
.pf-logout {
  display: flex; align-items: center; justify-content: center; gap: 8px; width: calc(100% - 32px); height: 50px; margin: 26px 16px 0;
  border-radius: 16px; background: var(--card); color: var(--red); font-size: 16px; font-weight: 600;
}
.pf-logout .ic { width: 20px; height: 20px; }
.pf-logout:active { transform: scale(.98); }

/* ==========================================================================
   Подъём в топ
   ========================================================================== */
.mk-badge.top, .un-top {
  display: inline-flex; align-items: center; gap: 3px;
  background: linear-gradient(135deg, #ffb340, #ff6a3d); color: #fff; box-shadow: 0 2px 8px rgba(255, 106, 61, .35);
}
.mk-badge.top .ic { width: 13px; height: 13px; }
.un-top {
  position: absolute; top: 5cqw; left: 5cqw; z-index: 1; padding: .3em .6em; border-radius: .6em;
  font-size: 5.4cqw; font-weight: 800; letter-spacing: .03em;
}
.un-top .ic { width: 1.15em; height: 1.15em; }
.mk-card.boosted { box-shadow: 0 0 0 2px #ff9a3c inset, 0 6px 22px rgba(255, 140, 50, .18); }
.mk-row.boosted { box-shadow: 0 0 0 2px #ff9a3c inset; }
.pf-st.top { margin-left: 4px; background: linear-gradient(135deg, #ffb340, #ff6a3d); color: #fff; }
.un-btn.top { background: linear-gradient(135deg, #ffb340, #ff6a3d); color: #fff; }
.bs-hero, .bs-now {
  display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border-radius: 14px; font-size: 14px; line-height: 1.4;
  background: color-mix(in srgb, #ff8a3d 13%, var(--sheet-bg)); color: var(--text2);
}
.bs-hero .ic, .bs-now .ic { width: 20px; height: 20px; color: #ff7a35; flex: none; }
.bs-now { padding: 10px 14px; font-weight: 600; }
.bs-hours { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.bs-hours button {
  display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 10px 2px; border-radius: 14px;
  background: var(--card); border: 2px solid transparent; transition: border-color .15s, background .15s;
}
.bs-hours button b { font-size: 16px; font-weight: 700; }
.bs-hours button span { font-size: 12px; color: var(--hint); white-space: nowrap; }
.bs-hours button.on { border-color: #ff8a3d; background: color-mix(in srgb, #ff8a3d 10%, var(--card)); }
.bs-hours button:active { transform: scale(.96); }
[data-bs-go] .ic, [data-mk-boost] .ic, [data-un-boost] .ic, [data-g-boost] .ic { width: 20px; height: 20px; }