/* ============================================================
   甜甜圈 Donut · 全局样式
   白底黑字 · 韩系简约 INS · 蓝灰点缀
   ============================================================ */
:root{
  /* ---- 设计 Token ---- */
  --bg:#FBFCFD;           /* 近白页底 */
  --card:#FFFFFF;         /* 纯白卡片 */
  --card-soft:#F6F7F9;    /* 极浅灰区隔底 */
  --ink:#16191E;          /* 近黑主文字 */
  --ink-2:#57606E;        /* 次级灰 */
  --ink-3:#A6ADB8;        /* 弱化灰 */
  --line:#ECEEF1;         /* 极细分割线 */
  --line-2:#E2E5EA;
  --mist:#9FB0C3;         /* 蓝灰点缀主 */
  --mist-deep:#7B92AB;    /* 蓝灰点缀深 */
  --mist-soft:#EAF0F6;    /* 极淡蓝灰底 */
  --r-field:18px;         /* 输入圆角 */
  --r-bubble:20px;        /* 气泡圆角 */

  /* ---- 旧变量别名（平滑迁移） ---- */
  --text:var(--ink);
  --muted:var(--ink-3);
  --field:var(--card-soft);
  --pink:var(--mist-soft);
  --pink-btn:var(--mist-deep);
  --pink-deep:var(--mist-deep);
  --brown:var(--mist);
  --r-sm:12px; --r-md:16px; --r-lg:20px;
  --shadow:0 8px 24px rgba(22,25,30,.06);
  --shadow-soft:0 2px 12px rgba(22,25,30,.05);
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;}
body{
  font-family:var(--font);
  color:var(--text);
  background:#EDF0F4;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  font-size:15px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.ico-svg{width:1em;height:1em;display:inline-block;vertical-align:-.12em;fill:none;flex:none;}
button,input,textarea,select{font-family:inherit;font-size:inherit;color:inherit;border:none;background:none;outline:none;}
button{cursor:pointer;}
img{display:block;max-width:100%;}
h1,h2,h3,h4{font-weight:700;}
::-webkit-scrollbar{width:0;height:0;}

/* ================= 屏幕（无边框外壳，仅保留圆角） ================= */
.phone{
  position:relative;
  width:min(420px,100vw);
  height:min(900px,100vh);
  height:min(900px,100dvh);
  background:transparent;
  border-radius:0;
  padding:0;
  overflow:hidden;
  box-shadow:none;
  flex:none;
}
.screen{
  position:relative;width:100%;height:100%;
  border-radius:28px;overflow:hidden;
  background:var(--bg);
}
.layer{position:absolute;inset:0;display:none;flex-direction:column;background:var(--bg);overflow:hidden;}
.layer-active{display:flex;}

/* ================= 状态栏 ================= */
.statusbar{
  height:calc(48px + env(safe-area-inset-top));
  padding-top:env(safe-area-inset-top);
  flex:none;display:flex;align-items:center;justify-content:space-between;
  padding-left:28px;padding-right:28px;
  font-size:13px;font-weight:700;color:var(--text);
  position:relative;z-index:30;
}
.sb-time{min-width:54px;}
.sb-right{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--muted);}
.sb-signal{letter-spacing:1px;font-size:9px;color:var(--text);}
.sb-wifi{font-size:10px;}
.sb-battery{position:relative;width:24px;height:12px;border:1.5px solid var(--ink-2);border-radius:3.5px;padding:1.5px;margin-right:21px;flex:none;}
.sb-battery::after{content:"";position:absolute;right:-3.5px;top:3.5px;width:2px;height:5px;background:var(--ink-2);border-radius:0 2px 2px 0;}
.sb-battery i{display:block;height:100%;width:80%;background:var(--mist-deep);border-radius:1.5px;}
.sb-battery em{font-style:normal;position:absolute;left:calc(100% + 6px);top:50%;transform:translateY(-50%);font-size:10px;line-height:1;color:inherit;white-space:nowrap;}
.statusbar-app{background:transparent;}
.statusbar-lock .sb-time,.statusbar-lock .sb-right{color:#fff;}
.statusbar-lock .sb-signal{color:#fff;}

/* ================= 桌面 ================= */
#layer-desktop{background:var(--bg);}
.desktop-bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0;}
.desktop-bg::after{content:"";position:absolute;inset:0;background:rgba(251,252,253,.08);}
.desktop-scroll{flex:1;overflow:hidden;position:relative;z-index:1;}
.pages-track{display:flex;height:100%;transition:transform .32s cubic-bezier(.25,.8,.3,1);will-change:transform;}
.desktop-page{min-width:100%;height:100%;padding:14px 20px 0;display:flex;flex-direction:column;position:relative;}
.page-name{display:none;font-size:12px;color:var(--muted);text-align:center;height:18px;font-weight:600;}
.icon-grid{
  flex:none;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(6,78px);
  gap:6px 8px;padding:10px 0 0;align-content:start;
}
.app-icon{
  display:flex;flex-direction:column;align-items:center;gap:5px;position:relative;
  animation:none;
}
.app-icon .ico{
  width:56px;height:56px;border-radius:17px;background:#fff;overflow:hidden;
  box-shadow:var(--shadow-soft);display:flex;align-items:center;justify-content:center;
  font-size:27px;border:1px solid rgba(255,255,255,.7);
  background-size:cover;background-position:center;
}
.app-icon .lbl{font-size:11px;color:var(--ink);max-width:64px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500;}
.app-icon .ico .ico-svg{width:30px;height:30px;color:var(--mist-deep);}
.app-icon .lbl,.desktop-has-wall .app-icon .lbl{color:var(--ink);text-shadow:0 1px 3px rgba(255,255,255,.85),0 0 6px rgba(255,255,255,.6);}
.icon-x{
  position:absolute;top:-8px;left:50%;transform:translateX(-50%);
  width:19px;height:19px;border-radius:50%;background:#D49494;color:#fff;
  display:none;align-items:center;justify-content:center;line-height:1;z-index:5;
  box-shadow:0 2px 6px rgba(22,25,30,.2);
}
.icon-x .ico-svg{width:11px;height:11px;}
.editing .app-icon{animation:jiggle .28s infinite alternate;}
.editing .app-icon:nth-child(2n){animation-duration:.24s;animation-delay:-.12s;}
.editing .icon-x{display:flex;}
@keyframes jiggle{0%{transform:rotate(-2.2deg)}100%{transform:rotate(2.2deg)}}

.page-dots{flex:none;height:22px;display:flex;align-items:center;justify-content:center;gap:7px;z-index:2;padding-bottom:2px;}
.page-dots i{width:6px;height:6px;padding:8px;background-clip:content-box;border-radius:50%;background:#CDD3DB;transition:all .25s;}
.page-dots i.on{background:var(--mist-deep);width:16px;border-radius:4px;}
.home-indicator{width:134px;height:5px;border-radius:3px;background:var(--ink);opacity:.28;margin:6px auto 7px;flex:none;z-index:3;}
.desktop-has-wall .home-indicator{background:#fff;opacity:.8;}

/* 桌面浮动贴纸/文字 */
.sticker-layer{position:absolute;inset:48px 0 30px;z-index:2;pointer-events:none;}
.sticker{position:absolute;max-width:120px;border-radius:12px;pointer-events:auto;}
.sticker-text{position:absolute;font-weight:700;font-size:14px;pointer-events:auto;text-shadow:0 1px 3px rgba(255,255,255,.6);}

/* ================= 桌面自由组件 v3（样式各异） ================= */
.dw-layer{position:absolute;inset:40px 0 30px;z-index:3;pointer-events:none;}
.dw{position:absolute;pointer-events:auto;user-select:none;-webkit-user-select:none;touch-action:none;}
.dw-rm{
  position:absolute;top:-9px;right:-9px;width:20px;height:20px;border-radius:50%;
  background:#C98A8A;color:#fff;border:none;display:none;align-items:center;justify-content:center;
  box-shadow:0 2px 8px rgba(22,25,30,.22);z-index:8;padding:0;cursor:pointer;
}
.dw-rm .ico-svg{width:11px;height:11px;}
#layer-desktop.editing .dw-rm{display:flex;}
#layer-desktop.editing .dw{animation:dwJiggle .28s infinite alternate;cursor:grab;}
#layer-desktop.editing .dw:nth-child(2n){animation-delay:-.14s;}
#layer-desktop.editing .dw,#layer-desktop.editing .dw *{touch-action:none;}
.dw.dw-dragging{animation:none!important;z-index:30;cursor:grabbing;}
.dw.dw-dragging .pol-a,.dw.dw-dragging .pol-b{transition:none;}
@keyframes dwJiggle{0%{transform:rotate(-1.4deg)}100%{transform:rotate(1.4deg)}}

/* —— 在一起天数：交叠双环 + 爱心珍珠 —— */
.dw-together{display:flex;flex-direction:column;align-items:center;text-align:center;}
.dwt-rings{position:relative;display:flex;align-items:center;justify-content:center;}
.dwt-ring{
  width:64px;height:64px;border-radius:50%;overflow:hidden;flex:none;
  background:rgba(255,255,255,.62);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:2px solid rgba(255,255,255,.95);
  box-shadow:0 8px 22px rgba(40,55,80,.16);
  display:flex;align-items:center;justify-content:center;color:var(--mist-deep);
}
.dr-l{margin-right:-4px;z-index:1;}
.dr-r{margin-left:-4px;z-index:1;}
.dwt-ring img{width:100%;height:100%;object-fit:cover;}
.dwt-ring svg{width:28px;height:28px;opacity:.95;color:#6E87A3;}
.dwt-rheart{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;
  width:24px;height:24px;border-radius:50%;background:#fff;
  box-shadow:0 3px 8px rgba(40,55,80,.22);
  display:flex;align-items:center;justify-content:center;color:#C98A8A;cursor:pointer;
}
.dwt-rheart svg{width:11px;height:11px;}
.dwt-days{margin-top:10px;display:flex;align-items:baseline;gap:3px;}
.dwt-days b{font-size:32px;font-weight:300;color:var(--ink);letter-spacing:1px;line-height:1;}
.dwt-days span{font-size:12px;color:var(--ink-3);}
.dwt-sub{font-size:10.5px;color:var(--ink-3);margin-top:4px;letter-spacing:.6px;}
.dwt-empty{font-size:12.5px;color:var(--ink-3);font-weight:400;border-bottom:1px dashed var(--line-2);padding-bottom:2px;margin-top:10px;}
/* —— 双环多页轮播 —— */
.dw-together .dwt-stage{width:100%;overflow:hidden;touch-action:pan-y;}
.dw-together .dwt-inner{display:flex;flex-direction:column;align-items:center;}
.dw-together .tog-next{animation:togInR .28s cubic-bezier(.25,.8,.3,1);}
.dw-together .tog-prev{animation:togInL .28s cubic-bezier(.25,.8,.3,1);}
@keyframes togInR{from{opacity:0;transform:translateX(22px);}to{opacity:1;transform:none;}}
@keyframes togInL{from{opacity:0;transform:translateX(-22px);}to{opacity:1;transform:none;}}
.dwt-dots{margin-top:8px;display:flex;gap:5px;align-items:center;justify-content:center;}
.dwt-dots i{width:5px;height:5px;border-radius:50%;background:rgba(90,104,122,.28);cursor:pointer;transition:width .25s,background .25s;}
.dwt-dots i.on{width:14px;border-radius:3px;background:#7B92AB;cursor:default;}

/* —— 圆角文字 / 纯文字 —— */
.dw-text .dwtxt{
  font-size:13.5px;font-weight:300;line-height:1.75;letter-spacing:.6px;
  padding:12px 16px;color:var(--ink-2);text-align:center;word-break:break-word;
}
.dw-text.round .dwtxt{
  background:rgba(255,255,255,.72);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border:1px solid rgba(60,64,72,.07);border-radius:18px;box-shadow:var(--shadow-soft);
}
.dw-text.plain .dwtxt{padding:4px 6px;color:var(--ink);font-weight:400;font-size:14px;}

/* —— 拍立得：两张错落叠放（对角半叠，互不遮盖） —— */
.dw-pol .pol-stack{position:relative;width:100%;aspect-ratio:1/1.32;}
.dw-pol .pol-stack .pol{
  position:absolute;width:72%;background:#fff;border-radius:4px;padding:6px 6px 0;
  box-shadow:0 10px 26px rgba(22,25,30,.16);cursor:pointer;
}
.dw-pol .pol-a{left:0;top:0;transform:rotate(-4.5deg);}
.dw-pol .pol-b{right:0;bottom:0;transform:rotate(4deg);z-index:2;}
.dw-pol .pol-img{width:100%;aspect-ratio:1/1;border-radius:2px;overflow:hidden;background:#F2F3F5;display:flex;}
.dw-pol .pol-photo{width:100%;height:100%;object-fit:cover;display:block;}
.dw-pol .pol-add{
  flex:1;margin:3px;border-radius:3px;border:1.5px dashed var(--line-2);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--ink-3);
}
.dw-pol .pol-add .ico-svg{width:18px;height:18px;}
.dw-pol .pol-add span{font-size:10px;letter-spacing:.5px;white-space:nowrap;}
.dw-pol .pol-cap{font-size:10px;color:var(--ink-2);text-align:center;font-weight:500;letter-spacing:.5px;padding:5px 2px 7px;min-height:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* ================= 第一页：杂志式排版（高级感留白） ================= */
.desktop-page.magazine{padding:16px 27px 16px;display:flex;flex-direction:column;justify-content:space-between;}
/* 刊头装饰 */
.maga-masthead{
  flex:none;display:flex;align-items:center;gap:9px;margin:0 2px 10px;
  color:#8C99AD;font-family:Georgia,'Times New Roman',serif;
}
.mh-dia{width:4px;height:4px;background:currentColor;transform:rotate(45deg);border-radius:1px;opacity:.65;flex:none;}
.mh-en{font-size:9px;letter-spacing:3.5px;opacity:.85;}
.mh-no{margin-left:auto;font-size:9px;letter-spacing:2px;opacity:.55;}
/* 头部资料卡：磨砂描边卡片 */
.maga-profile{
  position:relative;display:flex;align-items:center;gap:14px;flex:none;cursor:pointer;
  padding:13px 16px;border-radius:22px;
  background:linear-gradient(135deg,rgba(255,255,255,.68),rgba(255,255,255,.44));
  border:1px solid rgba(255,255,255,.92);
  box-shadow:0 10px 30px rgba(40,55,80,.10), inset 0 1px 0 rgba(255,255,255,.7);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  overflow:hidden;
}
.maga-profile.has-bg::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(105deg,rgba(44,54,74,.5),rgba(44,54,74,.14) 55%,rgba(44,54,74,.34));
}
.maga-profile.has-bg .mp-info,.maga-profile.has-bg .mp-ava{position:relative;z-index:1;}
.maga-profile.has-bg .mp-name{color:#fff;text-shadow:0 1px 6px rgba(30,40,60,.35);}
.maga-profile.has-bg .mp-name.hint{color:rgba(255,255,255,.8);}
.maga-profile.has-bg .mp-bio{color:rgba(255,255,255,.88);text-shadow:0 1px 5px rgba(30,40,60,.35);}
.maga-profile.has-bg .mp-bio.hint{color:rgba(255,255,255,.65);}
.maga-profile.has-bg .mp-spark{color:rgba(255,255,255,.85);}
.mp-info{flex:1;min-width:0;}
.mp-name-row{display:flex;align-items:center;gap:7px;}
.mp-spark{flex:none;width:11px;height:11px;color:#A9BBD0;display:flex;margin-bottom:2px;}
.mp-spark svg{width:100%;height:100%;}
.mp-name{
  font-size:22px;font-weight:600;letter-spacing:1.5px;line-height:1.25;color:#3C4456;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.mp-name.hint{font-weight:400;font-size:15px;color:#98A0AE;letter-spacing:.5px;}
.mp-bio{
  margin-top:5px;font-size:11.5px;letter-spacing:.8px;color:#7B8494;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.mp-bio.hint{color:#ADB4BF;}
.mp-ava{
  width:58px;height:58px;border-radius:50%;flex:none;overflow:hidden;
  background:rgba(255,255,255,.7);border:2px solid rgba(255,255,255,.95);
  box-shadow:0 6px 18px rgba(40,55,80,.16);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  display:flex;align-items:center;justify-content:center;color:var(--mist-deep);
}
.mp-ava img{width:100%;height:100%;object-fit:cover;}
.mp-ava svg{width:28px;height:28px;opacity:.8;}
/* 两条排版带 */
.maga-band{
  flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr;
  align-items:center;column-gap:8px;
}
.maga-cell{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;}
.maga-icons{display:grid;grid-template-columns:repeat(2,60px);gap:12px 16px;justify-content:center;}
.maga-icons .app-icon{gap:4px;cursor:pointer;}
.maga-icons .ico{
  width:52px;height:52px;border-radius:16px;
  border:1px solid rgba(255,255,255,.85);
  box-shadow:0 6px 18px rgba(40,55,80,.15);
}
.maga-icons .ico .ico-svg{width:27px;height:27px;}
.maga-icons .lbl{
  display:block;font-size:10px;line-height:1.2;letter-spacing:.5px;color:var(--ink);
  max-width:60px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  text-shadow:0 1px 3px rgba(255,255,255,.85),0 0 6px rgba(255,255,255,.6);
}
.maga-blank{width:52px;height:52px;}
.maga-add,.maga-ghost{
  display:flex;align-items:center;justify-content:center;text-align:center;cursor:pointer;
  background:rgba(255,255,255,.42);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  border:1.5px dashed rgba(123,138,160,.4);color:#8B94A3;
}
.maga-add{width:52px;height:52px;border-radius:16px;}
.ma-plus{font-size:22px;font-weight:300;line-height:1;color:#98A2B2;}
.maga-ghost{width:100%;max-width:150px;min-height:104px;padding:16px 10px;border-radius:18px;font-size:11.5px;letter-spacing:1px;}
/* 排版格子内的组件固定在格中 */
.maga-cell .dw{
  position:static!important;inset:auto!important;left:auto!important;top:auto!important;
  width:auto!important;max-width:168px;margin:0 auto;
}
.maga-cell-pol .dw{width:100%!important;max-width:160px;}
.maga-cell-pol .pol-a::before{
  content:"";position:absolute;top:-9px;left:50%;z-index:3;pointer-events:none;
  width:48px;height:15px;transform:translateX(-50%) rotate(-4deg);
  background:rgba(255,255,255,.55);
  border-left:1px dashed rgba(170,182,200,.55);border-right:1px dashed rgba(170,182,200,.55);
  box-shadow:0 1px 4px rgba(40,55,80,.08);
}
#layer-desktop.editing .maga-cell .dw{cursor:default;}
/* 底部英文装饰：波浪线 + 小菱形 */
.maga-foot{
  flex:none;display:flex;align-items:center;gap:10px;padding:0 6px;cursor:pointer;
  color:#8FA0B8;
}
.mf-wave{flex:1;height:6px;opacity:.75;}
.mf-wave-r{transform:scaleX(-1);}
.mf-dia{flex:none;width:5px;height:5px;background:#8FA0B8;transform:rotate(45deg);border-radius:1px;opacity:.8;}
.mf-text{
  font-family:Georgia,'Times New Roman',serif;font-style:italic;
  font-size:12px;letter-spacing:3px;white-space:nowrap;color:#6E7A8D;
}

/* —— 纪念日：邮票 —— */
.dw-ann.stamp .stp{
  position:relative;background:#fff;border-radius:6px;padding:13px 18px 11px;text-align:center;
  box-shadow:var(--shadow-soft);border:1.5px dashed #DCD6D0;outline:1px solid #EFEBE7;outline-offset:3px;
  transform:rotate(-1.5deg);
}
.stp-name{font-size:11px;color:#B29E93;letter-spacing:2px;font-weight:500;}
.stp-days{margin:3px 0 2px;}
.stp-days b{font-size:30px;font-weight:300;color:var(--ink);line-height:1;}
.stp-days i{font-style:normal;font-size:11px;color:var(--ink-3);margin-left:2px;}
.stp-date{font-size:10px;color:var(--ink-3);letter-spacing:1px;}
.stp-num{position:absolute;right:5px;bottom:6px;font-size:7px;letter-spacing:1px;color:#DCD6D0;transform:rotate(-90deg);}

/* —— 纪念日：电影票 —— */
.dw-ann.ticket .tk{
  background:#fff;border-radius:13px;box-shadow:0 8px 24px rgba(22,25,30,.1);
  overflow:hidden;transform:rotate(1.5deg);
}
.tk-top{padding:13px 15px 10px;display:flex;justify-content:space-between;align-items:flex-start;gap:8px;}
.tk-name{font-size:12.5px;color:var(--ink-2);font-weight:500;letter-spacing:1px;}
.tk-days{white-space:nowrap;}
.tk-days b{font-size:26px;font-weight:300;color:var(--ink);line-height:1;}
.tk-days i{font-style:normal;font-size:10px;color:var(--ink-3);margin-left:2px;}
.tk-cut{position:relative;height:0;border-top:1.5px dashed #E7E4E0;margin:0 12px;}
.tk-cut::before,.tk-cut::after{
  content:'';position:absolute;top:-7px;width:13px;height:13px;border-radius:50%;background:#EDF0F4;
}
.tk-cut::before{left:-18.5px;}
.tk-cut::after{right:-18.5px;}
.tk-bot{padding:9px 15px 12px;display:flex;justify-content:space-between;align-items:center;font-size:10px;color:var(--ink-3);letter-spacing:.5px;}
.tk-barcode{display:inline-flex;gap:1.5px;align-items:stretch;height:18px;}
.tk-barcode i{width:1.5px;background:var(--ink-2);display:inline-block;height:100%;}
.tk-barcode i:nth-child(3n){height:70%;align-self:flex-end;}
.tk-barcode i:nth-child(3n+1){height:85%;align-self:flex-end;}

/* —— 自定义图片 —— */
.dw-image{border-radius:16px;overflow:hidden;box-shadow:0 8px 24px rgba(22,25,30,.1);border:1px solid rgba(255,255,255,.7);}
.dw-image>img{width:100%;display:block;}
.dwi-add{
  aspect-ratio:1/1;border-radius:16px;display:flex;flex-direction:column;gap:7px;
  align-items:center;justify-content:center;color:var(--ink-3);
  background:rgba(255,255,255,.7);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border:1px solid rgba(60,64,72,.07);
}
.dwi-add .ico-svg{width:24px;height:24px;}
.dwi-add span{font-size:11px;letter-spacing:1px;}

/* —— 旧小工具：统一玻璃卡（仅给主动添加的用户） —— */
.dw-legacy .wcard{
  background:rgba(255,255,255,.82);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border:1px solid rgba(60,64,72,.07);border-radius:18px;box-shadow:var(--shadow-soft);
  padding:13px 14px;margin:0;
}
.dw-legacy .wcard .wc-title{display:none;}
.dw-legacy .wcard .wc-remove{display:none;}

/* ================= 组件 App ================= */
.wlib{padding-bottom:30px;}
.wlib-row{
  display:flex;align-items:center;gap:12px;background:var(--card);
  border-radius:16px;padding:11px 14px;margin-bottom:8px;box-shadow:var(--shadow-soft);
}
.wlib-ico{
  width:36px;height:36px;border-radius:11px;background:var(--mist-soft);color:var(--mist-deep);
  display:flex;align-items:center;justify-content:center;flex:none;
}
.wlib-ico .ico-svg{width:18px;height:18px;}
.wlib .ci-sub{font-size:11.5px;color:var(--ink-3);margin-top:2px;font-weight:400;}
.wlib-btn{
  margin-left:auto;border:none;background:var(--mist-soft);color:var(--mist-deep);
  font-size:12.5px;font-weight:600;padding:7px 15px;border-radius:14px;font-family:inherit;flex:none;
}
.wlib-btn.danger{background:#F7ECEC;color:#B97474;}
.wlib-empty{text-align:center;color:var(--ink-3);font-size:12.5px;padding:24px 0;letter-spacing:.5px;}
.wlib-tip{text-align:center;font-size:11px;color:var(--ink-3);padding:18px 20px 0;line-height:1.8;letter-spacing:.5px;}

/* 组件配置抽屉 */
.sheet-opt{display:flex;align-items:center;justify-content:space-between;padding:15px 16px;border-bottom:1px solid var(--line);font-size:14.5px;}
.sheet-opt:last-child{border-bottom:none;}
.sheet-opt:active{background:var(--card-soft);}
.sheet-opt .chev{color:var(--ink-3);font-size:19px;}

/* 占位 App */
.ph-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:11px;padding-bottom:60px;}
.ph-ico{width:66px;height:66px;border-radius:21px;background:var(--mist-soft);color:var(--mist);display:flex;align-items:center;justify-content:center;}
.ph-ico .ico-svg{width:30px;height:30px;}
.ph-title{font-size:17px;font-weight:600;letter-spacing:1px;}
.ph-sub{font-size:13px;color:var(--ink-3);letter-spacing:.5px;}

/* ================= 锁屏 ================= */
#layer-lock{background:#22262C;color:#fff;}
.lock-wallpaper{position:absolute;inset:0;background-size:cover;background-position:center;}
.lock-mask{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.42));}
.statusbar-lock{z-index:5;}
.lock-content{position:relative;z-index:4;flex:1;display:flex;flex-direction:column;align-items:center;padding-top:26px;}
.lock-lock-ico{margin-bottom:14px;opacity:.9;}
.lock-lock-ico svg{width:17px;height:17px;}
.lock-date{font-size:14px;color:rgba(255,255,255,.86);font-weight:600;}
.lock-time{font-size:76px;font-weight:300;letter-spacing:2px;line-height:1.15;text-shadow:0 2px 14px rgba(0,0,0,.18);}
/* 锁屏：二人头像 + 爱心 */
.lock-couple{margin-top:18px;display:flex;align-items:center;justify-content:center;}
.lk-avas{display:flex;align-items:center;justify-content:center;}
.lk-ava{
  width:56px;height:56px;border-radius:50%;overflow:hidden;flex:none;
  background:rgba(255,255,255,.22);border:2px solid rgba(255,255,255,.9);
  box-shadow:0 4px 16px rgba(0,0,0,.2);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.95);
}
.lk-ava img{width:100%;height:100%;object-fit:cover;}
.lk-ava svg{width:26px;height:26px;}
.lk-heart{
  width:30px;height:30px;border-radius:50%;flex:none;z-index:2;margin:0 -8px;
  background:rgba(255,255,255,.94);box-shadow:0 2px 10px rgba(0,0,0,.2);
  display:flex;align-items:center;justify-content:center;color:#C98A8A;
}
.lk-heart svg{width:15px;height:15px;}
.lock-notifications{width:100%;padding:24px 16px 0;display:flex;flex-direction:column;gap:10px;overflow-y:auto;}
.lock-note{
  background:rgba(255,255,255,.92);border-radius:var(--r-md);padding:11px 14px;color:var(--text);
  display:flex;gap:10px;align-items:flex-start;box-shadow:var(--shadow-soft);
  animation:noteIn .4s ease;
}
@keyframes noteIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.lock-note .n-ico{width:32px;height:32px;border-radius:9px;flex:none;display:flex;align-items:center;justify-content:center;background:var(--mist-soft);color:var(--mist-deep);overflow:hidden;}
.lock-note .n-ico img{width:100%;height:100%;border-radius:9px;object-fit:cover;}
.lock-note .n-ico .ico-svg{width:17px;height:17px;}
.lock-note .n-app{font-size:11px;color:var(--muted);font-weight:700;}
.lock-note .n-body{font-size:13px;line-height:1.45;}
.lock-note .n-time{margin-left:auto;font-size:11px;color:var(--muted);flex:none;}
.lock-hint{position:relative;z-index:4;flex:none;text-align:center;padding-bottom:14px;color:rgba(255,255,255,.9);font-size:12px;}
.lock-bar{width:134px;height:5px;border-radius:3px;background:rgba(255,255,255,.85);margin:8px auto 4px;}
#layer-lock.dragging .lock-content{transition:transform .1s;}
.lock-pad{position:relative;z-index:4;padding:0 40px 24px;display:none;flex-direction:column;align-items:center;}
.lock-pad-title{font-size:15px;font-weight:600;margin:4px 0 14px;}
.lock-pad-dots{display:flex;gap:16px;margin-bottom:26px;}
.lock-pad-dots i{width:14px;height:14px;border-radius:50%;border:1.6px solid rgba(255,255,255,.8);}
.lock-pad-dots i.filled{background:#fff;}
.lock-pad-dots i.err{border-color:#ff9b9b;background:transparent;animation:shake .4s;}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-7px)}75%{transform:translateX(7px)}}
.lock-pad-keys{display:grid;grid-template-columns:repeat(3,74px);gap:16px 26px;justify-content:center;}
.pad-key{width:74px;height:74px;border-radius:50%;background:rgba(255,255,255,.22);color:#fff;font-size:26px;font-weight:500;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.1;backdrop-filter:blur(6px);}
.pad-key:active{background:rgba(255,255,255,.4);}
.pad-key small{font-size:10px;letter-spacing:2px;opacity:.85;font-weight:600;}
.pad-key.del{background:transparent;font-size:15px;}
.lock-pad-hint{font-size:11px;color:rgba(255,255,255,.7);margin-top:18px;}

/* ================= 通用 App 框架 ================= */
#layer-app{background:var(--bg);}
.app-view{flex:1;overflow:hidden;position:relative;display:flex;flex-direction:column;}
.app-page{flex:1;display:flex;flex-direction:column;overflow:hidden;}
.app-nav{
  flex:none;display:flex;align-items:center;gap:8px;padding:6px 14px 10px;font-size:16px;font-weight:700;
}
.app-nav .back{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--ink);background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow-soft);}
.app-nav .back .ico-svg{width:18px;height:18px;}
.app-nav .nav-title{flex:1;text-align:center;font-size:16px;font-weight:600;}
.app-nav .nav-act{font-size:14px;color:var(--mist-deep);font-weight:600;padding:6px 10px;min-width:50px;display:flex;align-items:center;justify-content:flex-end;}
.app-nav .nav-act .ico-svg{width:21px;height:21px;}
.app-body{flex:1;overflow-y:auto;padding:0 16px 20px;-webkit-overflow-scrolling:touch;}
.app-home-bar{flex:none;}

/* ================= 卡片/分组/表单 ================= */
.group{margin-bottom:18px;}
.group-title{font-size:12px;color:var(--ink-3);font-weight:600;padding:0 8px;margin-bottom:8px;letter-spacing:.8px;}
.card{background:var(--card);border-radius:var(--r-lg);box-shadow:var(--shadow-soft);border:1px solid var(--line);overflow:hidden;}
.row{display:flex;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid var(--line);min-height:52px;}
.row:last-child{border-bottom:none;}
.row .r-ico{width:34px;height:34px;border-radius:11px;background:var(--mist-soft);color:var(--mist-deep);display:flex;align-items:center;justify-content:center;font-size:16px;flex:none;}
.row .r-ico .ico-svg{width:19px;height:19px;}
.row .r-main{flex:1;min-width:0;}
.row .r-label{font-size:14.5px;font-weight:500;color:var(--ink);}
.row .r-sub{font-size:12px;color:var(--ink-3);margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.row .r-val{font-size:13px;color:var(--ink-2);max-width:46%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.chev{color:var(--ink-3);font-size:17px;flex:none;display:flex;align-items:center;}
.chev .ico-svg{width:16px;height:16px;}

.field{padding:11px 16px;border-bottom:1px solid var(--line);}
.field:last-child{border-bottom:none;}
.field label{display:block;font-size:12px;color:var(--ink-3);font-weight:600;margin-bottom:6px;}
.field input,.field textarea,.field select{
  width:100%;background:var(--card-soft);border-radius:var(--r-field);padding:12px 14px;font-size:14px;color:var(--ink);
  border:1px solid transparent;transition:border-color .2s;resize:none;
}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--mist);background:#fff;}
.field textarea{min-height:96px;line-height:1.6;}
.field .hint{font-size:11px;color:var(--muted);margin-top:5px;}

.btn{
  display:flex;align-items:center;justify-content:center;gap:7px;
  background:var(--mist-deep);color:#fff;font-weight:600;font-size:15px;
  border-radius:var(--r-field);padding:14px;width:100%;box-shadow:0 6px 16px rgba(123,146,171,.28);
  transition:transform .12s,opacity .2s;
}
.btn:active{transform:scale(.975);}
.btn.ghost{background:#fff;color:var(--mist-deep);box-shadow:var(--shadow-soft);border:1px solid var(--line-2);}
.btn.gray{background:var(--card-soft);color:var(--ink);box-shadow:none;}
.btn.danger{background:#D99494;box-shadow:0 6px 16px rgba(180,110,110,.22);}
.btn.sm{padding:9px 16px;width:auto;font-size:13px;border-radius:13px;}
.btn:disabled{opacity:.55;}

/* 开关 */
.switch{position:relative;width:48px;height:29px;border-radius:16px;background:#DDE2E8;transition:background .25s;flex:none;}
.switch::after{content:"";position:absolute;top:2.5px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(22,25,30,.18);transition:transform .25s;}
.switch.on{background:var(--mist-deep);}
.switch.on::after{transform:translateX(18px);}

/* 分段选择 */
.seg{display:flex;background:var(--field);border-radius:var(--r-md);padding:3px;gap:3px;}
.seg span{flex:1;text-align:center;padding:7px 4px;border-radius:12px;font-size:13px;color:var(--muted);font-weight:600;}
.seg span.on{background:#fff;color:var(--text);box-shadow:var(--shadow-soft);}

/* ================= 设置页分段 Tab ================= */
/* 设置页：问候标题 + 个人卡 */
.set-hero{padding:12px 6px 0;}
.set-hello{font-size:13px;color:var(--ink-3);letter-spacing:.5px;}
.set-title{font-size:30px;font-weight:700;letter-spacing:1px;margin:2px 0 16px;color:var(--ink);}
.profile-card{display:flex;align-items:center;gap:14px;padding:16px;margin-bottom:20px;}
.pc-ava{
  width:58px;height:58px;border-radius:50%;flex:none;
  background:var(--mist-soft);color:var(--mist-deep);
  display:flex;align-items:center;justify-content:center;
  background-size:cover;background-position:center;
}
.pc-ava .ico-svg{width:26px;height:26px;}
.pc-main{flex:1;min-width:0;}
.pc-name{font-size:16.5px;font-weight:600;color:var(--ink);}
.pc-sub{display:flex;align-items:center;gap:8px;margin-top:5px;font-size:12px;color:var(--ink-3);}
.api-btn-row{display:flex;gap:10px;padding:13px 16px 15px;}
.api-btn-row .btn{flex:1;width:auto;margin:0;}
.model-chips{display:flex;flex-wrap:wrap;gap:8px;padding:0 16px 15px;}
.model-chip{
  padding:7px 14px;border-radius:20px;background:var(--field);
  font-size:12.5px;color:#000;border:1px solid transparent;max-width:100%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.model-chip.on{background:var(--mist-soft);border-color:var(--mist);color:var(--ink);}

/* ================= 页内背景编辑器（URL 输入 + 应用，无弹窗） ================= */
.bg-input-row{display:flex;gap:9px;}
.bg-input{
  flex:1;min-width:0;background:var(--card-soft);border:1px solid transparent;
  border-radius:14px;padding:10px 13px;font-size:13px;color:var(--ink);
}
.bg-input::placeholder{color:var(--ink-3);}
.bg-input:focus{background:#fff;border-color:var(--mist);}
.bg-apply{
  flex:none;padding:0 20px;border-radius:14px;background:var(--mist-deep);
  color:#fff;font-size:13.5px;font-weight:600;
}
.bg-apply:active{opacity:.85;}
.bg-actions{display:flex;flex-wrap:wrap;gap:20px;margin-top:10px;}
.bg-actions button{
  font-size:12.5px;color:var(--mist-deep);padding:2px 0;background:none;font-weight:500;
}

/* 色块选择 */
.swatches{display:flex;gap:10px;flex-wrap:wrap;}
.swatch{width:34px;height:34px;border-radius:11px;border:2px solid transparent;box-shadow:var(--shadow-soft);position:relative;display:flex;align-items:center;justify-content:center;}
.swatch .ico-svg{width:15px;height:15px;}
.swatch.on::after{content:"✓";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;text-shadow:0 1px 2px rgba(0,0,0,.25);}

/* Toast / Modal / Sheet */
#toast-root{position:absolute;inset:0;z-index:200;pointer-events:none;display:flex;flex-direction:column;align-items:center;padding-top:120px;gap:10px;}
.toast{
  background:rgba(60,52,46,.92);color:#fff;font-size:13px;padding:11px 20px;border-radius:14px;
  max-width:78%;text-align:center;line-height:1.5;animation:toastIn .3s;box-shadow:0 8px 24px rgba(0,0,0,.25);
}
.toast.ok{background:rgba(123,146,171,.96);color:#fff;}
.toast.err{background:rgba(210,130,130,.96);}
@keyframes toastIn{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}

#modal-root{position:absolute;inset:0;z-index:150;display:none;align-items:center;justify-content:center;background:rgba(22,25,30,.3);backdrop-filter:blur(2px);padding:34px;}
#modal-root.show{display:flex;}
.modal{background:#fff;border-radius:22px;width:100%;max-width:310px;padding:22px 20px 16px;box-shadow:0 20px 50px rgba(22,25,30,.22);animation:modalIn .28s cubic-bezier(.2,.9,.3,1.2);}
@keyframes modalIn{from{transform:scale(.9);opacity:0}to{transform:none;opacity:1}}
.modal h3{font-size:17px;text-align:center;margin-bottom:8px;}
.modal p{font-size:13px;color:var(--muted);text-align:center;margin-bottom:18px;line-height:1.6;}
.modal .m-btns{display:flex;gap:10px;}
.modal .m-btns .btn{padding:12px;}

#sheet-root{position:absolute;inset:0;z-index:120;pointer-events:none;}
.sheet-mask{position:absolute;inset:0;background:rgba(22,25,30,.26);opacity:0;transition:opacity .25s;pointer-events:auto;}
.sheet{
  position:absolute;left:0;right:0;bottom:0;max-height:82%;background:var(--bg);
  border-radius:24px 24px 0 0;padding:10px 16px 26px;transform:translateY(102%);
  transition:transform .32s cubic-bezier(.3,.85,.3,1);pointer-events:auto;display:flex;flex-direction:column;
  box-shadow:0 -12px 40px rgba(22,25,30,.18);
}
#sheet-root.open .sheet-mask{opacity:1;}
#sheet-root.open .sheet{transform:none;}
.sheet-handle{width:40px;height:4.5px;border-radius:3px;background:#D8DDE3;margin:2px auto 10px;flex:none;}
.sheet-title{font-size:15px;font-weight:700;text-align:center;margin-bottom:12px;flex:none;}
.sheet-body{overflow-y:auto;padding-bottom:4px;}

/* ================= 选择大卡片（角色创建入口等） ================= */
.big-cards{display:flex;flex-direction:column;gap:14px;padding-top:6px;}
.big-card{
  background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-soft);padding:22px 18px;
  display:flex;align-items:center;gap:16px;transition:transform .15s;
}
.big-card:active{transform:scale(.98);}
.big-card .bc-ico{width:56px;height:56px;border-radius:18px;background:var(--mist-soft);color:var(--mist-deep);display:flex;align-items:center;justify-content:center;font-size:28px;flex:none;}
.big-card .bc-ico .ico-svg{width:28px;height:28px;}
.big-card .bc-t{font-size:16px;font-weight:700;}
.big-card .bc-s{font-size:12px;color:var(--muted);margin-top:3px;line-height:1.5;}

/* 头像 */
.avatar{border-radius:50%;background:var(--mist);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;overflow:hidden;background-size:cover;background-position:center;flex:none;}
.avatar .ico-svg{width:20px;height:20px;}
.avatar-upload{width:84px;height:84px;border-radius:50%;background:var(--card-soft);border:1px solid var(--line);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--ink-3);font-size:11px;overflow:hidden;position:relative;background-size:cover;background-position:center;}
.avatar-upload .ico-svg{width:24px;height:24px;}
.avatar-upload .pl{display:flex;flex-direction:column;align-items:center;gap:3px;}
.center-head{display:flex;flex-direction:column;align-items:center;gap:8px;margin:6px 0 18px;}

/* 角色列表 */
.char-item{display:flex;align-items:center;gap:13px;padding:13px 16px;border-bottom:1px solid var(--line);}
.char-item:last-child{border-bottom:none;}
.char-item .ci-info{flex:1;min-width:0;}
.char-item .ci-name{font-size:15px;font-weight:700;}
.char-item .ci-note{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* ================= 聊天 ================= */
.chat-wrap{flex:1;height:100%;display:flex;flex-direction:column;overflow:hidden;position:relative;}
.chat-theme{--chat-bg:var(--bg);--l-bubble:#fff;--l-text:var(--ink);
  --r-bubble-bg:linear-gradient(135deg,#AFC6DE 0%,#7B92AB 100%);--r-text:#fff;
  --r-trans-line:rgba(255,255,255,.45);
  --tail-l:6px;--tail-r:6px;--chat-radius:20px;
  --hdr-bg:rgba(251,252,253,.82);--hdr-border:rgba(123,138,160,.18);
  --hdr-name:var(--ink);--hdr-status:var(--ink-3);
  --hdr-btn-bg:rgba(255,255,255,.9);--hdr-btn-color:var(--ink-2);--hdr-btn-border:var(--line);
  --input-shell:#fff;--field-bg:var(--card-soft);--field-border:var(--line);--field-text:var(--ink);
  --panel-bg:rgba(251,252,253,.97);
  --send-bg:linear-gradient(135deg,#AFC6DE,#7B92AB);--send-fg:#fff;--send-radius:12px;
  --accent:#7B92AB;--time-bg:rgba(255,255,255,.75);--time-fg:#8A93A0;--meta-fg:#7E8794;
  --ava-radius:50%;--hdr-btn-radius:50%;--field-radius:18px;--mock-r:5px;
  background:var(--chat-bg);}
.chat-header{
  flex:none;display:flex;align-items:center;gap:8px;padding:7px 12px 9px;background:var(--hdr-bg);
  border-bottom:1px solid var(--hdr-border);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:5;
}
.chat-header .back,.chat-header .ch-set,.chat-header .ch-music{
  width:34px;height:34px;border-radius:var(--hdr-btn-radius);background:var(--hdr-btn-bg);
  border:1px solid var(--hdr-btn-border);box-shadow:var(--shadow-soft);
  display:flex;align-items:center;justify-content:center;color:var(--hdr-btn-color);flex:none;
}
.chat-header .back .ico-svg,.chat-header .ch-set .ico-svg,.chat-header .ch-music .ico-svg{width:18px;height:18px;}
.chat-header .ch-music.on{background:var(--send-bg);border-color:transparent;color:var(--send-fg);position:relative;}
.chat-header .ch-music.on::after{content:'';position:absolute;right:3px;top:3px;width:6px;height:6px;border-radius:50%;background:#fff;border:1.5px solid var(--send-fg);}

/* 迷你播放器（从顶栏下滑） */
.music-bar{
  flex:none;max-height:0;opacity:0;overflow:hidden;background:var(--panel-bg);
  border-bottom:1px solid transparent;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  transition:max-height .28s ease,opacity .2s ease,border-color .28s ease;z-index:4;
}
.music-bar.show{max-height:86px;opacity:1;border-bottom-color:var(--hdr-border);}
.mb-inner{display:flex;align-items:center;gap:10px;padding:10px 14px;}
.mb-cover{width:42px;height:42px;border-radius:13px;background:var(--send-bg);color:var(--send-fg);display:flex;align-items:center;justify-content:center;flex:none;box-shadow:0 4px 12px rgba(123,146,171,.35);}
.mb-cover .ico-svg{width:21px;height:21px;}
.mb-info{flex:1;min-width:0;}
.mb-title{font-size:13.5px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mb-sub{display:flex;align-items:center;gap:6px;margin-top:2px;font-size:10.5px;color:var(--ink-3);white-space:nowrap;overflow:hidden;}
.mb-live{color:var(--mist-deep);font-weight:600;flex:none;}
.mb-artist{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mb-ctl{display:flex;align-items:center;gap:5px;flex:none;}
.mb-btn{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--ink-2);}
.mb-btn .ico-svg{width:17px;height:17px;fill:currentColor;stroke:none;}
.mb-btn.mb-play{width:36px;height:36px;background:var(--send-bg);color:var(--send-fg);box-shadow:0 4px 12px rgba(123,146,171,.4);}
.mb-btn.mb-play .ico-svg{width:18px;height:18px;}
.mb-close{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--ink-3);flex:none;}
.mb-close .ico-svg{width:14px;height:14px;}
.chat-header .ch-ava{width:38px;height:38px;border-radius:var(--ava-radius);background-size:cover;background-position:center;background-color:var(--mist);flex:none;}
/* 人名贴近顶栏中心线并略偏上（与返回/功能按钮同线），状态行紧跟人名正下方 */
.chat-header .ch-info{flex:1;min-width:0;align-self:stretch;position:relative;}
.chat-header .ch-name{position:absolute;left:0;right:0;top:calc(50% - 7px);transform:translateY(-50%);
  font-size:15px;font-weight:600;line-height:20px;color:var(--hdr-name);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;}
.chat-header .ch-status{position:absolute;left:0;right:0;top:calc(50% + 8px);
  font-size:10.5px;line-height:14px;color:var(--hdr-status);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;}
.chat-header .ch-status.typing{color:var(--accent);}
.chat-msgs{flex:1;overflow-y:auto;padding:6px 14px 10px;display:flex;flex-direction:column;gap:4px;}
.msg-time{align-self:center;font-size:11px;color:var(--time-fg);background:var(--time-bg);border:1px solid var(--hdr-border);padding:2px 10px;border-radius:10px;margin:8px 0 4px;}
.msg{display:flex;gap:9px;max-width:80%;align-items:flex-end;animation:msgIn .25s ease;}
@keyframes msgIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.msg .m-ava{width:36px;height:36px;border-radius:var(--ava-radius);background-size:cover;background-position:center;background-color:var(--mist);flex:none;overflow:hidden;box-shadow:var(--shadow-soft);}
.msg .m-ava img{width:100%;height:100%;object-fit:cover;border-radius:var(--ava-radius);}
/* 无头像时的兜底圆：玩家=品牌蓝渐变，角色=中性灰蓝渐变 */
.m-ava .ava-fallback{width:100%;height:100%;border-radius:var(--ava-radius);display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;}
.m-ava .ava-mine{background:linear-gradient(135deg,#AFC6DE,#7B92AB);font-weight:500;}
.m-ava .ava-char{background:linear-gradient(135deg,#B8C2CE,#94A0AF);font-weight:500;}
.msg.left{align-self:flex-start;}
.msg.right{align-self:flex-end;flex-direction:row-reverse;}
.bubble{
  padding:10px 14px;border-radius:var(--chat-radius);font-size:inherit;line-height:1.55;position:relative;
  word-break:break-word;
}
.msg.left .bubble{
  background:var(--l-bubble);color:var(--l-text);
  border:1px solid var(--line);
  border-top-left-radius:var(--tail-l,var(--chat-radius));
  border-bottom-left-radius:var(--tail-bl,var(--chat-radius));
  box-shadow:0 1px 2px rgba(22,25,30,.04);
}
.msg.right .bubble{
  background:var(--r-bubble-bg);color:var(--r-text);
  border:1px solid transparent;
  border-top-right-radius:var(--tail-r,var(--chat-radius));
  border-bottom-right-radius:var(--tail-br,var(--chat-radius));
  box-shadow:0 4px 14px rgba(123,146,171,.28);
}
.no-tail .msg.left .bubble{border-top-left-radius:var(--chat-radius);border-bottom-left-radius:var(--chat-radius);}
.no-tail .msg.right .bubble{border-top-right-radius:var(--chat-radius);border-bottom-right-radius:var(--chat-radius);}
.bubble .b-trans{display:block;margin-top:7px;padding-top:7px;border-top:1px dashed var(--r-trans-line,rgba(255,255,255,.45));font-size:12.5px;opacity:.88;line-height:1.5;}
.msg.left .b-trans{border-top-color:rgba(87,96,110,.22);}
.b-trans .bt-tag{display:inline-block;font-size:9px;line-height:1;font-weight:600;padding:3px 5px;border-radius:5px;margin-right:6px;vertical-align:1.5px;background:rgba(255,255,255,.28);letter-spacing:1px;}
.msg.left .bt-tag{background:var(--mist-soft);color:var(--mist-deep);}
/* 时间/已读：贴在气泡外侧（左消息在右、右消息在左），底部对齐，不占气泡下方 */
.msg .m-meta{flex:none;align-self:flex-end;display:flex;align-items:center;gap:4px;
  font-size:10px;line-height:1;color:var(--meta-fg);margin:0 2px 5px;white-space:nowrap;}
.msg .m-meta .mm-read,.msg .m-meta .mm-time{opacity:.7;}
/* 未读红色小圆标：自己消息显示在气泡旁的 meta 行；对方消息显示在气泡左侧 */
.mm-unread{min-width:15px;height:15px;padding:0 4px;border-radius:8px;background:#FA3D3D;color:#fff;
  font-size:9.5px;font-weight:700;font-style:normal;display:inline-flex;align-items:center;justify-content:center;
  line-height:1;box-shadow:0 1px 4px rgba(250,61,61,.4);}
.msg .m-meta .mm-unread{align-self:center;}
.mm-dot-left{flex:none;align-self:center;margin:0 6px 0 0;}
/* 功能卡（红包/转账/外卖/位置/名片）本身较宽，允许占满整行，给旁边的时间留出位置 */
.msg.m-wide{max-width:100%;}
/* 气泡内引用块 */
.b-quote{max-width:230px;min-width:0;display:flex;gap:7px;align-items:stretch;background:rgba(123,146,171,.13);border-radius:10px;padding:6px 9px;margin:0 0 4px;}
.b-quote .bq-name{font-size:10.5px;font-weight:700;color:var(--mist-deep);flex:none;}
.b-quote .bq-txt{font-size:11.5px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.b-quote::before{content:'';width:3px;border-radius:2px;background:linear-gradient(180deg,#AFC6DE,#7B92AB);flex:none;}
.msg.right .m-side{display:flex;flex-direction:column;align-items:flex-end;min-width:0;}
.msg.left .m-side{display:flex;flex-direction:column;min-width:0;}
.sys-tip{align-self:center;font-size:11px;color:var(--time-fg);background:var(--time-bg);border:1px solid var(--hdr-border);padding:3px 12px;border-radius:10px;margin:4px 0;max-width:78%;text-align:center;}
.sys-tip.recall{font-style:normal;}

/* 语音条 */
.bubble.voice{display:flex;align-items:center;gap:8px;min-width:104px;}
.voice-waves{display:flex;align-items:center;gap:2px;height:18px;}
.voice-waves i{width:3px;background:currentColor;border-radius:2px;opacity:.6;}
.msg.right.playing .voice-waves i,.msg.left.playing .voice-waves i{animation:wv .8s infinite ease-in-out;}
@keyframes wv{0%,100%{height:5px}50%{height:17px}}
.voice-dur{font-size:12px;opacity:.8;}

/* 图片消息 */
.bubble.photo:not(.ph-card){padding:4px;background:transparent!important;box-shadow:none;}
.bubble.photo img{width:170px;border-radius:calc(var(--chat-radius) - 3px);display:block;}
/* 文字描述生成的占位图卡 */
.bubble.photo.ph-card{width:172px;height:134px;border-radius:calc(var(--chat-radius) - 3px);
  background:linear-gradient(155deg,#C6D5E5 0%,#97ABC2 52%,#7B92AB 100%)!important;
  border:none;box-shadow:0 4px 14px rgba(123,146,171,.28);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
  text-align:center;padding:14px;color:#fff;overflow:hidden;}
.ph-card .ph-ico{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;flex:none;}
.ph-card .ph-ico .ico-svg{width:20px;height:20px;}
.ph-card .ph-t{font-size:12.5px;font-weight:600;line-height:1.45;max-width:140px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 1px 3px rgba(60,80,105,.35);}
/* 底部弹层操作行 */
.act-row{display:flex;align-items:center;gap:12px;padding:14px 6px;border-bottom:1px solid var(--line);font-size:14.5px;color:var(--ink);}
.act-row:last-child{border-bottom:none;}
.act-row .ico-svg{width:19px;height:19px;color:var(--mist-deep);flex:none;}

/* 转账/红包卡片：顶部渐隐细线 · 大留白 · 超细字重；未领红包仅一点低饱和玫瑰，领取/退回后转中性态 */
.msg .bubble.money{min-width:196px;max-width:226px;padding:0;overflow:hidden;
  background:#fff;border:1px solid #EDF0F3;color:var(--ink);
  box-shadow:0 6px 18px rgba(74,96,128,.08);}
.msg .bubble.money::before{content:'';display:block;height:1px;margin:0 24px;
  background:linear-gradient(90deg,transparent,rgba(123,138,160,.38),transparent);}
.mn-head{display:flex;align-items:center;gap:8px;padding:17px 18px 19px;background:#fff;}
.mn-ico{width:38px;height:38px;border-radius:50%;background:#F4F6F8;color:#AEB7C2;
  display:flex;align-items:center;justify-content:center;flex:none;}
.mn-ico .ico-svg{width:19px;height:19px;}
.mn-main{flex:1;min-width:0;}
.mn-title{font-size:11px;letter-spacing:2.5px;font-weight:300;color:#A6ADB8;line-height:1.3;}
.mn-note{font-size:14px;font-weight:300;margin-top:5px;color:var(--ink);line-height:1.4;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mn-amt{font-size:22px;font-weight:300;letter-spacing:-.3px;font-variant-numeric:tabular-nums;flex:none;color:var(--ink);}
.mn-amt small{font-size:12px;font-weight:300;margin-right:2px;color:var(--ink-2);}
.mn-foot{position:relative;display:flex;align-items:center;gap:6px;
  padding:13px 18px 15px;font-size:12px;font-weight:300;color:#A6ADB8;background:#fff;}
.mn-foot::before{content:'';position:absolute;left:24px;right:24px;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(123,138,160,.26),transparent);}
.mn-foot .mf-dot{display:inline-flex;align-items:center;color:#C2C9D2;}
.mn-foot .mf-dot .ico-svg{width:12px;height:12px;}
/* 未领取红包：全卡唯一的低饱和玫瑰点缀（图标 + 小圆点） */
.msg .bubble.is-rp:not(.is-done):not(.is-rej) .mn-ico{background:#F7ECEE;color:#B5737F;}
.msg .bubble.is-rp:not(.is-done):not(.is-rej) .mn-foot .mf-dot{color:#D9A3AB;}
/* 已被领取 / 已收款：图标与金额转中性，状态行玫瑰灰 */
.mn-foot.done{color:#B5737F;}
.is-done .mn-ico,.is-rej .mn-ico{background:#F2F4F7;color:#B3BCC8;}
.is-done .mn-amt,.is-rej .mn-amt{color:#AEB7C2;}
.is-done .mn-amt small,.is-rej .mn-amt small{color:#AEB7C2;}
/* 被拒收 / 已退回：整卡彻底中性 */
.is-rej .mn-foot.done{color:#A6ADB8;}
/* 查看弹层 */
.mn-view{text-align:center;padding:6px 4px 2px;}
.mn-view .mv-ico{width:52px;height:52px;border-radius:50%;margin:0 auto 10px;display:flex;align-items:center;justify-content:center;
  color:#fff;background:linear-gradient(135deg,#D9A3AB,#B5737F);box-shadow:0 6px 16px rgba(181,115,127,.28);}
.mn-view .mv-ico.tr{background:#F2F4F7;color:var(--mist-deep);box-shadow:none;}
.mn-view .mv-ico.done{background:#F2F4F7;color:#A9B4C2;box-shadow:none;}
.mn-view .mv-ico .ico-svg{width:25px;height:25px;}
.mn-view .mv-amt{font-size:26px;font-weight:300;color:var(--ink);font-variant-numeric:tabular-nums;}
.mn-view .mv-note{font-size:13px;font-weight:300;color:var(--ink-2);margin-top:6px;}
.mn-view .mv-status{font-size:11.5px;font-weight:300;color:var(--ink-3);margin-top:10px;padding-top:10px;border-top:1px solid var(--line);}
.mn-view .mv-status.done{color:#B5737F;}
.mn-view .mv-status.rej{color:var(--ink-3);}
/* 发红包/转账弹窗 */
.money-in{padding:2px 0 0;}
.mi-amt{display:flex;align-items:baseline;justify-content:center;gap:3px;border-bottom:1px solid var(--line);padding:10px 0 14px;}
.mi-yen{font-size:22px;font-weight:700;color:var(--ink);}
.mi-amt input{width:168px;border:none;outline:none;background:transparent;text-align:center;font-size:32px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;padding:0;}
.mi-quick{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding:14px 0;}
.mi-chip{background:var(--mist-soft);color:var(--mist-deep);border:1px solid transparent;border-radius:15px;padding:7px 14px;font-size:13px;font-weight:600;}
.mi-chip:active{background:#E2EAF3;}
.mi-note{width:100%;background:#F6F7F9;border:1px solid #ECEEF1;border-radius:14px;padding:11px 13px;font-size:14px;text-align:center;}

/* 名片卡 */
.msg .bubble.namecard{min-width:196px;padding:13px 16px;background:#fff;color:var(--ink);border:1px solid #EDF0F3;box-shadow:0 6px 18px rgba(74,96,128,.08);}
.bubble.namecard .cm-n{font-weight:400;}
.bubble.namecard .cm-t{color:var(--muted);}

/* 一起听歌邀请卡：顶部渐隐细线 · 大留白 · 细字重；等待/已加入淡蓝，婉拒转中性灰 */
.msg .bubble.mcard{min-width:200px;max-width:226px;padding:0;overflow:hidden;
  background:#fff;border:1px solid #EDF0F3;color:var(--ink);box-shadow:0 6px 18px rgba(74,96,128,.08);}
.msg .bubble.mcard::before{content:'';display:block;height:1px;margin:0 22px;
  background:linear-gradient(90deg,transparent,rgba(123,138,160,.38),transparent);}
.mc-head{display:flex;align-items:center;gap:11px;padding:17px 18px 16px;background:#fff;}
.mc-ico{width:38px;height:38px;border-radius:50%;background:#EEF3F8;color:#8FA0B5;flex:none;
  display:flex;align-items:center;justify-content:center;}
.mc-ico .ico-svg{width:19px;height:19px;}
.mc-main{flex:1;min-width:0;}
.mc-title{font-size:11px;font-weight:300;letter-spacing:2.5px;color:#A6ADB8;line-height:1.3;}
.mc-name{font-size:14.5px;font-weight:300;margin-top:5px;color:var(--ink);line-height:1.4;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mc-art{font-size:11px;font-weight:300;color:#AEB7C2;margin-top:2px;}
.mc-live{flex:none;font-size:15px;color:#7B92AB;line-height:1;}
.mc-foot{position:relative;display:flex;align-items:center;gap:6px;
  padding:13px 18px 15px;font-size:12px;font-weight:300;color:#8FA0B5;background:#fff;}
.mc-foot::before{content:'';position:absolute;left:22px;right:22px;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(123,138,160,.26),transparent);}
.mc-foot .mf-dot{display:inline-flex;align-items:center;color:#A9B8CA;}
.mc-foot .mf-dot .ico-svg{width:12px;height:12px;}
.mcard.is-on .mc-ico{background:#E7EFF8;color:#7B92AB;}
.mcard.is-on .mc-live{animation:mpPulse 1.6s ease-in-out infinite;}
@keyframes mpPulse{0%,100%{opacity:.55}50%{opacity:1}}
.mcard.is-rej .mc-ico{background:#F2F4F7;color:#B3BCC8;}
.mcard.is-rej .mc-name{color:#AEB7C2;}
.mcard.is-rej .mc-foot{color:#A6ADB8;}

/* ================= 全屏听歌面板 ================= */
.mplayer{position:absolute;inset:0;z-index:40;display:flex;flex-direction:column;
  background:linear-gradient(165deg,#F7FAFD 0%,#EAF0F8 45%,#DCE6F2 100%);
  color:#41506A;animation:mpIn .28s ease;}
.mplayer[hidden]{display:none;}
@keyframes mpIn{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
.mp-in{flex:1;min-height:0;display:flex;flex-direction:column;
  padding:calc(12px + env(safe-area-inset-top)) 24px calc(16px + env(safe-area-inset-bottom));}
.mp-top{display:flex;align-items:center;justify-content:space-between;flex:none;}
.mp-icon{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.65);
  border:1px solid rgba(123,146,171,.18);color:#6E7E96;flex:none;
  display:flex;align-items:center;justify-content:center;backdrop-filter:blur(6px);}
.mp-icon .ico-svg{width:19px;height:19px;}
.mp-mode{font-size:12px;letter-spacing:3px;font-weight:300;color:#7B92AB;white-space:nowrap;}
.mp-cover{position:relative;align-self:center;width:168px;height:168px;margin:18px auto 15px;flex:none;
  border-radius:50%;background:radial-gradient(circle at 32% 28%,#DCE6F2,#AEBFD4 70%,#93A8C2);
  box-shadow:0 20px 44px rgba(103,125,153,.32),inset 0 0 0 9px rgba(255,255,255,.55);
  display:flex;align-items:center;justify-content:center;}
.mp-disc{position:absolute;width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.92);
  box-shadow:0 2px 8px rgba(90,110,140,.25);}
.mp-note-ico{position:relative;z-index:1;width:25px;height:25px;color:#8FA3BC;}
.mplayer.playing .mp-cover{animation:mpSpin 26s linear infinite;}
@keyframes mpSpin{to{transform:rotate(360deg);}}
.mp-meta{text-align:center;flex:none;}
.mp-meta .mp-title{font-size:19px;font-weight:600;color:#3A465C;letter-spacing:.5px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 12px;}
.mp-meta .mp-artist{margin-top:5px;font-size:12.5px;font-weight:300;color:#8493A8;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.mp-lrc{flex:1;min-height:90px;margin-top:12px;overflow-y:auto;overflow-x:hidden;text-align:center;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 16%,#000 84%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 16%,#000 84%,transparent);}
.mp-lrc::-webkit-scrollbar{display:none;}
.mp-lrc-in{min-height:100%;display:flex;flex-direction:column;justify-content:center;
  padding:16px 2px;gap:16px;}
.lrc-line{margin:0;font-size:14.5px;line-height:1.55;font-weight:400;
  color:var(--lrc-color,#7B92AB);opacity:.38;transition:opacity .3s,transform .3s;}
.lrc-line.on{opacity:1;font-weight:500;transform:scale(1.05);}
.lrc-empty{color:#8493A8;font-size:13px;line-height:2;font-weight:300;}
.lrc-empty span{display:block;font-size:11px;opacity:.7;}
.mp-prog{display:flex;align-items:center;gap:10px;flex:none;margin-top:6px;}
.mp-time{font-size:10.5px;color:#8493A8;font-variant-numeric:tabular-nums;width:34px;text-align:center;flex:none;}
.mp-seek{flex:1;-webkit-appearance:none;appearance:none;height:3px;border-radius:2px;
  background:rgba(123,146,171,.28);outline:none;cursor:pointer;}
.mp-seek::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;
  background:#7B92AB;box-shadow:0 1px 4px rgba(90,110,140,.4);}
.mp-seek::-moz-range-thumb{width:12px;height:12px;border:none;border-radius:50%;background:#7B92AB;}
.mp-ctl{display:flex;align-items:center;justify-content:center;gap:34px;flex:none;margin:15px 0 2px;}
.mp-cbtn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:#5A6B84;}
.mp-cbtn .ico-svg{width:26px;height:26px;fill:currentColor;stroke:none;}
.mp-cbtn.mp-main{width:62px;height:62px;border-radius:50%;
  background:linear-gradient(135deg,#AFC6DE,#7B92AB);color:#fff;box-shadow:0 10px 22px rgba(123,146,171,.42);}
.mp-cbtn.mp-main .ico-svg{width:27px;height:27px;}
.mp-foot{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;flex:none;margin-top:8px;}
.mp-fbtn{width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.7);
  border:1px solid rgba(123,146,171,.2);display:flex;align-items:center;justify-content:center;flex:none;}
.mp-fbtn .mp-a{font-size:15px;font-weight:600;color:var(--lrc-color,#7B92AB);}
.mp-fph{width:42px;flex:none;}
.mp-invite{flex:1;max-width:240px;height:42px;border-radius:21px;
  background:rgba(255,255,255,.78);border:1px solid rgba(123,146,171,.22);color:#5A6B84;
  font-size:13px;font-weight:400;display:flex;align-items:center;justify-content:center;gap:7px;
  backdrop-filter:blur(6px);white-space:nowrap;}
.mp-invite .ico-svg{width:17px;height:17px;flex:none;}
.mp-invite.busy{opacity:.6;}
.mp-invite.on{background:linear-gradient(135deg,#D9A3AB,#B5737F);border-color:transparent;color:#fff;}
.mp-palette{position:absolute;left:24px;bottom:56px;z-index:2;
  background:rgba(255,255,255,.94);border:1px solid rgba(123,146,171,.2);border-radius:20px;
  padding:9px 13px;display:flex;gap:11px;box-shadow:0 10px 26px rgba(90,110,140,.22);}
.mp-palette[hidden]{display:none;}
.mp-dot{width:20px;height:20px;border-radius:50%;border:2px solid rgba(255,255,255,.85);
  box-shadow:0 0 0 1px rgba(123,146,171,.25);padding:0;}
.mp-dot.on{box-shadow:0 0 0 2px #5A6B84;}

/* 歌单抽屉 / 添加歌曲表单 */
.song-list{display:flex;flex-direction:column;text-align:left;}
.sl-row{display:flex;align-items:center;gap:12px;padding:12px 4px;border-bottom:1px solid var(--line);}
.sl-row:last-child{border-bottom:none;}
.sl-ico{width:34px;height:34px;border-radius:50%;background:#EEF3F8;color:#8FA0B5;flex:none;
  display:flex;align-items:center;justify-content:center;}
.sl-ico .ico-svg{width:16px;height:16px;}
.sl-main{flex:1;min-width:0;}
.sl-n{font-size:14.5px;font-weight:400;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sl-a{font-size:11.5px;color:var(--ink-3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sl-del{width:28px;height:28px;border-radius:50%;color:#B8C0CC;font-size:19px;line-height:1;flex:none;}
.sl-del:active{background:#F1F3F6;color:#B5737F;}
.sl-empty{text-align:center;color:var(--ink-3);font-size:13px;padding:30px 0;}
.sl-add{margin-top:14px;}
.msong{display:flex;flex-direction:column;gap:9px;text-align:left;}
.msong input,.msong textarea{width:100%;background:#F6F7F9;border:1px solid #ECEEF1;border-radius:13px;
  padding:11px 13px;font-size:14px;font-family:inherit;color:var(--ink);resize:none;}
.msong textarea{line-height:1.6;}

/* 外卖订单卡片：顶部渐隐细线 · 大留白 · 细字重，进度仅靠徽标层级 */
.msg .bubble.takeaway{min-width:208px;max-width:226px;padding:0;overflow:hidden;background:#fff;border:1px solid #EDF0F3;box-shadow:0 6px 18px rgba(74,96,128,.08);color:var(--ink);}
.msg .bubble.takeaway::before{content:'';display:block;height:1px;margin:0 24px;background:linear-gradient(90deg,transparent,rgba(123,138,160,.38),transparent);}
.tk-head{display:flex;align-items:center;gap:11px;padding:18px 20px 0;background:#fff;}
.tk-ico{width:38px;height:38px;border-radius:50%;background:#F4F6F8;color:#AEB7C2;
  display:flex;align-items:center;justify-content:center;flex:none;}
.tk-ico .ico-svg{width:19px;height:19px;}
.tk-hd{flex:1;min-width:0;}
.tk-t{font-size:13px;font-weight:300;letter-spacing:2px;color:#A6ADB8;}
.tk-badge{font-size:10px;padding:4px 10px;border-radius:10px;background:#F1F3F6;color:#98A1AD;white-space:nowrap;flex:none;font-weight:400;}
.tk-badge.st1{background:#E6EBF2;color:#5A6678;}
.tk-badge.st2{background:#8FA0B5;color:#fff;}
.tk-body{padding:15px 20px 2px;background:#fff;}
.tk-items{font-size:15px;color:var(--ink);line-height:1.65;font-weight:300;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.tk-meta{display:flex;flex-wrap:wrap;gap:6px 16px;padding:12px 0 17px;font-size:11.5px;font-weight:300;color:#A6ADB8;}
.tk-meta span{display:inline-flex;align-items:center;gap:4px;}
.tk-meta .ico-svg{width:13px;height:13px;}
.tk-track{position:relative;width:100%;border:none;background:#fff;padding:13px 0 14px;font-size:12.5px;color:#8FA0B5;font-weight:400;display:flex;align-items:center;justify-content:center;gap:5px;}
.tk-track::before{content:'';position:absolute;left:24px;right:24px;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(123,138,160,.26),transparent);}
.tk-track .ico-svg{width:14px;height:14px;}
.tk-track:active{background:#F7F8FA;}
.tk-track.done{color:#A6ADB8;font-weight:300;pointer-events:none;}
/* 位置卡 */
.msg .bubble.loc-card{min-width:200px;max-width:222px;padding:0;overflow:hidden;background:#fff;border:1px solid #EDF0F3;box-shadow:0 6px 18px rgba(74,96,128,.08);color:var(--ink);}
.msg .bubble.loc-card::before{content:'';display:block;height:1px;margin:0 24px;background:linear-gradient(90deg,transparent,rgba(123,138,160,.38),transparent);}
.lc-top{display:flex;align-items:center;gap:11px;padding:17px 20px 15px;background:#fff;color:var(--ink);}
.lc-ico{width:40px;height:40px;border-radius:50%;background:#F4F6F8;color:#AEB7C2;display:flex;align-items:center;justify-content:center;flex:none;}
.lc-ico .ico-svg{width:20px;height:20px;}
.lc-city{font-size:15px;font-weight:300;letter-spacing:.3px;color:var(--ink);}
.lc-wx{font-size:11.5px;font-weight:300;color:#A6ADB8;margin-top:3px;}
.lc-meta{display:flex;align-items:center;gap:5px;padding:11px 20px 0;font-size:11.5px;font-weight:300;color:#A6ADB8;background:#fff;}
.lc-meta .ico-svg{width:13px;height:13px;}
.lc-nav{position:relative;width:100%;border:none;background:#fff;margin-top:13px;padding:13px 0 14px;font-size:12.5px;color:#8FA0B5;font-weight:400;display:flex;align-items:center;justify-content:center;gap:5px;}
.lc-nav::before{content:'';position:absolute;left:24px;right:24px;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(123,138,160,.26),transparent);}
.lc-nav .ico-svg{width:14px;height:14px;}
.lc-nav:active{background:#F7F8FA;}
.card-msg{display:flex;align-items:center;gap:10px;min-width:180px;}
.card-msg .cm-ava{width:38px;height:38px;border-radius:10px;background:var(--mist-soft);color:var(--mist-deep);display:flex;align-items:center;justify-content:center;}
.card-msg .cm-ava .ico-svg{width:19px;height:19px;}
.card-msg .cm-ava img{width:100%;height:100%;border-radius:10px;object-fit:cover;}
.card-msg .cm-n{font-size:14px;font-weight:700;}
.card-msg .cm-t{font-size:11px;color:var(--muted);}

.chat-input{
  flex:none;display:flex;flex-direction:column;
  background:var(--input-shell);backdrop-filter:blur(14px);
  border-top:1px solid var(--hdr-border);
}
.chat-input.hidden-mode{display:none;}
.chat-input [hidden]{display:none!important;}
.ci-row{display:flex;align-items:flex-end;gap:8px;padding:8px 12px;}
/* 引用条 */
.quote-bar{display:flex;align-items:center;gap:9px;padding:9px 14px 0;}
.qb-mark{width:3px;align-self:stretch;border-radius:2px;background:var(--send-bg);flex:none;}
.qb-info{flex:1;min-width:0;background:var(--field-bg);border:1px solid var(--field-border);border-radius:11px;padding:6px 10px;}
.qb-name{font-size:11px;font-weight:700;color:var(--accent);}
.qb-text{font-size:12px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px;}
.qb-x{width:24px;height:24px;border-radius:50%;border:none;background:var(--field-bg);color:var(--field-text);display:flex;align-items:center;justify-content:center;flex:none;}
.qb-x .ico-svg{width:13px;height:13px;}
/* 多选底栏 */
.multi-bar{flex:none;display:flex;align-items:center;gap:10px;padding:11px 16px calc(11px + env(safe-area-inset-bottom));background:var(--input-shell);backdrop-filter:blur(14px);border-top:1px solid var(--hdr-border);}
.multi-bar[hidden]{display:none;}
.multi-bar button{border:none;border-radius:14px;padding:8px 16px;font-size:13px;font-weight:600;background:var(--field-bg);color:var(--field-text);}
.multi-bar .ms-count{flex:1;text-align:center;font-size:13px;color:var(--ink-2);font-weight:600;}
.multi-bar .ms-del{background:#F6E4E4;color:#C06262;}
.multi-bar .ms-del:disabled{opacity:.45;}
/* 气泡工具条 */
.bt-mask{position:absolute;inset:0;z-index:24;background:transparent;}
.bt-mask[hidden]{display:none;}
.bubble-tools{position:absolute;z-index:25;display:flex;background:rgba(34,38,46,.94);border-radius:13px;box-shadow:0 8px 26px rgba(20,26,36,.32);padding:3px;animation:msgIn .14s ease;}
.bubble-tools[hidden]{display:none;}
.bubble-tools button{display:flex;align-items:center;gap:5px;border:none;background:transparent;color:#EDF0F4;font-size:12.5px;padding:8px 13px;border-radius:10px;white-space:nowrap;}
.bubble-tools button:active{background:rgba(255,255,255,.14);}
.bubble-tools .bt-ico{display:inline-flex;}
.bubble-tools .bt-ico .ico-svg{width:15px;height:15px;}
.bubble-tools button+button{box-shadow:inset 1px 0 0 rgba(255,255,255,.1);}
/* 多选勾选圈 */
.m-check{width:21px;height:21px;border-radius:50%;border:1.8px solid #B9C0CB;background:rgba(255,255,255,.7);display:flex;align-items:center;justify-content:center;flex:none;align-self:center;color:transparent;transition:all .15s ease;}
.m-check .ico-svg{width:13px;height:13px;}
.m-check.on{background:var(--send-bg);border-color:transparent;color:var(--send-fg);}
.msg.in-select{max-width:86%;}
.msg.in-select .bubble{pointer-events:none;}
.ci-btn{width:36px;height:36px;border-radius:50%;background:var(--field-bg);border:1px solid var(--field-border);display:flex;align-items:center;justify-content:center;flex:none;color:var(--field-text);transition:background .18s ease,color .18s ease;}
.ci-btn .ico-svg{width:21px;height:21px;}
.ci-btn.on{background:var(--send-bg);border-color:transparent;color:var(--send-fg);box-shadow:0 3px 10px rgba(123,146,171,.35);}
.ci-input{flex:1;background:var(--field-bg);border:1px solid var(--field-border);border-radius:var(--field-radius);padding:8px 14px;font-size:14px;color:var(--field-text);min-height:36px;max-height:90px;overflow-y:auto;line-height:1.45;box-sizing:border-box;}
.ci-input:empty::before{content:attr(data-ph);color:var(--ink-3);}
.ci-send{
  width:36px!important;height:36px;min-width:36px;padding:0!important;border-radius:12px!important;
  background:var(--mist-soft)!important;border-color:transparent!important;color:var(--mist-deep)!important;
  font-size:0;box-shadow:none;align-self:flex-end;margin-bottom:0;
  transition:background .18s ease,color .18s ease,box-shadow .18s ease;
}
.ci-send.ready{
  background:var(--send-bg)!important;color:var(--send-fg)!important;
  border-radius:var(--send-radius)!important;
  box-shadow:0 3px 10px rgba(123,146,171,.45);
}
.ci-send .ico-svg{width:16px;height:16px;color:currentColor;}
/* 发送钮图标：默认主题纸飞机；微信/QQ/Kakao 用圆内上箭头（移动端真实样式） */
.send-ico{display:flex;align-items:center;justify-content:center;}
.send-ico .ico-svg{width:17px;height:17px;color:currentColor;}
.send-up,.send-txt{display:none;}
.theme-wechat .send-plane,.theme-qq .send-plane,.theme-kakao .send-plane{display:none;}
.theme-wechat .send-up,.theme-qq .send-up,.theme-kakao .send-up{display:flex;}
.send-up.ico-svg{width:18px;height:18px;}
/* ＋面板里的表情入口：与普通项一致，仅 Kakao（独立表情钮隐藏）时可见也无妨，三套主题统一保留 */
.plus-panel{flex:none;background:var(--panel-bg);border-top:1px solid var(--hdr-border);padding:14px 14px calc(14px + env(safe-area-inset-bottom));display:none;grid-template-columns:repeat(3,1fr);gap:14px 8px;}
.plus-panel.show{display:grid;}
.plus-item{display:flex;flex-direction:column;align-items:center;gap:7px;font-size:11px;color:var(--ink-2);-webkit-tap-highlight-color:transparent;}
.plus-item .pi-ico{width:50px;height:50px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-soft);display:flex;align-items:center;justify-content:center;color:var(--mist-deep);transition:transform .15s ease;}
.plus-item:active .pi-ico{transform:scale(.93);}
.plus-item .pi-ico .ico-svg{width:23px;height:23px;}
.emoji-panel{flex:none;background:var(--panel-bg);border-top:1px solid var(--hdr-border);padding:12px;display:none;grid-template-columns:repeat(7,1fr);gap:4px;max-height:210px;overflow-y:auto;}
.emoji-panel.show{display:grid;}
.emoji-panel span{font-size:22px;text-align:center;padding:6px 0;border-radius:10px;}
.emoji-panel span:active{background:var(--mist-soft);}

/* 视频通话覆盖层 */
.call-layer{position:absolute;inset:0;z-index:30;display:flex;flex-direction:column;
  background:linear-gradient(170deg,#43506A 0%,#2E3744 58%,#242B34 100%);color:#fff;animation:msgIn .22s ease;}
.call-layer[hidden],.call-ring[hidden],.call-main[hidden]{display:none;}
.call-ring{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;}
.cl-ava{width:92px;height:92px;border-radius:50%;background:linear-gradient(135deg,#AFC6DE,#7B92AB);border:3px solid rgba(255,255,255,.28);box-shadow:0 12px 34px rgba(20,28,40,.45);flex:none;}
.cl-name{font-size:19px;font-weight:700;letter-spacing:.5px;}
.cl-state{font-size:13px;color:rgba(255,255,255,.72);margin-bottom:30px;}
.cl-hangup{width:62px;height:62px;border-radius:50%;border:none;background:#D97070;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px rgba(217,112,112,.42);flex:none;}
.cl-hangup .ico-svg{width:27px;height:27px;}
.call-main{flex:1;display:flex;flex-direction:column;min-height:0;}
.cl-top{flex:none;display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.12);}
.cl-mini{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#AFC6DE,#7B92AB);flex:none;}
.cl-who{flex:1;min-width:0;}
.cl-who .n{font-size:14px;font-weight:700;}
.cl-who .s{font-size:11px;color:rgba(255,255,255,.66);margin-top:1px;}
.cl-timer{font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;color:rgba(255,255,255,.88);}
.cl-end{flex:none;border-radius:16px;padding:7px 14px;font-size:12.5px;font-weight:600;color:#F2A6A6;background:rgba(217,112,112,.16);border:1px solid rgba(217,112,112,.4);}
.call-msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px;}
.cm-b{max-width:76%;padding:8px 12px;font-size:13px;line-height:1.55;border-radius:16px;word-break:break-word;}
.cm-b.l{align-self:flex-start;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.1);border-top-left-radius:5px;}
.cm-b.r{align-self:flex-end;background:linear-gradient(135deg,#9FB4CC,#7B92AB);border-top-right-radius:5px;}
.cl-input{flex:none;display:flex;align-items:flex-end;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));border-top:1px solid rgba(255,255,255,.12);}
.cl-input .ci{flex:1;border-radius:18px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);padding:9px 14px;font-size:13.5px;min-height:38px;max-height:76px;overflow-y:auto;line-height:1.45;color:#fff;}
.cl-input .ci:empty::before{content:attr(data-ph);color:rgba(255,255,255,.5);}
.cl-send{width:38px;height:38px;border-radius:50%;border:none;background:linear-gradient(135deg,#AFC6DE,#7B92AB);color:#fff;display:flex;align-items:center;justify-content:center;flex:none;box-shadow:0 4px 12px rgba(123,146,171,.4);}
.cl-send .ico-svg{width:17px;height:17px;}

/* 聊天会话列表 */
.conv-item{display:flex;align-items:center;gap:13px;padding:13px 4px;border-bottom:1px solid var(--line);}
.conv-item:last-child{border-bottom:none;}
.conv-item .cv-ava{width:52px;height:52px;border-radius:50%;background-size:cover;background-position:center;background-color:var(--mist);flex:none;position:relative;overflow:hidden;box-shadow:var(--shadow-soft);}
.conv-item .cv-info{flex:1;min-width:0;}
.conv-item .cv-row1{display:flex;justify-content:space-between;align-items:baseline;}
.conv-item .cv-name{font-size:15px;font-weight:700;}
.conv-item .cv-time{font-size:11px;color:var(--muted);flex:none;margin-left:8px;}
.conv-item .cv-last{font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:2px;}
.conv-item .cv-badge{background:var(--mist-deep);color:#fff;font-size:10px;min-width:18px;height:18px;border-radius:9px;padding:0 5px;display:flex;align-items:center;justify-content:center;font-weight:700;}
.empty{padding:60px 30px;text-align:center;color:var(--ink-3);font-size:13px;line-height:1.8;}
.empty .e-ico{font-size:46px;margin-bottom:12px;color:var(--mist);}
.empty .e-ico .ico-svg{width:46px;height:46px;}

/* ==================================================================
 * 结构级聊天主题（4 套：简约/微信/QQ/KakaoTalk）
 * 每套变量覆盖聊天页各个位置：状态栏、顶栏、消息背景、气泡、时间条、
 * 引用条、输入栏、功能/表情面板、多选底栏、迷你播放器与所有强调色。
 * 气泡颜色默认跟随主题，也可由下方 bstyle-* 染成独立配色（形态仍由主题决定）。
 * ================================================================== */

/* 1. 简约（默认）：近白页面 · 毛玻璃顶栏 · 圆形幽灵按钮 · 大柔角渐变气泡 · 圆形头像 */
.theme-default{--accent:#7B92AB;
  --time-bg:rgba(255,255,255,.75);--time-fg:#8A93A0;--meta-fg:#7E8794;
  --ava-radius:50%;--hdr-btn-radius:50%;--field-radius:18px;--mock-r:5px;}

/* 2. 微信：灰底 · 扁平灰顶栏（无圆钮）· 方角头像 · 绿色小泡（上内尾角）· 灰底栏绿色圆上箭头发送 */
.theme-wechat{--chat-bg:#EDEDED;--l-bubble:#fff;--l-text:#1A1A1A;
  --r-bubble-bg:#95EC69;--r-text:#17201A;--r-trans-line:rgba(0,0,0,.14);
  --tail-l:4px;--tail-r:4px;--chat-radius:6px;
  --hdr-bg:#EDEDED;--hdr-border:#D6D6D6;--hdr-name:#111;--hdr-status:#737373;
  --hdr-btn-bg:transparent;--hdr-btn-color:#262626;--hdr-btn-border:transparent;
  --input-shell:#F7F7F7;--field-bg:#fff;--field-border:#E2E2E2;--field-text:#1A1A1A;
  --field-radius:6px;--panel-bg:#F7F7F7;
  --send-bg:#07C160;--send-fg:#fff;--send-radius:50%;
  --accent:#07C160;--time-bg:rgba(0,0,0,.18);--time-fg:#fff;--meta-fg:#8A8E91;
  --ava-radius:6px;--hdr-btn-radius:0;--mock-r:2px;}
.theme-wechat .chat-header{backdrop-filter:none;-webkit-backdrop-filter:none;}
.theme-wechat .chat-header .back,.theme-wechat .chat-header .ch-set,.theme-wechat .chat-header .ch-music{
  box-shadow:none;width:32px;height:32px;}
.theme-wechat .chat-header .ch-music.on{
  background:var(--send-bg);border-color:transparent;color:var(--send-fg);border-radius:7px;box-shadow:none;}
.theme-wechat .ch-ava,.theme-wechat .msg .m-ava{box-shadow:none;}
.theme-wechat .msg .bubble{padding:8px 11px;}
.theme-wechat .msg.left .bubble{border-color:transparent;box-shadow:none;}
.theme-wechat .msg.right .bubble{box-shadow:none;}
.theme-wechat .msg-time,.theme-wechat .sys-tip{border-color:transparent;border-radius:4px;}
.theme-wechat .chat-input{backdrop-filter:none;}
.theme-wechat #ci-plus,.theme-wechat #ci-emoji{
  background:transparent;border-color:transparent;color:#5A5A5A;box-shadow:none;}
.theme-wechat #ci-plus.on,.theme-wechat #ci-emoji.on{
  background:var(--send-bg);color:var(--send-fg);box-shadow:none;}
.theme-wechat .ci-send{background:#C9C9C9!important;color:#fff!important;border-radius:50%!important;}
.theme-wechat .ci-send.ready{background:var(--send-bg)!important;border-radius:50%!important;box-shadow:none;}
.theme-wechat .plus-item .pi-ico{border-radius:8px;border-color:#E4E4E4;color:#07C160;}
/* 微信聊天页没有未读角标（表情入口也在输入栏而非＋面板） */
.theme-wechat .mm-unread{display:none;}
.theme-wechat .pi-emoji{display:none;}
/* 三款真实 App 均无「已读」文字回执（微信无回执；QQ/Kakao 只在未读时显示标记），默认主题保留 */
.theme-wechat .mm-read,.theme-qq .mm-read,.theme-kakao .mm-read{display:none;}

/* 3. QQ：浅灰页 · 白顶栏蓝色调圆钮 · 圆形头像蓝圈 · 天蓝不对称泡深字 · 蓝色圆形上箭头发送钮 */
.theme-qq{--chat-bg:#F5F6F8;--l-bubble:#fff;--l-text:#1A1A1A;
  --r-bubble-bg:#A9CDFF;--r-text:#14283F;--r-trans-line:rgba(0,0,0,.12);
  --tail-l:6px;--tail-bl:18px;--tail-r:6px;--tail-br:18px;--chat-radius:18px;
  --hdr-bg:#FFFFFF;--hdr-border:#E8EBF0;--hdr-name:#141920;--hdr-status:#8A94A2;
  --hdr-btn-bg:#EAF4FF;--hdr-btn-color:#1A8FE3;--hdr-btn-border:transparent;
  --input-shell:#FFFFFF;--field-bg:#F2F3F5;--field-border:transparent;--field-text:#1A1A1A;
  --field-radius:18px;--panel-bg:#FFFFFF;
  --send-bg:linear-gradient(135deg,#4FA9FF 0%,#1A8FE3 100%);--send-fg:#fff;--send-radius:50%;
  --accent:#1A8FE3;--time-bg:rgba(255,255,255,.92);--time-fg:#98A2B0;--meta-fg:#8A95A5;
  --ava-radius:50%;--hdr-btn-radius:50%;--mock-r:5px;}
.theme-qq .chat-header{backdrop-filter:none;-webkit-backdrop-filter:none;}
.theme-qq .ch-ava{box-shadow:0 0 0 2px #DCEBFF;}
.theme-qq .msg.right .m-ava{box-shadow:0 0 0 2px rgba(26,143,227,.28);}
.theme-qq .msg .bubble{padding:9px 13px;}
.theme-qq .msg.left .bubble{border-color:#E6EAF0;}
.theme-qq .msg.right .bubble{box-shadow:0 3px 10px rgba(26,143,227,.20);}
.theme-qq .ci-send{border-radius:50%!important;}
.theme-qq .ci-send.ready{border-radius:50%!important;box-shadow:0 4px 12px rgba(26,143,227,.45);}
.theme-qq .plus-item .pi-ico{border-color:#E4EFFB;color:#1A8FE3;}
/* QQ 未读：气泡旁红色「未读」小字（QQ 真实形态），不用圆数字标 */
.theme-qq .mm-unread{min-width:0;height:auto;padding:0;background:transparent;box-shadow:none;
  color:#FA3D3D;font-size:0;font-weight:400;}
.theme-qq .mm-unread::before{content:attr(data-qq);font-size:10px;}

/* 4. KakaoTalk：标志性黄导航栏（贯通状态栏）· 蓝灰 #BACEE0 背景 · 圆角方头像 ·
   黄/白不对称「三角」泡（16/16/4/16）· 圆形＋钮＋白胶囊输入框＋黄色圆上箭头发送 · 表情收入＋面板 */
.theme-kakao{--chat-bg:linear-gradient(180deg,#C7D8E8 0%,#BACEE0 130px,#BACEE0 100%);
  --l-bubble:#fff;--l-text:#1E1E1E;
  --r-bubble-bg:#FEE500;--r-text:#202020;--r-trans-line:rgba(0,0,0,.12);
  --tail-l:16px;--tail-bl:4px;--tail-r:16px;--tail-br:4px;--chat-radius:16px;
  --hdr-bg:#FFE812;--hdr-border:transparent;--hdr-name:#202020;--hdr-status:#5A5100;
  --hdr-btn-bg:transparent;--hdr-btn-color:#22210D;--hdr-btn-border:transparent;
  --input-shell:#BACEE0;--field-bg:#fff;--field-border:transparent;--field-text:#1E1E1E;
  --field-radius:20px;--panel-bg:#BACEE0;
  --send-bg:#FEE500;--send-fg:#202020;--send-radius:50%;
  --accent:#3C5879;--time-bg:rgba(255,255,255,.55);--time-fg:#48566A;--meta-fg:rgba(30,40,52,.66);
  --ava-radius:8px;--hdr-btn-radius:0;--mock-r:4px;}
.theme-kakao .chat-header{position:relative;backdrop-filter:none;-webkit-backdrop-filter:none;
  border-bottom-color:transparent;padding-top:4px;}
/* fade-top：黄色渐变光罩，消息向上滚动时自然融入黄色导航栏 */
.theme-kakao .chat-header::after{content:'';position:absolute;left:0;right:0;top:100%;height:22px;
  background:linear-gradient(180deg,rgba(255,232,18,.55) 0%,rgba(255,232,18,.18) 45%,rgba(255,232,18,0) 100%);
  pointer-events:none;z-index:6;}
.theme-kakao .chat-header .back,.theme-kakao .chat-header .ch-set,.theme-kakao .chat-header .ch-music{
  background:transparent;box-shadow:none;border-color:transparent;width:32px;height:32px;color:#22210D;}
.theme-kakao .chat-header .ch-music.on{
  background:rgba(0,0,0,.08);border-color:transparent;color:#202020;border-radius:50%;box-shadow:none;}
.theme-kakao .ch-ava,.theme-kakao .msg .m-ava{box-shadow:none;}
.theme-kakao .msg .bubble{padding:9px 13px;}
.theme-kakao .msg.left .bubble{border-color:rgba(0,0,0,.06);box-shadow:0 1px 3px rgba(52,72,96,.16);}
.theme-kakao .msg.right .bubble{box-shadow:0 1px 3px rgba(52,72,96,.22);}
.theme-kakao .msg-time,.theme-kakao .sys-tip{border-color:transparent;}
.theme-kakao .chat-input{backdrop-filter:none;border-top-color:transparent;}
/* 圆形＋钮（白色）；独立表情钮隐藏，表情入口收进＋面板 */
.theme-kakao #ci-plus{
  background:#fff;border-color:transparent;color:#3B495C;box-shadow:0 1px 3px rgba(52,72,96,.2);border-radius:50%;}
.theme-kakao #ci-plus.on{background:#3B495C;color:#fff;box-shadow:none;}
.theme-kakao #ci-emoji{display:none;}
/* 发送：未输入白底灰箭头；输入后黄色圆钮黑色上箭头 */
.theme-kakao .ci-send{background:#fff!important;color:#9AAABD!important;border-radius:50%!important;box-shadow:0 1px 3px rgba(52,72,96,.2);}
.theme-kakao .ci-send.ready{background:var(--send-bg)!important;color:var(--send-fg)!important;
  border-radius:50%!important;box-shadow:0 2px 7px rgba(120,100,0,.4);}
.theme-kakao .plus-item .pi-ico{border-radius:50%;border-color:transparent;color:#3B495C;
  box-shadow:0 1px 3px rgba(52,72,96,.2);}
.theme-kakao .pi-emoji{display:flex;}
.theme-kakao .mm-time{font-size:10px;}
/* Kakao：自己消息旁「未读数 / 时间」纵向堆叠，右对齐贴气泡 */
.theme-kakao .msg.right .m-meta{flex-direction:column;gap:3px;align-items:flex-end;margin-bottom:7px;}
.theme-kakao .mm-dot-left{align-self:flex-start;margin:8px 6px 0 0;}
.theme-kakao .mb-title,.theme-kakao .mb-btn{color:#26303C;}
.theme-kakao .mb-sub,.theme-kakao .mb-close{color:#44536799;}
.theme-kakao .emoji-panel span:active,.theme-kakao .stk-op:active{background:rgba(255,255,255,.35);}

/* ＋面板表情入口：默认/微信/QQ 主题下隐藏（它们的输入栏有独立表情钮），仅 Kakao 显示 */
.pi-emoji{display:none;}

/* 状态栏随主题染色（chat-wrap 位于 #layer-app 内） */
#layer-app:has(.chat-theme.theme-default) .statusbar-app{background:#FBFCFD;color:#3A465C;}
#layer-app:has(.chat-theme.theme-wechat) .statusbar-app{background:#EDEDED;color:#111;}
#layer-app:has(.chat-theme.theme-qq) .statusbar-app{background:#fff;color:#111;}
#layer-app:has(.chat-theme.theme-kakao) .statusbar-app{background:#FFE812;color:#202020;}

/* ==================================================================
 * 气泡颜色方案（独立于主题，只换颜色、不改形态；气泡形状/发送钮形状
 * 仍由各主题决定。"默认"完全跟随主题（微信绿/QQ蓝/Kakao黄/简约渐变）。
 * 规则在主题块之后，同特异性下覆盖各主题的气泡/发送色。
 * ================================================================== */
.chat-theme.bstyle-pink{--r-bubble-bg:linear-gradient(135deg,#F8C3D0 0%,#E793AA 100%);--r-text:#fff;
  --r-trans-line:rgba(255,255,255,.5);
  --send-bg:linear-gradient(135deg,#F8C3D0,#E793AA);--send-fg:#fff;}
.chat-theme.bstyle-mint{--r-bubble-bg:linear-gradient(135deg,#A7DDC5 0%,#67BE9A 100%);--r-text:#fff;
  --r-trans-line:rgba(255,255,255,.5);
  --send-bg:linear-gradient(135deg,#A7DDC5,#67BE9A);--send-fg:#fff;}
.chat-theme.bstyle-lavender{--r-bubble-bg:linear-gradient(135deg,#C7B7E8 0%,#9E87D6 100%);--r-text:#fff;
  --r-trans-line:rgba(255,255,255,.5);
  --send-bg:linear-gradient(135deg,#C7B7E8,#9E87D6);--send-fg:#fff;}

/* ==================================================================
 * 进阶气泡样式（12 款）：形状＋配色整体覆盖主题气泡（含异形/动画）。
 * 仅作用于文字/语音气泡；红包/转账/外卖/位置/名片/听歌/图片/贴纸
 * 通过 :not 守卫排除，继续走中性卡兜底。
 * ================================================================== */

/* A. 流光炫彩：彩虹渐变缓慢流动 */
.bstyle-flow .msg.left .bubble{
  background:linear-gradient(115deg,#FFD1E0 0%,#D6C8FF 35%,#C8E8FF 70%,#D4FFE8 100%);
  color:#3A2A5A;border:1px solid rgba(255,255,255,.6);border-radius:18px 18px 18px 6px;
  box-shadow:0 4px 14px rgba(180,140,240,.3);background-size:200% 200%;animation:bsShimmer 4s ease infinite;}
.bstyle-flow .msg.right .bubble{
  background:linear-gradient(115deg,#FFA8C8 0%,#C08AFF 35%,#7AB8FF 70%,#8AE8C8 100%);
  color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:18px 18px 6px 18px;
  box-shadow:0 4px 14px rgba(160,120,240,.45);background-size:200% 200%;animation:bsShimmer 4s ease infinite;}
@keyframes bsShimmer{0%{background-position:0% 50%;}50%{background-position:100% 50%;}100%{background-position:0% 50%;}}
@media (prefers-reduced-motion:reduce){.bstyle-flow .msg .bubble{animation:none;}}

/* B. 渐变紫罗兰 */
.bstyle-violet .msg.left .bubble{
  background:linear-gradient(135deg,#F0E8FF,#E0D0FF);color:#4A3A6A;
  border:1px solid #D9CCFF;border-radius:18px 18px 18px 6px;box-shadow:0 2px 10px rgba(160,120,220,.2);}
.bstyle-violet .msg.right .bubble{
  background:linear-gradient(135deg,#B88AFF,#9A6AEF);color:#fff;
  border:1px solid rgba(255,255,255,.3);border-radius:18px 18px 6px 18px;box-shadow:0 3px 12px rgba(140,100,220,.4);}

/* C. 手绘墨迹：粗描边 + 硬阴影漫画风 */
.bstyle-ink .msg.left .bubble{
  background:#fff;color:#1A1A1A;border:2.5px solid #1A1A1A;border-radius:6px 20px 20px 20px;
  box-shadow:3px 3px 0 #1A1A1A;}
.bstyle-ink .msg.right .bubble{
  background:#FFE812;color:#1A1A1A;border:2.5px solid #1A1A1A;border-radius:20px 6px 20px 20px;
  box-shadow:3px 3px 0 #1A1A1A;}

/* D. 奶油布丁：暖黄奶油渐变 */
.bstyle-pudding .msg.left .bubble{
  background:linear-gradient(135deg,#FFF9EC,#FFEFD0);color:#6B5024;
  border:1px solid #F2DCAE;border-radius:20px 20px 20px 6px;box-shadow:0 2px 8px rgba(230,180,100,.2);}
.bstyle-pudding .msg.right .bubble{
  background:linear-gradient(135deg,#FFD98A,#FFB84D);color:#5A3A00;
  border:1px solid rgba(255,255,255,.4);border-radius:20px 20px 6px 20px;box-shadow:0 2px 10px rgba(255,180,70,.35);}

/* E. 云朵异形：顶部小云朵凸起（给伪元素预留空间） */
.bstyle-cloud .msg .bubble{margin-top:9px;}
.bstyle-cloud .msg.left .bubble{
  background:#fff;color:#3A4A6A;border:1px solid #D2E0F2;border-radius:24px 24px 24px 8px;
  box-shadow:0 4px 14px rgba(140,170,220,.22);}
.bstyle-cloud .msg.right .bubble{
  background:linear-gradient(135deg,#A8C8FF,#7FA8F0);color:#fff;border:1px solid rgba(255,255,255,.3);
  border-radius:24px 24px 8px 24px;box-shadow:0 4px 14px rgba(120,160,240,.35);}
.bstyle-cloud .msg.left .bubble:not(.money):not(.takeaway):not(.loc-card):not(.mcard):not(.namecard):not(.photo):not(.stk-bubble)::before{
  content:'';position:absolute;top:-8px;left:22px;width:20px;height:20px;background:#fff;border-radius:50%;
  box-shadow:12px -3px 0 -2px #fff,21px 2px 0 -5px #fff;z-index:-1;}
.bstyle-cloud .msg.right .bubble:not(.money):not(.takeaway):not(.loc-card):not(.mcard):not(.namecard):not(.photo):not(.stk-bubble)::before{
  content:'';position:absolute;top:-8px;right:22px;width:20px;height:20px;background:#8FB4F8;border-radius:50%;
  box-shadow:-12px -3px 0 -2px #8FB4F8,-21px 2px 0 -5px #8FB4F8;z-index:-1;}

/* F. 星星异形：底部小星星角（给伪元素预留空间） */
.bstyle-star .msg .bubble{margin-bottom:9px;}
.bstyle-star .msg.left .bubble{
  background:linear-gradient(135deg,#FFF0F6,#FFE0EC);color:#7A3A5A;
  border:1px solid #F6D0E0;border-radius:20px;box-shadow:0 4px 14px rgba(240,150,190,.25);}
.bstyle-star .msg.right .bubble{
  background:linear-gradient(135deg,#FFB8D8,#FF8AB8);color:#fff;
  border:1px solid rgba(255,255,255,.3);border-radius:20px;box-shadow:0 4px 14px rgba(255,130,180,.4);}
.bstyle-star .msg.left .bubble:not(.money):not(.takeaway):not(.loc-card):not(.mcard):not(.namecard):not(.photo):not(.stk-bubble)::after{
  content:'';position:absolute;bottom:-7px;left:16px;width:14px;height:14px;background:#FFE0EC;z-index:-1;
  clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);}
.bstyle-star .msg.right .bubble:not(.money):not(.takeaway):not(.loc-card):not(.mcard):not(.namecard):not(.photo):not(.stk-bubble)::after{
  content:'';position:absolute;bottom:-7px;right:16px;width:14px;height:14px;background:#FF8AB8;z-index:-1;
  clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);}

/* G. 对话尾巴：漫画双圆点尾巴 */
.bstyle-tail .msg.left .bubble{
  background:#fff;color:#1A1A1A;border:1px solid transparent;border-radius:20px 20px 20px 4px;
  box-shadow:0 3px 10px rgba(60,90,140,.1);}
.bstyle-tail .msg.right .bubble{
  background:linear-gradient(135deg,#5AB4FF,#3A8CF7);color:#fff;border:1px solid rgba(255,255,255,.25);
  border-radius:20px 20px 4px 20px;box-shadow:0 3px 10px rgba(58,140,247,.3);}
.bstyle-tail .msg.left .bubble:not(.money):not(.takeaway):not(.loc-card):not(.mcard):not(.namecard):not(.photo):not(.stk-bubble)::before{
  content:'';position:absolute;bottom:0;left:-8px;width:16px;height:16px;background:#fff;border-radius:50%;
  box-shadow:-6px 8px 0 -4px #fff;z-index:-1;}
.bstyle-tail .msg.right .bubble:not(.money):not(.takeaway):not(.loc-card):not(.mcard):not(.namecard):not(.photo):not(.stk-bubble)::before{
  content:'';position:absolute;bottom:0;right:-8px;width:16px;height:16px;background:#4AA0FA;border-radius:50%;
  box-shadow:6px 8px 0 -4px #4AA0FA;z-index:-1;}

/* H. 糖果条纹：斜向糖果纸条纹 */
.bstyle-candy .msg.left .bubble{
  background:repeating-linear-gradient(45deg,#FFF0F5 0,#FFF0F5 12px,#FFE0EC 12px,#FFE0EC 24px);
  color:#7A3A5A;border:1px solid transparent;border-radius:24px;
  box-shadow:0 4px 12px rgba(240,150,190,.25),inset 0 0 0 1.5px #FFD0E0;}
.bstyle-candy .msg.right .bubble{
  background:repeating-linear-gradient(45deg,#FFB8D8 0,#FFB8D8 12px,#FFA0C8 12px,#FFA0C8 24px);
  color:#fff;border:1px solid transparent;border-radius:24px;
  box-shadow:0 4px 12px rgba(255,130,180,.4),inset 0 0 0 1.5px rgba(255,255,255,.4);}

/* I. 极简线框：左透明描边，右深色填充 */
.bstyle-minimal .msg.left .bubble{
  background:transparent;color:#3A4A6A;border:1.5px solid #B8C8E0;border-radius:20px;
  box-shadow:none;font-weight:500;}
.bstyle-minimal .msg.right .bubble{
  background:#3A4A6A;color:#fff;border:1.5px solid #3A4A6A;border-radius:20px;
  box-shadow:0 2px 8px rgba(58,74,106,.2);font-weight:500;}

/* J. 极简底纹线：小圆角 + 底部粗线 */
.bstyle-dotline .msg.left .bubble{
  background:#fff;color:#1A1A1A;border:1px solid transparent;border-bottom:3px solid #D8E0EC;
  border-radius:8px;box-shadow:0 1px 3px rgba(60,90,140,.08);}
.bstyle-dotline .msg.right .bubble{
  background:#3A8CF7;color:#fff;border:1px solid transparent;border-bottom:3px solid #2A6FD0;
  border-radius:8px;box-shadow:0 1px 4px rgba(58,140,247,.25);}

/* K. 极简单色：纯色无阴影 */
.bstyle-flat .msg.left .bubble{
  background:#F0F2F6;color:#4A5468;border:1px solid transparent;border-radius:16px;box-shadow:none;}
.bstyle-flat .msg.right .bubble{
  background:#3A8CF7;color:#fff;border:1px solid transparent;border-radius:16px;box-shadow:none;}

/* L. 极简侧边线：便签条式单侧粗线 */
.bstyle-sideline .msg.left .bubble{
  background:#fff;color:#1A1A1A;border:1px solid transparent;border-left:3px solid #3A8CF7;
  border-radius:6px 16px 16px 6px;box-shadow:0 1px 4px rgba(60,90,140,.08);}
.bstyle-sideline .msg.right .bubble{
  background:#fff;color:#1A1A1A;border:1px solid transparent;border-right:3px solid #FFB300;
  border-radius:16px 6px 6px 16px;box-shadow:0 1px 4px rgba(60,90,140,.08);}

/* 功能卡中性兜底：任何主题 / 任何气泡颜色下，红包/转账/外卖/位置/名片/听歌邀请卡都保持
   中性白卡，不被微信绿泡、QQ蓝泡、Kakao黄泡或粉色/薄荷/香芋气泡染成彩色外框 */
.chat-theme .msg .bubble.money,
.chat-theme .msg .bubble.takeaway,
.chat-theme .msg .bubble.loc-card,
.chat-theme .msg .bubble.mcard{
  padding:0;background:#fff;border:1px solid #EDF0F3;color:var(--ink);
  box-shadow:0 6px 18px rgba(74,96,128,.08);}
.chat-theme .msg .bubble.namecard{
  padding:13px 16px;background:#fff;border:1px solid #EDF0F3;color:var(--ink);
  box-shadow:0 6px 18px rgba(74,96,128,.08);}

/* 预览示例气泡 */
.preview-chat{border-radius:var(--r-md);padding:14px;display:flex;flex-direction:column;gap:8px;background:var(--bg);min-height:150px;}
.preview-chat .pv-b{max-width:75%;padding:8px 12px;font-size:12.5px;border-radius:14px;line-height:1.5;}
.preview-chat .pv-l{align-self:flex-start;background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow-soft);}
.preview-chat .pv-r{align-self:flex-end;background:linear-gradient(135deg,#AFC6DE,#7B92AB);color:#fff;}

/* ================= 装修面板 Tab（极简下划线） ================= */
.deco-pane{display:none;}
.deco-pane.on{display:block;}

/* ============================================================
   桌面装修 · ins 极简玻璃风（仅 .deco-page 作用域，不影响全局）
   冷白底 · 半透明白卡 · 毛玻璃 · 淡粉灰点缀
   ============================================================ */
.deco-page{background:var(--bg);}
.deco-page .app-nav{padding-bottom:4px;}
.deco-page .app-nav .nav-title{color:var(--ink);font-weight:600;font-size:16px;letter-spacing:.3px;}
.deco-page .app-nav .back{
  background:rgba(255,255,255,.7);border:1px solid var(--line);
  box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  color:var(--ink-2);font-size:18px;
}
.deco-page .app-body{padding:0 16px 30px;}

/* 下划线 Tab（极简：灰字 / 选中深字+细线，无胶囊底） */
.deco-page .deco-tabs{
  display:flex;gap:30px;padding:6px 18px 0;overflow-x:auto;flex:none;
  border-bottom:1px solid var(--line);background:transparent;
}
.deco-page .deco-tabs::-webkit-scrollbar{display:none;}
.deco-page .deco-tab{
  position:relative;flex:none;padding:10px 2px 11px;background:none;box-shadow:none;border-radius:0;
  font-size:13.5px;font-weight:400;color:var(--ink-3);letter-spacing:1px;white-space:nowrap;
  transition:color .2s ease;
}
.deco-page .deco-tab.on{color:var(--ink);font-weight:500;}
.deco-page .deco-tab.on::after{
  content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:18px;height:1.5px;border-radius:2px;background:var(--ink);
}

/* 分组 + 玻璃卡片 */
.deco-page .group{margin:22px 0 0;}
.deco-page .group-title{
  font-size:11px;font-weight:500;color:var(--ink-3);letter-spacing:1.4px;
  padding:0 6px;margin-bottom:9px;
}
.deco-page .card{
  background:rgba(255,255,255,.8);
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  border:1px solid var(--line);
  box-shadow:var(--shadow-soft);
  border-radius:20px;
}
.deco-page .card .muted{color:var(--ink-3);}

/* 行 */
.deco-page .row{padding:15px 16px;min-height:56px;gap:14px;border-bottom:1px solid var(--line);}
.deco-page .row:last-child{border-bottom:none;}
.deco-page .row .r-ico{
  width:24px;height:24px;border-radius:0;background:none;
  color:var(--mist-deep);display:flex;align-items:center;justify-content:center;
}
.deco-page .row .r-ico svg.li,.deco-page .row .r-ico .ico-svg{width:21px;height:21px;display:block;}
.deco-page .row .r-label{font-size:14px;font-weight:400;color:var(--ink);letter-spacing:.2px;}
.deco-page .row .r-sub{font-size:12px;font-weight:400;color:var(--ink-3);margin-top:2px;}
.deco-page .row .chev{color:var(--ink-3);font-size:17px;}

/* 图标列表（行内展开编辑器） */
.deco-page .char-item{display:flex;flex-wrap:wrap;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line);}
.deco-page .char-item:last-child{border-bottom:none;}
.deco-page .char-item .ie-panel{display:none;width:100%;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);}
.deco-page .char-item .ie-panel.on{display:block;}

/* 页内编辑器（玻璃风适配） */
.deco-page .bg-editor{padding:13px 16px 15px;}
.deco-page .bg-hint{font-size:12px;color:var(--ink-3);line-height:1.7;margin-bottom:11px;}
.deco-page .bg-input{
  background:rgba(255,255,255,.9);border:1px solid var(--line);
  box-shadow:inset 0 1px 2px rgba(22,25,30,.03);
}
.deco-page .bg-input::placeholder{color:var(--ink-3);}
.deco-page .bg-input:focus{background:#fff;border-color:var(--mist);}
.deco-page .bg-apply{background:var(--mist-deep);}
.deco-page .bg-actions button{color:var(--mist-deep);}
.deco-page .bg-status{font-size:11.5px;color:var(--ink-3);margin-top:10px;}
.deco-page .stk-add{padding:14px 16px;border-bottom:1px solid var(--line);}
.deco-page .stk-add .r-label{font-size:14px;color:var(--ink);}
.deco-page .stk-add .r-sub{font-size:12px;color:var(--ink-3);}
.deco-page .char-item .avatar{box-shadow:var(--shadow-soft);}
.deco-page .ci-name{font-size:14.5px;font-weight:500;color:var(--ink);}
.deco-page .ci-note{font-size:12px;color:var(--ink-3);}
.deco-page .char-item .chev{
  font-size:12px;color:var(--mist-deep);background:var(--mist-soft);
  padding:5px 13px;border-radius:20px;
}

/* 开关 */
.deco-page .switch{background:#DDE2E8;}
.deco-page .switch.on{background:var(--mist-deep);}
.deco-page .switch::after{box-shadow:0 2px 6px rgba(22,25,30,.15);}

/* 创作者锁定区 / 按钮 */
.deco-page .creator-lock{color:var(--ink-3);font-size:13px;line-height:1.8;}
.deco-page .creator-lock .cl-ico{font-size:30px;margin-bottom:6px;opacity:.85;}
.deco-page .btn.ghost{
  background:rgba(255,255,255,.8);color:var(--mist-deep);
  border:1px solid var(--line-2);
  box-shadow:var(--shadow-soft);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  font-weight:500;
}
.deco-page .tc.muted{color:var(--ink-3);letter-spacing:.5px;}

/* 图标分页条 */
.deco-page .ip-pages{display:flex;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line);}
.deco-page .ip-page{
  flex:1;padding:7px 0;border-radius:14px;background:var(--card-soft);
  font-size:12px;color:var(--ink-2);box-shadow:none;white-space:nowrap;overflow:hidden;
}
.deco-page .ip-page.on{background:var(--mist-deep);color:#fff;font-weight:500;}

/* 字体手风琴 */
.deco-page .deco-acc{
  margin-top:10px;border-radius:20px;overflow:hidden;
  border:1px solid var(--line);background:rgba(255,255,255,.82);
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  box-shadow:var(--shadow-soft);
}
.deco-page .acc-head{display:flex;align-items:center;gap:10px;padding:15px 16px;cursor:pointer;}
.deco-page .acc-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.deco-page .acc-t b{font-size:14px;font-weight:500;color:var(--ink);letter-spacing:.3px;}
.deco-page .acc-t small{font-size:11.5px;color:var(--ink-3);}
.deco-page .acc-arrow{
  flex:none;width:8px;height:8px;border-right:1.5px solid var(--ink-3);border-bottom:1.5px solid var(--ink-3);
  transform:rotate(45deg);transition:transform .25s;margin:4px 4px 0 0;
}
.deco-page .deco-acc.open .acc-arrow{transform:rotate(-135deg);margin-top:0;}
.deco-page .acc-body{display:none;padding:0 16px 16px;}
.deco-page .deco-acc.open .acc-body{display:block;}
.deco-page .acc-body .f-line{display:flex;align-items:center;gap:12px;margin-top:13px;}
.deco-page .f-label{font-size:12px;font-weight:600;color:var(--ink-3);letter-spacing:.6px;}
.deco-page .f-line .f-label{flex:none;margin:0;}
.deco-page .fchips{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
.deco-page .fchip{
  position:relative;padding:7px 13px;border-radius:14px;border:1px solid var(--line-2);
  background:rgba(255,255,255,.92);font-size:13px;color:var(--ink-2);box-shadow:none;
}
.deco-page .fchip.on{border-color:var(--mist-deep);color:var(--ink);background:var(--mist-soft);font-weight:500;}
.deco-page .fchip-x{
  position:absolute;top:-7px;right:-7px;width:16px;height:16px;border-radius:50%;
  background:#D49494;color:#fff;font-size:10px;font-style:normal;line-height:1;
  display:flex;align-items:center;justify-content:center;
}
.deco-page .fcolors{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;}
.deco-page .fcol{
  width:27px;height:27px;border-radius:50%;border:1px solid var(--line-2);
  background:#fff;display:flex;align-items:center;justify-content:center;
  font-size:10px;color:var(--ink-3);box-shadow:none;padding:0;
}
.deco-page .fcol.on{outline:2px solid var(--mist-deep);outline-offset:2px;}
.deco-page .f-row-btn{margin-top:13px;}

/* 统一字体库 chip：字体名 + 应用范围小标（聊/界）+ 删除 */
.deco-page .fchip-lib{display:inline-flex;align-items:center;gap:6px;}
.deco-page .fchip-name{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.deco-page .ftags{display:inline-flex;gap:3px;flex:none;}
.deco-page .ftag{
  width:15px;height:15px;border-radius:5px;background:#fff;border:1px solid var(--line-2);
  color:var(--ink-3);font-size:9.5px;font-weight:600;font-style:normal;
  display:inline-flex;align-items:center;justify-content:center;
}
.deco-page .fchip.on .ftag{border-color:var(--mist-deep);color:var(--mist-deep);}
.deco-page .fchip-lib .fchip-x{position:static;flex:none;margin-left:1px;}

/* 作用域小节：当前字体行（点击回字体库） */
.deco-page .f-currow{display:flex;align-items:center;gap:10px;margin-top:12px;padding:10px 12px;border-radius:13px;background:var(--mist-soft);cursor:pointer;}
.deco-page .f-curname{flex:1;min-width:0;text-align:right;font-size:13px;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.deco-page .f-currow .chev{flex:none;}

/* 添加字体：方式分段切换 */
.deco-page .fseg{display:flex;gap:4px;background:var(--field);border-radius:13px;padding:3px;}
.deco-page .fseg-i{flex:1;min-width:0;height:31px;border-radius:10px;font-size:12.5px;color:var(--ink-2);background:transparent;font-weight:500;}
.deco-page .fseg-i.on{background:#fff;color:var(--ink);box-shadow:var(--shadow-soft);font-weight:600;}
.deco-page .fmode[hidden]{display:none;}
.deco-page .f-filebtn{width:100%;height:42px;border-radius:13px;border:1px dashed var(--mist-deep);background:var(--mist-soft);color:var(--mist-deep);font-size:13px;font-weight:600;}
.deco-page .f-filename{margin-top:8px;font-size:11.5px;color:var(--ink-3);line-height:1.4;word-break:break-all;}

/* ================= 装修面板 ================= */
.deco-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px 6px;}
.deco-item{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-2);font-weight:500;}
.deco-item .di-ico{width:52px;height:52px;border-radius:17px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-soft);display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--mist-deep);}
.deco-item .di-ico .ico-svg{width:24px;height:24px;}
.widget-tile{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-2);}
.widget-tile .wt-ico{width:52px;height:52px;border-radius:17px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-soft);display:flex;align-items:center;font-size:23px;justify-content:center;color:var(--mist-deep);}
.widget-tile .wt-ico .ico-svg{width:23px;height:23px;}

/* 组件仪表盘页 */
.widget-dashboard{padding:8px 16px 20px;overflow-y:auto;height:100%;}
.wcard{background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-soft);padding:15px 16px;margin-bottom:13px;position:relative;}
.wcard .wc-title{font-size:11px;color:var(--ink-3);font-weight:700;margin-bottom:8px;display:flex;align-items:center;gap:6px;}
.wcard .wc-title .ico-svg{width:14px;height:14px;}
.wcard .wc-remove{position:absolute;top:10px;right:12px;color:#D09494;font-size:11px;display:none;}
.editing .wcard .wc-remove{display:block;}
.w-together .w-big{font-size:30px;font-weight:800;color:var(--pink-deep);line-height:1.2;}
.w-together .w-sub{font-size:12px;color:var(--muted);}
.w-calendar .cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;text-align:center;font-size:11px;}
.w-calendar .cal-grid b{color:var(--muted);font-weight:600;font-size:10px;padding:3px 0;}
.w-calendar .cal-grid span{padding:4px 0;border-radius:8px;}

/* ==================================================================
 * 聊天设置页（双 Tab / 主题卡 / 气泡卡 / chips / 手风琴）
 * ================================================================== */
.set-tabs{position:sticky;top:0;z-index:6;display:flex;gap:8px;padding:10px 16px;
  background:var(--bg);}
.st-tab{flex:1;text-align:center;padding:9px 4px;border-radius:14px;font-size:13px;
  font-weight:600;color:var(--ink-3);background:var(--card-soft);
  border:1px solid transparent;transition:all .18s ease;}
.st-tab.on{background:linear-gradient(135deg,#AFC6DE,#7B92AB);color:#fff;
  box-shadow:0 4px 12px rgba(123,146,171,.35);}
/* URL 行 */
.url-row{display:flex;align-items:center;gap:8px;}
.url-row input{flex:1;min-width:0;}
.url-row .btn{flex:none;}
/* 通用 chips */
.chip-row{display:flex;flex-wrap:wrap;gap:8px;padding:13px 16px;}
.chip{padding:7px 14px;border-radius:15px;background:var(--card-soft);border:1px solid var(--line);
  font-size:12.5px;color:var(--ink-2);font-weight:500;transition:all .15s ease;}
.chip.on{background:linear-gradient(135deg,#AFC6DE,#7B92AB);color:#fff;border-color:transparent;
  box-shadow:0 3px 9px rgba(123,146,171,.3);}
.hint{font-size:11.5px;color:var(--ink-3);padding:0 16px 13px;line-height:1.6;}
.city-hint{font-size:11.5px;color:var(--mist-deep);margin-top:6px;line-height:1.5;}
.url-row .city-hint{margin-top:0;white-space:nowrap;}
/* 世界书列表页条目 */
.wb-item{display:flex;align-items:center;gap:11px;padding:13px 16px;border-bottom:1px solid var(--line);}
.wb-item:last-child{border-bottom:none;}
.wb-check{width:22px;height:22px;border-radius:50%;border:1.8px solid #C3CBD4;flex:none;
  display:flex;align-items:center;justify-content:center;color:transparent;transition:all .15s ease;}
.wb-check .ico-svg{width:13px;height:13px;}
.wb-item.on .wb-check{background:linear-gradient(135deg,#AFC6DE,#7B92AB);border-color:transparent;color:#fff;}
.wb-main{flex:1;min-width:0;}
.wb-title{font-size:14.5px;font-weight:600;color:var(--ink);}
.wb-text{font-size:12.5px;color:var(--ink-3);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.wb-item .chev{flex:none;color:var(--mist);}
.wb-item .chev .ico-svg{width:16px;height:16px;}
/* 世界书选择（设置页内） */
.wb-pick .chip-row{padding:0 16px 6px;}
#wb-manage{margin:6px 0 14px 16px;}
#wb-manage .ico-svg{width:14px;height:14px;margin-right:4px;vertical-align:-2px;}
/* —— 世界书 v2.1.4：提示/徽标/开关行 —— */
.wbo-hint{padding:10px 18px 2px;font-size:12px;line-height:1.7;color:var(--ink-3);letter-spacing:.3px;}
.wbo-list{margin-top:8px;}
.wbo-item{flex-wrap:wrap;}
.wbo-item.off{opacity:.48;}
.wbo-item .switch{width:40px;height:24px;flex:none;}
.wbo-item .switch::after{width:19px;height:19px;}
.wbo-item .switch.on::after{transform:translateX(15px);}
.wbo-badges{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px;}
.wbo-badge{font-size:10px;font-weight:600;letter-spacing:.5px;line-height:1;
  padding:4px 7px;border-radius:8px;color:#5B6675;
  background:rgba(123,146,171,.13);border:1px solid rgba(123,146,171,.22);}
.wbo-badge.bg{color:#fff;background:linear-gradient(135deg,#AFC6DE,#7B92AB);border-color:transparent;}
.wbo-badge.kw{background:rgba(176,128,137,.14);border-color:rgba(176,128,137,.30);color:#936871;}
.wbo-badge.warn{background:rgba(192,133,133,.12);border-color:rgba(192,133,133,.35);color:#B06A6A;}
.wbo-badge.wt{background:transparent;color:#8A94A1;border-color:rgba(138,148,161,.35);}
.wbo-lock{flex:none;width:34px;text-align:center;font-size:9px;font-weight:700;letter-spacing:1px;
  color:#7B92AB;background:rgba(123,146,171,.14);border:1px solid rgba(123,146,171,.28);
  border-radius:9px;padding:5px 0;}
.wbo-item .wb-text{margin-top:5px;}
/* 编辑页 */
.wbo-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;}
.wbo-rowt b{display:block;font-size:14px;font-weight:600;color:var(--ink);}
.wbo-rowt small{display:block;font-size:11.5px;color:var(--ink-3);margin-top:3px;}
.wbo-seg{margin-top:6px;}
.wbo-chips{padding:8px 0 2px;gap:8px;}
.wbo-stepper{display:flex;align-items:center;gap:12px;margin-top:6px;}
.wbo-step{width:32px;height:32px;border-radius:10px;border:1px solid var(--line);
  background:var(--card-soft);color:#57606E;font-size:18px;font-weight:600;line-height:1;
  display:flex;align-items:center;justify-content:center;}
.wbo-step:active{transform:scale(.94);}
.wbo-stepper b{min-width:26px;text-align:center;font-size:19px;font-weight:700;
  color:var(--ink);font-variant-numeric:tabular-nums;}
.wbo-stepper .wbo-hint{padding:0;font-size:11px;}
.chip.wb-glob{opacity:.78;}
.chip.wb-dis{opacity:.5;text-decoration:line-through;}
/* 世界书文件夹分组 */
.wbo-group{margin:12px 14px 0;}
.wbo-folder{display:flex;align-items:center;gap:8px;padding:6px 6px 8px 2px;color:var(--ink-2);cursor:pointer;}
.wbo-folder .ico-svg{width:17px;height:17px;color:#7B92AB;flex:none;}
.wbo-folder b{flex:1;font-size:13.5px;font-weight:700;letter-spacing:.3px;}
.wbo-folder span{font-size:10.5px;font-weight:700;color:#8A94A1;background:rgba(123,146,171,.12);
  border-radius:9px;padding:3px 7px;}
.wbo-folder .chev .ico-svg{width:15px;height:15px;color:#B7BEC8;}
.wbo-group .card{margin-top:2px;}
.wbo-list-empty{padding:13px 16px;font-size:12px;color:var(--ink-3);line-height:1.6;}
.wbo-fpick{display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:var(--card-soft);border:1px solid var(--line);border-radius:13px;padding:11px 13px;
  font-size:13.5px;color:var(--ink);cursor:pointer;}
.wbo-fpick .ico-svg{width:16px;height:16px;color:var(--mist);}
.act-row .wb-check{margin-right:10px;}
/* —— 预设 App —— */
.ps-hint{padding:12px 18px 4px;font-size:12px;line-height:1.75;color:var(--ink-3);letter-spacing:.3px;}
.ps-row{display:flex;align-items:center;gap:12px;padding:15px 16px 11px;}
.ps-lock{width:40px;height:40px;border-radius:13px;flex:none;display:flex;align-items:center;justify-content:center;
  background:rgba(123,146,171,.13);color:#7B92AB;}
.ps-lock .ico-svg{width:20px;height:20px;}
.ps-main{flex:1;min-width:0;}
.ps-main b{display:block;font-size:14.5px;font-weight:700;color:var(--ink);}
.ps-main small{display:block;font-size:11.5px;color:var(--ink-3);margin-top:4px;line-height:1.55;}
.ps-locked{padding:0 16px 14px;font-size:12px;color:#8A94A1;display:flex;align-items:center;gap:7px;}
.ps-dot{width:7px;height:7px;border-radius:50%;background:#C3CBD4;flex:none;}
.ps-dot.on{background:#B08089;}
.ps-dev-note{margin:0 16px 10px;padding:9px 12px;font-size:11.5px;line-height:1.6;border-radius:11px;
  color:#936871;background:rgba(176,128,137,.1);border:1px solid rgba(176,128,137,.22);}
#ps-custom,#ps-builtin{width:100%;resize:vertical;border-radius:14px;padding:11px 13px;background:var(--card-soft);
  border:1px solid var(--line);font-size:13px;font-family:inherit;line-height:1.7;color:var(--ink);}
/* ============================================================
 * 约会 App（dt-）
 * ============================================================ */
.dt-body{padding-bottom:calc(74px + env(safe-area-inset-bottom));}
.dt-sess-body{padding:14px 16px 26px;}
.dt-pad{padding:14px 14px 10px;}
/* 底栏：奶白 + 淡粉选中 */
.dt-tabbar{position:fixed;left:0;right:0;bottom:0;width:100%;max-width:430px;margin:0 auto;z-index:45;
  display:flex;background:rgba(255,253,252,.97);backdrop-filter:blur(12px);
  border-top:1px solid #F0EAE7;padding:6px 6px calc(6px + env(safe-area-inset-bottom));}
.dt-tab{flex:1;border:none;background:none;display:flex;flex-direction:column;align-items:center;gap:3px;
  color:#B3ABB0;font-size:10.5px;font-weight:600;letter-spacing:.5px;cursor:pointer;}
.dt-ico{display:flex;align-items:center;justify-content:center;padding:5px 15px;border-radius:14px;
  transition:background .18s ease;}
.dt-ico .ico-svg{width:21px;height:21px;}
.dt-tab.on{color:#A8717C;}
.dt-tab.on .dt-ico{background:#F7E9EC;}
/* Tab1 约会 */
.dt-hero{background:#fff;border-radius:20px;padding:18px 18px 16px;box-shadow:0 4px 18px rgba(120,110,105,.06);margin-bottom:14px;}
.dt-hero h2{font-size:19px;font-weight:700;color:var(--ink);letter-spacing:.5px;margin:0;}
.dt-hero p{font-size:12px;color:var(--ink-3);line-height:1.7;margin:6px 0 0;}
.dt-chars{display:flex;gap:10px;overflow-x:auto;padding:2px 14px 12px;-webkit-overflow-scrolling:touch;}
.dt-chars::-webkit-scrollbar{display:none;}
.dt-char{flex:none;width:94px;background:#fff;border:1px solid var(--line);border-radius:17px;
  padding:13px 8px 11px;text-align:center;cursor:pointer;box-shadow:0 3px 12px rgba(100,110,120,.05);}
.dt-char.on{border-color:#E3C5CB;background:#FDF6F7;}
.dt-ava{width:46px;height:46px;border-radius:50%;margin:0 auto 7px;overflow:hidden;
  background:rgba(123,146,171,.14);color:#8FA0B5;display:flex;align-items:center;justify-content:center;}
.dt-ava img{width:100%;height:100%;object-fit:cover;}
.dt-ava .ico-svg{width:23px;height:23px;}
.dt-char b{display:block;font-size:13px;font-weight:700;color:var(--ink);
  max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dt-char small{display:block;font-size:10.5px;color:var(--ink-3);margin-top:3px;line-height:1.4;}
.dt-mood{letter-spacing:1px;color:#C9A0A8!important;}
.dt-citychips{display:flex;gap:7px;overflow-x:auto;padding-bottom:8px;}
.dt-citychips::-webkit-scrollbar{display:none;}
.dt-citychips .chip{flex:none;}
.dt-places{display:flex;flex-direction:column;gap:7px;}
.dt-places input{width:100%;border-radius:12px;border:1px solid var(--line);background:var(--card-soft);
  padding:10px 12px;font-size:13.5px;font-family:inherit;color:var(--ink);}
.dt-place{display:flex;align-items:center;gap:10px;justify-content:space-between;
  border:1px solid transparent;border-radius:14px;padding:10px 12px;cursor:pointer;}
.dt-place.on{background:#FDF6F7;border-color:#EED7DB;}
.dt-p-main{min-width:0;flex:1;display:flex;flex-direction:column;gap:3px;}
.dt-p-main b{font-size:13.5px;font-weight:600;color:var(--ink);}
.dt-p-main small{font-size:11.5px;line-height:1.55;color:var(--ink-3);}
.dt-p-tags{display:flex;align-items:center;gap:5px;flex:none;}
.dt-p-tags .tag{font-style:normal;font-size:9.5px;font-weight:600;letter-spacing:.3px;border-radius:8px;
  padding:3px 6px;background:rgba(123,146,171,.12);color:#6E7E92;white-space:nowrap;}
.dt-p-tags .tag.ph{background:rgba(176,128,137,.12);color:#9C717A;}
.dt-p-tags .tag.r1{background:rgba(123,146,171,.13);color:#6E7E92;}
.dt-p-tags .tag.r2{background:rgba(184,156,130,.15);color:#9A8066;}
.dt-p-tags .tag.r3{background:rgba(176,128,137,.16);color:#A06672;}
.dt-p-fav{border:none;background:none;padding:2px;cursor:pointer;color:#C6CCD3;display:flex;}
.dt-p-fav .ico-svg{width:16px;height:16px;}
.dt-p-fav.on{color:#B08089;}
.dt-settings{padding:12px 14px 10px;}
.dt-settings label{display:block;font-size:12px;font-weight:700;color:var(--ink-3);
  letter-spacing:.5px;margin:8px 0 7px;}
.dt-settings .dt-opt{display:flex;flex-wrap:wrap;gap:7px;}
.dt-start{background:linear-gradient(135deg,#C9A3AB,#A8717C);}
/* 会话页 */
.dt-meta{display:flex;align-items:center;gap:11px;background:#fff;border-radius:17px;
  padding:12px 14px;box-shadow:0 3px 14px rgba(120,110,105,.06);margin-bottom:12px;}
.dt-meta .dt-m-ava{width:38px;height:38px;border-radius:50%;overflow:hidden;flex:none;
  background:rgba(123,146,171,.14);color:#8FA0B5;display:flex;align-items:center;justify-content:center;}
.dt-meta .dt-m-ava img{width:100%;height:100%;object-fit:cover;}
.dt-meta .dt-m-ava .ico-svg{width:20px;height:20px;}
.dt-meta b{display:block;font-size:14px;font-weight:700;color:var(--ink);}
.dt-meta small{display:block;font-size:11px;color:var(--ink-3);margin-top:2px;}
.dt-story{background:#fff;border-radius:18px;padding:14px 16px;margin:10px 0;
  box-shadow:0 3px 14px rgba(120,110,105,.05);}
.dt-story p{font-size:14.5px;line-height:2.05;color:#2B3038;font-weight:400;letter-spacing:.3px;margin:0;}
.dt-story p+p{margin-top:10px;text-indent:2em;}
.dt-my{display:flex;justify-content:flex-end;margin:10px 0;}
.dt-my span{display:inline-block;max-width:84%;background:#F7E9EC;border-radius:16px 16px 5px 16px;
  padding:10px 14px;font-size:13.5px;line-height:1.7;color:#7A5560;}
.dt-my span:first-child{}
.dt-photo{text-align:center;margin:14px 0;}
.dtp{width:86%;margin:0 auto;border-radius:16px;overflow:hidden;background:#fff;
  box-shadow:0 6px 20px rgba(120,110,105,.1);}
.dtp.has-img img{display:block;width:100%;height:190px;object-fit:cover;}
.dtp-vibe{height:150px;display:flex;align-items:center;justify-content:center;padding:22px;
  background:linear-gradient(160deg,#EDF2F7 0%,#F4E9EC 100%);}
.dtp-vibe span{font-size:13px;line-height:1.9;color:#6B7888;letter-spacing:.5px;}
.dt-photo p{font-size:12.5px;color:var(--ink-2);margin:8px 4px 2px;line-height:1.6;}
.dt-photo small{font-size:10.5px;color:var(--ink-3);letter-spacing:.5px;}
.dt-typing{display:flex;gap:5px;padding:12px 6px;}
.dt-typing span{width:7px;height:7px;border-radius:50%;background:#C9CFD8;animation:dtBlink 1.2s infinite;}
.dt-typing span:nth-child(2){animation-delay:.2s;}
.dt-typing span:nth-child(3){animation-delay:.4s;}
@keyframes dtBlink{0%,100%{opacity:.35;}50%{opacity:1;}}
.dt-choices{display:flex;flex-direction:column;gap:9px;margin:14px 0 10px;}
.dt-choice{width:100%;text-align:left;background:#fff;border:1px solid var(--line);border-radius:15px;
  padding:12px 15px;font-size:13.5px;line-height:1.55;color:var(--ink);cursor:pointer;
  font-family:inherit;box-shadow:0 2px 10px rgba(120,110,105,.04);}
.dt-choice:active{transform:scale(.985);background:#FDF6F7;border-color:#EED7DB;}
.dt-input{display:flex;gap:9px;align-items:center;position:sticky;bottom:8px;}
.dt-input input{flex:1;min-width:0;border-radius:20px;border:1px solid var(--line);background:rgba(255,255,255,.96);
  padding:11px 16px;font-size:13.5px;font-family:inherit;box-shadow:0 3px 14px rgba(120,110,105,.1);color:var(--ink);}
.dt-input button{width:42px;height:42px;border-radius:50%;border:none;flex:none;cursor:pointer;
  background:linear-gradient(135deg,#C9A3AB,#A8717C);color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 12px rgba(168,113,124,.3);}
.dt-input button .ico-svg{width:19px;height:19px;}
.dt-ended{text-align:center;font-size:12px;color:var(--ink-3);padding:16px 0 4px;letter-spacing:.5px;}
.dt-ec{display:flex;align-items:center;gap:9px;font-size:13.5px;color:var(--ink-2);
  padding:7px 0;cursor:pointer;}
.dt-ec input{width:16px;height:16px;accent-color:#B08089;}
#ec-note{border-radius:14px;}
/* 相册 */
.dt-filter{display:flex;gap:7px;overflow-x:auto;padding:2px 2px 10px;}
.dt-filter::-webkit-scrollbar{display:none;}
.dt-filter .chip{flex:none;}
.dt-wall{display:grid;grid-template-columns:1fr 1fr;gap:13px 12px;margin-top:4px;}
.dt-wall-group{margin-bottom:14px;}
.dtf{cursor:pointer;}
.dtf-canvas{position:relative;border-radius:12px;overflow:hidden;background:#EDF1F6;}
.dtf-canvas img{display:block;width:100%;height:152px;object-fit:cover;}
.dtf-canvas .dtp-vibe{height:152px;padding:14px;}
.dtf-canvas .dtp-vibe span{font-size:11.5px;line-height:1.75;}
.dtf p{font-size:11.5px;line-height:1.55;color:var(--ink-2);margin:6px 3px 0;}
.dtf small{display:block;font-size:9.5px;color:var(--ink-3);margin-top:2px;letter-spacing:.3px;}
.dtf-fav{position:absolute;top:7px;right:7px;width:26px;height:26px;border-radius:50%;
  background:rgba(255,255,255,.88);display:flex;align-items:center;justify-content:center;
  color:#B08089;font-style:normal;box-shadow:0 2px 7px rgba(120,110,105,.15);}
.dtf-fav .ico-svg{width:14px;height:14px;}
.dtf-polaroid{background:#fff;padding:8px 8px 10px;border-radius:6px;box-shadow:0 5px 16px rgba(120,110,105,.12);
  transform:rotate(-1.1deg);}
.dtf-polaroid:nth-child(even){transform:rotate(1.1deg);}
.dtf-polaroid .dtf-canvas{border-radius:4px;}
.dtf-stamp{background:#fff;padding:7px;border:2px dashed #C8BFC4;border-radius:10px;}
.dtf-ticket{background:#fff;padding:8px 8px 10px;border-radius:10px;box-shadow:0 4px 14px rgba(120,110,105,.1);}
.dtf-ticket .dtf-canvas{border-radius:7px;}
.dtf-ticket p{border-top:1.5px dashed #E6DDE1;padding-top:7px;}
.dtf-digital{background:#232830;border-radius:14px;padding:9px;box-shadow:0 5px 16px rgba(60,66,75,.22);}
.dtf-digital .dtf-canvas{border-radius:9px;}
.dtf-digital .dtf-meta{color:rgba(255,255,255,.62);padding:2px 3px 6px;}
.dtf-digital p{color:rgba(255,255,255,.82);}
.dtf-digital small{color:rgba(255,255,255,.45);}
.dtf-round .dtf-canvas{border-radius:17px;}
.dtf-meta{font-size:10px;color:var(--ink-3);letter-spacing:.4px;}
.dtp-detail{border-radius:16px;overflow:hidden;margin-bottom:10px;}
.dtp-detail img{display:block;width:100%;max-height:300px;object-fit:cover;}
.dtp-detail.vibe .dtp-vibe{height:210px;}
.dtp-meta-row{display:flex;gap:10px;font-size:11.5px;color:var(--ink-3);padding:2px 2px 8px;flex-wrap:wrap;}
#dtp-cap{width:100%;resize:none;border-radius:14px;padding:10px 12px;background:var(--card-soft);
  border:1px solid var(--line);font-size:13px;font-family:inherit;line-height:1.6;color:var(--ink);}
.dtp-actions{margin-top:8px;}
/* 收藏 / 回忆 */
.dt-seg{margin:2px 0 12px;}
.dt-fcard{background:#fff;border-radius:17px;padding:13px 15px;margin-bottom:11px;
  box-shadow:0 3px 13px rgba(120,110,105,.06);}
.dtf-who{font-size:11px;font-weight:600;color:var(--ink-3);letter-spacing:.4px;display:flex;align-items:center;gap:6px;}
.dtf-who .ico-svg{width:14px;height:14px;color:#B08089;}
.dt-fcard p{font-size:13.5px;line-height:1.85;color:var(--ink-2);margin:7px 0 4px;}
.dt-fcard u{font-size:11.5px;color:#B08089;text-decoration:none;cursor:pointer;}
.dt-voice{padding-left:30px;position:relative;}
.dt-moment{background:linear-gradient(160deg,#FBF3F4,#F6ECED);border:1px solid #F0DDE0;border-radius:18px;
  padding:15px 16px;margin-bottom:11px;}
.dt-moment p{font-size:14px;line-height:1.85;color:#6E555E;margin:0;}
.dt-moment footer{font-size:11px;color:#A68B93;margin-top:8px;}
.dt-moment u{color:#B08089;text-decoration:none;cursor:pointer;margin-left:6px;}
.dt-tl{display:flex;gap:11px;position:relative;padding-left:2px;}
.dt-tl::before{content:'';position:absolute;left:7px;top:16px;bottom:-4px;width:1.5px;background:#ECE6E3;}
.dt-tl:last-child::before{display:none;}
.dt-tl>i{width:13px;height:13px;border-radius:50%;background:#fff;border:3px solid #CFA7AE;flex:none;
  margin-top:5px;z-index:1;}
.dt-tl-c{flex:1;background:#fff;border-radius:15px;padding:12px 14px;margin-bottom:11px;cursor:pointer;
  box-shadow:0 2px 11px rgba(120,110,105,.06);}
.dt-tl-c b{display:block;font-size:13.5px;color:var(--ink);font-weight:700;}
.dt-tl-c span{display:block;font-size:11px;color:var(--ink-3);margin-top:3px;}
.dt-tl-c p{font-size:12.5px;line-height:1.7;color:var(--ink-2);margin:7px 0 0;}
.dt-arch{background:#fff;border-radius:15px;padding:13px 15px;margin-bottom:9px;display:flex;flex-direction:column;gap:4px;
  box-shadow:0 2px 11px rgba(120,110,105,.05);position:relative;}
.dt-arch b{font-size:13.5px;color:var(--ink);font-weight:700;padding-right:56px;}
.dt-arch span{font-size:11.5px;color:var(--ink-3);line-height:1.6;}
.dt-arch u{position:absolute;right:14px;top:13px;font-size:11.5px;color:#B08089;text-decoration:none;cursor:pointer;}
.dt-stats{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
.dt-stats>div{background:#fff;border-radius:17px;padding:17px 16px;box-shadow:0 3px 13px rgba(120,110,105,.06);
  display:flex;flex-direction:column;gap:5px;}
.dt-stats b{font-size:22px;font-weight:700;color:#7B92AB;letter-spacing:.5px;}
.dt-stats span{font-size:11.5px;color:var(--ink-3);}
.dt-add-anniv{font-size:12.5px;}
.dt-add-anniv .ico-svg{width:14px;height:14px;margin-right:5px;vertical-align:-2px;}
/* 我的 */
.dt-binds{display:flex;flex-wrap:wrap;gap:8px;}
.dt-sw-row{display:flex;align-items:center;justify-content:space-between;padding:11px 0;font-size:13.5px;color:var(--ink-2);}
.dt-pad textarea{width:100%;resize:vertical;border-radius:13px;padding:10px 12px;background:var(--card-soft);
  border:1px solid var(--line);font-size:13px;font-family:inherit;line-height:1.7;color:var(--ink);margin-top:2px;}

/* ===== 约会 v2.1.8：角色头像宫格 · 约会设置弹层 · 双人左右气泡 ===== */
/* Tab1 角色头像宫格 */
.dt-cgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px 10px;}
.dt-cgrid .dtc{display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer;}
.dtc-ava{width:74px;height:74px;border-radius:50%;overflow:hidden;background:#F6F7F9;border:1px solid #EDF0F3;
  display:flex;align-items:center;justify-content:center;color:#B7BEC8;
  box-shadow:0 4px 14px rgba(22,25,30,.05);transition:box-shadow .15s;}
.dtc:active .dtc-ava{box-shadow:0 0 0 2px #E7C9D0,0 4px 14px rgba(176,128,137,.18);}
.dtc-ava img{width:100%;height:100%;object-fit:cover;}
.dtc-ava .ico-svg{width:32px;height:32px;}
.dtc b{font-size:13px;color:var(--ink);font-weight:600;}
.dtc small{font-size:10.5px;color:var(--ink-3);font-weight:400;}
/* 设置弹层 */
.dt-su-head{display:flex;align-items:center;gap:12px;padding:2px 2px 10px;}
.dt-su-head .dtc-ava{width:54px;height:54px;flex:0 0 54px;}
.dt-su-head b{font-size:15px;color:var(--ink);}
.dt-su-head small{display:block;color:var(--ink-3);font-size:11.5px;margin-top:3px;line-height:1.5;}
.dt-su-label{font-size:12px;font-weight:700;color:var(--ink-2);margin:14px 2px 8px;letter-spacing:.4px;}
.dt-setup .dt-place{padding:10px 12px;cursor:pointer;}
.dt-setup .dt-place .dt-p-tags{display:none;}
.dt-setup .dt-start{margin-top:18px;}
/* 双人气泡会话 */
.dtb-meta{display:flex;justify-content:center;padding:4px 0 10px;}
.dtb-meta span{background:rgba(255,255,255,.88);border:1px solid var(--line);border-radius:99px;
  padding:4px 13px;font-size:11px;color:#8A94A1;}
.dtb-row{display:flex;gap:8px;margin:12px 0;align-items:flex-end;}
.dtb-row.me{flex-direction:row-reverse;}
.dtb-ava{width:38px;height:38px;border-radius:50%;overflow:hidden;flex:0 0 38px;background:#F1F3F6;
  display:flex;align-items:center;justify-content:center;color:#B7BEC8;border:1px solid #EDF0F3;}
.dtb-ava img{width:100%;height:100%;object-fit:cover;}
.dtb-ava .ico-svg{width:19px;height:19px;}
.dtb-col{max-width:78%;display:flex;flex-direction:column;gap:3px;}
.me .dtb-col{align-items:flex-end;}
.dtb-name{font-size:10.5px;color:var(--ink-3);padding:0 5px;font-weight:400;}
.dtb-bubble{background:#fff;border:1px solid #EDF0F3;border-radius:4px 17px 17px 17px;
  padding:10px 14px;font-size:13.5px;line-height:1.9;color:var(--ink);
  box-shadow:0 2px 10px rgba(22,25,30,.04);white-space:pre-wrap;word-break:break-word;cursor:pointer;}
.dtb-bubble:active{background:#FAFBFC;}
.me .dtb-bubble{background:#F9F1F3;border-color:#F0E3E6;border-radius:17px 4px 17px 17px;}
.me .dtb-bubble:active{background:#F6EAED;}
.dtb-bubble.photo{padding:6px 6px 4px;cursor:pointer;}
.dtb-bubble .dtp{width:206px;border-radius:12px;overflow:hidden;}
.dtb-bubble .dtp.has-img{background:#000;}
.dtb-bubble .dtp img{display:block;width:100%;}
.dtb-bubble .dtp.vibe .dtp-vibe{width:206px;height:134px;}
.dtb-cap{font-size:11px;color:#8A94A1;padding:3px 7px 4px;max-width:218px;line-height:1.5;}
.dtb-bubble .dt-typing{padding:3px 2px;}
/* 底部输入区 */
.dt-inputbar{position:sticky;bottom:0;display:flex;align-items:center;gap:9px;
  padding:10px 2px 12px;margin-top:8px;
  background:linear-gradient(transparent,#FBFCFD 26%);}
.dtb-plus{width:38px;height:38px;border-radius:50%;border:1px solid #E7EAF0;background:#fff;flex:0 0 38px;
  display:flex;align-items:center;justify-content:center;color:#7B92AB;cursor:pointer;
  box-shadow:0 2px 8px rgba(22,25,30,.05);}
.dtb-plus .ico-svg{width:19px;height:19px;}
.dtb-in{flex:1;min-width:0;border:1px solid #E7EAF0;border-radius:20px;background:#fff;
  padding:10px 15px;font-size:13.5px;outline:none;color:var(--ink);font-family:inherit;}
.dtb-in:focus{border-color:#DDC8CD;}
.dtb-send{width:38px;height:38px;border-radius:50%;border:0;flex:0 0 38px;cursor:pointer;
  background:linear-gradient(135deg,#B08089,#C9A3AB);color:#fff;
  display:flex;align-items:center;justify-content:center;box-shadow:0 3px 10px rgba(176,128,137,.25);}
.dtb-send .ico-svg{width:18px;height:18px;}
/* 我的：按角色数据行 */
.dt-data-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;border-bottom:1px solid #F0F2F5;}
.dt-data-row:last-child{border-bottom:0;}
.dt-dr-name{display:flex;align-items:center;gap:10px;min-width:0;}
.dt-dr-name b{font-size:13.5px;color:var(--ink);font-weight:600;}
.dt-dr-name small{font-size:11px;color:var(--ink-3);}
.dt-dr-ava{width:38px;height:38px;flex:0 0 38px;border-radius:50%;}
.dt-dr-acts{display:flex;gap:14px;flex:0 0 auto;}
.dt-dr-acts u{font-size:12.5px;color:#7B92AB;text-decoration:none;cursor:pointer;font-weight:600;}
.dt-dr-acts u:last-child{color:#B06A6A;}
/* 外观主题：折叠框 */
.fold-card{padding:0!important;overflow:hidden;}
.fold+.fold{border-top:1px solid var(--line);}
.fold-head{display:flex;align-items:center;gap:8px;padding:14px 15px;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.fold-t{font-size:13.5px;font-weight:600;color:var(--ink);flex:none;}
.fold-cur{flex:1;min-width:0;text-align:right;font-size:12.5px;color:var(--ink-3);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.fold-arrow{flex:none;color:var(--ink-3);font-size:17px;line-height:1;
  transition:transform .22s ease;transform:rotate(90deg);}
.fold:not(.open) .fold-arrow{transform:rotate(0deg);}
.fold-body{display:none;}
.fold.open .fold-body{display:block;}
.fold-in{padding:2px 6px 14px;}
/* 主题选择网格（4 套一行） */
.theme-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:0 8px;}
.theme-card{border-radius:14px;padding:6px 6px 8px;border:2px solid transparent;background:transparent;
  transition:all .15s ease;}
.theme-card.on{border-color:var(--mist-deep);background:var(--card);box-shadow:var(--shadow-soft);}
.tc-mock{position:relative;height:72px;border-radius:9px;overflow:hidden;
  background:var(--chat-bg);border:1px solid rgba(123,138,160,.18);}
.tc-bar{position:absolute;top:0;left:0;right:0;height:15px;background:var(--hdr-bg);
  border-bottom:1px solid var(--hdr-border);}
.tc-l,.tc-r,.tc-r2{position:absolute;height:9px;border-radius:var(--mock-r,5px);font-size:0;}
.tc-l{left:6px;top:24px;width:22px;background:var(--l-bubble);border:1px solid var(--hdr-border);}
.tc-r{right:6px;top:38px;width:26px;background:var(--r-bubble-bg);}
.tc-r2{right:6px;top:53px;width:18px;background:var(--r-bubble-bg);opacity:.8;}
.tc-name{text-align:center;font-size:11.5px;color:var(--ink-2);font-weight:600;padding-top:6px;}
.theme-card.on .tc-name{color:var(--ink);}
/* 气泡颜色卡 */
.bs-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:0 8px;}
.bs-card{border-radius:14px;padding:6px 6px 8px;border:2px solid transparent;background:transparent;transition:all .15s ease;}
.bs-card.on{border-color:var(--mist-deep);background:var(--card);box-shadow:var(--shadow-soft);}
.bs-stage{height:72px;border-radius:9px;overflow:hidden;background:var(--chat-bg);
  border:1px solid rgba(123,138,160,.18);padding:8px;display:flex;flex-direction:column;justify-content:center;gap:5px;}
.bs-stage .msg{max-width:100%;margin:0;padding:0;gap:0;}
.bs-stage .msg .m-ava,.bs-stage .msg .m-meta{display:none;}
.bs-stage .bubble{display:inline-block;font-size:10.5px;line-height:1.3;padding:5px 9px!important;
  width:fit-content;box-shadow:none;}
/* 气泡样式下拉选择器：输入框式头部（点击展开）＋分组大预览＋应用保存栏 */
.fold-as-field .fold-head{margin:10px 12px 12px;padding:11px 14px;background:#fff;
  border:1px solid var(--line-2);border-radius:14px;box-shadow:var(--shadow-soft);}
.fold-as-field .fold-t{font-size:13px;}
.fold-as-field .fold-cur{font-weight:600;color:var(--mist-deep);}
.bs-hint{font-size:11.5px;line-height:1.55;color:var(--ink-3);padding:2px 12px 4px;}
.bs-sep{font-size:11px;font-weight:700;letter-spacing:1.5px;color:var(--mist-deep);
  padding:10px 12px 2px;opacity:.75;}
.bs-grid-2{grid-template-columns:repeat(2,1fr);gap:10px;padding:0 8px;}
.bs-card-lg{padding:7px 7px 9px;}
.bs-stage.tall{height:96px;padding:16px 10px 9px;justify-content:flex-end;gap:7px;}
.bs-stage.tall .bubble{font-size:11px;padding:6px 10px!important;}
.bs-apply-bar{padding:16px 8px 4px;}
.bs-apply-btn{border-radius:14px;padding:13px;font-size:14.5px;}
.bs-apply-btn:disabled{background:var(--card-soft);color:var(--ink-3);box-shadow:none;}
/* 双数字区间 */
.two-num{display:flex;align-items:center;gap:10px;}
.two-num input{width:74px;text-align:center;}
.two-num span{color:var(--ink-3);font-weight:600;}
/* 手风琴 */
.acc-head{display:flex;align-items:center;gap:8px;padding:13px 16px;font-size:14.5px;
  font-weight:500;color:var(--ink);}
.acc-cur{flex:1;text-align:right;font-size:12.5px;color:var(--ink-3);font-weight:400;}
.acc-arrow{color:var(--mist);font-size:17px;line-height:1;transition:transform .2s ease;}
.acc.open .acc-arrow{transform:rotate(90deg);}
.acc-body{display:none;}
.acc.open .acc-body{display:block;}
.acc-list{padding:0 16px 12px;}
.acc-opt{display:flex;align-items:center;gap:10px;padding:9px 0;font-size:14px;color:var(--ink-2);}
.radio{width:19px;height:19px;border-radius:50%;border:2px solid #C3CBD4;flex:none;
  transition:all .15s ease;}
.radio.on{border-color:var(--mist-deep);
  background:radial-gradient(circle,var(--mist-deep) 46%,#fff 51%);}
/* 聊天总结页 */
.sum-card{background:var(--card);border-radius:var(--r-lg);box-shadow:var(--shadow-soft);
  border:1px solid var(--line);padding:16px;}
.sum-date{font-size:12px;font-weight:700;color:var(--mist-deep);margin-bottom:10px;}
.sum-text{font-family:inherit;font-size:13.5px;line-height:1.75;color:var(--ink);
  white-space:pre-wrap;word-break:break-word;margin:0;}
.sum-empty{font-size:13px;line-height:1.8;color:var(--ink-3);}
.sum-actions{display:flex;gap:10px;margin-top:10px;}
.sum-actions .btn{flex:1;}
.w-calendar .cal-grid span.today{background:var(--pink-btn);color:#fff;font-weight:700;}
.w-calendar .cal-m{font-size:14px;font-weight:700;margin-bottom:8px;}
.w-polaroid img{width:100%;border-radius:12px;}
.w-polaroid .pl-cap{font-size:12px;color:var(--muted);margin-top:8px;text-align:center;font-style:italic;}
.w-period .w-big{font-size:22px;font-weight:800;color:var(--pink-deep);}
.w-weather .w-temp{font-size:30px;font-weight:800;}
.w-weather .w-s{font-size:12px;color:var(--muted);}
.w-s-err{color:#C07676!important;}
.w-music{display:flex;align-items:center;gap:12px;}
.w-music .wm-ico{color:var(--mist-deep);display:flex;}
.w-music .wm-ico .ico-svg{width:30px;height:30px;}
.w-music .wm-bar{flex:1;height:5px;border-radius:3px;background:var(--field);overflow:hidden;}
.w-music .wm-bar i{display:block;height:100%;width:35%;background:var(--pink-btn);border-radius:3px;}
.w-steps .w-big{font-size:28px;font-weight:800;color:var(--brown);}
.w-steps .wm-track{height:8px;border-radius:4px;background:var(--field);margin-top:8px;overflow:hidden;}
.w-steps .wm-track i{display:block;height:100%;background:var(--brown);border-radius:4px;}
.w-todo .todo-i{display:flex;align-items:center;gap:9px;padding:6px 0;font-size:13.5px;border-bottom:1px dashed var(--line);cursor:pointer;}
.w-todo .todo-i:active{opacity:.55;}
.w-todo .todo-i:last-child{border:none;}
.w-todo .todo-i.done{color:var(--muted);text-decoration:line-through;}
.w-todo .todo-dot{width:18px;height:18px;border-radius:50%;border:2px solid var(--mist);flex:none;display:flex;align-items:center;justify-content:center;font-size:11px;color:#fff;}
.w-todo .todo-dot .ico-svg{width:11px;height:11px;}
.w-todo .todo-i.done .todo-dot{background:var(--pink-btn);border-color:var(--pink-btn);}
.w-notif .n-i{display:flex;gap:9px;align-items:flex-start;padding:7px 0;border-bottom:1px dashed var(--line);font-size:12.5px;}
.w-notif .n-i:last-child{border:none;}
.w-notif .n-i .n-ico{width:28px;height:28px;border-radius:8px;background:var(--mist-soft);color:var(--mist-deep);display:flex;align-items:center;justify-content:center;font-size:14px;flex:none;}
.w-notif .n-i .n-ico .ico-svg{width:14px;height:14px;}
.w-notif .n-app{font-size:10.5px;color:var(--muted);font-weight:700;}

/* 创作者 */
.creator-lock{text-align:center;padding:26px 10px;color:var(--ink-3);}
.creator-lock .cl-ico{font-size:34px;margin-bottom:8px;}
.dev-row .r-ico{background:var(--mist-soft)!important;}

/* 停用页 */
#layer-closed{align-items:center;justify-content:center;text-align:center;padding:40px;display:none;}
#layer-closed.layer-active{display:flex;}
.closed-ico{font-size:60px;margin-bottom:16px;color:var(--mist);display:flex;justify-content:center;}
.closed-ico .ico-svg{width:60px;height:60px;}
.closed-wrap h2{font-size:20px;margin-bottom:10px;}
.closed-wrap p{font-size:13px;color:var(--muted);line-height:1.7;}

/* 页面管理 chips */
.page-chips{display:flex;gap:10px;overflow-x:auto;padding:6px 2px 10px;}
.page-chip{flex:none;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-soft);padding:10px 16px;font-size:13px;font-weight:600;color:var(--ink);position:relative;display:flex;align-items:center;gap:8px;}
.page-chip.cur{outline:2px solid var(--mist);}
.page-chip .pc-def{font-size:10px;background:var(--mist-soft);padding:2px 8px;border-radius:8px;color:var(--mist-deep);}
.page-chip .pc-x{color:#D09494;display:flex;}
.page-chip [data-act]{display:flex;align-items:center;}
.page-chip [data-act] .ico-svg{width:14px;height:14px;}
.page-chip .pc-x .ico-svg{width:12px;height:12px;}

/* 弹层内网格小工具 */
.mini-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}
.mini-opt{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px 10px;text-align:center;font-size:12.5px;font-weight:500;color:var(--ink);box-shadow:var(--shadow-soft);}
.mini-opt .mo-ico{font-size:22px;display:block;margin-bottom:6px;color:var(--mist-deep);}
.mini-opt .mo-ico .ico-svg{width:22px;height:22px;}

/* 输入行内联 */
.inline-form{display:flex;gap:8px;padding:10px 0 4px;}
.inline-form input{flex:1;background:var(--field);border-radius:var(--r-md);padding:10px 13px;font-size:13.5px;}

/* ==================================================================
 * 聊天：输入栏底部弹起面板（微信式：输入区整体上移）+ 自定义表情包
 * ================================================================== */
.ci-dock{
  flex:none;display:grid;grid-template-rows:0fr;
  background:var(--panel-bg);
  transition:grid-template-rows .26s cubic-bezier(.32,.72,0,1);
}
.ci-dock-in{min-height:0;overflow:hidden;display:flex;flex-direction:column;}
.ci-dock.show{grid-template-rows:1fr;box-shadow:inset 0 1px 0 var(--hdr-border);}
.ci-dock .plus-panel{border-top:none;margin:0;}
.ci-dock .emoji-panel{border-top:none;padding:0;height:232px;max-height:none;grid-template-columns:none;gap:0;overflow:hidden;}
.ci-dock .emoji-panel.show{display:flex;flex-direction:column;animation:ciDockIn .24s ease;}
.ci-dock .plus-panel.show{animation:ciDockIn .24s ease;}
@keyframes ciDockIn{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}

/* 表情面板：分组 tabs + 贴纸网格 */
.stk-head{flex:none;display:flex;align-items:center;gap:8px;padding:9px 12px 8px;border-bottom:1px solid var(--hdr-border);}
.stk-tabs{flex:1;min-width:0;display:flex;gap:18px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;}
.stk-tabs::-webkit-scrollbar{display:none;}
.stk-tab{flex:none;font-size:14px;font-weight:400;color:#9AA2AE;background:transparent;
  border:none;border-radius:0;padding:4px 2px;white-space:nowrap;box-shadow:none;line-height:20px;}
.stk-tab.on{background:transparent;color:var(--accent);font-weight:500;
  box-shadow:inset 0 -2px 0 var(--accent);}
.stk-ops{flex:none;display:flex;gap:6px;}
.stk-op{border:1px solid var(--field-border);background:var(--field-bg);color:var(--mist-deep);
  font-size:11.5px;font-weight:700;border-radius:12px;padding:5px 11px;}
.stk-op:active{background:var(--mist-soft);}
.stk-grid{flex:1;min-height:0;overflow-y:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:9px;
  padding:11px 12px calc(13px + env(safe-area-inset-bottom));align-content:start;}
.stk-item{position:relative;aspect-ratio:1;border-radius:14px;background:var(--field-bg);
  border:1px solid var(--field-border);overflow:hidden;
  display:flex;align-items:center;justify-content:center;transition:transform .14s ease;}
.stk-item:active{transform:scale(.92);}
.stk-item img{width:100%;height:100%;object-fit:contain;padding:4px;}
.stk-desc{display:none;}
.stk-item.img-fail img{opacity:.12;}
.stk-item.img-fail::after{content:'链接失效';position:absolute;font-size:9.5px;color:var(--ink-3);}
.stk-check{position:absolute;top:5px;right:5px;width:19px;height:19px;border-radius:50%;
  background:rgba(38,44,54,.5);color:transparent;display:flex;align-items:center;justify-content:center;
  opacity:0;transition:all .14s ease;}
.stk-check .ico-svg{width:11px;height:11px;}
.stk-item.manage .stk-check{opacity:1;}
.stk-item.sel .stk-check{background:var(--send-bg);color:var(--send-fg);}
.stk-empty{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;padding:44px 20px;color:var(--ink-3);text-align:center;}
.stk-empty .se-ico{color:var(--mist);display:flex;}
.stk-empty .se-ico .ico-svg{width:40px;height:40px;}
.stk-empty .se-t{font-size:14px;font-weight:700;color:var(--ink-2);}
.stk-empty .se-s{font-size:11.5px;line-height:1.6;}

/* 管理抽屉 */
.stk-mgr{display:flex;flex-direction:column;min-height:380px;max-height:64vh;}
.stk-mgr .stk-tabs{padding:0 0 11px;}
.stk-mgr .stk-grid{flex:1;max-height:44vh;border:1px solid var(--line);border-radius:16px;background:#FBFCFD;padding:10px;}
.stk-mbar{flex:none;display:flex;align-items:center;gap:10px;padding-top:12px;}
.smb-sp{flex:1;}
.smb-count{font-size:12.5px;color:var(--ink-2);font-weight:600;}
.smb-del{border:none;border-radius:13px;padding:8px 18px;background:#F3DEDE;color:#C06262;font-size:13px;font-weight:700;}
.smb-del:disabled{opacity:.4;}
.smb-rmg{border:none;background:var(--mist-soft);color:var(--ink-2);border-radius:13px;
  padding:8px 14px;font-size:12.5px;font-weight:600;}
.smb-rmg[hidden]{display:none;}

/* 批量导入弹窗 */
.stk-imp{text-align:left;}
.stk-imp .si-l{font-size:12px;color:#A6ADB8;font-weight:700;display:block;margin:11px 0 7px;}
.stk-imp .chip-row{display:flex;flex-wrap:wrap;gap:8px;padding:0;}
.stk-imp textarea{width:100%;resize:none;border-radius:14px;padding:11px 13px;background:#F6F7F9;
  border:1px solid #ECEEF1;font-size:13px;font-family:inherit;line-height:1.7;}
.stk-imp #sgi-gname{width:100%;background:#F6F7F9;border:1px solid #ECEEF1;border-radius:13px;
  padding:10px 12px;font-size:13px;margin-top:9px;}
.sgi-count{font-size:12px;font-weight:700;color:#A6ADB8;margin:8px 2px 0;}
.sgi-count.ok{color:#5E8C72;}
.stk-imp .hint{padding:6px 2px 0;font-size:11.5px;color:var(--ink-3);line-height:1.6;}

/* 设置页入口 */
.stk-setrow{display:flex;gap:9px;flex-wrap:wrap;padding:2px 16px 6px;}
.ss-btn{flex:1;min-width:132px;border:1px solid var(--line);background:var(--card-soft);
  border-radius:13px;padding:11px 12px;font-size:12.5px;font-weight:700;color:var(--mist-deep);}
.ss-btn:active{background:var(--mist-soft);}

/* 表情包选择（聊天设置：分组单选 → 保存） */
.stk-pick{padding:8px 16px 2px;display:flex;flex-direction:column;gap:8px;}
.stk-opt{display:flex;align-items:center;gap:10px;padding:11px 13px;
  border:1px solid var(--line);border-radius:14px;background:var(--card-soft);transition:all .15s ease;}
.stk-opt.on{border-color:var(--mist-deep);background:var(--mist-soft);
  box-shadow:inset 0 0 0 1px var(--mist-deep);}
.stk-opt .so-name{font-size:14px;font-weight:600;flex:1;min-width:0;}
.stk-opt .so-count{font-size:11.5px;color:var(--ink-3);font-weight:600;flex:none;}
.stk-savebar{padding:12px 16px 4px;}
.stk-savebar .btn{width:100%;border-radius:14px;padding:13px;font-size:14.5px;}
.stk-savebar .btn:disabled{background:var(--card-soft);color:var(--ink-3);box-shadow:none;}

/* 贴纸消息气泡（无边框透明，类似微信表情包） */
.bubble.stk-bubble{background:transparent!important;box-shadow:none!important;border:none!important;
  padding:2px!important;border-radius:10px!important;}
.bubble.stk-bubble img{width:108px;height:108px;object-fit:contain;display:block;}
.bubble.stk-bubble img.fail{opacity:.2;width:56px;height:56px;}

/* ==================================================================
 * 第二页「生活」手绘 bento 拼贴 · 毛玻璃留白露壁纸（v2.1.3）
 * 报头金句+装饰条 / 天气 / 日历 / 两组2×2 App / 备忘录 / 生理期
 * ================================================================== */
.desktop-page.life-page{
  width:100%;min-width:100%;max-width:100%;flex:0 0 100%;box-sizing:border-box;
  padding:24px 18px calc(12px + env(safe-area-inset-bottom));
  background:transparent;
  backdrop-filter:none;-webkit-backdrop-filter:none;
  overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;
  --lp-ink:#39434F;
  --lp-ink2:#57606E;
  --lp-accent:#7B92AB;
  --lp-rose:#B08089;
  --lp-glass:rgba(255,255,255,.20);
  --lp-line:rgba(255,255,255,.62);
  --lp-halo:0 1px 9px rgba(255,255,255,.95),0 0 3px rgba(255,255,255,.9);
}
.lp-bento{flex:none;display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:stretch;}

/* —— 左上：报头 + 金句文字 + 渐隐装饰条 —— */
.lp-b-head{grid-column:1;grid-row:1;min-width:0;display:flex;flex-direction:column;
  justify-content:center;padding:1px 4px 0;}
.lph-row{display:flex;align-items:baseline;justify-content:space-between;gap:8px;}
.lph-en{font-size:10px;font-weight:800;letter-spacing:3.5px;color:var(--lp-ink2);
  text-shadow:var(--lp-halo);}
.lph-date{font-size:10px;font-weight:600;letter-spacing:.5px;color:var(--lp-ink2);
  text-shadow:var(--lp-halo);white-space:nowrap;}
.lp-quote{position:relative;flex:none;margin:9px 0 0;padding:0;text-align:left;}
.lp-quote .dw{position:static!important;left:auto!important;top:auto!important;width:auto!important;
  height:auto!important;margin:0;}
.lp-quote .dw-text .dwtxt{
  padding:0;background:transparent;border:none;box-shadow:none;
  backdrop-filter:none;-webkit-backdrop-filter:none;
  font-size:13px;font-weight:600;line-height:1.65;letter-spacing:2px;
  color:var(--lp-ink);text-shadow:var(--lp-halo);text-align:left;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.lp-quote .dw-text.round .dwtxt{
  background:transparent;border:none;box-shadow:none;border-radius:0;padding:0;
}
.lp-q-add,.lp-q-empty{
  padding:0;text-align:left;font-size:12.5px;font-weight:500;
  letter-spacing:2px;color:var(--lp-ink);text-shadow:var(--lp-halo);
  border-radius:0;background:transparent;
}
.lp-q-add{display:inline-block;padding:4px 12px;border:1px dashed rgba(123,146,171,.75);
  border-radius:14px;background:rgba(255,255,255,.22);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);}
.lph-bar{flex:none;width:48px;height:3px;border-radius:3px;margin-top:10px;padding:0;
  background:linear-gradient(90deg,#9FB0C3,rgba(123,146,171,0));
  box-shadow:0 1px 4px rgba(255,255,255,.9);}

/* —— bento 落位 —— */
.lp-b-calendar{grid-column:2;grid-row:1/span 2;}
.lp-b-weather{grid-column:1;grid-row:2;}
.lp-agrid-a{grid-column:1;grid-row:3;}
.lp-b-todo{grid-column:2;grid-row:3;}
.lp-b-period{grid-column:1;grid-row:4;}
.lp-agrid-b{grid-column:2;grid-row:4;}
.lp-tail{grid-column:1/-1;min-width:0;display:flex;flex-direction:column;gap:12px;margin-top:1px;}

/* —— 玻璃卡通用 —— */
.lp-cell{min-width:0;display:flex;position:relative;}
.lp-cell>.dw{position:static!important;left:auto!important;top:auto!important;width:100%!important;
  height:auto!important;margin:0;flex:1;min-width:0;touch-action:auto;}
.lp-cell .wcard{margin:0;width:100%;height:100%;padding:13px 14px!important;
  background:var(--lp-glass)!important;border:1px solid var(--lp-line)!important;border-radius:20px!important;
  box-shadow:0 8px 22px rgba(45,60,80,.10),inset 0 1px 0 rgba(255,255,255,.88)!important;
  backdrop-filter:blur(16px) saturate(1.25);-webkit-backdrop-filter:blur(16px) saturate(1.25);
  color:var(--lp-ink);display:flex;flex-direction:column;}
.lp-cell .wcard img{text-shadow:none;}
.lp-cell .wc-body{position:relative;min-width:0;flex:1;}
/* 雾蓝渐变短条 + 右上角英文小标 */
.lp-b-calendar .wc-body::before,.lp-b-weather .wc-body::before,.lp-b-todo .wc-body::before,
.lp-b-period .wc-body::before{
  content:'';display:block;width:16px;height:2.5px;border-radius:2px;margin:0 0 8px;
  background:linear-gradient(90deg,#9FB0C3,#7B92AB);
  box-shadow:0 1px 4px rgba(255,255,255,.9);
}
.lp-b-calendar .wc-body::after,.lp-b-weather .wc-body::after,
.lp-b-todo .wc-body::after,.lp-b-period .wc-body::after{
  content:attr(data-lplabel);position:absolute;top:-3px;right:2px;
  font-size:8px;font-weight:800;letter-spacing:2px;color:#6E7E92;text-shadow:var(--lp-halo);
}
.lp-b-weather .wc-body::after{content:'WEATHER';}
.lp-b-calendar .wc-body::after{content:'CALENDAR';}
.lp-b-todo .wc-body::after{content:'MEMO';}
.lp-b-period .wc-body::after{content:'PERIOD';}

/* —— 天气：半宽横条，温度+天气图一行 / 城市+状况一行 —— */
.lp-b-weather .wc-body{display:flex;flex-direction:column;justify-content:center;}
.lp-b-weather .w-now{display:flex;align-items:center;flex-wrap:wrap;gap:1px 8px;min-height:48px;}
.lp-b-weather .w-temp{font-size:24px;font-weight:800;line-height:1;color:var(--lp-ink);
  text-shadow:var(--lp-halo);white-space:nowrap;}
.lp-b-weather .w-em{font-size:18px;line-height:1;}
.lp-b-weather .w-meta{flex:1 1 100%;min-width:0;display:flex;align-items:baseline;gap:7px;}
.lp-b-weather .w-city{font-size:11px;font-weight:800;color:var(--lp-ink);
  text-shadow:var(--lp-halo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lp-b-weather .w-s{font-size:10px;font-weight:600;color:var(--lp-ink2);text-shadow:var(--lp-halo);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lp-b-weather .w-empty2{display:flex;flex-direction:row;align-items:center;gap:9px;min-height:54px;}
.lp-b-weather .we-ico .ico-svg{width:20px;height:20px;color:var(--lp-accent);}

/* —— 日历：右上高卡，日期格铺满高度 —— */
.lp-b-calendar .wcard{padding:12px 11px!important;}
.lp-b-calendar .wc-body{display:flex;flex-direction:column;}
.lp-b-calendar .cal-m{margin:0 34px 6px 0;font-size:11.5px;font-weight:800;letter-spacing:.5px;
  color:var(--lp-ink);text-shadow:var(--lp-halo);white-space:nowrap;overflow:hidden;}
.lp-b-calendar .cal-grid{flex:1;display:grid;grid-template-columns:repeat(7,1fr);
  grid-template-rows:repeat(7,minmax(0,1fr));gap:2px;font-size:10px;text-align:center;min-height:0;}
.lp-b-calendar .cal-grid b{color:var(--lp-accent);font-weight:700;font-size:9px;line-height:1;padding:0;
  display:flex;align-items:center;justify-content:center;text-shadow:var(--lp-halo);}
.lp-b-calendar .cal-grid span{display:flex;align-items:center;justify-content:center;padding:0;line-height:1;
  border-radius:50%;color:var(--lp-ink);font-weight:600;font-size:10px;
  text-shadow:var(--lp-halo);min-height:0;}
.lp-b-calendar .cal-grid span.today{
  background:var(--lp-accent);color:#fff;font-weight:800;
  box-shadow:0 3px 10px rgba(123,146,171,.5);text-shadow:none;
}

/* —— 备忘录：右中高卡，最多 4 行，点空白进 App —— */
.lp-b-todo .wc-body{display:flex;flex-direction:column;overflow:hidden;}
.lp-b-todo .todo-i{flex:1 1 0;min-height:22px;max-height:34px;
  padding:3px 0;font-size:11.5px;gap:7px;color:var(--lp-ink);
  text-shadow:var(--lp-halo);border-bottom:1px dashed rgba(90,110,135,.35);}
.lp-b-todo .todo-i span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lp-b-todo .todo-i.done{color:#8A94A1;}
.lp-b-todo .todo-dot{width:15px;height:15px;border-color:rgba(123,146,171,.9);background:rgba(255,255,255,.35);}
.lp-b-todo .todo-i:nth-child(n+5),.lp-b-todo .todo-more,.lp-b-todo .inline-form{display:none;}
.lp-b-todo .wc-body:empty::after{
  content:attr(data-lplabel);display:flex;align-items:center;justify-content:center;
  position:static;font-size:11px;font-weight:600;letter-spacing:2px;color:#7C8694;
  text-shadow:var(--lp-halo);flex:1;}
.lp-b-todo .wc-body:empty::after{content:'还没有备忘 · 点我写一条';}

/* —— 生理期：左下高卡，水滴 + 三行信息居中 —— */
.lp-b-period .wc-body{display:flex;flex-direction:column;}
.lp-b-period .prd2{flex:1;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;gap:7px;padding:0;min-height:118px;}
.lp-b-period .p2-drop{width:46px;height:46px;margin:0 0 1px;}
.lp-b-period .p2-drop .ico-svg{width:21px;height:21px;}
.lp-b-period .p2-main{display:flex;flex-direction:column;align-items:center;gap:2px;}
.lp-b-period .p2-big{font-size:15px;white-space:nowrap;}
.lp-b-period .p2-sub{font-size:11px;white-space:nowrap;margin-top:0;}
.lp-b-period .p2-next{font-size:10px;white-space:nowrap;margin-top:0;}
.lp-b-period .p2-go{display:none;}
.lp-b-period .prd2-empty{gap:0;}
.lp-b-period .prd2-empty .p2-drop{margin-bottom:7px;}
.lp-b-period .prd2-empty .p2-t{font-size:12px;text-align:center;white-space:normal;}
.lp-b-period .prd2-empty .p2-s{font-size:10px;text-align:center;white-space:normal;margin-top:3px;}

/* —— 两组 2×2 App —— */
.lp-agrid{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:1fr 1fr;
  gap:10px;align-content:stretch;justify-items:center;}
.lp-agrid .lp-app.app-icon{margin:0;gap:4px;justify-content:center;}
.lp-agrid .lp-app.app-icon .ico{
  width:46px;height:46px;border-radius:15px;
  box-shadow:0 6px 15px rgba(50,65,85,.18),inset 0 1px 0 rgba(255,255,255,.9);
}
.lp-agrid .lp-app.app-icon .lbl{font-size:10.5px;color:var(--lp-ink);font-weight:600;
  letter-spacing:.5px;text-shadow:var(--lp-halo);}
.lp-agrid .lp-add .lpa-box{
  width:46px;height:46px;border-radius:15px;background:rgba(255,255,255,.24);
  border:1.5px dashed rgba(123,146,171,.8);color:var(--lp-accent);font-size:22px;
  display:flex;align-items:center;justify-content:center;}
.lp-agrid .lp-add .lbl{color:var(--lp-ink);font-weight:600;font-size:10.5px;text-shadow:var(--lp-halo);}
.lp-agrid .lp-blank{width:46px;height:65px;pointer-events:none;}

/* —— 尾部：额外组件（编辑态可加） —— */
.lp-extra{flex:none;display:grid;grid-template-columns:1fr 1fr;gap:11px;align-content:start;}
.lp-extra .lp-c-together,.lp-extra .lp-c-polaroid,.lp-extra .lp-c-anniversary,.lp-extra .lp-c-image,
.lp-extra .lp-c-music,.lp-extra .lp-c-steps,.lp-extra .lp-c-notif{grid-column:span 2;}
.lp-extra .lp-c-together,.lp-extra .lp-c-anniversary,.lp-extra .lp-c-music,.lp-extra .lp-c-steps,
.lp-extra .lp-c-notif,.lp-extra .lp-c-polaroid,.lp-extra .lp-c-image{text-shadow:var(--lp-halo);}
.lp-c-add{grid-column:1/-1;}
.lp-c-add .lpg-add{width:100%;min-height:58px;border:1.5px dashed rgba(123,146,171,.75);border-radius:18px;
  background:rgba(255,255,255,.20);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  display:flex;align-items:center;justify-content:center;
  color:var(--lp-accent);font-size:12px;font-weight:700;letter-spacing:1px;text-shadow:var(--lp-halo);}
.life-page .dw{animation:none!important;}
#layer-desktop.editing .life-page .dw{animation:dwJiggle .28s infinite alternate;}

/* ================= 备忘录 App ================= */
.memo-add{display:flex;gap:10px;padding:12px;align-items:center;}
.memo-inp{flex:1;min-width:0;height:40px;border-radius:12px;padding:0 13px;font-size:14px;
  background:var(--card-soft);border:1.5px solid var(--line);color:var(--ink);}
.memo-inp::placeholder{color:var(--ink-3);}
.memo-inp:focus{outline:none;border-color:#E39CBE;box-shadow:0 0 0 3px rgba(227,156,190,.18);}
.memo-btn{flex:none;width:auto;height:40px;padding:0 16px;border:none;border-radius:12px;font-size:13px;font-weight:700;
  letter-spacing:0;color:#fff;background:linear-gradient(135deg,#F0A6C4,#DF6F9B);
  box-shadow:0 4px 12px rgba(217,111,155,.35);}
.memo-btn:active{transform:scale(.96);}
.memo-list .memo-row{display:flex;align-items:center;gap:10px;padding:12px 14px;}
.memo-row+.memo-row{border-top:1px solid var(--line);}
.memo-dot{flex:none;width:20px;height:20px;border-radius:50%;border:1.7px solid #E193B6;
  display:flex;align-items:center;justify-content:center;color:#fff;background:rgba(255,255,255,.4);}
.memo-dot .ico-svg{width:12px;height:12px;stroke-width:2.6;}
.memo-row.done .memo-dot{background:linear-gradient(135deg,#F0A6C4,#DF6F9B);border-color:transparent;}
.memo-txt{flex:1;min-width:0;font-size:14px;line-height:1.45;color:var(--ink);word-break:break-word;}
.memo-row.done .memo-txt{color:var(--ink-3);text-decoration:line-through;}
.memo-x{flex:none;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:#C9A2B5;background:transparent;}
.memo-x .ico-svg{width:13px;height:13px;}
.memo-x:active{background:rgba(217,138,172,.18);}
.memo-empty{padding:38px 16px;text-align:center;color:var(--ink-3);font-size:13px;line-height:2;}
.memo-empty i{display:flex;width:42px;height:42px;margin:0 auto 10px;border-radius:50%;
  align-items:center;justify-content:center;color:#D89BB8;background:rgba(217,138,172,.12);}
.memo-empty .ico-svg{width:22px;height:22px;}

/* 生理提醒组件基础样式（生活页半宽紧凑覆写写在前文 .lp-c-period 段） */
.prd2{display:flex;align-items:center;gap:12px;padding:2px 4px;cursor:pointer;--prd2:#F0557F;}
.p2-drop{width:44px;height:44px;border-radius:50%;flex:none;
  background:linear-gradient(135deg,#FFD0E0,#F07BA8);color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 16px rgba(240,85,127,.30);}
.p2-drop .ico-svg{width:21px;height:21px;}
.p2-main{min-width:0;flex:1;}
.p2-big{font-size:16px;font-weight:800;color:#5A3D4C;
  text-shadow:0 1px 5px rgba(255,255,255,.95);white-space:nowrap;}
.p2-sub{font-size:12.5px;font-weight:700;color:#7A5E6B;margin-top:2px;
  text-shadow:0 1px 5px rgba(255,255,255,.95);white-space:nowrap;}
.p2-next{font-size:11px;color:#9C8893;margin-top:2px;
  text-shadow:0 1px 5px rgba(255,255,255,.95);white-space:nowrap;}
.p2-go{font-size:20px;color:#C89AAA;font-weight:700;flex:none;
  text-shadow:0 1px 5px rgba(255,255,255,.95);}
.prd2-empty{flex-direction:column;align-items:flex-start;gap:0;}
.prd2-empty .p2-drop{margin-bottom:9px;}
.p2-t{font-size:14px;font-weight:800;color:#6A5560;text-shadow:0 1px 5px rgba(255,255,255,.9);}
.p2-s{font-size:11px;color:#9A8B94;margin-top:2px;text-shadow:0 1px 5px rgba(255,255,255,.9);}

/* ================= 经期记录页 ================= */
.pp{padding:12px 14px 28px;}
.pp-status{background:linear-gradient(135deg,#FFE3EE,#FFD0E0);color:#7A3D55;
  border-radius:18px;padding:15px 17px;font-size:14px;font-weight:700;
  box-shadow:0 8px 22px rgba(240,85,127,.16);line-height:1.5;}
.pp-status b{font-size:20px;color:#E3497C;font-weight:800;margin:0 2px;}
.pp-status.on{background:linear-gradient(135deg,#FF7FAF,#F0557F);color:#fff;}
.pp-status.on b{color:#fff;}
.pp-status.empty{background:#F5F1F4;color:#8C7B86;font-weight:600;font-size:13px;
  box-shadow:none;}
.pp-preds{margin-top:12px;background:#fff;border-radius:18px;overflow:hidden;
  box-shadow:0 4px 16px rgba(120,90,110,.08);}
.ppp{display:flex;align-items:center;gap:10px;padding:13px 16px;}
.ppp+.ppp{border-top:1px solid #F5EEF2;}
.ppp-k{font-size:12px;font-weight:800;color:#fff;background:linear-gradient(135deg,#F58CB5,#E95C90);
  border-radius:9px;padding:3px 10px;flex:none;}
.ppp:nth-child(3) .ppp-k,.ppp:nth-child(4) .ppp-k{background:linear-gradient(135deg,#E5B6CB,#D49AB2);}
.ppp-d{font-size:14.5px;font-weight:800;color:#4A3B44;}
.ppp-r{margin-left:auto;font-size:11.5px;color:#A796A0;font-weight:600;}
.pp-cal{margin-top:14px;background:#fff;border-radius:20px;padding:14px 12px 12px;
  box-shadow:0 4px 16px rgba(120,90,110,.08);}
.ppc-nav{display:flex;align-items:center;justify-content:space-between;padding:0 6px 10px;}
.ppc-nav b{font-size:15px;color:#4A3B44;}
.ppc-nav-btn{width:32px;height:32px;border-radius:50%;background:#F8F2F5;
  color:#D46A93;font-size:19px;font-weight:800;line-height:1;}
.ppc-week{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;margin-bottom:6px;}
.ppc-week b{font-size:11px;color:#B7A6AF;font-weight:700;padding:6px 0;}
.ppc-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;}
.pblank{aspect-ratio:1;}
.pday{position:relative;aspect-ratio:1;display:flex;align-items:center;justify-content:center;
  font-size:13.5px;color:#57484F;border-radius:50%;font-weight:600;cursor:pointer;
  transition:transform .12s;}
.pday:active{transform:scale(.92);}
/* 实际经期 */
.pday.m{background:#F58CB5;color:#fff;font-weight:800;border-radius:50%;}
.pday.s,.pday.e{background:#F0557F;color:#fff;font-weight:800;
  box-shadow:0 3px 10px rgba(240,85,127,.38);}
.pday.s.one{background:linear-gradient(135deg,#F58CB5,#E3497C);}
/* 预测经期 */
.pday.pm{background:#FCE7F0;color:#C76B92;}
.pday.ps{border:2px solid #F0A2C2;color:#D46A93;font-weight:800;}
.pday.pm.far,.pday.ps.far{opacity:.55;}
.pday.today::after{content:'';position:absolute;bottom:5px;left:50%;transform:translateX(-50%);
  width:4px;height:4px;border-radius:50%;background:#8E7CF0;}
.pday.m.today::after,.pday.s.today::after,.pday.e.today::after{background:#fff;}
.ppc-legend{display:flex;align-items:center;gap:6px;justify-content:center;flex-wrap:wrap;
  padding-top:10px;font-size:10.5px;color:#A796A0;font-weight:600;}
.ppc-legend i{width:11px;height:11px;border-radius:50%;margin-left:10px;}
.ppc-legend i:first-child{margin-left:0;}
.lg-real{background:#F0557F;}
.lg-pred{background:#FCE7F0;border:2px solid #F0A2C2;box-sizing:border-box;}
.lg-today{background:#8E7CF0;}
.pp-cfg{margin-top:12px;background:#fff;border-radius:18px;overflow:hidden;
  box-shadow:0 4px 16px rgba(120,90,110,.08);}
.pp-cfg-row{display:flex;align-items:center;gap:10px;padding:15px 16px;cursor:pointer;}
.pp-cfg-row+.pp-cfg-row{border-top:1px solid #F5EEF2;}
.pp-cfg-row span{font-size:14px;color:#57484F;font-weight:600;}
.pp-cfg-row b{margin-left:auto;font-size:14px;color:#D46A93;font-weight:800;}
.pp-cfg-row i{font-style:normal;color:#CDBBC3;font-size:18px;font-weight:700;}
.pp-tip{margin-top:12px;text-align:center;font-size:11.5px;color:#B3A2AB;line-height:1.6;padding:0 10px;}

/* 数字步进 */
.stepper{display:flex;align-items:center;gap:0;background:var(--field);border-radius:12px;overflow:hidden;}
.stepper button{width:34px;height:32px;font-size:17px;color:var(--mist-deep);font-weight:700;}
.stepper span{min-width:44px;text-align:center;font-size:14px;font-weight:700;}

.pad-side{padding:0 4px;}
.mt8{margin-top:8px}.mt12{margin-top:12px}.mt16{margin-top:16px}.mb8{margin-bottom:8px}
.tc{text-align:center}.muted{color:var(--muted);font-size:12px;}
.tag{display:inline-block;font-size:10.5px;background:var(--mist-soft);color:var(--mist-deep);border-radius:8px;padding:2px 9px;font-weight:600;}

/* ================= 查手机 spyphone ================= */
.sp-page{width:100%;}

/* 头像通用 */
.sp-ava{
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;background-color:var(--mist);background-size:cover;background-position:center;
  border:2.5px solid #fff;box-shadow:0 2px 10px rgba(22,25,30,.08);
  color:#fff;font-weight:600;flex:none;overflow:hidden;
}
.sp-ava-fb{background:var(--mist);}

/* ---- 角色选择页 ---- */
.sp-pick-hero{
  margin-top:10px;background:#fff;border:1px solid var(--line);border-radius:20px;
  box-shadow:var(--shadow-soft);padding:22px 20px;
}
.sp-ph-ico{
  width:46px;height:46px;border-radius:14px;background:var(--mist-soft);color:var(--mist-deep);
  display:flex;align-items:center;justify-content:center;
}
.sp-ph-ico .ico-svg{width:24px;height:24px;}
.sp-ph-t{font-size:19px;font-weight:700;color:var(--ink);margin:13px 0 6px;letter-spacing:.5px;}
.sp-ph-s{font-size:13px;color:var(--ink-3);line-height:1.7;font-weight:400;}
.sp-rail{
  display:flex;gap:15px;overflow-x:auto;padding:4px 4px 12px 2px;
}
.sp-rail-item{display:flex;flex-direction:column;align-items:center;gap:6px;width:74px;flex:none;background:none;}
.sp-rail-item .sp-ava{transition:transform .15s;}
.sp-rail-item:active .sp-ava{transform:scale(.92);}
.sp-r-name{
  font-size:12.5px;font-weight:600;color:var(--ink);max-width:74px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.sp-r-state{font-size:10px;color:var(--ink-3);letter-spacing:.3px;}
.sp-pick-note{text-align:center;font-size:11px;color:var(--ink-3);margin:20px 0 4px;letter-spacing:.4px;}

/* ---- 角色手机首页 ---- */
.sp-home{
  margin:0 -16px -20px;min-height:calc(100% + 20px);
  background:linear-gradient(180deg,#F7F9FC 0%,#EDF1F6 100%);
  padding:18px 22px 40px;display:flex;flex-direction:column;
}
.sp-h-head{
  display:flex;align-items:center;gap:13px;
  background:rgba(255,255,255,.78);backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.9);border-radius:18px;
  padding:13px 16px;box-shadow:var(--shadow-soft);
}
.sp-h-head .sp-ava{box-shadow:none;}
.sp-h-name{font-size:15.5px;font-weight:700;color:var(--ink);}
.sp-h-sub{font-size:11px;color:var(--ink-3);margin-top:2px;}
.sp-grid{
  margin-top:28px;display:grid;grid-template-columns:repeat(3,1fr);
  gap:28px 10px;justify-items:center;
}
.sp-app{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;background:none;}
.sp-a-ico{
  position:relative;width:62px;height:62px;border-radius:19px;background:#fff;
  box-shadow:var(--shadow-soft);border:1px solid rgba(255,255,255,.9);
  display:flex;align-items:center;justify-content:center;color:var(--mist-deep);
  transition:transform .15s;
}
.sp-a-ico .ico-svg{width:29px;height:29px;}
.sp-app:active .sp-a-ico{transform:scale(.9);}
.sp-a-name{font-size:12px;font-weight:600;color:var(--ink);letter-spacing:.3px;}
.sp-a-cnt{
  position:absolute;top:-5px;right:-5px;min-width:17px;height:17px;padding:0 5px;
  border-radius:9px;background:var(--mist-deep);color:#fff;
  font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;
}
.sp-h-tip{margin-top:auto;padding-top:30px;text-align:center;font-size:10.5px;color:var(--ink-3);letter-spacing:.5px;}

/* ---- 加载 / 错误 ---- */
.sp-loading{display:flex;flex-direction:column;align-items:center;padding:72px 24px;text-align:center;}
.sp-spinner{
  width:34px;height:34px;border-radius:50%;
  border:2.5px solid var(--mist-soft);border-top-color:var(--mist-deep);
  animation:spSpin .8s linear infinite;
}
@keyframes spSpin{to{transform:rotate(360deg);}}
.sp-l-t{font-size:14.5px;font-weight:600;color:var(--ink);margin-top:16px;}
.sp-l-s{font-size:12px;color:var(--ink-3);margin-top:6px;line-height:1.6;}
.sp-err{display:flex;flex-direction:column;align-items:center;padding:58px 26px;text-align:center;}
.sp-e-ico{
  width:48px;height:48px;border-radius:15px;background:var(--mist-soft);color:var(--mist-deep);
  display:flex;align-items:center;justify-content:center;
}
.sp-e-ico .ico-svg{width:24px;height:24px;}
.sp-e-t{font-size:15px;font-weight:700;color:var(--ink);margin:15px 0 5px;}
.sp-e-s{font-size:12.5px;color:var(--ink-3);line-height:1.7;}

/* ---- 详情页头部 ---- */
.sp-dh{display:flex;align-items:center;gap:7px;margin:2px 2px 15px;color:var(--ink-3);}
.sp-dh .sp-ava{border:none;box-shadow:none;}
.sp-dh-name{font-size:12.5px;font-weight:600;color:var(--ink-2);}
.sp-dh-sep{font-size:11px;}
.sp-dh-app{font-size:12px;}
.sp-blank{
  background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-soft);
  padding:40px 22px;text-align:center;font-size:13px;color:var(--ink-3);
}

/* ---- 日记 ---- */
.sp-diary{display:flex;flex-direction:column;gap:13px;}
.sp-card{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-soft);}
.sp-d-card{padding:18px 18px 16px;}
.sp-d-meta{display:flex;align-items:center;gap:10px;margin-bottom:11px;}
.sp-d-date{font-size:14px;font-weight:700;color:var(--ink);}
.sp-d-weather{
  font-size:10.5px;font-weight:600;color:var(--mist-deep);
  background:var(--mist-soft);border-radius:8px;padding:2px 9px;
}
.sp-d-body{font-size:14px;line-height:1.95;color:var(--ink-2);font-weight:400;word-break:break-word;}
.sp-d-sign{margin-top:13px;text-align:right;font-size:12px;color:var(--ink-3);}

/* ---- 备忘录 ---- */
.sp-memos{display:flex;flex-direction:column;gap:11px;}
.sp-m-card{padding:15px 16px;}
.sp-m-title{font-size:14.5px;font-weight:700;color:var(--ink);margin-bottom:4px;}
.sp-m-body{font-size:13.5px;line-height:1.75;color:var(--ink-2);word-break:break-word;}
.sp-m-date{font-size:11px;color:var(--ink-3);margin-top:8px;}

/* ---- 相册 ---- */
.sp-album{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
.sp-p-card{overflow:hidden;border-radius:18px;}
.sp-p-photo{
  position:relative;min-height:118px;padding:26px 12px 11px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;text-align:center;
}
.sp-p-cat{
  position:absolute;top:9px;left:9px;
  background:rgba(255,255,255,.75);color:var(--ink-2);
  font-size:9.5px;font-weight:600;border-radius:8px;padding:2px 8px;
}
.sp-p-ico{color:rgba(123,146,171,.55);}
.sp-p-ico .ico-svg{width:21px;height:21px;}
.sp-p-desc{font-size:11px;line-height:1.55;color:var(--ink-2);font-weight:500;}
.sp-p-foot{padding:10px 11px 11px;}
.sp-p-cap{font-size:12.5px;font-weight:600;color:var(--ink);line-height:1.5;margin-bottom:3px;}
.sp-p-meta{font-size:10px;color:var(--ink-3);}

/* ---- 收藏 ---- */
.sp-f-row{display:flex;align-items:center;gap:12px;padding:13px 14px;border-bottom:1px solid var(--line);}
.sp-f-row.last{border-bottom:none;}
.sp-f-ico{
  width:36px;height:36px;border-radius:12px;background:var(--mist-soft);color:var(--mist-deep);
  display:flex;align-items:center;justify-content:center;flex:none;
}
.sp-f-ico .ico-svg{width:18px;height:18px;}
.sp-f-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.sp-f-content{
  font-size:13.5px;font-weight:600;color:var(--ink);line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.sp-f-sub{
  font-size:11px;color:var(--ink-3);max-width:100%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.sp-f-tag{
  flex:none;font-size:10px;font-weight:600;color:var(--mist-deep);
  background:var(--mist-soft);border-radius:8px;padding:2px 8px;
}

/* ---- 浏览记录 ---- */
.sp-h-title{margin:0 2px 8px;letter-spacing:.8px;}
.sp-his-card{padding:0 2px;}
.sp-h-row{display:flex;align-items:center;gap:12px;padding:14px 14px;border-bottom:1px solid var(--line);}
.sp-h-row.last{border-bottom:none;}
.sp-h-no{width:19px;font-size:11px;font-weight:700;color:var(--ink-3);font-variant-numeric:tabular-nums;flex:none;}
.sp-h-q{flex:1;font-size:14px;font-weight:500;color:var(--ink-2);line-height:1.5;word-break:break-word;}
.sp-h-ico{color:var(--mist);flex:none;}
.sp-h-ico .ico-svg{width:17px;height:17px;}
.sp-h-note{text-align:center;font-size:10.5px;color:var(--ink-3);margin:12px 0 2px;line-height:1.6;padding:0 16px;}

/* ---- 购买记录 ---- */
.sp-o-row{display:flex;align-items:center;gap:13px;padding:13px 15px;border-bottom:1px solid var(--line);}
.sp-o-row.last{border-bottom:none;}
.sp-o-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.sp-o-item{font-size:14px;font-weight:700;color:var(--ink);line-height:1.45;}
.sp-o-note{
  font-size:11.5px;color:var(--ink-3);max-width:100%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.sp-o-time{font-size:10.5px;color:var(--ink-3);}
.sp-o-price{flex:none;font-size:15px;font-weight:700;color:var(--mist-deep);font-variant-numeric:tabular-nums;}

/* ================= 钱包 wallet ================= */
.wallet-page .app-body{background:linear-gradient(180deg,#F7F9FC 0%,#F3F6FA 100%);}
.wl-hero{
  margin:12px 4px 0;border-radius:22px;padding:22px 22px 18px;color:#fff;
  background:linear-gradient(135deg,#9FB0C3 0%,#7B92AB 100%);
  box-shadow:0 6px 20px rgba(123,146,171,.32);
}
.wl-hlabel{font-size:12px;font-weight:500;letter-spacing:1.5px;opacity:.82;}
.wl-hamt{font-size:38px;font-weight:700;letter-spacing:.5px;margin-top:6px;font-variant-numeric:tabular-nums;}
.wl-hamt small{font-size:20px;font-weight:600;margin-right:3px;opacity:.85;}
.wl-hsum{display:flex;align-items:center;gap:14px;margin-top:14px;font-size:12px;opacity:.95;}
.wl-hsum span{display:inline-flex;align-items:baseline;gap:6px;}
.wl-hsum b{font-size:14.5px;font-weight:700;font-variant-numeric:tabular-nums;}
.wl-hsum i{font-style:normal;opacity:.8;}
.wl-dot{width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,.7);}
.wl-tip{margin:13px 4px 4px;font-size:11.5px;color:var(--ink-3);line-height:1.6;}
.wl-group{margin-top:14px;}
.wl-gtitle{font-size:11.5px;font-weight:700;color:var(--ink-3);letter-spacing:.8px;margin:0 6px 7px;}
.wl-card{padding:2px 15px;}
.wl-bill{display:flex;align-items:center;gap:12px;padding:13px 0;}
.wl-bill+.wl-bill{border-top:1px solid var(--line);}
.wb-ico{
  flex:none;width:38px;height:38px;border-radius:13px;background:var(--mist-soft);color:var(--mist-deep);
  display:flex;align-items:center;justify-content:center;
}
.wb-ico .ico-svg{width:19px;height:19px;}
.wb-main{flex:1;min-width:0;}
.wb-t{font-size:13.5px;font-weight:600;color:var(--ink);line-height:1.45;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.wb-sub{font-size:11px;color:var(--ink-3);margin-top:2px;line-height:1.4;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.wb-right{flex:none;text-align:right;}
.wb-amt{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.3;}
.wb-amt.in{color:#4A5A6E;}
.wb-amt.out{color:#B08089;}
.wb-time{font-size:10.5px;color:var(--ink-3);margin-top:2px;}
.wl-empty{padding:58px 20px 40px;text-align:center;color:var(--ink-3);}
.wl-empty .ico-svg{width:40px;height:40px;color:#C5CDD8;}
.wle-t{font-size:14.5px;font-weight:600;color:var(--ink-2);margin-top:13px;}
.wle-sub{font-size:12px;line-height:1.7;margin-top:5px;}

/* 外卖卡实付金额 */
.tk-amt{margin-top:9px;font-size:12.5px;font-weight:600;color:var(--ink-2);text-align:right;}

/* ================= 商城 shop（电商风：商品 / 购物车 / 我的） ================= */
.shop-page .app-body{background:#F5F7FA;}
.sh-body{padding-bottom:calc(66px + env(safe-area-inset-bottom));}
.sh-fixed{position:fixed;left:0;right:0;bottom:0;width:100%;max-width:430px;margin:0 auto;z-index:45;}

/* 顶栏余额 */
.sh-bal{font-size:12.5px;font-weight:700;color:var(--mist-deep);font-variant-numeric:tabular-nums;
  cursor:pointer;background:var(--mist-soft);padding:5px 11px;border-radius:11px;}

/* 搜索条 */
.sh-search{display:flex;align-items:center;gap:8px;margin-top:12px;background:#fff;border:1px solid var(--line);
  border-radius:16px;padding:9px 13px;color:var(--ink-3);box-shadow:var(--shadow-soft);}
.sh-search .ico-svg{width:16px;height:16px;flex:none;}
.sh-search input{border:none;outline:none;background:transparent;flex:1;min-width:0;
  font-size:13px;color:var(--ink);}

/* 分类 */
.sh-cats{display:flex;gap:8px;overflow-x:auto;padding:13px 2px 5px;scrollbar-width:none;}
.sh-cats::-webkit-scrollbar{display:none;}
.sh-cat{flex:none;padding:7px 15px;border-radius:15px;font-size:12.5px;font-weight:600;
  background:#fff;color:var(--ink-2);border:1px solid var(--line);}
.sh-cat.on{background:var(--mist-deep);color:#fff;border-color:var(--mist-deep);}

/* 商品网格 */
.sh-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:10px;}
.sh-card{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;
  box-shadow:var(--shadow-soft);display:flex;flex-direction:column;}
.sh-img{height:108px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,#F4F7FB,#EAF0F7);color:#8C9DB3;}
.sh-img .li{width:44px;height:44px;}
.sh-name{font-size:13px;font-weight:600;color:var(--ink);line-height:1.45;padding:9px 11px 2px;
  min-height:47px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.sh-foot{display:flex;align-items:center;justify-content:space-between;padding:6px 11px 11px;}
.sh-price{font-size:16px;font-weight:800;color:#B08089;font-variant-numeric:tabular-nums;}
.sh-price small{font-size:11px;font-weight:700;margin-right:1px;}
.sh-add{width:27px;height:27px;border-radius:50%;border:none;flex:none;
  background:linear-gradient(135deg,#9FB0C3,#7B92AB);color:#fff;font-size:17px;font-weight:700;line-height:1;
  box-shadow:0 3px 8px rgba(123,146,171,.35);cursor:pointer;}
.sh-add:active{transform:scale(.92);}
.sh-nores{grid-column:1/-1;text-align:center;color:var(--ink-3);font-size:13px;padding:50px 0;}

/* 敬请期待 */
.sh-soon{margin-top:18px;background:#fff;border:1px dashed #C9D4E0;border-radius:20px;
  padding:46px 24px;text-align:center;color:var(--ink-3);box-shadow:var(--shadow-soft);}
.sh-soon .ico-svg{width:40px;height:40px;color:#A9B8C8;}
.ss-t{font-size:15px;font-weight:700;color:var(--ink-2);margin-top:12px;}
.ss-s{font-size:12px;line-height:1.7;margin-top:6px;}

/* 底部板块栏 */
.sh-tabbar{display:flex;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);
  border-top:1px solid var(--line);padding:5px 0 calc(5px + env(safe-area-inset-bottom));}
.sh-tab{flex:1;border:none;background:none;display:flex;flex-direction:column;align-items:center;gap:2px;
  color:#A6ADB8;font-size:10.5px;font-weight:600;position:relative;cursor:pointer;}
.sh-tab .sht-ico{position:relative;display:flex;}
.sh-tab .sht-ico .ico-svg{width:23px;height:23px;}
.sh-tab.on{color:var(--mist-deep);}
.sh-badge{position:absolute;top:-5px;right:-14px;min-width:15px;height:15px;padding:0 4px;border-radius:8px;
  background:#B08089;color:#fff;font-size:9.5px;font-style:normal;display:flex;align-items:center;
  justify-content:center;font-weight:700;}

/* 购物车 */
.sh-panel-cart{padding-bottom:calc(134px + env(safe-area-inset-bottom));}
.sc-list{display:flex;flex-direction:column;gap:10px;margin-top:12px;}
.sc-row{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);
  border-radius:17px;padding:11px;box-shadow:var(--shadow-soft);}
.sc-check{width:21px;height:21px;border-radius:50%;border:1.6px solid #C5CDD7;background:#fff;flex:none;
  display:flex;align-items:center;justify-content:center;color:#fff;padding:0;cursor:pointer;}
.sc-check.on{background:var(--mist-deep);border-color:var(--mist-deep);}
.sc-check .ico-svg{width:13px;height:13px;}
.sc-img{width:58px;height:58px;border-radius:14px;flex:none;
  background:linear-gradient(160deg,#F4F7FB,#EAF0F7);color:#8C9DB3;
  display:flex;align-items:center;justify-content:center;}
.sc-img .li{width:30px;height:30px;}
.sc-main{flex:1;min-width:0;}
.sc-name{font-size:13.5px;font-weight:600;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sc-sub{margin-top:3px;}
.sc-sub .sh-price{font-size:14px;}
.sc-stepper{display:inline-flex;align-items:center;margin-top:7px;background:#F3F6F9;border-radius:11px;}
.sc-stepper button{width:27px;height:25px;border:none;background:none;color:var(--mist-deep);
  font-size:15px;font-weight:700;cursor:pointer;}
.sc-stepper span{min-width:26px;text-align:center;font-size:13px;font-weight:700;color:var(--ink);
  font-variant-numeric:tabular-nums;}
.sc-del{border:none;background:none;color:#B9C2CD;flex:none;padding:4px;cursor:pointer;}
.sc-del .ico-svg{width:18px;height:18px;}
.sc-bar{position:fixed;left:0;right:0;bottom:calc(56px + env(safe-area-inset-bottom));
  width:100%;max-width:430px;margin:0 auto;z-index:46;
  display:flex;align-items:center;gap:12px;padding:10px 15px;
  background:rgba(255,255,255,.97);backdrop-filter:blur(10px);border-top:1px solid var(--line);}
.sc-all{display:flex;align-items:center;gap:6px;border:none;background:none;font-size:12.5px;
  font-weight:600;color:var(--ink-2);cursor:pointer;}
.sc-total{flex:1;text-align:right;}
.sct-label{font-size:12px;color:var(--ink-2);margin-right:4px;}
.sct-amt{font-size:19px;font-weight:800;color:#B08089;font-variant-numeric:tabular-nums;}
.sct-amt small{font-size:12px;}
.sc-pay{border:none;border-radius:19px;padding:10px 22px;font-size:13.5px;font-weight:700;color:#fff;
  background:linear-gradient(135deg,#9FB0C3,#7B92AB);box-shadow:0 4px 10px rgba(123,146,171,.32);cursor:pointer;}
.sc-pay:active{opacity:.85;}

/* 我的 */
.sm-tip{margin-top:12px;font-size:12px;color:var(--ink-2);line-height:1.6;
  background:#fff;border:1px solid var(--line);border-radius:15px;padding:11px 14px;
  box-shadow:var(--shadow-soft);}
.sm-group{margin-top:16px;}
.sm-gtitle{font-size:13px;font-weight:700;color:var(--ink);margin:0 2px 9px;}
.sm-gtitle i{font-style:normal;font-weight:600;color:var(--ink-3);font-size:11.5px;margin-left:3px;}
.sm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.sm-item{background:#fff;border:1px solid var(--line);border-radius:16px;padding:11px 8px 10px;
  display:flex;flex-direction:column;align-items:center;text-align:center;box-shadow:var(--shadow-soft);}
.sm-img{width:52px;height:52px;border-radius:15px;
  background:linear-gradient(160deg,#F4F7FB,#EAF0F7);color:#8C9DB3;
  display:flex;align-items:center;justify-content:center;}
.sm-img .li{width:27px;height:27px;}
.sm-name{font-size:11.5px;font-weight:600;color:var(--ink);margin-top:7px;line-height:1.35;min-height:30px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.sm-send{margin-top:7px;border:none;border-radius:10px;padding:5px 0;width:100%;
  background:var(--mist-soft);color:var(--mist-deep);font-size:11px;font-weight:700;cursor:pointer;}
.sm-send:active{opacity:.8;}

/* 空态 */
.sh-empty{text-align:center;padding:66px 30px;color:var(--ink-3);}
.sh-empty .ico-svg{width:46px;height:46px;color:#B3BFCC;}
.se-t{font-size:15px;font-weight:700;color:var(--ink-2);margin-top:14px;}
.se-s{font-size:12px;line-height:1.7;margin-top:6px;}
.sh-go{margin-top:18px;border:none;border-radius:19px;padding:10px 30px;
  background:linear-gradient(135deg,#9FB0C3,#7B92AB);color:#fff;font-size:13.5px;font-weight:700;
  box-shadow:0 4px 10px rgba(123,146,171,.3);cursor:pointer;}

/* 下单确认 */
.sh-order{text-align:left;}
.so-list{max-height:200px;overflow-y:auto;margin:-4px 0 4px;}
.so-row{display:flex;justify-content:space-between;gap:12px;padding:8px 2px;
  border-bottom:1px dashed #EDF0F4;font-size:13px;}
.so-n{color:var(--ink);min-width:0;}
.so-n i{font-style:normal;color:var(--ink-3);margin-left:3px;}
.so-p{color:var(--ink-2);font-weight:600;font-variant-numeric:tabular-nums;flex:none;}
.so-sum{display:flex;justify-content:space-between;align-items:baseline;padding:12px 2px 4px;
  font-size:13px;color:var(--ink-2);}
.so-sum b{font-size:21px;color:#B08089;font-weight:800;font-variant-numeric:tabular-nums;}
.so-bal{font-size:11.5px;color:var(--ink-3);text-align:right;}

/* 送礼：角色选择 */
.sheet-opts{display:flex;flex-direction:column;gap:4px;padding-bottom:calc(10px + env(safe-area-inset-bottom));}
.sheet-opt{display:flex;align-items:center;gap:12px;padding:9px 6px;border-radius:13px;cursor:pointer;}
.sheet-opt:active{background:#F3F6F9;}
.sop-ava{width:42px;height:42px;border-radius:50%;flex:none;background-size:cover;background-position:center;
  background-color:#DCE4ED;}
.sop-fb{display:flex;align-items:center;justify-content:center;color:#fff;font-size:17px;font-weight:700;
  background:linear-gradient(135deg,#9FB0C3,#7B92AB);}
.so-label{flex:1;font-size:14.5px;font-weight:600;color:var(--ink);}
.chev{color:#B9C2CD;}
.chev .ico-svg{width:17px;height:17px;}

/* 聊天礼物卡 */
.msg .bubble.is-gift{background:linear-gradient(150deg,#F6F9FC,#EDF2F8);}
.msg .bubble.is-gift .mn-ico{background:#E4ECF5;color:#7B92AB;}
.msg .bubble.is-gift.is-rej{background:#FAF4F5;}
.msg .bubble.is-gift.is-rej .mn-ico{background:#F2E7E9;color:#B5737F;}
.mv-ico.rej{background:#F2E7E9!important;color:#B5737F!important;}

/* ================= 小屋 App ================= */
.hm-page{padding:12px 14px 26px;}
.hm-chips{display:flex;gap:8px;overflow-x:auto;padding:2px 1px 11px;scrollbar-width:none;}
.hm-chips::-webkit-scrollbar{display:none;}
.hm-chip{flex:none;display:flex;align-items:center;gap:6px;padding:5px 13px 5px 5px;
  border-radius:999px;background:#fff;border:1px solid var(--line);
  font-size:12.5px;font-weight:600;color:var(--ink-2);box-shadow:var(--shadow-soft);cursor:pointer;}
.hm-chip.on{background:var(--mist-deep);color:#fff;border-color:var(--mist-deep);}
.hm-cf{width:24px;height:24px;border-radius:50%;overflow:hidden;flex:none;
  background:linear-gradient(135deg,#9FB0C3,#7B92AB);color:#fff;font-size:11px;font-weight:700;
  display:flex;align-items:center;justify-content:center;}
.hm-chip.on .hm-cf{background:rgba(255,255,255,.25);}
.hm-cimg{display:block;width:100%;height:100%;background-size:cover;background-position:center;}

.hm-room{position:relative;border-radius:20px;overflow:hidden;
  box-shadow:0 10px 26px rgba(40,55,75,.10);background:#E4EAF1;}
.hm-room svg{display:block;width:100%;height:auto;}
.hm-person-slot{position:absolute;inset:0;pointer-events:none;}
.hm-person{position:absolute;left:50%;top:50%;transform:translate(-50%,-46%);
  display:flex;flex-direction:column;align-items:center;cursor:pointer;pointer-events:auto;
  animation:hmBreath 3.6s ease-in-out infinite;}
@keyframes hmBreath{0%,100%{transform:translate(-50%,-46%);}50%{transform:translate(-50%,-52%);}}
.hm-face{width:54px;height:54px;border-radius:50%;border:2.5px solid #fff;
  background:linear-gradient(135deg,#9FB0C3,#7B92AB);background-size:cover;background-position:center;
  box-shadow:0 5px 14px rgba(40,55,75,.22);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:22px;font-weight:700;}
.hm-who{margin-top:6px;padding:2.5px 11px;border-radius:999px;background:rgba(255,255,255,.92);
  font-size:11px;font-weight:600;color:var(--ink-2);box-shadow:0 2px 8px rgba(40,55,75,.10);
  white-space:nowrap;}

.hm-empty{margin-top:14px;background:#fff;border:1px solid var(--line);border-radius:18px;
  padding:26px 20px;text-align:center;box-shadow:var(--shadow-soft);}
.hme-ico{width:50px;height:50px;margin:0 auto;border-radius:16px;background:var(--mist-soft);
  color:var(--mist-deep);display:flex;align-items:center;justify-content:center;}
.hme-ico .ico-svg{width:26px;height:26px;}
.hme-t{font-size:15px;font-weight:700;color:var(--ink);margin-top:11px;}
.hme-s{font-size:12px;color:var(--ink-3);line-height:1.7;margin-top:5px;}
.hm-btn{margin-top:14px;border:none;border-radius:999px;padding:9px 26px;
  background:linear-gradient(135deg,#9FB0C3,#7B92AB);color:#fff;font-size:13px;font-weight:700;
  box-shadow:0 4px 10px rgba(123,146,171,.3);cursor:pointer;}
.hm-btn:active{opacity:.85;}

.hm-card{margin-top:15px;background:#fff;border:1px solid var(--line);border-radius:18px;
  padding:15px 14px 13px;box-shadow:var(--shadow-soft);}
.hm-st{font-size:13.5px;font-weight:700;color:var(--ink);margin-bottom:11px;}
.hm-slots{display:flex;gap:10px;}
.hm-slot{flex:1;border:1.5px dashed #CAD5E1;border-radius:14px;padding:13px 6px 11px;text-align:center;
  background:#F8FAFC;}
.hm-slot .ico-svg{width:27px;height:27px;color:#A9B8C8;margin:0 auto 6px;display:block;}
.hm-slot span{display:block;font-size:12px;font-weight:600;color:var(--ink-2);}
.hm-slot b{display:block;font-size:10.5px;font-weight:600;color:var(--ink-3);margin-top:2px;}
.hm-note{margin-top:11px;font-size:11.5px;line-height:1.7;color:var(--ink-3);}

/* ================= 真机 / PWA：全屏铺满，适配安卓 iOS 安全区 ================= */
@media (max-width:480px),(display-mode:standalone),(display-mode:fullscreen){
  body{background:var(--bg);}
  .phone{width:100vw;height:100vh;height:100dvh;border-radius:0;padding:0;box-shadow:none;border:none;}
  .screen{border-radius:0;}
  .statusbar{padding-top:env(safe-area-inset-top);padding-left:max(20px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right));height:calc(48px + env(safe-area-inset-top));}
  .home-indicator{bottom:max(8px,env(safe-area-inset-bottom));}
}