/* The indicator is one continuous body; JavaScript preserves its momentum. */
[data-liquid][data-segmented-ready]>.p-selection-indicator {
  overflow: hidden;
  isolation: isolate;
  contain: paint;
  transition: none;
}
[data-liquid-moving]>.p-selection-indicator {
  will-change: left, top, width, height;
}
[data-liquid]>.p-selection-indicator::before,
[data-liquid]>.p-selection-indicator::after {
  content: '';
  position: absolute;
  pointer-events: none;
}
[data-liquid]>.p-selection-indicator::before {
  z-index: 0;
  inset: -20%;
  background: linear-gradient(112deg, #ffffff1a 0%, #ffffff05 37%, transparent 56%, #ffffff0b 100%);
  transform: translateX(var(--p-liquid-shine, 0%));
}
[data-liquid]>.p-selection-indicator::after {
  z-index: 2;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 1px 0 #ffffff38, inset 0 -1px 0 #142d280b;
}
.p-nav[data-liquid] {
  touch-action: pan-y;
  -webkit-user-select: none;
  user-select: none;
}
.p-nav[data-liquid][data-segmented-ready]>a,
.p-nav[data-liquid][data-segmented-ready]>a[aria-current] {
  color: var(--p-ink);
}
.p-nav[data-liquid][data-segmented-ready]>.p-selection-indicator {
  z-index: 2;
  border: 0;
  background: var(--p-ink);
  box-shadow: 0 1px 3px #142d2820;
}
.p-nav[data-liquid]>.p-selection-indicator::before {
  background: linear-gradient(112deg, #ffffff26 0%, #ffffff08 37%, transparent 62%, #ffffff0d 100%);
}
.p-liquid-ink {
  position: absolute;
  z-index: 1;
  inset: 0;
  color: var(--p-surface);
  pointer-events: none;
}
.p-liquid-label {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}
.p-nav[data-liquid-dragging],
.p-nav[data-liquid-dragging]>a {
  cursor: grabbing;
}
.p-nav[data-liquid-dragging]>.p-selection-indicator {
  box-shadow: 0 1px 4px #142d2826;
}
.p-install-phases[data-liquid]>.p-selection-indicator::after {
  box-shadow: inset 0 1px 0 #ffffff18, inset 0 -1px 0 #00000012;
}
.p-colour-flow[data-liquid]>.p-selection-indicator::after,
.p-search-filters[data-liquid]>.p-selection-indicator::after {
  box-shadow: inset 0 1px 0 #ffffff3d;
}
@media (prefers-reduced-motion: reduce) {
  [data-liquid]>.p-selection-indicator { will-change: auto; }
}
@media (prefers-contrast: more) {
  [data-liquid]>.p-selection-indicator::before { display: none; }
  [data-liquid]>.p-selection-indicator::after { box-shadow: inset 0 0 0 1px currentColor; }
}