.container { min-height: 100vh; background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%); padding: 140rpx 30rpx 120rpx; } /* 自定义返回按钮样式 */ .nav-back { position: absolute; top: 40rpx; left: 30rpx; display: flex; align-items: center; z-index: 100; padding: 10rpx 20rpx; border-radius: 30rpx; background: rgba(255, 255, 255, 0.05); } .back-icon { font-size: 32rpx; margin-right: 8rpx; color: #c9a0dc; } .back-text { font-size: 26rpx; color: #c9a0dc; letter-spacing: 2rpx; } .article-header { margin-bottom: 50rpx; } .article-title { display: block; font-size: 44rpx; font-weight: 600; color: #fff; line-height: 1.4; margin-bottom: 24rpx; } .article-summary { display: block; font-size: 28rpx; color: rgba(255, 255, 255, 0.7); line-height: 1.6; padding: 20rpx 24rpx; background: rgba(255, 255, 255, 0.08); border-radius: 12rpx; border-left: 4rpx solid rgba(255, 255, 255, 0.3); } .article-content { background: rgba(255, 255, 255, 0.05); backdrop-filter: blur(10px); border-radius: 16rpx; padding: 40rpx 32rpx; border: 1px solid rgba(255, 255, 255, 0.1); } .content-text { display: block; font-size: 30rpx; color: rgba(255, 255, 255, 0.9); line-height: 1.8; white-space: pre-wrap; } .bottom-action { position: fixed; bottom: 0; left: 0; right: 0; padding: 20rpx 30rpx; background: linear-gradient(to top, #1a1a2e 80%, transparent); } .divination-btn { width: 100%; height: 88rpx; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); border-radius: 44rpx; color: #fff; font-size: 32rpx; font-weight: 500; display: flex; align-items: center; justify-content: center; border: none; box-shadow: 0 8rpx 24rpx rgba(102, 126, 234, 0.3); } .btn-hover { opacity: 0.8; transform: scale(0.98); }