style(fe): 记录页从「肥色块」改成白卡收纳

截图那个真的丑：.quick 是 128rpx 的大方块，整格铺 tone-N 的浅色底，
四个排一行就是一片肥色块，还直接浮在页面渐变上、没有卡片收纳，
不完整的行还留大缺口，整体像一张配色测试表。

改成 preview-v3（你当时认可的那版）的做法：
  每组一张白卡收纳（.card）
  颜色只集中在图标那个 96rpx 小圆角块上（.rec-ic + tone-N）
  标签用纯深色，不跟 tone 变 —— 四组底下的字统一深灰，才不花
  组标题一根同色系竖条 + 组名

.quick / .quick-grid / .tg 现在只有记录页用，直接换成 record 页私有的
.rec-* 类，不动全局。

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

pets-fe/pages/record/record.wxml

@@ -10,21 +10,21 @@
   </view>
 
   <!-- 分组来自后端 record_types，后台加一种不用发版。
-       组标记用 g-N 而不是 tone-N：tone-N 在 app.wxss 里自带背景色，
-       加在这一层会把整组涂成一片色块（本来只想给组标题上色）。
-       记哪只宠物在添加页里选，这页不放宠物切换——它只是个事项目录。 -->
+       每组一张白卡，图标收进小圆角色块（.rec-ic + .tone-N），标签用纯深色。
+       原来是整格铺 tone 底 + 浮在页面渐变上，一片肥色块。 -->
   <block wx:for="{{typeGroups}}" wx:key="key">
-    <view class="tg {{item.g}}">
-      <view class="tg-head"><view class="tg-bar"></view>{{item.short}}</view>
-      <view class="quick-grid">
-        <view wx:for="{{item.items}}" wx:for-item="t" wx:key="code" class="quick {{item.tone}}"
-              data-type="{{t.code}}" bindtap="goAdd">
-          <pt-icon name="{{t.icon}}" size="{{44}}" fallback="note"></pt-icon>{{t.label}}
+    <view class="rec-group card {{item.g}}">
+      <view class="rec-ghead"><view class="rec-bar"></view>{{item.short}}</view>
+      <view class="rec-grid">
+        <view wx:for="{{item.items}}" wx:for-item="t" wx:key="code" class="rec-item"
+              data-type="{{t.code}}" bindtap="goAdd" hover-class="rec-item-hover" hover-stay-time="60">
+          <view class="rec-ic {{item.tone}}"><pt-icon name="{{t.icon}}" size="{{46}}" fallback="note"></pt-icon></view>
+          <text class="rec-label">{{t.label}}</text>
         </view>
       </view>
     </view>
   </block>
-  <view wx:if="{{!typeGroups.length}}" class="empty lg">还没有配置可记事项</view>
+  <view wx:if="{{!typeGroups.length && pet.id}}" class="empty lg">还没有配置可记事项</view>
 </view>
 </scroll-view>