.xh-page-dialog {
  width: min(600px, calc(100vw - 40px));
  max-height: calc(100dvh - 48px);
  box-sizing: border-box;
  padding: 24px;
  border: 1px solid var(--line, #2b3530);
  border-radius: 16px;
  color: var(--text, #d8dedb);
  background: var(--panel, #151b18);
  box-shadow: 0 20px 70px #0009;
}
.xh-page-dialog[open] { display: flex; flex-direction: column; gap: 18px; }
.xh-page-dialog::backdrop { background: #0009; }
.xh-page-dialog h2 { margin: 0; font-size: 20px; color: var(--gold, #d9b345); }
.xh-page-dialog-message { overflow-y: auto; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.7; }
.xh-page-dialog-input-label { font-size: 14px; color: var(--muted, #7e8b84); }
.xh-page-dialog-input { width: 100%; box-sizing: border-box; flex-shrink: 0; }
.xh-page-dialog-actions { display: flex; justify-content: flex-end; flex-shrink: 0; gap: 12px; }
.xh-page-dialog :focus-visible { outline: 2px solid var(--green, #79c7a1); outline-offset: 3px; }
.xh-page-dialog [hidden] { display: none !important; }
@media (max-width: 600px) { .xh-page-dialog { padding: 18px; } }