.page { min-height: 100vh; background: var(--bg-grad); }
.intro { padding: 16rpx 0 28rpx; }
.intro__eyebrow { color: var(--gold); font-size: 22rpx; letter-spacing: 4rpx; }
.intro__title { font-size: 44rpx; font-weight: 700; margin-top: 12rpx; }
.intro__sub { font-size: 26rpx; color: var(--text-2); margin-top: 12rpx; }

.group { margin-top: 12rpx; }
.group + .group { margin-top: 36rpx; }
.grid { display: flex; flex-wrap: wrap; gap: 18rpx; }
.grid__item { width: calc((100% - 18rpx) / 2); }

.filterbar { padding: 16rpx 32rpx 4rpx; }
.filterbar__scroll { white-space: nowrap; }

.searchbar { padding: 12rpx 32rpx; }
.searchbar__box {
  display: flex; align-items: center;
  background: var(--surface); border: 1rpx solid var(--line);
  border-radius: 999rpx; padding: 20rpx 28rpx;
}
.searchbar__input { flex: 1; color: var(--text); font-size: 28rpx; }
.ph { color: var(--text-3); }

.empty { color: var(--text-3); font-size: 26rpx; text-align: center; padding: 80rpx 0; }