/* app.wxss — 全局样式 */ page { background-color: #FFFBF5; color: #1A1A1A; font-family: 'PingFang SC', 'Noto Sans SC', 'Hiragino Sans GB', system-ui, -apple-system, sans-serif; font-size: 28rpx; line-height: 1.5; } /* 中文衬线字体 */ .font-chinese { font-family: 'Noto Serif SC', 'STSong', 'SimSun', 'Songti SC', serif; } /* 卡片基础样式 */ .card { background-color: #FFFFFF; border-radius: 24rpx; border: 1rpx solid #E8D5C4; padding: 24rpx; margin-bottom: 16rpx; } /* 徽章 */ .badge { display: inline-flex; align-items: center; padding: 4rpx 16rpx; border-radius: 999rpx; font-size: 20rpx; font-weight: 500; } .badge-lucky { background-color: #FEF2F2; color: #C41E3A; } .badge-unlucky { background-color: #F1F5F9; color: #546E7A; } .badge-outline { border: 1rpx solid #E8D5C4; color: #6B5E53; background: transparent; } .badge-festival { background-color: #C41E3A; color: #FFFFFF; } /* 按钮 */ .btn-primary { background-color: #C41E3A; color: #FFFFFF; border-radius: 16rpx; padding: 16rpx 32rpx; font-size: 28rpx; font-weight: 500; border: none; } .btn-primary:active { background-color: #8B1A2B; } .btn-outline { background-color: transparent; border: 2rpx solid #E8D5C4; color: #1A1A1A; border-radius: 16rpx; padding: 16rpx 32rpx; font-size: 28rpx; } .btn-ghost { background-color: transparent; color: #1A1A1A; border-radius: 16rpx; padding: 16rpx 32rpx; font-size: 28rpx; } /* 文本颜色 */ .text-primary { color: #C41E3A; } .text-secondary { color: #6B5E53; } .text-muted { color: #9E8E7E; } .text-lucky { color: #C41E3A; } .text-unlucky { color: #546E7A; } /* 背景色 */ .bg-card { background-color: #FFFFFF; } .bg-page { background-color: #FFFBF5; } /* 边框 */ .border { border: 1rpx solid #E8D5C4; } .border-b { border-bottom: 1rpx solid #E8D5C4; } /* 布局 */ .flex { display: flex; } .flex-col { flex-direction: column; } .items-center { align-items: center; } .justify-center { justify-content: center; } .justify-between { justify-content: space-between; } .flex-1 { flex: 1; } .text-center { text-align: center; } /* 间距 */ .mt-1 { margin-top: 8rpx; } .mt-2 { margin-top: 16rpx; } .mb-1 { margin-bottom: 8rpx; } .mb-2 { margin-bottom: 16rpx; } .p-2 { padding: 16rpx; } .p-3 { padding: 24rpx; } /* 圆角 */ .rounded { border-radius: 16rpx; } .rounded-lg { border-radius: 24rpx; } .rounded-full { border-radius: 999rpx; } /* 字号 */ .text-xs { font-size: 20rpx; } .text-sm { font-size: 24rpx; } .text-base { font-size: 28rpx; } .text-lg { font-size: 32rpx; } .text-xl { font-size: 36rpx; } .text-2xl { font-size: 48rpx; } .text-3xl { font-size: 60rpx; } /* 字重 */ .font-medium { font-weight: 500; } .font-bold { font-weight: 700; } /* 网格 */ .grid { display: grid; } .grid-cols-2 { grid-template-columns: repeat(2, 1fr); } .grid-cols-3 { grid-template-columns: repeat(3, 1fr); } .grid-cols-4 { grid-template-columns: repeat(4, 1fr); } .grid-cols-7 { grid-template-columns: repeat(7, 1fr); } .gap-1 { gap: 8rpx; } .gap-2 { gap: 16rpx; } .gap-3 { gap: 24rpx; } /* 隐藏 */ .hidden { display: none; } /* 滚动 */ .scroll-x { overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; } /* 安全区域 */ .safe-area-bottom { padding-bottom: env(safe-area-inset-bottom); }