/* ng-chatq.css — queue / fold / open-questions / merge UI (AURORA-X, 2026-09-05).
   Quiet by design: mono chips in the page's own tokens, nothing animates
   except the live SENDING/FOLDING chip. Works at 393px and desktop. */

/* ---- queued user bubble ---- */
.chatq-msg .msg-bubble{opacity:.78;border-style:dashed!important}
.chatq-msg.chatq-live .msg-bubble{opacity:1;border-style:solid!important}
.chatq-msg.chatq-failed .msg-bubble{border-color:color-mix(in srgb, var(--x-red, #ff4d6b) 55%, transparent)!important}
.chatq-msg .msg-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.chatq-chip{display:inline-flex;align-items:center;gap:4px;font:600 9px/1 var(--fm,ui-monospace,monospace);letter-spacing:.1em;
  padding:3px 7px;border-radius:999px;border:1px solid var(--line2,rgba(120,200,255,.18));color:var(--t2,#9fb3c8);background:color-mix(in srgb, var(--s2, #0a1a30) 45%, transparent)}
.chatq-chip.send{color:var(--x-cyan,#00e5ff);border-color:color-mix(in srgb, var(--x-cyan, #00e5ff) 45%, transparent);animation:chatq-pulse 2.6s ease-in-out infinite}
.chatq-chip.fold{color:var(--x-mint,#00ffc8);border-color:color-mix(in srgb, var(--x-mint, #00ffc8) 45%, transparent);animation:chatq-pulse 2.6s ease-in-out infinite}
.chatq-chip.fold.done{animation:none;opacity:.8}
.chatq-chip.fail{color:var(--x-red,#ff4d6b);border-color:color-mix(in srgb, var(--x-red, #ff4d6b) 55%, transparent)}
.chatq-settled .msg-bubble{opacity:1;border-style:solid!important}
@keyframes chatq-pulse{0%,100%{opacity:1}50%{opacity:.7}}
@media (prefers-reduced-motion:reduce){.chatq-chip{animation:none!important}}
.chatq-acts{display:inline-flex;gap:4px;margin-left:2px}
.chatq-a{background:transparent;border:1px solid var(--line,rgba(120,200,255,.10));border-radius:4px;color:var(--t3,#6f849a);
  font:600 9px/1 var(--fu,system-ui);letter-spacing:.1em;padding:3px 6px;cursor:pointer;transition:color .15s,border-color .15s}
.chatq-a:hover{color:var(--x-cyan,#00e5ff);border-color:color-mix(in srgb, var(--x-cyan, #00e5ff) 45%, transparent)}
.chatq-msg .chatq-retry{display:none}
.chatq-msg.chatq-failed .chatq-retry{display:inline-block;color:var(--x-red,#ff4d6b);border-color:color-mix(in srgb, var(--x-red, #ff4d6b) 45%, transparent)}
.chatq-msg.chatq-failed .chatq-a:not(.chatq-retry):not(.chatq-rm){display:none}
.chatq-msg.chatq-live .chatq-a:not(.chatq-rm){display:none}
.chatq-msg.chatq-settled .chatq-a:not(.chatq-rm){display:none}
.chatq-settled .chatq-acts{display:none}

/* ---- composer chips ---- */
#composer .chatq-mode,#composer .chatq-count{flex:none;cursor:pointer;font-size:10px;letter-spacing:.08em;padding:3px 8px;white-space:nowrap}
#composer .chatq-mode.m-auto{color:var(--t2,#9fb3c8)}
#composer .chatq-mode.m-fold{color:var(--x-mint,#00ffc8);border-color:color-mix(in srgb, var(--x-mint, #00ffc8) 40%, transparent)}
#composer .chatq-mode.m-queue{color:var(--x-amber,#ffb02e);border-color:color-mix(in srgb, var(--x-amber, #ffb02e) 40%, transparent)}
#composer .chatq-count{color:var(--x-amber,#ffb02e);border-color:color-mix(in srgb, var(--x-amber, #ffb02e) 40%, transparent)}
#composer .chatq-count.has-fail{color:var(--x-red,#ff4d6b);border-color:color-mix(in srgb, var(--x-red, #ff4d6b) 50%, transparent)}
#composer .chatq-count[hidden]{display:none!important}

/* ---- OPEN (n) strip above the composer ---- */
.chatq-oq{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 24px 8px;padding:6px 10px;
  background:color-mix(in srgb, var(--s1, #060d1a) 50%, transparent);border:1px solid var(--line,rgba(120,200,255,.10));border-radius:var(--r1,8px);
  font-family:var(--fm,ui-monospace,monospace);font-size:10px}
.chatq-oq[hidden]{display:none!important}
.chatq-oq-lbl{color:var(--x-amber,#ffb02e);font-weight:700;letter-spacing:.12em;flex:none}
.chatq-oq-chip{display:inline-flex;align-items:center;gap:6px;max-width:100%;min-width:0;padding:3px 4px 3px 8px;border-radius:999px;
  border:1px solid color-mix(in srgb, var(--x-amber, #ffb02e) 28%, transparent);background:color-mix(in srgb, var(--x-amber, #ffb02e) 6%, transparent);color:var(--t1,#dbe6f2)}
.chatq-oq-t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:38ch}
.chatq-oq .chatq-ok{color:var(--x-mint,#00ffc8)}
.chatq-oq .chatq-opts{margin-left:auto;opacity:.6}
@media (max-width:600px){
  .chatq-oq{margin:0 8px 6px;padding:5px 8px;gap:4px}
  .chatq-oq-t{max-width:22ch}
  .chatq-oq-chip{padding:2px 3px 2px 6px}
  #view-chat .composer > .chatq-mode,#view-chat .composer > .chatq-count{order:1;height:22px;font-size:9px}
}

/* ---- OPEN (n) inside the VOICE REPLIES pane (2026-09-07) ----
   Same component, new home. In the pane it has vertical room, so the entries
   stack one per line with a much more generous truncation instead of being
   crammed into a horizontal strip. Zero-count is handled in JS (hidden), so
   there is no empty container and no stray border left above the composer. */
.chatq-oq.chatq-oq-nvr{
  flex-direction:column;align-items:stretch;flex-wrap:nowrap;
  margin:0;border-left:0;border-right:0;border-top:0;border-radius:0;
  padding:7px 10px;gap:5px;
  background:color-mix(in srgb, var(--x-amber, #ffb02e) 6%, transparent);
  border-bottom:1px solid color-mix(in srgb, var(--x-amber, #ffb02e) 24%, transparent);
  flex:none;max-height:34vh;overflow-y:auto;overscroll-behavior:contain}
.chatq-oq.chatq-oq-nvr .chatq-oq-lbl{align-self:flex-start}
.chatq-oq.chatq-oq-nvr .chatq-oq-chip{width:100%;max-width:100%;align-items:flex-start;border-radius:var(--r1,8px);padding:5px 5px 5px 9px}
.chatq-oq.chatq-oq-nvr .chatq-oq-chip .chatq-a{flex:none;align-self:center}
.chatq-oq.chatq-oq-nvr .chatq-oq-t{max-width:none;flex:1 1 auto;min-width:0;white-space:normal;overflow:hidden;text-overflow:clip;line-height:1.4;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.chatq-oq.chatq-oq-nvr .chatq-opts{margin-left:0;align-self:flex-end}
/* the pane collapses to a rail / shuts on a phone — the strip goes with it,
   and the head badge below is what keeps the count discoverable */
#nvr-pane[data-mode=dock][data-open="0"] .chatq-oq,
#nvr-pane[data-mode=sheet][data-open="0"] .chatq-oq{display:none!important}

/* head badge: survives every collapsed state of the pane */
.chatq-oq-badge{flex:none;padding:3px 6px;border-radius:9px;white-space:nowrap;
  font:700 8.5px/1 var(--fm,ui-monospace,monospace);letter-spacing:.1em;
  color:var(--x-amber,#ffb02e);
  background:color-mix(in srgb, var(--x-amber, #ffb02e) 12%, transparent);
  border:1px solid color-mix(in srgb, var(--x-amber, #ffb02e) 40%, transparent)}
.chatq-oq-badge[hidden]{display:none!important}

/* ---- conversation list: MERGE mode ---- */
.cv-merge{background:transparent;border:1px solid var(--line2,rgba(120,200,255,.18));border-radius:6px;color:var(--t2,#9fb3c8);
  font:600 9.5px/1 var(--fu,system-ui);letter-spacing:.1em;padding:5px 8px;cursor:pointer;margin-left:6px}
.cv-merge.on{color:var(--x-violet,#9b6bff);border-color:color-mix(in srgb, var(--x-violet, #9b6bff) 55%, transparent)}
.cv-item .cv-ck{flex:none;width:14px;height:14px;margin:0 6px 0 0;accent-color:var(--x-violet,#9b6bff);cursor:pointer;vertical-align:middle}
.cv-host.cv-merging .cv-item.cv-target-pick{outline:1px dashed color-mix(in srgb, var(--x-violet, #9b6bff) 60%, transparent);outline-offset:-1px}
.cv-mergebar{position:sticky;bottom:0;z-index:5;display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:6px;padding:8px 10px;
  background:color-mix(in srgb, var(--s1, #080618) 92%, transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid color-mix(in srgb, var(--x-violet, #9b6bff) 35%, transparent);border-radius:var(--r1,8px);
  font:600 10px/1.4 var(--fm,ui-monospace,monospace);color:var(--t1,#dbe6f2);letter-spacing:.06em}
.cv-mergebar .cv-mb-hint{flex:1 1 100%;font-weight:400;color:var(--t3,#6f849a);white-space:normal}
.cv-mergebar .cv-a{border-color:color-mix(in srgb, var(--x-violet, #9b6bff) 40%, transparent)}
.cv-mergebar .cv-a.go{color:var(--x-violet,#9b6bff)}
.cv-mergebar .cv-a.danger{color:var(--x-red,#ff4d6b)}
.cv-mergebar ul{margin:0;padding:0 0 0 14px;flex:1 1 100%;font-weight:400;color:var(--t2,#9fb3c8)}

/* ---- merged-from divider row in the transcript ---- */
.msg.chatq-divider{margin:14px 0;padding:0;min-height:0}
.msg.chatq-divider .msg-text{display:flex;align-items:center;gap:10px;font:600 9.5px/1 var(--fm,ui-monospace,monospace);letter-spacing:.12em;color:var(--x-violet,#9b6bff);opacity:.85}
.msg.chatq-divider .msg-text::before,.msg.chatq-divider .msg-text::after{content:'';flex:1;height:1px;background:color-mix(in srgb, var(--x-violet, #9b6bff) 30%, transparent)}

/* ---- "SENTINEL PRIME IS WAITING ON YOU" strip + HELD queue ---- */
.chatq-spw{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 24px 8px;padding:7px 10px;
  background:color-mix(in srgb, var(--x-cyan, #00e5ff) 5%, transparent);border:1px solid color-mix(in srgb, var(--x-cyan, #00e5ff) 32%, transparent);border-radius:var(--r1,8px);
  font-family:var(--fm,ui-monospace,monospace);font-size:10px;box-shadow:inset 3px 0 0 var(--x-cyan,#00e5ff)}
.chatq-spw[hidden]{display:none!important}
.chatq-spw.blocked{border-color:color-mix(in srgb, var(--x-amber, #ffb02e) 45%, transparent);background:color-mix(in srgb, var(--x-amber, #ffb02e) 5%, transparent);box-shadow:inset 3px 0 0 var(--x-amber,#ffb02e)}
.chatq-spw-lbl{color:var(--x-cyan,#00e5ff);font-weight:700;letter-spacing:.12em;flex:none}
.chatq-spw.blocked .chatq-spw-lbl{color:var(--x-amber,#ffb02e)}
.chatq-spw-q{flex:1 1 240px;min-width:0;color:var(--t1,#dbe6f2);font-family:var(--fu,system-ui);font-size:12px;line-height:1.35;white-space:normal}
.chatq-spw-rep{color:var(--x-amber,#ffb02e);border:1px solid color-mix(in srgb, var(--x-amber, #ffb02e) 40%, transparent);border-radius:999px;padding:2px 6px;font-size:9px;letter-spacing:.08em}
.chatq-spw .chatq-reply{color:var(--x-cyan,#00e5ff);border-color:color-mix(in srgb, var(--x-cyan, #00e5ff) 45%, transparent)}
.chatq-chip.held{color:var(--x-cyan,#00e5ff);border-color:color-mix(in srgb, var(--x-cyan, #00e5ff) 35%, transparent);opacity:.8}
#composer .chatq-count.held{color:var(--x-cyan,#00e5ff);border-color:color-mix(in srgb, var(--x-cyan, #00e5ff) 40%, transparent)}
@media (max-width:600px){.chatq-spw{margin:0 8px 6px;padding:6px 8px}.chatq-spw-q{font-size:11.5px}}