/* ═══════════════════════════════════════════════════════════
   👩 МОЯТ ПРОФИЛ — екранът зад бутона в долната навигация
   ═══════════════════════════════════════════════════════════ */
.prof-overlay {
  position: fixed; inset: 0; z-index: 240;
  background: rgba(38, 24, 60, .45); backdrop-filter: blur(4px);
  display: flex; justify-content: center; align-items: flex-start;
  overflow-y: auto; padding: 14px 10px 90px; animation: profIn .22s ease;
}
/* 27.10 · ЗАКОНЪТ ЗА СКРИТИЯ ТАБ (комит 25f85ec): профилът е ЦЯЛ ЕКРАН (fixed, inset 0, z 240) — замръзне ли входът
   на първия кадър (скрит таб/headless), щеше да е НЕВИДИМ слой, който спира всеки допир (и крие .prof-box вътре).
   Затова от .4, не от 0. ПЪТ НАЗАД: върни „opacity: 0“. */
@keyframes profIn { from { opacity: .4; } to { opacity: 1; } }
.prof-box {
  position: relative; width: 100%; max-width: 520px;
  background: #fffdfa; border-radius: 22px; padding: 18px 16px 22px;
  box-shadow: 0 18px 60px rgba(60, 30, 90, .35);
  animation: profUp .26s ease;
}
@keyframes profUp { from { transform: translateY(26px); opacity: .4; } to { transform: none; opacity: 1; } }
.prof-close {
  position: absolute; top: 10px; right: 10px; z-index: 2;
  width: 38px; height: 38px; border-radius: 50%; border: 0; cursor: pointer;
  background: rgba(0,0,0,.06); font-size: 17px; line-height: 1;
}
.prof-close:hover { background: rgba(0,0,0,.12); }

/* гербът */
.prof-hero { text-align: center; padding: 12px 6px 14px; }
.prof-big { font-size: 54px; line-height: 1; display: inline-block; border: 0; background: none; }
.prof-avbtn { cursor: pointer; transition: transform .15s; }
.prof-avbtn:hover { transform: scale(1.12) rotate(-6deg); }
.prof-hero h3, .prof-name { margin: 8px 0 2px; font-size: 22px; }
.prof-sub { margin: 0; font-size: 13.5px; color: var(--ink-soft); }
/* 🔴 18.08 (жива обиколка на таба „Вход/Профил“, ИЗМЕРЕНО в тъмна тема):
   бутонът няма `color`, значи взема системното на <button> — ЧЕРНО. Върху
   тъмния панел (rgb(36,29,56)) при opacity .5 това е контраст 1.31:1.
   ✏️ оцелява само защото е цветно емоджи; близнакът му .prof-gx е обикновен
   знак „×“ и там измерихме 1.18:1 — тоест невидим бутон.
   ПЪТ НАЗАД: махни `color: inherit` от двата реда. */
.prof-edit { border: 0; background: none; cursor: pointer; font-size: 14px; opacity: .6; color: inherit; }
.prof-edit:hover { opacity: 1; }
.prof-hero-guest p { max-width: 340px; margin: 6px auto 0; font-size: 14px; line-height: 1.55; }

/* картите */
.prof-card {
  background: #fff; border: 1px solid rgba(125, 107, 189, .16);
  border-radius: 16px; padding: 14px; margin: 10px 0;
  box-shadow: 0 3px 14px rgba(90, 60, 130, .06);
}
.prof-h { margin: 0 0 10px; font-size: 15.5px; }
.prof-hsub { font-size: 12px; font-weight: 400; color: var(--ink-soft); margin-left: 4px; }
.prof-note { font-size: 12.5px; color: var(--ink-soft); line-height: 1.5; margin: 8px 0 0; }
.prof-err { color: #c0392b; font-size: 13px; margin: 6px 0 0; min-height: 16px; }
.prof-legal { font-size: 11.5px; color: var(--ink-soft); text-align: center; margin: 14px 4px 0; line-height: 1.5; }

/* вход и регистрация */
.prof-inp {
  width: 100%; padding: 11px 13px; border-radius: 12px;
  border: 1.5px solid rgba(125,107,189,.3); font: inherit; font-size: 15px;
}
.prof-inp:focus { outline: none; border-color: #7d6bbd; }
.prof-avgrid { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.prof-av {
  width: 44px; height: 44px; border-radius: 50%; font-size: 22px; cursor: pointer;
  border: 2px solid transparent; background: rgba(125,107,189,.08);
}
.prof-av.on { border-color: #7d6bbd; background: rgba(125,107,189,.18); transform: scale(1.08); }
.prof-cta {
  display: block; width: 100%; margin-top: 12px; padding: 13px;
  border: 0; border-radius: 14px; cursor: pointer; text-align: center;
  background: linear-gradient(135deg, #7d68c8, #5f4aa8); color: #fff;
  font: inherit; font-size: 15.5px; font-weight: 700;
  box-shadow: 0 6px 18px rgba(110, 89, 181, .35);
}
.prof-cta:hover { filter: brightness(1.06); }
/* 5.11: светлият край на градиента бе 2.4:1 срещу белия текст — под прага. Потъмнено. */
.prof-cta2 { background: linear-gradient(135deg, #2d8a76, #256b5c); box-shadow: 0 6px 18px rgba(37,107,92,.3); }

/* нивото */
.prof-lvlrow { display: flex; gap: 12px; align-items: center; }
.prof-lvle { font-size: 40px; line-height: 1; }
.prof-lvlmid { flex: 1; }
.prof-lvln { margin: 0 0 6px; font-weight: 800; font-size: 15px; }
.prof-lvlxp { margin: 6px 0 0; font-size: 11.5px; color: var(--ink-soft); }
.prof-bar { height: 10px; border-radius: 999px; background: rgba(125,107,189,.14); overflow: hidden; }
.prof-fill {
  display: block; height: 100%; border-radius: 999px; min-width: 4px;
  background: linear-gradient(90deg, #f8b3d0, #8d78d8);
  /* проход 4: налива се отляво с transform (мъртвият width-преход не се задействаше,
     а width е layout — извън железните правила). pgbGrow е дефиниран в mega.css. */
  transform-origin: left;
  animation: pgbGrow .6s var(--bl-ease-out);
}
@media (prefers-reduced-motion: reduce) { .prof-fill { animation: none; } }

/* целите */
.prof-goal { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px dashed rgba(0,0,0,.07); }
.prof-goal.done { opacity: .85; }
.prof-goal.done .prof-fill { background: linear-gradient(90deg, #7ddba3, #3d9682); }
.prof-ge { font-size: 22px; }
.prof-gmid { flex: 1; }
.prof-gn { margin: 0 0 5px; font-size: 13.5px; font-weight: 600; }
.prof-gp { font-size: 13px; font-weight: 800; min-width: 34px; text-align: center; }
/* 🔴 18.08: същият дефект като .prof-edit, но тук боли истински — „ד е
   обикновен знак, не емоджи. Измерено в тъмна тема: черно (0,0,0) при
   opacity .35 върху картата (43,35,68) → ефективен (28,23,44), контраст
   1.18:1. Майката вижда цел, която не може да махне.
   `color: inherit` сам НЕ стига: при opacity .35 светлото мастило върху
   картата дава 2.82:1 — пак под прага. Затова и opacity .35 → .6 (стойност,
   която екранът вече ползва за .prof-hsub и <small>).
   ⚠️ ЧЕСТНО СЛЕД ПОПРАВКАТА, ИЗМЕРЕНО: тъмна тема 1.18 → НАД 4.5 ✅;
   СВЕТЛА тема 2.43 → 2.80, тоест ВСЕ ОЩЕ под 4.5. Не е недовършена
   поправка, а обща черта на екрана: в светла тема 115 от 203 текста са
   под прага заради opacity .55–.72 на цялата второстепенна типография
   (.prof-note, .prof-sub, .prof-mn, .prof-wlbl, .prof-legal…). Това е
   въпрос за собственика, не за един бутон. Уникалното тук — черно върху
   черно — е затворено.
   ПЪТ НАЗАД: върни opacity на .35 (и .5 за .prof-edit) и махни color. */
.prof-gx { border: 0; background: none; cursor: pointer; opacity: .6; font-size: 16px; color: inherit; }
.prof-gx:hover { opacity: 1; color: #c0392b; }
.prof-gmenu { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.prof-gadd {
  padding: 7px 11px; border-radius: 999px; cursor: pointer; font: inherit; font-size: 12.5px;
  border: 1.5px dashed rgba(125,107,189,.4); background: rgba(125,107,189,.05);
}
.prof-gadd:hover { background: rgba(125,107,189,.14); border-style: solid; }

/* наградите */
.prof-stgrid { display: flex; flex-wrap: wrap; gap: 7px; }
.prof-st {
  width: 42px; height: 42px; display: flex; align-items: center; justify-content: center;
  font-size: 22px; border-radius: 12px; background: linear-gradient(135deg, #fff4d6, #ffe9b8);
  border: 1px solid #efd18d; box-shadow: 0 2px 6px rgba(190,150,60,.18);
}

/* рафтът с медальончетата */
.prof-shelf { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 8px; }
.prof-medal {
  text-align: center; padding: 10px 4px 8px; border-radius: 12px;
  background: rgba(0,0,0,.03); filter: grayscale(1); opacity: .55;
}
.prof-medal.got {
  filter: none; opacity: 1;
  background: linear-gradient(160deg, #fdf3ff, #f3ecff); border: 1px solid rgba(125,107,189,.25);
}
.prof-me { font-size: 26px; display: block; }
.prof-mn { font-size: 10.5px; line-height: 1.25; display: block; margin-top: 3px; }

/* статистиките */
.prof-stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
.prof-stat { text-align: center; padding: 10px 4px; border-radius: 12px; background: rgba(125,107,189,.06); }
.prof-se { font-size: 20px; display: block; }
.prof-sn { font-size: 19px; font-weight: 800; display: block; }
.prof-sl { font-size: 10.5px; opacity: .65; display: block; }

.prof-quick { display: flex; flex-wrap: wrap; gap: 6px; }

/* тъмна тема */
[data-theme="dark"] .prof-box { background: #241d38; color: #efe9ff; }
[data-theme="dark"] .prof-card { background: #2b2344; border-color: rgba(255,255,255,.09); box-shadow: none; }
[data-theme="dark"] .prof-close { background: rgba(255,255,255,.1); color: #efe9ff; }
[data-theme="dark"] .prof-inp { background: #1d1730; color: #efe9ff; border-color: rgba(255,255,255,.2); }
[data-theme="dark"] .prof-av { background: rgba(255,255,255,.08); }
[data-theme="dark"] .prof-gadd { border-color: rgba(255,255,255,.28); background: rgba(255,255,255,.05); color: #efe9ff; }
[data-theme="dark"] .prof-goal { border-bottom-color: rgba(255,255,255,.12); }
[data-theme="dark"] .prof-bar { background: rgba(255,255,255,.12); }
[data-theme="dark"] .prof-medal { background: rgba(255,255,255,.05); }
[data-theme="dark"] .prof-medal.got { background: rgba(141,120,216,.2); border-color: rgba(255,255,255,.15); }
[data-theme="dark"] .prof-stat { background: rgba(255,255,255,.06); }
[data-theme="dark"] .prof-st { background: rgba(255,220,130,.15); border-color: rgba(255,220,130,.3); }

@media (max-width: 420px) {
  .prof-shelf { grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); }
  .prof-big { font-size: 46px; }
}

/* ── v3: аватар-табове + снимка ── */
.prof-avwrap { margin: -4px 0 10px; }
.prof-avtabs { display: flex; gap: 6px; margin-bottom: 8px; flex-wrap: wrap; justify-content: center; }
.prof-avtab { padding: 6px 12px; border-radius: 999px; border: 1.5px solid rgba(125,107,189,.3);
  background: transparent; font: inherit; font-size: 12.5px; cursor: pointer; }
.prof-avtab.on { background: #7d6bbd; color: #fff; border-color: #7d6bbd; }
.prof-photo { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; display: inline-block;
  border: 3px solid #cbbcf5; }
.prof-big.prof-photo { width: 72px; height: 72px; }
.bn-ava img { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; display: block; margin: 0 auto; }

/* ── v3: „Днес при теб“ — кръгът ── */
.prof-todayrow { display: flex; gap: 14px; align-items: center; }
.prof-ring { width: 84px; height: 84px; flex-shrink: 0; }
.prof-ringbg { fill: none; stroke: rgba(125,107,189,.15); stroke-width: 7; }
.prof-ringfill { fill: none; stroke: url(#profGrad), #8d78d8; stroke: #8d78d8; stroke-width: 7;
  stroke-linecap: round; transform: rotate(-90deg); transform-origin: 38px 38px; transition: stroke-dashoffset .6s ease; }
.prof-ringtxt { font-size: 15px; font-weight: 800; text-anchor: middle; fill: currentColor; }
.prof-todaylist { display: flex; flex-wrap: wrap; gap: 5px; }
.prof-tditem { font-size: 11.5px; padding: 4px 9px; border-radius: 999px;
  background: rgba(0,0,0,.045); opacity: .55; }
.prof-tditem.on { background: rgba(125,189,140,.18); opacity: 1; font-weight: 600; }
.prof-daycnt { margin: 10px 0 0; font-size: 13px; font-weight: 600; }

/* ── v3: серията ── */
.prof-strow { display: flex; gap: 10px; }
.prof-stbox { flex: 1; text-align: center; padding: 12px 6px; border-radius: 14px;
  background: linear-gradient(160deg, rgba(255,150,80,.1), rgba(255,80,80,.06)); }
.prof-stn { display: block; font-size: 22px; font-weight: 800; }
.prof-stl { display: block; font-size: 11px; opacity: .65; margin-top: 2px; }

/* ── v3: седмицата ── */
.prof-week { display: flex; justify-content: space-between; gap: 4px; }
.prof-wday { text-align: center; flex: 1; }
.prof-wdot { display: block; width: 26px; height: 26px; margin: 0 auto; border-radius: 50%;
  background: rgba(0,0,0,.07); }
.prof-wdot.w1 { background: #cbbcf5; }
.prof-wdot.w2 { background: #9b85e0; }
.prof-wdot.w3 { background: #6e59b5; }
.prof-wdot.wt { outline: 2px solid #8d78d8; outline-offset: 2px; }
.prof-wlbl { font-size: 10px; color: var(--ink-soft); display: block; margin-top: 4px; }

/* ── v3: семейството ── */
.prof-fam { display: flex; align-items: center; gap: 10px; padding: 8px 0;
  border-bottom: 1px dashed rgba(0,0,0,.07); }
.prof-fame { font-size: 26px; }
.prof-fammid { flex: 1; }
.prof-fammid strong { display: block; font-size: 14.5px; }
.prof-fammid small { font-size: 11.5px; color: var(--ink-soft); }

/* v3 тъмна тема */
[data-theme="dark"] .prof-avtab { border-color: rgba(255,255,255,.25); color: #efe9ff; }
[data-theme="dark"] .prof-tditem { background: rgba(255,255,255,.07); }
[data-theme="dark"] .prof-tditem.on { background: rgba(125,189,140,.25); }
[data-theme="dark"] .prof-wdot { background: rgba(255,255,255,.1); }
[data-theme="dark"] .prof-fam { border-bottom-color: rgba(255,255,255,.12); }
[data-theme="dark"] .prof-stbox { background: rgba(255,150,80,.13); }

/* 💾 качването на копие ВЪТРЕ в „Данните ти“ (18.08).
   Секцията идва от същата функция като екрана за гост, но там е самостоятелна
   карта. Тук е вложена в карта — затова ѝ се маха рамката, за да не изглежда
   като карта в карта. ПЪТ НАЗАД: махни това правило и реда, който слага класа
   в js/profile.js (кач.className = 'prof-inline'). */
.prof-inline { display: block; margin: 8px 0 0; padding: 0; background: none; border: none; box-shadow: none; }
.prof-inline .prof-cta { margin-top: 0; }