/* Isolated staging-only additions. Production candidate CSS remains untouched. */
.guided-card {
  width: min(680px, calc(100vw - 32px));
  margin: 16px auto 0;
  padding: 18px 20px;
  border: 1px solid rgba(28, 61, 112, .18);
  border-radius: 18px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 12px 28px rgba(29, 50, 82, .08);
}
.guided-card[hidden] { display: none; }
.guided-card h2 { margin: 0 0 8px; font-size: 16px; }
.guided-card p { margin: 0 0 12px; line-height: 1.65; }
.guided-card-hint { color: #365d93; background: #f2f6fb; border-radius: 10px; padding: 9px 10px; }
.guided-card-options { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.guided-card-option { min-height: 44px; border: 1px solid #c8d3e2; border-radius: 999px; background: #fff; padding: 8px 12px; cursor: pointer; touch-action: manipulation; }
.guided-card-option:hover, .guided-card-option:focus-visible { border-color: #1f447d; color: #1f447d; }
.guided-card-option:focus-visible, .guided-card-submit:focus-visible { outline: 3px solid #7fa7dc; outline-offset: 2px; }
.guided-card-attempt { width: 100%; min-height: 66px; resize: vertical; border: 1px solid #c8d3e2; border-radius: 10px; padding: 10px; font: inherit; box-sizing: border-box; }
.guided-card-note { color: #65748a; font-size: 12px; }
.guided-card-submit { min-height: 44px; margin-top: 10px; border: 0; border-radius: 10px; background: #1f447d; color: #fff; padding: 10px 16px; cursor: pointer; touch-action: manipulation; }
.guided-card-submit:disabled { opacity: .55; cursor: wait; }
.learning-path-context {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-height: 18px;
  margin-top: 8px;
  color: #365d93;
  font-size: 12px;
  letter-spacing: .01em;
}
.learning-path-context[hidden] { display: none; }
.learning-path-context-kicker {
  color: #7a8798;
  font-size: 11px;
  white-space: nowrap;
}
.learning-path-context[data-subject="math"] { color: #254e86; }
.learning-path-context[data-subject="physics"],
.learning-path-context[data-subject="chemistry"] { color: #476b5f; }
.learning-path-context[data-subject="chinese"],
.learning-path-context[data-subject="english"] { color: #7b5c3d; }

@media (prefers-reduced-motion: reduce) {
  .guided-card-option, .guided-card-submit { transition: none; }
}

/* Once a question is submitted, the staging page becomes a conversation.
   The original large composer remains available for the next turn, while the
   submitted text and answer get their own readable message surfaces. */
.hero-stage.is-chat-active {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-height: calc(100dvh - 112px);
  gap: 12px;
}
.hero-stage.is-chat-active .chat-area {
  order: 1;
  width: 100%;
  max-height: min(54dvh, 620px);
  overflow-y: auto;
  min-height: 0;
  margin: 0;
  border-left: 0;
  padding: 0 5px 4px;
  color: var(--ink);
  font-size: 14px;
  overscroll-behavior: contain;
}
.hero-stage.is-chat-active .guided-card { order: 2; }
.hero-stage.is-chat-active .guided-card {
  flex: 0 1 auto;
  max-height: min(34dvh, 420px);
  overflow-y: auto;
  margin: 0;
}
.hero-stage.is-chat-active .composer { order: 4; }
.hero-stage.is-chat-active .composer {
  flex: 0 0 auto;
  position: sticky;
  bottom: 0;
  z-index: 3;
  margin: 0;
  box-shadow: 0 8px 24px rgba(20, 23, 28, .08);
}
.hero-stage.is-chat-active .companion { order: 5; }
.primary-nav .conversation-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  margin-top: 22px;
  padding: 18px 0 0;
  border-top: 1px solid var(--line);
}
.primary-nav .conversation-actions[hidden] { display: none; }
.conversation-actions-label {
  color: var(--muted);
  font-size: 11px;
  letter-spacing: .04em;
  white-space: nowrap;
}
.conversation-actions-group {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
}
.conversation-action {
  width: 100%;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid var(--yf-border);
  border-radius: 8px;
  background: var(--yf-surface-fill,var(--yf-surface));
  color: var(--yf-text);
  font-size: 12px;
  text-align: left;
  cursor: pointer;
  touch-action: manipulation;
  transition: color .18s ease, opacity .18s ease;
}
.conversation-action:hover,
.conversation-action:focus-visible {
  color: var(--yf-text);
  border-color: var(--yf-primary);
  background: var(--yf-primary-soft);
}
.conversation-action:active { border-color:var(--yf-primary); }
.conversation-action-primary {
  color: var(--yf-text);
  font-weight: 600;
  border-color: var(--yf-border);
}
.conversation-action-primary:hover,
.conversation-action-primary:focus-visible {
  color: var(--yf-text);
}
.conversation-action:focus-visible { outline: 3px solid var(--yf-text); outline-offset: 2px; }
.conversation-action:disabled { opacity:1;cursor:not-allowed;border-style:dashed; }
.chat-area.is-conversation {
  display: grid;
  gap: 14px;
  align-content: start;
  scroll-behavior: smooth;
}
.chat-turn { display: grid; align-content: start; align-items: start; gap: 12px; }
.chat-message {
  width: fit-content;
  max-width: min(720px, 92%);
  align-self: start;
  padding: 12px 15px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--paper);
  animation: conversation-message-in .38s cubic-bezier(.22, .8, .26, 1) both;
  transform-origin: center top;
}
.chat-message-user {
  justify-self: end;
  border-color: rgba(31, 68, 125, .24);
  background: var(--cobalt-soft);
  animation-delay: .02s;
}
.chat-message-assistant {
  justify-self: start;
  border-color: var(--line);
  background: #fff;
  animation-delay: .1s;
}
.chat-message-label {
  display: block;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1;
}
.chat-message-user .chat-message-label { color: var(--cobalt); }
.chat-message-body {
  margin: 0;
  white-space: pre-wrap;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.7;
  overflow-wrap: anywhere;
}
.chat-selection-card {
  display: grid;
  gap: 9px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(31, 68, 125, .12);
}
.chat-selection-card[hidden] { display: none; }
.chat-selection-prompt {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}
.chat-selection-candidates {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
}
.chat-selection-candidate {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 9px 11px;
  border: 1px solid rgba(31, 68, 125, .2);
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
  touch-action: manipulation;
}
.chat-selection-candidate:hover,
.chat-selection-candidate:focus-visible {
  border-color: var(--cobalt);
  background: var(--cobalt-soft);
}
.chat-selection-candidate:disabled { opacity: .55; cursor: wait; }
.chat-selection-candidate:focus-visible { outline: 3px solid #7fa7dc; outline-offset: 2px; }
.chat-selection-candidate-label { color: var(--cobalt); font-size: 13px; font-weight: 650; }
.chat-selection-candidate-preview {
  display: -webkit-box;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.chat-message-attachment {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: 10px;
}
.hero-stage.is-chat-active .composer {
  padding: 14px 16px 12px;
  border-radius: 14px;
  background: rgba(255, 255, 255, .94);
}
.hero-stage.is-chat-active .composer.is-conversation-composer {
  animation: conversation-composer-takeover .44s cubic-bezier(.22, .8, .26, 1) both;
  transform-origin: center bottom;
}
.hero-stage.is-chat-active .assistant-input {
  height: 76px;
  min-height: 76px;
  padding: 10px 0 8px;
  font-size: 15px;
}
.hero-stage.is-chat-active .input-help { display: none; }
.hero-stage.is-chat-active .composer-tools { margin-top: 8px; }
.hero-stage.is-chat-active .composer-status { min-height: 16px; margin-top: 7px; }
.hero-stage.is-chat-active .companion { min-height: 54px; margin-top: 10px; }

/* Conversation mode deliberately removes the landing-page decoration. The
   sidebar remains the workbench navigation; the main pane is only the thread,
   guided card (when present), and the next-message composer. */
body.is-conversation-mode .hero-copy,
body.is-conversation-mode .companion,
body.is-conversation-mode .demo-panel {
  display: none !important;
}
body.is-conversation-mode .hero {
  height: calc(100dvh - 74px);
  min-height: 0;
  overflow: hidden;
  padding-top: 24px;
  padding-bottom: 18px;
  align-items: stretch;
}
body.is-conversation-mode .hero-stage {
  width: min(900px, 100%);
  height: 100%;
  min-height: 0;
  padding-top: 0;
  margin: 0 auto;
}
body.is-conversation-mode .hero-stage.is-chat-active .chat-area {
  flex: 1 1 auto;
  max-height: none;
}

/* The route shell has a more specific desktop rule for #home. Keep the
   conversation takeover authoritative so the page itself cannot scroll behind
   the composer; only the message area should scroll. */
body.route-mode.is-conversation-mode {
  overflow: hidden;
}
body.route-mode.is-conversation-mode main > #home.hero {
  height: 100dvh;
  min-height: 0;
  padding: 24px 24px 24px;
}

@keyframes conversation-message-in {
  from { opacity: 0; transform: translateY(10px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes conversation-composer-takeover {
  from { opacity: .72; transform: translateY(14px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .conversation-action { transition: none; }
}

@media (max-width: 720px) {
  .primary-nav .conversation-actions { margin-top: 22px; }
  .primary-nav .conversation-actions-group { gap: 6px; }
  .hero-stage.is-chat-active { min-height: 0; }
  .hero-stage.is-chat-active .chat-area { max-height: none; padding-inline: 0; }
  .chat-message { max-width: 96%; }
  .hero-stage.is-chat-active .assistant-input { height: 68px; min-height: 68px; }
  body.is-conversation-mode .hero {
    height: calc(100dvh - 68px);
    padding-top: 14px;
    padding-bottom: 12px;
  }
  body.route-mode.is-conversation-mode main > #home.hero {
    height: 100dvh;
    /* The mobile navigation is fixed; reserve its 64px above the thread. */
    padding: 78px 16px 12px;
  }
  /* A read-only history has no usable composer. Keep the mobile viewport
     available for reading and correcting; resume/new draft restores it. */
  body.route-mode.is-conversation-mode .hero-stage.is-reading-history .composer {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .chat-area.is-conversation { scroll-behavior: auto; }
  .chat-message,
  .hero-stage.is-chat-active .composer.is-conversation-composer {
    animation: none;
    transition: none;
  }
}

/* Original YFLOS account session: same-origin, server-cookie based. */
html.auth-modal-open, body.auth-modal-open { overflow: hidden !important; }
body.auth-modal-open {
  position: fixed !important;
  top: var(--auth-lock-top, 0px) !important;
  left: var(--auth-lock-left, 0px) !important;
  width: 100% !important;
}
.auth-modal {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  place-items: center;
  padding: 20px;
  box-sizing: border-box;
  overflow: hidden;
  overscroll-behavior: contain;
  background: rgba(20, 28, 38, .28);
  backdrop-filter: blur(8px);
}
.auth-modal[hidden] { display: none; }
.auth-dialog {
  width: min(390px, 100%);
  box-sizing: border-box;
  max-height: calc(100vh - 40px);
  max-height: calc(100dvh - 40px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 24px;
  border: 1px solid rgba(31, 68, 125, .18);
  border-radius: 18px;
  background: rgba(255, 254, 250, .98);
  box-shadow: 0 22px 70px rgba(18, 33, 51, .2);
}
.auth-dialog-head { position: sticky; top: 0; z-index: 1; display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; background: inherit; }
.auth-kicker { color: var(--cobalt); font: 600 10px/1.2 var(--mono); letter-spacing: .13em; }
.auth-dialog h2 { margin: 8px 0 0; color: var(--ink); font-size: 22px; font-weight: 600; }
.auth-close { border: 0; padding: 0 4px; background: transparent; color: var(--muted); font-size: 26px; line-height: 1; cursor: pointer; }
.auth-close:hover, .auth-close:focus-visible { color: var(--ink); }
.auth-tabs { display: flex; gap: 6px; margin: 22px 0 16px; padding-bottom: 7px; border-bottom: 1px solid var(--line); }
.auth-tab { border: 0; padding: 7px 9px; background: transparent; color: var(--muted); font: inherit; font-size: 12px; cursor: pointer; }
.auth-tab.is-active { color: var(--cobalt); box-shadow: inset 0 -2px var(--cobalt); }
.auth-form[hidden] { display: none; }
.auth-form { display: grid; gap: 8px; }
.auth-form label { color: var(--muted); font-size: 12px; }
.auth-form input { width: 100%; box-sizing: border-box; border: 1px solid var(--line-strong); border-radius: 9px; padding: 11px 12px; background: #fff; color: var(--ink); font: inherit; outline: 0; }
.auth-form input:focus { border-color: var(--cobalt); box-shadow: 0 0 0 3px rgba(31, 68, 125, .1); }
.auth-submit { min-height: 42px; margin-top: 8px; border: 0; border-radius: 9px; background: var(--cobalt); color: #fff; font: inherit; cursor: pointer; }
.auth-submit:disabled { opacity: .6; cursor: wait; }
.auth-code-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.auth-code-button { border: 1px solid var(--line-strong); border-radius: 9px; padding: 0 12px; background: var(--paper); color: var(--cobalt); font: inherit; font-size: 12px; cursor: pointer; }
.auth-code-button:disabled { opacity: .55; cursor: wait; }
.auth-consent { display: flex; gap: 8px; align-items: flex-start; margin-top: 16px; color: var(--muted); font-size: 11px; line-height: 1.55; cursor: pointer; }
.auth-consent input { margin-top: 2px; accent-color: var(--cobalt); }
.auth-consent a { color: var(--cobalt); }
.auth-error { margin: 12px 0 0; color: #b73b35; font-size: 12px; }
.auth-register { margin: 14px 0 0; color: var(--muted); font-size: 12px; text-align: center; }
.auth-register a { color: var(--cobalt); font-weight: 600; text-decoration: none; }
.auth-register a:hover, .auth-register a:focus-visible { text-decoration: underline; }
.auth-note { margin: 14px 0 0; color: var(--faint); font-size: 10px; line-height: 1.5; }
@media (max-width: 520px) { .auth-dialog { padding: 20px; border-radius: 14px; } }

/* Keep wide answer content inside its own scroller instead of sizing the
   conversation grid to the table's intrinsic minimum width. */
.chat-area.is-conversation,
.chat-turn {
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
}

@media (max-width: 720px) {
  /* Anchor the conversation when a resized browser retains document scroll. */
  body.route-mode.is-conversation-mode main > #home.hero {
    position: fixed;
    inset: 0;
  }
}

@media (max-width: 720px) and (max-height: 480px) {
  body.route-mode.is-conversation-mode main > #home.hero {
    padding: 70px 16px 8px;
  }
  .hero-stage.is-chat-active { gap: 6px; }
  .hero-stage.is-chat-active .crm-history-current-notice {
    max-height: 60px;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .hero-stage.is-chat-active .composer {
    padding: 8px 12px;
  }
  .hero-stage.is-chat-active .assistant-input {
    height: 44px;
    min-height: 44px;
  }
  .hero-stage.is-chat-active .composer-tools {
    flex-wrap: nowrap;
    min-height: 36px;
    margin-top: 4px;
    gap: 8px;
  }
  .hero-stage.is-chat-active .attach-wrap { flex-basis: auto; }
  .hero-stage.is-chat-active .composer-status {
    margin-top: 4px;
    max-height: 32px;
    overflow-y: auto;
  }
  .chat-question-correction textarea {
    max-height: min(20dvh, 80px);
  }
}

/* Pair correction controls with the current palette, including night preview.
   The shared entry renderer supplies inline white backgrounds; keep answer logic intact. */
.chat-question-correction button {
  background: var(--yf-surface, var(--paper)) !important;
  color: var(--yf-text, var(--ink)) !important;
  border-color: var(--yf-border-strong, var(--line-strong)) !important;
  min-height: 40px;
}
.chat-question-correction textarea {
  background: var(--yf-surface, var(--paper));
  color: var(--yf-text, var(--ink));
  border: 1px solid var(--yf-border-strong, var(--line-strong));
  border-radius: 6px;
  padding: 8px;
}
.chat-question-correction button:hover,
.chat-question-correction button:focus-visible {
  background: var(--yf-primary-soft, var(--cobalt-soft)) !important;
}
.chat-question-correction :focus-visible {
  outline: 2px solid var(--yf-primary, var(--cobalt));
  outline-offset: 2px;
}
.chat-question-correction button:disabled { opacity: .55; cursor: default !important; }
/* Business dialogs own their scroll gestures; keep the underlying route stationary. */
html:has(.wb-dialog[open], .account-integration-dialog[open]),
body:has(.wb-dialog[open], .account-integration-dialog[open]) { overflow: hidden; }

/* History actions stay in the stage flow, above its independent transcript. */
.crm-history-reading-bar {
  order: 0;
  flex: 0 0 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--yf-border, var(--line));
  color: var(--yf-text, var(--ink));
}
.crm-history-reading-bar[hidden] { display: none; }
.crm-history-reading-bar p { flex: 1; min-width: 0; margin: 0; font-size: 12px; line-height: 1.6; }
.crm-history-reading-bar button,
body[data-ui-polish] .crm-history-reading-bar button { flex: 0 0 auto; min-height: 44px; width: auto; }

/* UI059: giftcard state styling preserves UI058 dialog/focus/owner lifecycle. */
#giftcardRedeemOverlay :is(button,input):focus-visible{outline:2px solid var(--yf-text)!important;outline-offset:3px}
#giftcardRedeemOverlay input::placeholder{color:var(--yf-muted);opacity:1}
#giftcardRedeemOverlay input[aria-invalid=true],#giftcardRedeemOverlay input:user-invalid{border-color:var(--yf-danger)!important;outline-color:var(--yf-danger)!important}
#giftcardRedeemBtn:hover,#giftcardRedeemBtn:focus-visible{border-color:var(--yf-primary)!important;background:var(--yf-primary-fill,var(--yf-primary))!important;color:var(--yf-on-primary)!important}
#giftcardRedeemOverlay button:disabled{opacity:1;outline:1px dashed var(--yf-border-strong);outline-offset:-3px;cursor:not-allowed!important}

#giftcardRedeemOverlay :is(input,button){min-height:44px}
#giftcardCloseBtn{min-width:44px}

/* UI060: inspect/remove pending attachments without sacrificing the text draft. */
.crm-attachment-preview{display:flex;align-items:center;gap:10px;min-width:0;margin:8px 0;padding:8px;border:1px solid var(--yf-border);border-radius:12px;background:var(--yf-surface);color:var(--yf-text)}
.crm-attachment-preview[hidden],.crm-image-preview-dialog[hidden]{display:none!important}
html.crm-image-preview-open,body.crm-image-preview-open{overflow:hidden!important}
.crm-attachment-preview button{flex:0 0 auto;min-width:44px;min-height:44px;border:1px solid var(--yf-border-strong);border-radius:8px;background:var(--yf-surface);color:var(--yf-text);cursor:pointer}
.crm-attachment-preview [data-preview-image]{padding:3px;width:60px;height:52px;overflow:hidden}
.crm-attachment-preview img{display:block;width:100%;height:100%;object-fit:contain}
.crm-attachment-name{flex:1;min-width:0;font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.crm-attachment-preview [data-remove-image]{padding:6px 10px;font-size:13px}
.crm-attachment-preview button:focus-visible,.crm-image-preview-dialog button:focus-visible{outline:2px solid var(--yf-text);outline-offset:3px}
.crm-attachment-preview button:hover,.crm-image-preview-dialog button:hover{background:var(--yf-primary-soft);color:var(--yf-text)}
.crm-attachment-preview button:disabled{opacity:.6;cursor:wait}
.crm-image-preview-dialog{position:fixed;inset:0;z-index:10060;display:grid;place-items:center;padding:16px;background:rgb(0 0 0 / .55);overscroll-behavior:contain}
.crm-image-preview-surface{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:12px;width:min(960px,100%);max-height:calc(100dvh - 32px);min-width:0;padding:16px;box-sizing:border-box;border:1px solid var(--yf-border);border-radius:16px;background:var(--yf-surface);color:var(--yf-text);overflow:hidden}
.crm-image-preview-surface h2{flex:1;min-width:0;margin:0;font-size:17px}
.crm-image-preview-dialog button{min-width:60px;min-height:44px;padding:8px 12px;background:var(--yf-surface);color:var(--yf-text);border:1px solid var(--yf-border-strong);border-radius:8px;cursor:pointer}
.crm-image-preview-scroll{flex-basis:100%;min-width:0;max-height:calc(100dvh - 124px);overflow:auto;overscroll-behavior:contain;touch-action:pan-x pan-y pinch-zoom}
.crm-image-preview-scroll img{display:block;max-width:100%;height:auto;margin:auto}
@media(max-width:420px){.crm-image-preview-dialog{padding:8px}.crm-image-preview-surface{max-height:calc(100dvh - 16px);padding:12px}.crm-attachment-preview{gap:8px}}

.crm-history-current-notice textarea[readonly]{display:block;min-height:76px;max-height:30dvh;overflow:auto;padding:10px;border:1px solid var(--yf-border-strong);border-radius:8px;background:var(--yf-surface);color:var(--yf-text);font-size:14px!important;line-height:1.6;overscroll-behavior:contain}
.crm-history-followup-restore{min-height:44px;max-width:100%;height:auto;white-space:normal;line-height:1.5;text-align:left}

/* UI079: stable processing controls; terminal feedback returns to its turn. */
.chat-message[hidden], .chat-wait-status[hidden],
.crm-followup-feedback-row[hidden], .crm-attachment-draft-notice[hidden] { display: none !important; }
.chat-wait-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-self: start;
  gap: 4px 10px;
  min-width: 0;
  max-width: 100%;
  color: var(--yf-muted, var(--muted));
  font-size: 12px;
  line-height: 1.6;
}
.chat-wait-label { color: var(--yf-text, var(--ink)); }
.chat-wait-detail { font-variant-numeric: tabular-nums; }
#searchForm > .chat-wait-status[data-state="processing"] {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0 8px;
  width: 100%;
  margin: 0 0 6px;
}
#searchForm > .chat-wait-status[data-state="processing"] :is(.chat-wait-label, .chat-wait-detail) {
  grid-column: 1;
  min-width: 0;
  overflow-wrap: anywhere;
}
#searchForm > .chat-wait-status[data-state="processing"] #exitChatBtn { grid-column: 2; grid-row: 1 / span 2; }
:root body[data-ui-polish] #exitChatBtn,
.chat-wait-status #exitChatBtn {
  flex: 0 0 auto;
  min-width: 76px;
  /* Keep the action target when the later mobile skin supplies 40px. */
  min-height: 44px !important;
  margin: 0;
  padding: 6px 12px;
  border-radius: 8px;
  white-space: nowrap;
}
.chat-wait-status.is-error .chat-wait-label { color: var(--yf-danger, #a23c35); }
.crm-attachment-preview[data-attachment-state="submitted"] {
  width: fit-content;
  max-width: 100%;
  margin: 4px 0;
  padding: 0;
  gap: 7px;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.crm-attachment-preview[data-attachment-state="submitted"] [data-preview-image] { width: 44px; height: 44px; }
.crm-attachment-preview[data-attachment-state="submitted"] .crm-attachment-name { flex: 0 1 auto; font-size: 12px; }
.crm-attachment-preview[data-attachment-state="submitted"] [data-remove-image] { display: none; }
:root .crm-followup-feedback-row { margin-top: 4px; gap: 4px 8px; }
:root .crm-followup-feedback-row > .crm-history-note { flex: 0 1 auto; margin: 0; font-size: 12px; line-height: 1.5; }
:root .crm-followup-feedback-row > .crm-history-followup-undo { padding: 4px 10px; }
.crm-attachment-draft-notice { margin: 5px 0 0; font-size: 12px; line-height: 1.5; }
.crm-attachment-draft-notice summary { width: fit-content; max-width: 100%; color: var(--yf-muted, var(--muted)); cursor: pointer; }
.crm-attachment-draft-notice p { margin: 5px 0 0; }