/* profile.css — стили профиля ФлипЛайн */

.profile-body { overflow-y:auto; padding:8px 22px max(26px, env(safe-area-inset-bottom)); width:100%; margin:0 auto; flex:1;
  scrollbar-width:thin; scrollbar-color:rgba(255,255,255,0.2) transparent; }
.profile-body::-webkit-scrollbar { width:5px; }
.profile-body::-webkit-scrollbar-thumb { background:rgba(255,255,255,0.2); border-radius:3px; }

/* шапка */
.profile-head { display:flex; flex-direction:column; align-items:center; gap:9px; padding:6px 0 18px; }
.avatar-wrap { width:76px; height:76px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, #6d28d9, #4338ca); border:2px solid rgba(255,255,255,0.14);
  box-shadow:0 8px 24px -8px rgba(109,40,217,0.5), inset 0 1px 0 rgba(255,255,255,0.15); font-size:36px;
  cursor:pointer; transition:transform 0.2s; }
.avatar-wrap:hover { transform:scale(1.05); }
.avatar-letter { font-size:32px; font-weight:800; color:#fff; }
.avatar-emoji { font-size:36px; }
.avatar-default-ic { width:40px; height:40px; fill:rgba(255,255,255,0.9); }
.profile-name { font-size:21px; font-weight:800; color:#fff; max-width:100%; text-align:center; }
.profile-name-input { font-size:21px; font-weight:800; color:#fff; background:rgba(255,255,255,0.06);
  border:1px solid rgba(109,40,217,0.4); border-radius:10px; padding:6px 14px; text-align:center; outline:none;
  max-width:260px; font-family:inherit; }
.profile-name-input:focus { border-color:#6d28d9; box-shadow:0 0 0 3px rgba(109,40,217,0.2); }
.edit-btn { padding:7px 16px; border-radius:999px; background:rgba(255,255,255,0.05);
  border:1px solid rgba(255,255,255,0.12); color:#94a3b8; font-size:12px; font-weight:600; cursor:pointer; transition:all 0.2s; }
.edit-btn:hover { background:rgba(255,255,255,0.08); color:#cbd5e1; }

/* секции-карточки */
.ps-card { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.07);
  border-radius:16px; padding:14px 16px; margin-bottom:12px; }
.ps-title { display:flex; align-items:center; gap:7px; font-size:12px; font-weight:700; color:#94a3b8;
  text-transform:uppercase; letter-spacing:0.04em; margin-bottom:11px; }
.ps-title .ic { width:15px; height:15px; color:#94a3b8; }
.ps-hint { margin-left:auto; font-size:10px; color:#64748b; text-transform:none; font-weight:500; }

/* чипы лайков/блоков */
.sub-list { display:flex; flex-wrap:wrap; gap:7px; }
.liked-sub { display:inline-flex; align-items:center; gap:5px; padding:5px 11px; border-radius:999px;
  font-size:11.5px; background:rgba(255,255,255,0.04); border:1px solid var(--cat); color:#cbd5e1; }
.liked-sub b { color:var(--cat); font-size:11px; }
.block-sub { display:inline-flex; align-items:center; gap:5px; padding:5px 10px; border-radius:999px;
  font-size:11.5px; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); color:#94a3b8;
  cursor:pointer; transition:all 0.2s; }
.block-sub:hover { background:rgba(248,113,113,0.1); border-color:rgba(248,113,113,0.3); color:#cbd5e1; }
.block-sub .ic { width:12px; height:12px; }

/* история — фиксированные карточки, текст не заезжает */
.history-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:10px; }
.hist-item { border-radius:12px; overflow:hidden; cursor:pointer;
  border:1px solid rgba(255,255,255,0.07); background:rgba(255,255,255,0.025);
  transition:transform 0.2s, border-color 0.2s; display:flex; flex-direction:column; }
.hist-item:hover { transform:translateY(-2px); border-color:var(--cat); }
.hist-item:active { transform:scale(0.96); }
.hist-thumb { width:100%; aspect-ratio:16/10; overflow:hidden; position:relative; background:#050508; flex-shrink:0; }
.hist-thumb img { width:100%; height:100%; object-fit:cover; }
.hist-ph { width:100%; height:100%; display:flex; align-items:center; justify-content:center; }
.hist-emoji { font-size:28px; opacity:0.85; filter:drop-shadow(0 2px 8px rgba(0,0,0,0.5)); }
.hist-title { padding:9px 11px 10px; font-size:12px; line-height:1.4; color:#cbd5e1;
  overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical;
  word-break:break-word; }
.empty { color:#64748b; font-size:12px; padding:8px 4px; }

/* реклама — спокойная */
.ad-btn { width:100%; display:flex; align-items:center; justify-content:center; gap:8px; padding:13px;
  border-radius:14px; background:rgba(109,40,217,0.25); color:#c4b5fd; font-size:13px; font-weight:600;
  border:1px solid rgba(109,40,217,0.3); cursor:pointer; transition:all 0.2s; margin-bottom:12px; }
.ad-btn:hover { background:rgba(109,40,217,0.35); color:#ddd6fe; }
.ad-btn:active { transform:scale(0.98); }
.ad-btn .ic { width:18px; height:18px; }

/* QR-код MAX в модалке рекламы */
.ad-qr-wrap { display:flex; flex-direction:column; align-items:center; gap:8px; margin-top:6px;
  padding:14px; border-radius:14px; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06); }
.ad-qr-label { font-size:11px; color:#94a3b8; text-transform:uppercase; letter-spacing:0.05em; }
.ad-qr-img { width:140px; height:140px; border-radius:12px; border:3px solid rgba(255,255,255,0.1); }

/* иконка的广告-контакт как ссылка */
.ad-contact { text-decoration:none; color:#cbd5e1; transition:all 0.2s; }
.ad-contact:hover { background:rgba(109,40,217,0.15); border-color:rgba(109,40,217,0.3); }