/**
 * ============================================================
 *  wallet_animation.css — Wallet 进入动画样式（简化版）
 * ============================================================
 *  配合Web Animations API使用，只提供基础样式
 * ============================================================
 */

/* ——————————————————————————————————————————————
 *  3D透视效果容器
 * —————————————————————————————————————————————— */

.wallet-cards-stack {
  perspective: 1200px;
  perspective-origin: center center;
  transform-style: preserve-3d;
}

.wallet-card {
  transform-style: preserve-3d;
  backface-visibility: hidden;
  will-change: transform, opacity;
  transition: transform 50ms ease-out, filter 50ms ease-out;
}

/* ——————————————————————————————————————————————
 *  余额数字样式
 * —————————————————————————————————————————————— */

.wallet-balance-amount {
  position: relative;
  display: inline-block;
  transition: transform 50ms ease-out, filter 50ms ease-out;
}

/* ——————————————————————————————————————————————
 *  性能优化
 * —————————————————————————————————————————————— */

.wallet-card,
.wallet-balance-amount,
.wallet-filters,
.wallet-section-title,
.wallet-transaction-item,
.wallet-refund-card,
.wallet-bottom-bar {
  /* 使用GPU加速 */
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  -webkit-perspective: 1000;
}