@keyframes btn-sheen {
  from { transform: translateX(-120%); }
  to { transform: translateX(130%); }
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

@keyframes pulse-badge {
  0%, 100% { box-shadow: 0 0 0 3px var(--surface), 0 0 0 0 rgba(225, 29, 72, .45); }
  50% { box-shadow: 0 0 0 3px var(--surface), 0 0 0 7px rgba(225, 29, 72, 0); }
}

@keyframes pulse-dot {
  0% { box-shadow: 0 0 0 0 rgba(110, 227, 200, .7); }
  70% { box-shadow: 0 0 0 11px rgba(110, 227, 200, 0); }
  100% { box-shadow: 0 0 0 0 rgba(110, 227, 200, 0); }
}

@keyframes pulse-ring {
  0% { box-shadow: 0 0 0 0 rgba(20, 184, 154, .45); }
  70% { box-shadow: 0 0 0 14px rgba(20, 184, 154, 0); }
  100% { box-shadow: 0 0 0 0 rgba(20, 184, 154, 0); }
}

@keyframes float-y {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}

@keyframes orbit-spin {
  to { transform: rotate(360deg); }
}

@keyframes shimmer {
  from { transform: translateX(-100%); }
  to { transform: translateX(100%); }
}

@keyframes loader-slide {
  0% { transform: translateX(-110%); }
  100% { transform: translateX(320%); }
}

@keyframes veil-in {
  from { opacity: 0; transform: translateY(10px) scale(.94); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes alert-in {
  from { opacity: 0; transform: translateY(-10px) scale(.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes toast-in {
  from { opacity: 0; transform: translateX(28px) scale(.92); }
  to { opacity: 1; transform: translateX(0) scale(1); }
}

@keyframes toast-out {
  to { opacity: 0; transform: translateX(28px) scale(.9); }
}

@keyframes toast-in-mobile {
  from { opacity: 0; transform: translateY(24px) scale(.94); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes msg-in {
  from { opacity: 0; transform: translateY(10px) scale(.94); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes drawer-item {
  to { opacity: 1; transform: translateX(0); }
}

@keyframes heart-burst {
  0% { transform: scale(1); }
  38% { transform: scale(1.32); }
  70% { transform: scale(.94); }
  100% { transform: scale(1); }
}

@keyframes pop-in {
  0% { opacity: 0; transform: scale(.7); }
  60% { opacity: 1; transform: scale(1.06); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes ripple-out {
  to { transform: scale(2.6); opacity: 0; }
}

@keyframes count-tick {
  0% { transform: translateY(-40%); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

@keyframes gradient-pan {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

@keyframes glow-breathe {
  0%, 100% { opacity: .45; }
  50% { opacity: 1; }
}

@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@keyframes ring-spin {
  to { transform: rotate(360deg); }
}

@keyframes shine-sweep {
  0% { transform: translateX(-120%) skewX(-18deg); }
  100% { transform: translateX(220%) skewX(-18deg); }
}

@keyframes drop-in {
  from { opacity: 0; transform: translateY(-8px) scale(.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

[data-reveal] {
  opacity: 0;
  transform: translate3d(0, 26px, 0);
  transition:
    opacity var(--d-4) var(--e-out),
    transform var(--d-4) var(--e-out),
    filter var(--d-4) var(--e-out);
  transition-delay: var(--rd, 0ms);
  will-change: opacity, transform;
}

[data-reveal="left"] { transform: translate3d(-32px, 0, 0); }
[data-reveal="right"] { transform: translate3d(32px, 0, 0); }
[data-reveal="down"] { transform: translate3d(0, -26px, 0); }
[data-reveal="scale"] { transform: scale(.92); }
[data-reveal="zoom"] { transform: scale(1.06); filter: blur(6px); }
[data-reveal="blur"] { filter: blur(10px); transform: translate3d(0, 18px, 0); }
[data-reveal="fade"] { transform: none; }

[data-reveal].is-in {
  opacity: 1;
  transform: none;
  filter: none;
}

.stagger > * { --rd: calc(var(--si, 0) * 70ms); }
.stagger-fast > * { --rd: calc(var(--si, 0) * 34ms); }

[data-tilt] {
  transform: perspective(1000px)
    rotateX(var(--rx, 0deg))
    rotateY(var(--ry, 0deg))
    translateZ(0);
  transform-style: preserve-3d;
  transition: transform 260ms var(--e-out), box-shadow var(--d-3) var(--e-out);
  will-change: transform;
}

[data-tilt].is-tilting { transition: box-shadow var(--d-3) var(--e-out); }

[data-tilt] .tilt-depth { transform: translateZ(var(--tz, 26px)); }

.tilt-glare {
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: radial-gradient(360px circle at var(--mx, 50%) var(--my, 50%), rgba(255, 255, 255, .55), transparent 62%);
  opacity: 0;
  mix-blend-mode: overlay;
  transition: opacity var(--d-3) var(--e-out);
}

[data-tilt]:hover .tilt-glare { opacity: 1; }

[data-magnetic] {
  transition: transform 300ms var(--e-spring);
  will-change: transform;
}

[data-magnetic].is-pulled { transition: transform 90ms linear; }

[data-split] { display: block; }

.split-line { display: block; overflow: hidden; }

.split-word,
.split-char {
  display: inline-block;
  transform: translateY(105%) rotate(4deg);
  opacity: 0;
  transition: transform 780ms var(--e-out), opacity 620ms var(--e-out);
  transition-delay: var(--sd, 0ms);
}

.is-in .split-word,
.is-in .split-char,
.split-done .split-word,
.split-done .split-char {
  transform: translateY(0) rotate(0);
  opacity: 1;
}

[data-parallax] { will-change: transform; }

.ripple {
  position: absolute;
  width: 12px;
  height: 12px;
  margin: -6px 0 0 -6px;
  border-radius: 50%;
  background: currentColor;
  opacity: .32;
  pointer-events: none;
  transform: scale(0);
  animation: ripple-out 620ms var(--e-out) forwards;
}

.icon-like.is-bursting { animation: heart-burst 520ms var(--e-spring); }

.count-pop { animation: pop-in 420ms var(--e-spring); }

.count-tick { animation: count-tick 260ms var(--e-out); }

.live-dot {
  display: inline-grid;
  place-items: center;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ok);
  animation: pulse-ring 2.2s var(--e-out) infinite;
}

.shimmer-text {
  background: linear-gradient(100deg, var(--ink-300) 20%, var(--brand-500) 45%, var(--accent-400) 55%, var(--ink-300) 80%);
  background-size: 220% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: gradient-pan 4.5s var(--e-in-out) infinite;
}

.glow-soft { animation: glow-breathe 3.4s var(--e-in-out) infinite; }

.marquee {
  display: flex;
  overflow: hidden;
  gap: 14px;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}

.marquee > * { animation: marquee 26s linear infinite; }
.marquee:hover > * { animation-play-state: paused; }

.ring-loader {
  position: relative;
  width: 34px;
  height: 34px;
  border-radius: 50%;
}

.ring-loader::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 3px solid var(--line);
  border-top-color: var(--brand-500);
  animation: ring-spin 800ms linear infinite;
}

.shine-bar {
  position: relative;
  overflow: hidden;
}

.shine-bar::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 45%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .5), transparent);
  animation: shine-sweep 2.4s var(--e-in-out) infinite;
}

.dash-side.open ~ * { animation: none; }

select.dropdown-open { box-shadow: var(--ring); }

body.is-transitioning { overflow: hidden; }

.page-veil.is-leaving { opacity: 0; }

.float-in { animation: drop-in var(--d-3) var(--e-spring) both; }

.focus-ring-none:focus-visible { box-shadow: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }

  *,
  *::before,
  *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    scroll-behavior: auto !important;
  }

  [data-reveal] { opacity: 1 !important; transform: none !important; filter: none !important; }
  [data-split] .split-word,
  [data-split] .split-char { transform: none !important; opacity: 1 !important; }
  [data-tilt] { transform: none !important; }
  .hero-scene, .hero-chip, .hero-orbit, .marquee > *, .skeleton::after { animation: none !important; }
  .tilt-glare { display: none; }
}

@media print {
  .topbar, .footer, .mobile-dock, .to-top, .page-veil, .utility-bar, .toast-region { display: none !important; }
  body { background: #fff; }
  [data-reveal] { opacity: 1 !important; transform: none !important; }
}