/* 星信：读取优先，保留用户字体、壁纸与气泡变量。 */
#conversation-view {
  --im-message-font-size:var(--font-size-chat,14px);
  --im-message-leading:1.7;
  --im-message-radius:22px;
  --im-inset:var(--space-3,12px);
  --im-control-radius:16px;
  --im-control-height:44px;
  --im-edge:var(--color-border);
  --im-muted:var(--color-text-caption,var(--color-text-muted));
  --im-surface:var(--color-surface);
  --im-focus:var(--color-focus,var(--color-primary-ink));
  --im-bubble-shadow:0 2px 8px rgb(63 45 68 / 4%);
  --im-composer-shadow:0 3px 12px rgb(63 45 68 / 5%);
}
#conversation-view .conversation-header { gap:var(--space-2,8px); align-items:center; padding:6px var(--im-inset); border-bottom:1px solid transparent; background:var(--im-surface); box-shadow:none; }
#conversation-view .conversation-header>.avatar { flex:none; width:32px; height:32px; border-radius:12px; box-shadow:none; }
#conversation-view .conversation-title { flex:1; min-width:0; }
#conversation-view .conversation-title h2 { margin:0; font-size:17px; font-weight:var(--font-weight-semibold,600); line-height:1.4; color:var(--color-text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#conversation-view .conversation-header>button { flex:none; min-width:var(--im-control-height); min-height:var(--im-control-height); padding:4px; border-radius:var(--im-control-radius); border-color:transparent; box-shadow:none; }
#conversation-view .conversation-header .life-status-button { margin:0; padding:0; min-height:44px; width:100%; border:0; border-radius:8px; background:transparent; box-shadow:none; }
#conversation-view .life-status-copy strong { font-size:12px; line-height:1.5; font-weight:400; color:var(--im-muted); }
#conversation-view #life-current-meta { display:none; }
#conversation-view .conversation-header .life-status-button>span:last-child { font-size:12px; }
.im-call { border:0; background:transparent; color:var(--color-text-muted); font:inherit; font-size:12px; line-height:1.4; }
.im-call svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; vertical-align:middle; }
.im-more { border:1px solid var(--color-border); border-radius:12px; background:var(--color-surface); color:var(--color-text); font-size:22px; }
.im-dialog { width:calc(var(--layout-screen-width,390px) - 28px); padding:0; border:1px solid var(--color-border); border-radius:20px; background:var(--color-surface); color:var(--color-text); }
.im-dialog[open] { display:flex; flex-direction:column; }
#chat-more-dialog { top:auto; left:calc(var(--layout-screen-left,0px) + 8px); right:calc(var(--layout-screen-right,0px) + 8px); bottom:calc(var(--layout-screen-bottom,0px) + 8px); margin:0 auto; width:calc(var(--layout-screen-width,100vw) - 16px); max-width:calc(var(--layout-screen-width,100vw) - 16px); max-height:calc(var(--layout-screen-height,100dvh) - 96px); border-radius:22px 22px 16px 16px; }
.im-dialog::backdrop { background:rgb(45 35 51 / 26%); }
.im-dialog header { display:flex; flex:none; align-items:center; justify-content:space-between; padding:10px 14px; border-bottom:1px solid var(--color-border); }
.im-dialog h2 { font-size:18px; margin:0; }
.im-dialog header button { min-width:44px; min-height:44px; border:0; background:transparent; color:inherit; font-size:22px; }
.im-dialog-body { min-height:0; overflow:auto; overscroll-behavior:contain; padding:12px 14px 20px; }
.im-dialog-body p { font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
.im-dialog-body button { min-height:44px; }
.im-dialog-body>button { padding:8px 12px; margin:4px 6px 4px 0; border:1px solid var(--color-border); border-radius:12px; background:var(--color-surface); color:var(--color-text); font:inherit; font-size:14px; }
.im-dialog-body>button[hidden],#chat-call-note:empty { display:none; }
.im-dialog-body .composer-hint { display:block; font:inherit; font-size:12px; color:var(--color-text-muted); text-align:left; }
.im-dialog-body .chat-toolbar { padding:8px 0; flex-wrap:wrap; gap:8px; }
.im-dialog-body summary { min-height:44px; align-content:center; font-size:14px; }
.im-dialog-body #conversation-status { display:block; overflow:hidden; text-overflow:ellipsis; }
#conversation-view::before { opacity:.38; background-size:250px 220px; }
#conversation-view[data-mode=story]::before { opacity:.3; background-size:165px 165px,165px 165px,22px 22px; }
#conversation-view .messages { padding:16px var(--im-inset) 12px; gap:14px; scroll-padding-block:16px; }
#conversation-view .message { max-width:calc(100% - 44px); animation:none; }
#conversation-view .message-continuation { margin-block-start:-6px; }
#conversation-view .message-body { position:relative; }
#conversation-view .message-bubble { font-size:var(--im-message-font-size); line-height:var(--im-message-leading); overflow-wrap:anywhere; min-width:0; }
#conversation-view .message-bubble:not(.media-bubble):not(.envelope-bubble) { box-shadow:var(--im-bubble-shadow); margin-top:5px; padding:10px 13px; border-radius:var(--im-message-radius) var(--im-message-radius) var(--im-message-radius) 10px; background-image:none; }
#conversation-view .user .message-bubble:not(.media-bubble):not(.envelope-bubble) { border-radius:var(--im-message-radius) var(--im-message-radius) 10px var(--im-message-radius); border-color:var(--color-user-border); }
#conversation-view .message-bubble::before { width:26px; height:8px; top:-5px; opacity:.75; }
#conversation-view .message-bubble::after { width:18px; height:22px; left:-11px; bottom:3px; opacity:.45; }
#conversation-view .user .message-bubble::after { left:auto; right:-11px; }
#conversation-view .message-avatar { box-shadow:none; }
:root[data-bubble=soft] #conversation-view .message-bubble:not(.media-bubble):not(.envelope-bubble) { border-radius:24px; }
:root[data-bubble=plain] #conversation-view .message-bubble:not(.media-bubble):not(.envelope-bubble) { border-radius:12px; }
:root[data-bubble=plain] #conversation-view .message-bubble { box-shadow:none; }
#conversation-view[data-mode=story] .message-bubble:not(.media-bubble):not(.envelope-bubble) { padding-block:12px; line-height:var(--line-height-story,1.9); }
#conversation-view .message time { color:var(--im-muted); font-size:12px; line-height:1.5; margin-top:6px; }
#conversation-view .message-date { background:var(--im-surface); border-color:transparent; padding:4px 10px; }
#conversation-view .message-continuation .message-avatar { visibility:hidden; }
#conversation-view .message-actions { display:block; position:absolute; right:-44px; bottom:0; margin:0; width:44px; }
#conversation-view .user .message-actions { right:auto; left:-44px; }
#conversation-view .message-actions summary { list-style:none; display:grid; place-items:center; min-width:44px; min-height:44px; color:var(--color-text-muted); cursor:pointer; font-size:18px; }
#conversation-view .message-actions summary::-webkit-details-marker { display:none; }
#conversation-view .message-actions[open] { position:relative; inset:auto; width:100%; padding:5px; border:1px solid var(--color-border); border-radius:12px; background:var(--color-surface); }
#conversation-view .message:has(.message-actions[open]) { width:296px; }
#conversation-view .message:has(.message-actions[open])>.message-body { width:100%; }
#conversation-view .message-actions[open]>summary { min-height:44px; justify-content:end; padding-inline:10px; }
#conversation-view .message-actions button { min-height:44px; min-width:44px; padding:6px 8px; font-size:12px; }
#conversation-view .im-reaction-bar { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:2px; padding-bottom:6px; border-bottom:1px solid var(--color-border); }
#conversation-view .im-reaction-bar button { padding:4px 0; font-size:20px; border:1px solid transparent; }
#conversation-view .im-reaction-bar button[aria-pressed=true] { border-color:var(--color-primary); background:var(--color-user-bubble); }
#conversation-view .im-message-operations { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:3px; padding-top:6px; width:100%; }
#conversation-view .im-message-operations button { text-align:left; font-size:13px; }
#conversation-view .message-actions button:active:not(:disabled),.im-dialog button:active:not(:disabled) { background:var(--color-user-bubble); }
.im-reaction { display:block; min-width:44px; min-height:32px; margin-top:4px; border:1px solid var(--color-border); border-radius:16px; background:var(--color-surface); color:var(--color-text); }
.im-quote { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; max-width:100%; padding:7px 9px; border:0; border-left:3px solid var(--color-primary); border-radius:5px; background:var(--color-bg); color:var(--color-text-muted); font:inherit; font-size:12px; text-align:left; white-space:pre-wrap; overflow-wrap:anywhere; margin-bottom:7px; min-height:44px; }
.im-message-info { margin:6px 0 0; border-top:1px solid var(--color-border); color:var(--color-text-muted); font-size:12px; line-height:1.6; overflow-wrap:anywhere; width:100%; }
#conversation-view .im-message-info>summary { display:flex; justify-content:flex-start; gap:6px; padding:6px 8px; font-size:12px; }
#conversation-view .im-message-info>summary::before { content:"▸"; }
#conversation-view .im-message-info[open]>summary::before { content:"▾"; }
.im-message-info p { margin:0; padding:4px 8px 10px; }
#conversation-view .message-bubble .im-text-code { margin:4px 0; padding:8px; max-width:100%; white-space:pre-wrap; overflow-wrap:anywhere; border:1px solid var(--color-border); border-radius:8px; background:var(--color-bg); font-size:inherit; line-height:inherit; }
#conversation-view .message-bubble code { font-size:inherit; white-space:pre-wrap; overflow-wrap:anywhere; }
.im-quote-draft { display:flex; flex:none; gap:8px; align-items:center; margin:0 12px 5px; padding:6px 10px; border-left:3px solid var(--color-primary); background:var(--color-surface); border-radius:8px; }
.im-quote-draft span { flex:1; min-width:0; font-size:12px; max-height:48px; overflow:hidden; overflow-wrap:anywhere; }
.im-quote-draft button { min-width:44px; min-height:44px; border:0; background:transparent; color:var(--color-text); font-size:20px; }
.im-pet-rail { height:54px; flex:none; pointer-events:none; }
#conversation-view .composer { gap:8px; align-items:flex-end; margin:4px 10px 0; padding:6px; border:1px solid var(--im-edge); border-radius:24px; background:var(--glass-strong,var(--im-surface)); box-shadow:var(--im-composer-shadow); }
/* 外框负责分组，textarea 只保留一层键盘焦点环，不叠加深色边框或内阴影。 */
#conversation-view .composer textarea { flex:1; min-width:0; min-height:var(--im-control-height); max-height:112px; padding:11px 8px; border:1px solid transparent; border-radius:18px; background:transparent; box-shadow:none; color:var(--color-text); font-family:inherit; font-size:var(--font-size-chat,14px); line-height:20px; caret-color:var(--color-text); }
#conversation-view .composer textarea:focus { border-color:transparent; box-shadow:none; }
#conversation-view .composer textarea:focus-visible { outline:2px solid var(--im-focus); outline-offset:-3px; }
#conversation-view .composer textarea::placeholder { color:var(--im-muted); }
#conversation-view .composer button { flex:none; min-height:var(--im-control-height); min-width:52px; padding:0 12px; border:1px solid transparent; border-radius:var(--im-control-radius); background:var(--color-primary); color:var(--color-on-primary); box-shadow:none; font-size:14px; line-height:20px; }
#conversation-view .composer .chat-plus { min-width:var(--im-control-height); width:var(--im-control-height); padding:0; border-color:var(--im-edge); border-radius:var(--im-control-radius); background:transparent; color:var(--color-primary-ink); font-size:24px; font-weight:400; }
#conversation-view .composer button:disabled { opacity:.48; cursor:not-allowed; }
#conversation-view .composer button:focus-visible { outline:2px solid var(--im-focus); outline-offset:2px; transition:none; }
#conversation-view .composer button:active:not(:disabled) { background:var(--color-primary-soft); transform:none; }
@media(hover:hover) and (pointer:fine) { #conversation-view .composer button:hover:not(:disabled) { background:var(--color-primary-hover); } #conversation-view .composer .chat-plus:hover:not(:disabled) { background:var(--color-primary-soft); } }
@media(max-height:620px) { #conversation-view .composer textarea { max-height:72px; } }
#conversation-view .message-bubble.im-reference-highlight { outline:2px solid var(--color-primary); outline-offset:3px; }
.im-dialog :focus-visible,#conversation-view summary:focus-visible,#conversation-view .im-quote:focus-visible { outline:2px solid var(--color-primary); outline-offset:2px; }
@media(prefers-reduced-motion:reduce) { #conversation-view .message,#conversation-view .im-quote { animation:none; transition:none; } }
