html.app-pull-refresh-enabled { overscroll-behavior-y: contain; }
.app-pull-refresh {
  --pull-distance:0px;
  position:fixed;
  z-index:20000;
  top:max(10px, env(safe-area-inset-top));
  left:50%;
  display:flex;
  align-items:center;
  gap:8px;
  min-height:42px;
  padding:0 15px 0 11px;
  border:1px solid rgba(10,151,77,.24);
  border-radius:999px;
  color:#087943;
  background:rgba(250,255,252,.92);
  box-shadow:0 10px 30px rgba(7,72,43,.18), inset 0 1px 0 rgba(255,255,255,.9);
  -webkit-backdrop-filter:blur(16px) saturate(1.15);
  backdrop-filter:blur(16px) saturate(1.15);
  opacity:0;
  pointer-events:none;
  transform:translate(-50%, calc(-64px + min(var(--pull-distance), 96px))) scale(.94);
  transition:opacity 150ms ease, transform 150ms var(--ux-ease-out, ease-out), background 150ms ease;
}

.app-pull-refresh.is-visible {
  opacity:1;
  transform:translate(-50%, calc(-54px + min(var(--pull-distance), 96px))) scale(1);
}

.app-pull-refresh strong { font-size:.78rem; font-weight:900; white-space:nowrap; letter-spacing:.01em; }
.app-pull-refresh-icon { display:grid; width:23px; height:23px; place-items:center; border-radius:50%; background:rgba(11,171,86,.12); }
.app-pull-refresh-icon svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; transition:transform 180ms ease; }
.app-pull-refresh.is-armed { color:#fff; border-color:rgba(8,130,65,.5); background:linear-gradient(135deg,rgba(7,116,71,.96),rgba(12,185,91,.96)); }
.app-pull-refresh.is-armed .app-pull-refresh-icon { background:rgba(255,255,255,.18); }
.app-pull-refresh.is-armed .app-pull-refresh-icon svg { transform:rotate(135deg); }
.app-pull-refresh.is-refreshing .app-pull-refresh-icon svg { animation:app-pull-refresh-spin .72s linear infinite; }
.app-pull-refresh.is-complete { color:#fff; background:linear-gradient(135deg,rgba(7,116,71,.96),rgba(12,185,91,.96)); }
.app-pull-refresh.is-error { color:#a33b22; border-color:rgba(194,83,44,.28); background:rgba(255,248,245,.94); }
html[data-theme="dark"] .app-pull-refresh { color:#82e7ad; border-color:rgba(92,220,146,.25); background:rgba(15,28,23,.92); box-shadow:0 12px 34px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.06); }
html[data-theme="dark"] .app-pull-refresh.is-armed,
html[data-theme="dark"] .app-pull-refresh.is-complete { color:#fff; background:linear-gradient(135deg,rgba(5,79,62,.97),rgba(8,155,79,.97)); }
html[data-theme="dark"] .app-pull-refresh.is-error { color:#ffad92; border-color:rgba(255,137,103,.24); background:rgba(48,25,21,.94); }
@keyframes app-pull-refresh-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .app-pull-refresh { transition: none; } }