.page { min-height: 100vh; background: var(--bg-grad); } .bar { display: flex; align-items: center; justify-content: space-between; padding: 16rpx 32rpx; } .bar__count { font-size: 28rpx; color: var(--text-2); } .bar__manage { font-size: 28rpx; color: var(--gold); font-weight: 600; padding: 8rpx 28rpx; border: 1rpx solid var(--gold-line); border-radius: 999rpx; } .grid { display: flex; flex-wrap: wrap; gap: 18rpx; } .grid__item { width: calc((100% - 18rpx) / 2); } .item { position: relative; } .remove { position: absolute; right: 12rpx; top: 12rpx; z-index: 5; background: var(--danger); color: var(--accent-on); font-size: 22rpx; padding: 8rpx 18rpx; border-radius: 999rpx; } .empty { color: var(--text-3); font-size: 26rpx; text-align: center; padding: 120rpx 0; } .empty-box { display: flex; flex-direction: column; align-items: center; padding: 120rpx 40rpx; } .empty-box__emoji { width: 140rpx; height: 140rpx; border-radius: 999rpx; background: var(--surface-2); display: flex; align-items: center; justify-content: center; font-size: 72rpx; } .empty-box__t { font-size: 28rpx; color: var(--text-2); margin-top: 32rpx; text-align: center; } .empty-box__btn { margin-top: 40rpx; padding: 22rpx 64rpx; border-radius: 999rpx; background: linear-gradient(135deg, var(--gold) 0%, var(--gold-2) 100%); color: var(--accent-on); font-weight: 700; font-size: 30rpx; }