/* Shared prototype motion. Everything that moves is disabled under prefers-reduced-motion. */
.m-fly { position:fixed; z-index:100; width:32px; height:32px; margin:-16px 0 0 -16px; border-radius:50%; background:var(--color-primary); color:#fff; display:grid; place-items:center; font-size:16px; pointer-events:none; box-shadow:0 6px 14px rgb(201 58 37 / .4); }
.m-conf { position:fixed; z-index:100; width:8px; height:12px; margin:-6px 0 0 -4px; border-radius:2px; pointer-events:none; }
.m-skel { border-radius:var(--radius-md); background:var(--color-surface); border:1px solid var(--color-border); padding:10px; display:flex; flex-direction:column; gap:8px; }
.m-skel i { display:block; aspect-ratio:4 / 3; border-radius:var(--radius-sm); }
.m-skel b { display:block; height:12px; border-radius:6px; }
.m-skel i, .m-skel b { background:linear-gradient(90deg, var(--slate-50) 0%, var(--slate-200) 50%, var(--slate-50) 100%); background-size:200% 100%; animation:m-shim 1.2s linear infinite; }
@keyframes m-shim { to { background-position:-200% 0; } }

@media (prefers-reduced-motion: no-preference) {
  .m-up { animation:m-up .5s cubic-bezier(.16, 1, .3, 1) both; animation-delay:calc(var(--i, 0) * 50ms); }
  .m-reveal { opacity:0; transform:translateY(18px); transition:opacity .7s cubic-bezier(.16, 1, .3, 1), transform .7s cubic-bezier(.16, 1, .3, 1); transition-delay:calc(var(--i, 0) * 70ms); }
  .m-reveal.m-in { opacity:1; transform:none; }
  @keyframes m-up { from { opacity:0; transform:translateY(14px); } }
}
@media (prefers-reduced-motion: reduce) { .m-skel i, .m-skel b { animation:none; } }
