/* Заставка: глобус из точек + буква Z. */
.tg-splash {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: radial-gradient(ellipse at 50% 42%, #0a1630 0%, #05070c 62%, #020308 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  transition: opacity .7s ease;
  cursor: default;
  touch-action: none;
  user-select: none;
}
.tg-splash canvas {
  display: block;
  width: 100%;
  height: 100%;
}
.tg-splash.is-out {
  opacity: 0;
  pointer-events: none;
}

html.splash-lock,
html.splash-lock body {
  overflow: hidden;
  background: #05070c;
}
html.splash-lock body > header.top,
html.splash-lock body > nav.tabs,
html.splash-lock body > main {
  opacity: 0;
}
body > header.top,
body > nav.tabs,
body > main {
  transition: opacity .75s ease;
}

/* Бегущий бегемот на каждую перезагрузку (как эмодзи в Telegram). */
.tg-hippo {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99990;
  align-items: center;
  justify-content: center;
  background: #0f1216;
  opacity: 1;
  transition: opacity .24s ease;
  pointer-events: none;
  user-select: none;
}
html.hippo-lock .tg-hippo,
.tg-hippo.is-on {
  display: flex;
}
.tg-hippo.is-out {
  opacity: 0;
}
.tg-hippo-box {
  position: relative;
  width: min(80vw, 80vh);
  height: min(80vw, 80vh);
  flex: 0 0 auto;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}
.tg-hippo-box svg {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: auto;
}

html.hippo-lock,
html.hippo-lock body {
  overflow: hidden;
  background: #0f1216;
}
html.hippo-lock body > header.top,
html.hippo-lock body > nav.tabs,
html.hippo-lock body > main {
  opacity: 0;
}
