:root {
  color-scheme: light;
  --bg: #edf8ff;
  --panel: #ffffff;
  --panel-2: #f5f9ff;
  --line: #c8dbeb;
  --text: #13213a;
  --muted: #64748b;
  --blue: #00aeea;
  --pink: #ff4fa3;
  --green: #20c997;
}

* { box-sizing: border-box; }
body {
  min-inline-size: 1340px;
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 13px Arial, "Microsoft YaHei", sans-serif;
}
button, input, select { font: inherit; }
button {
  min-height: 30px;
  border: 1px solid transparent;
  border-radius: 5px;
  background: var(--blue);
  color: #ffffff;
  padding: 5px 9px;
  cursor: pointer;
}
button:hover { background: #0098ce; }
button.danger,
button.danger:hover {
  border-color: #b91c1c;
  background: #dc2626;
  color: #fff;
}
button.danger:hover { background: #b91c1c; }
/* Queued redub is a waiting state, not another actionable primary button. */
button.redub-busy,
button.redub-busy:hover {
  border-color: #d97706;
  background: #f59e0b;
  color: #3b2500;
  cursor: wait;
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / 35%);
}
input, select {
  background: var(--panel);
  color: var(--text);
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 6px;
}
.spacer { flex: 1; }

dialog {
  max-width: 620px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  padding: 22px;
}
dialog::backdrop { background: rgb(15 23 42 / 35%); }
.dialog-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.missing-voice-dialog { width: min(520px, calc(100vw - 40px)); border: 2px solid #e27a18; padding: 28px; }
.missing-voice-dialog h2 { margin: 0 0 18px; color: #b54708; font-size: 24px; }
.missing-voice-dialog p { font-size: 16px; line-height: 1.6; }
.missing-voice-role-list { padding: 12px 14px; border-radius: 6px; background: #fff1df; color: #9a3412; font-size: 18px !important; font-weight: 700; }
.missing-voice-dialog button[data-action="settings"] { background: #e27a18; color: #fff; font-size: 16px; font-weight: 700; padding: 10px 18px; }
.role-sample-dialog { width: min(580px, calc(100vw - 40px)); }
.role-sample-dialog .role-sample-text { padding: 10px 12px; border-radius: 6px; background: #f8fafc; font-weight: 700; }
.role-sample-dialog .role-sample-rule { padding: 14px; border-radius: 6px; background: #fff1df; color: #9a3412; font-size: 18px; font-weight: 800; line-height: 1.55; }
.role-sample-dialog .role-sample-error { color: #b42318; font-size: 17px; font-weight: 800; }
.role-sample-dialog .role-sample-error:empty { display: none; }
.role-sample-dialog button[data-action="confirm"] { background: #e27a18; color: #fff; font-size: 16px; font-weight: 700; padding: 10px 18px; }
.missing-role-focus { outline: 3px solid #e27a18; outline-offset: 2px; }
