/** 运势:杂志内页 —— 巨大衬线星座名 / 超大数字 / 发丝线刻度尺 / 衬线引文 **/ .page-flex { height: 100vh; display: flex; flex-direction: column; overflow: hidden; } .scroll-body { flex: 1; height: 0; } .hs-skel { padding: 60rpx var(--pad) 0; display: flex; flex-direction: column; gap: 44rpx; } .hs-skel-num { width: 56%; height: 128rpx; border-radius: 12rpx; } .hs-hero { padding: 44rpx var(--pad) 0; display: flex; align-items: baseline; justify-content: space-between; gap: 24rpx; } .hs-zodiac { display: flex; align-items: center; gap: 18rpx; } .hs-zodiac .icon { width: 40rpx; height: 40rpx; color: var(--ink-2); flex-shrink: 0; } .hs-date { font-size: 22rpx; color: var(--ink-3); letter-spacing: .08em; } .hs-score { padding: 56rpx var(--pad) 0; display: flex; align-items: flex-end; gap: 40rpx; } .hs-score-main { min-width: 0; } /* 单项评分块(行内纵向排布,由 .hs-scales 的 gap 控制间距) */ .hs-scale { display: block; } .hs-num { margin-top: 24rpx; font-family: var(--serif); font-size: 152rpx; font-weight: 500; line-height: .84; letter-spacing: -.035em; } .hs-stars { display: flex; gap: 8rpx; padding-bottom: 18rpx; } .hs-stars .icon { width: 30rpx; height: 30rpx; color: var(--ink); } .hs-scales { padding: 64rpx var(--pad) 0; display: flex; flex-direction: column; gap: 38rpx; } .hs-st { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 14rpx; } .hs-st .k { font-size: 26rpx; color: var(--ink-2); } .hs-st .v { font-size: 23rpx; color: var(--ink-3); letter-spacing: .04em; } .hs-quote { padding: 64rpx var(--pad) 0; } .hs-quote .t-quote { margin-top: 26rpx; } .hs-lucky { display: flex; margin: 64rpx var(--pad) 0; border-top: 1rpx solid var(--hairline); border-bottom: 1rpx solid var(--hairline); } .hs-lucky-cell { flex: 1; padding: 32rpx 0 34rpx; text-align: center; position: relative; } .hs-lucky-cell + .hs-lucky-cell::before { content: ''; position: absolute; left: 0; top: 32rpx; bottom: 34rpx; width: 1rpx; background: var(--hairline); } .hs-lucky .lk { font-size: 19rpx; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); } .hs-lucky .lv { margin-top: 20rpx; font-family: var(--serif); font-size: 38rpx; display: flex; align-items: center; justify-content: center; gap: 14rpx; } .hs-lucky .lv .dot { width: 22rpx; height: 22rpx; border-radius: 50%; box-shadow: inset 0 0 0 1rpx rgba(0, 0, 0, .14); } .hs-foot { padding: 56rpx var(--pad) 0; }