/* One continuous lens, shared by touch, mouse and keyboard selections. */
:where(.liquid-track) { position:relative; isolation:isolate; }
.liquid-track::before {
  content:'';
  position:absolute;
  inset:0 auto auto 0;
  z-index:0;
  width:var(--lens-width,0px);
  height:var(--lens-height,0px);
  border:1px solid #ffffffed;
  border-radius:18px;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(145deg,#ffffffdb,#ffffff3d 45%,#cdd9ee38 78%,#ffffff78);
  box-shadow:inset 0 1.5px 1px #fff,inset 1px 0 2px #ffffffc9,inset -1px -1px 2px #b6c9e170,0 4px 14px -8px #273d6763;
  -webkit-backdrop-filter:blur(5px) saturate(165%);
  backdrop-filter:blur(5px) saturate(165%);
  transform:translate3d(var(--lens-x,0px),var(--lens-y,0px),0) scale(var(--lens-sx,1),var(--lens-sy,1));
  transform-origin:center;
  transition:transform .38s cubic-bezier(.22,1.38,.35,1),width .3s cubic-bezier(.22,1.2,.35,1),height .3s cubic-bezier(.22,1.2,.35,1),opacity .18s,box-shadow .2s;
}
.liquid-track[data-liquid-visible=true]::before { opacity:1; }
.liquid-track> :is(button,a,label,[role=option]) { position:relative; z-index:1; }
/* These bounded selector strips own touch gestures; the rest of the page scrolls normally. */
.liquid-track[data-liquid-axis=x] { touch-action:none; }
.liquid-track[data-liquid-axis=y] { touch-action:none; }
.liquid-track,.liquid-track * { -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
.liquid-track.is-liquid-dragging {
  cursor:grabbing;
  /* Per-frame edge scrolling must not restart a smooth/snap animation. */
  scroll-behavior:auto !important;
  scroll-snap-type:none;
}
.liquid-track> :is(button,a,label,[role=option]) { cursor:grab; }
.liquid-track.is-liquid-dragging> :is(button,a,label,[role=option]) { cursor:grabbing; }
.liquid-track.is-liquid-dragging::before {
  transition:box-shadow .12s,opacity .12s;
  background:linear-gradient(145deg,#ffffffa6,#ffffff1a 43%,#bad3eb40 75%,#ffffff8c);
  box-shadow:inset 0 2px 1px #fff,inset 2px 0 2px #e8f8ffc9,inset -2px -1px 2px #dcc8ec9e,0 0 0 1px #ffffff66,0 8px 20px -9px #30416766;
  -webkit-backdrop-filter:blur(3px) saturate(190%) brightness(1.04);
  backdrop-filter:blur(3px) saturate(190%) brightness(1.04);
}
.color-options.liquid-track { overflow-x:hidden; animation-name:liquid-menu-reveal; }
@keyframes liquid-menu-reveal { from { opacity:0; transform:translateY(-3px); } to { opacity:1; transform:translateY(0); } }
.color-options.liquid-track [role=option],
.color-options.liquid-track [role=option]:is(.is-active,[aria-selected=true],:hover) {
  background:transparent; border-color:transparent; box-shadow:none;
}
.color-options.liquid-track [role=option] { transition:color .16s; }
.color-options.liquid-track.is-liquid-dragging [role=option] { font-weight:400; color:#526078; }
.color-options.liquid-track.is-liquid-dragging [role=option].liquid-target { color:#142139; font-weight:650; }
.color-options.liquid-track.is-liquid-dragging [role=option][aria-selected=true]::after { opacity:.3; }
.color-options.liquid-track.is-liquid-dragging [role=option].liquid-target[aria-selected=true]::after { opacity:1; }
.color-options.liquid-track .color-swatch { transition:transform .2s; }
.color-options.liquid-track.is-liquid-dragging .liquid-target .color-swatch { transform:scale(1.08); }
.sim-options.liquid-track {
  padding:4px; gap:3px;
  border:1px solid #ffffffe0;
  border-radius:21px;
  background:linear-gradient(125deg,#dce3ef80,#ffffff54);
  box-shadow:inset 0 1px 3px #36496a0f,inset 0 -1px 0 #fff;
}
.sim-options.liquid-track .sim-option span,
.sim-options.liquid-track .sim-option input:checked+span {
  background:transparent; border-color:transparent; box-shadow:none; border-radius:16px;
}
.sim-options.liquid-track:has(input[aria-invalid=true]) { border-color:#c82348; }
.sim-options.liquid-track .sim-option input:checked+span { color:#971536; }
.sim-options.liquid-track.is-liquid-dragging .sim-option span { color:#526078; }
.sim-options.liquid-track.is-liquid-dragging .sim-option.liquid-target span { color:#18263d; }
.visual-modes.liquid-track button[aria-pressed=true],
.mobile-dock.liquid-track .is-active {
  background:transparent; border-color:transparent; box-shadow:none;
}
.visual-modes.liquid-track::before { border-radius:14px; }
.mobile-dock.liquid-track { overflow:visible; }
.mobile-dock.liquid-track::before { border-radius:20px; }
.mobile-dock.liquid-track.is-liquid-dragging>a,
.mobile-dock.liquid-track.is-liquid-dragging>button { color:#526078; }
.mobile-dock.liquid-track.is-liquid-dragging>.liquid-target { color:#9f1736; }
.mobile-dock.liquid-track.is-liquid-dragging>.liquid-target svg { transform:translateY(-2px) scale(1.1); }
.mobile-dock.liquid-track svg { transition:transform .2s; }
.liquid-track.is-liquid-dragging> :is(button,a,label) { transform:none; }
@media(prefers-reduced-motion:reduce) {
  .liquid-track::before { transition:none; }
  .liquid-track.is-liquid-dragging::before { transform:translate3d(var(--lens-x,0px),var(--lens-y,0px),0); }
  .liquid-track.is-liquid-dragging .color-swatch,.mobile-dock.liquid-track.is-liquid-dragging>.liquid-target svg { transform:none; }
}
@media(prefers-reduced-transparency:reduce) {
  .liquid-track::before,.liquid-track.is-liquid-dragging::before { background:#fff; -webkit-backdrop-filter:none; backdrop-filter:none; }
}
@media(forced-colors:active) {
  .liquid-track::before { background:Canvas; border:2px solid Highlight; box-shadow:none; }
}

/* The same traveling lens across catalog, navigation, photos and viewer views. */
.category-filters.liquid-track {
  flex-wrap:nowrap; overflow-x:auto; overflow-y:hidden; min-width:0;
  padding:5px; gap:4px; border-radius:20px; scrollbar-width:none;
  background:linear-gradient(125deg,#dce3ef80,#ffffff54);
  border:1px solid #ffffffdc; box-shadow:inset 0 1px 3px #36496a0c;
}
.category-filters.liquid-track::-webkit-scrollbar { display:none; }
.category-filters.liquid-track .category-filter { flex:none; white-space:nowrap; min-height:44px; }
.category-filters.liquid-track .category-filter,
.category-filters.liquid-track .category-filter:is(.is-active,:hover) { background:transparent; box-shadow:none; border-color:transparent; color:#43516a; }
.category-filters.liquid-track .category-filter.is-active,
.category-filters.liquid-track.is-liquid-dragging .liquid-target { color:#961637; font-weight:650; }
.category-filters.liquid-track .category-filter { font-weight:650; }
.category-filters.liquid-track::before { border-radius:15px; }
.nav-links.liquid-track { gap:6px; padding:4px; border-radius:20px; }
.nav-links.liquid-track>a { padding:10px; min-height:44px; display:flex; align-items:center; }
.nav-links.liquid-track::before { border-radius:16px; }
.photo-thumbs.liquid-track,.photo-gallery-thumbs.liquid-track {
  flex-wrap:nowrap; justify-content:flex-start; overflow-x:auto; overflow-y:hidden;
  padding:6px; gap:8px; max-width:100%; width:max-content; align-self:center;
  margin-inline:auto; border-radius:19px; scrollbar-width:thin;
}
.photo-thumbs.liquid-track>button,.photo-gallery-thumbs.liquid-track>button { flex-shrink:0; -webkit-user-drag:none; }
.photo-thumbs.liquid-track img,.photo-gallery-thumbs.liquid-track img { -webkit-user-drag:none; }
.product-dialog .photo-thumbs.liquid-track>button,
.photo-gallery-thumbs.liquid-track>button { background:transparent; border-color:transparent; box-shadow:none; }
.product-dialog .photo-thumbs.liquid-track>button[aria-pressed=true],
.photo-gallery-thumbs.liquid-track>button[aria-pressed=true] { border-color:#ba315766; box-shadow:none; }
.photo-thumbs.liquid-track::before,.photo-gallery-thumbs.liquid-track::before { border-radius:13px; }
.product-dialog .visual-controls { grid-template-columns:minmax(0,1fr) auto auto; align-items:center; }
.view-positions { display:flex; min-width:0; gap:3px; padding:3px; border-radius:17px; }
.view-positions>button { flex:1; min-width:0; }
.product-dialog .view-positions>button:is([aria-pressed=true],:hover) { background:transparent; box-shadow:none; color:#971536; }
.view-positions::before { border-radius:13px; }
.product-dialog .visual-controls .zoom-controls { grid-column:auto; }
.product-dialog .visual-controls [data-view=reset] { grid-column:auto; }
@media(max-width:800px) {
  .product-dialog .visual-controls { grid-template-columns:minmax(0,1fr) auto; }
  .view-positions { grid-column:1 / -1; }
  .product-dialog .visual-controls .zoom-controls { grid-column:2; }
  .product-dialog .visual-controls [data-view=reset] { grid-column:1; }
}
/* Local elastic motion keeps layouts and hit areas stable. Text remains crisp. */
:where(button,a.button,a.text-link,a.round-link,summary) { touch-action:pan-y pinch-zoom; }
:where(.glass-action) { position:relative; isolation:isolate; }
.glass-action { translate:0 0; scale:1;
  transition:translate .36s cubic-bezier(.18,1.4,.35,1),scale .36s cubic-bezier(.18,1.4,.35,1),box-shadow .2s,background .2s; }
.glass-action::after {
  content:''; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:radial-gradient(ellipse at var(--shine-x,50%) var(--shine-y,25%),#ffffff8c,transparent 70%);
  box-shadow:inset 0 1.5px 1px #ffffffd9,inset -1px -1px 1px #b8d9f866;
  opacity:0; transition:opacity .22s;
}
.glass-action.is-glass-pressed { translate:var(--press-x,0px) var(--press-y,0px); scale:var(--press-sx,1.025) var(--press-sy,1.025); transition:box-shadow .15s; }
.glass-action.is-glass-pressed::after { opacity:1; }
.glass-action.is-glass-pressed:not(.color-trigger) { -webkit-user-select:none; user-select:none; }
.order-field:focus-within input,.order-field:focus-within textarea,.search-field:focus-within {
  box-shadow:inset 0 1px 1px #fff,0 0 0 3px #b6c9e42b,0 7px 22px -15px #465e88;
}
@media(prefers-reduced-motion:reduce) {
  .glass-action,.glass-action.is-glass-pressed { translate:none; scale:none; transition:none; }
  .glass-action::after { transition:none; }
}
.color-trigger[aria-expanded=true] { translate:0 0; scale:1; transition:box-shadow .2s,background .2s; }
.liquid-track:not([data-liquid-visible])::before { display:none; }
