/* UI090 component geometry, using the existing live palette and controllers.
   Load after vnext-ui-soft.css. Reading surface and math spacing are separate. */
body.yf-ui-prototype .yf-prototype-icon { display: inline-block; width: 18px; height: 18px; flex: 0 0 auto; vertical-align: middle; }
body.yf-ui-prototype [data-yf-prototype-owned][hidden] { display: none !important; }
body.yf-ui-prototype :is(.yf-prototype-recent-item, .yf-prototype-more, .yf-prototype-recent-new, .yf-prototype-copy, .yf-prototype-conversation-menu a):focus-visible { outline: 2px solid var(--yf-primary); outline-offset: 3px; }

/* Keep the existing resize/collapse width; replace short-word badges with the
   approved prototype's original line icon assets. */
body.yf-ui-prototype .topbar .primary-nav { gap: 4px; }
body.yf-ui-prototype .topbar .primary-nav > a[data-route] { display: flex; align-items: center; gap: 12px; min-height: 38px; padding: 9px 12px; border-left: 0; border-radius: 11px; font-size: 14px; line-height: 20px; font-weight: 400; color: var(--yf-muted); }
body.yf-ui-prototype .topbar .primary-nav > a[data-route] > .yf-prototype-icon { width: 18px; height: 18px; color: var(--yf-primary); }
body.yf-ui-prototype .topbar .primary-nav > a.is-active { color: var(--yf-text); font-weight: 550; background: var(--yf-primary-soft); }
body.yf-ui-prototype .topbar .primary-nav > a:hover { color: var(--yf-text); background: color-mix(in srgb, var(--yf-primary-soft) 70%, transparent); }
body.yf-ui-prototype .topbar .primary-nav .nav-short { display: none !important; }
body.yf-ui-prototype #sidebarCollapseButton { border-color: transparent; opacity: .5; }
body.yf-ui-prototype #sidebarCollapseButton:hover, body.yf-ui-prototype #sidebarCollapseButton:focus-visible { opacity: 1; }
body.yf-ui-prototype #sidebarCollapseButton > span { display: none; }
body.yf-ui-prototype #sidebarCollapseButton .yf-prototype-icon { width: 16px; height: 16px; }
body.yf-ui-prototype #conversationActions { display: none; }

body.yf-ui-prototype .yf-prototype-recent { min-height: 48px; margin-top: 27px; padding-bottom: 12px; }
body.yf-ui-prototype .yf-prototype-recent-heading { display: flex; align-items: center; justify-content: space-between; padding: 0 8px 5px 12px; color: var(--yf-muted); font-size: 12px; line-height: 20px; }
body.yf-ui-prototype .yf-prototype-recent-new { display: inline-flex; align-items: center; justify-content: center; width: 25px; height: 25px; min-height: 25px; padding: 0; border: 0; border-radius: 7px; background: transparent; color: var(--yf-muted); cursor: pointer; }
body.yf-ui-prototype .yf-prototype-recent-new .yf-prototype-icon { width: 15px; height: 15px; }
body.yf-ui-prototype .yf-prototype-recent-new:hover { color: var(--yf-text); background: var(--yf-primary-soft); }
body.yf-ui-prototype .yf-prototype-recent-list { display: flex; flex-direction: column; gap: 2px; }
body.yf-ui-prototype .yf-prototype-recent-item { display: block; width: 100%; min-height: 33px; padding: 8px 12px; border: 0; border-radius: 9px; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: inherit; font-size: 12px; line-height: 18px; color: var(--yf-muted); background: transparent; cursor: pointer; }
body.yf-ui-prototype .yf-prototype-recent-item:hover, body.yf-ui-prototype .yf-prototype-recent-item[aria-current="true"] { color: var(--yf-text); background: color-mix(in srgb, var(--yf-primary-soft) 70%, transparent); }
body.yf-ui-prototype .yf-prototype-recent-item:disabled { cursor: default; opacity: .5; }
body.yf-ui-prototype .yf-prototype-recent-title { display: block; min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.yf-ui-prototype .yf-prototype-recent-title .crm-formula-display { display: inline; width: auto; max-width: none; margin: 0; padding: 0; overflow: visible; vertical-align: baseline; }
body.yf-ui-prototype .yf-prototype-recent-title .katex-display { display: inline; margin: 0; }
body.yf-ui-prototype .yf-prototype-recent-title .katex { font-size: 1em; }
body.yf-ui-prototype .yf-prototype-recent-note { margin: 0; padding: 6px 12px; color: var(--yf-muted); font-size: 11px; line-height: 1.6; overflow-wrap: anywhere; }

/* These are the same original buttons, moved once with reversible anchors. */
body.yf-ui-prototype .yf-prototype-sidebar-bottom { flex: 0 0 auto; margin-top: 14px; padding: 12px 1px 0; border-top: 1px solid var(--yf-border); }
body.yf-ui-prototype .yf-prototype-sidebar-bottom #newConversationBtn { display: flex; align-items: center; gap: 9px; width: 100%; min-height: 33px; margin: 0 0 8px; padding: 7px 10px; border: 0; border-radius: 9px; background: transparent; box-shadow: none; color: var(--yf-muted); font-size: 13px; line-height: 20px; font-weight: 400; }
body.yf-ui-prototype .yf-prototype-sidebar-bottom #newConversationBtn:hover { color: var(--yf-text); background: var(--yf-primary-soft); }
body.yf-ui-prototype .yf-prototype-sidebar-bottom .account-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-height: 0; max-height: 38dvh; margin: 0; padding: 0; border: 0; overflow-y: auto; }
body.yf-ui-prototype .yf-prototype-sidebar-bottom :is(#themeToggle, #loginBtn) { display: inline-flex; align-items: center; justify-content: center; gap: 7px; width: auto; min-width: 0; max-width: 100%; height: 35px; min-height: 35px; margin: 0; padding: 0 10px; border: 1px solid var(--yf-border); border-radius: 10px; background: var(--yf-surface-fill, var(--yf-surface)); color: var(--yf-primary); font-size: 13px; line-height: 20px; white-space: nowrap; text-decoration: none; box-shadow: none; }
body.yf-ui-prototype .yf-prototype-sidebar-bottom :is(#themeToggle, #loginBtn):hover { border-color: var(--yf-primary); background: var(--yf-primary-soft); }
body.yf-ui-prototype .yf-prototype-sidebar-bottom #themeToggle { order: 0; }
body.yf-ui-prototype .yf-prototype-sidebar-bottom #themeToggle > svg:not(.yf-prototype-icon) { display: none; }
body.yf-ui-prototype .yf-prototype-sidebar-bottom #loginBtn { order: 1; overflow: hidden; text-overflow: ellipsis; }
body.yf-ui-prototype .yf-prototype-sidebar-bottom #homepageUsage { order: 2; flex: 1 0 100%; margin: 1px 0 0; padding: 0 9px; font-size: 11px; line-height: 1.6; color: var(--yf-muted); }
body.yf-ui-prototype .yf-prototype-sidebar-bottom #accessMenuWrap { order: 3; }
body.yf-ui-prototype .yf-prototype-sidebar-bottom #accessMenuButton { padding: 3px 9px; min-height: 24px; font-size: 11px; border: 0; background: transparent; }
body.yf-ui-prototype .yf-prototype-sidebar-bottom #userMenu { order: 4; }

/* The original save node is untouched; only its confirmed saved state gets a
   check icon. Notices, saving failures and recovery continue to render verbatim. */
body.yf-ui-prototype #home .yf-soft-identity::before { content: ''; display: inline-block; width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%; background: #c59c61; }
body.yf-ui-prototype #home .yf-prototype-header-tools { position: relative; display: flex; align-items: center; justify-content: flex-end; gap: 7px; min-width: 0; max-width: 65%; color: var(--yf-muted); }
body.yf-ui-prototype #home .yf-prototype-header-tools .yf-soft-save { max-width: none; margin-right: 5px; }
body.yf-ui-prototype #home .yf-prototype-save-icon { width: 15px; height: 15px; color: var(--yf-primary); }
body.yf-ui-prototype .yf-prototype-more { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 25px; width: 25px; height: 25px; padding: 0; border: 0; border-radius: 7px; color: var(--yf-muted); background: transparent; cursor: pointer; }
body.yf-ui-prototype .yf-prototype-more:hover, body.yf-ui-prototype .yf-prototype-more[aria-expanded="true"] { color: var(--yf-text); background: var(--yf-primary-soft); }
body.yf-ui-prototype .yf-prototype-more .yf-prototype-icon { width: 19px; height: 19px; }
body.yf-ui-prototype .yf-prototype-conversation-menu { position: absolute; top: calc(100% + 9px); right: 0; z-index: 70; min-width: 208px; max-width: min(280px, calc(100vw - 36px)); padding: 6px; border: 1px solid var(--yf-border); border-radius: 15px; background: var(--yf-surface); color: var(--yf-text); box-shadow: 0 8px 30px color-mix(in srgb, var(--yf-text) 10%, transparent); }
body.yf-ui-prototype .yf-prototype-conversation-menu :is(button, a) { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 39px; margin: 0; padding: 10px 11px; border: 0; border-radius: 9px; background: transparent; color: var(--yf-text); text-align: left; text-decoration: none; white-space: normal; font-size: 13px; line-height: 20px; cursor: pointer; }
body.yf-ui-prototype .yf-prototype-conversation-menu :is(button, a):hover { background: var(--yf-primary-soft); }

/* Original upload, mode, submit and cancel controls retain their identities. */
body.yf-ui-prototype #home #searchForm .composer-tools { display: flex; flex-wrap: nowrap; align-items: center; justify-content: flex-start; gap: 6px; min-height: 34px; padding: 4px 0 0; margin-top: 4px; border-top: 0; }
body.yf-ui-prototype #home #searchForm .composer-tools .attach-wrap { flex: 0 1 auto; min-width: 34px; margin-right: 0; gap: 6px; }
body.yf-ui-prototype #home #searchForm .mode-select-wrap { flex: 0 0 auto; margin-left: 0; }
body.yf-ui-prototype #home #searchForm #uploadMoreBtn { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 34px; width: 34px; height: 34px; min-height: 34px; padding: 0; border: 1px solid color-mix(in srgb, var(--yf-border) 70%, transparent); border-radius: 50%; background: transparent; color: var(--yf-primary); }
body.yf-ui-prototype #home #searchForm #uploadMoreBtn > span { display: none; }
body.yf-ui-prototype #home #searchForm #uploadMoreBtn .yf-prototype-icon { width: 19px; height: 19px; }
body.yf-ui-prototype #home #searchForm #chatModelBtn { width: auto; min-width: 0; min-height: 34px; height: 34px; gap: 7px; padding: 6px 10px; border-radius: 10px; font-size: 13px; color: var(--yf-primary); }
body.yf-ui-prototype #home #searchForm #chatModelLabel { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; white-space: nowrap; }
body.yf-ui-prototype #home #searchForm :is(#chatActionBtn, #exitChatBtn) { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 34px; width: 34px; min-width: 34px; height: 34px; min-height: 34px; margin-left: auto; padding: 0; border: 0; border-radius: 10px; background: var(--yf-primary-fill, var(--yf-primary)); color: var(--yf-on-primary); box-shadow: none; }
body.yf-ui-prototype #home #searchForm #chatActionBtn:disabled { opacity: .35; }
body.yf-ui-prototype #home #searchForm #chatActionBtn .btn-label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
body.yf-ui-prototype #home #searchForm #chatActionBtn .btn-arrow { display: none; }
body.yf-ui-prototype #home #searchForm #chatActionBtn .yf-prototype-icon { width: 20px; height: 20px; }
body.yf-ui-prototype #home #searchForm #exitChatBtn { font-size: 0; }
body.yf-ui-prototype #home #searchForm #exitChatBtn .yf-prototype-icon { width: 17px; height: 17px; }
body.yf-ui-prototype #home #searchForm #exitChatBtn[hidden], body.yf-ui-prototype[data-yf-prototype-busy="true"] #home #searchForm #chatActionBtn { display: none; }
body.yf-ui-prototype #home #searchForm .composer-tools:has(.attachment-chips:not(:empty), .crm-pdf-panel:not([hidden])) { flex-wrap: wrap; }
body.yf-ui-prototype #home #searchForm .composer-tools .attach-wrap:has(.attachment-chips:not(:empty), .crm-pdf-panel:not([hidden])) { flex: 1 0 100%; }

/* The bridge binds each card to that turn's immutable image/name. This styling
   never reads or mutates the current composer attachment or source context. */
body.yf-ui-prototype #home .chat-message-user .yf-prototype-turn-attachment { display: flex; align-items: center; gap: 10px; width: 100%; min-width: 0; max-width: min(330px, 100%); min-height: 57px; margin: 0 0 8px; padding: 6px 8px; border: 0; border-radius: 10px; background: color-mix(in srgb, var(--yf-surface) 84%, transparent); color: var(--yf-text); text-align: left; font: inherit; cursor: pointer; }
body.yf-ui-prototype #home .yf-prototype-turn-attachment > img { display: block; flex: 0 0 36px; width: 36px; min-width: 36px; height: 45px; border-radius: 3px; object-fit: cover; background: var(--yf-surface); }
body.yf-ui-prototype #home .yf-prototype-turn-attachment-name { flex: 1 1 auto; min-width: 0; max-width: 175px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; line-height: 19px; font-weight: 500; }
body.yf-ui-prototype #home .yf-prototype-turn-attachment-open { flex: 0 0 auto; margin-left: auto; white-space: nowrap; color: var(--yf-primary); font-size: 11px; line-height: 19px; }
body.yf-ui-prototype #home .chat-message-user .yf-prototype-turn-attachment:hover { background: var(--yf-surface-fill, var(--yf-surface)); }
body.yf-ui-prototype #home .chat-message-user .yf-prototype-turn-attachment:focus-visible { outline: 2px solid var(--yf-primary); outline-offset: 3px; }

/* Cat/byline and a single explicit copy action sit above the untouched answer. */
body.yf-ui-prototype #home .chat-message-assistant { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; column-gap: 12px; }
body.yf-ui-prototype #home .chat-message-assistant > .chat-message-label { display: flex; align-items: center; gap: 10px; margin: 0 0 20px; min-height: 27px; font-size: 14px; line-height: 22px; }
body.yf-ui-prototype #home .chat-message-assistant > .chat-message-body { grid-column: 1 / -1; padding-left: 40px; }
body.yf-ui-prototype .yf-prototype-cat { display: inline-flex; align-items: center; flex: 0 0 30px; width: 30px; height: 27px; color: var(--yf-primary); }
body.yf-ui-prototype .yf-prototype-cat > svg { display: block; width: 30px; height: 27px; overflow: visible; }
body.yf-ui-prototype .yf-prototype-cat path { fill: none; stroke: currentColor; stroke-width: 3.1; stroke-linecap: round; stroke-linejoin: round; }
body.yf-ui-prototype .yf-prototype-cat .line-face-eye { fill: currentColor; }
body.yf-ui-prototype .yf-prototype-cat :is(.line-face-eye-shape, .line-face-expression, .line-face-ear-tip, .line-face-mouth-think, .line-face-mouth-sad) { display: none; }
body.yf-ui-prototype .yf-prototype-cat .line-face-cat-outline { fill: var(--yf-surface-fill, var(--yf-surface)); }
body.yf-ui-prototype .yf-prototype-cat .line-face-cat-inner-ear { stroke-width: 2; opacity: .6; }
body.yf-ui-prototype .yf-prototype-cat :is(.line-face-cat-whisker, .line-face-cat-nose, .line-face-mouth) { stroke-width: 2.4; }
body.yf-ui-prototype #home :is(.yf-prototype-copy, [data-yf-prototype-copy-existing="true"]) { grid-column: 2; grid-row: 1; display: inline-flex; align-items: center; justify-content: flex-end; gap: 5px; width: auto; min-height: 27px; max-width: 100%; padding: 4px 7px; border: 0; border-radius: 7px; background: transparent; color: var(--yf-muted); font: inherit; font-size: 12px; line-height: 19px; cursor: pointer; }
body.yf-ui-prototype #home .yf-prototype-copy:hover { background: var(--yf-primary-soft); color: var(--yf-text); }
body.yf-ui-prototype #home .yf-prototype-copy[data-copy-state="success"] { color: var(--yf-primary); }
body.yf-ui-prototype #home .yf-prototype-copy[data-copy-state="error"] { color: var(--yf-text); }
body.yf-ui-prototype #home .yf-prototype-copy .yf-prototype-icon { width: 16px; height: 16px; }
body.yf-ui-prototype .yf-prototype-copy-feedback { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

@media (min-width: 721px) {
  body.yf-ui-prototype.sidebar-collapsed .primary-nav > a[data-route] { justify-content: center; padding-inline: 8px; }
  body.yf-ui-prototype.sidebar-collapsed .yf-prototype-recent { display: none; }
  body.yf-ui-prototype.sidebar-collapsed .yf-prototype-sidebar-bottom { display: flex; flex-direction: column; align-items: center; }
  body.yf-ui-prototype.sidebar-collapsed .yf-prototype-sidebar-bottom #newConversationBtn { justify-content: center; width: 35px; height: 35px; padding: 0; font-size: 0; }
  body.yf-ui-prototype.sidebar-collapsed .yf-prototype-sidebar-bottom .account-nav { display: flex; flex-direction: column; align-items: center; gap: 8px; }
  body.yf-ui-prototype.sidebar-collapsed .yf-prototype-sidebar-bottom :is(#themeToggle, #loginBtn) { width: 35px; padding: 0; font-size: 0; }
  body.yf-ui-prototype.sidebar-collapsed .yf-prototype-theme-label { display: none; }
  body.yf-ui-prototype.sidebar-collapsed .yf-prototype-sidebar-bottom :is(#homepageUsage, #accessMenuWrap) { display: none; }
}
@media (max-width: 720px) {
  body.yf-ui-prototype .yf-prototype-sidebar-bottom { display: none; }
  body.yf-ui-prototype.sidebar-open .yf-prototype-sidebar-bottom { display: block; position: fixed; bottom: 0; left: 0; width: min(300px, calc(100vw - 30px)); max-height: 40dvh; overflow-y: auto; padding: 12px 16px max(12px, env(safe-area-inset-bottom)); background: var(--yf-bg); }
  body.yf-ui-prototype .yf-prototype-sidebar-bottom .account-nav { position: static; inset: auto; width: 100%; padding: 0; transform: none; background: transparent; }
  body.yf-ui-prototype #home .yf-prototype-header-tools { max-width: 60%; }
  body.yf-ui-prototype #home .chat-message-assistant > .chat-message-body { padding-left: 0; }
  body.yf-ui-prototype #home #searchForm #chatModelBtn { padding-inline: 7px; gap: 5px; }
  body.yf-ui-prototype #home #searchForm .composer-tools { gap: 4px; }
}