.messages {
      width: min(100%, 820px);
      margin: 0 auto;
      position: relative;
      min-height: 0;
      overflow: auto;
      padding: 12px 16px 26px;
      display: flex;
      flex-direction: column;
      gap: 18px;
      scroll-behavior: auto;
      overflow-anchor: none;
      -webkit-overflow-scrolling: touch;
      overscroll-behavior: contain;
      scrollbar-width: thin;
      scrollbar-color: rgba(93, 91, 137, .20) transparent;
    }
    .presence-stage {
      min-height: 100%;
      flex: 1 0 auto;
      position: relative;
      display: grid;
      align-content: center;
      justify-items: center;
      padding: 26px 0 40px;
      overflow: hidden;
    }
    .messages.has-conversation .presence-stage { display: none; }
    .presence-art {
      width: min(94vw, 470px);
      height: clamp(210px, 35vh, 330px);
      position: relative;
      margin-bottom: -34px;
      pointer-events: none;
      opacity: .82;
    }
    .presence-image {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
      object-position: 56% 40%;
      mix-blend-mode: multiply;
      filter: saturate(.30) contrast(.95);
      -webkit-mask-image: radial-gradient(ellipse 74% 85% at 58% 43%, #000 0, #000 28%, rgba(0,0,0,.92) 38%, rgba(0,0,0,.48) 50%, rgba(0,0,0,.12) 62%, transparent 72%);
      mask-image: radial-gradient(ellipse 74% 85% at 58% 43%, #000 0, #000 28%, rgba(0,0,0,.92) 38%, rgba(0,0,0,.48) 50%, rgba(0,0,0,.12) 62%, transparent 72%);
    }
    .presence-copy {
      position: relative;
      z-index: 2;
      max-width: 430px;
      padding: 0 24px;
      text-align: center;
    }
    .presence-kicker {
      margin: 0 0 10px;
      color: var(--aura);
      font-size: 10px;
      font-weight: 650;
      letter-spacing: .26em;
    }
    .presence-copy h1 {
      margin: 0;
      font-size: clamp(27px, 8vw, 38px);
      font-weight: 430;
      letter-spacing: -.045em;
      line-height: 1.18;
    }
    .presence-copy p:last-child {
      margin: 12px auto 0;
      color: var(--mist);
      font-size: 13px;
      line-height: 1.65;
    }
    .bubble {
      flex: 0 0 auto;
      min-width: 0;
      max-width: min(86%, 720px);
      padding: 0;
      border: 0;
      background: transparent;
      box-shadow: none;
      font-size: 15px;
      line-height: 1.72;
      overflow-wrap: anywhere;
      white-space: pre-wrap;
    }
    .messages > .process-card,
    .messages > .presence-stage {
      flex: 0 0 auto;
    }
    .bubble.assistant {
      align-self: flex-start;
      position: relative;
      min-height: 50px;
      padding: 26px 2px 3px 51px;
      color: var(--ink);
    }
    .bubble.assistant::before {
      width: 38px;
      height: 38px;
      position: absolute;
      top: 2px;
      left: 0;
      display: grid;
      place-items: center;
      content: attr(data-speaker-glyph);
      border: 1px solid rgba(37, 57, 52, .10);
      border-radius: 50%;
      color: var(--brain-ink, var(--aura-deep));
      background: linear-gradient(145deg, rgba(255,255,252,.92), var(--brain-color, rgba(109,108,137,.14)));
      font-size: 11px;
      font-weight: 700;
    }
    .bubble.assistant[data-speaker-id="baize"]::before {
      content: "";
      background: url('/assets/assets/baize/baize_family_ai_living_upward_avatar_20260622.png') 58% 44% / 138% auto no-repeat;
      box-shadow: 0 5px 16px rgba(41, 42, 53, .10);
    }
    .bubble.assistant.waiting .message-rich-text {
      color: var(--ink-soft);
    }
    .bubble.assistant.waiting .message-rich-text::after {
      content: "···";
      margin-left: 6px;
      color: var(--mist);
      letter-spacing: .12em;
    }
    .bubble.assistant::after {
      position: absolute;
      top: 1px;
      left: 51px;
      content: attr(data-speaker-label);
      color: var(--brain-ink, var(--aura));
      font-size: 10.5px;
      font-weight: 650;
      letter-spacing: .06em;
    }
    .bubble.owner {
      align-self: flex-end;
      position: relative;
      margin-right: 46px;
      padding: 11px 15px;
      border-radius: 19px 19px 6px 19px;
      background: #24242b;
      color: #f9faf7;
    }
    .bubble.owner::after {
      width: 38px;
      height: 38px;
      position: absolute;
      right: -46px;
      bottom: 0;
      display: grid;
      place-items: center;
      overflow: hidden;
      content: attr(data-owner-initial);
      border: 1px solid rgba(72, 72, 96, .16);
      border-radius: 50%;
      color: var(--aura-deep);
      background-color: rgba(255,255,252,.82);
      background-image: var(--owner-avatar, none);
      background-position: center;
      background-size: cover;
      font-size: 11px;
      font-weight: 680;
    }
    .message-text { display: block; white-space: pre-wrap; }
    .message-rich-text {
      display: grid; gap: 12px; min-width: 0; overflow-wrap: anywhere;
      white-space: normal;
    }
    .message-rich-text p,
    .message-rich-text h3,
    .message-rich-text h4,
    .message-rich-text h5,
    .message-rich-text ul,
    .message-rich-text ol,
    .message-rich-text blockquote { margin: 0; }
    .message-rich-text p { white-space: pre-wrap; color: var(--ink-soft); }
    .message-rich-text > p:first-child { color: var(--ink); font-weight: 620; }
    .message-rich-text h3,
    .message-rich-text h4,
    .message-rich-text h5 { color: var(--ink); line-height: 1.32; }
    .message-rich-text h3 {
      position: relative; padding: 2px 0 2px 11px; font-size: 17px;
      letter-spacing: -.015em;
    }
    .message-rich-text h3::before {
      width: 3px; position: absolute; inset: 3px auto 3px 0; content: "";
      border-radius: 999px; background: linear-gradient(180deg, #6984bc, #8994c7);
    }
    .message-rich-text h4 { font-size: 15px; }
    .message-rich-text h5 { font-size: 14px; }
    .message-rich-text ul,
    .message-rich-text ol { padding-left: 0; display: grid; gap: 7px; }
    .message-rich-text ul { list-style: none; }
    .message-rich-text ul li { position: relative; padding-left: 18px; }
    .message-rich-text ul li::before {
      width: 6px; height: 6px; position: absolute; top: .72em; left: 2px;
      content: ""; border-radius: 50%; background: #7188b8;
    }
    .message-rich-text ol { list-style: none; counter-reset: baize-step; }
    .message-rich-text ol li {
      min-width: 0; display: grid; grid-template-columns: 24px minmax(0, 1fr);
      align-items: start; column-gap: 8px; counter-increment: baize-step;
    }
    .message-rich-text ol li::before {
      width: 22px; height: 22px; display: grid; place-items: center;
      content: counter(baize-step); border-radius: 8px; color: #506a9d;
      background: rgba(72, 103, 161, .09); font-size: 11px; font-weight: 760;
    }
    .message-rich-text blockquote {
      padding: 10px 12px; border-left: 3px solid rgba(58, 93, 161, .58);
      border-radius: 0 10px 10px 0; white-space: pre-wrap;
      color: var(--ink-soft); background: rgba(72, 103, 161, .07);
    }
    .message-rich-text a { color: #345b9f; text-underline-offset: 2px; }
    .message-rich-text :not(pre) > code {
      padding: 2px 5px; border-radius: 6px; color: #7a3153;
      background: rgba(115, 74, 102, .08); font: 0.88em/1.45 ui-monospace, SFMono-Regular, Consolas, monospace;
    }
    .message-result-actions {
      margin-top: 8px; display: flex; align-items: center; gap: 6px;
      opacity: .68; transition: opacity 140ms ease;
    }
    .bubble.assistant:hover .message-result-actions,
    .bubble.assistant:focus-within .message-result-actions { opacity: 1; }
    .message-result-action {
      min-height: 30px; padding: 4px 9px; border: 1px solid rgba(47, 48, 58, .12);
      border-radius: 999px; color: var(--ink-soft); background: rgba(255,255,252,.64);
      font: inherit; font-size: 11px; font-weight: 650; cursor: pointer;
    }
    .message-result-action:hover { background: rgba(255,255,252,.96); }
    .message-result-action:focus-visible { outline: 2px solid rgba(72,103,161,.55); outline-offset: 2px; }
    .message-code-card {
      min-width: 0; overflow: hidden; border: 1px solid rgba(31,32,40,.13);
      border-radius: 14px; color: #e9edf5; background: #202127;
      box-shadow: 0 8px 24px rgba(30,31,38,.08);
    }
    .message-code-toolbar {
      min-height: 38px; padding: 6px 8px 6px 12px; display: flex;
      align-items: center; justify-content: space-between; gap: 10px;
      color: #bfc6d3; background: #292b32; font-size: 11px;
    }
    .message-code-actions { display: flex; gap: 5px; }
    .message-code-card .message-result-action {
      min-height: 26px; padding: 3px 8px; border-color: rgba(255,255,255,.13);
      color: #e8ebf2; background: rgba(255,255,255,.07);
    }
    .message-code-card pre {
      max-width: 100%; margin: 0; padding: 14px; overflow: auto;
      white-space: pre; tab-size: 2; -webkit-overflow-scrolling: touch;
    }
    .message-code-card code { font: 12px/1.62 ui-monospace, SFMono-Regular, Consolas, monospace; }
    .message-table-wrap {
      max-width: min(78vw, 720px); overflow: auto; border: 1px solid rgba(31,32,40,.1);
      border-radius: 12px; background: rgba(255,255,252,.62); -webkit-overflow-scrolling: touch;
    }
    .message-table-wrap table { min-width: 100%; border-collapse: collapse; font-size: 12px; }
    .message-table-wrap th,
    .message-table-wrap td { padding: 8px 10px; border-bottom: 1px solid rgba(31,32,40,.08); text-align: left; }
    .message-table-wrap th { color: var(--ink); background: rgba(72,103,161,.07); font-weight: 720; }
    .message-table-wrap tr:last-child td { border-bottom: 0; }
    .message-attachments { display: grid; gap: 8px; }
    .message-attachments.image-gallery {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      width: min(72vw, 520px);
    }
    .message-attachments.image-gallery.single-image { grid-template-columns: minmax(0, 1fr); }
    .message-text + .message-attachments { margin-top: 8px; }
    .message-attachment-image-button {
      padding: 0; border: 0; border-radius: 14px; overflow: hidden;
      background: #eeede9; cursor: zoom-in;
    }
    .message-attachment-image {
      width: 100%; aspect-ratio: 1 / 1; max-height: 420px; display: block; object-fit: cover;
      border-radius: 14px; background: #eeede9;
    }
    .message-attachment-file {
      min-height: 58px; padding: 9px 11px; display: grid;
      grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 10px;
      border: 1px solid rgba(255, 255, 255, .16); border-radius: 12px;
      color: inherit; background: rgba(255, 255, 255, .08); text-decoration: none;
      overflow-wrap: anywhere;
    }
    .bubble.assistant .message-attachment-file {
      border-color: rgba(31,32,40,.11); color: var(--ink-soft); background: rgba(255,255,252,.58);
    }
    .message-attachment-file:hover { background: rgba(255,255,252,.84); }
    .message-attachments.image-gallery .message-attachment-file { grid-column: 1 / -1; }
    .message-attachment-file-icon {
      width: 36px; height: 36px; display: grid; place-items: center;
      border-radius: 10px; color: #446096; background: rgba(72,103,161,.1);
      font-size: 12px; font-weight: 760;
    }
    .message-attachment-file-detail { min-width: 0; display: grid; gap: 2px; }
    .message-attachment-file-detail strong {
      min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
      color: inherit; font-size: 13px;
    }
    .message-attachment-file-detail small { opacity: .66; font-size: 10px; }
    .message-attachment-file-action { font-size: 11px; font-weight: 680; opacity: .76; }
    .message-attachment-count {
      grid-column: 1 / -1; color: inherit; opacity: .66; font-size: 11px;
    }
    html.baize-image-preview-open,
    body.baize-image-preview-open { overflow: hidden; overscroll-behavior: none; }
    .message-image-preview {
      position: fixed; inset: 0; z-index: 1000;
      padding: calc(12px + env(safe-area-inset-top))
               calc(12px + env(safe-area-inset-right))
               calc(12px + env(safe-area-inset-bottom))
               calc(12px + env(safe-area-inset-left));
      display: grid; grid-template-rows: auto minmax(0, 1fr) auto; gap: 10px;
      color: #fff; background: rgba(18, 18, 22, .92);
      opacity: 0; transition: opacity 140ms ease; cursor: default;
    }
    .message-image-preview.visible { opacity: 1; }
    .message-image-preview-toolbar {
      min-height: 48px; display: grid; grid-template-columns: minmax(112px, 1fr) auto minmax(112px, 1fr);
      align-items: center; gap: 10px; pointer-events: none;
    }
    .message-image-preview-back {
      min-width: 112px; min-height: 44px; padding: 0 16px;
      display: inline-flex; align-items: center; justify-content: center; gap: 9px;
      border: 1px solid rgba(255,255,255,.2); border-radius: 999px;
      color: #fff; background: rgba(43,43,50,.88); box-shadow: 0 8px 28px rgba(0,0,0,.2);
      font: inherit; font-size: 14px; font-weight: 680; cursor: pointer; pointer-events: auto;
      -webkit-tap-highlight-color: transparent;
    }
    .message-image-preview-back:hover { background: rgba(64,64,72,.96); }
    .message-image-preview-back:focus-visible { outline: 3px solid rgba(255,255,255,.72); outline-offset: 2px; }
    .message-image-preview-counter { color: rgba(255,255,255,.78); font-size: 13px; text-align: center; }
    .message-image-preview-actions {
      display: flex; justify-content: flex-end; align-items: center; gap: 7px; pointer-events: auto;
    }
    .message-image-preview-actions .message-result-action,
    .message-image-preview-download {
      min-height: 40px; padding: 0 13px; display: inline-flex; align-items: center;
      border: 1px solid rgba(255,255,255,.18); border-radius: 999px;
      color: #fff; background: rgba(43,43,50,.88); text-decoration: none;
      font: inherit; font-size: 12px; font-weight: 680; cursor: pointer;
    }
    .message-image-preview-edit { background: rgba(62,93,155,.94) !important; }
    .message-image-preview-stage {
      position: relative; min-width: 0; min-height: 0;
      display: grid; place-items: center; overflow: hidden; cursor: default;
    }
    .message-image-preview-frame {
      position: relative; width: 100%; height: 100%; min-width: 0; min-height: 0;
      display: grid; place-items: center;
    }
    .message-image-preview-frame > img {
      grid-area: 1 / 1; max-width: min(94vw, 1200px); max-height: calc(100vh - 94px);
      object-fit: contain; border-radius: 18px; box-shadow: 0 24px 80px rgba(0,0,0,.36);
      user-select: none; -webkit-user-drag: none;
    }
    .message-image-preview-placeholder {
      opacity: 1; transition: opacity 180ms ease;
    }
    .message-image-preview-original {
      opacity: 0; transition: opacity 180ms ease;
    }
    .message-image-preview.original-ready .message-image-preview-placeholder { opacity: 0; }
    .message-image-preview.original-ready .message-image-preview-original { opacity: 1; }
    .message-image-preview-status {
      position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%);
      max-width: min(82vw, 360px); padding: 8px 12px; border-radius: 999px;
      color: rgba(255,255,255,.88); background: rgba(26,26,31,.74);
      backdrop-filter: blur(12px); font-size: 12px; text-align: center;
      pointer-events: none;
    }
    .message-image-preview-status[hidden] { display: none; }
    .message-image-preview-nav {
      position: absolute; top: 50%; z-index: 2; width: 46px; height: 46px;
      display: grid; place-items: center; transform: translateY(-50%);
      border: 1px solid rgba(255,255,255,.18); border-radius: 50%;
      color: #fff; background: rgba(30,31,37,.66); font-size: 30px; line-height: 1; cursor: pointer;
      backdrop-filter: blur(8px);
    }
    .message-image-preview-nav.previous { left: 8px; }
    .message-image-preview-nav.next { right: 8px; }
    .message-image-preview-rail {
      min-height: 52px; max-width: 100%; display: flex; justify-content: center; gap: 7px;
      overflow-x: auto; padding: 2px; -webkit-overflow-scrolling: touch;
    }
    .message-image-preview-choice {
      flex: 0 0 auto; width: 48px; height: 48px; padding: 2px; overflow: hidden;
      border: 2px solid transparent; border-radius: 10px; background: rgba(255,255,255,.08); cursor: pointer;
    }
    .message-image-preview-choice.active { border-color: rgba(255,255,255,.9); }
    .message-image-preview-choice img { width: 100%; height: 100%; display: block; object-fit: cover; border-radius: 6px; }
    @media (max-width: 640px) {
      .message-image-preview { gap: 4px; }
      .message-image-preview-toolbar {
        min-height: 44px; grid-template-columns: auto 1fr auto; gap: 6px;
      }
      .message-image-preview-back { min-width: 42px; min-height: 42px; padding: 0 11px; }
      .message-image-preview-back span:last-child { display: none; }
      .message-image-preview-actions .message-result-action,
      .message-image-preview-download { min-height: 38px; padding: 0 10px; }
      .message-image-preview-download { display: none; }
      .message-image-preview-frame > img { max-width: 100%; max-height: calc(100vh - 130px); border-radius: 12px; }
      .message-image-preview-nav { width: 40px; height: 40px; font-size: 26px; }
      .message-image-preview-nav.previous { left: 2px; }
      .message-image-preview-nav.next { right: 2px; }
      .message-table-wrap { max-width: 82vw; }
    }