/* Transforms/opacity only; finite effects with immediate static fallbacks. */
.success-celebration[hidden] { display: none !important; }
.success-celebration { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 24px; pointer-events: none; }
.success-celebration::before { content: ''; position: absolute; inset: 0; background: var(--motion-backdrop); }
.celebration-panel { position: relative; width: min(100%, 420px); max-height: calc(100vh - 48px); max-height: calc(100dvh - 48px); overflow-y: auto; text-align: center; padding: 40px 24px; border-radius: var(--radius); background: var(--motion-white); box-shadow: var(--motion-shadow); pointer-events: auto; }
.celebration-panel h2 { margin: 24px 0 12px; overflow-wrap: anywhere; }
.celebration-panel .btn { margin-top: 16px; }
.celebration-badge { position: relative; display: grid; place-items: center; width: 88px; height: 88px; margin: 0 auto; border-radius: 28px; background: var(--motion-brand); color: var(--motion-white); box-shadow: var(--motion-badge-shadow); }
.celebration-badge svg { width: 52px; height: 52px; }
.celebration-sparkles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.motion-particle { position: absolute; left: 50%; top: 42%; width: 12px; height: 12px; background: var(--motion-gold); opacity: 0; clip-path: polygon(50% 0, 62% 35%, 100% 50%, 62% 65%, 50% 100%, 38% 65%, 0 50%, 38% 35%); }
.motion-particle:nth-child(3n) { background: var(--motion-brand); }
.motion-particle:nth-child(3n+1) { background: var(--motion-white); }
.motion-particle:nth-child(even) { width: 6px; height: 10px; clip-path: none; border-radius: 2px; }
.motion-field { position: relative; }
.motion-field-label { transform-origin: left center; transition: transform var(--motion-field) var(--motion-ease); }
.motion-field:focus-within .motion-field-label, .motion-field[data-motion-filled] .motion-field-label { transform: translateY(-3px) scale(.96); }
.motion-valid-mark { position: absolute; top: 0; right: 0; color: var(--motion-brand); font-weight: 700; opacity: 0; pointer-events: none; }
.motion-field[data-motion-valid] .motion-valid-mark { opacity: 1; }
.motion-card { position: relative; }
.motion-card::after { content: ''; position: absolute; inset: 0; border-radius: inherit; box-shadow: var(--motion-shadow); pointer-events: none; opacity: 0; transition: opacity var(--motion-press) var(--motion-ease); }
.motion-card[data-motion-hover]::after, .motion-card:active::after { opacity: 1; }
.motion-button-ready { position: relative; }
.motion-button-ready::before { content: ''; position: absolute; inset: 0; border-radius: inherit; box-shadow: var(--motion-shadow); pointer-events: none; opacity: 0; transition: opacity var(--motion-press) var(--motion-ease); }
.motion-button-ready:active::before { opacity: .3; }
.motion-button-dots { display: none; align-items: center; gap: 3px; pointer-events: none; }
.motion-button-dots span { display: block; width: 4px; height: 4px; border-radius: 50%; background: currentColor; }
form[aria-busy=true] .motion-button-dots, .btn[aria-busy=true] .motion-button-dots { display: inline-flex; }
form[aria-busy=true] button.motion-button-ready[type=submit]::after { display: none; }
form[aria-busy=true] .motion-button-dots span, .btn[aria-busy=true] .motion-button-dots span { animation: motion-loading var(--motion-loading) var(--motion-ease) var(--motion-loading-cycles); }
.motion-button-dots span:nth-child(2) { animation-delay: var(--motion-stagger); }
.motion-button-dots span:nth-child(3) { animation-delay: calc(2 * var(--motion-stagger)); }
.motion-launch .brand-symbol { position: relative; display: inline-block; animation: motion-logo var(--motion-logo) var(--motion-ease) both; }
.motion-launch .brand-symbol::after { content: ''; position: absolute; inset: -8px; border-radius: 50%; background: radial-gradient(circle, var(--motion-gold), transparent 65%); opacity: 0; pointer-events: none; animation: motion-glow var(--motion-logo) var(--motion-ease) both; }
.motion-shimmer > span { position: relative; overflow: hidden; animation: none; }
.motion-shimmer:not([hidden]) > span::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, transparent, var(--motion-shine), transparent); animation: motion-shimmer var(--motion-loading) var(--motion-ease) var(--motion-loading-cycles); }
.celebration-badge.motion-payment-badge { flex-shrink: 0; width: 24px; height: 24px; margin: 0; border-radius: 8px; box-shadow: none; }
.motion-payment-badge svg { width: 18px; height: 18px; }
.star-scene:is([data-star-state=NEW_CUSTOMER],[data-star-state=SUCCESS]) .star-core { animation-duration: var(--motion-badge); animation-timing-function: var(--motion-ease); }
.star-scene:is([data-star-state=RETURNING_CUSTOMER],[data-star-state=QR_SUCCESS]) .star-core { animation-duration: var(--motion-badge); animation-timing-function: var(--motion-ease); }
.star-scene[data-star-state=ERROR] .star-core { animation-duration: var(--motion-field); animation-timing-function: var(--motion-ease); }
[data-motion-success] { position: relative; }
.motion-inline-sparkles { position: absolute; inset: -20px; pointer-events: none; overflow: hidden; }
.motion-inline-sparkles .motion-particle { top: 50%; left: 30%; }
@keyframes motion-loading { 0%,100% { opacity: .35; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-3px); } }
@keyframes motion-logo { 0% { opacity: .7; transform: perspective(400px) rotateY(-18deg) scale(.94); } 65% { opacity: 1; transform: perspective(400px) rotateY(5deg) scale(1.04); } 100% { opacity: 1; transform: perspective(400px) rotateY(0) scale(1); } }
@keyframes motion-glow { 0%,100% { opacity: 0; transform: scale(.7); } 50% { opacity: .28; transform: scale(1.1); } }
@keyframes motion-shimmer { from { opacity: 0; transform: translateX(-100%); } 40% { opacity: 1; } to { opacity: 0; transform: translateX(100%); } }
@media (prefers-reduced-motion: reduce) {
  .motion-field-label { transition: none; }
  .motion-field:focus-within .motion-field-label, .motion-field[data-motion-filled] .motion-field-label { transform: none; }
  .celebration-sparkles, .motion-inline-sparkles { display: none; }
  .motion-launch .brand-symbol, .motion-launch .brand-symbol::after, .motion-shimmer > span::after, .motion-button-dots span { animation: none !important; }
  .motion-card::after, .motion-button-ready::before { transition: none; }
}
@media print { .success-celebration, .motion-inline-sparkles, .motion-button-dots, .motion-valid-mark { display: none !important; } }
[data-motion-paused] .motion-launch .brand-symbol, [data-motion-paused] .motion-launch .brand-symbol::after, [data-motion-paused] .motion-shimmer > span::after, [data-motion-paused] .motion-button-dots span { animation: none !important; }