html, body, body * { user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
input, textarea, [contenteditable="true"] { user-select:text!important; -webkit-user-select:text!important; -webkit-touch-callout:default; }

.header-chat-modes {
  display:flex;
  align-items:center;
  gap:4px;
  position: relative;
  justify-self: end;
}

#chat-search-button { display:grid; place-items:center; flex:0 0 36px; width:36px; height:36px; padding:0; border:0; border-radius:10px; color:#111; background:transparent; cursor:pointer; }
#chat-search-button i { font-size:20px; line-height:1; }
#chat-search-button:hover { background:rgba(128,128,128,.1); }
#chat-search-button:active { opacity:.55; }
body.dark-mode #chat-search-button { color:#fff; }
.chat-search { box-sizing:border-box; width:min(480px, calc(100% - 24px)); height:auto; max-height:min(520px, 72dvh, calc(var(--chat-viewport-height, 100dvh) - 24px)); margin:auto; padding:18px; border:1px solid #c7c9cc; border-radius:20px; background:#fdfdfd; color:#202124; box-shadow:0 18px 70px #0004; overflow:auto; scrollbar-width:thin; scrollbar-color:#aeb2b8 transparent; }
.chat-search[open] { display:flex; flex-direction:column; gap:12px; }
.chat-search::backdrop { background:#18191b66; backdrop-filter:blur(5px); }
.chat-search .search-heading > div { min-width:0; }
.chat-search .search-heading small { display:block; color:#5f6368; margin-top:3px; font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-search .search-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:3px; flex:0 0 auto; padding:3px; border-radius:11px; background:#eceef0; }
.chat-search .search-tab { min-height:32px; border:0; border-radius:8px; color:#62656a; background:transparent; cursor:pointer; font-size:13px; }
.chat-search .search-tab.is-active { color:#202124; background:#fff; box-shadow:0 1px 3px #00000014; font-weight:650; }
.chat-search button, .chat-search input { font:inherit; }
.chat-search button { -webkit-tap-highlight-color:transparent; }
.chat-search button:focus-visible { outline:2px solid #55585d; outline-offset:2px; }
.chat-search .search-close { display:grid; place-items:center; flex:0 0 34px; border:0; border-radius:50%; background:#e5e6e8; color:#34363a; width:34px; height:34px; padding:0; font-size:22px; cursor:pointer; }
.chat-search .search-close:hover { background:#d9dade; }
.chat-search form { display:flex; flex:0 0 auto; align-items:center; gap:8px; min-width:0; margin:0; border:1px solid #aeb1b5; border-radius:14px; padding:6px 7px 6px 12px; background:#fff; }
.chat-search form[hidden] { display:none; }
.chat-search form > i { flex:0 0 auto; color:#55585d; font-size:18px; }
.chat-search form:focus-within { border-color:#45484d; box-shadow:0 0 0 3px #00000012; }
.chat-search input { min-width:0; flex:1; width:0; height:36px; margin:0; padding:0; border:0; border-radius:0; box-shadow:none; outline:none; background:transparent; color:inherit; font-size:16px; }
.chat-search input::-webkit-search-cancel-button { display:none; -webkit-appearance:none; appearance:none; }
.chat-search form button { flex:0 0 auto; border:0; border-radius:10px; background:#303236; color:#fff; padding:9px 14px; cursor:pointer; font-size:13px; }
.chat-search form .search-clear { display:grid; width:28px; height:28px; place-items:center; padding:0; border-radius:50%; color:#3f4247; background:#e5e6e8; font-size:18px; }
.chat-search form .search-clear[hidden] { display:none; }
.chat-search form .search-clear:hover { background:#d5d7da; }
.chat-search form button:disabled { opacity:.42; cursor:default; }
.chat-search .search-status { flex:0 0 auto; font-size:12px; line-height:1.5; color:#5f6368; margin:0; }
.chat-search .search-results { flex:0 1 auto; min-height:0; max-height:min(320px, 42dvh); overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#aeb2b8 transparent; }
.chat-search::-webkit-scrollbar, .chat-search .search-results::-webkit-scrollbar { width:5px; height:5px; }
.chat-search::-webkit-scrollbar-track, .chat-search .search-results::-webkit-scrollbar-track { background:transparent; }
.chat-search::-webkit-scrollbar-thumb, .chat-search .search-results::-webkit-scrollbar-thumb { border-radius:999px; background:#aeb2b8; }
.chat-search::-webkit-scrollbar-thumb:hover, .chat-search .search-results::-webkit-scrollbar-thumb:hover { background:#8d9299; }
.chat-search .search-results.is-media { max-height:min(430px, 54dvh); }
.chat-search .search-results:empty { display:none; }
.chat-search .search-result { display:block; box-sizing:border-box; width:100%; text-align:left; border:0; border-bottom:1px solid #dfe1e3; border-radius:10px; padding:10px 9px 11px; background:transparent; color:#222428; cursor:default; }
.chat-search .search-result:hover { background:#eceef0; }
.chat-search .search-result-heading { display:flex; align-items:center; gap:8px; min-width:0; margin-bottom:4px; }
.chat-search .search-result small { display:block; flex:1; min-width:0; font-size:12px; color:#5f6368; line-height:1.5; }
.chat-search .search-result > span { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; color:#202124; line-height:1.55; font-size:14.5px; white-space:pre-wrap; overflow-wrap:anywhere; cursor:text; -webkit-user-select:text; user-select:text; -webkit-touch-callout:default; }
.chat-search .search-result > span, .chat-search .search-result > span * { cursor:text; -webkit-user-select:text!important; user-select:text!important; -webkit-touch-callout:default!important; }
.chat-search .search-result-locate { display:flex; align-items:center; gap:3px; flex:0 0 auto; min-height:28px; padding:4px 7px; border:0; border-radius:8px; color:#53565b; background:transparent; cursor:pointer; font-size:12px; -webkit-user-select:none; user-select:none; }
.chat-search .search-result-locate:hover, .chat-search .search-result-locate:active { color:#202124; background:#dfe1e4; }
.chat-search .search-result-locate i { font-size:14px; }
.chat-search .search-media-result { box-sizing:border-box; padding:10px 8px 12px; border-bottom:1px solid #dfe1e3; }
.chat-search .search-media-result small { display:block; flex:1; min-width:0; color:#5f6368; font-size:12px; line-height:1.5; }
.chat-search .search-media-result p { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; margin:1px 0 8px; color:#4f5257; font-size:13px; line-height:1.45; overflow-wrap:anywhere; }
.chat-search .search-media-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
.chat-search .search-media-thumb { position:relative; display:grid; place-items:center; aspect-ratio:1; min-width:0; padding:0; overflow:hidden; border:0; border-radius:9px; color:#7a7e84; background:#e8eaed; cursor:zoom-in; }
.chat-search .search-media-thumb img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .16s ease; }
.chat-search .search-media-thumb.is-loaded img { opacity:1; }
.chat-search .search-media-thumb.is-loaded > i { opacity:0; }
.chat-search .search-media-thumb > i { font-size:22px; transition:opacity .16s ease; }
.chat-search .search-media-thumb.is-error > i { color:#a64b4b; }
.chat-search .search-location-result .chat-location-card { width:100%; margin-top:5px; }
.chat-search .search-link-preview-host { width:100%; max-width:100%; padding:0; border:0; background:transparent; box-shadow:none; }
.chat-search .search-link-preview-host > .chat-link-preview { width:min(276px,100%); margin-top:5px; }
.chat-search mark { background:#d8dade; color:#111214; border-radius:3px; }
.chat-search .search-more { flex:0 0 auto; width:100%; margin:0; border:0; border-radius:11px; background:#ececef; color:#34363a; padding:11px; cursor:pointer; font-size:13px; }
.chat-search .search-more[hidden] { display:none; }
body.dark-mode .chat-search { color:#eee; background:#292a2d; border-color:#4d4f53; }
body.dark-mode .chat-search, body.dark-mode .chat-search .search-results { scrollbar-color:#666a70 transparent; }
body.dark-mode .chat-search::-webkit-scrollbar-thumb, body.dark-mode .chat-search .search-results::-webkit-scrollbar-thumb { background:#666a70; }
body.dark-mode .chat-search::-webkit-scrollbar-thumb:hover, body.dark-mode .chat-search .search-results::-webkit-scrollbar-thumb:hover { background:#7b7f86; }
body.dark-mode .chat-search .search-tabs { background:#383a3e; }
body.dark-mode .chat-search .search-tab { color:#b8bbc0; }
body.dark-mode .chat-search .search-tab.is-active { color:#f2f3f4; background:#505258; box-shadow:none; }
body.dark-mode .chat-search .search-result { border-color:#434448; }
body.dark-mode .chat-search .search-result { color:#f0f1f2; }
body.dark-mode .chat-search .search-result > span { color:#f0f1f2; }
body.dark-mode .chat-search .search-result:hover, body.dark-mode .chat-search .search-close { color:#eee; background:#414348; }
body.dark-mode .chat-search .search-result-locate { color:#c5c7ca; }
body.dark-mode .chat-search .search-result-locate:hover, body.dark-mode .chat-search .search-result-locate:active { color:#fff; background:#515359; }
body.dark-mode .chat-search .search-media-result { border-color:#434448; }
body.dark-mode .chat-search .search-media-result p { color:#c4c6ca; }
body.dark-mode .chat-search .search-media-thumb { color:#aeb1b6; background:#3d3f43; }
body.dark-mode .chat-search form { border-color:#57595e; background:#323337; }
body.dark-mode .chat-search form button { color:#17181a; background:#eceef0; }
body.dark-mode .chat-search form .search-clear { color:#f0f1f2; background:#4b4d52; }
body.dark-mode .chat-search .search-more { color:#eee; background:#3b3c40; }
body.dark-mode .chat-search mark { background:#56585d; }
body.dark-mode .chat-search .search-status, body.dark-mode .chat-search small { color:#bbb; }
@media(max-width:600px) { .chat-search { padding:16px; border-radius:18px; } }

/* Keep iOS WebKit from re-running text inflation against an intermediate
   landscape width while the visual viewport settles after rotation. */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body .header-wrapper { display:grid; grid-template-columns:76px minmax(0,1fr) 76px; width:100%; min-width:0; max-width:100%; box-sizing:border-box; align-items:center; padding-inline:.65rem; }
body .header-title { position:static; min-width:0; overflow:hidden; transform:none; text-align:center; text-overflow:ellipsis; white-space:nowrap; }
.header-left-tools { position:relative; display:grid; width:36px; height:36px; place-items:center; justify-self:start; }
body #theme-toggle,
#channel-menu-button { display:grid; width:36px; height:36px; place-items:center; padding:0; border:0; border-radius:0; color:#111; background:transparent; box-shadow:none; cursor:pointer; }
body #theme-toggle i,
#channel-menu-button i { color:inherit; font-size:20px; line-height:1; }
#ui-update-button[hidden] { display:none; }
#ui-update-button {
  position:absolute;
  left:34px;
  top:0;
  display:grid;
  width:36px;
  height:36px;
  place-items:center;
  padding:0;
  border:0;
  color:#111;
  background:transparent;
  cursor:pointer;
}
#ui-update-button i { font-size:19px; line-height:1; }
#ui-update-button::after { content:""; position:absolute; top:5px; right:5px; width:6px; height:6px; border-radius:50%; background:#28a745; box-shadow:0 0 0 2px #fff; }
#ui-update-button:active { opacity:.55; }
#channel-menu-button:active { opacity:.55; }
#channel-menu-button { position:relative; }
#channel-menu-button.has-unread::after {
  content:""; position:absolute; top:4px; right:3px; width:7px; height:7px;
  border-radius:50%; background:#d8394f; box-shadow:0 0 0 2px #fff;
}
body.dark-mode #channel-menu-button.has-unread::after { box-shadow:0 0 0 2px #2c2c2c; }
.channel-mode-menu[hidden] { display:none; }
.channel-mode-menu { position:absolute; z-index:30; top:calc(100% + 9px); right:0; display:grid; gap:6px; width:max-content; min-width:150px; padding:8px; border:1px solid #e3e3e3; border-radius:16px; background:#fff; box-shadow:0 12px 36px rgba(0,0,0,.14); }

#private-mode-button,
#private-channel-button,
.channel-group-button {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: .25rem;
  border: 0;
  width:100%;
  border-radius: 11px;
  padding: .58rem .68rem;
  background: #f3f3f3;
  color: #222;
  font-size: .78rem;
  cursor: pointer;
}
#private-channel-button[hidden] { display: none; }

.group-mode-list[hidden] { display:none; }
.group-mode-list { display:grid; gap:6px; }
.channel-group-button span { display:block; max-width:11em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.channel-group-button .channel-unread-dot {
  flex:0 0 7px; width:7px; height:7px; margin-left:auto; border-radius:50%; background:#d8394f;
}
.channel-group-button .channel-unread-dot[hidden] { display:none; }
body.dark-mode #theme-toggle,
body.dark-mode #channel-menu-button { color:#fff; background:transparent; }
body.dark-mode #ui-update-button { color:#fff; }
body.dark-mode #ui-update-button::after { box-shadow:0 0 0 2px #2c2c2c; }
body.dark-mode .channel-mode-menu { border-color:#494949; background:#2e2e2e; box-shadow:0 14px 38px rgba(0,0,0,.38); }

.notification-nudge {
  position:fixed; z-index:24; top:calc(var(--chat-viewport-top, 0px) + 4rem); right:12px;
  display:flex; align-items:center; max-width:min(330px, calc(100vw - 24px));
  border:1px solid #ddd; border-radius:13px; padding:4px;
  color:#45474b; background:rgba(255,255,255,.96); box-shadow:0 7px 24px rgba(0,0,0,.12);
  -webkit-backdrop-filter:blur(9px); backdrop-filter:blur(9px);
}
.notification-nudge[hidden] { display:none; }
.notification-nudge button { border:0; color:inherit; background:transparent; font:inherit; cursor:pointer; }
#notification-nudge-open { display:flex; min-width:0; align-items:center; gap:7px; padding:6px 7px; font-size:12px; line-height:1.45; text-align:left; }
#notification-nudge-open i { flex:0 0 auto; color:#55585d; font-size:16px; }
#notification-nudge-dismiss { display:grid; flex:0 0 28px; width:28px; height:28px; place-items:center; padding:0; border-radius:9px; color:#817882; font-size:16px; }
.notification-nudge button:active { opacity:.55; }
body.dark-mode .notification-nudge { border-color:#4d4f53; color:#e8e8e8; background:rgba(43,44,47,.96); box-shadow:0 8px 28px rgba(0,0,0,.34); }
body.dark-mode #notification-nudge-open i { color:#ddd; }

/* Keep the immersive page, but give wide screens a calm reading column. */
html,
body {
  min-height: 100%;
  width:100%;
  min-width:0;
  max-width:100%;
  overflow-x:hidden;
}

/* One scroll surface: the transcript, never the surrounding document. */
html:has(#chat-container) {
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}
html body:has(> #chat-container) {
  position: fixed;
  top: var(--chat-viewport-top, 0px);
  left: 0;
  width: 100%;
  height: var(--chat-viewport-height, 100dvh);
  min-height: 0;
  overflow: hidden;
  overscroll-behavior: none;
}
#portrait-only-overlay {
  position:fixed;
  z-index:10000;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));
  pointer-events:none;
  color:#242126;
  background:#f4f4f4;
  opacity:1;
  transition:opacity 160ms ease-out;
}
.portrait-only-card { display:grid; justify-items:center; gap:10px; text-align:center; }
.portrait-only-card i { font-size:42px; transform:rotate(-18deg); }
.portrait-only-card strong { font-size:20px; }
.portrait-only-card span { color:#777178; font-size:14px; }
body.dark-mode #portrait-only-overlay { color:#f4f1f5; background:#1e1e1f; }
body.dark-mode .portrait-only-card span { color:#aaa4ac; }
@media (orientation:landscape) and (hover:none) and (pointer:coarse) and (max-width:1024px) {
  #portrait-only-overlay {
    display:flex;
    pointer-events:auto;
  }
}
html.maizi-orientation-recovering #portrait-only-overlay { display:flex; pointer-events:auto; }
html.maizi-orientation-recovering.maizi-orientation-ready #portrait-only-overlay { opacity:0; pointer-events:none; }
body:has(> #chat-container) > header {
  position: relative;
  flex: 0 0 auto;
  box-sizing: content-box;
  padding-top: env(safe-area-inset-top, 0px);
}
/* The embedding document handles its own chrome and safe area. Keeping a
   standalone inset here creates a visible empty card above the chat header. */
html.maizi-embedded body:has(> #chat-container) {
  top: 0 !important;
  height: 100% !important;
}
html.maizi-embedded body:has(> #chat-container) > header {
  top: 0 !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}
html body #chat-container {
  flex: 1 1 0;
  min-height: 0;
  min-width: 0;
  margin-block: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
}
body:has(> #chat-container) > #input-area {
  position: relative;
  flex: 0 0 auto;
  padding-bottom: max(.6rem, env(safe-area-inset-bottom, 0px));
  max-height: 45%;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  scrollbar-width:none;
  border-top:1px solid #dcdcdc;
  box-shadow:0 -1px 5px rgba(0,0,0,.045);
}
body.dark-mode:has(> #chat-container) > #input-area { border-top-color:#484848; box-shadow:0 -1px 5px rgba(0,0,0,.22); }
body:has(> #chat-container) > #input-area::-webkit-scrollbar { display:none; width:0; height:0; }
body:has(> #chat-container) > #input-area.action-panel-open {
  max-height:none;
  overflow:visible;
}

#chat-container {
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: #bcb6bf transparent;
  overflow-anchor: none;
}

#chat-content {
  display:flex;
  flex-direction:column;
  width:100%;
  min-width:0;
  flex:0 0 auto;
  box-sizing:border-box;
  /* Keep both avatar types on one mirrored axis, gently inboard of the
     latest-arrow center so the bubble/avatar gap stays about 3px. */
  --avatar-run-side:calc(.75rem + 24px - var(--chat-side-padding, 1rem) - 23px);
  --avatar-single-side:calc(var(--avatar-run-side) - 46px);
}
#chat-content.group-feed-positioning { visibility:hidden; }

body.dark-mode #chat-container { scrollbar-color: #565258 transparent; }
#chat-container::-webkit-scrollbar { width: 7px; height: 7px; }
#chat-container::-webkit-scrollbar-track { background: transparent; }
#chat-container::-webkit-scrollbar-thumb { background: #bcb6bf; border: 2px solid transparent; background-clip: padding-box; border-radius: 999px; }
#chat-container::-webkit-scrollbar-thumb:hover { background-color: #99919d; }
body.dark-mode #chat-container::-webkit-scrollbar-thumb { background-color: #565258; }
body.dark-mode #chat-container::-webkit-scrollbar-thumb:hover { background-color: #756d79; }
#chat-container::-webkit-scrollbar-corner { background: transparent; }

.bubble {
  line-height: 1.62;
  white-space: pre-wrap;
}
.send-motion-target { opacity:0!important; }
.send-motion-pending { pointer-events:none; }
.bubble.emoji-only {
  background:transparent!important; border:0!important; box-shadow:none!important;
  padding:2px 4px!important; font-size:var(--emoji-message-size,64px)!important;
  line-height:1.2; min-width:0; overflow-wrap:normal;
}
.bubble.emoji-only p { margin:0; font-size:inherit; line-height:inherit; }

#input-area { padding-inline:clamp(.5rem, 3vw, 1rem); }
#input-area, #input-row { width:100%; min-width:0; max-width:100%; box-sizing:border-box; }
#input-row { display:flex; justify-content:space-between; gap:clamp(.42rem, 2.2vw, 1rem); overflow:visible; height:auto; min-height:2.8rem; align-items:center; flex-shrink:0; }
#input-row #userInput { min-width:0; width:0; min-height:2.8rem; height:2.8rem; max-height:160px; flex:1 1 0%; box-sizing:border-box; resize:none; padding:.6rem 1rem; line-height:1.45rem; font-family:inherit; overflow-y:hidden; white-space:pre-wrap; overflow-wrap:anywhere; border-radius:22px; transition:height 150ms cubic-bezier(.22,.72,.22,1),border-radius 150ms ease; }
#input-row.composer-multiline { align-items:flex-end; }
#input-row.composer-multiline #userInput { width:0; border-radius:16px; }
/* A multiline draft grows upward in the same composer row. Keep the smaller
   voice/keyboard toggle optically centred with the round edge controls. */
#input-row.composer-multiline #voice-message-toggle { margin-bottom:.225rem; }
@media (prefers-reduced-motion:reduce) { #input-row #userInput { transition:none; } }
#voice-message-hold { min-width:0; height:2.8rem; flex:1 1 0%; box-sizing:border-box; border:1px solid #d6d1d8; border-radius:999px; padding:.62rem 1rem; color:#2f2d31; background:#fff; font-family:inherit; font-size:.95rem; font-weight:600; line-height:1; user-select:none; -webkit-user-select:none; touch-action:none; cursor:pointer; }
#voice-message-hold[hidden] { display:none!important; }
#voice-message-hold.is-recording { color:#fff; border-color:#292b2e; background:#34363a; }
#voice-message-hold.will-cancel { border-color:#cb4052; background:#cb4052; }
#voice-message-hold.will-text { border-color:#4477c7; background:#4477c7; }
#voice-message-hold:disabled { opacity:.65; cursor:default; }
body.dark-mode #voice-message-hold { border-color:#555057; color:#eee; background:#29272b; }
body.dark-mode #voice-message-hold.is-recording { color:#fff; border-color:#62656a; background:#505257; }
body.dark-mode #voice-message-hold.will-cancel { border-color:#cb4052; background:#cb4052; }
body.dark-mode #voice-message-hold.will-text { border-color:#4477c7; background:#4477c7; }
#voice-record-overlay { position:fixed; inset:0; z-index:10040; pointer-events:none; color:#fff; background:rgba(16,16,17,.66); -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px); }
#voice-record-overlay[hidden] { display:none!important; }
.voice-record-center { position:absolute; left:50%; bottom:31%; display:flex; flex-direction:column; gap:12px; align-items:center; justify-content:center; box-sizing:border-box; width:min(78vw,330px); min-height:112px; max-height:210px; padding:18px 20px; border-radius:24px; background:#34363a; box-shadow:0 12px 34px rgba(0,0,0,.24); transform:translateX(-50%); }
.voice-record-center.has-transcript { width:min(78vw, 330px); }
.voice-record-center.has-transcript .voice-record-wave { display:flex; }
.voice-record-live-text { width:100%; min-height:26px; max-width:100%; max-height:128px; overflow:hidden auto; color:#fff; font-size:17px; font-weight:500; line-height:1.55; text-align:left; overflow-wrap:anywhere; }
.voice-record-live-text[hidden] { display:none!important; }
.voice-record-center::after { content:""; position:absolute; left:50%; bottom:-10px; width:20px; height:20px; border-radius:3px; background:#34363a; transform:translateX(-50%) rotate(45deg); }
.voice-record-wave { position:relative; z-index:1; display:flex; align-items:center; gap:3px; height:30px; }
.voice-record-wave i { display:block; width:3px; height:28px; border-radius:99px; background:#fff; transform:scaleY(calc(.12 + var(--record-level,0) * .88 * var(--record-bar-weight,.65))); transition:transform .16s ease-out; }
.voice-record-wave i:nth-child(2n) { --record-bar-weight:.85; }
.voice-record-wave i:nth-child(3n) { --record-bar-weight:1; }
.voice-record-actions { position:absolute; left:0; right:0; bottom:max(86px, calc(env(safe-area-inset-bottom) + 70px)); display:flex; justify-content:space-around; padding:0 8vw; }
.voice-record-target { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; width:104px; height:72px; border-radius:24px; color:rgba(255,255,255,.82); background:rgba(48,49,52,.78); font-size:14px; font-weight:600; transition:transform .14s ease,background .14s ease,color .14s ease; }
.voice-record-target i { font-size:24px; }
.voice-record-target.is-target { color:#fff; background:#34363a; transform:scale(1.08); }
.voice-record-hint { position:absolute; left:50%; bottom:max(176px, calc(env(safe-area-inset-bottom) + 160px)); transform:translateX(-50%); font-size:16px; font-weight:600; white-space:nowrap; }
@media (prefers-reduced-motion:reduce) { .voice-record-wave i { transition:none; } }
#input-row > * { min-width:0; }
#input-row #uploadLabel,
#input-row #voice-message-toggle,
#input-row #voiceBtn,
#input-row #group-mention-button { flex-shrink:0; }
#voice-message-toggle { display:grid; place-items:center; flex:0 0 2.35rem; width:2.35rem; height:2.35rem; min-width:2.35rem; border:0; border-radius:50%; padding:0; color:#55575b; background:#eeeeef; font-size:1.18rem; cursor:pointer; }
#voice-message-toggle:hover { background:#e1e2e4; }
#voice-message-toggle.voice-message-mode { color:#fff; background:#34363a; }
body.dark-mode #voice-message-toggle { color:#e1e1e1; background:#3b3c40; }
body.dark-mode #voice-message-toggle.voice-message-mode { color:#fff; background:#505257; }
#attachment-preview { width:100%; min-width:0; max-width:100%; box-sizing:border-box; }

.reply-composer-preview {
  display:flex; align-items:center; gap:.45rem; min-width:0;
  margin:.15rem 0 .5rem; padding:.48rem .58rem;
  border-left:3px solid #777; border-radius:7px; background:#f1f1f1; color:#555;
  font-size:.78rem; line-height:1.35;
}
.reply-composer-preview[hidden] { display:none; }
.reply-composer-preview > i { flex:0 0 auto; font-size:1rem; }
.reply-composer-text { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.reply-composer-close { display:grid; place-items:center; flex:0 0 24px; width:24px; height:24px; margin-left:auto; padding:0; border:0; border-radius:50%; background:#ddd; color:#555; cursor:pointer; }
body.dark-mode .reply-composer-preview { border-color:#aaa; background:#292929; color:#ccc; }
body.dark-mode .reply-composer-close { background:#444; color:#eee; }

.message-reply-reference {
  display:flex; width:100%; min-width:0; box-sizing:border-box; gap:.35rem; margin:0 0 .55rem; padding:.32rem .5rem;
  border:0; border-left:3px solid rgba(75,75,75,.65); border-radius:4px; background:rgba(90,90,90,.08);
  color:#686168; font:inherit; font-size:.75rem; line-height:1.35; text-align:left; cursor:pointer;
  -webkit-appearance:none; appearance:none; -webkit-tap-highlight-color:transparent;
}
.message-reply-reference:focus { outline:none; box-shadow:none; }
.message-reply-sender { flex:0 0 auto; font-weight:700; }
.message-reply-text { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
body.dark-mode .message-reply-reference { border-color:#aaa; background:rgba(255,255,255,.08); color:#ccc; }

@keyframes reply-target-flash {
  0%, 100% { box-shadow:inherit; }
  25%, 70% { box-shadow:0 0 0 3px rgba(80,82,87,.36), 0 8px 24px rgba(0,0,0,.12); }
}
.reply-target-flash { animation:reply-target-flash 1.8s ease; }

.message-actions { display:flex; align-items:center; gap:.45rem; margin-top:6px; }
/* Keep icon buttons on a stable plane while their message row is translated. */
.message-actions { min-height:36px; transform:translateZ(0); -webkit-backface-visibility:hidden; backface-visibility:hidden; }
.message-actions > .play-btn,
.message-actions > .quote-btn {
  display:grid; place-items:center; flex:0 0 42px; width:42px; min-width:42px; height:36px; margin-top:0; padding:0;
  position:relative; z-index:1; pointer-events:auto; touch-action:manipulation;
  transition:background-color .16s ease, color .16s ease, transform .12s ease, box-shadow .16s ease;
}
.message-actions > .play-btn:not(.blocked):active,
.message-actions > .quote-btn:active { transform:scale(.94); }
.message-actions .play-btn { margin:0 0 0 .6rem; }
.message-actions .play-btn + .quote-btn { margin-left:0; }
.quote-btn {
  display:grid; place-items:center; width:38px; height:34px; margin:0 0 0 .6rem; padding:0;
  border:0; border-radius:12px; background:#eee; color:#666; cursor:pointer;
}
.quote-btn i { font-size:1.15rem; }
.quote-btn.active { background:#eee; color:#202124; box-shadow:none; }
.quote-btn:focus { outline:none; }
body.dark-mode .quote-btn { background:#1a1a1a; color:#aaa; }
body.dark-mode .quote-btn.active { background:#1a1a1a; color:#eee; box-shadow:none; }
@media (hover:hover) and (pointer:fine) {
  .message-reply-reference:hover { background:rgba(90,90,90,.14); }
  .message-actions > .play-btn:not(.blocked):hover,
  .message-actions > .quote-btn:hover { background:#e2e2e2; color:#222; transform:translateY(-1px); box-shadow:0 2px 6px rgba(0,0,0,.10); }
  body.dark-mode .message-reply-reference:hover { background:rgba(255,255,255,.14); }
  body.dark-mode .message-actions > .play-btn:not(.blocked):hover,
  body.dark-mode .message-actions > .quote-btn:hover { background:#333; color:#fff; box-shadow:0 2px 7px rgba(0,0,0,.28); }
}
.group-message-actions { align-self:flex-start; }
#scroll-latest-button {
  position:fixed;
  bottom:calc(var(--composer-height, 4.5rem) + 12px);
  left:auto;
  right:.75rem;
  z-index:11;
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  padding:0;
  border:1px solid #dedede;
  border-radius:50%;
  color:#333;
  background:rgba(255,255,255,.94);
  box-shadow:0 2px 8px rgba(0,0,0,.10);
  font-size:20px;
  cursor:pointer;
  -webkit-appearance:none;
  appearance:none;
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease;
}
#scroll-latest-button.is-visible { opacity:1; pointer-events:auto; }
#scroll-latest-button:active { transform:scale(.94); }
#scroll-latest-button:focus-visible { outline:2px solid #777; outline-offset:2px; }
body.dark-mode #scroll-latest-button { border-color:#484848; color:#eee; background:rgba(48,48,48,.96); box-shadow:0 2px 9px rgba(0,0,0,.26); }
#input-area.action-panel-open { padding-bottom: max(.6rem, env(safe-area-inset-bottom)); }
#uploadLabel[aria-expanded="true"] { transform: rotate(0); }
#uploadLabel[aria-expanded="true"] i { transform: rotate(90deg); }
.chat-action-panel[hidden] { display: none !important; }
.shared-favorites { width:min(520px,calc(100vw - 32px)); max-height:82dvh; padding:0; border:0; background:transparent; color:#303134; box-sizing:border-box; overflow:visible; }
.collection-card { padding:18px; max-height:82dvh; overflow:auto; border:1px solid #ddd; border-radius:20px; background:#fff; box-shadow:0 16px 48px rgba(0,0,0,.15); box-sizing:border-box; animation:collection-entry .25s ease-out; }
@keyframes collection-entry { from { opacity:0; transform:translateY(7px) scale(.985); } to { opacity:1; transform:translateY(0) scale(1); } }
@media (prefers-reduced-motion:reduce) { .collection-card { animation:none; } }
.collection-card > .dialog-heading { padding-bottom:12px; border-bottom:1px solid #e3e3e5; }
body.dark-mode .shared-favorites { background:transparent; }
body.dark-mode .collection-card { background:#272727; border-color:#444; }
body.dark-mode .collection-card > .dialog-heading { border-color:#444; }
.shared-favorites::backdrop { background:rgba(0,0,0,.25); backdrop-filter:blur(7px); }
.shared-favorites small { display:block; color:#777; font-size:13px; line-height:1.5; margin-top:5px; }
.shared-favorites button { border:0; border-radius:12px; background:#ededee; color:inherit; padding:10px 14px; cursor:pointer; }
.shared-favorites [role="status"] { font-size:14px; color:#777; padding:13px; border:1px solid #e3e3e5; border-radius:14px; }
.shared-favorites [role="status"]:empty { display:none; }
.favorite-list { max-height:58dvh; overflow:auto; overscroll-behavior:contain; margin-top:15px; }
.favorite-list article { padding:13px; border:1px solid #e3e3e5; border-radius:14px; margin-bottom:10px; }
.favorite-list article { overflow:hidden; opacity:1; transform:translateY(0); transition:opacity .25s ease,transform .3s ease,max-height .32s ease,padding .32s ease,margin .32s ease,border-width .32s ease; }
.favorite-list article.is-removing { opacity:0; transform:translateY(-7px); max-height:0!important; padding-top:0; padding-bottom:0; margin-bottom:0; border-width:0; }
.favorite-list footer { display:flex; justify-content:flex-end; gap:8px; margin-top:12px; }
.favorite-heading { display:flex; align-items:flex-start; gap:8px; min-width:0; }
.favorite-heading > small { flex:1; min-width:0; margin-top:2px; }
.favorite-list .favorite-jump { display:flex; align-items:center; gap:3px; flex:0 0 auto; min-height:28px; padding:4px 7px; border-radius:8px; color:#53565b; background:transparent; font-size:12px; }
.favorite-list .favorite-jump:hover,.favorite-list .favorite-jump:active { color:#202124; background:#dfe1e4; }
.favorite-list .favorite-jump i { font-size:14px; }
.shared-favorites .favorite-feedback { padding:0; border:0; margin:8px 0 0; }
.conversation-refresh { width:100%; margin-top:10px; }
.conversation-items footer button { font-size:15px; }
.shared-favorites .favorite-delete { display:flex; align-items:center; justify-content:center; gap:7px; min-width:82px; min-height:38px; font-size:14px; padding:7px 12px; transition:background .24s ease,color .24s ease,min-width .24s ease,transform .24s ease; }
.shared-favorites .favorite-delete.is-confirming { min-width:116px; background:#fae6e7; color:#9d323b; }
.favorite-delete i { font-size:18px; }
.favorite-delete:active { transform:scale(.96); }
.favorite-delete:disabled { opacity:.6; }
.favorite-body { margin-top:8px; overflow-wrap:anywhere; white-space:pre-wrap; line-height:1.6; cursor:text; -webkit-user-select:text!important; user-select:text!important; -webkit-touch-callout:default!important; }
.favorite-body .attachment-image { max-width:100%; }
.favorite-more { margin-top:10px; width:100%; }
body.dark-mode .shared-favorites { background:transparent; color:#eee; }
body.dark-mode .shared-favorites button { background:#3b3b3b; }
body.dark-mode .favorite-list article { border-color:#444; }
body.dark-mode .favorite-list .favorite-jump { color:#c5c7ca; }
body.dark-mode .favorite-list .favorite-jump:hover,body.dark-mode .favorite-list .favorite-jump:active { color:#fff; background:#515359; }
body.dark-mode .shared-favorites [role="status"] { border-color:#444; }
body.dark-mode .shared-favorites .favorite-delete.is-confirming { background:#513035; color:#ffd5da; }
@media (prefers-reduced-motion:reduce) { .favorite-list article,.shared-favorites .favorite-delete { transition:none; } }
.chat-action-panel-shell {
  height:0; overflow:hidden; margin:0 -1rem;
  contain:layout paint;
}
.chat-action-panel-shell[hidden] { display:none!important; }
.chat-action-panel-shell.is-preview {
  position:absolute;
  z-index:1;
  top:100%;
  left:0;
  right:0;
  height:244px;
  margin:0;
}
.chat-scrollbar-curtain {
  position:absolute;
  z-index:2;
  top:0;
  right:0;
  width:10px;
  height:100%;
  pointer-events:none;
  background:#f8f8f9;
}
body.dark-mode .chat-scrollbar-curtain { background:#272727; }
.chat-action-panel-shell.is-open {
  height:244px; margin-top:10px; margin-bottom:-.6rem;
}
.chat-action-panel {
  display: grid;
  grid-template-columns: repeat(4, minmax(52px, 76px));
  align-content: start;
  justify-content: center;
  gap: clamp(8px, 3vw, 18px);
  height: calc(244px + max(0px, env(safe-area-inset-bottom) - 16px));
  min-height: calc(244px + max(0px, env(safe-area-inset-bottom) - 16px));
  max-height: none;
  flex-shrink: 0;
  overflow: visible;
  grid-auto-rows: max-content;
  box-sizing: border-box;
  margin: 10px -1rem -.6rem;
  padding: 22px 18px max(16px, env(safe-area-inset-bottom));
  border-top: 1px solid #e3e3e5;
  background: #f8f8f9;
  animation: chat-action-in .16s ease-out;
}
.chat-action-panel-shell > .chat-action-panel { margin:0; animation:none; }
.chat-action-item {
  display: grid;
  justify-items: center;
  gap: 8px;
  min-width: 0;
  padding: 0;
  border: 0;
  color: #555;
  background: transparent;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
.chat-action-icon {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border: 1px solid #e2e2e2;
  border-radius: 17px;
  color: #343037;
  background: #fff;
  box-shadow: 0 3px 10px rgba(55, 38, 60, .06);
}
.chat-action-icon i { font-size: 26px; line-height: 1; }
.chat-action-item:active .chat-action-icon { transform: scale(.95); background: #e9e9e9; }
.chat-action-item:disabled { opacity: .55; }
.chat-action-item.loading .chat-action-icon i { animation: chat-action-pulse .8s ease-in-out infinite alternate; }
body.dark-mode .chat-action-panel { border-color: #414141; background: #272727; }
body.dark-mode .chat-action-item { color: #c8c8c8; }
body.dark-mode .chat-action-icon { border-color: #4d4d4d; color: #eee; background: #343434; box-shadow: none; }
body.dark-mode .chat-action-item:active .chat-action-icon { background: #404040; }
@keyframes chat-action-in { from { opacity: 0; transform: translateY(8px); } }
@keyframes chat-action-pulse { to { opacity: .35; transform: scale(.88); } }
@media (max-width: 420px) {
  .chat-action-panel { gap:12px 8px; padding:18px 10px max(16px, env(safe-area-inset-bottom)); }
  .chat-action-icon { width:52px; height:52px; border-radius:15px; }
}
#voiceBtn.voice-listening { background: #22a447 !important; color: white !important; }
#voiceBtn { position: relative; }
#voiceBtn.voice-listening::after {
  content: ''; position: absolute; inset: -5px; border-radius: 50%; padding: 4px;
  background: conic-gradient(#138b35 var(--voice-progress, 0deg), rgba(19,139,53,.16) 0);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  pointer-events: none;
}
#voiceBtn.send-wake-holding::after {
  content: ''; position: absolute; inset: -5px; border-radius: 50%;
  background: conic-gradient(#a03ab0 var(--send-wake-progress, 0deg), rgba(160,58,176,.18) 0);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 4px), #000 0);
  mask: radial-gradient(farthest-side, transparent calc(100% - 4px), #000 0);
  pointer-events: none;
}
#voiceBtn { touch-action: none; -webkit-touch-callout: none; }
#voiceBtn.send-wake-holding {
  background:#007bff!important;
  box-shadow:0 4px 12px rgba(0,123,255,.18);
  transition:background .4s ease,box-shadow .4s ease;
}
body.dark-mode #voiceBtn.send-wake-holding { background:#3391ff!important; }
#voiceBtn > i { transition:opacity .26s ease,transform .36s cubic-bezier(.2,.8,.2,1); }
#voiceBtn.send-wake-holding > i { opacity:0; transform:scale(.72); }
#voiceBtn .send-wake-arrow {
  position:absolute; inset:0; display:grid; place-items:center;
  color:#fff; font-size:1.3rem; line-height:1;
  opacity:0; transform:translateY(5px) scale(.8); pointer-events:none;
  transition:opacity .28s ease,transform .38s cubic-bezier(.2,.8,.2,1);
}
#voiceBtn.send-wake-holding .send-wake-arrow { opacity:1; transform:translateY(0) scale(1); }
#voiceBtn .send-wake-arrow i { font-size:1.3rem; }
@media (prefers-reduced-motion:reduce) {
  #voiceBtn.send-wake-holding,#voiceBtn > i,#voiceBtn .send-wake-arrow { transition:none; }
}
body.dark-mode #voiceBtn.voice-listening::after {
  background: conic-gradient(#65df80 var(--voice-progress, 0deg), rgba(101,223,128,.2) 0);
}
#voiceBtn.voice-ending { background: #ce4651 !important; color: white !important; }
#voiceExitBtn { position:relative; z-index:2; flex:0 0 32px; width:32px; height:32px; margin-left:5px; border:0; border-radius:50%; padding:0; background:#f4e2e4; color:#b33241; font-size:19px; cursor:pointer; touch-action:manipulation; }
#voiceExitBtn[hidden] { display: none; }

/* Rich HTML already encodes line breaks; source formatting is not content. */
#chat-container .bubble.rich-message,
#chat-container .bubble.advanced-result { white-space: normal; }
#chat-container .bubble.rich-message p + p { margin-top: 1em; }
#chat-container .advanced-result ol, #chat-container .advanced-result ul { margin:.65em 0; padding-left:1.6em; }
#chat-container .advanced-result li { margin:.45em 0; padding-left:.12em; }
#chat-container .advanced-result > :first-child:not(.message-reactions) { margin-top:0; }
#chat-container .advanced-result > :last-child { margin-bottom:0; }

#private-channel-button.active,
.channel-group-button.active {
  background: #222;
  color: #fff;
}

body.dark-mode #private-mode-button,
body.dark-mode #private-channel-button,
body.dark-mode .channel-group-button {
  background: #3a3a3a;
  color: #eee;
}

body.dark-mode #private-channel-button.active,
body.dark-mode .channel-group-button.active {
  background: #eee;
  color: #1f1f1f;
}

#private-mode-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  padding: 1rem;
  background: rgba(0, 0, 0, .55);
  backdrop-filter: blur(5px);
}

#private-mode-overlay[hidden] { display: none; }

.private-mode-card {
  width: min(410px, calc(100vw - 32px));
  box-sizing: border-box;
  max-height: calc(100dvh - 2rem);
  overflow-y: auto;
  padding: clamp(16px, 3.5vw, 22px);
  border: 1px solid var(--account-line, #eee);
  border-radius: 20px;
  background: var(--account-surface, #fff);
  box-shadow: 0 20px 60px rgba(0, 0, 0, .3);
}

body.dark-mode .private-mode-card {
  border-color: var(--account-line);
  background: var(--account-surface);
}

.private-mode-card h2 { margin: 0; font-size: 1.25rem; }
.private-mode-card p { margin: 0 0 1rem; color: var(--account-muted); font-size: .85rem; line-height: 1.7; }
.private-mode-card .login-ip-notice { margin:10px 0 0; font-size:11px; line-height:1.45; }
.private-login-heading, .private-account-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.private-login-heading > div, .private-account-head > div { min-width: 0; }
.private-login-heading span:not(.private-account-icon) { color: var(--account-muted); font-size: 12px; }
.private-account-icon { display: inline-flex; flex: 0 0 44px; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 14px; background: var(--account-user-bg); color: var(--account-user-text); font-size: 23px; }
#account-change-avatar { border:0; padding:0; cursor:pointer; }
.shared-favorites.avatar-picker-dialog { width:min(380px,calc(100vw - 28px)); }
.avatar-hint { margin:14px 0 0; color:var(--account-muted); font-size:12px; font-weight:600; }
.avatar-emoji-options { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:6px; height:274px; margin:9px 0 0; padding-right:3px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
.avatar-emoji-options button { min-height:40px; padding:5px 0; border:1px solid transparent; border-radius:11px; background:#f1f2f3; font:24px/1 "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif; cursor:pointer; transition:transform .2s ease,background .2s ease; }
.avatar-emoji-options button[aria-pressed="true"] { border-color:#34363a; background:#e0e2e5; transform:scale(1.06); }
body.dark-mode .avatar-emoji-options button { background:#35373a; }
body.dark-mode .avatar-emoji-options button[aria-pressed="true"] { background:#4b4e53; border-color:#ddd; }
.avatar-custom-row { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:12px 0 0; padding-top:12px; border-top:1px solid var(--account-line); }
.avatar-custom-row label { color:var(--account-muted); font-size:12px; font-weight:600; }
.avatar-custom-row input { flex:none; box-sizing:border-box; width:46px; height:44px; padding:0 2px; border:1px solid var(--account-input-line); border-radius:11px; outline:none; background:var(--account-field); color:var(--account-text); text-align:center; font:22px/1 "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif; }
.avatar-custom-row input::placeholder { color:var(--account-muted); font:22px/1 sans-serif; opacity:.7; }
.avatar-custom-row input.is-selected,.avatar-custom-row input:focus-visible { border-color:var(--account-accent); background:var(--account-soft); }
.avatar-custom-row input[aria-invalid="true"] { border-color:var(--account-danger-line); }
.shared-favorites.avatar-picker-dialog .avatar-custom-status { margin:5px 0 0; padding:0; border:0; border-radius:0; background:transparent; color:var(--account-muted); font-size:12px; line-height:1.4; }
.shared-favorites.avatar-picker-dialog.avatar-has-invalid .avatar-custom-status { color:var(--account-danger); }
.shared-favorites.avatar-picker-dialog .avatar-custom-status:empty { display:none; }
.avatar-picker-dialog .private-mode-actions { margin-top:14px; }
.private-mode-card .private-mode-identity { margin: 2px 0 0; overflow: hidden; color: var(--account-muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.private-account-statuses { display: flex; flex-wrap: wrap; gap: 7px; margin: 0 0 14px; }
.private-account-statuses span,
.private-account-statuses button { display: inline-flex; align-items: center; gap: 4px; border: 0; border-radius: 999px; padding: 4px 9px; background: var(--account-soft); color: var(--account-muted); font: inherit; font-size: 12px; }
.private-account-statuses button { cursor: pointer; }
.private-account-statuses button:focus-visible { outline: 2px solid var(--account-accent); outline-offset: 2px; }
.private-account-statuses button.connected { background: #e4f4e9; color: #287245; cursor: default; }
body.dark-mode .private-account-statuses button.connected { background: #243d2d; color: #9ee0b0; }

.transaction-cards { display: grid; gap: 8px; margin-top: 12px; }
.transaction-card { border: 1px solid color-mix(in srgb, var(--accent, #8e44ad) 22%, #d8d8de); border-radius: 12px; padding: 10px 12px; background: color-mix(in srgb, var(--accent, #8e44ad) 5%, #fff); }
.transaction-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.transaction-card-head strong { font-size: 13px; }
.transaction-card-head span { flex: none; border-radius: 999px; padding: 2px 7px; background: rgba(38, 145, 75, .12); color: #287245; font-size: 12px; }
.transaction-card p { margin: 7px 0 0; white-space: pre-wrap; font-size: 13px; line-height: 1.55; }
.transaction-card small { display: block; margin-top: 6px; color: var(--muted, #777); overflow-wrap: anywhere; }
body.dark-mode .transaction-card { border-color: rgba(255,255,255,.13); background: rgba(255,255,255,.055); }
body.dark-mode .transaction-card-head span { background: rgba(108, 211, 139, .15); color: #9ee0b0; }
.private-mode-menu > #private-mode-description { margin-bottom: 14px; border-radius: 12px; padding: 10px 12px; background: var(--account-field); }
.private-mode-card input {
  width: 100%;
  box-sizing: border-box;
  margin-bottom: .75rem;
  padding: .75rem .85rem;
  border: 1px solid var(--account-input-line);
  border-radius: 12px;
  background: var(--account-field);
  color: inherit;
  font: inherit;
  font-size: 16px; /* Prevent iOS Safari from zooming the page on focus. */
  outline: none;
}
.private-mode-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .55rem; }
.private-mode-menu > .private-mode-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.private-mode-actions button, .private-mode-actions a {
  border: 0;
  border-radius: 12px;
  padding: .65rem .85rem;
  background: var(--account-soft);
  color: var(--account-soft-text);
  font-weight: 650;
  cursor: pointer;
  text-decoration: none;
}
.private-mode-actions button.primary { background: var(--account-accent); color: var(--account-accent-text); }
.private-mode-actions button.danger { background: var(--account-danger-bg); color: var(--account-danger); }
.private-account-section { margin-top: 18px; border-top: 1px solid var(--account-line); padding-top: 14px; }
.private-account-section > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; cursor: pointer; color: var(--account-text); font-size: 13px; font-weight: 650; list-style: none; }
.private-account-section > summary::-webkit-details-marker { display: none; }
.private-account-section > summary span { display: inline-flex; align-items: center; gap: 6px; }
.private-account-section > summary small { color: var(--account-muted); font-size: 11px; font-weight: 400; }
.private-account-section[open] > summary small { visibility: hidden; }
.private-account-section .memory-editor { margin-top: 0; border-top: 0; padding-top: 14px; }
.private-mode-error { min-height: 1.2em; margin: .6rem 0 0 !important; color: var(--account-danger) !important; }
.private-mode-error:empty { display: none; }
.private-mode-menu[hidden], .private-mode-login[hidden] { display: none; }

.advanced-divider {
  align-self: center;
  margin: 1rem 0 .35rem;
  color: #8f8492;
  font-size: .78rem;
}

.advanced-status {
  align-self: flex-start;
  margin: .8rem 0 .1rem .6rem;
  color: #887f8a;
  font-size: .82rem;
}

.advanced-interim .bubble {
  color: #756d78;
  box-shadow: none;
  border: 1px dashed #d6cbd9;
}

body.dark-mode .advanced-interim .bubble {
  color: #ccc0d0;
  border-color: #5b4c60;
}

.advanced-process {
  align-self: stretch;
  margin: .9rem .6rem .1rem;
  padding-bottom: .7rem;
  border-bottom: 1px solid #ded7e0;
  color: #827887;
  font-size: .82rem;
}

body.dark-mode .advanced-process { border-color: #4b424f; color: #aaa0ae; }
.advanced-process summary { display:inline-flex; align-items:center; gap:.34rem; cursor:pointer; list-style:none; }
.advanced-process summary::-webkit-details-marker { display: none; }
.advanced-process summary::after { content:"›"; width:.72rem; flex:0 0 .72rem; color:#a06aaa; line-height:1; text-align:center; transform-origin:center; }
.advanced-process[open] summary::after { transform:rotate(90deg); }
.advanced-process-body { padding-top: .55rem; }
.advanced-process-body p { margin: .28rem 0; }
.advanced-process-body p.step::before { content: "· "; color: #9a40a7; }

.advanced-result strong { font-weight: 750; }
.advanced-result .advanced-heading { margin:.9em 0 .35em; line-height:1.32; font-weight:780; }
.advanced-result h1.advanced-heading { font-size:1.24em; }
.advanced-result h2.advanced-heading { font-size:1.16em; }
.advanced-result h3.advanced-heading { font-size:1.09em; }
.advanced-result :is(h4,h5,h6).advanced-heading { font-size:1em; }
.advanced-result .advanced-quote { margin:.7em 0; padding:.12em 0 .12em .8em; border-left:3px solid rgba(112,95,118,.38); color:color-mix(in srgb,currentColor 78%,transparent); }
.advanced-result .advanced-divider { height:1px; margin:.85em 0; border:0; background:rgba(112,95,118,.24); }
.advanced-result .advanced-task { list-style:none; margin-left:-1.3em; }
.advanced-result .advanced-task > span { display:inline-block; width:1.3em; color:#68717d; }
body.dark-mode .advanced-result .advanced-quote { border-left-color:rgba(222,204,228,.34); }
.advanced-math-card { margin:.5rem 0; border:1px solid rgba(120,120,120,.22); border-radius:13px; overflow:hidden; background:rgba(128,128,128,.06); color:inherit; }
.advanced-math-header { display:flex; align-items:center; justify-content:space-between; padding:5px 12px; font-size:12px; color:inherit; opacity:.8; border-bottom:1px solid rgba(120,120,120,.15); }
.advanced-copy-math { display:grid; place-items:center; width:32px; height:32px; border:0; border-radius:8px; background:transparent; color:inherit; font-size:18px; cursor:pointer; }
.advanced-copy-math.copied { color:#268447; }
.advanced-math[data-display="true"] { display:block; padding:10px 14px; overflow-x:auto; white-space:pre; font-family:ui-monospace,monospace; }
.advanced-math .katex-display { margin:0; }
.advanced-math .katex { font-size:1.12em; }
.advanced-math[data-display="false"] { display:inline; }
.advanced-result.has-code { max-width: min(92%, 920px); }
.advanced-result .advanced-inline-code {
  padding: .12em .36em;
  border-radius: 6px;
  background: rgba(127, 104, 132, .14);
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  font-size: .9em;
}
.advanced-code-card {
  margin: .75rem 0;
  overflow: hidden;
  border: 1px solid #383838;
  border-radius: 16px;
  background: #222;
  color: #f4f4f4;
}
.advanced-code-header {
  display: flex;
  align-items: center;
  min-height: 42px;
  padding: 0 .85rem;
  border-bottom: 1px solid #353535;
  background: #242424;
  font-size: .8rem;
}
.advanced-code-mark { margin-right: .55rem; color: #f3f3f3; font-weight: 750; }
.advanced-code-language { font-weight: 700; }
.advanced-copy-code {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  margin-left: auto;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #e7e7e7;
  cursor: pointer;
}
.advanced-copy-code:hover { background: #343434; }
.advanced-copy-code.copied { color: #74d991; }
.advanced-result .advanced-code-card pre,
.advanced-result .advanced-code-card pre code {
  margin: 0;
  border: 0;
  border-radius: 0;
  background: #222;
  white-space: pre;
  word-break: normal;
}
.advanced-result .advanced-code-card pre { overflow-x: auto; padding: 0; }
.advanced-result .advanced-code-card pre code {
  display: block;
  min-width: max-content;
  padding: 1rem 1.1rem;
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  font-size: .86rem;
  line-height: 1.65;
}
.advanced-result a { color: #496fbd; text-decoration: none; }
.advanced-result a:hover { text-decoration: underline; }
body.dark-mode .advanced-result a { color: #91b9ff; }
.advanced-table-wrap {
  max-width:100%;
  margin:.85rem 0;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scrollbar-width:thin;
  border:1px solid #ded7e0;
  border-radius:13px;
  background:rgba(255,255,255,.52);
  -webkit-overflow-scrolling:touch;
}
.advanced-table { width:100%; border-collapse:collapse; color:inherit; font-size:.9em; line-height:1.55; table-layout:auto; }
.advanced-table th,
.advanced-table td { padding:.65rem .75rem; border-bottom:1px solid #e8e2e9; text-align:left; vertical-align:top; overflow-wrap:break-word; word-break:normal; }
.advanced-table th { background:rgba(127,104,132,.09); font-weight:750; white-space:nowrap; }
.advanced-table tbody tr:last-child td { border-bottom:0; }
.advanced-table tbody tr:nth-child(even) { background:rgba(127,104,132,.035); }
.advanced-table :is(th,td):first-child { width:auto; }
body.dark-mode .advanced-table-wrap { border-color:#514953; background:rgba(45,41,47,.72); }
body.dark-mode .advanced-table th,
body.dark-mode .advanced-table td { border-bottom-color:#4b454d; }
body.dark-mode .advanced-table th { background:rgba(210,178,218,.08); }
body.dark-mode .advanced-table tbody tr:nth-child(even) { background:rgba(210,178,218,.025); }
.advanced-result .advanced-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: .6rem;
  margin-top: .75rem;
}
.advanced-result .advanced-gallery img {
  display: block;
  width: 100%;
  max-height: 440px;
  border-radius: 12px;
  object-fit: contain;
  background: #171419;
}

#voiceBtn.advanced-stop {
  background: #e7a8b4 !important;
  color: #4b1c27 !important;
}

/* Prevent a wrapped user bubble from shrinking its child a second time. */
body .bubble-wrapper.assistant {
  width: 100%;
  min-width: 0;
  align-self: stretch;
  box-sizing: border-box;
  margin-left: 0;
}

body .bubble-wrapper.assistant > .bubble.assistant {
  width: fit-content;
  box-sizing: border-box;
}

body .bubble-wrapper.user {
  width: 100%;
  align-self: stretch;
  align-items: flex-end;
  background: transparent;
}

body .bubble-wrapper.user > .bubble.user {
  width: fit-content;
  max-width:min(85%,640px);
  box-sizing: border-box;
}

.private-message-meta {
  margin: .7rem .6rem .3rem;
  color: #74777c;
  font-size: .7rem;
  line-height: 1.45;
}
.private-message-meta[role="button"] { cursor:pointer; user-select:none; -webkit-user-select:none; }
.private-message-meta[role="button"]:focus-visible { outline:1px solid currentColor; outline-offset:3px; border-radius:3px; }
body.dark-mode .private-message-meta { color:#aaaeb3; }
.private-message-meta[hidden] { display:none!important; }
body .bubble-wrapper.private-message-row { margin-top:0; margin-bottom:8px; }
body .bubble-wrapper.private-message-row.private-run-start { margin-top:10px; }
body .bubble-wrapper.private-message-row.private-run-end { margin-bottom:12px; }
.private-message-row > .bubble { margin-top:0; margin-bottom:0; padding:.68rem .9rem; border-radius:20px; }
.private-message-row.assistant.private-run-end > .bubble:not(.emoji-only):not(.location-card-only) { border-bottom-left-radius:8px; }
.private-message-row.user.private-run-end > .bubble:not(.emoji-only):not(.location-card-only) { border-bottom-right-radius:8px; }
.private-time-divider { align-self:center; margin:14px 0 6px; color:#777b80; font-size:12px; line-height:1.5; }
body.dark-mode .private-time-divider { color:#a0a3a8; }

#group-mention-button { display:grid; place-items:center; border:0; border-radius:50%; width:36px; height:36px; flex:0 0 36px; padding:0; color:#9a40a7; background:#eee6f1; cursor:pointer; }
#group-mention-button i { font-size:20px; line-height:1; }
#group-mention-button, #group-mention-button[hidden] { display:none!important; }
/* The same composer geometry is shared by private and group chat. */
body.dark-mode #group-mention-button { color:#e1b2ea; background:#423449; }
#group-mention-button:focus-visible { outline:2px solid #9a40a7; outline-offset:2px; }

.group-room-intro {
  align-self: center;
  max-width: 620px;
  margin: .5rem 0 1.1rem;
  padding: .65rem 1rem;
  border: 1px solid #dedfe1;
  border-radius: 999px;
  color: #717378;
  background: rgba(255, 255, 255, .68);
  font-size: .78rem;
  line-height: 1.45;
  text-align: center;
}

body.dark-mode .group-room-intro {
  border-color: #4b4d51;
  color: #bbb;
  background: rgba(53, 54, 57, .72);
}

.group-message-row {
  display: flex;
  flex-direction: column;
  align-self: flex-start;
  width:min(82%,700px);
  margin: .28rem 0 .5rem .6rem;
}

.group-message-row.self {
  align-self: flex-end;
  align-items: flex-end;
  margin-right: .6rem;
}
.group-message-run {
  position:relative; display:grid; grid-template-columns:minmax(0,1fr);
  /* Row 1 is the same name/gap geometry used by an ordinary message;
     row 2 begins at the first bubble's exact top edge. */
  grid-template-rows:calc(var(--group-avatar-run-start-gap) + var(--group-avatar-name-line) + var(--group-avatar-name-gap)) repeat(var(--run-length),max-content);
  align-self:stretch; width:100%;
}
.group-message-run, .group-message-row.has-member-avatar {
  --group-avatar-name-size:.76rem;
  --group-avatar-name-line:1.064rem;
  --group-avatar-name-gap:.16rem;
  --group-avatar-run-start-gap:10px;
}
.group-message-run > .group-message-row {
  grid-column:1; grid-row:var(--run-index);
  align-self:start; justify-self:start;
}
.group-message-run > .group-message-row:first-child { margin-top:0; }
.group-message-run > .group-message-row:first-child > .group-message-meta {
  position:absolute; top:calc(0px - var(--group-avatar-name-line) - var(--group-avatar-name-gap));
  left:0; right:auto;
}
.group-message-run.self > .group-message-row:first-child > .group-message-meta { left:auto; right:0; }
.group-message-run.self > .group-message-row { justify-self:end; }
.group-message-run > .member-avatar {
  position:sticky; grid-column:1; grid-row:2 / -1;
  align-self:end; justify-self:start; top:auto; bottom:10px;
  /* The grid area itself begins at the first bubble, so its upper sticky
     boundary is identical to a single message's bubble-cell boundary. */
  margin:0 0 12px var(--avatar-run-side);
}
.group-message-run.has-last-actions > .member-avatar { margin-bottom:54px; }
.group-message-run.self > .member-avatar { justify-self:end; margin-left:0; margin-right:var(--avatar-run-side); }

.group-message-meta {
  margin: 0 .35rem .16rem;
  color: #8d828f;
  font-size: .7rem;
}
.group-message-row.has-member-avatar {
  position:relative; display:grid; grid-template-columns:minmax(0,1fr); margin-left:46px; width:min(calc(82% - 50px),700px);
}
.group-message-row.has-member-avatar > .group-message-meta { grid-row:1; grid-column:1; }
.group-message-row.has-member-avatar > .group-bubble { grid-row:2; grid-column:1; }
.group-message-row.has-member-avatar > .group-message-actions { grid-row:3; grid-column:1; justify-self:start; }
.group-message-row.self.has-member-avatar { justify-items:end; }
.group-message-row.self.has-member-avatar { margin-left:0; margin-right:46px; }
.member-avatar {
  /* Single avatars end at their own bubble; runs end at the final bubble. */
  position:sticky; grid-row:2 / 3; grid-column:1 / 2; align-self:end; justify-self:start;
  top:auto; bottom:10px; margin-left:var(--avatar-single-side); width:46px; height:46px; z-index:1;
  display:grid; place-items:center; padding:0; border:0; appearance:none;
  border-radius:0; background:transparent; font-size:34px; line-height:1;
  cursor:pointer; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none;
  -webkit-tap-highlight-color:transparent; outline:none; box-shadow:none;
  touch-action:pan-y; transition:transform .25s cubic-bezier(.2,.75,.25,1);
}
.group-message-row.self .member-avatar { justify-self:end; margin-left:0; margin-right:var(--avatar-single-side); }
.member-avatar[hidden] { display:none!important; }
.member-avatar:focus { outline:none; box-shadow:none; }
.member-avatar:focus-visible:not(.is-holding) { outline:2px solid currentColor; outline-offset:3px; }
.member-avatar.is-holding { z-index:4; transform:scale(1.45); transition-duration:.46s; transition-timing-function:cubic-bezier(.42,0,.68,1); }
.member-avatar.member-avatar-ai { background:transparent; }
body.dark-mode .member-avatar { background:transparent; }
.group-message-row.has-member-avatar .group-message-meta {
  font-size:var(--group-avatar-name-size); line-height:var(--group-avatar-name-line);
  margin-bottom:var(--group-avatar-name-gap);
}
.group-message-meta[hidden] { display:none!important; }
.group-message-row.has-member-avatar { margin-top:0; margin-bottom:8px; }
.group-message-row.message-run-start { margin-top:var(--group-avatar-run-start-gap, 10px); }
.group-message-row.message-run-end { margin-bottom:12px; }
.group-time-divider { align-self:center; margin:14px 0 6px; color:#777b80; font-size:12px; line-height:1.5; }
body.dark-mode .group-time-divider { color:#a0a3a8; }
@media (prefers-reduced-motion:reduce) { .member-avatar { transition:none; } .member-avatar.is-holding { transform:none; } }
.group-message-meta[role="button"] { cursor:pointer; user-select:none; -webkit-user-select:none; }
.group-message-meta[role="button"]:focus-visible { outline:1px solid currentColor; outline-offset:3px; border-radius:3px; }

.bubble[data-message-menu-bound="true"]:not(.message-text-selecting),
.bubble[data-message-menu-bound="true"]:not(.message-text-selecting) * { user-select:none!important; -webkit-user-select:none!important; -webkit-touch-callout:none; }
#chat-container .chat-location-card,
#chat-container .chat-location-card * { -webkit-touch-callout:default!important; }
.bubble.message-text-selecting,
.bubble.message-text-selecting * { user-select:text!important; -webkit-user-select:text!important; -webkit-touch-callout:default; }
#message-action-overlay { position:absolute; inset:0; z-index:10060; background:transparent; opacity:0; transition:opacity .48s ease; }
#message-action-overlay[hidden] { display:none!important; }
:root { --message-press-charge-time:.46s; --message-press-charge-ease:cubic-bezier(.42,0,.68,1); --message-press-lift-time:.16s; --message-press-lift-ease:cubic-bezier(.15,.8,.25,1); }
#message-hold-backdrop { position:fixed; inset:0; z-index:10050; pointer-events:none; background:rgba(23,20,25,.27); opacity:0; -webkit-backdrop-filter:blur(3.2px); backdrop-filter:blur(3.2px); transition:opacity .18s ease; }
#message-hold-backdrop[hidden] { display:none!important; }
#message-hold-backdrop.is-charging { opacity:.82; transition:opacity var(--message-press-charge-time) var(--message-press-charge-ease); }
#message-hold-backdrop.is-open { opacity:1; transition:opacity var(--message-press-lift-time) var(--message-press-lift-ease); }
.message-press-row { position:relative; z-index:10051; }
.message-menu-source-row { visibility:hidden; }
.message-action-preview .member-avatar, .message-action-preview .group-message-meta { visibility:hidden; }
#message-action-overlay.is-open { opacity:1; transition:none; }
.message-action-preview { position:absolute; max-height:48vh; overflow:visible; pointer-events:none; opacity:1; transform:scale(1.07); transform-origin:center; filter:none; transition:transform .48s cubic-bezier(.2,.78,.24,1),opacity .48s ease; }
.message-action-preview.is-long { max-height:none; filter:none; overflow:visible; }
.message-action-preview { z-index:0; }
.message-action-menu { z-index:1; }
.message-action-preview .group-message-row { width:100%; max-width:none; margin:0; }
.message-action-preview .message-actions, .message-action-preview .group-message-actions, .message-action-preview .play-btn, .message-action-preview .quote-btn { display:none!important; }
.message-reaction-picker { position:absolute; z-index:2; display:flex; align-items:center; gap:3px; padding:5px; border:1px solid rgba(255,255,255,.8); border-radius:999px; background:rgba(252,250,253,.96); box-shadow:0 8px 26px rgba(26,18,29,.22); opacity:0; transform:translateY(5px) scale(.94); transition:opacity .2s ease,transform .2s ease; }
.message-reaction-picker[hidden] { display:none!important; }
#message-action-overlay.is-open .message-reaction-picker { opacity:1; transform:translateY(0) scale(1); }
.message-reaction-picker button { display:grid; place-items:center; width:39px; height:39px; flex:0 0 39px; padding:0; border:0; border-radius:50%; background:transparent; font-size:23px; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.message-reaction-picker button:active { transform:scale(1.22); background:rgba(90,70,95,.1); }
.bubble > .message-reactions, .message-text-card > .message-reactions { display:flex; flex-wrap:wrap; gap:5px; width:max-content; max-width:100%; margin:8px 0 0; white-space:normal; transform-origin:left bottom; }
.group-message-row.ai .message-reactions, .bubble-wrapper.assistant .message-reactions { margin-top:14px; }
.message-reaction { display:inline-flex; align-items:center; justify-content:center; gap:4px; min-width:38px; min-height:27px; padding:2px 6px; border:1px solid #dedce2; border-radius:999px; color:#4b4650; background:#fff; font:inherit; font-size:13px; line-height:1.2; cursor:pointer; }
.message-reaction.is-mine { border-color:#a9cdec; color:#255f93; background:#e7f3ff; }
.message-reaction-symbol { font-size:14px; }
.message-reaction-count { font-variant-numeric:tabular-nums; }
.message-reaction-faces { display:inline-flex; align-items:center; padding-left:2px; }
.message-reaction-avatar { display:grid; place-items:center; flex:0 0 20px; width:20px; height:20px; border:1px solid #fff; border-radius:50%; background:#f0edf2; font-size:15px; line-height:1; }
.message-reaction-faces .message-reaction-avatar + .message-reaction-avatar { margin-left:-4px; }
.message-reaction-extra { margin-left:2px; font-size:11px; }
.message-reaction:active { transform:scale(.94); }
body.dark-mode .message-reaction-picker { border-color:rgba(255,255,255,.1); background:rgba(47,43,49,.97); }
body.dark-mode .message-reaction { border-color:#514b54; color:#ece5ef; background:#39343c; }
body.dark-mode .message-reaction.is-mine { border-color:#548ab4; color:#cae6ff; background:#233b50; }
body.dark-mode .message-reaction-avatar { border-color:#39343c; background:#514b54; }
.message-action-menu { position:absolute; display:flex; flex-direction:column; width:190px; overflow:hidden; border:1px solid rgba(255,255,255,.7); border-radius:17px; background:rgba(252,250,253,.94); box-shadow:0 16px 44px rgba(26,18,29,.25); transform:translateY(-6px) scale(.94); transform-origin:50% 0; opacity:0; transition:transform .48s cubic-bezier(.2,.78,.24,1),opacity .48s ease; }
#message-action-overlay.is-open .message-action-menu { transform:translateY(0) scale(1); opacity:1; transition:none; }
#message-action-overlay.is-open .message-action-preview { transform:translateY(var(--message-preview-shift,0px)) scale(var(--message-preview-scale,1.14)); opacity:1; transition:none; }
#message-action-overlay.is-closing { opacity:1; transition:none; }
#message-action-overlay.is-closing .message-action-preview { animation:none; transform:scale(1); opacity:1; transition:transform .32s cubic-bezier(.2,.78,.24,1); }
#message-action-overlay.is-open .message-action-preview.is-long { animation:message-preview-lift var(--message-press-lift-time) var(--message-press-lift-ease) both; }
#message-action-overlay.is-closing .message-action-menu { animation:none; opacity:0; transform:translateY(-6px) scale(.94); transition:opacity .16s ease,transform .16s ease; }
.bubble.message-press-charging, .message-text-card.message-press-charging { animation:message-press-charge var(--message-press-charge-time) var(--message-press-charge-ease) both; transform-origin:center; }
.bubble.message-press-held { transform:scale(1.07); transform-origin:center; }
.message-text-card.message-press-held { transform:scale(1.07); transform-origin:center; }
.bubble.message-press-charging, .bubble.message-press-held, .message-action-preview .bubble { position:relative; filter:none; }
.message-action-preview .bubble { z-index:3; }
@keyframes message-press-charge { from { transform:scale(1); } to { transform:scale(1.07); } }
#message-action-overlay.is-open .message-action-preview:not(.is-long) { animation:message-preview-lift var(--message-press-lift-time) var(--message-press-lift-ease) both; }
#message-action-overlay.is-open .message-action-menu { animation:message-menu-reveal .26s .06s cubic-bezier(.2,.75,.3,1) both; }
@keyframes message-preview-lift {
  0% { transform:scale(1.07); opacity:1; }
  100% { transform:translateY(var(--message-preview-shift,0px)) scale(var(--message-preview-scale,1.14)); opacity:1; }
}
@keyframes message-menu-reveal {
  0% { transform:translateY(-8px) scale(.9); opacity:0; }
  100% { transform:translateY(0) scale(1); opacity:1; }
}
.message-action-menu button { display:flex; align-items:center; gap:13px; width:100%; min-height:56px; border:0; border-bottom:1px solid rgba(75,62,78,.1); padding:0 18px; color:#29242b; background:transparent; font-family:inherit; font-weight:500; font-size:18px; line-height:1.3; text-align:left; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.message-action-menu button:disabled { opacity:.45; cursor:default; }
.message-action-menu { max-height:calc(100dvh - 24px); overflow-y:auto; }
.message-action-menu button[hidden] { display:none!important; }
.message-action-menu button:last-child { border-bottom:0; }
.message-action-menu button:active { background:rgba(0,0,0,.08); }
.message-action-menu i { flex:0 0 23px; width:23px; color:#3f4145; font-size:23px; font-weight:400; text-align:center; }
body.dark-mode #message-action-overlay { background:rgba(8,7,9,0); }
body.dark-mode #message-hold-backdrop { background:rgba(8,7,9,.32); }
body.dark-mode .message-action-menu { border-color:rgba(255,255,255,.1); background:rgba(47,43,49,.95); box-shadow:0 14px 44px rgba(0,0,0,.38); }
body.dark-mode .message-action-menu button { border-bottom-color:rgba(255,255,255,.08); color:#f3eff4; }
body.dark-mode .message-action-menu i { color:#e4e4e4; }
@media (prefers-reduced-motion:reduce) { #message-action-overlay, #message-action-overlay.is-open, .message-action-menu, .message-action-preview, .message-reaction-picker { transition:none; } .bubble.message-press-charging, #message-action-overlay.is-open .message-action-preview, #message-action-overlay.is-open .message-action-menu, #message-action-overlay.is-open .message-action-preview .bubble { animation:none; } .bubble.message-press-held { transform:none; filter:none; } }
@media (prefers-reduced-motion:reduce) { #message-hold-backdrop, #message-hold-backdrop.is-charging, #message-hold-backdrop.is-open { transition:none; } }

.group-message-row .group-bubble {
  width: fit-content;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0;
  padding: .78rem .92rem;
  border: 1px solid #e7e0e9;
  border-radius: 8px 17px 17px 17px;
  background: #fff;
  color: #272329;
  box-shadow: 0 2px 9px rgba(48, 32, 51, .06);
  white-space: pre-wrap;
}

.group-message-row > .play-btn,
.group-message-actions > .play-btn {
  align-self: flex-start;
  flex: 0 0 auto;
  width: 42px;
  min-width: 42px;
  height: 36px;
  padding: 0;
  justify-content: center;
}
.group-message-actions .play-btn { margin-left:0; }
.group-message-row.self .group-bubble {
  border-color: #c8dff4;
  border-radius: 17px 8px 17px 17px;
  background: #dff0ff;
}

.group-message-row.ai .group-bubble {
  border-color: #dbc9df;
  background: #f4edf6;
}

.group-message-row.ai .group-message-meta { color: #8b4f94; font-weight: 700; }

body.dark-mode .group-message-row .group-bubble {
  border-color: transparent;
  background: #333;
  color: #fff;
}

body.dark-mode .group-message-row.self .group-bubble {
  border-color: #3d668e;
  background: #315f8c;
}

body.dark-mode .group-message-row.ai .group-bubble {
  border-color: #664e6b;
  background: #3b303e;
}

.group-message-row { --message-bubble-fill:#fff; }
.group-message-row.self { --message-bubble-fill:#dff0ff; }
.group-message-row.ai { --message-bubble-fill:#f4edf6; }
body.dark-mode .group-message-row { --message-bubble-fill:#333; }
body.dark-mode .group-message-row.self { --message-bubble-fill:#315f8c; }
body.dark-mode .group-message-row.ai { --message-bubble-fill:#3b303e; }
.group-message-row.has-member-avatar > .group-bubble {
  position:relative; padding:.68rem .9rem; border-radius:20px;
}
.group-message-row.message-run-end > .group-bubble:not(.emoji-only):not(.location-card-only) {
  border-bottom-left-radius:8px;
}
.group-message-row.self.message-run-end > .group-bubble:not(.emoji-only):not(.location-card-only) {
  border-bottom-left-radius:20px; border-bottom-right-radius:8px;
}

.group-ai-status {
  align-self: flex-start;
  margin: .35rem 0 .75rem .9rem;
  color: #8c798f;
  font-size: .78rem;
}

.group-ai-status::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: .45rem;
  border-radius: 50%;
  background: #a65db0;
  animation: group-pulse 1.2s ease-in-out infinite;
}

@keyframes group-pulse { 50% { opacity: .25; transform: scale(.75); } }
.group-ai-status.has-commentary { width: min(88%, 700px); box-sizing: border-box; }
.group-ai-status::before { content: none; display: none; }
.group-ai-status > div:first-child { display: flex; align-items: center; gap: .45rem; }
.group-ai-status > div:first-child::before { content: ""; width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%; background: #a65db0; animation: group-pulse 1.2s ease-in-out infinite; }
.group-progress-bubble { margin-top: .35rem; padding: .7rem .9rem; border: 1px dashed #b697bd; border-radius: 8px 17px 17px 17px; background: rgba(154,64,167,.035); color: #615368; font-size: .95rem; line-height: 1.65; white-space: pre-wrap; overflow-wrap: anywhere; }
body.dark-mode .group-progress-bubble { border-color: #806488; color: #d0bdd5; background: rgba(180,130,190,.045); }

@media (max-width: 480px) {
  #private-mode-overlay { padding: 12px; }
  .private-mode-card { width: min(390px, calc(100vw - 24px)); border-radius: 18px; }
  .private-mode-card h2 { font-size: 1.15rem; }
  .private-mode-card p { margin-bottom: .8rem; line-height: 1.55; }
  #private-mode-button,
  #private-channel-button,
  .channel-group-button { padding: .48rem .58rem; font-size: .74rem; }
  .header-chat-modes { gap: .25rem; }
  body.private-mode .header-wrapper { padding-inline: .65rem; }
  body.private-mode #theme-toggle { padding-inline: .3rem; }
  #trait-label { display: none; }
  .group-message-row { width:88%; margin-left:.2rem; }
  .group-message-row.self { margin-right:.2rem; }
  .group-room-intro { border-radius: 16px; }
  .advanced-process { margin-inline: .2rem; }
  .advanced-result.has-code { max-width: 94%; }
  .advanced-code-card { margin-inline: -.25rem; border-radius: 13px; }
  .advanced-result .advanced-code-card pre code { padding: .85rem; font-size: .8rem; }
}

@media (max-width: 640px) {
  .advanced-table { width:max-content; min-width:32rem; max-width:none; }
  .advanced-table th,
  .advanced-table td { min-width:8rem; max-width:20rem; }
}

@media (max-width: 380px) {
  .header-wrapper { padding-inline: .5rem; }
  #private-mode-button,
  #private-channel-button,
  .channel-group-button { padding: .45rem .5rem; font-size: .71rem; }
  #input-area { padding-inline: .5rem; }
  #input-row { gap: .42rem; }
  #input-row #userInput { padding-inline: .7rem; }
  #input-row #uploadLabel,
  #input-row #voiceBtn { width: 2.35rem; height: 2.35rem; }
  #group-mention-button { width: 34px; height: 34px; flex-basis: 34px; }
  .chat-action-panel { margin-inline: -.5rem; padding-inline: 18px; }
  .advanced-table { font-size:.84em; }
  .advanced-table th,
  .advanced-table td { padding:.55rem .6rem; }
}

@media (min-width: 721px) {
  body .header-wrapper {
    width: min(100%, 912px);
    margin-inline: auto;
    box-sizing: border-box;
  }

  html body #chat-container {
    width: min(100%, 960px);
    margin-inline: auto;
    padding-inline:24px;
    --chat-side-padding:24px;
  }

  #input-row {
    width: min(100%, 912px);
    margin-inline: auto;
  }

  #attachment-preview {
    width: min(100%, 912px);
    margin-inline: auto;
  }

  .bubble.assistant {
    max-width: min(82%, 780px);
  }

  .bubble.user {
    max-width: min(72%, 640px);
  }

  .advanced-result.has-code {
    max-width: 912px;
  }

  .advanced-process {
    width: min(calc(100% - 1.2rem), 780px);
    box-sizing: border-box;
  }
}
/* Long answers retain their complete Markdown/code; only the viewport is folded. */
.bubble.advanced-long.is-collapsed { max-height: 28rem; overflow: hidden; position: relative; }
.bubble.advanced-long.is-collapsed::after { content: ""; position: absolute; inset: auto 0 0; height: 2.5rem; background: linear-gradient(transparent, var(--bubble-assistant, #fff)); pointer-events: none; }
.bubble.advanced-long.is-collapsed > .message-reactions { position:absolute; z-index:1; bottom:.65rem; left:.9rem; max-width:calc(100% - 1.8rem); margin:0; }
.advanced-expand, .advanced-history-more { border: 0; background: transparent; color: #79618f; font: inherit; font-size: .85rem; padding: .45rem .7rem; cursor: pointer; }
.advanced-expand { display: block; align-self: flex-start; }
.advanced-history-more { display: block; margin: .5rem auto 1rem; }
.history-auto-sentinel { min-height:1.4rem; cursor:default; opacity:.72; }
.advanced-attachment-note { opacity: .65; font-size: .8rem; margin-top: .35rem; }
.advanced-interim .bubble { white-space: pre-wrap; }
body.dark-mode .bubble.advanced-long.is-collapsed::after { background: linear-gradient(transparent, #302936); }
.chat-location-draft[hidden] { display:none; }
.chat-location-draft { position:relative; display:flex; gap:8px; width:auto; max-width:200px; height:58px; padding:0 12px; margin:2px 0 8px; align-items:center; border:1px solid #d9dadd; border-radius:15px; color:#45474b; background:#f1f1f2; }
.location-draft-label { font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.location-picker { box-sizing:border-box; width:min(460px,calc(100% - 32px)); height:min(560px,80dvh); max-height:calc(var(--chat-viewport-height, 100dvh) - 24px); margin:auto; padding:14px; border:1px solid #dadbdd; border-radius:18px; background:#fff; color:#2d2f32; overflow:auto; }
.location-picker[open] { display:flex; flex-direction:column; gap:10px; }
.location-picker::backdrop { background:#18191b66; backdrop-filter:blur(4px); }
.location-picker button, .location-picker input { font:inherit; }
.location-picker button { cursor:pointer; min-height:44px; border:0; border-radius:10px; padding:9px 12px; color:inherit; background:#f0f0f1; }
.location-picker button:disabled { opacity:.5; cursor:default; }
.location-picker form { display:flex; gap:8px; flex:0 0 auto; margin:0; }
.location-picker .picker-search-field { position:relative; flex:1; min-width:0; }
.location-picker input { width:100%; box-sizing:border-box; padding:9px 40px 9px 10px; border:1px solid #d5d6d8; border-radius:10px; font-size:16px; color:inherit; background:transparent; }
.location-picker input::-webkit-search-cancel-button { display:none; -webkit-appearance:none; appearance:none; }
.location-picker .picker-search-clear { position:absolute; top:50%; right:5px; display:grid; width:32px; min-height:32px; height:32px; place-items:center; padding:0; border-radius:50%; color:#55585d; background:transparent; font-size:19px; transform:translateY(-50%); }
.location-picker .picker-search-clear[hidden] { display:none; }
.location-picker .picker-search-clear:active { color:#202225; background:#e7e8ea; }
.picker-map-wrap { position:relative; min-height:140px; flex:1 1 240px; border-radius:14px; overflow:hidden; background:#eeeeef; }
.picker-map { position:absolute; inset:0; }
.location-picker .picker-pin, .chat-location-preview .chat-map-pin { position:absolute; z-index:10; left:50%; top:50%; transform:translate(-50%,-100%); pointer-events:none; color:#303236; font-size:34px; line-height:1; filter:drop-shadow(0 2px 2px #fff); }
.location-picker .picker-locate { position:absolute; right:12px; bottom:30px; z-index:11; background:#fff; box-shadow:0 2px 10px #0002; font-size:20px; padding:9px; }
.picker-results { flex:0 1 auto; max-height:120px; overflow:auto; overscroll-behavior:contain; }
.picker-results:empty { display:none; }
.location-picker .picker-results button { display:block; width:100%; background:transparent; text-align:left; border-bottom:1px solid #e8e8e9; }
.picker-results strong, .picker-results small { display:block; line-height:1.5; }
.picker-results strong { font-size:14px; font-weight:600; }
.picker-results small, .picker-selection small { color:#707277; font-size:12px; }
.picker-selection { flex:0 0 auto; padding:10px 12px; border-radius:12px; background:#00000008; min-height:64px; box-sizing:border-box; }
.picker-selection strong, .picker-selection small { display:block; line-height:1.5; overflow-wrap:break-word; }
.picker-selection strong { font-size:16px; font-weight:650; }
.picker-selection small { font-size:14px; opacity:1; }
.picker-selection .picker-accuracy { margin-top:4px; color:#825522; font-size:12px; }
.picker-selection .picker-accuracy[hidden] { display:none; }
.location-picker .picker-confirm { flex:0 0 auto; background:#303236; color:#fff; }
.location-picker .picker-confirm:disabled { background:#e5e5e7; color:#929499; opacity:1; cursor:not-allowed; }
body.dark-mode .location-picker .picker-confirm:disabled { background:#404145; color:#929499; }
body.dark-mode .location-picker { color:#eee; background:#292a2d; border-color:#505257; }
body.dark-mode .location-picker input { border-color:#5b5d62; }
body.dark-mode .location-picker button:not(.picker-confirm) { background:#3a3b3f; color:#eee; }
body.dark-mode .location-picker .picker-search-clear { color:#c7c9cc; background:transparent; }
body.dark-mode .location-picker .picker-search-clear:active { color:#fff; background:#4b4d51; }
body.dark-mode .location-picker .picker-confirm { color:#202124; background:#e7e8ea; }
body.dark-mode .location-picker .picker-pin, body.dark-mode .chat-location-preview .chat-map-pin { color:#eee; filter:drop-shadow(0 2px 2px #111); }
body.dark-mode .picker-results small, body.dark-mode .picker-selection small { color:#bbb; }
body.dark-mode .picker-selection .picker-accuracy { color:#e1b978; }
@media (max-width:600px) {
  .location-picker { height:min(600px,78dvh); padding:12px; }
}
@media (max-height:500px) {
  .location-picker { height:calc(var(--chat-viewport-height, 100dvh) - 24px); }
}
.chat-location-draft > i { font-size:27px; }
.chat-location-draft button { position:absolute; top:-7px; right:-7px; display:grid; width:23px; height:23px; min-height:23px; place-items:center; padding:0; border:1px solid #ddd; border-radius:50%; color:#4d4650; background:#fff; box-shadow:0 2px 6px #0002; cursor:pointer; }
.chat-location-draft button i { font-size:15px; line-height:1; }
.chat-location-message { margin-bottom:.65rem; white-space:pre-wrap; }
.chat-location-card { display:grid; grid-template-columns:34px minmax(0,1fr) 18px; align-items:center; gap:8px; width:280px; max-width:100%; min-width:0; box-sizing:border-box; overflow:hidden; margin-top:8px; padding:9px 11px 0; border:1px solid rgba(0,0,0,.09); border-radius:13px; color:inherit; background:rgba(255,255,255,.52); text-decoration:none; white-space:normal; transition:transform .15s ease,background-color .15s ease; }
.bubble.location-card-only,
.group-message-row .group-bubble.location-card-only,
body.dark-mode .bubble.location-card-only,
body.dark-mode .group-message-row .group-bubble.location-card-only { padding:0; border:0; background:transparent; box-shadow:none; }
.bubble.location-card-only > .chat-location-card { margin-top:0; }
.chat-location-card:hover { transform:translateY(-1px); background:rgba(255,255,255,.72); }
.chat-location-card > i:first-child { display:grid; width:30px; height:30px; place-items:center; border-radius:9px; color:#fff; background:#303236; font-size:17px; }
.chat-location-card span { display:grid; min-width:0; gap:1px; }
.chat-location-card strong { overflow:hidden; font-size:14px; font-weight:650; text-overflow:ellipsis; white-space:nowrap; }
.chat-location-card small { opacity:.62; font-size:11px; font-weight:400; }
.chat-location-card > .ri-arrow-right-s-line { opacity:.55; font-size:18px; }
.chat-location-card .chat-location-address { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-location-card .chat-location-preview { display:block; position:relative; grid-column:1 / -1; margin:0 -11px; aspect-ratio:2 / 1; overflow:hidden; background:#eaece8; }
.chat-location-preview .chat-location-placeholder { display:flex; position:absolute; inset:0; align-items:center; justify-content:center; padding:12px; color:#697367; font-size:12px; text-align:center; }
.chat-location-preview .chat-location-map-image { position:absolute; inset:0; display:block; width:100%; height:100%; max-height:none; margin:0; border:0; border-radius:0; object-fit:contain; }
.chat-location-preview [hidden] { display:none !important; }
body.dark-mode .chat-location-draft { border-color:#55575b; color:#ddd; background:#37383b; }
body.dark-mode .chat-location-draft button { border-color:#505257; color:#ddd; background:#303135; }
body.dark-mode .chat-location-card { border-color:rgba(255,255,255,.07); background:rgba(255,255,255,.06); }
body.dark-mode .chat-location-card:hover { background:rgba(255,255,255,.1); }
body.dark-mode .chat-location-card > i:first-child { color:#202124; background:#e5e6e8; }
.group-picker { width:min(380px,calc(100vw - 32px)); box-sizing:border-box; margin:auto; padding:18px; border:1px solid var(--account-line); border-radius:22px; background:var(--account-surface); color:var(--account-text); box-shadow:0 24px 70px rgba(0,0,0,.28); }
.mention-picker { display:flex; flex-direction:column; flex:none; width:100%; min-width:0; box-sizing:border-box; margin:0 0 8px; overflow:hidden; color:#323438; }
.mention-picker[hidden] { display:none; }
.mention-picker-list { position:relative; display:flex; gap:6px; min-width:0; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; scrollbar-width:thin; padding:0 0 3px; }
.mention-picker-list button { display:block; flex:0 0 auto; max-width:180px; min-height:44px; padding:5px 12px; border:0; border-radius:12px; color:inherit; background:#f1f1f2; text-align:left; font:inherit; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; cursor:pointer; }
.mention-picker-list button:first-child { margin-inline-start:auto; }
.mention-picker-list button:last-child { margin-inline-end:auto; }
.mention-picker-list button:hover, .mention-picker-list button[aria-selected="true"] { background:#e7e7e9; }
.mention-picker-list button.mention-ai { color:#8f3f9a; background:#f2e9f4; }
.mention-picker-list button.mention-ai:hover, .mention-picker-list button.mention-ai[aria-selected="true"] { background:#e8d8ec; }
.mention-empty { margin-inline:auto; padding:10px 2px; color:#85878c; font-size:13px; }
body.dark-mode .mention-picker { color:#eee; }
body.dark-mode .mention-picker-list button { background:#38393d; }
body.dark-mode .mention-picker-list button:hover, body.dark-mode .mention-picker-list button[aria-selected="true"] { background:#46474b; }
body.dark-mode .mention-picker-list button.mention-ai { color:#e1b2ea; background:#423449; }
body.dark-mode .mention-picker-list button.mention-ai:hover, body.dark-mode .mention-picker-list button.mention-ai[aria-selected="true"] { background:#503d56; }
.group-picker::backdrop { background:rgba(18,18,19,.52); backdrop-filter:blur(3px); }
.group-picker-header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:14px; }
.group-picker-header h3 { margin:0; font-size:1.12rem; line-height:1.35; }
.group-picker-header p { margin:3px 0 0; color:var(--account-muted); font-size:.8rem; }
.group-picker-close { display:grid; place-items:center; flex:0 0 34px; width:34px; height:34px; padding:0; border:0; border-radius:50%; background:var(--account-soft); color:var(--account-soft-text); cursor:pointer; }
.group-picker-close i { font-size:19px; }
.group-picker-list { display:grid; gap:8px; }
.group-picker-option { display:grid; grid-template-columns:38px minmax(0,1fr) 22px; align-items:center; gap:11px; width:100%; margin:0; padding:11px 12px; border:1px solid var(--account-line); border-radius:15px; background:var(--account-field); color:var(--account-text); text-align:left; cursor:pointer; }
.group-picker-option:hover { background:var(--account-soft); }
.group-picker-option.is-current { border-color:#aeb0b4; background:#eeeeef; }
.group-picker-option > i:first-child { display:grid; place-items:center; width:38px; height:38px; border-radius:12px; background:var(--account-soft); color:#45474b; font-size:19px; }
.group-picker-option > span { display:flex; min-width:0; flex-direction:column; }
.group-picker-option strong { overflow:hidden; font-size:.93rem; line-height:1.45; text-overflow:ellipsis; white-space:nowrap; }
.group-picker-option small { color:var(--account-muted); font-size:.72rem; line-height:1.4; }
.group-picker-option > i:last-child { justify-self:end; color:var(--account-muted); font-size:18px; }
body.dark-mode .group-picker-option.is-current { border-color:#66686d; background:#38393c; }
body.dark-mode .group-picker-option > i:first-child { background:#3d3e42; color:#e3e3e3; }

/* A narrow vertical share card; media reserves an aspect-ratio slot before loading. */
.chat-link-preview { display:flex; flex-direction:column; box-sizing:border-box; width:min(276px,calc(100vw - 106px)); max-width:100%; max-height:360px; margin-top:8px; overflow:hidden; border:1px solid rgba(85,101,130,.13); border-radius:14px; background:rgba(255,255,255,.46); box-shadow:0 1px 2px rgba(23,33,46,.035); color:inherit; text-decoration:none; text-align:left; transition:background .18s ease,border-color .18s ease; }
.chat-link-preview[hidden] { display:none !important; }
.chat-link-preview:hover { background:rgba(255,255,255,.65); border-color:rgba(85,101,130,.25); }
.chat-link-copy { display:flex; flex-direction:column; justify-content:flex-start; gap:6px; min-width:0; min-height:68px; box-sizing:border-box; padding:12px 13px 0; overflow:hidden; }
.chat-link-media { display:grid; position:relative; place-items:center; width:calc(100% - 20px); max-height:220px; aspect-ratio:16 / 9; margin:10px 10px 0; overflow:hidden; border-radius:9px; background:rgba(96,111,135,.08); }
.chat-link-preview.chat-link-note { width:min(260px,calc(100vw - 106px)); max-height:310px; border-radius:16px; box-shadow:0 2px 8px rgba(23,33,46,.065); }
@media (min-width:700px) {
  .bubble.chat-link-note-host:not(.chat-link-only),
  .group-message-row .group-bubble.chat-link-note-host:not(.chat-link-only) {
    max-width:min(320px,100%);
  }
}
.bubble.chat-link-only > .chat-link-preview.chat-link-note { width:min(260px,calc(100vw - 106px)); }
.chat-link-note .chat-link-media { order:-1; width:100%; max-height:198px; aspect-ratio:4 / 3; margin:0; border-radius:0; background:rgba(96,111,135,.045); }
.chat-link-note .chat-link-copy { min-height:0; padding:10px 12px 0; gap:0; }
.chat-link-note .chat-link-title { font-size:14px; font-weight:700; line-height:19px; }
.chat-link-note .chat-link-visual { object-fit:contain; }
.chat-link-note .chat-link-footer { min-height:29px; padding:7px 12px 10px; }
.chat-link-placeholder { color:#8791a0; font-size:28px; opacity:.6; }
.chat-link-placeholder[hidden] { display:none; }
.chat-link-visual { display:block; position:absolute; inset:0; width:100%; height:100%; object-fit:contain; opacity:0; transition:opacity .18s ease; }
.chat-link-visual.is-loaded { opacity:1; }
.chat-link-video-play { display:grid; position:absolute; z-index:2; left:50%; top:50%; width:38px; height:38px; place-items:center; border-radius:50%; background:rgba(0,0,0,.62); box-shadow:0 2px 9px rgba(0,0,0,.2); color:#fff; font-size:23px; transform:translate(-50%,-50%); }
.chat-link-video-duration { position:absolute; z-index:2; right:7px; bottom:7px; padding:2px 5px; border-radius:4px; background:rgba(0,0,0,.7); color:#fff; font-size:11px; line-height:15px; }
.chat-link-footer { display:flex; align-items:center; gap:6px; min-width:0; min-height:32px; box-sizing:border-box; padding:7px 12px 9px; overflow:hidden; }
.chat-link-brand-icon { display:block; width:16px; height:16px; flex:none; border-radius:3px; object-fit:contain; }
.chat-link-brand-fallback { display:grid; place-items:center; background:rgba(96,111,135,.14); color:#606d7e; font-size:12px; font-weight:700; line-height:1; }
.chat-link-brand-fallback .ri-global-line { font-size:13px; }
.chat-link-brand-xhs { background:#e73f5c; color:#fff; font-size:11px; }
.chat-link-brand-x { background:#111; color:#fff; font-size:13px; }
body.dark-mode .chat-link-brand-fallback:not(.chat-link-brand-xhs):not(.chat-link-brand-x) { background:rgba(255,255,255,.14); color:#c4cbd5; }
.bubble.chat-link-only,
.group-message-row .group-bubble.chat-link-only,
body.dark-mode .bubble.chat-link-only,
body.dark-mode .group-message-row .group-bubble.chat-link-only { width:fit-content; min-width:0; max-width:min(276px,calc(100vw - 106px)); padding:0; border:0; background:transparent; box-shadow:none; }
.bubble.chat-link-only > .chat-link-preview { width:min(276px,calc(100vw - 106px)); max-width:100%; margin-top:0; }
.chat-link-site { overflow:hidden; color:#727986; font-size:11px; line-height:17px; text-overflow:ellipsis; white-space:nowrap; }
.chat-link-title { display:-webkit-box; overflow:hidden; font-size:15px; font-weight:650; line-height:21px; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.chat-link-description { display:-webkit-box; overflow:hidden; color:#6e7682; font-size:12px; line-height:17px; overflow-wrap:anywhere; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.bubble.chat-link-source-compact > .chat-link-preview { margin-top:6px; }
.group-message-row.self .chat-link-preview,.private-message-row.user .chat-link-preview { border-color:#bdd8f2; background:rgba(223,240,255,.76); }
.group-message-row.self .chat-link-preview:hover,.private-message-row.user .chat-link-preview:hover { background:rgba(223,240,255,.9); }
body.dark-mode .chat-link-preview { border-color:rgba(255,255,255,.08); background:rgba(255,255,255,.075); box-shadow:none; }
body.dark-mode .chat-link-preview:hover { background:rgba(255,255,255,.11); }
body.dark-mode .group-message-row.self .chat-link-preview,body.dark-mode .private-message-row.user .chat-link-preview { border-color:rgba(133,179,235,.27); background:rgba(69,108,157,.29); }
body.dark-mode .group-message-row.self .chat-link-preview:hover,body.dark-mode .private-message-row.user .chat-link-preview:hover { background:rgba(69,108,157,.39); }
body.dark-mode .chat-link-site,body.dark-mode .chat-link-description { color:#aeb3bd; }
/* Account/admin palette mirrors the existing monochrome chat chrome.
   Light: #f4f4f4 canvas, white bubbles, #dff0ff user bubbles.
   Dark: #1e1e1e canvas, #2c2c2c chrome, #333 bubbles, #336699 users.
   Purple is reserved for AI identity and does not color generic controls. */
.account-ui {
  --account-bg: #f4f4f4; --account-surface: #fff; --account-chrome: #fff; --account-field: #fff;
  --account-text: #000; --account-muted: #666; --account-line: #eee; --account-input-line: #ccc;
  --account-accent: #303236; --account-accent-text: #fff;
  --account-soft: #eee; --account-soft-text: #666;
  --account-user-bg: #dff0ff; --account-user-text: #000; --account-link: #496fbd;
  --account-danger-bg: #fcecef; --account-danger: #a62d49; --account-danger-line: #edc2cc;
  --account-danger-strong: #b53552; --account-scrollbar: #aaa;
  --account-shadow: 0 1px 4px rgba(0, 0, 0, .1);
  color: var(--account-text); color-scheme: light;
  font: 400 15px/1.6 "Helvetica Neue", sans-serif;
}
body.dark-mode .account-ui, .account-ui.dark-mode {
  --account-bg: #1e1e1e; --account-surface: #333; --account-chrome: #2c2c2c; --account-field: #2c2c2c;
  --account-text: #eaeaea; --account-muted: #aaa; --account-line: #444; --account-input-line: #555;
  --account-soft: #1a1a1a; --account-soft-text: #aaa;
  --account-accent: #e7e8ea; --account-accent-text: #202124;
  --account-user-bg: #336699; --account-user-text: #fff; --account-link: #91b9ff;
  --account-danger-bg: #3a252b; --account-danger: #f1a7b7; --account-danger-line: #75454c;
  --account-scrollbar: #666; --account-shadow: 0 1px 4px rgba(0, 0, 0, .2);
  color-scheme: dark;
}
.account-ui *, .account-ui *::before, .account-ui *::after { box-sizing: border-box; }
.account-ui .account-button {
  display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
  min-height: 40px; border: 1px solid transparent; border-radius: 12px;
  padding: .55rem .85rem; font: inherit; font-weight: 600;
  font-size: 14px; line-height: 1.4; text-decoration: none; cursor: pointer;
  background: var(--account-soft); color: var(--account-soft-text);
}
.account-ui .account-button.primary { background: var(--account-accent); color: var(--account-accent-text); }
.account-ui .account-button.control-entry { background: var(--account-accent); color: var(--account-accent-text); }
.account-ui .account-button.danger { background: var(--account-danger-bg); color: var(--account-danger); }
.account-ui .account-button:hover:not(:disabled) { filter: brightness(.96); }
.account-ui .account-button:disabled { cursor: not-allowed; opacity: .5; }
.account-password-dialog { width:min(420px,calc(100% - 32px)); }
.account-password-form { display:grid; gap:14px; margin-top:16px; }
.account-password-form label { display:grid; gap:6px; color:var(--account-text); font-size:14px; }
.account-password-form input { width:100%; min-width:0; padding:11px 12px; border:1px solid var(--account-input-line); border-radius:12px; font:inherit; font-size:16px; color:var(--account-text); background:var(--account-field); }
.account-password-form [role="status"] { margin:0; padding:0; border:0; font-size:13px; color:var(--account-muted); }
.account-password-form [role="status"]:empty { display:none; }
.account-ui :is(button, a, input, textarea, summary, select):focus-visible { outline: 2px solid var(--account-accent); outline-offset: 3px; }
.account-ui [hidden] { display: none !important; }
.account-ui .memory-editor { padding-top: 18px; border-top: 1px solid var(--account-line); margin-top: 18px; }
.account-ui .memory-label { display: block; margin: 0 0 5px; font-size: 15px; font-weight: 650; }
.account-ui .memory-note, .account-ui .account-help p {
  margin: 0 0 12px; color: var(--account-muted); font-size: 13px; line-height: 1.7;
}
.account-ui .memory-input {
  display: block; width: 100%; min-width: 0; min-height: 128px; max-height: 360px; resize: vertical;
  margin: 0; border: 1px solid var(--account-input-line); border-radius: 12px; padding: 12px;
  background: var(--account-field); color: var(--account-text); font: inherit; font-size: 14px; line-height: 1.7;
}
.account-ui .memory-input::placeholder { color: var(--account-muted); opacity: 1; }
.account-ui .memory-footer { display: flex; align-items: baseline; gap: 12px; margin: 8px 0 12px; font-size: 12px; color: var(--account-muted); }
.account-ui .memory-status { flex: 1; overflow-wrap: anywhere; }
.account-ui .memory-count { flex: none; font-variant-numeric: tabular-nums; }
.account-ui .memory-editor[data-state="error"] .memory-status,
.account-ui .memory-editor[data-state="conflict"] .memory-status { color: var(--account-danger); }
.account-ui .memory-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.account-ui .memory-remote { margin-top: 14px; padding: 12px; border: 1px solid var(--account-line); border-radius: 12px; }
.account-ui .memory-remote .account-button { margin-top: 10px; }
.account-ui .account-help { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--account-line); }
.account-ui .account-help summary { cursor: pointer; color: var(--account-muted); font-size: 13px; }
.account-ui .account-help dl { margin: 12px 0 0; font-size: 13px; }
.account-ui .account-help dt { margin: 10px 0 2px; font-weight: 600; }
.account-ui .account-help dd { margin: 0; color: var(--account-muted); line-height: 1.7; }
.account-ui #client-usage-help > dl {
  max-height: min(360px, 42vh);
  max-height: min(360px, 42dvh);
  overflow-y: auto;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--account-scrollbar) transparent;
  padding-right: 10px;
}
.account-ui #client-usage-help > dl::-webkit-scrollbar { width: 5px; }
.account-ui #client-usage-help > dl::-webkit-scrollbar-thumb { background: var(--account-scrollbar); border-radius: 5px; }
@media (max-width: 480px) {
  .account-ui .account-button { min-height: 44px; }
  .account-ui .memory-input { font-size: 16px; } /* Avoid iOS focus zoom. */
}
.attachment-composer, .attachment-list, .attachment-viewer { --at-bg:#fff; --at-panel:#f4f4f4; --at-text:#333; --at-muted:#666; --at-border:#ddd; --at-accent:#496fbd; color:var(--at-text); font:inherit; }
body.dark-mode .attachment-composer, body.dark-mode .attachment-list, body.dark-mode .attachment-viewer { --at-bg:#333; --at-panel:#2c2c2c; --at-text:#eee; --at-muted:#bbb; --at-border:#555; --at-accent:#91b9ff; }
.attachment-composer[hidden], .attachment-composer [hidden] { display:none!important; }
.attachment-drafts, .attachment-list { display:flex; gap:12px; max-width:100%; min-width:0; }
.attachment-drafts { overflow-x:auto; padding:9px 9px 7px 2px; }
.attachment-draft { position:relative; display:block; box-sizing:border-box; flex:0 0 64px; width:64px; height:64px; padding:0; border:1px solid var(--at-border); border-radius:13px; overflow:visible; background:var(--at-bg); box-shadow:0 2px 8px #0000000d; }
.attachment-draft.image-draft { flex-basis:96px; width:96px; height:96px; }
.attachment-thumb { display:block; width:100%; height:100%; object-fit:cover; border-radius:12px; background:var(--at-panel); }
.attachment-draft-placeholder { position:absolute; inset:0; display:none; place-items:center; border-radius:12px; color:var(--at-muted); background:var(--at-panel); font-size:12px; }
.attachment-draft.is-loading .attachment-thumb, .attachment-draft.is-error .attachment-thumb { visibility:hidden; }
.attachment-draft.is-loading .attachment-draft-placeholder, .attachment-draft.is-error .attachment-draft-placeholder { display:grid; }
.attachment-draft.is-loading .attachment-draft-placeholder { font-size:0; }
.attachment-draft.is-loading .attachment-draft-placeholder::after { content:""; width:18px; height:18px; border:2px solid color-mix(in srgb, var(--at-muted) 28%, transparent); border-top-color:var(--at-muted); border-radius:50%; animation:attachment-spin .8s linear infinite; }
.attachment-file-icon { width:62px; height:62px; border-radius:11px; background:var(--at-panel); }
.attachment-file-icon { display:grid; place-items:center; font:600 11px/1 monospace; color:var(--at-muted); }
.attachment-info { display:flex; flex-direction:column; gap:4px; min-width:0; flex:1; text-align:left; }
.attachment-name { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; font-weight:500; line-height:1.4; color:var(--at-text); }
.attachment-meta { font-size:12px; line-height:1.5; color:var(--at-muted); }
.attachment-composer .attachment-remove { position:absolute; top:-8px; right:-8px; z-index:1; display:grid; place-items:center; border:2px solid var(--at-bg); border-radius:50%; color:#fff; background:#2b2b2d; font-size:16px; line-height:1; width:26px; height:26px; min-height:26px; padding:0; cursor:pointer; box-shadow:0 2px 7px #0004; -webkit-appearance:none; appearance:none; }
.attachment-composer .attachment-remove:hover { background:#111; transform:translateY(-1px); }
.attachment-composer .attachment-remove:active { transform:scale(.93); }
.attachment-remove i, .attachment-viewer-close i { display:block; line-height:1; }
.attachment-remove:disabled { opacity:.4; cursor:default; }
.attachment-error { color:#b4233a; font-size:13px; line-height:1.5; margin:4px 0 8px; }
body.dark-mode .attachment-error { color:#ff9ba8; }
body.dark-mode .attachment-composer .attachment-remove { border-color:var(--at-bg); color:#222; background:#f1f1f1; }
body.dark-mode .attachment-composer .attachment-remove:hover { background:#fff; }
.attachment-list { flex-wrap:wrap; margin-top:10px; }
.attachment-card { flex:0 1 230px; min-width:0; max-width:100%; border:1px solid var(--at-border); border-radius:12px; overflow:hidden; background:var(--at-bg); }
.attachment-card.image-only { position:relative; flex-basis:auto; width:fit-content; box-sizing:border-box; padding:8px; border:1px solid var(--at-border); border-radius:12px; background:var(--message-bubble-fill,var(--at-bg)); box-shadow:0 2px 6px rgba(0,0,0,.045); overflow:visible; }
.bubble.user .attachment-card.image-only, .group-message-row.self .attachment-card.image-only { border-color:#c8dff4; background:#dff0ff; }
body.dark-mode .bubble.user .attachment-card.image-only, body.dark-mode .group-message-row.self .attachment-card.image-only { border-color:#3d668e; background:#315f8c; }
.attachment-card.voice-only { flex:0 0 auto; border:0; overflow:visible; background:transparent; }
.bubble.voice-message-bubble, .group-message-row .group-bubble.voice-message-bubble { padding:0; border:0; background:transparent; box-shadow:none; overflow:visible; }
.bubble.voice-message-bubble .attachment-list { display:block; margin:0; }
.bubble.voice-message-bubble .attachment-card { margin:0; }
.attachment-voice-wrap { display:flex; flex-direction:column; align-items:stretch; box-sizing:border-box; width:min(var(--voice-message-width, 160px), 70vw); max-width:280px; overflow:hidden; border:1px solid #e5dfe7; border-radius:8px 17px 17px 17px; color:#343036; background:#fff; box-shadow:0 2px 8px rgba(48,32,51,.065); }
.attachment-voice { display:flex; align-items:center; gap:11px; width:100%; min-height:48px; box-sizing:border-box; border:0; border-radius:inherit; outline:0; padding:9px 13px; color:inherit; background:transparent; font:inherit; cursor:pointer; user-select:none; -webkit-user-select:none; touch-action:manipulation; -webkit-appearance:none; appearance:none; -webkit-tap-highlight-color:transparent; }
.attachment-voice:focus-visible { outline:0; box-shadow:inset 0 0 0 2px rgba(70,72,76,.28); }
.bubble.user.voice-message-bubble .attachment-voice-wrap, .group-message-row.self .voice-message-bubble .attachment-voice-wrap { border-color:#c8dff4; border-radius:17px 8px 17px 17px; background:#dff0ff; }
.bubble.user.voice-message-bubble .attachment-voice, .group-message-row.self .voice-message-bubble .attachment-voice { flex-direction:row-reverse; }
.bubble.user.voice-message-bubble .attachment-voice-wrap, .group-message-row.self .voice-message-bubble .attachment-voice-wrap { align-items:flex-end; }
.group-message-row.ai .voice-message-bubble .attachment-voice-wrap { border-color:#dbc9df; background:#f4edf6; }
.attachment-voice-wave { display:flex; flex:1 1 auto; align-items:center; justify-content:center; gap:2.5px; min-width:54px; height:24px; color:currentColor; opacity:.55; }
.attachment-voice-wave-bar { display:block; width:2.5px; height:var(--voice-wave-height); border-radius:999px; background:currentColor; transform-origin:center; }
.attachment-voice.is-playing .attachment-voice-wave-bar { animation:attachment-voice-wave .72s ease-in-out infinite alternate; }
.attachment-voice.is-playing .attachment-voice-wave-bar:nth-child(2n) { animation-delay:-.38s; }
.attachment-voice.is-playing .attachment-voice-wave-bar:nth-child(3n) { animation-delay:-.18s; }
.attachment-voice.can-transcribe { -webkit-touch-callout:none; }
.attachment-voice.is-transcribing .attachment-voice-wave-bar { animation:attachment-voice-wave .58s ease-in-out infinite alternate; }
.attachment-voice-wrap.is-invalid .attachment-voice { opacity:.42; cursor:default; }
.attachment-voice-error { opacity:.66; }
.attachment-voice-duration { flex:0 0 auto; min-width:22px; text-align:center; font-size:13px; font-weight:500; opacity:.68; }
.attachment-voice-transcript { align-self:stretch; box-sizing:border-box; margin:0 12px; padding:9px 1px 11px; border-top:1px solid rgba(70,55,73,.12); color:inherit; font-size:14px; line-height:1.55; text-align:left; white-space:pre-wrap; overflow-wrap:anywhere; }
body.dark-mode .attachment-voice-wrap { border-color:transparent; color:#f4f1f5; background:#333; box-shadow:0 2px 9px rgba(0,0,0,.22); }
body.dark-mode .bubble.user.voice-message-bubble .attachment-voice-wrap, body.dark-mode .group-message-row.self .voice-message-bubble .attachment-voice-wrap { border-color:#3d668e; background:#315f8c; }
body.dark-mode .group-message-row.ai .voice-message-bubble .attachment-voice-wrap { border-color:#664e6b; background:#3b303e; }
@keyframes attachment-voice-wave { to { transform:scaleY(.45); opacity:.5; } }
.attachment-card .attachment-info { padding:10px 12px; }
.attachment-card a.attachment-name { color:var(--at-accent); background:none; text-decoration:underline; padding:0; border:0; border-radius:0; }
.attachment-image-frame { position:relative; display:block; box-sizing:border-box; width:min(260px, 62vw, calc(320px * var(--attachment-image-ratio, 1.3333)), calc(48vh * var(--attachment-image-ratio, 1.3333))); height:auto; aspect-ratio:var(--attachment-image-ratio, 1.3333); max-width:100%; overflow:hidden; overflow-anchor:none; border:1px solid color-mix(in srgb, var(--at-border) 72%, transparent); border-radius:0; background:linear-gradient(135deg, var(--at-panel), color-mix(in srgb, var(--at-panel) 72%, var(--at-bg))); }
/* Display the original rectangular image; native callouts own their preview shape. */
.attachment-image { position:absolute; inset:0; display:block; width:100%; max-width:100%; height:100%; max-height:100%; object-fit:contain; border-radius:0; cursor:zoom-in; -webkit-touch-callout:default; }
.attachment-image-placeholder { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; width:100%; min-height:100%; border:0; padding:16px; color:var(--at-muted); background:transparent; font:inherit; font-size:13px; font-weight:500; line-height:1.45; cursor:default; }
.attachment-image-placeholder i { font-size:28px; font-weight:400; }
.attachment-image-frame.is-deferred .attachment-image, .attachment-image-frame.is-loading .attachment-image, .attachment-image-frame.is-error .attachment-image { visibility:hidden; }
.attachment-image-frame.is-loaded { border-color:transparent; background:transparent; }
.bubble.image-message-bubble { padding:0!important; border:0!important; background:transparent!important; box-shadow:none!important; overflow:visible; }
.bubble.image-message-bubble .attachment-list { margin-top:0; }
.bubble.image-message-bubble::after { display:none!important; }
.bubble.split-image-message { display:flex; flex-direction:column; align-items:flex-start; gap:8px; white-space:normal; padding:0!important; border:0!important; background:transparent!important; box-shadow:none!important; overflow:visible; }
.bubble.user.split-image-message, .group-message-row.self .bubble.split-image-message { align-items:flex-end; }
.bubble.split-image-message .attachment-list { display:flex; flex-direction:column; flex-wrap:nowrap; margin:0; gap:8px; }
.bubble.user.split-image-message .attachment-list, .group-message-row.self .split-image-message .attachment-list { align-items:flex-end; margin-left:auto; }
.split-image-message .message-text-card { white-space:pre-wrap; }
.message-text-card > :first-child { margin-top:0; }
.message-text-card > :last-child { margin-bottom:0; }
.bubble.split-image-message::after { display:none!important; }
.message-text-card { width:fit-content; max-width:100%; box-sizing:border-box; padding:.68rem .9rem; border:1px solid #e7e0e9; border-radius:20px; background:var(--message-bubble-fill,#fff); box-shadow:0 2px 9px rgba(48,32,51,.06); }
.bubble.user .message-text-card { background:#dff0ff; border-color:#c8dff4; }
body.dark-mode .message-text-card { background:var(--message-bubble-fill,#333); border-color:#ffffff0b; }
body.dark-mode .bubble.user .message-text-card { background:#336699; border-color:#3d668e; }
.split-image-message .attachment-list, .image-message-bubble .attachment-list { width:fit-content; max-width:100%; box-sizing:border-box; }
.bubble-wrapper.user .message-text-card { margin-left:auto; }
.attachment-image-frame.is-loaded .attachment-image-placeholder { display:none; }
.attachment-image-frame.is-loading .attachment-image-placeholder i { animation:attachment-pulse 1.25s ease-in-out infinite; }
.attachment-image-frame.is-deferred .attachment-image-placeholder { cursor:pointer; }
.attachment-image-frame.is-error .attachment-image-placeholder { cursor:pointer; }
.attachment-image-frame.is-error .attachment-image-placeholder:hover { color:var(--at-text); background:color-mix(in srgb, var(--at-panel) 72%, transparent); }
@keyframes attachment-spin { to { transform:rotate(360deg); } }
@keyframes attachment-pulse { 50% { opacity:.42; transform:scale(.94); } }
@media (prefers-reduced-motion:reduce) { .attachment-draft.is-loading .attachment-draft-placeholder::after, .attachment-image-frame.is-loading .attachment-image-placeholder i { animation:none; } }
.attachment-viewer { position:fixed; inset:0; z-index:10020; display:block; box-sizing:border-box; overflow:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; color:#fff; background:rgba(12,12,13,.94); transition:background-color 180ms ease-out; }
.attachment-viewer[hidden] { display:none!important; }
.attachment-viewer-stage { display:flex; flex-direction:column; align-items:center; justify-content:flex-start; box-sizing:border-box; width:100%; min-height:100%; padding:max(18px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); }
.attachment-viewer-image { display:block; flex:0 0 auto; width:auto; height:auto; max-width:100%; max-height:none; margin-block:auto; object-fit:contain; border-radius:0; -webkit-touch-callout:default; touch-action:pan-y pinch-zoom; }
.attachment-viewer .attachment-viewer-image { -webkit-touch-callout:default!important; -webkit-user-select:auto!important; user-select:auto!important; }
.attachment-viewer-return-image { position:fixed; z-index:10021; display:block; object-fit:contain; transform-origin:top left; pointer-events:none; }
/* Desktop previews fit both axes; a portrait screenshot must not fill the width. */
@media (min-width:768px) {
  .attachment-viewer-stage { height:100vh; height:100dvh; min-height:0; justify-content:center; padding:32px 64px; }
  .attachment-viewer-image { max-width:min(100%, 1100px); max-height:calc(100vh - 64px); max-height:calc(100dvh - 64px); margin:0; }
}
.attachment-image, .attachment-image-frame { -webkit-tap-highlight-color:transparent; }
.attachment-image:focus:not(:focus-visible) { outline:none; box-shadow:none; }
.attachment-image,
.bubble[data-message-menu-bound="true"] .attachment-image { -webkit-touch-callout:default!important; -webkit-user-select:none!important; user-select:none!important; }
.attachment-composer button:focus-visible, .attachment-list a:focus-visible, .attachment-image:focus-visible, .attachment-image-placeholder:focus-visible { outline:2px solid #55585d; outline-offset:2px; }
#control-attachment-preview { grid-column:1 / -1; min-width:0; }
#control-form .control-upload.disabled { opacity:.5; cursor:default; }
body #chat-container { margin-bottom:calc(var(--composer-height, 4.5rem) + 12px); }
@media(max-width:600px) { .attachment-draft.image-draft { flex-basis:88px; width:88px; height:88px; } .attachment-list { gap:8px; } }
/* Shared dialog chrome; feature styles only control their content and sizing. */
.maizi-dialog { margin:auto; color:#202124; }
.maizi-dialog::backdrop { background:rgba(24,25,27,.4); backdrop-filter:blur(5px); }
.maizi-dialog :is(.dialog-heading,.search-heading,.picker-heading) { position:static; inset:auto; height:auto; z-index:auto; display:flex; flex:0 0 auto; align-items:center; justify-content:space-between; gap:14px; background:transparent; }
.maizi-dialog :is(.dialog-heading,.search-heading,.picker-heading) > div { min-width:0; }
.maizi-dialog :is(.dialog-heading,.search-heading,.picker-heading) strong { font-size:18px; font-weight:650; line-height:1.5; }
.maizi-dialog :is(.dialog-heading,.search-heading,.picker-heading) small { display:block; font-size:12px; color:#5f6368; line-height:1.5; margin-top:3px; }
.maizi-dialog .dialog-heading:focus { outline:none; }
.maizi-dialog :is(.dialog-close,.search-close,.picker-close) { display:grid; place-items:center; flex:0 0 36px; width:36px; height:36px; min-width:36px; max-width:36px; min-height:36px; box-sizing:border-box; padding:0; border:0; border-radius:50%; color:#34363a; background:#e5e6e8; font-size:22px; line-height:1; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.maizi-dialog :is(.dialog-close,.search-close,.picker-close):focus { outline:none; box-shadow:none; }
.maizi-dialog :is(.dialog-close,.search-close,.picker-close):focus-visible { outline:2px solid #55585d; outline-offset:2px; }
.maizi-dialog :is(.dialog-close,.search-close,.picker-close):active { background:#d9dade; }
body.dark-mode .maizi-dialog { color:#eee; }
body.dark-mode .maizi-dialog :is(.dialog-heading,.search-heading,.picker-heading) small { color:#aaa; }
body.dark-mode .maizi-dialog :is(.dialog-close,.search-close,.picker-close) { color:#eee; background:#3b3b3b; }