/* v13: reserve the controls and minimum log before reducing the avatar. */
.assistant {
  --assistant-top: 118px;
  top: var(--assistant-top);
  max-height: calc(100vh - var(--assistant-top) - 8px);
  max-height: calc(100dvh - var(--assistant-top) - 8px);
}
.assistant > .eyebrow { flex: 0 0 auto; }
.assistant .avatar-wrap {
  min-height: 0;
  max-height: max(0px, calc(100vh - var(--assistant-top) - 240px));
  max-height: max(0px, calc(100dvh - var(--assistant-top) - 240px));
}
.assistant #log {
  flex: 1 1 auto;
  min-height: 44px;
  overflow: auto;
  scroll-padding-bottom: 8px;
}
.assistant .assistant-foot {
  flex: 0 0 auto;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px 0 0;
  font-size: 10px;
  letter-spacing: 0;
}
.assistant .assistant-foot > * { min-width: 0; max-width: 100%; }
.assistant .assistant-foot #engine,
.assistant .assistant-foot #tts-engine {
  flex: 1 1 90px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.assistant .assistant-foot #tts-engine {
  max-width: min(150px, 100%);
  margin: 0;
  font-size: 10px;
}
.assistant .assistant-foot #voice,
.assistant .assistant-foot #always-listen {
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 4px 8px;
  background: transparent;
  color: #d9f5ff;
  font-size: 10px;
  line-height: 1.4;
  white-space: nowrap;
}
.assistant .assistant-foot #always-listen.on {
  background: #69d9ff;
  color: #04131c;
}
.assistant-chat {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  margin: 6px 0 8px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.assistant-chat-input {
  flex: 1 1 0;
  min-width: 0;
  width: 0;
  height: 34px;
  padding: 0 9px;
  border: 1px solid rgba(137, 217, 239, .28);
  border-radius: 4px;
  background: rgba(6, 24, 39, .42);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  color: #d9f5ff;
  font: inherit;
  font-size: 12px;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}
.assistant-chat-input::placeholder { color: rgba(217, 245, 255, .55); opacity: 1; }
.assistant-chat-input:focus {
  outline: none;
  border-color: var(--cyan, #69d9ff);
  box-shadow: 0 0 0 2px rgba(105, 217, 255, .15);
}
.assistant-chat-send {
  position: relative;
  display: grid;
  place-items: center;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid rgba(140, 228, 250, .55);
  border-radius: 4px;
  background: rgba(140, 228, 250, .18);
  color: var(--cyan);
  box-shadow: none;
  font: inherit;
  font-size: 23px;
  line-height: 1;
  cursor: pointer;
  transition: background-color 160ms ease;
}
.assistant-chat-send:hover:not(:disabled) { background: var(--cyan); color: #04131c; }
.assistant-chat.is-busy .assistant-chat-send,
.assistant-chat-send:disabled { opacity: .7; cursor: progress; }
.assistant-chat.is-busy .assistant-chat-send { color: transparent; }
.assistant-chat.is-busy .assistant-chat-send::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 16px;
  height: 16px;
  border: 2px solid rgba(140, 228, 250, .25);
  border-top-color: var(--cyan);
  border-radius: 50%;
  animation: assistant-chat-progress .8s linear infinite;
}
.assistant-chat.is-empty .assistant-chat-input {
  border-color: var(--amber, #e5aa63);
  box-shadow: 0 0 0 2px rgba(229, 170, 99, .12);
  animation: assistant-chat-shake 300ms ease-in-out;
}
@keyframes assistant-chat-progress { to { transform: rotate(360deg); } }
@keyframes assistant-chat-shake {
  0%, 100% { transform: translateX(0); }
  25%, 75% { transform: translateX(-2px); }
  50% { transform: translateX(2px); }
}
@media (min-width: 1600px) { .assistant { --assistant-top: 135px; } }
@media (max-height: 800px) { .assistant { --assistant-top: 104px; } }
@media (max-width: 850px) { .assistant { --assistant-top: 130px; } }
@media (max-width: 1100px) { .assistant #log { max-height: 145px; } }
@media (max-width: 760px), (pointer: coarse) {
  .assistant-chat-input { height: 44px; font-size: 16px; }
  .assistant-chat-send { flex-basis: 44px; width: 44px; min-width: 44px; height: 44px; }
  .assistant .assistant-foot #voice,
  .assistant .assistant-foot #always-listen { min-height: 36px; }
}
@media (max-width: 500px) {
  footer { display: none; }
  .assistant {
    top: auto;
    max-height: min(46vh, calc(100vh - 140px));
    max-height: min(46dvh, calc(100dvh - 140px));
  }
  .assistant .avatar-wrap,
  .assistant .wave { display: none; }
  .local-stats {
    top: 76px;
    bottom: auto;
    max-height: calc(54vh - 92px);
    max-height: calc(54dvh - 92px);
    overflow: auto;
  }
}
@media (height < 560px) {
  .assistant { --assistant-top: 76px; }
  .assistant .avatar-wrap { display: none; }
}
@media (min-width: 501px) and (max-width: 760px),
       (height < 560px) and (min-width: 501px) {
  footer { display: none; }
  .assistant { width: min(320px, 42vw); right: 12px; }
  .assistant .assistant-foot { flex-wrap: nowrap; }
  .assistant .assistant-foot #engine { display: none; }
  .assistant .assistant-foot #tts-engine { flex-basis: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .assistant-chat-input,
  .assistant-chat-send { transition: none; }
  .assistant-chat.is-busy .assistant-chat-send::after,
  .assistant-chat.is-empty .assistant-chat-input { animation: none; }
}

/* Compact source attachment, expanded only on demand. Page text is never HTML. */
.url-reference { flex: 0 0 auto; margin: 4px 12px; font-size: 12px; color: #bdd7e2; min-width: 0; }
.url-reference > summary { cursor: pointer; padding: 5px 0; }
.url-reference form { display: flex; gap: 5px; }
.url-reference input { flex: 1; min-width: 0; width: 100%; background: #071823; color: #e4f4fc; border: 1px solid #436274; padding: 5px; }
.url-reference button { color: #e4f4fc; background: #123043; border: 1px solid #436274; padding: 5px; cursor: pointer; }
.url-reference p { margin: 5px 0; overflow-wrap: anywhere; }
.url-reference pre { max-height: 140px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; user-select: text; }
.url-reference details > summary { overflow-wrap: anywhere; cursor: pointer; }

.url-reference[open] { max-height: min(38vh, 260px); overflow: auto; }
