#project-name-dialog {
  width: min(430px, calc(100vw - 2rem));
  padding: 0;
  border: 1px solid var(--pmd-border-strong);
  border-radius: var(--pmd-radius);
  color: var(--pmd-text);
  background: var(--pmd-panel);
  box-shadow: 0 22px 60px rgb(0 0 0 / 65%), 0 0 0 1px rgb(52 120 246 / 18%);
  font: 14px "Segoe UI", system-ui, sans-serif;
  color-scheme: dark;
}

#project-name-dialog::backdrop {
  background: rgb(2 6 12 / 78%);
  backdrop-filter: blur(3px);
}

#project-name-form { padding: 1.25rem; }

#project-name-form label {
  display: grid;
  gap: .65rem;
  color: var(--pmd-text);
  font-weight: 700;
}

#project-name {
  width: 100%;
  padding: .7rem .75rem;
  border: 1px solid var(--pmd-border-strong);
  border-radius: var(--pmd-radius-small);
  outline: none;
  color: var(--pmd-text);
  background: var(--pmd-panel-alt);
  transition: border-color .15s, box-shadow .15s, background .15s;
}

#project-name:focus {
  border-color: var(--pmd-accent);
  background: var(--pmd-panel-soft);
  box-shadow: 0 0 0 3px rgb(52 120 246 / 30%);
}

#project-name-form > div {
  display: flex;
  justify-content: flex-end;
  gap: .7rem;
  margin-top: 1.1rem;
}

#project-name-cancel {
  border-color: var(--pmd-blue);
  background: var(--pmd-blue-hover);
}

#project-name-cancel:hover { background: #1d4f85; }

#project-name-form button[type="submit"] {
  border-color: var(--pmd-accent-hover);
  background: var(--pmd-accent-dark);
}

#project-name-form button[type="submit"]:hover { background: #b45309; }