/* ===========================================================
   宠物取名（2026-10-18 改为 B 版「手账拼贴」）
   外壳、纸片、按钮、分段都复用 pet-book.css，这里只补本页特有的。
   颜色只用 pet-book 的 --pb-* 变量。
   =========================================================== */
.pn .pn-h { font-family: var(--pb-hand); font-size: 20px; margin: 0 0 10px; display: flex; align-items: baseline; gap: 8px; font-weight: 700; }
.pn .pn-h i { font-style: normal; color: var(--pb-red); }
.pn .pn-h small { font-family: -apple-system, "PingFang SC", sans-serif; font-size: 12px; font-weight: 400; color: var(--pb-ink3); }
.pn .pb-field:first-child { margin-top: 0; }
.pn-center { text-align: center; }
.pn-wxnote { margin-top: 26px; font-size: 12px; }

/* 给谁起名 */
.pn-who span { font-size: 14px; }

/* 已选档案的资料摘要 */
.pn-summary { margin: 0 0 6px; font-size: 15px; line-height: 1.7; color: var(--pb-ink2); }
.pn-summary b { font-family: var(--pb-hand); font-size: 19px; color: var(--pb-ink); }

/* 日期格 */
.pn-date { display: flex; align-items: baseline; gap: 10px; width: 100%; margin-top: 10px; padding: 10px 2px; border: 0;
  border-bottom: 2px solid var(--pb-line); background: transparent; font: inherit; color: var(--pb-ink); cursor: pointer; text-align: left; }
.pn-date small { font-size: 12px; color: var(--pb-ink3); flex: none; }
.pn-date b { font-family: var(--pb-hand); font-size: 19px; flex: 1; }
.pn-date em { font-style: normal; font-size: 13px; color: var(--pb-red); }
.pn-state { margin: 12px 0 0; font-size: 13px; line-height: 1.7; color: var(--pb-ink3); }

/* 口味多选 */
.pn-styles { margin-bottom: 4px; }

/* 喜忌签 */
.pn-xiji { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; align-items: center; margin-top: 22px; }
.pn-xiji .pn-ji-row { display: flex; gap: 8px; grid-row: span 2; }
.pn-xiji .pb-stamp { width: 52px; height: 52px; font-size: 20px; }
.pn-xiji .pb-stamp.is-ji { border-color: var(--pb-ink3); color: var(--pb-ink3); transform: rotate(8deg); font-size: 15px; }
.pn-xiji p { margin: 0; font-size: 13.5px; line-height: 1.75; color: var(--pb-ink2); }
.pn-xiji p b { color: var(--pb-ink); }

/* 名字卡 */
.pn-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 12px; margin-top: 8px; }
.pn-grid .pet-name-item { background: var(--pb-sheet); border-radius: 4px; padding: 14px 12px 12px; position: relative;
  box-shadow: 0 2px 7px rgba(0, 0, 0, .09); display: flex; flex-direction: column; gap: 6px; }
.pn-grid .pet-name-item:nth-child(odd) { transform: rotate(-.7deg); }
.pn-grid .pet-name-item:nth-child(even) { transform: rotate(.7deg); }
.pn-grid .pet-name-item.is-xi::before { content: ""; position: absolute; width: 46px; height: 16px; background: var(--pb-tape);
  top: -7px; left: 50%; margin-left: -23px; transform: rotate(-4deg); }
.pet-name-word { font-family: var(--pb-hand); font-size: 30px; line-height: 1.15; margin: 0; font-weight: 700; color: var(--pb-ink); }
.pet-name-wx { margin: 0; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; font-size: 12px; color: var(--pb-ink3); }
.pn-wx { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: #fff; font-size: 12px; font-weight: 700; }
.pn-wx.wx-金 { background: var(--pb-yellow); }
.pn-wx.wx-木 { background: var(--pb-green); }
.pn-wx.wx-水 { background: var(--pb-blue); }
.pn-wx.wx-火 { background: var(--pb-red); }
.pn-wx.wx-土 { background: var(--pb-ink2); }
.pet-name-hit { font-size: 11px; color: var(--pb-red); border: 1.5px solid var(--pb-red); border-radius: 3px; padding: 0 4px; line-height: 1.5; }
.pet-name-help { font-size: 11px; color: var(--pb-green); border: 1.5px solid var(--pb-green); border-radius: 3px; padding: 0 4px; line-height: 1.5; }
.pet-name-why { margin: 0; font-size: 12.5px; line-height: 1.65; color: var(--pb-ink2); flex: 1; }
.pet-name-acts { display: flex; gap: 6px; margin-top: 4px; }
.pet-name-acts .pb-btn { flex: 1; padding: 8px 0; font-size: 13px; }

/* 候选名签 */
.pn-card { margin-top: 26px; padding: 20px 18px 16px; }
.pn-card-h { font-family: var(--pb-hand); font-size: 18px; letter-spacing: 6px; text-align: center; margin: 0 0 10px; color: var(--pb-red); }
.pet-name-card-row { display: flex; gap: 10px; align-items: baseline; padding: 6px 0; border-bottom: 1px dashed var(--pb-line); }
.pet-name-card-word { font-family: var(--pb-hand); font-size: 20px; font-weight: 700; flex: none; min-width: 4.2em; }
.pet-name-card-why { font-size: 12px; color: var(--pb-ink3); }
.pn-card-foot { margin: 10px 0 0; font-size: 11px; color: var(--pb-ink3); letter-spacing: 2px; }
.pn-card .pb-stamp { position: absolute; right: 14px; bottom: 10px; width: 50px; height: 50px; font-size: 12px; opacity: .8; }

/* 生辰弹层（与表单页同一个滚轮） */
.pet-birth-sheet .picker-pane { min-height: 260px; }
.pet-place-note { margin: 0; padding: 10px 16px calc(12px + env(safe-area-inset-bottom)); color: var(--pb-ink3); font-size: 12px; text-align: center; }

@media (max-width: 360px) {
  .pn-grid { grid-template-columns: minmax(0, 1fr); }
}

/* 手机上点得准：分段、按钮不低于 40px */
.pn .pb-seg label { display: inline-block; }
.pn .pb-seg span { padding: 10px 14px; }
.pet-name-acts .pb-btn { min-height: 40px; }