/* ============================================================
   LinkUp · 我们 — 全局样式
   粉色系 · 简洁可爱 · 发光边框（核心特色）
   ============================================================ */

:root {
  --pink: #FF6B9D;
  --pink-dark: #E7558A;
  --pink-light: #FFE4EC;
  --blue: #4A90D9;
  --yellow: #FFB800;
  --purple: #9B59B6;
  --cyan: #1ABC9C;
  --green: #2ECC71;
  --orange: #F39C12;
  --red: #E74C3C;
  --gray: #666;
  --bg: #FAFAFC;
  --card: #FFFFFF;
  --text: #333333;
  --text-sub: #999AA6;
  --line: #F0EEF3;

  --glow-color: #FF6B9D;
  --glow-blur: 22px;
  --glow-spread: 3px;
  --glow-brightness: 1;

  --radius: 16px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { height: 100%; overflow: hidden; background: var(--bg); color: var(--text); font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", "Microsoft YaHei", sans-serif; -webkit-font-smoothing: antialiased; }
button { font-family: inherit; border: none; background: none; cursor: pointer; color: inherit; }
input, textarea { font-family: inherit; }
iconify-icon { display: inline-flex; vertical-align: middle; }

/* ---------- 发光覆盖层 ---------- */
.glow { position: fixed; inset: 0; pointer-events: none; z-index: 1000; opacity: var(--glow-brightness); }
.glow-frame { position: absolute; inset: 0; box-shadow: inset 0 0 var(--glow-blur) var(--glow-spread) var(--glow-color); }
.island-glow { position: absolute; top: 8px; left: 50%; transform: translateX(-50%); width: 126px; height: 37px; border-radius: 19px; display: none; box-shadow: 0 0 16px 4px var(--glow-color), 0 0 30px 6px var(--glow-color), inset 0 0 10px var(--glow-color); }
.island-glow.show { display: block; }

.glow-anim.mode-breath { animation: breath 3s ease-in-out infinite; }
.glow-anim.mode-steady { animation: none; opacity: 1; }
.glow-anim.mode-blink { animation: blink 0.5s ease-in-out infinite; }
.glow-anim.mode-alert { animation: blink 0.28s linear 3; }
.glow.off .glow-frame { box-shadow: none; }
.glow.off .island-glow { display: none; }

@keyframes breath { 0%,100% { opacity:.6; } 50% { opacity:1; } }
@keyframes blink { 0%,100% { opacity:1; } 50% { opacity:.15; } }

/* ---------- 应用外壳 ---------- */
.app { height: 100%; display: flex; flex-direction: column; padding-top: var(--safe-top); }
.pages { flex: 1; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; padding: 16px 16px 12px; position: relative; }
.page { display: none; animation: fadeIn .25s ease; }
.page.active { display: block; }
@keyframes fadeIn { from { opacity:0; transform: translateY(8px);} to { opacity:1; transform:none;} }

.card { background: var(--card); border-radius: var(--radius); box-shadow: 0 2px 12px rgba(0,0,0,0.08); }
.empty-hint { text-align:center; color: var(--text-sub); font-size:13px; padding:26px 0; }

/* ---------- 底部 Tab ---------- */
.tabbar { display:flex; background:#fff; border-top:1px solid var(--line); padding:7px 4px calc(7px + var(--safe-bottom)); flex-shrink:0; position:relative; }
.tab { flex:1; display:flex; flex-direction:column; align-items:center; gap:3px; font-size:11px; color:#B4B6C2; position:relative; transition: color .2s; }
.tab iconify-icon { font-size:26px; color:#B4B6C2; transition: transform .2s, color .2s; }
.tab.active iconify-icon { transform: scale(1.2); }
.tab.active[data-tab="home"] iconify-icon { color:#E7558A; }
.tab.active[data-tab="chat"] iconify-icon { color:#E6A600; }
.tab.active[data-tab="album"] iconify-icon { color:#3A7FC4; }
.tab.active[data-tab="square"] iconify-icon { color:#8A4EA6; }
.tab.active[data-tab="settings"] iconify-icon { color:#555; }
.tab.active { color:#555; }
.badge { position:absolute; top:-2px; right:20%; min-width:16px; height:16px; padding:0 4px; border-radius:8px; background:#FF4D6A; color:#fff; font-size:10px; line-height:16px; text-align:center; font-style:normal; display:none; }
.badge.show { display:block; }

/* ---------- 首页 ---------- */
.day-count { text-align:center; padding:14px 0 16px; }
.day-big { font-size:48px; font-weight:800; color:var(--pink); line-height:1; }
.day-label { font-size:16px; font-weight:600; margin-top:8px; }
.day-since { font-size:14px; color:var(--text-sub); margin-top:6px; }
.day-extra { font-size:13px; color:var(--text-sub); margin-top:6px; min-height:18px; display:flex; align-items:center; justify-content:center; gap:6px; }

.couple { display:flex; align-items:center; justify-content:center; gap:20px; margin:6px 0 16px; }
.person { display:flex; flex-direction:column; align-items:center; gap:7px; min-width:88px; }
.person-name { font-weight:600; font-size:15px; }
.person-sub { font-size:12px; color:var(--text-sub); text-align:center; line-height:1.5; max-width:130px; }
.couple-heart { animation: heartbeat 1.6s ease-in-out infinite; }
@keyframes heartbeat { 0%,100%{transform:scale(1);} 14%{transform:scale(1.22);} 28%{transform:scale(1);} 42%{transform:scale(1.16);} 56%{transform:scale(1);} }

.avatar { width:80px; height:80px; border-radius:50%; display:flex; align-items:center; justify-content:center; overflow:hidden; box-shadow:0 6px 16px rgba(0,0,0,0.08); }
.avatar-sm { width:38px; height:38px; }
.avatar img { width:100%; height:100%; object-fit:cover; }
.avatar-me { background:linear-gradient(135deg,#FF6B9D,#FF9BB8); }
.avatar-ta { background:linear-gradient(135deg,#C86BFF,#9B8CFF); }

.distance-pill { display:flex; align-items:center; justify-content:center; gap:8px; padding:11px; font-size:14px; font-weight:600; margin-bottom:16px; }

.quick-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:18px; }
.quick-card { display:flex; flex-direction:column; align-items:center; gap:7px; padding:14px 4px; border-radius:16px; background:#fff; box-shadow:0 2px 12px rgba(0,0,0,0.08); transition:transform .15s; }
.quick-card:active { transform:scale(.93); }
.quick-card iconify-icon { font-size:32px; }
.quick-card span { font-size:12px; color:var(--text); }

.feed { padding:14px 16px; }
.feed-head { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.feed-title { font-size:15px; font-weight:700; }
.feed-item { display:flex; align-items:center; gap:10px; padding:9px 0; border-bottom:1px solid var(--line); }
.feed-item:last-child { border-bottom:none; }
.feed-item iconify-icon { font-size:22px; flex-shrink:0; }
.feed-item .fi-text { flex:1; font-size:14px; }
.feed-item .fi-time { font-size:11px; color:var(--text-sub); }

/* ---------- 聊天 ---------- */
.chat-head { display:flex; align-items:center; gap:10px; padding:4px 2px 12px; border-bottom:1px solid var(--line); margin-bottom:10px; }
.chat-head-info { flex:1; }
.chat-head-name { font-weight:700; font-size:16px; }
.chat-head-status { font-size:12px; color:var(--text-sub); display:flex; align-items:center; gap:4px; }
.chat-head-status.online::before { content:""; width:7px; height:7px; border-radius:50%; background:#2ECC71; }
.chat-call { width:40px; height:40px; border-radius:50%; background:var(--pink-light); display:flex; align-items:center; justify-content:center; }

.chat-body { display:flex; flex-direction:column; gap:10px; padding-bottom:12px; }
.msg { display:flex; }
.msg.me { justify-content:flex-end; }
.msg.ta { justify-content:flex-start; }
.bubble { max-width:76%; padding:10px 13px; border-radius:16px; font-size:15px; line-height:1.45; word-break:break-word; box-shadow:0 2px 8px rgba(0,0,0,0.05); position:relative; }
.msg.me .bubble { background:linear-gradient(135deg,#FF6B9D,#FF8FB3); color:#fff; border-bottom-right-radius:4px; }
.msg.ta .bubble { background:#fff; color:var(--text); border-bottom-left-radius:4px; }
.bubble .msg-time { display:block; font-size:10px; opacity:.65; margin-top:4px; text-align:right; }
.bubble-img { padding:4px; }
.bubble-img img { width:200px; max-width:200px; border-radius:12px; display:block; }
.bubble-loc { min-width:170px; }
.bubble-loc .loc-name { font-weight:600; }
.bubble-loc .loc-coord { font-size:11px; opacity:.75; }
.bubble-voice { display:flex; align-items:center; gap:8px; min-width:120px; }
.bubble-voice .waves { display:flex; align-items:center; gap:2px; height:22px; }
.bubble-voice .waves i { width:3px; background:currentColor; border-radius:2px; opacity:.85; }
.bubble-voice .v-dur { font-size:12px; }
.bubble-note { display:flex; align-items:center; gap:8px; cursor:pointer; }
.bubble-note .note-open { font-size:13px; }
.bubble-video { position:relative; padding:4px; }
.bubble-video video { width:200px; border-radius:12px; display:block; }
.bubble-video .play-ico { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); }

.chat-input { display:flex; align-items:center; gap:8px; padding:8px 0 calc(6px); }
.chat-input input { flex:1; border:1px solid #E7E5EA; background:#fff; border-radius:20px; padding:10px 15px; font-size:15px; outline:none; }
.chat-input input:focus { border-color:var(--pink); }
.chat-plus, .chat-send, .chat-voice { width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.chat-plus { background:#F2F1F5; }
.chat-send, .chat-voice { background:var(--pink); }

/* ---------- 相册 ---------- */
.album-tabs { display:flex; background:#fff; border-radius:12px; padding:4px; margin-bottom:12px; box-shadow:0 2px 8px rgba(0,0,0,0.05); }
.album-tab { flex:1; padding:9px; border-radius:10px; font-size:14px; color:var(--text-sub); }
.album-tab.active { background:var(--pink); color:#fff; font-weight:600; }
.album-stats { font-size:12px; color:var(--text-sub); text-align:center; margin-bottom:12px; }

.masonry { column-count:2; column-gap:10px; }
.masonry-item { break-inside:avoid; margin-bottom:10px; position:relative; border-radius:12px; overflow:hidden; background:#eee; }
.masonry-item img, .masonry-item video { width:100%; display:block; }
.masonry-item .mi-badge { position:absolute; right:6px; bottom:6px; width:22px; height:22px; border-radius:50%; overflow:hidden; border:2px solid #fff; }
.masonry-item .mi-video { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); }
.masonry-item .mi-video iconify-icon { font-size:30px; }
.month-sep { grid-column:1/-1; font-size:13px; font-weight:700; color:var(--text-sub); padding:8px 2px 4px; }
.masonry { display:block; }
.month-sep { display:block; margin:6px 0 4px; }

.album-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.album-cover { border-radius:14px; overflow:hidden; box-shadow:0 2px 10px rgba(0,0,0,0.08); position:relative; }
.album-cover img { width:100%; height:110px; object-fit:cover; display:block; }
.album-cover .ac-info { padding:8px 10px; background:#fff; }
.album-cover .ac-title { font-size:13px; font-weight:600; }
.album-cover .ac-count { font-size:11px; color:var(--text-sub); }

.fab { position:fixed; right:20px; bottom:calc(90px + var(--safe-bottom)); width:52px; height:52px; border-radius:50%; background:var(--pink); box-shadow:0 6px 18px rgba(255,107,157,.4); display:flex; align-items:center; justify-content:center; z-index:500; }

/* ---------- 广场 ---------- */
.square-title { font-size:18px; font-weight:700; margin:6px 2px 14px; }
.square-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.sq-card { border-radius:16px; padding:18px 14px; box-shadow:0 2px 12px rgba(0,0,0,0.08); display:flex; flex-direction:column; gap:8px; transition:transform .15s; }
.sq-card:active { transform:scale(.95); }
.sq-card iconify-icon { font-size:32px; }
.sq-card .sq-title { font-size:15px; font-weight:700; }
.sq-card .sq-desc { font-size:12px; color:var(--text-sub); line-height:1.4; }

/* ---------- 子页面 ---------- */
.sub-head { display:flex; align-items:center; gap:10px; padding:2px 0 14px; }
.back-btn, .head-add { width:36px; height:36px; border-radius:50%; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,0.06); display:flex; align-items:center; justify-content:center; }
.sub-title { flex:1; font-size:18px; font-weight:700; }
.sec-title { font-size:15px; font-weight:700; margin:18px 2px 12px; }

/* 报备 */
.map-wrap { height:190px; position:relative; overflow:hidden; margin-bottom:12px; }
#map { position:absolute; inset:0; }
.map-fallback { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:var(--text-sub); font-size:13px; background:linear-gradient(135deg,#F5F7FF,#FDF2F6); }
.map-caption { text-align:center; font-size:13px; margin-bottom:12px; }
.btn-report { width:100%; height:60px; border-radius:30px; background:linear-gradient(135deg,#FF6B9D,#C86BFF); color:#fff; font-size:18px; font-weight:700; display:flex; align-items:center; justify-content:center; gap:10px; box-shadow:0 10px 24px rgba(255,107,157,.4); }
.btn-report:active { transform:scale(.97); }

.timeline { display:flex; flex-direction:column; gap:10px; }
.tl-item { display:flex; align-items:flex-start; gap:11px; }
.tl-time { font-size:11px; color:var(--text-sub); min-width:44px; padding-top:7px; }
.tl-dot { width:10px; height:10px; border-radius:50%; margin-top:8px; flex-shrink:0; }
.tl-card { flex:1; padding:10px 13px; border-radius:12px; color:#fff; font-size:14px; box-shadow:0 3px 10px rgba(0,0,0,.07); }
.tl-card .tl-tag { font-weight:700; }
.tl-card .tl-loc { font-size:12px; opacity:.9; margin-top:3px; }
.tl-card .tl-who { font-size:11px; opacity:.8; margin-top:3px; }
.tl-card img { width:60px; height:60px; border-radius:8px; object-fit:cover; margin-top:6px; display:block; }

/* 恋爱清单 */
.progress-block { padding:14px 16px; margin-bottom:14px; }
.progress-text { font-size:14px; font-weight:600; margin-bottom:8px; }
.progress-bar { height:10px; background:var(--pink-light); border-radius:5px; overflow:hidden; }
.progress-fill { height:100%; width:0; background:linear-gradient(90deg,#FF6B9D,#C86BFF); border-radius:5px; transition:width .3s; }
.wishlist { display:flex; flex-direction:column; gap:2px; }
.wish-item { display:flex; align-items:center; gap:12px; padding:13px 4px; border-bottom:1px solid var(--line); }
.wish-check { width:24px; height:24px; border-radius:50%; border:2px solid #DDD; flex-shrink:0; display:flex; align-items:center; justify-content:center; transition:.2s; }
.wish-check.done { background:var(--pink); border-color:var(--pink); }
.wish-check.done iconify-icon { font-size:14px; color:#fff; }
.wish-text { flex:1; font-size:15px; }
.wish-text.done { color:var(--text-sub); text-decoration:line-through; }
.wish-date { font-size:11px; color:var(--text-sub); }
.btn-block { width:100%; margin-top:14px; padding:14px; border-radius:14px; border:1.5px dashed #DDD; color:var(--pink); font-size:15px; font-weight:600; }

/* 纪念日 */
.anni-list { display:flex; flex-direction:column; gap:12px; }
.anni-card { display:flex; align-items:center; gap:14px; padding:16px; }
.anni-ico { width:46px; height:46px; border-radius:14px; display:flex; align-items:center; justify-content:center; }
.anni-info { flex:1; }
.anni-title { font-size:15px; font-weight:700; }
.anni-date { font-size:12px; color:var(--text-sub); margin-top:3px; }
.anni-days { font-size:20px; font-weight:800; color:var(--pink); }

/* 游戏 */
.game-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-bottom:14px; }
.game-card { display:flex; flex-direction:column; align-items:center; gap:10px; padding:20px 10px; border-radius:16px; background:#fff; box-shadow:0 2px 12px rgba(0,0,0,.08); font-size:14px; font-weight:600; }
.game-card:active { transform:scale(.95); }
.game-stage { padding:18px; min-height:200px; }
.game-stage .g-title { font-size:16px; font-weight:700; margin-bottom:12px; }
.truth-question { background:var(--pink-light); border-radius:14px; padding:24px 18px; text-align:center; font-size:17px; font-weight:600; line-height:1.6; margin-bottom:14px; }
.difficulty-tags { display:flex; gap:8px; justify-content:center; margin-bottom:12px; }
.diff-tag { padding:6px 14px; border-radius:16px; font-size:13px; background:#F2F1F5; color:var(--text-sub); }
.diff-tag.active { background:var(--pink); color:#fff; }
.game-btn { display:block; margin:0 auto; padding:11px 28px; border-radius:22px; background:var(--pink); color:#fff; font-size:15px; font-weight:600; }
.dice-row { display:flex; gap:16px; justify-content:center; margin:20px 0; }
.dice { width:72px; height:72px; border-radius:16px; background:#fff; box-shadow:0 4px 14px rgba(0,0,0,.12); display:flex; align-items:center; justify-content:center; font-size:34px; font-weight:800; }

/* 心情 */
.mood-question { font-size:16px; font-weight:700; text-align:center; margin:6px 0 16px; }
.mood-grid { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-bottom:16px; }
.mood-btn { width:60px; display:flex; flex-direction:column; align-items:center; gap:6px; padding:12px 0; border-radius:16px; background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.08); transition:transform .15s; }
.mood-btn:active { transform:scale(.9); }
.mood-btn.selected { box-shadow:0 0 0 2px var(--pink); }
.mood-btn iconify-icon { font-size:30px; }
.mood-btn span { font-size:12px; }
.mood-ta { text-align:center; font-size:14px; color:var(--text-sub); margin-bottom:14px; }
.mood-calendar { padding:14px; }
.mood-cal-head { text-align:center; font-size:14px; font-weight:700; margin-bottom:10px; }
.mood-week { display:grid; grid-template-columns:repeat(7,1fr); text-align:center; font-size:11px; color:var(--text-sub); margin-bottom:6px; }
.mood-days { display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.mood-day { aspect-ratio:1; display:flex; align-items:center; justify-content:center; font-size:13px; position:relative; border-radius:8px; }
.mood-day .dot { position:absolute; bottom:3px; width:6px; height:6px; border-radius:50%; }

/* 待办 */
.todo-tabs { display:flex; background:#fff; border-radius:12px; padding:4px; margin-bottom:12px; }
.todo-tab { flex:1; padding:9px; border-radius:10px; font-size:14px; color:var(--text-sub); }
.todo-tab.active { background:var(--pink); color:#fff; font-weight:600; }
.todo-list { display:flex; flex-direction:column; }
.todo-item { display:flex; align-items:center; gap:12px; padding:14px 4px; border-bottom:1px solid var(--line); }
.todo-check { width:24px; height:24px; border-radius:50%; border:2px solid #DDD; flex-shrink:0; }
.todo-check.done { background:var(--green); border-color:var(--green); display:flex; align-items:center; justify-content:center; }
.todo-check.done iconify-icon { font-size:14px; color:#fff; }
.todo-item .td-text { flex:1; font-size:15px; }
.todo-item .td-text.done { color:var(--text-sub); text-decoration:line-through; }
.todo-item .td-by { font-size:11px; color:var(--text-sub); }
.todo-del { color:#CCC; font-size:18px; padding:4px; }
.todo-add { display:flex; gap:8px; margin-top:14px; }
.todo-add input { flex:1; border:1px solid #E7E5EA; border-radius:12px; padding:11px 14px; font-size:15px; outline:none; }
.todo-add button { width:44px; height:44px; border-radius:12px; background:var(--pink); display:flex; align-items:center; justify-content:center; }

/* 礼物 */
.gift-tabs { display:flex; background:#fff; border-radius:12px; padding:4px; margin-bottom:12px; }
.gift-tab { flex:1; padding:9px; border-radius:10px; font-size:14px; color:var(--text-sub); }
.gift-tab.active { background:var(--pink); color:#fff; font-weight:600; }
.gift-list { display:flex; flex-direction:column; gap:12px; }
.gift-card { display:flex; align-items:center; gap:12px; padding:14px; }
.gift-ico { width:44px; height:44px; border-radius:12px; background:var(--pink-light); display:flex; align-items:center; justify-content:center; }
.gift-info { flex:1; }
.gift-name { font-size:15px; font-weight:600; }
.gift-price { font-size:13px; color:var(--pink); margin-top:3px; }
.gift-link { font-size:12px; color:var(--blue); margin-top:2px; word-break:break-all; }
.gift-status { font-size:12px; padding:4px 10px; border-radius:12px; }

/* 日历 */
.cal-nav { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.cal-nav button { width:34px; height:34px; border-radius:50%; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.06); display:flex; align-items:center; justify-content:center; }
.cal-month { font-size:16px; font-weight:700; }
.cal-week { display:grid; grid-template-columns:repeat(7,1fr); text-align:center; font-size:11px; color:var(--text-sub); margin-bottom:4px; }
.cal-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:3px; }
.cal-cell { aspect-ratio:1; display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:14px; border-radius:10px; position:relative; }
.cal-cell.other { color:#DDD; }
.cal-cell.today { background:var(--pink-light); font-weight:700; }
.cal-cell .dots { display:flex; gap:2px; position:absolute; bottom:3px; }
.cal-cell .dots i { width:4px; height:4px; border-radius:50%; }
.cal-events { margin-top:12px; display:flex; flex-direction:column; gap:8px; }
.cal-event { display:flex; align-items:center; gap:10px; padding:11px 13px; border-radius:12px; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.cal-event .ce-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.cal-event .ce-text { flex:1; font-size:14px; }
.cal-event .ce-time { font-size:12px; color:var(--text-sub); }

/* 互动 */
.interact-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-bottom:18px; }
.interact-btn { display:flex; flex-direction:column; align-items:center; gap:10px; padding:24px 10px; border-radius:20px; background:#fff; box-shadow:0 4px 16px rgba(0,0,0,.08); font-size:15px; font-weight:600; transition:transform .15s; }
.interact-btn:active { transform:scale(.92); }
.interact-log { padding:14px; }
.interact-log .il-head { font-size:14px; font-weight:700; margin-bottom:8px; }
.il-item { display:flex; gap:8px; padding:8px 0; font-size:13px; border-bottom:1px solid var(--line); }
.il-item:last-child { border-bottom:none; }
.il-item .il-time { color:var(--text-sub); font-size:11px; }

/* 锁机 */
.lock-explain { padding:14px 16px; font-size:14px; color:var(--text-sub); margin-bottom:16px; line-height:1.6; }
.lock-dur { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-bottom:20px; }
.lock-opt { padding:16px; border-radius:14px; background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.08); font-size:15px; font-weight:600; }
.lock-opt.active { box-shadow:0 0 0 2px var(--pink); color:var(--pink); }
.btn-lock { width:100%; height:54px; border-radius:27px; background:linear-gradient(135deg,#555,#333); color:#fff; font-size:16px; font-weight:700; display:flex; align-items:center; justify-content:center; gap:10px; }
.lock-status { text-align:center; margin-top:14px; font-size:14px; color:var(--text-sub); }

/* ---------- 设置 ---------- */
.settings-list { display:flex; flex-direction:column; gap:14px; }
.set-group { padding:4px 16px; }
.set-group .sg-title { font-size:13px; font-weight:700; color:var(--pink); padding:10px 0 4px; }
.set-row { display:flex; align-items:center; justify-content:space-between; min-height:48px; gap:12px; border-bottom:1px solid var(--line); }
.set-row:last-child { border-bottom:none; }
.set-label { font-size:15px; }
.set-val { font-size:14px; color:var(--text-sub); display:flex; align-items:center; gap:6px; }
.set-val iconify-icon { font-size:16px; }
.color-dot { width:20px; height:20px; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px #EEE; }
.avatar-mini { width:36px; height:36px; border-radius:50%; overflow:hidden; }
.avatar-mini img { width:100%; height:100%; object-fit:cover; }

/* 开关 */
.switch { position:relative; display:inline-block; width:48px; height:28px; }
.switch input { opacity:0; width:0; height:0; }
.switch .slider { position:absolute; inset:0; background:#E4E4EC; border-radius:28px; transition:.25s; }
.switch .slider:before { content:""; position:absolute; width:22px; height:22px; left:3px; top:3px; background:#fff; border-radius:50%; transition:.25s; box-shadow:0 1px 4px rgba(0,0,0,.15); }
.switch input:checked + .slider { background:var(--pink); }
.switch input:checked + .slider:before { transform:translateX(20px); }

/* ---------- 弹层 ---------- */
.sheet-mask { position:fixed; inset:0; background:rgba(0,0,0,.4); display:none; align-items:flex-end; z-index:1100; }
.sheet-mask.show { display:flex; }
.sheet { width:100%; background:#fff; border-radius:22px 22px 0 0; padding:22px 20px calc(20px + var(--safe-bottom)); animation:slideUp .28s ease; max-height:80vh; overflow-y:auto; }
@keyframes slideUp { from { transform:translateY(100%);} to { transform:none;} }
.sheet-title { font-size:17px; font-weight:700; margin-bottom:14px; }
.tag-scroll { display:flex; gap:10px; overflow-x:auto; padding-bottom:6px; margin-bottom:14px; -webkit-overflow-scrolling:touch; }
.tag-chip { flex-shrink:0; display:flex; flex-direction:column; align-items:center; gap:6px; padding:12px 14px; border-radius:16px; color:#fff; font-size:13px; font-weight:600; }
.tag-chip.selected { box-shadow:0 0 0 3px rgba(0,0,0,.18); }
.sheet-input { width:100%; border:1px solid #EEE; border-radius:12px; padding:12px 14px; font-size:15px; outline:none; margin-bottom:12px; }
.sheet-photo { width:100%; display:flex; align-items:center; justify-content:center; gap:8px; padding:12px; border-radius:12px; border:1.5px dashed #DDD; color:var(--text-sub); font-size:14px; margin-bottom:12px; }
.sheet-confirm { width:100%; padding:15px; border-radius:14px; background:linear-gradient(135deg,#FF6B9D,#C86BFF); color:#fff; font-size:16px; font-weight:700; }

.chat-panel-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.cp-item { display:flex; flex-direction:column; align-items:center; gap:8px; padding:16px 0; border-radius:14px; background:#FAFAFC; }
.cp-item span { font-size:12px; color:var(--text); }

/* ---------- 图片查看器 ---------- */
.viewer { position:fixed; inset:0; background:rgba(0,0,0,.94); z-index:1300; display:none; flex-direction:column; }
.viewer.show { display:flex; }
.viewer-head { display:flex; justify-content:flex-end; padding:calc(10px + var(--safe-top)) 16px 0; }
.viewer-stage { flex:1; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.viewer-stage img, .viewer-stage video { max-width:100%; max-height:100%; }
.viewer-foot { padding:14px 16px calc(14px + var(--safe-bottom)); color:#fff; font-size:13px; text-align:center; }

/* ---------- 爱心 / 想你了 ---------- */
.heart-rain { position:fixed; inset:0; pointer-events:none; z-index:1250; overflow:hidden; }
.hr-heart { position:absolute; top:-50px; animation:fall linear forwards; }
.hr-heart iconify-icon { font-size:26px; }
@keyframes fall { to { transform:translateY(120vh) rotate(360deg); opacity:0; } }

.missyou-overlay { position:fixed; inset:0; background:rgba(255,107,157,.12); z-index:1260; display:none; flex-direction:column; align-items:center; justify-content:center; gap:12px; pointer-events:none; }
.missyou-overlay.show { display:flex; }
.missyou-overlay iconify-icon { animation:heartbeat 1s ease-in-out infinite; }
.missyou-text { font-size:32px; font-weight:800; color:var(--pink); letter-spacing:2px; }

/* ---------- 录音 ---------- */
.recording { position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); background:rgba(0,0,0,.82); color:#fff; border-radius:20px; padding:20px 26px; z-index:1200; display:none; flex-direction:column; align-items:center; gap:8px; }
.recording.show { display:flex; }
.rec-dot { width:14px; height:14px; border-radius:50%; background:#FF4D6A; animation:recpulse 1s infinite; }
@keyframes recpulse { 0%,100%{opacity:1;} 50%{opacity:.2;} }
.rec-time { font-size:22px; font-weight:700; }
.rec-hint { font-size:12px; opacity:.7; }

/* ---------- toast ---------- */
.toast { position:fixed; left:50%; bottom:110px; transform:translateX(-50%) translateY(20px); background:rgba(51,51,51,.92); color:#fff; padding:10px 18px; border-radius:22px; font-size:14px; opacity:0; pointer-events:none; transition:.25s; z-index:1400; max-width:82%; text-align:center; }
.toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

/* ---------- 弹窗输入 ---------- */
.dialog-mask { position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:1200; display:none; align-items:center; justify-content:center; padding:24px; }
.dialog-mask.show { display:flex; }
.dialog { width:100%; background:#fff; border-radius:18px; padding:20px; }
.dialog-title { font-size:16px; font-weight:700; margin-bottom:14px; }
.dialog input, .dialog textarea { width:100%; border:1px solid #EEE; border-radius:12px; padding:11px 14px; font-size:15px; outline:none; margin-bottom:10px; }
.dialog input:focus { border-color:var(--pink); }
.dialog-btns { display:flex; gap:10px; }
.dialog-btns button { flex:1; padding:12px; border-radius:12px; font-size:15px; font-weight:600; }
.dialog-btns .d-cancel { background:#F2F1F5; color:var(--text-sub); }
.dialog-btns .d-ok { background:var(--pink); color:#fff; }

@media (max-width:360px) {
  .day-big { font-size:40px; }
  .quick-grid { gap:8px; }
  .couple { gap:12px; }
}