#voiceAlertButton {
  position: fixed;
  right: 18px;
  top: 76px;
  z-index: 80;
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid #315170;
  border-radius: 999px;
  background: #0a2039;
  color: #dceeff;
  box-shadow: 0 10px 28px #00101e66;
  cursor: pointer;
}
#voiceAlertButton.is-on { border-color: #35d39a; color: #9af0cf; }
#voiceAlertPanel {
  position: fixed;
  inset: 64px 16px 16px auto;
  z-index: 120;
  box-sizing: border-box;
  width: min(900px, calc(100vw - 32px));
  max-width: 100%;
  overflow: auto;
  padding: 20px;
  border: 1px solid #315170;
  border-radius: 18px;
  background: #07182df5;
  color: #eaf3ff;
  box-shadow: 0 24px 70px #000a;
  backdrop-filter: blur(18px);
}
#voiceAlertPanel[hidden] { display: none; }
.va-head { display: flex; align-items: start; justify-content: space-between; gap: 20px; }
.va-head small,
.va-list small,
#voiceAlertStatus { color: #8fa7c3; }
.va-head h2 { margin: 4px 0 18px; }
.va-head button,
.va-actions button,
.va-list button {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
  min-height: 38px;
  padding: 8px 12px;
  border: 1px solid #3d6288;
  border-radius: 9px;
  background: #102c4c;
  color: #eaf3ff;
  font: inherit;
  cursor: pointer;
}
.va-head button:focus-visible,
.va-actions button:focus-visible,
.va-list button:focus-visible,
.va-grid input:focus-visible,
.va-grid select:focus-visible { outline: 3px solid #54aaff66; outline-offset: 2px; }
.va-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.va-grid > section {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
  padding: 15px;
  border: 1px solid #203f60;
  border-radius: 14px;
  background: #0b223d;
}
.va-grid > section:first-child { grid-row: span 2; }
.va-grid h3 { margin: 0 0 12px; }
.va-grid label { display: grid; min-width: 0; gap: 6px; margin: 10px 0; color: #a9bfd7; }
.va-grid select,
.va-grid input[type="text"],
.va-grid input[type="number"],
.va-grid input:not([type]),
.va-grid input[type="range"] {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 38px;
}
.va-grid select,
.va-grid input[type="text"],
.va-grid input[type="number"],
.va-grid input:not([type]) {
  padding: 9px 11px;
  border: 1px solid #36597d;
  border-radius: 8px;
  background: #0d2948;
  color: #eaf3ff;
  font: inherit;
}
.va-grid input:disabled,
.va-grid select:disabled,
.va-list button:disabled { cursor: not-allowed; opacity: .52; }
.va-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.va-list { display: grid; min-width: 0; gap: 8px; max-height: 330px; overflow: auto; }
.va-list article { box-sizing: border-box; min-width: 0; max-width: 100%; padding: 10px; border-radius: 10px; background: #07182d; }
.va-list article p { margin: 6px 0; line-height: 1.5; }
.va-empty { color: #8fa7c3; }
.va-aliases { grid-column: 1 / -1; }
.va-aliases .va-list { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: 520px; }
.va-aliases .va-list article {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 13px;
  padding: 14px;
  border: 1px solid #1d3d5e;
  background: #081d34;
}
.va-alias-title { display: grid; min-width: 0; gap: 4px; }
.va-alias-title b,
.va-alias-title span { min-width: 0; overflow-wrap: anywhere; word-break: break-word; }
.va-alias-title b { color: #f0f7ff; line-height: 1.45; }
.va-alias-title span { color: #7fa2c7; font-size: 12px; font-weight: 700; letter-spacing: .06em; }
.va-alias-fields { display: grid; grid-template-columns: 1fr; min-width: 0; gap: 10px; }
.va-alias-field { display: grid; min-width: 0; gap: 6px; margin: 0 !important; }
.va-alias-field > span { color: #9eb8d3; font-size: 12px; font-weight: 750; }
.va-aliases input,
.va-aliases select,
.va-aliases button {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}
.va-aliases button { align-self: stretch; }
@media (max-width: 760px) {
  #voiceAlertButton { right: 10px; top: 67px; }
  #voiceAlertButton span { display: none; }
  #voiceAlertPanel { inset: 56px 8px 8px; width: auto; padding: 14px; }
  .va-grid { grid-template-columns: 1fr; }
  .va-grid > section:first-child { grid-row: auto; }
  .va-aliases { grid-column: auto; }
  .va-aliases .va-list { grid-template-columns: 1fr; }
  .va-head h2 { font-size: 20px; }
}
@media (max-width: 430px) {
  .va-head { gap: 10px; }
  .va-head button { flex: 0 0 auto; }
  .va-grid > section { padding: 13px; }
  .va-aliases .va-list article { padding: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  #voiceAlertPanel * { animation: none !important; transition: none !important; }
}