.page { min-height: 100vh; background: #E8C3D4; } .nav-container { position: fixed; top: 0; left: 0; right: 0; z-index: 999; background: rgba(248, 249, 252, 0.75); backdrop-filter: blur(20rpx) saturate(180%); -webkit-backdrop-filter: blur(20rpx) saturate(180%); } .status-bar { background: transparent; } .nav-bar { display: flex; align-items: center; justify-content: center; padding: 0 32rpx; position: relative; } .nav-back { position: absolute; left: 32rpx; top: 50%; transform: translateY(-50%); width: 80rpx; height: 80rpx; display: flex; align-items: center; justify-content: center; z-index: 10; } .back-icon { width: 48rpx; height: 48rpx; } .nav-title { font-size: 34rpx; font-weight: 700; color: #1A1A1A; } .wrap { padding: 24rpx; } .card { background: #ffffff; border-radius: 40rpx; padding: 28rpx; box-shadow: 0 10rpx 20rpx rgba(17, 24, 39, 0.04); margin-bottom: 24rpx; } .field { margin-bottom: 18rpx; } .label { display: block; font-size: 24rpx; font-weight: 900; color: #111827; margin-bottom: 12rpx; } .input { height: 88rpx; border-radius: 24rpx; background: #f9fafb; padding: 0 24rpx; font-size: 26rpx; font-weight: 800; color: #111827; } .hint { display: block; margin-top: 10rpx; font-size: 22rpx; color: #9ca3af; font-weight: 700; } .presets { display: flex; gap: 12rpx; margin-top: 16rpx; flex-wrap: wrap; } .preset { padding: 14rpx 18rpx; border-radius: 999rpx; background: rgba(17, 24, 39, 0.06); color: #111827; font-size: 24rpx; font-weight: 800; } .save { width: 100%; padding: 26rpx 0; border-radius: 24rpx; background: #b06ab3; color: #ffffff; font-size: 32rpx; font-weight: 900; box-shadow: 0 22rpx 44rpx rgba(176, 106, 179, 0.25); } .logout { width: 100%; padding: 26rpx 0; border-radius: 24rpx; background: rgba(239, 68, 68, 0.1); color: #ef4444; font-size: 32rpx; font-weight: 900; margin-bottom: 16rpx; } .login { width: 100%; padding: 26rpx 0; border-radius: 24rpx; background: rgba(176, 106, 179, 0.1); color: #b06ab3; font-size: 32rpx; font-weight: 900; }