/* Value Food Scale — restrained motion layer */
.motion-ready .reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 520ms ease, transform 520ms cubic-bezier(.2,.7,.2,1);
}
.motion-ready .reveal.is-visible {
  opacity: 1;
  transform: none;
}

.top nav a,
.btn,
.listbtn,
.chipf,
.add,
.cons,
.x,
.pk button,
.toast button {
  transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease,
    filter 160ms ease, transform 160ms ease, opacity 160ms ease;
}
.btn:active,
.listbtn:active,
.chipf:active,
.add:active,
.cons:active,
.x:active,
.pk button:active,
.toast button:active {
  transform: translateY(1px) scale(.985);
}
.card {
  transition: border-color 160ms ease, transform 200ms ease, box-shadow 200ms ease;
}
.card:hover { transform: translateY(-3px); }
.card .add { transition: color 160ms ease, background-color 160ms ease, transform 160ms ease; }

.listbtn .n { transition: transform 180ms cubic-bezier(.2,.8,.2,1); }
.listbtn .n.count-pop { transform: scale(1.16); }

.toast {
  opacity: 1;
  transition: opacity 180ms ease, transform 180ms cubic-bezier(.2,.7,.2,1);
}
.toast.motion-toast-hidden {
  opacity: 0;
  transform: translate(-50%, 10px);
  pointer-events: none;
}

.scrim,
.drawer {
  transition: opacity 220ms ease, transform 220ms cubic-bezier(.2,.7,.2,1);
}
.scrim { opacity: 1; }
.scrim.motion-enter { opacity: 0; }
.scrim.motion-closing { opacity: 0; }
.drawer { opacity: 1; transform: translateX(0); }
.drawer.motion-enter { opacity: 0; transform: translateX(20px); }
.drawer.motion-closing { opacity: 0; transform: translateX(20px); }

#consultFields {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 180ms ease, transform 180ms ease;
}
#consultFields.motion-mode-enter { opacity: 0; transform: translateY(8px); }
#consultFields.motion-mode-exit { opacity: 0; transform: translateY(-4px); }

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .top nav a:hover { transform: translateY(-1px); }
  .btn:hover, .listbtn:hover, .chipf:hover, .add:hover, .cons:hover,
  .x:hover, .toast button:hover { transform: translateY(-1px); }
}

@media (prefers-reduced-motion: reduce) {
  .motion-ready .reveal,
  .motion-ready .reveal.is-visible,
  .top nav a,
  .btn,
  .listbtn,
  .chipf,
  .add,
  .cons,
  .x,
  .pk button,
  .toast button,
  .card,
  .card .add,
  .listbtn .n,
  .toast,
  .scrim,
  .drawer,
  #consultFields {
    transition: none !important;
    animation: none !important;
  }
  .card:hover,
  .btn:active,
  .listbtn:active,
  .chipf:active,
  .add:active,
  .cons:active,
  .x:active,
  .pk button:active,
  .toast button:active {
    transform: none !important;
  }
}