html, body { margin: 0; background: #f7f8f3; }
dialog { box-sizing: border-box; width: min(92vw, 520px); max-height: 85vh; max-height: 85dvh; overflow-y: auto; padding: 24px; border: 1px solid #b9d7cc; border-radius: 24px; color: #172a2a; background: #f7f8f3; font: 16px/1.5 system-ui,sans-serif; }
dialog::backdrop { background: rgb(0 0 0 / 55%); }
dialog h1 { font-size: 26px; line-height: 1.2; }
dialog h2 { font-size: 18px; margin-top: 24px; }
dialog button { max-width: 100%; margin: 6px 4px 6px 0; padding: 12px 16px; border: 1px solid #116d62; border-radius: 14px; background: #116d62; color: white; font: inherit; cursor: pointer; }
dialog button:disabled { opacity: .6; cursor: wait; }
dialog button:focus-visible { outline: 3px solid #80a62f; outline-offset: 3px; }
@media (prefers-color-scheme: dark) { html,body { background: #091e19; } dialog { background: #102923; color: #e6f2e9; } }