/* swipe-nav.css — shared mobile gesture affordances (#4324/#4327).
   Additive, small, theme-matched to the dark command-center palette;
   each property may restyle these two elements to its own theme. */
.swipe-nav-hint {
  position: fixed; left: 12px; bottom: 84px; z-index: 990;
  background: rgba(13, 15, 22, .92); color: #dfe4ee;
  border: 1px solid #3a4462; border-radius: 10px;
  padding: 8px 14px; font-size: 12.5px;
  box-shadow: 0 6px 18px rgba(0,0,0,.4);
  opacity: 0; transform: translateY(8px); pointer-events: none;
  transition: opacity .18s, transform .18s;
}
.swipe-nav-hint-show { opacity: 1; transform: translateY(0); }

.swipe-nav-ptr {
  position: fixed; top: 0; left: 0; right: 0; z-index: 980;
  display: flex; align-items: center; gap: 8px;
  background: rgba(13, 15, 22, .9);
  border-bottom: 1px solid #2c3143;
  padding: 8px 14px; font-size: 12px; color: #dfe4ee;
  opacity: 0; pointer-events: none; transform: translateY(-46px);
}
.swipe-nav-ptr-visible { opacity: 1; }
.swipe-nav-ptr-armed { transform: translateY(calc(-46px * (1 - var(--ptr-progress, 0)))); }
.swipe-nav-ptr .swipe-nav-ptr-spinner {
  width: 18px; height: 18px; flex: 0 0 auto;
  border: 2px solid #3a4462; border-top-color: #6fd69a; border-radius: 50%;
  animation: swipe-nav-spin .8s linear infinite;
}
.swipe-nav-ptr-refreshing .swipe-nav-ptr-spinner { border-top-color: #7fb2ff; }
.swipe-nav-ptr-refreshing .swipe-nav-ptr-label { content: none; }
@keyframes swipe-nav-spin { to { transform: rotate(360deg); } }