/* ═══════════════════════════════════════════════════
   VARIABLES & RESET
═══════════════════════════════════════════════════ */
:root{
  --bg:#0c0f17;--bg2:#121724;--bg3:#171c28;
  --card:#171c28;--card2:#1f2432;
  --accent:#56ccf2;--accent2:#2bc5ba;--accent3:#4ade80;
  --green:#4ade80;--yellow:#facc15;--red:#f87171;--grey:rgba(255,255,255,0.2);
  --text:#f3f6fb;--text2:#8fa2b7;--text3:#64748b;
  --border:rgba(255,255,255,0.06);--border-accent:rgba(86,204,242,0.12);
  --shadow:0 16px 40px rgba(0,0,0,0.35);
  --radius:20px;--radius-sm:12px;
  --font:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --tg-color-scheme:dark;
  /* Адаптивность: отступы и ширина подстраиваются под экран */
  --pad-h:clamp(10px,3vw,16px);
  --pad-v:clamp(10px,2vh,16px);
  --nav-bottom:clamp(70px,12vh,90px);
  --app-max-w:min(100vw,480px);
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{height:100%;-webkit-text-size-adjust:100%}
html,body{min-height:100%;height:100%;overflow:hidden;background:var(--bg2);color:var(--text);font-family:var(--font)}
body{display:flex;flex-direction:column;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}

/* ═══════════════════════════════════════════════════
   SCROLL
═══════════════════════════════════════════════════ */
::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}

/* ═══════════════════════════════════════════════════
   LAYOUT
═══════════════════════════════════════════════════ */
#app{display:flex;flex-direction:column;width:100%;max-width:var(--app-max-w);min-height:100vh;min-height:100dvh;height:100vh;margin:0 auto;position:relative}
.screen{display:none;flex:1;flex-direction:column;min-height:0;min-width:0;overflow:hidden;background:var(--bg2)}
.screen.active{display:flex}
.screen-scroll{flex:1;min-height:0;overflow-y:auto;padding-bottom:var(--nav-bottom);width:100%;box-sizing:border-box}

/* ═══════════════════════════════════════════════════
   BOTTOM NAV
═══════════════════════════════════════════════════ */
.nav{flex-shrink:0;width:100%;max-width:var(--app-max-w);margin:0 auto;background:var(--bg2);border-top:1px solid var(--border);display:flex;z-index:100;
  padding-bottom:max(8px,env(safe-area-inset-bottom,0));overflow:hidden}
.nav-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:12px 4px;cursor:pointer;transition:all .2s;color:var(--text3);min-height:56px}
.nav-item.active{color:var(--accent)}
.nav-item:active{opacity:.7;transform:scale(.95)}
.nav-icon{display:flex;align-items:center;justify-content:center;line-height:0}
.nav-icon-svg{width:28px;height:28px;color:inherit}
.nav-icon-svg svg{width:100%;height:100%;stroke:currentColor}

/* FAB */
.fab{position:fixed;right:max(var(--pad-h),20px);bottom:calc(var(--nav-bottom) - 8px);width:clamp(44px,10vw,52px);height:clamp(44px,10vw,52px);border-radius:50%;
  background:linear-gradient(135deg,#56ccf2,#2bc5ba);border:none;
  color:#0d1320;font-size:22px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;box-shadow:0 4px 20px rgba(86,204,242,0.45);z-index:101;transition:all .2s}
.fab:active{transform:scale(.9)}

/* ═══════════════════════════════════════════════════
   CARDS
═══════════════════════════════════════════════════ */
.card{background:linear-gradient(180deg,var(--card) 0%,#0f121b 100%);border-radius:var(--radius);padding:16px;margin:12px;border:1px solid var(--border);box-shadow:var(--shadow)}
.card-sm{background:var(--card2);border-radius:var(--radius-sm);padding:12px;border:1px solid var(--border)}

/* ═══════════════════════════════════════════════════
   HOME SCREEN (по скелету: одна карточка дашборда + чат, без сетки)
═══════════════════════════════════════════════════ */
#screen-home.active{gap:0;flex-direction:column;overflow:hidden}
.home-scroll{flex:0 0 auto;min-height:0;overflow-y:auto;padding:0 var(--pad-h) var(--pad-v);display:flex;flex-direction:column;gap:clamp(6px,1.5vw,10px);max-height:min(28vh,220px);transition:max-height .35s ease}
.home-scroll.stats-expanded{max-height:70vh}
.stats-card{background:linear-gradient(180deg,var(--card) 0%,#0f121b 100%);border-radius:20px;
  padding:10px 14px 8px;border:1px solid var(--border-accent);box-shadow:var(--shadow);flex-shrink:0;position:relative}
.stats-top{display:flex;gap:10px;align-items:flex-start;position:relative;padding-right:0}
.stats-top-left{display:flex;gap:10px;align-items:center;flex:1;min-width:0;padding-right:82px}
.stats-limits{position:absolute;top:0;right:0;margin-top:-2px;z-index:2}
.stats-limits .limits-btn{display:inline-flex;align-items:center;gap:4px;background:var(--card2);border:1px solid var(--border);border-radius:16px;padding:5px 10px;font-size:11px;font-weight:700;color:var(--accent);cursor:pointer;text-decoration:none;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.stats-limits .limits-btn:active{opacity:.85}
.stats-limits .limits-btn-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.stats-limits .limits-btn-icon svg{width:14px;height:14px;stroke:currentColor;color:var(--accent)}
.stats-limits .limits-sep{opacity:.7;user-select:none}
.chat-header-icon-svg{display:inline-flex;align-items:center;justify-content:center;padding:4px}
.chat-header-icon-svg svg{width:20px;height:20px;stroke:currentColor;color:inherit}
.reward-badges-wrap{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.reward-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;background:linear-gradient(135deg,rgba(86,204,242,0.2),rgba(43,197,186,0.15));border:1px solid rgba(86,204,242,0.35);border-radius:12px;font-size:11px;font-weight:700;color:var(--accent);cursor:pointer}
.reward-badge.hidden{display:none}
.reward-badge-achievement{gap:8px;padding:6px 9px;background:linear-gradient(135deg,rgba(255,215,102,0.22),rgba(255,184,77,0.14));border-color:rgba(255,199,95,0.38);color:#f5c25b;box-shadow:0 4px 14px rgba(255,184,77,0.08)}
.reward-badge-icon{width:24px;height:24px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,0.08);font-size:14px;line-height:1;flex-shrink:0}
.reward-badge-copy{display:flex;flex-direction:column;min-width:0;line-height:1.05}
.reward-badge-title{font-size:9px;letter-spacing:.04em;text-transform:uppercase;color:rgba(255,245,214,0.72);font-weight:800}
.reward-badge-subtitle{font-size:11px;font-weight:700;color:#ffe3a3;white-space:nowrap}
.reward-badge-water{gap:8px;padding:6px 9px;background:linear-gradient(135deg,rgba(66,153,225,0.22),rgba(49,130,206,0.14));border-color:rgba(66,153,225,0.38);color:#79d7ff;box-shadow:0 4px 14px rgba(66,153,225,0.08)}
.reward-badge-water .reward-badge-title{color:rgba(217,241,255,0.72)}
.reward-badge-water .reward-badge-subtitle{color:#bfe7ff}

/* Линейка наград (6 бейджей) — не достигнутые затемнены, при прогрессе набирают цвет, при достижении — полный цвет */
.rewards-row-wrap{margin-top:8px;width:100%;box-sizing:border-box}
.rewards-row{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;padding:2px 0}
.rewards-row::-webkit-scrollbar{display:none}
.reward-badge-item{flex-shrink:0;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;border:none;overflow:hidden;transition:opacity .25s ease,transform .15s,filter .25s ease}
.reward-badge-item:active{transform:scale(0.95)}
.reward-badge-item .reward-badge-emoji{position:relative;z-index:2;font-size:16px;line-height:1}
.reward-badge-item .reward-badge-fill{position:absolute;inset:0;border-radius:50%;opacity:0;transition:opacity .3s ease}
/* Не достигнуты сегодня — чёрный слой с прозрачностью поверх бейджа */
.reward-badge-item.inactive{position:relative;opacity:1}
.reward-badge-item.inactive::after{content:'';position:absolute;inset:0;border-radius:50%;background:rgba(0,0,0,.6);z-index:3;pointer-events:none}
.reward-badge-item.inactive .reward-badge-fill{opacity:0}
/* В процессе — постепенно набирают цвет по мере приближения к цели */
.reward-badge-item.progress{opacity:1;background:rgba(255,255,255,.06);filter:none}
.reward-badge-item.progress .reward-badge-fill{opacity:calc(var(--reward-fill,0) / 100)}
/* Достигнуты — полный цвет */
.reward-badge-item.active{opacity:1;background:transparent;filter:none}
.reward-badge-item.active .reward-badge-fill{opacity:1}
.reward-badge-item.active.reward-badge-pulse{animation:reward-badge-pulse .6s ease-out}
.reward-badge-item.reward-badge-salad-half.active{opacity:.65;filter:saturate(0.85)}
@keyframes reward-badge-pulse{0%{opacity:.9}50%{opacity:1}100%{opacity:1}}
.reward-badge-item[data-key="healthy_day"].progress .reward-badge-fill,.reward-badge-item[data-key="healthy_day"].active .reward-badge-fill{background:radial-gradient(circle at 50% 50%,rgba(74,222,128,.4) 0%,transparent 70%)}
.reward-badge-item[data-key="meal_filled"].progress .reward-badge-fill,.reward-badge-item[data-key="meal_filled"].active .reward-badge-fill{background:radial-gradient(circle at 50% 50%,rgba(239,68,68,.35) 0%,transparent 70%)}
.reward-badge-item[data-key="protein_champ"].progress .reward-badge-fill,.reward-badge-item[data-key="protein_champ"].active .reward-badge-fill{background:radial-gradient(circle at 50% 50%,rgba(255,184,77,.4) 0%,transparent 70%)}
.reward-badge-item[data-key="macro_balance"].progress .reward-badge-fill,.reward-badge-item[data-key="macro_balance"].active .reward-badge-fill{background:radial-gradient(circle at 50% 50%,rgba(168,85,247,.35) 0%,transparent 70%)}
.reward-badge-item[data-key="water_balance"].progress .reward-badge-fill,.reward-badge-item[data-key="water_balance"].active .reward-badge-fill{background:radial-gradient(circle at 50% 50%,rgba(66,153,225,.4) 0%,transparent 70%)}
.reward-badge-item[data-key="activity"].progress .reward-badge-fill,.reward-badge-item[data-key="activity"].active .reward-badge-fill{background:radial-gradient(circle at 50% 50%,rgba(56,189,248,.4) 0%,transparent 70%)}
.reward-badge-item[data-key="calories"].progress .reward-badge-fill,.reward-badge-item[data-key="calories"].active .reward-badge-fill{background:radial-gradient(circle at 50% 50%,rgba(249,115,22,.4) 0%,transparent 70%)}
.reward-tooltip{position:fixed;z-index:1000;background:var(--card2);border:1px solid var(--border);border-radius:12px;padding:12px 14px;min-width:200px;max-width:260px;box-shadow:0 8px 24px rgba(0,0,0,.4);opacity:0;visibility:hidden;transform:translate(-50%,-100%) translateY(-4px);transition:opacity .2s,transform .2s,visibility .2s;pointer-events:none}
.reward-tooltip.visible{opacity:1;visibility:visible;transform:translate(-50%,-100%) translateY(0)}
.reward-tooltip-caption{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--text2);margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid var(--border)}
.reward-tooltip-title{font-size:13px;font-weight:700;color:var(--text);margin-bottom:4px;display:flex;align-items:center;gap:6px}
.reward-tooltip-for{font-size:10px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.05em;margin-bottom:2px}
.reward-tooltip-desc{font-size:12px;color:var(--text);margin-bottom:6px;line-height:1.4}
.reward-tooltip-value{font-size:12px;color:var(--text2);margin-bottom:2px}
.reward-tooltip-hint{font-size:11px;color:var(--accent);font-weight:600;margin-top:4px}

.home-ring{position:relative;width:100px;height:100px;flex-shrink:0}
.home-ring .ring-bg{position:absolute;inset:0;border-radius:50%;background:var(--card2)}
.home-ring .ring-fill{position:absolute;inset:0;border-radius:50%;transition:background .4s ease;
  background:conic-gradient(#55d8ff 0deg,#2bc5ba calc(var(--ring-deg,0) * 1deg),rgba(255,255,255,0.06) calc(var(--ring-deg,0) * 1deg) 360deg)}
.home-ring.ring-over .ring-fill{background:
  conic-gradient(rgba(255,179,193,var(--ring-over-ratio,1)) 0deg,rgba(255,107,138,var(--ring-over-ratio,1)) 120deg,rgba(232,74,111,var(--ring-over-ratio,1)) 240deg,rgba(198,40,40,var(--ring-over-ratio,1)) 360deg),
  conic-gradient(#55d8ff 0deg,#2bc5ba 360deg)}
.home-ring.ring-over-yellow .ring-fill{background:
  conic-gradient(rgba(255,213,79,.9) 0deg,rgba(255,193,7,.95) 180deg,rgba(251,176,59,.95) 360deg),
  conic-gradient(#55d8ff 0deg,#2bc5ba 360deg)}
.home-ring .ring-hole{position:absolute;width:84px;height:84px;border-radius:50%;background:var(--card);
  top:50%;left:50%;transform:translate(-50%,-50%);z-index:1}
.home-ring .ring-inner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:2;width:70px}
.home-ring .ring-inner .num{font-size:19px;font-weight:700;color:var(--text);line-height:1.2;display:block}
.home-ring .ring-inner .target{font-size:11px;color:var(--text2);display:block}
.home-ring .ring-inner .pct{font-size:13px;font-weight:700;color:var(--accent);margin-top:2px;display:block}
.home-ring.ring-over .ring-inner .num,.home-ring.ring-over .ring-inner .pct{color:#e84a6f}
.home-ring.ring-over-yellow .ring-inner .num,.home-ring.ring-over-yellow .ring-inner .pct{color:#d4a017}
.stats-info{flex:1;min-width:0}
.home-date{font-size:8px;font-weight:600;color:var(--text2);letter-spacing:.3px;text-transform:uppercase}
.home-date .day{display:block;font-size:12px;font-weight:700;color:var(--text);margin-top:1px}
.home-macros{margin-top:6px;display:flex;flex-direction:column;gap:2px}
.home-macro-row{display:flex;align-items:center;gap:4px;font-size:10px;color:var(--text2)}
.home-macro-row.over .text{color:#e84a6f;font-weight:600}
.home-macro-row.over-soft .text{color:#d4a017;font-weight:500}
.home-macro-row .icon{font-size:12px;width:16px;text-align:center}
.home-macro-row .text{color:var(--text);font-size:10px}
.stats-expand-trigger{display:flex;align-items:center;justify-content:center;padding:6px 0 2px;margin-top:4px;
  border-top:1px solid var(--border);cursor:pointer;color:var(--text2);font-size:10px}
.stats-expand-trigger .chevron{display:inline-block;font-size:10px;transition:transform .25s}
.stats-card.expanded .stats-expand-trigger .chevron{transform:rotate(180deg)}
.stats-meals-list{max-height:0;overflow:hidden;transition:max-height .35s ease}
.stats-card.expanded .stats-meals-list{max-height:55vh;overflow-y:auto;min-height:80px}
.stats-meals-list-inner{display:flex;flex-direction:column;gap:8px;padding:10px 0 6px}
.meal-item{display:flex;align-items:center;gap:10px;background:rgba(33,39,53,.7);border-radius:12px;
  padding:10px 12px;border:1px solid var(--border)}
.meal-item-content{flex:1;min-width:0}
.meal-item-name{font-size:10px;font-weight:700;color:var(--text2);text-transform:uppercase;letter-spacing:.3px;margin-bottom:4px}
.meal-item-composition{font-size:13px;font-weight:500;color:var(--text);margin-bottom:2px}
.meal-item-kbju{font-size:11px;color:rgba(255,255,255,.75)}
.meal-item.activity-item .meal-item-name{color:#79d7ff}
.meal-item.activity-item .meal-item-burned{font-size:11px;color:#f4522b;margin-top:2px}
.meal-item-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}
.meal-item-action-btn{width:36px;height:36px;border-radius:10px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;transition:opacity .2s}
.meal-item-action-btn:active{opacity:.7}
.meal-item-action-btn.delete{background:var(--card2);color:var(--text2);border:1px solid var(--border)}
.meal-item-action-btn.edit{background:rgba(86,204,242,.2);color:var(--accent);border:1px solid rgba(86,204,242,.4)}
.water-add-row{display:flex;align-items:center;gap:6px;margin-top:6px;flex-wrap:nowrap}
.water-add-row .water-total{font-size:10px;color:#79d7ff;font-weight:600;flex:1;min-width:0;white-space:nowrap}
.water-add-btn{background:rgba(121,215,255,.15);color:#79d7ff;border:1px solid rgba(121,215,255,.3);
  border-radius:12px;padding:4px 8px;font-size:10px;font-weight:700;cursor:pointer;flex-shrink:0}
.water-add-btn:active{opacity:.8}

.home-compact-kpi{display:none}

/* Compact sticky dashboard while chat is scrolling */
#screen-home.dashboard-compact .home-scroll{
  position:sticky;
  top:0;
  z-index:6;
  max-height:88px;
  overflow:visible;
  padding-bottom:6px;
  background:linear-gradient(180deg,var(--bg2) 75%,rgba(18,23,36,0));
}
#screen-home.dashboard-compact .stats-card{
  border-radius:14px;
  padding:8px 10px;
  min-height:72px;
}
#screen-home.dashboard-compact .stats-top{gap:8px}
#screen-home.dashboard-compact .stats-top-left{padding-right:70px;gap:8px;align-items:center}
#screen-home.dashboard-compact .home-ring{width:48px;height:48px}
#screen-home.dashboard-compact .home-ring .ring-hole{width:38px;height:38px}
#screen-home.dashboard-compact .home-ring .ring-inner{width:34px}
#screen-home.dashboard-compact .home-ring .ring-inner .num{font-size:11px;line-height:1.05}
#screen-home.dashboard-compact .home-ring .ring-inner .target,
#screen-home.dashboard-compact .home-ring .ring-inner .pct{display:none}
#screen-home.dashboard-compact .stats-limits .limits-btn{padding:4px 8px;font-size:10px}
#screen-home.dashboard-compact .home-date,
#screen-home.dashboard-compact .home-macros,
#screen-home.dashboard-compact .rewards-row-wrap,
#screen-home.dashboard-compact .stats-expand-trigger,
#screen-home.dashboard-compact .stats-meals-list{display:none}
#screen-home.dashboard-compact .home-compact-kpi{display:flex;flex-direction:column;gap:2px}
#screen-home.dashboard-compact .home-compact-cal{font-size:14px;font-weight:800;color:var(--text);line-height:1.1}
#screen-home.dashboard-compact .home-compact-macros{font-size:12px;font-weight:700;color:var(--text2);line-height:1.1}
#screen-home.dashboard-compact .home-compact-water{font-size:12px;font-weight:700;color:#79d7ff;line-height:1.1}

/* Chat section — занимает основную часть главного экрана */
.chat-section{flex:1;display:flex;flex-direction:column;min-height:0;background:var(--bg2);overflow:hidden}
.chat-header{padding:10px var(--pad-h) 8px;border-bottom:1px solid var(--border);
  display:flex;align-items:center;gap:8px;background:var(--bg2);flex-shrink:0}
.chat-ai-avatar{width:32px;height:32px;min-width:32px;min-height:32px;border-radius:50%;overflow:hidden;flex-shrink:0}
.chat-ai-avatar-img{width:100%;height:100%;object-fit:cover;display:block;vertical-align:top}
.chat-ai-info{flex:1;display:flex;align-items:center;gap:8px}
.chat-ai-name{font-size:12px;font-weight:700}
.chat-ai-status{font-size:11px;color:var(--accent3);display:flex;align-items:center;flex-shrink:0}
.dot-pulse{width:6px;height:6px;border-radius:50%;background:var(--accent3);
  animation:pulse 1.5s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.chat-header-actions{display:flex;align-items:center;gap:8px}
.coins-btn{display:flex;align-items:center;gap:4px;background:var(--card);border:1px solid var(--border);border-radius:20px;padding:6px 10px;font-size:12px;font-weight:700;color:var(--accent);cursor:pointer}
.coins-btn:active{opacity:.85}
.chat-header-icon{font-size:20px;cursor:pointer}
.chat-messages{flex:1;min-height:0;overflow-y:auto;padding:10px var(--pad-h);display:flex;flex-direction:column;gap:10px;
  background:
    linear-gradient(180deg,rgba(9,12,20,.72) 0%,rgba(9,12,20,.88) 35%,rgba(9,12,20,.94) 100%),
    url(/static/chat-bg.png) center/cover no-repeat}

/* Chat dashboard component */
.chat-dashboard{
  position:sticky;
  top:0;
  z-index:7;
  padding:0 var(--pad-h) 8px;
  background:linear-gradient(180deg,rgba(16,20,31,.90) 0%,rgba(16,20,31,.74) 72%,rgba(16,20,31,0) 100%);
  backdrop-filter:blur(6px);
}
.chat-dashboard-inner{
  background:linear-gradient(180deg,rgba(27,33,46,.86) 0%,rgba(16,20,30,.84) 100%);
  border:1px solid var(--border-accent);
  border-radius:18px;
  box-shadow:0 8px 20px rgba(0,0,0,.22);
  overflow:hidden;
  transition:max-height .30s cubic-bezier(.2,.9,.2,1),padding .30s cubic-bezier(.2,.9,.2,1),border-radius .30s cubic-bezier(.2,.9,.2,1),background .30s ease,box-shadow .30s ease;
  max-height:220px;
  padding:10px 12px 10px;
}
.chat-dashboard.dashboard-expanded .chat-dashboard-inner,
.chat-dashboard:not(.dashboard-compact) .chat-dashboard-inner{
  max-height:72vh;
  overflow:visible;
}
.chat-dashboard-main{display:flex;align-items:center;gap:10px;min-height:94px;transition:min-height .30s cubic-bezier(.2,.9,.2,1)}
.chat-dashboard-ring{width:92px;height:92px;transition:width .30s cubic-bezier(.2,.9,.2,1),height .30s cubic-bezier(.2,.9,.2,1)}
.chat-dashboard-metrics{flex:1;min-width:0}
.chat-dashboard-date{margin-bottom:4px;transition:opacity .22s ease,transform .22s ease,max-height .25s ease}
.chat-dashboard-macros{margin-top:2px;transition:opacity .22s ease,transform .22s ease,max-height .25s ease}
.chat-dashboard-compact-kpi{display:flex;opacity:0;transform:translateY(6px);max-height:0;overflow:hidden;transition:opacity .24s ease,transform .24s ease,max-height .24s ease}
.chat-dashboard-actions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:8px;
  opacity:1;
  transform:translateY(0);
  transition:opacity .22s ease,transform .22s ease,max-height .25s ease;
  max-height:48px;
}
.chat-dashboard-action{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  color:var(--text);
  border-radius:10px;
  padding:7px 8px;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
}

.chat-dashboard.dashboard-compact .chat-dashboard-inner{
  max-height:76px;
  padding:6px 10px;
  border-radius:0 0 10px 10px;
  border-top:none;
  background:rgba(16,21,33,.78);
  border-left:1px solid rgba(255,255,255,.08);
  border-right:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 2px 6px rgba(0,0,0,.12);
  overflow:hidden;
}
.chat-dashboard.dashboard-compact{
  background:linear-gradient(180deg,rgba(15,20,31,.86) 0%,rgba(15,20,31,.72) 70%,rgba(15,20,31,0) 100%);
  backdrop-filter:blur(5px);
}
.chat-dashboard.dashboard-compact .chat-dashboard-main{min-height:64px}
.chat-dashboard.dashboard-compact .chat-dashboard-ring{width:46px;height:46px}
.chat-dashboard.dashboard-compact .chat-dashboard-ring .ring-hole{width:36px;height:36px}
.chat-dashboard.dashboard-compact .chat-dashboard-ring .ring-inner{width:32px}
.chat-dashboard.dashboard-compact .chat-dashboard-ring .ring-inner .num{font-size:10px}
.chat-dashboard.dashboard-compact .chat-dashboard-ring .ring-inner .target,
.chat-dashboard.dashboard-compact .chat-dashboard-ring .ring-inner .pct,
.chat-dashboard.dashboard-compact .chat-dashboard-date,
.chat-dashboard.dashboard-compact .chat-dashboard-macros,
.chat-dashboard.dashboard-compact .rewards-row-wrap,
.chat-dashboard.dashboard-compact .stats-expand-trigger,
.chat-dashboard.dashboard-compact .stats-meals-list,
.chat-dashboard.dashboard-compact #reward-tooltip{
  opacity:0;
  transform:translateY(-4px);
  max-height:0;
  overflow:hidden;
  margin:0;
  padding:0;
  border:0;
  pointer-events:none;
}
.chat-dashboard.dashboard-compact .stats-top{align-items:center}
.chat-dashboard.dashboard-compact .stats-top-left{padding-right:0;gap:8px}
.chat-dashboard.dashboard-compact .chat-dashboard-metrics{display:flex;align-items:center;min-height:46px}
.chat-dashboard.dashboard-compact .chat-dashboard-compact-kpi{
  flex-direction:column;
  gap:1px;
  opacity:1;
  transform:translateY(0);
  max-height:52px;
}
.chat-dashboard.dashboard-compact .chat-dashboard-compact-cal{font-size:14px;line-height:1.1;color:var(--text)}
.chat-dashboard.dashboard-compact .chat-dashboard-compact-cal .val{font-weight:700}
.chat-dashboard.dashboard-compact .chat-dashboard-compact-cal .goal{font-weight:500;opacity:.68}
.chat-dashboard.dashboard-compact .chat-dashboard-compact-macros{font-size:12px;line-height:1.1;color:rgba(226,232,244,.62)}
.chat-dashboard.dashboard-compact .chat-dashboard-compact-macros .lbl{opacity:.62}
.chat-dashboard.dashboard-compact .chat-dashboard-compact-macros .val{font-weight:700;color:rgba(236,241,248,.78)}
.chat-dashboard.dashboard-compact .chat-dashboard-compact-water{font-size:12px;font-weight:600;color:rgba(125,215,255,.65);line-height:1.1}
.chat-dashboard.dashboard-compact .chat-dashboard-actions{
  opacity:0;
  transform:translateY(-6px);
  pointer-events:none;
  max-height:0;
  margin-top:0;
}
.msg{display:flex;gap:8px;max-width:100%}
.msg.user{flex-direction:row-reverse}
.msg-bubble{max-width:80%;background:var(--card);border-radius:16px;padding:10px 14px;
  font-size:14px;line-height:1.5;position:relative;word-break:break-word;color:var(--text)}
.msg.user .msg-bubble{background:linear-gradient(135deg,rgba(86,204,242,0.26),rgba(43,197,186,0.20));border:1px solid rgba(86,204,242,0.34);border-bottom-right-radius:4px}
.msg.assistant .msg-bubble{background:rgba(31,36,50,.72);border-bottom-left-radius:4px;border:1px solid rgba(255,255,255,.05)}
.msg-photo-preview{max-width:220px;border-radius:10px;overflow:hidden;line-height:0;border:none;padding:0;background:transparent;display:block;cursor:zoom-in}
.msg-photo-preview img{display:block;max-width:100%;max-height:200px;object-fit:cover;vertical-align:middle}
.msg-photo-caption{margin-top:6px;font-size:13px;white-space:pre-wrap;word-break:break-word}
.msg-photo-placeholder{padding:8px 12px;background:rgba(0,0,0,.06);border-radius:10px;font-size:14px;color:var(--text2)}
.msg-time{font-size:10px;color:var(--text3);margin-top:4px;text-align:right}
.msg-avatar{width:28px;height:28px;min-width:28px;min-height:28px;border-radius:50%;overflow:hidden;flex-shrink:0;margin-top:4px}
.msg-avatar-img{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:cover;display:block;vertical-align:top}
.chat-photo-viewer-modal{background:rgba(3,6,12,.94);align-items:center;justify-content:center;padding:0;z-index:270}
.chat-photo-viewer-close{position:fixed;top:max(14px,env(safe-area-inset-top,0) + 8px);right:max(14px,env(safe-area-inset-right,0) + 6px);
  width:42px;height:42px;border:none;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:28px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;z-index:271}
.chat-photo-viewer-close:active{opacity:.8}
.chat-photo-viewer-image{display:block;max-width:100vw;max-height:100vh;max-height:100dvh;width:auto;height:auto;object-fit:contain;
  box-shadow:0 18px 44px rgba(0,0,0,.45)}

/* Progress collage fullscreen viewer */
.progress-collage-viewer-modal{background:rgba(3,6,12,.96);align-items:center;justify-content:flex-start;padding:44px 4px 16px;z-index:260;flex-direction:column;gap:6px;overflow-y:auto}
.progress-collage-viewer-modal .chat-photo-viewer-close{position:fixed;top:max(14px,env(safe-area-inset-top,0) + 8px);right:max(14px,env(safe-area-inset-right,0) + 6px)}
.progress-collage-viewer-title{font-size:16px;font-weight:700;color:var(--text2);flex-shrink:0}
.progress-collage-viewer-wrap{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,auto);gap:6px;width:100%;max-width:min(98vw,900px);min-height:min(70vh,70dvh);flex-shrink:0}
.progress-collage-viewer-cell{position:relative;background:var(--card);border-radius:12px;overflow:hidden;width:100%;height:0;padding-bottom:133.33%}
.progress-collage-viewer-cell-click{position:absolute;top:0;left:0;right:0;bottom:0;cursor:pointer;z-index:2;-webkit-tap-highlight-color:transparent}
.progress-collage-viewer-cell img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.progress-collage-viewer-cell-lbl{position:absolute;bottom:0;left:0;right:0;padding:6px;font-size:11px;font-weight:600;color:rgba(255,255,255,.95);background:linear-gradient(transparent,rgba(0,0,0,.7));text-align:center;pointer-events:none}
.progress-collage-viewer-cell.progress-collage-empty{display:block;color:var(--text3);font-size:12px}
.progress-collage-viewer-cell.progress-collage-empty span{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center}

.progress-compare-bar{display:flex;align-items:center;justify-content:center;margin:12px 0;flex-shrink:0;flex-wrap:wrap;gap:10px}
.progress-compare-bar--selecting{flex-direction:column;align-items:stretch}
.progress-compare-start{display:flex;justify-content:center}
.progress-compare-select .progress-compare-hint{margin:0 0 10px;font-size:13px;color:var(--text2);text-align:center}
.progress-compare-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.progress-collage-card--compare-selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}
.progress-collage-card--compare-mode{cursor:pointer}

.progress-compare-modal{background:rgba(3,6,12,.96);align-items:center;justify-content:flex-start;padding:44px 8px 16px;z-index:260;flex-direction:column;gap:10px;overflow-y:auto}
.progress-compare-modal .chat-photo-viewer-close{position:fixed;top:max(14px,env(safe-area-inset-top,0) + 8px);right:max(14px,env(safe-area-inset-right,0) + 6px)}
.progress-compare-header{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%;max-width:min(98vw,960px);flex-shrink:0}
.progress-compare-title1,.progress-compare-title2{font-size:16px;font-weight:700;color:var(--text2);text-align:center}
.progress-compare-wrap{display:flex;flex-direction:column;gap:12px;width:100%;max-width:min(98vw,960px);flex:1;min-height:0;overflow-y:auto;padding-bottom:20px}
.progress-compare-row{display:grid;grid-template-columns:72px 1fr 1fr;gap:10px;align-items:stretch;min-height:min(38vh,38dvh)}
.progress-compare-row-lbl{display:flex;align-items:center;font-size:13px;font-weight:600;color:var(--text3);flex-shrink:0}
.progress-compare-cell{position:relative;background:var(--card);border-radius:12px;overflow:hidden;width:100%;height:0;padding-bottom:133.33%;min-height:min(36vh,36dvh)}
.progress-compare-cell img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;display:block}
.progress-compare-empty{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;color:var(--text3);font-size:14px}

/* Suggestion card in chat */
.suggestion-card{background:rgba(24,30,42,.92);border:1px solid rgba(86,204,242,.20);
  border-radius:12px;padding:14px;margin-top:8px}
.suggestion-title{font-size:15px;font-weight:700;margin-bottom:8px}
.suggestion-rows{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}
.sug-row{display:flex;justify-content:space-between;font-size:12px}
.sug-lbl{color:var(--text2)}
.sug-val{font-weight:700;color:var(--text)}
.suggestion-actions{display:flex;gap:8px}
.suggestion-actions--challenge .sug-btn{font-size:11px;padding:6px 8px}
.sug-btn{flex:1;padding:8px;border-radius:10px;border:none;font-size:13px;font-weight:700;
  cursor:pointer;transition:all .2s}
.sug-btn.add{background:var(--accent2);color:#0d1320}
.sug-btn.edit{background:var(--card2);color:var(--text);border:1px solid var(--border)}
.sug-btn:active{transform:scale(.96);opacity:.9}
.suggestion-actions--confirmed{justify-content:center}
.sug-status{flex:1;padding:9px 12px;border-radius:999px;
  background:linear-gradient(135deg,rgba(86,204,242,0.32),rgba(43,197,186,0.26));
  border:1px solid rgba(86,204,242,0.55);font-size:12px;font-weight:700;color:var(--accent);
  text-align:center}
.challenge-invite-warn{font-size:12px;color:var(--text2);background:rgba(255,193,7,0.15);border:1px solid rgba(255,193,7,0.4);border-radius:10px;padding:10px;margin-bottom:10px;line-height:1.4}
.challenge-invite-start{font-size:13px;font-weight:600;background:rgba(255,193,7,0.15);border:1px solid rgba(255,193,7,0.4);border-radius:10px;padding:10px;margin:0 0 10px;line-height:1.35}
.challenge-invite-hint{font-size:12px;color:var(--text2);margin:0 0 10px;line-height:1.4}
.pending-meal-nudge{margin-top:10px;padding:10px 12px;border-radius:12px;border:1px dashed rgba(86,204,242,0.45);background:rgba(86,204,242,0.08)}
.pending-meal-nudge-label{font-size:12px;color:var(--text2);margin-bottom:8px}
.pending-meal-nudge-actions{display:flex;gap:8px}
.suggestion-card--pulse{animation:cardPulse 1.2s ease 1}
@keyframes cardPulse{0%{box-shadow:0 0 0 0 rgba(86,204,242,0.55)}100%{box-shadow:0 0 0 14px rgba(86,204,242,0)}}

/* Chat input — всегда видна внизу чата, выше навбара */
.chat-input-row{display:flex;gap:8px;align-items:flex-end;padding:var(--pad-v) var(--pad-h);background:var(--bg2);
  border-top:1px solid var(--border);flex-shrink:0;flex-grow:0;
  padding-bottom:calc(12px + env(safe-area-inset-bottom,0));min-height:56px;max-height:160px;
  position:sticky;bottom:0;left:0;right:0;z-index:50;margin-top:auto}
.chat-input{flex:1;min-width:0;background:var(--card);border:1px solid var(--border);
  border-radius:24px;padding:10px 16px;color:var(--text);font-size:14px;
  outline:none;resize:none;max-height:120px;min-height:42px;
  font-family:var(--font);transition:border-color .2s}
.chat-input:focus{border-color:rgba(86,204,242,0.5)}
.send-btn{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#56ccf2,#2bc5ba);border:none;
  color:#0d1320;font-size:18px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:all .2s;box-shadow:0 4px 12px rgba(86,204,242,0.35)}
.send-btn:active{transform:scale(.9);opacity:.85}
.photo-btn{width:42px;height:42px;border-radius:50%;background:var(--card2);border:1px solid var(--border);
  color:var(--text2);cursor:pointer;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:all .2s}
.photo-btn:active{transform:scale(.9)}
.photo-btn-icon svg{width:22px;height:22px;stroke:currentColor}
.photo-btn-icon:hover{color:var(--text)}

.voice-btn{width:42px;height:42px;border-radius:50%;background:var(--card2);border:1px solid var(--border);
  color:var(--text2);cursor:pointer;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:all .2s}
.voice-btn:active{transform:scale(.9)}
.voice-btn-icon .voice-icon{width:22px;height:22px;stroke:currentColor}
.voice-btn:hover{color:var(--text)}
.voice-btn.recording{background:rgba(220,80,80,0.25);border-color:#dc5050;color:#ff6b6b;animation:voice-pulse 1.2s ease-in-out infinite}
@keyframes voice-pulse{0%,100%{opacity:1}50%{opacity:.7}}

/* Блок фото над полем ввода (до 6 фото, коллаж) */
.chat-recipe-under-input{padding:8px 12px;background:var(--bg2);border-top:1px solid var(--border);flex-shrink:0}
.chat-recipe-under-input.hidden{display:none!important}
.chat-input-photos-block{padding:8px 12px;background:var(--card);border-top:1px solid var(--border);flex-shrink:0}
.chat-input-preview-thumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.chat-input-preview-thumb{position:relative;width:52px;height:52px;border-radius:12px;overflow:hidden;border:1px solid var(--border);flex-shrink:0}
.chat-input-preview-thumb img{width:100%;height:100%;object-fit:cover}
.chat-input-preview-remove{position:absolute;top:0;right:0;width:22px;height:22px;border:none;border-radius:0 0 0 10px;
  background:rgba(0,0,0,.75);color:#fff;font-size:14px;line-height:1;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center}
.chat-input-preview-remove:active{opacity:.9}
.chat-input-photo-add-btn{width:52px;height:52px;border-radius:12px;border:2px dashed var(--border);background:var(--bg2);
  color:var(--text3);font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.chat-input-photo-add-btn:active{opacity:.8}
.chat-input-preview-wrap{flex-shrink:0;display:flex;align-items:center}
.chat-input-photo-intents{margin-top:10px;padding-top:10px;border-top:1px solid var(--border)}
.chat-input-intent-label{display:block;font-size:12px;color:var(--text2);margin-bottom:8px}
.chat-input-intent-btns{display:flex;flex-wrap:wrap;gap:8px}
.chat-intent-btn{padding:8px 12px;border-radius:10px;border:1px solid var(--border);background:var(--bg2);color:var(--text2);font-size:12px;cursor:pointer;transition:all .2s}
.chat-intent-btn:hover{background:var(--card);color:var(--text)}
.chat-intent-btn.active{background:linear-gradient(135deg,rgba(86,204,242,0.35),rgba(43,197,186,0.3));border-color:rgba(86,204,242,0.5);color:var(--text)}
.chat-input-meal-for-menu{margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}
.chat-input-meal-btns{display:flex;flex-wrap:wrap;gap:8px}
.chat-meal-btn{padding:6px 10px;border-radius:8px;border:1px solid var(--border);background:var(--bg2);color:var(--text2);font-size:11px;cursor:pointer;transition:all .2s}
.chat-meal-btn:hover{background:var(--card);color:var(--text)}
.chat-meal-btn.active{background:rgba(86,204,242,0.25);border-color:rgba(86,204,242,0.4);color:var(--text)}

/* Typing indicator */
.typing{display:flex;gap:4px;padding:10px 14px;align-items:center}
.typing-dot{width:8px;height:8px;border-radius:50%;background:var(--text3);
  animation:bounce .8s infinite}
.typing-dot:nth-child(2){animation-delay:.15s}
.typing-dot:nth-child(3){animation-delay:.3s}
@keyframes bounce{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-8px)}}

/* ═══════════════════════════════════════════════════
   ANALYTICS SCREEN
═══════════════════════════════════════════════════ */
.screen-title{font-size:20px;font-weight:800;padding:16px;color:var(--text)}
.analytics-tabs{display:flex;gap:4px;padding:0 12px 8px;overflow-x:auto}
.atab{background:var(--card2);border:1px solid var(--border);border-radius:20px;
  padding:6px 14px;font-size:12px;font-weight:700;color:var(--text2);cursor:pointer;
  white-space:nowrap;transition:all .2s}
.atab.active{background:var(--accent);color:#0d1320;border-color:var(--accent);font-weight:700}
.chart-container{margin:0 12px 12px;background:var(--card);border-radius:var(--radius);
  padding:16px;border:1px solid var(--border);overflow:hidden}
.chart-title{font-size:13px;font-weight:700;color:var(--text2);margin-bottom:12px}
.bar-chart{display:flex;gap:3px;align-items:flex-end;height:100px}
.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px}
.bar{border-radius:4px 4px 0 0;width:100%;transition:height .5s;min-height:3px}
.bar-lbl{font-size:9px;color:var(--text3);text-align:center;overflow:hidden}

/* Stats cards row */
.stats-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;padding:0 12px 8px}
.stat-card{background:var(--card);border-radius:var(--radius-sm);padding:14px;
  border:1px solid var(--border);display:flex;flex-direction:column;gap:4px}
.stat-card-icon{font-size:24px;margin-bottom:4px}
.stat-card-val{font-size:22px;font-weight:800}
.stat-card-lbl{font-size:11px;color:var(--text2)}

/* Progress screen — один поток, без разъезжания */
#screen-analytics.active{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.progress-page-wrap{flex:1;min-height:0;overflow-y:auto;padding:var(--pad-v) var(--pad-h) var(--nav-bottom);box-sizing:border-box;width:100%;min-width:0}
.progress-page-title{font-size:20px;font-weight:800;color:var(--text);margin:0 0 12px;padding:0}
.progress-tabs-row{margin-bottom:10px}
.progress-tabs{display:flex;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:2px 0}
.progress-tab{flex:0 0 auto;background:var(--card2);border:1px solid var(--border);border-radius:14px;
  padding:8px 14px;font-size:13px;font-weight:600;color:var(--text2);cursor:pointer;transition:all .2s;white-space:nowrap}
.progress-tab:hover,.progress-tab.active{background:var(--accent);color:#0d1320;border-color:var(--accent)}
.progress-period-row{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.progress-period-label{font-size:12px;color:var(--text2);font-weight:600}
.progress-period-btns{display:flex;gap:6px;flex-wrap:wrap}
.progress-period-btn{background:var(--card2);border:1px solid var(--border);border-radius:12px;
  padding:6px 12px;font-size:12px;font-weight:600;color:var(--text2);cursor:pointer;transition:all .2s}
.progress-period-btn:hover,.progress-period-btn.active{background:var(--accent);color:#0d1320;border-color:var(--accent)}
.progress-main{min-height:120px}
.progress-loading-inline{display:none;align-items:center;gap:8px;padding:20px;color:var(--text2);font-size:14px}
.progress-loading-inline.visible{display:flex}
.progress-err{color:var(--red);padding:16px;font-size:14px}
.progress-block{margin-bottom:16px}
.progress-headline{font-size:16px;font-weight:700;color:var(--text);margin:0 0 8px}
.progress-subhead{font-size:14px;font-weight:700;color:var(--text2);margin:0 0 8px}
.progress-text{font-size:14px;line-height:1.5;color:var(--text2);margin:0}
.progress-text strong{color:var(--text)}
.progress-discipline-line{margin-top:4px}
.progress-discipline-bars{display:flex;gap:2px;align-items:flex-end;height:26px;margin-bottom:12px}
.progress-discipline-bars .discipline-bar{flex:1;min-width:3px;background:var(--accent);border-radius:2px 2px 0 0;opacity:.85}
.progress-chart-wrap{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px;overflow:hidden}
.progress-chart-inner{display:flex;gap:2px;align-items:flex-end;height:88px;min-height:44px}
.progress-chart-inner .bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0}
.progress-chart-inner .bar{border-radius:4px 4px 0 0;width:100%;min-height:3px}
.progress-chart-inner .bar-lbl{font-size:9px;color:var(--text3);text-align:center}
.progress-chart-empty{font-size:13px;color:var(--text3);text-align:center;padding:20px 8px}
.progress-records-line{margin-top:8px;padding-top:8px;border-top:1px solid var(--border)}
.progress-records-p{font-size:13px;color:var(--text3)}
.progress-ms-legend{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px;font-size:11px;color:var(--text3)}
.progress-ms-chart{display:flex;gap:2px;align-items:flex-end;height:60px}
.progress-ms-chart .bar-col{flex-direction:column;align-items:stretch;gap:1px}
.progress-ms-chart .bar-col .bar{min-height:2px;border-radius:2px}
.progress-ms-chart .bar-waist{background:#22c55e}
.progress-ms-chart .bar-chest{background:#3b82f6}
.progress-ms-chart .bar-hips{background:#a855f7}
.progress-ms-chart .bar-bicep{background:#f59e0b}
.progress-ms-chart .bar-calf{background:#ec4899}

/* Прогресс — игровые блоки (вкладки Рейтинг, Питание, Тело, Стрики) */
.progress-tabs-game .progress-tab{padding:10px 14px;font-size:14px}
.progress-game-block{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px;margin-bottom:14px}
.progress-game-title{font-size:16px;font-weight:800;color:var(--text);margin:0 0 8px}
.progress-game-sub{font-size:13px;font-weight:600;color:var(--text2);margin:0 0 10px}
.progress-game-period{font-size:12px;color:var(--text3);margin:0 0 6px}
.progress-game-place{margin:0 0 8px;font-size:14px;color:var(--text2)}
.progress-game-place strong{color:var(--accent)}
.progress-game-hint{font-size:13px;color:var(--text3);margin:8px 0 0}
.progress-game-stars{margin:0 0 8px;font-size:14px;color:var(--text2)}
.progress-bar-wrap{height:8px;background:var(--card2);border-radius:4px;overflow:hidden;margin:6px 0}
.progress-bar-fill{height:100%;background:var(--accent);border-radius:4px;transition:width .3s ease}

/* Вкладка Рейтинг — акцент на неделе и позитивная психология */
.rating-period-caption{font-size:12px;color:var(--text3);margin:0 0 12px;font-weight:600;text-transform:uppercase;letter-spacing:.03em}
.rating-soft-warning{font-size:13px;color:var(--text2);margin:8px 0 10px}
.rating-cta-btn{display:inline-block;padding:10px 18px;font-size:14px;font-weight:700;color:#0d1320;background:var(--accent);border:none;border-radius:12px;cursor:pointer;margin-top:6px;transition:opacity .2s}
.rating-cta-btn:hover{opacity:.9}
.rating-cta-btn:active{opacity:.85}
.rating-cta-secondary{background:var(--card2);color:var(--text);border:1px solid var(--border)}
.rating-cta-secondary:hover{background:var(--border);color:var(--text)}

/* Месячная лига — аккуратный блок */
.progress-game-leagues{padding:18px}
.progress-game-leagues .progress-game-title{font-size:15px;font-weight:800;margin-bottom:6px;text-transform:capitalize}
.progress-game-leagues .progress-game-place{margin-bottom:10px;font-size:15px}
.progress-game-leagues .progress-bar-wrap{margin:10px 0 12px}

.rating-activity-tier .progress-text{margin-bottom:10px}
.rating-tier-rows{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.rating-tier-row{display:flex;justify-content:space-between;align-items:center;font-size:14px;color:var(--text2)}
.rating-tier-row.rating-tier-done{color:var(--accent);font-weight:600}
.rating-tier-name{font-weight:600}
.rating-tier-val{font-weight:500}

.rating-week-hero{background:linear-gradient(160deg,var(--card) 0%,rgba(86,204,242,0.06) 100%);border-color:rgba(86,204,242,0.25);padding:18px}
.rating-week-hero .progress-game-title{margin-bottom:4px}
.rating-week-hero .progress-game-period{margin-bottom:8px}
.rating-week-stars-row{display:flex;justify-content:space-between;gap:4px;margin:12px 0;font-size:22px;letter-spacing:.1em}
.rating-week-star-cell{flex:1;text-align:center;color:var(--text3)}
.rating-week-star-cell.rating-week-star-bright{color:var(--accent)}
.rating-week-summary{font-size:14px;font-weight:700;color:var(--text);margin:0 0 6px}
.progress-game-points .progress-game-period{margin-bottom:10px}

/* Источники очков — ровная сетка: метка | значение | бар; цель с новой строки */
.progress-game-points{padding:18px}
.progress-game-points .progress-game-title{font-size:15px;margin-bottom:4px}
.rating-rows{display:flex;flex-direction:column;gap:12px}
.rating-rows .progress-game-row-tier{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:4px 12px;align-items:center}
.rating-rows .progress-game-row-tier .progress-game-row-lbl{grid-column:1;grid-row:1;font-size:14px;font-weight:600;color:var(--text2)}
.rating-rows .progress-game-row-tier .progress-game-row-val{grid-column:2;grid-row:1;font-size:14px;font-weight:700;color:var(--text);text-align:right}
.rating-rows .progress-game-row-tier .progress-bar-wrap{grid-column:1/-1;grid-row:2;margin:0}
.rating-rows .progress-game-row-tier .rating-row-goal{grid-column:1/-1;grid-row:3;font-size:12px;color:var(--text3);margin-top:2px}

.rating-tier-label{font-size:12px;font-weight:700;margin:16px 0 8px;text-transform:uppercase;letter-spacing:.03em}
.rating-tier-label:first-child{margin-top:0}
.rating-tier-excellent{color:#22c55e}
.rating-tier-medium{color:var(--text2)}
.rating-tier-focus{color:var(--accent)}
.progress-game-row-tier.row-excellent .progress-bar-fill{background:#22c55e}
.progress-game-rows{display:flex;flex-direction:column;gap:10px}
.progress-game-row{display:flex;align-items:center;gap:10px}
.progress-game-row .progress-game-row-lbl{flex:0 0 auto;min-width:100px;font-size:13px;color:var(--text2)}
.progress-game-row .progress-bar-wrap{flex:1;min-width:60px;margin:0}
.progress-game-row .progress-game-row-val{flex:0 0 auto;min-width:52px;text-align:right;font-size:13px;font-weight:600;color:var(--text)}
.progress-game-row-val{font-size:13px;font-weight:600;color:var(--text);min-width:48px;text-align:right}
.progress-game-big-num{font-size:32px;font-weight:800;color:var(--accent);margin:0 0 4px;line-height:1}
.progress-game-insight{background:rgba(86,204,242,0.08);border-color:rgba(86,204,242,0.25)}
.progress-game-insight .progress-text{color:var(--text2);font-style:italic}
.rating-fatai-widget .rating-fatai-actions{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.rating-month-goal .progress-bar-wrap{margin:8px 0 6px}
.rating-goal-bar{height:10px;border-radius:5px}
.rating-reward-text{font-size:13px;color:var(--text3);margin:8px 0 0}
.progress-game-overtake .progress-text{margin:4px 0;padding-left:0;list-style:none}
.progress-game-overtake .progress-text li{margin:4px 0}
.progress-growth .progress-text{margin:4px 0}

/* Вкладка Результат — итог тела */
.progress-result-summary.progress-fatai-card{background:rgba(86,204,242,0.08);border-color:rgba(86,204,242,0.25)}
.progress-result-weight-card .progress-result-main{font-size:22px;font-weight:800;color:var(--text);margin:0 0 4px}
.progress-result-weight-card .progress-result-delta{font-size:16px;font-weight:700;margin:0 0 6px}
.progress-trend-down{color:var(--green)}
.progress-trend-up{color:var(--red)}
.progress-trend-stable{color:var(--text2)}
.progress-result-forecast{font-size:13px;color:var(--text2);margin:8px 0 0}
.progress-result-waist .progress-text{margin:0}
.progress-weight-chart-inline{display:flex;gap:4px;align-items:flex-end;justify-content:flex-start;overflow-x:auto;padding:12px 0;min-height:90px}
.progress-weight-chart-inline .bar-col{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:4px}
.progress-weight-chart-inline .bar{width:14px;min-height:6px;border-radius:4px;background:var(--accent)}
.progress-weight-chart-inline .bar-lbl{font-size:10px;color:var(--text3)}
.progress-weight-chart-inline .bar-lbl-month{font-size:9px;text-transform:uppercase}
.progress-hint{font-size:13px;color:var(--text3)}

/* Вкладка Режим — индекс дисциплины */
.progress-regime-hero .progress-regime-big-pct{font-size:42px;font-weight:800;color:var(--accent);margin:0 0 6px;line-height:1}
.progress-regime-stats .progress-game-rows{margin-top:8px}
.progress-regime-badges-toggle{width:100%;padding:10px 14px;font-size:14px;font-weight:600;color:var(--accent);background:var(--card2);border:1px solid var(--border);border-radius:12px;cursor:pointer;margin:0 0 8px}
.progress-regime-badges-toggle:hover{background:var(--border)}
.progress-regime-badges-wrap .progress-game-rows{margin-top:8px}

/* Вкладка Аналитика — карточки в ряд */
.progress-analytics-cards{display:flex;gap:12px;overflow-x:auto;padding:8px 0 4px;scroll-snap-type: x mandatory;-webkit-overflow-scrolling:touch}
.progress-analytics-card{flex:0 0 120px;scroll-snap-align:start;background:var(--card2);border:1px solid var(--border);border-radius:12px;padding:12px;display:flex;flex-direction:column;align-items:center;gap:2px}
.progress-analytics-card-val{font-size:20px;font-weight:800;color:var(--text)}
.progress-analytics-card-unit{font-size:12px;color:var(--text3)}
.progress-analytics-card-lbl{font-size:12px;color:var(--text2);margin-top:4px}
.progress-analytics-card-norm{font-size:11px;color:var(--text3)}

/* ═══════════════════════════════════════════════════
   FRIENDS SCREEN — Weekly Challenge, Today Battle, Monthly League
═══════════════════════════════════════════════════ */
.friends-page-wrap{flex:1;min-height:0;overflow-y:auto;padding:0 var(--pad-h) var(--nav-bottom);width:100%;min-width:0}
.friends-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;padding-top:8px}
.friends-page-title{font-size:20px;font-weight:700;color:var(--text)}
.friends-help-btn{width:32px;height:32px;border-radius:50%;border:1px solid var(--border);
  background:rgba(255,255,255,0.06);color:var(--text2);font-size:14px;cursor:pointer;
  display:flex;align-items:center;justify-content:center}
.friends-search-wrap{display:flex;gap:8px;margin-bottom:12px}
.friends-search-input{flex:1;background:var(--card);border:1px solid var(--border);
  border-radius:12px;padding:10px 14px;color:var(--text);font-size:14px;outline:none}
.friends-search-input:focus{border-color:var(--accent)}
.friends-search-results{margin-bottom:16px}
.friends-search-result-item{display:flex;align-items:center;gap:12px;padding:12px;background:var(--card);
  border-radius:14px;margin-bottom:8px;border:1px solid var(--border)}
.friends-search-result-item .friends-avatar-wrap{flex-shrink:0}
.friends-search-result-item .friends-result-name{font-weight:600;color:var(--text)}
.friends-search-result-item .friends-result-username{font-size:12px;color:var(--text2)}
.friends-search-result-item .btn-add-friend{padding:8px 14px;font-size:12px;margin-left:auto}

/* Blocks: Weekly, Today, League */
.friends-block{background:linear-gradient(165deg,var(--card) 0%,#0d1320 50%,#0f121b 100%);
  border-radius:20px;padding:18px 16px;border:1px solid var(--border);margin-bottom:16px;
  box-shadow:0 6px 20px rgba(0,0,0,0.2)}
.friends-block-title{font-size:18px;font-weight:800;color:var(--text);margin:0 0 4px;letter-spacing:-0.02em;
  display:flex;align-items:center;gap:10px}
.friends-block-help{width:22px;height:22px;min-width:22px;min-height:22px;border-radius:50%;border:1px solid var(--border);
  background:rgba(255,255,255,0.08);color:var(--text2);font-size:12px;font-weight:700;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;margin-left:2px}
.friends-block-help:hover{color:var(--accent);border-color:var(--accent);background:rgba(86,204,242,0.1)}
.friends-block-help:active{opacity:.85}
.friends-block-icon{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;flex-shrink:0}
.friends-block-icon svg{width:100%;height:100%;stroke:currentColor}
.friends-icon-fire{color:#f59e0b}
.friends-icon-fire svg{filter:drop-shadow(0 0 6px rgba(245,158,11,.3))}
.friends-icon-bolt{color:var(--accent)}
.friends-icon-bolt svg{filter:drop-shadow(0 0 6px rgba(86,204,242,.25))}
.friends-icon-crown{color:#fbbf24}
.friends-icon-crown svg{filter:drop-shadow(0 0 6px rgba(251,191,36,.25))}
.friends-block-sub{font-size:12px;color:var(--text2);margin:0 0 14px}

/* Weekly Challenge list */
.friends-weekly-list{display:flex;flex-direction:column;gap:8px}
.friends-weekly-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;
  background:rgba(255,255,255,0.04);border:1px solid transparent}
.friends-weekly-row.you{background:rgba(86,204,242,0.12);border-color:rgba(86,204,242,0.35)}
.friends-weekly-row.place-1{background:linear-gradient(135deg,rgba(255,193,7,0.18),rgba(255,193,7,0.06));border-color:rgba(255,193,7,0.4)}
.friends-weekly-row.place-2{background:linear-gradient(135deg,rgba(192,192,192,0.15),rgba(192,192,192,0.05));border-color:rgba(192,192,192,0.35)}
.friends-weekly-row.place-3{background:linear-gradient(135deg,rgba(205,127,50,0.18),rgba(205,127,50,0.06));border-color:rgba(205,127,50,0.4)}
.friends-weekly-medal{width:28px;flex-shrink:0;font-size:18px;text-align:center;line-height:1}
.friends-weekly-row.place-1 .friends-weekly-medal{font-size:22px}
.friends-weekly-row.place-2 .friends-weekly-medal{font-size:20px}
.friends-weekly-row.place-3 .friends-weekly-medal{font-size:18px}
.friends-weekly-avatar{width:44px;height:44px;border-radius:50%;overflow:hidden;flex-shrink:0;background:var(--card2);
  display:flex;align-items:center;justify-content:center;border:2px solid rgba(255,255,255,0.12)}
.friends-weekly-row.place-1 .friends-weekly-avatar{border-color:rgba(255,193,7,0.5)}
.friends-weekly-row.place-2 .friends-weekly-avatar{border-color:rgba(192,192,192,0.5)}
.friends-weekly-row.place-3 .friends-weekly-avatar{border-color:rgba(205,127,50,0.5)}
.friends-weekly-avatar img{width:100%;height:100%;object-fit:cover}
.friends-weekly-avatar img.failed{display:none}
.friends-weekly-avatar .friends-avatar-placeholder{display:none;width:100%;height:100%;align-items:center;justify-content:center;background:var(--card2);font-size:18px}
.friends-weekly-avatar img.failed + .friends-avatar-placeholder{display:flex}
.friends-weekly-info{flex:1;min-width:0}
.friends-weekly-name{font-size:15px;font-weight:700;color:var(--text)}
.friends-weekly-name .you-badge{font-size:10px;color:var(--accent);margin-left:6px;font-weight:600}
.friends-weekly-stars-wrap{display:flex;align-items:center;gap:4px;margin-top:8px;flex-wrap:nowrap;min-height:24px}
.friends-weekly-star{font-size:20px;line-height:1;transition:opacity .2s, transform .15s;display:inline-block}
.friends-weekly-star.gray{color:var(--text2);opacity:.6}
.friends-weekly-star.dim{color:var(--text2);opacity:.85}
.friends-weekly-star.bright{color:#fbbf24;opacity:1;text-shadow:0 0 8px rgba(251,191,36,.4)}
.friends-weekly-row.place-1 .friends-weekly-star.bright{color:#fcd34d;text-shadow:0 0 10px rgba(252,211,77,.5)}
.friends-weekly-bar-wrap{height:8px;border-radius:4px;background:var(--card2);overflow:hidden;margin-top:8px}
.friends-weekly-bar-fill{height:100%;border-radius:4px;background:linear-gradient(90deg,var(--accent),#2bc5ba);transition:width .3s ease;max-width:100%}
.friends-weekly-row.place-1 .friends-weekly-bar-fill{background:linear-gradient(90deg,#f59e0b,#fbbf24)}
.friends-weekly-score{font-size:13px;font-weight:700;color:var(--accent);min-width:42px;text-align:right}
.friends-weekly-row.place-1 .friends-weekly-score{color:#ffc107}
.friends-weekly-row.place-2 .friends-weekly-score{color:#c0c0c0}
.friends-weekly-row.place-3 .friends-weekly-score{color:#cd7f32}
.friends-weekly-footer{font-size:12px;color:var(--text2);margin-top:12px;text-align:center}
.friends-weekly-footer strong{color:var(--text)}

/* Модалка: пояснение по дням недельного стрика */
.friends-weekly-detail-modal .modal-content{max-width:400px;max-height:85vh;overflow-y:auto}
/* Попап по центру экрана */
.friends-weekly-detail-modal{position:fixed;inset:0;z-index:200;display:none;
  align-items:center;justify-content:center;background:rgba(0,0,0,.7);backdrop-filter:blur(4px);
  padding:16px}
.friends-weekly-detail-modal.open{display:flex}
.friends-weekly-detail-modal .modal-backdrop{position:absolute;inset:0}
.friends-weekly-detail-modal .modal-content{background:var(--bg2);border-radius:var(--radius);padding:16px;box-shadow:0 8px 32px rgba(0,0,0,.35);width:100%}
.friends-weekly-detail-title{font-size:18px;font-weight:700;color:var(--text);margin:0 0 12px}
.friends-weekly-detail-summary{font-size:14px;color:var(--text2);margin:0 0 12px;line-height:1.4}
.friends-weekly-detail-days{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}
.friends-weekly-detail-day{font-size:13px;line-height:1.45;color:var(--text);display:flex;flex-wrap:wrap;align-items:flex-start;gap:6px}
.friends-weekly-detail-day-name{font-weight:700;min-width:28px}
.friends-weekly-detail-day-date{color:var(--text3);font-size:12px}
.friends-weekly-detail-day .friends-weekly-detail-star{font-size:16px;flex-shrink:0}
.friends-weekly-detail-day .friends-weekly-detail-star.gray{color:var(--text2);opacity:.6}
.friends-weekly-detail-day .friends-weekly-detail-star.dim{color:var(--text2);opacity:.85}
.friends-weekly-detail-day .friends-weekly-detail-star.bright{color:#fbbf24;opacity:1}
.friends-weekly-detail-day-desc{flex:1;min-width:0;color:var(--text2);font-size:12px}
.friends-weekly-detail-actions{margin-bottom:12px}
.friends-weekly-detail-actions .btn{width:100%}

/* Today Battle */
.friends-today-message{font-size:13px;margin-bottom:12px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,0.06)}
.friends-today-message.leading{color:var(--green);background:rgba(34,197,94,0.15)}
.friends-today-message.catching{color:var(--accent);background:rgba(86,204,242,0.12)}
.friends-today-list{display:flex;flex-direction:column;gap:10px}
.friends-today-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;
  background:rgba(255,255,255,0.04);border:1px solid transparent}
.friends-today-row.you{background:rgba(86,204,242,0.1);border-color:rgba(86,204,242,0.3)}
.friends-today-avatar{width:40px;height:40px;border-radius:50%;overflow:hidden;flex-shrink:0;background:var(--card2);display:flex;align-items:center;justify-content:center;font-size:16px}
.friends-today-avatar img{width:100%;height:100%;object-fit:cover}
.friends-today-avatar img.failed{display:none}
.friends-today-avatar .friends-avatar-placeholder{display:none;width:100%;height:100%;align-items:center;justify-content:center;background:var(--card2)}
.friends-today-avatar img.failed + .friends-avatar-placeholder{display:flex}
.friends-today-info{flex:1;min-width:0}
.friends-today-name{font-size:14px;font-weight:700;color:var(--text)}
.friends-today-name .you-badge{font-size:10px;color:var(--accent);margin-left:4px}
.friends-today-badges-wrap{display:flex;align-items:center;gap:6px;margin-top:6px;flex-wrap:wrap}
.friends-today-badge{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;font-size:14px;line-height:1}
.friends-today-badge.active{opacity:1}
.friends-today-badge.inactive{opacity:.4;filter:saturate(0.3)}
.friends-today-badge-salad.active{box-shadow:0 0 0 2px rgba(74,222,128,0.4)}
.friends-today-badge-salad.half.active{opacity:.7;box-shadow:0 0 0 1px rgba(74,222,128,0.3)}
.friends-today-badge-count{font-size:11px;color:var(--text2);margin-top:2px}
.friends-habit-icons{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:13px}
.friends-habit-icons span{display:inline-flex;align-items:center;gap:2px}
.friends-habit-icons .ok{color:var(--green)}
.friends-habit-icons .no{color:var(--text3);opacity:.7}
.friends-habit-icons .habit-cal-green{color:var(--green)}
.friends-habit-icons .habit-cal-red{color:var(--red)}
.friends-habit-icons .habit-cal-grey{color:var(--text3);opacity:.8}
.friends-habit-icons .habit-activity-tier-2.ok{color:var(--accent)}
.friends-today-rewards{font-size:11px;color:var(--text3);margin-top:4px;display:flex;align-items:center;gap:6px}
.friends-today-rewards .friends-today-reward{font-size:14px;opacity:.95}
.friends-today-bar-wrap{height:6px;border-radius:3px;background:var(--card2);overflow:hidden;margin-top:6px;max-width:100px}
.friends-today-bar-fill{height:100%;border-radius:3px;background:var(--accent);transition:width .3s ease}
.friends-today-pct{font-size:14px;font-weight:700;color:var(--accent);min-width:40px;text-align:right}

/* Monthly League */
.friends-league-list{display:flex;flex-direction:column;gap:6px}
.friends-league-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;
  background:rgba(255,255,255,0.04);border:1px solid transparent}
.friends-league-row.you{background:rgba(86,204,242,0.1);border-color:rgba(86,204,242,0.3)}
.friends-league-row.place-1{background:linear-gradient(135deg,rgba(255,193,7,0.18),rgba(255,193,7,0.06));border-color:rgba(255,193,7,0.4)}
.friends-league-row.place-2{background:linear-gradient(135deg,rgba(192,192,192,0.15),rgba(192,192,192,0.05));border-color:rgba(192,192,192,0.35)}
.friends-league-row.place-3{background:linear-gradient(135deg,rgba(205,127,50,0.18),rgba(205,127,50,0.06));border-color:rgba(205,127,50,0.4)}
.friends-league-medal{width:28px;flex-shrink:0;font-size:18px;text-align:center}
.friends-league-avatar{width:44px;height:44px;border-radius:50%;overflow:hidden;flex-shrink:0;background:var(--card2);
  display:flex;align-items:center;justify-content:center;border:2px solid rgba(255,255,255,0.12)}
.friends-league-avatar img{width:100%;height:100%;object-fit:cover}
.friends-league-avatar img.failed{display:none}
.friends-league-avatar .friends-avatar-placeholder{display:none;width:100%;height:100%;align-items:center;justify-content:center;background:var(--card2)}
.friends-league-avatar img.failed + .friends-avatar-placeholder{display:flex}
.friends-league-info{flex:1;min-width:0}
.friends-league-name{font-size:15px;font-weight:700;color:var(--text)}
.friends-league-name .you-badge{font-size:10px;color:var(--accent);margin-left:6px}
.friends-league-streak{font-size:11px;color:var(--text2);margin-top:2px}
.friends-league-streak span{color:#f59e0b}
.friends-league-value{font-size:16px;font-weight:800;color:var(--accent);flex-shrink:0}
.friends-league-row.place-1 .friends-league-value{color:#ffc107}
.friends-league-row.place-2 .friends-league-value{color:#c0c0c0}
.friends-league-row.place-3 .friends-league-value{color:#cd7f32}
.friends-league-crown{font-size:16px;margin-left:4px}

/* Invite CTA */
.friends-invite-wrap{margin-top:8px;margin-bottom:24px;text-align:center}
.friends-invite-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;max-width:280px;
  padding:14px 20px;border-radius:16px;border:2px dashed rgba(86,204,242,0.5);background:rgba(86,204,242,0.08);
  color:var(--accent);font-size:15px;font-weight:700;cursor:pointer;transition:all .2s}
.friends-invite-btn:active{opacity:.9;transform:scale(.98)}
.friends-invite-icon{display:inline-flex;align-items:center;justify-content:center}
.friends-invite-icon svg{width:22px;height:22px;stroke:currentColor}
.friends-invite-note{font-size:12px;color:var(--text2);margin-top:8px;max-width:260px;margin-left:auto;margin-right:auto}

/* Подвкладки Друзья: Рейтинг | Личный вызов */
.friends-subtabs{display:flex;gap:8px;margin-bottom:14px;flex-shrink:0}
.friends-subtab{padding:10px 16px;border-radius:12px;border:1px solid var(--border);background:var(--card);color:var(--text2);font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}
.friends-subtab:hover{color:var(--text);border-color:var(--text3)}
.friends-subtab.active{background:rgba(86,204,242,0.15);border-color:var(--accent);color:var(--accent)}
.friends-rating-panel{display:block}
.friends-challenge-panel{display:none}

/* Личный вызов: блоки */
.block-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px;margin-bottom:16px}
.challenge-explanation-wrap{overflow:hidden}
.challenge-explanation-header{display:flex;align-items:center;gap:10px;margin-bottom:0}
.challenge-explanation-wrap:not(.challenge-instruction-collapsed) .challenge-explanation-header{margin-bottom:10px}
.challenge-explanation-title{font-size:18px;font-weight:800;color:var(--text);margin:0;flex:1}
.challenge-instruction-toggle{width:28px;height:28px;border-radius:50%;border:1px solid var(--border);background:var(--card2);color:var(--text2);font-size:14px;cursor:pointer;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center}
.challenge-instruction-toggle:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.challenge-explanation-body{overflow:hidden;transition:opacity .2s}
.challenge-explanation-wrap.challenge-instruction-collapsed .challenge-explanation-body{display:none}
.challenge-explanation-text{font-size:14px;color:var(--text2);line-height:1.5;margin:0 0 12px}
.challenge-explanation-warn{background:rgba(255,193,7,0.15);border:1px solid rgba(255,193,7,0.4);border-radius:10px;padding:10px;margin:0 0 14px;color:var(--text)}
.challenge-explanation-list{font-size:14px;color:var(--text2);line-height:1.5;margin:0 0 12px;padding-left:18px}
.challenge-explanation-list li{margin-bottom:8px}
.challenge-explanation-ok{margin-top:4px}
.challenge-create-title{font-size:16px;font-weight:700;color:var(--text);margin:0 0 12px}
.challenge-create-label{display:block;font-size:13px;color:var(--text2);margin-bottom:6px}
.challenge-date-input{width:100%;max-width:200px;margin-bottom:12px}
.challenge-friends-checkboxes{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.challenge-friend-item{display:flex;align-items:center;gap:12px;cursor:pointer;font-size:14px;color:var(--text);padding:8px 10px;border-radius:12px;background:var(--card);border:1px solid var(--border);transition:background .2s,border-color .2s}
.challenge-friend-item:hover{background:var(--card2);border-color:var(--accent)}
.challenge-friend-item input{flex-shrink:0;margin:0}
.challenge-friend-avatar .friends-avatar-wrap{width:40px;height:40px}
.challenge-friend-name{flex:1;min-width:0}
.challenge-friend-checkbox{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:14px;color:var(--text)}
.challenge-friend-checkbox input{flex-shrink:0}
.challenge-create-btn{margin-top:8px}
.challenge-no-friends{font-size:13px;color:var(--text3);margin:0}
.challenge-list-title{font-size:16px;font-weight:700;color:var(--text);margin:0 0 10px}
.challenge-list-subtabs{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.challenge-list-subtab{padding:8px 14px;font-size:13px;border-radius:10px;border:1px solid var(--border);background:var(--card2);color:var(--text2);cursor:pointer;transition:all .2s}
.challenge-list-subtab:hover{background:var(--card);color:var(--text)}
.challenge-list-subtab.active{background:var(--accent);border-color:var(--accent);color:#fff}
.challenge-list{display:flex;flex-direction:column;gap:10px}
.challenge-list-empty{font-size:14px;color:var(--text3);padding:20px 0;margin:0}
.challenge-list-item{padding:14px;background:var(--card);border:1px solid var(--border);border-radius:14px;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:12px;flex-wrap:wrap;border-left-width:4px}
.challenge-list-item:hover{border-color:var(--accent);background:rgba(86,204,242,0.06)}
.challenge-list-item--pending{border-left-color:#e6b800}
.challenge-list-item--accepted{border-left-color:#2e7d32}
.challenge-list-item--active{border-left-color:var(--accent)}
.challenge-list-item--finished{border-left-color:#78909c}
.challenge-list-item-left{flex:1;min-width:0}
.challenge-list-item-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:6px}
.challenge-list-item-stage{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;padding:4px 8px;border-radius:8px;text-transform:uppercase;letter-spacing:.02em}
.challenge-list-item-stage--pending{background:rgba(230,184,0,.2);color:#b38600}
.challenge-list-item-stage--accepted{background:rgba(46,125,50,.15);color:#2e7d32}
.challenge-list-item-stage--active{background:rgba(86,204,242,.15);color:var(--accent)}
.challenge-list-item-stage--finished{background:rgba(120,144,156,.2);color:#607d8b}
.challenge-list-item-right{display:flex;align-items:center;gap:8px;flex-shrink:0}
.challenge-list-part-avatar{width:36px;height:36px;border-radius:50%;overflow:hidden;flex-shrink:0;border:2px solid;display:flex;align-items:center;justify-content:center;font-size:14px;background:var(--card2)}
.challenge-list-part-avatar img{width:100%;height:100%;object-fit:cover}
.challenge-list-part-avatar img.failed{display:none}
.challenge-list-part-placeholder{display:none;width:100%;height:100%;align-items:center;justify-content:center}
.challenge-list-part-avatar img.failed ~ .challenge-list-part-placeholder,.challenge-list-part-avatar .challenge-list-part-placeholder:only-child{display:flex}
.challenge-list-part-status--invited{border-color:#e6b800;background:#fffbe6}
.challenge-list-part-status--accepted{border-color:#2e7d32;background:#e8f5e9}
.challenge-list-part-status--declined{border-color:#c62828;background:#ffebee}
.challenge-list-part-status--dropped{border-color:#9e9e9e;background:#f5f5f5;opacity:0.85;filter:grayscale(0.5)}
.challenge-list-item-name{font-size:14px;font-weight:700;color:var(--text);margin-bottom:2px}
.challenge-list-item-dates{font-size:12px;color:var(--text2);margin:0}
.challenge-name-input{margin-bottom:12px;max-width:100%}
.challenge-list-item-status--pending{color:#b38600}
.challenge-list-item-status--active{color:#2e7d32}
.challenge-list-item-status--declined{color:#c62828}
.challenge-list-item-status--finished{color:var(--text2)}
.challenge-list-item-participants{font-size:13px;color:var(--text);margin-bottom:4px}
.challenge-list-item-verdict{font-size:12px;color:var(--text2);margin-top:6px;line-height:1.35}
.challenge-list-item-link{font-size:12px;color:var(--text2)}

/* Меню при тапе на друга — попап по центру */
.friends-friend-menu-modal{position:fixed;inset:0;z-index:200;display:none;
  align-items:center;justify-content:center;background:rgba(0,0,0,.7);backdrop-filter:blur(4px);
  padding:16px}
.friends-friend-menu-modal.open{display:flex}
.friends-friend-menu-modal .modal-backdrop{position:absolute;inset:0}
.friends-friend-menu-modal .modal-content{position:relative;background:var(--bg2);border-radius:var(--radius);max-height:90vh;overflow-y:auto;width:100%;max-width:320px;padding:20px;box-shadow:0 8px 32px rgba(0,0,0,.35)}

/* Деталь челленджа — по-прежнему снизу или по центру */
.challenge-detail-modal{position:fixed;inset:0;z-index:200;display:none;
  align-items:flex-end;justify-content:center;background:rgba(0,0,0,.7);backdrop-filter:blur(4px);
  padding:0;border-radius:0}
.challenge-detail-modal.open{display:flex}
.challenge-detail-modal .modal-backdrop{position:absolute;inset:0}
.challenge-detail-modal .modal-content{position:relative;background:var(--bg2);border-radius:var(--radius) var(--radius) 0 0;max-height:90vh;overflow-y:auto}
.friends-friend-menu-content{display:flex;flex-direction:column;gap:12px}
.friends-friend-menu-name{font-size:16px;font-weight:700;color:var(--text)}
.friends-friend-menu-btn{width:100%}

/* Карточки друзей в рейтинге — кликабельные */
.friends-row-tappable{cursor:pointer}
.friends-row-tappable:active{opacity:.9}

/* Модальное окно детали челленджа */
.challenge-detail-modal .modal-content{max-width:100%;width:min(96vw,480px);max-height:85vh;overflow-y:auto;padding:20px}
.challenge-detail-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;gap:12px}
.challenge-detail-title{font-size:18px;font-weight:700;color:var(--text);margin:0;line-height:1.3}
.challenge-detail-body{font-size:14px;color:var(--text2);line-height:1.45}
.challenge-detail-loading,.challenge-detail-error{padding:24px;text-align:center;color:var(--text3)}
.challenge-detail-respond,.challenge-detail-final,.challenge-detail-verdict,.challenge-detail-verdict-btn{margin-bottom:16px;padding:14px;background:var(--card2);border-radius:12px;border:1px solid var(--border)}
.challenge-detail-invited-warn{font-size:13px;color:var(--text2);background:rgba(255,193,7,0.12);border:1px solid rgba(255,193,7,0.35);border-radius:10px;padding:10px;margin:0 0 12px;line-height:1.45}
.challenge-detail-respond-btns{margin-top:8px}
.challenge-detail-before-start{margin-bottom:16px;padding:12px 14px;background:var(--card2);border-radius:12px;border:1px solid var(--border)}
.challenge-detail-before-start h4{font-size:14px;font-weight:700;color:var(--text);margin:0 0 8px}
.challenge-detail-before-list{margin:6px 0 10px;padding-left:18px;color:var(--text2)}
.challenge-detail-collage-ok{font-size:13px;color:var(--accent3);margin:6px 0}
.challenge-detail-measurement-preview{margin:8px 0;padding:8px 10px;background:var(--bg2);border-radius:8px}
.challenge-detail-measurement-preview-date{font-size:12px;color:var(--text3);margin:0 0 6px}
.challenge-detail-measurement-preview-list{list-style:none;margin:0;padding:0;font-size:13px;display:grid;grid-template-columns:1fr 1fr;gap:4px 12px}
.challenge-detail-measurement-preview-list li{color:var(--text2)}
.challenge-detail-measurement-compact{font-size:12px;color:var(--text2);margin:4px 0 8px;padding:6px 8px;background:var(--bg2);border-radius:8px;line-height:1.35}
.challenge-detail-start-collage-preview{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin:8px 0;border-radius:10px;overflow:hidden;max-width:160px}
.challenge-detail-start-collage-preview img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
.challenge-detail-collage-warn{font-size:13px;color:var(--accent2);margin:8px 0}
.challenge-detail-update-measures{margin-top:8px}
.challenge-detail-measures-hint{font-size:12px;color:var(--text3);margin:10px 0 0}
.challenge-detail-btn-measures,.challenge-detail-btn-collage{margin-bottom:8px;display:block;width:100%}
.challenge-detail-btn-collage{margin-top:6px}
.challenge-detail-collage-hint{font-size:12px;color:var(--text2);margin:0 0 6px;line-height:1.35}
.challenge-detail-in-game-msg{font-size:16px;font-weight:700;color:var(--accent);margin:0;padding:8px 0}
.challenge-in-game-popup-text{margin:0 0 16px;font-size:14px;line-height:1.45;color:var(--text2);text-align:center}
.challenge-detail-respond p,.challenge-detail-final p{margin:0 0 10px}
.challenge-verdict-text{white-space:pre-wrap;margin:0;line-height:1.5}
.challenge-detail-verdict-text{white-space:pre-wrap;margin:0;line-height:1.5}
.challenge-detail-test-verdict{margin-bottom:16px;padding:14px;background:var(--card2);border-radius:12px;border:1px solid var(--border);border-left:3px solid var(--accent2)}
.challenge-detail-test-verdict h4{font-size:14px;font-weight:700;color:var(--text);margin:0 0 8px}
.challenge-detail-test-verdict-hint{font-size:12px;color:var(--text3);margin:0 0 10px;line-height:1.4}
.challenge-detail-test-verdict-row{margin-bottom:10px;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.challenge-detail-test-verdict-row select{padding:6px 10px;border-radius:8px;border:1px solid var(--border);background:var(--bg);color:var(--text)}
.challenge-test-verdict-result{margin-top:12px;padding:10px 12px;background:var(--bg2);border-radius:8px;font-size:13px;line-height:1.5;white-space:pre-wrap;max-height:200px;overflow-y:auto}
.challenge-test-verdict-result.challenge-test-verdict-error{color:var(--accent2);background:rgba(220,53,69,0.08)}
.challenge-detail-admin-test{margin-bottom:16px;padding:14px;background:var(--card2);border-radius:12px;border:1px solid var(--border);border-left:3px solid var(--accent)}
.challenge-detail-admin-pushes{margin-bottom:16px;padding:14px;background:var(--card2);border-radius:12px;border:1px solid var(--border)}
.challenge-admin-push-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.challenge-admin-push-btns .btn{margin:0}
.challenge-detail-admin-measures{margin-bottom:16px;padding:14px;background:var(--card2);border-radius:12px;border:1px solid var(--border)}
.challenge-admin-measure-row{margin:10px 0;display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:13px}
.challenge-admin-measure-row input[type="date"]{padding:4px 8px}
.challenge-admin-collage-row{flex-wrap:wrap;gap:8px 12px}
.challenge-admin-collage-label{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px}
.challenge-admin-collage-lbl{font-size:11px;color:var(--text3);font-weight:600}
.challenge-admin-collage-label input[type="file"]{font-size:12px;max-width:120px}
.challenge-list-item-stage--test{background:var(--accent2);color:#fff;margin-left:4px}
.challenge-detail-participants{margin-top:20px}
.challenge-progress-wrap{margin-bottom:16px}
.challenge-progress-bar{display:flex;justify-content:space-between;align-items:flex-start;gap:4px;padding:8px 0}
.challenge-progress-step{display:flex;flex-direction:column;align-items:center;flex:1;min-width:0;opacity:0.5;transition:opacity .2s}
.challenge-progress-step--active{opacity:1}
.challenge-progress-step--current .challenge-progress-emoji{transform:scale(1.2);filter:brightness(1.1)}
.challenge-progress-emoji{font-size:18px;margin-bottom:2px;transition:transform .2s, filter .2s}
.challenge-progress-step:not(.challenge-progress-step--active) .challenge-progress-emoji{filter:brightness(0.45);opacity:0.9}
.challenge-progress-label{font-size:9px;font-weight:700;color:var(--text2);text-align:center;line-height:1.2}
.challenge-progress-date{font-size:8px;color:var(--text3);margin-top:2px;display:block}
.challenge-progress-track{height:8px;background:var(--border);border-radius:4px;overflow:hidden;margin-top:6px}
.challenge-progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:4px;transition:width .3s ease}
.challenge-detail-participants h4{font-size:14px;font-weight:700;color:var(--text);margin:0 0 10px}
.challenge-detail-participants-hint{font-size:12px;color:var(--text3);margin:0 0 12px;line-height:1.4}
.challenge-detail-leave-wrap{margin:12px 0}
.challenge-detail-leave-btn{font-size:12px}
.challenge-part-started{font-size:11px;color:var(--accent);font-weight:600;margin-left:6px}
.challenge-part-card{border:1px solid var(--border);border-radius:14px;margin-bottom:12px;overflow:hidden;cursor:pointer;transition:border-color .2s, box-shadow .2s}
.challenge-part-card:hover{border-color:var(--text3)}
.challenge-part-card:active{opacity:.97}
.challenge-part-header{display:flex;align-items:center;gap:12px;padding:14px 14px}
.challenge-part-avatar{width:48px;height:48px;border-radius:50%;overflow:hidden;flex-shrink:0;background:var(--card2);display:flex;align-items:center;justify-content:center;font-size:18px}
.challenge-part-avatar img{width:100%;height:100%;object-fit:cover}
.challenge-part-avatar img.failed{display:none}
.challenge-part-avatar .friends-avatar-placeholder{display:flex;width:100%;height:100%;align-items:center;justify-content:center}
.challenge-part-info{flex:1;min-width:0}
.challenge-part-name{font-size:15px;font-weight:700;color:var(--text)}
.challenge-part-toggle{font-size:12px;color:var(--text3);flex-shrink:0;margin-left:8px}
.challenge-part-invited{font-size:11px;color:var(--accent);font-weight:600;margin-left:6px}
.challenge-part-declined{font-size:11px;color:var(--text3);margin-left:6px}
.challenge-part-expanded{padding:12px 14px 14px;border-top:1px solid var(--border);background:var(--card2)}
.challenge-part-section-title{font-size:11px;font-weight:700;color:var(--text2);margin:0 0 8px;text-transform:uppercase;letter-spacing:.04em}
.challenge-part-measurements{padding-top:8px;margin-bottom:12px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.challenge-part-measurements:last-child{margin-bottom:0}
.challenge-part-meas-row{font-size:13px;color:var(--text2);margin-bottom:6px;line-height:1.4}
.challenge-part-meas-row:last-child{margin-bottom:0}
.challenge-part-meas-label{font-weight:600;color:var(--text);margin-right:6px}
.challenge-part-empty{font-size:12px;color:var(--text3);margin:0;line-height:1.4}
/* Таблица замеров: период × характеристики */
.challenge-meas-table{width:100%;min-width:260px;border-collapse:collapse;font-size:11px;table-layout:fixed}
.challenge-meas-table th,.challenge-meas-table td{border:1px solid var(--border);padding:6px 4px;text-align:center;vertical-align:middle}
.challenge-meas-table th{background:var(--card2);font-weight:700;color:var(--text2)}
.challenge-meas-th,.challenge-meas-th-period{font-size:8px;line-height:1.15;padding:3px 2px}
.challenge-meas-td-period{text-align:left;font-weight:600;color:var(--text);min-width:48px;max-width:64px;font-size:9px;padding:4px 2px}
.challenge-meas-table td{color:var(--text2)}
.challenge-part-card--dropped{opacity:0.65;background:var(--card2)}
.challenge-part-card--dropped .challenge-part-avatar,.challenge-part-card--dropped .challenge-part-name{filter:grayscale(0.6)}
.challenge-part-dropped{font-size:11px;color:var(--text3);margin-left:6px}
.challenge-part-collages{margin-top:8px}
.challenge-part-collages .challenge-part-section-title{margin-bottom:8px}
.challenge-part-collages{display:flex;flex-wrap:wrap;gap:10px}
.challenge-part-collage{flex:1;min-width:120px}
.challenge-part-collage-lbl{display:block;font-size:11px;color:var(--text3);margin-bottom:4px}
.challenge-part-collage-imgs{display:grid;grid-template-columns:repeat(2,1fr);gap:4px;border-radius:8px;overflow:hidden}
.challenge-part-collage-imgs img{width:100%;aspect-ratio:1;object-fit:cover;display:block}

.friends-avatar-wrap{width:44px;height:44px;border-radius:50%;overflow:hidden;flex-shrink:0;
  background:var(--card2);display:flex;align-items:center;justify-content:center;font-size:20px}
.friends-avatar-wrap img{width:100%;height:100%;object-fit:cover}
.friends-avatar-wrap img.failed{display:none}
.friends-avatar-wrap .friends-avatar-placeholder{display:none;width:100%;height:100%;
  align-items:center;justify-content:center;background:var(--card2)}
.friends-avatar-wrap img.failed + .friends-avatar-placeholder{display:flex}
.day-status-dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:4px}
.quality-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}

/* Add friend */
.add-friend-form{padding:0 12px 12px}
.input-row{display:flex;gap:8px}
.text-input{flex:1;background:var(--card);border:1px solid var(--border);
  border-radius:12px;padding:10px 14px;color:var(--text);font-size:14px;
  outline:none;font-family:var(--font)}
.text-input:focus{border-color:var(--accent)}
.btn{padding:10px 18px;border-radius:12px;border:none;font-size:13px;font-weight:700;
  cursor:pointer;transition:all .2s}
.btn.primary{background:linear-gradient(135deg,#56ccf2,#2bc5ba);color:#0d1320;font-weight:600;box-shadow:0 4px 12px rgba(86,204,242,0.3)}
.btn-loading{opacity:0.9;cursor:wait;pointer-events:none;animation:btn-loading-pulse 1.2s ease-in-out infinite}
@keyframes btn-loading-pulse{50%{opacity:0.7}}
.btn.secondary{background:var(--card2);color:var(--text);border:1px solid var(--border)}
.btn:active{transform:scale(.95);opacity:.85}
.btn-full{width:100%;padding:12px;border-radius:14px;border:none;font-size:15px;font-weight:700;
  cursor:pointer;transition:all .2s;display:block}
.btn-full.primary{background:linear-gradient(135deg,#56ccf2,#2bc5ba);color:#0d1320;font-weight:600;box-shadow:0 4px 12px rgba(86,204,242,0.3)}
.btn-full:active{transform:scale(.98);opacity:.9}

/* ═══════════════════════════════════════════════════
   PROFILE SCREEN — как у Прогресс/Друзья: на всю ширину
═══════════════════════════════════════════════════ */
#screen-profile{flex:1 1 100%;min-width:0}
#screen-profile.active{display:flex;flex-direction:column;min-height:0;overflow:hidden;width:100%}
.profile-page-wrap{flex:1;min-height:0;overflow-y:auto;padding:var(--pad-v) var(--pad-h) var(--nav-bottom);box-sizing:border-box;width:100%;min-width:0}
#screen-profile .profile-page-wrap,#screen-profile .profile-hero,#screen-profile .profile-section,#screen-profile .profile-card,#screen-profile .profile-norm-grid,#screen-profile .profile-actions,#screen-profile .profile-admin-wrap{max-width:none;width:100%}
.profile-hero{display:flex;align-items:center;gap:20px;padding:24px 0 20px}
.profile-avatar-wrap{flex-shrink:0;position:relative}
.profile-avatar{width:72px;height:72px;border-radius:20px;font-size:36px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(145deg,var(--accent) 0%,var(--accent2) 100%);
  box-shadow:0 8px 24px rgba(86,204,242,.25);border:2px solid rgba(255,255,255,.08)}
.profile-avatar-img{position:absolute;left:0;top:0;width:72px;height:72px;border-radius:20px;object-fit:cover;display:none;z-index:1}
.profile-avatar-img.visible{display:block}
.profile-avatar-wrap .profile-avatar--placeholder{position:relative;z-index:0}
.profile-avatar--placeholder{background:linear-gradient(145deg,var(--accent) 0%,var(--accent2) 100%);box-shadow:0 8px 24px rgba(86,204,242,.25);border:2px solid rgba(255,255,255,.08)}
.profile-hero-text{min-width:0;flex:1}
.profile-hero .profile-name{font-size:22px;font-weight:800;color:var(--text);letter-spacing:-0.02em;margin:0 0 4px;line-height:1.2}
.profile-hero .profile-sub{font-size:13px;color:var(--text2);margin:0}
.bmi-badge{display:inline-block;margin-top:10px;background:rgba(74,222,128,.18);color:var(--accent3);
  border-radius:999px;padding:6px 14px;font-size:12px;font-weight:700;border:1px solid rgba(74,222,128,.35);
  cursor:pointer;transition:transform .15s, opacity .2s}
.bmi-badge:active{opacity:.9;transform:scale(.98)}
.bmi-badge--out{background:rgba(248,113,113,.18);color:var(--red);border-color:rgba(248,113,113,.4)}

.profile-section{margin-bottom:24px}
.profile-section-title{font-size:13px;font-weight:700;color:var(--text2);margin:0 0 8px;display:flex;align-items:center;gap:8px;letter-spacing:.02em}
.profile-section-dot{width:4px;height:4px;border-radius:50%;background:var(--accent);flex-shrink:0}
.profile-section-hint{font-size:11px;color:var(--text3);margin:-4px 0 12px}
.profile-tabs{display:flex;gap:8px;margin:0 0 12px;flex-wrap:nowrap;overflow:hidden}
.profile-tabs--top{padding:6px 0 12px}
.profile-tab{flex:1;min-width:0;background:var(--card2);border:1px solid var(--border);border-radius:14px;padding:10px 8px;color:var(--text2);font-size:12px;font-weight:700;cursor:pointer;transition:all .15s ease;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.profile-tab.active{background:var(--accent);color:#0d1320;border-color:var(--accent)}
.profile-tab--hidden{visibility:hidden;pointer-events:none}
.profile-tab-panel{display:block}
.profile-main-panel{display:block}

.profile-card{background:var(--card);border-radius:16px;border:1px solid var(--border);overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,.2)}
.profile-card--compact .profile-info-row--last{border-bottom:none}
.profile-info-row{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--border);transition:background .15s;cursor:default}
.profile-info-row:last-child,.profile-info-row--last{border-bottom:none}
.profile-info-row[onclick]{cursor:pointer}
.profile-info-row[onclick]:active{background:var(--card2)}
.profile-info-lbl{font-size:14px;color:var(--text2)}
.profile-info-val{font-size:15px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:6px}
.profile-info-edit{font-size:12px;font-weight:600;color:var(--accent);opacity:.9}

.profile-norm-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.profile-norm-card{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:14px;text-align:left;
  background:var(--card);border:1px solid var(--border);border-radius:14px;cursor:pointer;transition:all .2s;
  box-shadow:0 2px 8px rgba(0,0,0,.15)}
.profile-norm-card:active{transform:scale(.98);background:var(--card2);border-color:rgba(86,204,242,.2)}
.profile-norm-card--wide{grid-column:1 / -1}
.profile-norm-icon{font-size:22px;line-height:1}
.profile-norm-val-unit{display:flex;align-items:baseline;gap:2px;flex-wrap:wrap}
.profile-norm-val{font-size:20px;font-weight:800;color:var(--text);letter-spacing:-0.02em}
.profile-norm-unit{font-size:14px;font-weight:600;color:var(--text2)}
.profile-norm-lbl{font-size:11px;color:var(--text3);margin-top:2px}

.profile-btn{width:100%;padding:14px 20px;border-radius:14px;font-size:15px;font-weight:700;border:none;cursor:pointer;transition:transform .15s, opacity .2s}
.profile-btn:active{transform:scale(.99);opacity:.95}
.profile-btn--primary{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#0d1320;margin-top:12px;box-shadow:0 4px 16px rgba(86,204,242,.3)}
.profile-btn--secondary{background:var(--card2);color:var(--text);border:1px solid var(--border);margin:0}
.profile-actions{margin-top:8px}
.profile-actions .profile-btn + .profile-btn{margin-top:8px}
.profile-admin-wrap{margin-bottom:12px}
.profile-admin-link{display:block;text-align:center;padding:12px;background:var(--card2);border-radius:12px;color:var(--text3);font-size:13px;font-weight:600;text-decoration:none;border:1px solid var(--border);transition:background .2s}
.profile-admin-link:active{background:var(--card)}

/* Cycle toggle switch */
.cycle-toggle-row{display:flex;justify-content:space-between;align-items:center}
.cycle-toggle-switch{position:relative;display:inline-block;width:48px;height:26px;flex-shrink:0}
.cycle-toggle-switch input{opacity:0;width:0;height:0}
.cycle-toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:var(--card2);border:1px solid var(--border);border-radius:26px;transition:.2s}
.cycle-toggle-slider:before{position:absolute;content:"";height:20px;width:20px;left:2px;bottom:2px;background:var(--text3);border-radius:50%;transition:.2s}
.cycle-toggle-switch input:checked+.cycle-toggle-slider{background:var(--accent);border-color:var(--accent)}
.cycle-toggle-switch input:checked+.cycle-toggle-slider:before{transform:translateX(22px);background:#0d1320}

/* Cycle history list */
.cycle-history-toggle{width:100%;display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:transparent;border:none;color:var(--text2);font-size:13px;font-weight:700;cursor:pointer;text-align:left;transition:background .15s}
.cycle-history-toggle:active{background:var(--card2)}
.cycle-history-toggle-icon{font-size:10px;opacity:.8;transition:transform .2s}
.cycle-history-list-wrap{border-top:1px solid var(--border)}
.cycle-history-item{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid var(--border);font-size:14px}
.cycle-history-item:last-child{border-bottom:none}
.cycle-history-date{font-weight:600;color:var(--text)}
.cycle-history-length{font-size:12px;color:var(--text2)}
.cycle-history-length-edit{cursor:pointer;padding:2px 6px;border-radius:6px;transition:background .15s}
.cycle-history-length-edit:hover{background:var(--card2);color:var(--accent)}
.cycle-history-length-input{width:48px;padding:4px 8px;font-size:13px;background:var(--card);border:1px solid var(--accent);border-radius:8px;color:var(--text);text-align:center}

/* Comment row: label above value, smaller font to avoid overlap */
.profile-info-row--comment{flex-direction:column;align-items:flex-start;gap:6px}
.profile-info-row--comment .profile-info-lbl{margin-bottom:0;font-size:12px}
.profile-info-row--comment .profile-info-val{font-size:12px;font-weight:500;line-height:1.4;align-items:flex-start}

/* Legacy (measure alert still uses .info-row etc) */
.info-row{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--border);cursor:pointer;background:var(--card);transition:background .2s}
.info-row:active{background:var(--card2)}
.info-row:first-child{border-radius:var(--radius) var(--radius) 0 0}
.info-row:last-child{border-bottom:none;border-radius:0 0 var(--radius) var(--radius)}
.info-lbl{font-size:14px;color:var(--text2)}
.info-val{font-size:14px;font-weight:600;display:flex;align-items:center;gap:4px}
.info-edit{color:var(--accent);font-size:12px}
.section-label{font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.8px;padding:12px 12px 6px}
.norm-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;padding:0 12px 12px}
.norm-card{background:var(--card);border-radius:var(--radius-sm);padding:12px;border:1px solid var(--border)}
.norm-icon{font-size:20px;margin-bottom:4px}
.norm-val{font-size:18px;font-weight:800}
.norm-unit{font-size:11px;color:var(--text3)}
.norm-lbl{font-size:10px;color:var(--text2);margin-top:2px}

.bmi-modal-text{font-size:14px;color:var(--text2);line-height:1.5;margin:0 0 10px}
.friends-rules-body{font-size:14px;color:var(--text2);line-height:1.55;margin:0}
.friends-rules-body strong{color:var(--text)}
.edit-norm-unit{margin-left:8px;font-size:14px;color:var(--text2)}
#edit-norm-modal .form-group{display:flex;align-items:center;flex-wrap:wrap}

/* Progress photos & collage */
.progress-add-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;margin-bottom:12px;
  background:var(--card);border:2px solid var(--accent);border-radius:12px;color:var(--text);font-size:14px;font-weight:600;cursor:pointer;
  transition:background .2s,border-color .2s,box-shadow .2s;text-align:left;font-family:inherit;box-shadow:0 0 0 1px rgba(86,204,242,.15)}
.progress-add-toggle:hover,.progress-add-toggle:active{background:rgba(86,204,242,.08);border-color:var(--accent);box-shadow:0 0 0 2px rgba(86,204,242,.25)}
.progress-add-toggle-icon{font-size:20px;line-height:1;font-weight:300;opacity:.95;min-width:24px;text-align:center}
.progress-add-block{margin-top:4px}
.progress-add-block .profile-section-hint{margin:0 0 10px}
.progress-photo-upload{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-bottom:12px;min-width:0;overflow:hidden}
.progress-photo-slot{display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:100px;min-width:0;aspect-ratio:3/4;background:var(--card2);border:2px dashed var(--border);border-radius:10px;
  cursor:pointer;transition:all .2s;position:relative;overflow:hidden}
.progress-photo-slot:hover,.progress-photo-slot:active{border-color:var(--accent);background:rgba(86,204,242,.08)}
.progress-photo-slot .progress-photo-input{position:absolute;opacity:0;width:100%;height:100%;top:0;left:0;cursor:pointer}
.progress-photo-preview{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:var(--card)}
.progress-photo-preview img{width:100%;height:100%;object-fit:cover;display:block}
.progress-photo-preview:empty::before{content:'📷';font-size:24px;opacity:.8}
.progress-photo-lbl{position:absolute;bottom:0;left:0;right:0;padding:4px 2px;font-size:9px;font-weight:700;color:rgba(255,255,255,.95);background:linear-gradient(transparent,rgba(0,0,0,.7));text-align:center;z-index:1}
.progress-collage-date{font-size:13px;font-weight:700;color:var(--text2);margin-bottom:8px}
.progress-collage-wrap{display:flex;flex-direction:row;gap:2px;border-radius:12px;overflow:hidden;background:var(--card2);min-height:180px}
.progress-collage-cell{position:relative;flex:1;min-width:0;aspect-ratio:3/4;background:var(--card);overflow:hidden}
.progress-collage-cell img{width:100%;height:100%;object-fit:cover;display:block}
.progress-collage-cell-lbl{position:absolute;bottom:0;left:0;right:0;padding:4px;font-size:10px;font-weight:600;color:rgba(255,255,255,.9);background:linear-gradient(transparent,rgba(0,0,0,.6));text-align:center}
.progress-collage-empty{display:flex;align-items:center;justify-content:center;color:var(--text3);font-size:11px}
.progress-challenge-pick-wrap{margin-top:12px;margin-bottom:16px;padding:12px;background:var(--card2);border-radius:12px;border:1px solid var(--border)}
.progress-challenge-pick-title{font-size:14px;font-weight:700;color:var(--text);margin:0 0 6px}
.progress-challenge-pick-hint{font-size:12px;color:var(--text3);margin:0 0 10px;line-height:1.35}
.progress-challenge-pick-preview{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;border-radius:8px;overflow:hidden;min-height:80px}
.progress-challenge-pick-cell{aspect-ratio:3/4;background:var(--card);overflow:hidden}
.progress-challenge-pick-cell img{width:100%;height:100%;object-fit:cover;display:block}
.progress-challenge-pick-cell.progress-collage-empty{display:flex;align-items:center;justify-content:center;color:var(--text3);font-size:11px}
.progress-collages-list{display:flex;flex-direction:column;gap:16px;margin-top:12px}
.progress-collage-card{overflow:hidden;min-width:0;background:var(--card);border-radius:16px;border:1px solid var(--border);padding:12px;box-shadow:0 4px 16px rgba(0,0,0,.2);position:relative}
.progress-collage-card--clickable{cursor:pointer;transition:opacity .2s,transform .15s}
.progress-collage-delete{position:absolute;top:8px;right:8px;width:28px;height:28px;border-radius:50%;background:rgba(0,0,0,.5);border:none;color:#fff;font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2;opacity:.9;transition:opacity .2s,background .2s}
.progress-collage-delete:hover,.progress-collage-delete:active{background:rgba(220,38,38,.9);opacity:1}
.progress-collage-card--clickable:hover,.progress-collage-card--clickable:active{opacity:.92;transform:scale(.99)}
.progress-collage-card .progress-collage-date{font-size:13px;font-weight:700;color:var(--text2);margin-bottom:8px;word-wrap:break-word;overflow-wrap:break-word;max-width:100%}
.progress-collage-card .progress-collage-wrap{display:flex;flex-direction:row;gap:2px;border-radius:12px;overflow:hidden;background:var(--card2);min-height:180px;max-width:100%;min-width:0}
@media (max-width:480px){
  .progress-photo-upload{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Measurement alert */
.measure-alert{margin:0 0 12px;background:rgba(245,158,11,.1);border:1px solid rgba(245,158,11,.3);
  border-radius:14px;padding:14px}
.profile-page-wrap .measure-alert{margin:0 0 16px}
.measure-alert-title{font-size:14px;font-weight:700;color:var(--yellow);margin-bottom:6px}
.measure-alert-text{font-size:12px;color:var(--text2);margin-bottom:10px}
.measure-alert-actions{display:flex;gap:6px;flex-wrap:wrap}
.measure-alert-btn{background:var(--yellow);color:#000;border:none;border-radius:10px;
  padding:7px 12px;font-size:11px;font-weight:700;cursor:pointer;transition:all .2s}
.measure-alert-btn.ghost{background:transparent;color:var(--text3);border:1px solid var(--border)}
.measure-alert-btn:active{transform:scale(.95)}

/* ═══════════════════════════════════════════════════
   MODALS
═══════════════════════════════════════════════════ */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:200;
  display:none;align-items:flex-end;justify-content:center;backdrop-filter:blur(4px)}
.modal-overlay.open{display:flex}
.modal{background:var(--bg2);border-radius:var(--radius) var(--radius) 0 0;width:100%;
  max-width:min(100vw - 16px,480px);padding:var(--pad-v) var(--pad-h);max-height:90vh;max-height:90dvh;overflow-y:auto;
  padding-bottom:calc(var(--pad-v) + env(safe-area-inset-bottom,0));
  animation:slideUp .3s ease-out}
@keyframes slideUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
.modal-handle{width:40px;height:4px;background:var(--border);border-radius:4px;
  margin:0 auto 16px}
.modal-title{font-size:18px;font-weight:800;margin-bottom:16px}
.form-group{margin-bottom:14px}
.form-label{font-size:12px;font-weight:700;color:var(--text2);margin-bottom:6px;display:block}
.form-input{width:100%;background:var(--card);border:1px solid var(--border);
  border-radius:12px;padding:11px 14px;color:var(--text);font-size:14px;outline:none;
  font-family:var(--font);transition:border-color .2s}
.form-input:focus{border-color:var(--accent)}
select.form-input option{background:var(--card);color:var(--text)}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}

/* Cycle modal: адаптация под разные экраны */
#cycle-modal .modal{width:100%;max-width:min(calc(100vw - 24px),420px);margin:0 auto;box-sizing:border-box;overflow-x:hidden}
#cycle-modal .form-group{min-width:0}
#cycle-modal .form-input{min-width:0;max-width:100%;box-sizing:border-box}
#cycle-modal input[type="date"]{min-width:0;width:100%}
#cycle-modal .cycle-modal-hint{margin-bottom:12px;word-wrap:break-word;overflow-wrap:break-word}
#cycle-modal .cycle-modal-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
#cycle-modal .cycle-modal-actions .btn-full{flex:1;min-width:120px}
#cycle-modal .cycle-modal-delete{margin-top:10px;width:100%}
#cycle-modal .form-label{word-wrap:break-word}
@media (max-width:380px){
  #cycle-modal .cycle-modal-grid{grid-template-columns:1fr}
  #cycle-modal .modal-title{font-size:16px}
  #cycle-modal .cycle-modal-actions .btn-full{min-width:100%}
}
@media (min-width:481px){
  #cycle-modal .modal{max-height:85vh;max-height:85dvh}
}

/* Редактирование приёма с несколькими продуктами */
.modal.edit-food-multi{max-width:520px}
.ef-product-row{background:var(--card2);border-radius:12px;padding:14px;margin-bottom:14px;border:1px solid var(--border)}
.ef-product-row .ef-product-top{display:flex;gap:10px;align-items:center;margin-bottom:12px}
.ef-product-row .ef-p-name{flex:1;min-width:0}
.ef-product-row .ef-weight-wrap{display:flex;align-items:center;gap:6px;width:100px;flex-shrink:0}
.ef-product-row .ef-weight-wrap label{font-size:12px;color:var(--text2);white-space:nowrap}
.ef-product-row .ef-weight-wrap input{width:64px;text-align:right}
.ef-product-row .ef-kbju-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.ef-product-row .ef-kbju-cell{min-width:0}
.ef-product-row .ef-kbju-cell label{font-size:11px;font-weight:600;color:var(--text2);display:block;margin-bottom:4px}
.ef-product-row .ef-kbju-cell input{width:100%;text-align:right;padding:8px 10px;font-size:14px;min-width:0;box-sizing:border-box}
.ef-product-row .meal-item-action-btn{flex-shrink:0}
.ef-product-row.ef-row-loading{position:relative;pointer-events:none}
.ef-product-row.ef-row-loading .ef-row-loading-indicator{display:flex!important}
.ef-row-loading-indicator{display:none;align-items:center;justify-content:center;gap:6px;position:absolute;inset:0;background:rgba(0,0,0,.55);border-radius:12px;color:#fff;font-size:12px;font-weight:600;z-index:2}
.ef-product-name-hint{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--text2);margin-top:4px;margin-bottom:8px;line-height:1.35}
.ef-product-name-hint .ef-hint-icon{font-size:13px;flex-shrink:0;opacity:0.9}
.ef-edit-hint-popup{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.5);z-index:10;padding:16px;box-sizing:border-box}
.ef-edit-hint-inner{background:var(--card);border-radius:16px;padding:20px;max-width:360px;width:100%;max-height:85vh;overflow-y:auto;border:1px solid var(--border);box-shadow:0 8px 32px rgba(0,0,0,.25)}
.ef-edit-hint-title{font-size:16px;font-weight:700;margin-bottom:12px;color:var(--text)}
.ef-edit-hint-p{font-size:13px;color:var(--text2);margin-bottom:12px;line-height:1.45}
.ef-edit-hint-list{font-size:12px;color:var(--text2);line-height:1.5;margin:0 0 16px;padding-left:18px}
.ef-edit-hint-list li{margin-bottom:10px}
.ef-edit-hint-list em{font-size:11px;color:var(--text3);display:block;margin-top:4px}
#ef-edit-hint-dismiss{margin-top:4px}
.segmented{display:flex;gap:4px;background:var(--card);padding:4px;border-radius:12px;border:1px solid var(--border)}
.seg-opt{flex:1;padding:8px;border-radius:8px;font-size:13px;font-weight:700;
  text-align:center;cursor:pointer;color:var(--text2);transition:all .2s}
.seg-opt.active{background:var(--accent);color:#fff}
.seg-opt:active{opacity:.8}

/* Day detail modal */
.day-modal-score{font-size:40px;text-align:center;margin-bottom:8px}
.day-modal-pct{font-size:28px;font-weight:800;text-align:center;margin-bottom:4px}
.day-modal-date{font-size:13px;color:var(--text2);text-align:center;margin-bottom:16px}
.day-stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:16px}
.day-stat{background:var(--card2);border-radius:10px;padding:10px;text-align:center}
.day-stat-icon{font-size:18px;margin-bottom:4px}
.day-stat-val{font-size:16px;font-weight:700}
.day-stat-sub{font-size:10px;color:var(--text3)}

/* Toast */
.toast{position:fixed;top:max(16px,env(safe-area-inset-top,16px));left:50%;transform:translateX(-50%) translateY(-120%);
  background:var(--card);color:var(--text);padding:12px 20px;border-radius:24px;
  font-size:13px;font-weight:600;z-index:999;transition:transform .35s cubic-bezier(.175,.885,.32,1.275);
  border:1px solid var(--border);box-shadow:var(--shadow);
  max-width:min(calc(100vw - 32px),360px);white-space:normal;line-height:1.4;text-align:center}
.toast.show{transform:translateX(-50%) translateY(0)}

/* Onboarding */
#onboarding{position:fixed;inset:0;background:var(--bg);z-index:300;display:none;
  flex-direction:column;overflow-y:auto}
#onboarding.visible{display:flex}
.onboard-step{display:none;flex-direction:column;padding:20px;min-height:100vh;justify-content:center}
.onboard-step.active{display:flex}
.onboard-emoji{font-size:64px;text-align:center;margin-bottom:16px}
.onboard-avatar{text-align:center;margin-bottom:16px}
.onboard-avatar-img{width:80px;height:80px;border-radius:50%;object-fit:cover;display:inline-block}
.onboard-title{font-size:26px;font-weight:800;text-align:center;margin-bottom:8px}
.onboard-sub{font-size:14px;color:var(--text2);text-align:center;margin-bottom:28px;line-height:1.6}
.onboard-welcome-text{font-size:14px;color:var(--text2);text-align:left;margin-bottom:24px;line-height:1.6;padding:0 8px}
.onboard-welcome-text ul{margin:6px 0 14px;padding-left:20px}
.onboard-welcome-text p{margin:0 0 4px;font-weight:600;color:var(--text)}
.onboard-skip{display:block;width:100%;margin-top:14px;padding:10px;background:transparent;border:none;color:var(--text3);font-size:13px;cursor:pointer}
.onboard-skip:active{opacity:.8}
.onboard-note{font-size:12px;color:var(--text3);text-align:center;margin:0 0 20px;line-height:1.4}
.onboard-dots{display:flex;gap:8px;justify-content:center;margin-bottom:28px}
.odot{width:8px;height:8px;border-radius:50%;background:var(--border)}
.odot.active{background:var(--accent);width:24px;border-radius:4px;transition:width .3s}
.goal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px}
.goal-grid-4{grid-template-columns:repeat(2,1fr)}
.goal-opt{background:var(--card);border:2px solid var(--border);border-radius:14px;
  padding:16px 8px;text-align:center;cursor:pointer;transition:all .2s}
.goal-opt.selected{border-color:var(--accent);background:rgba(86,204,242,.1)}
.goal-opt:active{transform:scale(.95)}
.goal-opt-icon{font-size:28px;margin-bottom:6px}
.goal-opt-lbl{font-size:12px;font-weight:700}
.goal-opt-sub{font-size:10px;color:var(--text3);margin-top:2px}
.goal-grid-inline{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}

/* Chat onboarding card */
.chat-onboarding-card{background:linear-gradient(135deg,var(--card2),var(--card));border:1px solid var(--border);
  border-radius:16px;padding:16px;margin-bottom:12px;box-shadow:var(--shadow)}
.chat-onboarding-title{font-size:14px;font-weight:700;color:var(--text);margin-bottom:6px;line-height:1.4}
.chat-onboarding-note{font-size:12px;color:var(--text3);margin-bottom:14px}
.first-use-tip .chat-onboarding-note{margin-bottom:12px}
.first-use-add-hint{font-size:12px;color:var(--text3);background:var(--card2);border:1px solid var(--border);
  border-radius:10px;padding:10px 12px;margin-top:8px;margin-bottom:8px;line-height:1.4}
.btn-inline{background:var(--accent);color:#0d1320;border:none;border-radius:8px;padding:4px 10px;
  font-size:12px;font-weight:600;cursor:pointer;margin-left:6px;display:inline-block}
.btn-inline:hover,.btn-inline:active{opacity:.9}
.first-use-tip-inline{background:var(--card2);border:1px solid var(--border);border-radius:12px;padding:12px;margin-bottom:12px}
.first-use-tip-inline-title{font-size:13px;font-weight:700;color:var(--text);margin-bottom:8px}
.first-use-tip-inline ul{margin:0 0 12px;padding-left:18px;font-size:12px;color:var(--text2);line-height:1.5}

.diary-first-hint{background:var(--card2);border:1px solid var(--border);border-radius:12px;padding:14px;margin-bottom:12px}
.diary-first-hint-text{font-size:13px;font-weight:600;color:var(--text);margin:0 0 8px;line-height:1.4}
.diary-first-hint-list{margin:0 0 12px;padding-left:18px;font-size:12px;color:var(--text2);line-height:1.5}
.diary-first-hint .btn-full{margin-top:4px}

/* First-launch tooltips — контекстные, у элементов */
.first-launch-tooltip-overlay{position:fixed;inset:0;z-index:9998;display:none;
  background:rgba(0,0,0,.45);pointer-events:auto}
.first-launch-tooltip-overlay.tour-overlay-visible{display:block;visibility:visible}
.tour-step-highlight{position:relative;z-index:9999;border-radius:12px;
  box-shadow:0 0 0 3px var(--accent), 0 0 20px rgba(86,204,242,.35)}
.first-launch-tooltip-card.tour-tooltip-contextual{position:fixed;z-index:10000;
  background:var(--card);border:1px solid var(--border);border-radius:14px;
  padding:14px;box-shadow:0 8px 32px rgba(0,0,0,.35);pointer-events:auto;
  max-width:90vw;min-height:120px}
.tour-tooltip-progress{font-size:11px;font-weight:700;color:var(--accent);
  text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}
.tour-tooltip-contextual .first-launch-tooltip-text{font-size:13px;color:var(--text);
  margin:0 0 12px;line-height:1.45}
.tour-tooltip-actions{display:flex;flex-direction:column;gap:8px}
.tour-tooltip-actions .btn-full{margin:0}
.tour-btn-skip{font-size:12px;padding:8px}
.tour-tooltip-arrow{position:absolute;width:0;height:0;
  border-left:8px solid transparent;border-right:8px solid transparent}
.tour-tooltip-arrow-top{top:-8px;border-bottom:8px solid var(--card)}
.tour-tooltip-arrow-bottom{bottom:-8px;border-top:8px solid var(--card)}
.first-launch-tooltip-card .btn-full{margin:0}

/* Loading */
.loading{display:flex;align-items:center;justify-content:center;padding:40px;
  flex-direction:column;gap:12px;color:var(--text2);font-size:13px}
.spinner{width:36px;height:36px;border:3px solid var(--border);border-top-color:var(--accent);
  border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* Scrollable areas */
.scroll-area{overflow-y:auto;flex:1;padding-bottom:90px}

/* Correction input */
.correction-input-wrap{margin-top:8px;display:flex;gap:6px}
.correction-input{flex:1;background:var(--card);border:1px solid var(--accent);
  border-radius:12px;padding:8px 12px;color:var(--text);font-size:13px;outline:none;
  font-family:var(--font)}
.send-correction-btn{background:linear-gradient(135deg,#56ccf2,#2bc5ba);color:#0d1320;border:none;border-radius:10px;
  padding:8px 12px;font-size:13px;font-weight:700;cursor:pointer}
.send-correction-btn:active{opacity:.8}

/* Protein Champion modal */
.protein-champion-overlay{z-index:250}
.protein-champion-modal{max-width:360px;text-align:center}
.protein-champion-img-wrap{margin-bottom:16px;border-radius:16px;overflow:hidden;background:var(--card)}
.protein-champion-img{display:block;width:100%;height:auto;vertical-align:top}
.protein-champion-text{font-size:15px;color:var(--text2);line-height:1.5;margin:0 0 8px}

/* Water Balance modal */
.water-balance-overlay{z-index:250}
.water-balance-modal{max-width:360px;text-align:center}
.water-balance-emoji{font-size:64px;margin-bottom:12px;line-height:1}
.water-balance-text{font-size:15px;color:var(--text2);line-height:1.5;margin:0 0 8px}

/* Shop modal */
.shop-modal{max-width:340px}
.shop-quotas{font-size:12px;color:var(--text3);margin-bottom:8px}
.shop-quotas-main{font-size:14px;font-weight:700;color:var(--accent);margin-bottom:16px}
.shop-note{font-size:12px;color:var(--text3);margin-bottom:16px}
.shop-section{margin-bottom:20px}
.shop-section-title{font-size:12px;font-weight:700;color:var(--text2);margin-bottom:10px;text-transform:uppercase}
.shop-item{background:var(--card2);border-radius:12px;padding:12px;border:1px solid var(--border)}
.shop-item-desc{font-size:13px;color:var(--text2);margin-bottom:10px;line-height:1.4}
.shop-pack{background:var(--card2);border-radius:12px;padding:12px;margin-bottom:10px;border:1px solid var(--border)}
.shop-pack-name{font-weight:700;font-size:14px;margin-bottom:4px}
.shop-pack-desc{font-size:12px;color:var(--text2);margin-bottom:6px}
.shop-pack-price{font-size:13px;color:var(--accent);font-weight:700;margin-bottom:8px}
.shop-pack button{width:100%}
.shop-stars-row{display:flex;flex-direction:column;gap:8px}
.shop-star-btn{width:100%}

/* ═══════════════════════════════════════════════════
   CALMING / VOID MODE — режим «Пустота»
   В storm шар ведёт ритм дыхания.
   В void — маятник без цели, просто быть.
═══════════════════════════════════════════════════ */
.calming-overlay{position:fixed;inset:0;z-index:260;display:none;
  align-items:center;justify-content:center;overflow:hidden;
  --calm-orb-scale:1;
  --calm-glow-scale:1;
  --calm-bg-brightness:0.98;
  --calm-bg-saturate:0.96;
  --calm-vignette:0.9;
  --calm-glow-a:0 0 10px rgba(255,255,255,0.35);
  --calm-glow-b:0 0 40px rgba(255,255,255,0.12);
  --calm-glow-c:0 0 80px rgba(255,255,255,0.03);
  --calm-orb-offset-x:0%;
  --calm-ease-inhale:cubic-bezier(0.32, 0, 0.2, 1);
  --calm-ease-exhale:cubic-bezier(0.4, 0, 0.18, 1);
}
.calming-overlay.open{display:flex}

/* 1. Вдох / движение вправо — мягкий старт маятника (7–8s) */
.calming-overlay.phase-inhale{
  --calm-orb-scale:1.02;
  --calm-glow-scale:1.02;
  --calm-bg-brightness:1.0;
  --calm-bg-saturate:0.98;
  --calm-vignette:0.88;
  --calm-glow-a:0 0 12px rgba(255,255,255,0.4);
  --calm-glow-b:0 0 46px rgba(255,255,255,0.16);
  --calm-glow-c:0 0 90px rgba(255,255,255,0.04);
  --calm-orb-offset-x:18%;
}
.calming-overlay.phase-inhale .calming-glow-wrap,
.calming-overlay.phase-inhale .calming-orb{
  transition-duration:8s;
  transition-timing-function:var(--calm-ease-inhale);
}
.calming-overlay.phase-inhale .calming-bg{transition-duration:8s;transition-timing-function:var(--calm-ease-inhale)}

/* 2. Пауза справа — длинная остановка (≈2s) */
.calming-overlay.phase-pause-right{
  --calm-orb-scale:1.01;
  --calm-glow-scale:1.01;
  --calm-bg-brightness:0.99;
  --calm-bg-saturate:0.96;
  --calm-vignette:0.9;
  --calm-glow-a:0 0 11px rgba(255,255,255,0.36);
  --calm-glow-b:0 0 42px rgba(255,255,255,0.13);
  --calm-glow-c:0 0 82px rgba(255,255,255,0.03);
  --calm-orb-offset-x:20%;
}
.calming-overlay.phase-pause-right .calming-glow-wrap,
.calming-overlay.phase-pause-right .calming-orb{
  transition-duration:2s;
  transition-delay:0s;
  transition-timing-function:var(--calm-ease-exhale);
}
.calming-overlay.phase-pause-right .calming-bg{transition-duration:2s;transition-delay:0s}

/* 3. Движение влево — ленивый возврат маятника (7–8s) */
.calming-overlay.phase-exhale{
  --calm-orb-scale:0.99;
  --calm-glow-scale:0.99;
  --calm-bg-brightness:0.97;
  --calm-bg-saturate:0.95;
  --calm-vignette:0.92;
  --calm-glow-a:0 0 9px rgba(255,255,255,0.32);
  --calm-glow-b:0 0 36px rgba(255,255,255,0.11);
  --calm-glow-c:0 0 70px rgba(255,255,255,0.02);
  --calm-orb-offset-x:-18%;
}
.calming-overlay.phase-exhale .calming-glow-wrap,
.calming-overlay.phase-exhale .calming-orb{
  transition-duration:8s;
  transition-delay:0s;
  transition-timing-function:var(--calm-ease-exhale);
}
.calming-overlay.phase-exhale .calming-bg{transition-duration:8s;transition-timing-function:var(--calm-ease-exhale)}

/* 4. Пауза слева — просто тишина (≈2s) */
.calming-overlay.phase-pause-left{
  --calm-orb-scale:0.99;
  --calm-glow-scale:0.99;
  --calm-bg-brightness:0.96;
  --calm-bg-saturate:0.94;
  --calm-vignette:0.93;
  --calm-glow-a:0 0 8px rgba(255,255,255,0.28);
  --calm-glow-b:0 0 30px rgba(255,255,255,0.1);
  --calm-glow-c:0 0 60px rgba(255,255,255,0.02);
  --calm-orb-offset-x:-20%;
}
.calming-overlay.phase-pause-left .calming-glow-wrap,
.calming-overlay.phase-pause-left .calming-orb{
  transition-duration:2s;
  transition-delay:0s;
  transition-timing-function:var(--calm-ease-exhale);
}
.calming-overlay.phase-pause-left .calming-bg{transition-duration:2s;transition-timing-function:var(--calm-ease-exhale)}

/* Фон: матовая «бесконечная» пустота + едва заметное дыхание яркости (90s) */
.calming-bg{position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(ellipse 78% 72% at 50% 48%, rgba(43,44,48,calc(1 - var(--calm-vignette))) 0%, transparent 52%),
    radial-gradient(ellipse 95% 88% at 50% 50%, #2b2c30 0%, #242529 35%, #1e1f22 70%, #191a1d 100%);
  filter:brightness(var(--calm-bg-brightness)) saturate(var(--calm-bg-saturate));
  transition:filter 0.2s ease-in-out;
  animation:voidBreath 90s ease-in-out infinite;}
.calming-close{position:fixed;top:max(14px,env(safe-area-inset-top,0) + 8px);right:max(14px,env(safe-area-inset-right,0) + 6px);
  width:42px;height:42px;border:none;border-radius:50%;background:rgba(255,255,255,.1);color:rgba(255,255,255,.9);
  font-size:26px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:265;
  transition:opacity .2s;}
.calming-close:active{opacity:.8}
.calming-scene{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-bottom:4vh;}
.calming-glow-wrap{position:relative;width:min(72vw,320px);height:min(72vw,320px);
  display:flex;align-items:center;justify-content:center;
  transform:translateX(var(--calm-orb-offset-x)) scale(var(--calm-glow-scale));
  transition:transform 0.2s;}
.calming-orb{width:min(5vw,18px);height:min(5vw,18px);border-radius:50%;flex-shrink:0;
  background:radial-gradient(circle at 50% 40%, #fdfdfd 0%, #f5f5f7 45%, #d8d9dd 100%);
  box-shadow:var(--calm-glow-a), var(--calm-glow-b), var(--calm-glow-c);
  transform:scale(var(--calm-orb-scale));
  transition:box-shadow 0.2s ease-in-out, transform 0.2s ease-in-out;
  position:relative;z-index:2;}
.calming-glow{position:absolute;inset:-20%;border-radius:50%;pointer-events:none;z-index:0;}
.calming-glow-main{background:radial-gradient(ellipse 100% 85% at 55% 48%, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.08) 40%, transparent 70%);filter:blur(26px);}
.calming-glow-main::before{content:'';position:absolute;inset:-15%;border-radius:50%;
  background:radial-gradient(ellipse 75% 100% at 45% 55%, rgba(255,255,255,0.14) 0%, transparent 60%);filter:blur(20px);}
.calming-glow-soft{background:radial-gradient(ellipse 120% 90% at 58% 45%, rgba(255,255,255,0.12) 0%, transparent 55%);filter:blur(38px);transform:translate(2%, -1%);}
/* Пространство почти пустое: только орб, лёгкое свечение и 1–2 дальние пылинки */
.calming-line{display:none;}
.calming-dust{position:absolute;inset:0;pointer-events:none;z-index:1;}
.calming-dust-dot{position:absolute;width:2px;height:2px;border-radius:50%;background:rgba(255,255,255,0.12);box-shadow:0 0 12px rgba(255,255,255,0.18);}
.calming-dust-dot.dot-1{top:18%;left:14%;opacity:0.4;animation:calm-dust-fade-1 80s ease-in-out infinite;}
.calming-dust-dot.dot-2{bottom:16%;right:12%;opacity:0.32;animation:calm-dust-fade-2 95s ease-in-out infinite;}
/* Фразы-якоря: редкие, полупрозрачные, без требований */
.calming-anchors{position:absolute;bottom:16%;left:0;right:0;display:flex;justify-content:center;pointer-events:none;z-index:5;}
.calming-anchor{max-width:80%;font-size:13px;font-weight:500;letter-spacing:0.02em;line-height:1.5;text-align:center;
  color:rgba(255,255,255,0.18);opacity:0;transform:translateY(4px);
  transition:opacity 1800ms ease, transform 1800ms ease;}
.calming-anchor.visible{opacity:0.22;transform:translateY(0);}
/* Микроанимации: дыхание яркости, едва заметное дрожание света и пылинок */
@keyframes calm-orb-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-0.4px)}}
@keyframes calm-glow-breathe{0%,100%{opacity:1}50%{opacity:0.94}}
@keyframes voidBreath{0%,100%{filter:brightness(var(--calm-bg-brightness)) saturate(var(--calm-bg-saturate));}50%{filter:brightness(calc(var(--calm-bg-brightness) + 0.02)) saturate(calc(var(--calm-bg-saturate) + 0.01));}}
@keyframes calm-dust-fade-1{0%,100%{opacity:0.0}10%{opacity:0.18}40%{opacity:0.06}70%{opacity:0.14}}
@keyframes calm-dust-fade-2{0%,100%{opacity:0.0}20%{opacity:0.16}55%{opacity:0.05}85%{opacity:0.12}}
.calming-orb-float{display:flex;align-items:center;justify-content:center;position:relative;z-index:2;
  animation:calm-orb-float 12s ease-in-out infinite;}
.calming-glow-main{animation:calm-glow-breathe 18s ease-in-out infinite;}

/* ═══════════════════════════════════════════════════
   АДАПТИВНОСТЬ ПОД РАЗМЕР ЭКРАНА
═══════════════════════════════════════════════════ */
@media (max-width:380px){
  :root{--pad-h:10px;--pad-v:8px}
  .stats-top-left{padding-right:70px}
  .home-ring{width:88px;height:88px}
  .home-ring .ring-hole{width:74px;height:74px}
  .home-ring .ring-inner{width:62px}
  .home-ring .ring-inner .num{font-size:17px}
  .progress-tab,.progress-period-btn{padding:6px 10px;font-size:12px}
  .profile-avatar{width:64px;height:64px;font-size:32px}
  .profile-avatar-img{width:64px;height:64px}
  .friends-weekly-avatar,.friends-league-avatar{width:40px;height:40px}
  .msg-bubble{max-width:88%}
}
@media (max-height:600px){
  .stats-card{padding:10px var(--pad-h)}
  .chat-messages{padding:6px var(--pad-h)}
  .home-scroll{max-height:min(26vh,200px)}
  .home-scroll.stats-expanded{max-height:65vh}
  .stats-card.expanded .stats-meals-list{max-height:50vh}
  .progress-chart-inner{height:72px;min-height:36px}
  .nav-item{min-height:50px;padding:8px 4px}
}
@media (min-width:481px){
  #app{box-shadow:0 0 0 1px var(--border)}
}