.page { min-height: 100vh; padding-bottom: calc(180rpx + env(safe-area-inset-bottom)); }

.header { position: relative; text-align: center; padding: 32rpx; border-bottom: 1rpx solid var(--line); }
.edit { position: absolute; top: 28rpx; right: 32rpx; font-size: 26rpx; color: var(--accent-deep); }
.dog-avatar { width: 124rpx; height: 124rpx; border-radius: 50%; background: var(--surface-2); display: flex; align-items: center; justify-content: center; font-size: 60rpx; margin: 0 auto 14rpx; }
.dog-name { font-size: 34rpx; font-weight: 600; }
.dog-meta { font-size: 24rpx; color: var(--ink-2); margin-top: 6rpx; }

.grid3 { display: flex; padding: 28rpx 12rpx; border-bottom: 1rpx solid var(--line); }
.g { flex: 1; text-align: center; }
.g-v { font-size: 40rpx; font-weight: 600; }
.g-v.streak { color: var(--success); }
.g-k { font-size: 22rpx; color: var(--ink-2); margin-top: 4rpx; }

.row-head { display: flex; align-items: center; justify-content: space-between; padding: 28rpx 32rpx 12rpx; }
.rh-title { font-size: 26rpx; font-weight: 600; }
.rh-more { font-size: 22rpx; color: var(--accent-deep); }

.wall { display: flex; flex-wrap: wrap; padding: 0 24rpx 20rpx; border-bottom: 1rpx solid var(--line); }
.medal-item { width: 25%; display: flex; flex-direction: column; align-items: center; gap: 8rpx; padding: 12rpx 0; }
.medal { width: 84rpx; height: 84rpx; border-radius: 50%; background: var(--surface-2); display: flex; align-items: center; justify-content: center; font-size: var(--icon-size); line-height: 1; }
.medal-item.locked .medal { opacity: 0.55; }
.medal-name { font-size: 20rpx; color: var(--ink-2); }
.medal-item.locked .medal-name { color: var(--ink-3); }

.recent { padding: 0 32rpx; display: flex; flex-direction: column; gap: 16rpx; }
.walk-row { display: flex; align-items: center; gap: 18rpx; padding: 22rpx; background: var(--surface-2); border-radius: var(--radius-sm); }
.wr-ico { width: var(--icon-size); font-size: var(--icon-size); line-height: 1; text-align: center; }
.wr-body { flex: 1; }
.wr-title { font-size: 26rpx; }
.wr-sub { font-size: 22rpx; color: var(--ink-2); margin-top: 4rpx; }

.empty { text-align: center; font-size: 24rpx; color: var(--ink-3); padding: 40rpx 32rpx; }