/* Keep the original compact form layout; give its floating surface a glass finish. */
#publish-dialog {
  width: min(530px, calc(100% - 32px));
  max-height: calc(100dvh - 32px);
  overflow-y: auto;
  border: 1px solid rgba(255, 255, 255, .9);
  border-radius: 20px;
  background:
    radial-gradient(ellipse at 7% 0%, rgba(255, 255, 255, .94), transparent 53%),
    radial-gradient(ellipse at 98% 6%, rgba(175, 209, 255, .26), transparent 38%),
    linear-gradient(145deg, rgba(255, 255, 255, .82), rgba(244, 249, 255, .76));
  -webkit-backdrop-filter: blur(26px) saturate(180%);
  backdrop-filter: blur(26px) saturate(180%);
  box-shadow:
    0 26px 70px rgba(13, 43, 82, .23),
    0 3px 14px rgba(13, 43, 82, .06),
    inset 0 1px 0 rgba(255, 255, 255, .95),
    inset 0 0 0 1px rgba(255, 255, 255, .34);
}

#publish-dialog::backdrop {
  background: rgba(25, 43, 73, .34);
  -webkit-backdrop-filter: blur(5px) saturate(125%);
  backdrop-filter: blur(5px) saturate(125%);
}

#publish-dialog #publish-form { padding: 29px; }

#publish-dialog .dialog-heading {
  align-items: flex-start;
  margin-bottom: 24px;
}

#publish-dialog .dialog-heading .eyebrow {
  margin-bottom: 7px;
  color: #d77208;
  font-size: 11px;
  letter-spacing: .14em;
}

#publish-dialog .dialog-heading h2 {
  color: #173b6d;
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-size: 26px;
  letter-spacing: .015em;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .7);
}

#publish-dialog .close-button {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 1px solid rgba(255, 255, 255, .85);
  border-radius: 50%;
  background: linear-gradient(145deg, rgba(255, 255, 255, .78), rgba(233, 242, 255, .44));
  color: #617b9b;
  font-size: 23px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .95), 0 2px 7px rgba(20, 52, 95, .1);
  cursor: pointer;
  transition: background .2s, border-color .2s, color .2s, box-shadow .2s;
}

#publish-dialog .close-button:hover {
  border-color: rgba(150, 184, 228, .75);
  background: rgba(255, 255, 255, .84);
  color: #1552b7;
  box-shadow: inset 0 1px 0 #fff, 0 3px 9px rgba(20, 52, 95, .13);
}

#publish-dialog label {
  gap: 7px;
  margin-top: 15px;
  color: #365678;
  font-size: 12px;
  font-weight: 700;
}

#publish-dialog label small { color: #9aa8b8; }

#publish-dialog input,
#publish-dialog select,
#publish-dialog textarea {
  border: 1px solid rgba(166, 189, 218, .54);
  border-radius: 10px;
  background: linear-gradient(140deg, rgba(255, 255, 255, .83), rgba(245, 249, 255, .6));
  padding: 11px 12px;
  color: #233e63;
  font-size: 14px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .95), 0 1px 3px rgba(22, 52, 92, .045);
  transition: background .2s, border-color .2s, box-shadow .2s;
}

#publish-dialog input::placeholder,
#publish-dialog textarea::placeholder { color: #a1aebe; }

#publish-dialog input:focus,
#publish-dialog select:focus,
#publish-dialog textarea:focus {
  border-color: #7da5dc;
  background: rgba(255, 255, 255, .95);
  box-shadow: inset 0 1px 0 #fff, 0 0 0 3px rgba(21, 82, 183, .12);
}

#publish-dialog textarea { min-height: 97px; }
#publish-dialog .form-row { gap: 12px; }
#publish-dialog .contact-method-input { grid-template-columns: 82px minmax(0, 1fr); }
#publish-dialog .contact-method-input input { min-width: 0; }

#publish-dialog .form-submit {
  width: 100%;
  margin-top: 22px;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 10px;
  background: linear-gradient(160deg, rgba(255, 180, 81, .98), rgba(250, 133, 15, .95) 55%, rgba(223, 109, 0, .94));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72), 0 8px 18px rgba(224, 112, 0, .2);
  font-size: 13px;
  cursor: pointer;
}

#publish-dialog .form-submit:hover {
  background: linear-gradient(160deg, #ffbb6d, #f58b1c 55%, #df7100);
  transform: translateY(-1px);
}

#publish-dialog .form-submit:disabled { opacity: .65; cursor: wait; transform: none; }
#publish-dialog .form-note { color: #91a0b2; }

@media (max-width: 560px) {
  #publish-dialog #publish-form { padding: 22px; }
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  #publish-dialog { background: #f7faff; }
}

@media (prefers-reduced-transparency: reduce) {
  #publish-dialog { background: #fff; }
  #publish-dialog input,
  #publish-dialog select,
  #publish-dialog textarea { background: #fff; }
}