/* Ask File Ready help chat: floating button + panel. Self-contained;
   light by default like the app, dark under the app's theme toggle. */
.help-fab {
  position: fixed; right: 18px; bottom: 18px; z-index: 1200;
  display: inline-flex; align-items: center; gap: 8px;
  background: #542d7a; color: #fff; border: 0; border-radius: 999px;
  padding: 12px 20px; font: 600 15px/1.2 system-ui, -apple-system, "Segoe UI", sans-serif;
  box-shadow: 0 6px 20px rgba(48, 36, 63, .35); cursor: pointer;
}
.help-fab:hover { background: #673a96; }
.help-panel {
  position: fixed; right: 18px; bottom: 18px; z-index: 1201;
  width: min(420px, calc(100vw - 24px)); max-height: min(680px, calc(100vh - 36px));
  display: flex; flex-direction: column;
  background: #fff; color: #30243f; border: 1px solid #d9d2e6; border-radius: 16px;
  box-shadow: 0 18px 48px rgba(48, 36, 63, .35); overflow: hidden;
  font: 400 14px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif;
}
.help-panel.hidden, .help-fab.hidden { display: none; }
.help-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  background: #542d7a; color: #fff; padding: 12px 14px;
}
.help-head b { font-size: 17px; display: block; }
.help-head span { font-size: 12px; opacity: .85; }
.help-head-btns { display: flex; align-items: center; gap: 6px; }
.help-clear {
  background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.4); color: #fff;
  border-radius: 999px; padding: 5px 10px; font: 600 12px system-ui, sans-serif; cursor: pointer;
}
.help-close { background: transparent; border: 0; color: #fff; font-size: 22px; line-height: 1; cursor: pointer; padding: 2px 6px; }
.help-msgs { padding: 12px 14px; overflow-y: auto; flex: 1 1 auto; }
.help-user { background: #f5f2f9; border-radius: 10px; padding: 8px 10px; margin: 0 0 12px; }
.help-user b { font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: #542d7a; }
.help-user p { margin: 2px 0 0; overflow-wrap: anywhere; }
.help-card { border: 1px solid #e3dcf0; border-left: 4px solid #542d7a; border-radius: 10px; padding: 10px 12px; margin: 0 0 12px; }
.help-card h4 { margin: 2px 0 6px; font-size: 15px; }
.help-cat { margin: 0; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #7a6a94; }
.help-body { overflow-wrap: anywhere; }
.help-source { margin: 8px 0 0; font-size: 12px; color: #7a6a94; }
.help-actions { margin: 8px 0 0; display: flex; gap: 8px; flex-wrap: wrap; }
.help-open {
  background: #542d7a; color: #fff; border: 0; border-radius: 999px;
  padding: 6px 14px; font: 600 13px system-ui, sans-serif; cursor: pointer;
}
.help-open:disabled { opacity: .6; }
.help-link {
  border: 1px solid #542d7a; color: #542d7a; border-radius: 999px;
  padding: 5px 13px; font: 600 13px system-ui, sans-serif; text-decoration: none;
}
.help-notice { border-left-color: #b3541e; }
.help-notice p { margin: 0; }
.help-suggest p { margin: 0 0 8px; font-weight: 700; color: #542d7a; }
.help-chip {
  display: block; width: 100%; text-align: left; margin: 0 0 6px;
  background: #f5f2f9; border: 1px solid #ddd2ee; border-radius: 10px;
  padding: 8px 10px; font: 400 13px system-ui, sans-serif; color: #30243f; cursor: pointer;
}
.help-chip:hover { background: #ece4f8; }
.help-note { margin: 0; padding: 8px 14px; font-size: 12px; color: #7a6a94; border-top: 1px solid #eee8f6; }
.help-form { display: flex; gap: 8px; padding: 10px 12px 12px; border-top: 1px solid #eee8f6; }
.help-input {
  flex: 1 1 auto; min-width: 0; padding: 10px 12px; font: inherit;
  border: 1px solid #cfc4e2; border-radius: 999px; background: #fff; color: inherit;
}
.help-send {
  background: #542d7a; color: #fff; border: 0; border-radius: 999px;
  padding: 10px 18px; font: 600 14px system-ui, sans-serif; cursor: pointer;
}
html[data-theme="dark"] .help-panel { background: #1d1830; color: #f0ebfa; border-color: #453a63; }
html[data-theme="dark"] .help-user { background: #2a2144; }
html[data-theme="dark"] .help-user b { color: #c9aef0; }
html[data-theme="dark"] .help-card { border-color: #3a2f57; }
html[data-theme="dark"] .help-cat, html[data-theme="dark"] .help-source, html[data-theme="dark"] .help-note { color: #a794c9; }
html[data-theme="dark"] .help-suggest p { color: #c9aef0; }
html[data-theme="dark"] .help-chip { background: #2a2144; border-color: #453a63; color: #f0ebfa; }
html[data-theme="dark"] .help-note, html[data-theme="dark"] .help-form { border-top-color: #3a2f57; }
html[data-theme="dark"] .help-input { background: #171230; border-color: #55487a; color: #f0ebfa; }
html[data-theme="dark"] .help-link { color: #c9aef0; border-color: #c9aef0; }
@media (max-width: 560px) {
  .help-panel { right: 8px; bottom: 8px; width: calc(100vw - 16px); }
  .help-fab { right: 12px; bottom: 12px; }
}

.help-scope { display: inline-block; border: 1.5px solid #0095d9; color: #0095d9; border-radius: 99px; padding: 0 8px; font-size: 11px; font-weight: 800; margin-right: 4px; }

.help-nova { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; flex: none; }
.help-nova.lg { width: 40px; height: 40px; margin-right: 10px; }
.help-head { align-items: center; }

/* Readable answers: short paragraphs, real lists, breathing room. */
.help-body p { margin: 0 0 8px; line-height: 1.55; }
.help-body p:last-child { margin-bottom: 0; }
.help-list { margin: 4px 0 10px 20px; padding: 0; line-height: 1.55; }
.help-list li { margin: 4px 0; }

/* Nova speaks in one bubble, like a person walking you through it. */
.help-msg { display: flex; gap: 8px; margin: 0 0 12px; align-items: flex-start; }
.help-avatar { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; flex: none; margin-top: 2px; }
.help-bubble { border: 1px solid #e3dcf0; border-left: 4px solid #542d7a; border-radius: 2px 12px 12px 12px; padding: 10px 12px; flex: 1; min-width: 0; }
.help-lead { font-weight: 700; margin: 0 0 6px; }
html[data-theme="dark"] .help-bubble { border-color: #3a2f57; }

/* ---- Clean chat pass: soft bubbles, quiet lines, room to breathe.
   Plain messages instead of boxed cards; one soft surface per
   speaker; metadata small and light underneath the answer. ---- */
html body .help-panel { border-radius: 18px; border-color: #e4ebf1; box-shadow: 0 16px 40px rgba(15, 35, 52, .18); }
html body .help-head { padding: 10px 14px; }
html body .help-head b { font-size: 15px; }
html body .help-head span { font-size: 11.5px; }
html body .help-nova.lg { width: 34px; height: 34px; margin-right: 9px; }
html body .help-clear { background: transparent; border-color: rgba(255,255,255,.35); font-weight: 500; }
html body .help-msgs { padding: 16px 14px 8px; scrollbar-width: thin; }
html body .help-user { margin: 0 0 14px 18%; background: #eaf4fb; border-radius: 16px 16px 4px 16px; padding: 9px 12px; }
html body .help-user b { display: none; }
html body .help-user p { margin: 0; }
html body .help-msg { gap: 8px; margin: 0 0 14px; }
html body .help-avatar { width: 28px; height: 28px; }
html body .help-bubble { background: #f5f7fa; border: 0; border-radius: 4px 16px 16px 16px; padding: 12px 14px; box-shadow: none; }
html body .help-lead { font-size: 14px; margin: 0 0 6px; }
html body .help-bubble .help-source { border-top: 1px solid rgba(15, 35, 52, .07); padding-top: 7px; margin-top: 10px; font-size: 11.5px; }
html body .help-scope { border-width: 1px; background: rgba(0, 180, 255, .08); font-weight: 700; }
html body .help-card { border: 1px solid #e4ebf1; border-radius: 14px; padding: 12px 14px; margin: 0 0 14px; box-shadow: none; }
html body .help-notice { background: transparent; border: 0; border-radius: 0; text-align: center; color: #7a8794; font-size: 12.5px; padding: 2px 8px; }
html body .help-suggest { margin: 0 0 14px; }
html body .help-suggest p { font-size: 12px; font-weight: 600; letter-spacing: .02em; color: #7a8794; margin: 0 0 8px; }
html body .help-chip { background: #fff; border: 1px solid #e1eaf1; border-radius: 12px; padding: 9px 12px; font-size: 13.5px; margin: 0 0 6px; }
html body .help-chip:hover { border-color: #00b4ff; background: #f5fbff; }
html body .help-note { text-align: center; color: #8a94a0; font-size: 11.5px; padding: 8px 16px; border-top-color: #eef3f7; }
html body .help-form { border-top-color: #eef3f7; padding: 10px 12px 12px; }
html body .help-input { background: #f7fafc; border-color: #dfe8ef; }
html body .help-send, html body .help-open { background: #0095d9; }
html body .help-fab { padding: 11px 18px; box-shadow: 0 8px 22px rgba(15, 35, 52, .22); }
html[data-theme="dark"] body .help-bubble { background: #242424; border: 0; }
html[data-theme="dark"] body .help-bubble .help-source { border-top-color: rgba(255,255,255,.09); }
html[data-theme="dark"] body .help-user { background: #16232c; }
html[data-theme="dark"] body .help-card { background: #242424; border-color: #2e2e2e; }
html[data-theme="dark"] body .help-notice { background: transparent; border: 0; color: #a6a6a6; }
html[data-theme="dark"] body .help-chip { background: #242424; border-color: #3a3a3a; }
html[data-theme="dark"] body .help-chip:hover { background: #16232c; border-color: #00b4ff; }
html[data-theme="dark"] body .help-input { background: #1a1a1a; border-color: #3a3a3a; }
html[data-theme="dark"] body .help-note, html[data-theme="dark"] body .help-form { border-top-color: #2e2e2e; }

/* Beginner-friendly answer layout: heading, short sections, a
   quiet reminder, and a clear source block. */
html body .help-title { font-size: 15px; margin: 0 0 6px; }
html body .help-fact { margin: 0 0 6px; }
html body .help-reminder { background: rgba(0, 180, 255, .08); border-radius: 10px; padding: 8px 10px; margin: 10px 0 0; }
html body .help-srclabel { display: block; font-weight: 700; font-size: 12px; margin-bottom: 3px; }
html body .help-related { margin: -6px 0 14px 36px; }
html body .help-related p { font-size: 12px; font-weight: 600; color: #7a8794; margin: 0 0 6px; }
html[data-theme="dark"] body .help-reminder { background: rgba(0, 180, 255, .13); }