.preferences-ui__dialog {
  box-sizing: border-box;
  width: min(36rem, calc(100vw - 24px));
  max-width: calc(100vw - 24px);
  max-height: calc(100dvh - 24px);
  overflow-y: auto;
  overscroll-behavior: contain;
  margin: auto;
  padding: clamp(14px, 4vw, 28px);
  border: 1px solid var(--line, #354033);
  border-radius: 6px;
  background: var(--panel, #19231c);
  color: var(--text, #e9e6d6);
  color-scheme: dark;
  font: 14px/1.5 system-ui, sans-serif;
}
.preferences-ui__dialog::backdrop { background: rgb(0 0 0 / 65%); }
.preferences-ui__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 20px;
}
.preferences-ui__header h2 { margin: 0; font-size: 1.4rem; overflow-wrap: anywhere; }
.preferences-ui__fields { display: grid; gap: 16px; }
.preferences-ui__field { display: grid; gap: 6px; }
.preferences-ui__field select {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 9px;
  border: 1px solid var(--line, #354033);
  background: var(--bg, #101915);
  color: inherit;
  font: inherit;
}
.preferences-ui__check { display: flex; align-items: center; gap: 10px; }
.preferences-ui__check input {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  min-height: 20px;
  margin: 0;
  accent-color: var(--gold, #d2b57a);
}
.preferences-ui__check span { min-width: 0; overflow-wrap: anywhere; }
.preferences-ui__hotkeys {
  min-width: 0;
  margin: 24px 0 0;
  padding: 12px 0 0;
  border: 0;
  border-top: 1px solid var(--line, #354033);
}
.preferences-ui__hotkeys legend { padding: 0 10px 0 0; font-weight: 650; }
.preferences-ui__hotkey {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(72px, 38%);
  align-items: center;
  gap: 10px;
  margin: 8px 0;
}
.preferences-ui__hotkey span, .preferences-ui__hotkey button { overflow-wrap: anywhere; }
.preferences-ui__dialog .button { min-height: 44px; white-space: normal; }
.preferences-ui__hotkey button[aria-pressed="true"] {
  outline: 2px solid var(--gold, #d2b57a);
  outline-offset: 2px;
}
.preferences-ui__reset { width: 100%; margin-top: 12px; }
.preferences-ui__error, .preferences-ui__alert, .preferences-ui__capture {
  overflow-wrap: anywhere;
  padding: 10px;
  border: 1px solid currentColor;
}
.preferences-ui__error, .preferences-ui__alert {
  color: var(--red, #e1a28c);
  background: var(--panel, #19231c);
}
.preferences-ui__capture { color: var(--gold, #d2b57a); }
.preferences-ui [hidden] { display: none !important; }
.preferences-ui__dialog :is(button, select, input):focus-visible {
  outline: 2px solid var(--gold, #d2b57a);
  outline-offset: 3px;
}
@media (forced-colors: active) {
  .preferences-ui__dialog { border-color: CanvasText; background: Canvas; color: CanvasText; }
  .preferences-ui__hotkey button[aria-pressed="true"] { outline-color: Highlight; }
}
