/* The transition shares the message area's grid cell, so the composer never jumps. */
.messages-stage { display: grid; grid-template: minmax(0, 1fr) / minmax(0, 1fr); flex: 1 1 0; min-height: 0; min-width: 0; }
.messages-stage > .messages-viewport, .conversation-transition { grid-area: 1 / 1; }
.messages-stage > .messages-viewport { transition: opacity .16s ease; }
.conversation-transition { z-index: 3; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 7px; min-height: 0; overflow: hidden; padding: 24px; background: #fff; opacity: 1; transition: opacity .2s ease; }
.conversation-transition[hidden] { display: none; }
.conversation-transition > .nz-loader { --nz-size: 80px; margin-bottom: 2px; }
.conversation-transition p { margin: 0; color: #656575; font-size: 14px; font-weight: 500; }
.conversation-transition-hint { color: #9999a5; font-size: 12px; }
.messages-stage.is-switching > .messages-viewport { opacity: .12; pointer-events: none; }
.messages-stage.is-revealing > .messages-viewport { opacity: 1; }
.messages-stage.is-revealing > .conversation-transition { opacity: 0; pointer-events: none; }
.messages-stage.is-revealing .welcome-card { animation: conversation-arrive .2s ease-out both; }
.new-chat-button[aria-busy="true"] { opacity: 1; cursor: wait; }
.new-chat-button[aria-busy="true"] > .ui-icon { display: none; }
.new-chat-button[aria-busy="true"]::before { content: ''; flex: 0 0 14px; width: 14px; height: 14px; border: 2px solid #4661cd30; border-top-color: currentColor; border-radius: 50%; animation: conversation-spin .8s linear infinite; }
@keyframes conversation-arrive { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@keyframes conversation-spin { to { transform: rotate(360deg); } }
@media (max-width: 767px) { .conversation-transition > .nz-loader { --nz-size: 68px; } }
@media (max-height: 520px) {
    .conversation-transition { padding: 8px; gap: 3px; }
    .conversation-transition > .nz-loader { --nz-size: 44px; }
    .conversation-transition-hint { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .messages-stage > .messages-viewport, .conversation-transition { transition: none; }
    .messages-stage.is-revealing .welcome-card, .new-chat-button[aria-busy="true"]::before { animation: none; }
}