﻿.layout { --management-assistant-width: 720px; --management-workspace-min: 520px; }
/* 智能体展开时优先保证业务内容仍可分栏阅读：助手列随视口收缩，拖拽宽度也受同一上限约束。 */
.layout.assistant-open {
  grid-template-columns: 244px minmax(0, 1fr) minmax(320px, min(var(--management-assistant-width), calc(100vw - 244px - var(--management-workspace-min))));
}
.management-assistant {
  position: sticky;
  top: 0;
  height: 100vh;
  min-width: 0;
  border-left: 1px solid #dbe3ea;
  background: #fff;
  display: none;
  grid-template-rows: auto minmax(0, 1fr);
  box-shadow: -12px 0 30px rgba(29, 54, 89, .06);
  container-type: inline-size;
  container-name: assistantpanel;
}
.layout.assistant-open .management-assistant { display: grid; }
.management-assistant-resizer { position: absolute; z-index: 2; top: 0; bottom: 0; left: -4px; width: 8px; cursor: col-resize; }
.management-assistant-resizer:hover,
.management-assistant-resizer.dragging { background: rgba(45, 99, 214, .12); }
.management-assistant-head { min-height: 92px; padding: 18px 16px; border-bottom: 1px solid #e4eaf0; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.management-assistant-head span,
.management-assistant-head strong,
.management-assistant-head small { display: block; }
.management-assistant-head span { color: #2d63d6; font-size: 10px; letter-spacing: .08em; }
.management-assistant-head strong { margin-top: 4px; color: #223041; font-size: 17px; }
.management-assistant-head small { max-width: 360px; margin-top: 5px; color: #7e8a97; font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.management-assistant-head > div:last-child { display: flex; gap: 7px; }
.management-assistant-head button { width: 30px; height: 30px; border: 1px solid #d5dee7; border-radius: 7px; background: #fff; color: #5d6b79; font-size: 17px; }
.management-assistant-workspace { min-height: 0; display: grid; grid-template-columns: 190px minmax(0, 1fr); transition: grid-template-columns .18s ease; }
.management-assistant-workspace.history-collapsed { grid-template-columns: 0 minmax(0, 1fr); }
.management-assistant-history { min-width: 0; padding: 14px 10px; border-right: 1px solid #e4eaf0; background: #f7f9fc; overflow: auto; }
.management-assistant-workspace.history-collapsed .management-assistant-history { visibility: hidden; padding-inline: 0; border-right: 0; overflow: hidden; }
#managementAssistantHistoryToggle { font-size: 20px; line-height: 1; transition: transform .18s ease; }
#managementAssistantHistoryToggle[aria-expanded="false"] { transform: rotate(180deg); }
.management-history-heading { padding: 0 7px 12px; }
.management-history-heading strong,
.management-history-heading small { display: block; }
.management-history-heading strong { color: #354456; font-size: 12px; }
.management-history-heading small { margin-top: 3px; color: #8a96a3; font-size: 9px; }
.management-session { width: 100%; margin-bottom: 4px; padding: 9px 8px; border: 0; border-radius: 8px; background: transparent; color: #4a5968; text-align: left; cursor: pointer; }
.management-session:hover,
.management-session.active { background: #e8f0ff; color: #234fba; }
.management-session strong,
.management-session span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.management-session strong { font-size: 11px; }
.management-session span { margin-top: 3px; color: #8793a0; font-size: 9px; }
.management-assistant-conversation { min-width: 0; min-height: 0; display: grid; grid-template-rows: minmax(0, 1fr) auto auto auto; }
.management-assistant-messages { min-height: 0; padding: 18px 14px; overflow: auto; background: #f8fafc; }
.management-assistant-empty { margin: 70px auto 0; padding: 18px; text-align: center; color: #718090; }
.management-assistant-empty b { color: #3a4959; font-size: 13px; }
.management-assistant-empty p { font-size: 11px; line-height: 1.7; }
.management-message { display: flex; flex-direction: column; align-items: flex-start; margin-bottom: 14px; }
.management-message.user { align-items: flex-end; }
.management-message > div:not(.management-message-actions) { max-width: 88%; padding: 10px 11px; border: 1px solid #dde5ec; border-radius: 9px; background: #fff; color: #344454; font-size: 12px; line-height: 1.65; white-space: pre-wrap; }
.management-message.user > div:not(.management-message-actions) { border-color: #2d63d6; background: #2d63d6; color: #fff; }
.management-assistant-notice { margin: 8px 14px; padding: 9px 10px; border: 1px solid #f1c2bb; border-radius: 7px; background: #fff1ef; color: #953b34; font-size: 11px; }
/* 输入区：单块式编辑框，聚焦只高亮外框，避免文本域与容器出现双边框。 */
.management-assistant-composer { position: relative; padding: 10px 14px 14px; border-top: 1px solid #e6ecf2; background: #fff; }
.management-composer-box {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 10px 8px;
  border: 1px solid #d7e0ea;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(20, 35, 52, .04);
  transition: border-color .16s ease, box-shadow .16s ease;
}
.management-composer-box:focus-within { border-color: #7ea2ea; box-shadow: 0 0 0 3px rgba(45, 99, 214, .1); }
.management-composer-box:has(.management-voice-listening) { border-color: #f0b4b0; box-shadow: 0 0 0 3px rgba(229, 72, 77, .1); }
.management-composer-box textarea {
  min-height: 48px;
  max-height: 132px;
  padding: 2px;
  border: 0;
  background: transparent;
  color: #2d3b49;
  font-size: 12.5px;
  line-height: 1.65;
  outline: 0;
  resize: none;
}
.management-composer-box textarea::placeholder { color: #9aa6b3; }
.management-composer-box textarea:focus { border: 0; box-shadow: none; }
.management-composer-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.management-composer-tools { display: flex; align-items: center; gap: 6px; min-width: 0; }
.management-composer-actions-right { display: flex; align-items: center; flex: 0 0 auto; gap: 8px; }
.management-composer-hint { color: #95a1ae; font-size: 9.5px; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.management-composer-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: 0 0 auto;
  height: 30px;
  padding: 0 10px;
  border: 1px solid #dbe4ee;
  border-radius: 9px;
  background: #fff;
  color: #3d5268;
  font-size: 11px;
  line-height: 1;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease;
}
.management-composer-chip:hover { border-color: #b9cdec; background: #f3f7ff; color: #234fba; }
.management-composer-chip:focus-visible { outline: 2px solid #2d63d6; outline-offset: 2px; }
.management-composer-send {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: #2d63d6;
  color: #fff;
  box-shadow: 0 6px 14px rgba(45, 99, 214, .2);
  transition: background-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.management-composer-send:hover:not(:disabled) { background: #234fba; box-shadow: 0 8px 18px rgba(35, 79, 186, .24); }
.management-composer-send:active:not(:disabled) { transform: translateY(1px); }
.management-composer-send:disabled { background: #c7d4e6; box-shadow: none; cursor: default; }
.management-composer-send:focus-visible { outline: 2px solid #2d63d6; outline-offset: 2px; }
.management-tool-trace { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: -6px 0 12px; color: #5c6b7a; font-size: 10px; }
.management-tool-trace > span { padding: 3px 7px; border-radius: 999px; background: #edf2f8; }
.management-tool-trace details { flex: 1 1 100%; padding: 6px 8px; border: 1px solid #e2e8ee; border-radius: 7px; background: #fafcfd; }
.management-tool-trace summary { cursor: pointer; color: #5c6b7a; }
.management-tool-trace ol { margin: 6px 0 0; padding-left: 18px; }
.management-tool-trace li { margin: 3px 0; line-height: 1.5; }
.management-tool-trace b { margin-right: 6px; color: #344454; font-weight: 600; }
.management-tool-trace code { color: #6b7c8d; word-break: break-all; }
.management-tool-trace em { margin-left: 6px; color: #953b34; font-style: normal; }
.management-tool-trace .management-tool-result { flex: 1 1 100%; margin: 4px 0 0; padding: 5px 7px; max-height: 132px; overflow: auto; border-radius: 6px; background: #f2f6f9; color: #46586a; font: 10px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; word-break: break-all; }
.management-action-list { display: grid; gap: 8px; margin: 0 0 14px; }
.management-action-card { padding: 10px 11px; border: 1px solid #dde5ec; border-radius: 9px; background: #fff; color: #344454; font-size: 12px; }
.management-action-card.confirmation_required { border-color: #f0d39b; background: #fffaf0; }
.management-action-card.completed { border-color: #b9dfc8; background: #f5fbf7; }
.management-action-card.cancelled, .management-action-card.failed { border-color: #f1c2bb; background: #fff6f4; }
.management-action-card strong { display: block; margin-bottom: 4px; font-size: 12px; }
.management-action-card p { margin: 0 0 4px; line-height: 1.6; white-space: pre-wrap; }
.management-action-card small { color: #7a8794; font-size: 10px; }
.management-action-buttons { display: flex; gap: 8px; margin-top: 8px; }
.management-action-buttons button { min-height: 30px; padding: 0 12px; font-size: 11px; }
.management-action-card.completed .management-action-buttons [data-management-view] { border-color: #b9dfc8; color: #22663f; font-weight: 650; }
@media (max-width: 1380px) {
  .layout.assistant-open { grid-template-columns: 200px minmax(0, 1fr) minmax(320px, min(var(--management-assistant-width), calc(100vw - 200px - var(--management-workspace-min)))); }
  .management-assistant-workspace { grid-template-columns: 165px minmax(0, 1fr); }
}
@media (max-width: 1050px) {
  .layout.assistant-open { display: block; }
  .management-assistant { position: fixed; z-index: 20; right: 0; top: 0; width: min(96vw, var(--management-assistant-width)); box-shadow: -20px 0 45px rgba(20, 35, 52, .22); }
  .management-assistant-resizer { display: none; }
}
@media (max-width: 620px) {
  .management-assistant-workspace { grid-template-columns: 130px minmax(0, 1fr); }
  .management-assistant-history { padding-inline: 6px; }
  .management-assistant-head { min-height: 76px; padding: 12px; }
}

/* 智能体自身变窄时改为上下排布，避免历史会话挤压对话区。 */
@container assistantpanel (max-width: 560px) {
  .management-assistant-workspace { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); }
  .management-assistant-workspace.history-collapsed { grid-template-rows: 0 minmax(0, 1fr); }
  .management-assistant-history { max-height: 150px; border-right: 0; border-bottom: 1px solid #e4eaf0; }
  .management-assistant-workspace.history-collapsed .management-assistant-history { max-height: 0; padding-block: 0; overflow: hidden; }
}

/* 业务内容按容器宽度重排：智能体展开或拖宽后仅窄容器内的控件换行，表格改为自身横向滚动。 */
.content { container-type: inline-size; container-name: workspace; }

/* 空态按可视容器居中：空表不再按数据列最小宽度撑开，滚动只发生在有数据时。 */
.table-wrap:has(.empty) { overflow-x: hidden; }
.table-wrap:has(.empty) thead { display: none; }
.table-wrap:has(.empty) table,
.table-wrap:has(.empty) table.role-table { width: 100%; min-width: 100% !important; }
.table-wrap:has(.empty) td.empty { text-align: center; }

@container workspace (max-width: 1180px) {
  .device-filters { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .device-filters .device-keyword-filter { grid-column: span 2; }
  .cloud-call-filters { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .cloud-call-filters .cloud-platform-tenant { grid-column: span 2; }
  .cloud-policy-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@container workspace (max-width: 900px) {
  .filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filters > label:first-child,
  .filters > .primary-button { grid-column: 1 / -1; }
  .device-filters,
  #workerFilters,
  .worker-filters,
  .worker-task-filters,
  .device-catalog-filters,
  .cloud-call-filters,
  .cloud-policy-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .device-filters .device-keyword-filter,
  #workerFilters .worker-keyword-filter,
  .worker-filters .worker-keyword-filter,
  .worker-task-filters > label:first-child,
  .device-catalog-filters .device-keyword-filter,
  .cloud-call-filters .cloud-platform-tenant,
  .cloud-policy-form .cloud-platform-policy { grid-column: 1 / -1; }
  .users-filters,
  .provider-filters,
  #accountsFilters { flex-wrap: wrap; }
  .users-filters > label:first-child,
  .provider-filters > label:first-child,
  #accountsFilters > label:first-child { flex: 1 1 100%; min-width: 0; }
  .users-filters > label,
  .provider-filters > label,
  #accountsFilters > label { flex: 1 1 180px; min-width: 0; }
  #accountsFilters > .primary-button { flex: 0 0 120px; }
  .metrics,
  .metric-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .overview-grid,
  .analytics-grid { grid-template-columns: minmax(0, 1fr); }
  .queue-item { grid-template-columns: minmax(0, 1fr) 76px; }
  .queue-item .queue-address { display: none; }
  .device-view-tabs button { padding-inline: 10px; }
  .device-panel-heading { align-items: flex-start; flex-direction: column; }
  .device-heading-actions { width: 100%; }
  .knowledge-list-panel .panel-heading { align-items: flex-start; flex-direction: column; }
  .knowledge-list-actions { width: 100%; flex-wrap: wrap; }
  .knowledge-list-actions .knowledge-tenant-control { flex: 1 1 230px; }
  #ticketsView table { min-width: 1000px; }
  #usersView table { min-width: 1040px; }
  #kfBindingView table { min-width: 900px; }
  #rolesView .role-table { min-width: 820px; }
  #accountsView table { min-width: 900px; }
  .knowledge-list-panel table { min-width: 720px; }
  #cloudCallView table { min-width: 900px; }
  /* 窄容器下把「操作」列固定在可视区右侧，横滚只滚数据列，关键按钮始终可达。 */
  :is(#accountsView, #usersView, #kfBindingView, #rolesView, #deviceAssociationsView, #workersView, #providersView, #customersView) .table-wrap :is(th, td):last-child {
    position: sticky;
    right: 0;
    background: var(--ui-surface, #fff);
  }
  :is(#accountsView, #usersView, #kfBindingView, #rolesView, #deviceAssociationsView, #workersView, #providersView, #customersView) .table-wrap th:last-child { z-index: 2; }
  :is(#accountsView, #usersView, #kfBindingView, #rolesView, #deviceAssociationsView, #workersView, #providersView, #customersView) .table-wrap td:last-child {
    z-index: 1;
    box-shadow: -10px 0 12px -12px rgba(20, 45, 80, .45);
  }
  /* 知识文档列表的「文档设置 / 版本管理 / 检索验证 / 删除」属于表格自身的一列：
     与其余数据列同层，随横向滚动条一起移动，不再悬浮固定在可视区右侧。 */
  #knowledgeView .knowledge-list-panel .table-wrap :is(th, td):last-child {
    position: static;
    right: auto;
    z-index: auto;
    box-shadow: none;
  }
}

@container workspace (max-width: 700px) {
  .metrics,
  .metric-grid,
  .profile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .worker-heading-actions,
  .provider-heading-actions { width: 100%; }
  .panel-heading > div:last-child { flex-wrap: wrap; max-width: 100%; }
  .pager { flex-wrap: wrap; }
  .pager-controls { flex-wrap: wrap; }
  .device-view-tabs { grid-template-columns: minmax(0, 1fr); }
  .device-view-tabs button { border-right: 0; border-bottom: 1px solid #e5ebe9; }
  .device-view-tabs button:last-child { border-bottom: 0; }
  .cloud-call-tabs { grid-template-columns: minmax(0, 1fr); }
  .cloud-call-tabs button { border-right: 0; border-bottom: 1px solid #e5ebe9; }
  .cloud-call-tabs button:last-child { border-bottom: 0; }
}

@container workspace (max-width: 560px) {
  .filters,
  .device-filters,
  #workerFilters,
  .worker-filters,
  .worker-task-filters,
  .device-catalog-filters,
  .cloud-call-filters,
  .cloud-policy-form { grid-template-columns: minmax(0, 1fr); }
  .filters > label,
  .filters > .primary-button,
  .device-filters .device-keyword-filter,
  #workerFilters .worker-keyword-filter,
  .worker-filters .worker-keyword-filter,
  .worker-task-filters > label:first-child,
  .device-catalog-filters .device-keyword-filter,
  .cloud-call-filters .cloud-platform-tenant,
  .cloud-policy-form .cloud-platform-policy { grid-column: auto; }
  .users-filters > label,
  .provider-filters > label,
  #accountsFilters > label,
  #accountsFilters > .primary-button { flex: 1 1 100%; }
  .panel-heading { align-items: flex-start; flex-direction: column; }
  .panel-heading > div:last-child { width: 100%; }
  .knowledge-list-actions { flex-direction: column; align-items: stretch; }
  .knowledge-list-actions > button,
  .knowledge-list-actions .knowledge-tenant-control { width: 100%; flex: 1 1 auto; }
  .pager { flex-direction: column; align-items: flex-start; }
}

/* VOICE-01：麦克风入口、播报按钮与语音状态卡（卡片位于输入框上方右侧，只显示状态与声波）。 */
.management-composer-actions-right > .management-voice-mic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 1px solid #bdd3f2;
  border-radius: 9px;
  background: #e8f0ff;
  color: #2d63d6;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease;
}
.management-composer-actions-right > .management-voice-mic:hover { border-color: #8fb0ee; background: #dbe8ff; color: #1f4fbe; }
.management-composer-actions-right > .management-voice-mic:focus-visible { outline: 2px solid #2d63d6; outline-offset: 2px; }
.management-composer-actions-right > .management-voice-mic.is-listening {
  border-color: #d9423d;
  background: #e5484d;
  color: #fff;
  animation: management-voice-mic-flash 1s ease-in-out infinite;
}
@keyframes management-voice-mic-flash {
  0%, 100% { background: #e5484d; box-shadow: 0 0 0 0 rgba(229, 72, 77, .42); }
  50% { background: #f4736f; box-shadow: 0 0 0 5px rgba(229, 72, 77, .14); }
}
/* 自动播报开关：关闭为灰色喇叭斜杠、开启为蓝色喇叭；默认关闭，TTS 不可用或保存中置灰。 */
.management-composer-actions-right > .management-voice-autoplay {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 1px solid #d8dee6;
  border-radius: 9px;
  background: #f4f6f8;
  color: #7c8894;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease;
}
.management-composer-actions-right > .management-voice-autoplay[data-state="on"] { border-color: #bdd3f2; background: #e8f0ff; color: #2d63d6; }
.management-composer-actions-right > .management-voice-autoplay:hover { border-color: #8fb0ee; background: #dbe8ff; color: #1f4fbe; }
.management-composer-actions-right > .management-voice-autoplay:focus-visible { outline: 2px solid #2d63d6; outline-offset: 2px; }
.management-composer-actions-right > .management-voice-autoplay[disabled] { opacity: .55; cursor: not-allowed; }
.management-composer-actions-right > .management-voice-autoplay[disabled]:hover { border-color: #d8dee6; background: #f4f6f8; color: #7c8894; }
.management-voice-autoplay[data-state="off"] .management-voice-autoplay-on,
.management-voice-autoplay[data-state="on"] .management-voice-autoplay-off { display: none; }
.management-voice-autoplay-notice { flex: 0 1 auto; max-width: 190px; color: #b0451f; font-size: 11px; line-height: 1.35; }
.management-composer-actions-right > .management-voice-autoplay-resume {
  flex: 0 0 auto;
  height: 24px;
  padding: 0 8px;
  border: 1px solid #bdd3f2;
  border-radius: 7px;
  background: #eef4ff;
  color: #1f4fbe;
  font-size: 11px;
}
.management-composer-actions-right > .management-voice-autoplay-resume:hover { background: #dbe8ff; }
.management-composer-actions-right > .management-voice-autoplay-resume:focus-visible { outline: 2px solid #2d63d6; outline-offset: 2px; }
/* 气泡下方的图标操作行：播报（喇叭/喇叭斜杠双形态）与复制，均为无底纹小图标。 */
.management-message-actions { display: flex; align-items: center; gap: 2px; margin-top: 5px; }
.management-message-actions > button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: #93a1b0;
  transition: color .16s ease, background-color .16s ease, border-color .16s ease;
}
.management-message-actions > button:hover { border-color: #e2e8f0; background: #f2f5f9; color: #3c5875; }
.management-message-actions > button:focus-visible { outline: 2px solid #2d63d6; outline-offset: 1px; }
.management-message-actions > .management-voice-play[data-state="on"] .management-voice-icon-off,
.management-message-actions > .management-voice-play[data-state="off"] .management-voice-icon-on { display: none; }
.management-message-actions > .management-voice-play[data-state="off"] { color: #c04a44; }
.management-message-actions > .management-voice-play[data-state="off"]:hover { border-color: #f3c9c5; background: #fff4f3; color: #a93b36; }
.management-voice-card {
  position: absolute;
  right: 14px;
  bottom: calc(100% + 8px);
  z-index: 5;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px 6px 12px;
  border: 1px solid #d7e0ea;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(20, 35, 52, .14);
  color: #2c3c4d;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
}
.management-voice-card-title { font-weight: 600; }
/* 卡片内的 X：按当前阶段停止聆听或停止播报，效果与再次点击麦克风、点击气泡播报图标一致。 */
.management-voice-card-stop {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #93a1b0;
  cursor: pointer;
  transition: color .16s ease, background-color .16s ease;
}
.management-voice-card-stop:hover { background: #f2f5f9; color: #c04a44; }
.management-voice-card-stop:focus-visible { outline: 2px solid #2d63d6; outline-offset: 1px; }
.management-voice-wave { display: inline-flex; align-items: flex-end; gap: 2px; height: 14px; }
.management-voice-wave i {
  width: 3px;
  height: 100%;
  border-radius: 2px;
  background: #2d63d6;
  transform-origin: 50% 100%;
  animation: management-voice-wave-play .9s ease-in-out infinite;
}
.management-voice-wave i:nth-child(2) { animation-delay: .15s; }
.management-voice-wave i:nth-child(3) { animation-delay: .3s; }
.management-voice-wave i:nth-child(4) { animation-delay: .45s; }
.management-voice-card[data-state="processing"] .management-voice-wave i { animation-duration: 1.5s; }
.management-voice-card[data-state="speaking"] .management-voice-wave i { animation-duration: .65s; }
/* 聆听为蓝色、播报为绿色，卡片底色、描边、文字与声波一起区分，避免两个阶段看起来一样。 */
.management-voice-card[data-state="listening"] { border-color: #c3d6f2; background: #f1f6ff; color: #1f4fa8; }
.management-voice-card[data-state="listening"] .management-voice-wave i { background: #2d63d6; }
.management-voice-card[data-state="speaking"] { border-color: #b9dec3; background: #f0f9f2; color: #1c6b3b; }
.management-voice-card[data-state="speaking"] .management-voice-wave i { background: #2f9e58; }
.management-voice-card[data-state="speaking"] .management-voice-card-stop:hover { background: #e2f3e7; color: #b23f36; }
.management-voice-card[data-state="error"] { border-color: #f1c2bb; background: #fff6f4; color: #953b34; }
.management-voice-card[data-state="error"] .management-voice-wave { display: none; }
@keyframes management-voice-wave-play {
  0%, 100% { transform: scaleY(.3); opacity: .55; }
  50% { transform: scaleY(1); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .management-voice-wave i,
  .management-composer-actions-right > .management-voice-mic.is-listening { animation: none; }
}
