:root {
  --tg-safe-area-top: 0px;
  --tg-safe-area-bottom: 0px;
  --tg-safe-area-left: 0px;
  --tg-safe-area-right: 0px;
}

html[data-telegram-miniapp="true"],
html[data-telegram-miniapp="true"] body,
html[data-telegram-miniapp="true"] #root {
  min-height: 100dvh;
  overscroll-behavior-y: none;
}

html[data-telegram-miniapp="true"] .h-screen {
  height: 100dvh;
}

html[data-telegram-miniapp="true"] .min-h-screen {
  min-height: 100dvh;
}

html[data-telegram-miniapp="true"] .fixed.bottom-0,
html[data-telegram-miniapp="true"] nav.fixed {
  padding-bottom: max(var(--tg-safe-area-bottom), env(safe-area-inset-bottom));
}

html[data-telegram-miniapp="true"] .fixed.inset-0 {
  padding-left: max(var(--tg-safe-area-left), env(safe-area-inset-left));
  padding-right: max(var(--tg-safe-area-right), env(safe-area-inset-right));
}

#nx-telegram-auth-error {
  position: fixed;
  z-index: 2147483647;
  left: 12px;
  right: 12px;
  top: max(12px, var(--tg-safe-area-top));
  padding: 12px 14px;
  border: 1px solid rgba(248, 113, 113, 0.45);
  border-radius: 14px;
  background: rgba(24, 9, 16, 0.96);
  color: #fecaca;
  font: 600 13px/1.4 Inter, system-ui, sans-serif;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}

@media (max-width: 640px) {
  html[data-telegram-miniapp="true"] body {
    padding-left: max(0px, var(--tg-safe-area-left));
    padding-right: max(0px, var(--tg-safe-area-right));
  }
}
