.page { padding: 32rpx; min-height: 100vh; box-sizing: border-box; background: #FDFBF7; } /* ---- Hero 品牌头图 ---- */ .hero { position: relative; overflow: hidden; padding: 48rpx 40rpx 56rpx; border-radius: 24rpx; background: linear-gradient(135deg, #2C1810 0%, #4A2B1D 55%, #6B3F24 100%); box-shadow: 0 12rpx 32rpx rgba(44, 24, 16, 0.18); color: #FDFBF7; } .hero-chip { display: inline-block; padding: 10rpx 22rpx; border-radius: 999rpx; background: rgba(198, 123, 48, 0.18); color: #E3B37C; font-size: 22rpx; margin-bottom: 22rpx; } .hero-name { font-size: 48rpx; font-weight: 700; color: #FFFFFF; letter-spacing: 2rpx; } .hero-enc { margin-top: 14rpx; font-size: 26rpx; color: #E8DCCB; line-height: 1.6; } .hero-login-tip { margin-top: 24rpx; display: inline-block; padding: 12rpx 28rpx; background: rgba(198, 123, 48, 0.25); border: 1rpx solid rgba(227, 179, 124, 0.4); border-radius: 999rpx; color: #E3B37C; font-size: 24rpx; } .btn-hover { opacity: 0.7; } /* ---- 模块网格 ---- */ .grid { display: flex; flex-wrap: wrap; gap: 20rpx; margin-top: 32rpx; } .module { width: 31%; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; text-align: center; background: #FFF; border-radius: 22rpx; padding: 30rpx 12rpx 26rpx; box-shadow: 0 6rpx 24rpx rgba(44, 24, 16, 0.06); transition: transform 0.18s ease, opacity 0.18s ease; } .module-hover { transform: scale(1.03); opacity: 0.9; } .module-icon { width: 84rpx; height: 84rpx; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #F6EFE6; font-size: 40rpx; flex-shrink: 0; } .module-label { margin-top: 16rpx; max-width: 100%; font-size: 28rpx; font-weight: 700; color: #2C1810; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .module-desc { margin-top: 8rpx; max-width: 100%; font-size: 22rpx; color: #8B7A6A; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* ---- intro section ---- */ .intro-section { margin-top: 40rpx; } .intro-title { font-size: 32rpx; font-weight: 700; color: #2C1810; margin-bottom: 20rpx; padding-left: 4rpx; } .intro-card { display: flex; align-items: flex-start; background: #fff; border-radius: 16rpx; padding: 28rpx 24rpx; margin-bottom: 16rpx; box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.03); } .intro-icon { font-size: 40rpx; margin-right: 20rpx; flex-shrink: 0; line-height: 1; padding-top: 2rpx; } .intro-body { flex: 1; min-width: 0; } .intro-heading { font-size: 28rpx; font-weight: 700; color: #C67B30; margin-bottom: 10rpx; } .intro-text { font-size: 25rpx; color: #5A4A3A; line-height: 1.8; } /* ---- web-view 错误页 ---- */ .error-page { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 120rpx 60rpx; height: 100vh; box-sizing: border-box; } .error-icon { width: 120rpx; height: 120rpx; border-radius: 50%; background: #FDEAEA; color: #C0392B; font-size: 64rpx; font-weight: 700; display: flex; align-items: center; justify-content: center; margin-bottom: 32rpx; } .error-title { font-size: 32rpx; font-weight: 700; color: #2C1810; margin-bottom: 16rpx; } .error-desc { font-size: 26rpx; color: #8B7A6A; text-align: center; line-height: 1.6; margin-bottom: 40rpx; } .error-retry { padding: 20rpx 60rpx; background: #C67B30; color: #fff; font-size: 28rpx; border-radius: 999rpx; }