*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

body{
  background:#111827;
  display:flex;
  justify-content:center;
  align-items:center;
  height:100vh;
  font-family:-apple-system,BlinkMacSystemFont,sans-serif;
}

.phone{
  width:390px;
  height:844px;


  border-radius:40px;
  overflow:hidden;

  position:relative;

  box-shadow:
  0 0 0 10px #000,
  0 20px 60px rgba(0,0,0,.4);
}

.status-bar{
  height:50px;

  display:flex;
  justify-content:space-between;
  align-items:center;

  padding:0 20px;

  color:white;

  font-size:14px;
}

.desktop{
  padding:25px;

  display:grid;

  grid-template-columns:repeat(4,1fr);

  gap:25px;
}

.app{
  text-align:center;
  color:white;
  cursor:pointer;
}

.icon{
  width:65px;
  height:65px;

  border-radius:18px;

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:30px;

  background:rgba(255,255,255,.15);

  backdrop-filter:blur(15px);

  margin:auto;
}

.name{
  margin-top:8px;
  font-size:12px;
}

.screen{
  position:absolute;
  inset:0;

  background:#f7f8fa;

  z-index:100;
}

.hidden{
  display:none;
}

.app-header{
  height:60px;

  display:flex;
  align-items:center;

  gap:15px;

  padding:0 15px;

  background:white;

  border-bottom:1px solid #eee;
}

.app-header button{
  border:none;
  background:none;

  font-size:24px;
}

.app-content{
  padding:15px;
}

.contact{
    background:white;
    padding:16px;
    border-radius:16px;
    margin-bottom:10px;

    display:flex;
    align-items:center;
    gap:12px;

    font-size:18px;
}

.add-btn{
    width:100%;
    border:none;
    padding:14px;
    border-radius:16px;
    background:#111827;
    color:white;
    font-size:16px;
    margin-bottom:15px;
}

.form{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.form input,
.form textarea{
    border:none;
    padding:14px;
    border-radius:14px;
    font-size:15px;
    outline:none;
}

.form textarea{
    min-height:120px;
    resize:none;
}

.form button{
    border:none;
    padding:14px;
    border-radius:14px;
    background:#111827;
    color:white;
    font-size:16px;
}

.contact{
    background:white;
    padding:14px;
    border-radius:16px;
    margin-bottom:10px;

    display:flex;
    align-items:center;
    gap:12px;
}

.contact-avatar{
    width:44px;
    height:44px;
    border-radius:14px;
    background:#f1f5f9;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:24px;
}

.contact-name{
    font-size:16px;
    font-weight:700;
    color:#111827;
}

.contact-sub{
    margin-top:4px;
    font-size:12px;
    color:#6b7280;
}

.empty{
    color:#6b7280;
    font-size:14px;
    padding:10px;
}

.chat-box{
    height:520px;
    overflow-y:auto;

    padding:15px;
    padding-bottom:100px;

    border-radius:16px;
}

.msg{
    max-width:75%;
    padding:10px 12px;
    border-radius:16px;
    margin-bottom:10px;
    line-height:1.5;
    font-size:14px;
}

.user-msg{
    margin-left:auto;
    background:#111827;
    color:white;
}

.ai-msg{
    margin-right:auto;
    background:white;
    color:#111827;
}

.chat-input{
    position:absolute;
    left:0;
    right:0;
    bottom:0;

    display:flex;
    gap:8px;

    padding:10px;
    background:white;
    border-top:1px solid #eee;
}

.chat-input input{
    flex:1;
    border:none;
    background:#f1f5f9;
    border-radius:14px;
    padding:12px;
    outline:none;
}

.chat-input button{
    border:none;
    background:#111827;
    color:white;
    border-radius:14px;
    padding:0 16px;
}
.mini-btn{
    margin-left:auto;
    border:none;
    background:#111827;
    color:#ffffff;
    border-radius:10px;
    padding:6px 12px;
    font-size:12px;
    min-width:48px;
    height:30px;
    display:flex;
    align-items:center;
    justify-content:center;
}
#appTitle{
    flex:1;
    display:flex;
    align-items:center;
    justify-content:space-between;
}
.memory-entry{
    width:100%;
    border:none;
    background:#e5e7eb;
    color:#111827;
    border-radius:14px;
    padding:10px;
    margin-bottom:10px;
    font-size:14px;
}
.form select{
    border:none;
    padding:14px;
    border-radius:14px;
    font-size:15px;
    outline:none;
    background:white;
}
.avatar-img{
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:14px;
}
.chat-row{
    display:flex;
    align-items:flex-start;
    margin-bottom:10px;
}

.ai-row{
    justify-content:flex-start;
}

.user-row{
    justify-content:flex-end;
}

.chat-avatar{
    width:36px;
    height:36px;
    border-radius:12px;
    overflow:hidden;
    background:#f1f5f9;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-right:8px;
    flex-shrink:0;
}

.chat-row .msg{
    margin-bottom:0;
}
#chatBox{
    background-size:cover !important;
    background-position:center !important;
    background-repeat:no-repeat !important;
    background-color:#f7f8fa;
}
.file-label{
    font-size:13px;
    color:#6b7280;
    margin-top:4px;
}
.danger-btn{
    background:#dc2626 !important;
    color:white !important;
}
.app-content{
    height:calc(100% - 60px);
    overflow-y:auto;
    padding-bottom:40px;
}

.form{
    padding-bottom:60px;
}
.form button:last-child{
    background:#dc2626;
    color:white;
}
.unread-badge{
    min-width:20px;
    height:20px;

    padding:0 6px;

    border-radius:999px;

    background:#ff3b30;

    color:white;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:12px;
    font-weight:bold;
}
.avatar-preview{
    width:72px;
    height:72px;
    border-radius:50%;
    background:#eef0f4;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    margin:0 auto 12px;
    font-size:32px;
}

.avatar-preview img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.typing-msg{
    opacity:0.72;
    font-size:13px;
}
.msg-wrap{
    display:flex;
    flex-direction:column;
    max-width:72%;
}

.user-wrap{
    align-items:flex-end;
}

.ai-wrap{
    align-items:flex-start;
}

.msg-wrap .msg{
    max-width:100%;
}

.msg-time{
    margin-top:3px;
    padding:0 4px;
    font-size:10px;
    line-height:1;
    opacity:0.5;
}

.user-wrap .msg-time{
    text-align:right;
}

.ai-wrap .msg-time{
    text-align:left;
}
.contact{
    box-sizing:border-box;
    padding-right:14px;
}

.contact-info{
    flex:1;
    min-width:0;
}

.chat-list-top{
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    align-items:center;
    column-gap:8px;
}

.chat-list-time{
    font-size:11px;
    opacity:0.45;
    white-space:nowrap;
    flex-shrink:0;
    padding-right:2px;
}

.chat-list-bottom{
    margin-top:4px;
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    align-items:center;
    column-gap:8px;
}

.chat-list-bottom .contact-sub{
    min-width:0;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

.chat-list-bottom .unread-badge{
    flex:none;
}

.chat-list-bottom .contact-sub{
    flex:1;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

.chat-list-bottom .unread-badge{
    flex:none;
}
.contact-name{
    min-width:0;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}
.app{
    position:relative;
}

.desktop-unread-badge{
    position:absolute;
    top:-4px;
    right:4px;

    min-width:18px;
    height:18px;
    padding:0 5px;

    border-radius:999px;
    background:#ff3b30;
    color:#fff;

    font-size:11px;
    font-weight:700;
    line-height:18px;
    text-align:center;

    box-shadow:0 2px 6px rgba(0,0,0,.25);
}
.group-member-list{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.group-member-row{
    display:flex;
    align-items:center;
    gap:10px;

    padding:10px 12px;
    border-radius:14px;

    background:rgba(255,255,255,.65);
}

.group-member-row input{
    width:18px;
    height:18px;
}

.small-avatar{
    width:34px;
    height:34px;
    font-size:18px;
}
.group-sender-name{
    margin:0 0 3px 4px;
    font-size:11px;
    color:#6b7280;
}
.group-top-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    margin-bottom:8px;
}

.group-search-bar{
    display:flex;
    gap:8px;
    margin-bottom:10px;
}

.group-search-bar input{
    flex:1;
    border:none;
    background:white;
    border-radius:14px;
    padding:12px;
    outline:none;
}

.group-search-bar button{
    border:none;
    background:#111827;
    color:white;
    border-radius:14px;
    padding:0 14px;
}

.group-sender-name{
    margin:0 0 3px 4px;
    font-size:11px;
    color:#6b7280;
}

.group-msg-image{
    max-width:180px;
    max-height:180px;
    border-radius:12px;
    object-fit:cover;
    display:block;
}

.group-section-title{
    margin-top:10px;
    font-size:13px;
    color:#6b7280;
}

.group-setting-member{
    display:flex;
    gap:10px;
    align-items:flex-start;
    padding:10px;
    background:rgba(255,255,255,.7);
    border-radius:14px;
}

.group-setting-main{
    flex:1;
    display:flex;
    flex-direction:column;
    gap:8px;
}

.group-setting-main input{
    width:100%;
    border:none;
    border-radius:12px;
    background:white;
    padding:10px;
    outline:none;
}
.moments-page{
    padding-bottom:70px;
}

.moments-cover{
    height:190px;
    margin:-15px -15px 14px;
    background:linear-gradient(135deg,#111827,#374151);
    background-size:cover;
    background-position:center;
    position:relative;
}

.moments-cover-btn{
    position:absolute;
    top:12px;
    right:12px;
    padding:7px 10px;
    border-radius:999px;
    background:rgba(0,0,0,.35);
    color:#fff;
    font-size:12px;
    cursor:pointer;
}

.moments-cover-btn input{
    display:none;
}

.moments-my-info{
    position:absolute;
    right:16px;
    bottom:-24px;
    display:flex;
    align-items:center;
    gap:10px;
}

.moments-my-name{
    color:white;
    font-size:17px;
    font-weight:700;
    text-shadow:0 1px 4px rgba(0,0,0,.55);
}

.moments-my-avatar{
    width:58px;
    height:58px;
    border-radius:14px;
    overflow:hidden;
    background:#f1f5f9;
    border:3px solid white;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
}

.moments-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin:38px 0 12px;
}

.moments-actions button,
.moment-small-btn,
.moment-action-links button{
    border:none;
    background:#111827;
    color:white;
    border-radius:12px;
    padding:9px 10px;
    font-size:13px;
}

.moment-card{
    display:flex;
    gap:10px;
    padding:14px 0;
    border-bottom:1px solid rgba(0,0,0,.06);
}

.moment-avatar{
    width:42px;
    height:42px;
    border-radius:12px;
    overflow:hidden;
    background:#f1f5f9;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}

.moment-body{
    flex:1;
    min-width:0;
}

.moment-name{
    font-size:15px;
    font-weight:700;
    color:#1f2937;
    margin-bottom:5px;
}

.moment-content{
    font-size:14px;
    color:#111827;
    line-height:1.5;
    white-space:pre-wrap;
}

.moment-translation{
    margin-top:6px;
    color:#6b7280;
    font-size:13px;
    line-height:1.45;
    white-space:pre-wrap;
}

.moment-image{
    margin-top:8px;
    width:160px;
    max-height:220px;
    border-radius:10px;
    object-fit:cover;
    display:block;
}

.moment-image-prompt{
    margin-top:8px;
    padding:10px;
    background:#f3f4f6;
    border-radius:10px;
    color:#4b5563;
    font-size:13px;
    line-height:1.4;
}

.moment-time-row{
    margin-top:8px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    color:#9ca3af;
    font-size:12px;
}

.moment-action-links{
    display:flex;
    gap:5px;
    flex-wrap:wrap;
    justify-content:flex-end;
}

.moment-action-links button{
    padding:5px 7px;
    font-size:11px;
    background:#eef2ff;
    color:#374151;
}

.moment-small-btn{
    margin-top:6px;
    padding:5px 8px;
    font-size:11px;
    background:#eef2ff;
    color:#374151;
}

.moment-interactions{
    margin-top:8px;
    padding:8px 10px;
    border-radius:10px;
    background:#f3f4f6;
    font-size:13px;
    color:#374151;
}

.moment-likes{
    margin-bottom:5px;
}

.moment-comment{
    line-height:1.5;
    margin-top:3px;
}

.moment-comment span{
    color:#1f2937;
    font-weight:700;
}

.moment-comment em{
    color:#6b7280;
    font-style:normal;
}

.moment-comment-trans{
    color:#6b7280;
    font-size:12px;
    padding-left:4px;
}

.moment-editor textarea{
    min-height:180px;
}

/* ===== 交换日记模块 ===== */
.diary-home{
    min-height:100%;
    background:#f0ebe3;
    margin:-15px;
    padding-bottom:30px;
    font-family:Georgia, "Times New Roman", "Songti SC", serif;
}

.diary-subtitle{
    text-align:center;
    color:#9a8a78;
    font-size:12px;
    letter-spacing:3px;
    padding:18px 0 8px;
    text-transform:uppercase;
}

.diary-books-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
    padding:16px;
}

.diary-book-card{
    background:#fff;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 2px 12px rgba(0,0,0,.08);
    cursor:pointer;
    position:relative;
}

.diary-book-card:active{
    transform:scale(.97);
}

.diary-book-spine{
    width:8px;
    height:100%;
    position:absolute;
    left:0;
    top:0;
    background:#c4a882;
}

.diary-book-cover{
    padding:20px 16px 16px 20px;
    min-height:160px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    background:linear-gradient(135deg,#fdf8f0 0%,#f5ede0 100%);
}

.diary-book-icon{
    font-size:48px;
    margin-bottom:10px;
}

.diary-book-avatar{
    width:54px;
    height:54px;
    border-radius:16px;
    overflow:hidden;
    background:#eadfcd;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    margin-bottom:10px;
}

.diary-book-name{
    font-size:14px;
    color:#4a3f32;
    text-align:center;
    letter-spacing:1px;
}

.diary-book-label{
    font-size:11px;
    color:#9a8a78;
    text-align:center;
    margin-top:4px;
}

.diary-book-footer{
    padding:10px 16px;
    background:#f5ede0;
    border-top:1px solid #e8ddd0;
    font-size:11px;
    color:#9a8a78;
    text-align:center;
}

.diary-empty-card{
    grid-column:1 / -1;
    text-align:center;
    color:#9a8a78;
    padding:50px 20px;
    line-height:2;
}

.diary-page{
    min-height:100%;
    background:#f0ebe3;
    margin:-15px;
    padding:15px 15px 80px;
}

.diary-card{
    background:#fff;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 2px 12px rgba(0,0,0,.07);
    cursor:pointer;
    margin-bottom:16px;
}

.diary-card:active{
    transform:scale(.98);
}

.diary-card-header{
    background:linear-gradient(135deg,#fdf8f0,#f5ede0);
    padding:16px 20px 12px;
    border-bottom:1px solid #ede3d5;
}

.diary-card-date{
    font-size:16px;
    color:#4a3f32;
    letter-spacing:1px;
}

.diary-card-meta{
    font-size:11px;
    color:#9a8a78;
    margin-top:4px;
}

.diary-card-preview{
    padding:14px 20px;
    font-size:14px;
    color:#6a5a4a;
    line-height:1.8;
}

.diary-empty-state{
    text-align:center;
    padding:80px 20px;
    color:#9a8a78;
}

.diary-empty-icon{
    font-size:48px;
    margin-bottom:16px;
}

.diary-empty-text{
    font-size:14px;
    line-height:2;
}

.diary-write-page textarea{
    min-height:260px;
    line-height:1.8;
}

.diary-detail-page{
    min-height:100%;
    background:#f5ede0;
    margin:-15px;
    padding:20px 16px 80px;
}

.diary-parchment{
    background:#fdf8f0;
    border-radius:8px;
    padding:28px 24px;
    box-shadow:0 4px 20px rgba(0,0,0,.1), inset 0 0 60px rgba(200,180,140,.15);
    position:relative;
    line-height:2;
    margin-bottom:16px;
}

.diary-parchment::before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:8px;
    background:repeating-linear-gradient(transparent, transparent 31px, #e8ddd0 31px, #e8ddd0 32px);
    pointer-events:none;
}

.diary-detail-date{
    font-size:15px;
    color:#4a3f32;
    text-align:center;
    margin-bottom:6px;
    position:relative;
    z-index:1;
    letter-spacing:2px;
}

.diary-detail-meta{
    font-size:12px;
    color:#9a8a78;
    text-align:center;
    margin-bottom:20px;
    position:relative;
    z-index:1;
}

.diary-detail-divider{
    border:none;
    border-top:1px solid #d4c9b8;
    margin:16px 0;
    position:relative;
    z-index:1;
}

.diary-detail-content{
    font-size:15px;
    color:#4a3f32;
    line-height:2.2;
    white-space:pre-wrap;
    position:relative;
    z-index:1;
}

.diary-toast{
    position:fixed;
    bottom:40px;
    left:50%;
    transform:translateX(-50%);
    background:rgba(74,63,50,.86);
    color:white;
    padding:10px 20px;
    border-radius:20px;
    font-size:13px;
    opacity:0;
    transition:opacity .25s;
    pointer-events:none;
    white-space:nowrap;
    z-index:9999;
}

.diary-toast.show{
    opacity:1;
}
/* ===== 世界书增强样式 ===== */
.wb-form .wb-label{
    font-size:12px;
    color:#6b7280;
    margin-top:4px;
    margin-bottom:-6px;
}

.wb-form textarea{
    min-height:160px;
}

.wb-admin-warning{
    padding:10px 12px;
    border-radius:14px;
    background:rgba(239,68,68,.1);
    color:#991b1b;
    font-size:12px;
    line-height:1.6;
}

.wb-mode-card{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    padding:14px;
    margin-bottom:10px;
    border-radius:18px;
    background:rgba(255,255,255,.78);
    box-shadow:0 8px 22px rgba(15,23,42,.06);
}

.wb-mode-card button{
    width:42px;
    height:42px;
    border:none;
    border-radius:50%;
    background:#111827;
    color:white;
    font-size:22px;
}

.wb-admin-mode{
    background:rgba(254,226,226,.9);
}

.wb-mode-title{
    font-size:15px;
    font-weight:700;
    color:#111827;
}

.wb-mode-sub{
    margin-top:4px;
    font-size:12px;
    color:#6b7280;
}

.wb-card{
    align-items:flex-start;
}

.wb-badge-row{
    display:flex;
    flex-wrap:wrap;
    gap:5px;
    margin:6px 0;
}

.wb-badge{
    display:inline-flex;
    align-items:center;
    max-width:100%;
    padding:3px 7px;
    border-radius:999px;
    font-size:10px;
    line-height:1.3;
    color:#374151;
    background:#f3f4f6;
}

.wb-badge-high{
    color:#991b1b;
    background:#fee2e2;
}

.wb-badge-medium{
    color:#92400e;
    background:#fef3c7;
}

.wb-badge-keyword{
    color:#1e40af;
    background:#dbeafe;
}

.wb-badge-target{
    color:#065f46;
    background:#d1fae5;
}

.wb-badge-key{
    color:#4b5563;
    background:#f3f4f6;
}

.wb-preview{
    white-space:normal;
    line-height:1.5;
}
/* ===== M叽桌面重做：音乐组件 / 时钟天气 / 日历 / 分页图标 / Dock ===== */

.desktop-phone{
    position:relative;
    overflow:hidden;
    background:#000;
}

.desktop-bg{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    z-index:0;
}

.desktop-bg::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(to bottom, rgba(0,0,0,.18), rgba(0,0,0,.1) 45%, rgba(0,0,0,.42));
}

.desktop-main{
    position:relative;
    z-index:1;
    height:100%;
    padding:14px 18px 30px;
    display:flex;
    flex-direction:column;
    color:#fff;
}

.music-widget{
    height:80px;
    border-radius:18px;
    background:rgba(255,255,255,.16);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    display:flex;
    align-items:center;
    padding:0 14px;
    gap:12px;
    box-shadow:0 8px 28px rgba(0,0,0,.16);
    border:1px solid rgba(255,255,255,.16);
    flex-shrink:0;
}

.music-cover{
    width:56px;
    height:56px;
    border-radius:50%;
    background:#222;
    background-size:cover;
    background-position:center;
    box-shadow:0 0 0 4px #444, 0 0 0 6px #222;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    flex-shrink:0;
    position:relative;
}

.music-cover::after{
    content:"";
    position:absolute;
    width:14px;
    height:14px;
    border-radius:50%;
    background:#111;
    box-shadow:0 0 0 2px #333;
}

.music-info{
    min-width:0;
    flex:1;
}

.music-title{
    font-size:14px;
    font-weight:700;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.music-artist{
    margin-top:3px;
    font-size:11px;
    color:rgba(255,255,255,.66);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.music-progress{
    height:3px;
    margin-top:9px;
    border-radius:99px;
    background:rgba(0,0,0,.32);
    overflow:hidden;
}

.music-progress div{
    height:100%;
    width:0%;
    background:#ef4444;
    border-radius:99px;
}

.music-actions{
    display:flex;
    align-items:center;
    gap:4px;
}

.music-actions button{
    width:34px;
    height:34px;
    border:none;
    background:transparent;
    color:white;
    font-size:19px;
}

.desktop-time-row{
    display:flex;
    align-items:center;
    margin-top:12px;
    margin-bottom:14px;
    gap:14px;
    flex-shrink:0;
}

.desktop-time{
    font-size:72px;
    line-height:.95;
    letter-spacing:-4px;
    text-shadow:0 2px 8px rgba(0,0,0,.45);
}

.desktop-weather{
    font-size:18px;
    text-shadow:0 2px 6px rgba(0,0,0,.45);
    padding:8px 0;
    white-space:nowrap;
}

.calendar-card{
    border-radius:18px;
    background:rgba(255,255,255,.18);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    padding:14px 14px 12px;
    box-shadow:0 8px 28px rgba(0,0,0,.16);
    border:1px solid rgba(255,255,255,.16);
    flex-shrink:0;
}

.calendar-title{
    font-size:16px;
    font-weight:800;
    margin:0 0 12px 4px;
}

.calendar-week-head,
.calendar-days{
    display:grid;
    grid-template-columns:repeat(7, 1fr);
    text-align:center;
    align-items:center;
}

.calendar-week-head span{
    font-size:11px;
    color:rgba(255,255,255,.68);
}

.calendar-days{
    margin-top:7px;
}

.calendar-days span{
    justify-self:center;
    width:31px;
    height:31px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    border-radius:50%;
    color:rgba(255,255,255,.88);
}

.calendar-days span.today{
    color:#111827;
    background:#fff;
    font-weight:800;
}

/* ===== M叽桌面重做：音乐组件 / 时钟天气 / 日历 / 分页图标 / Dock ===== */

.desktop-phone{
    position:relative;
    overflow:hidden;
    background:#000;
}

.desktop-bg{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    z-index:0;
}

.desktop-bg::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(to bottom, rgba(0,0,0,.18), rgba(0,0,0,.1) 45%, rgba(0,0,0,.42));
}

.desktop-main{
    position:relative;
    z-index:1;
    height:100%;
    padding:14px 18px 30px;
    display:flex;
    flex-direction:column;
    color:#fff;
}

.music-widget{
    height:80px;
    border-radius:18px;
    background:rgba(255,255,255,.16);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    display:flex;
    align-items:center;
    padding:0 14px;
    gap:12px;
    box-shadow:0 8px 28px rgba(0,0,0,.16);
    border:1px solid rgba(255,255,255,.16);
    flex-shrink:0;
}

.music-cover{
    width:56px;
    height:56px;
    border-radius:50%;
    background:#222;
    background-size:cover;
    background-position:center;
    box-shadow:0 0 0 4px #444, 0 0 0 6px #222;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    flex-shrink:0;
    position:relative;
}

.music-cover::after{
    content:"";
    position:absolute;
    width:14px;
    height:14px;
    border-radius:50%;
    background:#111;
    box-shadow:0 0 0 2px #333;
}

.music-info{
    min-width:0;
    flex:1;
}

.music-title{
    font-size:14px;
    font-weight:700;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.music-artist{
    margin-top:3px;
    font-size:11px;
    color:rgba(255,255,255,.66);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.music-progress{
    height:3px;
    margin-top:9px;
    border-radius:99px;
    background:rgba(0,0,0,.32);
    overflow:hidden;
}

.music-progress div{
    height:100%;
    width:0%;
    background:#ef4444;
    border-radius:99px;
}

.music-actions{
    display:flex;
    align-items:center;
    gap:4px;
}

.music-actions button{
    width:34px;
    height:34px;
    border:none;
    background:transparent;
    color:white;
    font-size:19px;
}

.desktop-time-row{
    display:flex;
    align-items:center;
    margin-top:12px;
    margin-bottom:14px;
    gap:14px;
    flex-shrink:0;
}

.desktop-time{
    font-size:72px;
    line-height:.95;
    letter-spacing:-4px;
    text-shadow:0 2px 8px rgba(0,0,0,.45);
}

.desktop-weather{
    font-size:18px;
    text-shadow:0 2px 6px rgba(0,0,0,.45);
    padding:8px 0;
    white-space:nowrap;
}

.calendar-card{
    border-radius:18px;
    background:rgba(255,255,255,.18);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    padding:14px 14px 12px;
    box-shadow:0 8px 28px rgba(0,0,0,.16);
    border:1px solid rgba(255,255,255,.16);
    flex-shrink:0;
}

.calendar-title{
    font-size:16px;
    font-weight:800;
    margin:0 0 12px 4px;
}

.calendar-week-head,
.calendar-days{
    display:grid;
    grid-template-columns:repeat(7, 1fr);
    text-align:center;
    align-items:center;
}

.calendar-week-head span{
    font-size:11px;
    color:rgba(255,255,255,.68);
}

.calendar-days{
    margin-top:7px;
}

.calendar-days span{
    justify-self:center;
    width:31px;
    height:31px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    border-radius:50%;
    color:rgba(255,255,255,.88);
}

.calendar-days span.today{
    color:#111827;
    background:#fff;
    font-weight:800;
}

.desktop-pager{
    flex:1;
    min-height:210px;
    overflow:hidden;
    margin-top:14px;
}

.desktop-pages{
    width:200%;
    height:100%;
    display:flex;
    transition:transform .28s ease;
}

.desktop-page{
    width:50%;
    height:100%;
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    align-content:start;
    gap:20px 0;
    padding-top:2px;
}

.desktop-app{
    min-width:0;
    border:none;
    background:transparent;
    color:#fff;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    gap:6px;
    font:inherit;
    text-shadow:0 2px 5px rgba(0,0,0,.5);
}

.desktop-app span,
.desktop-dock button span{
    width:60px;
    height:60px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:18px;
    background:rgba(255,255,255,.82);
    color:#111;
    font-size:28px;
    box-shadow:0 8px 18px rgba(0,0,0,.2);
}

.desktop-app em,
.desktop-dock button em{
    font-style:normal;
    font-size:13px;
    line-height:1.2;
    max-width:76px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.desktop-dots{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:12px;
    height:18px;
    flex-shrink:0;
}

.desktop-dots button{
    width:8px;
    height:8px;
    border-radius:50%;
    border:none;
    background:rgba(255,255,255,.42);
    padding:0;
}

.desktop-dots button.active{
    background:white;
}

.desktop-dock{
    height:96px;
    display:flex;
    align-items:flex-start;
    justify-content:center;
    gap:38px;
    flex-shrink:0;
    padding-top:8px;
}

.desktop-dock button{
    position:relative;
    border:none;
    background:transparent;
    color:#fff;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
    font:inherit;
    text-shadow:0 2px 5px rgba(0,0,0,.5);
}

.desktop-unread-badge{
    position:absolute;
    top:-5px;
    right:-7px;
    min-width:18px;
    height:18px;
    padding:0 5px;
    border-radius:99px;
    background:#ef4444;
    color:#fff;
    font-size:11px;
    line-height:18px;
    text-align:center;
    box-shadow:0 2px 8px rgba(0,0,0,.3);
    z-index:3;
}

.desktop-placeholder{
    min-height:60vh;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:#374151;
    padding:28px;
}

.desktop-placeholder-icon{
    width:72px;
    height:72px;
    border-radius:24px;
    background:#111827;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    margin-bottom:14px;
}

.desktop-placeholder h3{
    font-size:20px;
    margin:0 0 8px;
}

.desktop-placeholder p{
    font-size:14px;
    color:#6b7280;
    line-height:1.7;
}


/* ===== Chat 合并壳：消息 / 联系人 / 朋友圈 / 我 ===== */
.wechat-shell{
    height:100%;
    min-height:0;
    display:flex;
    flex-direction:column;
    background:var(--wechat-bg, #f5f6f7);
    color:var(--wechat-text, #111827);
}
.wechat-view{
    flex:1;
    min-height:0;
    overflow-y:auto;
    padding:14px 14px 76px;
}
.wechat-bottom-nav{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:62px;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    background:var(--wechat-tab-bg, rgba(255,255,255,.92));
    border-top:1px solid rgba(0,0,0,.08);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    z-index:20;
}
.wechat-bottom-nav button{
    border:none;
    background:transparent;
    color:var(--wechat-tab-color, #6b7280);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:2px;
    font:inherit;
}
.wechat-bottom-nav button span{font-size:21px;line-height:1}
.wechat-bottom-nav button em{font-style:normal;font-size:11px}
.wechat-bottom-nav button.active{color:var(--wechat-tab-active, #07c160);font-weight:700}
.wechat-page-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:14px;
}
.wechat-title{font-size:24px;font-weight:800;letter-spacing:-.5px}
.wechat-subtitle{font-size:12px;color:#8b949e;margin-top:2px}
.wechat-head-btn{
    border:none;
    border-radius:999px;
    background:#111827;
    color:#fff;
    padding:8px 13px;
    font-size:13px;
}
.profile-card{
    display:flex;
    align-items:center;
    gap:13px;
    background:#fff;
    border-radius:18px;
    padding:16px;
    box-shadow:0 8px 22px rgba(15,23,42,.06);
    margin-bottom:14px;
}
.profile-avatar{width:58px;height:58px;border-radius:18px;overflow:hidden;background:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:30px}
.profile-avatar img{width:100%;height:100%;object-fit:cover}
.profile-name{font-size:18px;font-weight:800}
.profile-sub{font-size:12px;color:#8b949e;margin-top:3px}
.settings-card{
    background:#fff;
    border-radius:18px;
    padding:15px;
    margin-bottom:14px;
    box-shadow:0 8px 22px rgba(15,23,42,.06);
}
.settings-title{font-size:16px;font-weight:800;margin-bottom:8px}
.settings-desc{font-size:12px;color:#6b7280;line-height:1.6;margin:0 0 10px}
.settings-page{padding:14px}
.settings-page input,
.settings-page select,
.settings-card input,
.settings-card select,
.settings-card textarea{
    width:100%;
    margin:7px 0;
}
.code-textarea{
    min-height:170px;
    font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size:12px;
    line-height:1.45;
    border:1px solid #e5e7eb;
    border-radius:12px;
    padding:10px;
    background:#f9fafb;
}
.danger-btn{background:#ef4444!important;color:#fff!important}
.chat-detail-tools{display:flex;gap:8px;flex-wrap:wrap;padding:8px 8px 0}
.themed-chat-box{
    background:var(--chat-bg, #f0f0f0);
    background-image:var(--chat-bg-image, none);
    color:var(--chat-text, #111);
}
.themed-chat-input{
    background:var(--input-area-bg, rgba(255,255,255,.92));
    border-top:1px solid var(--input-area-border, rgba(0,0,0,.08));
}
.msg.ai-msg{
    background:var(--bubble-them-bg, #ffffff);
    color:var(--bubble-them-color, #111111);
    border:var(--bubble-them-border, none);
    border-radius:var(--bubble-them-radius, 4px 18px 18px 18px);
    box-shadow:var(--bubble-them-shadow, 0 1px 4px rgba(0,0,0,.08));
}
.msg.user-msg{
    background:var(--bubble-me-bg, #07C160);
    color:var(--bubble-me-color, #ffffff);
    border:var(--bubble-me-border, none);
    border-radius:var(--bubble-me-radius, 18px 4px 18px 18px);
    box-shadow:var(--bubble-me-shadow, 0 1px 4px rgba(0,0,0,.08));
}
.thought-avatar{cursor:pointer;transition:transform .15s ease}
.thought-avatar:active{transform:scale(.92)}
.thought-hint{font-size:10px;color:#9ca3af;margin-top:3px;padding-left:2px}
#pwaThoughtsOverlay{
    position:fixed;
    inset:0;
    z-index:9999;
    display:none;
    align-items:center;
    justify-content:center;
    padding:22px;
}
#pwaThoughtsOverlay.visible{display:flex}
.pwa-thoughts-mask{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.42);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
}
#pwaThoughtsInner{
    position:relative;
    z-index:1;
    width:min(420px, 92vw);
    max-height:78vh;
    overflow:auto;
}
.default-thought-card{
    background:rgba(17,24,39,.96);
    color:#f9fafb;
    border-radius:24px;
    box-shadow:0 20px 60px rgba(0,0,0,.45);
    overflow:hidden;
    border:1px solid rgba(255,255,255,.08);
}
.thought-card-head{
    display:flex;
    align-items:center;
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(255,255,255,.08);
}
.thought-card-avatar{width:42px;height:42px;border-radius:50%;overflow:hidden;background:#374151;display:flex;align-items:center;justify-content:center}
.thought-card-avatar img{width:100%;height:100%;object-fit:cover}
.thought-card-label{font-size:10px;color:rgba(255,255,255,.45);letter-spacing:1px}
.thought-card-name{font-size:14px;font-weight:800;margin-top:2px}
.thought-card-head button{
    margin-left:auto;
    width:30px;
    height:30px;
    border:none;
    border-radius:50%;
    background:rgba(255,255,255,.08);
    color:#fff;
}
.thought-card-head button + button{margin-left:4px}
.thought-card-body{
    padding:17px 16px 20px;
    font-size:15px;
    line-height:1.8;
    white-space:pre-wrap;
    word-break:break-word;
}
/* ===== M叽桌面重做：音乐组件 / 时钟天气 / 日历 / 分页图标 / Dock ===== */

.desktop-phone{
    position:relative;
    overflow:hidden;
    background:#000;
}

.desktop-bg{
    position:absolute;
    inset:0;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    z-index:0;
}

.desktop-bg::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(to bottom, rgba(0,0,0,.18), rgba(0,0,0,.1) 45%, rgba(0,0,0,.42));
}

.desktop-main{
    position:relative;
    z-index:1;
    height:100%;
    padding:14px 18px 30px;
    display:flex;
    flex-direction:column;
    color:#fff;
}

.music-widget{
    height:80px;
    border-radius:18px;
    background:rgba(255,255,255,.16);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    display:flex;
    align-items:center;
    padding:0 14px;
    gap:12px;
    box-shadow:0 8px 28px rgba(0,0,0,.16);
    border:1px solid rgba(255,255,255,.16);
    flex-shrink:0;
}

.music-cover{
    width:56px;
    height:56px;
    border-radius:50%;
    background:#222;
    background-size:cover;
    background-position:center;
    box-shadow:0 0 0 4px #444, 0 0 0 6px #222;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    flex-shrink:0;
    position:relative;
}

.music-cover::after{
    content:"";
    position:absolute;
    width:14px;
    height:14px;
    border-radius:50%;
    background:#111;
    box-shadow:0 0 0 2px #333;
}

.music-info{
    min-width:0;
    flex:1;
}

.music-title{
    font-size:14px;
    font-weight:700;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.music-artist{
    margin-top:3px;
    font-size:11px;
    color:rgba(255,255,255,.66);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.music-progress{
    height:3px;
    margin-top:9px;
    border-radius:99px;
    background:rgba(0,0,0,.32);
    overflow:hidden;
}

.music-progress div{
    height:100%;
    width:0%;
    background:#ef4444;
    border-radius:99px;
}

.music-actions{
    display:flex;
    align-items:center;
    gap:4px;
}

.music-actions button{
    width:34px;
    height:34px;
    border:none;
    background:transparent;
    color:white;
    font-size:19px;
}

.desktop-time-row{
    display:flex;
    align-items:center;
    margin-top:12px;
    margin-bottom:14px;
    gap:14px;
    flex-shrink:0;
}

.desktop-time{
    font-size:72px;
    line-height:.95;
    letter-spacing:-4px;
    text-shadow:0 2px 8px rgba(0,0,0,.45);
}

.desktop-weather{
    font-size:18px;
    text-shadow:0 2px 6px rgba(0,0,0,.45);
    padding:8px 0;
    white-space:nowrap;
}

.calendar-card{
    border-radius:18px;
    background:rgba(255,255,255,.18);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    padding:14px 14px 12px;
    box-shadow:0 8px 28px rgba(0,0,0,.16);
    border:1px solid rgba(255,255,255,.16);
    flex-shrink:0;
}

.calendar-title{
    font-size:16px;
    font-weight:800;
    margin:0 0 12px 4px;
}

.calendar-week-head,
.calendar-days{
    display:grid;
    grid-template-columns:repeat(7, 1fr);
    text-align:center;
    align-items:center;
}

.calendar-week-head span{
    font-size:11px;
    color:rgba(255,255,255,.68);
}

.calendar-days{
    margin-top:7px;
}

.calendar-days span{
    justify-self:center;
    width:31px;
    height:31px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    border-radius:50%;
    color:rgba(255,255,255,.88);
}

.calendar-days span.today{
    color:#111827;
    background:#fff;
    font-weight:800;
}

.desktop-pager{
    flex:1;
    min-height:210px;
    overflow:hidden;
    margin-top:14px;
}

.desktop-pages{
    width:200%;
    height:100%;
    display:flex;
    transition:transform .28s ease;
}

.desktop-page{
    width:50%;
    height:100%;
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    align-content:start;
    gap:20px 0;
    padding-top:2px;
}

.desktop-app{
    min-width:0;
    border:none;
    background:transparent;
    color:#fff;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    gap:6px;
    font:inherit;
    text-shadow:0 2px 5px rgba(0,0,0,.5);
}

.desktop-app span,
.desktop-dock button span{
    width:60px;
    height:60px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:18px;
    background:rgba(255,255,255,.82);
    color:#111;
    font-size:28px;
    box-shadow:0 8px 18px rgba(0,0,0,.2);
}

.desktop-app em,
.desktop-dock button em{
    font-style:normal;
    font-size:13px;
    line-height:1.2;
    max-width:76px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.desktop-dots{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:12px;
    height:18px;
    flex-shrink:0;
}

.desktop-dots button{
    width:8px;
    height:8px;
    border-radius:50%;
    border:none;
    background:rgba(255,255,255,.42);
    padding:0;
}

.desktop-dots button.active{
    background:white;
}

.desktop-dock{
    height:96px;
    display:flex;
    align-items:flex-start;
    justify-content:center;
    gap:38px;
    flex-shrink:0;
    padding-top:8px;
}

.desktop-dock button{
    position:relative;
    border:none;
    background:transparent;
    color:#fff;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
    font:inherit;
    text-shadow:0 2px 5px rgba(0,0,0,.5);
}

.desktop-unread-badge{
    position:absolute;
    top:-5px;
    right:-7px;
    min-width:18px;
    height:18px;
    padding:0 5px;
    border-radius:99px;
    background:#ef4444;
    color:#fff;
    font-size:11px;
    line-height:18px;
    text-align:center;
    box-shadow:0 2px 8px rgba(0,0,0,.3);
    z-index:3;
}

.desktop-placeholder{
    min-height:60vh;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:#374151;
    padding:28px;
}

.desktop-placeholder-icon{
    width:72px;
    height:72px;
    border-radius:24px;
    background:#111827;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    margin-bottom:14px;
}

.desktop-placeholder h3{
    font-size:20px;
    margin:0 0 8px;
}

.desktop-placeholder p{
    font-size:14px;
    color:#6b7280;
    line-height:1.7;
}


/* ===== Chat 合并壳：消息 / 联系人 / 朋友圈 / 我 ===== */
.wechat-shell{
    height:100%;
    min-height:0;
    display:flex;
    flex-direction:column;
    background:var(--wechat-bg, #f5f6f7);
    color:var(--wechat-text, #111827);
}
.wechat-view{
    flex:1;
    min-height:0;
    overflow-y:auto;
    padding:14px 14px 76px;
}
.wechat-bottom-nav{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:62px;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    background:var(--wechat-tab-bg, rgba(255,255,255,.92));
    border-top:1px solid rgba(0,0,0,.08);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    z-index:20;
}
.wechat-bottom-nav button{
    border:none;
    background:transparent;
    color:var(--wechat-tab-color, #6b7280);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:2px;
    font:inherit;
}
.wechat-bottom-nav button span{font-size:21px;line-height:1}
.wechat-bottom-nav button em{font-style:normal;font-size:11px}
.wechat-bottom-nav button.active{color:var(--wechat-tab-active, #07c160);font-weight:700}
.wechat-page-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:14px;
}
.wechat-title{font-size:24px;font-weight:800;letter-spacing:-.5px}
.wechat-subtitle{font-size:12px;color:#8b949e;margin-top:2px}
.wechat-head-btn{
    border:none;
    border-radius:999px;
    background:#111827;
    color:#fff;
    padding:8px 13px;
    font-size:13px;
}
.profile-card{
    display:flex;
    align-items:center;
    gap:13px;
    background:#fff;
    border-radius:18px;
    padding:16px;
    box-shadow:0 8px 22px rgba(15,23,42,.06);
    margin-bottom:14px;
}
.profile-avatar{width:58px;height:58px;border-radius:18px;overflow:hidden;background:#f3f4f6;display:flex;align-items:center;justify-content:center;font-size:30px}
.profile-avatar img{width:100%;height:100%;object-fit:cover}
.profile-name{font-size:18px;font-weight:800}
.profile-sub{font-size:12px;color:#8b949e;margin-top:3px}
.settings-card{
    background:#fff;
    border-radius:18px;
    padding:15px;
    margin-bottom:14px;
    box-shadow:0 8px 22px rgba(15,23,42,.06);
}
.settings-title{font-size:16px;font-weight:800;margin-bottom:8px}
.settings-desc{font-size:12px;color:#6b7280;line-height:1.6;margin:0 0 10px}
.settings-page{padding:14px}
.settings-page input,
.settings-page select,
.settings-card input,
.settings-card select,
.settings-card textarea{
    width:100%;
    margin:7px 0;
}
.code-textarea{
    min-height:170px;
    font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size:12px;
    line-height:1.45;
    border:1px solid #e5e7eb;
    border-radius:12px;
    padding:10px;
    background:#f9fafb;
}
.danger-btn{background:#ef4444!important;color:#fff!important}
.chat-detail-tools{display:flex;gap:8px;flex-wrap:wrap;padding:8px 8px 0}
.themed-chat-box{
    background:var(--chat-bg, #f0f0f0);
    background-image:var(--chat-bg-image, none);
    color:var(--chat-text, #111);
}
.themed-chat-input{
    background:var(--input-area-bg, rgba(255,255,255,.92));
    border-top:1px solid var(--input-area-border, rgba(0,0,0,.08));
}
.msg.ai-msg{
    background:var(--bubble-them-bg, #ffffff);
    color:var(--bubble-them-color, #111111);
    border:var(--bubble-them-border, none);
    border-radius:var(--bubble-them-radius, 4px 18px 18px 18px);
    box-shadow:var(--bubble-them-shadow, 0 1px 4px rgba(0,0,0,.08));
}
.msg.user-msg{
    background:var(--bubble-me-bg, #07C160);
    color:var(--bubble-me-color, #ffffff);
    border:var(--bubble-me-border, none);
    border-radius:var(--bubble-me-radius, 18px 4px 18px 18px);
    box-shadow:var(--bubble-me-shadow, 0 1px 4px rgba(0,0,0,.08));
}
.thought-avatar{cursor:pointer;transition:transform .15s ease}
.thought-avatar:active{transform:scale(.92)}
.thought-hint{font-size:10px;color:#9ca3af;margin-top:3px;padding-left:2px}
#pwaThoughtsOverlay{
    position:fixed;
    inset:0;
    z-index:9999;
    display:none;
    align-items:center;
    justify-content:center;
    padding:22px;
}
#pwaThoughtsOverlay.visible{display:flex}
.pwa-thoughts-mask{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.42);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
}
#pwaThoughtsInner{
    position:relative;
    z-index:1;
    width:min(420px, 92vw);
    max-height:78vh;
    overflow:auto;
}
.default-thought-card{
    background:rgba(17,24,39,.96);
    color:#f9fafb;
    border-radius:24px;
    box-shadow:0 20px 60px rgba(0,0,0,.45);
    overflow:hidden;
    border:1px solid rgba(255,255,255,.08);
}
.thought-card-head{
    display:flex;
    align-items:center;
    gap:10px;
    padding:14px;
    border-bottom:1px solid rgba(255,255,255,.08);
}
.thought-card-avatar{width:42px;height:42px;border-radius:50%;overflow:hidden;background:#374151;display:flex;align-items:center;justify-content:center}
.thought-card-avatar img{width:100%;height:100%;object-fit:cover}
.thought-card-label{font-size:10px;color:rgba(255,255,255,.45);letter-spacing:1px}
.thought-card-name{font-size:14px;font-weight:800;margin-top:2px}
.thought-card-head button{
    margin-left:auto;
    width:30px;
    height:30px;
    border:none;
    border-radius:50%;
    background:rgba(255,255,255,.08);
    color:#fff;
}
.thought-card-head button + button{margin-left:4px}
.thought-card-body{
    padding:17px 16px 20px;
    font-size:15px;
    line-height:1.8;
    white-space:pre-wrap;
    word-break:break-word;
}
/* ============================================================
   M叽 PWA 记忆库样式
============================================================ */
.memory-vault-page,
.memory-detail-page {
  padding: 12px 12px 90px;
}
.memory-head {
  margin-bottom: 10px;
}
.memory-contact-row {
  background: rgba(255,255,255,.82);
  border-radius: 18px;
  margin-bottom: 10px;
  border: 1px solid rgba(0,0,0,.04);
  box-shadow: 0 6px 18px rgba(0,0,0,.05);
}
.memory-detail-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 14px;
  border-radius: 20px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
  margin-bottom: 12px;
}
.memory-title {
  font-size: 18px;
  font-weight: 800;
  color: #111827;
}
.memory-subtitle {
  font-size: 12px;
  color: #8a8a8a;
  margin-top: 3px;
}
.memory-tabs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 0 12px;
  -webkit-overflow-scrolling: touch;
}
.memory-tabs::-webkit-scrollbar { display:none; }
.memory-tabs button {
  border: none;
  white-space: nowrap;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  color: #777;
  font-size: 13px;
}
.memory-tabs button.active {
  background: #111827;
  color: #fff;
  box-shadow: 0 6px 14px rgba(17,24,39,.22);
}
.memory-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.memory-entry-card {
  background: rgba(255,255,255,.88);
  border-radius: 18px;
  padding: 13px 14px;
  box-shadow: 0 8px 22px rgba(0,0,0,.055);
  border: 1px solid rgba(0,0,0,.04);
}
.memory-entry-card:active {
  transform: scale(.985);
}
.memory-entry-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #999;
  font-size: 11px;
  margin-bottom: 7px;
}
.memory-entry-text {
  font-size: 14px;
  line-height: 1.65;
  color: #222;
  white-space: pre-wrap;
  word-break: break-word;
}
.memory-empty {
  margin: 40px 16px;
  text-align: center;
  color: #999;
  line-height: 1.9;
  font-size: 14px;
}
#memoryModal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
}
#memoryModal.visible { display: block; }
.memory-modal-mask {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.38);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.memory-modal-box {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(88vw, 420px);
  max-height: 78vh;
  overflow-y: auto;
  background: #fff;
  border-radius: 22px;
  padding: 18px;
  box-shadow: 0 24px 70px rgba(0,0,0,.22);
}
.memory-modal-title {
  font-size: 17px;
  font-weight: 800;
  color: #111827;
  margin-bottom: 12px;
}
.memory-modal-body {
  color: #333;
  font-size: 14px;
  line-height: 1.7;
}
.memory-form-label {
  color: #888;
  font-size: 12px;
  margin-bottom: 8px;
}
.memory-textarea {
  width: 100%;
  min-height: 130px;
  border: none;
  outline: none;
  resize: vertical;
  border-radius: 16px;
  padding: 12px;
  background: #f5f5f5;
  color: #111;
  line-height: 1.6;
  font-family: inherit;
  font-size: 14px;
}
.memory-read-text {
  white-space: pre-wrap;
  word-break: break-word;
  background: #f7f7f7;
  border-radius: 16px;
  padding: 12px;
}
.memory-modal-footer {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 14px;
}
.memory-modal-footer button {
  border: none;
  border-radius: 999px;
  padding: 9px 14px;
  background: #111827;
  color: #fff;
  font-size: 13px;
}
.memory-modal-footer button:first-child {
  background: #f0f0f0;
  color: #333;
}
.memory-modal-footer .danger-btn {
  background: #ef4444 !important;
  color: #fff !important;
}