/* ng-voice-replies.css — VOICE REPLIES pane (2026-09-06). Neural AURA canon:
   cyan/violet accents, glass, mono micro-labels. Three placements:
   [data-mode=dock]   desktop/ultrawide right column beside the chat stream
   [data-mode=mobile] inside the phone VOICE MODE overlay (#nvm-live)
   [data-mode=sheet]  phone, overlay closed: bottom sheet above the composer */

#nvr-pane{display:flex;flex-direction:column;min-height:0;color:var(--t1,#c7d6ea);
  font-family:var(--fu,system-ui,sans-serif);box-sizing:border-box}
#nvr-pane *{box-sizing:border-box}
.nvr-head{display:flex;flex-wrap:wrap;row-gap:5px;align-items:center;gap:6px;flex:none;padding:7px 10px;
  border-bottom:1px solid var(--line,#1d3a5f);font:600 9.5px/1 var(--fm,ui-monospace,monospace);
  letter-spacing:.12em;color:var(--t2,#9fb6d4);white-space:nowrap;overflow:hidden}
.nvr-title{color:var(--x-cyan,#37e8ff);flex:none}
.nvr-count{flex:none;min-width:18px;padding:3px 6px;border-radius:9px;text-align:center;
  background:color-mix(in srgb, var(--x-cyan, #37e8ff) 10%, transparent);border:1px solid color-mix(in srgb, var(--x-cyan, #37e8ff) 25%, transparent);color:var(--x-cyan,#37e8ff)}
.nvr-sp{flex:1}
.nvr-perm{font-size:8.5px;padding:3px 6px;border-radius:6px;border:1px solid var(--line2,#1d3a5f);
  color:var(--t3,#5f7a9a);cursor:help;flex:none}
.nvr-perm[data-p=ok]{color:var(--x-cyan, #37e8ff);border-color:color-mix(in srgb, var(--x-cyan, #37e8ff) 40%, transparent)}
.nvr-perm[data-p=bad]{color:var(--x-red, #ff5470);border-color:color-mix(in srgb, var(--x-red, #ff5470) 50%, transparent)}
.nvr-perm[data-p=warn]{color:var(--x-amber, #ffb454);border-color:color-mix(in srgb, var(--x-amber, #ffb454) 50%, transparent)}
.nvr-btn,.nvr-tog{font:700 8.5px/1 var(--fm,ui-monospace,monospace);letter-spacing:.1em;color:var(--t2,#9fb6d4);
  background:transparent;border:1px solid var(--line2,#1d3a5f);border-radius:6px;padding:4px 7px;cursor:pointer;flex:none}
.nvr-btn:hover,.nvr-tog:hover{color:var(--t0, #e8f4ff);border-color:color-mix(in srgb, var(--x-cyan, #37e8ff) 50%, transparent)}
#nvr-pane[data-rm=chat] #nvr-mode{color:var(--x-amber, #ffb454);border-color:color-mix(in srgb, var(--x-amber, #ffb454) 50%, transparent)}
.nvr-tog{padding:4px 6px;font-size:10px}
.nvr-empty{padding:18px 14px;font:400 12px/1.5 var(--fu,system-ui);color:var(--t3,#5f7a9a);text-align:center}
.nvr-empty[hidden]{display:none}
.nvr-list{flex:1;min-height:0;overflow-y:auto;padding:6px 12px 18px;display:flex;flex-direction:column;gap:6px;
  overscroll-behavior:contain;scroll-behavior:smooth}
.nvr-turn{display:flex;flex-direction:column;gap:4px;padding:2px 0 8px;border-bottom:1px solid color-mix(in srgb, var(--x-cyan, #37e8ff) 8%, transparent)}
.nvr-turn:last-child{border-bottom:0}
.nvr-turn .msg{max-width:100%;width:100%}
.nvr-turn .msg-user,.nvr-turn .msg.msg-user{margin:8px 0 4px}
.nvr-turn .msg-assistant{margin:16px 0 8px}
.nvr-turn .msg-bubble{max-width:92%;font-size:13.5px}
.nvr-turn .msg-text{font-size:13.5px;max-width:100%}
.nvr-act{order:9;display:flex;align-items:center;gap:6px;justify-content:flex-end;padding:2px 0 0}
.nvr-time{margin-right:auto;font:500 9px/1 var(--fm,ui-monospace,monospace);letter-spacing:.08em;color:var(--t3,#5f7a9a)}
.nvr-act button{font:700 8.5px/1 var(--fm,ui-monospace,monospace);letter-spacing:.1em;color:var(--t2,#9fb6d4);
  background:transparent;border:1px solid var(--line2,#1d3a5f);border-radius:6px;padding:4px 7px;cursor:pointer}
.nvr-act button:hover{color:var(--t0, #e8f4ff);border-color:color-mix(in srgb, var(--x-cyan, #37e8ff) 50%, transparent)}
.nvr-act button[disabled]{opacity:.55;cursor:default;color:var(--x-cyan,#37e8ff)}

/* ---------- dock (desktop / ultrawide): a right column inside the chat tab ---------- */
body.nvr-dock .tab-panel[data-tab="chat"]{position:relative;padding-right:var(--nvr-w,360px)}
#nvr-pane[data-mode=dock]{position:absolute;top:0;right:0;bottom:0;width:var(--nvr-w,360px);z-index:6;
  border-left:1px solid var(--line,#1d3a5f);
  background:linear-gradient(180deg,color-mix(in srgb, var(--s1, #060c18) 78%, transparent),color-mix(in srgb, var(--s0, #040912) 70%, transparent));
  -webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);
  box-shadow:-8px 0 28px rgba(0,0,0,.28);transition:width var(--tmd,.2s) var(--ease,ease)}
#nvr-pane[data-mode=dock][data-open="0"]{cursor:pointer}
#nvr-pane[data-mode=dock][data-open="0"] .nvr-head{flex-direction:column;align-items:center;gap:10px;padding:10px 0;
  border-bottom:0;height:100%}
#nvr-pane[data-mode=dock][data-open="0"] .nvr-title{writing-mode:vertical-rl;transform:rotate(180deg);font-size:9px}
#nvr-pane[data-mode=dock][data-open="0"] .nvr-perm,#nvr-pane[data-mode=dock][data-open="0"] .nvr-btn,
#nvr-pane[data-mode=dock][data-open="0"] .nvr-sp,#nvr-pane[data-mode=dock][data-open="0"] .nvr-list,
#nvr-pane[data-mode=dock][data-open="0"] .nvr-empty{display:none}

/* ---------- inside the phone VOICE MODE overlay ---------- */
#nvr-pane[data-mode=mobile]{margin:6px 0 0;max-height:40vh;border:1px solid color-mix(in srgb, var(--x-cyan, #37e8ff) 16%, transparent);border-radius:12px;
  background:color-mix(in srgb, var(--s1, #060c18) 60%, transparent)}
#nvr-pane[data-mode=mobile] .nvr-head{padding:6px 8px}
#nvr-pane[data-mode=mobile] .nvr-tog,#nvr-pane[data-mode=mobile] #nvr-clear{display:none}
#nvr-pane[data-mode=mobile] .nvr-list{padding:4px 8px 10px}
/* the overlay's own mirrors read #stream (the OPEN chat) — hidden while replies route here */
body.nvr-mobile #nvm-reply,body.nvr-mobile #nvm-transcript{display:none!important}

/* ---------- phone, overlay closed: bottom sheet above the composer ---------- */
#nvr-pane[data-mode=sheet]{position:fixed;left:0;right:0;z-index:58;
  bottom:var(--nvr-bottom,calc(64px + env(safe-area-inset-bottom,0px)));max-height:46vh;   /* --nvr-bottom = just above the composer (JS) */
  border-top:1px solid color-mix(in srgb, var(--x-cyan, #37e8ff) 22%, transparent);border-radius:14px 14px 0 0;
  background:linear-gradient(180deg,color-mix(in srgb, var(--s1, #08101e) 94%, transparent),color-mix(in srgb, var(--s0, #040912) 96%, transparent));
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 -10px 30px rgba(0,0,0,.4)}
#nvr-pane[data-mode=sheet][data-open="0"]{max-height:none}
#nvr-pane[data-mode=sheet][data-open="0"] .nvr-list,#nvr-pane[data-mode=sheet][data-open="0"] .nvr-empty{display:none}
#nvr-pane[data-mode=sheet][data-open="0"][data-n="0"]{display:none}   /* nothing spoken yet: no chip */
#nvr-pane[data-mode=sheet] .nvr-head{padding:9px 10px}
#nvr-pane[data-mode=sheet] #nvr-clear{display:none}
@media (max-width:600px){
  .nvr-head{gap:5px}
  #nvr-mode{font-size:8px;padding:4px 5px}
}
@media (prefers-reduced-motion:reduce){#nvr-pane{transition:none}.nvr-list{scroll-behavior:auto}}
