/* ===== 原声回忆录 H5 样式 ===== */
* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html, body { height:100%; }
body {
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  background:#FFF8F0;
  color:#3D2C1E;
  font-size:17px;
  line-height:1.6;
  max-width:560px;
  margin:0 auto;
  padding-bottom:64px;
}
.hidden { display:none !important; }

/* ===== 登录页 ===== */
.page { display:none; min-height:100vh; padding:20px; }
.page.active { display:block; }
#page-login { display:none; align-items:center; justify-content:center; }
#page-login.active { display:flex; }
.login-card {
  width:100%;
  background:#fff;
  border-radius:20px;
  padding:32px 24px;
  box-shadow:0 4px 20px rgba(255,122,47,.12);
  text-align:center;
}
.logo { font-size:52px; }
.login-card h1 { font-size:26px; margin:8px 0 4px; color:#FF7A2F; }
.slogan { color:#9a8a78; font-size:14px; margin-bottom:20px; }
.tab-row { display:flex; gap:8px; margin-bottom:16px; }
.tab {
  flex:1; padding:10px 0; border-radius:12px; font-size:16px;
  background:#f5efe7; color:#8a7a68; cursor:pointer; text-align:center;
}
.tab.active { background:#FF7A2F; color:#fff; font-weight:600; }
input {
  width:100%; padding:13px 14px; margin-bottom:12px;
  border:1.5px solid #eadfd2; border-radius:12px;
  font-size:17px; background:#fff; outline:none;
}
input:focus { border-color:#FF7A2F; }
.btn-primary {
  width:100%; padding:14px; border:none; border-radius:12px;
  background:#FF7A2F; color:#fff; font-size:18px; font-weight:600; cursor:pointer;
}
.btn-primary:active { background:#e56a24; }
.btn-outline {
  width:100%; padding:11px 14px; border:1.5px solid #FF7A2F; border-radius:12px;
  background:#fff; color:#FF7A2F; font-size:15px; cursor:pointer;
}
.err { color:#d9534f; font-size:14px; margin-top:10px; min-height:20px; }
.ok { color:#27ae60; font-size:14px; margin-top:10px; min-height:20px; }

/* ===== 顶部栏 ===== */
.topbar {
  background:linear-gradient(135deg,#FF7A2F,#ff9a5c);
  color:#fff;
  padding:18px 20px 24px;
  border-radius:0 0 24px 24px;
  position:relative;
}
.topbar .hello { font-size:24px; font-weight:700; }
.topbar .sub { font-size:14px; opacity:.9; margin-top:2px; }
.topbar .logout {
  position:absolute; right:20px; top:20px;
  font-size:13px; opacity:.9;
  border:1px solid rgba(255,255,255,.6);
  padding:4px 12px; border-radius:14px; cursor:pointer;
}

/* ===== 卡片 ===== */
.card {
  background:#fff;
  border-radius:16px;
  padding:18px;
  margin:14px 14px 0;
  box-shadow:0 2px 10px rgba(61,44,30,.05);
}
.card h3 { font-size:19px; margin-bottom:10px; color:#3D2C1E; }
.card .desc { font-size:14px; color:#9a8a78; margin-bottom:12px; }
.field { display:flex; align-items:center; margin-bottom:10px; gap:10px; }
.field label { width:76px; font-size:15px; color:#8a7a68; flex-shrink:0; }
.field input { margin-bottom:0; flex:1; padding:10px 12px; font-size:16px; }

/* ===== 身份卡完成态 ===== */
.identity-summary { margin:4px 0 14px; }
.id-row { display:flex; align-items:center; padding:9px 0; font-size:15px; color:#5a4a38; border-bottom:1px dashed #f0e8dc; }
.id-row:last-child { border-bottom:none; }
.id-label { width:76px; font-size:14px; color:#9a8a78; flex-shrink:0; }

/* ===== 访谈 ===== */
.iv-progress { font-size:13px; color:#b08a5c; margin-bottom:4px; }
.iv-intro { font-size:15px; color:#8a7a68; margin:6px 0 10px; }
.iv-topic {
  font-size:19px; font-weight:600; color:#3D2C1E;
  background:#FFF3E4; border-radius:12px; padding:12px 14px;
  margin-bottom:12px;
}
.iv-photo { margin:10px 0; text-align:center; }
.photo-preview { max-width:100%; max-height:180px; border-radius:12px; margin-top:8px; }
.iv-chat { max-height:220px; overflow-y:auto; margin:8px 0; }
.chat-bubble {
  margin:6px 0; padding:10px 14px; border-radius:14px;
  font-size:16px; max-width:88%;
}
.chat-bubble.ai { background:#FFF3E4; color:#3D2C1E; margin-right:auto; }
.chat-bubble.me { background:#FF7A2F; color:#fff; margin-left:auto; }
.chat-bubble.sys { background:#f0f0f0; color:#8a8a8e; text-align:center; margin:8px auto; font-size:14px; }

/* ===== 录音按钮 ===== */
.talk-wrap { text-align:center; margin:14px 0 6px; }
.talk-text { display:flex; gap:8px; align-items:center; margin:0 auto 12px; max-width:340px; }
.talk-text input {
  flex:1; min-width:0; height:44px; border-radius:22px; border:1px solid #e8d5b8;
  background:#fffdf8; color:#4a3525; font-size:16px; padding:0 16px; outline:none;
}
.talk-text input:focus { border-color:#FF7A2F; }
.talk-text .send-btn {
  height:44px; padding:0 20px; border:none; border-radius:22px; flex-shrink:0;
  background:linear-gradient(135deg,#FF7A2F,#ff9a5c); color:#fff; font-size:16px; font-weight:600;
  cursor:pointer; box-shadow:0 3px 10px rgba(255,122,47,.3);
}
.talk-text .send-btn:active { transform:scale(.95); }
.talk-btn {
  width:120px; height:120px; border-radius:50%;
  border:none; background:linear-gradient(135deg,#FF7A2F,#ff9a5c);
  color:#fff; font-size:18px; font-weight:600;
  box-shadow:0 4px 14px rgba(255,122,47,.35);
  cursor:pointer; outline:none; touch-action:none;
  position:relative; z-index:1001;
}
.talk-btn:active, .talk-btn.recording {
  background:linear-gradient(135deg,#e0561f,#ff7a2f);
  transform:scale(.95);
}
.talk-tip { font-size:13px; color:#9a8a78; margin-top:8px; }
/* 按住说话弹出的麦克风浮层 */
.talk-mic-pop {
  position:fixed; left:50%; top:15%; transform:translate(-50%,-50%);
  width:150px; height:150px; border-radius:50%;
  background:rgba(255,122,47,.94);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  box-shadow:0 8px 30px rgba(255,122,47,.45); z-index:999;
  cursor:pointer; animation:micPopIn .18s ease-out;
}
.talk-mic-pop .mic-icon { font-size:46px; line-height:1; animation:micPulse 1s ease-in-out infinite; }
.talk-mic-pop .mic-text { color:#fff; font-size:14px; margin-top:10px; font-weight:600; }
.talk-mic-pop.hidden { display:none; }
@keyframes micPopIn { from { transform:translate(-50%,-50%) scale(.4); opacity:0; } to { transform:translate(-50%,-50%) scale(1); opacity:1; } }
@keyframes micPulse { 0%,100% { transform:scale(1); } 50% { transform:scale(1.18); } }
.iv-status, #dlStatus { font-size:14px; color:#b08a5c; text-align:center; min-height:22px; margin-top:6px; }

/* ===== 打卡列表 / 时间线 ===== */
.daily-list, #tlList { margin-top:8px; }
.tl-item {
  display:flex; align-items:center; gap:10px;
  padding:12px 6px; border-bottom:1px solid #f2ece2;
  cursor:pointer;
}
.tl-item .tl-time { font-size:13px; color:#9a8a78; width:52px; flex-shrink:0; }
.tl-item .tl-text { flex:1; font-size:15px; color:#3D2C1E; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tl-item .tl-badge {
  font-size:12px; padding:2px 8px; border-radius:10px;
  background:#f5efe7; color:#8a7a68; flex-shrink:0;
}
.tl-item .tl-badge.done { background:#e8f8ee; color:#27ae60; }
.tl-item .tl-badge.failed { background:#fdecea; color:#d9534f; }
.tl-item .play {
  width:32px; height:32px; border-radius:50%;
  background:#FF7A2F; color:#fff; text-align:center; line-height:32px;
  font-size:14px; flex-shrink:0;
}
.tl-item audio { display:none; }

/* ===== 时间线折叠 ===== */
.tl-item.tl-more { display:none; }
.tl-item.tl-more.show { display:flex; }
.tl-more-btn {
  display:block; width:100%; margin:14px auto 6px;
  padding:11px 0; border:1px solid #f0ddc2; border-radius:12px;
  background:#FFF8F0; color:#b08a5c; font-size:15px; text-align:center;
  cursor:pointer;
}
.tl-more-btn:active { background:#f5efe7; }

/* ===== 底部导航 ===== */
.tabbar {
  position:fixed; bottom:0; left:50%; transform:translateX(-50%);
  width:100%; max-width:560px;
  background:#fff;
  display:flex;
  border-top:1px solid #f2ece2;
  padding:6px 0 calc(6px + env(safe-area-inset-bottom));
  z-index:100;
}
.tab-item {
  flex:1; text-align:center; padding:4px 0;
  font-size:12px; color:#9a8a78; text-decoration:none;
}
.tab-item .icon { display:block; font-size:20px; margin-bottom:2px; }
.tab-item.active { color:#FF7A2F; font-weight:600; }

/* ===== 记忆页 ===== */
.mem-search { display:flex; gap:8px; margin-bottom:12px; }
.mem-search input { flex:1; margin-bottom:0; padding:10px 12px; font-size:16px; }
.mem-search-btn { width:auto; flex-shrink:0; padding:10px 16px; }
.mem-export { display:flex; align-items:center; gap:8px; margin-bottom:12px; flex-wrap:wrap; }
.mem-export .btn-outline { width:auto; flex-shrink:0; padding:9px 14px; font-size:14px; }
.mem-export .btn-outline:disabled { opacity:.6; }
.mem-export-tip { font-size:12px; color:#b8a898; }
.recall-card { background:linear-gradient(135deg,#FFF6E9,#FDEBD3); border:1px solid #f0ddc2; border-radius:14px; padding:14px 16px; margin-bottom:12px; }
.recall-head { font-size:14px; font-weight:600; color:#b08a5c; margin-bottom:8px; }
.recall-text { font-size:16px; color:#3D2C1E; line-height:1.7; }
.recall-meta { font-size:12px; color:#b8a898; margin-top:8px; }
.mem-empty { text-align:center; padding:32px 0 24px; font-size:17px; color:#b08a5c; }
.mem-count { font-size:13px; color:#9a8a78; margin-bottom:8px; }
.mem-cat {
  display:flex; align-items:center; gap:6px;
  font-size:16px; font-weight:600; color:#3D2C1E;
  margin:14px 0 6px;
}
.mem-cat-icon { font-size:16px; }
.mem-item {
  background:#FFF8F0; border:1px solid #f2e6d8;
  border-radius:12px; padding:12px 14px; margin-bottom:8px;
}
.mem-content { font-size:16px; color:#3D2C1E; line-height:1.6; }
.mem-src { font-size:12px; color:#b8a898; margin-top:6px; }

/* ===== 纪念日（定时情感召回） ===== */
.mem-calendar {
  background:linear-gradient(135deg,#FFF0E6,#FFE3CC);
  border:1px solid #f5d8b8;
  border-radius:14px;
  padding:14px 16px;
  margin-bottom:12px;
}
.mem-cal-head { font-size:14px; font-weight:600; color:#d97a2f; margin-bottom:8px; }

/* 纪念日管理弹窗 */
.modal {
  position:fixed; inset:0; z-index:2000;
  background:rgba(61,44,30,.45);
  display:flex; align-items:center; justify-content:center;
  padding:20px;
}
.modal-card {
  width:100%; max-width:420px;
  background:#fff; border-radius:20px;
  padding:22px 20px;
  box-shadow:0 8px 30px rgba(0,0,0,.2);
}
.modal-card h3 { font-size:19px; margin-bottom:6px; color:#3D2C1E; }
.modal-card .desc { font-size:14px; color:#9a8a78; margin-bottom:14px; }
.cal-list { margin-bottom:12px; max-height:240px; overflow-y:auto; }
.cal-item {
  display:flex; align-items:center; gap:10px;
  background:#FFF8F0; border:1px solid #f2e6d8;
  border-radius:10px; padding:10px 12px; margin-bottom:8px;
}
.cal-item-name { flex:1; font-size:16px; color:#3D2C1E; }
.cal-item-date { font-size:14px; color:#9a8a78; }
.cal-item-del {
  width:26px; height:26px; border-radius:50%;
  background:#fdecea; color:#d9534f;
  text-align:center; line-height:26px; font-size:14px; cursor:pointer; flex-shrink:0;
}
.cal-add { display:flex; gap:8px; align-items:flex-start; }
.cal-add input { margin-bottom:0; padding:10px 12px; font-size:16px; }
.cal-add #calName { flex:1.4; }
.cal-add #calDate { flex:1; }
.cal-add-btn { width:auto; flex-shrink:0; padding:11px 14px; font-size:15px; }
.cal-close { margin-top:12px; }

/* ===== 会员 & 站点 ===== */
.vip-bar { display:flex; align-items:center; gap:8px; padding:8px 16px; background:linear-gradient(135deg,#FFF3E6,#FFE4D0); font-size:13px; flex-wrap:wrap; }
.vip-badge { background:#FF7A2F; color:#fff; border-radius:12px; padding:2px 10px; font-size:12px; font-weight:600; }
.vip-badge.trial { background:#4CAF50; }
.vip-badge.expired { background:#9E9E9E; }
.vip-info { flex:1; color:#8a5a2b; }
.vip-btn { padding:5px 14px; font-size:13px; border-radius:16px; }
.vip-btn.btn-primary { border:none; }
.modal { position:fixed; inset:0; background:rgba(0,0,0,.5); display:flex; align-items:center; justify-content:center; z-index:2000; }
.modal-card { background:#fff; border-radius:16px; padding:20px; width:92%; max-width:360px; max-height:88vh; overflow-y:auto; box-shadow:0 10px 40px rgba(0,0,0,.2); }
.vip-modal-card h3 { text-align:center; margin-bottom:12px; }
.vip-loading { text-align:center; color:#999; padding:20px 0; }
.vip-current { background:#FFF8F0; border:1px solid #FFD9B8; border-radius:10px; padding:10px; font-size:13px; color:#8a5a2b; margin-bottom:12px; }
.vip-plans { display:flex; gap:10px; }
.vip-plan { flex:1; border:1px solid #eee; border-radius:12px; padding:14px 10px; text-align:center; cursor:pointer; transition:all .2s; }
.vip-plan:hover { border-color:#FF7A2F; box-shadow:0 4px 16px rgba(255,122,47,.15); }
.vp-name { font-size:14px; font-weight:600; }
.vp-price { font-size:15px; color:#FF7A2F; margin:6px 0; }
.vp-price b { font-size:22px; }
.vp-desc { font-size:12px; color:#999; margin-bottom:10px; }
.vip-plan .btn-primary { width:100%; padding:7px 0; font-size:13px; }
.vip-pay-area { margin-top:14px; border-top:1px dashed #eee; padding-top:14px; text-align:center; }
.vip-qr img { width:180px; height:180px; border:1px solid #eee; border-radius:8px; }
.vip-qr-tip { font-size:13px; color:#666; margin:8px 0; }
.vip-close { text-align:center; margin-top:12px; }
.site-footer { text-align:center; padding:14px 16px 20px; color:#b08d6a; font-size:12px; }

/* ===== 记忆资产卡片 ===== */
.asset-card { background:linear-gradient(135deg,#FFF9F0,#FFF1E0); border:1px solid #F5DDBB; }
.asset-card h3 { font-size:16px; margin-bottom:8px; color:#8a5a2b; }
.asset-summary { font-size:14px; color:#6d4a2b; line-height:1.6; }
.asset-num { font-weight:700; color:#E07020; font-size:16px; }
.asset-stages { margin-top:10px; }
.asset-stage { margin-bottom:6px; }
.as-name { font-size:12px; color:#8a5a2b; display:flex; justify-content:space-between; margin-bottom:2px; }
.as-count { color:#b08d6a; }
.as-bar { height:6px; background:#F0E0CC; border-radius:3px; overflow:hidden; }
.as-fill { height:100%; background:linear-gradient(90deg,#FFB366,#FF8C42); border-radius:3px; transition:width .4s; }
.asset-hint { margin-top:10px; font-size:13px; color:#b07030; background:#FFF; border:1px dashed #F0D5B0; border-radius:8px; padding:8px 10px; }

/* ===== 打卡情感化话术 ===== */
.daily-tip { font-size:14px; color:#8a5a2b; background:#FFF8F0; border:1px solid #F5DDBB; border-radius:10px; padding:10px 12px; margin-bottom:8px; line-height:1.6; }

/* ===== ⑬流失预警 + ⑰被遗忘的故事 ===== */
.return-tip {
  background: #FFF4E0;
  border: 1px solid #F5DDB0;
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 10px;
  font-size: 14px;
  color: #8a5a2b;
  line-height: 1.7;
  cursor: pointer;
}
.return-tip .rt-go {
  display: block;
  margin-top: 6px;
  color: #d98e2b;
  font-weight: 600;
  font-size: 13px;
}
.return-story {
  background: #F0F4FF;
  border: 1px solid #D4E0F5;
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 10px;
  font-size: 14px;
  color: #4a5a7a;
  line-height: 1.7;
  cursor: pointer;
}
.return-story .rs-go {
  display: block;
  margin-top: 6px;
  color: #5a7ac0;
  font-weight: 600;
  font-size: 13px;
}

/* ===== ⑥软阻断：舍不得话术提示卡 ===== */
.vip-soft-tip { background:#FFF8E6; border:1px solid #F5D9A8; border-left:4px solid #E8A33D; border-radius:10px; padding:12px 14px; font-size:14px; line-height:1.8; color:#6B4A1D; margin-bottom:12px; }
.vip-soft-tip b { color:#C77A1E; }
.iv-guide-tip { background:#FFF8E6; border:1px solid #F5D9A8; border-left:4px solid #E8A33D; border-radius:10px; padding:10px 12px; font-size:13px; line-height:1.6; color:#6B4A1D; margin-bottom:10px; cursor:pointer; }
.iv-guide-tip::before { content:'🎁 '; }

/* ==================== 第3批：播放器暗色美化 / 离线条 / 金句 / 周年 / 匿名分享 ==================== */

/* ⑪ 暗色播放条（替代原生 audio） */
.tl-item .player {
  display:flex; align-items:center; gap:6px; flex-shrink:0; min-width:150px; max-width:180px;
  background:linear-gradient(135deg,#3D2C1E,#5A4430); border-radius:18px;
  padding:4px 10px; cursor:pointer; box-shadow:0 2px 8px rgba(61,44,30,.25);
}
.tl-item .play-btn {
  font-size:13px; color:#FFB366; width:22px; text-align:center; flex-shrink:0;
}
.tl-item .p-bar {
  flex:1; height:4px; background:rgba(255,255,255,.18); border-radius:2px; overflow:hidden;
}
.tl-item .p-fill {
  display:block; height:100%; width:0%; background:linear-gradient(90deg,#FFB366,#FF8C42);
  border-radius:2px; transition:width .2s linear;
}
.tl-item .p-dur {
  font-size:10px; color:#D8B48C; min-width:56px; text-align:right; flex-shrink:0;
  font-variant-numeric:tabular-nums;
}
.tl-item audio { display:none; }

/* ⑩ 离线/同步提示条 */
.offline-bar {
  background:linear-gradient(135deg,#5A4630,#6B5338); color:#FFE8C8; font-size:13px;
  text-align:center; padding:8px 16px; border-bottom:1px solid rgba(255,180,100,.3);
}
.sync-bar {
  background:linear-gradient(135deg,#E8A33D,#D9822B); color:#fff; font-size:13px;
  text-align:center; padding:8px 16px;
}

/* ⑨ 金句卡片 */
.quote-head {
  font-size:16px; font-weight:700; color:#3D2C1E; margin:16px 0 10px; display:flex; align-items:baseline; gap:8px;
}
.quote-sub { font-size:12px; color:#b8a898; font-weight:400; }
.quote-card-item {
  background:linear-gradient(135deg,#4A3525,#5A4430); border-radius:14px; padding:14px 16px; margin-bottom:10px;
  border-left:4px solid #FFB366; box-shadow:0 3px 12px rgba(61,44,30,.18);
}
.quote-content { font-size:16px; color:#FBF1E2; line-height:1.7; letter-spacing:.3px; }
.quote-actions { display:flex; align-items:center; gap:14px; margin-top:10px; font-size:13px; flex-wrap:wrap; }
.qa-btn { color:#D8B48C; cursor:pointer; user-select:none; -webkit-tap-highlight-color:transparent; }
.qa-btn.on { color:#FFB366; font-weight:600; }
.qa-btn:active { opacity:.6; }
.qa-date { margin-left:auto; color:#8F7357; font-size:12px; }
.mem-actions { margin-top:8px; font-size:13px; text-align:right; }

/* ⑯ 周年回放 */
.anni-audio { margin-top:10px; }
.anni-audio audio { width:100%; height:40px; border-radius:8px; }

/* ㉒ 分享弹窗 */
.share-modal-card h3 { text-align:center; }
.share-url-box { margin:10px 0; }
.share-url-box input {
  width:100%; padding:10px 12px; font-size:13px; color:#5a4a38; background:#FFF8F0;
  border:1px dashed #E8B98A; border-radius:8px; box-sizing:border-box;
}
.share-copy-btn { width:100%; }
.share-close { width:100%; margin-top:10px; }

/* ===== 第4批：㉓ 说话人选择 / 时间胶囊 / 猜猜是谁 ===== */

/* 录音完成弹窗 · 说话人选择 */
.speaker-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:8px 0; }
.spk-item {
  padding:10px 4px; font-size:14px; color:#5a4a38; background:#FFF8F0; border:1px solid #E8D5BC;
  border-radius:10px; cursor:pointer; user-select:none; -webkit-tap-highlight-color:transparent;
}
.spk-item.on { background:#FF7A2F; border-color:#FF7A2F; color:#fff; font-weight:600; }
.spk-item:active { opacity:.7; }
.speaker-custom { display:flex; gap:8px; margin:10px 0 4px; }
.speaker-custom input {
  flex:1; min-width:0; padding:9px 10px; font-size:14px; color:#5a4a38; background:#FFF8F0;
  border:1px solid #E8D5BC; border-radius:8px; box-sizing:border-box;
}
.speaker-custom .btn-outline { flex-shrink:0; padding:8px 12px; font-size:13px; }

/* 时间线 · 说话人标签 */
.spk-tag {
  display:inline-block; margin:6px 6px 0 0; padding:3px 8px; font-size:12px; color:#8a5a2b;
  background:#FFF1E0; border:1px solid #F2D4AE; border-radius:20px; cursor:pointer; user-select:none;
}
.spk-tag.spk-empty { color:#b08a5e; background:#FBFAF7; border-style:dashed; }
.spk-tag:active { opacity:.7; }

/* 时间胶囊弹窗 */
.cap-textarea {
  width:100%; padding:10px 12px; font-size:14px; color:#3D2C1E; background:#FFF8F0;
  border:1px solid #E8D5BC; border-radius:10px; box-sizing:border-box; resize:vertical; line-height:1.6;
}
.cap-add-row { display:flex; gap:8px; margin:10px 0 4px; align-items:center; }
.cap-date { flex:1; min-width:0; padding:9px 10px; font-size:14px; color:#5a4a38; background:#FFF8F0; border:1px solid #E8D5BC; border-radius:8px; }
.cap-add-btn { flex-shrink:0; padding:9px 18px; }
.cap-list { margin-top:10px; border-top:1px dashed #E8D5BC; padding-top:10px; }
.cap-item { border-radius:10px; padding:10px 12px; margin-bottom:8px; font-size:13px; }
.cap-locked { background:#F5F1EA; border:1px solid #E5DCCE; }
.cap-unlocked { background:#FFF7E8; border:1px solid #F2CE8E; }
.cap-opened { background:#FFF3E4; border:1px solid #E8C9A0; }
.cap-head { font-weight:600; color:#3D2C1E; margin-bottom:4px; }
.cap-body { color:#6b5a48; line-height:1.6; word-break:break-all; }
.cap-preview { color:#a39380; font-size:12px; }
.cap-open-btn { margin-top:8px; width:100%; padding:8px 0; font-size:14px; }

/* 猜猜是谁弹窗 */
.guess-score-bar {
  text-align:center; font-size:14px; font-weight:600; color:#8a5a2b; background:#FFF1E0;
  border:1px solid #F2D4AE; border-radius:10px; padding:8px; margin-bottom:10px;
}
.guess-empty { text-align:center; padding:20px 8px; color:#6b5a48; }
.guess-empty-icon { font-size:40px; margin-bottom:8px; }
.guess-audio { margin:6px 0 10px; }
.guess-audio audio { width:100%; height:42px; border-radius:8px; }
.guess-hint { font-size:14px; color:#8a5a2b; margin-bottom:10px; text-align:center; }
.guess-options { display:flex; flex-direction:column; gap:8px; }
.guess-opt {
  padding:12px 0; font-size:16px; color:#3D2C1E; background:#FFF8F0; border:1px solid #E8D5BC;
  border-radius:10px; cursor:pointer; user-select:none; -webkit-tap-highlight-color:transparent;
}
.guess-opt:active { background:#FF7A2F; color:#fff; }
.guess-opt:disabled { opacity:.5; cursor:default; }
.guess-feedback {
  text-align:center; font-size:15px; font-weight:600; padding:10px; border-radius:10px; margin:10px 0 4px;
}
.guess-feedback.ok { color:#1f7a3d; background:#E8F7EC; }
.guess-feedback.no { color:#b04030; background:#FDECEA; }

/* ============ 第4批③⑲：家族共享 / 家族树 ============ */
.family-share-tip { font-size:13px; color:#b0784a; background:#fdf3e7; border:1px dashed #e6c9a8; border-radius:10px; padding:9px 12px; margin-bottom:12px; line-height:1.5; }
.fam-code-box { display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.fam-code { flex:1; font-size:34px; font-weight:800; letter-spacing:6px; text-align:center; color:#FF7A2F; background:#fff7ef; border:2px dashed #f5c9a8; border-radius:12px; padding:14px 6px; font-family:monospace; }
.fam-copy-btn { width:auto; flex-shrink:0; }
.fam-share { margin-bottom:14px; }
.fam-share-title { font-size:14px; font-weight:700; color:#3D2C1E; margin-bottom:6px; }
.fam-share-text { font-size:13px; color:#6b5a4a; background:#f7f2ea; border-radius:8px; padding:9px 11px; line-height:1.6; margin-bottom:8px; word-break:break-all; }
.fam-members { margin-bottom:12px; }
.fam-members-title { font-size:14px; font-weight:700; color:#3D2C1E; margin-bottom:8px; }
.fam-member { display:flex; align-items:center; justify-content:space-between; background:#faf5ee; border-radius:10px; padding:9px 12px; margin-bottom:8px; }
.fam-member-info { display:flex; flex-direction:column; gap:2px; }
.fam-member-name { font-size:15px; font-weight:600; color:#3D2C1E; }
.fam-member-rel { font-size:12px; color:#b8a898; }
.fam-unbind { width:auto; flex-shrink:0; padding:6px 12px; font-size:13px; color:#d96a4a; border-color:#ecc9b8; }
.fam-empty { font-size:13px; color:#b8a898; padding:10px 0; }

.tree-modal-card { max-width:400px; }
.tree-empty { font-size:14px; color:#b0784a; background:#fdf3e7; border:1px dashed #e6c9a8; border-radius:10px; padding:14px; text-align:center; margin-bottom:12px; line-height:1.6; }
.tree-node { margin-bottom:6px; }
.tree-card { display:flex; align-items:center; gap:10px; background:#faf5ee; border:1px solid #f0e3d2; border-radius:12px; padding:10px 12px; }
.tree-root > .tree-card { background:#fff7ef; border-color:#f5c9a8; box-shadow:0 2px 8px rgba(255,122,47,.12); }
.tree-avatar { width:42px; height:42px; border-radius:50%; object-fit:cover; flex-shrink:0; background:#f0e3d2; }
.tree-avatar-emoji { display:flex; align-items:center; justify-content:center; font-size:24px; background:#fff0e0; }
.tree-info { flex:1; display:flex; flex-direction:column; gap:3px; min-width:0; }
.tree-name { font-size:15px; font-weight:700; color:#3D2C1E; }
.tree-rel { font-size:12px; color:#b8a898; }
.tree-count { display:inline-block; margin-top:2px; font-size:12px; color:#FF7A2F; background:#fff0e0; border-radius:20px; padding:2px 9px; cursor:pointer; align-self:flex-start; }
.tree-count.zero { color:#c4b4a2; background:#f3ece2; cursor:default; }
.tree-del { width:26px; height:26px; border:none; border-radius:50%; background:#fbe4dc; color:#d96a4a; font-size:13px; line-height:1; cursor:pointer; flex-shrink:0; }
.tree-children { margin-left:24px; padding-left:14px; border-left:2px solid #f0e3d2; margin-top:8px; display:flex; flex-direction:column; gap:8px; }
.tree-recs { margin-bottom:12px; }
.tree-recs-head { font-size:14px; font-weight:700; color:#3D2C1E; margin-bottom:8px; }
.tree-rec-item { display:flex; justify-content:space-between; align-items:center; background:#faf5ee; border-radius:8px; padding:8px 11px; margin-bottom:6px; gap:8px; }
.tree-rec-title { font-size:13px; color:#3D2C1E; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tree-rec-meta { font-size:12px; color:#b8a898; flex-shrink:0; }
.tree-add { background:#f7f2ea; border-radius:10px; padding:12px; margin-top:10px; }
.tree-add-title { font-size:14px; font-weight:700; color:#3D2C1E; margin-bottom:8px; }
.tree-add-row { display:flex; gap:8px; margin-bottom:8px; }
.tree-add-row input, .tree-add-row select { flex:1; min-width:0; }
.tree-add-btn { width:auto; flex-shrink:0; }

/* ===== ⑭ 回忆礼物（第5批） ===== */
.gift-entry { margin-top:8px; background:#fff7ef; border-color:#FF7A2F; font-size:15px; }
.gift-modal-card { max-width:380px; }
.gift-loading { padding:28px 8px; text-align:center; color:#b08a5c; font-size:15px; }
.gift-empty { padding:18px 4px; text-align:center; color:#8a7a68; font-size:15px; line-height:1.9; }
.gift-empty .btn-primary { width:100%; margin-top:14px; }
.gift-summary {
  background:#FFF3E4; border-radius:12px; padding:14px 16px;
  font-size:16px; line-height:1.9; color:#3D2C1E; margin-bottom:12px;
}
.gift-stats { font-size:14px; color:#8a7a68; margin-bottom:12px; text-align:center; }
.gift-stats b { color:#FF7A2F; font-size:16px; }
.gift-qr-box {
  background:#fff; border:1.5px dashed #e8d8c4; border-radius:12px;
  padding:16px; text-align:center; margin-bottom:12px;
}
.gift-qr { width:190px; height:190px; border-radius:8px; }
.gift-qr-tip { font-size:12px; color:#b8a898; margin-top:8px; line-height:1.6; }
.gift-reg-btn { margin-bottom:10px; }

/* ===== ㉕ AI懂我：小忆记得你（第5批） ===== */
.iv-remember {
  background:linear-gradient(135deg, #FFF3E4, #FFE8D2);
  border:1px solid #FFD9B8; border-radius:12px;
  padding:9px 12px; margin:0 0 10px; font-size:13px; color:#8a5a2b; line-height:1.8;
}
.iv-remember .rem-label { font-weight:700; }
.iv-remember .rem-item {
  display:inline-block; background:#fff; border:1px solid #FFD9B8; color:#b06a2a;
  border-radius:12px; padding:1px 9px; margin:2px 3px 2px 0; font-size:12px;
}

/* ===== 思念TA（v=20260817k） ===== */
.miss-entry {
  margin-top:8px; background:#fff0f6; border-color:#e8678f; color:#c2507a; font-size:15px;
}
.miss-top { margin-bottom:10px; }
.miss-back { font-size:14px; margin-bottom:10px; }
.miss-head {
  display:flex; align-items:center; gap:14px;
  background:linear-gradient(135deg,#ffeef5,#fff7ef);
  border:1px solid #ffd9e4; border-radius:14px; padding:14px;
}
.miss-photo {
  width:72px; height:72px; border-radius:50%; object-fit:cover;
  border:3px solid #fff; box-shadow:0 3px 12px rgba(200,80,120,.25); background:#fff;
}
.miss-info { flex:1; min-width:0; }
.miss-name { font-size:20px; font-weight:700; color:#3D2C1E; }
.miss-relation { font-size:14px; color:#b08a5c; margin-top:3px; }
.miss-setup-photo { text-align:center; margin:10px 0; }
.miss-edit { text-align:right; margin-bottom:6px; }
.miss-edit .btn-outline { font-size:13px; padding:4px 12px; }
.miss-chat {
  max-height:340px; overflow-y:auto; margin:6px 0 10px; padding:6px 2px;
}

/* ===== 思念TA折叠摘要（v=20260817q） ===== */
.miss-summary-head { display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.miss-summary-photo { width:64px; height:64px; border-radius:50%; object-fit:cover; border:3px solid #fff; box-shadow:0 3px 12px rgba(200,80,120,.25); background:#fff; }
.miss-summary-info { flex:1; min-width:0; }
.miss-summary-name { font-size:19px; font-weight:700; color:#3D2C1E; }
.miss-summary-relation { font-size:14px; color:#b08a5c; margin-top:3px; }
.miss-summary-talk { width:100%; margin-bottom:8px; font-size:16px; }
.miss-summary-edit { width:100%; }

/* TA说话动画 */
@keyframes missTalkPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.08); }
}
.miss-photo-wrap { position:relative; width:72px; height:72px; flex:none; }
.miss-photo-wrap .miss-photo { display:block; }
.miss-mouth {
  position:absolute; left:50%; bottom:16%;
  width:20px; height:10px; margin-left:-10px;
  border-radius:50% 50% 60% 60%;
  background:rgba(150,70,70,.85);
  opacity:0; transform:scaleY(.2);
  transition:opacity .15s;
}
.miss-photo-wrap.talking .miss-mouth {
  opacity:1;
  animation: missMouthTalk .38s ease-in-out infinite alternate;
}
@keyframes missMouthTalk {
  from { transform: scaleY(.25); }
  to { transform: scaleY(1.2); }
}
.miss-photo-wrap.talking .miss-photo {
  animation: missTalkPulse 0.8s ease-in-out infinite;
  box-shadow: 0 0 0 6px rgba(255,105,180,.18), 0 3px 14px rgba(200,80,120,.4);
}
.miss-head.talking {
  animation: missTalkPulse 0.8s ease-in-out infinite;
  border-color:#e8678f;
  box-shadow:0 0 0 4px rgba(232,103,143,.12);
}
.miss-empty { text-align:center; color:#b8a898; font-size:14px; padding:24px 0; }
.msg-row { display:flex; margin:8px 0; }
.msg-row.msg-user { justify-content:flex-end; }
.msg-row.msg-ta { justify-content:flex-start; }
.msg-bubble {
  max-width:80%; padding:10px 14px; border-radius:16px;
  font-size:16px; line-height:1.6; word-break:break-word;
}
.msg-bubble-user {
  background:linear-gradient(135deg,#FF7A2F,#ff9a5c); color:#fff;
  border-bottom-right-radius:4px;
}
.msg-bubble-ta {
  background:#FFF3E4; color:#3D2C1E; border:1px solid #FFE3C8;
  border-bottom-left-radius:4px;
}