/* Профиль, кошелёк, адреса, уведомления, рефералка. */

/* ==================== КАРТОЧКА ПОЛЬЗОВАТЕЛЯ ==================== */

.pf-user { display: flex; gap: var(--sp-4); align-items: center; }
.pf-user__name {
  font-size: var(--fs-h2);
  font-weight: 750;
  letter-spacing: -0.025em;
  line-height: 1.2;
}

/* ==================== БАЛАНС ==================== */

.pf-balance {
  padding: var(--sp-5);
  border-radius: var(--r-xl);
  background: var(--accent-grad);
  color: #fff;
  box-shadow: var(--shadow-brand);
  cursor: pointer;
  transition: transform var(--t-fast) var(--ease-spring);
  position: relative;
  overflow: hidden;
}
.pf-balance:active { transform: scale(.985); }
.pf-balance--static { cursor: default; }
.pf-balance--static:active { transform: none; }
/* Мягкий блик в углу — карточка баланса должна выглядеть дороже остальных. */
.pf-balance::after {
  content: '';
  position: absolute;
  top: -60%; right: -25%;
  width: 220px; height: 220px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .14);
  pointer-events: none;
}
.pf-balance__label { font-size: var(--fs-sm); opacity: .85; font-weight: 600; }
.pf-balance__sum {
  font-size: 38px;
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.1;
  margin-top: 4px;
}
.pf-balance__frozen {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: var(--sp-2);
  padding: 4px 10px;
  border-radius: var(--r-full);
  background: rgba(255, 255, 255, .18);
  font-size: var(--fs-xs);
  font-weight: 650;
}
.pf-balance__btn {
  background: rgba(255, 255, 255, .22);
  color: #fff;
  backdrop-filter: blur(6px);
}
.pf-balance__btn--ghost { background: rgba(255, 255, 255, .12); }

/* ==================== БЫСТРЫЕ ПЛИТКИ ==================== */

.pf-tiles {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-3);
  margin-top: var(--sp-4);
}
.pf-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--sp-2);
  padding: var(--sp-4);
  min-height: 92px;
  border-radius: var(--r-lg);
  background: var(--surface);
  border: 1px solid var(--border);
  text-align: left;
  transition: transform var(--t-fast) var(--ease-spring);
}
.pf-tile:active { transform: scale(.96); }
.pf-tile__icon {
  width: 38px; height: 38px;
  border-radius: var(--r-sm);
  display: grid;
  place-items: center;
  background: var(--brand-soft);
  color: var(--brand-text);
}
.pf-tile__label { font-size: var(--fs-sm); font-weight: 650; }
.pf-tile__value {
  position: absolute;
  top: var(--sp-3); right: var(--sp-3);
  min-width: 22px; height: 22px;
  padding: 0 6px;
  border-radius: var(--r-full);
  background: var(--brand);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  display: grid;
  place-items: center;
}

/* ==================== ПРОДАВЕЦ / ПРИГЛАШЕНИЕ ==================== */

.pf-shop {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin-top: var(--sp-4);
  cursor: pointer;
  transition: transform var(--t-fast) var(--ease-spring);
}
.pf-shop:active { transform: scale(.985); }

.pf-become {
  margin-top: var(--sp-4);
  padding: var(--sp-5);
  border-radius: var(--r-xl);
  background: var(--accent-grad-soft);
  border: 1px solid var(--brand-soft-2);
  text-align: center;
}
.pf-become__art {
  width: 60px; height: 60px;
  margin: 0 auto var(--sp-3);
  border-radius: var(--r-lg);
  display: grid;
  place-items: center;
  background: var(--accent-grad);
  color: #fff;
  box-shadow: var(--shadow-brand);
}
.pf-become__title { font-size: var(--fs-h2); font-weight: 750; letter-spacing: -0.025em; }
.pf-become__text {
  margin: var(--sp-2) 0 var(--sp-4);
  font-size: var(--fs-sm);
  color: var(--text-2);
  line-height: 1.5;
}

/* ==================== ПЕРЕКЛЮЧАТЕЛЬ ТЕМЫ ==================== */

.pf-theme {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-2);
}
.pf-theme__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 76px;
  border-radius: var(--r-md);
  background: var(--surface-2);
  color: var(--text-muted);
  border: 1.5px solid transparent;
  transition: all var(--t-base) var(--ease-out);
}
.pf-theme__item.is-active {
  background: var(--brand-soft);
  border-color: var(--brand);
  color: var(--brand-text);
}
.pf-theme__item:active { transform: scale(.95); }

/* ==================== КОШЕЛЁК ==================== */

/* Переключатель валюты на карточке баланса: маленький, в углу — он не
   действие, а пометка «в чём смотрим». */
.wallet-cur {
  position: absolute;
  top: var(--sp-4);
  right: var(--sp-4);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px;
  border-radius: var(--r-full);
  background: rgba(255, 255, 255, .18);
  color: #fff;
  font: inherit;
  cursor: pointer;
}
.wallet-cur:active { background: rgba(255, 255, 255, .28); }

.wallet-input {
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -0.03em;
  text-align: center;
  font-variant-numeric: tabular-nums;
  min-height: 62px;
}

.tx-row {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-3) 0;
  border-bottom: 1px solid var(--border);
}
.tx-row__icon {
  width: 38px; height: 38px;
  border-radius: var(--r-sm);
  display: grid;
  place-items: center;
  flex: none;
}
.tx-row__icon--success { background: var(--success-bg); color: var(--success-500); }
.tx-row__icon--info { background: var(--info-bg); color: var(--info-500); }
.tx-row__icon--warning { background: var(--warning-bg); color: var(--warning-500); }
.tx-row__icon--brand { background: var(--brand-soft); color: var(--brand-text); }
.tx-row__icon--muted { background: var(--surface-2); color: var(--text-muted); }
.tx-row__sum {
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  flex: none;
  white-space: nowrap;
}
.tx-row__sum.is-plus { color: var(--success-500); }

/* ==================== АДРЕСА ==================== */

.addr--default { border-color: var(--brand-soft-2); }

/* ==================== УВЕДОМЛЕНИЯ ==================== */

.notif {
  display: flex;
  gap: var(--sp-3);
  align-items: flex-start;
  padding: var(--sp-3) 0;
  border-bottom: 1px solid var(--border);
  position: relative;
  transition: background var(--t-fast) linear;
}
.notif:active { background: var(--surface-2); }
.notif__icon {
  width: 38px; height: 38px;
  border-radius: var(--r-sm);
  display: grid;
  place-items: center;
  flex: none;
}
.notif__icon--brand { background: var(--brand-soft); color: var(--brand-text); }
.notif__icon--success { background: var(--success-bg); color: var(--success-500); }
.notif__icon--warning { background: var(--warning-bg); color: var(--warning-500); }
.notif__icon--info { background: var(--info-bg); color: var(--info-500); }
.notif__icon--muted { background: var(--surface-2); color: var(--text-muted); }
.notif__dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--brand);
  flex: none;
  margin-top: 6px;
}
.notif.is-new .strong { color: var(--text); }

/* ==================== РЕФЕРАЛКА ==================== */

.ref-card {
  padding: var(--sp-5);
  border-radius: var(--r-xl);
  background: var(--accent-grad);
  color: #fff;
  box-shadow: var(--shadow-brand);
  text-align: center;
  position: relative;
  overflow: hidden;
}
.ref-card::after {
  content: '';
  position: absolute;
  bottom: -50%; left: -20%;
  width: 240px; height: 240px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .12);
  pointer-events: none;
}
.ref-card__label { font-size: var(--fs-sm); opacity: .85; font-weight: 600; }
.ref-card__code {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-3);
  margin: var(--sp-3) 0;
  padding: var(--sp-3) var(--sp-5);
  border-radius: var(--r-lg);
  background: rgba(255, 255, 255, .2);
  color: #fff;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: .08em;
  transition: transform var(--t-fast) var(--ease-spring);
}
.ref-card__code:active { transform: scale(.95); }
.ref-card__text {
  font-size: var(--fs-sm);
  line-height: 1.5;
  opacity: .92;
  margin-bottom: var(--sp-2);
  position: relative;
}
/* Правила бонусов — мельче основного обещания, но тем же белым: на
   фиолетовой карточке серый «muted» не читается. */
.ref-card__rules {
  font-size: var(--fs-xs);
  line-height: 1.45;
  opacity: .78;
  margin-bottom: var(--sp-4);
  position: relative;
}
.ref-card__share {
  background: #fff;
  color: var(--brand-600);
  position: relative;
}