/* GladChat mascot loader (assets/js/gc-loader.js) + pull-to-refresh (assets/js/gc-pull-refresh.js) */

.gcl {
  --gcl-ink: var(--color-k-primary, #7c5cff);
  --gcl-accent: #38bdf8;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  color: var(--gcl-ink);
}

.gcl-svg {
  width: var(--gcl-size, 56px);
  height: calc(var(--gcl-size, 56px) * 1.18);
  overflow: visible;
}

.gcl-line { stroke: var(--gcl-ink); }
.gcl-accent { stroke: var(--gcl-accent); }
.gcl-splash { stroke: var(--gcl-accent); animation: gclSplash 1.1s ease-in-out infinite; transform-origin: 80px 16px; }
.gcl-dot { fill: var(--gcl-ink); }
.gcl-cheek { fill: #fb7185; opacity: .45; }
.gcl-shadow { fill: var(--gcl-ink); opacity: .18; transform-origin: 50px 112px; animation: gclShadow .9s cubic-bezier(.45, 0, .55, 1) infinite; }

.gcl-jump { animation: gclJump .9s cubic-bezier(.45, 0, .55, 1) infinite; }
.gcl-squash { transform-origin: 50px 105px; animation: gclSquash .9s ease-in-out infinite; }
.gcl-eyes { transform-origin: 50px 36px; animation: gclBlink 3.2s ease-in-out infinite; }
.gcl-thumb { transform-origin: 24px 58px; animation: gclThumb .9s ease-in-out infinite; }

.gcl-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--color-k-muted, #94a3b8);
}

/* a centred block while a list loads */
.gcl-block {
  display: flex;
  justify-content: center;
  padding: 28px 0;
}

@keyframes gclJump {
  0%, 100% { transform: translateY(0); }
  45%, 55% { transform: translateY(-16px); }
}

@keyframes gclSquash {
  0%, 100% { transform: scale(1.06, .92); }
  12% { transform: scale(.96, 1.05); }
  50% { transform: scale(1, 1); }
  88% { transform: scale(.98, 1.03); }
}

@keyframes gclShadow {
  0%, 100% { transform: scale(1); opacity: .22; }
  50% { transform: scale(.55); opacity: .08; }
}

@keyframes gclBlink {
  0%, 44%, 50%, 100% { transform: scaleY(1); }
  47% { transform: scaleY(.1); }
}

@keyframes gclSplash {
  0%, 100% { opacity: .35; transform: scale(.85); }
  50% { opacity: 1; transform: scale(1.08); }
}

@keyframes gclThumb {
  0%, 100% { transform: rotate(0); }
  50% { transform: rotate(-12deg); }
}

/* animations play for everyone, even with "Remove animations" on: this block is kept but never applies */
@media (prefers-reduced-motion: reduce) and (max-width: 0px) {
  .gcl-jump, .gcl-squash, .gcl-shadow, .gcl-eyes, .gcl-splash, .gcl-thumb { animation-duration: 2.4s; }
}

/* ---------- pull to refresh: a gap opens inside the page (no floating circle) ---------- */

.gc-ptr-space {
  height: 0;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.gc-ptr-space.settle { transition: height .35s cubic-bezier(.2, .9, .25, 1); }

.gc-ptr-inner {
  opacity: 0;
  transform: scale(.5);
  transition: opacity .2s ease, transform .25s ease;
}

.gc-ptr-space.pulling .gc-ptr-inner { transition: none; }
.gc-ptr-space.pulling .gcl-jump,
.gc-ptr-space.pulling .gcl-squash,
.gc-ptr-space.pulling .gcl-shadow,
.gc-ptr-space.pulling .gcl-thumb { animation-play-state: paused; }

html, body { overscroll-behavior-y: contain; }