/* ask tab: everything scoped under .tab-ask, colours come from the shell tokens */

.tab-ask .ak-lede { margin: 0; max-width: 52ch; }
.tab-ask .ak-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- chat thread ---------- */
.tab-ask .ak-chat { display: grid; gap: 14px; padding: 14px; }
.tab-ask .ak-log { display: grid; gap: 12px; align-content: start; min-height: 120px; }
.tab-ask .ak-row { display: flex; gap: 8px; align-items: flex-end; min-width: 0; }
.tab-ask:not(.gs) .ak-row { animation: ak-in .4s cubic-bezier(.22, 1, .36, 1) both; }
.tab-ask .ak-user { justify-content: flex-end; }
.tab-ask .ak-avatar {
  flex: none;
  width: 30px; height: 30px;
  display: grid; place-items: center;
  border-radius: 50%;
  background: var(--soft);
  font-size: .95rem;
}
.tab-ask .ak-bubble { margin: 0; padding: 10px 14px; border-radius: 18px; max-width: min(100%, 560px); min-width: 0; }
.tab-ask .ak-user .ak-bubble { background: var(--accent-bg); color: #fff; border-bottom-right-radius: 6px; max-width: 86%; }
.tab-ask .ak-botbubble { background: var(--soft); border-bottom-left-radius: 6px; display: grid; gap: 8px; }
.tab-ask .ak-text { margin: 0; white-space: pre-wrap; }
.tab-ask .ak-foot { margin: 0; color: var(--mute); }

/* tool chips sit above the reply */
.tab-ask .ak-tools { display: flex; flex-wrap: wrap; gap: 6px; }
.tab-ask .ak-tool { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; }
.tab-ask .ak-banner {
  margin: 0;
  justify-self: start;
  font-weight: 700;
  color: var(--amber-ink);
  background: var(--amber-1);
  border-radius: 8px;
  padding: 2px 8px;
}

/* typing indicator */
.tab-ask .ak-dots { display: inline-flex; gap: 5px; align-items: center; height: 22px; }
.tab-ask .ak-dots i { width: 7px; height: 7px; border-radius: 50%; background: var(--mute); animation: ak-bounce 1.1s ease-in-out infinite; }
.tab-ask .ak-dots i:nth-child(2) { animation-delay: .15s; }
.tab-ask .ak-dots i:nth-child(3) { animation-delay: .3s; }
@keyframes ak-bounce { 0%, 80%, 100% { transform: scale(.7); opacity: .35; } 40% { transform: scale(1); opacity: 1; } }
@keyframes ak-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.tab-ask .ak-suggest { border-top: 1px dashed var(--line); padding-top: 12px; }
.tab-ask .ak-suggest .chip { text-align: left; }

/* composer stays reachable above the mobile tab bar */
.tab-ask .ak-composer {
  position: sticky;
  bottom: calc(84px + env(safe-area-inset-bottom));
  z-index: 5;
  padding: 10px;
  border-radius: 999px;
}
@media (min-width: 760px) { .tab-ask .ak-composer { bottom: 12px; } }
.tab-ask .ak-compose-row { display: flex; gap: 8px; align-items: center; }
.tab-ask .ak-input { flex: 1; min-width: 0; border-radius: 999px; }
.tab-ask .ak-compose-row .btn { flex: none; }

/* ---------- research replay ---------- */
.tab-ask .ak-research-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.tab-ask .ak-research { display: grid; gap: 14px; background: color-mix(in srgb, var(--lav) 55%, var(--card)); }
.tab-ask .ak-rhead { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 8px 12px; }
.tab-ask .ak-rhead h2 { margin: 0; }
.tab-ask .ak-recorded {
  font-size: .78rem;
  font-weight: 800;
  color: var(--lav-ink);
  background: var(--lav);
  border: 1px solid color-mix(in srgb, var(--lav-ink) 30%, transparent);
  border-radius: 999px;
  padding: 4px 12px;
}
.tab-ask .ak-rq { display: grid; gap: 2px; margin: 0; }
.tab-ask .ak-steplist { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.tab-ask .ak-step { position: relative; display: grid; grid-template-columns: 32px 1fr; gap: 12px; align-items: start; }
.tab-ask:not(.gs) .ak-step { animation: ak-in .4s cubic-bezier(.22, 1, .36, 1) both; }
/* pipeline wire: fills while its step runs, a packet rides the front */
.tab-ask .ak-wire { position: absolute; left: 15px; top: 36px; bottom: -10px; width: 2px; border-radius: 2px; background: color-mix(in srgb, var(--lav-ink) 18%, transparent); }
.tab-ask .ak-wire i { position: absolute; inset: 0; background: var(--lav-ink); transform: scaleY(0); transform-origin: 50% 0; border-radius: inherit; }
.tab-ask .ak-wire b { position: absolute; left: -3px; top: -4px; width: 8px; height: 8px; border-radius: 50%; background: var(--accent-bg); box-shadow: 0 0 10px var(--accent); opacity: 0; }
.tab-ask:not(.gs) .ak-wire { display: none; }
.tab-ask .ak-step[data-done] .ak-wire i { transform: scaleY(1); }
.tab-ask .ak-step[data-active] .ak-num { box-shadow: 0 0 0 5px color-mix(in srgb, var(--lav-ink) 20%, transparent); }
.tab-ask .ak-step h3 { margin: 0 0 2px; }
.tab-ask .ak-step p { margin: 0; }
.tab-ask .ak-num {
  width: 32px; height: 32px;
  display: grid; place-items: center;
  border-radius: 50%;
  font-weight: 800;
  font-size: .9rem;
  background: var(--lav);
  color: var(--lav-ink);
  border: 2px solid color-mix(in srgb, var(--lav-ink) 35%, transparent);
  transition: background .3s, color .3s, box-shadow .3s;
}
.tab-ask .ak-step[data-active] .ak-num { animation: ak-pulse 1.1s ease-in-out infinite; }
.tab-ask .ak-step[data-done] .ak-num { background: var(--lav-ink); color: var(--lav); }
@keyframes ak-pulse { 50% { transform: scale(1.12); } }

.tab-ask .ak-chead { margin: 4px 0 0; }
.tab-ask .ak-claims { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.tab-ask .ak-claim {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 10px;
  align-items: start;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 10px 12px;
}
.tab-ask:not(.gs) .ak-claim { animation: ak-in .4s cubic-bezier(.22, 1, .36, 1) both; }
.tab-ask .ak-claim-text { font-size: .92rem; }
.tab-ask .ak-src { grid-column: 2; justify-self: start; font-weight: 700; }
.tab-ask .ak-tag {
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .03em;
  border-radius: 999px;
  padding: 3px 10px;
  white-space: nowrap;
}
.tab-ask .ak-claim.est .ak-tag { background: var(--mint); color: var(--mint-ink); }
.tab-ask .ak-claim.hyp .ak-tag { background: var(--amber-1); color: var(--amber-ink); }
.tab-ask .ak-answer { background: var(--card); border: 1px solid var(--line); border-radius: 16px; padding: 12px 14px; display: grid; gap: 6px; }
.tab-ask .ak-label { margin: 0; font-size: .85rem; font-weight: 750; }
.tab-ask .ak-w { display: inline-block; white-space: pre-wrap; }
.tab-ask .ak-rfoot { display: flex; justify-content: flex-end; }

@media (max-width: 380px) {
  .tab-ask .ak-chat { padding: 10px; }
  .tab-ask .ak-claim { grid-template-columns: 1fr; }
  .tab-ask .ak-src { grid-column: 1; }
  .tab-ask .ak-composer { border-radius: 24px; }
}

@media (prefers-reduced-motion: reduce) {
  .tab-ask .ak-row, .tab-ask .ak-step, .tab-ask .ak-claim { animation: none; }
  .tab-ask .ak-wire { display: none; }
}