.chat-page{height:calc(100% - 100 * var(--rpx) - env(safe-area-inset-bottom,0px));min-height:220px;background:#fff;color:#1f1f1f;font-family:-apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif;overflow:hidden}.chat-page *{box-sizing:border-box}.chat-page [hidden]{display:none!important}.chat-page button,.chat-page input,.chat-page textarea{font:inherit}.chat-page button{cursor:pointer}.chat-page button:disabled{cursor:default;opacity:.5}.chat-page button:focus-visible,.chat-page input:focus-visible,.chat-page textarea:focus-visible{outline:var(--keyboard-outline,none);outline-offset:3px}.chat-list-screen,.chat-thread-screen{height:100%;display:flex;flex-direction:column;min-height:0}.chat-header{min-height:60px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid #f2f2f2;background:#fff}.chat-header h1{margin:0;font-size:21px;font-weight:750;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-header-note{font-size:12px;color:#888;line-height:1.5}.chat-new{padding:20px 20px 16px;background:linear-gradient(#fffdeb,#fff);flex-shrink:0}.chat-new label{font-size:13px;font-weight:600;display:block;margin-bottom:10px}.chat-new-row{display:flex;gap:8px}.chat-new input{min-width:0;flex:1;background:#fff;border:1px solid #e8e7df;border-radius:12px;padding:12px;font-size:16px;color:#222}.chat-primary{background:#ffe60f;color:#111;border:0;border-radius:12px;padding:12px 14px;font-size:13px;font-weight:600;white-space:nowrap}.chat-hint{font-size:11px;color:#8b8876;margin:10px 0 0;line-height:1.6}.chat-notice{padding:10px 18px;background:#fff6e9;color:#855321;font-size:12px;line-height:1.6;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:10px}.chat-link{border:0;background:none;padding:5px 0;color:#705813;font-size:12px;font-weight:600;white-space:nowrap}.chat-conversations{overflow:auto;flex:1;min-height:0;overscroll-behavior:contain}.chat-conversation{width:100%;display:flex;gap:12px;align-items:center;padding:18px 20px;border:0;border-bottom:1px solid #f4f4f4;background:#fff;text-align:left;color:#222}.chat-conversation:active{background:#fafafa}.chat-avatar{width:46px;height:46px;flex:0 0 46px;position:relative;display:flex;align-items:center;justify-content:center;border-radius:16px;background:#fff3a0;font-weight:700;font-size:20px;overflow:hidden}.chat-avatar img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}.chat-conversation-content{min-width:0;flex:1}.chat-conversation-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}.chat-conversation-top strong{font-size:15px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.chat-conversation time{flex-shrink:0;font-size:10px;color:#aaa}.chat-preview{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;color:#999}.chat-badge{min-width:19px;padding:3px 5px;border-radius:20px;background:#ff5454;color:white;font-size:10px;text-align:center;flex-shrink:0}.chat-empty{text-align:center;padding:65px 24px;color:#999;font-size:13px;line-height:1.8}.chat-empty-icon{margin:0 auto 20px;display:grid;place-items:center;width:66px;height:58px;border-radius:22px 22px 22px 6px;background:#fff5ac;color:#75692b;font-size:25px;font-weight:700}.chat-empty h2{font-size:17px;font-weight:600;color:#444;margin:0 0 7px}.chat-empty p{margin:0}.chat-thread-header{justify-content:flex-start;gap:12px;padding:10px 16px;min-height:64px}.chat-back{border:0;background:#f5f5f5;width:34px;height:34px;border-radius:50%;font-size:29px;line-height:26px;color:#222;flex-shrink:0}.chat-peer{min-width:0}.chat-peer h1{font-size:16px}.chat-peer .chat-header-note{display:block;font-size:11px}.chat-messages{min-height:0;flex:1;overflow:auto;background:#f5f5f5;padding:20px 16px;overscroll-behavior:contain;scrollbar-width:thin;overflow-anchor:none}.chat-earlier{display:block;margin:0 auto 22px;border:0;background:#eaeaea;color:#888;border-radius:20px;padding:8px 14px;font-size:11px}.chat-thread-empty{text-align:center;padding:45px 16px;color:#999;font-size:12px;line-height:1.8}.chat-message{display:flex;flex-direction:column;align-items:flex-start;margin-bottom:20px}.chat-message.own{align-items:flex-end}.chat-bubble{max-width:85%;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;line-height:1.65;padding:11px 14px;border-radius:4px 16px 16px 16px;background:#fff;color:#222;font-size:14px}.chat-message.own .chat-bubble{background:#ffe60f;border-radius:16px 4px 16px 16px}.chat-message .pending{opacity:.6}.chat-message-time{font-size:10px;color:#aaa;margin-top:6px}.chat-send-retry{border:0;background:none;padding:7px 0;color:#b45235;font-size:11px}.chat-composer{padding:12px 14px;background:#fff;display:flex;gap:10px;align-items:flex-end;border-top:1px solid #ececec;flex-shrink:0}.chat-composer textarea{flex:1;width:0;min-width:0;resize:none;border:0;border-radius:12px;background:#f4f4f4;padding:12px;color:#222;font-size:16px;line-height:1.5;min-height:45px;max-height:120px}.chat-composer .chat-primary{min-height:45px;align-self:flex-end}.telegram-miniapp .chat-page{height:calc(100% - 100 * var(--rpx))}
@media(max-height:500px){.chat-new{padding-top:10px;padding-bottom:10px}.chat-empty{padding-top:25px}.chat-header{min-height:48px;padding-top:8px;padding-bottom:8px}}

.chat-page.is-thread{height:min(100%,var(--chat-visible-height,100dvh))}.telegram-miniapp .chat-page.is-thread{height:min(100%,calc(min(var(--mini-visible-height,100dvh),var(--chat-visible-height,100dvh)) - var(--mini-top,0px) - var(--mini-bottom,0px)))}

/* Messages list follows the compact, scan-first layout used by the mini program. */
.chat-list-screen{background:#fff}
.chat-list-screen>.chat-header{position:relative;height:86px;min-height:86px;padding:22px 18px 12px;border-bottom:0;align-items:center}
.chat-list-screen>.chat-header h1{font-size:25px;line-height:1.1;letter-spacing:.01em;font-weight:800;position:absolute;left:50%;transform:translateX(-50%)}
.chat-new-toggle{margin-left:auto;min-height:44px;padding:0 2px;border:0;appearance:none;-webkit-appearance:none;background:transparent;color:#252525;font-size:14px!important;line-height:1.4;font-weight:500;-webkit-tap-highlight-color:transparent}
.chat-new-toggle:active{opacity:.6}
.chat-new{padding:14px 18px 16px;background:#fffdf0;border-top:1px solid #f5f1ce;border-bottom:1px solid #f1eee0}
.chat-new[hidden]{display:none}
.chat-new label{font-size:12px;margin-bottom:8px;color:#6c6754}
.chat-new input{border-radius:8px;padding:10px 11px;background:#fff;border-color:#e8e4ca}
.chat-primary{border-radius:9px;padding:10px 13px;background:#ffe60f}
.chat-hint{margin-top:8px;font-size:10px;color:#97917d}
.chat-system-rows{background:#f7f7f7;border-top:1px solid #f2f2f2;border-bottom:1px solid #f0f0f0}
.chat-system-row{height:104px;display:flex;align-items:center;gap:16px;padding:15px 20px;background:#f7f7f7}
.chat-system-row+.chat-system-row{border-top:1px solid #ededed}
.chat-system-icon{position:relative;display:grid;place-items:center;width:58px;height:58px;border-radius:50%;flex:0 0 58px;color:#fff}
.chat-system-icon.notice{background:#ffc400}
.chat-system-icon.social{background:#ff6952}
.chat-system-icon.notice:before{content:"";width:21px;height:25px;border-radius:12px 12px 8px 8px;background:#fff;box-shadow:0 4px 0 -2px #fff;position:relative;top:-2px}
.chat-system-icon.notice:after{content:"";position:absolute;width:9px;height:3px;border-radius:3px;background:#fff;bottom:14px}
.chat-system-icon.social:before{content:"+1";font-size:20px;font-weight:800;color:#fff;letter-spacing:-1px}
.chat-system-content{min-width:0;display:flex;flex:1;flex-direction:column;gap:3px}
.chat-system-content strong{font-size:18px;line-height:1.25;font-weight:750;color:#151515}
.chat-system-content span{font-size:14px;line-height:1.45;color:#9a9a9a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-system-content time{font-size:11px;color:#ababab;margin-top:3px}
.chat-conversations{background:#fff}
.chat-conversation{height:108px;min-height:108px;gap:14px;padding:15px 18px 15px 20px;border-bottom:1px solid #ededed}
.chat-conversation:active{background:#fafafa}
.chat-avatar{width:58px;height:58px;flex-basis:58px;border-radius:50%;background:#f0f0f0;font-size:20px;color:#777;font-weight:650}
.chat-conversation-content{height:68px;display:flex;flex-direction:column;justify-content:flex-start;gap:3px;padding-top:1px}
.chat-conversation-top{display:block;margin:0;line-height:1.3}
.chat-conversation-top strong{display:block;font-size:17px;line-height:1.35;font-weight:750;color:#151515}
.chat-preview{font-size:14px;line-height:1.55;color:#999;max-width:100%;padding-top:1px}
.chat-conversation-meta{display:block;margin-top:auto;min-height:15px}
.chat-conversation-meta time{font-size:11px;color:#aaa}
.chat-product-thumb{width:64px;height:64px;flex:0 0 64px;object-fit:cover;border-radius:10px;background:#f0f0f0;margin-left:auto}
.chat-badge{min-width:20px;height:20px;display:grid;place-items:center;padding:0 5px;border-radius:12px;background:#ff4d55;color:#fff;font-size:11px;line-height:20px;align-self:flex-start;margin-top:-2px;margin-left:-22px;z-index:2;border:2px solid #fff}
.chat-empty{padding:70px 24px}
.chat-empty-icon{width:64px;height:56px}
@media(max-width:360px){.chat-system-row{padding-left:16px;padding-right:16px;gap:12px}.chat-conversation{padding-left:16px;padding-right:14px;gap:11px}.chat-product-thumb{width:56px;height:56px;flex-basis:56px}.chat-avatar{width:54px;height:54px;flex-basis:54px}}