/* 情侣小屋 · 样式表 */
:root{
  --accent: #d94f70;
  --accent-ink: #ffffff;
  --bg1: #fdf8fa;
  --bg2: #f6f3fc;
  --card: #ffffff;
  --text: #3a3038;
  --muted: #8d8394;
  --line: #f1e7ed;
  --line-soft: #f7f1f4;
  --radius: 18px;
  --radius-sm: 12px;
  --shadow: 0 8px 30px rgba(176,138,160,.10);
  --shadow-lg: 0 18px 50px rgba(176,138,160,.16);
  --ok: #2f9e6f;
  --warn: #d9822b;
  --danger: #d64545;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color:var(--text);
  background:linear-gradient(165deg,var(--bg1) 0%,var(--bg2) 100%);
  background-attachment:fixed;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  font-size:15px;
  line-height:1.65;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(52vw 40vw at 8% -6%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 70%),
    radial-gradient(46vw 36vw at 104% 4%, color-mix(in srgb, var(--accent) 9%, transparent), transparent 68%);
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit;color:inherit}

.wrap{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:0 20px 64px}

/* ---------- 顶部导航 ---------- */
.nav{
  position:sticky;top:0;z-index:40;
  background:color-mix(in srgb, #fff 82%, transparent);
  backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line-soft);
}
.nav-inner{
  max-width:1120px;margin:0 auto;padding:11px 20px;
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.3px}
.brand .dot{
  width:26px;height:26px;border-radius:9px;flex:0 0 auto;
  background:linear-gradient(140deg,var(--accent),color-mix(in srgb,var(--accent) 55%,#fff));
  box-shadow:0 4px 12px color-mix(in srgb,var(--accent) 35%,transparent);
}
/* 站点 logo：一颗爱心 */
.brand .brand-heart{
  width:26px;height:26px;flex:0 0 auto;overflow:visible;
  filter:drop-shadow(0 4px 10px color-mix(in srgb,var(--accent) 38%,transparent));
  transition:transform .25s;
}
.brand:hover .brand-heart{transform:scale(1.08)}
.brand .name{font-size:15.5px}
.brand .sub{font-size:11px;color:var(--muted);font-weight:400;letter-spacing:0}
.nav-links{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap;overflow-x:auto;scrollbar-width:none}
.nav-links::-webkit-scrollbar{display:none}
.nav-links a{
  padding:7px 13px;border-radius:11px;font-size:14px;color:var(--muted);
  white-space:nowrap;transition:.18s;
}
.nav-links a:hover{background:var(--line-soft);color:var(--text)}
.nav-links a.active{
  background:color-mix(in srgb,var(--accent) 12%,transparent);
  color:var(--accent);font-weight:600;
}
/* 导航右侧「我」的小名牌 */
.nav-links a.me-chip{
  display:flex;align-items:center;gap:6px;
  background:color-mix(in srgb,var(--accent) 10%,transparent);
  color:var(--accent);font-weight:650;
}
.nav-links a.me-chip:hover{background:color-mix(in srgb,var(--accent) 18%,transparent)}
.nav-links a.me-chip .me-dot{
  width:19px;height:19px;border-radius:50%;flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;
  background:var(--accent);color:#fff;font-size:11.5px;font-weight:700;
}
/* 只能看不能改的区块（对方的信息 / 心动值 / 心情） */
.read-only{position:relative}
.read-only input, .read-only select, .read-only textarea{
  background:var(--line-soft);color:var(--muted);cursor:not-allowed;
}
.read-only input[type=range]{opacity:.6}
.read-only .label, .read-only .group-title{opacity:.72}
input:disabled, select:disabled, textarea:disabled{
  background:var(--line-soft);color:var(--muted);cursor:not-allowed;
  -webkit-text-fill-color:var(--muted);opacity:1;
}

/* ---------- 分页（个人信息：一人一页） ---------- */
.seg{
  display:flex;gap:6px;padding:5px;border-radius:15px;
  background:var(--line-soft);border:1px solid color-mix(in srgb,var(--accent) 8%,var(--line));
}
.seg-btn{
  flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 12px;border:none;border-radius:11px;background:none;cursor:pointer;
  font-size:14px;font-weight:600;color:var(--muted);transition:background .16s,color .16s,box-shadow .16s;
  white-space:nowrap;overflow:hidden;
}
.seg-btn:hover{color:var(--text)}
.seg-btn.active{
  background:#fff;color:var(--text);
  box-shadow:0 2px 10px rgba(176,138,160,.16);
}
.seg-btn.active .seg-num{color:var(--accent)}
.seg-num{
  font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.3px;
  padding:1px 7px;border-radius:99px;background:var(--line-soft);
}
.seg-btn.active .seg-num{background:color-mix(in srgb,var(--accent) 12%,transparent)}
.seg-sub{
  font-size:10.5px;font-weight:500;color:var(--muted);
  padding:1px 7px;border-radius:99px;border:1px solid var(--line);
}
.bar-row{display:flex;align-items:center;gap:14px;margin-top:14px}
.bar-row .bar{flex:1;min-width:0}
.tab-panel.hidden{display:none}
.ro-value{
  min-height:41px;display:flex;align-items:center;
  padding:9px 12px;border-radius:11px;font-size:14.5px;line-height:1.5;
  background:var(--line-soft);color:var(--text);white-space:pre-wrap;word-break:break-word;
}
.ro-value.empty{color:#bdb3bf}

/* ---------- 通用卡片 ---------- */
.card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:22px;margin:18px 0;
}
.card.tight{padding:16px}
.card-head{display:flex;align-items:center;gap:10px;margin:0 0 14px}
.card-head h2,.card-head h3{margin:0;font-size:16px;letter-spacing:.4px}
.card-head .sub{font-size:12.5px;color:var(--muted);margin-left:auto}
.section-title{
  font-size:13px;letter-spacing:2.5px;color:var(--muted);margin:30px 0 6px;
  text-transform:uppercase;font-weight:600;
}

/* ---------- 主页 hero ---------- */
.hero{
  display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  padding:30px 28px;border-radius:24px;margin-top:22px;
  background:linear-gradient(135deg,#fff,color-mix(in srgb,var(--accent) 7%,#fff));
  border:1px solid var(--line);box-shadow:var(--shadow-lg);
}
.couple{display:flex;align-items:center;gap:14px}
.person{text-align:center}
.avatar{
  width:78px;height:78px;border-radius:50%;overflow:hidden;margin:0 auto 8px;
  border:3px solid #fff;box-shadow:0 6px 20px rgba(176,138,160,.28);
  background:linear-gradient(140deg,color-mix(in srgb,var(--accent) 22%,#fff),#fff);
  display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--accent);
}
.avatar img{width:100%;height:100%;object-fit:cover}
.avatar.small{width:46px;height:46px;font-size:16px;border-width:2px}
.person .pname{font-size:13.5px;color:var(--muted)}
.heart{font-size:22px;color:var(--accent);opacity:.65}
.hero-count{flex:1;min-width:230px;text-align:center}
.hero-count .label{font-size:12.5px;color:var(--muted);letter-spacing:2px}
.hero-count .big{
  font-size:clamp(40px,8vw,62px);font-weight:800;line-height:1.06;
  color:var(--accent);letter-spacing:-1px;
  font-variant-numeric:tabular-nums;
}
.hero-count .big small{font-size:17px;font-weight:600;margin-left:6px;letter-spacing:0}
.hero-count .sub{font-size:12.5px;color:var(--muted);margin-top:8px}
/* 主页 hero：头像居中，天数在下方 */
.hero.hero-center{flex-direction:column;justify-content:center;gap:16px;padding:30px 28px 34px}
.hero.hero-center .couple{justify-content:center;gap:18px}
.hero.hero-center .hero-count{flex:0 1 auto;min-width:0;width:100%}

/* ---------- 概览小卡 ---------- */
.mini-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.mini{
  background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px;
  box-shadow:var(--shadow);
}
.mini .k{font-size:12px;color:var(--muted)}
.mini .v{font-size:20px;font-weight:700;margin-top:3px;font-variant-numeric:tabular-nums}
.mini .v small{font-size:12px;font-weight:500;color:var(--muted);margin-left:3px}

/* ---------- 纪念日 ---------- */
.anniv-list{display:grid;gap:12px}
.anniv{
  display:flex;align-items:center;gap:16px;padding:16px 18px;border-radius:16px;
  background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);
}
.anniv.is-today{border-color:color-mix(in srgb,var(--accent) 45%,#fff);
  background:linear-gradient(135deg,#fff,color-mix(in srgb,var(--accent) 8%,#fff))}
.anniv .icon{font-size:22px;width:34px;text-align:center;flex:0 0 auto}
.anniv .body{flex:1;min-width:0}
.anniv .t{font-weight:650;font-size:15px}
.anniv .d{font-size:12.5px;color:var(--muted);margin-top:2px}
.anniv .count{text-align:right;flex:0 0 auto}
.anniv .count .n{font-size:22px;font-weight:800;color:var(--accent);
  font-variant-numeric:tabular-nums;line-height:1.2}
.anniv .count .u{font-size:11.5px;color:var(--muted)}
.anniv .count.muted .n{color:var(--muted)}
.anniv.past{opacity:.62}

/* ---------- 相册 ---------- */
.photo-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;
}
/* 相册页大图模式 */
.photo-grid.large{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.photo{
  position:relative;border-radius:14px;overflow:hidden;background:var(--line-soft);
  aspect-ratio:1/1;box-shadow:var(--shadow);border:1px solid var(--line);
}
.photo img{width:100%;height:100%;object-fit:cover;cursor:zoom-in;transition:.35s}
.photo:hover img{transform:scale(1.045)}
.photo .cap{
  position:absolute;left:0;right:0;bottom:0;padding:16px 10px 8px;color:#fff;font-size:12px;
  background:linear-gradient(transparent,rgba(0,0,0,.62));white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;pointer-events:none;
}
.photo .check{
  position:absolute;top:8px;left:8px;width:22px;height:22px;border-radius:7px;
  background:rgba(255,255,255,.85);border:1px solid #fff;opacity:0;transition:.18s;cursor:pointer;
}
.photo:hover .check,.photo.sel .check{opacity:1}
.photo.sel{outline:3px solid var(--accent);outline-offset:-3px}
.photo.sel .check{background:var(--accent);border-color:var(--accent)}
.photo.sel .check::after{content:"✓";color:#fff;font-size:14px;line-height:20px;display:block;text-align:center}

.drop{
  border:2px dashed var(--line);border-radius:var(--radius);padding:26px;text-align:center;
  color:var(--muted);background:#fff;transition:.2s;cursor:pointer;
}
.drop:hover,.drop.over{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 5%,#fff);color:var(--accent)}
.drop .big{font-size:15px;color:var(--text);font-weight:600;margin-bottom:4px}
.drop .hint{font-size:12.5px}

/* 灯箱 */
.lightbox{
  position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;
  background:rgba(28,20,26,.86);backdrop-filter:blur(6px);padding:24px;
}
.lightbox.on{display:flex}
.lightbox img{max-width:92vw;max-height:74vh;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.lb-panel{
  position:absolute;bottom:0;left:0;right:0;padding:16px 20px 22px;
  background:linear-gradient(transparent,rgba(20,14,18,.85) 40%);
  display:flex;gap:12px;align-items:center;flex-wrap:wrap;color:#fff;
}
.lb-panel input[type=text],.lb-panel input[type=date]{
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);color:#fff;
  border-radius:10px;padding:9px 12px;
}
.lb-panel input::placeholder{color:rgba(255,255,255,.55)}
.lb-close{position:absolute;top:20px;right:24px;font-size:26px;color:#fff;cursor:pointer;opacity:.8}
.lb-nav{
  position:absolute;top:50%;transform:translateY(-50%);font-size:30px;color:#fff;
  cursor:pointer;opacity:.7;padding:10px 16px;user-select:none;
}
.lb-nav:hover{opacity:1}
.lb-nav.prev{left:8px}
.lb-nav.next{right:8px}

/* ---------- 按钮 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:9px 16px;border-radius:11px;border:1px solid var(--line);background:#fff;
  color:var(--text);cursor:pointer;font-size:13.5px;transition:.18s;white-space:nowrap;
}
.btn:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line));color:var(--accent)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}
.btn.primary:hover{filter:brightness(1.07);color:var(--accent-ink)}
.btn.ghost{background:transparent}
.btn.danger{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 30%,var(--line))}
.btn.danger:hover{background:color-mix(in srgb,var(--danger) 8%,#fff);color:var(--danger)}
.btn.sm{padding:6px 11px;font-size:12.5px;border-radius:9px}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* ---------- 表单 ---------- */
.field{display:flex;flex-direction:column;gap:5px}
.field .label{font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:6px}
.field .label .auto{
  font-size:11px;color:var(--accent);cursor:pointer;border-bottom:1px dashed currentColor;
}
input[type=text],input[type=password],input[type=tel],input[type=date],input[type=number],select,textarea{
  width:100%;padding:10px 12px;border-radius:11px;border:1px solid var(--line);
  background:#fffdfe;transition:.16s;
}
input:focus,select:focus,textarea:focus{
  outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent);
}
textarea{resize:vertical;min-height:66px;line-height:1.6}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),
  linear-gradient(135deg,var(--muted) 50%,transparent 50%);
  background-position:calc(100% - 17px) 50%,calc(100% - 12px) 50%;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:32px}

.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:14px}
.fields .field.wide{grid-column:1/-1}
.group{margin:22px 0}
.group-title{
  font-size:13px;font-weight:700;letter-spacing:1.6px;color:var(--accent);
  margin:0 0 12px;display:flex;align-items:center;gap:9px;
}
.group-title::after{content:"";flex:1;height:1px;background:var(--line);}

.person-block{margin-top:8px}
.person-head{display:flex;align-items:center;gap:12px;margin:0 0 4px}
.person-head h2{margin:0;font-size:18px;letter-spacing:.5px}

/* ---------- 状态 / 提示 ---------- */
.status{
  font-size:12.5px;color:var(--muted);padding:6px 11px;border-radius:9px;
  background:var(--line-soft);transition:.2s;white-space:nowrap;
}
.status.ok{color:var(--ok);background:color-mix(in srgb,var(--ok) 10%,transparent)}
.status.err{color:var(--danger);background:color-mix(in srgb,var(--danger) 10%,transparent)}
.status.busy{color:var(--warn);background:color-mix(in srgb,var(--warn) 10%,transparent)}

.toast{
  position:fixed;left:50%;bottom:34px;transform:translate(-50%,20px);z-index:200;
  background:#2c2228;color:#fff;padding:11px 20px;border-radius:12px;font-size:13.5px;
  box-shadow:0 12px 34px rgba(0,0,0,.28);opacity:0;pointer-events:none;transition:.28s;
}
.toast.on{opacity:1;transform:translate(-50%,0)}
.toast.err{background:var(--danger)}

.bar{
  height:8px;border-radius:99px;background:var(--line-soft);overflow:hidden;
}
.bar i{display:block;height:100%;border-radius:99px;
  background:linear-gradient(90deg,var(--accent),color-mix(in srgb,var(--accent) 45%,#fff));
  transition:width .4s}
.pill{
  display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:99px;
  font-size:11.5px;background:var(--line-soft);color:var(--muted);
}
.pill.accent{background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);font-weight:600}
.pill.ok{background:color-mix(in srgb,var(--ok) 12%,transparent);color:var(--ok)}
.empty{
  text-align:center;padding:44px 20px;color:var(--muted);font-size:13.5px;
  border:2px dashed var(--line);border-radius:var(--radius);background:#fff;
}
.note{font-size:12px;color:var(--muted)}

/* ---------- 后台 ---------- */
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:18px 0 4px}
.tabs button{
  padding:9px 16px;border-radius:11px;border:1px solid var(--line);background:#fff;
  cursor:pointer;font-size:13.5px;color:var(--muted);transition:.18s;
}
.tabs button:hover{color:var(--text)}
.tabs button.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}
.panel{display:none}
.panel.on{display:block}
.row{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.theme-pick{display:flex;gap:10px;flex-wrap:wrap}
.theme-pick label{
  display:flex;align-items:center;gap:8px;padding:8px 13px;border-radius:11px;
  border:1px solid var(--line);cursor:pointer;font-size:13px;background:#fff;
}
.theme-pick input{width:auto}
.swatch{width:15px;height:15px;border-radius:5px}
.table{width:100%;border-collapse:collapse;font-size:13.5px}
.table th,.table td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--line-soft)}
.table th{font-size:12px;color:var(--muted);font-weight:600;letter-spacing:.6px}
.table tbody tr:hover{background:var(--line-soft)}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px}

footer{
  margin-top:44px;padding:22px 0;text-align:center;color:var(--muted);font-size:12.5px;
  border-top:1px solid var(--line-soft);
}
footer .heart{color:var(--accent)}
/* 备案号（页脚 / 登录页底部） */
footer .beian{margin-top:7px;font-size:11.5px}
footer .beian a,.auth-beian a{color:var(--muted);text-decoration:none;opacity:.8}
footer .beian a:hover,.auth-beian a:hover{opacity:1;text-decoration:underline}
.auth-beian{margin:8px 0 0;font-size:11px;text-align:center}

@media (max-width:640px){
  .wrap{padding:0 14px 48px}
  .nav-inner{padding:9px 14px;gap:10px}
  .brand .sub{display:none}
  .nav-links a{padding:6px 10px;font-size:13px}
  .card{padding:16px;border-radius:15px}
  .hero{padding:22px 18px;gap:18px;border-radius:20px}
  .hero-count .big{font-size:46px}
  .fields{grid-template-columns:1fr}
  .photo-grid{grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:8px}
  .photo-grid.large{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:9px}
  .anniv{padding:13px 14px;gap:12px}
  .table{font-size:12.5px}
  .table th,.table td{padding:8px 6px}
}

@media print{
  .nav,.btn,.tabs,footer{display:none!important}
  body{background:#fff}
  .card{box-shadow:none;border-color:#ddd}
}

/* ============================================================
   v2 补充：主页 / 记录 / 相册 / 纪念日 / 后台 / 登录
   ============================================================ */
.hero.compact{padding:22px 24px;justify-content:center}
.hero.compact .hero-count .big{font-size:clamp(34px,7vw,52px)}

.card h3{font-size:14.5px;margin:0 0 12px;letter-spacing:.5px}
.card h3:not(:first-child){margin-top:24px}
.row-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:16px}
code{background:var(--line-soft);padding:2px 6px;border-radius:6px;font-size:12.5px}

.anniv .ops{display:flex;gap:6px;flex:0 0 auto}
.anniv.is-past,.anniv.past{opacity:.62}

/* 后台 tabs */
.tabs .tab{
  padding:9px 16px;border-radius:11px;border:1px solid var(--line);background:#fff;
  cursor:pointer;font-size:13.5px;color:var(--muted);transition:.18s;
}
.tabs .tab:hover{color:var(--text)}
.tabs .tab.active,.tabs button.on{
  background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600;
}
.panel.active{display:block}

/* 主题选择 */
.theme-chip{
  display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:11px;
  border:1px solid var(--line);background:#fff;cursor:pointer;font-size:13px;transition:.18s;
}
.theme-chip:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.theme-chip.on{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 18%,transparent)}

/* 头像管理 */
.avatar.big{width:98px;height:98px;font-size:28px}
.avatar-row{display:flex;gap:28px;flex-wrap:wrap}
.avatar-box{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.avatar-box .pname{font-size:13.5px;color:var(--muted)}

/* 相册选择态 */
.photo-grid.small{grid-template-columns:repeat(auto-fill,minmax(122px,1fr))}
.photo .pick{
  position:absolute;top:8px;left:8px;width:22px;height:22px;border-radius:7px;
  background:rgba(255,255,255,.85);border:1px solid #fff;opacity:0;transition:.18s;cursor:pointer;
}
.photo:hover .pick,.photo.picked .pick{opacity:1}
.photo.picked{outline:3px solid var(--accent);outline-offset:-3px}
.photo.picked .pick{background:var(--accent);border-color:var(--accent)}
.photo.picked .pick::after{
  content:"✓";color:#fff;font-size:14px;line-height:20px;display:block;text-align:center;
}
.dim{opacity:.72;margin-left:6px;font-size:11px}

/* 上传区 */
.upload-card{cursor:default}
.upload-card.over{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 6%,#fff)}
.up-inner{display:flex;align-items:center;gap:16px}
.up-icon{
  width:54px;height:54px;border-radius:17px;flex:0 0 auto;display:flex;align-items:center;
  justify-content:center;font-size:24px;color:var(--accent);
  background:color-mix(in srgb,var(--accent) 10%,#fff);
}
.up-text{flex:1;font-size:13.5px;color:var(--muted)}
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}

/* 灯箱内层 */
.lb-inner{position:relative;width:100%;height:100%;display:flex;
  flex-direction:column;align-items:center;justify-content:center}
.lb-stage{display:flex;align-items:center;justify-content:center}

/* ---------- 登录 / 创建账号 ---------- */
.auth-body{
  display:flex;align-items:center;justify-content:center;min-height:100vh;padding:28px 18px;
}
.auth-box{
  position:relative;z-index:1;width:100%;max-width:384px;
  background:color-mix(in srgb,#fff 93%,transparent);
  border:1px solid var(--line);border-radius:24px;
  padding:34px 26px 24px;text-align:center;
  box-shadow:0 24px 60px rgba(176,138,160,.18),0 2px 10px rgba(176,138,160,.06);
  animation:authIn .42s cubic-bezier(.22,.68,.32,1) both;
}
@keyframes authIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.auth-logo{
  width:56px;height:56px;border-radius:19px;margin:0 auto 15px;display:flex;align-items:center;
  justify-content:center;font-size:24px;line-height:1;color:#fff;
  background:linear-gradient(140deg,var(--accent),color-mix(in srgb,var(--accent) 55%,#fff));
  box-shadow:0 8px 22px color-mix(in srgb,var(--accent) 34%,transparent);
}
.auth-box h1{font-size:19px;font-weight:700;line-height:1.35;margin:0 0 7px;letter-spacing:.2px}
.auth-sub{margin:0 0 22px;font-size:12.5px;color:var(--muted);line-height:1.6}

.auth-fields{display:grid;gap:12px;margin-bottom:18px}
.auth-field{
  display:flex;align-items:center;gap:10px;height:50px;padding:0 15px;
  background:color-mix(in srgb,var(--accent) 5%,#fff);
  border:1px solid color-mix(in srgb,var(--accent) 10%,var(--line));
  border-radius:14px;transition:border-color .16s,background .16s,box-shadow .16s;
}
.auth-field:focus-within{
  background:#fff;border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 13%,transparent);
}
.auth-field .auth-ico{flex:0 0 auto;display:flex;color:var(--muted);transition:color .16s}
.auth-field:focus-within .auth-ico{color:var(--accent)}
.auth-field .auth-ico svg{width:17px;height:17px;fill:currentColor;display:block}
/* 手机号/密码/下拉在框内一律同宽同高，去掉各自默认样式 */
.auth-box .auth-field input,
.auth-box .auth-field select{
  flex:1 1 auto;min-width:0;width:100%;height:100%;margin:0;padding:0;
  border:none;background:none;border-radius:0;box-shadow:none;
  font-size:15.5px;text-align:left;letter-spacing:.4px;
}
.auth-box .auth-field input:focus{box-shadow:none;border:none;outline:none}
.auth-box .auth-field input::placeholder{color:#b7adba;letter-spacing:.4px;font-size:14.5px}
.auth-box .auth-field select{appearance:auto;cursor:pointer;padding-right:2px}

.auth-submit{
  width:100%;height:50px;border:none;border-radius:14px;cursor:pointer;
  background:linear-gradient(140deg,var(--accent),color-mix(in srgb,var(--accent) 76%,#fff));
  color:var(--accent-ink);font-weight:600;font-size:15.5px;letter-spacing:1px;
  box-shadow:0 10px 24px color-mix(in srgb,var(--accent) 28%,transparent);
  transition:transform .14s,box-shadow .16s,filter .16s;
}
.auth-submit:hover{filter:brightness(1.05);box-shadow:0 12px 28px color-mix(in srgb,var(--accent) 34%,transparent)}
.auth-submit:active{transform:translateY(1px)}

.auth-err{margin-top:12px;font-size:12.5px;color:var(--danger);line-height:1.5}
.auth-err:not(:empty){padding:9px 12px;border-radius:12px;
  background:color-mix(in srgb,var(--danger) 9%,transparent)}
.auth-hint{margin:15px 0 0;font-size:11.8px;color:var(--muted);line-height:1.6}
.auth-who{display:flex;justify-content:center;gap:8px;margin-top:16px;flex-wrap:wrap}
.auth-who span{
  font-size:12px;color:var(--muted);padding:4px 10px;border-radius:99px;
  background:var(--line-soft);
}
@media (max-width:400px){
  .auth-box{padding:28px 20px 22px;border-radius:20px}
  .auth-box h1{font-size:17.5px}
}

@media (max-width:640px){
  .anniv .ops{flex-direction:column;gap:4px}
  .up-inner{gap:12px}
  .avatar-row{gap:18px}
}


/* ---- 日记 ---- */
.diary-list{display:grid;gap:12px}
.diary{
  background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:15px 17px;box-shadow:var(--shadow);
}
.diary .diary-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.diary .diary-head strong{font-size:15px;letter-spacing:.2px}
.diary-mood{font-size:15px}
.diary-content{
  margin-top:8px;font-size:13.8px;line-height:1.75;color:var(--text);
  white-space:pre-wrap;word-break:break-word;
}
.diary .diary-ops{display:flex;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap}
.diary .diary-ops .btn{margin-left:auto}
.diary .diary-ops .btn + .btn{margin-left:0}
.diary-content.clamp{max-height:96px;overflow:hidden;mask-image:linear-gradient(#000 62%,transparent)}

/* ---- 基本信息表 ---- */
.basic-table td.k{color:var(--muted);font-size:12.5px;width:34%}
.basic-table td.blank{color:#c6c9d2}
.basic-table tbody tr:last-child td{border-bottom:none}
.basic-table tbody tr.group-row td{
  background:color-mix(in srgb,var(--accent) 5%,#fff);
  color:var(--accent);font-size:12px;font-weight:600;letter-spacing:1.2px;
  padding:6px 12px;border-bottom:1px solid var(--line);
}
.basic-table tbody tr.group-row td:first-child{border-top-left-radius:9px}
.basic-table tbody tr.group-row td:last-child{border-top-right-radius:9px}

/* ---- 卡片头右侧链接 ---- */
.card-head .sub a{color:var(--muted);padding:2px 7px;border-radius:7px}
.card-head .sub a:hover{color:var(--accent);background:var(--line-soft)}
.card-head .sub a.active{color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent);font-weight:600}

/* ============================================================
   心动值 / 心情打卡 / 心愿清单 / 悄悄话
   ============================================================ */
.big-index{color:var(--accent);font-size:17px;margin:0 2px}

/* 双人数值面板 */
.board{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.board-col{padding:18px}
.bc-head{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.bc-name{font-weight:700;font-size:15px}
.bc-index{margin-left:auto;text-align:right;line-height:1.15}
.bc-index b{font-size:24px;color:var(--accent);font-variant-numeric:tabular-nums}
.bc-index small{display:block;font-size:11px;color:var(--muted)}
.bc-tip{margin-top:12px;font-size:11.5px}

.meter{margin-bottom:12px}
.m-top{display:flex;align-items:baseline;gap:8px;font-size:13px;margin-bottom:5px}
.m-label{color:var(--text)}
.m-val{margin-left:auto;font-weight:700;color:var(--accent);font-variant-numeric:tabular-nums}
.meter.bad .m-val{color:#d2555a}
.m-bar{height:9px;border-radius:99px;background:var(--line-soft);overflow:hidden}
.m-bar i{
  display:block;height:100%;border-radius:99px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 45%,#fff),var(--accent));
  transition:width .22s ease;
}
.meter.bad .m-bar i{background:linear-gradient(90deg,#f0a3a6,#d2555a)}

/* 滑块 */
.meter input[type=range]{
  -webkit-appearance:none;appearance:none;width:100%;height:18px;margin:4px 0 0;
  background:transparent;cursor:pointer;
}
.meter input[type=range]::-webkit-slider-runnable-track{
  height:4px;border-radius:99px;background:color-mix(in srgb,var(--accent) 22%,var(--line-soft));
}
.meter input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;width:18px;height:18px;margin-top:-7px;
  border-radius:50%;background:var(--accent);border:3px solid #fff;
  box-shadow:0 1px 6px rgba(0,0,0,.22);
}
.meter.bad input[type=range]::-webkit-slider-thumb{background:#d2555a}
.meter input[type=range]::-moz-range-track{
  height:4px;border-radius:99px;background:color-mix(in srgb,var(--accent) 22%,var(--line-soft));
}
.meter input[type=range]::-moz-range-thumb{
  width:16px;height:16px;border-radius:50%;background:var(--accent);border:3px solid #fff;
}



/* 悄悄话 */
.note-form{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.note-form input[type=text]{flex:1;min-width:180px}
.note-list{display:grid;gap:8px}
.note-item{
  display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;
  border:1px solid var(--line);background:#fff;
}
.ni-text{flex:1;min-width:0;font-size:13.5px;word-break:break-word}
.ni-time{font-size:11.5px;color:var(--muted);white-space:nowrap}
.ni-del{
  border:none;background:transparent;color:var(--muted);font-size:18px;line-height:1;
  cursor:pointer;padding:0 4px;
}
.ni-del:hover{color:#d2555a}

/* 心愿清单 */
.wish-form{display:flex;gap:8px;flex-wrap:wrap}
.wish-form input[type=text]{flex:1;min-width:180px}
.wish-progress{
  height:9px;border-radius:99px;background:var(--line-soft);overflow:hidden;margin-top:16px;
}
.wish-progress i{
  display:block;height:100%;border-radius:99px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 45%,#fff),var(--accent));
  transition:width .3s;
}
.wish-list{display:grid;gap:8px;margin-top:16px}
.wish-item{
  display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:13px;
  border:1px solid var(--line);background:#fff;
}
.wish-item.done{opacity:.62;background:var(--line-soft)}
.wish-check{
  width:24px;height:24px;flex:0 0 auto;border-radius:9px;border:1.5px solid var(--line);
  background:#fff;cursor:pointer;color:#fff;font-size:14px;line-height:1;transition:.18s;
}
.wish-check:hover{border-color:var(--accent)}
.wish-item.done .wish-check{background:var(--accent);border-color:var(--accent)}
.wi-body{flex:1;min-width:0}
.wi-title{font-size:14.5px;font-weight:600;word-break:break-word}
.wish-item.done .wi-title{text-decoration:line-through}
.wi-del{
  border:none;background:transparent;color:var(--muted);font-size:19px;line-height:1;
  cursor:pointer;padding:0 4px;
}
.wi-del:hover{color:#d2555a}

/* 首页心愿清单卡 */
.wish-card{margin-top:22px;scroll-margin-top:80px}
.wish-card .card-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px}

/* 首页心动卡 */
.heart-card{background:linear-gradient(135deg,#fff,color-mix(in srgb,var(--accent) 6%,#fff))}
.hc-people{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.hc-person{display:flex;align-items:center;gap:12px}
.hc-info{flex:1;min-width:0}
.hc-name{font-weight:650;font-size:14px}
.hc-index{text-align:right;line-height:1.1}
.hc-index b{font-size:22px;color:var(--accent);font-variant-numeric:tabular-nums}
.hc-index small{display:block;font-size:10.5px;color:var(--muted)}

@media (max-width:640px){
}