sundynix/sundynix-pets
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(be): 记录类型挪进数据库，后台可配 + 15 种新类型

Browse Source 
## 为什么
9 种记录类型全是低频医疗和记账（疫苗一年一次、驱虫一季一次、体检更少），
用户今天打开 App 大概率没什么可记，时间轴是空的。竞品 35 种里有 26 种是
高频日常（洗澡/剪指甲/换猫砂/喝水/洗食盆），那才是每天打开的理由。

## 一个比预想好得多的发现
本来担心加类型会踩到分析逻辑。把那 9 个常量的引用全捞了一遍，结论是不会：

  weight       record.go:83 回写宠物体重；home/insight/report 的体重趋势与基准
  food + poop  insight.go:130 食便相关性
  symptom      insight.go:160 症状聚类；report 高风险计数
  cost         report.go:99 消费统计
  vaccine      report.go:137 疫苗完成度
  deworm/medicine/photo  没有任何特殊分支

这些分支全都是「按某个具体常量过滤」，没有一处是 switch 全枚举、也没有
default 兜底。CreateRecord 更是完全没有 type 白名单校验。所以新增类型
不可能碰到任何现存逻辑——一行分析代码都不用改。

于是分工是：
  record_types 表  负责「展示什么、能记什么」
  那 9 个常量      负责「哪几种参与分析」
两者各管一段，常量一个都没删。

## 表设计
code / label / icon / group_key / sort / enabled / form / locked。

group_key 而不是 group：group 是 MySQL 保留字，GORM 会加反引号所以能跑，
但手写 SQL 排查时很容易踩。

form 区分 full（弹层里有专用 wx:elif 分支）和 simple（时间+备注+照片）。
15 种新类型全是 simple——下一步在弹层加一个通用分支吃掉它们，不然 28 个
分支再加 15 个会把 bottom-sheet 写到 1800 行。

locked 给那 9 种：有代码分支依赖、且被 care_template_items.sheet_type 引用。

## 两条硬拦在 service 层的规则
1. locked 的删不掉
2. 已经有记录的删不掉（删了历史记录会变孤儿）
想让它从记录页消失应该用 enabled=false，历史记录仍能正常显示。

都在 service 层拦，不是靠前端隐藏按钮。改 code 同样受 2 的约束——
code 是落库值，改了历史记录会对不上任何类型。

## bootstrap 的取舍
文章和养护模板当初按你的要求从代码里挪走了，这次 24 种类型仍然放在 seed 里，
因为它不是内容而是结构：表空着记录页一个可记事项都没有，App 直接不能用。
和管理员账号一样，只在表**完全为空**时铺一次，之后一切以数据库为准。
表非空就完全不碰，否则后台删掉的类型会每次重启自己长回来。

ListRecordTypes 在表为空时返回空数组 + 打 warn，不硬编码兜底一份——
那等于把「可配置」又变回代码常量，下次改配置的人会发现改了没用。

## 图标
新增 15 个（iconfont.wxss 40 → 55），全部取自本地那份 tabler-icons-3.46.0
真源，不是凭记忆画路径。已解码抽检确认路径非空。

## 验证（生产库实跑）
  建表 + 24 条 bootstrap 一次到位，分组 daily6/health7/care6/clean5
  locked 9 个、simple 表单 15 个
  规则 1  删 weight → 「有统计和分析逻辑依赖它，不能删」
  规则 2  新增 nose 成功 → 重复 code 报错 → 删除成功
  规则 3  造 1 条 tmptest 记录 → 删类型被拦；删掉记录后再删 → 成功；残留 0
  规则 4  停用「美容」→ 小程序端洗护组只剩 5 项；恢复后回到 6 项

规则 3 一开始没真验到：库里唯一的记录类型是 weight，locked 先拦住了，
「已有记录」那个分支根本没走到。补了个造真记录的测试才算验过。

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Blizzard
2026-07-30 09:24:24 +08:00
parent 09322ecbec
commit 60ee9d4bbc
10 changed files with 733 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pets-be/internal/database/seed.go
+70 -4
View File
@@ -8,11 +8,77 @@ import (
"github.com/sundynix/pets-be/internal/model"
)
// Seed 初始化种子数据：只建管理员账号。
// 文章这类内容数据不放代码里——正文几百字塞进 Go 源文件，既看不清也
// 没法在后台改完再同步回来。上线时直接同步数据库。
// Seed 初始化种子数据：管理员账号 + 记录类型。
//
// 文章、养护模板这类**内容**数据不放代码里——正文几百字塞进 Go 源文件，既看不清
// 也没法在后台改完再同步回来。上线时直接同步数据库。
//
// 记录类型是另一码事，它是**结构**：表空着的话记录页一个可记事项都没有，
// App 直接不能用。所以和管理员账号一样，只在表完全为空时铺一次底，
// 之后一切以数据库为准，代码里这份不再参与。
func Seed(db *gorm.DB, cfg *config.Config) error {
return seedAdmin(db, cfg)
if err := seedAdmin(db, cfg); err != nil {
return err
}
return seedRecordTypes(db)
}
// seedRecordTypes 只在表为空时跑。已经有数据（哪怕只有一条）就完全不碰，
// 否则后台删掉的类型会在每次重启后自己长回来
func seedRecordTypes(db *gorm.DB) error {
var count int64
if err := db.Model(&model.RecordType{}).Count(&count).Error; err != nil {
return err
}
if count > 0 {
return nil
}
// locked=true 的这 9 种在 record.go / insight.go / report.go / home.go 里有真实
// 代码分支（体重回写档案、食便相关性、消费统计、疫苗完成度…），并且被
// care_template_items.sheet_type 引用，后台不许删，只能停用。
// form=full 表示 bottom-sheet 里有它专用的 wx:elif 分支。
full := func(code, label, icon, group string, sort int) model.RecordType {
return model.RecordType{Code: code, Label: label, Icon: icon, GroupKey: group,
Sort: sort, Enabled: true, Form: model.RecordFormFull, Locked: true}
}
simple := func(code, label, icon, group string, sort int) model.RecordType {
return model.RecordType{Code: code, Label: label, Icon: icon, GroupKey: group,
Sort: sort, Enabled: true, Form: model.RecordFormSimple, Locked: false}
}
d, h, c, cl := model.RecordGroupDaily, model.RecordGroupHealth, model.RecordGroupCare, model.RecordGroupClean
types := []model.RecordType{
// 日常
full("weight", "体重", "weight", d, 10),
full("poop", "排便", "poop", d, 20),
full("food", "饮食", "food", d, 30),
simple("water", "喝水", "water", d, 40),
full("cost", "记账", "cost", d, 50),
full("photo", "照片", "photo", d, 60),
// 健康
full("symptom", "异常", "symptom", h, 10),
full("vaccine", "疫苗", "vaccine", h, 20),
full("deworm", "驱虫", "deworm", h, 30),
simple("checkup", "体检", "checkup", h, 40),
simple("vet", "看病", "vet", h, 50),
full("medicine", "给药", "medicine", h, 60),
simple("supplement", "保健品", "supplement", h, 70),
// 洗护
simple("bath", "洗澡", "bath", c, 10),
simple("nail", "剪指甲", "nail", c, 20),
simple("ear", "洗耳朵", "ear", c, 30),
simple("tooth", "刷牙", "tooth", c, 40),
simple("brush", "梳毛", "brush", c, 50),
simple("groom", "美容", "groom", c, 60),
// 清洁
simple("litter", "换猫砂", "litter", cl, 10),
simple("litterbox", "洗猫砂盆", "litterbox", cl, 20),
simple("bowl", "洗食盆", "bowl", cl, 30),
simple("waterbowl", "洗水盆", "waterbowl", cl, 40),
simple("clean", "消毒", "clean", cl, 50),
}
return db.Create(&types).Error
}
func seedAdmin(db *gorm.DB, cfg *config.Config) error {
pets-be/internal/handler/admin.go
+47
View File
@@ -280,6 +280,53 @@ func (h *Handler) AdminListPro(c *gin.Context) {
// AdminCareTemplateMeta GET /api/admin/care-templates/meta
// 给后台下拉用：物种、阶段、可选关联记录/弹层类型、提醒类型
// ── 记录类型 ──
type recordTypeReq struct {
ID string `json:"id"`
Code string `json:"code"`
Label string `json:"label"`
Icon string `json:"icon"`
Group string `json:"group"`
Sort int `json:"sort"`
Enabled bool `json:"enabled"`
Form string `json:"form"`
}
// AdminListRecordTypes GET /api/admin/record-types 连停用的一起返回
func (h *Handler) AdminListRecordTypes(c *gin.Context) {
response.OK(c, h.svc.AdminListRecordTypes())
}
// AdminSaveRecordType POST /api/admin/record-types 新增或更新
func (h *Handler) AdminSaveRecordType(c *gin.Context) {
var req recordTypeReq
if err := c.ShouldBindJSON(&req); err != nil {
response.FailParams(c, err.Error())
return
}
t := &model.RecordType{
Code: req.Code, Label: req.Label, Icon: req.Icon,
GroupKey: req.Group, Sort: req.Sort, Enabled: req.Enabled, Form: req.Form,
}
t.ID = req.ID
if err := h.svc.SaveRecordType(t); err != nil {
respondErr(c, err)
return
}
response.OK(c, t)
}
// AdminDeleteRecordType DELETE /api/admin/record-types/:id
// locked 的和已有记录的删不了，service 层硬拦
func (h *Handler) AdminDeleteRecordType(c *gin.Context) {
if err := h.svc.DeleteRecordType(idParam(c, "id")); err != nil {
respondErr(c, err)
return
}
response.OK(c, nil)
}
func (h *Handler) AdminCareTemplateMeta(c *gin.Context) {
response.OK(c, gin.H{
"species": []gin.H{
pets-be/internal/handler/record.go
+6
View File
@@ -90,3 +90,9 @@ func (h *Handler) PetInsights(c *gin.Context) {
}
response.OK(c, list)
}
// RecordTypes GET /api/record-types 记录页可记事项，按分组归好。
// 类型从表里来而不是前端写死，后台加一种不用发版
func (h *Handler) RecordTypes(c *gin.Context) {
response.OK(c, h.svc.ListRecordTypes())
}
pets-be/internal/model/base.go
+1
View File
@@ -29,6 +29,7 @@ func AllModels() []any {
&User{},
&Pet{},
&HealthRecord{},
&RecordType{},
&DailyTask{},
&Plan{},
&PlanTask{},
pets-be/internal/model/record_type.go
+47
View File
@@ -0,0 +1,47 @@
package model
// 记录类型。原来这 9 种是写在 health_record.go 里的常量，加一种就得发版；
// 挪到表里之后后台可以直接增删改。
//
// 注意这里**没有**替换掉那 9 个常量：weight / poop / food / symptom / cost /
// vaccine 在 record.go、insight.go、report.go、home.go 里有真实的代码分支
// （体重回写宠物档案、食便相关性分析、消费统计、疫苗完成度……），那些分支
// 按具体常量过滤，不是 switch 全枚举。所以：
// - 表负责「展示什么、能记什么」
// - 常量负责「哪几种参与分析」
// 两者各管一段，新增类型不会碰到任何分析逻辑。
// 记录类型分组
const (
RecordGroupDaily = "daily" // 日常
RecordGroupHealth = "health" // 健康
RecordGroupCare = "care" // 洗护
RecordGroupClean = "clean" // 清洁
)
// 弹层形态
const (
RecordFormFull = "full" // 有专用表单（原来那 9 种，各自一个 wx:elif 分支）
RecordFormSimple = "simple" // 通用简易表单：发生时间 + 备注 + 可选照片
)
// RecordType 一种可记录的事项
type RecordType struct {
Base
// Code 就是小程序 bottom-sheet 的 type，也是 health_records.type 落库的值。
// 建过记录之后改 Code 会让历史数据对不上，后台不允许改（只能删了重建）。
Code string `gorm:"size:32;uniqueIndex" json:"code"`
Label string `gorm:"size:32" json:"label"`
Icon string `gorm:"size:32" json:"icon"` // pt-icon 名，见 styles/iconfont.wxss
// GroupKey 存成 group_key 而不是 group：group 是 MySQL 保留字，
// GORM 虽然会加反引号，但手写 SQL 排查时很容易踩
GroupKey string `gorm:"column:group_key;size:16;index" json:"group"`
Sort int `json:"sort"`
Enabled bool `gorm:"default:true" json:"enabled"`
Form string `gorm:"size:16" json:"form"`
// Locked 有代码分支或模板引用依赖它，后台不许删。
// 硬拦在 service 层，不是靠前端隐藏按钮。
Locked bool `json:"locked"`
}
pets-be/internal/router/router.go
+5
View File
@@ -57,6 +57,7 @@ func registerUserAPI(api *gin.RouterGroup, h *handler.Handler, jm *appjwt.Manage
g.PUT("/pets/:id", h.UpdatePet)
g.DELETE("/pets/:id", h.DeletePet)
g.GET("/record-types", h.RecordTypes)
g.GET("/pets/:id/records", h.ListRecords)
g.POST("/pets/:id/records", h.CreateRecord)
g.GET("/pets/:id/records/weight-trend", h.WeightTrend)
@@ -147,6 +148,10 @@ func registerAdminAPI(api *gin.RouterGroup, h *handler.Handler, jm *appjwt.Manag
g.POST("/articles", h.AdminSaveArticle)
g.DELETE("/articles/:id", h.AdminDeleteArticle)
g.GET("/record-types", h.AdminListRecordTypes)
g.POST("/record-types", h.AdminSaveRecordType)
g.DELETE("/record-types/:id", h.AdminDeleteRecordType)
g.GET("/care-templates/meta", h.AdminCareTemplateMeta)
g.GET("/care-templates", h.AdminGetCareTemplate)
g.PUT("/care-templates", h.AdminSaveCareTemplate)
pets-be/internal/service/record_type.go
+127
View File
@@ -0,0 +1,127 @@
package service
import (
"errors"
"log"
"strconv"
"gorm.io/gorm"
"github.com/sundynix/pets-be/internal/model"
)
// 分组展示顺序。前端按这个顺序渲染，不靠 group_key 的字典序
var recordGroupOrder = []struct {
Key string
Label string
}{
{model.RecordGroupDaily, "日常记录"},
{model.RecordGroupHealth, "健康记录"},
{model.RecordGroupCare, "洗护记录"},
{model.RecordGroupClean, "清洁记录"},
}
// RecordTypeGroup 一组类型，给小程序记录页直接渲染
type RecordTypeGroup struct {
Key string `json:"key"`
Label string `json:"label"`
Items []model.RecordType `json:"items"`
}
// ListRecordTypes 小程序用：只返回启用的，按分组归好
func (s *Service) ListRecordTypes() []RecordTypeGroup {
var all []model.RecordType
s.db.Where("enabled = ?", true).Order("sort asc, id asc").Find(&all)
if len(all) == 0 {
// 表被清空了。这里不硬编码兜底一份——那等于把「可配置」又变回代码里的常量，
// 下次改配置的人会发现改了没用。宁可返回空让记录页明显是空的，也别静默用旧值。
log.Println("[warn] record_types 表为空，记录页会没有任何可记事项")
return []RecordTypeGroup{}
}
byGroup := map[string][]model.RecordType{}
for _, t := range all {
byGroup[t.GroupKey] = append(byGroup[t.GroupKey], t)
}
out := make([]RecordTypeGroup, 0, len(recordGroupOrder))
for _, g := range recordGroupOrder {
items := byGroup[g.Key]
if len(items) == 0 {
continue
}
out = append(out, RecordTypeGroup{Key: g.Key, Label: g.Label, Items: items})
}
return out
}
// AdminListRecordTypes 后台用：连禁用的一起返回，按分组顺序再按 sort
func (s *Service) AdminListRecordTypes() []model.RecordType {
var all []model.RecordType
s.db.Order("group_key asc, sort asc, id asc").Find(&all)
if all == nil {
return []model.RecordType{}
}
return all
}
// SaveRecordType 新增或更新。Code 一旦建过记录就不允许改——
// 改了历史记录的 type 会对不上任何类型，列表里直接变成一行没图标没名字的东西
func (s *Service) SaveRecordType(in *model.RecordType) error {
if in.Code == "" || in.Label == "" {
return ErrInvalidParam
}
if in.Form != model.RecordFormFull && in.Form != model.RecordFormSimple {
in.Form = model.RecordFormSimple
}
if in.GroupKey == "" {
in.GroupKey = model.RecordGroupDaily
}
if in.ID == "" {
// 新增：Code 不能和已有的撞
var n int64
s.db.Model(&model.RecordType{}).Where("code = ?", in.Code).Count(&n)
if n > 0 {
return errors.New("这个 code 已经存在了")
}
in.Locked = false // 新加的一律可删；locked 只由 bootstrap 给那 9 种
return s.db.Create(in).Error
}
var old model.RecordType
if err := s.db.First(&old, "id = ?", in.ID).Error; err != nil {
if errors.Is(err, gorm.ErrRecordNotFound) {
return ErrNotFound
}
return err
}
if old.Code != in.Code {
var used int64
s.db.Model(&model.HealthRecord{}).Where("type = ?", old.Code).Count(&used)
if used > 0 {
return errors.New("已经有 " + strconv.FormatInt(used, 10) + " 条记录用了这个 code，不能改，只能新建一个")
}
}
// locked 和 form 不由后台改：前者是代码依赖，后者对应弹层里真实存在的分支
return s.db.Model(&model.RecordType{}).Where("id = ?", in.ID).Updates(map[string]any{
"code": in.Code, "label": in.Label, "icon": in.Icon,
"group_key": in.GroupKey, "sort": in.Sort, "enabled": in.Enabled,
}).Error
}
// DeleteRecordType locked 的删不了；已经有记录的也删不了（会让历史数据变孤儿）。
// 想让它从记录页消失应该用 enabled=false，历史记录还能正常显示
func (s *Service) DeleteRecordType(id string) error {
var t model.RecordType
if err := s.db.First(&t, "id = ?", id).Error; err != nil {
return ErrNotFound
}
if t.Locked {
return errors.New("「" + t.Label + "」有统计和分析逻辑依赖它，不能删。想隐藏请改成停用")
}
var used int64
s.db.Model(&model.HealthRecord{}).Where("type = ?", t.Code).Count(&used)
if used > 0 {
return errors.New("已经有 " + strconv.FormatInt(used, 10) + " 条「" + t.Label + "」记录，删了这些记录会变成孤儿。想隐藏请改成停用")
}
return s.db.Delete(&model.RecordType{}, "id = ?", id).Error
}
pets-fe/adm.txt
+1
View File
@@ -0,0 +1 @@
eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjM0MTAyNzAxOTEwMzkzMjQxNiIsImtpbmQiOiJ1c2VyIiwibmFtZSI6IuiCieWeq-eIseWlveiAhTA0NTE3IiwiaXNzIjoicGV0cy1iZSIsImV4cCI6MTc4NTM4MTU3NywiaWF0IjoxNzg1Mzc0Mzc3fQ.iDKxUsk3ICp4JlrqiDvBbj_1NnHV687DD2zNUuRb0z8
pets-fe/preview-v3.html
+414
View File
@@ -0,0 +1,414 @@
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>肉垫计划 · 视觉稿 v3</title>
<style>:root{ /* ── 底色与文字 ── */
--bg:#F8F6F2;
--bg2:#FBF8F3;
--card:#FFFFFF;
--surface-2:#FBFAF8; /* 卡片内的次级底色（原本硬编码出现 10+ 次） */
--text:#2D2925;
--text-2:#5F554D; /* 正文次级灰（原本有 7 种近似值散落各处） */
--muted:#8D8277;
--muted2:#B5A99D;
--line:#EEE6DC;
/* ── 主色 ── */
--primary:#F5A947;
--primary2:#FFBF68;
--primary-dark:#DD8420;
--primary-soft:#FFF4E4; /* 唯一的浅橙底（收编了 9 种近似值） */
--primary-line:#FFD6A1; /* 浅橙块的描边 */
--primary-ink:#A96500; /* 浅橙底上的文字 */
/* ── 语义色：soft 底 / base 主体 / ink 文字，三件套配齐 ── */
--green:#73BE9D; --green-soft:#EAF7F1; --green-ink:#2E7D5B;
--red:#EE7D73; --red-soft:#FFF0EE; --red-ink:#C95348;
--blue:#78A6E8; --blue-soft:#EEF5FF; --blue-ink:#3C6EBA;
--purple:#A993E8; --purple-soft:#F4F0FF; --purple-ink:#765AC5;
--yellow-soft:#FFF6E4;
/* ── 深色主 CTA。全页最多一个，用来指明「这一步该点哪」 ── */
--cta:#2D2925;
/* ── 圆角 5 档 ── */
--r-xs:6px;
--r-sm:10px;
--r-md:14px;
--r-lg:20px; /* 卡片 */
--r-full:499.5px;
--radius:var(--r-lg); /* 兼容旧名，页面里还有引用 */
/* ── 字号 6 档 ── */
--fs-cap:11px;
--fs-sm:12px;
--fs-md:14px;
--fs-lg:16px;
--fs-xl:20px;
--fs-2xl:24px;
/* ── 字重只留两档。强调靠颜色和字号，不靠把所有东西都加粗 ── */
--fw:400;
--fw-b:600;
/* ── 间距 6 档 ── */
--sp-1:4px; --sp-2:6px; --sp-3:8px;
--sp-4:12px; --sp-5:16px; --sp-6:20px;
/* ── 控件高度 3 档 ── */
--h-sm:34px;
--h-md:40px;
--h-lg:48px;
/* ── 阴影 3 档（原来 7 处一次性阴影，且都偏重） ── */
--sd-1:0 6px 16px rgba(70,48,25,.06);
--sd-2:0 10px 24px rgba(70,48,25,.10);
--sd-3:0 -10px 30px rgba(70,48,25,.14);
--shadow:var(--sd-1); /* 兼容旧名 */
--shadow2:var(--sd-2);
/* 页面留白。FAB 固定在 bottom:95px、高 58px，上沿距底 153px，
内容必须让开这段距离，否则最后一张卡会被它压住。 */
--pad-x:20px;
--pad-b-fab:calc(165px + env(safe-area-inset-bottom));
--pad-b-plain:calc(30px + env(safe-area-inset-bottom));
--band-a:#FFC768; --band-b:#F5A947; --band-ink:#7A4A08;
}
.pt-i-weight{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik03IDIwbDEwIDAiIC8+PHBhdGggZD0iTTYgNmw2IC0xbDYgMSIgLz48cGF0aCBkPSJNMTIgM2wwIDE3IiAvPjxwYXRoIGQ9Ik05IDEybC0zIC02bC0zIDZhMyAzIDAgMCAwIDYgMCIgLz48cGF0aCBkPSJNMjEgMTJsLTMgLTZsLTMgNmEzIDMgMCAwIDAgNiAwIiAvPjwvc3ZnPg==")}
.pt-i-poop{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xMCAxMmguMDEiIC8+PHBhdGggZD0iTTE0IDEyaC4wMSIgLz48cGF0aCBkPSJNMTAgMTZhMy41IDMuNSAwIDAgMCA0IDAiIC8+PHBhdGggZD0iTTExIDRjMiAwIDMuNSAxLjUgMy41IDRsLjE2NCAwYTIuNSAyLjUgMCAwIDEgMi4xOTYgMy4zMmEzIDMgMCAwIDEgMS42MTUgMy4wNjNhMyAzIDAgMCAxIC0xLjI5OSA1LjYwN2wtLjE3NiAwaC0xMGEzIDMgMCAwIDEgLTEuNDc0IC01LjYxM2EzIDMgMCAwIDEgMS42MTUgLTMuMDYyYTIuNSAyLjUgMCAwIDEgMi4xOTUgLTMuMzJsLjE2NCAwYzEuNSAwIDIuNSAtMiAxLjUgLTRsMCAuMDA1IiAvPjwvc3ZnPg==")}
.pt-i-food{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDExaDE2YTEgMSAwIDAgMSAxIDF2LjVjMCAxLjUgLTIuNTE3IDUuNTczIC00IDYuNXYxYTEgMSAwIDAgMSAtMSAxaC04YTEgMSAwIDAgMSAtMSAtMXYtMWMtMS42ODcgLTEuMDU0IC00IC01IC00IC02LjV2LS41YTEgMSAwIDAgMSAxIC0xIiAvPjxwYXRoIGQ9Ik04IDdjMS42NTcgMCAzIC0uODk1IDMgLTJzLTEuMzQzIC0yIC0zIC0ycy0zIC44OTUgLTMgMnMxLjM0MyAyIDMgMiIgLz48cGF0aCBkPSJNMTEgNWg5IiAvPjwvc3ZnPg==")}
.pt-i-symptom{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xOSA1YTIuODI4IDIuODI4IDAgMCAxIDAgNGwtOCA4aC00di00bDggLThhMi44MjggMi44MjggMCAwIDEgNCAwIiAvPjxwYXRoIGQ9Ik0xNiA3bC0xLjUgLTEuNSIgLz48cGF0aCBkPSJNMTMgMTBsLTEuNSAtMS41IiAvPjxwYXRoIGQ9Ik0xMCAxM2wtMS41IC0xLjUiIC8+PHBhdGggZD0iTTcgMTdsLTMgMyIgLz48L3N2Zz4=")}
.pt-i-medicine{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00LjUgMTIuNWw4IC04YTQuOTQgNC45NCAwIDAgMSA3IDdsLTggOGE0Ljk0IDQuOTQgMCAwIDEgLTcgLTciIC8+PHBhdGggZD0iTTguNSA4LjVsNyA3IiAvPjwvc3ZnPg==")}
.pt-i-cost{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0zIDEyYTkgOSAwIDEgMCAxOCAwYTkgOSAwIDEgMCAtMTggMCIgLz48cGF0aCBkPSJNOSAxM2g2IiAvPjxwYXRoIGQ9Ik05IDhsMyA0LjUiIC8+PHBhdGggZD0iTTE1IDhsLTMgNC41djQuNSIgLz48L3N2Zz4=")}
.pt-i-vaccine{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xNyAzbDQgNCIgLz48cGF0aCBkPSJNMTkgNWwtNC41IDQuNSIgLz48cGF0aCBkPSJNMTEuNSA2LjVsNiA2IiAvPjxwYXRoIGQ9Ik0xNi41IDExLjVsLTYuNSA2LjVoLTR2LTRsNi41IC02LjUiIC8+PHBhdGggZD0iTTcuNSAxMi41bDEuNSAxLjUiIC8+PHBhdGggZD0iTTEwLjUgOS41bDEuNSAxLjUiIC8+PHBhdGggZD0iTTMgMjFsMyAtMyIgLz48L3N2Zz4=")}
.pt-i-deworm{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xMS40NiAyMC44NDZhMTIgMTIgMCAwIDEgLTcuOTYgLTE0Ljg0NmExMiAxMiAwIDAgMCA4LjUgLTNhMTIgMTIgMCAwIDAgOC41IDNhMTIgMTIgMCAwIDEgLS4wOSA3LjA2IiAvPjxwYXRoIGQ9Ik0xNSAxOWwyIDJsNCAtNCIgLz48L3N2Zz4=")}
.pt-i-photo{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik01IDdoMWEyIDIgMCAwIDAgMiAtMmExIDEgMCAwIDEgMSAtMWg2YTEgMSAwIDAgMSAxIDFhMiAyIDAgMCAwIDIgMmgxYTIgMiAwIDAgMSAyIDJ2OWEyIDIgMCAwIDEgLTIgMmgtMTRhMiAyIDAgMCAxIC0yIC0ydi05YTIgMiAwIDAgMSAyIC0yIiAvPjxwYXRoIGQ9Ik05IDEzYTMgMyAwIDEgMCA2IDBhMyAzIDAgMCAwIC02IDAiIC8+PC9zdmc+")}
.pt-i-home{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik01IDEybC0yIDBsOSAtOWw5IDlsLTIgMCIgLz48cGF0aCBkPSJNNSAxMnY3YTIgMiAwIDAgMCAyIDJoMTBhMiAyIDAgMCAwIDIgLTJ2LTciIC8+PHBhdGggZD0iTTkgMjF2LTZhMiAyIDAgMCAxIDIgLTJoMmEyIDIgMCAwIDEgMiAydjYiIC8+PC9zdmc+")}
.pt-i-plan{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDdhMiAyIDAgMCAxIDIgLTJoMTJhMiAyIDAgMCAxIDIgMnYxMmEyIDIgMCAwIDEgLTIgMmgtMTJhMiAyIDAgMCAxIC0yIC0ydi0xMiIgLz48cGF0aCBkPSJNMTYgM3Y0IiAvPjxwYXRoIGQ9Ik04IDN2NCIgLz48cGF0aCBkPSJNNCAxMWgxNiIgLz48cGF0aCBkPSJNOCAxNHY0IiAvPjxwYXRoIGQ9Ik0xMiAxNHY0IiAvPjxwYXRoIGQ9Ik0xNiAxNHY0IiAvPjwvc3ZnPg==")}
.pt-i-record{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDIwaDRsMTAuNSAtMTAuNWEyLjgyOCAyLjgyOCAwIDEgMCAtNCAtNGwtMTAuNSAxMC41djQiIC8+PHBhdGggZD0iTTEzLjUgNi41bDQgNCIgLz48cGF0aCBkPSJNMTYgMTloNiIgLz48cGF0aCBkPSJNMTkgMTZ2NiIgLz48L3N2Zz4=")}
.pt-i-report{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0zIDN2MThoMTgiIC8+PHBhdGggZD0iTTIwIDE4djMiIC8+PHBhdGggZD0iTTE2IDE2djUiIC8+PHBhdGggZD0iTTEyIDEzdjgiIC8+PHBhdGggZD0iTTggMTZ2NSIgLz48cGF0aCBkPSJNMyAxMWM2IDAgNSAtNSA5IC01czMgNSA5IDUiIC8+PC9zdmc+")}
.pt-i-community{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xNC43IDEzLjVjLTEuMSAtMiAtMS40NDEgLTIuNSAtMi43IC0yLjVjLTEuMjU5IDAgLTEuNzM2IC43NTUgLTIuODM2IDIuNzQ3Yy0uOTQyIDEuNzAzIC0yLjg0NiAxLjg0NSAtMy4zMjEgMy4yOTFjLS4wOTcgLjI2NSAtLjE0NSAuNjc3IC0uMTQzIC45NjJjMCAxLjE3NiAuNzg3IDIgMS44IDJjMS4yNTkgMCAzIC0xIDQuNSAtMXMzLjI0MSAxIDQuNSAxYzEuMDEzIDAgMS44IC0uODIzIDEuOCAtMmMwIC0uMjg1IC0uMDQ5IC0uNjk3IC0uMTQ2IC0uOTYyYy0uNDc1IC0xLjQ1MSAtMi41MTIgLTEuODM1IC0zLjQ1NCAtMy41MzgiIC8+PHBhdGggZD0iTTIwLjE4OCA4LjA4MmExLjAzOSAxLjAzOSAwIDAgMCAtLjQwNiAtLjA4MmgtLjAxNWMtLjczNSAuMDEyIC0xLjU2IC43NSAtMS45OTMgMS44NjZjLS41MTkgMS4zMzUgLS4yOCAyLjcgLjUzOCAzLjA1MmMuMTI5IC4wNTUgLjI2NyAuMDgyIC40MDYgLjA4MmMuNzM5IDAgMS41NzUgLS43NDIgMi4wMTEgLTEuODY2Yy41MTYgLTEuMzM1IC4yNzMgLTIuNyAtLjU0IC0zLjA1MmwtLjAwMSAwIiAvPjxwYXRoIGQ9Ik05LjQ3NCA5Yy4wNTUgMCAuMTA5IDAgLjE2MyAtLjAxMWMuOTQ0IC0uMTI4IDEuNTMzIC0xLjM0NiAxLjMyIC0yLjcyMmMtLjIwMyAtMS4yOTcgLTEuMDQ3IC0yLjI2NyAtMS45MzIgLTIuMjY3Yy0uMDU1IDAgLS4xMDkgMCAtLjE2MyAuMDExYy0uOTQ0IC4xMjggLTEuNTMzIDEuMzQ2IC0xLjMyIDIuNzIyYy4yMDQgMS4yOTMgMS4wNDggMi4yNjcgMS45MzMgMi4yNjciIC8+PHBhdGggZD0iTTE2LjQ1NiA2LjczM2MuMjE0IC0xLjM3NiAtLjM3NSAtMi41OTQgLTEuMzIgLTIuNzIyYTEuMTY0IDEuMTY0IDAgMCAwIC0uMTYyIC0uMDExYy0uODg1IDAgLTEuNzI4IC45NyAtMS45MyAyLjI2N2MtLjIxNCAxLjM3NiAuMzc1IDIuNTk0IDEuMzIgMi43MjJjLjA1NCAuMDA3IC4xMDggLjAxMSAuMTYyIC4wMTFjLjg4NSAwIDEuNzMgLS45NzQgMS45MyAtMi4yNjciIC8+PHBhdGggZD0iTTUuNjkgMTIuOTE4Yy44MTYgLS4zNTIgMS4wNTQgLTEuNzE5IC41MzYgLTMuMDUyYy0uNDM2IC0xLjEyNCAtMS4yNzEgLTEuODY2IC0yLjAwOSAtMS44NjZjLS4xNCAwIC0uMjc3IC4wMjcgLS40MDcgLjA4MmMtLjgxNiAuMzUyIC0xLjA1NCAxLjcxOSAtLjUzNiAzLjA1MmMuNDM2IDEuMTI0IDEuMjcxIDEuODY2IDIuMDA5IDEuODY2Yy4xNCAwIC4yNzcgLS4wMjcgLjQwNyAtLjA4MiIgLz48L3N2Zz4=")}
.pt-i-back{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xNSA2bC02IDZsNiA2IiAvPjwvc3ZnPg==")}
.pt-i-next{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik05IDZsNiA2bC02IDYiIC8+PC9zdmc+")}
.pt-i-plus{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xMiA1bDAgMTQiIC8+PHBhdGggZD0iTTUgMTJsMTQgMCIgLz48L3N2Zz4=")}
.pt-i-check{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik01IDEybDUgNWwxMCAtMTAiIC8+PC9zdmc+")}
.pt-i-close{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xOCA2bC0xMiAxMiIgLz48cGF0aCBkPSJNNiA2bDEyIDEyIiAvPjwvc3ZnPg==")}
.pt-i-trash{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDdsMTYgMCIgLz48cGF0aCBkPSJNMTAgMTFsMCA2IiAvPjxwYXRoIGQ9Ik0xNCAxMWwwIDYiIC8+PHBhdGggZD0iTTUgN2wxIDEyYTIgMiAwIDAgMCAyIDJoOGEyIDIgMCAwIDAgMiAtMmwxIC0xMiIgLz48cGF0aCBkPSJNOSA3di0zYTEgMSAwIDAgMSAxIC0xaDRhMSAxIDAgMCAxIDEgMXYzIiAvPjwvc3ZnPg==")}
.pt-i-edit{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDIwaDRsMTAuNSAtMTAuNWEyLjgyOCAyLjgyOCAwIDEgMCAtNCAtNGwtMTAuNSAxMC41djQiIC8+PHBhdGggZD0iTTEzLjUgNi41bDQgNCIgLz48L3N2Zz4=")}
.pt-i-share{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xMyA0djRjLTYuNTc1IDEuMDI4IC05LjAyIDYuNzg4IC0xMCAxMmMtLjAzNyAuMjA2IDUuMzg0IC01Ljk2MiAxMCAtNnY0bDggLTdsLTggLTciIC8+PC9zdmc+")}
.pt-i-comment{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0zIDIwbDEuMyAtMy45Yy0yLjMyNCAtMy40MzcgLTEuNDI2IC03Ljg3MiAyLjEgLTEwLjM3NGMzLjUyNiAtMi41MDEgOC41OSAtMi4yOTYgMTEuODQ1IC40OGMzLjI1NSAyLjc3NyAzLjY5NSA3LjI2NiAxLjAyOSAxMC41MDFjLTIuNjY2IDMuMjM1IC03LjYxNSA0LjIxNSAtMTEuNTc0IDIuMjkzbC00LjcgMSIgLz48L3N2Zz4=")}
.pt-i-like{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xOS41IDEyLjU3MmwtNy41IDcuNDI4bC03LjUgLTcuNDI4YTUgNSAwIDEgMSA3LjUgLTYuNTY2YTUgNSAwIDEgMSA3LjUgNi41NzIiIC8+PC9zdmc+")}
.pt-i-like-on{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iIzAwMCIgPjxwYXRoIGQ9Ik02Ljk3OSAzLjA3NGE2IDYgMCAwIDEgNC45ODggMS40MjVsLjAzNyAuMDMzbC4wMzQgLS4wM2E2IDYgMCAwIDEgNC43MzMgLTEuNDRsLjI0NiAuMDM2YTYgNiAwIDAgMSAzLjM2NCAxMC4wMDhsLS4xOCAuMTg1bC0uMDQ4IC4wNDFsLTcuNDUgNy4zNzlhMSAxIDAgMCAxIC0xLjMxMyAuMDgybC0uMDk0IC0uMDgybC03LjQ5MyAtNy40MjJhNiA2IDAgMCAxIDMuMTc2IC0xMC4yMTV6IiAvPjwvc3ZnPg==")}
.pt-i-more{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDEyYTEgMSAwIDEgMCAyIDBhMSAxIDAgMSAwIC0yIDAiIC8+PHBhdGggZD0iTTExIDEyYTEgMSAwIDEgMCAyIDBhMSAxIDAgMSAwIC0yIDAiIC8+PHBhdGggZD0iTTE4IDEyYTEgMSAwIDEgMCAyIDBhMSAxIDAgMSAwIC0yIDAiIC8+PC9zdmc+")}
.pt-i-bell{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xMCA1YTIgMiAwIDEgMSA0IDBhNyA3IDAgMCAxIDQgNnYzYTQgNCAwIDAgMCAyIDNoLTE2YTQgNCAwIDAgMCAyIC0zdi0zYTcgNyAwIDAgMSA0IC02IiAvPjxwYXRoIGQ9Ik05IDE3djFhMyAzIDAgMCAwIDYgMHYtMSIgLz48L3N2Zz4=")}
.pt-i-settings{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xMC4zMjUgNC4zMTdjLjQyNiAtMS43NTYgMi45MjQgLTEuNzU2IDMuMzUgMGExLjcyNCAxLjcyNCAwIDAgMCAyLjU3MyAxLjA2NmMxLjU0MyAtLjk0IDMuMzEgLjgyNiAyLjM3IDIuMzdhMS43MjQgMS43MjQgMCAwIDAgMS4wNjUgMi41NzJjMS43NTYgLjQyNiAxLjc1NiAyLjkyNCAwIDMuMzVhMS43MjQgMS43MjQgMCAwIDAgLTEuMDY2IDIuNTczYy45NCAxLjU0MyAtLjgyNiAzLjMxIC0yLjM3IDIuMzdhMS43MjQgMS43MjQgMCAwIDAgLTIuNTcyIDEuMDY1Yy0uNDI2IDEuNzU2IC0yLjkyNCAxLjc1NiAtMy4zNSAwYTEuNzI0IDEuNzI0IDAgMCAwIC0yLjU3MyAtMS4wNjZjLTEuNTQzIC45NCAtMy4zMSAtLjgyNiAtMi4zNyAtMi4zN2ExLjcyNCAxLjcyNCAwIDAgMCAtMS4wNjUgLTIuNTcyYy0xLjc1NiAtLjQyNiAtMS43NTYgLTIuOTI0IDAgLTMuMzVhMS43MjQgMS43MjQgMCAwIDAgMS4wNjYgLTIuNTczYy0uOTQgLTEuNTQzIC44MjYgLTMuMzEgMi4zNyAtMi4zN2MxIC42MDggMi4yOTYgLjA3IDIuNTcyIC0xLjA2NSIgLz48cGF0aCBkPSJNOSAxMmEzIDMgMCAxIDAgNiAwYTMgMyAwIDAgMCAtNiAwIiAvPjwvc3ZnPg==")}
.pt-i-ai{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xNiAxOGEyIDIgMCAwIDEgMiAyYTIgMiAwIDAgMSAyIC0yYTIgMiAwIDAgMSAtMiAtMmEyIDIgMCAwIDEgLTIgMm0wIC0xMmEyIDIgMCAwIDEgMiAyYTIgMiAwIDAgMSAyIC0yYTIgMiAwIDAgMSAtMiAtMmEyIDIgMCAwIDEgLTIgMm0tNyAxMmE2IDYgMCAwIDEgNiAtNmE2IDYgMCAwIDEgLTYgLTZhNiA2IDAgMCAxIC02IDZhNiA2IDAgMCAxIDYgNiIgLz48L3N2Zz4=")}
.pt-i-warn{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xMiA5djQiIC8+PHBhdGggZD0iTTEwLjM2MyAzLjU5MWwtOC4xMDYgMTMuNTM0YTEuOTE0IDEuOTE0IDAgMCAwIDEuNjM2IDIuODcxaDE2LjIxNGExLjkxNCAxLjkxNCAwIDAgMCAxLjYzNiAtMi44N2wtOC4xMDYgLTEzLjUzNmExLjkxNCAxLjkxNCAwIDAgMCAtMy4yNzQgMCIgLz48cGF0aCBkPSJNMTIgMTZoLjAxIiAvPjwvc3ZnPg==")}
.pt-i-doc{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xNCAzdjRhMSAxIDAgMCAwIDEgMWg0IiAvPjxwYXRoIGQ9Ik0xNyAyMWgtMTBhMiAyIDAgMCAxIC0yIC0ydi0xNGEyIDIgMCAwIDEgMiAtMmg3bDUgNXYxMWEyIDIgMCAwIDEgLTIgMiIgLz48cGF0aCBkPSJNOSA5bDEgMCIgLz48cGF0aCBkPSJNOSAxM2w2IDAiIC8+PHBhdGggZD0iTTkgMTdsNiAwIiAvPjwvc3ZnPg==")}
.pt-i-note{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik01IDVhMiAyIDAgMCAxIDIgLTJoMTBhMiAyIDAgMCAxIDIgMnYxNGEyIDIgMCAwIDEgLTIgMmgtMTBhMiAyIDAgMCAxIC0yIC0ybDAgLTE0IiAvPjxwYXRoIGQ9Ik05IDdsNiAwIiAvPjxwYXRoIGQ9Ik05IDExbDYgMCIgLz48cGF0aCBkPSJNOSAxNWw0IDAiIC8+PC9zdmc+")}
.pt-i-book{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0zIDE5YTkgOSAwIDAgMSA5IDBhOSA5IDAgMCAxIDkgMCIgLz48cGF0aCBkPSJNMyA2YTkgOSAwIDAgMSA5IDBhOSA5IDAgMCAxIDkgMCIgLz48cGF0aCBkPSJNMyA2bDAgMTMiIC8+PHBhdGggZD0iTTEyIDZsMCAxMyIgLz48cGF0aCBkPSJNMjEgNmwwIDEzIiAvPjwvc3ZnPg==")}
.pt-i-trend{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDE5bDE2IDAiIC8+PHBhdGggZD0iTTQgMTVsNCAtNmw0IDJsNCAtNWw0IDQiIC8+PC9zdmc+")}
.pt-i-cat{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0yMCAzdjEwYTggOCAwIDEgMSAtMTYgMHYtMTBsMy40MzIgMy40MzJhNy45NjMgNy45NjMgMCAwIDEgNC41NjggLTEuNDMyYzEuNzY5IDAgMy40MDMgLjU3NCA0LjcyOCAxLjU0NmwzLjI3MiAtMy41NDYiIC8+PHBhdGggZD0iTTIgMTZoNWwtNCA0IiAvPjxwYXRoIGQ9Ik0yMiAxNmgtNWw0IDQiIC8+PHBhdGggZD0iTTExIDE2YTEgMSAwIDEgMCAyIDBhMSAxIDAgMSAwIC0yIDAiIC8+PHBhdGggZD0iTTkgMTF2LjAxIiAvPjxwYXRoIGQ9Ik0xNSAxMXYuMDEiIC8+PC9zdmc+")}
.pt-i-dog{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xMSA1aDIiIC8+PHBhdGggZD0iTTE5IDEyYy0uNjY3IDUuMzMzIC0yLjMzMyA4IC01IDhoLTRjLTIuNjY3IDAgLTQuMzMzIC0yLjY2NyAtNSAtOCIgLz48cGF0aCBkPSJNMTEgMTZjMCAuNjY3IC4zMzMgMSAxIDFzMSAtLjMzMyAxIC0xaC0yIiAvPjxwYXRoIGQ9Ik0xMiAxOHYyIiAvPjxwYXRoIGQ9Ik0xMCAxMXYuMDEiIC8+PHBhdGggZD0iTTE0IDExdi4wMSIgLz48cGF0aCBkPSJNNSA0bDYgLjk3bC02LjIzOCA2LjY4OGExLjAyMSAxLjAyMSAwIDAgMSAtMS40MSAuMTExYS45NTMgLjk1MyAwIDAgMSAtLjMyNyAtLjk1NGwxLjk3NSAtNi44MTUiIC8+PHBhdGggZD0iTTE5IDRsLTYgLjk3bDYuMjM4IDYuNjg4Yy4zNTggLjQwOCAuOTg5IC40NTggMS40MSAuMTExYS45NTMgLjk1MyAwIDAgMCAuMzI3IC0uOTU0bC0xLjk3NSAtNi44MTUiIC8+PC9zdmc+")}
.pt-i-user{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik04IDdhNCA0IDAgMSAwIDggMGE0IDQgMCAwIDAgLTggMCIgLz48cGF0aCBkPSJNNiAyMXYtMmE0IDQgMCAwIDEgNCAtNGg0YTQgNCAwIDAgMSA0IDR2MiIgLz48L3N2Zz4=")}
.pt-i-clock{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0zIDEyYTkgOSAwIDEgMCAxOCAwYTkgOSAwIDAgMCAtMTggMCIgLz48cGF0aCBkPSJNMTIgN3Y1bDMgMyIgLz48L3N2Zz4=")}
.pt-i-up{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik02IDE1bDYgLTZsNiA2IiAvPjwvc3ZnPg==")}
.pt-i-down{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik02IDlsNiA2bDYgLTYiIC8+PC9zdmc+")}
.pt-i-water{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik03LjUwMiAxOS40MjNjMi42MDIgMi4xMDUgNi4zOTUgMi4xMDUgOC45OTYgMGMyLjYwMiAtMi4xMDUgMy4yNjIgLTUuNzA4IDEuNTY2IC04LjU0NmwtNC44OSAtNy4yNmMtLjQyIC0uNjI1IC0xLjI4NyAtLjgwMyAtMS45MzYgLS4zOTdhMS4zNzYgMS4zNzYgMCAwIDAgLS40MSAuMzk3bC00Ljg5MyA3LjI2Yy0xLjY5NSAyLjgzOCAtMS4wMzUgNi40NDEgMS41NjcgOC41NDYiIC8+PC9zdmc+")}
.pt-i-bath{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDEyaDE2YTEgMSAwIDAgMSAxIDF2M2E0IDQgMCAwIDEgLTQgNGgtMTBhNCA0IDAgMCAxIC00IC00di0zYTEgMSAwIDAgMSAxIC0xIiAvPiA8cGF0aCBkPSJNNiAxMnYtN2EyIDIgMCAwIDEgMiAtMmgzdjIuMjUiIC8+IDxwYXRoIGQ9Ik00IDIxbDEgLTEuNSIgLz4gPHBhdGggZD0iTTIwIDIxbC0xIC0xLjUiIC8+PC9zdmc+")}
.pt-i-nail{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0zIDdhMyAzIDAgMSAwIDYgMGEzIDMgMCAxIDAgLTYgMCIgLz4gPHBhdGggZD0iTTMgMTdhMyAzIDAgMSAwIDYgMGEzIDMgMCAxIDAgLTYgMCIgLz4gPHBhdGggZD0iTTguNiA4LjZsMTAuNCAxMC40IiAvPiA8cGF0aCBkPSJNOC42IDE1LjRsMTAuNCAtMTAuNCIgLz48L3N2Zz4=")}
.pt-i-ear{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik02IDEwYTcgNyAwIDEgMSAxMyAzLjZhMTAgMTAgMCAwIDEgLTIgMmE4IDggMCAwIDAgLTIgM2E0LjUgNC41IDAgMCAxIC02LjggMS40IiAvPiA8cGF0aCBkPSJNMTAgMTBhMyAzIDAgMSAxIDUgMi4yIiAvPjwvc3ZnPg==")}
.pt-i-tooth{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xMiA1LjVjLTEuMDc0IC0uNTg2IC0yLjU4MyAtMS41IC00IC0xLjVjLTIuMSAwIC00IDEuMjQ3IC00IDVjMCA0Ljg5OSAxLjA1NiA4LjQxIDIuNjcxIDEwLjUzN2MuNTczIC43NTYgMS45NyAuNTIxIDIuNTY3IC0uMjM2Yy4zOTggLS41MDUgLjgxOSAtMS40MzkgMS4yNjIgLTIuODAxYy4yOTIgLS43NzEgLjg5MiAtMS41MDQgMS41IC0xLjVjLjYwMiAwIDEuMjEgLjczNyAxLjUgMS41Yy40NDMgMS4zNjIgLjg2NCAyLjI5NSAxLjI2MiAyLjhjLjU5NyAuNzU5IDIgLjk5MyAyLjU2NyAuMjM3YzEuNjE1IC0yLjEyNyAyLjY3MSAtNS42MzcgMi42NzEgLTEwLjUzN2MwIC0zLjc0IC0xLjkwOCAtNSAtNCAtNWMtMS40MjMgMCAtMi45MiAuOTExIC00IDEuNSIgLz4gPHBhdGggZD0iTTEyIDUuNWwzIDEuNSIgLz48L3N2Zz4=")}
.pt-i-brush{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0zIDIxdi00YTQgNCAwIDEgMSA0IDRoLTQiIC8+IDxwYXRoIGQ9Ik0yMSAzYTE2IDE2IDAgMCAwIC0xMi44IDEwLjIiIC8+IDxwYXRoIGQ9Ik0yMSAzYTE2IDE2IDAgMCAxIC0xMC4yIDEyLjgiIC8+IDxwYXRoIGQ9Ik0xMC42IDlhOSA5IDAgMCAxIDQuNCA0LjQiIC8+PC9zdmc+")}
.pt-i-groom{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xNiAxOGEyIDIgMCAwIDEgMiAyYTIgMiAwIDAgMSAyIC0yYTIgMiAwIDAgMSAtMiAtMmEyIDIgMCAwIDEgLTIgMm0wIC0xMmEyIDIgMCAwIDEgMiAyYTIgMiAwIDAgMSAyIC0yYTIgMiAwIDAgMSAtMiAtMmEyIDIgMCAwIDEgLTIgMm0tNyAxMmE2IDYgMCAwIDEgNiAtNmE2IDYgMCAwIDEgLTYgLTZhNiA2IDAgMCAxIC02IDZhNiA2IDAgMCAxIDYgNiIgLz48L3N2Zz4=")}
.pt-i-litter{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDdhOCA0IDAgMSAwIDE2IDBhOCA0IDAgMSAwIC0xNiAwIiAvPiA8cGF0aCBkPSJNNCA3YzAgLjY2NCAuMDg4IDEuMzI0IC4yNjMgMS45NjVsMi43MzcgMTAuMDM1Yy41IDEuNSAyLjIzOSAyIDUgMnM0LjUgLS41IDUgLTJjLjMzMyAtMSAxLjI0NiAtNC4zNDUgMi43MzcgLTEwLjAzNWE3LjQ1IDcuNDUgMCAwIDAgLjI2MyAtMS45NjUiIC8+PC9zdmc+")}
.pt-i-litterbox{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik01IDE2bDEuNDY1IDEuNjM4YTIgMiAwIDEgMSAtMy4wMTUgLjA5OWwxLjU1IC0xLjczNyIgLz4gPHBhdGggZD0iTTEzLjczNyA5LjczN2MyLjI5OSAtMi4zIDMuMjMgLTUuMDk1IDIuMDgxIC02LjI0NWMtMS4xNSAtMS4xNSAtMy45NDUgLS4yMTcgLTYuMjQ0IDIuMDgyYy0yLjMgMi4yOTkgLTMuMjMxIDUuMDk1IC0yLjA4MiA2LjI0NGMxLjE1IDEuMTUgMy45NDYgLjIxOCA2LjI0NSAtMi4wODEiIC8+IDxwYXRoIGQ9Ik03LjQ5MiAxMS44MThjLjM2MiAuMzYyIC43NjggLjY3NiAxLjIwOCAuOTM0bDYuODk1IDQuMDQ3YzEuMDc4IC41NTcgMi4yNTUgLS4wNzUgMy42OTIgLTEuNTEyYzEuNDM3IC0xLjQzNyAyLjA3IC0yLjYxNCAxLjUxMiAtMy42OTJjLS4zNzIgLS43MTggLTEuNzIgLTMuMDE3IC00LjA0NyAtNi44OTVhNi4wMTUgNi4wMTUgMCAwIDAgLS45MzQgLTEuMjA4IiAvPjwvc3ZnPg==")}
.pt-i-bowl{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDhoMTZhMSAxIDAgMCAxIDEgMXYuNWMwIDEuNSAtMi41MTcgNS41NzMgLTQgNi41djFhMSAxIDAgMCAxIC0xIDFoLThhMSAxIDAgMCAxIC0xIC0xdi0xYy0xLjY4NyAtMS4wNTQgLTQgLTUgLTQgLTYuNXYtLjVhMSAxIDAgMCAxIDEgLTEiIC8+PC9zdmc+")}
.pt-i-waterbowl{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik04IDIxbDggMCIgLz4gPHBhdGggZD0iTTEyIDE1bDAgNiIgLz4gPHBhdGggZD0iTTE3IDNsMSA3YzAgMy4wMTIgLTIuNjg2IDUgLTYgNXMtNiAtMS45ODggLTYgLTVsMSAtN2gxMCIgLz4gPHBhdGggZD0iTTYgMTBhNSA1IDAgMCAxIDYgMGE1IDUgMCAwIDAgNiAwIiAvPjwvc3ZnPg==")}
.pt-i-clean{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDEyYTIgMiAwIDAgMSAyIC0yaDRhMiAyIDAgMCAxIDIgMnY3YTIgMiAwIDAgMSAtMiAyaC00YTIgMiAwIDAgMSAtMiAtMmwwIC03IiAvPiA8cGF0aCBkPSJNNiAxMHYtNGExIDEgMCAwIDEgMSAtMWgyYTEgMSAwIDAgMSAxIDF2NCIgLz4gPHBhdGggZD0iTTE1IDdoLjAxIiAvPiA8cGF0aCBkPSJNMTggOWguMDEiIC8+IDxwYXRoIGQ9Ik0xOCA1aC4wMSIgLz4gPHBhdGggZD0iTTIxIDNoLjAxIiAvPiA8cGF0aCBkPSJNMjEgN2guMDEiIC8+IDxwYXRoIGQ9Ik0yMSAxMWguMDEiIC8+IDxwYXRoIGQ9Ik0xMCA3aDEiIC8+PC9zdmc+")}
.pt-i-checkup{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik02IDRoLTFhMiAyIDAgMCAwIC0yIDJ2My41YTUuNSA1LjUgMCAwIDAgMTEgMHYtMy41YTIgMiAwIDAgMCAtMiAtMmgtMSIgLz4gPHBhdGggZD0iTTggMTVhNiA2IDAgMSAwIDEyIDB2LTMiIC8+IDxwYXRoIGQ9Ik0xMSAzdjIiIC8+IDxwYXRoIGQ9Ik02IDN2MiIgLz4gPHBhdGggZD0iTTE4IDEwYTIgMiAwIDEgMCA0IDBhMiAyIDAgMSAwIC00IDAiIC8+PC9zdmc+")}
.pt-i-vet{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik04IDh2LTJhMiAyIDAgMCAxIDIgLTJoNGEyIDIgMCAwIDEgMiAydjIiIC8+IDxwYXRoIGQ9Ik00IDEwYTIgMiAwIDAgMSAyIC0yaDEyYTIgMiAwIDAgMSAyIDJ2OGEyIDIgMCAwIDEgLTIgMmgtMTJhMiAyIDAgMCAxIC0yIC0ybDAgLTgiIC8+IDxwYXRoIGQ9Ik0xMCAxNGg0IiAvPiA8cGF0aCBkPSJNMTIgMTJ2NCIgLz48L3N2Zz4=")}
.pt-i-supplement{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00LjUgMTIuNWw4IC04YTQuOTQgNC45NCAwIDAgMSA3IDdsLTggOGE0Ljk0IDQuOTQgMCAwIDEgLTcgLTciIC8+IDxwYXRoIGQ9Ik04LjUgOC41bDcgNyIgLz48L3N2Zz4=")}
*{box-sizing:border-box;margin:0;padding:0}
body{background:#E9E4DC;font:400 15px/1.5 -apple-system,"PingFang SC",sans-serif;color:var(--text);padding:28px 16px 60px}
.pt-i{display:inline-block;width:1em;height:1em;background-color:currentColor;
-webkit-mask-image:var(--m);mask-image:var(--m);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
-webkit-mask-size:100% 100%;mask-size:100% 100%;vertical-align:-.15em}
h1{font-size:20px;margin:0 auto 6px;max-width:1180px}
.lede{max-width:1180px;margin:0 auto 26px;color:#6B6259;font-size:13px;line-height:1.7}
.lede code,.note code{background:#fff;padding:1px 5px;border-radius:4px;font-size:12px}
h2{font-size:15px;max-width:1180px;margin:34px auto 4px;padding-top:20px;border-top:1px solid #D6CFC5}
.note{max-width:1180px;margin:0 auto 16px;color:#6B6259;font-size:12.5px;line-height:1.7}
.row{display:flex;gap:20px;flex-wrap:wrap;max-width:1180px;margin:0 auto;align-items:flex-start}
.ph{width:340px;flex:none;border-radius:26px;overflow:hidden;box-shadow:0 14px 40px rgba(70,48,25,.16);
background:radial-gradient(circle at 10% 8%,rgba(245,169,71,.26),transparent 30%),
radial-gradient(circle at 88% 10%,rgba(115,190,157,.20),transparent 26%),
linear-gradient(135deg,#FBF5EA,#EEF6F1 55%,#F8F1E7);position:relative}
.ph-cap{font-size:12px;color:#6B6259;text-align:center;margin-top:9px;line-height:1.5}
.ph-cap b{color:var(--text)}
.wrap{width:340px;flex:none}
.nav{height:64px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:9px;position:relative;z-index:3}
.nav span{font-size:14px;font-weight:600}
.nav.cream{background:linear-gradient(180deg,rgba(250,247,242,.94),rgba(250,247,242,.88) 58%,rgba(250,247,242,0));
-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 62%,transparent 100%)}
.nav.onband span{color:var(--band-ink)}
.pets{display:flex;gap:9px;padding:6px 20px 10px;position:relative;z-index:3}
.chip{font-size:12px;padding:4px 11px;border-radius:999px;background:rgba(255,255,255,.6);color:#6B6259}
.chip.on{background:#fff;color:var(--text);font-weight:600;box-shadow:0 2px 8px rgba(70,48,25,.08)}
.chip.add{background:transparent;padding:4px 2px}
.pets.onband .chip{background:rgba(255,255,255,.42);color:var(--band-ink)}
.pets.onband .chip.on{background:#fff;color:var(--text)}
.body{padding:0 20px 22px}
.card{background:#fff;border-radius:20px;box-shadow:0 6px 16px rgba(70,48,25,.06);padding:14px;margin-bottom:12px}
.band{position:absolute;left:0;right:0;top:0;background:linear-gradient(160deg,var(--band-a),var(--band-b));z-index:1}
.v-a .band{height:126px;border-radius:0 0 26px 26px}
.v-b .band{height:262px;border-radius:0 0 26px 26px}
.v-c .band{height:200px;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 52%,transparent 100%);
mask-image:linear-gradient(180deg,#000 0%,#000 52%,transparent 100%)}
.stage{position:relative;z-index:2}
.hero{display:flex;gap:13px;align-items:center}
.av{width:64px;height:64px;border-radius:50%;flex:none;position:relative;
background:linear-gradient(140deg,#FFD9A3,#F5A947);display:flex;align-items:center;justify-content:center;
font-size:30px;box-shadow:0 4px 12px rgba(70,48,25,.14)}
.sex{position:absolute;right:-2px;bottom:-2px;width:22px;height:22px;border-radius:50%;
background:#5B9BE8;color:#fff;border:2.5px solid #fff;font-size:11px;
display:flex;align-items:center;justify-content:center;line-height:1}
.hname{font-size:19px;font-weight:600;letter-spacing:.3px}
.hmeta{font-size:12.5px;color:var(--muted);margin-top:3px;display:flex;gap:8px;flex-wrap:wrap}
.hmeta i{font-style:normal}
.arrow{margin-left:auto;color:var(--muted2);font-size:15px}
.days{margin-top:12px;background:var(--primary-soft);color:var(--primary-ink);border-radius:12px;
text-align:center;padding:9px;font-size:13.5px;font-weight:600;letter-spacing:.2px}
.days b{font-size:16px;margin:0 2px}
.gsec{margin-bottom:16px}
.ghead{display:flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;margin-bottom:9px}
.gbar{width:3px;height:13px;border-radius:2px;background:currentColor}
.gn{font-weight:400;font-size:11.5px;color:var(--muted2);margin-left:auto}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:11px 6px}
.cell{display:flex;flex-direction:column;align-items:center;gap:5px}
.cic{width:46px;height:46px;border-radius:15px;display:flex;align-items:center;justify-content:center;font-size:23px}
.clab{font-size:11.5px;color:var(--text-2);text-align:center;line-height:1.25}
.g1 .ghead{color:var(--primary-ink)} .g1 .cic{background:var(--primary-soft);color:var(--primary-dark)}
.g2 .ghead{color:var(--green-ink)} .g2 .cic{background:var(--green-soft);color:var(--green-ink)}
.g3 .ghead{color:var(--purple-ink)} .g3 .cic{background:var(--purple-soft);color:var(--purple-ink)}
.g4 .ghead{color:var(--blue-ink)} .g4 .cic{background:var(--blue-soft);color:var(--blue-ink)}
.old .cic{background:var(--primary-soft);color:var(--primary-dark)}
.idwrap{background:#fff;border-radius:20px;padding:13px;box-shadow:0 6px 16px rgba(70,48,25,.06)}
.idc{border-radius:15px;padding:16px;background:linear-gradient(150deg,#FFF0D6,#FFE0EC 52%,#E6EEFF);position:relative;overflow:hidden}
.idc::before{content:"";position:absolute;inset:0;
background-image:radial-gradient(circle,rgba(255,255,255,.65) 1px,transparent 1px);background-size:13px 13px;opacity:.8}
.idtop{display:flex;gap:14px;position:relative}
.idav{width:66px;height:66px;border-radius:50%;flex:none;background:linear-gradient(140deg,#FFD9A3,#F5A947);
display:flex;align-items:center;justify-content:center;font-size:32px;border:3px solid rgba(255,255,255,.85)}
.idrows{flex:1;font-size:12.5px;line-height:1.85;color:#4A4238}
.idrows b{font-weight:600;color:var(--text)}
.idk{color:#9A8F82;margin-right:5px}
.idno{margin-top:13px;padding-top:11px;border-top:1px dashed rgba(122,74,8,.22);
font-size:12px;color:#6B6259;position:relative;display:flex;align-items:center;gap:7px}
.idno b{letter-spacing:1.6px;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums}
.idfoot{margin-top:11px;border-radius:15px;padding:14px;background:linear-gradient(150deg,#E8F0FF,#F0E8FF);
display:flex;align-items:center;gap:12px}
.idtitle{flex:1}
.idtitle .t1{font-size:11px;color:#7D89A8;letter-spacing:3px}
.idtitle .t2{font-size:22px;font-weight:700;color:#4A5878;letter-spacing:2px;margin:3px 0 6px}
.idtitle .t3{font-size:10.5px;color:#8A93A8;line-height:1.7}
.qr{width:58px;height:58px;flex:none;border-radius:9px;background:#fff;display:flex;align-items:center;
justify-content:center;font-size:9px;color:var(--muted2);text-align:center;line-height:1.3;border:1px solid #E4E0DA}
.idbtns{display:flex;gap:10px;margin-top:13px}
.btn{flex:1;height:42px;border-radius:14px;display:flex;align-items:center;justify-content:center;gap:6px;font-size:13.5px;font-weight:600}
.btn-soft{background:var(--primary-soft);color:var(--primary-ink)}
.btn-dark{background:var(--cta);color:#fff}
.tag{display:inline-block;font-size:10.5px;padding:2px 7px;border-radius:999px;margin-left:6px;vertical-align:1px}
.tag.new{background:var(--green-soft);color:var(--green-ink)}
</style></head><body>
<h1>肉垫计划 · 视觉稿 v3</h1>
<p class="lede">
用的是 <code>app.wxss</code> 的真 token 值和真图标资源（Tabler mask，含本次新增的 15 个），不是另画一套。
<code>rpx</code> 按 2:1 折成 px，所以这里的尺寸就是小程序里的尺寸。<br>
<b>要定的只有第 ① 项：门面色块和浅底内容的接缝怎么处理。</b>
</p>
<h2>① 接缝方案 —— 三选一</h2>
<p class="note">
关键约束（跟规划里写的不一样，实际读代码才发现）：<code>nav-bar</code> 是 <code>position:fixed</code>，
背景是半透明奶白 + <code>backdrop-filter</code>，底边还有一层 mask 淡出——当初就是为了别和页面渐变留一道硬接缝。<br>
所以品牌色块要盖到最顶部，<b>导航栏必须参与</b>：得给 nav-bar 加一个 <code>tone</code> 属性，
在色块上时不铺奶白、文字转深棕。<b>A / B 需要这个改动，C 不需要。</b>
</p>
<div class="row">
<div class="wrap">
<div class="ph v-a"><div class="band"></div><div class="stage">
<div class="nav onband"><span>肉垫计划</span></div>
<div class="pets onband"><span class="chip on">钞票</span><span class="chip">奶盖</span><span class="chip add">＋</span></div>
<div class="body"><div class="card">
<div class="hero">
<div class="av">🐶<span class="sex">♂</span></div>
<div><div class="hname">钞票</div>
<div class="hmeta"><i>柯基</i><i>2岁7个月</i><i>射手座</i></div></div>
<div class="arrow">›</div>
</div>
<div class="days">我们一起生活的第 <b>862</b> 天</div>
</div>
<div class="card" style="height:70px"></div></div>
</div></div>
<p class="ph-cap"><b>A · 色块只到宠物切换条</b><br>门面卡压在接缝上，一半在色块里。</p>
</div>
<div class="wrap">
<div class="ph v-b"><div class="band"></div><div class="stage">
<div class="nav onband"><span>肉垫计划</span></div>
<div class="pets onband"><span class="chip on">钞票</span><span class="chip">奶盖</span><span class="chip add">＋</span></div>
<div class="body"><div class="card">
<div class="hero">
<div class="av">🐶<span class="sex">♂</span></div>
<div><div class="hname">钞票</div>
<div class="hmeta"><i>柯基</i><i>2岁7个月</i><i>射手座</i></div></div>
<div class="arrow">›</div>
</div>
<div class="days">我们一起生活的第 <b>862</b> 天</div>
</div>
<div class="card" style="height:70px"></div></div>
</div></div>
<p class="ph-cap"><b>B · 色块整个包住门面卡</b><br>最接近竞品。白卡完整浮在黄底上。</p>
</div>
<div class="wrap">
<div class="ph v-c"><div class="band"></div><div class="stage">
<div class="nav cream"><span>肉垫计划</span></div>
<div class="pets"><span class="chip on">钞票</span><span class="chip">奶盖</span><span class="chip add">＋</span></div>
<div class="body"><div class="card">
<div class="hero">
<div class="av">🐶<span class="sex">♂</span></div>
<div><div class="hname">钞票</div>
<div class="hmeta"><i>柯基</i><i>2岁7个月</i><i>射手座</i></div></div>
<div class="arrow">›</div>
</div>
<div class="days">我们一起生活的第 <b>862</b> 天</div>
</div>
<div class="card" style="height:70px"></div></div>
</div></div>
<p class="ph-cap"><b>C · 色块渐隐，没有硬边界</b><br>不动 nav-bar。改动最小，也最不像竞品。</p>
</div>
</div>
<h2>② 记录页：24 种 4 组 <span class="tag new">新增 15 种</span></h2>
<p class="note">
四组各一个色系，全部走现成的 <code>--primary / green / purple / blue</code> 的 <code>soft/ink</code> 二件套，<b>没有新色值</b>。
竞品看着「彩色」的真正原因是浅色圆底 + 分组配色，不是插画；图标仍是线性 Tabler mask，<b>零美术成本</b>。
</p>
<div class="row">
<div class="wrap">
<div class="ph"><div class="stage">
<div class="nav cream"><span>记录</span></div>
<div class="body" style="padding-top:6px"><div class="gsec g1"><div class="ghead"><span class="gbar"></span>日常<span class="gn">6</span></div><div class="grid"><div class="cell"><div class="cic"><i class="pt-i pt-i-weight"></i></div><div class="clab">体重</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-poop"></i></div><div class="clab">排便</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-food"></i></div><div class="clab">饮食</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-water"></i></div><div class="clab">喝水</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-cost"></i></div><div class="clab">记账</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-photo"></i></div><div class="clab">照片</div></div></div></div>
<div class="gsec g2"><div class="ghead"><span class="gbar"></span>健康<span class="gn">7</span></div><div class="grid"><div class="cell"><div class="cic"><i class="pt-i pt-i-symptom"></i></div><div class="clab">异常</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-vaccine"></i></div><div class="clab">疫苗</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-deworm"></i></div><div class="clab">驱虫</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-checkup"></i></div><div class="clab">体检</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-vet"></i></div><div class="clab">看病</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-medicine"></i></div><div class="clab">给药</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-supplement"></i></div><div class="clab">保健品</div></div></div></div>
<div class="gsec g3"><div class="ghead"><span class="gbar"></span>洗护<span class="gn">6</span></div><div class="grid"><div class="cell"><div class="cic"><i class="pt-i pt-i-bath"></i></div><div class="clab">洗澡</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-nail"></i></div><div class="clab">剪指甲</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-ear"></i></div><div class="clab">洗耳朵</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-tooth"></i></div><div class="clab">刷牙</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-brush"></i></div><div class="clab">梳毛</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-groom"></i></div><div class="clab">美容</div></div></div></div>
<div class="gsec g4"><div class="ghead"><span class="gbar"></span>清洁<span class="gn">5</span></div><div class="grid"><div class="cell"><div class="cic"><i class="pt-i pt-i-litter"></i></div><div class="clab">换猫砂</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-litterbox"></i></div><div class="clab">洗猫砂盆</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-bowl"></i></div><div class="clab">洗食盆</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-waterbowl"></i></div><div class="clab">洗水盆</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-clean"></i></div><div class="clab">消毒</div></div></div></div></div>
</div></div>
<p class="ph-cap"><b>新：24 种 4 组</b><br>一屏看到日常+健康，滚一下到洗护/清洁。</p>
</div>
<div class="wrap">
<div class="ph old"><div class="stage">
<div class="nav cream"><span>记录</span></div>
<div class="body" style="padding-top:6px"><div class="grid"><div class="cell"><div class="cic"><i class="pt-i pt-i-weight"></i></div><div class="clab">体重</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-poop"></i></div><div class="clab">便便</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-food"></i></div><div class="clab">饮食</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-symptom"></i></div><div class="clab">异常</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-cost"></i></div><div class="clab">消费</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-medicine"></i></div><div class="clab">用药</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-photo"></i></div><div class="clab">照片</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-vaccine"></i></div><div class="clab">疫苗</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-deworm"></i></div><div class="clab">驱虫</div></div></div></div>
</div></div>
<p class="ph-cap"><b>现状：9 种一锅</b><br>全是低频医疗和记账。今天打开大概率没什么可记。</p>
</div>
<div class="wrap" style="width:420px">
<div class="card" style="width:420px;margin-top:0">
<div style="font-size:13.5px;font-weight:600;margin-bottom:12px">新增的 15 个图标</div>
<div class="grid" style="grid-template-columns:repeat(8,1fr);gap:14px 4px"><div class="cell"><div class="cic"><i class="pt-i pt-i-water"></i></div><div class="clab">喝水</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-bath"></i></div><div class="clab">洗澡</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-nail"></i></div><div class="clab">剪指甲</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-ear"></i></div><div class="clab">洗耳朵</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-tooth"></i></div><div class="clab">刷牙</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-brush"></i></div><div class="clab">梳毛</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-groom"></i></div><div class="clab">美容</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-litter"></i></div><div class="clab">换猫砂</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-litterbox"></i></div><div class="clab">洗猫砂盆</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-bowl"></i></div><div class="clab">洗食盆</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-waterbowl"></i></div><div class="clab">洗水盆</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-clean"></i></div><div class="clab">消毒</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-checkup"></i></div><div class="clab">体检</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-vet"></i></div><div class="clab">看病</div></div>
<div class="cell"><div class="cic"><i class="pt-i pt-i-supplement"></i></div><div class="clab">保健品</div></div></div>
<p style="font-size:12px;color:#6B6259;margin-top:14px;line-height:1.7">
从本地那份 <code>tabler-icons-3.46.0</code> 里挑的真源，不是我凭记忆画路径。
已解码抽检确认<b>路径非空</b>——Tabler 是 stroke 描边，这套方案唯一的坑就是空字形，
转字体必踩，走 mask 不会。</p>
</div>
</div>
</div>
<h2>③ 身份卡</h2>
<p class="note">
绘制复用现有海报那套 canvas 2d（<code>bottom-sheet.js</code> 270-380 行），换的是内容不是功能。<br>
<b>唯一新增后端工作</b>：小程序码要调微信 <code>wxacode.getUnlimited</code>，AppID/Secret 配置里已有、接口还没写。
身份 ID 用「品种码 + 生日 + 序号」本地拼，不入库。
</p>
<div class="row">
<div class="wrap">
<div class="ph"><div class="stage">
<div class="nav cream"><span>身份卡</span></div>
<div class="body" style="padding-top:6px">
<div class="idwrap">
<div class="idc">
<div class="idtop">
<div class="idav">🐶</div>
<div class="idrows">
<div><span class="idk">姓名</span><b>钞票</b></div>
<div><span class="idk">性别</span><b>男</b> &nbsp;<span class="idk">品种</span><b>柯基</b></div>
<div><span class="idk">出生</span><b>2023 年 12 月 15 日</b></div>
<div><span class="idk">介绍</span><b>汪星人来地球啦~</b></div>
</div>
</div>
<div class="idno"><span class="idk">身份 ID</span><b>1116 9832 0231 2150</b></div>
</div>
<div class="idfoot">
<div class="idtitle">
<div class="t1">宠星人地球移民</div>
<div class="t2">居民身份卡</div>
<div class="t3">签发机构　肉垫计划<br>有效期限　2023.12.15 - 永远</div>
</div>
<div class="qr">小程序码<br>（待接）</div>
</div>
<div class="idbtns">
<div class="btn btn-soft"><i class="pt-i pt-i-photo"></i>存相册</div>
<div class="btn btn-dark"><i class="pt-i pt-i-share"></i>分享</div>
</div>
</div>
</div>
</div></div>
<p class="ph-cap"><b>身份卡</b><br>价值全在「可炫耀、可分享」，不在信息量。</p>
</div>
</div>
</body></html>
pets-fe/styles/iconfont.wxss
+15
View File
@@ -42,3 +42,18 @@
.pt-i-clock{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0zIDEyYTkgOSAwIDEgMCAxOCAwYTkgOSAwIDAgMCAtMTggMCIgLz48cGF0aCBkPSJNMTIgN3Y1bDMgMyIgLz48L3N2Zz4=")}
.pt-i-up{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik02IDE1bDYgLTZsNiA2IiAvPjwvc3ZnPg==")}
.pt-i-down{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik02IDlsNiA2bDYgLTYiIC8+PC9zdmc+")}
.pt-i-water{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik03LjUwMiAxOS40MjNjMi42MDIgMi4xMDUgNi4zOTUgMi4xMDUgOC45OTYgMGMyLjYwMiAtMi4xMDUgMy4yNjIgLTUuNzA4IDEuNTY2IC04LjU0NmwtNC44OSAtNy4yNmMtLjQyIC0uNjI1IC0xLjI4NyAtLjgwMyAtMS45MzYgLS4zOTdhMS4zNzYgMS4zNzYgMCAwIDAgLS40MSAuMzk3bC00Ljg5MyA3LjI2Yy0xLjY5NSAyLjgzOCAtMS4wMzUgNi40NDEgMS41NjcgOC41NDYiIC8+PC9zdmc+")}
.pt-i-bath{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDEyaDE2YTEgMSAwIDAgMSAxIDF2M2E0IDQgMCAwIDEgLTQgNGgtMTBhNCA0IDAgMCAxIC00IC00di0zYTEgMSAwIDAgMSAxIC0xIiAvPiA8cGF0aCBkPSJNNiAxMnYtN2EyIDIgMCAwIDEgMiAtMmgzdjIuMjUiIC8+IDxwYXRoIGQ9Ik00IDIxbDEgLTEuNSIgLz4gPHBhdGggZD0iTTIwIDIxbC0xIC0xLjUiIC8+PC9zdmc+")}
.pt-i-nail{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0zIDdhMyAzIDAgMSAwIDYgMGEzIDMgMCAxIDAgLTYgMCIgLz4gPHBhdGggZD0iTTMgMTdhMyAzIDAgMSAwIDYgMGEzIDMgMCAxIDAgLTYgMCIgLz4gPHBhdGggZD0iTTguNiA4LjZsMTAuNCAxMC40IiAvPiA8cGF0aCBkPSJNOC42IDE1LjRsMTAuNCAtMTAuNCIgLz48L3N2Zz4=")}
.pt-i-ear{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik02IDEwYTcgNyAwIDEgMSAxMyAzLjZhMTAgMTAgMCAwIDEgLTIgMmE4IDggMCAwIDAgLTIgM2E0LjUgNC41IDAgMCAxIC02LjggMS40IiAvPiA8cGF0aCBkPSJNMTAgMTBhMyAzIDAgMSAxIDUgMi4yIiAvPjwvc3ZnPg==")}
.pt-i-tooth{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xMiA1LjVjLTEuMDc0IC0uNTg2IC0yLjU4MyAtMS41IC00IC0xLjVjLTIuMSAwIC00IDEuMjQ3IC00IDVjMCA0Ljg5OSAxLjA1NiA4LjQxIDIuNjcxIDEwLjUzN2MuNTczIC43NTYgMS45NyAuNTIxIDIuNTY3IC0uMjM2Yy4zOTggLS41MDUgLjgxOSAtMS40MzkgMS4yNjIgLTIuODAxYy4yOTIgLS43NzEgLjg5MiAtMS41MDQgMS41IC0xLjVjLjYwMiAwIDEuMjEgLjczNyAxLjUgMS41Yy40NDMgMS4zNjIgLjg2NCAyLjI5NSAxLjI2MiAyLjhjLjU5NyAuNzU5IDIgLjk5MyAyLjU2NyAuMjM3YzEuNjE1IC0yLjEyNyAyLjY3MSAtNS42MzcgMi42NzEgLTEwLjUzN2MwIC0zLjc0IC0xLjkwOCAtNSAtNCAtNWMtMS40MjMgMCAtMi45MiAuOTExIC00IDEuNSIgLz4gPHBhdGggZD0iTTEyIDUuNWwzIDEuNSIgLz48L3N2Zz4=")}
.pt-i-brush{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0zIDIxdi00YTQgNCAwIDEgMSA0IDRoLTQiIC8+IDxwYXRoIGQ9Ik0yMSAzYTE2IDE2IDAgMCAwIC0xMi44IDEwLjIiIC8+IDxwYXRoIGQ9Ik0yMSAzYTE2IDE2IDAgMCAxIC0xMC4yIDEyLjgiIC8+IDxwYXRoIGQ9Ik0xMC42IDlhOSA5IDAgMCAxIDQuNCA0LjQiIC8+PC9zdmc+")}
.pt-i-groom{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik0xNiAxOGEyIDIgMCAwIDEgMiAyYTIgMiAwIDAgMSAyIC0yYTIgMiAwIDAgMSAtMiAtMmEyIDIgMCAwIDEgLTIgMm0wIC0xMmEyIDIgMCAwIDEgMiAyYTIgMiAwIDAgMSAyIC0yYTIgMiAwIDAgMSAtMiAtMmEyIDIgMCAwIDEgLTIgMm0tNyAxMmE2IDYgMCAwIDEgNiAtNmE2IDYgMCAwIDEgLTYgLTZhNiA2IDAgMCAxIC02IDZhNiA2IDAgMCAxIDYgNiIgLz48L3N2Zz4=")}
.pt-i-litter{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDdhOCA0IDAgMSAwIDE2IDBhOCA0IDAgMSAwIC0xNiAwIiAvPiA8cGF0aCBkPSJNNCA3YzAgLjY2NCAuMDg4IDEuMzI0IC4yNjMgMS45NjVsMi43MzcgMTAuMDM1Yy41IDEuNSAyLjIzOSAyIDUgMnM0LjUgLS41IDUgLTJjLjMzMyAtMSAxLjI0NiAtNC4zNDUgMi43MzcgLTEwLjAzNWE3LjQ1IDcuNDUgMCAwIDAgLjI2MyAtMS45NjUiIC8+PC9zdmc+")}
.pt-i-litterbox{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik01IDE2bDEuNDY1IDEuNjM4YTIgMiAwIDEgMSAtMy4wMTUgLjA5OWwxLjU1IC0xLjczNyIgLz4gPHBhdGggZD0iTTEzLjczNyA5LjczN2MyLjI5OSAtMi4zIDMuMjMgLTUuMDk1IDIuMDgxIC02LjI0NWMtMS4xNSAtMS4xNSAtMy45NDUgLS4yMTcgLTYuMjQ0IDIuMDgyYy0yLjMgMi4yOTkgLTMuMjMxIDUuMDk1IC0yLjA4MiA2LjI0NGMxLjE1IDEuMTUgMy45NDYgLjIxOCA2LjI0NSAtMi4wODEiIC8+IDxwYXRoIGQ9Ik03LjQ5MiAxMS44MThjLjM2MiAuMzYyIC43NjggLjY3NiAxLjIwOCAuOTM0bDYuODk1IDQuMDQ3YzEuMDc4IC41NTcgMi4yNTUgLS4wNzUgMy42OTIgLTEuNTEyYzEuNDM3IC0xLjQzNyAyLjA3IC0yLjYxNCAxLjUxMiAtMy42OTJjLS4zNzIgLS43MTggLTEuNzIgLTMuMDE3IC00LjA0NyAtNi44OTVhNi4wMTUgNi4wMTUgMCAwIDAgLS45MzQgLTEuMjA4IiAvPjwvc3ZnPg==")}
.pt-i-bowl{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDhoMTZhMSAxIDAgMCAxIDEgMXYuNWMwIDEuNSAtMi41MTcgNS41NzMgLTQgNi41djFhMSAxIDAgMCAxIC0xIDFoLThhMSAxIDAgMCAxIC0xIC0xdi0xYy0xLjY4NyAtMS4wNTQgLTQgLTUgLTQgLTYuNXYtLjVhMSAxIDAgMCAxIDEgLTEiIC8+PC9zdmc+")}
.pt-i-waterbowl{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik04IDIxbDggMCIgLz4gPHBhdGggZD0iTTEyIDE1bDAgNiIgLz4gPHBhdGggZD0iTTE3IDNsMSA3YzAgMy4wMTIgLTIuNjg2IDUgLTYgNXMtNiAtMS45ODggLTYgLTVsMSAtN2gxMCIgLz4gPHBhdGggZD0iTTYgMTBhNSA1IDAgMCAxIDYgMGE1IDUgMCAwIDAgNiAwIiAvPjwvc3ZnPg==")}
.pt-i-clean{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00IDEyYTIgMiAwIDAgMSAyIC0yaDRhMiAyIDAgMCAxIDIgMnY3YTIgMiAwIDAgMSAtMiAyaC00YTIgMiAwIDAgMSAtMiAtMmwwIC03IiAvPiA8cGF0aCBkPSJNNiAxMHYtNGExIDEgMCAwIDEgMSAtMWgyYTEgMSAwIDAgMSAxIDF2NCIgLz4gPHBhdGggZD0iTTE1IDdoLjAxIiAvPiA8cGF0aCBkPSJNMTggOWguMDEiIC8+IDxwYXRoIGQ9Ik0xOCA1aC4wMSIgLz4gPHBhdGggZD0iTTIxIDNoLjAxIiAvPiA8cGF0aCBkPSJNMjEgN2guMDEiIC8+IDxwYXRoIGQ9Ik0yMSAxMWguMDEiIC8+IDxwYXRoIGQ9Ik0xMCA3aDEiIC8+PC9zdmc+")}
.pt-i-checkup{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik02IDRoLTFhMiAyIDAgMCAwIC0yIDJ2My41YTUuNSA1LjUgMCAwIDAgMTEgMHYtMy41YTIgMiAwIDAgMCAtMiAtMmgtMSIgLz4gPHBhdGggZD0iTTggMTVhNiA2IDAgMSAwIDEyIDB2LTMiIC8+IDxwYXRoIGQ9Ik0xMSAzdjIiIC8+IDxwYXRoIGQ9Ik02IDN2MiIgLz4gPHBhdGggZD0iTTE4IDEwYTIgMiAwIDEgMCA0IDBhMiAyIDAgMSAwIC00IDAiIC8+PC9zdmc+")}
.pt-i-vet{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik04IDh2LTJhMiAyIDAgMCAxIDIgLTJoNGEyIDIgMCAwIDEgMiAydjIiIC8+IDxwYXRoIGQ9Ik00IDEwYTIgMiAwIDAgMSAyIC0yaDEyYTIgMiAwIDAgMSAyIDJ2OGEyIDIgMCAwIDEgLTIgMmgtMTJhMiAyIDAgMCAxIC0yIC0ybDAgLTgiIC8+IDxwYXRoIGQ9Ik0xMCAxNGg0IiAvPiA8cGF0aCBkPSJNMTIgMTJ2NCIgLz48L3N2Zz4=")}
.pt-i-supplement{--m:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgPjxwYXRoIGQ9Ik00LjUgMTIuNWw4IC04YTQuOTQgNC45NCAwIDAgMSA3IDdsLTggOGE0Ljk0IDQuOTQgMCAwIDEgLTcgLTciIC8+IDxwYXRoIGQ9Ik04LjUgOC41bDcgNyIgLz48L3N2Zz4=")}