.voice-player{display:grid!important;grid-template-columns:44px minmax(48px,1fr) 44px;align-items:center;gap:0 8px;min-width:0}
.voice-player__play{grid-row:1/3;min-width:44px!important;min-height:44px!important}
.voice-player__wave-wrap{position:relative;min-width:0;min-height:44px;display:flex;align-items:center}
.voice-player__seek{position:absolute;inset:0;width:100%;height:44px;opacity:0;cursor:pointer;margin:0}
.voice-player__wave-wrap:focus-within{outline:2px solid var(--accent,#2563eb);outline-offset:2px;border-radius:8px}
.voice-player__speed{grid-column:3;grid-row:1/3;min-width:44px;min-height:44px;border:0;border-radius:12px;background:transparent;color:inherit;font:inherit;font-size:12px}
.voice-player__speed option{color:#17243b;background:#fff}
.voice-player__dur{grid-column:2;font-variant-numeric:tabular-nums;font-size:11px}
.voice-player.is-buffering .voice-player__wave-wrap{opacity:.55}
.voice-transcript summary{min-height:44px;display:flex;align-items:center;cursor:pointer;gap:8px;font-size:13px;font-weight:600}
.voice-transcript summary::before{content:'›';font-size:20px;transform:rotate(0);transition:transform 160ms ease}
.voice-transcript[open] summary::before{transform:rotate(90deg)}
.voice-transcript__text{font-size:14px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere;max-height:320px;overflow-y:auto;padding:4px 0 12px}
@media(prefers-reduced-motion:reduce){.voice-transcript summary::before{transition:none}}
html #app #view-chats #messages .msg > .bubble:has(.voice-player),
html #app #view-chats #messages .msg.msg--out > .bubble:has(.voice-player),
html #app #view-chats #messages .msg.msg--in > .bubble:has(.voice-player){background:transparent!important;background-image:none!important;border:0!important;box-shadow:none!important}
#app #view-chats #messages .bubble:has(.voice-player)::before,
#app #view-chats #messages .bubble:has(.voice-player)::after{display:none!important}
#app #messages .voice-player{background:transparent!important;border:0!important;box-shadow:none!important;padding:4px 0!important}
#app #messages .voice-wave__bar{animation:none!important;transition:none!important}
#app #messages .voice-wave{color:var(--accent,#2563eb);overflow:visible}
/* Transcript stays behind an explicit action; resting voice messages remain one row. */
#app #messages .voice-player{position:relative;grid-template-columns:44px minmax(36px,1fr) 44px 44px!important;gap:0 4px!important}
#app #messages .voice-player__more{grid-column:4;grid-row:1/3;width:44px;height:44px;min-height:44px;padding:0;border:0;border-radius:12px;background:transparent;color:inherit;font:600 24px/1 inherit;cursor:pointer}
#app #messages .voice-player__menu{position:absolute;z-index:20;right:0;top:100%;min-width:180px;padding:5px;border:1px solid var(--line,#dbe2ec);border-radius:14px;background:var(--surface,#fff);color:var(--text,#17243b);box-shadow:0 8px 28px rgb(10 20 40 / .18)}
#app #messages .voice-player__menu button{display:block;width:100%;min-height:44px;text-align:left;padding:8px 12px;border:0;border-radius:9px;background:transparent;color:inherit;font:inherit;font-size:14px}
#app #messages .voice-transcript[hidden],#app #messages .voice-player__menu[hidden],#app #messages [data-voice-retry][hidden]{display:none!important}
#app #messages .voice-transcript__head{display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:600}
#app #messages .voice-transcript__head button{width:44px;height:44px;border:0;background:transparent;color:inherit;font-size:24px}
#app #messages [data-voice-retry]{min-height:44px;padding:8px 12px;border:1px solid var(--line,#dbe2ec);border-radius:10px;background:transparent;color:inherit}
#app #messages :is(.voice-player__more,.voice-player__menu button,[data-voice-hide],[data-voice-retry]):focus-visible{outline:2px solid var(--accent,#2563eb);outline-offset:2px}
#app #messages .voice-player__menu{top:auto;bottom:calc(100% + 4px)}
html #app #view-chats #messages .msg > .bubble:has(.voice-player__menu:not([hidden])){overflow:visible!important}
#app #messages .msg:has(.voice-player__menu:not([hidden])){position:relative;z-index:25}
/* Keep duration below the envelope, inside the same 44px player.  The full
   scope also wins over the legacy three-column chat skin on small screens. */
html #app #view-chats #messages .voice-player{
  grid-template-columns:44px minmax(36px,1fr) 44px 44px!important;
  grid-template-rows:28px 16px!important;
  gap:0 4px!important;
  width:100%;
}
html #app #view-chats #messages .voice-player__wave-wrap{
  grid-column:2;grid-row:1/3;align-self:start;align-items:flex-start;
  width:100%!important;max-width:none;min-height:44px;height:44px;
  overflow:visible;mask-image:none;
}
html #app #view-chats #messages .voice-wave{
  width:100%;max-width:100%;height:28px;flex-shrink:1;
  mask-image:linear-gradient(90deg,#000 calc(var(--voice-progress)*100%),rgb(0 0 0 / .74) calc(var(--voice-progress)*100%));
}
html #app #view-chats #messages .voice-player__dur{
  grid-column:2;grid-row:2;align-self:end;justify-self:start;
  min-width:0;max-width:100%;line-height:16px;text-align:left;
  pointer-events:none;white-space:nowrap;
}
html #app #view-chats #messages .voice-player__more{
  font:inherit;font-size:24px;font-weight:600;line-height:1;
}
#app #messages .voice-player__menu button:is(:hover,:focus-visible){background:var(--surface-2,#eef1f6)}
html[data-theme="dark"] #app #messages .voice-player__speed option{background:var(--surface,#1a2030);color:var(--text,#f0f4fc)}

/* R54: the quiet envelope is neutral until real PCM peaks are available.
   Keep progress in one mask; the old .45 bar opacity multiplied the unplayed
   mask and made the placeholder almost disappear against the chat canvas. */
html #app #view-chats #messages .msg .voice-wave{
  color:#52627a!important;
}
html #app #view-chats #messages .msg .voice-wave--real{
  color:#1648b8!important;
}
html #app #view-chats #messages .voice-wave__bar{
  opacity:1;
}
html[data-theme="dark"] #app #view-chats #messages .msg .voice-wave{
  color:#afbdd3!important;
}
html[data-theme="dark"] #app #view-chats #messages .msg .voice-wave--real{
  color:#aac8ff!important;
}