.contact-dialog {
  --contact-form-inset: clamp(1.2rem, 3vw, 2rem);
  box-sizing: border-box;
  width: min(94vw, 620px);
  max-width: calc(100vw - 1rem);
  max-height: calc(100dvh - max(.5rem, env(safe-area-inset-top)) - max(.5rem, env(safe-area-inset-bottom)));
  max-block-size: calc(100dvh - max(.5rem, env(safe-area-inset-top)) - max(.5rem, env(safe-area-inset-bottom)));
  margin-block: max(.5rem, env(safe-area-inset-top)) max(.5rem, env(safe-area-inset-bottom));
  border: 1px solid var(--line-strong);
  background: var(--surface);
  color: var(--ivory);
}
.header-contact { border: 0; background: transparent; cursor: pointer; text-decoration: none; }
.contact-dialog::backdrop { background: rgba(3, 7, 12, .78); backdrop-filter: blur(5px); }
.contact-form {
  box-sizing: border-box;
  display: grid;
  gap: 1rem;
  max-height: inherit;
  max-block-size: inherit;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  scroll-padding-block: 5rem 1rem;
  padding: 0;
}
.contact-form .dialog-head { padding: .75rem var(--contact-form-inset); }
.contact-form .dialog-head h2 { font-size: clamp(1.25rem, 5vw, 1.75rem); }
.contact-form > :not(.dialog-head) { margin-inline: var(--contact-form-inset); }
.contact-form .contact-actions { margin-block-end: var(--contact-form-inset); }
.contact-form label { display: grid; gap: .42rem; color: var(--muted-ivory); font: 700 .76rem/1.3 var(--system); letter-spacing: .06em; text-transform: uppercase; }
.contact-form input, .contact-form textarea { box-sizing: border-box; width: 100%; border: 1px solid var(--line-strong); border-radius: 6px; padding: .8rem; background: rgba(255,255,255,.04); color: var(--ivory); font: 400 1rem/1.45 var(--narrative); letter-spacing: 0; text-transform: none; }
.contact-form input:focus, .contact-form textarea:focus { outline: 2px solid var(--brass); outline-offset: 2px; }
.contact-status { margin: 0; color: var(--muted-ivory); font: 400 .95rem/1.5 var(--narrative); }
.contact-status[data-state="unavailable"] { color: var(--muted-ivory); }
.contact-status[data-state="error"] { color: #e7b6aa; }
.contact-status[data-state="success"] { color: #b9d9bc; }
.contact-notice { margin: 0; color: var(--muted-ivory); font: 400 .86rem/1.55 var(--narrative); }
.contact-notice a { color: var(--ivory); text-decoration-color: var(--brass); text-underline-offset: .2em; }
.contact-notice a:focus-visible { outline: 2px solid var(--brass); outline-offset: 3px; }
.contact-actions { display: flex; justify-content: flex-end; gap: .7rem; }
.contact-actions button, .text-button { border: 0; background: transparent; color: var(--brass); cursor: pointer; font: inherit; text-decoration: underline; text-underline-offset: .2em; }
.contact-actions button[type="submit"] { border: 1px solid var(--brass); border-radius: 5px; padding: .65rem .9rem; text-decoration: none; }
.contact-actions button:disabled { cursor: not-allowed; opacity: .55; }