/*
 * A(DAI) — archivist chat bar (the floating "ask the archivist" surface).
 *
 * Mounts as a sibling to #chrome at z-index 11. Lives entirely under
 * #archivist-bar so this file can be deleted without touching anything
 * else. All CSS custom properties (--text, --void, --brand-color, --mono)
 * inherit from style.css.
 */

#archivist-bar {
  position: fixed;
  bottom: var(--bottom-control-bottom, 28px);
  z-index: 11;
  width: min(680px, calc(100vw - 32px));
  font-family: var(--mono, 'SF Mono', 'Menlo', 'Consolas', monospace);
  color: var(--text, #E8E6E1);
  pointer-events: none; /* shell is decorative; children re-enable as needed */
  transition: width 200ms ease;
}
/* Minimised (log closed) the bar slims down so the centre dock stops
 * brushing the bottom-right rooms nav (review note 16); it grows back to
 * full width the moment the log opens. */
#archivist-bar:not(.is-open) { width: min(540px, calc(100vw - 32px)); }
/* Dock positions — left/right anchor the bar to a side, center keeps the
 * original middle-of-the-screen placement. We persist the choice per tab. */
#archivist-bar.dock-center { left: 50%; transform: translateX(-50%); }
#archivist-bar.dock-left   { left: 16px;  right: auto;  transform: none; }
#archivist-bar.dock-right  { right: 16px; left: auto;   transform: none; }

#archivist-bar * { box-sizing: border-box; }

.arch-log {
  pointer-events: auto;
  position: relative;
  display: none;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 8px;
  max-height: min(50vh, 460px);
  overflow-y: auto;
  padding: 10px 42px 10px 12px;
  background: rgba(8, 8, 10, 0.93);
  border: 1px solid #2a2a2c;
  border-radius: var(--bottom-control-radius, 0px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45);
  font-size: 13px;
  line-height: 1.5;
}
#archivist-bar.is-open .arch-log { display: flex; }

/* Pinned to the top-right of the BAR shell (a sibling of .arch-log), not
 * inside the scrollable log — an absolute child of an overflow container
 * scrolls away with the content (review: "the collapse option disappears
 * when you scroll down"). The bar shell is pointer-events:none, so the
 * button re-enables them; visible only while the log is open. */
.arch-panel-minimize {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 3;
  pointer-events: auto;
  width: 24px;
  height: 24px;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(8, 8, 10, 0.88);
  border: 1px solid #2a2a2c;
  border-radius: 0;
  color: #8a8a8c;
  font-family: inherit;
  font-size: 13px;
  line-height: 1;
  padding: 0;
  cursor: pointer;
}
#archivist-bar.is-open .arch-panel-minimize { display: inline-flex; }
.arch-panel-minimize:hover {
  color: var(--text, #E8E6E1);
  border-color: #4a4a4c;
}

.arch-msg {
  display: block;
  white-space: normal;
  overflow-wrap: anywhere;
}
.arch-msg-user {
  color: #b8c8e8;
  border-left: 2px solid rgba(65, 105, 176, 0.6);
  padding: 2px 0 2px 10px;
}
.arch-msg-assistant {
  color: var(--text, #E8E6E1);
  padding: 2px 0;
}
.arch-msg p { margin: 0 0 6px 0; }
.arch-msg p:last-child { margin-bottom: 0; }
.arch-msg ul, .arch-msg ol { margin: 4px 0 6px 16px; padding: 0; }
.arch-msg li { margin: 2px 0; }
.arch-msg a {
  color: var(--brand-color, #4169B0);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.arch-msg a:hover { color: #6a8bd4; }
.arch-msg strong { color: var(--text, #E8E6E1); font-weight: 700; }
.arch-msg em { font-style: italic; color: #c0bdb6; }
.arch-msg code {
  font-family: inherit;
  background: rgba(255,255,255,0.06);
  padding: 0 4px;
  border-radius: 0;
  font-size: 12px;
}

.arch-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 2px 0 0 0;
}
.arch-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid #2a2a2c;
  color: #8a8a8c;
  font-size: 10px;
  letter-spacing: 0.04em;
  padding: 2px 7px;
  line-height: 1.4;
  transition: opacity 0.6s ease, color 0.4s ease;
}
.arch-chip-done { color: #5a5a5c; opacity: 0.5; }
.arch-chip-client { color: #c4a868; border-color: rgba(196, 168, 104, 0.35); }
.arch-chip-error { color: #d47a7a; border-color: rgba(212, 122, 122, 0.4); }

.arch-bar {
  pointer-events: auto;
  display: flex;
  align-items: center;
  gap: 8px;
  height: var(--bottom-control-height, 44px);
  padding: 0 10px;
  background: var(--bottom-control-bg, rgba(6, 6, 8, 0.22));
  border: 1px solid var(--bottom-control-border, rgba(255, 255, 255, 0.07));
  border-radius: var(--bottom-control-radius, 0px);
  box-shadow: var(--bottom-control-shadow, 0 8px 22px rgba(0, 0, 0, 0.1));
  backdrop-filter: var(--bottom-control-blur, blur(18px));
  -webkit-backdrop-filter: var(--bottom-control-blur, blur(18px));
  transition: border-color 120ms ease;
}
#archivist-bar.is-open .arch-bar { border-color: #3a3a3c; }
.arch-prompt {
  color: #6a6a6c;
  font-size: 13px;
  line-height: 1;
  user-select: none;
}
.arch-input {
  flex: 1;
  background: transparent;
  color: var(--text, #E8E6E1);
  border: none;
  outline: none;
  font-family: inherit;
  font-size: 13px;
  padding: 0;
  line-height: 1.3;
  resize: none;
  max-height: 96px;
}
.arch-input::placeholder { color: #4a4a4c; }
.arch-send {
  background: transparent;
  border: 1px solid #2a2a2c;
  border-radius: 0;
  color: #b4b4b6;
  font-family: inherit;
  font-size: 11px;
  letter-spacing: 0.04em;
  padding: 4px 9px;
  cursor: pointer;
  line-height: 1;
  height: 24px;
}
.arch-send:hover { color: var(--text, #E8E6E1); border-color: #4a4a4c; }
.arch-send:disabled { opacity: 0.4; cursor: default; }
/* Inline icon buttons (reset, minimize, dock) — same metrics as send but
 * square, dimmer by default, light up on hover. */
.arch-iconbtn {
  background: transparent;
  border: 1px solid #2a2a2c;
  border-radius: 0;
  color: #6a6a6c;
  font-family: inherit;
  font-size: 13px;
  line-height: 1;
  width: 24px;
  height: 24px;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.arch-iconbtn:hover { color: var(--text, #E8E6E1); border-color: #4a4a4c; }
.arch-keyhint {
  color: #4a4a4c;
  font-size: 10px;
  letter-spacing: 0.06em;
  user-select: none;
}
.arch-status {
  display: none;
  color: #6a6a6c;
  font-size: 11px;
  letter-spacing: 0.04em;
  padding: 4px 0 2px 4px;
}
#archivist-bar.is-busy .arch-status { display: block; }

.arch-empty {
  color: #6a6a6c;
  font-size: 12px;
  padding: 4px 0 6px;
  font-style: italic;
}
.arch-empty kbd {
  font-family: inherit;
  border: 1px solid #2a2a2c;
  padding: 0 4px;
  border-radius: 0;
  font-size: 10px;
  color: #8a8a8c;
}

/* Help / tips panel — shown when the log is empty or when ? is toggled. */
.arch-help { color: #8a8a8c; font-size: 12px; line-height: 1.55; padding: 2px 0; }
.arch-help-lead {
  color: #b4b4b6;
  font-style: italic;
  margin-bottom: 10px;
}
.arch-help-section { margin: 6px 0 10px; }
.arch-help-h {
  color: #6a6a6c;
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 3px;
}
.arch-help ul { margin: 0; padding: 0 0 0 14px; }
.arch-help li { margin: 2px 0; }
.arch-help em { color: var(--brand-color, #4169B0); font-style: normal; }
.arch-help kbd {
  font-family: inherit;
  border: 1px solid #2a2a2c;
  padding: 0 4px;
  border-radius: 0;
  font-size: 10px;
  color: #b4b4b6;
}
.arch-help-btn {
  display: inline-block;
  border: 1px solid #2a2a2c;
  color: #b4b4b6;
  padding: 0 5px;
  font-size: 11px;
  line-height: 1.4;
}
.arch-help-fake-link {
  color: var(--brand-color, #4169B0);
  text-decoration: underline;
  text-underline-offset: 2px;
  pointer-events: none; /* it's a sample, not a link */
}
.arch-help-foot {
  color: #5a5a5c;
  font-size: 11px;
  font-style: italic;
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px dashed #2a2a2c;
}
.arch-help-foot a { color: #8a8a8c; }
/* ? button gets a brighter outline when its panel is open. */
.arch-iconbtn.is-active { color: var(--text, #E8E6E1); border-color: #6a6a6c; }

@media (max-width: 1360px) {
  #archivist-bar.dock-center {
    bottom: calc(var(--bottom-control-bottom, 28px) + var(--bottom-control-height, 44px) + 10px);
  }
}

@media (max-width: 540px) {
  #archivist-bar { width: calc(100vw - 16px); }
  .arch-bar {
    height: var(--bottom-control-height, 40px);
    border-radius: var(--bottom-control-radius, 0px);
  }
  .arch-log { max-height: 60vh; font-size: 12px; }
}