/* ===== Telegram Mini App iOS adaptation ===== */
html.tg-mini-app,
body.tg-mini-app {
width: 100%;
min-height: 100%;
overflow-x: hidden;
}
body.tg-mini-app {
padding: 0;
}
body.tg-mini-app .app {
/* Обычный (компактный) размер окна для всех разделов */
padding-top: calc(20px + env(safe-area-inset-top, 0px));
padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
min-height: var(--tg-viewport-height, 100vh);
}

/* Полноэкранный режим Telegram: шапка Telegram плавает поверх страницы */
.tg-fullscreen-header { display:none; }
body.tg-mini-app.tg-fullscreen .tg-fullscreen-header {
  display:flex; position:fixed; top:0;
  left:0; right:0; height:calc(var(--tg-content-top, 56px) + 44px);
  align-items:flex-start; justify-content:center;
  padding:calc(var(--tg-content-top, 56px) + 8px) 18px 0;
  background:rgba(243,246,251,.96);
  border-bottom:1px solid rgba(20,33,61,.08); box-shadow:0 5px 18px rgba(20,33,61,.06);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  z-index:100001; pointer-events:none;
}
body.tg-mini-app.tg-fullscreen .tg-fullscreen-header-title {
  overflow:hidden; max-width:100%; color:var(--ink); font-family:'Manrope',sans-serif;
  font-size:14px; font-weight:800; line-height:28px; text-overflow:ellipsis; white-space:nowrap;
}

body.tg-mini-app.tg-fullscreen .app {
  /* Telegram contentSafeAreaInset.top + компактная шапка + 10px зазор */
  padding-top: calc(var(--tg-content-top, 56px) + 54px);
  padding-bottom:0;
}
body.tg-mini-app.tg-fullscreen .view {
  padding-bottom:calc(104px + var(--tg-bottom-safe, 0px));
}
/* Заголовки скрываются только в полноэкранном Telegram, где их заменяет плавающая шапка. */
body.tg-mini-app.tg-fullscreen .view > .page-head,
body.tg-mini-app.tg-fullscreen #view-today > .greet {
  display:none;
}
body.tg-mini-app.tg-fullscreen #view-brain {
  padding-top:0;
}
body.tg-mini-app.tg-fullscreen .modal-overlay {
  top:calc(var(--tg-content-top, 56px) + 44px);
  bottom:var(--tg-bottom-safe, 0px);
  height:auto;
}
body.tg-mini-app.tg-fullscreen .modal-banner,
body.tg-mini-app.tg-fullscreen .reminder-details-head {
  padding-top:16px;
}
body.tg-mini-app.tg-fullscreen .modal-body,
body.tg-mini-app.tg-fullscreen .reminder-details-body {
  padding-bottom:calc(24px + var(--tg-bottom-safe, 0px));
}

html.tg-mini-app.tg-fullscreen.tg-meditation-view,
body.tg-mini-app.tg-fullscreen.tg-meditation-view,
body.tg-mini-app.tg-fullscreen.tg-meditation-view .app,
body.tg-mini-app.tg-fullscreen.tg-meditation-view #tg-top-shield {
  background:var(--navy);
}
body.tg-mini-app.tg-fullscreen.tg-meditation-view .tg-fullscreen-header {
  color:#fff; background:rgba(20,33,61,.98); border-bottom-color:rgba(255,255,255,.12);
  box-shadow:0 5px 18px rgba(0,0,0,.2);
}
body.tg-mini-app.tg-fullscreen.tg-meditation-view .tg-fullscreen-header-title {
  color:#fff;
}
body.tg-mini-app.tg-fullscreen.tg-meditation-view #view-meditation {
  margin:0 -6px; padding:0 6px calc(72px + var(--tg-bottom-safe, 0px));
  min-height:0;
  border-radius:0;
}
body.tg-mini-app.tg-fullscreen.tg-meditation-view .bottom-nav {
  background:rgba(20,33,61,.98); border-color:rgba(255,255,255,.12);
  box-shadow:0 10px 30px rgba(0,0,0,.35);
}
body.tg-mini-app.tg-fullscreen.tg-meditation-view .bottom-nav .nav-btn {
  color:rgba(255,255,255,.62);
}
body.tg-mini-app.tg-fullscreen.tg-meditation-view .bottom-nav .nav-btn.active {
  color:#fff; background:rgba(255,255,255,.14);
}

/* Telegram's own close/expand/menu bar floats over the WebView at a fixed
 screen position and isn't part of our scrollable page, so the top padding
 above only helps before the first scroll — once the page is scrolled,
 whatever content is underneath shows through it. This shield stays pinned
 to the very top of the screen so our own background (not app content)
 is always what sits behind Telegram's overlay. */
#tg-top-shield{ display:none; }
body.tg-mini-app.tg-fullscreen #tg-top-shield{
display:block; position:fixed; top:0; left:0; right:0;
height: var(--tg-content-top, 56px);
background: var(--cream);
z-index: 100000;
pointer-events: none;
}
body.tg-mini-app .bottom-nav {
bottom: calc(8px + var(--tg-bottom-safe, 0px));
  left: 12px;
  right: 12px;
padding-bottom: 10px;
border-radius: 28px;
}
body.tg-mini-app .modal-sheet {
padding-bottom: var(--tg-bottom-safe, 0px);
}
body.tg-mini-app .reminder-details-sheet {
padding-top:var(--tg-content-top, 56px);
max-height:calc(92vh - var(--tg-content-top, 56px));
}
@media (max-width: 380px) {
body.tg-mini-app .app {
  padding-left: 8px;
  padding-right: 8px;
}
}


/* ===== Адаптация под любые телефоны ===== */
html{ -webkit-text-size-adjust:100%; }
.app{ min-height:100vh; min-height:100dvh; }
.page-head .profile-row{ min-width:0; flex:1 1 auto; }
.page-head .profile-row > div:last-child{ min-width:0; }
.page-head .profile-row h2{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
img, svg, video{ max-width:100%; }
@media (max-width:360px){
.page-head h2{ font-size:22px; }
.sprint-badge{ font-size:9.5px; padding:6px 9px; }
.wheel-wrap{ transform:scale(.88); transform-origin:top center; margin-bottom:-24px; }
.mood-item .mood-circle{ width:40px; height:40px; font-size:18px; }
.habit-card .hname{ overflow-wrap:anywhere; }
}
@media (max-height:600px){
body.tg-mini-app .app{ padding-bottom:calc(104px + var(--tg-bottom-safe, 0px)); }
}

.tracker-hearts-list{display:none;}
body.tg-mini-app.tg-fullscreen #view-tracker .tracker-hearts-list{display:inline-flex;flex-wrap:wrap;justify-content:flex-end;gap:2px;color:var(--pink);max-width:180px;}
body.tg-mini-app.tg-fullscreen #view-tracker .tracker-lives-display > div:first-child{justify-content:flex-end;flex-wrap:wrap;}
body.tg-mini-app.tg-fullscreen #view-tracker .tracker-hearts-list svg{width:17px;height:17px;fill:currentColor;}
body.tg-mini-app.tg-fullscreen #view-tracker #tracker-hearts{display:none;}
body.tg-mini-app.tg-fullscreen #view-tracker .tracker-lives-display{margin-left:auto;}



/* ===== Единые отступы: по бокам 14px, между блоками главной 12px ===== */
.app, body.tg-mini-app .app{ padding-left:14px; padding-right:14px; }
#view-sprint .progress-card,
#view-sprint .card-block,
#view-sprint .week-cards,
#view-sprint .home-extra-sections{ margin-top:0; margin-bottom:12px; }
#view-sprint .week-cards{ gap:12px; }
#view-sprint .week-cards-row{ gap:12px; }
#view-sprint .home-extra-sections{ gap:12px; }
