/* Unified visual motion layer. Existing sticky and scroll-stack transforms stay untouched. */
:root {
  --vm-ease-out: cubic-bezier(.16, 1, .3, 1);
  --vm-blue: #1687ff;
  --vm-cyan: #39d8ff;
  --vm-mint: #42f5b0;
}

.vm-scroll-progress {
  position: fixed;
  z-index: 870;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  transform: scaleX(0);
  transform-origin: 0 50%;
  pointer-events: none;
  background: linear-gradient(90deg, var(--vm-blue), var(--vm-cyan) 54%, var(--vm-mint));
  box-shadow: 0 1px 10px rgba(22, 135, 255, .34);
  will-change: transform;
  animation: vm-scroll-progress linear both;
  animation-timeline: scroll(root block);
}

@keyframes vm-scroll-progress {
  to { transform: scaleX(1); }
}

/* The image moves, while its wrapper remains available to the existing scroll transform. */
.vm-motion-enabled .hero-device-showcase > img {
  transform-origin: 50% 48%;
  animation: vm-device-float 7.2s ease-in-out infinite;
}

@keyframes vm-device-float {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(0, -7px, 0) scale(1.006); }
}

/* Ambient depth in the usage section. */
.product-panels {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.product-panels::before,
.product-panels::after {
  content: "";
  position: absolute;
  z-index: 0;
  width: clamp(260px, 32vw, 480px);
  aspect-ratio: 1;
  border-radius: 50%;
  pointer-events: none;
  opacity: .58;
  will-change: transform;
}

.product-panels::before {
  top: -18%;
  left: -9%;
  background: radial-gradient(circle, rgba(38, 136, 255, .17), rgba(38, 136, 255, 0) 70%);
  animation: vm-orb-left 15s ease-in-out infinite alternate;
}

.product-panels::after {
  right: -10%;
  bottom: -25%;
  background: radial-gradient(circle, rgba(44, 229, 190, .15), rgba(44, 229, 190, 0) 70%);
  animation: vm-orb-right 18s ease-in-out infinite alternate;
}

.product-panels__inner {
  position: relative;
  z-index: 1;
}

@keyframes vm-orb-left {
  from { transform: translate3d(-2%, -3%, 0) scale(.94); }
  to { transform: translate3d(18%, 15%, 0) scale(1.1); }
}

@keyframes vm-orb-right {
  from { transform: translate3d(3%, 5%, 0) scale(1); }
  to { transform: translate3d(-18%, -12%, 0) scale(1.12); }
}

.product-panels__title {
  position: relative;
}

.vm-motion-enabled .product-panels__title::after {
  content: "";
  display: block;
  width: 78px;
  height: 5px;
  margin: 18px auto 0;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--vm-blue), var(--vm-mint));
  transform: scaleX(0);
  transform-origin: 50% 50%;
  opacity: 0;
  transition: transform .9s var(--vm-ease-out) .18s, opacity .45s ease .18s;
}

.vm-motion-enabled #features.vm-features-in-view .product-panels__title::after {
  transform: scaleX(1);
  opacity: 1;
}

.product-card__tag,
.product-card li,
.support-os__icon-img,
.product-card__btn,
.section-header__button {
  transition-timing-function: var(--vm-ease-out) !important;
}

.support-os__item--update {
  position: relative;
}

.support-os__icon--update {
  object-fit: contain;
  filter: drop-shadow(0 6px 10px rgba(45, 55, 68, .16));
}

.support-os__latest-badge {
  position: absolute;
  z-index: 2;
  top: 5px;
  right: 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 18px;
  padding: 0 6px;
  border-radius: 5px;
  background: linear-gradient(135deg, #1687ff, #5266ff);
  box-shadow: 0 4px 10px rgba(22, 135, 255, .2);
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 800;
  line-height: 18px !important;
  letter-spacing: .04em;
  pointer-events: none;
}

.product-card__tag {
  transition: transform .45s var(--vm-ease-out), background-color .35s ease;
}

.product-card li {
  transition: transform .4s var(--vm-ease-out), color .3s ease;
}

.product-card__btn,
.section-header__button {
  transition: transform .42s var(--vm-ease-out), box-shadow .42s ease !important;
}

.product-card__btn {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.product-card__btn::before {
  content: "";
  position: absolute;
  inset: -30% auto -30% -55%;
  z-index: 0;
  width: 42%;
  transform: skewX(-20deg);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .34), transparent);
  pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {
  .product-card:hover .product-card__tag,
  .product-card:focus-within .product-card__tag {
    transform: translate3d(0, -3px, 0);
    background-color: #deecff;
  }

  .product-card:hover li,
  .product-card:focus-within li {
    transform: translate3d(4px, 0, 0);
    color: #1e4265;
  }

  .product-card:hover li:nth-child(2),
  .product-card:focus-within li:nth-child(2) { transition-delay: .035s; }

  .product-card:hover li:nth-child(3),
  .product-card:focus-within li:nth-child(3) { transition-delay: .07s; }

  .product-card__btn:hover,
  .product-card__btn:focus-visible,
  .section-header__button:hover,
  .section-header__button:focus-visible {
    transform: translate3d(0, -4px, 0) scale(1.025);
    box-shadow: 0 18px 40px rgba(10, 45, 86, .26) !important;
  }

  .product-card__btn:hover::before,
  .product-card__btn:focus-visible::before {
    animation: vm-button-sheen .78s ease-out both;
  }

  .support-os__item:hover .support-os__icon-img,
  .support-os__item:focus-visible .support-os__icon-img {
    animation: vm-icon-bounce .62s var(--vm-ease-out) both;
  }

  .rb-logo-loop__item:hover img {
    filter: saturate(1.08) contrast(1.02);
    opacity: 1;
    transform: translate3d(0, -3px, 0) scale(1.025);
  }
}

@keyframes vm-button-sheen {
  from { left: -55%; }
  to { left: 125%; }
}

/*
首屏下载按钮加载层级修复：
按钮执行入场位移时会暂时形成独立合成层，原本位于按钮后方的
光晕伪元素可能被绘制到按钮表面。入场阶段只隐藏该伪元素的可见度，
不停止按钮主体及光晕自身的 rainbow 循环动画；入场结束后移除类名，
原有动态光晕立即恢复。
*/
#hd_download.vm-hero-button-entering::before {
  opacity: 0 !important;
}

/* Keep the hero CTA plain black on pointer interaction. The upstream component
   uses a moving rainbow background/pseudo-element; suppress only that state. */
@media (hover: hover) and (pointer: fine) {
  #hd_download:hover,
  #hd_download:focus-visible,
  #hd_download:active {
    background: #000 !important;
    background-image: none !important;
    border-color: #000 !important;
    box-shadow: none !important;
    color: #fff !important;
    transform: none !important;
    animation: none !important;
  }

  #hd_download:hover::before,
  #hd_download:hover::after,
  #hd_download:focus-visible::before,
  #hd_download:focus-visible::after,
  #hd_download:active::before,
  #hd_download:active::after {
    content: none !important;
    background: none !important;
    box-shadow: none !important;
    filter: none !important;
    opacity: 0 !important;
    animation: none !important;
  }
}

@keyframes vm-icon-bounce {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  46% { transform: translate3d(0, -8px, 0) scale(1.09); }
  72% { transform: translate3d(0, 2px, 0) scale(.98); }
  100% { transform: translate3d(0, 0, 0) scale(1); }
}

/* Stagger the existing proof-copy reveal without changing its sticky position. */
.vm-motion-enabled .animated-content > * {
  transition: opacity .72s ease, transform .88s var(--vm-ease-out);
}

.vm-motion-enabled .animated-content:not(.is-visible) > * {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
}

.vm-motion-enabled .animated-content.is-visible > * {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.vm-motion-enabled .animated-content > :nth-child(2) { transition-delay: .08s; }
.vm-motion-enabled .animated-content > :nth-child(3) { transition-delay: .16s; }

.rb-logo-loop__item img {
  transition: filter .4s ease, opacity .4s ease, transform .5s var(--vm-ease-out);
}

@media (max-width: 760px) {
  .vm-scroll-progress { height: 2px; }

  .vm-motion-enabled .hero-device-showcase > img {
    animation-duration: 8.5s;
  }

  .product-panels::before,
  .product-panels::after {
    width: 300px;
    opacity: .4;
  }

  .vm-motion-enabled .product-panels__title::after {
    width: 60px;
    height: 4px;
    margin-top: 13px;
  }

  .support-os__latest-badge {
    top: 3px;
    right: 3px;
    height: 14px;
    padding: 0 3px;
    border-radius: 4px;
    font-size: 8px !important;
    line-height: 14px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .vm-scroll-progress { display: none; }

  .vm-motion-enabled .hero-device-showcase > img,
  .product-panels::before,
  .product-panels::after,
  .support-os__item:hover .support-os__icon-img,
  .support-os__item:focus-visible .support-os__icon-img {
    animation: none !important;
  }

  .vm-motion-enabled .animated-content > *,
  .vm-motion-enabled .product-panels__title::after,
  .product-card__tag,
  .product-card li,
  .product-card__btn,
  .section-header__button,
  .rb-logo-loop__item img {
    transition: none !important;
  }

  .vm-motion-enabled .animated-content > * {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* Liquid-glass notification shown when hovering a capability card. */
.support-liquid-notification {
  position: fixed;
  z-index: 960;
  top: calc(env(safe-area-inset-top) + 84px);
  left: 50%;
  width: min(calc(100vw - 24px), 440px);
  height: 86px;
  transform: translate3d(-50%, 0, 0);
  transform-origin: top center;
  pointer-events: none;
  will-change: transform, opacity, filter;
}

.support-liquid-notification.is-hidden { visibility: hidden; }
.support-liquid-notification__shell { position:absolute; inset:0; overflow:hidden; border:1px solid rgba(255,255,255,.74); border-radius:30px; background:linear-gradient(135deg,rgba(255,255,255,.78),rgba(245,250,255,.58)); backdrop-filter:blur(28px) saturate(165%) brightness(1.06); -webkit-backdrop-filter:blur(28px) saturate(165%) brightness(1.06); box-shadow:inset 0 1px 1px rgba(255,255,255,.8),inset 0 -1px 1px rgba(120,140,170,.12),0 10px 30px rgba(30,50,80,.16); }
.support-liquid-notification__edge { position:absolute; inset:0; border-radius:inherit; background:linear-gradient(100deg,rgba(71,216,255,.16),transparent 24%,transparent 62%,rgba(255,153,184,.13),rgba(255,190,116,.12)); mix-blend-mode:screen; }
.support-liquid-notification__highlight { position:absolute; inset:1px; border-radius:inherit; background:linear-gradient(180deg,rgba(255,255,255,.58),transparent 34%); }
.support-liquid-notification__content { position:relative; z-index:1; display:flex; align-items:center; height:100%; padding:0 17px; gap:12px; color:rgba(10,15,22,.9); }
.support-liquid-notification__icon { display:block; flex:0 0 46px; width:46px; height:46px; border-radius:50%; object-fit:cover; background:#e5edf5; box-shadow:0 4px 12px rgba(20,50,82,.16); }
.support-liquid-notification__copy { min-width:0; flex:1; }
.support-liquid-notification__app { font-size:14px; font-weight:800; line-height:1.2; }
.support-liquid-notification__message { overflow:hidden; margin-top:5px; color:rgba(10,15,22,.72); font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.support-liquid-notification__action { position:relative; align-self:stretch; flex:0 0 58px; }
.support-liquid-notification__time { position:absolute; top:17px; right:0; color:rgba(10,15,22,.46); font-size:11px; line-height:1; }
.support-liquid-notification__view { position:absolute; top:41px; left:2px; color:rgba(220,88,108,.7); font-size:14px; font-weight:700; line-height:1; letter-spacing:.01em; text-shadow:0 1px 0 rgba(255,255,255,.62); }
@media (max-width:760px) { .support-liquid-notification { top:calc(env(safe-area-inset-top) + 76px); height:78px; } .support-liquid-notification__shell { border-radius:27px; } .support-liquid-notification__content { padding:0 14px; } .support-liquid-notification__icon { flex-basis:42px; width:42px; height:42px; border-radius:50%; } .support-liquid-notification__action { flex-basis:48px; } .support-liquid-notification__view { top:37px; left:1px; font-size:13px; } .support-liquid-notification__time { top:14px; font-size:9px; } }
@media (prefers-reduced-motion:reduce) { .support-liquid-notification,.support-liquid-notification * { filter:none!important; } }