/* 信封 + 拆开的信 */
.letter-card { display: flex; align-items: center; gap: 12px; padding: 12px 18px 12px 14px; max-width: 260px; border-radius: 18px; cursor: pointer;
  background: var(--glass); -webkit-backdrop-filter: blur(22px) saturate(170%); backdrop-filter: blur(22px) saturate(170%);
  border: .5px solid var(--glass-line); box-shadow: var(--glass-shadow); color: var(--text); font: inherit; text-align: left; }
.letter-card:active { opacity: .7; }
.lc-ic { font-size: 28px; line-height: 1; }
.lc-tx b { display: block; font-size: 15px; font-weight: 600; }
.lc-tx small { display: block; font-size: 12px; opacity: .7; margin-top: 2px; }
.letter-mask { position: fixed; inset: 0; z-index: 9000; display: none; align-items: center; justify-content: center;
  padding: calc(var(--sat, env(safe-area-inset-top)) + 16px) 16px calc(var(--sab, env(safe-area-inset-bottom)) + 16px); background: rgba(0,0,0,.35); }
.letter-mask.open { display: flex; }
.letter-sheet { position: relative; width: 100%; max-width: 460px; max-height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch;
  padding: 26px 22px 24px; border-radius: 22px; color: var(--text);
  background: var(--glass); -webkit-backdrop-filter: blur(30px) saturate(170%); backdrop-filter: blur(30px) saturate(170%);
  border: .5px solid var(--glass-line); box-shadow: var(--glass-shadow); }
.ls-x { position: absolute; top: 12px; right: 12px; width: 30px; height: 30px; border: none; border-radius: 50%; cursor: pointer;
  background: color-mix(in srgb, var(--text) 10%, transparent); color: var(--text); font-size: 14px; }
.ls-title { font-size: 19px; font-weight: 600; padding-right: 34px; }
.ls-date { font-size: 12px; opacity: .6; margin: 4px 0 14px; }
.ls-body p { font-size: 16px; line-height: 1.75; margin: 0 0 12px; }
.ls-note { font-size: 15px; opacity: .8; padding: 10px 0; }