/* 全局背景 */ page { background: #F8FAFE; font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', sans-serif; color: #1A1A1A; } /* 背景图 */ .page-bg { position: fixed; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.4; z-index: 0; pointer-events: none; } /* 未注册区域 */ .unreg-area { position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 0 50rpx; } .unreg-card { width: 100%; background: rgba(255, 255, 255, 0.75); backdrop-filter: blur(25rpx); -webkit-backdrop-filter: blur(25rpx); border-radius: 48rpx; padding: 60rpx 50rpx; text-align: center; box-shadow: 0 20rpx 50rpx rgba(0,0,0,0.06); border: 1rpx solid rgba(255,255,255,0.5); } .unreg-title { font-size: 40rpx; font-weight: 700; color: #1A1A1A; display: block; margin-bottom: 50rpx; } .unreg-input { width: 100%; height: 96rpx; background: #FFFFFF; border-radius: 48rpx; padding: 0 40rpx; font-size: 30rpx; color: #1A1A1A; margin-bottom: 40rpx; box-shadow: 0 4rpx 16rpx rgba(0,0,0,0.03); } .ph { color: #999999; } .unreg-btn { width: 100%; height: 96rpx; background: rgba(255,255,255,0.6); backdrop-filter: blur(15rpx); border-radius: 48rpx; display: flex; align-items: center; justify-content: center; border: 2rpx solid rgba(0,0,0,0.08); box-shadow: 0 12rpx 30rpx rgba(0,0,0,0.05); } .unreg-btn:active { opacity: 0.8; } .unreg-btn-text { color: #1A1A1A; font-size: 34rpx; font-weight: 600; } /* 已注册主区域 */ .main-body { position: relative; z-index: 2; padding: 0 30rpx 40rpx; } /* 刷新按钮 */ .refresh-btn { position: absolute; top: 40rpx; right: 40rpx; width: 68rpx; height: 68rpx; background: rgba(255,255,255,0.75); backdrop-filter: blur(12rpx); border-radius: 50%; display: flex; align-items: center; justify-content: center; z-index: 20; border: 1rpx solid rgba(255,255,255,0.6); box-shadow: 0 8rpx 20rpx rgba(0,0,0,0.06); } .refresh-icon { width: 38rpx; height: 38rpx; } /* 用户卡片 */ .user-card { margin-top: 60rpx; margin-bottom: 30rpx; background: rgba(255,255,255,0.7); backdrop-filter: blur(20rpx); -webkit-backdrop-filter: blur(20rpx); border-radius: 36rpx; padding: 28rpx 30rpx; display: flex; align-items: center; border: 1rpx solid rgba(255,255,255,0.5); box-shadow: 0 12rpx 35rpx rgba(0,0,0,0.05); } .user-avatar { width: 100rpx; height: 100rpx; border-radius: 50%; border: 3rpx solid #FFFFFF; margin-right: 24rpx; } .user-name { font-size: 38rpx; font-weight: 700; color: #1A1A1A; display: block; margin-bottom: 8rpx; } .uid-row { display: inline-flex; align-items: center; background: rgba(0,0,0,0.03); border-radius: 20rpx; padding: 6rpx 18rpx; } .uid-text { font-size: 26rpx; color: #1A1A1A; margin-right: 10rpx; } .copy-icon { width: 28rpx; height: 28rpx; } /* 称号区域 */ .badge-zone { margin-bottom: 24rpx; } .badge-scroll { white-space: nowrap; } /* 资产卡片 */ .asset-card { background: rgba(255,255,255,0.7); backdrop-filter: blur(20rpx); -webkit-backdrop-filter: blur(20rpx); border-radius: 36rpx; padding: 28rpx 30rpx; margin-bottom: 28rpx; border: 1rpx solid rgba(255,255,255,0.5); box-shadow: 0 12rpx 35rpx rgba(0,0,0,0.05); } .asset-title { font-size: 26rpx; color: #1A1A1A; font-weight: 500; display: block; } .asset-amount { display: flex; align-items: baseline; margin: 10rpx 0 22rpx; } .amount-number { font-size: 74rpx; font-weight: 800; color: #1A1A1A; margin-right: 8rpx; } .amount-unit { font-size: 32rpx; color: #1A1A1A; font-weight: 600; } /* 四列数据统计 */ .four-stats { display: flex; align-items: center; justify-content: space-around; padding: 20rpx 0; border-top: 1rpx solid rgba(0,0,0,0.06); border-bottom: 1rpx solid rgba(0,0,0,0.06); margin-bottom: 22rpx; } .stat-item { text-align: center; flex: 1; } .stat-val { font-size: 28rpx; font-weight: 700; color: #1A1A1A; display: block; margin-bottom: 6rpx; } .stat-label { font-size: 20rpx; color: #1A1A1A; font-weight: 500; } /* 提现按钮 */ .withdraw-btn { display: flex; align-items: center; justify-content: center; background: rgba(255,255,255,0.55); backdrop-filter: blur(12rpx); border-radius: 48rpx; padding: 16rpx 0; border: 2rpx solid rgba(0,0,0,0.06); box-shadow: 0 8rpx 20rpx rgba(0,0,0,0.04); } .withdraw-icon { width: 36rpx; height: 36rpx; margin-right: 12rpx; } .withdraw-text { font-size: 30rpx; font-weight: 600; color: #1A1A1A; } /* 功能入口三列布局 */ .func-grid { display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 28rpx; } .func-item { width: 31%; aspect-ratio: 1 / 1; background: rgba(255,255,255,0.7); backdrop-filter: blur(16rpx); -webkit-backdrop-filter: blur(16rpx); border-radius: 28rpx; display: flex; flex-direction: column; align-items: center; justify-content: center; margin-bottom: 20rpx; border: 1rpx solid rgba(255,255,255,0.5); box-shadow: 0 8rpx 22rpx rgba(0,0,0,0.04); } .func-icon { width: 56rpx; height: 56rpx; margin-bottom: 12rpx; } .func-label { font-size: 26rpx; font-weight: 500; color: #1A1A1A; text-align: center; } /* 联系组长卡片 */ .contact-card { display: flex; align-items: center; justify-content: space-between; background: rgba(255,255,255,0.7); backdrop-filter: blur(20rpx); -webkit-backdrop-filter: blur(20rpx); border-radius: 36rpx; padding: 20rpx 30rpx; margin-bottom: 40rpx; border: 1rpx solid rgba(255,255,255,0.5); box-shadow: 0 10rpx 25rpx rgba(0,0,0,0.04); } .contact-left { display: flex; align-items: center; flex: 1; } .contact-avatar { width: 60rpx; height: 60rpx; border-radius: 50%; margin-right: 18rpx; border: 2rpx solid #FFFFFF; } .contact-name { font-size: 28rpx; font-weight: 500; color: #1A1A1A; } .contact-uid { font-size: 22rpx; color: #1A1A1A; margin-top: 4rpx; } .contact-arrow { width: 24rpx; height: 24rpx; } /* 加载遮罩 */ .loading-mask { position: fixed; top:0; left:0; right:0; bottom:0; background: rgba(255,255,255,0.85); display: flex; align-items: center; justify-content: center; z-index: 9999; } .loading-spinner { width: 60rpx; height: 60rpx; border: 4rpx solid rgba(0,0,0,0.1); border-top-color: #1A1A1A; border-radius: 50%; animation: spin 0.8s linear infinite; }